/*!***********************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!../../node_modules/@mantine/core/styles.css ***!
  \***********************************************************************************************************************************************************************************************************************************************************************************************/
/* ----- CSS reset ----- */
*,
*::before,
*::after {
  box-sizing: border-box;
}

input,
button,
textarea,
select {
  font: inherit;
}

button,
select {
  text-transform: none;
}

/* ----- Global styles ----- */
body {
  margin: 0;
  font-family: var(--mantine-font-family);
  font-size: var(--mantine-font-size-md);
  line-height: var(--mantine-line-height);
  background-color: var(--mantine-color-body);
  color: var(--mantine-color-text);

  -webkit-font-smoothing: var(--mantine-webkit-font-smoothing);
  -moz-osx-font-smoothing: var(--mantine-moz-font-smoothing);
}
@media screen and (max-device-width: 31.25em) {
body {
    -webkit-text-size-adjust: 100%
}
  }

@media (prefers-reduced-motion: reduce) {
    [data-respect-reduced-motion] [data-reduce-motion] {
      transition: none;
      animation: none;
    }
  }

[data-mantine-color-scheme='light'] .mantine-light-hidden {
    display: none;
}

[data-mantine-color-scheme='dark'] .mantine-dark-hidden {
    display: none;
}

.mantine-focus-auto:focus-visible {
    outline: 2px solid var(--mantine-primary-color-filled);
    outline-offset: calc(0.125rem * var(--mantine-scale));
  }

.mantine-focus-always:focus {
    outline: 2px solid var(--mantine-primary-color-filled);
    outline-offset: calc(0.125rem * var(--mantine-scale));
  }

.mantine-focus-never:focus {
    outline: none;
  }

.mantine-active:active {
    transform: translateY(calc(0.0625rem * var(--mantine-scale)));
  }

fieldset:disabled .mantine-active:active {
    transform: none;
  }

:where([dir="rtl"]) .mantine-rotate-rtl {
    transform: rotate(180deg);
}

/* ----- Default CSS variables ----- */

:root {
  color-scheme: var(--mantine-color-scheme);

  --mantine-z-index-app: 100;
  --mantine-z-index-modal: 200;
  --mantine-z-index-popover: 300;
  --mantine-z-index-overlay: 400;
  --mantine-z-index-max: 9999;

  --mantine-scale: 1;
  --mantine-cursor-type: default;
  --mantine-webkit-font-smoothing: antialiased;
  --mantine-color-scheme: light dark;
  --mantine-moz-font-smoothing: grayscale;
  --mantine-color-white: #fff;
  --mantine-color-black: #000;
  --mantine-line-height: 1.55;
  --mantine-font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial,
    sans-serif, Apple Color Emoji, Segoe UI Emoji;
  --mantine-font-family-monospace: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
    Liberation Mono, Courier New, monospace;
  --mantine-font-family-headings: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica,
    Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji;
  --mantine-heading-font-weight: 700;
  --mantine-radius-default: calc(0.25rem * var(--mantine-scale));
  --mantine-primary-color-0: var(--mantine-color-blue-0);
  --mantine-primary-color-1: var(--mantine-color-blue-1);
  --mantine-primary-color-2: var(--mantine-color-blue-2);
  --mantine-primary-color-3: var(--mantine-color-blue-3);
  --mantine-primary-color-4: var(--mantine-color-blue-4);
  --mantine-primary-color-5: var(--mantine-color-blue-5);
  --mantine-primary-color-6: var(--mantine-color-blue-6);
  --mantine-primary-color-7: var(--mantine-color-blue-7);
  --mantine-primary-color-8: var(--mantine-color-blue-8);
  --mantine-primary-color-9: var(--mantine-color-blue-9);
  --mantine-primary-color-filled: var(--mantine-color-blue-filled);
  --mantine-primary-color-filled-hover: var(--mantine-color-blue-filled-hover);
  --mantine-primary-color-light: var(--mantine-color-blue-light);
  --mantine-primary-color-light-hover: var(--mantine-color-blue-light-hover);
  --mantine-primary-color-light-color: var(--mantine-color-blue-light-color);
  --mantine-breakpoint-xs: 36em;
  --mantine-breakpoint-sm: 48em;
  --mantine-breakpoint-md: 62em;
  --mantine-breakpoint-lg: 75em;
  --mantine-breakpoint-xl: 88em;
  --mantine-spacing-xs: calc(0.625rem * var(--mantine-scale));
  --mantine-spacing-sm: calc(0.75rem * var(--mantine-scale));
  --mantine-spacing-md: calc(1rem * var(--mantine-scale));
  --mantine-spacing-lg: calc(1.25rem * var(--mantine-scale));
  --mantine-spacing-xl: calc(2rem * var(--mantine-scale));
  --mantine-font-size-xs: calc(0.75rem * var(--mantine-scale));
  --mantine-font-size-sm: calc(0.875rem * var(--mantine-scale));
  --mantine-font-size-md: calc(1rem * var(--mantine-scale));
  --mantine-font-size-lg: calc(1.125rem * var(--mantine-scale));
  --mantine-font-size-xl: calc(1.25rem * var(--mantine-scale));
  --mantine-line-height-xs: 1.4;
  --mantine-line-height-sm: 1.45;
  --mantine-line-height-md: 1.55;
  --mantine-line-height-lg: 1.6;
  --mantine-line-height-xl: 1.65;
  --mantine-shadow-xs: 0 calc(0.0625rem * var(--mantine-scale))
      calc(0.1875rem * var(--mantine-scale)) rgba(0, 0, 0, 0.05),
    0 calc(0.0625rem * var(--mantine-scale)) calc(0.125rem * var(--mantine-scale))
      rgba(0, 0, 0, 0.1);
  --mantine-shadow-sm: 0 calc(0.0625rem * var(--mantine-scale))
      calc(0.1875rem * var(--mantine-scale)) rgba(0, 0, 0, 0.05),
    rgba(0, 0, 0, 0.05) 0 calc(0.625rem * var(--mantine-scale))
      calc(0.9375rem * var(--mantine-scale)) calc(-0.3125rem * var(--mantine-scale)),
    rgba(0, 0, 0, 0.04) 0 calc(0.4375rem * var(--mantine-scale))
      calc(0.4375rem * var(--mantine-scale)) calc(-0.3125rem * var(--mantine-scale));
  --mantine-shadow-md: 0 calc(0.0625rem * var(--mantine-scale))
      calc(0.1875rem * var(--mantine-scale)) rgba(0, 0, 0, 0.05),
    rgba(0, 0, 0, 0.05) 0 calc(1.25rem * var(--mantine-scale))
      calc(1.5625rem * var(--mantine-scale)) calc(-0.3125rem * var(--mantine-scale)),
    rgba(0, 0, 0, 0.04) 0 calc(0.625rem * var(--mantine-scale))
      calc(0.625rem * var(--mantine-scale)) calc(-0.3125rem * var(--mantine-scale));
  --mantine-shadow-lg: 0 calc(0.0625rem * var(--mantine-scale))
      calc(0.1875rem * var(--mantine-scale)) rgba(0, 0, 0, 0.05),
    rgba(0, 0, 0, 0.05) 0 calc(1.75rem * var(--mantine-scale))
      calc(1.4375rem * var(--mantine-scale)) calc(-0.4375rem * var(--mantine-scale)),
    rgba(0, 0, 0, 0.04) 0 calc(0.75rem * var(--mantine-scale)) calc(0.75rem * var(--mantine-scale))
      calc(-0.4375rem * var(--mantine-scale));
  --mantine-shadow-xl: 0 calc(0.0625rem * var(--mantine-scale))
      calc(0.1875rem * var(--mantine-scale)) rgba(0, 0, 0, 0.05),
    rgba(0, 0, 0, 0.05) 0 calc(2.25rem * var(--mantine-scale)) calc(1.75rem * var(--mantine-scale))
      calc(-0.4375rem * var(--mantine-scale)),
    rgba(0, 0, 0, 0.04) 0 calc(1.0625rem * var(--mantine-scale))
      calc(1.0625rem * var(--mantine-scale)) calc(-0.4375rem * var(--mantine-scale));
  --mantine-radius-xs: calc(0.125rem * var(--mantine-scale));
  --mantine-radius-sm: calc(0.25rem * var(--mantine-scale));
  --mantine-radius-md: calc(0.5rem * var(--mantine-scale));
  --mantine-radius-lg: calc(1rem * var(--mantine-scale));
  --mantine-radius-xl: calc(2rem * var(--mantine-scale));
  --mantine-color-dark-0: #c9c9c9;
  --mantine-color-dark-1: #b8b8b8;
  --mantine-color-dark-2: #828282;
  --mantine-color-dark-3: #696969;
  --mantine-color-dark-4: #424242;
  --mantine-color-dark-5: #3b3b3b;
  --mantine-color-dark-6: #2e2e2e;
  --mantine-color-dark-7: #242424;
  --mantine-color-dark-8: #1f1f1f;
  --mantine-color-dark-9: #141414;
  --mantine-color-gray-0: #f8f9fa;
  --mantine-color-gray-1: #f1f3f5;
  --mantine-color-gray-2: #e9ecef;
  --mantine-color-gray-3: #dee2e6;
  --mantine-color-gray-4: #ced4da;
  --mantine-color-gray-5: #adb5bd;
  --mantine-color-gray-6: #868e96;
  --mantine-color-gray-7: #495057;
  --mantine-color-gray-8: #343a40;
  --mantine-color-gray-9: #212529;
  --mantine-color-red-0: #fff5f5;
  --mantine-color-red-1: #ffe3e3;
  --mantine-color-red-2: #ffc9c9;
  --mantine-color-red-3: #ffa8a8;
  --mantine-color-red-4: #ff8787;
  --mantine-color-red-5: #ff6b6b;
  --mantine-color-red-6: #fa5252;
  --mantine-color-red-7: #f03e3e;
  --mantine-color-red-8: #e03131;
  --mantine-color-red-9: #c92a2a;
  --mantine-color-pink-0: #fff0f6;
  --mantine-color-pink-1: #ffdeeb;
  --mantine-color-pink-2: #fcc2d7;
  --mantine-color-pink-3: #faa2c1;
  --mantine-color-pink-4: #f783ac;
  --mantine-color-pink-5: #f06595;
  --mantine-color-pink-6: #e64980;
  --mantine-color-pink-7: #d6336c;
  --mantine-color-pink-8: #c2255c;
  --mantine-color-pink-9: #a61e4d;
  --mantine-color-grape-0: #f8f0fc;
  --mantine-color-grape-1: #f3d9fa;
  --mantine-color-grape-2: #eebefa;
  --mantine-color-grape-3: #e599f7;
  --mantine-color-grape-4: #da77f2;
  --mantine-color-grape-5: #cc5de8;
  --mantine-color-grape-6: #be4bdb;
  --mantine-color-grape-7: #ae3ec9;
  --mantine-color-grape-8: #9c36b5;
  --mantine-color-grape-9: #862e9c;
  --mantine-color-violet-0: #f3f0ff;
  --mantine-color-violet-1: #e5dbff;
  --mantine-color-violet-2: #d0bfff;
  --mantine-color-violet-3: #b197fc;
  --mantine-color-violet-4: #9775fa;
  --mantine-color-violet-5: #845ef7;
  --mantine-color-violet-6: #7950f2;
  --mantine-color-violet-7: #7048e8;
  --mantine-color-violet-8: #6741d9;
  --mantine-color-violet-9: #5f3dc4;
  --mantine-color-indigo-0: #edf2ff;
  --mantine-color-indigo-1: #dbe4ff;
  --mantine-color-indigo-2: #bac8ff;
  --mantine-color-indigo-3: #91a7ff;
  --mantine-color-indigo-4: #748ffc;
  --mantine-color-indigo-5: #5c7cfa;
  --mantine-color-indigo-6: #4c6ef5;
  --mantine-color-indigo-7: #4263eb;
  --mantine-color-indigo-8: #3b5bdb;
  --mantine-color-indigo-9: #364fc7;
  --mantine-color-blue-0: #e7f5ff;
  --mantine-color-blue-1: #d0ebff;
  --mantine-color-blue-2: #a5d8ff;
  --mantine-color-blue-3: #74c0fc;
  --mantine-color-blue-4: #4dabf7;
  --mantine-color-blue-5: #339af0;
  --mantine-color-blue-6: #228be6;
  --mantine-color-blue-7: #1c7ed6;
  --mantine-color-blue-8: #1971c2;
  --mantine-color-blue-9: #1864ab;
  --mantine-color-cyan-0: #e3fafc;
  --mantine-color-cyan-1: #c5f6fa;
  --mantine-color-cyan-2: #99e9f2;
  --mantine-color-cyan-3: #66d9e8;
  --mantine-color-cyan-4: #3bc9db;
  --mantine-color-cyan-5: #22b8cf;
  --mantine-color-cyan-6: #15aabf;
  --mantine-color-cyan-7: #1098ad;
  --mantine-color-cyan-8: #0c8599;
  --mantine-color-cyan-9: #0b7285;
  --mantine-color-teal-0: #e6fcf5;
  --mantine-color-teal-1: #c3fae8;
  --mantine-color-teal-2: #96f2d7;
  --mantine-color-teal-3: #63e6be;
  --mantine-color-teal-4: #38d9a9;
  --mantine-color-teal-5: #20c997;
  --mantine-color-teal-6: #12b886;
  --mantine-color-teal-7: #0ca678;
  --mantine-color-teal-8: #099268;
  --mantine-color-teal-9: #087f5b;
  --mantine-color-green-0: #ebfbee;
  --mantine-color-green-1: #d3f9d8;
  --mantine-color-green-2: #b2f2bb;
  --mantine-color-green-3: #8ce99a;
  --mantine-color-green-4: #69db7c;
  --mantine-color-green-5: #51cf66;
  --mantine-color-green-6: #40c057;
  --mantine-color-green-7: #37b24d;
  --mantine-color-green-8: #2f9e44;
  --mantine-color-green-9: #2b8a3e;
  --mantine-color-lime-0: #f4fce3;
  --mantine-color-lime-1: #e9fac8;
  --mantine-color-lime-2: #d8f5a2;
  --mantine-color-lime-3: #c0eb75;
  --mantine-color-lime-4: #a9e34b;
  --mantine-color-lime-5: #94d82d;
  --mantine-color-lime-6: #82c91e;
  --mantine-color-lime-7: #74b816;
  --mantine-color-lime-8: #66a80f;
  --mantine-color-lime-9: #5c940d;
  --mantine-color-yellow-0: #fff9db;
  --mantine-color-yellow-1: #fff3bf;
  --mantine-color-yellow-2: #ffec99;
  --mantine-color-yellow-3: #ffe066;
  --mantine-color-yellow-4: #ffd43b;
  --mantine-color-yellow-5: #fcc419;
  --mantine-color-yellow-6: #fab005;
  --mantine-color-yellow-7: #f59f00;
  --mantine-color-yellow-8: #f08c00;
  --mantine-color-yellow-9: #e67700;
  --mantine-color-orange-0: #fff4e6;
  --mantine-color-orange-1: #ffe8cc;
  --mantine-color-orange-2: #ffd8a8;
  --mantine-color-orange-3: #ffc078;
  --mantine-color-orange-4: #ffa94d;
  --mantine-color-orange-5: #ff922b;
  --mantine-color-orange-6: #fd7e14;
  --mantine-color-orange-7: #f76707;
  --mantine-color-orange-8: #e8590c;
  --mantine-color-orange-9: #d9480f;
  --mantine-h1-font-size: calc(2.125rem * var(--mantine-scale));
  --mantine-h1-line-height: 1.3;
  --mantine-h1-font-weight: 700;
  --mantine-h2-font-size: calc(1.625rem * var(--mantine-scale));
  --mantine-h2-line-height: 1.35;
  --mantine-h2-font-weight: 700;
  --mantine-h3-font-size: calc(1.375rem * var(--mantine-scale));
  --mantine-h3-line-height: 1.4;
  --mantine-h3-font-weight: 700;
  --mantine-h4-font-size: calc(1.125rem * var(--mantine-scale));
  --mantine-h4-line-height: 1.45;
  --mantine-h4-font-weight: 700;
  --mantine-h5-font-size: calc(1rem * var(--mantine-scale));
  --mantine-h5-line-height: 1.5;
  --mantine-h5-font-weight: 700;
  --mantine-h6-font-size: calc(0.875rem * var(--mantine-scale));
  --mantine-h6-line-height: 1.5;
  --mantine-h6-font-weight: 700;
}

:root[data-mantine-color-scheme='dark'] {
  --mantine-color-scheme: dark;
  --mantine-primary-color-contrast: var(--mantine-color-white);
  --mantine-color-bright: var(--mantine-color-white);
  --mantine-color-text: var(--mantine-color-dark-0);
  --mantine-color-body: var(--mantine-color-dark-7);
  --mantine-color-error: var(--mantine-color-red-8);
  --mantine-color-placeholder: var(--mantine-color-dark-3);
  --mantine-color-anchor: var(--mantine-color-blue-4);
  --mantine-color-default: var(--mantine-color-dark-6);
  --mantine-color-default-hover: var(--mantine-color-dark-5);
  --mantine-color-default-color: var(--mantine-color-white);
  --mantine-color-default-border: var(--mantine-color-dark-4);
  --mantine-color-dimmed: var(--mantine-color-dark-2);
  --mantine-color-dark-text: var(--mantine-color-dark-4);
  --mantine-color-dark-filled: var(--mantine-color-dark-8);
  --mantine-color-dark-filled-hover: var(--mantine-color-dark-7);
  --mantine-color-dark-light: rgba(36, 36, 36, 0.15);
  --mantine-color-dark-light-hover: rgba(36, 36, 36, 0.2);
  --mantine-color-dark-light-color: var(--mantine-color-dark-3);
  --mantine-color-dark-outline: var(--mantine-color-dark-4);
  --mantine-color-dark-outline-hover: rgba(36, 36, 36, 0.05);
  --mantine-color-gray-text: var(--mantine-color-gray-4);
  --mantine-color-gray-filled: var(--mantine-color-gray-8);
  --mantine-color-gray-filled-hover: var(--mantine-color-gray-9);
  --mantine-color-gray-light: rgba(134, 142, 150, 0.15);
  --mantine-color-gray-light-hover: rgba(134, 142, 150, 0.2);
  --mantine-color-gray-light-color: var(--mantine-color-gray-3);
  --mantine-color-gray-outline: var(--mantine-color-gray-4);
  --mantine-color-gray-outline-hover: rgba(206, 212, 218, 0.05);
  --mantine-color-red-text: var(--mantine-color-red-4);
  --mantine-color-red-filled: var(--mantine-color-red-8);
  --mantine-color-red-filled-hover: var(--mantine-color-red-9);
  --mantine-color-red-light: rgba(250, 82, 82, 0.15);
  --mantine-color-red-light-hover: rgba(250, 82, 82, 0.2);
  --mantine-color-red-light-color: var(--mantine-color-red-3);
  --mantine-color-red-outline: var(--mantine-color-red-4);
  --mantine-color-red-outline-hover: rgba(255, 135, 135, 0.05);
  --mantine-color-pink-text: var(--mantine-color-pink-4);
  --mantine-color-pink-filled: var(--mantine-color-pink-8);
  --mantine-color-pink-filled-hover: var(--mantine-color-pink-9);
  --mantine-color-pink-light: rgba(230, 73, 128, 0.15);
  --mantine-color-pink-light-hover: rgba(230, 73, 128, 0.2);
  --mantine-color-pink-light-color: var(--mantine-color-pink-3);
  --mantine-color-pink-outline: var(--mantine-color-pink-4);
  --mantine-color-pink-outline-hover: rgba(247, 131, 172, 0.05);
  --mantine-color-grape-text: var(--mantine-color-grape-4);
  --mantine-color-grape-filled: var(--mantine-color-grape-8);
  --mantine-color-grape-filled-hover: var(--mantine-color-grape-9);
  --mantine-color-grape-light: rgba(190, 75, 219, 0.15);
  --mantine-color-grape-light-hover: rgba(190, 75, 219, 0.2);
  --mantine-color-grape-light-color: var(--mantine-color-grape-3);
  --mantine-color-grape-outline: var(--mantine-color-grape-4);
  --mantine-color-grape-outline-hover: rgba(218, 119, 242, 0.05);
  --mantine-color-violet-text: var(--mantine-color-violet-4);
  --mantine-color-violet-filled: var(--mantine-color-violet-8);
  --mantine-color-violet-filled-hover: var(--mantine-color-violet-9);
  --mantine-color-violet-light: rgba(121, 80, 242, 0.15);
  --mantine-color-violet-light-hover: rgba(121, 80, 242, 0.2);
  --mantine-color-violet-light-color: var(--mantine-color-violet-3);
  --mantine-color-violet-outline: var(--mantine-color-violet-4);
  --mantine-color-violet-outline-hover: rgba(151, 117, 250, 0.05);
  --mantine-color-indigo-text: var(--mantine-color-indigo-4);
  --mantine-color-indigo-filled: var(--mantine-color-indigo-8);
  --mantine-color-indigo-filled-hover: var(--mantine-color-indigo-9);
  --mantine-color-indigo-light: rgba(76, 110, 245, 0.15);
  --mantine-color-indigo-light-hover: rgba(76, 110, 245, 0.2);
  --mantine-color-indigo-light-color: var(--mantine-color-indigo-3);
  --mantine-color-indigo-outline: var(--mantine-color-indigo-4);
  --mantine-color-indigo-outline-hover: rgba(116, 143, 252, 0.05);
  --mantine-color-blue-text: var(--mantine-color-blue-4);
  --mantine-color-blue-filled: var(--mantine-color-blue-8);
  --mantine-color-blue-filled-hover: var(--mantine-color-blue-9);
  --mantine-color-blue-light: rgba(34, 139, 230, 0.15);
  --mantine-color-blue-light-hover: rgba(34, 139, 230, 0.2);
  --mantine-color-blue-light-color: var(--mantine-color-blue-3);
  --mantine-color-blue-outline: var(--mantine-color-blue-4);
  --mantine-color-blue-outline-hover: rgba(77, 171, 247, 0.05);
  --mantine-color-cyan-text: var(--mantine-color-cyan-4);
  --mantine-color-cyan-filled: var(--mantine-color-cyan-8);
  --mantine-color-cyan-filled-hover: var(--mantine-color-cyan-9);
  --mantine-color-cyan-light: rgba(21, 170, 191, 0.15);
  --mantine-color-cyan-light-hover: rgba(21, 170, 191, 0.2);
  --mantine-color-cyan-light-color: var(--mantine-color-cyan-3);
  --mantine-color-cyan-outline: var(--mantine-color-cyan-4);
  --mantine-color-cyan-outline-hover: rgba(59, 201, 219, 0.05);
  --mantine-color-teal-text: var(--mantine-color-teal-4);
  --mantine-color-teal-filled: var(--mantine-color-teal-8);
  --mantine-color-teal-filled-hover: var(--mantine-color-teal-9);
  --mantine-color-teal-light: rgba(18, 184, 134, 0.15);
  --mantine-color-teal-light-hover: rgba(18, 184, 134, 0.2);
  --mantine-color-teal-light-color: var(--mantine-color-teal-3);
  --mantine-color-teal-outline: var(--mantine-color-teal-4);
  --mantine-color-teal-outline-hover: rgba(56, 217, 169, 0.05);
  --mantine-color-green-text: var(--mantine-color-green-4);
  --mantine-color-green-filled: var(--mantine-color-green-8);
  --mantine-color-green-filled-hover: var(--mantine-color-green-9);
  --mantine-color-green-light: rgba(64, 192, 87, 0.15);
  --mantine-color-green-light-hover: rgba(64, 192, 87, 0.2);
  --mantine-color-green-light-color: var(--mantine-color-green-3);
  --mantine-color-green-outline: var(--mantine-color-green-4);
  --mantine-color-green-outline-hover: rgba(105, 219, 124, 0.05);
  --mantine-color-lime-text: var(--mantine-color-lime-4);
  --mantine-color-lime-filled: var(--mantine-color-lime-8);
  --mantine-color-lime-filled-hover: var(--mantine-color-lime-9);
  --mantine-color-lime-light: rgba(130, 201, 30, 0.15);
  --mantine-color-lime-light-hover: rgba(130, 201, 30, 0.2);
  --mantine-color-lime-light-color: var(--mantine-color-lime-3);
  --mantine-color-lime-outline: var(--mantine-color-lime-4);
  --mantine-color-lime-outline-hover: rgba(169, 227, 75, 0.05);
  --mantine-color-yellow-text: var(--mantine-color-yellow-4);
  --mantine-color-yellow-filled: var(--mantine-color-yellow-8);
  --mantine-color-yellow-filled-hover: var(--mantine-color-yellow-9);
  --mantine-color-yellow-light: rgba(250, 176, 5, 0.15);
  --mantine-color-yellow-light-hover: rgba(250, 176, 5, 0.2);
  --mantine-color-yellow-light-color: var(--mantine-color-yellow-3);
  --mantine-color-yellow-outline: var(--mantine-color-yellow-4);
  --mantine-color-yellow-outline-hover: rgba(255, 212, 59, 0.05);
  --mantine-color-orange-text: var(--mantine-color-orange-4);
  --mantine-color-orange-filled: var(--mantine-color-orange-8);
  --mantine-color-orange-filled-hover: var(--mantine-color-orange-9);
  --mantine-color-orange-light: rgba(253, 126, 20, 0.15);
  --mantine-color-orange-light-hover: rgba(253, 126, 20, 0.2);
  --mantine-color-orange-light-color: var(--mantine-color-orange-3);
  --mantine-color-orange-outline: var(--mantine-color-orange-4);
  --mantine-color-orange-outline-hover: rgba(255, 169, 77, 0.05);
}

:root[data-mantine-color-scheme='light'] {
  --mantine-color-scheme: light;
  --mantine-color-bright: var(--mantine-color-black);
  --mantine-color-text: var(--mantine-color-black);
  --mantine-color-body: var(--mantine-color-white);
  --mantine-primary-color-contrast: var(--mantine-color-white);
  --mantine-color-error: var(--mantine-color-red-6);
  --mantine-color-placeholder: var(--mantine-color-gray-5);
  --mantine-color-anchor: var(--mantine-primary-color-filled);
  --mantine-color-default: var(--mantine-color-white);
  --mantine-color-default-hover: var(--mantine-color-gray-0);
  --mantine-color-default-color: var(--mantine-color-gray-9);
  --mantine-color-default-border: var(--mantine-color-gray-4);
  --mantine-color-dimmed: var(--mantine-color-gray-6);
  --mantine-color-dark-text: var(--mantine-color-dark-filled);
  --mantine-color-dark-filled: var(--mantine-color-dark-6);
  --mantine-color-dark-filled-hover: var(--mantine-color-dark-7);
  --mantine-color-dark-light: rgba(56, 56, 56, 0.1);
  --mantine-color-dark-light-hover: rgba(56, 56, 56, 0.12);
  --mantine-color-dark-light-color: var(--mantine-color-dark-6);
  --mantine-color-dark-outline: var(--mantine-color-dark-6);
  --mantine-color-dark-outline-hover: rgba(56, 56, 56, 0.05);
  --mantine-color-gray-text: var(--mantine-color-gray-filled);
  --mantine-color-gray-filled: var(--mantine-color-gray-6);
  --mantine-color-gray-filled-hover: var(--mantine-color-gray-7);
  --mantine-color-gray-light: rgba(134, 142, 150, 0.1);
  --mantine-color-gray-light-hover: rgba(134, 142, 150, 0.12);
  --mantine-color-gray-light-color: var(--mantine-color-gray-6);
  --mantine-color-gray-outline: var(--mantine-color-gray-6);
  --mantine-color-gray-outline-hover: rgba(134, 142, 150, 0.05);
  --mantine-color-red-text: var(--mantine-color-red-filled);
  --mantine-color-red-filled: var(--mantine-color-red-6);
  --mantine-color-red-filled-hover: var(--mantine-color-red-7);
  --mantine-color-red-light: rgba(250, 82, 82, 0.1);
  --mantine-color-red-light-hover: rgba(250, 82, 82, 0.12);
  --mantine-color-red-light-color: var(--mantine-color-red-6);
  --mantine-color-red-outline: var(--mantine-color-red-6);
  --mantine-color-red-outline-hover: rgba(250, 82, 82, 0.05);
  --mantine-color-pink-text: var(--mantine-color-pink-filled);
  --mantine-color-pink-filled: var(--mantine-color-pink-6);
  --mantine-color-pink-filled-hover: var(--mantine-color-pink-7);
  --mantine-color-pink-light: rgba(230, 73, 128, 0.1);
  --mantine-color-pink-light-hover: rgba(230, 73, 128, 0.12);
  --mantine-color-pink-light-color: var(--mantine-color-pink-6);
  --mantine-color-pink-outline: var(--mantine-color-pink-6);
  --mantine-color-pink-outline-hover: rgba(230, 73, 128, 0.05);
  --mantine-color-grape-text: var(--mantine-color-grape-filled);
  --mantine-color-grape-filled: var(--mantine-color-grape-6);
  --mantine-color-grape-filled-hover: var(--mantine-color-grape-7);
  --mantine-color-grape-light: rgba(190, 75, 219, 0.1);
  --mantine-color-grape-light-hover: rgba(190, 75, 219, 0.12);
  --mantine-color-grape-light-color: var(--mantine-color-grape-6);
  --mantine-color-grape-outline: var(--mantine-color-grape-6);
  --mantine-color-grape-outline-hover: rgba(190, 75, 219, 0.05);
  --mantine-color-violet-text: var(--mantine-color-violet-filled);
  --mantine-color-violet-filled: var(--mantine-color-violet-6);
  --mantine-color-violet-filled-hover: var(--mantine-color-violet-7);
  --mantine-color-violet-light: rgba(121, 80, 242, 0.1);
  --mantine-color-violet-light-hover: rgba(121, 80, 242, 0.12);
  --mantine-color-violet-light-color: var(--mantine-color-violet-6);
  --mantine-color-violet-outline: var(--mantine-color-violet-6);
  --mantine-color-violet-outline-hover: rgba(121, 80, 242, 0.05);
  --mantine-color-indigo-text: var(--mantine-color-indigo-filled);
  --mantine-color-indigo-filled: var(--mantine-color-indigo-6);
  --mantine-color-indigo-filled-hover: var(--mantine-color-indigo-7);
  --mantine-color-indigo-light: rgba(76, 110, 245, 0.1);
  --mantine-color-indigo-light-hover: rgba(76, 110, 245, 0.12);
  --mantine-color-indigo-light-color: var(--mantine-color-indigo-6);
  --mantine-color-indigo-outline: var(--mantine-color-indigo-6);
  --mantine-color-indigo-outline-hover: rgba(76, 110, 245, 0.05);
  --mantine-color-blue-text: var(--mantine-color-blue-filled);
  --mantine-color-blue-filled: var(--mantine-color-blue-6);
  --mantine-color-blue-filled-hover: var(--mantine-color-blue-7);
  --mantine-color-blue-light: rgba(34, 139, 230, 0.1);
  --mantine-color-blue-light-hover: rgba(34, 139, 230, 0.12);
  --mantine-color-blue-light-color: var(--mantine-color-blue-6);
  --mantine-color-blue-outline: var(--mantine-color-blue-6);
  --mantine-color-blue-outline-hover: rgba(34, 139, 230, 0.05);
  --mantine-color-cyan-text: var(--mantine-color-cyan-filled);
  --mantine-color-cyan-filled: var(--mantine-color-cyan-6);
  --mantine-color-cyan-filled-hover: var(--mantine-color-cyan-7);
  --mantine-color-cyan-light: rgba(21, 170, 191, 0.1);
  --mantine-color-cyan-light-hover: rgba(21, 170, 191, 0.12);
  --mantine-color-cyan-light-color: var(--mantine-color-cyan-6);
  --mantine-color-cyan-outline: var(--mantine-color-cyan-6);
  --mantine-color-cyan-outline-hover: rgba(21, 170, 191, 0.05);
  --mantine-color-teal-text: var(--mantine-color-teal-filled);
  --mantine-color-teal-filled: var(--mantine-color-teal-6);
  --mantine-color-teal-filled-hover: var(--mantine-color-teal-7);
  --mantine-color-teal-light: rgba(18, 184, 134, 0.1);
  --mantine-color-teal-light-hover: rgba(18, 184, 134, 0.12);
  --mantine-color-teal-light-color: var(--mantine-color-teal-6);
  --mantine-color-teal-outline: var(--mantine-color-teal-6);
  --mantine-color-teal-outline-hover: rgba(18, 184, 134, 0.05);
  --mantine-color-green-text: var(--mantine-color-green-filled);
  --mantine-color-green-filled: var(--mantine-color-green-6);
  --mantine-color-green-filled-hover: var(--mantine-color-green-7);
  --mantine-color-green-light: rgba(64, 192, 87, 0.1);
  --mantine-color-green-light-hover: rgba(64, 192, 87, 0.12);
  --mantine-color-green-light-color: var(--mantine-color-green-6);
  --mantine-color-green-outline: var(--mantine-color-green-6);
  --mantine-color-green-outline-hover: rgba(64, 192, 87, 0.05);
  --mantine-color-lime-text: var(--mantine-color-lime-filled);
  --mantine-color-lime-filled: var(--mantine-color-lime-6);
  --mantine-color-lime-filled-hover: var(--mantine-color-lime-7);
  --mantine-color-lime-light: rgba(130, 201, 30, 0.1);
  --mantine-color-lime-light-hover: rgba(130, 201, 30, 0.12);
  --mantine-color-lime-light-color: var(--mantine-color-lime-6);
  --mantine-color-lime-outline: var(--mantine-color-lime-6);
  --mantine-color-lime-outline-hover: rgba(130, 201, 30, 0.05);
  --mantine-color-yellow-text: var(--mantine-color-yellow-filled);
  --mantine-color-yellow-filled: var(--mantine-color-yellow-6);
  --mantine-color-yellow-filled-hover: var(--mantine-color-yellow-7);
  --mantine-color-yellow-light: rgba(250, 176, 5, 0.1);
  --mantine-color-yellow-light-hover: rgba(250, 176, 5, 0.12);
  --mantine-color-yellow-light-color: var(--mantine-color-yellow-6);
  --mantine-color-yellow-outline: var(--mantine-color-yellow-6);
  --mantine-color-yellow-outline-hover: rgba(250, 176, 5, 0.05);
  --mantine-color-orange-text: var(--mantine-color-orange-filled);
  --mantine-color-orange-filled: var(--mantine-color-orange-6);
  --mantine-color-orange-filled-hover: var(--mantine-color-orange-7);
  --mantine-color-orange-light: rgba(253, 126, 20, 0.1);
  --mantine-color-orange-light-hover: rgba(253, 126, 20, 0.12);
  --mantine-color-orange-light-color: var(--mantine-color-orange-6);
  --mantine-color-orange-outline: var(--mantine-color-orange-6);
  --mantine-color-orange-outline-hover: rgba(253, 126, 20, 0.05);
}

.m_d57069b5 {
  --scrollarea-scrollbar-size: calc(0.75rem * var(--mantine-scale));

  position: relative;
  overflow: hidden;
}

.m_c0783ff9 {
  scrollbar-width: none;
  overscroll-behavior: var(--scrollarea-over-scroll-behavior);
  -ms-overflow-style: none;
  -webkit-overflow-scrolling: touch;
  width: 100%;
  height: 100%;
}

.m_c0783ff9::-webkit-scrollbar {
    display: none;
  }

.m_c0783ff9:where([data-scrollbars='xy'], [data-scrollbars='y']):where(
        [data-offset-scrollbars='xy'],
        [data-offset-scrollbars='y'],
        [data-offset-scrollbars='present']
      ):where([data-vertical-hidden]) {
        -webkit-padding-end: 0;
                padding-inline-end: 0;
        -webkit-padding-start: 0;
                padding-inline-start: 0;
      }

.m_c0783ff9:where([data-scrollbars='xy'], [data-scrollbars='y']):where(
        [data-offset-scrollbars='xy'],
        [data-offset-scrollbars='y'],
        [data-offset-scrollbars='present']
      ):not([data-vertical-hidden]) {
        -webkit-padding-end: var(--scrollarea-scrollbar-size);
                padding-inline-end: var(--scrollarea-scrollbar-size);
        -webkit-padding-start: unset;
                padding-inline-start: unset;
      }

.m_c0783ff9:where([data-scrollbars='xy'], [data-scrollbars='x']):where(
        [data-offset-scrollbars='xy'],
        [data-offset-scrollbars='x'],
        [data-offset-scrollbars='present']
      ):where([data-horizontal-hidden]) {
        padding-bottom: 0;
      }

.m_c0783ff9:where([data-scrollbars='xy'], [data-scrollbars='x']):where(
        [data-offset-scrollbars='xy'],
        [data-offset-scrollbars='x'],
        [data-offset-scrollbars='present']
      ):not([data-horizontal-hidden]) {
        padding-bottom: var(--scrollarea-scrollbar-size);
      }

.m_f8f631dd {
  min-width: 100%;
  display: table;
}

.m_c44ba933 {
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  touch-action: none;
  box-sizing: border-box;
  transition:
    background-color 150ms ease,
    opacity 150ms ease;

  padding: calc(var(--scrollarea-scrollbar-size) / 5);
  display: flex;
  background-color: transparent;
  flex-direction: row;
}

@media (hover: hover) {
    :where([data-mantine-color-scheme='light']) .m_c44ba933:hover {
      background-color: var(--mantine-color-gray-0);
  }

      :where([data-mantine-color-scheme='light']) .m_c44ba933:hover > .m_d8b5e363 {
        background-color: rgba(0, 0, 0, 0.5);
      }

    :where([data-mantine-color-scheme='dark']) .m_c44ba933:hover {
      background-color: var(--mantine-color-dark-8);
  }

      :where([data-mantine-color-scheme='dark']) .m_c44ba933:hover > .m_d8b5e363 {
        background-color: rgba(255, 255, 255, 0.5);
      }
}

@media (hover: none) {
    :where([data-mantine-color-scheme='light']) .m_c44ba933:active {
      background-color: var(--mantine-color-gray-0);
  }

      :where([data-mantine-color-scheme='light']) .m_c44ba933:active > .m_d8b5e363 {
        background-color: rgba(0, 0, 0, 0.5);
      }

    :where([data-mantine-color-scheme='dark']) .m_c44ba933:active {
      background-color: var(--mantine-color-dark-8);
  }

      :where([data-mantine-color-scheme='dark']) .m_c44ba933:active > .m_d8b5e363 {
        background-color: rgba(255, 255, 255, 0.5);
      }
}

.m_c44ba933:where([data-hidden], [data-state='hidden']) {
    display: none;
  }

.m_c44ba933:where([data-orientation='vertical']) {
    width: var(--scrollarea-scrollbar-size);
    top: 0;
    bottom: var(--sa-corner-width);
    inset-inline-end: 0;
  }

.m_c44ba933:where([data-orientation='horizontal']) {
    height: var(--scrollarea-scrollbar-size);
    flex-direction: column;
    bottom: 0;
    inset-inline-start: 0;
    inset-inline-end: var(--sa-corner-width);
  }

.m_d8b5e363 {
  flex: 1 1;
  border-radius: var(--scrollarea-scrollbar-size);
  position: relative;
  transition: background-color 150ms ease;
  overflow: hidden;
  opacity: var(--thumb-opacity);
}

.m_d8b5e363::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    min-width: calc(2.75rem * var(--mantine-scale));
    min-height: calc(2.75rem * var(--mantine-scale));
  }

:where([data-mantine-color-scheme='light']) .m_d8b5e363 {
    background-color: rgba(0, 0, 0, 0.4);
}

:where([data-mantine-color-scheme='dark']) .m_d8b5e363 {
    background-color: rgba(255, 255, 255, 0.4);
}

.m_21657268 {
  position: absolute;
  opacity: 0;
  transition: opacity 150ms ease;
  display: block;
  inset-inline-end: 0;
  bottom: 0;
}

:where([data-mantine-color-scheme='light']) .m_21657268 {
    background-color: var(--mantine-color-gray-0);
}

:where([data-mantine-color-scheme='dark']) .m_21657268 {
    background-color: var(--mantine-color-dark-8);
}

.m_21657268:where([data-hovered]) {
    opacity: 1;
  }

.m_21657268:where([data-hidden]) {
    display: none;
  }

.m_87cf2631 {
  background-color: transparent;
  cursor: pointer;
  border: 0;
  padding: 0;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  font-size: var(--mantine-font-size-md);
  text-align: left;
  text-decoration: none;
  color: inherit;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

  :where([dir="rtl"]) .m_87cf2631 {
    text-align: right;
}

.m_515a97f8 {
  border: 0;
  clip: rect(0 0 0 0);
  height: calc(0.0625rem * var(--mantine-scale));
  width: calc(0.0625rem * var(--mantine-scale));
  margin: calc(-0.0625rem * var(--mantine-scale));
  overflow: hidden;
  padding: 0;
  position: absolute;
  white-space: nowrap;
}

.m_1b7284a3 {
  --paper-radius: var(--mantine-radius-default);

  outline: 0;
  -webkit-tap-highlight-color: transparent;
  display: block;
  touch-action: manipulation;
  text-decoration: none;
  border-radius: var(--paper-radius);
  box-shadow: var(--paper-shadow);
  background-color: var(--mantine-color-body);
}

  [data-mantine-color-scheme='light'] .m_1b7284a3 {
    --paper-border-color: var(--mantine-color-gray-3);
}

  [data-mantine-color-scheme='dark'] .m_1b7284a3 {
    --paper-border-color: var(--mantine-color-dark-4);
}

  .m_1b7284a3:where([data-with-border]) {
    border: calc(0.0625rem * var(--mantine-scale)) solid var(--paper-border-color);
  }

.m_9814e45f {
  inset: 0;
  position: absolute;
  background: var(--overlay-bg, rgba(0, 0, 0, 0.6));
  -webkit-backdrop-filter: var(--overlay-filter);
  backdrop-filter: var(--overlay-filter);
  border-radius: var(--overlay-radius, 0);
  z-index: var(--overlay-z-index);
}

  .m_9814e45f:where([data-fixed]) {
    position: fixed;
  }

  .m_9814e45f:where([data-center]) {
    display: flex;
    align-items: center;
    justify-content: center;
  }

.m_38a85659 {
  position: absolute;
  border: 1px solid var(--popover-border-color);
  padding: var(--mantine-spacing-sm) var(--mantine-spacing-md);
  box-shadow: var(--popover-shadow, none);
  border-radius: var(--popover-radius, var(--mantine-radius-default));
}

  .m_38a85659:where([data-fixed]) {
    position: fixed;
  }

  .m_38a85659:focus {
    outline: none;
  }

  :where([data-mantine-color-scheme='light']) .m_38a85659 {
    --popover-border-color: var(--mantine-color-gray-2);
    background-color: var(--mantine-color-white);
}

  :where([data-mantine-color-scheme='dark']) .m_38a85659 {
    --popover-border-color: var(--mantine-color-dark-4);
    background-color: var(--mantine-color-dark-6);
}

.m_a31dc6c1 {
  background-color: inherit;
  border: 1px solid var(--popover-border-color);
  z-index: 1;
}

.m_3d7bc908 {
  position: fixed;
  inset: 0;
}

.m_5ae2e3c {
  --loader-size-xs: calc(1.125rem * var(--mantine-scale));
  --loader-size-sm: calc(1.375rem * var(--mantine-scale));
  --loader-size-md: calc(2.25rem * var(--mantine-scale));
  --loader-size-lg: calc(2.75rem * var(--mantine-scale));
  --loader-size-xl: calc(3.625rem * var(--mantine-scale));
  --loader-size: var(--loader-size-md);
  --loader-color: var(--mantine-primary-color-filled);
}

/* ----- Bars loader ----- */
@keyframes m_5d2b3b9d {
  0% {
    transform: scale(0.6);
    opacity: 0;
  }

  50%,
  100% {
    transform: scale(1);
  }
}

.m_7a2bd4cd {
  position: relative;
  width: var(--loader-size);
  height: var(--loader-size);
  display: flex;
  gap: calc(var(--loader-size) / 5);
}

.m_870bb79 {
  flex: 1 1;
  background: var(--loader-color);
  animation: m_5d2b3b9d 1.2s cubic-bezier(0, 0.5, 0.5, 1) infinite;
  border-radius: calc(0.125rem * var(--mantine-scale));
}

.m_870bb79:nth-of-type(1) {
    animation-delay: -240ms;
  }

.m_870bb79:nth-of-type(2) {
    animation-delay: -120ms;
  }

.m_870bb79:nth-of-type(3) {
    animation-delay: 0;
  }

/* ----- Dots loader ----- */
@keyframes m_aac34a1 {
  0%,
  100% {
    transform: scale(1);
    opacity: 1;
  }

  50% {
    transform: scale(0.6);
    opacity: 0.5;
  }
}

.m_4e3f22d7 {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: calc(var(--loader-size) / 10);
  position: relative;
  width: var(--loader-size);
  height: var(--loader-size);
}

.m_870c4af {
  width: calc(var(--loader-size) / 3 - var(--loader-size) / 15);
  height: calc(var(--loader-size) / 3 - var(--loader-size) / 15);
  border-radius: 50%;
  background: var(--loader-color);
  animation: m_aac34a1 0.8s infinite linear;
}

.m_870c4af:nth-child(2) {
    animation-delay: 0.4s;
  }

/* ----- Oval loader ----- */
@keyframes m_f8e89c4b {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

.m_b34414df {
  display: inline-block;
  width: var(--loader-size);
  height: var(--loader-size);
}

.m_b34414df::after {
    content: '';
    display: block;
    width: var(--loader-size);
    height: var(--loader-size);
    border-radius: calc(625rem * var(--mantine-scale));
    border-width: calc(var(--loader-size) / 8);
    border-style: solid;
    border-color: var(--loader-color) var(--loader-color) var(--loader-color) transparent;
    animation: m_f8e89c4b 1.2s linear infinite;
  }

.m_8d3f4000 {
  --ai-size-xs: calc(1.125rem * var(--mantine-scale));
  --ai-size-sm: calc(1.375rem * var(--mantine-scale));
  --ai-size-md: calc(1.75rem * var(--mantine-scale));
  --ai-size-lg: calc(2.125rem * var(--mantine-scale));
  --ai-size-xl: calc(2.75rem * var(--mantine-scale));

  --ai-size-input-xs: calc(1.875rem * var(--mantine-scale));
  --ai-size-input-sm: calc(2.25rem * var(--mantine-scale));
  --ai-size-input-md: calc(2.625rem * var(--mantine-scale));
  --ai-size-input-lg: calc(3.125rem * var(--mantine-scale));
  --ai-size-input-xl: calc(3.75rem * var(--mantine-scale));

  --ai-size: var(--ai-size-md);
  --ai-color: var(--mantine-color-white);

  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  overflow: hidden;

  width: var(--ai-size);
  height: var(--ai-size);
  min-width: var(--ai-size);
  min-height: var(--ai-size);
  border-radius: var(--ai-radius, var(--mantine-radius-default));
  background: var(--ai-bg, var(--mantine-primary-color-filled));
  color: var(--ai-color, var(--mantine-color-white));
  border: var(--ai-bd, calc(0.0625rem * var(--mantine-scale)) solid transparent);
  cursor: pointer;
}

  @media (hover: hover) {
    .m_8d3f4000:hover:where(:not([data-loading], :disabled, [data-disabled])) {
      background-color: var(--ai-hover, var(--mantine-primary-color-filled-hover));
      color: var(--ai-hover-color, var(--ai-color));
    }
}

  @media (hover: none) {
    .m_8d3f4000:active:where(:not([data-loading], :disabled, [data-disabled])) {
      background-color: var(--ai-hover, var(--mantine-primary-color-filled-hover));
      color: var(--ai-hover-color, var(--ai-color));
    }
}

  .m_8d3f4000[data-loading] {
    cursor: not-allowed;
  }

  .m_8d3f4000[data-loading] .m_8d3afb97 {
      opacity: 0;
      transform: translateY(100%);
    }

  .m_8d3f4000:where(:disabled:not([data-loading]), [data-disabled]:not([data-loading])) {
    cursor: not-allowed;
    border: calc(0.0625rem * var(--mantine-scale)) solid transparent;
  }

  :where([data-mantine-color-scheme='light']) .m_8d3f4000:where(:disabled:not([data-loading]), [data-disabled]:not([data-loading])) {
      background-color: var(--mantine-color-gray-1);
      color: var(--mantine-color-gray-5);
}

  :where([data-mantine-color-scheme='dark']) .m_8d3f4000:where(:disabled:not([data-loading]), [data-disabled]:not([data-loading])) {
      background-color: var(--mantine-color-dark-6);
      color: var(--mantine-color-dark-3);
}

  .m_8d3f4000:where(:disabled:not([data-loading]), [data-disabled]:not([data-loading])):active {
      transform: none;
    }

.m_302b9fb1 {
  inset: calc(-0.0625rem * var(--mantine-scale));
  position: absolute;
  border-radius: var(--ai-radius, var(--mantine-radius-default));
  display: flex;
  align-items: center;
  justify-content: center;
}

:where([data-mantine-color-scheme='light']) .m_302b9fb1 {
    background-color: rgba(255, 255, 255, 0.15);
}

:where([data-mantine-color-scheme='dark']) .m_302b9fb1 {
    background-color: rgba(0, 0, 0, 0.15);
}

.m_1a0f1b21 {
  --ai-border-width: calc(0.0625rem * var(--mantine-scale));
  display: flex;
}

.m_1a0f1b21 :where(*):focus {
      position: relative;
      z-index: 1;
    }

.m_1a0f1b21[data-orientation='horizontal'] {
    flex-direction: row;
  }

.m_1a0f1b21[data-orientation='horizontal'] .m_8d3f4000:not(:only-child):first-child, .m_1a0f1b21[data-orientation='horizontal'] .m_437b6484:not(:only-child):first-child {
        border-end-end-radius: 0;
        border-start-end-radius: 0;
        border-inline-end-width: calc(var(--ai-border-width) / 2);
      }

.m_1a0f1b21[data-orientation='horizontal'] .m_8d3f4000:not(:only-child):last-child, .m_1a0f1b21[data-orientation='horizontal'] .m_437b6484:not(:only-child):last-child {
        border-end-start-radius: 0;
        border-start-start-radius: 0;
        border-inline-start-width: calc(var(--ai-border-width) / 2);
      }

.m_1a0f1b21[data-orientation='horizontal'] .m_8d3f4000:not(:only-child):not(:first-child):not(:last-child), .m_1a0f1b21[data-orientation='horizontal'] .m_437b6484:not(:only-child):not(:first-child):not(:last-child) {
        border-radius: 0;
        border-inline-width: calc(var(--ai-border-width) / 2);
      }

.m_1a0f1b21[data-orientation='vertical'] {
    flex-direction: column;
  }

.m_1a0f1b21[data-orientation='vertical'] .m_8d3f4000:not(:only-child):first-child, .m_1a0f1b21[data-orientation='vertical'] .m_437b6484:not(:only-child):first-child {
        border-end-start-radius: 0;
        border-end-end-radius: 0;
        border-bottom-width: calc(var(--ai-border-width) / 2);
      }

.m_1a0f1b21[data-orientation='vertical'] .m_8d3f4000:not(:only-child):last-child, .m_1a0f1b21[data-orientation='vertical'] .m_437b6484:not(:only-child):last-child {
        border-start-start-radius: 0;
        border-start-end-radius: 0;
        border-top-width: calc(var(--ai-border-width) / 2);
      }

.m_1a0f1b21[data-orientation='vertical'] .m_8d3f4000:not(:only-child):not(:first-child):not(:last-child), .m_1a0f1b21[data-orientation='vertical'] .m_437b6484:not(:only-child):not(:first-child):not(:last-child) {
        border-radius: 0;
        border-bottom-width: calc(var(--ai-border-width) / 2);
        border-top-width: calc(var(--ai-border-width) / 2);
      }

.m_8d3afb97 {
  display: flex;
  align-items: center;
  justify-content: center;
  transition:
    transform 150ms ease,
    opacity 100ms ease;
  width: 100%;
  height: 100%;
}

.m_437b6484 {
  --section-height-xs: calc(1.125rem * var(--mantine-scale));
  --section-height-sm: calc(1.375rem * var(--mantine-scale));
  --section-height-md: calc(1.75rem * var(--mantine-scale));
  --section-height-lg: calc(2.125rem * var(--mantine-scale));
  --section-height-xl: calc(2.75rem * var(--mantine-scale));

  --section-height-input-xs: calc(1.875rem * var(--mantine-scale));
  --section-height-input-sm: calc(2.25rem * var(--mantine-scale));
  --section-height-input-md: calc(2.625rem * var(--mantine-scale));
  --section-height-input-lg: calc(3.125rem * var(--mantine-scale));
  --section-height-input-xl: calc(3.75rem * var(--mantine-scale));

  --section-padding-x-xs: calc(0.375rem * var(--mantine-scale));
  --section-padding-x-sm: calc(0.5rem * var(--mantine-scale));
  --section-padding-x-md: calc(0.625rem * var(--mantine-scale));
  --section-padding-x-lg: calc(0.75rem * var(--mantine-scale));
  --section-padding-x-xl: calc(1rem * var(--mantine-scale));

  --section-height: var(--section-height-sm);
  --section-padding-x: var(--section-padding-x-sm);
  --section-color: var(--mantine-color-white);

  font-weight: 600;
  width: auto;
  border-radius: var(--section-radius, var(--mantine-radius-default));
  font-size: var(--section-fz, var(--mantine-font-size-sm));
  background: var(--section-bg, var(--mantine-primary-color-filled));
  border: var(--section-bd, calc(0.0625rem * var(--mantine-scale)) solid transparent);
  color: var(--section-color, var(--mantine-color-white));
  height: var(--section-height, var(--section-height-sm));
  padding-inline: var(--section-padding-x, var(--section-padding-x-sm));
  vertical-align: middle;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.m_86a44da5 {
  --cb-size-xs: calc(1.125rem * var(--mantine-scale));
  --cb-size-sm: calc(1.375rem * var(--mantine-scale));
  --cb-size-md: calc(1.75rem * var(--mantine-scale));
  --cb-size-lg: calc(2.125rem * var(--mantine-scale));
  --cb-size-xl: calc(2.75rem * var(--mantine-scale));

  --cb-size: var(--cb-size-md);
  --cb-icon-size: 70%;
  --cb-radius: var(--mantine-radius-default);

  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;

  width: var(--cb-size);
  height: var(--cb-size);
  min-width: var(--cb-size);
  min-height: var(--cb-size);
  border-radius: var(--cb-radius);
}

  :where([data-mantine-color-scheme='light']) .m_86a44da5 {
    color: var(--mantine-color-gray-7);
}

  :where([data-mantine-color-scheme='dark']) .m_86a44da5 {
    color: var(--mantine-color-dark-1);
}

  .m_86a44da5[data-disabled],
  .m_86a44da5:disabled {
    cursor: not-allowed;
    opacity: 0.6;
  }

@media (hover: hover) {
    :where([data-mantine-color-scheme='light']) .m_220c80f2:where(:not([data-disabled], :disabled)):hover {
      background-color: var(--mantine-color-gray-0);
  }

    :where([data-mantine-color-scheme='dark']) .m_220c80f2:where(:not([data-disabled], :disabled)):hover {
      background-color: var(--mantine-color-dark-6);
  }
}

@media (hover: none) {
    :where([data-mantine-color-scheme='light']) .m_220c80f2:where(:not([data-disabled], :disabled)):active {
      background-color: var(--mantine-color-gray-0);
  }

    :where([data-mantine-color-scheme='dark']) .m_220c80f2:where(:not([data-disabled], :disabled)):active {
      background-color: var(--mantine-color-dark-6);
  }
}

.m_4081bf90 {
  display: flex;
  flex-direction: row;
  flex-wrap: var(--group-wrap, wrap);
  justify-content: var(--group-justify, flex-start);
  align-items: var(--group-align, center);
  gap: var(--group-gap, var(--mantine-spacing-md));
}

  .m_4081bf90:where([data-grow]) > * {
      flex-grow: 1;
      max-width: var(--group-child-width);
    }

.m_615af6c9 {
  line-height: 1;
  padding: 0;
  margin: 0;
  font-weight: 400;
  font-size: var(--mantine-font-size-md);
}

.m_b5489c3c {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: var(--mb-padding, var(--mantine-spacing-md));
  -webkit-padding-end: calc(var(--mb-padding, var(--mantine-spacing-md)) - calc(0.3125rem * var(--mantine-scale)));
          padding-inline-end: calc(var(--mb-padding, var(--mantine-spacing-md)) - calc(0.3125rem * var(--mantine-scale)));
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  background-color: var(--mantine-color-body);
  z-index: 1000;
  min-height: calc(3.75rem * var(--mantine-scale));
  transition: -webkit-padding-end 100ms;
  transition: padding-inline-end 100ms;
  transition: padding-inline-end 100ms, -webkit-padding-end 100ms;
}

.m_60c222c7 {
  position: fixed;
  width: 100%;
  top: 0;
  bottom: 0;
  z-index: var(--mb-z-index);
  pointer-events: none;
}

.m_fd1ab0aa {
  pointer-events: all;
  box-shadow: var(--mb-shadow, var(--mantine-shadow-xl));
}

.m_fd1ab0aa [data-mantine-scrollbar] {
    z-index: 1001;
  }

[data-offset-scrollbars] .m_fd1ab0aa:has([data-mantine-scrollbar]) .m_b5489c3c {
    -webkit-padding-end: calc(var(--mb-padding, var(--mantine-spacing-md)) + calc(0.3125rem * var(--mantine-scale)));
            padding-inline-end: calc(var(--mb-padding, var(--mantine-spacing-md)) + calc(0.3125rem * var(--mantine-scale)));
  }

.m_606cb269 {
  -webkit-margin-start: auto;
          margin-inline-start: auto;
}

.m_5df29311 {
  padding: var(--mb-padding, var(--mantine-spacing-md));
  padding-top: var(--mb-padding, var(--mantine-spacing-md));
}

.m_5df29311:where(:not(:only-child)) {
    padding-top: 0;
  }

.m_6c018570 {
  position: relative;
  margin-top: var(--input-margin-top, 0rem);
  margin-bottom: var(--input-margin-bottom, 0rem);

  --input-height-xs: calc(1.875rem * var(--mantine-scale));
  --input-height-sm: calc(2.25rem * var(--mantine-scale));
  --input-height-md: calc(2.625rem * var(--mantine-scale));
  --input-height-lg: calc(3.125rem * var(--mantine-scale));
  --input-height-xl: calc(3.75rem * var(--mantine-scale));

  --input-padding-y-xs: calc(0.3125rem * var(--mantine-scale));
  --input-padding-y-sm: calc(0.375rem * var(--mantine-scale));
  --input-padding-y-md: calc(0.5rem * var(--mantine-scale));
  --input-padding-y-lg: calc(0.625rem * var(--mantine-scale));
  --input-padding-y-xl: calc(0.8125rem * var(--mantine-scale));

  --input-height: var(--input-height-sm);
  --input-radius: var(--mantine-radius-default);

  --input-cursor: text;
  --input-text-align: left;
  --input-line-height: calc(var(--input-height) - calc(0.125rem * var(--mantine-scale)));
  --input-padding: calc(var(--input-height) / 3);
  --input-padding-inline-start: var(--input-padding);
  --input-padding-inline-end: var(--input-padding);
  --input-placeholder-color: var(--mantine-color-placeholder);
  --input-color: var(--mantine-color-text);

  --input-left-section-size: var(--input-left-section-width, calc(var(--input-height) - calc(0.125rem * var(--mantine-scale))));

  --input-right-section-size: var(
    --input-right-section-width,
    calc(var(--input-height) - calc(0.125rem * var(--mantine-scale)))
  );

  --input-size: var(--input-height);

  --section-y: calc(0.0625rem * var(--mantine-scale));
  --left-section-start: calc(0.0625rem * var(--mantine-scale));
  --left-section-border-radius: var(--input-radius) 0 0 var(--input-radius);

  --right-section-end: calc(0.0625rem * var(--mantine-scale));
  --right-section-border-radius: 0 var(--input-radius) var(--input-radius) 0;
}

  .m_6c018570[data-variant='unstyled'] {
    --input-padding: 0;
    --input-padding-y: 0;
    --input-padding-inline-start: 0;
    --input-padding-inline-end: 0;
  }

  .m_6c018570[data-pointer] {
    --input-cursor: pointer;
  }

  .m_6c018570[data-multiline] {
    --input-padding-y-xs: calc(0.28125rem * var(--mantine-scale));
    --input-padding-y-sm: calc(0.34375rem * var(--mantine-scale));
    --input-padding-y-md: calc(0.4375rem * var(--mantine-scale));
    --input-padding-y-lg: calc(0.59375rem * var(--mantine-scale));
    --input-padding-y-xl: calc(0.8125rem * var(--mantine-scale));

    --input-size: auto;
    --input-line-height: var(--mantine-line-height);
    --input-padding-y: var(--input-padding-y-sm);
  }

  .m_6c018570[data-with-left-section] {
    --input-padding-inline-start: var(--input-left-section-size);
  }

  .m_6c018570[data-with-right-section] {
    --input-padding-inline-end: var(--input-right-section-size);
  }

  [data-mantine-color-scheme='light'] .m_6c018570 {
    --input-disabled-bg: var(--mantine-color-gray-1);
    --input-disabled-color: var(--mantine-color-gray-6);
}

  [data-mantine-color-scheme='light'] .m_6c018570[data-variant='default'] {
      --input-bd: var(--mantine-color-gray-4);
      --input-bg: var(--mantine-color-white);
      --input-bd-focus: var(--mantine-primary-color-filled);
    }

  [data-mantine-color-scheme='light'] .m_6c018570[data-variant='filled'] {
      --input-bd: transparent;
      --input-bg: var(--mantine-color-gray-1);
      --input-bd-focus: var(--mantine-primary-color-filled);
    }

  [data-mantine-color-scheme='light'] .m_6c018570[data-variant='unstyled'] {
      --input-bd: transparent;
      --input-bg: transparent;
      --input-bd-focus: transparent;
    }

  [data-mantine-color-scheme='dark'] .m_6c018570 {
    --input-disabled-bg: var(--mantine-color-dark-6);
    --input-disabled-color: var(--mantine-color-dark-2);
}

  [data-mantine-color-scheme='dark'] .m_6c018570[data-variant='default'] {
      --input-bd: var(--mantine-color-dark-4);
      --input-bg: var(--mantine-color-dark-6);
      --input-bd-focus: var(--mantine-primary-color-filled);
    }

  [data-mantine-color-scheme='dark'] .m_6c018570[data-variant='filled'] {
      --input-bd: transparent;
      --input-bg: var(--mantine-color-dark-5);
      --input-bd-focus: var(--mantine-primary-color-filled);
    }

  [data-mantine-color-scheme='dark'] .m_6c018570[data-variant='unstyled'] {
      --input-bd: transparent;
      --input-bg: transparent;
      --input-bd-focus: transparent;
    }

  [data-mantine-color-scheme] .m_6c018570[data-error]:not([data-variant='unstyled']) {
      --input-bd: var(--mantine-color-error);
    }

  [data-mantine-color-scheme] .m_6c018570[data-error] {

    --input-color: var(--mantine-color-error);
    --input-placeholder-color: var(--mantine-color-error);
    --input-section-color: var(--mantine-color-error);
}

  :where([dir="rtl"]) .m_6c018570 {
    --input-text-align: right;
    --left-section-border-radius: 0 var(--input-radius) var(--input-radius) 0;
    --right-section-border-radius: var(--input-radius) 0 0 var(--input-radius);
}

.m_8fb7ebe7 {
  -webkit-tap-highlight-color: transparent;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  resize: var(--input-resize, none);
  display: block;
  width: 100%;
  transition: border-color 100ms ease;

  text-align: var(--input-text-align);
  color: var(--input-color);
  border: calc(0.0625rem * var(--mantine-scale)) solid var(--input-bd);
  background-color: var(--input-bg);
  font-family: var(--input-font-family, var(--mantine-font-family));
  height: var(--input-size);
  min-height: var(--input-height);
  line-height: var(--input-line-height);
  font-size: var(--input-fz, var(--input-fz, var(--mantine-font-size-sm)));
  border-radius: var(--input-radius);
  -webkit-padding-start: var(--input-padding-inline-start);
          padding-inline-start: var(--input-padding-inline-start);
  -webkit-padding-end: var(--input-padding-inline-end);
          padding-inline-end: var(--input-padding-inline-end);
  padding-top: var(--input-padding-y, 0rem);
  padding-bottom: var(--input-padding-y, 0rem);
  cursor: var(--input-cursor);
  overflow: var(--input-overflow);
}

/* Used as data attribute in Textarea component, does not have associated prop on the Input component */

.m_8fb7ebe7[data-no-overflow] {
    --input-overflow: hidden;
  }

/* Used as data attribute in JsonInput component, does not have associated prop on the Input component */

.m_8fb7ebe7[data-monospace] {
    --input-font-family: var(--mantine-font-family-monospace);
    --input-fz: calc(var(--input-fz, var(--mantine-font-size-sm)) - calc(0.125rem * var(--mantine-scale)));
  }

.m_8fb7ebe7:focus,
  .m_8fb7ebe7:focus-within {
    outline: none;
    --input-bd: var(--input-bd-focus);
  }

[data-error] .m_8fb7ebe7:focus, [data-error] .m_8fb7ebe7:focus-within {
      --input-bd: var(--mantine-color-error);
    }

.m_8fb7ebe7::placeholder {
    color: var(--input-placeholder-color);
    opacity: 1;
  }

.m_8fb7ebe7::-webkit-inner-spin-button,
  .m_8fb7ebe7::-webkit-outer-spin-button,
  .m_8fb7ebe7::-webkit-search-decoration,
  .m_8fb7ebe7::-webkit-search-cancel-button,
  .m_8fb7ebe7::-webkit-search-results-button,
  .m_8fb7ebe7::-webkit-search-results-decoration {
    -webkit-appearance: none;
            appearance: none;
  }

.m_8fb7ebe7[type='number'] {
    -moz-appearance: textfield;
  }

.m_8fb7ebe7:disabled,
  .m_8fb7ebe7[data-disabled] {
    cursor: not-allowed;
    opacity: 0.6;
    background-color: var(--input-disabled-bg);
    color: var(--input-disabled-color);
  }

/* Required to be a separate selector to work in Firefox, can be merged with &:disabled once :has is supported */

.m_8fb7ebe7:has(input:disabled) {
    cursor: not-allowed;
    opacity: 0.6;
    background-color: var(--input-disabled-bg);
    color: var(--input-disabled-color);
  }

.m_82577fc2 {
  pointer-events: var(--section-pointer-events);
  position: absolute;
  z-index: 1;
  inset-inline-start: var(--section-start);
  inset-inline-end: var(--section-end);
  bottom: var(--section-y);
  top: var(--section-y);
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--section-size);
  border-radius: var(--section-border-radius);
  color: var(--input-section-color, var(--mantine-color-dimmed));
}

.m_82577fc2[data-position='right'] {
    --section-pointer-events: var(--input-right-section-pointer-events);
    --section-end: var(--right-section-end);
    --section-size: var(--input-right-section-size);
    --section-border-radius: var(--right-section-border-radius);
  }

.m_82577fc2[data-position='left'] {
    --section-pointer-events: var(--input-left-section-pointer-events);
    --section-start: var(--left-section-start);
    --section-size: var(--input-left-section-size);
    --section-border-radius: var(--left-section-border-radius);
  }

/* ----- Input.Placeholder ----- */
.m_88bacfd0 {
  color: var(--input-placeholder-color, var(--mantine-color-placeholder));
}
[data-error] .m_88bacfd0 {
    --input-placeholder-color: var(--input-color, var(--mantine-color-placeholder));
  }

/* ----- Input.Wrapper ----- */
.m_46b77525 {
  line-height: var(--mantine-line-height);
}

.m_8fdc1311 {
  display: inline-block;
  font-weight: 500;
  word-break: break-word;
  cursor: default;
  -webkit-tap-highlight-color: transparent;
  font-size: var(--input-label-size, var(--mantine-font-size-sm));
}

.m_78a94662 {
  color: var(--input-asterisk-color, var(--mantine-color-error));
}

.m_8f816625,
.m_fe47ce59 {
  word-wrap: break-word;
  line-height: 1.2;
  display: block;
  margin: 0;
  padding: 0;
}

.m_8f816625 {
  color: var(--mantine-color-error);
  font-size: var(--input-error-size, calc(var(--mantine-font-size-sm) - calc(0.125rem * var(--mantine-scale))));
}

.m_fe47ce59 {
  color: var(--mantine-color-dimmed);
  font-size: var(--input-description-size, calc(var(--mantine-font-size-sm) - calc(0.125rem * var(--mantine-scale))));
}

.m_8bffd616 {
  display: flex;
}

.m_96b553a6 {
  --transition-duration: 150ms;

  top: 0;
  left: 0;
  position: absolute;
  z-index: 0;
  transition-property: transform, width, height;
  transition-timing-function: ease;
  transition-duration: 0ms;
}

  .m_96b553a6:where([data-initialized]) {
    transition-duration: var(--transition-duration);
  }

  .m_96b553a6:where([data-hidden]) {
    background-color: red;
    display: none;
  }

.m_9bdbb667 {
  --accordion-radius: var(--mantine-radius-default);
}

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

.m_4ba554d4 {
  padding: var(--mantine-spacing-md);
  padding-top: calc(var(--mantine-spacing-xs) / 2);
}

.m_8fa820a0 {
  margin: 0;
  padding: 0;
}

.m_4ba585b8 {
  width: 100%;
  display: flex;
  align-items: center;
  flex-direction: row-reverse;
  padding-inline: var(--mantine-spacing-md);
  opacity: 1;
  cursor: pointer;
  background-color: transparent;
}

.m_4ba585b8:where([data-chevron-position='left']) {
    flex-direction: row;
    -webkit-padding-start: 0;
            padding-inline-start: 0;
  }

:where([data-mantine-color-scheme='light']) .m_4ba585b8 {
    color: var(--mantine-color-black);
}

:where([data-mantine-color-scheme='dark']) .m_4ba585b8 {
    color: var(--mantine-color-dark-0);
}

.m_4ba585b8:where(:disabled, [data-disabled]) {
    opacity: 0.4;
    cursor: not-allowed;
  }

@media (hover: hover) {
      :where([data-mantine-color-scheme='light']) .m_6939a5e9:where(:not(:disabled, [data-disabled])):hover, :where([data-mantine-color-scheme='light']) .m_4271d21b:where(:not(:disabled, [data-disabled])):hover {
        background-color: var(--mantine-color-gray-0);
  }

      :where([data-mantine-color-scheme='dark']) .m_6939a5e9:where(:not(:disabled, [data-disabled])):hover, :where([data-mantine-color-scheme='dark']) .m_4271d21b:where(:not(:disabled, [data-disabled])):hover {
        background-color: var(--mantine-color-dark-6);
  }
}

@media (hover: none) {
      :where([data-mantine-color-scheme='light']) .m_6939a5e9:where(:not(:disabled, [data-disabled])):active, :where([data-mantine-color-scheme='light']) .m_4271d21b:where(:not(:disabled, [data-disabled])):active {
        background-color: var(--mantine-color-gray-0);
  }

      :where([data-mantine-color-scheme='dark']) .m_6939a5e9:where(:not(:disabled, [data-disabled])):active, :where([data-mantine-color-scheme='dark']) .m_4271d21b:where(:not(:disabled, [data-disabled])):active {
        background-color: var(--mantine-color-dark-6);
  }
}

.m_df3ffa0f {
  color: inherit;
  font-weight: 400;
  flex: 1 1;
  overflow: hidden;
  text-overflow: ellipsis;
  padding-top: var(--mantine-spacing-sm);
  padding-bottom: var(--mantine-spacing-sm);
}

.m_3f35ae96 {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  transition: transform var(--accordion-transition-duration, 200ms) ease;
  width: var(--accordion-chevron-size, calc(0.9375rem * var(--mantine-scale)));
  min-width: var(--accordion-chevron-size, calc(0.9375rem * var(--mantine-scale)));
  transform: rotate(0deg);
}

.m_3f35ae96:where([data-rotate]) {
    transform: rotate(180deg);
  }

.m_3f35ae96:where([data-position='left']) {
    -webkit-margin-end: var(--mantine-spacing-md);
            margin-inline-end: var(--mantine-spacing-md);
    -webkit-margin-start: var(--mantine-spacing-md);
            margin-inline-start: var(--mantine-spacing-md);
  }

.m_9bd771fe {
  display: flex;
  align-items: center;
  justify-content: center;
  -webkit-margin-end: var(--mantine-spacing-sm);
          margin-inline-end: var(--mantine-spacing-sm);
}

.m_9bd771fe:where([data-chevron-position='left']) {
    -webkit-margin-end: 0;
            margin-inline-end: 0;
    -webkit-margin-start: var(--mantine-spacing-lg);
            margin-inline-start: var(--mantine-spacing-lg);
  }

:where([data-mantine-color-scheme='light']) .m_9bd7b098 {
    --item-border-color: var(--mantine-color-gray-3);
    --item-filled-color: var(--mantine-color-gray-0);
}

:where([data-mantine-color-scheme='dark']) .m_9bd7b098 {
    --item-border-color: var(--mantine-color-dark-4);
    --item-filled-color: var(--mantine-color-dark-6);
}

.m_fe19b709 {
  border-bottom: 1px solid var(--item-border-color);
}

.m_1f921b3b {
  border: 1px solid var(--item-border-color);
  transition: background-color 150ms ease;
}

.m_1f921b3b:where([data-active]) {
    background-color: var(--item-filled-color);
  }

.m_1f921b3b:first-of-type {
    border-start-start-radius: var(--accordion-radius);
    border-start-end-radius: var(--accordion-radius);
  }

.m_1f921b3b:first-of-type > [data-accordion-control] {
      border-start-start-radius: var(--accordion-radius);
      border-start-end-radius: var(--accordion-radius);
    }

.m_1f921b3b:last-of-type {
    border-end-start-radius: var(--accordion-radius);
    border-end-end-radius: var(--accordion-radius);
  }

.m_1f921b3b:last-of-type > [data-accordion-control] {
      border-end-start-radius: var(--accordion-radius);
      border-end-end-radius: var(--accordion-radius);
    }

.m_1f921b3b + .m_1f921b3b {
    border-top: 0;
  }

.m_2cdf939a {
  border-radius: var(--accordion-radius);
}

.m_2cdf939a:where([data-active]) {
    background-color: var(--item-filled-color);
  }

.m_9f59b069 {
  background-color: var(--item-filled-color);
  border-radius: var(--accordion-radius);
  border: calc(0.0625rem * var(--mantine-scale)) solid transparent;
  transition: background-color 150ms ease;
}

.m_9f59b069[data-active] {
    border-color: var(--item-border-color);
  }

:where([data-mantine-color-scheme='light']) .m_9f59b069[data-active] {
      background-color: var(--mantine-color-white);
}

:where([data-mantine-color-scheme='dark']) .m_9f59b069[data-active] {
      background-color: var(--mantine-color-dark-7);
}

.m_9f59b069 + .m_9f59b069 {
    margin-top: var(--mantine-spacing-md);
  }

.m_7f854edf {
  position: fixed;
  z-index: var(--affix-z-index);
  inset-inline-start: var(--affix-left);
  inset-inline-end: var(--affix-right);
  top: var(--affix-top);
  bottom: var(--affix-bottom);
}

.m_66836ed3 {
  --alert-radius: var(--mantine-radius-default);
  --alert-bg: var(--mantine-primary-color-light);
  --alert-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;
  --alert-color: var(--mantine-primary-color-light-color);

  padding: var(--mantine-spacing-md) var(--mantine-spacing-md);
  border-radius: var(--alert-radius);
  position: relative;
  overflow: hidden;
  background-color: var(--alert-bg);
  border: var(--alert-bd);
  color: var(--alert-color);
}

.m_a5d60502 {
  display: flex;
}

.m_667c2793 {
  flex: 1 1;
  display: flex;
  flex-direction: column;
  gap: var(--mantine-spacing-xs);
}

.m_6a03f287 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: var(--mantine-font-size-sm);
  font-weight: 700;
}

.m_6a03f287:where([data-with-close-button]) {
    -webkit-padding-end: var(--mantine-spacing-md);
            padding-inline-end: var(--mantine-spacing-md);
  }

.m_698f4f23 {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
}

.m_667f2a6a {
  line-height: 1;
  width: calc(1.25rem * var(--mantine-scale));
  height: calc(1.25rem * var(--mantine-scale));
  display: flex;
  align-items: center;
  justify-content: flex-start;
  -webkit-margin-end: var(--mantine-spacing-md);
          margin-inline-end: var(--mantine-spacing-md);
  margin-top: calc(0.0625rem * var(--mantine-scale));
}

.m_7fa78076 {
  text-overflow: ellipsis;
  overflow: hidden;
  font-size: var(--mantine-font-size-sm);
}

:where([data-mantine-color-scheme='light']) .m_7fa78076 {
    color: var(--mantine-color-black);
}

:where([data-mantine-color-scheme='dark']) .m_7fa78076 {
    color: var(--mantine-color-white);
}

.m_7fa78076:where([data-variant='filled']) {
    color: var(--alert-color);
  }

.m_7fa78076:where([data-variant='white']) {
    color: var(--mantine-color-black);
  }

.m_87f54839 {
  width: calc(1.25rem * var(--mantine-scale));
  height: calc(1.25rem * var(--mantine-scale));
  color: var(--alert-color);
}

.m_b6d8b162 {
  -webkit-tap-highlight-color: transparent;
  text-decoration: none;
  font-size: var(--text-fz, var(--mantine-font-size-md));
  line-height: var(--text-lh, var(--mantine-line-height-md));
  font-weight: normal;
  margin: 0;
  padding: 0;
  color: var(--text-color);
}

  .m_b6d8b162:where([data-truncate]) {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .m_b6d8b162:where([data-truncate='start']) {
    direction: rtl;
    text-align: right;
  }

  :where([dir="rtl"]) .m_b6d8b162:where([data-truncate='start']) {
      direction: ltr;
      text-align: left;
}

  .m_b6d8b162:where([data-variant='gradient']) {
    background-image: var(--text-gradient);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }

  .m_b6d8b162:where([data-line-clamp]) {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: var(--text-line-clamp);
    -webkit-box-orient: vertical;
  }

  .m_b6d8b162:where([data-inherit]) {
    line-height: inherit;
    font-weight: inherit;
    font-size: inherit;
  }

  .m_b6d8b162:where([data-inline]) {
    line-height: 1;
  }

.m_849cf0da {
  color: var(--mantine-color-anchor);
  text-decoration: none;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: none;
  display: inline;
  padding: 0;
  margin: 0;
  background-color: transparent;
  cursor: pointer;
}

  @media (hover: hover) {

  .m_849cf0da:where([data-underline='hover']):hover {
      text-decoration: underline;
  }
}

  @media (hover: none) {

  .m_849cf0da:where([data-underline='hover']):active {
      text-decoration: underline;
  }
}

  .m_849cf0da:where([data-underline='not-hover']) {
    text-decoration: underline;
  }

  @media (hover: hover) {

  .m_849cf0da:where([data-underline='not-hover']):hover {
      text-decoration: none;
  }
}

  @media (hover: none) {

  .m_849cf0da:where([data-underline='not-hover']):active {
      text-decoration: none;
  }
}

  .m_849cf0da:where([data-underline='always']) {
    text-decoration: underline;
  }

  .m_849cf0da:where([data-variant='gradient']),
    .m_849cf0da:where([data-variant='gradient']):hover {
      text-decoration: none;
    }

  .m_849cf0da:where([data-line-clamp]) {
    display: -webkit-box;
  }

.m_48204f9b {
  width: var(--slider-size);
  height: var(--slider-size);
  position: relative;
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}

  .m_48204f9b:focus-within {
    outline: 2px solid var(--mantine-primary-color-filled);
    outline-offset: calc(0.125rem * var(--mantine-scale));
  }

  .m_48204f9b {

  --slider-size: calc(3.75rem * var(--mantine-scale));
  --thumb-size: calc(var(--slider-size) / 5);
}

  :where([data-mantine-color-scheme='light']) .m_48204f9b {
    background-color: var(--mantine-color-gray-1);
}

  :where([data-mantine-color-scheme='dark']) .m_48204f9b {
    background-color: var(--mantine-color-dark-5);
}

.m_bb9cdbad {
  position: absolute;
  inset: calc(0.0625rem * var(--mantine-scale));
  border-radius: var(--slider-size);
  pointer-events: none;
}

.m_481dd586 {
  width: calc(0.125rem * var(--mantine-scale));
  position: absolute;
  top: 0;
  bottom: 0;
  left: calc(50% - 1px);
  transform: rotate(var(--angle));
}

.m_481dd586::before {
    content: '';
    position: absolute;
    top: calc(var(--thumb-size) / 3);
    left: calc(0.03125rem * var(--mantine-scale));
    width: calc(0.0625rem * var(--mantine-scale));
    height: calc(var(--thumb-size) / 1.5);
    transform: translate(-50%, -50%);
  }

:where([data-mantine-color-scheme='light']) .m_481dd586::before {
      background-color: var(--mantine-color-gray-4);
}

:where([data-mantine-color-scheme='dark']) .m_481dd586::before {
      background-color: var(--mantine-color-dark-3);
}

.m_481dd586[data-label]::after {
    min-width: calc(1.125rem * var(--mantine-scale));
    text-align: center;
    content: attr(data-label);
    position: absolute;
    top: calc(-1.5rem * var(--mantine-scale));
    left: calc(-0.4375rem * var(--mantine-scale));
    transform: rotate(calc(360deg - var(--angle)));
    font-size: var(--mantine-font-size-xs);
  }

.m_bc02ba3d {
  position: absolute;
  inset-block: 0;
  inset-inline-start: calc(50% - 1.5px);
  inset-inline-end: 0;
  height: 100%;
  width: calc(0.1875rem * var(--mantine-scale));
  outline: none;
  pointer-events: none;
}

.m_bc02ba3d::before {
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    height: min(var(--thumb-size), calc(var(--slider-size) / 2));
    width: calc(0.1875rem * var(--mantine-scale));
  }

:where([data-mantine-color-scheme='light']) .m_bc02ba3d::before {
      background-color: var(--mantine-color-gray-7);
}

:where([data-mantine-color-scheme='dark']) .m_bc02ba3d::before {
      background-color: var(--mantine-color-dark-1);
}

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

.m_89ab340[data-resizing] {
    --app-shell-transition-duration: 0ms !important;
  }
  .m_89ab340[data-disabled] {
    --app-shell-header-offset: 0rem !important;
    --app-shell-navbar-offset: 0rem !important;
    --app-shell-aside-offset: 0rem !important;
    --app-shell-footer-offset: 0rem !important;
  }
  [data-mantine-color-scheme='light'] .m_89ab340 {
    --app-shell-border-color: var(--mantine-color-gray-3);
}
  [data-mantine-color-scheme='dark'] .m_89ab340 {
    --app-shell-border-color: var(--mantine-color-dark-4);
}

.m_45252eee,
.m_9cdde9a,
.m_3b16f56b,
.m_8983817,
.m_3840c879 {
  transition-duration: var(--app-shell-transition-duration);
  transition-timing-function: var(--app-shell-transition-timing-function);
}

.m_45252eee,
.m_9cdde9a {
  position: fixed;
  display: flex;
  flex-direction: column;
  top: var(--app-shell-header-offset, 0rem);
  height: calc(
    100dvh - var(--app-shell-header-offset, 0rem) - var(--app-shell-footer-offset, 0rem)
  );
  background-color: var(--mantine-color-body);
  transition-property: transform, top, height;
}

:where([data-layout='alt']) .m_45252eee, :where([data-layout='alt']) .m_9cdde9a {
    top: 0rem;
    height: 100dvh;
  }

.m_45252eee {
  inset-inline-start: 0;
  width: var(--app-shell-navbar-width);
  transition-property: transform, top, height;
  transform: var(--app-shell-navbar-transform);
  z-index: var(--app-shell-navbar-z-index);
}

:where([dir="rtl"]) .m_45252eee {
    transform: var(--app-shell-navbar-transform-rtl);
}

.m_45252eee:where([data-with-border]) {
    -webkit-border-end: 1px solid var(--app-shell-border-color);
            border-inline-end: 1px solid var(--app-shell-border-color);
  }

.m_9cdde9a {
  inset-inline-end: 0;
  width: var(--app-shell-aside-width);
  transform: var(--app-shell-aside-transform);
  z-index: var(--app-shell-aside-z-index);
}

:where([dir="rtl"]) .m_9cdde9a {
    transform: var(--app-shell-aside-transform-rtl);
}

.m_9cdde9a:where([data-with-border]) {
    -webkit-border-start: 1px solid var(--app-shell-border-color);
            border-inline-start: 1px solid var(--app-shell-border-color);
  }

.m_8983817 {
  -webkit-padding-start: calc(var(--app-shell-navbar-offset, 0rem) + var(--app-shell-padding));
          padding-inline-start: calc(var(--app-shell-navbar-offset, 0rem) + var(--app-shell-padding));
  -webkit-padding-end: calc(var(--app-shell-aside-offset, 0rem) + var(--app-shell-padding));
          padding-inline-end: calc(var(--app-shell-aside-offset, 0rem) + var(--app-shell-padding));
  padding-top: calc(var(--app-shell-header-offset, 0rem) + var(--app-shell-padding));
  padding-bottom: calc(var(--app-shell-footer-offset, 0rem) + var(--app-shell-padding));
  min-height: 100dvh;
  transition-property: padding;
}

.m_3b16f56b,
.m_3840c879 {
  position: fixed;
  inset-inline: 0;
  transition-property: transform, left, right;
  background-color: var(--mantine-color-body);
}

:where([data-layout='alt']) .m_3b16f56b, :where([data-layout='alt']) .m_3840c879 {
    inset-inline-start: var(--app-shell-navbar-offset, 0rem);
    inset-inline-end: var(--app-shell-aside-offset, 0rem);
  }

.m_3b16f56b {
  top: 0;
  height: var(--app-shell-header-height);
  background-color: var(--mantine-color-body);
  transform: var(--app-shell-header-transform);
  z-index: var(--app-shell-header-z-index);
}

.m_3b16f56b:where([data-with-border]) {
    border-bottom: 1px solid var(--app-shell-border-color);
  }

.m_3840c879 {
  bottom: 0;
  height: calc(var(--app-shell-footer-height) + env(safe-area-inset-bottom));
  padding-bottom: env(safe-area-inset-bottom);
  transform: var(--app-shell-footer-transform);
  z-index: var(--app-shell-footer-z-index);
}

.m_3840c879:where([data-with-border]) {
    border-top: 1px solid var(--app-shell-border-color);
  }

.m_6dcfc7c7 {
  flex-grow: 0;
}

.m_6dcfc7c7:where([data-grow]) {
    flex-grow: 1;
  }

.m_71ac47fc {
  --ar-ratio: 1;
  max-width: 100%;
}

  .m_71ac47fc > :where(*:not(style)) {
    aspect-ratio: var(--ar-ratio);
    width: 100%;
  }

  .m_71ac47fc > :where(img, video) {
    object-fit: cover;
  }

.m_88b62a41 {
  --combobox-padding: calc(0.25rem * var(--mantine-scale));
  padding: var(--combobox-padding);
}

  .m_88b62a41:has([data-mantine-scrollbar]) .m_985517d8 {
      max-width: calc(100% + var(--combobox-padding));
    }

  .m_88b62a41[data-composed] {
    -webkit-padding-end: 0;
            padding-inline-end: 0;
  }

  .m_88b62a41[data-hidden] {
    display: none;
  }

/* Variables must be both on dropdown and options to support usage of Combobox.Options without Combobox.Dropdown */
.m_88b62a41,
.m_b2821a6e {
  --combobox-option-padding-xs: calc(0.25rem * var(--mantine-scale)) calc(0.5rem * var(--mantine-scale));
  --combobox-option-padding-sm: calc(0.375rem * var(--mantine-scale)) calc(0.625rem * var(--mantine-scale));
  --combobox-option-padding-md: calc(0.5rem * var(--mantine-scale)) calc(0.75rem * var(--mantine-scale));
  --combobox-option-padding-lg: calc(0.625rem * var(--mantine-scale)) calc(1rem * var(--mantine-scale));
  --combobox-option-padding-xl: calc(0.875rem * var(--mantine-scale)) calc(1.25rem * var(--mantine-scale));
  --combobox-option-padding: var(--combobox-option-padding-sm);
}

.m_92253aa5 {
  padding: var(--combobox-option-padding);
  font-size: var(--combobox-option-fz, var(--mantine-font-size-sm));
  border-radius: var(--mantine-radius-default);
  background-color: transparent;
  color: inherit;
  cursor: pointer;
  word-break: break-word;
}

.m_92253aa5:where([data-combobox-selected]) {
    background-color: var(--mantine-primary-color-filled);
    color: var(--mantine-color-white);
  }

.m_92253aa5:where([data-combobox-disabled]) {
    cursor: not-allowed;
    opacity: 0.35;
  }

@media (hover: hover) {
      :where([data-mantine-color-scheme='light']) .m_92253aa5:hover:where(:not([data-combobox-selected], [data-combobox-disabled])) {
        background-color: var(--mantine-color-gray-0);
  }

      :where([data-mantine-color-scheme='dark']) .m_92253aa5:hover:where(:not([data-combobox-selected], [data-combobox-disabled])) {
        background-color: var(--mantine-color-dark-7);
  }
}

@media (hover: none) {
      :where([data-mantine-color-scheme='light']) .m_92253aa5:active:where(:not([data-combobox-selected], [data-combobox-disabled])) {
        background-color: var(--mantine-color-gray-0);
  }

      :where([data-mantine-color-scheme='dark']) .m_92253aa5:active:where(:not([data-combobox-selected], [data-combobox-disabled])) {
        background-color: var(--mantine-color-dark-7);
  }
}

.m_985517d8 {
  margin-inline: calc(var(--combobox-padding) * -1);
  margin-top: calc(var(--combobox-padding) * -1);
  width: calc(100% + var(--combobox-padding) * 2);
  border-top-width: 0;
  border-inline-width: 0;
  border-end-start-radius: 0;
  border-end-end-radius: 0;
  margin-bottom: var(--combobox-padding);
  position: relative;
}

:where([data-mantine-color-scheme='light']) .m_985517d8, :where([data-mantine-color-scheme='light']) .m_985517d8:focus {
      border-color: var(--mantine-color-gray-2);
}

:where([data-mantine-color-scheme='dark']) .m_985517d8, :where([data-mantine-color-scheme='dark']) .m_985517d8:focus {
      border-color: var(--mantine-color-dark-4);
}

:where([data-mantine-color-scheme='light']) .m_985517d8 {
    background-color: var(--mantine-color-white);
}

:where([data-mantine-color-scheme='dark']) .m_985517d8 {
    background-color: var(--mantine-color-dark-7);
}

.m_2530cd1d {
  font-size: var(--combobox-option-fz, var(--mantine-font-size-sm));
  text-align: center;
  padding: var(--combobox-option-padding);
  color: var(--mantine-color-dimmed);
}

.m_858f94bd,
.m_82b967cb {
  font-size: var(--combobox-option-fz, var(--mantine-font-size-sm));
  border: 0 solid transparent;
  margin-inline: calc(var(--combobox-padding) * -1);
  padding: var(--combobox-option-padding);
}

:where([data-mantine-color-scheme='light']) .m_858f94bd, :where([data-mantine-color-scheme='light']) .m_82b967cb {
    border-color: var(--mantine-color-gray-2);
}

:where([data-mantine-color-scheme='dark']) .m_858f94bd, :where([data-mantine-color-scheme='dark']) .m_82b967cb {
    border-color: var(--mantine-color-dark-4);
}

.m_82b967cb {
  border-top-width: calc(0.0625rem * var(--mantine-scale));
  margin-top: var(--combobox-padding);
  margin-bottom: calc(var(--combobox-padding) * -1);
}

.m_858f94bd {
  border-bottom-width: calc(0.0625rem * var(--mantine-scale));
  margin-bottom: var(--combobox-padding);
  margin-top: calc(var(--combobox-padding) * -1);
}

.m_254f3e4f:has(.m_2bb2e9e5:only-child) {
    display: none;
  }

.m_2bb2e9e5 {
  color: var(--mantine-color-dimmed);
  font-size: calc(var(--combobox-option-fz, var(--mantine-font-size-sm)) * 0.85);
  padding: var(--combobox-option-padding);
  font-weight: 500;
  position: relative;
  display: flex;
  align-items: center;
}

.m_2bb2e9e5::after {
    content: '';
    flex: 1 1;
    inset-inline: 0;
    height: calc(0.0625rem * var(--mantine-scale));
    -webkit-margin-start: var(--mantine-spacing-xs);
            margin-inline-start: var(--mantine-spacing-xs);
  }

:where([data-mantine-color-scheme='light']) .m_2bb2e9e5::after {
      background-color: var(--mantine-color-gray-2);
}

:where([data-mantine-color-scheme='dark']) .m_2bb2e9e5::after {
      background-color: var(--mantine-color-dark-4);
}

.m_2bb2e9e5:only-child {
    display: none;
  }

/* ------- Combobox.Chevron ------- */
.m_2943220b {
  --combobox-chevron-size-xs: calc(0.875rem * var(--mantine-scale));
  --combobox-chevron-size-sm: calc(1.125rem * var(--mantine-scale));
  --combobox-chevron-size-md: calc(1.25rem * var(--mantine-scale));
  --combobox-chevron-size-lg: calc(1.5rem * var(--mantine-scale));
  --combobox-chevron-size-xl: calc(1.75rem * var(--mantine-scale));
  --combobox-chevron-size: var(--combobox-chevron-size-sm);
}
:where([data-mantine-color-scheme='light']) .m_2943220b {
    --_combobox-chevron-color: var(--combobox-chevron-color, var(--mantine-color-gray-6));
}
:where([data-mantine-color-scheme='dark']) .m_2943220b {
    --_combobox-chevron-color: var(--combobox-chevron-color, var(--mantine-color-dark-3));
}
.m_2943220b {

  width: var(--combobox-chevron-size);
  height: var(--combobox-chevron-size);
  color: var(--_combobox-chevron-color);
}
.m_2943220b:where([data-error]) {
    color: var(--combobox-chevron-color, var(--mantine-color-error));
  }

/* ------- OptionsDropdown ------- */
.m_390b5f4 {
  display: flex;
  align-items: center;
  gap: calc(0.5rem * var(--mantine-scale));
}
.m_390b5f4:where([data-reverse]) {
    justify-content: space-between;
  }

.m_8ee53fc2 {
  opacity: 0.4;
  width: 0.8em;
  min-width: 0.8em;
  height: 0.8em;
}

:where([data-combobox-selected]) .m_8ee53fc2 {
    opacity: 1;
  }

.m_5f75b09e {
  --label-lh-xs: calc(1rem * var(--mantine-scale));
  --label-lh-sm: calc(1.25rem * var(--mantine-scale));
  --label-lh-md: calc(1.5rem * var(--mantine-scale));
  --label-lh-lg: calc(1.875rem * var(--mantine-scale));
  --label-lh-xl: calc(2.25rem * var(--mantine-scale));
  --label-lh: var(--label-lh-sm);
}

  .m_5f75b09e[data-label-position='left'] {
    --label-order: 1;
    --label-offset-end: var(--mantine-spacing-sm);
    --label-offset-start: 0;
  }

  .m_5f75b09e[data-label-position='right'] {
    --label-order: 2;
    --label-offset-end: 0;
    --label-offset-start: var(--mantine-spacing-sm);
  }

.m_5f6e695e {
  display: flex;
}

.m_d3ea56bb {
  --label-cursor: var(--mantine-cursor-type);

  -webkit-tap-highlight-color: transparent;
  display: inline-flex;
  flex-direction: column;
  font-size: var(--label-fz, var(--mantine-font-size-sm));
  line-height: var(--label-lh);
  cursor: var(--label-cursor);
  order: var(--label-order);
}

fieldset:disabled .m_d3ea56bb,
  .m_d3ea56bb[data-disabled] {
    --label-cursor: not-allowed;
  }

.m_8ee546b8 {
  cursor: var(--label-cursor);
  color: inherit;
  -webkit-padding-start: var(--label-offset-start);
          padding-inline-start: var(--label-offset-start);
  -webkit-padding-end: var(--label-offset-end);
          padding-inline-end: var(--label-offset-end);
}

:where([data-mantine-color-scheme='light']) fieldset:disabled .m_8ee546b8, :where([data-mantine-color-scheme='light']) .m_8ee546b8:where([data-disabled]) {
      color: var(--mantine-color-gray-5);
}

:where([data-mantine-color-scheme='dark']) fieldset:disabled .m_8ee546b8, :where([data-mantine-color-scheme='dark']) .m_8ee546b8:where([data-disabled]) {
      color: var(--mantine-color-dark-3);
}

.m_328f68c0 {
  margin-top: calc(var(--mantine-spacing-xs) / 2);
  -webkit-padding-start: var(--label-offset-start);
          padding-inline-start: var(--label-offset-start);
  -webkit-padding-end: var(--label-offset-end);
          padding-inline-end: var(--label-offset-end);
}

.m_8e8a99cc {
  margin-top: calc(var(--mantine-spacing-xs) / 2);
  -webkit-padding-start: var(--label-offset-start);
          padding-inline-start: var(--label-offset-start);
  -webkit-padding-end: var(--label-offset-end);
          padding-inline-end: var(--label-offset-end);
}

.m_26775b0a {
  --card-radius: var(--mantine-radius-default);

  display: block;
  width: 100%;
  border-radius: var(--card-radius);
  cursor: pointer;
}

  .m_26775b0a :where(*) {
    cursor: inherit;
  }

  .m_26775b0a:where([data-with-border]) {
    border: calc(0.0625rem * var(--mantine-scale)) solid transparent;
  }

  :where([data-mantine-color-scheme='light']) .m_26775b0a:where([data-with-border]) {
      border-color: var(--mantine-color-gray-3);
}

  :where([data-mantine-color-scheme='dark']) .m_26775b0a:where([data-with-border]) {
      border-color: var(--mantine-color-dark-4);
}

.m_5e5256ee {
  --checkbox-size-xs: calc(1rem * var(--mantine-scale));
  --checkbox-size-sm: calc(1.25rem * var(--mantine-scale));
  --checkbox-size-md: calc(1.5rem * var(--mantine-scale));
  --checkbox-size-lg: calc(1.875rem * var(--mantine-scale));
  --checkbox-size-xl: calc(2.25rem * var(--mantine-scale));

  --checkbox-size: var(--checkbox-size-sm);
  --checkbox-color: var(--mantine-primary-color-filled);
  --checkbox-icon-color: var(--mantine-color-white);

  position: relative;
  border: calc(0.0625rem * var(--mantine-scale)) solid transparent;
  width: var(--checkbox-size);
  min-width: var(--checkbox-size);
  height: var(--checkbox-size);
  min-height: var(--checkbox-size);
  border-radius: var(--checkbox-radius, var(--mantine-radius-default));
  transition:
    border-color 100ms ease,
    background-color 100ms ease;
  cursor: var(--mantine-cursor-type);
  -webkit-tap-highlight-color: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
}

  :where([data-mantine-color-scheme='light']) .m_5e5256ee {
    background-color: var(--mantine-color-white);
    border-color: var(--mantine-color-gray-4);
}

  :where([data-mantine-color-scheme='dark']) .m_5e5256ee {
    background-color: var(--mantine-color-dark-6);
    border-color: var(--mantine-color-dark-4);
}

  .m_5e5256ee[data-indeterminate],
  .m_5e5256ee[data-checked] {
    background-color: var(--checkbox-color);
    border-color: var(--checkbox-color);
  }

  .m_5e5256ee[data-indeterminate] > .m_1b1c543a, .m_5e5256ee[data-checked] > .m_1b1c543a {
      opacity: 1;
      transform: none;
      color: var(--checkbox-icon-color);
    }

  .m_5e5256ee[data-disabled] {
    cursor: not-allowed;
  }

  :where([data-mantine-color-scheme='light']) .m_5e5256ee[data-disabled] {
      background-color: var(--mantine-color-gray-2);
      border-color: var(--mantine-color-gray-3);
}

  :where([data-mantine-color-scheme='dark']) .m_5e5256ee[data-disabled] {
      background-color: var(--mantine-color-dark-6);
      border-color: var(--mantine-color-dark-6);
}

  [data-mantine-color-scheme='light'] .m_5e5256ee[data-disabled][data-checked] > .m_1b1c543a {
        color: var(--mantine-color-gray-5);
}

  [data-mantine-color-scheme='dark'] .m_5e5256ee[data-disabled][data-checked] > .m_1b1c543a {
        color: var(--mantine-color-dark-3);
}

.m_76e20374[data-indeterminate]:not([data-disabled]),
  .m_76e20374[data-checked]:not([data-disabled]) {
    background-color: transparent;
    border-color: var(--checkbox-color);
  }

.m_76e20374[data-indeterminate]:not([data-disabled]) > .m_1b1c543a, .m_76e20374[data-checked]:not([data-disabled]) > .m_1b1c543a {
      color: var(--checkbox-color);
      opacity: 1;
      transform: none;
    }

.m_1b1c543a {
  display: block;
  width: 60%;
  color: transparent;
  pointer-events: none;
  transform: translateY(calc(0.3125rem * var(--mantine-scale))) scale(0.5);
  opacity: 1;
  transition:
    transform 100ms ease,
    opacity 100ms ease;
}

.m_bf2d988c {
  --checkbox-size-xs: calc(1rem * var(--mantine-scale));
  --checkbox-size-sm: calc(1.25rem * var(--mantine-scale));
  --checkbox-size-md: calc(1.5rem * var(--mantine-scale));
  --checkbox-size-lg: calc(1.875rem * var(--mantine-scale));
  --checkbox-size-xl: calc(2.25rem * var(--mantine-scale));

  --checkbox-size: var(--checkbox-size-sm);
  --checkbox-color: var(--mantine-primary-color-filled);
  --checkbox-icon-color: var(--mantine-color-white);
}

.m_26062bec {
  position: relative;
  width: var(--checkbox-size);
  height: var(--checkbox-size);
  order: 1;
}

.m_26062bec:where([data-label-position='left']) {
    order: 2;
  }

.m_26063560 {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: calc(0.0625rem * var(--mantine-scale)) solid transparent;
  width: var(--checkbox-size);
  height: var(--checkbox-size);
  border-radius: var(--checkbox-radius, var(--mantine-radius-default));
  padding: 0;
  display: block;
  margin: 0;
  transition:
    border-color 100ms ease,
    background-color 100ms ease;
  cursor: var(--mantine-cursor-type);
  -webkit-tap-highlight-color: transparent;
}

:where([data-mantine-color-scheme='light']) .m_26063560 {
    background-color: var(--mantine-color-white);
    border-color: var(--mantine-color-gray-4);
}

:where([data-mantine-color-scheme='dark']) .m_26063560 {
    background-color: var(--mantine-color-dark-6);
    border-color: var(--mantine-color-dark-4);
}

.m_26063560:where([data-error]) {
    border-color: var(--mantine-color-error);
  }

.m_26063560[data-indeterminate],
  .m_26063560:checked {
    background-color: var(--checkbox-color);
    border-color: var(--checkbox-color);
  }

.m_26063560[data-indeterminate] + .m_bf295423, .m_26063560:checked + .m_bf295423 {
      opacity: 1;
      transform: none;
    }

.m_26063560:disabled {
    cursor: not-allowed;
  }

:where([data-mantine-color-scheme='light']) .m_26063560:disabled {
      background-color: var(--mantine-color-gray-2);
      border-color: var(--mantine-color-gray-3);
}

:where([data-mantine-color-scheme='dark']) .m_26063560:disabled {
      background-color: var(--mantine-color-dark-6);
      border-color: var(--mantine-color-dark-6);
}

[data-mantine-color-scheme='light'] .m_26063560:disabled + .m_bf295423 {
        color: var(--mantine-color-gray-5);
}

[data-mantine-color-scheme='dark'] .m_26063560:disabled + .m_bf295423 {
        color: var(--mantine-color-dark-3);
}

.m_215c4542 + .m_bf295423 {
    color: var(--checkbox-color);
  }

.m_215c4542[data-indeterminate]:not(:disabled),
  .m_215c4542:checked:not(:disabled) {
    background-color: transparent;
    border-color: var(--checkbox-color);
  }

.m_215c4542[data-indeterminate]:not(:disabled) + .m_bf295423, .m_215c4542:checked:not(:disabled) + .m_bf295423 {
      color: var(--checkbox-color);
      opacity: 1;
      transform: none;
    }

.m_bf295423 {
  position: absolute;
  inset: 0;
  width: 60%;
  margin: auto;
  color: var(--checkbox-icon-color);
  pointer-events: none;
  transform: translateY(calc(0.3125rem * var(--mantine-scale))) scale(0.5);
  opacity: 0;
  transition:
    transform 100ms ease,
    opacity 100ms ease;
}

/* Avatar.Group root element */
.m_11def92b {
  --ag-spacing: var(--mantine-spacing-sm);
  --ag-offset: calc(var(--ag-spacing) * -1);

  display: flex;
  -webkit-padding-start: var(--ag-spacing);
          padding-inline-start: var(--ag-spacing);
}

/* Avatar root element */
.m_f85678b6 {
  --avatar-size-xs: calc(1rem * var(--mantine-scale));
  --avatar-size-sm: calc(1.625rem * var(--mantine-scale));
  --avatar-size-md: calc(2.375rem * var(--mantine-scale));
  --avatar-size-lg: calc(3.5rem * var(--mantine-scale));
  --avatar-size-xl: calc(5.25rem * var(--mantine-scale));

  --avatar-size: var(--avatar-size-md);
  --avatar-radius: calc(62.5rem * var(--mantine-scale));
  --avatar-bg: var(--mantine-color-gray-light);
  --avatar-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;
  --avatar-color: var(--mantine-color-gray-light-color);
  --avatar-placeholder-fz: calc(var(--avatar-size) / 2.5);

  -webkit-tap-highlight-color: transparent;
  position: relative;
  display: block;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  overflow: hidden;
  border-radius: var(--avatar-radius);
  text-decoration: none;
  padding: 0;
  width: var(--avatar-size);
  height: var(--avatar-size);
  min-width: var(--avatar-size);
}
.m_f85678b6:where([data-within-group]) {
    -webkit-margin-start: var(--ag-offset);
            margin-inline-start: var(--ag-offset);
    border: 2px solid var(--mantine-color-body);
    background: var(--mantine-color-body);
  }

.m_11f8ac07 {
  object-fit: cover;
  width: 100%;
  height: 100%;
  display: block;
}

.m_104cd71f {
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  border-radius: var(--avatar-radius);
  font-size: var(--avatar-placeholder-fz);
  background: var(--avatar-bg);
  border: var(--avatar-bd);
  color: var(--avatar-color);
}

.m_104cd71f > [data-avatar-placeholder-icon] {
    width: 70%;
    height: 70%;
  }

.m_2ce0de02 {
  background-size: cover;
  background-position: center;
  display: block;
  width: 100%;
  border: 0;
  text-decoration: none;
  border-radius: var(--bi-radius, 0);
}

.m_347db0ec {
  --badge-height-xs: calc(1rem * var(--mantine-scale));
  --badge-height-sm: calc(1.125rem * var(--mantine-scale));
  --badge-height-md: calc(1.25rem * var(--mantine-scale));
  --badge-height-lg: calc(1.625rem * var(--mantine-scale));
  --badge-height-xl: calc(2rem * var(--mantine-scale));

  --badge-fz-xs: calc(0.5625rem * var(--mantine-scale));
  --badge-fz-sm: calc(0.625rem * var(--mantine-scale));
  --badge-fz-md: calc(0.6875rem * var(--mantine-scale));
  --badge-fz-lg: calc(0.8125rem * var(--mantine-scale));
  --badge-fz-xl: calc(1rem * var(--mantine-scale));

  --badge-padding-x-xs: calc(0.375rem * var(--mantine-scale));
  --badge-padding-x-sm: calc(0.5rem * var(--mantine-scale));
  --badge-padding-x-md: calc(0.625rem * var(--mantine-scale));
  --badge-padding-x-lg: calc(0.75rem * var(--mantine-scale));
  --badge-padding-x-xl: calc(1rem * var(--mantine-scale));

  --badge-height: var(--badge-height-md);
  --badge-fz: var(--badge-fz-md);
  --badge-padding-x: var(--badge-padding-x-md);
  --badge-radius: calc(62.5rem * var(--mantine-scale));
  --badge-lh: calc(var(--badge-height) - calc(0.125rem * var(--mantine-scale)));
  --badge-color: var(--mantine-color-white);
  --badge-bg: var(--mantine-primary-color-filled);
  --badge-border-width: calc(0.0625rem * var(--mantine-scale));
  --badge-bd: var(--badge-border-width) solid transparent;

  -webkit-tap-highlight-color: transparent;
  font-size: var(--badge-fz);
  border-radius: var(--badge-radius);
  height: var(--badge-height);
  line-height: var(--badge-lh);
  text-decoration: none;
  padding: 0 var(--badge-padding-x);
  display: inline-grid;
  align-items: center;
  justify-content: center;
  width: -moz-fit-content;
  width: fit-content;
  text-transform: uppercase;
  font-weight: 700;
  letter-spacing: calc(0.015625rem * var(--mantine-scale));
  cursor: default;
  text-overflow: ellipsis;
  overflow: hidden;
  color: var(--badge-color);
  background: var(--badge-bg);
  border: var(--badge-bd);
}

  .m_347db0ec:where([data-with-left-section], [data-variant='dot']) {
    grid-template-columns: auto 1fr;
  }

  .m_347db0ec:where([data-with-right-section]) {
    grid-template-columns: 1fr auto;
  }

  .m_347db0ec:where(
      [data-with-left-section][data-with-right-section],
      [data-variant='dot'][data-with-right-section]
    ) {
    grid-template-columns: auto 1fr auto;
  }

  .m_347db0ec:where([data-block]) {
    display: flex;
    width: 100%;
  }

  .m_347db0ec:where([data-circle]) {
    padding-inline: calc(0.125rem * var(--mantine-scale));
    display: flex;
    width: var(--badge-height);
  }

.m_fbd81e3d {
  --badge-dot-size: calc(var(--badge-height) / 3.4);
}

:where([data-mantine-color-scheme='light']) .m_fbd81e3d {
    background-color: var(--mantine-color-white);
    border-color: var(--mantine-color-gray-4);
    color: var(--mantine-color-black);
}

:where([data-mantine-color-scheme='dark']) .m_fbd81e3d {
    background-color: var(--mantine-color-dark-5);
    border-color: var(--mantine-color-dark-5);
    color: var(--mantine-color-white);
}

.m_fbd81e3d::before {
    content: '';
    display: block;
    width: var(--badge-dot-size);
    height: var(--badge-dot-size);
    border-radius: var(--badge-dot-size);
    background-color: var(--badge-dot-color);
    -webkit-margin-end: var(--badge-dot-size);
            margin-inline-end: var(--badge-dot-size);
  }

.m_5add502a {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: center;
  cursor: inherit;
}

.m_91fdda9b {
  --badge-section-margin: calc(var(--mantine-spacing-xs) / 2);

  display: inline-flex;
  justify-content: center;
  align-items: center;
  max-height: calc(var(--badge-height) - var(--badge-border-width) * 2);
}

.m_91fdda9b:where([data-position='left']) {
    -webkit-margin-end: var(--badge-section-margin);
            margin-inline-end: var(--badge-section-margin);
  }

.m_91fdda9b:where([data-position='right']) {
    -webkit-margin-start: var(--badge-section-margin);
            margin-inline-start: var(--badge-section-margin);
  }

.m_ddec01c0 {
  --blockquote-border: 3px solid var(--bq-bd);

  position: relative;
  margin: 0;
  -webkit-border-start: var(--blockquote-border);
          border-inline-start: var(--blockquote-border);
  border-start-end-radius: var(--bq-radius);
  border-end-end-radius: var(--bq-radius);
  padding: var(--mantine-spacing-xl) calc(2.375rem * var(--mantine-scale));
}

  :where([data-mantine-color-scheme='light']) .m_ddec01c0 {
    background-color: var(--bq-bg-light);
}

  :where([data-mantine-color-scheme='dark']) .m_ddec01c0 {
    background-color: var(--bq-bg-dark);
}

.m_dde7bd57 {
  --blockquote-icon-offset: calc(var(--bq-icon-size) / -2);

  position: absolute;
  color: var(--bq-bd);
  background-color: var(--mantine-color-body);
  display: flex;
  align-items: center;
  justify-content: center;
  top: var(--blockquote-icon-offset);
  inset-inline-start: var(--blockquote-icon-offset);
  width: var(--bq-icon-size);
  height: var(--bq-icon-size);
  border-radius: var(--bq-icon-size);
}

.m_dde51a35 {
  display: block;
  margin-top: var(--mantine-spacing-md);
  opacity: 0.6;
  font-size: 85%;
}

.m_8b3717df {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}

.m_f678d540 {
  line-height: 1;
  white-space: nowrap;
  -webkit-tap-highlight-color: transparent;
}

.m_3b8f2208 {
  margin-inline: var(--bc-separator-margin, var(--mantine-spacing-xs));
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}

:where([data-mantine-color-scheme='light']) .m_3b8f2208 {
    color: var(--mantine-color-gray-7);
}

:where([data-mantine-color-scheme='dark']) .m_3b8f2208 {
    color: var(--mantine-color-dark-2);
}

.m_fea6bf1a {
  --burger-size-xs: calc(0.75rem * var(--mantine-scale));
  --burger-size-sm: calc(1.125rem * var(--mantine-scale));
  --burger-size-md: calc(1.5rem * var(--mantine-scale));
  --burger-size-lg: calc(2.125rem * var(--mantine-scale));
  --burger-size-xl: calc(2.625rem * var(--mantine-scale));

  --burger-size: var(--burger-size-md);
  --burger-line-size: calc(var(--burger-size) / 12);

  width: calc(var(--burger-size) + var(--mantine-spacing-xs));
  height: calc(var(--burger-size) + var(--mantine-spacing-xs));
  padding: calc(var(--mantine-spacing-xs) / 2);
  cursor: pointer;
}

  :where([data-mantine-color-scheme='light']) .m_fea6bf1a {
    --burger-color: var(--mantine-color-black);
}

  :where([data-mantine-color-scheme='dark']) .m_fea6bf1a {
    --burger-color: var(--mantine-color-white);
}

.m_d4fb9cad {
  position: relative;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}

.m_d4fb9cad,
  .m_d4fb9cad::before,
  .m_d4fb9cad::after {
    display: block;
    width: var(--burger-size);
    height: var(--burger-line-size);
    background-color: var(--burger-color);
    outline: calc(0.0625rem * var(--mantine-scale)) solid transparent;
    transition-property: background-color, transform;
    transition-duration: var(--burger-transition-duration, 300ms);
    transition-timing-function: var(--burger-transition-timing-function, ease);
  }

.m_d4fb9cad::before,
  .m_d4fb9cad::after {
    position: absolute;
    content: '';
    inset-inline-start: 0;
  }

.m_d4fb9cad::before {
    top: calc(var(--burger-size) / -3);
  }

.m_d4fb9cad::after {
    top: calc(var(--burger-size) / 3);
  }

.m_d4fb9cad[data-opened] {
    background-color: transparent;
  }

.m_d4fb9cad[data-opened]::before {
      transform: translateY(calc(var(--burger-size) / 3)) rotate(45deg);
    }

.m_d4fb9cad[data-opened]::after {
      transform: translateY(calc(var(--burger-size) / -3)) rotate(-45deg);
    }

.m_77c9d27d {
  --button-height-xs: calc(1.875rem * var(--mantine-scale));
  --button-height-sm: calc(2.25rem * var(--mantine-scale));
  --button-height-md: calc(2.625rem * var(--mantine-scale));
  --button-height-lg: calc(3.125rem * var(--mantine-scale));
  --button-height-xl: calc(3.75rem * var(--mantine-scale));

  --button-height-compact-xs: calc(1.375rem * var(--mantine-scale));
  --button-height-compact-sm: calc(1.625rem * var(--mantine-scale));
  --button-height-compact-md: calc(1.875rem * var(--mantine-scale));
  --button-height-compact-lg: calc(2.125rem * var(--mantine-scale));
  --button-height-compact-xl: calc(2.5rem * var(--mantine-scale));

  --button-padding-x-xs: calc(0.875rem * var(--mantine-scale));
  --button-padding-x-sm: calc(1.125rem * var(--mantine-scale));
  --button-padding-x-md: calc(1.375rem * var(--mantine-scale));
  --button-padding-x-lg: calc(1.625rem * var(--mantine-scale));
  --button-padding-x-xl: calc(2rem * var(--mantine-scale));

  --button-padding-x-compact-xs: calc(0.4375rem * var(--mantine-scale));
  --button-padding-x-compact-sm: calc(0.5rem * var(--mantine-scale));
  --button-padding-x-compact-md: calc(0.625rem * var(--mantine-scale));
  --button-padding-x-compact-lg: calc(0.75rem * var(--mantine-scale));
  --button-padding-x-compact-xl: calc(0.875rem * var(--mantine-scale));

  --button-height: var(--button-height-sm);
  --button-padding-x: var(--button-padding-x-sm);
  --button-color: var(--mantine-color-white);

  -webkit-user-select: none;

     -moz-user-select: none;

          user-select: none;
  font-weight: 600;
  position: relative;
  line-height: 1;
  text-align: center;
  overflow: hidden;

  width: auto;
  cursor: pointer;
  display: inline-block;
  border-radius: var(--button-radius, var(--mantine-radius-default));
  font-size: var(--button-fz, var(--mantine-font-size-sm));
  background: var(--button-bg, var(--mantine-primary-color-filled));
  border: var(--button-bd, calc(0.0625rem * var(--mantine-scale)) solid transparent);
  color: var(--button-color, var(--mantine-color-white));
  height: var(--button-height, var(--button-height-sm));
  padding-inline: var(--button-padding-x, var(--button-padding-x-sm));
  vertical-align: middle;
}

  .m_77c9d27d:where([data-block]) {
    display: block;
    width: 100%;
  }

  .m_77c9d27d:where([data-with-left-section]) {
    -webkit-padding-start: calc(var(--button-padding-x) / 1.5);
            padding-inline-start: calc(var(--button-padding-x) / 1.5);
  }

  .m_77c9d27d:where([data-with-right-section]) {
    -webkit-padding-end: calc(var(--button-padding-x) / 1.5);
            padding-inline-end: calc(var(--button-padding-x) / 1.5);
  }

  .m_77c9d27d:where(:disabled:not([data-loading]), [data-disabled]:not([data-loading])) {
    cursor: not-allowed;
    border: calc(0.0625rem * var(--mantine-scale)) solid transparent;
    transform: none;
  }

  :where([data-mantine-color-scheme='light']) .m_77c9d27d:where(:disabled:not([data-loading]), [data-disabled]:not([data-loading])) {
      color: var(--mantine-color-gray-5);
      background: var(--mantine-color-gray-1);
}

  :where([data-mantine-color-scheme='dark']) .m_77c9d27d:where(:disabled:not([data-loading]), [data-disabled]:not([data-loading])) {
      color: var(--mantine-color-dark-3);
      background: var(--mantine-color-dark-6);
}

  .m_77c9d27d::before {
    content: '';
    pointer-events: none;
    position: absolute;
    inset: calc(-0.0625rem * var(--mantine-scale));
    border-radius: var(--button-radius, var(--mantine-radius-default));
    transform: translateY(-100%);
    opacity: 0;
    filter: blur(12px);
    transition:
      transform 150ms ease,
      opacity 100ms ease;
  }

  :where([data-mantine-color-scheme='light']) .m_77c9d27d::before {
      background-color: rgba(255, 255, 255, 0.15);
}

  :where([data-mantine-color-scheme='dark']) .m_77c9d27d::before {
      background-color: rgba(0, 0, 0, 0.15);
}

  .m_77c9d27d:where([data-loading]) {
    cursor: not-allowed;
    transform: none;
  }

  .m_77c9d27d:where([data-loading])::before {
      transform: translateY(0);
      opacity: 1;
    }

  .m_77c9d27d:where([data-loading]) .m_80f1301b {
      opacity: 0;
      transform: translateY(100%);
    }

  @media (hover: hover) {
    .m_77c9d27d:hover:where(:not([data-loading], :disabled, [data-disabled])) {
      background-color: var(--button-hover, var(--mantine-primary-color-filled-hover));
      color: var(--button-hover-color, var(--button-color));
    }
}

  @media (hover: none) {
    .m_77c9d27d:active:where(:not([data-loading], :disabled, [data-disabled])) {
      background-color: var(--button-hover, var(--mantine-primary-color-filled-hover));
      color: var(--button-hover-color, var(--button-color));
    }
}

.m_80f1301b {
  display: flex;
  align-items: center;
  justify-content: var(--button-justify, center);
  height: 100%;
  overflow: visible;
  transition:
    transform 150ms ease,
    opacity 100ms ease;
}

.m_811560b9 {
  white-space: nowrap;
  height: 100%;
  overflow: hidden;
  display: flex;
  align-items: center;
  opacity: 1;
}

.m_811560b9:where([data-loading]) {
    opacity: 0.2;
  }

.m_a74036a {
  display: flex;
  align-items: center;
}

.m_a74036a:where([data-position='left']) {
    -webkit-margin-end: var(--mantine-spacing-xs);
            margin-inline-end: var(--mantine-spacing-xs);
  }

.m_a74036a:where([data-position='right']) {
    -webkit-margin-start: var(--mantine-spacing-xs);
            margin-inline-start: var(--mantine-spacing-xs);
  }

.m_a25b86ee {
  position: absolute;
  left: 50%;
  top: 50%;
}

.m_80d6d844 {
  --button-border-width: calc(0.0625rem * var(--mantine-scale));
  display: flex;
}

.m_80d6d844 :where(.m_77c9d27d):focus {
      position: relative;
      z-index: 1;
    }

.m_80d6d844[data-orientation='horizontal'] {
    flex-direction: row;
  }

.m_80d6d844[data-orientation='horizontal'] .m_77c9d27d:not(:only-child):first-child, .m_80d6d844[data-orientation='horizontal'] .m_70be2a01:not(:only-child):first-child {
        border-end-end-radius: 0;
        border-start-end-radius: 0;
        border-inline-end-width: calc(var(--button-border-width) / 2);
      }

.m_80d6d844[data-orientation='horizontal'] .m_77c9d27d:not(:only-child):last-child, .m_80d6d844[data-orientation='horizontal'] .m_70be2a01:not(:only-child):last-child {
        border-end-start-radius: 0;
        border-start-start-radius: 0;
        border-inline-start-width: calc(var(--button-border-width) / 2);
      }

.m_80d6d844[data-orientation='horizontal'] .m_77c9d27d:not(:only-child):not(:first-child):not(:last-child), .m_80d6d844[data-orientation='horizontal'] .m_70be2a01:not(:only-child):not(:first-child):not(:last-child) {
        border-radius: 0;
        border-inline-width: calc(var(--button-border-width) / 2);
      }

.m_80d6d844[data-orientation='vertical'] {
    flex-direction: column;
  }

.m_80d6d844[data-orientation='vertical'] .m_77c9d27d:not(:only-child):first-child, .m_80d6d844[data-orientation='vertical'] .m_70be2a01:not(:only-child):first-child {
        border-end-start-radius: 0;
        border-end-end-radius: 0;
        border-bottom-width: calc(var(--button-border-width) / 2);
      }

.m_80d6d844[data-orientation='vertical'] .m_77c9d27d:not(:only-child):last-child, .m_80d6d844[data-orientation='vertical'] .m_70be2a01:not(:only-child):last-child {
        border-start-start-radius: 0;
        border-start-end-radius: 0;
        border-top-width: calc(var(--button-border-width) / 2);
      }

.m_80d6d844[data-orientation='vertical'] .m_77c9d27d:not(:only-child):not(:first-child):not(:last-child), .m_80d6d844[data-orientation='vertical'] .m_70be2a01:not(:only-child):not(:first-child):not(:last-child) {
        border-radius: 0;
        border-bottom-width: calc(var(--button-border-width) / 2);
        border-top-width: calc(var(--button-border-width) / 2);
      }

.m_70be2a01 {
  --section-height-xs: calc(1.875rem * var(--mantine-scale));
  --section-height-sm: calc(2.25rem * var(--mantine-scale));
  --section-height-md: calc(2.625rem * var(--mantine-scale));
  --section-height-lg: calc(3.125rem * var(--mantine-scale));
  --section-height-xl: calc(3.75rem * var(--mantine-scale));

  --section-height-compact-xs: calc(1.375rem * var(--mantine-scale));
  --section-height-compact-sm: calc(1.625rem * var(--mantine-scale));
  --section-height-compact-md: calc(1.875rem * var(--mantine-scale));
  --section-height-compact-lg: calc(2.125rem * var(--mantine-scale));
  --section-height-compact-xl: calc(2.5rem * var(--mantine-scale));

  --section-padding-x-xs: calc(0.875rem * var(--mantine-scale));
  --section-padding-x-sm: calc(1.125rem * var(--mantine-scale));
  --section-padding-x-md: calc(1.375rem * var(--mantine-scale));
  --section-padding-x-lg: calc(1.625rem * var(--mantine-scale));
  --section-padding-x-xl: calc(2rem * var(--mantine-scale));

  --section-padding-x-compact-xs: calc(0.4375rem * var(--mantine-scale));
  --section-padding-x-compact-sm: calc(0.5rem * var(--mantine-scale));
  --section-padding-x-compact-md: calc(0.625rem * var(--mantine-scale));
  --section-padding-x-compact-lg: calc(0.75rem * var(--mantine-scale));
  --section-padding-x-compact-xl: calc(0.875rem * var(--mantine-scale));

  --section-height: var(--section-height-sm);
  --section-padding-x: var(--section-padding-x-sm);
  --section-color: var(--mantine-color-white);

  font-weight: 600;
  width: auto;
  border-radius: var(--section-radius, var(--mantine-radius-default));
  font-size: var(--section-fz, var(--mantine-font-size-sm));
  background: var(--section-bg, var(--mantine-primary-color-filled));
  border: var(--section-bd, calc(0.0625rem * var(--mantine-scale)) solid transparent);
  color: var(--section-color, var(--mantine-color-white));
  height: var(--section-height, var(--section-height-sm));
  padding-inline: var(--section-padding-x, var(--section-padding-x-sm));
  vertical-align: middle;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.m_e615b15f {
  --card-padding: var(--mantine-spacing-md);

  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  padding: var(--card-padding);
  color: var(--mantine-color-text);
}

  :where([data-mantine-color-scheme='light']) .m_e615b15f {
    background-color: var(--mantine-color-white);
}

  :where([data-mantine-color-scheme='dark']) .m_e615b15f {
    background-color: var(--mantine-color-dark-6);
}

.m_599a2148 {
  display: block;
  margin-inline: calc(var(--card-padding) * -1);
}

.m_599a2148:where(:first-child) {
    margin-top: calc(var(--card-padding) * -1);
    border-top: none !important;
  }

.m_599a2148:where(:last-child) {
    margin-bottom: calc(var(--card-padding) * -1);
    border-bottom: none !important;
  }

.m_599a2148:where([data-inherit-padding]) {
    padding-inline: var(--card-padding);
  }

.m_599a2148:where([data-with-border]) {
    border-top: calc(0.0625rem * var(--mantine-scale)) solid;
    border-bottom: calc(0.0625rem * var(--mantine-scale)) solid;
  }

:where([data-mantine-color-scheme='light']) .m_599a2148 {
    border-color: var(--mantine-color-gray-3);
}

:where([data-mantine-color-scheme='dark']) .m_599a2148 {
    border-color: var(--mantine-color-dark-4);
}

.m_599a2148 + .m_599a2148 {
    border-top: none !important;
  }

.m_4451eb3a {
  display: flex;
  align-items: center;
  justify-content: center;
}

  .m_4451eb3a:where([data-inline]) {
    display: inline-flex;
  }

.m_f59ffda3 {
  --chip-size-xs: calc(1.4375rem * var(--mantine-scale));
  --chip-size-sm: calc(1.75rem * var(--mantine-scale));
  --chip-size-md: calc(2rem * var(--mantine-scale));
  --chip-size-lg: calc(2.25rem * var(--mantine-scale));
  --chip-size-xl: calc(2.5rem * var(--mantine-scale));

  --chip-icon-size-xs: calc(0.625rem * var(--mantine-scale));
  --chip-icon-size-sm: calc(0.75rem * var(--mantine-scale));
  --chip-icon-size-md: calc(0.875rem * var(--mantine-scale));
  --chip-icon-size-lg: calc(1rem * var(--mantine-scale));
  --chip-icon-size-xl: calc(1.125rem * var(--mantine-scale));

  --chip-padding-xs: calc(1rem * var(--mantine-scale));
  --chip-padding-sm: calc(1.25rem * var(--mantine-scale));
  --chip-padding-md: calc(1.5rem * var(--mantine-scale));
  --chip-padding-lg: calc(1.75rem * var(--mantine-scale));
  --chip-padding-xl: calc(2rem * var(--mantine-scale));

  --chip-checked-padding-xs: calc(0.46875rem * var(--mantine-scale));
  --chip-checked-padding-sm: calc(0.625rem * var(--mantine-scale));
  --chip-checked-padding-md: calc(0.73125rem * var(--mantine-scale));
  --chip-checked-padding-lg: calc(0.84375rem * var(--mantine-scale));
  --chip-checked-padding-xl: calc(0.98125rem * var(--mantine-scale));

  --chip-spacing-xs: calc(0.625rem * var(--mantine-scale));
  --chip-spacing-sm: calc(0.75rem * var(--mantine-scale));
  --chip-spacing-md: calc(1rem * var(--mantine-scale));
  --chip-spacing-lg: calc(1.25rem * var(--mantine-scale));
  --chip-spacing-xl: calc(1.375rem * var(--mantine-scale));

  --chip-size: var(--chip-size-sm);
  --chip-icon-size: var(--chip-icon-size-sm);
  --chip-padding: var(--chip-padding-sm);
  --chip-spacing: var(--chip-spacing-sm);
  --chip-checked-padding: var(--chip-checked-padding-sm);
  --chip-bg: var(--mantine-primary-color-filled);
  --chip-hover: var(--mantine-primary-color-filled-hover);
  --chip-color: var(--mantine-color-white);
  --chip-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;
}

.m_be049a53 {
  display: inline-flex;
  align-items: center;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  border-radius: var(--chip-radius, 1000rem);
  height: var(--chip-size);
  font-size: var(--chip-fz, var(--mantine-font-size-sm));
  line-height: calc(var(--chip-size) - calc(0.125rem * var(--mantine-scale)));
  padding-inline: var(--chip-padding);
  cursor: pointer;
  white-space: nowrap;
  -webkit-tap-highlight-color: transparent;
  border: calc(0.0625rem * var(--mantine-scale)) solid transparent;
  color: var(--mantine-color-text);
}

.m_be049a53:where([data-checked]) {
    padding: var(--chip-checked-padding);
  }

.m_be049a53:where([data-disabled]) {
    cursor: not-allowed;
  }

:where([data-mantine-color-scheme='light']) .m_be049a53:where([data-disabled]) {
      background-color: var(--mantine-color-gray-2);
      color: var(--mantine-color-gray-5);
}

:where([data-mantine-color-scheme='dark']) .m_be049a53:where([data-disabled]) {
      background-color: var(--mantine-color-dark-6);
      color: var(--mantine-color-dark-3);
}

:where([data-mantine-color-scheme='light']) .m_3904c1af:not([data-disabled]) {
    background-color: var(--mantine-color-white);
    border: 1px solid var(--mantine-color-gray-3);
}

:where([data-mantine-color-scheme='dark']) .m_3904c1af:not([data-disabled]) {
    background-color: var(--mantine-color-dark-6);
    border: 1px solid var(--mantine-color-dark-4);
}

@media (hover: hover) {
    :where([data-mantine-color-scheme='light']) .m_3904c1af:not([data-disabled]):hover {
      background-color: var(--mantine-color-gray-0);
  }

    :where([data-mantine-color-scheme='dark']) .m_3904c1af:not([data-disabled]):hover {
      background-color: var(--mantine-color-dark-5);
  }
}

@media (hover: none) {
    :where([data-mantine-color-scheme='light']) .m_3904c1af:not([data-disabled]):active {
      background-color: var(--mantine-color-gray-0);
  }

    :where([data-mantine-color-scheme='dark']) .m_3904c1af:not([data-disabled]):active {
      background-color: var(--mantine-color-dark-5);
  }
}

.m_3904c1af:not([data-disabled]):where([data-checked]) {
    --chip-icon-color: var(--chip-color);
    border: var(--chip-bd);
  }

@media (hover: hover) {

  .m_3904c1af:not([data-disabled]):where([data-checked]):hover {
      background-color: var(--chip-hover);
  }
}

@media (hover: none) {

  .m_3904c1af:not([data-disabled]):where([data-checked]):active {
      background-color: var(--chip-hover);
  }
}

.m_fa109255:not([data-disabled]),
.m_f7e165c3:not([data-disabled]) {
  border: calc(0.0625rem * var(--mantine-scale)) solid transparent;
  color: var(--mantine-color-text);
}

:where([data-mantine-color-scheme='light']) .m_fa109255:not([data-disabled]), :where([data-mantine-color-scheme='light']) .m_f7e165c3:not([data-disabled]) {
    background-color: var(--mantine-color-gray-1);
}

:where([data-mantine-color-scheme='dark']) .m_fa109255:not([data-disabled]), :where([data-mantine-color-scheme='dark']) .m_f7e165c3:not([data-disabled]) {
    background-color: var(--mantine-color-dark-5);
}

@media (hover: hover) {
    :where([data-mantine-color-scheme='light']) .m_fa109255:not([data-disabled]):hover, :where([data-mantine-color-scheme='light']) .m_f7e165c3:not([data-disabled]):hover {
      background-color: var(--mantine-color-gray-2);
  }

    :where([data-mantine-color-scheme='dark']) .m_fa109255:not([data-disabled]):hover, :where([data-mantine-color-scheme='dark']) .m_f7e165c3:not([data-disabled]):hover {
      background-color: var(--mantine-color-dark-4);
  }
}

@media (hover: none) {
    :where([data-mantine-color-scheme='light']) .m_fa109255:not([data-disabled]):active, :where([data-mantine-color-scheme='light']) .m_f7e165c3:not([data-disabled]):active {
      background-color: var(--mantine-color-gray-2);
  }

    :where([data-mantine-color-scheme='dark']) .m_fa109255:not([data-disabled]):active, :where([data-mantine-color-scheme='dark']) .m_f7e165c3:not([data-disabled]):active {
      background-color: var(--mantine-color-dark-4);
  }
}

.m_fa109255:not([data-disabled]):where([data-checked]), .m_f7e165c3:not([data-disabled]):where([data-checked]) {
    --chip-icon-color: var(--chip-color);
    color: var(--chip-color);
    background-color: var(--chip-bg);
  }

@media (hover: hover) {

  .m_fa109255:not([data-disabled]):where([data-checked]):hover, .m_f7e165c3:not([data-disabled]):where([data-checked]):hover {
      background-color: var(--chip-hover);
  }
}

@media (hover: none) {

  .m_fa109255:not([data-disabled]):where([data-checked]):active, .m_f7e165c3:not([data-disabled]):where([data-checked]):active {
      background-color: var(--chip-hover);
  }
}

.m_9ac86df9 {
  width: calc(var(--chip-icon-size) + (var(--chip-spacing) / 1.5));
  max-width: calc(var(--chip-icon-size) + (var(--chip-spacing) / 1.5));
  height: var(--chip-icon-size);
  display: flex;
  align-items: center;
  overflow: hidden;
}

.m_d6d72580 {
  width: var(--chip-icon-size);
  height: var(--chip-icon-size);
  display: block;
  color: var(--chip-icon-color, inherit);
}

.m_bde07329 {
  width: 0;
  height: 0;
  padding: 0;
  opacity: 0;
  margin: 0;
}

.m_bde07329:focus-visible + .m_be049a53 {
    outline: 2px solid var(--mantine-primary-color-filled);
    outline-offset: calc(0.125rem * var(--mantine-scale));
  }

.m_b183c0a2 {
  font-family: var(--mantine-font-family-monospace);
  line-height: var(--mantine-line-height);
  padding: 2px calc(var(--mantine-spacing-xs) / 2);
  border-radius: var(--mantine-radius-sm);
  font-size: var(--mantine-font-size-xs);
  margin: 0;
  overflow: auto;
}

  :where([data-mantine-color-scheme='light']) .m_b183c0a2 {
    background-color: var(--code-bg, var(--mantine-color-gray-1));
    color: var(--mantine-color-black);
}

  :where([data-mantine-color-scheme='dark']) .m_b183c0a2 {
    background-color: var(--code-bg, var(--mantine-color-dark-5));
    color: var(--mantine-color-white);
}

  .m_b183c0a2[data-block] {
    padding: var(--mantine-spacing-xs);
  }

.m_de3d2490 {
  --cs-size: calc(1.75rem * var(--mantine-scale));
  --cs-radius: calc(62.5rem * var(--mantine-scale));

  -webkit-tap-highlight-color: transparent;
  border: none;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  display: block;
  line-height: 1;
  position: relative;
  width: var(--cs-size);
  height: var(--cs-size);
  min-width: var(--cs-size);
  min-height: var(--cs-size);
  border-radius: var(--cs-radius);
  color: inherit;
  text-decoration: none;
}

  [data-mantine-color-scheme='light'] .m_de3d2490 {
    --alpha-overlay-color: var(--mantine-color-gray-3);
    --alpha-overlay-bg: var(--mantine-color-white);
}

  [data-mantine-color-scheme='dark'] .m_de3d2490 {
    --alpha-overlay-color: var(--mantine-color-dark-4);
    --alpha-overlay-bg: var(--mantine-color-dark-7);
}

.m_862f3d1b {
  position: absolute;
  inset: 0;
  border-radius: var(--cs-radius);
}

.m_98ae7f22 {
  position: absolute;
  inset: 0;
  border-radius: var(--cs-radius);
  z-index: 1;
  box-shadow:
    rgba(0, 0, 0, 0.1) 0 0 0 calc(0.0625rem * var(--mantine-scale)) inset,
    rgb(0, 0, 0, 0.15) 0 0 calc(0.25rem * var(--mantine-scale)) inset;
}

.m_95709ac0 {
  position: absolute;
  inset: 0;
  border-radius: var(--cs-radius);
  background-size: calc(0.5rem * var(--mantine-scale)) calc(0.5rem * var(--mantine-scale));
  background-position:
    0 0,
    0 calc(0.25rem * var(--mantine-scale)),
    calc(0.25rem * var(--mantine-scale)) calc(-0.25rem * var(--mantine-scale)),
    calc(-0.25rem * var(--mantine-scale)) 0;
  background-image: linear-gradient(45deg, var(--alpha-overlay-color) 25%, transparent 25%),
    linear-gradient(-45deg, var(--alpha-overlay-color) 25%, transparent 25%),
    linear-gradient(45deg, transparent 75%, var(--alpha-overlay-color) 75%),
    linear-gradient(-45deg, var(--alpha-overlay-bg) 75%, var(--alpha-overlay-color) 75%);
}

.m_93e74e3 {
  position: absolute;
  inset: 0;
  border-radius: var(--cs-radius);
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
}

.m_fee9c77 {
  --cp-width-xs: calc(11.25rem * var(--mantine-scale));
  --cp-width-sm: calc(12.5rem * var(--mantine-scale));
  --cp-width-md: calc(15rem * var(--mantine-scale));
  --cp-width-lg: calc(17.5rem * var(--mantine-scale));
  --cp-width-xl: calc(20rem * var(--mantine-scale));

  --cp-preview-size-xs: calc(1.625rem * var(--mantine-scale));
  --cp-preview-size-sm: calc(2.125rem * var(--mantine-scale));
  --cp-preview-size-md: calc(2.625rem * var(--mantine-scale));
  --cp-preview-size-lg: calc(3.125rem * var(--mantine-scale));
  --cp-preview-size-xl: calc(3.375rem * var(--mantine-scale));

  --cp-thumb-size-xs: calc(0.5rem * var(--mantine-scale));
  --cp-thumb-size-sm: calc(0.75rem * var(--mantine-scale));
  --cp-thumb-size-md: calc(1rem * var(--mantine-scale));
  --cp-thumb-size-lg: calc(1.25rem * var(--mantine-scale));
  --cp-thumb-size-xl: calc(1.375rem * var(--mantine-scale));

  --cp-saturation-height-xs: calc(6.25rem * var(--mantine-scale));
  --cp-saturation-height-sm: calc(6.875rem * var(--mantine-scale));
  --cp-saturation-height-md: calc(7.5rem * var(--mantine-scale));
  --cp-saturation-height-lg: calc(8.75rem * var(--mantine-scale));
  --cp-saturation-height-xl: calc(10rem * var(--mantine-scale));

  --cp-preview-size: var(--cp-preview-size-sm);
  --cp-thumb-size: var(--cp-thumb-size-sm);
  --cp-saturation-height: var(--cp-saturation-height-sm);
  --cp-width: var(--cp-width-sm);
  --cp-body-spacing: var(--mantine-spacing-sm);

  width: var(--cp-width);
  padding: calc(0.0625rem * var(--mantine-scale));
}

  .m_fee9c77:where([data-full-width]) {
    width: 100%;
  }

.m_9dddfbac {
  width: var(--cp-preview-size);
  height: var(--cp-preview-size);
}

.m_bffecc3e {
  display: flex;
  padding-top: calc(var(--cp-body-spacing) / 2);
}

.m_3283bb96 {
  flex: 1 1;
}

.m_3283bb96:not(:only-child) {
    -webkit-margin-end: var(--mantine-spacing-xs);
            margin-inline-end: var(--mantine-spacing-xs);
  }

.m_40d572ba {
  overflow: hidden;
  position: absolute;
  box-shadow: 0 0 1px rgba(0, 0, 0, 0.6);
  border: 2px solid var(--mantine-color-white);
  width: var(--cp-thumb-size);
  height: var(--cp-thumb-size);
  border-radius: var(--cp-thumb-size);
  left: calc(var(--thumb-x-offset) - var(--cp-thumb-size) / 2);
  top: calc(var(--thumb-y-offset) - var(--cp-thumb-size) / 2);
}

.m_d8ee6fd8 {
  height: unset !important;
  width: unset !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: calc(0.125rem * var(--mantine-scale));
  cursor: pointer;
  padding-bottom: calc(var(--cp-swatch-size) - calc(0.25rem * var(--mantine-scale)));
  flex: 0 0 calc(var(--cp-swatch-size) - calc(0.25rem * var(--mantine-scale)));
}

.m_5711e686 {
  margin-top: calc(0.3125rem * var(--mantine-scale));
  margin-inline: calc(-0.125rem * var(--mantine-scale));
  display: flex;
  flex-wrap: wrap;
}

.m_202a296e {
  --cp-thumb-size-xs: calc(0.5rem * var(--mantine-scale));
  --cp-thumb-size-sm: calc(0.75rem * var(--mantine-scale));
  --cp-thumb-size-md: calc(1rem * var(--mantine-scale));
  --cp-thumb-size-lg: calc(1.25rem * var(--mantine-scale));
  --cp-thumb-size-xl: calc(1.375rem * var(--mantine-scale));

  -webkit-tap-highlight-color: transparent;
  position: relative;
  height: var(--cp-saturation-height);
  border-radius: var(--mantine-radius-sm);
  margin: calc(var(--cp-thumb-size) / 2);
}

.m_202a296e:where([data-focus-ring='auto']):focus:focus-visible .m_40d572ba {
        outline: 2px solid var(--mantine-color-blue-filled);
      }

.m_202a296e:where([data-focus-ring='always']):focus .m_40d572ba {
        outline: 2px solid var(--mantine-color-blue-filled);
      }

.m_11b3db02 {
  position: absolute;
  border-radius: var(--mantine-radius-sm);
  inset: calc(var(--cp-thumb-size) * -1 / 2 - calc(0.0625rem * var(--mantine-scale)));
}

.m_d856d47d {
  --cp-thumb-size-xs: calc(0.5rem * var(--mantine-scale));
  --cp-thumb-size-sm: calc(0.75rem * var(--mantine-scale));
  --cp-thumb-size-md: calc(1rem * var(--mantine-scale));
  --cp-thumb-size-lg: calc(1.25rem * var(--mantine-scale));
  --cp-thumb-size-xl: calc(1.375rem * var(--mantine-scale));
  --cp-thumb-size: var(--cp-thumb-size, calc(0.75rem * var(--mantine-scale)));

  position: relative;
  height: calc(var(--cp-thumb-size) + calc(0.125rem * var(--mantine-scale)));
  margin-inline: calc(var(--cp-thumb-size) / 2);
  outline: none;
}

.m_d856d47d + .m_d856d47d {
    margin-top: calc(0.375rem * var(--mantine-scale));
  }

.m_d856d47d:where([data-focus-ring='auto']):focus:focus-visible .m_40d572ba {
        outline: 2px solid var(--mantine-color-blue-filled);
      }

.m_d856d47d:where([data-focus-ring='always']):focus .m_40d572ba {
        outline: 2px solid var(--mantine-color-blue-filled);
      }

:where([data-mantine-color-scheme='light']) .m_d856d47d {
    --slider-checkers: var(--mantine-color-gray-3);
}

:where([data-mantine-color-scheme='dark']) .m_d856d47d {
    --slider-checkers: var(--mantine-color-dark-4);
}

.m_8f327113 {
  position: absolute;
  top: 0;
  bottom: 0;
  inset-inline: calc(var(--cp-thumb-size) * -1 / 2 - calc(0.0625rem * var(--mantine-scale)));
  border-radius: 10000rem;
}

.m_b077c2bc {
  --ci-eye-dropper-icon-size-xs: calc(0.875rem * var(--mantine-scale));
  --ci-eye-dropper-icon-size-sm: calc(1rem * var(--mantine-scale));
  --ci-eye-dropper-icon-size-md: calc(1.125rem * var(--mantine-scale));
  --ci-eye-dropper-icon-size-lg: calc(1.25rem * var(--mantine-scale));
  --ci-eye-dropper-icon-size-xl: calc(1.375rem * var(--mantine-scale));
  --ci-eye-dropper-icon-size: var(--ci-eye-dropper-icon-size-sm);
}

.m_c5ccdcab {
  --ci-preview-size-xs: calc(1rem * var(--mantine-scale));
  --ci-preview-size-sm: calc(1.125rem * var(--mantine-scale));
  --ci-preview-size-md: calc(1.375rem * var(--mantine-scale));
  --ci-preview-size-lg: calc(1.75rem * var(--mantine-scale));
  --ci-preview-size-xl: calc(2.25rem * var(--mantine-scale));
  --ci-preview-size: var(--ci-preview-size-sm);
}

.m_5ece2cd7 {
  padding: calc(0.5rem * var(--mantine-scale));
}

.m_7485cace {
  --container-size-xs: calc(33.75rem * var(--mantine-scale));
  --container-size-sm: calc(45rem * var(--mantine-scale));
  --container-size-md: calc(60rem * var(--mantine-scale));
  --container-size-lg: calc(71.25rem * var(--mantine-scale));
  --container-size-xl: calc(82.5rem * var(--mantine-scale));
  --container-size: var(--container-size-md);

  max-width: var(--container-size);
  padding-inline: var(--mantine-spacing-md);
  margin-inline: auto;
}

  .m_7485cace:where([data-fluid]) {
    max-width: 100%;
  }

.m_e2125a27 {
  --dialog-size-xs: calc(10rem * var(--mantine-scale));
  --dialog-size-sm: calc(12.5rem * var(--mantine-scale));
  --dialog-size-md: calc(21.25rem * var(--mantine-scale));
  --dialog-size-lg: calc(25rem * var(--mantine-scale));
  --dialog-size-xl: calc(31.25rem * var(--mantine-scale));
  --dialog-size: var(--dialog-size-md);

  position: relative;
  width: var(--dialog-size);
  max-width: calc(100vw - var(--mantine-spacing-xl) * 2);
  min-height: calc(3.125rem * var(--mantine-scale));
}

.m_5abab665 {
  position: absolute;
  top: calc(var(--mantine-spacing-md) / 2);
  inset-inline-end: calc(var(--mantine-spacing-md) / 2);
}

.m_3eebeb36 {
  --divider-size-xs: calc(0.0625rem * var(--mantine-scale));
  --divider-size-sm: calc(0.125rem * var(--mantine-scale));
  --divider-size-md: calc(0.1875rem * var(--mantine-scale));
  --divider-size-lg: calc(0.25rem * var(--mantine-scale));
  --divider-size-xl: calc(0.3125rem * var(--mantine-scale));
  --divider-size: var(--divider-size-xs);
}

  :where([data-mantine-color-scheme='light']) .m_3eebeb36 {
    --divider-color: var(--mantine-color-gray-3);
}

  :where([data-mantine-color-scheme='dark']) .m_3eebeb36 {
    --divider-color: var(--mantine-color-dark-4);
}

  .m_3eebeb36:where([data-orientation='horizontal']) {
    border-top: var(--divider-size) var(--divider-border-style, solid) var(--divider-color);
  }

  .m_3eebeb36:where([data-orientation='vertical']) {
    -webkit-border-start: var(--divider-size) var(--divider-border-style, solid) var(--divider-color);
            border-inline-start: var(--divider-size) var(--divider-border-style, solid) var(--divider-color);
    height: auto;
    align-self: stretch;
  }

  .m_3eebeb36:where([data-with-label]) {
    border: 0;
  }

.m_9e365f20 {
  display: flex;
  align-items: center;
  font-size: var(--mantine-font-size-xs);
  color: var(--mantine-color-dimmed);
  white-space: nowrap;
}

.m_9e365f20:where([data-position='left'])::before {
    display: none;
  }

.m_9e365f20:where([data-position='right'])::after {
    display: none;
  }

.m_9e365f20::before {
    content: '';
    flex: 1 1;
    height: calc(0.0625rem * var(--mantine-scale));
    border-top: var(--divider-size) var(--divider-border-style, solid) var(--divider-color);
    -webkit-margin-end: var(--mantine-spacing-xs);
            margin-inline-end: var(--mantine-spacing-xs);
  }

.m_9e365f20::after {
    content: '';
    flex: 1 1;
    height: calc(0.0625rem * var(--mantine-scale));
    border-top: var(--divider-size) var(--divider-border-style, solid) var(--divider-color);
    -webkit-margin-start: var(--mantine-spacing-xs);
            margin-inline-start: var(--mantine-spacing-xs);
  }

.m_f11b401e {
  --drawer-size-xs: calc(20rem * var(--mantine-scale));
  --drawer-size-sm: calc(23.75rem * var(--mantine-scale));
  --drawer-size-md: calc(27.5rem * var(--mantine-scale));
  --drawer-size-lg: calc(38.75rem * var(--mantine-scale));
  --drawer-size-xl: calc(48.75rem * var(--mantine-scale));
  --drawer-size: var(--drawer-size-md);
  --drawer-offset: 0rem;
}

.m_5a7c2c9 {
  z-index: 1000;
}

.m_b8a05bbd {
  flex: var(--drawer-flex, 0 0 var(--drawer-size));
  height: var(--drawer-height, calc(100% - var(--drawer-offset) * 2));
  margin: var(--drawer-offset);
  max-width: calc(100% - var(--drawer-offset) * 2);
  max-height: calc(100% - var(--drawer-offset) * 2);
  overflow-y: auto;
}

.m_b8a05bbd[data-hidden] {
    opacity: 0 !important;
    pointer-events: none;
  }

.m_31cd769a {
  display: flex;
  justify-content: var(--drawer-justify, flex-start);
  align-items: var(--drawer-align, flex-start);
}

.m_e9408a47 {
  padding: var(--mantine-spacing-lg);
  padding-top: var(--mantine-spacing-xs);
  border-radius: var(--fieldset-radius, var(--mantine-radius-default));
  min-inline-size: auto;
}

.m_84c9523a {
  border: calc(0.0625rem * var(--mantine-scale)) solid;
}

:where([data-mantine-color-scheme='light']) .m_84c9523a {
    border-color: var(--mantine-color-gray-3);
    background-color: var(--mantine-color-white);
}

:where([data-mantine-color-scheme='dark']) .m_84c9523a {
    border-color: var(--mantine-color-dark-4);
    background-color: var(--mantine-color-dark-7);
}

.m_ef274e49 {
  border: calc(0.0625rem * var(--mantine-scale)) solid;
}

:where([data-mantine-color-scheme='light']) .m_ef274e49 {
    border-color: var(--mantine-color-gray-3);
    background-color: var(--mantine-color-gray-0);
}

:where([data-mantine-color-scheme='dark']) .m_ef274e49 {
    border-color: var(--mantine-color-dark-4);
    background-color: var(--mantine-color-dark-6);
}

.m_eda993d3 {
  padding: 0;
  border: 0;
  border-radius: 0;
}

.m_90794832 {
  font-size: var(--mantine-font-size-sm);
}

.m_74ca27fe {
  padding: 0;
  margin-bottom: var(--mantine-spacing-sm);
}

.m_8478a6da {
  container: mantine-grid / inline-size;
}

.m_410352e9 {
  --grid-overflow: visible;
  --grid-margin: calc(var(--grid-gutter) / -2);
  --grid-col-padding: calc(var(--grid-gutter) / 2);

  overflow: var(--grid-overflow);
}

.m_dee7bd2f {
  width: calc(100% + var(--grid-gutter));
  display: flex;
  flex-wrap: wrap;
  justify-content: var(--grid-justify);
  align-items: var(--grid-align);
  margin: var(--grid-margin);
}

.m_96bdd299 {
  --col-flex-grow: 0;
  --col-offset: 0rem;

  flex-shrink: 0;
  order: var(--col-order);
  flex-basis: var(--col-flex-basis);
  width: var(--col-width);
  max-width: var(--col-max-width);
  flex-grow: var(--col-flex-grow);
  -webkit-margin-start: var(--col-offset);
          margin-inline-start: var(--col-offset);
  padding: var(--grid-col-padding);
}

.m_bcb3f3c2 {
  color: var(--mantine-color-black);
}

  :where([data-mantine-color-scheme='light']) .m_bcb3f3c2 {
    background-color: var(--mark-bg-light);
}

  :where([data-mantine-color-scheme='dark']) .m_bcb3f3c2 {
    background-color: var(--mark-bg-dark);
}

.m_9e117634 {
  display: block;
  flex: 0 1;
  object-fit: var(--image-object-fit, cover);
  width: 100%;
  border-radius: var(--image-radius, 0);
}

@keyframes m_885901b1 {
  0% {
    opacity: 0.6;
    transform: scale(0);
  }

  100% {
    opacity: 0;
    transform: scale(2.8);
  }
}

.m_e5262200 {
  --indicator-size: calc(0.625rem * var(--mantine-scale));
  --indicator-color: var(--mantine-primary-color-filled);

  position: relative;
  display: block;
}

.m_e5262200:where([data-inline]) {
    display: inline-block;
  }

.m_760d1fb1 {
  position: absolute;
  top: var(--indicator-top);
  left: var(--indicator-left);
  right: var(--indicator-right);
  bottom: var(--indicator-bottom);
  transform: translate(var(--indicator-translate-x), var(--indicator-translate-y));
  min-width: var(--indicator-size);
  height: var(--indicator-size);
  border-radius: var(--indicator-radius, 1000rem);
  z-index: var(--indicator-z-index, 200);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: var(--mantine-font-size-xs);
  background-color: var(--indicator-color);
  color: var(--indicator-text-color, var(--mantine-color-white));
  white-space: nowrap;
}

.m_760d1fb1::before {
    content: '';
    position: absolute;
    inset: 0;
    background-color: var(--indicator-color);
    border-radius: var(--indicator-radius, 1000rem);
    z-index: -1;
  }

.m_760d1fb1:where([data-with-label]) {
    padding-inline: calc(var(--mantine-spacing-xs) / 2);
  }

.m_760d1fb1:where([data-with-border]) {
    border: 2px solid var(--mantine-color-body);
  }

.m_760d1fb1[data-processing]::before {
      animation: m_885901b1 1000ms linear infinite;
    }

.m_dc6f14e2 {
  --kbd-fz-xs: calc(0.625rem * var(--mantine-scale));
  --kbd-fz-sm: calc(0.75rem * var(--mantine-scale));
  --kbd-fz-md: calc(0.875rem * var(--mantine-scale));
  --kbd-fz-lg: calc(1rem * var(--mantine-scale));
  --kbd-fz-xl: calc(1.25rem * var(--mantine-scale));
  --kbd-fz: var(--kbd-fz-sm);

  --kbd-padding-xs: calc(0.125rem * var(--mantine-scale)) calc(0.25rem * var(--mantine-scale));
  --kbd-padding-sm: calc(0.1875rem * var(--mantine-scale)) calc(0.3125rem * var(--mantine-scale));
  --kbd-padding-md: calc(0.25rem * var(--mantine-scale)) calc(0.4375rem * var(--mantine-scale));
  --kbd-padding-lg: calc(0.3125rem * var(--mantine-scale)) calc(0.5625rem * var(--mantine-scale));
  --kbd-padding-xl: calc(0.5rem * var(--mantine-scale)) calc(0.875rem * var(--mantine-scale));
  --kbd-padding: var(--kbd-padding-sm);

  font-family: var(--mantine-font-family-monospace);
  line-height: var(--mantine-line-height);
  font-weight: 700;
  padding: var(--kbd-padding);
  font-size: var(--kbd-fz);
  border-radius: var(--mantine-radius-sm);
  border: calc(0.0625rem * var(--mantine-scale)) solid;
  border-bottom-width: calc(0.1875rem * var(--mantine-scale));
  unicode-bidi: embed;
}

  :where([data-mantine-color-scheme='light']) .m_dc6f14e2 {
    border-color: var(--mantine-color-gray-3);
    color: var(--mantine-color-gray-7);
    background-color: var(--mantine-color-gray-0);
}

  :where([data-mantine-color-scheme='dark']) .m_dc6f14e2 {
    border-color: var(--mantine-color-dark-4);
    color: var(--mantine-color-dark-0);
    background-color: var(--mantine-color-dark-6);
}

.m_abbac491 {
  --list-fz: var(--mantine-font-size-md);
  --list-lh: var(--mantine-line-height-md);

  list-style-position: inside;
  font-size: var(--list-fz);
  line-height: var(--list-lh);
  margin: 0;
  padding: 0;
}

  .m_abbac491:where([data-with-padding]) {
    -webkit-padding-start: var(--mantine-spacing-md);
            padding-inline-start: var(--mantine-spacing-md);
  }

.m_abb6bec2 {
  white-space: nowrap;
  line-height: var(--list-lh);
}

.m_abb6bec2:where([data-with-icon]) {
    list-style: none;
  }

.m_abb6bec2:where([data-with-icon]) .m_75cd9f71 {
      --li-direction: row;
      --li-align: center;
    }

.m_abb6bec2:where(:not(:first-of-type)) {
    margin-top: var(--list-spacing, 0);
  }

.m_abb6bec2:where([data-centered]) {
    line-height: 1;
  }

.m_75cd9f71 {
  display: inline-flex;
  flex-direction: var(--li-direction, column);
  align-items: var(--li-align, flex-start);
  white-space: normal;
}

.m_60f83e5b {
  display: inline-block;
  vertical-align: middle;
  -webkit-margin-end: var(--mantine-spacing-sm);
          margin-inline-end: var(--mantine-spacing-sm);
}

.m_6e45937b {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  z-index: var(--lo-z-index);
}

.m_e8eb006c {
  position: relative;
  z-index: calc(var(--lo-z-index) + 1);
}

.m_df587f17 {
  z-index: var(--lo-z-index);
}

.m_dc9b7c9f {
  padding: calc(0.25rem * var(--mantine-scale));
}

.m_9bfac126 {
  color: var(--mantine-color-dimmed);
  font-weight: 500;
  font-size: var(--mantine-font-size-xs);
  padding: calc(var(--mantine-spacing-xs) / 2) var(--mantine-spacing-sm);
  cursor: default;
}

.m_efdf90cb {
  margin-top: calc(0.25rem * var(--mantine-scale));
  margin-bottom: calc(0.25rem * var(--mantine-scale));
  border-top: calc(0.0625rem * var(--mantine-scale)) solid;
}

:where([data-mantine-color-scheme='light']) .m_efdf90cb {
    border-color: var(--mantine-color-gray-2);
}

:where([data-mantine-color-scheme='dark']) .m_efdf90cb {
    border-color: var(--mantine-color-dark-4);
}

.m_99ac2aa1 {
  font-size: var(--mantine-font-size-sm);
  width: 100%;
  padding: calc(var(--mantine-spacing-xs) / 1.5) var(--mantine-spacing-sm);
  border-radius: var(--popover-radius, var(--mantine-radius-default));
  color: var(--menu-item-color, var(--mantine-color-text));
  display: flex;
  align-items: center;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}

.m_99ac2aa1:where([data-disabled], :disabled) {
    color: var(--mantine-color-dimmed);
    opacity: 0.6;
    cursor: not-allowed;
  }

:where([data-mantine-color-scheme='light']) .m_99ac2aa1:where([data-hovered]):where(:not(:disabled, [data-disabled])) {
        background-color: var(--menu-item-hover, var(--mantine-color-gray-1));
}

:where([data-mantine-color-scheme='dark']) .m_99ac2aa1:where([data-hovered]):where(:not(:disabled, [data-disabled])) {
        background-color: var(--menu-item-hover, var(--mantine-color-dark-4));
}

.m_5476e0d3 {
  flex: 1 1;
}

.m_8b75e504 {
  display: flex;
  justify-content: center;
  align-items: center;
}

.m_8b75e504:where([data-position='left']) {
    -webkit-margin-end: var(--mantine-spacing-xs);
            margin-inline-end: var(--mantine-spacing-xs);
  }

.m_8b75e504:where([data-position='right']) {
    -webkit-margin-start: var(--mantine-spacing-xs);
            margin-inline-start: var(--mantine-spacing-xs);
  }

.m_9df02822 {
  --modal-size-xs: calc(20rem * var(--mantine-scale));
  --modal-size-sm: calc(23.75rem * var(--mantine-scale));
  --modal-size-md: calc(27.5rem * var(--mantine-scale));
  --modal-size-lg: calc(38.75rem * var(--mantine-scale));
  --modal-size-xl: calc(48.75rem * var(--mantine-scale));
  --modal-size: var(--modal-size-md);

  --modal-y-offset: 5dvh;
  --modal-x-offset: 5vw;
}

  .m_9df02822[data-full-screen] {
    --modal-border-radius: 0 !important;
  }

  .m_9df02822[data-full-screen] .m_54c44539 {
      --modal-content-flex: 0 0 100%;
      --modal-content-max-height: auto;
      --modal-content-height: 100dvh;
    }

  .m_9df02822[data-full-screen] .m_1f958f16 {
      --modal-inner-y-offset: 0;
      --modal-inner-x-offset: 0;
    }

  .m_9df02822[data-centered] .m_1f958f16 {
      --modal-inner-align: center;
    }

.m_d0e2b9cd {
  border-start-start-radius: var(--modal-radius, var(--mantine-radius-default));
  border-start-end-radius: var(--modal-radius, var(--mantine-radius-default));
}

.m_54c44539 {
  flex: var(--modal-content-flex, 0 0 var(--modal-size));
  max-width: 100%;
  max-height: var(--modal-content-max-height, calc(100dvh - var(--modal-y-offset) * 2));
  height: var(--modal-content-height, auto);
  overflow-y: auto;
}

.m_54c44539[data-full-screen] {
    border-radius: 0;
  }

.m_54c44539[data-hidden] {
    opacity: 0 !important;
    pointer-events: none;
  }

.m_1f958f16 {
  display: flex;
  justify-content: center;
  align-items: var(--modal-inner-align, flex-start);
  padding-top: var(--modal-inner-y-offset, var(--modal-y-offset));
  padding-bottom: var(--modal-inner-y-offset, var(--modal-y-offset));
  padding-inline: var(--modal-inner-x-offset, var(--modal-x-offset));
}

.m_7cda1cd6 {
  --pill-fz-xs: calc(0.625rem * var(--mantine-scale));
  --pill-fz-sm: calc(0.75rem * var(--mantine-scale));
  --pill-fz-md: calc(0.875rem * var(--mantine-scale));
  --pill-fz-lg: calc(1rem * var(--mantine-scale));
  --pill-fz-xl: calc(1.125rem * var(--mantine-scale));

  --pill-height-xs: calc(1.125rem * var(--mantine-scale));
  --pill-height-sm: calc(1.375rem * var(--mantine-scale));
  --pill-height-md: calc(1.5625rem * var(--mantine-scale));
  --pill-height-lg: calc(1.75rem * var(--mantine-scale));
  --pill-height-xl: calc(2rem * var(--mantine-scale));

  --pill-fz: var(--pill-fz-sm);
  --pill-height: var(--pill-height-sm);

  font-size: var(--pill-fz);
  flex: 0 1;
  height: var(--pill-height);
  padding-inline: 0.8em;
  display: inline-flex;
  align-items: center;
  border-radius: var(--pill-radius, 1000rem);
  line-height: 1;
  white-space: nowrap;
  -moz-user-select: none;
       user-select: none;
  -webkit-user-select: none;
  max-width: 100%;
}

  :where([data-mantine-color-scheme='dark']) .m_7cda1cd6 {
    background-color: var(--mantine-color-dark-7);
    color: var(--mantine-color-dark-0);
}

  :where([data-mantine-color-scheme='light']) .m_7cda1cd6 {
    color: var(--mantine-color-black);
}

  .m_7cda1cd6:where([data-with-remove]:not(:has(button:disabled))) {
    -webkit-padding-end: 0;
            padding-inline-end: 0;
  }

  .m_7cda1cd6:where([data-disabled], :has(button:disabled)) {
    cursor: not-allowed;
  }

:where([data-mantine-color-scheme='light']) .m_44da308b {
    background-color: var(--mantine-color-gray-1);
}

:where([data-mantine-color-scheme='light']) .m_44da308b:where([data-disabled], :has(button:disabled)) {
      background-color: var(--mantine-color-gray-3);
    }

:where([data-mantine-color-scheme='light']) .m_e3a01f8 {
    background-color: var(--mantine-color-white);
}

:where([data-mantine-color-scheme='light']) .m_e3a01f8:where([data-disabled], :has(button:disabled)) {
      background-color: var(--mantine-color-gray-3);
    }

.m_1e0e6180 {
  cursor: inherit;
  overflow: hidden;
  height: 100%;
  line-height: var(--pill-height);
  text-overflow: ellipsis;
}

.m_ae386778 {
  color: inherit;
  font-size: inherit;
  height: 100%;
  min-height: unset;
  min-width: 2em;
  width: unset;
  border-radius: 0;
  -webkit-padding-start: 0.1em;
          padding-inline-start: 0.1em;
  -webkit-padding-end: 0.3em;
          padding-inline-end: 0.3em;
  flex: 0 1;
  border-end-end-radius: var(--pill-radius, 50%);
  border-start-end-radius: var(--pill-radius, 50%);
}

.m_7cda1cd6[data-disabled] > .m_ae386778,
  .m_ae386778:disabled {
    display: none;
    background-color: transparent;
    width: 0.8em;
    min-width: 0.8em;
    padding: 0;
    cursor: not-allowed;
  }

.m_7cda1cd6[data-disabled] > .m_ae386778 > svg, .m_ae386778:disabled > svg {
      display: none;
    }

.m_ae386778 > svg {
    pointer-events: none;
  }

.m_1dcfd90b {
  --pg-gap-xs: calc(0.375rem * var(--mantine-scale));
  --pg-gap-sm: calc(0.5rem * var(--mantine-scale));
  --pg-gap-md: calc(0.625rem * var(--mantine-scale));
  --pg-gap-lg: calc(0.75rem * var(--mantine-scale));
  --pg-gap-xl: calc(0.75rem * var(--mantine-scale));
  --pg-gap: var(--pg-gap-sm);

  display: flex;
  align-items: center;
  gap: var(--pg-gap);
  flex-wrap: wrap;
}

.m_45c4369d {
  background-color: transparent;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  min-width: calc(6.25rem * var(--mantine-scale));
  flex: 1 1;
  border: 0;
  font-size: inherit;
  height: 1.6em;
  color: inherit;
  padding: 0;
}

  .m_45c4369d::placeholder {
    color: var(--input-placeholder-color);
    opacity: 1;
  }

  .m_45c4369d:where([data-type='hidden'], [data-type='auto']) {
    height: calc(0.0625rem * var(--mantine-scale));
    width: calc(0.0625rem * var(--mantine-scale));
    top: 0;
    left: 0;
    pointer-events: none;
    position: absolute;
    opacity: 0;
  }

  .m_45c4369d:focus {
    outline: none;
  }

  .m_45c4369d:where([data-type='auto']:focus) {
    height: 1.6em;
    visibility: visible;
    opacity: 1;
    position: static;
  }

  .m_45c4369d:where([data-pointer]:not([data-disabled], :disabled)) {
    cursor: pointer;
  }

  .m_45c4369d:where([data-disabled], :disabled) {
    cursor: not-allowed;
  }

.m_f0824112 {
  --nl-bg: var(--mantine-primary-color-light);
  --nl-hover: var(--mantine-primary-color-light-hover);
  --nl-color: var(--mantine-primary-color-light-color);

  display: flex;
  align-items: center;
  width: 100%;
  padding: 8px var(--mantine-spacing-sm);
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}

  @media (hover: hover) {
    :where([data-mantine-color-scheme='light']) .m_f0824112:hover {
      background-color: var(--mantine-color-gray-0);
  }

    :where([data-mantine-color-scheme='dark']) .m_f0824112:hover {
      background-color: var(--mantine-color-dark-6);
  }
}

  @media (hover: none) {
    :where([data-mantine-color-scheme='light']) .m_f0824112:active {
      background-color: var(--mantine-color-gray-0);
  }

    :where([data-mantine-color-scheme='dark']) .m_f0824112:active {
      background-color: var(--mantine-color-dark-6);
  }
}

  .m_f0824112:where([data-disabled]) {
    opacity: 0.4;
    pointer-events: none;
  }

  .m_f0824112:where([data-active], [aria-current='page']) {
    background-color: var(--nl-bg);
    color: var(--nl-color);
  }

  @media (hover: hover) {

  .m_f0824112:where([data-active], [aria-current='page']):hover {
      background-color: var(--nl-hover);
  }
}

  @media (hover: none) {

  .m_f0824112:where([data-active], [aria-current='page']):active {
      background-color: var(--nl-hover);
  }
}

  .m_f0824112:where([data-active], [aria-current='page']) .m_57492dcc {
      --description-opacity: 0.9;
      --description-color: var(--nl-color);
    }

.m_690090b5 {
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 150ms ease;
}

.m_690090b5 > svg {
    display: block;
  }

.m_690090b5:where([data-position='left']) {
    -webkit-margin-end: var(--mantine-spacing-sm);
            margin-inline-end: var(--mantine-spacing-sm);
  }

.m_690090b5:where([data-position='right']) {
    -webkit-margin-start: var(--mantine-spacing-sm);
            margin-inline-start: var(--mantine-spacing-sm);
  }

.m_690090b5:where([data-rotate]) {
    transform: rotate(90deg);
  }

.m_1f6ac4c4 {
  font-size: var(--mantine-font-size-sm);
}

.m_f07af9d2 {
  flex: 1 1;
  overflow: hidden;
  text-overflow: ellipsis;
}

.m_f07af9d2:where([data-no-wrap]) {
    white-space: nowrap;
  }

.m_57492dcc {
  display: block;
  font-size: var(--mantine-font-size-xs);
  opacity: var(--description-opacity, 1);
  color: var(--description-color, var(--mantine-color-dimmed));
  overflow: hidden;
  text-overflow: ellipsis;
}

:where([data-no-wrap]) .m_57492dcc {
    white-space: nowrap;
  }

.m_e17b862f {
  -webkit-padding-start: var(--nl-offset, var(--mantine-spacing-lg));
          padding-inline-start: var(--nl-offset, var(--mantine-spacing-lg));
}

.m_1fd8a00b {
  transform: rotate(-90deg);
}

.m_a513464 {
  --notification-radius: var(--mantine-radius-default);
  --notification-color: var(--mantine-primary-color-filled);

  overflow: hidden;
  box-sizing: border-box;
  position: relative;
  display: flex;
  align-items: center;
  -webkit-padding-start: calc(1.375rem * var(--mantine-scale));
          padding-inline-start: calc(1.375rem * var(--mantine-scale));
  -webkit-padding-end: var(--mantine-spacing-xs);
          padding-inline-end: var(--mantine-spacing-xs);
  padding-top: var(--mantine-spacing-xs);
  padding-bottom: var(--mantine-spacing-xs);
  border-radius: var(--notification-radius);
  box-shadow: var(--mantine-shadow-lg);
}

  .m_a513464::before {
    content: '';
    display: block;
    position: absolute;
    width: calc(0.375rem * var(--mantine-scale));
    top: var(--notification-radius);
    bottom: var(--notification-radius);
    inset-inline-start: calc(0.25rem * var(--mantine-scale));
    border-radius: var(--notification-radius);
    background-color: var(--notification-color);
  }

  :where([data-mantine-color-scheme='light']) .m_a513464 {
    background-color: var(--mantine-color-white);
}

  :where([data-mantine-color-scheme='dark']) .m_a513464 {
    background-color: var(--mantine-color-dark-6);
}

  .m_a513464:where([data-with-icon]) {
    -webkit-padding-start: var(--mantine-spacing-xs);
            padding-inline-start: var(--mantine-spacing-xs);
  }

  .m_a513464:where([data-with-icon])::before {
      display: none;
    }

  :where([data-mantine-color-scheme='light']) .m_a513464:where([data-with-border]) {
      border: 1px solid var(--mantine-color-gray-3);
}

  :where([data-mantine-color-scheme='dark']) .m_a513464:where([data-with-border]) {
      border: 1px solid var(--mantine-color-dark-4);
}

.m_a4ceffb {
  box-sizing: border-box;
  -webkit-margin-end: var(--mantine-spacing-md);
          margin-inline-end: var(--mantine-spacing-md);
  width: calc(1.75rem * var(--mantine-scale));
  height: calc(1.75rem * var(--mantine-scale));
  border-radius: calc(1.75rem * var(--mantine-scale));
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--notification-color);
  color: var(--mantine-color-white);
}

.m_b0920b15 {
  -webkit-margin-end: var(--mantine-spacing-md);
          margin-inline-end: var(--mantine-spacing-md);
}

.m_a49ed24 {
  flex: 1 1;
  overflow: hidden;
  -webkit-margin-end: var(--mantine-spacing-xs);
          margin-inline-end: var(--mantine-spacing-xs);
}

.m_3feedf16 {
  margin-bottom: calc(0.125rem * var(--mantine-scale));
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: var(--mantine-font-size-sm);
  line-height: var(--mantine-line-height-sm);
  font-weight: 500;
}

:where([data-mantine-color-scheme='light']) .m_3feedf16 {
    color: var(--mantine-color-gray-9);
}

:where([data-mantine-color-scheme='dark']) .m_3feedf16 {
    color: var(--mantine-color-white);
}

.m_3d733a3a {
  font-size: var(--mantine-font-size-sm);
  line-height: var(--mantine-line-height-sm);
  overflow: hidden;
  text-overflow: ellipsis;
}

:where([data-mantine-color-scheme='light']) .m_3d733a3a {
    color: var(--mantine-color-black);
}

:where([data-mantine-color-scheme='dark']) .m_3d733a3a {
    color: var(--mantine-color-dark-0);
}

:where([data-mantine-color-scheme='light']) .m_3d733a3a:where([data-with-title]) {
      color: var(--mantine-color-gray-6);
}

:where([data-mantine-color-scheme='dark']) .m_3d733a3a:where([data-with-title]) {
      color: var(--mantine-color-dark-2);
}

@media (hover: hover) {
    :where([data-mantine-color-scheme='light']) .m_919a4d88:hover {
      background-color: var(--mantine-color-gray-0);
  }

    :where([data-mantine-color-scheme='dark']) .m_919a4d88:hover {
      background-color: var(--mantine-color-dark-8);
  }
}

@media (hover: none) {
    :where([data-mantine-color-scheme='light']) .m_919a4d88:active {
      background-color: var(--mantine-color-gray-0);
  }

    :where([data-mantine-color-scheme='dark']) .m_919a4d88:active {
      background-color: var(--mantine-color-dark-8);
  }
}

.m_e2f5cd4e {
  --ni-right-section-width-xs: calc(1.0625rem * var(--mantine-scale));
  --ni-right-section-width-sm: calc(1.5rem * var(--mantine-scale));
  --ni-right-section-width-md: calc(1.6875rem * var(--mantine-scale));
  --ni-right-section-width-lg: calc(1.9375rem * var(--mantine-scale));
  --ni-right-section-width-xl: calc(2.125rem * var(--mantine-scale));
}

.m_95e17d22 {
  --ni-chevron-size-xs: calc(0.625rem * var(--mantine-scale));
  --ni-chevron-size-sm: calc(0.875rem * var(--mantine-scale));
  --ni-chevron-size-md: calc(1rem * var(--mantine-scale));
  --ni-chevron-size-lg: calc(1.125rem * var(--mantine-scale));
  --ni-chevron-size-xl: calc(1.25rem * var(--mantine-scale));
  --ni-chevron-size: var(--ni-chevron-size-sm);

  display: flex;
  flex-direction: column;
  width: 100%;
  height: calc(var(--input-height) - calc(0.125rem * var(--mantine-scale)));
  max-width: calc(var(--ni-chevron-size) * 1.7);
  -webkit-margin-start: auto;
          margin-inline-start: auto;
}

.m_80b4b171 {
  --control-border: 1px solid var(--input-bd);
  --control-radius: calc(var(--input-radius) - calc(0.0625rem * var(--mantine-scale)));

  flex: 0 0 50%;
  width: 100%;
  padding: 0;
  height: calc(var(--input-height) / 2 - calc(0.0625rem * var(--mantine-scale)));
  -webkit-border-start: var(--control-border);
          border-inline-start: var(--control-border);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--mantine-color-text);
  background-color: transparent;
  cursor: pointer;
}

.m_80b4b171:where(:disabled) {
    background-color: transparent;
    cursor: not-allowed;
    opacity: 0.6;
  }

:where([data-mantine-color-scheme='light']) .m_80b4b171:where(:disabled) {
      color: var(--mantine-color-gray-4);
}

:where([data-mantine-color-scheme='dark']) .m_80b4b171:where(:disabled) {
      color: var(--mantine-color-dark-3);
}

.m_e2f5cd4e[data-error] :where(.m_80b4b171) {
    color: var(--mantine-color-error);
  }

@media (hover: hover) {
    :where([data-mantine-color-scheme='light']) .m_80b4b171:hover {
      background-color: var(--mantine-color-gray-0);
  }

    :where([data-mantine-color-scheme='dark']) .m_80b4b171:hover {
      background-color: var(--mantine-color-dark-4);
  }
}

@media (hover: none) {
    :where([data-mantine-color-scheme='light']) .m_80b4b171:active {
      background-color: var(--mantine-color-gray-0);
  }

    :where([data-mantine-color-scheme='dark']) .m_80b4b171:active {
      background-color: var(--mantine-color-dark-4);
  }
}

.m_80b4b171:where(:first-of-type) {
    border-radius: 0;
    border-start-end-radius: var(--control-radius);
  }

.m_80b4b171:last-of-type {
    border-radius: 0;
    border-end-end-radius: var(--control-radius);
  }

.m_4addd315 {
  --pagination-control-size-xs: calc(1.375rem * var(--mantine-scale));
  --pagination-control-size-sm: calc(1.625rem * var(--mantine-scale));
  --pagination-control-size-md: calc(2rem * var(--mantine-scale));
  --pagination-control-size-lg: calc(2.375rem * var(--mantine-scale));
  --pagination-control-size-xl: calc(2.75rem * var(--mantine-scale));
  --pagination-control-size: var(--pagination-control-size-md);
  --pagination-control-fz: var(--mantine-font-size-md);
  --pagination-active-bg: var(--mantine-primary-color-filled);
}

.m_326d024a {
  display: flex;
  align-items: center;
  justify-content: center;
  border: calc(0.0625rem * var(--mantine-scale)) solid;
  cursor: pointer;
  color: var(--mantine-color-text);
  height: var(--pagination-control-size);
  min-width: var(--pagination-control-size);
  font-size: var(--pagination-control-fz);
  line-height: 1;
  border-radius: var(--pagination-control-radius, var(--mantine-radius-default));
}

.m_326d024a:where([data-with-padding]) {
    padding: calc(var(--pagination-control-size) / 4);
  }

.m_326d024a:where(:disabled, [data-disabled]) {
    cursor: not-allowed;
    opacity: 0.4;
  }

:where([data-mantine-color-scheme='light']) .m_326d024a {
    border-color: var(--mantine-color-gray-4);
    background-color: var(--mantine-color-white);
}

@media (hover: hover) {
      :where([data-mantine-color-scheme='light']) .m_326d024a:hover:where(:not(:disabled, [data-disabled])) {
        background-color: var(--mantine-color-gray-0);
      }
}

@media (hover: none) {
      :where([data-mantine-color-scheme='light']) .m_326d024a:active:where(:not(:disabled, [data-disabled])) {
        background-color: var(--mantine-color-gray-0);
      }
}

:where([data-mantine-color-scheme='dark']) .m_326d024a {
    border-color: var(--mantine-color-dark-4);
    background-color: var(--mantine-color-dark-6);
}

@media (hover: hover) {
      :where([data-mantine-color-scheme='dark']) .m_326d024a:hover:where(:not(:disabled, [data-disabled])) {
        background-color: var(--mantine-color-dark-5);
      }
}

@media (hover: none) {
      :where([data-mantine-color-scheme='dark']) .m_326d024a:active:where(:not(:disabled, [data-disabled])) {
        background-color: var(--mantine-color-dark-5);
      }
}

.m_326d024a:where([data-active]) {
    background-color: var(--pagination-active-bg);
    border-color: var(--pagination-active-bg);
    color: var(--pagination-active-color, var(--mantine-color-white));
  }

@media (hover: hover) {

  .m_326d024a:where([data-active]):hover {
      background-color: var(--pagination-active-bg);
  }
}

@media (hover: none) {

  .m_326d024a:where([data-active]):active {
      background-color: var(--pagination-active-bg);
  }
}

.m_4ad7767d {
  height: var(--pagination-control-size);
  min-width: var(--pagination-control-size);
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}

.m_f61ca620 {
  --psi-button-size-xs: calc(1.375rem * var(--mantine-scale));
  --psi-button-size-sm: calc(1.625rem * var(--mantine-scale));
  --psi-button-size-md: calc(1.75rem * var(--mantine-scale));
  --psi-button-size-lg: calc(2rem * var(--mantine-scale));
  --psi-button-size-xl: calc(2.5rem * var(--mantine-scale));

  --psi-icon-size-xs: calc(0.75rem * var(--mantine-scale));
  --psi-icon-size-sm: calc(0.9375rem * var(--mantine-scale));
  --psi-icon-size-md: calc(1.0625rem * var(--mantine-scale));
  --psi-icon-size-lg: calc(1.1875rem * var(--mantine-scale));
  --psi-icon-size-xl: calc(1.3125rem * var(--mantine-scale));

  --psi-button-size: var(--psi-button-size-sm);
  --psi-icon-size: var(--psi-icon-size-sm);
}

.m_ccf8da4c {
  position: relative;
  overflow: hidden;
}

.m_f2d85dd2 {
  font-family: var(--mantine-font-family);
  background-color: transparent;
  border: 0;
  -webkit-padding-end: var(--input-padding-inline-end);
          padding-inline-end: var(--input-padding-inline-end);
  -webkit-padding-start: var(--input-padding-inline-start);
          padding-inline-start: var(--input-padding-inline-start);
  position: absolute;
  inset: 0;
  outline: 0;
  font-size: inherit;
  line-height: var(--mantine-line-height);
  height: 100%;
  width: 100%;
  color: inherit;
}

.m_ccf8da4c[data-disabled] .m_f2d85dd2,
  .m_f2d85dd2:disabled {
    cursor: not-allowed;
  }

.m_f2d85dd2::placeholder {
    color: var(--input-placeholder-color);
    opacity: 1;
  }

.m_f2d85dd2::-ms-reveal {
    display: none;
  }

.m_b1072d44 {
  width: var(--psi-button-size);
  height: var(--psi-button-size);
  min-width: var(--psi-button-size);
  min-height: var(--psi-button-size);
}

.m_b1072d44:disabled {
    display: none;
  }

.m_f1cb205a {
  --pin-input-size-xs: calc(1.875rem * var(--mantine-scale));
  --pin-input-size-sm: calc(2.25rem * var(--mantine-scale));
  --pin-input-size-md: calc(2.625rem * var(--mantine-scale));
  --pin-input-size-lg: calc(3.125rem * var(--mantine-scale));
  --pin-input-size-xl: calc(3.75rem * var(--mantine-scale));
  --pin-input-size: var(--pin-input-size-sm);
}

.m_cb288ead {
  width: var(--pin-input-size);
  height: var(--pin-input-size);
}

@keyframes m_81a374bd {
  0% {
    background-position: 0 0;
  }

  100% {
    background-position: calc(2.5rem * var(--mantine-scale)) 0;
  }
}

.m_db6d6462 {
  --progress-radius: var(--mantine-radius-default);
  --progress-size: var(--progress-size-md);

  --progress-size-xs: calc(0.1875rem * var(--mantine-scale));
  --progress-size-sm: calc(0.3125rem * var(--mantine-scale));
  --progress-size-md: calc(0.5rem * var(--mantine-scale));
  --progress-size-lg: calc(0.75rem * var(--mantine-scale));
  --progress-size-xl: calc(1rem * var(--mantine-scale));

  position: relative;
  height: var(--progress-size);
  border-radius: var(--progress-radius);
  overflow: hidden;
  display: flex;
}

:where([data-mantine-color-scheme='light']) .m_db6d6462 {
    background-color: var(--mantine-color-gray-2);
}

:where([data-mantine-color-scheme='dark']) .m_db6d6462 {
    background-color: var(--mantine-color-dark-4);
}

.m_2242eb65 {
  background-color: var(--progress-section-color);
  height: 100%;
  width: var(--progress-section-width);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background-size: calc(1.25rem * var(--mantine-scale)) calc(1.25rem * var(--mantine-scale));
  transition: width var(--progress-transition-duration, 100ms) ease;
}

.m_2242eb65:where([data-striped]) {
    background-image: linear-gradient(
      45deg,
      rgba(255, 255, 255, 0.15) 25%,
      transparent 25%,
      transparent 50%,
      rgba(255, 255, 255, 0.15) 50%,
      rgba(255, 255, 255, 0.15) 75%,
      transparent 75%,
      transparent
    );
  }

.m_2242eb65:where([data-animated]) {
    animation: m_81a374bd 1s linear infinite;
  }

.m_2242eb65:where(:last-of-type) {
    border-radius: 0;
    border-start-end-radius: var(--progress-radius);
    border-end-end-radius: var(--progress-radius);
  }

.m_2242eb65:where(:first-of-type) {
    border-radius: 0;
    border-start-start-radius: var(--progress-radius);
    border-end-start-radius: var(--progress-radius);
  }

.m_91e40b74 {
  color: var(--progress-label-color, var(--mantine-color-white));
  font-weight: bold;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: min(calc(var(--progress-size) * 0.65), calc(1.125rem * var(--mantine-scale)));
  line-height: 1;
  padding-inline: calc(0.25rem * var(--mantine-scale));
}

.m_9dc8ae12 {
  --card-radius: var(--mantine-radius-default);

  display: block;
  width: 100%;
  border-radius: var(--card-radius);
  cursor: pointer;
}

  .m_9dc8ae12 :where(*) {
    cursor: inherit;
  }

  .m_9dc8ae12:where([data-with-border]) {
    border: calc(0.0625rem * var(--mantine-scale)) solid transparent;
  }

  :where([data-mantine-color-scheme='light']) .m_9dc8ae12:where([data-with-border]) {
      border-color: var(--mantine-color-gray-3);
}

  :where([data-mantine-color-scheme='dark']) .m_9dc8ae12:where([data-with-border]) {
      border-color: var(--mantine-color-dark-4);
}

.m_717d7ff6 {
  --radio-size-xs: calc(1rem * var(--mantine-scale));
  --radio-size-sm: calc(1.25rem * var(--mantine-scale));
  --radio-size-md: calc(1.5rem * var(--mantine-scale));
  --radio-size-lg: calc(1.875rem * var(--mantine-scale));
  --radio-size-xl: calc(2.25rem * var(--mantine-scale));

  --radio-icon-size-xs: calc(0.375rem * var(--mantine-scale));
  --radio-icon-size-sm: calc(0.5rem * var(--mantine-scale));
  --radio-icon-size-md: calc(0.625rem * var(--mantine-scale));
  --radio-icon-size-lg: calc(0.875rem * var(--mantine-scale));
  --radio-icon-size-xl: calc(1rem * var(--mantine-scale));

  --radio-icon-size: var(--radio-icon-size-sm);
  --radio-size: var(--radio-size-sm);
  --radio-color: var(--mantine-primary-color-filled);
  --radio-icon-color: var(--mantine-color-white);

  position: relative;
  border: calc(0.0625rem * var(--mantine-scale)) solid transparent;
  width: var(--radio-size);
  min-width: var(--radio-size);
  height: var(--radio-size);
  min-height: var(--radio-size);
  border-radius: var(--radio-radius, 10000px);
  transition:
    border-color 100ms ease,
    background-color 100ms ease;
  cursor: var(--mantine-cursor-type);
  -webkit-tap-highlight-color: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
}

  :where([data-mantine-color-scheme='light']) .m_717d7ff6 {
    background-color: var(--mantine-color-white);
    border-color: var(--mantine-color-gray-4);
}

  :where([data-mantine-color-scheme='dark']) .m_717d7ff6 {
    background-color: var(--mantine-color-dark-6);
    border-color: var(--mantine-color-dark-4);
}

  .m_717d7ff6[data-indeterminate],
  .m_717d7ff6[data-checked] {
    background-color: var(--radio-color);
    border-color: var(--radio-color);
  }

  .m_717d7ff6[data-indeterminate] > .m_3e4da632, .m_717d7ff6[data-checked] > .m_3e4da632 {
      opacity: 1;
      transform: none;
      color: var(--radio-icon-color);
    }

  .m_717d7ff6[data-disabled] {
    cursor: not-allowed;
  }

  :where([data-mantine-color-scheme='light']) .m_717d7ff6[data-disabled] {
      background-color: var(--mantine-color-gray-2);
      border-color: var(--mantine-color-gray-3);
}

  :where([data-mantine-color-scheme='dark']) .m_717d7ff6[data-disabled] {
      background-color: var(--mantine-color-dark-6);
      border-color: var(--mantine-color-dark-6);
}

  [data-mantine-color-scheme='light'] .m_717d7ff6[data-disabled][data-checked] > .m_3e4da632 {
        color: var(--mantine-color-gray-5);
}

  [data-mantine-color-scheme='dark'] .m_717d7ff6[data-disabled][data-checked] > .m_3e4da632 {
        color: var(--mantine-color-dark-3);
}

.m_2980836c[data-indeterminate]:not([data-disabled]),
  .m_2980836c[data-checked]:not([data-disabled]) {
    background-color: transparent;
    border-color: var(--radio-color);
  }

.m_2980836c[data-indeterminate]:not([data-disabled]) > .m_3e4da632, .m_2980836c[data-checked]:not([data-disabled]) > .m_3e4da632 {
      color: var(--radio-color);
      opacity: 1;
      transform: none;
    }

.m_3e4da632 {
  display: block;
  width: var(--radio-icon-size);
  height: var(--radio-icon-size);
  color: transparent;
  pointer-events: none;
  transform: translateY(calc(0.3125rem * var(--mantine-scale))) scale(0.5);
  opacity: 1;
  transition:
    transform 100ms ease,
    opacity 100ms ease;
}

.m_f3f1af94 {
  --radio-size-xs: calc(1rem * var(--mantine-scale));
  --radio-size-sm: calc(1.25rem * var(--mantine-scale));
  --radio-size-md: calc(1.5rem * var(--mantine-scale));
  --radio-size-lg: calc(1.875rem * var(--mantine-scale));
  --radio-size-xl: calc(2.25rem * var(--mantine-scale));
  --radio-size: var(--radio-size-sm);

  --radio-icon-size-xs: calc(0.375rem * var(--mantine-scale));
  --radio-icon-size-sm: calc(0.5rem * var(--mantine-scale));
  --radio-icon-size-md: calc(0.625rem * var(--mantine-scale));
  --radio-icon-size-lg: calc(0.875rem * var(--mantine-scale));
  --radio-icon-size-xl: calc(1rem * var(--mantine-scale));
  --radio-icon-size: var(--radio-icon-size-sm);
  --radio-icon-color: var(--mantine-color-white);
}

.m_89c4f5e4 {
  position: relative;
  width: var(--radio-size);
  height: var(--radio-size);
  order: 1;
}

.m_89c4f5e4:where([data-label-position='left']) {
    order: 2;
  }

.m_f3ed6b2b {
  color: var(--radio-icon-color);
  opacity: var(--radio-icon-opacity, 0);
  transform: var(--radio-icon-transform, scale(0.2) translateY(calc(0.625rem * var(--mantine-scale))));
  transition:
    opacity 100ms ease,
    transform 200ms ease;
  pointer-events: none;
  width: var(--radio-icon-size);
  height: var(--radio-icon-size);
  position: absolute;
  top: calc(50% - var(--radio-icon-size) / 2);
  left: calc(50% - var(--radio-icon-size) / 2);
}

.m_8a3dbb89 {
  border: calc(0.0625rem * var(--mantine-scale)) solid;
  position: relative;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  width: var(--radio-size);
  height: var(--radio-size);
  border-radius: var(--radio-radius, var(--radio-size));
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  transition-property: background-color, border-color;
  transition-timing-function: ease;
  transition-duration: 100ms;
  cursor: var(--mantine-cursor-type);
  -webkit-tap-highlight-color: transparent;
}

:where([data-mantine-color-scheme='light']) .m_8a3dbb89 {
    background-color: var(--mantine-color-white);
    border-color: var(--mantine-color-gray-4);
}

:where([data-mantine-color-scheme='dark']) .m_8a3dbb89 {
    background-color: var(--mantine-color-dark-6);
    border-color: var(--mantine-color-dark-4);
}

.m_8a3dbb89:checked {
    background-color: var(--radio-color, var(--mantine-primary-color-filled));
    border-color: var(--radio-color, var(--mantine-primary-color-filled));
  }

.m_8a3dbb89:checked + .m_f3ed6b2b {
      --radio-icon-opacity: 1;
      --radio-icon-transform: scale(1);
    }

.m_8a3dbb89:disabled {
    cursor: not-allowed;
  }

:where([data-mantine-color-scheme='light']) .m_8a3dbb89:disabled {
      background-color: var(--mantine-color-gray-1);
      border-color: var(--mantine-color-gray-2);
}

:where([data-mantine-color-scheme='light']) .m_8a3dbb89:disabled + .m_f3ed6b2b {
        --radio-icon-color: var(--mantine-color-gray-3);
      }

:where([data-mantine-color-scheme='dark']) .m_8a3dbb89:disabled {
      background-color: var(--mantine-color-dark-5);
      border-color: var(--mantine-color-dark-4);
}

:where([data-mantine-color-scheme='dark']) .m_8a3dbb89:disabled + .m_f3ed6b2b {
        --radio-icon-color: var(--mantine-color-dark-7);
      }

.m_8a3dbb89:where([data-error]) {
    border-color: var(--mantine-color-error);
  }

.m_1bfe9d39 + .m_f3ed6b2b {
    --radio-icon-color: var(--radio-color);
  }

.m_1bfe9d39:checked:not(:disabled) {
    background-color: transparent;
    border-color: var(--radio-color);
  }

.m_1bfe9d39:checked:not(:disabled) + .m_f3ed6b2b {
      --radio-icon-color: var(--radio-color);
      --radio-icon-opacity: 1;
      --radio-icon-transform: none;
    }

.m_f8d312f2 {
  --rating-size-xs: calc(0.875rem * var(--mantine-scale));
  --rating-size-sm: calc(1.125rem * var(--mantine-scale));
  --rating-size-md: calc(1.25rem * var(--mantine-scale));
  --rating-size-lg: calc(1.75rem * var(--mantine-scale));
  --rating-size-xl: calc(2rem * var(--mantine-scale));

  display: flex;
  width: max-content;
}

  .m_f8d312f2:where(:has(input:disabled)) {
    pointer-events: none;
  }

.m_61734bb7 {
  position: relative;
  transition: transform 100ms ease;
}

.m_61734bb7:where([data-active]) {
    z-index: 1;
    transform: scale(1.1);
  }

.m_5662a89a {
  width: var(--rating-size);
  height: var(--rating-size);
  display: block;
}

:where([data-mantine-color-scheme='light']) .m_5662a89a {
    fill: var(--mantine-color-gray-3);
    stroke: var(--mantine-color-gray-3);
}

:where([data-mantine-color-scheme='dark']) .m_5662a89a {
    fill: var(--mantine-color-dark-3);
    stroke: var(--mantine-color-dark-3);
}

.m_5662a89a:where([data-filled]) {
    fill: var(--rating-color);
    stroke: var(--rating-color);
  }

.m_211007ba {
  height: 0;
  width: 0;
  position: absolute;
  overflow: hidden;
  white-space: nowrap;
  opacity: 0;
  -webkit-tap-highlight-color: transparent;
}

.m_211007ba:focus-visible + label {
    outline: 2px solid var(--mantine-primary-color-filled);
    outline-offset: calc(0.125rem * var(--mantine-scale));
  }

.m_21342ee4 {
  display: block;
  cursor: pointer;
  position: absolute;
  top: 0;
  left: 0;
  z-index: var(--rating-item-z-index, 0);
  -webkit-tap-highlight-color: transparent;
}

.m_21342ee4:where([data-read-only]) {
    cursor: default;
  }

.m_21342ee4:where(:last-of-type) {
    position: relative;
  }

.m_fae05d6a {
  -webkit-clip-path: var(--rating-symbol-clip-path);
          clip-path: var(--rating-symbol-clip-path);
}

.m_1b3c8819 {
  --tooltip-radius: var(--mantine-radius-default);

  position: absolute;
  padding: calc(var(--mantine-spacing-xs) / 2) var(--mantine-spacing-xs);
  pointer-events: none;
  font-size: var(--mantine-font-size-sm);
  white-space: nowrap;
  border-radius: var(--tooltip-radius);
}

  :where([data-mantine-color-scheme='light']) .m_1b3c8819 {
    background-color: var(--tooltip-bg, var(--mantine-color-gray-9));
    color: var(--tooltip-color, var(--mantine-color-white));
}

  :where([data-mantine-color-scheme='dark']) .m_1b3c8819 {
    background-color: var(--tooltip-bg, var(--mantine-color-gray-2));
    color: var(--tooltip-color, var(--mantine-color-black));
}

  .m_1b3c8819:where([data-multiline]) {
    white-space: normal;
  }

  .m_1b3c8819:where([data-fixed]) {
    position: fixed;
  }

.m_f898399f {
  background-color: inherit;
  border: 0;
  z-index: 1;
}

.m_b32e4812 {
  position: relative;
  width: var(--rp-size);
  height: var(--rp-size);
  min-width: var(--rp-size);
  min-height: var(--rp-size);
  --rp-transition-duration: 0ms;
}

.m_d43b5134 {
  width: var(--rp-size);
  height: var(--rp-size);
  min-width: var(--rp-size);
  min-height: var(--rp-size);
  transform: rotate(-90deg);
}

.m_b1ca1fbf {
  stroke: var(--curve-color, var(--rp-curve-root-color));
  transition:
    stroke-dashoffset var(--rp-transition-duration) ease,
    stroke-dasharray var(--rp-transition-duration) ease,
    stroke var(--rp-transition-duration);
}

[data-mantine-color-scheme='light'] .m_b1ca1fbf {
    --rp-curve-root-color: var(--mantine-color-gray-2);
}

[data-mantine-color-scheme='dark'] .m_b1ca1fbf {
    --rp-curve-root-color: var(--mantine-color-dark-4);
}

.m_b23f9dc4 {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  inset-inline: var(--rp-label-offset);
}

.m_cf365364 {
  --sc-padding-xs: calc(0.1875rem * var(--mantine-scale)) calc(0.375rem * var(--mantine-scale));
  --sc-padding-sm: calc(0.3125rem * var(--mantine-scale)) calc(0.625rem * var(--mantine-scale));
  --sc-padding-md: calc(0.4375rem * var(--mantine-scale)) calc(0.875rem * var(--mantine-scale));
  --sc-padding-lg: calc(0.5625rem * var(--mantine-scale)) calc(1rem * var(--mantine-scale));
  --sc-padding-xl: calc(0.75rem * var(--mantine-scale)) calc(1.25rem * var(--mantine-scale));

  --sc-transition-duration: 200ms;
  --sc-padding: var(--sc-padding-sm);
  --sc-transition-timing-function: ease;
  --sc-font-size: var(--mantine-font-size-sm);

  position: relative;
  display: inline-flex;
  flex-direction: row;
  width: auto;
  border-radius: var(--sc-radius, var(--mantine-radius-default));
  overflow: hidden;
  padding: calc(0.25rem * var(--mantine-scale));
}

  .m_cf365364:where([data-full-width]) {
    display: flex;
  }

  .m_cf365364:where([data-orientation='vertical']) {
    display: flex;
    flex-direction: column;
    width: max-content;
  }

  .m_cf365364:where([data-orientation='vertical']):where([data-full-width]) {
      width: auto;
    }

  :where([data-mantine-color-scheme='light']) .m_cf365364 {
    background-color: var(--mantine-color-gray-1);
}

  :where([data-mantine-color-scheme='dark']) .m_cf365364 {
    background-color: var(--mantine-color-dark-8);
}

.m_9e182ccd {
  position: absolute;
  display: block;
  z-index: 1;
  border-radius: var(--sc-radius, var(--mantine-radius-default));
}

:where([data-mantine-color-scheme='light']) .m_9e182ccd {
    box-shadow: var(--sc-shadow, none);
    background-color: var(--sc-color, var(--mantine-color-white));
}

:where([data-mantine-color-scheme='dark']) .m_9e182ccd {
    box-shadow: none;
    background-color: var(--sc-color, var(--mantine-color-dark-5));
}

.m_1738fcb2 {
  -webkit-tap-highlight-color: transparent;
  font-weight: 500;
  display: block;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  border-radius: var(--sc-radius, var(--mantine-radius-default));
  font-size: var(--sc-font-size);
  padding: var(--sc-padding);
  transition: color var(--sc-transition-duration) var(--sc-transition-timing-function);
  cursor: pointer;

  /* outline is controlled by .input */
  outline: var(--segmented-control-outline, none);
}

:where([data-mantine-color-scheme='light']) .m_1738fcb2 {
    color: var(--mantine-color-gray-7);
}

:where([data-mantine-color-scheme='dark']) .m_1738fcb2 {
    color: var(--mantine-color-dark-1);
}

.m_1738fcb2:where([data-read-only]) {
    cursor: default;
  }

fieldset:disabled .m_1738fcb2,
  .m_1738fcb2:where([data-disabled]) {
    cursor: not-allowed;
  }

:where([data-mantine-color-scheme='light']) fieldset:disabled .m_1738fcb2, :where([data-mantine-color-scheme='light']) .m_1738fcb2:where([data-disabled]) {
      color: var(--mantine-color-gray-5);
}

:where([data-mantine-color-scheme='dark']) fieldset:disabled .m_1738fcb2, :where([data-mantine-color-scheme='dark']) .m_1738fcb2:where([data-disabled]) {
      color: var(--mantine-color-dark-3);
}

:where([data-mantine-color-scheme='light']) .m_1738fcb2:where([data-active]) {
      color: var(--sc-label-color, var(--mantine-color-black));
}

:where([data-mantine-color-scheme='dark']) .m_1738fcb2:where([data-active]) {
      color: var(--sc-label-color, var(--mantine-color-white));
}

.m_cf365364:where([data-initialized]) .m_1738fcb2:where([data-active])::before {
        display: none;
      }

.m_1738fcb2:where([data-active])::before {
      content: '';
      inset: 0;
      z-index: 0;
      position: absolute;
      border-radius: var(--sc-radius, var(--mantine-radius-default));
}

:where([data-mantine-color-scheme='light']) .m_1738fcb2:where([data-active])::before {
        box-shadow: var(--sc-shadow, none);
        background-color: var(--sc-color, var(--mantine-color-white));
}

:where([data-mantine-color-scheme='dark']) .m_1738fcb2:where([data-active])::before {
        box-shadow: none;
        background-color: var(--sc-color, var(--mantine-color-dark-5));
}

@media (hover: hover) {
      :where([data-mantine-color-scheme='light']) .m_1738fcb2:where(:not([data-disabled], [data-active], [data-read-only])):hover {
        color: var(--mantine-color-black);
  }

      :where([data-mantine-color-scheme='dark']) .m_1738fcb2:where(:not([data-disabled], [data-active], [data-read-only])):hover {
        color: var(--mantine-color-white);
  }
}

@media (hover: none) {
      :where([data-mantine-color-scheme='light']) .m_1738fcb2:where(:not([data-disabled], [data-active], [data-read-only])):active {
        color: var(--mantine-color-black);
  }

      :where([data-mantine-color-scheme='dark']) .m_1738fcb2:where(:not([data-disabled], [data-active], [data-read-only])):active {
        color: var(--mantine-color-white);
  }
}

@media (hover: hover) {
      :where([data-mantine-color-scheme='light']) fieldset:disabled .m_1738fcb2:hover {
        color: var(--mantine-color-gray-5) !important;
  }

      :where([data-mantine-color-scheme='dark']) fieldset:disabled .m_1738fcb2:hover {
        color: var(--mantine-color-dark-3) !important;
  }
}

@media (hover: none) {
      :where([data-mantine-color-scheme='light']) fieldset:disabled .m_1738fcb2:active {
        color: var(--mantine-color-gray-5) !important;
  }

      :where([data-mantine-color-scheme='dark']) fieldset:disabled .m_1738fcb2:active {
        color: var(--mantine-color-dark-3) !important;
  }
}

.m_1714d588 {
  height: 0;
  width: 0;
  position: absolute;
  overflow: hidden;
  white-space: nowrap;
  opacity: 0;
}

.m_1714d588[data-focus-ring='auto']:focus:focus-visible + .m_1738fcb2 {
        --segmented-control-outline: 2px solid var(--mantine-primary-color-filled);
      }

.m_1714d588[data-focus-ring='always']:focus + .m_1738fcb2 {
        --segmented-control-outline: 2px solid var(--mantine-primary-color-filled);
      }

.m_69686b9b {
  position: relative;
  flex: 1 1;
  z-index: 2;
  transition: border-color var(--sc-transition-duration) var(--sc-transition-timing-function);
}

.m_cf365364[data-with-items-borders] :where(.m_69686b9b)::before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    inset-inline-start: 0;
    background-color: var(--separator-color);
    width: calc(0.0625rem * var(--mantine-scale));
    transition: background-color var(--sc-transition-duration) var(--sc-transition-timing-function);
  }

.m_69686b9b[data-orientation='vertical']::before {
      top: 0;
      inset-inline: 0;
      bottom: auto;
      height: calc(0.0625rem * var(--mantine-scale));
      width: auto;
    }

:where([data-mantine-color-scheme='light']) .m_69686b9b {
    --separator-color: var(--mantine-color-gray-3);
}

:where([data-mantine-color-scheme='dark']) .m_69686b9b {
    --separator-color: var(--mantine-color-dark-4);
}

.m_69686b9b:first-of-type::before {
      --separator-color: transparent;
    }

[data-mantine-color-scheme] .m_69686b9b[data-active]::before, [data-mantine-color-scheme] .m_69686b9b[data-active] + .m_69686b9b::before {
          --separator-color: transparent;
        }

.m_78882f40 {
  position: relative;
  z-index: 2;
}

.m_fa528724 {
  --scp-filled-segment-color: var(--mantine-primary-color-filled);
  --scp-transition-duration: 0ms;
  --scp-thickness: calc(0.625rem * var(--mantine-scale));
}

  :where([data-mantine-color-scheme='light']) .m_fa528724 {
    --scp-empty-segment-color: var(--mantine-color-gray-2);
}

  :where([data-mantine-color-scheme='dark']) .m_fa528724 {
    --scp-empty-segment-color: var(--mantine-color-dark-4);
}

  .m_fa528724 {

  position: relative;
  width: -moz-fit-content;
  width: fit-content;
}

.m_62e9e7e2 {
  display: block;
  transform: var(--scp-rotation);
  overflow: hidden;
}

.m_c573fb6f {
  transition:
    stroke-dashoffset var(--scp-transition-duration) ease,
    stroke-dasharray var(--scp-transition-duration) ease,
    stroke var(--scp-transition-duration);
}

.m_4fa340f2 {
  position: absolute;
  margin: 0;
  padding: 0;
  inset-inline: 0;
  text-align: center;
  z-index: 1;
}

.m_4fa340f2:where([data-position='bottom']) {
    bottom: 0;
    padding-inline: calc(var(--scp-thickness) * 2);
  }

.m_4fa340f2:where([data-position='bottom']):where([data-orientation='down']) {
      bottom: auto;
      top: 0;
    }

.m_4fa340f2:where([data-position='center']) {
    top: 50%;
    padding-inline: calc(var(--scp-thickness) * 3);
  }

.m_925c2d2c {
  container: simple-grid / inline-size;
}

.m_2415a157 {
  display: grid;
  grid-template-columns: repeat(var(--sg-cols), minmax(0, 1fr));
  grid-gap: var(--sg-spacing-y) var(--sg-spacing-x);
  gap: var(--sg-spacing-y) var(--sg-spacing-x);
}

@keyframes m_299c329c {
  0%,
  100% {
    opacity: 0.4;
  }

  50% {
    opacity: 1;
  }
}

.m_18320242 {
  height: var(--skeleton-height, auto);
  width: var(--skeleton-width, 100%);
  border-radius: var(--skeleton-radius, var(--mantine-radius-default));
  position: relative;
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
}

.m_18320242:where([data-animate])::after {
    animation: m_299c329c 1500ms linear infinite;
  }

.m_18320242:where([data-visible]) {
    overflow: hidden;
  }

.m_18320242:where([data-visible])::before {
      position: absolute;
      content: '';
      inset: 0;
      z-index: 10;
      background-color: var(--mantine-color-body);
    }

.m_18320242:where([data-visible])::after {
      position: absolute;
      content: '';
      inset: 0;
      z-index: 11;
    }

:where([data-mantine-color-scheme='light']) .m_18320242:where([data-visible])::after {
        background-color: var(--mantine-color-gray-3);
}

:where([data-mantine-color-scheme='dark']) .m_18320242:where([data-visible])::after {
        background-color: var(--mantine-color-dark-4);
}

.m_dd36362e {
  --slider-size-xs: calc(0.25rem * var(--mantine-scale));
  --slider-size-sm: calc(0.375rem * var(--mantine-scale));
  --slider-size-md: calc(0.5rem * var(--mantine-scale));
  --slider-size-lg: calc(0.625rem * var(--mantine-scale));
  --slider-size-xl: calc(0.75rem * var(--mantine-scale));

  --slider-size: var(--slider-size-md);
  --slider-radius: calc(62.5rem * var(--mantine-scale));
  --slider-color: var(--mantine-primary-color-filled);

  -webkit-tap-highlight-color: transparent;
  outline: none;
  height: calc(var(--slider-size) * 2);
  padding-inline: var(--slider-size);
  display: flex;
  flex-direction: column;
  align-items: center;
  touch-action: none;
  position: relative;
}

  [data-mantine-color-scheme='light'] .m_dd36362e {
    --slider-track-bg: var(--mantine-color-gray-2);
    --slider-track-disabled-bg: var(--mantine-color-gray-4);
}

  [data-mantine-color-scheme='dark'] .m_dd36362e {
    --slider-track-bg: var(--mantine-color-dark-4);
    --slider-track-disabled-bg: var(--mantine-color-dark-3);
}

.m_c9357328 {
  position: absolute;
  top: calc(-2.25rem * var(--mantine-scale));
  font-size: var(--mantine-font-size-xs);
  color: var(--mantine-color-white);
  padding: calc(var(--mantine-spacing-xs) / 2);
  border-radius: var(--mantine-radius-sm);
  white-space: nowrap;
  pointer-events: none;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  touch-action: none;
}

:where([data-mantine-color-scheme='light']) .m_c9357328 {
    background-color: var(--mantine-color-gray-9);
}

:where([data-mantine-color-scheme='dark']) .m_c9357328 {
    background-color: var(--mantine-color-dark-4);
}

.m_c9a9a60a {
  position: absolute;
  display: flex;
  height: var(--slider-thumb-size);
  width: var(--slider-thumb-size);
  border: calc(0.25rem * var(--mantine-scale)) solid;
  transform: translate(-50%, -50%);
  top: 50%;
  cursor: pointer;
  border-radius: var(--slider-radius);
  align-items: center;
  justify-content: center;
  transition:
    box-shadow 100ms ease,
    transform 100ms ease;
  z-index: 3;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  touch-action: none;
  outline-offset: calc(0.125rem * var(--mantine-scale));
  left: var(--slider-thumb-offset);
}

:where([dir="rtl"]) .m_c9a9a60a {
    left: auto;
    right: calc(var(--slider-thumb-offset) - var(--slider-thumb-size));
}

fieldset:disabled .m_c9a9a60a,
  .m_c9a9a60a:where([data-disabled]) {
    display: none;
  }

.m_c9a9a60a:where([data-dragging]) {
    transform: translate(-50%, -50%) scale(1.05);
    box-shadow: var(--mantine-shadow-sm);
  }

:where([data-mantine-color-scheme='light']) .m_c9a9a60a {
    color: var(--slider-color);
    border-color: var(--slider-color);
    background-color: var(--mantine-color-white);
}

:where([data-mantine-color-scheme='dark']) .m_c9a9a60a {
    color: var(--mantine-color-white);
    border-color: var(--mantine-color-white);
    background-color: var(--slider-color);
}

.m_a8645c2 {
  display: flex;
  align-items: center;
  width: 100%;
  height: calc(var(--slider-size) * 2);
  cursor: pointer;
}

fieldset:disabled .m_a8645c2,
  .m_a8645c2:where([data-disabled]) {
    cursor: not-allowed;
  }

.m_c9ade57f {
  position: relative;
  width: 100%;
  height: var(--slider-size);
}

.m_c9ade57f:where([data-inverted]:not([data-disabled])) {
    --track-bg: var(--slider-color);
  }

fieldset:disabled .m_c9ade57f:where([data-inverted]),
  .m_c9ade57f:where([data-inverted][data-disabled]) {
    --track-bg: var(--slider-track-disabled-bg);
  }

.m_c9ade57f::before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    border-radius: var(--slider-radius);
    inset-inline: calc(var(--slider-size) * -1);
    background-color: var(--track-bg, var(--slider-track-bg));
    z-index: 0;
  }

.m_38aeed47 {
  position: absolute;
  z-index: 1;
  top: 0;
  bottom: 0;
  background-color: var(--slider-color);
  border-radius: var(--slider-radius);
  width: var(--slider-bar-width);
  inset-inline-start: var(--slider-bar-offset);
}

.m_38aeed47:where([data-inverted]) {
    background-color: var(--slider-track-bg);
  }

:where([data-mantine-color-scheme='light']) fieldset:disabled .m_38aeed47:where(:not([data-inverted])), :where([data-mantine-color-scheme='light']) .m_38aeed47:where([data-disabled]:not([data-inverted])) {
      background-color: var(--mantine-color-gray-4);
}

:where([data-mantine-color-scheme='dark']) fieldset:disabled .m_38aeed47:where(:not([data-inverted])), :where([data-mantine-color-scheme='dark']) .m_38aeed47:where([data-disabled]:not([data-inverted])) {
      background-color: var(--mantine-color-dark-3);
}

.m_b7b0423a {
  position: absolute;
  inset-inline-start: calc(var(--mark-offset) - var(--slider-size) / 2);
  top: 0;
  z-index: 2;
  height: 0;
  pointer-events: none;
}

.m_dd33bc19 {
  border: calc(0.125rem * var(--mantine-scale)) solid;
  height: var(--slider-size);
  width: var(--slider-size);
  border-radius: calc(62.5rem * var(--mantine-scale));
  background-color: var(--mantine-color-white);
  pointer-events: none;
}

:where([data-mantine-color-scheme='light']) .m_dd33bc19 {
    border-color: var(--mantine-color-gray-2);
}

:where([data-mantine-color-scheme='dark']) .m_dd33bc19 {
    border-color: var(--mantine-color-dark-4);
}

.m_dd33bc19:where([data-filled]) {
    border-color: var(--slider-color);
  }

:where([data-mantine-color-scheme='light']) .m_dd33bc19:where([data-filled]):where([data-disabled]) {
        border-color: var(--mantine-color-gray-4);
}

:where([data-mantine-color-scheme='dark']) .m_dd33bc19:where([data-filled]):where([data-disabled]) {
        border-color: var(--mantine-color-dark-3);
}

.m_68c77a5b {
  transform: translate(calc(-50% + var(--slider-size) / 2), calc(var(--mantine-spacing-xs) / 2));
  font-size: var(--mantine-font-size-sm);
  white-space: nowrap;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}

:where([data-mantine-color-scheme='light']) .m_68c77a5b {
    color: var(--mantine-color-gray-6);
}

:where([data-mantine-color-scheme='dark']) .m_68c77a5b {
    color: var(--mantine-color-dark-2);
}

.m_559cce2d {
  position: relative;
}

  .m_559cce2d:where([data-has-spoiler]) {
    margin-bottom: calc(1.5rem * var(--mantine-scale));
  }

.m_b912df4e {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  transition: max-height var(--spoiler-transition-duration, 200ms) ease;
}

.m_b9131032 {
  position: absolute;
  inset-inline-start: 0;
  top: 100%;
  height: calc(1.5rem * var(--mantine-scale));
}

.m_6d731127 {
  display: flex;
  flex-direction: column;
  align-items: var(--stack-align, stretch);
  justify-content: var(--stack-justify, flex-start);
  gap: var(--stack-gap, var(--mantine-spacing-md));
}

.m_cbb4ea7e {
  --stepper-icon-size-xs: calc(2.125rem * var(--mantine-scale));
  --stepper-icon-size-sm: calc(2.25rem * var(--mantine-scale));
  --stepper-icon-size-md: calc(2.625rem * var(--mantine-scale));
  --stepper-icon-size-lg: calc(3rem * var(--mantine-scale));
  --stepper-icon-size-xl: calc(3.25rem * var(--mantine-scale));

  --stepper-icon-size: var(--stepper-icon-size-md);
  --stepper-color: var(--mantine-primary-color-filled);
  --stepper-content-padding: var(--mantine-spacing-md);
  --stepper-spacing: var(--mantine-spacing-md);
  --stepper-radius: calc(62.5rem * var(--mantine-scale));
  --stepper-fz: var(--mantine-font-size-md);
  --stepper-outline-thickness: calc(0.125rem * var(--mantine-scale));
}

  [data-mantine-color-scheme='light'] .m_cbb4ea7e {
    --stepper-outline-color: var(--mantine-color-gray-2);
}

  [data-mantine-color-scheme='dark'] .m_cbb4ea7e {
    --stepper-outline-color: var(--mantine-color-dark-5);
}

.m_aaf89d0b {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
}

.m_aaf89d0b:where([data-wrap]) {
    flex-wrap: wrap;
    gap: var(--mantine-spacing-md) 0;
  }

.m_aaf89d0b:where([data-orientation='vertical']) {
    flex-direction: column;
  }

.m_aaf89d0b:where([data-orientation='vertical']):where([data-icon-position='left']) {
      align-items: flex-start;
    }

.m_aaf89d0b:where([data-orientation='vertical']):where([data-icon-position='right']) {
      align-items: flex-end;
    }

.m_aaf89d0b:where([data-orientation='horizontal']) {
    flex-direction: row;
  }

.m_2a371ac9 {
  transition: background-color 150ms ease;
  flex: 1 1;
  height: var(--stepper-outline-thickness);
  margin-inline: var(--mantine-spacing-md);
  background-color: var(--stepper-outline-color);
}

.m_2a371ac9:where([data-active]) {
    background-color: var(--stepper-color);
  }

.m_78da155d {
  padding-top: var(--stepper-content-padding);
}

.m_cbb57068 {
  --step-color: var(--stepper-color);

  display: flex;
  cursor: default;
}

.m_cbb57068:where([data-allow-click]) {
    cursor: pointer;
  }

.m_cbb57068:where([data-icon-position='left']) {
    flex-direction: row;
  }

.m_cbb57068:where([data-icon-position='right']) {
    flex-direction: row-reverse;
  }

.m_f56b1e2c {
  align-items: center;
}

.m_833edb7e {
  --separator-spacing: calc(var(--mantine-spacing-xs) / 2);

  justify-content: flex-start;
  min-height: calc(var(--stepper-icon-size) + var(--mantine-spacing-xl) + var(--separator-spacing));
  margin-top: var(--separator-spacing);
  overflow: hidden;
}

.m_833edb7e:where(:first-of-type) {
    margin-top: 0;
  }

.m_833edb7e:where(:last-of-type) {
    min-height: auto;
  }

.m_833edb7e:where(:last-of-type) .m_6496b3f3 {
      display: none;
    }

.m_818e70b {
  position: relative;
}

.m_6496b3f3 {
  top: calc(var(--stepper-icon-size) + var(--separator-spacing));
  inset-inline-start: calc(var(--stepper-icon-size) / 2);
  height: 100vh;
  position: absolute;
  -webkit-border-start: var(--stepper-outline-thickness) solid var(--stepper-outline-color);
          border-inline-start: var(--stepper-outline-thickness) solid var(--stepper-outline-color);
}

.m_6496b3f3:where([data-active]) {
    border-color: var(--stepper-color);
  }

.m_1959ad01 {
  height: var(--stepper-icon-size);
  width: var(--stepper-icon-size);
  min-height: var(--stepper-icon-size);
  min-width: var(--stepper-icon-size);
  border-radius: var(--stepper-radius);
  font-size: var(--stepper-fz);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  font-weight: bold;
  transition:
    background-color 150ms ease,
    border-color 150ms ease;
  border: var(--stepper-outline-thickness) solid var(--stepper-outline-color);
  background-color: var(--stepper-outline-color);
}

:where([data-mantine-color-scheme='light']) .m_1959ad01 {
    color: var(--mantine-color-gray-7);
}

:where([data-mantine-color-scheme='dark']) .m_1959ad01 {
    color: var(--mantine-color-dark-1);
}

.m_1959ad01:where([data-progress]) {
    border-color: var(--step-color);
  }

.m_1959ad01:where([data-completed]) {
    color: var(--stepper-icon-color, var(--mantine-color-white));
    background-color: var(--step-color);
    border-color: var(--step-color);
  }

.m_a79331dc {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--stepper-icon-color, var(--mantine-color-white));
}

.m_1956aa2a {
  display: flex;
  flex-direction: column;
}

.m_1956aa2a:where([data-icon-position='left']) {
    -webkit-margin-start: var(--mantine-spacing-sm);
            margin-inline-start: var(--mantine-spacing-sm);
  }

.m_1956aa2a:where([data-icon-position='right']) {
    text-align: right;
    -webkit-margin-end: var(--mantine-spacing-sm);
            margin-inline-end: var(--mantine-spacing-sm);
  }

:where([dir="rtl"]) .m_1956aa2a:where([data-icon-position='right']) {
      text-align: left;
}

.m_12051f6c {
  font-weight: 500;
  font-size: var(--stepper-fz);
  line-height: 1;
}

.m_164eea74 {
  margin-top: calc(var(--stepper-spacing) / 3);
  margin-bottom: calc(var(--stepper-spacing) / 3);
  font-size: calc(var(--stepper-fz) - calc(0.125rem * var(--mantine-scale)));
  line-height: 1;
  color: var(--mantine-color-dimmed);
}

.m_5f93f3bb {
  --switch-height-xs: calc(1rem * var(--mantine-scale));
  --switch-height-sm: calc(1.25rem * var(--mantine-scale));
  --switch-height-md: calc(1.5rem * var(--mantine-scale));
  --switch-height-lg: calc(1.875rem * var(--mantine-scale));
  --switch-height-xl: calc(2.25rem * var(--mantine-scale));

  --switch-width-xs: calc(2rem * var(--mantine-scale));
  --switch-width-sm: calc(2.375rem * var(--mantine-scale));
  --switch-width-md: calc(2.875rem * var(--mantine-scale));
  --switch-width-lg: calc(3.5rem * var(--mantine-scale));
  --switch-width-xl: calc(4.5rem * var(--mantine-scale));

  --switch-thumb-size-xs: calc(0.75rem * var(--mantine-scale));
  --switch-thumb-size-sm: calc(0.875rem * var(--mantine-scale));
  --switch-thumb-size-md: calc(1.125rem * var(--mantine-scale));
  --switch-thumb-size-lg: calc(1.375rem * var(--mantine-scale));
  --switch-thumb-size-xl: calc(1.75rem * var(--mantine-scale));

  --switch-label-font-size-xs: calc(0.3125rem * var(--mantine-scale));
  --switch-label-font-size-sm: calc(0.375rem * var(--mantine-scale));
  --switch-label-font-size-md: calc(0.4375rem * var(--mantine-scale));
  --switch-label-font-size-lg: calc(0.5625rem * var(--mantine-scale));
  --switch-label-font-size-xl: calc(0.6875rem * var(--mantine-scale));

  --switch-track-label-padding-xs: calc(0.0625rem * var(--mantine-scale));
  --switch-track-label-padding-sm: calc(0.125rem * var(--mantine-scale));
  --switch-track-label-padding-md: calc(0.125rem * var(--mantine-scale));
  --switch-track-label-padding-lg: calc(0.1875rem * var(--mantine-scale));
  --switch-track-label-padding-xl: calc(0.1875rem * var(--mantine-scale));

  --switch-height: var(--switch-height-sm);
  --switch-width: var(--switch-width-sm);
  --switch-thumb-size: var(--switch-thumb-size-sm);
  --switch-label-font-size: var(--switch-label-font-size-sm);
  --switch-track-label-padding: var(--switch-track-label-padding-sm);
  --switch-radius: calc(62.5rem * var(--mantine-scale));
  --switch-color: var(--mantine-primary-color-filled);

  position: relative;
}

.m_926b4011 {
  height: 0;
  width: 0;
  opacity: 0;
  margin: 0;
  padding: 0;
  position: absolute;
  overflow: hidden;
  white-space: nowrap;
}

.m_9307d992 {
  -webkit-tap-highlight-color: transparent;
  cursor: var(--switch-cursor, var(--mantine-cursor-type));
  overflow: hidden;
  position: relative;
  border-radius: var(--switch-radius);
  background-color: var(--switch-bg);
  border: 1px solid var(--switch-bd);
  height: var(--switch-height);
  min-width: var(--switch-width);
  margin: 0;
  transition:
    background-color 150ms ease,
    border-color 150ms ease;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  display: flex;
  align-items: center;
  font-size: var(--switch-label-font-size);
  font-weight: 600;
  order: var(--switch-order, 1);
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  z-index: 0;
  line-height: 0;
  color: var(--switch-text-color);
}

.m_9307d992:where([data-without-labels]) {
    width: var(--switch-width);
  }

.m_926b4011:focus-visible + .m_9307d992 {
    outline: 2px solid var(--mantine-primary-color-filled);
    outline-offset: calc(0.125rem * var(--mantine-scale));
  }

.m_926b4011:checked + .m_9307d992 {
    --switch-bg: var(--switch-color);
    --switch-bd: var(--switch-color);
    --switch-text-color: var(--mantine-color-white);
  }

.m_926b4011:disabled + .m_9307d992,
  .m_926b4011[data-disabled] + .m_9307d992 {
    --switch-bg: var(--switch-disabled-color);
    --switch-bd: var(--switch-disabled-color);
    --switch-cursor: not-allowed;
  }

[data-mantine-color-scheme='light'] .m_9307d992 {
    --switch-bg: var(--mantine-color-gray-2);
    --switch-bd: var(--mantine-color-gray-3);
    --switch-text-color: var(--mantine-color-gray-6);
    --switch-disabled-color: var(--mantine-color-gray-2);
}

[data-mantine-color-scheme='dark'] .m_9307d992 {
    --switch-bg: var(--mantine-color-dark-6);
    --switch-bd: var(--mantine-color-dark-4);
    --switch-text-color: var(--mantine-color-dark-1);
    --switch-disabled-color: var(--mantine-color-dark-4);
}

.m_9307d992[data-error] {
    --switch-bd: var(--mantine-color-error);
  }

.m_9307d992[data-label-position='left'] {
    --switch-order: 2;
  }

.m_93039a1d {
  position: absolute;
  z-index: 1;
  border-radius: var(--switch-radius);
  display: flex;
  background-color: var(--switch-thumb-bg, var(--mantine-color-white));
  height: var(--switch-thumb-size);
  width: var(--switch-thumb-size);
  border: 1px solid var(--switch-thumb-bd);
  inset-inline-start: var(--switch-thumb-start, var(--switch-track-label-padding));
  transition: inset-inline-start 150ms ease;
}

.m_93039a1d > * {
    margin: auto;
  }

.m_926b4011:checked + * > .m_93039a1d {
    --switch-thumb-start: calc(100% - var(--switch-thumb-size) - var(--switch-track-label-padding));
    --switch-thumb-bd: var(--mantine-color-white);
  }

.m_926b4011:disabled + * > .m_93039a1d,
  .m_926b4011[data-disabled] + * > .m_93039a1d {
    --switch-thumb-bd: var(--switch-thumb-bg-disabled);
    --switch-thumb-bg: var(--switch-thumb-bg-disabled);
  }

[data-mantine-color-scheme='light'] .m_93039a1d {
    --switch-thumb-bd: var(--mantine-color-gray-3);
    --switch-thumb-bg-disabled: var(--mantine-color-gray-0);
}

[data-mantine-color-scheme='dark'] .m_93039a1d {
    --switch-thumb-bd: var(--mantine-color-white);
    --switch-thumb-bg-disabled: var(--mantine-color-dark-3);
}

.m_8277e082 {
  height: 100%;
  display: grid;
  place-content: center;
  min-width: calc(var(--switch-width) - var(--switch-thumb-size));
  padding-inline: var(--switch-track-label-padding);
  -webkit-margin-start: calc(var(--switch-thumb-size) + var(--switch-track-label-padding));
          margin-inline-start: calc(var(--switch-thumb-size) + var(--switch-track-label-padding));
  transition: margin 150ms ease;
}

.m_926b4011:checked + * > .m_8277e082 {
    -webkit-margin-end: calc(var(--switch-thumb-size) + var(--switch-track-label-padding));
            margin-inline-end: calc(var(--switch-thumb-size) + var(--switch-track-label-padding));
    -webkit-margin-start: 0;
            margin-inline-start: 0;
  }

.m_b23fa0ef {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
  line-height: var(--mantine-line-height);
  font-size: var(--mantine-font-size-sm);
  table-layout: var(--table-layout, auto);
  caption-side: var(--table-caption-side, bottom);
  border: none;
}

  :where([data-mantine-color-scheme='light']) .m_b23fa0ef {
    --table-hover-color: var(--mantine-color-gray-1);
    --table-striped-color: var(--mantine-color-gray-0);
    --table-border-color: var(--mantine-color-gray-3);
}

  :where([data-mantine-color-scheme='dark']) .m_b23fa0ef {
    --table-hover-color: var(--mantine-color-dark-5);
    --table-striped-color: var(--mantine-color-dark-6);
    --table-border-color: var(--mantine-color-dark-4);
}

  .m_b23fa0ef:where([data-with-table-border]) {
    border: calc(0.0625rem * var(--mantine-scale)) solid var(--table-border-color);
  }

  .m_b23fa0ef:where([data-tabular-nums]) {
    font-feature-settings: "tnum";
    font-variant-numeric: tabular-nums;
  }

  .m_b23fa0ef:where([data-variant='vertical']) :where(.m_4e7aa4f3) {
    font-weight: 500;
  }

  :where([data-mantine-color-scheme='light']) .m_b23fa0ef:where([data-variant='vertical']) :where(.m_4e7aa4f3) {
      background-color: var(--mantine-color-gray-0);
}

  :where([data-mantine-color-scheme='dark']) .m_b23fa0ef:where([data-variant='vertical']) :where(.m_4e7aa4f3) {
      background-color: var(--mantine-color-dark-6);
}

.m_4e7aa4f3 {
  text-align: left;
}

:where([dir="rtl"]) .m_4e7aa4f3 {
    text-align: right;
}

.m_4e7aa4fd {
  border-bottom: none;
  background-color: transparent;
}

@media (hover: hover) {
    .m_4e7aa4fd:hover:where([data-hover]) {
      background-color: var(--tr-hover-bg);
    }
}

@media (hover: none) {
    .m_4e7aa4fd:active:where([data-hover]) {
      background-color: var(--tr-hover-bg);
    }
}

.m_4e7aa4fd:where([data-with-row-border]) {
    border-bottom: calc(0.0625rem * var(--mantine-scale)) solid var(--table-border-color);
  }

.m_4e7aa4ef,
.m_4e7aa4f3 {
  padding: var(--table-vertical-spacing) var(--table-horizontal-spacing, var(--mantine-spacing-xs));
}

.m_4e7aa4ef:where([data-with-column-border]:not(:last-child)), .m_4e7aa4f3:where([data-with-column-border]:not(:last-child)) {
    -webkit-border-end: calc(0.0625rem * var(--mantine-scale)) solid var(--table-border-color);
            border-inline-end: calc(0.0625rem * var(--mantine-scale)) solid var(--table-border-color);
  }

.m_b2404537 > :where(tr):where([data-with-row-border]:last-of-type) {
      border-bottom: none;
    }

.m_b2404537 > :where(tr):where([data-striped='odd']:nth-of-type(odd)) {
      background-color: var(--table-striped-color);
    }

.m_b2404537 > :where(tr):where([data-striped='even']:nth-of-type(even)) {
      background-color: var(--table-striped-color);
    }

.m_b2404537 > :where(tr)[data-hover] {
      --tr-hover-bg: var(--table-highlight-on-hover-color, var(--table-hover-color));
    }

.m_b242d975 {
  top: var(--table-sticky-header-offset, 0);
  z-index: 3;
}

.m_b242d975:where([data-sticky]) {
    position: -webkit-sticky;
    position: sticky;
  }

.m_b242d975:where([data-sticky]) :where(.m_4e7aa4f3) {
      position: -webkit-sticky;
      position: sticky;
      top: var(--table-sticky-header-offset, 0);
      background-color: var(--mantine-color-body);
    }

:where([data-with-table-border]) .m_b242d975[data-sticky] .m_4e7aa4f3 {
  top: initial;
}

.m_9e5a3ac7 {
  color: var(--mantine-color-dimmed);
}

.m_9e5a3ac7:where([data-side='top']) {
    margin-bottom: var(--mantine-spacing-xs);
  }

.m_9e5a3ac7:where([data-side='bottom']) {
    margin-top: var(--mantine-spacing-xs);
  }

.m_a100c15 {
  overflow-x: var(--table-overflow);
}

.m_62259741 {
  min-width: var(--table-min-width);
  max-height: var(--table-max-height);
}

.m_bcaa9990 {
  display: flex;
  flex-direction: column;
  --toc-depth-offset: 0.8em;
}

.m_375a65ef {
  display: block;
  padding: 0.3em 0.8em;
  font-size: var(--toc-size, var(--mantine-font-size-md));
  border-radius: var(--toc-radius, var(--mantine-radius-default));
  padding-left: max(calc(var(--depth-offset) * var(--toc-depth-offset)), 0.8em);
}

@media (hover: hover) {
      :where([data-mantine-color-scheme='light']) .m_375a65ef:where(:hover):where(:not([data-variant='none'])) {
        background-color: var(--mantine-color-gray-1);
  }

      :where([data-mantine-color-scheme='dark']) .m_375a65ef:where(:hover):where(:not([data-variant='none'])) {
        background-color: var(--mantine-color-dark-5);
  }
}

@media (hover: none) {
      :where([data-mantine-color-scheme='light']) .m_375a65ef:where(:active):where(:not([data-variant='none'])) {
        background-color: var(--mantine-color-gray-1);
  }

      :where([data-mantine-color-scheme='dark']) .m_375a65ef:where(:active):where(:not([data-variant='none'])) {
        background-color: var(--mantine-color-dark-5);
  }
}

.m_375a65ef:where([data-active]) {
    background-color: var(--toc-bg);
    color: var(--toc-color);
  }

.m_89d60db1 {
  display: var(--tabs-display);
  flex-direction: var(--tabs-flex-direction);

  --tab-justify: flex-start;
  --tabs-list-direction: row;
  --tabs-panel-grow: unset;
  --tabs-display: block;
  --tabs-flex-direction: row;
  --tabs-list-border-width: 0;
  --tabs-list-border-size: 0 0 var(--tabs-list-border-width) 0;
  --tabs-list-gap: unset;

  --tabs-list-line-bottom: 0;
  --tabs-list-line-top: unset;
  --tabs-list-line-start: 0;
  --tabs-list-line-end: 0;

  --tab-radius: var(--tabs-radius) var(--tabs-radius) 0 0;
  --tab-border-width: 0 0 var(--tabs-list-border-width) 0;
}

  .m_89d60db1[data-inverted] {
    --tabs-list-line-bottom: unset;
    --tabs-list-line-top: 0;
    --tab-radius: 0 0 var(--tabs-radius) var(--tabs-radius);
    --tab-border-width: var(--tabs-list-border-width) 0 0 0;
  }

  .m_89d60db1[data-inverted] .m_576c9d4::before {
      top: 0;
      bottom: unset;
    }

  .m_89d60db1[data-orientation='vertical'] {
    --tabs-list-line-start: unset;
    --tabs-list-line-end: 0;
    --tabs-list-line-top: 0;
    --tabs-list-line-bottom: 0;
    --tabs-list-border-size: 0 var(--tabs-list-border-width) 0 0;
    --tab-border-width: 0 var(--tabs-list-border-width) 0 0;
    --tab-radius: var(--tabs-radius) 0 0 var(--tabs-radius);
    --tabs-list-direction: column;
    --tabs-panel-grow: 1;
    --tabs-display: flex;
  }

  [dir="rtl"] .m_89d60db1[data-orientation='vertical'] {
      --tabs-list-border-size: 0 0 0 var(--tabs-list-border-width);
      --tab-border-width: 0 0 0 var(--tabs-list-border-width);
      --tab-radius: 0 var(--tabs-radius) var(--tabs-radius) 0;
}

  .m_89d60db1[data-orientation='vertical'][data-placement='right'] {
      --tabs-flex-direction: row-reverse;
      --tabs-list-line-start: 0;
      --tabs-list-line-end: unset;
      --tabs-list-border-size: 0 0 0 var(--tabs-list-border-width);
      --tab-border-width: 0 0 0 var(--tabs-list-border-width);
      --tab-radius: 0 var(--tabs-radius) var(--tabs-radius) 0;
    }

  [dir="rtl"] .m_89d60db1[data-orientation='vertical'][data-placement='right'] {
        --tabs-list-border-size: 0 var(--tabs-list-border-width) 0 0;
        --tab-border-width: 0 var(--tabs-list-border-width) 0 0;
        --tab-radius: var(--tabs-radius) 0 0 var(--tabs-radius);
}

  [data-mantine-color-scheme='light'] .m_89d60db1 {
    --tab-border-color: var(--mantine-color-gray-3);
}

  [data-mantine-color-scheme='dark'] .m_89d60db1 {
    --tab-border-color: var(--mantine-color-dark-4);
}

  .m_89d60db1[data-orientation='horizontal'] {
    --tab-justify: center;
  }

  .m_89d60db1[data-variant='default'] {
    --tabs-list-border-width: calc(0.125rem * var(--mantine-scale));
  }

  [data-mantine-color-scheme='light'] .m_89d60db1[data-variant='default'] {
      --tab-hover-color: var(--mantine-color-gray-0);
}

  [data-mantine-color-scheme='dark'] .m_89d60db1[data-variant='default'] {
      --tab-hover-color: var(--mantine-color-dark-6);
}

  .m_89d60db1[data-variant='outline'] {
    --tabs-list-border-width: calc(0.0625rem * var(--mantine-scale));
  }

  .m_89d60db1[data-variant='pills'] {
    --tabs-list-gap: calc(var(--mantine-spacing-sm) / 2);
  }

  [data-mantine-color-scheme='light'] .m_89d60db1[data-variant='pills'] {
      --tab-hover-color: var(--mantine-color-gray-0);
}

  [data-mantine-color-scheme='dark'] .m_89d60db1[data-variant='pills'] {
      --tab-hover-color: var(--mantine-color-dark-6);
}

.m_89d33d6d {
  display: flex;
  flex-wrap: wrap;
  justify-content: var(--tabs-justify, flex-start);
  flex-direction: var(--tabs-list-direction);
  gap: var(--tabs-list-gap);

  --tab-grow: unset;
}

.m_89d33d6d[data-grow] {
    --tab-grow: 1;
  }

.m_b0c91715 {
  flex-grow: var(--tabs-panel-grow);
}

.m_4ec4dce6 {
  position: relative;
  padding: var(--mantine-spacing-xs) var(--mantine-spacing-md);
  font-size: var(--mantine-font-size-sm);
  white-space: nowrap;
  z-index: 0;
  display: flex;
  align-items: center;
  line-height: 1;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  flex-grow: var(--tab-grow);
  justify-content: var(--tab-justify);
}

.m_4ec4dce6:disabled,
  .m_4ec4dce6[data-disabled] {
    opacity: 0.5;
    cursor: not-allowed;
  }

.m_4ec4dce6:focus {
    z-index: 1;
  }

.m_fc420b1f {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: var(--tab-section-margin-left, 0);
  margin-right: var(--tab-section-margin-right, 0);
}

.m_fc420b1f[data-position='left']:not(:only-child) {
      --tab-section-margin-right: var(--mantine-spacing-xs);
    }

[dir="rtl"] .m_fc420b1f[data-position='left']:not(:only-child) {
        --tab-section-margin-right: 0rem;
        --tab-section-margin-left: var(--mantine-spacing-xs);
}

.m_fc420b1f[data-position='right']:not(:only-child) {
      --tab-section-margin-left: var(--mantine-spacing-xs);
    }

[dir="rtl"] .m_fc420b1f[data-position='right']:not(:only-child) {
        --tab-section-margin-left: 0rem;
        --tab-section-margin-right: var(--mantine-spacing-xs);
}

/*************************************** default variant ***************************************/
.m_576c9d4 {
  position: relative;
}
.m_576c9d4::before {
    content: '';
    position: absolute;
    border-color: var(--tab-border-color);
    border-width: var(--tabs-list-border-size);
    border-style: solid;
    bottom: var(--tabs-list-line-bottom);
    inset-inline-start: var(--tabs-list-line-start);
    inset-inline-end: var(--tabs-list-line-end);
    top: var(--tabs-list-line-top);
  }

.m_539e827b {
  border-radius: var(--tab-radius);
  border-width: var(--tab-border-width);
  border-style: solid;
  border-color: transparent;
  background-color: var(--tab-bg);

  --tab-bg: transparent;
}

.m_539e827b:where([data-active]) {
    border-color: var(--tabs-color);
  }

@media (hover: hover) {

  .m_539e827b:hover {
    --tab-bg: var(--tab-hover-color);
  }

    .m_539e827b:hover:where(:not([data-active])) {
      border-color: var(--tab-border-color);
    }
}

@media (hover: none) {

  .m_539e827b:active {
    --tab-bg: var(--tab-hover-color);
  }

    .m_539e827b:active:where(:not([data-active])) {
      border-color: var(--tab-border-color);
    }
}

@media (hover: hover) {

  .m_539e827b:disabled:hover, .m_539e827b[data-disabled]:hover {
      --tab-bg: transparent;
  }
}

@media (hover: none) {

  .m_539e827b:disabled:active, .m_539e827b[data-disabled]:active {
      --tab-bg: transparent;
  }
}

/*************************************** outline variant ***************************************/
.m_6772fbd5 {
  position: relative;
}
.m_6772fbd5::before {
    content: '';
    position: absolute;
    border-color: var(--tab-border-color);
    border-width: var(--tabs-list-border-size);
    border-style: solid;
    bottom: var(--tabs-list-line-bottom);
    inset-inline-start: var(--tabs-list-line-start);
    inset-inline-end: var(--tabs-list-line-end);
    top: var(--tabs-list-line-top);
  }

.m_b59ab47c {
  border-top: calc(0.0625rem * var(--mantine-scale)) solid transparent;
  border-bottom: calc(0.0625rem * var(--mantine-scale)) solid transparent;
  border-right: calc(0.0625rem * var(--mantine-scale)) solid transparent;
  border-left: calc(0.0625rem * var(--mantine-scale)) solid transparent;
  border-top-color: var(--tab-border-top-color);
  border-bottom-color: var(--tab-border-bottom-color);
  border-radius: var(--tab-radius);
  position: relative;

  --tab-border-bottom-color: transparent;
  --tab-border-top-color: transparent;
  --tab-border-inline-end-color: transparent;
  --tab-border-inline-start-color: transparent;
}

.m_b59ab47c:where([data-active])::before {
      content: '';
      position: absolute;
      background-color: var(--tab-border-color);
      bottom: var(--tab-before-bottom, calc(-0.0625rem * var(--mantine-scale)));
      left: var(--tab-before-left, calc(-0.0625rem * var(--mantine-scale)));
      right: var(--tab-before-right, auto);
      top: var(--tab-before-top, auto);
      width: calc(0.0625rem * var(--mantine-scale));
      height: calc(0.0625rem * var(--mantine-scale));
    }

.m_b59ab47c:where([data-active])::after {
      content: '';
      position: absolute;
      background-color: var(--tab-border-color);
      bottom: var(--tab-after-bottom, calc(-0.0625rem * var(--mantine-scale)));
      right: var(--tab-after-right, calc(-0.0625rem * var(--mantine-scale)));
      left: var(--tab-after-left, auto);
      top: var(--tab-after-top, auto);
      width: calc(0.0625rem * var(--mantine-scale));
      height: calc(0.0625rem * var(--mantine-scale));
    }

.m_b59ab47c:where([data-active]) {

    border-top-color: var(--tab-border-top-color);
    border-bottom-color: var(--tab-border-bottom-color);
    border-inline-start-color: var(--tab-border-inline-start-color);
    border-inline-end-color: var(--tab-border-inline-end-color);

    --tab-border-top-color: var(--tab-border-color);
    --tab-border-inline-start-color: var(--tab-border-color);
    --tab-border-inline-end-color: var(--tab-border-color);
    --tab-border-bottom-color: var(--mantine-color-body);
}

.m_b59ab47c:where([data-active])[data-inverted] {
      --tab-border-bottom-color: var(--tab-border-color);
      --tab-border-top-color: var(--mantine-color-body);

      --tab-before-bottom: auto;
      --tab-before-top: calc(-0.0625rem * var(--mantine-scale));
      --tab-after-bottom: auto;
      --tab-after-top: calc(-0.0625rem * var(--mantine-scale));
    }

.m_b59ab47c:where([data-active])[data-orientation='vertical'][data-placement='left'] {
        --tab-border-inline-end-color: var(--mantine-color-body);
        --tab-border-inline-start-color: var(--tab-border-color);
        --tab-border-bottom-color: var(--tab-border-color);

        --tab-before-right: calc(-0.0625rem * var(--mantine-scale));
        --tab-before-left: auto;
        --tab-before-bottom: auto;
        --tab-before-top: calc(-0.0625rem * var(--mantine-scale));
        --tab-after-left: auto;
        --tab-after-right: calc(-0.0625rem * var(--mantine-scale));
      }

[dir="rtl"] .m_b59ab47c:where([data-active])[data-orientation='vertical'][data-placement='left'] {
          --tab-before-right: auto;
          --tab-before-left: calc(-0.0625rem * var(--mantine-scale));
          --tab-after-left: calc(-0.0625rem * var(--mantine-scale));
          --tab-after-right: auto;
}

.m_b59ab47c:where([data-active])[data-orientation='vertical'][data-placement='right'] {
        --tab-border-inline-start-color: var(--mantine-color-body);
        --tab-border-inline-end-color: var(--tab-border-color);
        --tab-border-bottom-color: var(--tab-border-color);

        --tab-before-left: calc(-0.0625rem * var(--mantine-scale));
        --tab-before-right: auto;
        --tab-before-bottom: auto;
        --tab-before-top: calc(-0.0625rem * var(--mantine-scale));
        --tab-after-right: auto;
        --tab-after-left: calc(-0.0625rem * var(--mantine-scale));
      }

[dir="rtl"] .m_b59ab47c:where([data-active])[data-orientation='vertical'][data-placement='right'] {
          --tab-before-left: auto;
          --tab-before-right: calc(-0.0625rem * var(--mantine-scale));
          --tab-after-right: calc(-0.0625rem * var(--mantine-scale));
          --tab-after-left: auto;
}

/*************************************** pills variant ***************************************/
.m_c3381914 {
  border-radius: var(--tabs-radius);
  background-color: var(--tab-bg);
  color: var(--tab-color);

  --tab-bg: transparent;
  --tab-color: inherit;
}
@media (hover: hover) {

  .m_c3381914:not([data-disabled]):hover {
      --tab-bg: var(--tab-hover-color);
  }
}
@media (hover: none) {

  .m_c3381914:not([data-disabled]):active {
      --tab-bg: var(--tab-hover-color);
  }
}
.m_c3381914[data-active][data-active] {
    --tab-bg: var(--tabs-color);
    --tab-color: var(--tabs-text-color, var(--mantine-color-white));
  }
@media (hover: hover) {

  .m_c3381914[data-active][data-active]:hover {
      --tab-bg: var(--tabs-color);
  }
}
@media (hover: none) {

  .m_c3381914[data-active][data-active]:active {
      --tab-bg: var(--tabs-color);
  }
}

.m_7341320d {
  --ti-size-xs: calc(1.125rem * var(--mantine-scale));
  --ti-size-sm: calc(1.375rem * var(--mantine-scale));
  --ti-size-md: calc(1.75rem * var(--mantine-scale));
  --ti-size-lg: calc(2.125rem * var(--mantine-scale));
  --ti-size-xl: calc(2.75rem * var(--mantine-scale));
  --ti-size: var(--ti-size-md);

  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;

  width: var(--ti-size);
  height: var(--ti-size);
  min-width: var(--ti-size);
  min-height: var(--ti-size);
  border-radius: var(--ti-radius, var(--mantine-radius-default));
  background: var(--ti-bg, var(--mantine-primary-color-filled));
  color: var(--ti-color, var(--mantine-color-white));
  border: var(--ti-bd, 1px solid transparent);
}

.m_43657ece {
  --offset: calc(var(--tl-bullet-size) / 2 + var(--tl-line-width) / 2);
  --tl-bullet-size: calc(1.25rem * var(--mantine-scale));
  --tl-line-width: calc(0.25rem * var(--mantine-scale));
  --tl-radius: calc(62.5rem * var(--mantine-scale));
  --tl-color: var(--mantine-primary-color-filled);
}

  .m_43657ece:where([data-align='left']) {
    -webkit-padding-start: var(--offset);
            padding-inline-start: var(--offset);
  }

  .m_43657ece:where([data-align='right']) {
    -webkit-padding-end: var(--offset);
            padding-inline-end: var(--offset);
  }

.m_2ebe8099 {
  font-weight: 500;
  line-height: 1;
  margin-bottom: calc(var(--mantine-spacing-xs) / 2);
}

.m_436178ff {
  --item-border: var(--tl-line-width) var(--tli-border-style, solid) var(--item-border-color);

  position: relative;
  color: var(--mantine-color-text);
}

.m_436178ff::before {
    content: '';
    pointer-events: none;
    position: absolute;
    top: 0;
    left: var(--timeline-line-left, 0);
    right: var(--timeline-line-right, 0);
    bottom: calc(var(--mantine-spacing-xl) * -1);
    -webkit-border-start: var(--item-border);
            border-inline-start: var(--item-border);
    display: var(--timeline-line-display, none);
  }

.m_43657ece[data-align='left'] .m_436178ff::before {
      --timeline-line-left: calc(var(--tl-line-width) * -1);
      --timeline-line-right: auto;
    }

[dir="rtl"] .m_43657ece[data-align='left'] .m_436178ff::before {
        --timeline-line-left: auto;
        --timeline-line-right: calc(var(--tl-line-width) * -1);
}

.m_43657ece[data-align='right'] .m_436178ff::before {
      --timeline-line-left: auto;
      --timeline-line-right: calc(var(--tl-line-width) * -1);
    }

[dir="rtl"] .m_43657ece[data-align='right'] .m_436178ff::before {
        --timeline-line-left: calc(var(--tl-line-width) * -1);
        --timeline-line-right: auto;
}

.m_43657ece:where([data-align='left']) .m_436178ff {
    -webkit-padding-start: var(--offset);
            padding-inline-start: var(--offset);
    text-align: left;
  }

.m_43657ece:where([data-align='right']) .m_436178ff {
    -webkit-padding-end: var(--offset);
            padding-inline-end: var(--offset);
    text-align: right;
  }

:where([data-mantine-color-scheme='light']) .m_436178ff {
    --item-border-color: var(--mantine-color-gray-3);
}

:where([data-mantine-color-scheme='dark']) .m_436178ff {
    --item-border-color: var(--mantine-color-dark-4);
}

.m_436178ff:where([data-line-active])::before {
      border-color: var(--tli-color, var(--tl-color));
    }

.m_436178ff:where(:not(:last-of-type)) {
    --timeline-line-display: block;
  }

.m_436178ff:where(:not(:first-of-type)) {
    margin-top: var(--mantine-spacing-xl);
  }

.m_8affcee1 {
  width: var(--tl-bullet-size);
  height: var(--tl-bullet-size);
  border-radius: var(--tli-radius, var(--tl-radius));
  border: var(--tl-line-width) solid;
  background-color: var(--mantine-color-body);
  position: absolute;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--mantine-color-text);
}

:where([data-mantine-color-scheme='light']) .m_8affcee1 {
    border-color: var(--mantine-color-gray-3);
}

:where([data-mantine-color-scheme='dark']) .m_8affcee1 {
    border-color: var(--mantine-color-dark-4);
}

.m_43657ece:where([data-align='left']) .m_8affcee1 {
    left: calc((var(--tl-bullet-size) / 2 + var(--tl-line-width) / 2) * -1);
    right: auto;
  }

:where([dir="rtl"]) .m_43657ece:where([data-align='left']) .m_8affcee1 {
      left: auto;
      right: calc((var(--tl-bullet-size) / 2 + var(--tl-line-width) / 2) * -1);
}

.m_43657ece:where([data-align='right']) .m_8affcee1 {
    left: auto;
    right: calc((var(--tl-bullet-size) / 2 + var(--tl-line-width) / 2) * -1);
  }

:where([dir="rtl"]) .m_43657ece:where([data-align='right']) .m_8affcee1 {
      left: calc((var(--tl-bullet-size) / 2 + var(--tl-line-width) / 2) * -1);
      right: auto;
}

.m_8affcee1:where([data-with-child]) {
    border-width: var(--tl-line-width);
  }

:where([data-mantine-color-scheme='light']) .m_8affcee1:where([data-with-child]) {
      background-color: var(--mantine-color-gray-3);
}

:where([data-mantine-color-scheme='dark']) .m_8affcee1:where([data-with-child]) {
      background-color: var(--mantine-color-dark-4);
}

.m_8affcee1:where([data-active]) {
    border-color: var(--tli-color, var(--tl-color));
    background-color: var(--mantine-color-white);
    color: var(--tl-icon-color, var(--mantine-color-white));
  }

.m_8affcee1:where([data-active]):where([data-with-child]) {
      background-color: var(--tli-color, var(--tl-color));
      color: var(--tl-icon-color, var(--mantine-color-white));
    }

.m_43657ece:where([data-align='left']) .m_540e8f41 {
    -webkit-padding-start: var(--offset);
            padding-inline-start: var(--offset);
    text-align: left;
  }

:where([dir="rtl"]) .m_43657ece:where([data-align='left']) .m_540e8f41 {
      text-align: right;
}

.m_43657ece:where([data-align='right']) .m_540e8f41 {
    -webkit-padding-end: var(--offset);
            padding-inline-end: var(--offset);
    text-align: right;
  }

:where([dir="rtl"]) .m_43657ece:where([data-align='right']) .m_540e8f41 {
      text-align: left;
}

.m_8a5d1357 {
  margin: 0;
  font-weight: var(--title-fw);
  font-size: var(--title-fz);
  line-height: var(--title-lh);
  font-family: var(--mantine-font-family-headings);
  text-wrap: var(--title-text-wrap, var(--mantine-heading-text-wrap));
}

  .m_8a5d1357:where([data-line-clamp]) {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: var(--title-line-clamp);
    -webkit-box-orient: vertical;
  }

.m_f698e191 {
  --level-offset: var(--mantine-spacing-lg);
  margin: 0;
  padding: 0;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}

.m_75f3ecf {
  margin: 0;
  padding: 0;
}

.m_f6970eb1 {
  cursor: pointer;
  list-style: none;
  margin: 0;
  padding: 0;
  outline: 0;
}

.m_f6970eb1:focus-visible > .m_dc283425 {
      outline: 2px solid var(--mantine-primary-color-filled);
      outline-offset: calc(0.125rem * var(--mantine-scale));
    }

.m_dc283425 {
  -webkit-padding-start: var(--label-offset);
          padding-inline-start: var(--label-offset);
}

:where([data-mantine-color-scheme='light']) .m_dc283425:where([data-selected]) {
      background-color: var(--mantine-color-gray-1);
}

:where([data-mantine-color-scheme='dark']) .m_dc283425:where([data-selected]) {
      background-color: var(--mantine-color-dark-5);
}

.m_d6493fad :first-child {
    margin-top: 0;
  }
  .m_d6493fad :last-child {
    margin-bottom: 0;
  }
  .m_d6493fad :where(h1, h2, h3, h4, h5, h6) {
    margin-bottom: var(--mantine-spacing-xs);
    text-wrap: var(--mantine-heading-text-wrap);
    font-family: var(--mantine-font-family-headings);
  }
  .m_d6493fad :where(h1) {
    margin-top: calc(1.5 * var(--mantine-spacing-xl));
    font-size: var(--mantine-h1-font-size);
    line-height: var(--mantine-h1-line-height);
    font-weight: var(--mantine-h1-font-weight);
  }
  .m_d6493fad :where(h2) {
    margin-top: var(--mantine-spacing-xl);
    font-size: var(--mantine-h2-font-size);
    line-height: var(--mantine-h2-line-height);
    font-weight: var(--mantine-h2-font-weight);
  }
  .m_d6493fad :where(h3) {
    margin-top: calc(0.8 * var(--mantine-spacing-xl));
    font-size: var(--mantine-h3-font-size);
    line-height: var(--mantine-h3-line-height);
    font-weight: var(--mantine-h3-font-weight);
  }
  .m_d6493fad :where(h4) {
    margin-top: calc(0.8 * var(--mantine-spacing-xl));
    font-size: var(--mantine-h4-font-size);
    line-height: var(--mantine-h4-line-height);
    font-weight: var(--mantine-h4-font-weight);
  }
  .m_d6493fad :where(h5) {
    margin-top: calc(0.5 * var(--mantine-spacing-xl));
    font-size: var(--mantine-h5-font-size);
    line-height: var(--mantine-h5-line-height);
    font-weight: var(--mantine-h5-font-weight);
  }
  .m_d6493fad :where(h6) {
    margin-top: calc(0.5 * var(--mantine-spacing-xl));
    font-size: var(--mantine-h6-font-size);
    line-height: var(--mantine-h6-line-height);
    font-weight: var(--mantine-h6-font-weight);
  }
  .m_d6493fad :where(img) {
    max-width: 100%;
    margin-bottom: var(--mantine-spacing-xs);
  }
  .m_d6493fad :where(p) {
    margin-top: 0;
    margin-bottom: var(--mantine-spacing-lg);
  }
  :where([data-mantine-color-scheme='light']) .m_d6493fad :where(mark) {
      background-color: var(--mantine-color-yellow-2);
      color: inherit;
}
  :where([data-mantine-color-scheme='dark']) .m_d6493fad :where(mark) {
      background-color: var(--mantine-color-yellow-5);
      color: var(--mantine-color-black);
}
  .m_d6493fad :where(a) {
    color: var(--mantine-color-anchor);
    text-decoration: none;
  }
  @media (hover: hover) {
    .m_d6493fad :where(a):hover {
      text-decoration: underline;
    }
}
  @media (hover: none) {
    .m_d6493fad :where(a):active {
      text-decoration: underline;
    }
}
  .m_d6493fad :where(hr) {
    margin-top: var(--mantine-spacing-md);
    margin-bottom: var(--mantine-spacing-md);
    border: 0;
    border-top: calc(0.0625rem * var(--mantine-scale)) solid;
  }
  :where([data-mantine-color-scheme='light']) .m_d6493fad :where(hr) {
      border-color: var(--mantine-color-gray-3);
}
  :where([data-mantine-color-scheme='dark']) .m_d6493fad :where(hr) {
      border-color: var(--mantine-color-dark-3);
}
  .m_d6493fad :where(pre) {
    padding: var(--mantine-spacing-xs);
    line-height: var(--mantine-line-height);
    margin: 0;
    margin-top: var(--mantine-spacing-md);
    margin-bottom: var(--mantine-spacing-md);
    overflow-x: auto;
    font-family: var(--mantine-font-family-monospace);
    font-size: var(--mantine-font-size-xs);
    border-radius: var(--mantine-radius-sm);
  }
  :where([data-mantine-color-scheme='light']) .m_d6493fad :where(pre) {
      background-color: var(--mantine-color-gray-0);
}
  :where([data-mantine-color-scheme='dark']) .m_d6493fad :where(pre) {
      background-color: var(--mantine-color-dark-8);
}
  .m_d6493fad :where(pre) :where(code) {
      background-color: transparent;
      padding: 0;
      border-radius: 0;
      color: inherit;
      border: 0;
    }
  .m_d6493fad :where(kbd) {
    --kbd-fz: calc(0.75rem * var(--mantine-scale));
    --kbd-padding: calc(0.1875rem * var(--mantine-scale)) calc(0.3125rem * var(--mantine-scale));

    font-family: var(--mantine-font-family-monospace);
    line-height: var(--mantine-line-height);
    font-weight: 700;
    padding: var(--kbd-padding);
    font-size: var(--kbd-fz);
    border-radius: var(--mantine-radius-sm);
    border: calc(0.0625rem * var(--mantine-scale)) solid;
    border-bottom-width: calc(0.1875rem * var(--mantine-scale));
  }
  :where([data-mantine-color-scheme='light']) .m_d6493fad :where(kbd) {
      border-color: var(--mantine-color-gray-3);
      color: var(--mantine-color-gray-7);
      background-color: var(--mantine-color-gray-0);
}
  :where([data-mantine-color-scheme='dark']) .m_d6493fad :where(kbd) {
      border-color: var(--mantine-color-dark-3);
      color: var(--mantine-color-dark-0);
      background-color: var(--mantine-color-dark-5);
}
  .m_d6493fad :where(code) {
    line-height: var(--mantine-line-height);
    padding: calc(0.0625rem * var(--mantine-scale)) calc(0.3125rem * var(--mantine-scale));
    border-radius: var(--mantine-radius-sm);
    font-family: var(--mantine-font-family-monospace);
    font-size: var(--mantine-font-size-xs);
  }
  :where([data-mantine-color-scheme='light']) .m_d6493fad :where(code) {
      background-color: var(--mantine-color-gray-0);
      color: var(--mantine-color-black);
}
  :where([data-mantine-color-scheme='dark']) .m_d6493fad :where(code) {
      background-color: var(--mantine-color-dark-5);
      color: var(--mantine-color-white);
}
  .m_d6493fad :where(ul, ol):not([data-type='taskList']) {
    margin-bottom: var(--mantine-spacing-md);
    -webkit-padding-start: var(--mantine-spacing-xl);
            padding-inline-start: var(--mantine-spacing-xl);
    list-style-position: outside;
  }
  .m_d6493fad :where(table) {
    width: 100%;
    border-collapse: collapse;
    caption-side: bottom;
    margin-bottom: var(--mantine-spacing-md);
  }
  :where([data-mantine-color-scheme='light']) .m_d6493fad :where(table) {
      --table-border-color: var(--mantine-color-gray-3);
}
  :where([data-mantine-color-scheme='dark']) .m_d6493fad :where(table) {
      --table-border-color: var(--mantine-color-dark-4);
}
  .m_d6493fad :where(table) :where(caption) {
      margin-top: var(--mantine-spacing-xs);
      font-size: var(--mantine-font-size-sm);
      color: var(--mantine-color-dimmed);
    }
  .m_d6493fad :where(table) :where(th) {
      text-align: left;
      font-weight: bold;
      font-size: var(--mantine-font-size-sm);
      padding: var(--mantine-spacing-xs) var(--mantine-spacing-sm);
    }
  .m_d6493fad :where(table) :where(thead th) {
      border-bottom: calc(0.0625rem * var(--mantine-scale)) solid;
      border-color: var(--table-border-color);
    }
  .m_d6493fad :where(table) :where(tfoot th) {
      border-top: calc(0.0625rem * var(--mantine-scale)) solid;
      border-color: var(--table-border-color);
    }
  .m_d6493fad :where(table) :where(td) {
      padding: var(--mantine-spacing-xs) var(--mantine-spacing-sm);
      border-bottom: calc(0.0625rem * var(--mantine-scale)) solid;
      border-color: var(--table-border-color);
      font-size: var(--mantine-font-size-sm);
    }
  .m_d6493fad :where(table) :where(tr:last-of-type td) {
      border-bottom: 0;
    }
  .m_d6493fad :where(blockquote) {
    font-size: var(--mantine-font-size-lg);
    line-height: var(--mantine-line-height);
    margin: var(--mantine-spacing-md) 0;
    border-radius: var(--mantine-radius-sm);
    padding: var(--mantine-spacing-md) var(--mantine-spacing-lg);
  }
  :where([data-mantine-color-scheme='light']) .m_d6493fad :where(blockquote) {
      background-color: var(--mantine-color-gray-0);
}
  :where([data-mantine-color-scheme='dark']) .m_d6493fad :where(blockquote) {
      background-color: var(--mantine-color-dark-8);
}

/*!********************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!../../node_modules/@mantine/notifications/styles.css ***!
  \********************************************************************************************************************************************************************************************************************************************************************************************************/
.m_b37d9ac7 {
  width: calc(100% - var(--mantine-spacing-md) * 2);
  position: fixed;
  z-index: var(--notifications-z-index);
  max-width: var(--notifications-container-width);
}

  .m_b37d9ac7:where([data-position='top-center']) {
    top: var(--mantine-spacing-md);
    left: 50%;
    transform: translateX(-50%);
  }

  .m_b37d9ac7:where([data-position='top-left']) {
    top: var(--mantine-spacing-md);
    left: var(--mantine-spacing-md);
  }

  .m_b37d9ac7:where([data-position='top-right']) {
    top: var(--mantine-spacing-md);
    right: var(--mantine-spacing-md);
  }

  .m_b37d9ac7:where([data-position='bottom-center']) {
    bottom: var(--mantine-spacing-md);
    left: 50%;
    transform: translateX(-50%);
  }

  .m_b37d9ac7:where([data-position='bottom-left']) {
    bottom: var(--mantine-spacing-md);
    left: var(--mantine-spacing-md);
  }

  .m_b37d9ac7:where([data-position='bottom-right']) {
    bottom: var(--mantine-spacing-md);
    right: var(--mantine-spacing-md);
  }

.m_5ed0edd0 + .m_5ed0edd0 {
    margin-top: var(--mantine-spacing-md);
  }

/*!****************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!../../core/design-system/globals.css ***!
  \****************************************************************************************************************************************************************************************************************************************************************************************/
/* Import Inter Variable Font from rsms.me/inter */
@import url('https://rsms.me/inter/inter.css');

/* RSMS Inter Font Configuration */
:root {
  font-family: 'Inter';
  font-feature-settings: 'liga' 1, 'calt' 1; /* fix for Chrome */

  /* Override Mantine's default fonts with Inter */
  --mantine-font-family: 'Inter';
  --mantine-font-family-headings: 'Inter';
}

@supports (font-variation-settings: normal) {
  :root {
    font-family: 'Inter';
    --mantine-font-family: 'Inter';
    --mantine-font-family-headings: 'Inter';
  }
}

/* WeFab Design System */
:root {
  /* ========== WEFAB DESIGN SYSTEM ========== */

  /* PRIMARY COLORS */
  --blueprint-blue: #1A3A5F;        /* Deep, authoritative blue reminiscent of engineering blueprints */
  --technical-white: #F6F7F9;       /* Slightly off-white for better readability and reduced eye strain */
  --precision-black: #1A1D21;       /* Deep, not quite black for text and accents */

  /* SECONDARY/ACCENT COLORS */
  --machine-gray: #545A64;          /* Medium gray for secondary elements */
  --material-silver: #D1D5DB;       /* Light gray for backgrounds and subtle accents */
  --safety-orange: #FF5722;         /* Sparse use for CTAs and key highlights */
  --process-green: #12856E;         /* For success states and progress indicators */

  /* DEVICE BREAKPOINTS */
  --breakpoint-xs: 360px;           /* Small mobile phones */
  --breakpoint-sm: 480px;           /* Mobile phones */
  --breakpoint-md: 768px;           /* Tablets */
  --breakpoint-lg: 1024px;          /* Desktop */
  --breakpoint-xl: 1280px;          /* Large desktop */
  --breakpoint-2xl: 1440px;         /* Extra large desktop */

  /* TYPOGRAPHY SCALE */
  --text-display: 3rem;             /* 48px - Display / Bold */
  --text-h1: 2.25rem;               /* 36px - Heading 1 / Bold */
  --text-h2: 1.875rem;              /* 30px - Heading 2 / Semibold */
  --text-h3: 1.5rem;                /* 24px - Heading 3 / Semibold */
  --text-h4: 1.25rem;               /* 20px - Heading 4 / Medium */
  --text-body-large: 1rem;          /* 16px - Body Large / Regular */
  --text-body: 1rem;                /* 16px - Body Default / Regular */
  --text-body-small: 0.875rem;      /* 14px - Body Small / Regular */
  --text-caption: 0.75rem;          /* 12px - Caption / Regular */
  --text-micro: 0.625rem;           /* 10px - Micro / Regular */
  --text-nano: 0.5rem;              /* 8px - Nano / Regular */
  --text-micro-tiny: 0.375rem;      /* 6px - Micro Tiny / Regular */

  /* FONT WEIGHTS */
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;

  /* LINE HEIGHTS */
  --line-height-display: 1.2;
  --line-height-heading: 1.3;
  --line-height-body-large: 1.6;
  --line-height-body: 1.5;
  --line-height-body-small: 1.4;
  --line-height-caption: 1.3;
  --line-height-micro: 1.3;
  --line-height-nano: 1.2;
  --line-height-micro-tiny: 1.2;

  /* FONT FAMILY - Inter only - keeping CSS variable for components that reference it */
  --font-inter: inherit;

  /* SPACING SYSTEM */
  --space-xs: 0.25rem;    /* 4px */
  --space-sm: 0.5rem;     /* 8px */
  --space-md: 0.75rem;    /* 12px */
  --space-lg: 1rem;       /* 16px */
  --space-xl: 1.5rem;     /* 24px */
  --space-2xl: 2rem;      /* 32px */
  --space-3xl: 3rem;      /* 48px */

  /* BORDER RADIUS */
  --radius-sm: 0.25rem;   /* 4px */
  --radius-md: 0.5rem;    /* 8px */
  --radius-lg: 0.75rem;   /* 12px */
  --radius-xl: 1rem;      /* 16px */
}

/* ========== FONT FEATURE SETTINGS FOR INTER ========== */
@supports (font-variation-settings: normal) {
  :root {
    font-family: Inter;
    --font-inter: inherit;
  }
}

/* ========== BASE STYLES ========== */
* {
  box-sizing: border-box;
}

html {
  font-feature-settings: 'cv02' 1, 'cv03' 1, 'cv04' 1, 'cv11' 1;
  scroll-behavior: smooth;
}

body {
  background-color: #ffffff;
  color: var(--precision-black);
  margin: 0;
  font-size: var(--text-body);
  font-weight: var(--weight-regular);
  line-height: var(--line-height-body);
}

/* ========== TYPOGRAPHY RESET ========== */
h1, h2, h3, h4, h5, h6, p {
  margin: 0;
  padding: 0;
}

/* ========== TYPOGRAPHY UTILITY CLASSES ========== */
.text-display {
  font-size: var(--text-display);
  font-weight: var(--weight-bold);
  line-height: var(--line-height-display);
}

.text-h1 {
  font-size: var(--text-h1);
  font-weight: var(--weight-bold);
  line-height: var(--line-height-heading);
}

.text-h2 {
  font-size: var(--text-h2);
  font-weight: var(--weight-semibold);
  line-height: var(--line-height-heading);
}

.text-h3 {
  font-size: var(--text-h3);
  font-weight: var(--weight-semibold);
  line-height: var(--line-height-heading);
}

.text-h4 {
  font-size: var(--text-h4);
  font-weight: var(--weight-medium);
  line-height: var(--line-height-heading);
}

.text-body-large {
  font-size: var(--text-body-large);
  font-weight: var(--weight-regular);
  line-height: var(--line-height-body-large);
}

.text-body {
  font-size: var(--text-body);
  font-weight: var(--weight-regular);
  line-height: var(--line-height-body);
}

.text-body-small {
  font-size: var(--text-body-small);
  font-weight: var(--weight-regular);
  line-height: var(--line-height-body-small);
}

.text-caption {
  font-size: var(--text-caption);
  font-weight: var(--weight-regular);
  line-height: var(--line-height-caption);
}

.text-micro {
  font-size: var(--text-micro);
  font-weight: var(--weight-regular);
  line-height: var(--line-height-micro);
}

.text-nano {
  font-size: var(--text-nano);
  font-weight: var(--weight-regular);
  line-height: var(--line-height-nano);
}

.text-micro-tiny {
  font-size: var(--text-micro-tiny);
  font-weight: var(--weight-regular);
  line-height: var(--line-height-micro-tiny);
}

/* ========== COLOR UTILITY CLASSES ========== */
.text-blueprint { color: var(--blueprint-blue); }
.text-precision { color: var(--precision-black); }
.text-machine { color: var(--machine-gray); }
.text-safety { color: var(--safety-orange); }
.text-process { color: var(--process-green); }

.bg-blueprint { background-color: var(--blueprint-blue); }
.bg-technical { background-color: var(--technical-white); }
.bg-precision { background-color: var(--precision-black); }
.bg-machine { background-color: var(--machine-gray); }
.bg-material { background-color: var(--material-silver); }
.bg-safety { background-color: var(--safety-orange); }
.bg-process { background-color: var(--process-green); }

/* ========== TABLE UTILITY CLASSES ========== */
.linkable-column {
  color: var(--blueprint-blue);
  text-decoration: none;
}

.linkable-column:hover {
  color: var(--blueprint-blue);
  text-decoration: underline;
}

.sub-info {
  font-size: var(--text-caption);
  color: var(--machine-gray);
  margin-top: var(--space-xs);
  line-height: var(--line-height-caption);
}

/* ========== FILE UPLOAD UTILITY CLASSES ========== */
.file-upload-text {
  color: var(--machine-gray);
}

.file-upload-link {
  color: var(--blueprint-blue);
  font-weight: var(--weight-medium);
}



/* Layout Classes */
.min-h-screen {
  min-height: 100vh;
}

/* Spacing Utilities */
.space-y-2 > * + * { margin-top: var(--space-sm); }
.space-y-3 > * + * { margin-top: var(--space-md); }
.space-y-4 > * + * { margin-top: var(--space-lg); }
.space-y-6 > * + * { margin-top: var(--space-xl); }

/* Gap utilities */
.gap-xs { gap: var(--space-xs); }
.gap-sm { gap: var(--space-sm); }
.gap-md { gap: var(--space-md); }
.gap-lg { gap: var(--space-lg); }
.gap-xl { gap: var(--space-xl); }
.gap-2xl { gap: var(--space-2xl); }
.gap-3xl { gap: var(--space-3xl); }

/* Legacy gap utilities for compatibility */
.gap-2 { gap: var(--space-sm); }
.gap-3 { gap: var(--space-md); }
.gap-4 { gap: var(--space-lg); }
.gap-6 { gap: var(--space-xl); }

.p-3 { padding: var(--space-md); }
.p-4 { padding: var(--space-lg); }
.p-6 { padding: var(--space-xl); }

/* Margin utilities */
.m-xs { margin: var(--space-xs); }
.m-sm { margin: var(--space-sm); }
.m-md { margin: var(--space-md); }
.m-lg { margin: var(--space-lg); }
.m-xl { margin: var(--space-xl); }

.mt-xs { margin-top: var(--space-xs); }
.mt-sm { margin-top: var(--space-sm); }
.mt-md { margin-top: var(--space-md); }
.mt-lg { margin-top: var(--space-lg); }
.mt-xl { margin-top: var(--space-xl); }

.mb-xs { margin-bottom: var(--space-xs); }
.mb-sm { margin-bottom: var(--space-sm); }
.mb-md { margin-bottom: var(--space-md); }
.mb-lg { margin-bottom: var(--space-lg); }
.mb-xl { margin-bottom: var(--space-xl); }

.ml-xs { margin-left: var(--space-xs); }
.ml-sm { margin-left: var(--space-sm); }
.ml-md { margin-left: var(--space-md); }
.ml-lg { margin-left: var(--space-lg); }
.ml-xl { margin-left: var(--space-xl); }

.mr-xs { margin-right: var(--space-xs); }
.mr-sm { margin-right: var(--space-sm); }
.mr-md { margin-right: var(--space-md); }
.mr-lg { margin-right: var(--space-lg); }
.mr-xl { margin-right: var(--space-xl); }

/* Legacy margin utilities for compatibility */
.mt-2 { margin-top: var(--space-sm); }
.mt-4 { margin-top: var(--space-lg); }
.mb-1 { margin-bottom: var(--space-xs); }
.mb-2 { margin-bottom: var(--space-sm); }

/* Flexbox Utilities */
.flex { display: flex; }
.flex-wrap { flex-wrap: wrap; }
.items-center { align-items: center; }
.justify-between { justify-content: space-between; }
.justify-center { justify-content: center; }
.flex-1 { flex: 1 1; }

/* Grid Utilities */
.grid { display: grid; }
.grid-cols-7 { grid-template-columns: repeat(7, minmax(0, 1fr)); }

/* Text Utilities */
.text-center { text-align: center; }
.truncate { 
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.whitespace-nowrap { white-space: nowrap; }
.whitespace-normal { white-space: normal; }
.break-words { 
  word-wrap: break-word;
  overflow-wrap: break-word;
}
.flex-shrink-0 { flex-shrink: 0; }
/* Border radius utilities */
.rounded-xs { border-radius: var(--radius-xs); }
.rounded-sm { border-radius: var(--radius-sm); }
.rounded-md { border-radius: var(--radius-md); }
.rounded-lg { border-radius: var(--radius-lg); }
.rounded-xl { border-radius: var(--radius-xl); }
.rounded-2xl { border-radius: var(--radius-2xl); }
.w-fit { width: -moz-fit-content; width: fit-content; }
.h-fit { height: -moz-fit-content; height: fit-content; }
.min-w-0 { min-width: 0; }

/* Spinner Animation */
@keyframes spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

.animate-spin {
  animation: spin 1s linear infinite;
}

/* Size Utilities - Semantic Size Scale */
/* Width utilities */
.w-xs { width: var(--space-xs); }
.w-sm { width: var(--space-sm); }
.w-md { width: var(--space-md); }
.w-lg { width: var(--space-lg); }
.w-xl { width: var(--space-xl); }
.w-2xl { width: var(--space-2xl); }
.w-3xl { width: var(--space-3xl); }
.w-4xl { width: var(--space-4xl); }
.w-5xl { width: var(--space-5xl); }

/* Height utilities */
.h-xs { height: var(--space-xs); }
.h-sm { height: var(--space-sm); }
.h-md { height: var(--space-md); }
.h-lg { height: var(--space-lg); }
.h-xl { height: var(--space-xl); }
.h-2xl { height: var(--space-2xl); }
.h-3xl { height: var(--space-3xl); }
.h-4xl { height: var(--space-4xl); }
.h-5xl { height: var(--space-5xl); }

/* Max width utilities */
.max-w-xs { max-width: var(--space-3xl); }
.max-w-sm { max-width: var(--space-4xl); }
.max-w-md { max-width: var(--space-5xl); }
.max-w-lg { max-width: 6rem; }
.max-w-xl { max-width: 8rem; }
.max-w-2xl { max-width: 12rem; }
.max-w-3xl { max-width: 16rem; }
.max-w-4xl { max-width: 20rem; }
.max-w-5xl { max-width: 24rem; }

/* Border Utilities */
.border-2 { border-width: 2px; }
.border-solid { border-style: solid; }
.border-r-transparent { border-right-color: transparent; }
.rounded-full { border-radius: 9999px; }
.border-machine { border: 1px solid var(--machine-gray); }

/* Color Utilities */
.border-blueprint { border-color: var(--blueprint-blue); }
.border-green-500 { border-color: var(--process-green); }
.border-orange-500 { border-color: var(--safety-orange); }
.border-gray-500 { border-color: var(--machine-gray); }

/* Font Weight Utilities */
.font-semibold { font-weight: 600; }
.font-medium { font-weight: 500; }
.font-normal { font-weight: 400; }

/* Additional Utilities */
.p-2 { padding: var(--space-sm); }
.bg-gray-50 { background-color: var(--technical-white); }
.rounded { border-radius: var(--radius-sm); }

/* Hidden Utilities */
.hidden { display: none; }
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Responsive Utilities */
@media (min-width: var(--container-md)) {
  .md\:block { display: block; }
}

.bg-technical-white {
  background-color: #ffffff;
}

/* Custom scrollbar */
::-webkit-scrollbar {
  width: 8px;
}

::-webkit-scrollbar-track {
  background: var(--technical-white);
}

::-webkit-scrollbar-thumb {
  background: var(--material-silver);
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--machine-gray);
}

/* ProQSmart consistent scrollbar */
.proqsmart-scroll::-webkit-scrollbar {
  width: 8px;
}

.proqsmart-scroll::-webkit-scrollbar-track {
  background: #F1F3F5;
}

.proqsmart-scroll::-webkit-scrollbar-thumb {
  background: #ADB5BD;
  border-radius: 4px;
}

.proqsmart-scroll::-webkit-scrollbar-thumb:hover {
  background: #868E96;
}

/* Firefox support */
.proqsmart-scroll {
  scrollbar-width: thin;
  scrollbar-color: #ADB5BD #F1F3F5;
}

/* Mantine component overrides */
.mantine-Text-root {
}

.mantine-Title-root {
}

.mantine-Button-root {
}

/* Remove ALL Mantine default styles */
.mantine-focus-auto:focus,
.mantine-UnstyledButton-root:focus,
.mantine-Button-root:focus,
.mantine-Input-input:focus,
.mantine-TextInput-input:focus,
.mantine-NumberInput-input:focus,
.mantine-Textarea-input:focus,
.mantine-Select-input:focus,
.mantine-Card-root,
.mantine-Paper-root,
.mantine-Modal-root,
.mantine-Drawer-root,
.mantine-Tooltip-tooltip,
.mantine-Menu-dropdown,
.mantine-ActionIcon-root,
.mantine-Badge-root,
.mantine-Alert-root,
.mantine-Notification-root,
button:focus,
input:focus,
textarea:focus,
select:focus,
.tab-header:focus,
.tab-header:focus-visible,
.tab-header:active {
  outline: none !important;
  box-shadow: none !important;
  border: 1px solid var(--material-silver) !important;
  transition: none !important;
  animation: none !important;
}

/* ===== Progress Bar Styling ===== */
.mantine-Progress-root {
  background-color: var(--material-silver) !important;
}

.mantine-Progress-bar {
  transition: width 0.3s ease !important;
}

.mantine-Progress-bar[data-striped="true"] {
  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent) !important;
  background-size: 1rem 1rem !important;
}

.mantine-Progress-bar[data-animated="true"] {
  animation: progress-stripe 1s linear infinite !important;
}

@keyframes progress-stripe {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: 1rem 0;
  }
}

/* ===== Skeleton Styling ===== */
.mantine-Skeleton-root {
  background-color: #ffffff !important;
  opacity: 0.3 !important;
}

.mantine-Skeleton-root::before {
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 1), transparent) !important;
}

/* ===== Complete Accordion Styling - Single Source ===== */
.mantine-Accordion-root {
  border-radius: 0;
  overflow: visible;
  background: transparent;
  border: none;
  gap: 0 !important;
}

.mantine-Accordion-item,
.m_fe19b709,
.m_9bd7b098 {
  border: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 0;
  overflow: hidden;
  background-color: #ffffff;
  box-shadow: none !important;
  transition: none !important;
  gap: 0 !important;
}

.mantine-Accordion-item:hover {
  box-shadow: none !important;
  transform: none !important;
}

.mantine-Accordion-control,
.mantine-Accordion-control:focus,
.mantine-Accordion-control:focus-visible,
.mantine-Accordion-control:active,
.mantine-Accordion-control:hover,
.mantine-Accordion-control[data-active] {
  background-color: #ffffff !important;
  color: var(--precision-black) !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  transition: none !important;
  animation: none !important;
  padding: 8px 12px !important;
  margin: 0 !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  cursor: pointer;
}

.mantine-Accordion-control[data-active] {
  font-weight: 700 !important;
}

.mantine-Accordion-control button,
.mantine-Accordion-control .mantine-UnstyledButton-root,
.mantine-Accordion-control .mantine-focus-auto,
.mantine-Accordion-control .mantine-focus-never {
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  background-color: #ffffff !important;
  color: var(--precision-black) !important;
}

.mantine-Accordion-control button:focus,
.mantine-Accordion-control .mantine-UnstyledButton-root:focus,
.mantine-Accordion-control .mantine-focus-auto:focus,
.mantine-Accordion-control .mantine-focus-never:focus {
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  background-color: #ffffff !important;
  color: var(--precision-black) !important;
}

.mantine-Accordion-panel {
  background-color: #ffffff !important;
  color: var(--precision-black) !important;
  border: none !important;
  border-top: none !important;
  padding: 0 12px 8px 12px !important;
  margin: 0 !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.5;
}

.mantine-Accordion-content {
  color: var(--precision-black) !important;
}

.mantine-Accordion-chevron {
  width: 20px;
  height: 20px;
  color: var(--precision-black) !important;
}

/* Remove hover effects */
.mantine-Button-root:hover,
.mantine-ActionIcon-root:hover,
.mantine-Card-root:hover,
.mantine-Paper-root:hover {
  transform: none !important;
  box-shadow: none !important;
  transition: none !important;
}

/* Override ALL Mantine component styles */
* {
  transition: none !important;
  animation: none !important;
}

.mantine-Button-root,
.mantine-ActionIcon-root,
.mantine-Card-root,
.mantine-Paper-root,
.mantine-Modal-root,
.mantine-Drawer-root,
.mantine-Input-input,
.mantine-TextInput-input,
.mantine-Textarea-input,
.mantine-Select-input,
.mantine-Badge-root,
.mantine-Alert-root,
.mantine-Notification-root,
.mantine-Tooltip-tooltip,
.mantine-Menu-dropdown {
  border-radius: var(--radius-md) !important;
  box-shadow: none !important;
  transition: none !important;
  animation: none !important;
  border: 1px solid var(--material-silver) !important;
}

/* WeFab Responsive Utilities */
.wefab-hide-mobile {
  display: block;
}

.wefab-show-mobile {
  display: none;
}

.wefab-hide-tablet {
  display: block;
}

.wefab-show-tablet {
  display: none;
}

.wefab-hide-desktop {
  display: block;
}

.wefab-show-desktop {
  display: none;
}

/* Mobile utilities */
@media (max-width: var(--breakpoint-sm)) {
  .wefab-hide-mobile { display: none !important; }
  .wefab-show-mobile { display: block !important; }
}

/* Tablet utilities */
@media (min-width: calc(var(--breakpoint-sm) + 1px)) and (max-width: var(--breakpoint-lg)) {
  .wefab-hide-tablet { display: none !important; }
  .wefab-show-tablet { display: block !important; }
}

/* Desktop utilities */
@media (min-width: calc(var(--breakpoint-lg) + 1px)) {
  .wefab-hide-desktop { display: none !important; }
  .wefab-show-desktop { display: block !important; }
}

/* WeFab Container Responsive Classes */
.wefab-container {
  width: 100%;
  margin: 0 auto;
  padding: 0 var(--space-md);
}

@media (max-width: var(--breakpoint-sm)) {
  .wefab-container {
    padding: 0 var(--space-sm);
    max-width: var(--breakpoint-xs);
  }
}

@media (min-width: calc(var(--breakpoint-sm) + 1px)) {
  .wefab-container {
    max-width: var(--breakpoint-sm);
  }
}

@media (min-width: calc(var(--breakpoint-md) + 1px)) {
  .wefab-container {
    max-width: var(--breakpoint-md);
  }
}

@media (min-width: calc(var(--breakpoint-lg) + 1px)) {
  .wefab-container {
    max-width: var(--breakpoint-lg);
  }
}

@media (min-width: calc(var(--breakpoint-xl) + 1px)) {
  .wefab-container {
    max-width: var(--breakpoint-xl);
  }
}

@media (min-width: calc(var(--breakpoint-2xl) + 1px)) {
  .wefab-container {
    max-width: var(--breakpoint-2xl);
  }
}

/* Wefab Component Styles */
.wefab-header {
  background: white;
  border-bottom: 1px solid var(--material-silver);
  padding: var(--space-md) var(--space-lg);
  height: 4.375rem; /* 70px - max height as requested */
  min-height: 4.375rem;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
}

/* Original wefab-container moved to responsive section above */

.wefab-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(var(--size-md), 1fr));
  grid-gap: var(--space-xl);
  gap: var(--space-xl);
}

/* Full width components */
.wefab-full-width {
  grid-column: 1 / -1;
  width: 100%;
  max-width: 100vw;
  margin-left: calc(-1 * var(--space-xl));
  margin-right: calc(-1 * var(--space-xl));
  padding-left: var(--space-xl);
  padding-right: var(--space-xl);
}

/* Content-based width components */
.wefab-content-width {
  width: -moz-fit-content;
  width: fit-content;
  max-width: 100%;
}

/* Responsive grid adjustments */
@media (max-width: var(--breakpoint-sm)) {
  .wefab-full-width {
    margin-left: calc(-1 * var(--space-sm));
    margin-right: calc(-1 * var(--space-sm));
    padding-left: var(--space-sm);
    padding-right: var(--space-sm);
  }

  .wefab-grid {
    grid-template-columns: 1fr;
    gap: var(--space-sm);
  }

  .wefab-header {
    padding: var(--space-xs) var(--space-sm);
    height: 3rem; /* 48px on mobile */
    min-height: 3rem;
  }
}

@media (min-width: calc(var(--container-sm) + 0.063rem)) and (max-width: var(--container-md)) {
  .wefab-container {
    padding: var(--space-md);
  }
  
  .wefab-full-width {
    margin-left: calc(-1 * var(--space-md));
    margin-right: calc(-1 * var(--space-md));
    padding-left: var(--space-md);
    padding-right: var(--space-md);
  }
  
  .wefab-grid {
    grid-template-columns: 1fr;
    gap: var(--space-md);
  }
}

@media (min-width: calc(var(--container-md) + 0.063rem)) and (max-width: var(--container-lg)) {
  .wefab-grid {
    grid-template-columns: repeat(auto-fit, minmax(var(--size-sm), 1fr));
  }
}

@media (min-width: calc(var(--container-lg) + 0.063rem)) and (max-width: var(--container-xl)) {
  .wefab-grid {
    grid-template-columns: repeat(auto-fit, minmax(var(--size-md), 1fr));
  }
}

@media (min-width: calc(var(--container-xl) + 0.063rem)) {
  .wefab-grid {
    grid-template-columns: repeat(auto-fit, minmax(var(--size-lg), 1fr));
  }
}

.wefab-card {
  background: white;
  border: 1px solid var(--material-silver);
  border-radius: var(--radius-lg);
  padding: var(--space-lg);
  overflow: hidden;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.wefab-card-header {
  border-bottom: 1px solid var(--material-silver);
  padding-bottom: var(--space-md);
  margin-bottom: var(--space-lg);
}

.wefab-card-title {
  font-size: 1rem;
  font-weight: 600;
  color: var(--blueprint-blue);
  margin: 0;
}

.wefab-button {
  background: var(--blueprint-blue);
  color: var(--technical-white);
  border: 1px solid var(--blueprint-blue);
  border-radius: var(--radius-md);
  padding: var(--space-md) var(--space-lg);
  font-size: 0.875rem;
  font-weight: 500;
  cursor: pointer;
}

.wefab-button-secondary {
  background: white;
  color: var(--blueprint-blue);
  border: 1px solid var(--blueprint-blue);
}

.wefab-input {
  border: 1px solid var(--material-silver);
  border-radius: var(--radius-md);
  padding: var(--space-md);
  font-size: 0.875rem;
  width: 100%;
  background: white;
}

.wefab-input:focus {
  outline: none;
  border-color: var(--blueprint-blue);
}

/* Fix input wrapper/label border issues */
.mantine-Input-wrapper,
.mantine-TextInput-wrapper,
.mantine-NumberInput-wrapper,
.mantine-Textarea-wrapper,
.mantine-Select-wrapper {
  border: none !important;
}

.mantine-Input-label,
.mantine-TextInput-label,
.mantine-NumberInput-label,
.mantine-Textarea-label,
.mantine-Select-label {
  border: none !important;
  background: none !important;
}

/* Fix settings/fieldset default borders */
fieldset {
  border: none !important;
}

.settings,
.settings-panel,
.settings-container {
  border: none !important;
}

/* SearchBox Component Styles */
.wefab-search-container {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
}

.wefab-search-input {
  border: 1px solid var(--material-silver);
  border-radius: var(--radius-md);
  padding: var(--space-md) var(--space-lg);
  padding-left: 2.5rem; /* Space for search icon */
  padding-right: 2.5rem; /* Space for clear button */
  font-size: 0.875rem;
  width: 100%;
  background: white;
  color: var(--precision-black);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.wefab-search-input:focus {
  outline: none;
  border-color: var(--blueprint-blue);
  box-shadow: 0 0 0 2px rgba(26, 58, 95, 0.1);
}

.wefab-search-input::placeholder {
  color: var(--machine-gray);
}

.wefab-search-icon {
  position: absolute;
  left: var(--space-md);
  top: 50%;
  transform: translateY(-50%);
  color: var(--machine-gray);
  pointer-events: none;
  z-index: 1;
}

.wefab-search-clear {
  position: absolute;
  right: var(--space-md);
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  color: var(--machine-gray);
  cursor: pointer;
  padding: 2px;
  border-radius: 2px;
  transition: color 0.2s ease, background-color 0.2s ease;
  z-index: 1;
}

.wefab-search-clear:hover {
  color: var(--precision-black);
  background-color: var(--material-silver);
}

/* Breadcrumb Component Styles */
.wefab-breadcrumb-item {
  text-decoration: none !important;
}

.wefab-breadcrumb-item:hover {
  text-decoration: none !important;
}

.wefab-breadcrumb-item:focus {
  text-decoration: none !important;
}

.wefab-breadcrumb-item:active {
  text-decoration: none !important;
}

/* Override any Mantine Anchor default styles */
.mantine-Anchor-root.wefab-breadcrumb-item {
  text-decoration: none !important;
}
.mantine-Anchor-root.wefab-breadcrumb-item:hover,
.mantine-Anchor-root.wefab-breadcrumb-item:focus,
.mantine-Anchor-root.wefab-breadcrumb-item:active {
  text-decoration: none !important;
}

.wefab-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.875rem;
}

.wefab-table-container {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.wefab-table th {
  background: var(--technical-white);
  color: var(--precision-black);
  font-weight: 600;
  padding: var(--space-md);
  border-bottom: 1px solid var(--material-silver);
  text-align: left;
}

.wefab-table td {
  padding: var(--space-md);
  border-bottom: 1px solid var(--material-silver);
  color: var(--precision-black);
  word-wrap: break-word;
  overflow-wrap: break-word;
  max-width: 200px;
}

.wefab-table tr:hover {
  background: var(--technical-white);
}

.wefab-badge {
  display: inline-block;
  padding: var(--space-xs) var(--space-sm);
  border-radius: var(--radius-sm);
  font-size: 0.75rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.025em;
}

.wefab-badge-success {
  background: rgba(18, 133, 110, 0.1);
  color: var(--process-green);
}

.wefab-badge-warning {
  background: rgba(255, 87, 34, 0.1);
  color: var(--safety-orange);
}

.wefab-badge-info {
  background: rgba(26, 58, 95, 0.1);
  color: var(--blueprint-blue);
}

/* PrimeNG-style Data Grid - matches exact structure */
.table-card {
  width: 100%;
  background: white;
  border-radius: var(--radius-lg);
  overflow: hidden;
  border: 1px solid var(--material-silver);
}

.customer-card {
  /* Additional styling if needed */
}

.table-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: var(--space-md);
  border-bottom: 1px solid var(--material-silver);
  background: white;
}

.table-title {
  font-size: var(--text-lg);
  font-weight: 600;
  color: var(--precision-black);
  margin: 0;
}

.table-content {
  background: white;
}

.table-wrapper {
  width: 100%;
}

.common-table-container {
  width: 100%;
}

.table-responsive {
  overflow-x: auto;
  width: 100%;
}

.wefab-data-grid-table {
  width: 100%;
  border-collapse: collapse;
  background: white;
}

.wefab-data-grid-header-row {
  border-bottom: 1px solid var(--material-silver);
}

.wefab-data-grid-header-cell {
  text-align: left;
  background: var(--technical-white);
  font-size: 13px;
  font-weight: 500;
  height: 38px;
}

.wefab-data-grid-header-cell .wefab-data-grid-header-content {
  padding: 8px 12px;
}


.wefab-data-grid-header-content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-sm);
}

.wefab-data-grid-sort-btn {
  background: none;
  border: none;
  cursor: pointer;
  padding: var(--space-xs);
  border-radius: var(--radius-xs);
  color: var(--machine-gray);
  display: flex;
  align-items: center;
  transition: all 0.2s ease;
}

.wefab-data-grid-sort-btn:hover {
  background: rgba(84, 90, 100, 0.1);
  color: var(--machine-gray);
}

.wefab-data-grid-filter-row {
  border-bottom: 1px solid var(--material-silver);
}

.wefab-data-grid-filter-cell {
  background: var(--technical-white);
}

.wefab-data-grid-filter-cell > * {
  padding: 6px 12px;
}


.wefab-data-grid-filter-input {
  width: 100%;
  border: 1px solid var(--material-silver);
  border-radius: var(--radius-sm);
  padding: var(--space-sm);
  font-size: 0.875rem;
  background: white;
  color: var(--precision-black);
}

.wefab-data-grid-filter-input:focus {
  outline: none;
  border-color: var(--blueprint-blue);
}

.wefab-data-grid-filter-input::placeholder {
  color: var(--machine-gray);
  opacity: 0.8;
}

.wefab-data-grid-filter-container {
  width: 100%;
}

.wefab-data-grid-date-filter {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
}

.wefab-date-input {
  padding-right: var(--space-3xl) !important;
  cursor: pointer;
}

.wefab-data-grid-date-btn {
  position: absolute;
  right: var(--space-sm);
  background: none;
  border: none;
  cursor: pointer;
  color: var(--machine-gray);
  display: flex;
  align-items: center;
  padding: var(--space-xs);
  border-radius: var(--radius-xs);
}

.wefab-data-grid-date-btn:hover {
  background: var(--technical-white);
  color: var(--machine-gray);
}

.wefab-data-grid-row {
  border-bottom: 1px solid var(--material-silver);
}

.wefab-data-grid-row:last-child {
  border-bottom: none;
}

.wefab-data-grid-row:hover {
  background: var(--technical-white);
}

.wefab-data-grid-cell {
  vertical-align: middle;
  font-size: 13px;
  height: 34px;
}

.wefab-data-grid-cell > *,
.wefab-data-grid-cell {
  padding: 6px 12px;
}


.wefab-data-grid-footer {
  padding: var(--space-md) var(--space-lg);
  border-top: 1px solid var(--material-silver);
  background: white;
}

.wefab-data-grid-footer-content {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.wefab-data-grid-pagination {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
}

.wefab-data-grid-pagination-btn {
  background: white;
  border: 1px solid var(--material-silver);
  border-radius: var(--radius-sm);
  padding: var(--space-sm);
  cursor: pointer;
  display: flex;
  align-items: center;
  color: var(--machine-gray);
  transition: none;
}

.wefab-data-grid-pagination-btn:hover:not(:disabled) {
  background: white;
  color: var(--machine-gray);
  border-color: var(--material-silver);
}

/* PrimeNG Paginator Styling */
.p-paginator {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: var(--space-md);
  flex-wrap: wrap;
  background: white;
  padding: var(--space-sm) var(--space-md);
  border-top: 1px solid var(--material-silver);
}

.p-paginator-bottom {
  /* Bottom pagination specific styles */
}

.p-paginator-current {
  font-size: var(--text-sm);
  color: var(--machine-gray);
}

.p-paginator-element {
  background: none;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  color: var(--machine-gray);
  padding: var(--space-xs);
}

.p-paginator-element:hover:not(:disabled) {
  color: var(--machine-gray);
}

.p-paginator-element:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.p-link {
  text-decoration: none;
}

.p-paginator-prev {
  /* Previous button specific styles */
}

.p-paginator-next {
  /* Next button specific styles */
}

/* ===== ActivityTimeline Component Styles ===== */
.activity-timeline {
  display: flex;
  flex-direction: column;
  width: 100%;
  padding: 0.5rem 0;
  position: relative;
}

.activity-item:not(:last-child)::after {
  content: '';
  position: absolute;
  left: 20px;
  top: 28px;
  bottom: -1.25rem;
  width: 2px;
  background-color: var(--material-silver);
  z-index: 1;
}

.activity-item {
  display: flex;
  position: relative;
  align-items: flex-start;
}

.activity-item {
  margin-bottom: 1.25rem;
}

.activity-item:last-child {
  margin-bottom: 0;
}

.timeline-connector {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-right: 1rem;
  position: relative;
  width: 40px;
}

.timeline-dot {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  z-index: 3;
  position: relative;
}

.timeline-dot::after {
  content: '';
  position: absolute;
  top: -6px;
  left: -6px;
  right: -6px;
  bottom: -6px;
  border: 2px solid var(--process-green);
  border-radius: 50%;
  z-index: -1;
}

.timeline-dot.dot-data-modified {
  background-color: var(--process-green);
  border: 2px solid var(--process-green);
  color: var(--technical-white);
}

.timeline-dot.dot-record-created {
  background-color: var(--process-green);
  border: 2px solid var(--process-green);
  color: var(--technical-white);
}

.timeline-dot.dot-comment-added {
  background-color: var(--blueprint-blue);
  border: 2px solid var(--blueprint-blue);
  color: var(--technical-white);
}

.timeline-dot.dot-status-changed {
  background-color: var(--safety-orange);
  border: 2px solid var(--safety-orange);
  color: var(--technical-white);
}

.timeline-dot.dot-system {
  background-color: var(--machine-gray);
  border: 2px solid var(--machine-gray);
  color: var(--technical-white);
}

.activity-content-box {
  flex: 1 1;
  background: var(--technical-white);
  border: 1px solid var(--material-silver);
  border-radius: 6px;
  padding: 0.5rem 1rem 1rem 1rem;
}

.activity-badge {
  font-size: 11px;
  font-weight: 500;
  padding: 3px 10px;
  border-radius: 12px;
  white-space: nowrap;
  margin-bottom: 0.75rem !important;
  display: inline-block;
}

.activity-badge.badge-data-modified {
  background-color: rgba(18, 133, 110, 0.1);
  color: #12856E;
  border: 1px solid rgba(18, 133, 110, 0.3);
}

.activity-badge.badge-record-created {
  background-color: rgba(16, 185, 129, 0.15);
  color: #10B981;
  border: 1px solid rgba(16, 185, 129, 0.2);
}

.activity-badge.badge-comment-added {
  background-color: rgba(6, 182, 212, 0.15);
  color: #06B6D4;
  border: 1px solid rgba(6, 182, 212, 0.2);
}

.activity-badge.badge-status-changed {
  background-color: rgba(245, 158, 11, 0.15);
  color: #F59E0B;
  border: 1px solid rgba(245, 158, 11, 0.2);
}

.activity-badge.badge-system {
  background-color: rgba(107, 114, 128, 0.15);
  color: #6B7280;
  border: 1px solid rgba(107, 114, 128, 0.2);
}

.activity-description {
  margin-bottom: 0.75rem;
}

.activity-changes {
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
}

.change-item {
  display: flex;
  align-items: center;
  font-size: 13px;
  line-height: 1.4;
  gap: 0.25rem;
}

.change-indicator {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  font-size: 0.625rem;
  font-weight: 700;
  flex-shrink: 0;
}

.change-indicator.indicator-modified {
  background-color: #545A64;
  color: var(--technical-white);
}

.change-indicator.indicator-added {
  background-color: #10B981;
  color: var(--technical-white);
}

.change-indicator.indicator-removed {
  background-color: #EF4444;
  color: var(--technical-white);
}

.change-text {
  color: #4B5563;
  flex: 1 1;
  font-size: 12px !important;
}

.description-text {
  font-size: 13px;
  color: #4B5563;
  line-height: 1.4;
  margin: 0;
}

.activity-divider {
  height: 1px;
  background-color: var(--material-silver);
  margin: 0.75rem 0 0.5rem 0;
}

.user-info {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}

.user-avatar {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background-color: var(--material-silver);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 10px;
  font-weight: 500;
  color: #6B7280;
  margin-right: 0.5rem;
}

.user-name {
  font-size: 12px;
  font-weight: 500;
  color: #1F2937;
  flex: 1 1;
}

.activity-time {
  font-size: 11px;
  color: #6B7280;
  flex-shrink: 0;
}

/* ===== WorkflowStepper Component Styles ===== */
.wefab-workflow-container {
  background: white;
  border: 1px solid var(--material-silver);
  border-radius: var(--space-md);
  padding: var(--space-lg);
  box-shadow: 0 1px 3px rgba(26, 58, 95, 0.1);
}

.wefab-workflow-stepper {
  display: flex;
  flex-direction: column;
  gap: var(--space-lg);
}

.wefab-workflow-header {
  margin-bottom: var(--space-md);
}

.wefab-workflow-container {
  display: flex;
  flex-direction: column;
  position: relative;
}

.wefab-workflow-stepper--horizontal .wefab-workflow-container {
  flex-direction: row;
  align-items: flex-start;
}

.wefab-workflow-step {
  display: flex;
  align-items: flex-start;
  position: relative;
  padding-bottom: var(--space-xl);
}

.wefab-workflow-step--last {
  padding-bottom: 0;
}

.wefab-workflow-stepper--horizontal .wefab-workflow-step {
  flex: 1 1;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding-bottom: 0;
  padding-right: var(--space-lg);
}

.wefab-workflow-stepper--horizontal .wefab-workflow-step--last {
  padding-right: 0;
}

.wefab-workflow-marker {
  flex-shrink: 0;
  width: 2rem;
  height: 2rem;
  margin-right: var(--space-lg);
  z-index: 2;
}

.wefab-workflow-stepper--horizontal .wefab-workflow-marker {
  margin-right: 0;
  margin-bottom: var(--space-md);
}

.wefab-workflow-icon {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 2px solid;
  background-color: #ffffff;
}

.wefab-workflow-step--completed .wefab-workflow-icon {
  background-color: var(--process-green);
  border-color: var(--process-green);
  color: var(--technical-white);
}

.wefab-workflow-step--active .wefab-workflow-icon {
  background-color: var(--blueprint-blue);
  border-color: var(--blueprint-blue);
  color: var(--technical-white);
}

.wefab-workflow-step--pending .wefab-workflow-icon {
  background-color: #ffffff;
  border-color: var(--material-silver);
  color: var(--machine-gray);
}

.wefab-workflow-step--cancelled .wefab-workflow-icon {
  background-color: var(--safety-orange);
  border-color: var(--safety-orange);
  color: var(--technical-white);
}

@keyframes pulse {
  0% { box-shadow: 0 0 0 0 rgba(26, 58, 95, 0.4); }
  70% { box-shadow: 0 0 0 10px rgba(26, 58, 95, 0); }
  100% { box-shadow: 0 0 0 0 rgba(26, 58, 95, 0); }
}

.wefab-workflow-connector {
  position: absolute;
  left: 0.9375rem; /* 15px - center of the 32px marker */
  top: 2rem;
  bottom: 0;
  width: 2px;
  background-color: var(--material-silver);
  z-index: 1;
}

.wefab-workflow-step--completed .wefab-workflow-connector {
  background-color: var(--process-green);
}

.wefab-workflow-step--active .wefab-workflow-connector {
  background: linear-gradient(to bottom, var(--process-green) 0%, var(--material-silver) 100%);
}

.wefab-workflow-stepper--horizontal .wefab-workflow-connector {
  left: auto;
  right: 0;
  top: 0.9375rem; /* 15px - center of the 32px marker */
  bottom: auto;
  width: calc(100% - 1rem);
  height: 2px;
}

.wefab-workflow-content {
  flex: 1 1;
  min-width: 0;
}

.wefab-workflow-stepper--horizontal .wefab-workflow-content {
  flex: none;
}

.wefab-workflow-title {
  font-weight: 600;
  margin-bottom: var(--space-xs);
  color: var(--precision-black);
}

.wefab-workflow-step--completed .wefab-workflow-title {
  color: var(--process-green);
}

.wefab-workflow-step--active .wefab-workflow-title {
  color: var(--blueprint-blue);
}

.wefab-workflow-step--cancelled .wefab-workflow-title {
  color: var(--safety-orange);
}

.wefab-workflow-description {
  color: var(--machine-gray);
  margin-bottom: var(--space-xs);
  line-height: 1.4;
}

.wefab-workflow-timestamp {
  color: var(--machine-gray);
  font-style: italic;
}

/* ===== Approval Workflow Component Styles (HTML Structure) ===== */
.workflow-stepper-container {
  background: white;
  border: 1px solid var(--material-silver);
  border-radius: var(--radius-md);
  padding: var(--space-lg);
  box-shadow: 0 1px 3px rgba(26, 58, 95, 0.1);
}

.workflow-header {
  margin-bottom: var(--space-lg);
}

.workflow-title {
  font-weight: 600;
  color: var(--blueprint-blue);
  margin: 0;
}

.workflow-steps {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.workflow-step {
  display: flex;
  align-items: flex-start;
  position: relative;
  padding-bottom: var(--space-xl);
}

.workflow-step:last-child {
  padding-bottom: 0;
}

.step-icon-container {
  flex-shrink: 0;
  width: 2.5rem;
  height: 2.5rem;
  margin-right: 0px !important;
  z-index: 2;
  position: relative;
}

.step-icon {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 2px solid;
  background-color: #ffffff;
  font-size: 0.875rem;
}

/* Icon status styles - exactly matching PrimeIcons style */
.step-icon-complete {
  background-color: var(--process-green) !important;
  border: 3px solid var(--process-green) !important;
  color: var(--technical-white) !important;
  box-shadow: 0 0 0 2px white, 0 0 0 4px var(--process-green) !important;
}

.step-icon-waiting {
  background-color: #ffffff !important;
  border-color: var(--material-silver) !important;
  color: var(--blueprint-blue) !important;
}

.step-icon-active {
  background-color: var(--blueprint-blue) !important;
  border-color: var(--blueprint-blue) !important;
  color: var(--technical-white) !important;
  animation: pulse 2s infinite;
}

/* Tabler icon styles within step icons - mimic pi icons */
.step-icon svg {
  width: 12px !important;
  height: 12px !important;
  stroke-width: 2.5 !important;
  fill: none !important;
}

/* For completed state - make check icon more prominent */
.step-icon-complete svg {
  stroke-width: 3 !important;
}

/* For waiting/clock icon */
.step-icon-waiting svg {
  stroke-width: 2 !important;
}

/* Step connector lines */
.step-connector {
  position: absolute;
  left: 50%;
  top: 2.5rem;
  bottom: -1.5rem;
  width: 2px;
  background-color: var(--material-silver);
  transform: translateX(-50%);
  z-index: 1;
}

.step-completed .step-connector {
  background-color: var(--process-green);
}

.step-waiting .step-connector {
  background-color: var(--material-silver);
}

/* Step content */
.step-content {
  flex: 1 1;
  min-width: 0;
  margin-left: var(--space-lg);
}

.step-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: var(--space-xs);
}

.step-title {
  font-weight: 600;
  color: var(--precision-black);
  margin: 0;
  font-size: var(--text-base);
}

.step-completed .step-title {
  color: var(--process-green);
}

.step-waiting .step-title {
  color: var(--precision-black);
}

/* Status badges */
.step-status {
  font-size: var(--text-xs);
  font-weight: 500;
  padding: var(--space-xs) var(--space-sm);
  border-radius: var(--radius-sm);
}

.status-complete {
  background-color: rgba(18, 133, 110, 0.1);
  color: var(--process-green);
}

.status-waiting {
  background-color: rgba(84, 90, 100, 0.1);
  color: var(--machine-gray);
}

.status-active {
  background-color: rgba(26, 58, 95, 0.1);
  color: var(--blueprint-blue);
}

/* ===== Timeline WorkflowStepper Styles ===== */
.workflow-stepper-container .mantine-Timeline-root {
  --timeline-line-color: var(--material-silver);
  --timeline-bullet-border-width: 2px;
}

/* Timeline bullet styling */
.workflow-stepper-container .mantine-Timeline-itemBullet {
  background: white;
  border: 2px solid var(--material-silver);
  width: 32px;
  height: 32px;
}

/* Override ALL possible Mantine Timeline color variations with our custom colors */
.workflow-stepper-container .mantine-Timeline-root {
  --mantine-color-green-0: var(--process-green) !important;
  --mantine-color-green-1: var(--process-green) !important;
  --mantine-color-green-2: var(--process-green) !important;
  --mantine-color-green-3: var(--process-green) !important;
  --mantine-color-green-4: var(--process-green) !important;
  --mantine-color-green-5: var(--process-green) !important;
  --mantine-color-green-6: var(--process-green) !important;
  --mantine-color-green-7: var(--process-green) !important;
  --mantine-color-green-8: var(--process-green) !important;
  --mantine-color-green-9: var(--process-green) !important;
  --mantine-color-green-filled: var(--process-green) !important;
  --mantine-color-blue-filled: var(--blueprint-blue) !important;
  --mantine-color-blue-6: var(--blueprint-blue) !important;
}

/* Force our green on ALL possible completed step selectors */
.workflow-stepper-container .mantine-Timeline-item[data-line-active="true"] .mantine-Timeline-itemBullet,
.workflow-stepper-container .mantine-Timeline-item[data-timeline-item-color="green"] .mantine-Timeline-itemBullet,
.workflow-stepper-container .mantine-Timeline-itemBullet[data-with-color="true"][data-timeline-color="green"],
.workflow-stepper-container .mantine-Timeline-itemBullet[style*="green"],
.workflow-stepper-container .mantine-Timeline-itemBullet[class*="green"] {
  background-color: var(--process-green) !important;
  background: var(--process-green) !important;
  border-color: var(--process-green) !important;
  color: var(--technical-white) !important;
}

/* Force our blue on ALL possible active step selectors */
.workflow-stepper-container .mantine-Timeline-item[data-active="true"] .mantine-Timeline-itemBullet,
.workflow-stepper-container .mantine-Timeline-item[data-timeline-item-color="blue"] .mantine-Timeline-itemBullet,
.workflow-stepper-container .mantine-Timeline-itemBullet[data-with-color="true"][data-timeline-color="blue"],
.workflow-stepper-container .mantine-Timeline-itemBullet[style*="blue"],
.workflow-stepper-container .mantine-Timeline-itemBullet[class*="blue"] {
  background-color: var(--blueprint-blue) !important;
  background: var(--blueprint-blue) !important;
  border-color: var(--blueprint-blue) !important;
  color: var(--technical-white) !important;
}

/* Default gray for pending items - must come first */
.workflow-stepper-container .mantine-Timeline-itemBullet {
  background-color: #ffffff !important;
  border-color: var(--material-silver) !important;
  color: var(--blueprint-blue) !important;
}

/* Nuclear option - target completed items by position (active timeline sets colors automatically) */
.workflow-stepper-container .mantine-Timeline-item[data-line-active] .mantine-Timeline-itemBullet,
.workflow-stepper-container .mantine-Timeline-item[data-line-active="true"] .mantine-Timeline-itemBullet {
  background-color: var(--process-green) !important;
  border-color: var(--process-green) !important;
  color: var(--technical-white) !important;
}

/* Force green for ALL completed items with our custom class */
.workflow-stepper-container .completed-step .mantine-Timeline-itemBullet {
  background-color: var(--process-green) !important;
  border-color: var(--process-green) !important;
  color: var(--technical-white) !important;
}

/* Timeline bullet icons */
.workflow-stepper-container .mantine-Timeline-itemBullet svg {
  width: 14px;
  height: 14px;
}

/* Remove Mantine default focus styles */
.workflow-stepper-container .mantine-Timeline-itemBullet,
.workflow-stepper-container .mantine-Timeline-itemBullet *,
.workflow-stepper-container .mantine-Timeline-itemBullet [role="button"] {
  outline: none !important;
  border-radius: 50% !important;
}

/* Custom clickable bullet hover effect */
.workflow-stepper-container .mantine-Timeline-itemBullet [role="button"]:hover {
  background-color: rgba(59, 130, 246, 0.1);
  transform: scale(1.05);
}

/* Custom clickable bullet focus - no outline */
.workflow-stepper-container .mantine-Timeline-itemBullet [role="button"]:focus {
  background-color: rgba(59, 130, 246, 0.15);
  transform: scale(1.1);
}

/* ===== Card Component Variants Styles ===== */
.wefab-card {
  background: white;
  border-radius: var(--space-md);
  border: 1px solid var(--material-silver);
  overflow: hidden;
}

/* ===== Stat Card Styles ===== */
.stat-card {
  background: #FFFFFF;
  border-radius: var(--radius-md);
  border: 1px solid var(--material-silver);
  padding: var(--space-lg) var(--space-xl);
  position: relative;
  transition: all 0.2s ease;
  min-height: 90px;
  width: 100%;
  max-width: 280px;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: var(--space-lg);
  box-shadow: 0 1px 3px rgba(26, 29, 33, 0.05);
}

.stat-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 20px rgba(26, 29, 33, 0.1);
  border-color: var(--blueprint-blue);
}

.stat-card--blue,
.stat-card--orange,
.stat-card--green,
.stat-card--gray {
  border: 1px solid var(--material-silver);
}

.stat-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: var(--radius-md);
  font-size: var(--text-h4);
  flex-shrink: 0;
}

.stat-card--blue .stat-icon {
  background-color: rgba(26, 58, 95, 0.08);
  color: var(--blueprint-blue);
}

.stat-card--orange .stat-icon {
  background-color: rgba(255, 87, 34, 0.08);
  color: var(--safety-orange);
}

.stat-card--green .stat-icon {
  background-color: rgba(18, 133, 110, 0.08);
  color: var(--process-green);
}

.stat-card--gray .stat-icon {
  background-color: rgba(84, 90, 100, 0.08);
  color: var(--machine-gray);
}

.stat-content {
  flex: 1 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.stat-number {
  font-size: var(--text-h1);
  font-weight: var(--weight-bold);
  line-height: var(--line-height-heading);
  margin-bottom: var(--space-xs);
}

.stat-card--blue .stat-number {
  color: var(--blueprint-blue);
}

.stat-card--orange .stat-number {
  color: var(--safety-orange);
}

.stat-card--green .stat-number {
  color: var(--process-green);
}

.stat-card--gray .stat-number {
  color: var(--machine-gray);
}

.stat-label {
  font-size: var(--text-body-small);
  font-weight: var(--weight-medium);
  color: var(--machine-gray);
  line-height: var(--line-height-body-small);
}

.stat-trend {
  margin-top: var(--space-xs);
  font-size: var(--text-caption);
  font-weight: var(--weight-semibold);
  display: flex;
  align-items: center;
  gap: var(--space-xs);
}

.stat-trend--up {
  color: var(--process-green);
}

.stat-trend--down {
  color: var(--safety-orange);
}

.stat-trend--neutral {
  color: var(--machine-gray);
}


/* Highlight Card Variant */
.highlight-card {
  display: flex;
  align-items: center;
  background: linear-gradient(135deg, #f6f7f9 0%, #ffffff 100%);
  border-radius: var(--space-md);
  border: 1px solid var(--material-silver);
  padding: var(--space-lg);
  position: relative;
  overflow: hidden;
  min-height: 90px;
  box-shadow: 0 2px 8px rgba(26, 58, 95, 0.1);
}

.highlight-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3.5rem;
  height: 3.5rem;
  margin-right: var(--space-lg);
  background: linear-gradient(135deg, var(--blueprint-blue), var(--process-green));
  border-radius: 50%;
  color: var(--technical-white);
  font-size: 1.5rem;
  flex-shrink: 0;
}

.highlight-content {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
  flex: 1 1;
}

.highlight-label {
  font-size: var(--text-sm);
  color: var(--machine-gray);
  font-weight: 500;
  margin: 0;
}

.highlight-value {
  font-size: var(--text-xl);
  font-weight: 700;
  color: var(--precision-black);
  line-height: 1;
}

/* ===== Drawing Card Styles (Angular Structure) ===== */
.drawing-card {
  display: flex;
  flex-direction: column;
  background: white;
  border-radius: var(--space-md);
  border: 1px solid var(--material-silver);
  overflow: hidden;
  transition: all 0.2s ease;
  cursor: pointer;
}

.drawing-card:hover {
  box-shadow: 0 4px 12px rgba(26, 58, 95, 0.15);
  transform: translateY(-2px);
}

.drawing-image {
  position: relative;
  width: 100%;
  height: 200px;
  background: var(--technical-white);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

.drawing-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.2s ease;
}

.drawing-image:hover img {
  transform: scale(1.05);
}

.drawing-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  color: var(--machine-gray);
  font-size: var(--text-sm);
  background: var(--technical-white);
}

.drawing-fallback {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  color: var(--machine-gray);
  font-size: var(--text-sm);
  background: var(--technical-white);
}

.drawing-hover-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(26, 58, 95, 0.8);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity 0.2s ease;
}

.drawing-image:hover .drawing-hover-overlay {
  opacity: 1;
}

.view-icon-btn {
  background: white;
  border: none;
  border-radius: 50%;
  width: 3rem;
  height: 3rem;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--blueprint-blue);
  font-size: 1.25rem;
  cursor: pointer;
  transition: all 0.2s ease;
}

.view-icon-btn:hover {
  background: var(--technical-white);
  transform: scale(1.1);
}

.drawing-info {
  padding: var(--space-md);
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
  position: relative;
}

.drawing-info-footer {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-top: var(--space-xs);
}

.drawing-label {
  font-size: var(--text-sm);
  color: var(--precision-black);
  font-weight: 500;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.drawing-card .attachment-type {
  display: inline-block;
  padding: 1px 3px;
  border-radius: var(--radius-sm);
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1px;
  min-width: auto;
  width: -moz-fit-content;
  width: fit-content;
}

.drawing-card .attachment-type.image {
  background: var(--process-green);
  color: var(--technical-white);
}

.drawing-card .attachment-type.pdf {
  background: var(--safety-orange);
  color: var(--technical-white);
}

.drawing-card .attachment-type.autocad {
  background: var(--blueprint-blue);
  color: var(--technical-white);
}

.drawing-card .attachment-type.excel {
  background: var(--machine-gray);
  color: var(--technical-white);
}

.drawing-timestamp {
  font-size: 10px;
  color: var(--machine-gray);
  font-weight: 400;
  opacity: 0.8;
}

/* Chat attachment styling - minimal overrides */
.other-message-attachment .drawing-card {
  /* Let component render naturally */
}

/* Let Card component render naturally - no overrides */

/* File type badge colors - Chat specific requirements */
/* Images: Blue */
.drawing-card .attachment-type.png,
.drawing-card .attachment-type.jpg,
.drawing-card .attachment-type.jpeg,
.drawing-card .attachment-type.gif,
.drawing-card .attachment-type.webp,
.drawing-card .attachment-type.svg {
  background: var(--blueprint-blue) !important;
  color: var(--technical-white) !important;
}

/* PDFs: Red */
.drawing-card .attachment-type.pdf {
  background: #dc2626 !important;
  color: var(--technical-white) !important;
}

/* CAD Files: Orange */
.drawing-card .attachment-type.stl,
.drawing-card .attachment-type.igs,
.drawing-card .attachment-type.iges,
.drawing-card .attachment-type.step,
.drawing-card .attachment-type.stp,
.drawing-card .attachment-type.3mf,
.drawing-card .attachment-type.dwg {
  background: var(--safety-orange) !important;
  color: var(--technical-white) !important;
}

/* Excel/Spreadsheets: Green */
.drawing-card .attachment-type.xlsx,
.drawing-card .attachment-type.xls,
.drawing-card .attachment-type.excel,
.drawing-card .attachment-type.csv {
  background: var(--process-green) !important;
  color: var(--technical-white) !important;
}

/* Chat mobile responsiveness */
@media (max-width: var(--breakpoint-md)) {
  .wefab-chat {
    height: 100vh !important;
    border-radius: 0 !important;
  }

  .wefab-chat-sidebar {
    width: 100% !important;
    max-width: none !important;
    min-width: 100% !important;
    border-right: none !important;
    border-bottom: 1px solid var(--material-silver) !important;
    border-top-right-radius: var(--radius-lg) !important;
    height: 200px !important;
    flex-shrink: 0 !important;
  }

  .wefab-chat-messages {
    flex: 1 1 !important;
  }
}

/* Chat theme support */
.wefab-chat--blue .wefab-notification-badge,
.wefab-chat--blue .user-online-indicator {
  background-color: var(--blueprint-blue) !important;
}

.wefab-chat--orange .wefab-notification-badge,
.wefab-chat--orange .user-online-indicator {
  background-color: var(--safety-orange) !important;
}




/* Own message styling for chat attachments */
.own-message-attachment .drawing-card {
  background: rgba(255, 255, 255, 0.15) !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
}

.own-message-attachment .drawing-info {
  background: rgba(255, 255, 255, 0.2) !important;
}

.own-message-attachment .drawing-label {
  color: rgba(255, 255, 255, 0.9) !important;
}

.own-message-attachment .drawing-timestamp {
  color: rgba(255, 255, 255, 0.7) !important;
}

.own-message-attachment .attachment-type {
  background: rgba(255, 255, 255, 0.3) !important;
  color: var(--technical-white) !important;
}

/* ===== Summary Card Styles (Angular Structure) ===== */
.summary-section {
  background: #ffffff;
  border: 1px solid var(--material-silver);
  border-radius: 8px;
  padding: var(--space-lg);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  overflow: hidden;
}

.summary-title {
  font-size: var(--text-lg);
  font-weight: 600;
  color: var(--precision-black);
  margin-bottom: var(--space-lg);
  border-bottom: 1px solid var(--material-silver);
  padding-bottom: var(--space-md);
}

.summary-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: var(--space-sm) 0;
  border-bottom: 1px solid var(--technical-white);
}

.summary-row:last-child {
  border-bottom: none;
}

.summary-label {
  font-size: var(--text-sm);
  color: var(--machine-gray);
  font-weight: 500;
}

.summary-value {
  font-size: var(--text-sm);
  color: var(--precision-black);
  font-weight: 600;
  text-align: right;
}

.total-row {
  border-top: 2px solid var(--material-silver);
  padding-top: var(--space-md);
  margin-top: var(--space-sm);
  font-weight: 700;
}

.total-row .summary-label,
.total-row .summary-value {
  font-weight: 700;
  font-size: var(--text-base);
  color: var(--precision-black);
}

.highlight-row {
  background-color: #ffffff;
  margin: 0 calc(-1 * var(--space-lg));
  padding: var(--space-sm) var(--space-lg);
  border-radius: var(--space-sm);
  border-bottom: none;
}

/* Data Card Styles */
.wefab-card--data-card {
  padding: var(--space-lg);
}

.wefab-data-card-content {
  display: flex;
  flex-direction: column;
  gap: var(--space-lg);
}

.wefab-data-card-title {
  color: var(--precision-black);
  margin: 0;
  font-weight: 600;
  padding-bottom: var(--space-md);
  border-bottom: 1px solid var(--material-silver);
}

.wefab-data-card-items {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}

.wefab-data-card-item {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: var(--space-md);
}

.wefab-data-card-key {
  color: var(--machine-gray);
  margin: 0;
  flex-shrink: 0;
  min-width: 30%;
  text-transform: capitalize;
}

.wefab-data-card-value {
  flex: 1 1;
  text-align: right;
  word-break: break-word;
}

/* ========================================
   Conversation Components Styles - Exact HTML Structure
   ======================================== */

/* Compose Section - Rich Text Editor */
.compose-section {
  background: white !important;
  margin-bottom: var(--space-lg);
}

.editor-section {
  margin-bottom: var(--space-md);
  background: white !important;
}

/* P-Editor Container (Quill-style editor) */
.p-editor-container {
  border: 1px solid #d1d5db;
  border-radius: 6px;
  overflow: hidden;
  background: white !important;
}

/* Toolbar Styles (Quill Snow Theme) */
.ql-toolbar.ql-snow {
  border: none;
  border-bottom: 1px solid #e5e7eb;
  background: white;
  padding: 8px 12px;
  display: flex;
  align-items: center;
  gap: 4px;
}

.ql-formats {
  margin-right: 15px;
}

.ql-formats:last-child {
  margin-right: 0;
}

.ql-toolbar .ql-bold,
.ql-toolbar .ql-italic,
.ql-toolbar .ql-underline,
.ql-toolbar .ql-list,
.ql-toolbar .ql-link {
  width: 28px;
  height: 28px;
  border: none;
  border-radius: 4px;
  background: none;
  color: black;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.ql-toolbar .ql-bold:hover,
.ql-toolbar .ql-italic:hover,
.ql-toolbar .ql-underline:hover,
.ql-toolbar .ql-list:hover,
.ql-toolbar .ql-link:hover {
  color: black;
  cursor: pointer;
}

/* Editor Content Area */
.p-editor-content.ql-container.ql-snow {
  border: none;
}

.ql-editor {
  padding: 12px;
  min-height: 120px;
  font-size: 14px;
  line-height: 1.5;
  color: var(--precision-black);
  outline: none;
  border: none;
}

.ql-editor.ql-blank::before {
  color: #9ca3af;
  font-style: normal;
  pointer-events: none;
}

.ql-editor p {
  margin: 0 0 8px 0;
}

.ql-editor:focus {
  outline: none;
}

/* Action Section - Attach File and Send together on right */
.action-section {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 0.5rem;
  margin-top: var(--space-md);
  width: 100%;
}

.attach-file-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: black;
  background: transparent;
  border: 1px solid black;
  border-radius: 4px;
  padding: 6px 12px;
  font-size: 14px;
  cursor: pointer;
  text-decoration: none;
  transition: all 0.2s ease;
}

.attach-file-btn:hover {
  background: black;
  color: var(--technical-white);
}

.send-btn {
  color: var(--technical-white) !important;
  padding: 0.4rem 0.8rem !important;
  font-size: 0.875rem !important;
  border-radius: 5px !important;
}

/* Blue variant (default) */
.send-btn-blue {
  background: var(--blueprint-blue) !important;
  border: 1px solid var(--blueprint-blue) !important;
}

.send-btn-blue:hover {
  background: #14344c !important;
  border-color: #14344c !important;
}

/* Orange variant */
.send-btn-orange {
  background: var(--safety-orange) !important;
  border: 1px solid var(--safety-orange) !important;
}

.send-btn-orange:hover {
  background: #e04e1f !important;
  border-color: #e04e1f !important;
}

/* Messages Section */
.messages-section {
  background: white !important;
}

.message {
  margin-bottom: var(--space-lg);
  display: flex;
  align-items: flex-start;
  gap: var(--space-md);
  background: white !important;
}

.message:last-child {
  margin-bottom: 0;
}

/* Profile Avatar */
.profile-avatar {
  flex-shrink: 0;
  width: 2.5rem;
  height: 2.5rem;
}

.avatar-text {
  width: 100%;
  height: 100%;
  background: var(--blueprint-blue);
  color: var(--technical-white);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  font-size: 1.1rem;
}

/* Message Bubble */
.message-bubble {
  flex: 1 1;
  background: white !important;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  padding: var(--space-md);
}

/* Message Header */
.message-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: var(--space-sm);
}

.sender-info {
  flex: 1 1;
}

.sender-details {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  margin-bottom: 4px;
}

.sender-details {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.25rem;
}

.sender-name {
  color: var(--precision-black);
  font-size: 0.875rem;
  font-weight: 600;
  margin: 0;
}

.message-type-badge {
  font-weight: 500;
  padding: 0.25rem 0.5rem;
  border-radius: 12px;
  text-transform: capitalize;
  font-size: 0.75rem;
  white-space: nowrap;
  display: inline-block;
}

.message-type-badge.comment {
  background-color: rgba(6, 182, 212, 0.15);
  color: #06B6D4;
  border: 1px solid rgba(6, 182, 212, 0.2);
}

.message-type-badge.update {
  background: var(--process-green);
  color: var(--technical-white);
}

.message-type-badge.system {
  background: var(--machine-gray);
  color: var(--technical-white);
}

.sender-email {
  color: #6b7280;
  font-size: 0.75rem;
  margin: 0;
  display: block;
}

.message-metadata {
  flex-shrink: 0;
}

.message-timestamp {
  font-size: 11px !important;
  color: var(--blueprint-blue) !important;
  font-weight: 400 !important;
  opacity: 0.8 !important;
  margin: 0;
}

/* Message Content */
.message-content {
  color: var(--precision-black);
}

.message-text {
  font-size: 0.875rem;
  line-height: 1.5;
  margin: 0 0 0.75rem 0;
}

.message-text p {
  margin: 0;
}

/* Message Attachments */
.message-attachments {
  margin-top: 0.75rem;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  grid-gap: 0.75rem;
  gap: 0.75rem;
}

.attachment-item {
  display: flex;
  align-items: center;
  gap: var(--space-md);
  padding: var(--space-sm);
  background: white;
  border: 1px solid #e5e7eb;
  border-radius: 6px;
}

.attachment-preview {
  width: 50px;
  height: 50px;
  flex-shrink: 0;
  border-radius: 4px;
  overflow: hidden;
  background: #f3f4f6;
  display: flex;
  align-items: center;
  justify-content: center;
}

.attachment-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.attachment-placeholder {
  text-align: center;
  color: #9ca3af;
  font-size: 10px;
  font-weight: 600;
}

.attachment-details {
  flex: 1 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.attachment-name {
  color: var(--precision-black);
  font-size: 14px;
  font-weight: 500;
  margin: 0;
  word-break: break-word;
  display: block;
}

.attachment-type {
  color: #6b7280;
  font-size: 12px;
  margin: 0;
  text-transform: uppercase;
  display: block;
}

.attachment-actions {
  display: flex;
  align-items: center;
  gap: 4px;
  flex-shrink: 0;
}

.action-btn {
  width: 32px;
  height: 32px;
  border: 1px solid #e5e7eb;
  border-radius: 4px;
  background: #f8fafc;
  color: #64748b;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s ease;
}

.action-btn:hover {
  background: #f1f5f9;
  border-color: #cbd5e1;
}

.view-btn {
  color: #3b82f6;
}

.view-btn:hover {
  background: #eff6ff;
  border-color: #3b82f6;
}

.download-btn {
  color: #8b5cf6;
}

.download-btn:hover {
  background: #f3f4f6;
  border-color: #8b5cf6;
}

/* ===== Tabs Component Styles (Angular Structure) ===== */
.tab-headers {
  display: flex;
  border-bottom: 1px solid var(--material-silver);
  background: white;
}

.tab-header {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.75rem 1rem;
  border: none;
  background: none;
  color: var(--machine-gray);
  font-size: var(--text-sm);
  font-weight: 500;
  cursor: pointer;
  border-bottom: 2px solid transparent;
  outline: none !important;
  box-shadow: none !important;
}

.tab-icon {
  display: flex;
  align-items: center;
  font-size: 1rem;
}

.tab-label {
  margin-left: 0.25rem;
}

.tab-header:focus,
.tab-header:focus-visible,
.tab-header:active {
  outline: none !important;
  box-shadow: none !important;
  border: none !important;
  border-bottom: 2px solid transparent !important;
}

.tab-header.active:focus,
.tab-header.active:focus-visible,
.tab-header.active:active {
  border-bottom: 2px solid var(--blueprint-blue) !important;
}

.tab-header:hover {
  color: var(--precision-black);
  background: var(--technical-white);
}

.tab-header.active {
  color: var(--precision-black) !important;
  border-bottom-color: var(--blueprint-blue) !important;
  background: white !important;
}

.tab-header.disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.tab-header.disabled:hover {
  color: var(--machine-gray);
  background: none;
}

.tab-content {
  padding: var(--space-lg);
  background: white;
  min-height: 200px;
}

/* ===== FileUpload Component Styles (Mantine Structure) ===== */
.file-upload-container.mantine-Paper-root {
  border-radius: var(--radius-lg) !important;
  box-shadow: var(--shadow-lg) !important;
  transition: none !important;
  animation: none !important;
  transform: none !important;
  border: 2px dashed #D1D5DB !important;
  background-color: #ffffff !important;
}

.file-upload-container.mantine-Paper-root:hover {
  transform: none !important;
  box-shadow: var(--shadow-lg) !important;
  transition: none !important;
}

.file-upload-container * {
  transition: none !important;
  animation: none !important;
  transform: none !important;
}

.h1-title {
  color: var(--precision-black);
  margin: 0;
}

.uploaded-files {
  margin-top: var(--space-lg);
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}

.file-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--space-sm) var(--space-md);
  background: #FFFFFF;
  border: 1px solid var(--material-silver);
  border-radius: var(--radius-md);
}

.file-item .file-info {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  margin-bottom: 0;
}

.file-name {
  font-size: var(--text-sm);
  font-weight: 500;
  color: var(--precision-black);
}

.file-size {
  font-size: var(--text-xs);
  color: var(--machine-gray);
}

.remove-file {
  background: none;
  border: none;
  color: var(--safety-orange);
  cursor: pointer;
  padding: var(--space-xs);
  border-radius: var(--radius-sm);
  display: flex;
  align-items: center;
  justify-content: center;
}

.remove-file:hover {
  background: rgba(255, 87, 34, 0.1);
}

/* ===== LineItem Component Styles (Angular BOM Structure) ===== */
.section-content {
  background: white;
  border-radius: var(--radius-md);
}

/* BOM Actions */
.bom-actions {
  margin-bottom: var(--space-lg);
}

.d-flex {
  display: flex;
}

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

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

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

.gap-2 {
  gap: var(--space-sm);
}

.gap-md-3 {
  gap: var(--space-md);
}

.mb-4 {
  margin-bottom: var(--space-lg);
}

.mb-3 {
  margin-bottom: var(--space-md);
}

/* Button Styles */
.btn-outline-secondary {
  background: white;
  color: var(--machine-gray);
  border-color: var(--material-silver);
}

.btn-outline-secondary:hover {
  background: var(--machine-gray);
  color: var(--technical-white);
}

.btn-outline-primary {
  background: white;
  color: var(--blueprint-blue);
  border-color: var(--blueprint-blue);
}

.btn-outline-primary:hover {
  background: var(--blueprint-blue);
  color: var(--technical-white);
}

/* ProQSmart Button - Outline style with ProQ blue (#1269FF) */
.btn-outline-proq {
  background: white;
  color: #1269FF;
  border: 1px solid #1269FF;
}

.btn-outline-proq:hover {
  background: #1269FF;
  color: white;
}

.upload-btn-wrapper {
  position: relative;
}

/* Line Items Container */
.line-items-container {
  margin-bottom: var(--space-lg);
}

.line-item-card {
  background: white;
  border: 1px solid var(--material-silver);
  border-radius: var(--radius-md);
  padding: var(--space-lg);
  margin-bottom: var(--space-md);
}

.line-item-header {
  margin-bottom: var(--space-lg);
  padding-bottom: var(--space-md);
  border-bottom: 1px solid var(--material-silver);
}

.line-item-header h6 {
  color: var(--precision-black);
  font-size: var(--text-lg);
  font-weight: 600;
  margin: 0;
}

/* Line Item Fields */
.line-item-fields-container {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  grid-gap: var(--space-lg);
  gap: var(--space-lg);
}

.line-item-field {
  display: flex;
  flex-direction: column;
}

.form-label {
  font-size: var(--text-sm);
  font-weight: 500;
  color: var(--precision-black);
  margin-bottom: var(--space-xs);
}

.required {
  color: var(--safety-orange);
  margin-left: 2px;
}

/* Quantity Field Specific */
.quantity-field .input-group {
  display: flex;
  align-items: center;
  gap: 0;
}

.quantity-btn {
  border-radius: var(--radius-sm);
  border: 1px solid var(--material-silver);
  background: white;
  color: var(--machine-gray);
  width: 40px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.quantity-btn:hover {
  background: var(--technical-white);
  color: var(--precision-black);
}

.quantity-input {
  flex: 1 1;
  margin: 0;
}

.quantity-input input {
  text-align: center;
  border-radius: 0;
  border-left: none;
  border-right: none;
}

/* Form Controls */
.form-control input,
.form-select .mantine-Select-input {
  border: 1px solid var(--material-silver);
  border-radius: var(--radius-sm);
  padding: var(--space-sm) var(--space-md);
  font-size: var(--text-sm);
  background: white;
  color: var(--precision-black);
}

.form-control input:focus,
.form-select .mantine-Select-input:focus {
  border-color: var(--blueprint-blue);
  outline: none;
  box-shadow: 0 0 0 2px rgba(26, 58, 95, 0.1);
}

/* Add Line Item */
.add-line-item {
  margin-top: var(--space-lg);
}

.btn-link {
  background: none;
  border: none;
  color: var(--blueprint-blue);
  text-decoration: none;
  font-weight: 500;
  font-size: var(--text-sm);
  padding: var(--space-sm) 0;
}

.btn-link:hover {
  color: var(--precision-black);
  text-decoration: underline;
}

.add-line-btn {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
}

/* Responsive adjustments */
@media (min-width: var(--container-md)) {
  .flex-md-row {
    flex-direction: row;
  }

  .gap-md-3 {
    gap: var(--space-md);
  }
}

/* ===== ModernSidebar Component Styles ===== */
.modern-sidebar {
  box-shadow: 2px 0 10px rgba(0, 0, 0, 0.1);
}

.modern-sidebar .sidebar-item:hover {
  background-color: #ffffff !important;
  color: var(--blueprint-blue) !important;
  transform: translateX(2px);
}

.modern-sidebar .sidebar-item.active:hover {
  background-color: var(--safety-orange) !important;
  color: var(--technical-white) !important;
  transform: none;
}

.modern-sidebar .sidebar-item.child {
  padding-left: 2rem !important;
  font-size: 0.875rem;
}

.modern-sidebar.collapsed .sidebar-item {
  justify-content: center;
}

/* ===== Profile Component Styles ===== */
.profile-dropdown {
  animation: slideDown 0.2s ease-out;
}

@keyframes slideDown {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Notification Dropdown */
.notification-dropdown {
  position: absolute;
  top: 100%;
  right: 0;
  margin-top: 0.5rem;
  width: 360px;
  background-color: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);
  z-index: 1000;
  overflow: hidden;
}

.notification-header {
  padding: 1.25rem 1.5rem 1rem;
  border-bottom: 1px solid #f3f4f6;
  background-color: #ffffff;
}

.notification-header span {
  font-weight: 700;
  font-size: 1rem;
  color: #111827;
}

.notification-list {
  max-height: 400px;
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none; /* IE and Edge */
}

.notification-list::-webkit-scrollbar {
  display: none; /* Chrome, Safari and Opera */
}

.notification-item {
  padding: 1rem 1.5rem;
  border-bottom: 1px solid #f9fafb;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  cursor: default;
  position: relative;
}

.notification-item:last-child {
  border-bottom: none;
}

.notification-item:hover {
  background-color: #f8fafc;
}

.notification-text {
  font-size: 0.875rem;
  color: #374151;
  line-height: 1.5;
  font-weight: 500;
}

.notification-time {
  font-size: 0.75rem;
  color: #9ca3af;
  font-weight: 400;
}

/* Profile Menu */
.profile-menu-item:hover {
  background-color: #ffffff !important;
}

.profile-menu-item.logout:hover {
  background-color: #ffffff !important;
}

/* Data Card Styles */
.data-card {
  /* Base data card styles */
}

/* Extra Small (xs) */
.data-card-xs .data-card-rows {
  gap: 0.125rem;
}

.data-card-xs .data-card-row {
  padding: 0.125rem 0;
}

.data-card-xs .data-card-row .mantine-Text-root {
  font-size: 0.625rem !important;
  line-height: 1.2 !important;
}

/* Small (sm) */
.data-card-sm .data-card-rows {
  gap: 0.25rem;
}

.data-card-sm .data-card-row {
  padding: 0.25rem 0;
}

.data-card-sm .data-card-row .mantine-Text-root {
  font-size: 0.6875rem !important;
  line-height: 1.3 !important;
}

/* Medium (md) */
.data-card-md .data-card-rows {
  gap: 0.375rem;
}

.data-card-md .data-card-row {
  padding: 0.375rem 0;
}

.data-card-md .data-card-row .mantine-Text-root {
  font-size: 0.75rem !important;
  line-height: 1.4 !important;
}

/* Large (lg) */
.data-card-lg .data-card-rows {
  gap: 0.5rem;
}

.data-card-lg .data-card-row {
  padding: 0.5rem 0;
}

.data-card-lg .data-card-row .mantine-Text-root {
  font-size: 0.875rem !important;
  line-height: 1.4 !important;
}

/* Extra Large (xl) */
.data-card-xl .data-card-rows {
  gap: 0.75rem;
}

.data-card-xl .data-card-row {
  padding: 0.75rem 0;
}

.data-card-xl .data-card-row .mantine-Text-root {
  font-size: 1rem !important;
  line-height: 1.5 !important;
}

/* 2 Extra Large (2xl) */
.data-card-2xl .data-card-rows {
  gap: 1rem;
}

.data-card-2xl .data-card-row {
  padding: 1rem 0;
}

.data-card-2xl .data-card-row .mantine-Text-root {
  font-size: 1.125rem !important;
  line-height: 1.5 !important;
}

/* Modern Sidebar Styles */
.sidebar-item:hover {
  background-color: #ffffff !important;
  color: var(--blueprint-blue) !important;
}

.sidebar-item.active:hover {
  background-color: var(--safety-orange) !important;
  color: var(--technical-white) !important;
}

.sidebar-item:focus,
.sidebar-item:focus-visible {
  outline: none !important;
  border: none !important;
  box-shadow: none !important;
}

.modern-sidebar button,
.modern-sidebar .mantine-UnstyledButton-root {
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
}

.modern-sidebar button:focus,
.modern-sidebar .mantine-UnstyledButton-root:focus {
  outline: none !important;
  border: none !important;
  box-shadow: none !important;
}

.modern-sidebar {
  box-shadow: 2px 0 10px rgba(0, 0, 0, 0.05);
}

.modern-sidebar.collapsed {
  width: 60px !important;
}

/* Header Button Styles - Remove default borders */
.wefab-header button,
.wefab-header .mantine-UnstyledButton-root {
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
}

.wefab-header button:focus,
.wefab-header .mantine-UnstyledButton-root:focus {
  outline: none !important;
  border: none !important;
  box-shadow: none !important;
}

.wefab-header button:focus-visible,
.wefab-header .mantine-UnstyledButton-root:focus-visible {
  outline: 2px solid var(--safety-orange) !important;
  outline-offset: 2px !important;
  border: none !important;
}

/* Header responsive behavior */
.wefab-header-burger {
  display: none;
}

.wefab-header-navlinks {
  display: flex;
  margin-left: 2rem;
}

/* Mobile: Show burger, hide navlinks */
@media (max-width: var(--breakpoint-md)) {
  .wefab-header-burger {
    display: flex !important;
  }

  .wefab-header-navlinks {
    display: none !important;
  }
}

/* Tablet and up: Hide burger, show navlinks */
@media (min-width: calc(var(--breakpoint-md) + 1px)) {
  .wefab-header-burger {
    display: none !important;
  }

  .wefab-header-navlinks {
    display: flex !important;
  }
}

/* Collapse Variants */
.wefab-collapse {
  overflow: hidden;
}

/* Default variant - clean minimal look */
.wefab-collapse-default {
  background: transparent;
  border: none;
  border-radius: 0;
}

/* Bordered variant - subtle border with rounded corners */
.wefab-collapse-bordered {
  background: white;
  border: 1px solid var(--material-silver);
  border-radius: var(--radius-md);
  margin-top: var(--space-sm);
}

/* Elevated variant - card-like with shadow */
.wefab-collapse-elevated {
  background: white;
  border: 1px solid var(--material-silver);
  border-radius: var(--radius-lg);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  margin-top: var(--space-md);
  padding: var(--space-sm);
}

/* ============================================================================
   Bell Notifications Component - Equinox Design System Compliant
   Follows Section 11.4 (Notification Center) and Section 14 (Accessibility)
   ============================================================================ */

/* Bell trigger button */
.wefab-bell-trigger {
  padding: 0.5rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--eq-color-text-secondary, #475E75);
  position: relative;
  background-color: transparent;
  transition: background-color 150ms ease-out;
}

.wefab-bell-trigger:hover {
  background-color: var(--eq-color-bg, #F5F6F7);
}

/* CRITICAL: Focus indicators required per Section 14.2 */
.wefab-bell-trigger:focus-visible {
  outline: 2px solid var(--eq-color-primary, #0070F2);
  outline-offset: 2px;
}

/* Notification badge (unread indicator) */
.wefab-notification-badge {
  position: absolute;
  top: 0.25rem;
  right: 0.25rem;
  border-radius: 50%;
  animation: pulse 2s infinite;
}

/* Notification count badge */
.wefab-notification-count-badge {
  position: absolute;
  top: 2px;
  right: 2px;
  min-width: 16px;
  height: 16px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  padding: 0 4px;
  color: white;
  border: 2px solid white;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
  transition: all 200ms ease;
  z-index: 10;
}

.wefab-badge-orange {
  background-color: var(--safety-orange, #E9730C);
}

.wefab-badge-blue {
  background-color: var(--eq-color-primary, #0070F2);
}

.wefab-badge-red {
  background-color: #f74444;
}

/* Pulse animation for unread badge */
@keyframes pulse {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0.5;
  }
}

/* Dropdown panel - Section 11.4 specs: 400px width */
.wefab-notification-dropdown {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  max-width: 90vw;
  background: var(--eq-color-bg, #F5F6F7);
  border-radius: 12px;
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
  z-index: 99999 !important;
  border: 1px solid rgba(0, 0, 0, 0.1);
  overflow: hidden;
}

/* Entry animation - Section 12.2: 200ms fade + slide */
.wefab-notification-dropdown-animate {
  animation: notificationSlideIn 200ms ease-out;
}

@keyframes notificationSlideIn {
  from {
    opacity: 0;
    transform: translateY(-8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Header section */
.wefab-notification-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 20px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
  background-color: var(--eq-color-surface, #FFFFFF);
}

.wefab-notification-header-title {
  color: var(--eq-color-text-primary, #223548);
  font-weight: 600;
  font-size: 15px;
}

.wefab-notification-header-actions {
  display: flex;
  align-items: center;
  gap: 12px;
}

/* Mark all as read button */
.wefab-mark-all-read-btn {
  color: var(--eq-color-primary, #0070F2);
  font-size: 12px;
  font-weight: 500;
  padding: 4px 8px;
  border-radius: 4px;
  cursor: pointer;
  transition: all 150ms ease;
}

.wefab-mark-all-read-btn:hover {
  background-color: rgba(0, 112, 242, 0.1);
}

.wefab-mark-all-read-btn:focus-visible {
  outline: 2px solid var(--eq-color-primary, #0070F2);
  outline-offset: 2px;
}

.wefab-mark-all-read-btn:disabled {
  color: var(--eq-color-text-tertiary, #919BA5);
  cursor: default;
  opacity: 0.6;
}

.wefab-mark-all-read-btn:disabled:hover {
  background-color: transparent;
}

/* Notification list container with padding */
.wefab-notification-list-container {
  padding: 12px;
  background-color: transparent;
}

/* Notification list scroll area */
.wefab-notification-list {
  max-height: 400px;
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-width: thin;
  scrollbar-color: var(--eq-color-border, #D3D7DB) transparent;
}

.wefab-notification-list::-webkit-scrollbar {
  width: 6px;
}

.wefab-notification-list::-webkit-scrollbar-track {
  background: transparent;
}

.wefab-notification-list::-webkit-scrollbar-thumb {
  background-color: var(--eq-color-border, #D3D7DB);
  border-radius: 3px;
}

/* Notification card - Individual cards with elevation */
.wefab-notification-card {
  padding: 14px 16px;
  margin-bottom: 8px;
  cursor: pointer;
  position: relative;
  width: 100%;
  text-align: left;
  background-color: var(--eq-color-surface, #FFFFFF);
  border-radius: 10px;
  border: 1px solid rgba(0, 0, 0, 0.08);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
  transition: all 150ms ease;
  display: flex;
  flex-direction: column;
  gap: 0;
}

.wefab-notification-card:last-child {
  margin-bottom: 0;
}

/* Unread state - Blue left border on card */
.wefab-notification-card.unread {
  border-left: 3px solid var(--eq-color-primary, #0070F2);
  padding-left: 13px;
}

.wefab-notification-card:hover {
  background-color: var(--eq-color-surface, #FFFFFF);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  transform: translateY(-1px);
}

/* CRITICAL: Focus indicator required per Section 14.2 */
.wefab-notification-card:focus-visible {
  outline: 2px solid var(--eq-color-primary, #0070F2);
  outline-offset: 2px;
  box-shadow: 0 2px 8px rgba(0, 112, 242, 0.15);
}

/* Typography - Section 2.4: 14px minimum for body content, 12px for captions */
.wefab-notification-header {
  font-size: 14px !important;
  line-height: 1.4 !important;
  color: var(--eq-color-text-primary, #223548);
  font-weight: 600 !important;
  margin: 0 0 4px 0;
}

.wefab-notification-text {
  font-size: 14px !important;
  line-height: 1.5 !important;
  color: var(--eq-color-text-secondary, #475E75);
  margin: 0 0 6px 0;
  word-wrap: break-word;
}

.wefab-notification-item.unread .wefab-notification-text {
  font-weight: 400;
  color: var(--eq-color-text-secondary, #475E75);
}

.wefab-notification-item.unread .wefab-notification-header {
  font-weight: 600 !important;
  color: var(--eq-color-text-primary, #223548);
}

.wefab-notification-time {
  font-size: 12px !important;
  line-height: 1.4 !important;
  color: var(--eq-color-text-tertiary, #919BA5);
  margin: 0;
}

/* Empty state - Section 7.2: Proper empty states required */
.wefab-notification-empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 40px 24px;
  text-align: center;
}

.wefab-notification-empty-icon {
  color: var(--eq-color-text-tertiary, #919BA5);
  margin-bottom: 12px;
  opacity: 0.4;
}

.wefab-notification-empty-title {
  color: var(--eq-color-text-primary, #223548);
  font-weight: 600;
  margin-bottom: 6px;
}

.wefab-notification-empty-description {
  color: var(--eq-color-text-tertiary, #919BA5);
  max-width: 280px;
}

/* Notification footer - View all button */
.wefab-notification-footer {
  border-top: 1px solid rgba(0, 0, 0, 0.08);
  padding: 0;
  background-color: var(--eq-color-surface, #FFFFFF);
}

.wefab-view-all-btn {
  width: 100%;
  padding: 14px 20px;
  text-align: center;
  color: var(--eq-color-primary, #0070F2);
  font-size: 14px;
  font-weight: 500;
  transition: all 150ms ease;
  border-radius: 0 0 12px 12px;
}

.wefab-view-all-btn:hover {
  background-color: rgba(0, 112, 242, 0.06);
}

.wefab-view-all-btn:focus-visible {
  outline: 2px solid var(--eq-color-primary, #0070F2);
  outline-offset: -2px;
}

/* ============================================================================
   Notifications Page - Full page view with date grouping
   Clean, minimal design following Equinox guidelines
   ============================================================================ */

.wefab-notifications-page {
  min-height: 100vh;
  background-color: var(--eq-color-bg, #F5F6F7);
}

/* Header section */
.wefab-notifications-page-header {
  background-color: var(--eq-color-surface, #FFFFFF);
  border-bottom: 1px solid var(--eq-color-border, #D3D7DB);
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 100;
}

.wefab-notifications-page-header-content {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 24px 32px;
  max-width: 800px;
  margin: 0 auto;
}

.wefab-notifications-page-title {
  color: var(--eq-color-text-primary, #223548);
  font-weight: 700;
}

.wefab-notifications-page-header-actions {
  display: flex;
  align-items: center;
  gap: 16px;
}

.wefab-notifications-mark-all-btn {
  color: var(--eq-color-primary, #0070F2);
  font-size: 14px;
  font-weight: 500;
  padding: 8px 12px;
  border-radius: 8px;
  transition: all 150ms ease;
}

.wefab-notifications-mark-all-btn:hover {
  background-color: rgba(0, 112, 242, 0.08);
}

.wefab-notifications-mark-all-btn:focus-visible {
  outline: 2px solid var(--eq-color-primary, #0070F2);
  outline-offset: 2px;
}

.wefab-notifications-filter-btn {
  padding: 8px;
  border-radius: 8px;
  color: var(--eq-color-text-secondary, #475E75);
  transition: all 150ms ease;
}

.wefab-notifications-filter-btn:hover {
  background-color: var(--eq-color-bg, #F5F6F7);
  color: var(--eq-color-text-primary, #223548);
}

.wefab-notifications-filter-btn.active {
  background-color: rgba(0, 112, 242, 0.08);
  color: var(--eq-color-primary, #0070F2);
}

.wefab-notifications-filter-btn:focus-visible {
  outline: 2px solid var(--eq-color-primary, #0070F2);
  outline-offset: 2px;
}

/* Filter panel */
.wefab-notifications-filter-panel {
  padding: 16px 32px 20px;
  border-top: 1px solid var(--eq-color-border, #D3D7DB);
  max-width: 800px;
  margin: 0 auto;
  background-color: var(--eq-color-surface, #FFFFFF);
  /* NO position/z-index - prevents creating stacking context that traps calendar */
}

.wefab-notifications-filter-row {
  display: flex;
  gap: 16px;
  margin-bottom: 12px;
}

.wefab-notifications-filter-field {
  flex: 1 1;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.wefab-notifications-filter-label {
  color: var(--eq-color-text-secondary, #475E75);
  font-weight: 500;
}

.wefab-notifications-clear-filters {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  color: var(--eq-color-text-tertiary, #919BA5);
  font-size: 13px;
  font-weight: 500;
  border-radius: 6px;
  transition: all 150ms ease;
}

.wefab-notifications-clear-filters:hover {
  background-color: var(--eq-color-bg, #F5F6F7);
  color: var(--eq-color-text-secondary, #475E75);
}

.wefab-notifications-clear-filters:focus-visible {
  outline: 2px solid var(--eq-color-primary, #0070F2);
  outline-offset: 2px;
}

/* Content area */
.wefab-notifications-page-content {
  max-width: 800px;
  margin: 0 auto;
  padding: 24px 32px;
}

/* Date group */
.wefab-notifications-group {
  margin-bottom: 32px;
}

.wefab-notifications-group:last-child {
  margin-bottom: 0;
}

.wefab-notifications-group-header {
  color: var(--eq-color-text-primary, #223548);
  font-size: 40px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 16px;
  padding-left: 4px;
}

.wefab-notifications-group-items {
  background-color: var(--eq-color-surface, #FFFFFF);
  border-radius: 12px;
  border: 1px solid var(--eq-color-border, #D3D7DB);
  overflow: hidden;
}

/* Notification item in full page */
.wefab-notifications-page-item {
  padding: 16px 20px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.04);
  cursor: pointer;
  position: relative;
  width: 100%;
  text-align: left;
  background-color: transparent;
  transition: background-color 150ms ease;
}

.wefab-notifications-page-item:last-child {
  border-bottom: none;
}

.wefab-notifications-page-item.unread::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background-color: var(--eq-color-primary, #0070F2);
}

.wefab-notifications-page-item:hover {
  background-color: rgba(0, 0, 0, 0.02);
}

.wefab-notifications-page-item:focus-visible {
  outline: 2px solid var(--eq-color-primary, #0070F2);
  outline-offset: -2px;
  background-color: rgba(0, 112, 242, 0.04);
}

.wefab-notifications-page-item-content {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
}

.wefab-notifications-page-item-body {
  flex: 1 1;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.wefab-notifications-page-header {
  font-size: 14px !important;
  line-height: 1.4 !important;
  color: var(--eq-color-text-primary, #223548);
  font-weight: 600 !important;
  margin: 0;
}

.wefab-notifications-page-text {
  font-size: 14px !important;
  color: var(--eq-color-text-secondary, #475E75);
  line-height: 1.5;
  margin: 0;
}

.wefab-notifications-page-item.unread .wefab-notifications-page-text {
  font-weight: 400;
  color: var(--eq-color-text-secondary, #475E75);
}

.wefab-notifications-page-item.unread .wefab-notifications-page-header {
  font-weight: 600 !important;
  color: var(--eq-color-text-primary, #223548);
}

.wefab-notifications-page-time {
  flex-shrink: 0;
  color: var(--eq-color-text-tertiary, #919BA5);
  font-size: 12px;
  line-height: 1.4;
}

/* Empty state */
.wefab-notifications-page-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 80px 32px;
  text-align: center;
  background-color: var(--eq-color-surface, #FFFFFF);
  border-radius: 12px;
  border: 1px solid var(--eq-color-border, #D3D7DB);
}

.wefab-notifications-page-empty-icon {
  color: var(--eq-color-text-tertiary, #919BA5);
  margin-bottom: 16px;
  opacity: 0.4;
}

.wefab-notifications-page-empty-title {
  color: var(--eq-color-text-primary, #223548);
  font-weight: 600;
  margin-bottom: 8px;
}

.wefab-notifications-page-empty-description {
  color: var(--eq-color-text-tertiary, #919BA5);
  max-width: 320px;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .wefab-notifications-page-header-content,
  .wefab-notifications-page-content,
  .wefab-notifications-filter-panel {
    padding-left: 16px;
    padding-right: 16px;
  }

  .wefab-notifications-filter-row {
    flex-direction: column;
  }

  .wefab-notifications-page-item-content {
    flex-direction: column;
    gap: 8px;
  }

  .wefab-notifications-page-time {
    align-self: flex-start;
  }
}

/* DateTime Calendar z-index override for notifications page */
/* CRITICAL: Calendar must appear above ALL elements including notification items */
.wefab-notifications-page .calendar-container,
.wefab-notifications-filter-panel .calendar-container,
.calendar-container {
  z-index: 99999 !important; /* Maximum z-index to ensure calendar is always on top */
  position: fixed !important; /* Escape all stacking contexts */
}

.wefab-notifications-page .side-time-picker,
.wefab-notifications-filter-panel .side-time-picker,
.side-time-picker {
  z-index: 100000 !important; /* Time picker above calendar */
  position: fixed !important; /* Escape all stacking contexts */
}

/* Calendar Button Styles - Remove all focus outlines */
.calendar-nav-button,
.calendar-nav-button:focus,
.calendar-nav-button:focus-visible,
.calendar-nav-button:active,
.calendar-nav-button:hover {
  outline: none !important;
  border: none !important;
  box-shadow: none !important;
}

.calendar-date-button:focus,
.calendar-date-button:focus-visible,
.calendar-date-button:active {
  outline: none !important;
  box-shadow: none !important;
}

/* Tabs Button Styles - Override borders and outlines for TAB NAVIGATION BUTTONS ONLY */
/* Using > div:first-child > button to target only tab navigation buttons, not buttons in tab content */
.wefab-tabs > div:first-child > button,
.wefab-tabs > div:first-child > button:focus,
.wefab-tabs > div:first-child > button:focus-visible,
.wefab-tabs > div:first-child > button:active,
.wefab-tabs > div:first-child > button:hover,
.wefab-tabs > div:first-child > button:focus-within {
  outline: none !important;
  border: none !important;
  border-top: none !important;
  border-right: none !important;
  border-bottom: none !important;
  border-left: none !important;
  box-shadow: none !important;
  position: relative !important;
  background-color: transparent !important;
}

/* Ensure no borders appear even with higher specificity - for tab navigation buttons only */
.wefab-tabs > div:first-child > button[style*="border"] {
  border: none !important;
  border-bottom: none !important;
}

/* Only active tabs get colored border-bottom */
.wefab-tabs-active::after {
  content: '' !important;
  position: absolute !important;
  bottom: -1px !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  height: 3px !important;
  background-color: var(--current-brand-color) !important;
  z-index: 10 !important;
  display: block !important;
}

/* Text color styling - for tab navigation buttons only */
.wefab-tabs > div:first-child > button:not(.wefab-tabs-active) {
  color: var(--blueprint-blue) !important;
}

.wefab-tabs-active {
  color: var(--current-brand-color) !important;
}

/* Badge Styles */
.wefab-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 500;
  border-radius: var(--radius-sm);
  border: 1px solid transparent;
  white-space: nowrap;
  transition: all 0.2s ease;
}

/* Badge Sizes */
.wefab-badge--xs { padding: 2px 6px; font-size: 10px; height: 16px; }
.wefab-badge--sm { padding: 3px 8px; font-size: 11px; height: 20px; }
.wefab-badge--md { padding: 4px 10px; font-size: 12px; height: 24px; }
.wefab-badge--lg { padding: 6px 12px; font-size: 13px; height: 28px; }

/* Badge Blue Variants */
.wefab-badge--blue.wefab-badge--filled {
  background-color: var(--blueprint-blue);
  color: var(--technical-white);
}

.wefab-badge--blue.wefab-badge--light {
  background-color: rgba(26, 58, 95, 0.1);
  color: var(--blueprint-blue);
}

.wefab-badge--blue.wefab-badge--outline {
  background-color: transparent;
  color: var(--blueprint-blue);
  border-color: var(--blueprint-blue);
}

/* Badge Orange Variants */
.wefab-badge--orange.wefab-badge--filled {
  background-color: var(--safety-orange);
  color: var(--technical-white);
}

.wefab-badge--orange.wefab-badge--light {
  background-color: rgba(255, 87, 34, 0.1);
  color: var(--safety-orange);
}

.wefab-badge--orange.wefab-badge--outline {
  background-color: transparent;
  color: var(--safety-orange);
  border-color: var(--safety-orange);
}

/* Badge Green Variants */
.wefab-badge--green.wefab-badge--filled {
  background-color: var(--process-green);
  color: var(--technical-white);
}

.wefab-badge--green.wefab-badge--light {
  background-color: rgba(18, 133, 110, 0.1);
  color: var(--process-green);
}

.wefab-badge--green.wefab-badge--outline {
  background-color: transparent;
  color: var(--process-green);
  border-color: var(--process-green);
}

/* Badge Red Variants */
.wefab-badge--red.wefab-badge--filled {
  background-color: #dc2626;
  color: var(--technical-white);
}

.wefab-badge--red.wefab-badge--light {
  background-color: rgba(220, 38, 38, 0.1);
  color: #dc2626;
}

.wefab-badge--red.wefab-badge--outline {
  background-color: transparent;
  color: #dc2626;
  border-color: #dc2626;
}

/* Badge Gray Variants */
.wefab-badge--gray.wefab-badge--filled {
  background-color: var(--machine-gray);
  color: var(--technical-white);
}

.wefab-badge--gray.wefab-badge--light {
  background-color: rgba(84, 90, 100, 0.1);
  color: var(--machine-gray);
}

.wefab-badge--gray.wefab-badge--outline {
  background-color: transparent;
  color: var(--machine-gray);
  border-color: var(--machine-gray);
}

/* ScrollArea Styles */
.wefab-scroll-area {
  /* Base scrollbar styles */
}

.wefab-scroll-area--orange .mantine-ScrollArea-scrollbar .mantine-ScrollArea-thumb {
  background-color: var(--safety-orange) !important;
}

.wefab-scroll-area--orange .mantine-ScrollArea-scrollbar:hover .mantine-ScrollArea-thumb {
  background-color: var(--safety-orange) !important;
  opacity: 0.8 !important;
}

.wefab-scroll-area--blue .mantine-ScrollArea-scrollbar .mantine-ScrollArea-thumb {
  background-color: var(--blueprint-blue) !important;
}

.wefab-scroll-area--blue .mantine-ScrollArea-scrollbar:hover .mantine-ScrollArea-thumb {
  background-color: var(--blueprint-blue) !important;
  opacity: 0.8 !important;
}

/* ScrollArea Track Styles */
.wefab-scroll-area--orange .mantine-ScrollArea-scrollbar {
  background-color: rgba(255, 87, 34, 0.1) !important;
}

.wefab-scroll-area--blue .mantine-ScrollArea-scrollbar {
  background-color: rgba(26, 58, 95, 0.1) !important;
}

/* Sidebar Styles */
.wefab-sidebar {
  display: flex;
  flex-direction: column;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 100;
  height: 100vh;
  background-color: #ffffff;
  border-right: 1px solid var(--material-silver);
  transition: width 0.3s ease;
}

.wefab-sidebar--collapsed {
  width: 60px;
}

.wefab-sidebar--expanded {
  width: 280px;
}

/* Sidebar Header */
.wefab-sidebar__header {
  display: flex;
  align-items: center;
  min-height: 70px;
  padding: 1rem;
  border-bottom: 1px solid var(--material-silver);
}

.wefab-sidebar--collapsed .wefab-sidebar__header {
  justify-content: center;
  padding: 1rem 0.75rem;
}

.wefab-sidebar--expanded .wefab-sidebar__header {
  justify-content: space-between;
}

.wefab-sidebar__logo {
  font-weight: 700;
  font-size: 1.125rem;
  color: var(--blueprint-blue);
}

.wefab-sidebar__toggle {
  padding: 0.5rem;
  border-radius: 50%;
  background-color: #ffffff;
  border: 1px solid var(--material-silver);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--machine-gray);
  cursor: pointer;
  transition: all 0.2s ease;
}

.wefab-sidebar__toggle:hover {
  background-color: var(--material-silver);
}

/* Sidebar Profile */
.wefab-sidebar__profile {
  padding: 0.5rem;
  border-bottom: 1px solid var(--material-silver);
}

.wefab-sidebar__profile-content {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem;
  background-color: #ffffff;
  border-radius: var(--radius-md);
}

.wefab-sidebar__avatar {
  width: 40px !important;
  height: 40px !important;
  border-radius: 50% !important;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--technical-white) !important;
  font-weight: 700;
  font-size: 1rem;
  min-width: 40px !important;
  min-height: 40px !important;
  max-width: 40px !important;
  max-height: 40px !important;
}

.wefab-sidebar--orange .wefab-sidebar__avatar {
  background-color: var(--safety-orange) !important;
  color: var(--technical-white) !important;
}

.wefab-sidebar--blue .wefab-sidebar__avatar {
  background-color: var(--blueprint-blue) !important;
  color: var(--technical-white) !important;
}

/* Override Mantine Avatar styles */
.wefab-sidebar__avatar.mantine-Avatar-root {
  color: var(--technical-white) !important;
  width: 40px !important;
  height: 40px !important;
  border-radius: 50% !important;
  min-width: 40px !important;
  min-height: 40px !important;
  max-width: 40px !important;
  max-height: 40px !important;
}

.wefab-sidebar--orange .wefab-sidebar__avatar.mantine-Avatar-root {
  background-color: var(--safety-orange) !important;
  color: var(--technical-white) !important;
  width: 40px !important;
  height: 40px !important;
  border-radius: 50% !important;
}

.wefab-sidebar--blue .wefab-sidebar__avatar.mantine-Avatar-root {
  background-color: var(--blueprint-blue) !important;
  color: var(--technical-white) !important;
  width: 40px !important;
  height: 40px !important;
  border-radius: 50% !important;
}

.wefab-sidebar__user-info {
  flex: 1 1;
  min-width: 0;
}

.wefab-sidebar__user-name {
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--precision-black);
  margin-bottom: 0.125rem;
}

.wefab-sidebar__user-role {
  font-size: 0.75rem;
  color: var(--machine-gray);
  line-height: 1.3;
}

/* Sidebar Navigation */
.wefab-sidebar__nav {
  flex: 1 1;
  overflow-y: auto;
}

.wefab-sidebar--collapsed .wefab-sidebar__nav {
  padding: 1rem 0.5rem;
}

.wefab-sidebar--expanded .wefab-sidebar__nav {
  padding: 1rem;
}

.wefab-sidebar__nav-items {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

/* Sidebar Items */
.wefab-sidebar__item {
  width: 100%;
  border-radius: var(--radius-md);
  display: flex;
  align-items: center;
  color: var(--machine-gray);
  background-color: transparent;
  transition: all 0.2s ease;
  position: relative;
  text-decoration: none;
  border: none;
  cursor: pointer;
}

.wefab-sidebar--collapsed .wefab-sidebar__item {
  padding: 0.5rem;
  justify-content: center;
  gap: 0;
}

.wefab-sidebar--expanded .wefab-sidebar__item {
  padding: 0.5rem 0.75rem;
  gap: 0.5rem;
  justify-content: flex-start;
}

.wefab-sidebar__item-icon {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.wefab-sidebar__item-text {
  font-size: 0.875rem;
  font-weight: 500;
  flex: 1 1;
  color: inherit;
}

.wefab-sidebar__item-badge {
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.125rem 0.375rem;
  border-radius: 9999px;
  min-width: 1.25rem;
  text-align: center;
  transition: all 0.2s ease;
}

/* Orange Variant Item States */
.wefab-sidebar--orange .wefab-sidebar__item:hover:not(.wefab-sidebar__item--active) {
  background-color: rgba(255, 87, 34, 0.1);
  color: var(--safety-orange);
}

.wefab-sidebar--orange .wefab-sidebar__item--active {
  background-color: var(--safety-orange);
  color: var(--technical-white);
}

.wefab-sidebar--orange .wefab-sidebar__item--active .wefab-sidebar__item-text {
  font-weight: 600;
}

.wefab-sidebar--orange .wefab-sidebar__item--active .wefab-sidebar__item-badge {
  background-color: #ffffff;
  color: var(--safety-orange);
}

.wefab-sidebar--orange .wefab-sidebar__item:not(.wefab-sidebar__item--active) .wefab-sidebar__item-badge {
  background-color: var(--safety-orange);
  color: var(--technical-white);
}

/* Blue Variant Item States */
.wefab-sidebar--blue .wefab-sidebar__item:hover:not(.wefab-sidebar__item--active) {
  background-color: rgba(26, 58, 95, 0.1);
  color: var(--blueprint-blue);
}

.wefab-sidebar--blue .wefab-sidebar__item--active {
  background-color: var(--blueprint-blue);
  color: var(--technical-white);
}

.wefab-sidebar--blue .wefab-sidebar__item--active .wefab-sidebar__item-text {
  font-weight: 600;
}

.wefab-sidebar--blue .wefab-sidebar__item--active .wefab-sidebar__item-badge {
  background-color: #ffffff;
  color: var(--blueprint-blue);
}

.wefab-sidebar--blue .wefab-sidebar__item:not(.wefab-sidebar__item--active) .wefab-sidebar__item-badge {
  background-color: var(--blueprint-blue);
  color: var(--technical-white);
}

/* Sidebar Bottom */
.wefab-sidebar__bottom {
  border-top: 1px solid var(--material-silver);
}

.wefab-sidebar--collapsed .wefab-sidebar__bottom {
  padding: 0.5rem;
}

.wefab-sidebar--expanded .wefab-sidebar__bottom {
  padding: 0.5rem;
}

.wefab-sidebar__bottom-items {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

/* FileUpload Styles */
.wefab-file-upload__container {
  border-radius: var(--radius-lg) !important;
  width: 100%;
  margin: 0 auto;
  border: 2px dashed var(--material-silver) !important;
  background-color: #ffffff !important;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  transition: border-color 0.2s ease;
  margin-bottom: var(--space-lg);
  padding: var(--space-xl);
}

.wefab-file-upload__container:hover {
  border-color: var(--blueprint-blue) !important;
}

/* Size variants */
.wefab-file-upload--sm .wefab-file-upload__container {
  height: 300px;
  max-width: 600px;
  padding: var(--space-lg);
}

.wefab-file-upload--md .wefab-file-upload__container {
  height: 400px;
  max-width: 800px;
  padding: var(--space-xl);
}

.wefab-file-upload--lg .wefab-file-upload__container {
  height: 500px;
  max-width: 1100px;
  padding: var(--space-xl);
}

.wefab-file-upload__hidden-input {
  border: 0;
  clip: rect(0, 0, 0, 0);
  -webkit-clip-path: inset(50%);
          clip-path: inset(50%);
  height: 1px;
  margin: 0 -1px -1px 0;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
  white-space: nowrap;
}

.wefab-file-upload__content {
  position: relative;
  z-index: 10;
  height: 100%;
}

.wefab-file-upload__stack {
  max-width: none;
  padding-inline: var(--space-xl);
  width: 100%;
}

.wefab-file-upload__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
}

.wefab-file-upload--sm .wefab-file-upload__icon {
  width: 60px;
  height: 60px;
}

.wefab-file-upload--md .wefab-file-upload__icon {
  width: 80px;
  height: 80px;
}

.wefab-file-upload--lg .wefab-file-upload__icon {
  width: 100px;
  height: 100px;
}

/* Orange variant icon */
.wefab-file-upload--orange .wefab-file-upload__icon {
  background-color: rgba(255, 87, 34, 0.1);
}

.wefab-file-upload--orange .wefab-file-upload__icon-svg {
  color: var(--safety-orange);
}

/* Blue variant icon */
.wefab-file-upload--blue .wefab-file-upload__icon {
  background-color: rgba(26, 58, 95, 0.1);
}

.wefab-file-upload--blue .wefab-file-upload__icon-svg {
  color: var(--blueprint-blue);
}

.wefab-file-upload__title {
  text-align: center;
  font-weight: 600;
}

.wefab-file-upload--sm .wefab-file-upload__title {
  font-size: 1.125rem;
}

.wefab-file-upload--md .wefab-file-upload__title {
  font-size: 1.5rem;
}

.wefab-file-upload--lg .wefab-file-upload__title {
  font-size: 2rem;
}

.wefab-file-upload__description {
  color: var(--machine-gray);
  text-align: center;
}

.wefab-file-upload__button {
  font-weight: 500;
  min-width: 140px;
  width: -moz-fit-content;
  width: fit-content;
  transition: all 0.2s ease;
}

.wefab-file-upload__button:hover {
  transform: scale(1.02);
}

/* Orange variant button */
.wefab-file-upload--orange .wefab-file-upload__button {
  background-color: var(--safety-orange) !important;
  border-color: var(--safety-orange) !important;
  color: var(--technical-white) !important;
}

.wefab-file-upload--orange .wefab-file-upload__button:hover {
  background-color: var(--safety-orange) !important;
  opacity: 0.9;
}

/* Blue variant button */
.wefab-file-upload--blue .wefab-file-upload__button {
  background-color: var(--blueprint-blue) !important;
  border-color: var(--blueprint-blue) !important;
  color: var(--technical-white) !important;
}

.wefab-file-upload--blue .wefab-file-upload__button:hover {
  background-color: var(--blueprint-blue) !important;
  opacity: 0.9;
}

.wefab-file-upload__supported-files {
  color: var(--machine-gray);
  text-align: center;
  font-size: 0.75rem;
}

.wefab-file-upload__supported-files-label {
  font-weight: 500;
}

.wefab-file-upload--orange .wefab-file-upload__supported-files-label {
  color: var(--safety-orange);
}

.wefab-file-upload--blue .wefab-file-upload__supported-files-label {
  color: var(--blueprint-blue);
}

.wefab-file-upload__file-size {
  color: var(--machine-gray);
  text-align: center;
  font-size: 0.75rem;
}

.wefab-file-upload__file-size-value {
  font-weight: 500;
}

.wefab-file-upload--orange .wefab-file-upload__file-size-value {
  color: var(--safety-orange);
}

.wefab-file-upload--blue .wefab-file-upload__file-size-value {
  color: var(--blueprint-blue);
}

/* Selected Files */
.wefab-file-upload__uploaded-files {
  margin-top: var(--space-lg);
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.wefab-file-upload__file-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.75rem;
  background-color: #ffffff;
  border: 1px solid var(--material-silver);
  border-radius: var(--radius-md);
}

.wefab-file-upload__file-info {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.wefab-file-upload__file-icon {
  color: var(--machine-gray);
}

.wefab-file-upload__file-name {
  font-weight: 500;
  color: var(--precision-black);
}

.wefab-file-upload__file-size {
  color: var(--machine-gray);
  font-size: 0.875rem;
}

.wefab-file-upload__remove-file {
  background: none;
  border: none;
  color: var(--machine-gray);
  cursor: pointer;
  padding: 0.25rem;
  border-radius: var(--radius-sm);
  transition: all 0.2s ease;
}

.wefab-file-upload__remove-file:hover {
  background-color: rgba(220, 38, 38, 0.1);
  color: #dc2626;
}

/* Chat Component Styles */
.chat-container {
  background: var(--technical-white);
  border-radius: 0;
  overflow: hidden;
}

.chat-sidebar {
  background: white;
  border-right: 1px solid var(--material-silver);
}

.chat-user-item {
  transition: background-color 0.2s ease;
}

.chat-user-item:hover {
  background-color: #ffffff !important;
}

.chat-user-item.active {
  background-color: #ffffff !important;
  border-right: 4px solid var(--blueprint-blue) !important;
}

.chat-header {
  background: white;
  padding: 12px !important;
}

.chat-messages {
  background: var(--technical-white);
}

.chat-input {
  background: white;
  box-shadow: 0 -1px 3px rgba(0, 0, 0, 0.05);
}

/* Typing Indicator Animation */
.typing-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: var(--machine-gray);
  animation: typing-bounce 1.4s infinite ease-in-out both;
}

@keyframes typing-bounce {
  0%, 80%, 100% {
    transform: scale(0);
  }
  40% {
    transform: scale(1);
  }
}

/* Hidden scrollbar for user list */
.chat-user-list-hidden-scroll {
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none; /* IE/Edge */
}

.chat-user-list-hidden-scroll::-webkit-scrollbar {
  display: none; /* Chrome/Safari/WebKit */
}

/* Custom scrollbar for chat */
.chat-user-list [data-scrollbar="y"] {
  scrollbar-width: thin;
  scrollbar-color: var(--material-silver) transparent;
}

.chat-user-list [data-scrollbar="y"]::-webkit-scrollbar {
  width: 4px;
}

.chat-user-list [data-scrollbar="y"]::-webkit-scrollbar-track {
  background: transparent;
}

.chat-user-list [data-scrollbar="y"]::-webkit-scrollbar-thumb {
  background-color: var(--material-silver);
  border-radius: 2px;
}

.chat-messages [data-scrollbar="y"] {
  scrollbar-width: thin;
  scrollbar-color: var(--material-silver) transparent;
}

.chat-messages [data-scrollbar="y"]::-webkit-scrollbar {
  width: 4px;
}

.chat-messages [data-scrollbar="y"]::-webkit-scrollbar-track {
  background: transparent;
}

.chat-messages [data-scrollbar="y"]::-webkit-scrollbar-thumb {
  background-color: var(--material-silver);
  border-radius: 2px;
}

/* ===== Timeline Icon Styles ===== */
/* Remove any background/fill from timeline icons */
.mantine-Timeline-itemBullet svg {
  fill: none !important;
  background: transparent !important;
}

.mantine-Timeline-itemBullet svg path {
  fill: none !important;
  background: transparent !important;
}

/* ===== Timestamp Styles ===== */
.wefab-timestamp {
  font-size: 11px !important;
  color: var(--blueprint-blue) !important;
  font-weight: 400 !important;
  opacity: 0.8 !important;
}

/* ===== Card Improvements ===== */
/* Summary Card */
.summary-section {
  background: white !important;
  border: 1px solid var(--material-silver) !important;
  border-radius: 8px !important;
  padding: 1.5rem !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04) !important;
}

.summary-title {
  font-size: 1.1rem !important;
  font-weight: 600 !important;
  color: var(--precision-black) !important;
  margin-bottom: 1rem !important;
}

.summary-row {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  padding: 0.375rem 0 !important;
}

.summary-row:last-child {
  border-bottom: none !important;
}

.total-row {
  border-top: 1px solid var(--material-silver) !important;
  padding-top: 0.5rem !important;
  margin-top: 0.25rem !important;
}

.summary-label {
  font-size: 0.875rem !important;
  color: var(--blueprint-blue) !important;
  font-weight: 500 !important;
}

.summary-value {
  font-size: 0.875rem !important;
  color: var(--precision-black) !important;
  font-weight: 600 !important;
  text-align: right !important;
}

.summary-discount {
  color: var(--process-green) !important;
  font-weight: 600 !important;
}

.summary-tax {
  color: var(--safety-orange) !important;
  font-weight: 600 !important;
}

.summary-total {
  color: var(--precision-black) !important;
  font-weight: 700 !important;
  font-size: 1rem !important;
  margin-top: 0.5rem !important;
}

/* Stat Card Improvements */
.stat-card {
  background: white !important;
  border: 1px solid var(--material-silver) !important;
  border-radius: 8px !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06) !important;
  padding: 1.5rem !important;
  transition: all 0.2s ease !important;
}

.stat-card:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
  transform: translateY(-2px) !important;
}

/* Data Card Improvements */
.data-card {
  transition: all 0.2s ease !important;
  border: 1px solid var(--material-silver) !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04) !important;
  background: white !important;
  border-radius: 8px !important;
  overflow: hidden !important;
}

.data-card:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08) !important;
  transform: translateY(-1px) !important;
}

.data-card-header {
  background: var(--technical-white) !important;
  border-bottom: 1px solid var(--material-silver) !important;
  padding: 1rem !important;
}

.data-card-title {
  color: var(--precision-black) !important;
  font-weight: 600 !important;
  font-size: 1rem !important;
  margin: 0 !important;
}

.data-card-content {
  padding: 1.25rem !important;
}

.data-card-row {
  padding: 0.5rem 0 !important;
  border-bottom: 1px solid #f8f9fa !important;
}

.data-card-row:last-child {
  border-bottom: none !important;
  padding-bottom: 0 !important;
}

.data-card-label {
  color: var(--blueprint-blue) !important;
  font-weight: 500 !important;
  font-size: 0.875rem !important;
}

.data-card-value {
  color: var(--precision-black) !important;
  font-weight: 600 !important;
  font-size: 0.875rem !important;
  text-align: right !important;
  word-break: break-word !important;
}

/* ===== Navigation Button Styles ===== */
.nav-button {
  outline: none !important;
  border: none !important;
  box-shadow: none !important;
}

.nav-button:focus,
.nav-button:focus-visible,
.nav-button:active,
.nav-button:hover {
  outline: none !important;
  border: none !important;
  box-shadow: none !important;
}

/* Target the UnstyledButton specifically for nav variant */
button[data-variant="navbutton"],
.mantine-UnstyledButton-root:has(.nav-button) {
  outline: none !important;
  border: none !important;
  box-shadow: none !important;
  background: none !important;
}

button[data-variant="navbutton"]:focus,
button[data-variant="navbutton"]:focus-visible,
button[data-variant="navbutton"]:active,
button[data-variant="navbutton"]:hover,
.mantine-UnstyledButton-root:has(.nav-button):focus,
.mantine-UnstyledButton-root:has(.nav-button):focus-visible,
.mantine-UnstyledButton-root:has(.nav-button):active,
.mantine-UnstyledButton-root:has(.nav-button):hover {
  outline: none !important;
  border: none !important;
  box-shadow: none !important;
  background: none !important;
}

.nav-button .nav-button-text,
.nav-button .nav-button-arrow {
  color: var(--blueprint-blue) !important;
}

.nav-button:hover .nav-button-text,
.nav-button:hover .nav-button-arrow,
.nav-button:active .nav-button-text,
.nav-button:active .nav-button-arrow {
  color: var(--blueprint-blue) !important;
}

/* ===== Editable Table Fixes ===== */
.editable-table-container {
  border: 1px solid var(--material-silver) !important;
  border-radius: 8px !important;
  overflow: hidden !important;
  background: white !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04) !important;
}

.editable-table-container table {
  border-spacing: 0 !important;
  table-layout: fixed !important;
}

.editable-table-container th,
.editable-table-container td {
  border-left: none !important;
  border-right: none !important;
}

.editable-cell {
  min-height: 28px !important;
  padding: 2px 4px !important;
  cursor: text !important;
  border-radius: 4px !important;
  display: flex !important;
  align-items: center !important;
  background: transparent !important;
  transition: all 0.15s ease !important;
  border: 2px solid transparent !important;
  margin: 1px !important;
}

.editable-cell:hover {
  background: transparent !important;
  border-color: rgba(26, 58, 95, 0.1) !important;
}

.editable-cell-editing {
  border: 2px solid var(--blueprint-blue) !important;
  border-radius: 6px !important;
  background: white !important;
  box-shadow: 0 2px 8px rgba(26, 58, 95, 0.1) !important;
  margin: 1px !important;
  padding: 6px 8px !important;
}

.editable-cell-editing input {
  border: none !important;
  outline: none !important;
  background: transparent !important;
  width: 100% !important;
  font-size: 14px !important;
  color: var(--precision-black) !important;
  padding: 0 !important;
}

.editable-table-add-button {
  margin-top: 1rem !important;
  width: 100% !important;
}

.editable-cell-editing input:focus {
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
}

.editable-table-th {
  background: var(--technical-white) !important;
  border-bottom: 1px solid var(--material-silver) !important;
  color: var(--precision-black) !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  padding: 4px 6px !important;
}

.editable-table-td {
  border-bottom: 1px solid #f8f9fa !important;
  padding: 0 !important;
  vertical-align: middle !important;
}

.editable-table-tr:hover {
  background: #fafbfc !important;
}

.editable-table-tr:last-child .editable-table-td {
  border-bottom: none !important;
}

.editable-table-add-row {
  background: white !important;
}

.editable-table-action {
  opacity: 0.6 !important;
  transition: opacity 0.2s ease !important;
}

.editable-table-action:hover {
  opacity: 1 !important;
}

/* ===== Tooltip Styling ===== */
.mantine-Tooltip-tooltip {
  background-color: #1a1a1a !important;
  color: var(--technical-white) !important;
  font-size: 12px !important;
  padding: 6px 8px !important;
  border-radius: 4px !important;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important;
  z-index: 10000 !important;
}

/* ===== Interactive Components Styling ===== */

/* Modal Styling */
.wefab-modal .mantine-Modal-content {
}

.wefab-modal .mantine-Modal-close {
  border-radius: var(--radius-sm) !important;
}

/* Dialog Styling */
.wefab-dialog .mantine-Dialog-root {
  animation: wefab-dialog-slide-up 0.2s ease-out !important;
}

@keyframes wefab-dialog-slide-up {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Menu Styling */
.wefab-menu .mantine-Menu-dropdown {
  animation: wefab-menu-scale 0.15s ease-out !important;
}

@keyframes wefab-menu-scale {
  from {
    opacity: 0;
    transform: scale(0.95);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}


/* ===== Chat Component Styling ===== */

/* Chat container animations and transitions */
.wefab-chat {
  transition: all 0.3s ease;
}

/* Force proper rounded corners - only specific corners */
.wefab-chat-sidebar {
  border-top-left-radius: var(--radius-lg) !important;
  border-top-right-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
  overflow: hidden;
}

.wefab-chat-header {
  border-top-right-radius: var(--radius-lg) !important;
  border-top-left-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

/* Override any mantine default radius - preserve message bubbles */
.wefab-chat > .mantine-Paper-root {
  border-radius: 0 !important;
}

.wefab-chat-sidebar.mantine-Paper-root {
  border-top-left-radius: var(--radius-lg) !important;
}

.wefab-chat-header.mantine-Paper-root {
  border-top-right-radius: var(--radius-lg) !important;
}

.wefab-chat-input.mantine-Paper-root {
  border-radius: 0 !important;
}

/* Chat user list hover effects */
.wefab-chat-user-item:hover {
  transform: translateX(2px);
}

/* Chat input focus effects */
.wefab-chat-input .mantine-TextInput-input:focus-within {
  background-color: #ffffff !important;
}

/* Typing indicator animation */
@keyframes typing-pulse {
  0%, 60%, 100% {
    opacity: 0.3;
    transform: scale(1);
  }
  30% {
    opacity: 1;
    transform: scale(1.2);
  }
}

/* Message animations */
.wefab-chat-messages .mantine-Flex-root {
  animation: message-slide-in 0.3s ease-out;
}

@keyframes message-slide-in {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Chat scrollbar styling */
.wefab-chat-user-list .mantine-ScrollArea-scrollbar,
.wefab-chat-messages .mantine-ScrollArea-scrollbar {
  background: transparent !important;
}

.wefab-chat-user-list .mantine-ScrollArea-thumb,
.wefab-chat-messages .mantine-ScrollArea-thumb {
  background: var(--material-silver) !important;
  border-radius: var(--radius-sm) !important;
}

/* Remove all default borders from chat ActionIcons except send button */
.wefab-chat .mantine-ActionIcon-root {
  border: none !important;
}

.wefab-chat .mantine-ActionIcon-root:not(.mantine-ActionIcon-filled):not([style*="blueprint-blue"]) {
  background-color: transparent !important;
}

.wefab-chat .mantine-ActionIcon-root:hover {
  background-color: #ffffff !important;
}

.wefab-chat .mantine-ActionIcon-root:active {
  background-color: var(--material-silver) !important;
  transform: scale(0.95);
}

.mantine-Drawer-close {
  border-radius: var(--radius-sm) !important;
}

/* Collapse Styling */
.wefab-collapse {
  transition: all 0.2s ease-out !important;
}

.wefab-collapse--bordered {
  transition: box-shadow 0.2s ease !important;
}

.wefab-collapse--bordered:hover {
  box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.1) !important;
}

.wefab-collapse--elevated:hover {
  box-shadow: 0 8px 12px -3px rgba(0, 0, 0, 0.15) !important;
}

/* Borderless Input Styles - Border around container, not inside input */
.wefab-borderless-input {
  border: 1px solid var(--material-silver) !important;
  border-radius: 0.375rem !important;
  background-color: white !important;
  transition: border-color 0.2s ease !important;
}

.wefab-borderless-input:focus-within {
  border-color: var(--safety-orange) !important;
}

.wefab-borderless-input input,
.wefab-borderless-input .mantine-Input-input,
.wefab-borderless-input .mantine-TextInput-input,
.wefab-borderless-input .mantine-Textarea-input,
.wefab-borderless-input .mantine-Select-input,
.wefab-borderless-input .mantine-NumberInput-input {
  border: none !important;
  border-top: none !important;
  border-left: none !important;
  border-right: none !important;
  border-bottom: none !important;
  border-radius: 0 !important;
  padding: 0.75rem !important;
  background-color: transparent !important;
  box-shadow: none !important;
  outline: none !important;
}

.wefab-borderless-input input:focus,
.wefab-borderless-input .mantine-Input-input:focus,
.wefab-borderless-input .mantine-TextInput-input:focus,
.wefab-borderless-input .mantine-Textarea-input:focus,
.wefab-borderless-input .mantine-Select-input:focus,
.wefab-borderless-input .mantine-NumberInput-input:focus {
  border: none !important;
  border-top: none !important;
  border-left: none !important;
  border-right: none !important;
  border-bottom: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: none !important;
}

.wefab-borderless-input input:hover,
.wefab-borderless-input .mantine-Input-input:hover,
.wefab-borderless-input .mantine-TextInput-input:hover,
.wefab-borderless-input .mantine-Textarea-input:hover,
.wefab-borderless-input .mantine-Select-input:hover,
.wefab-borderless-input .mantine-NumberInput-input:hover {
  border: none !important;
  border-top: none !important;
  border-left: none !important;
  border-right: none !important;
  border-bottom: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}


/* ========== BORDERLESS FORM STYLING - GOOGLE FORMS STYLE ========== */

/* Remove all borders from input wrappers */
.wefab-borderless-input .mantine-Input-wrapper,
.wefab-borderless-input .mantine-TextInput-wrapper,
.wefab-borderless-input .mantine-Textarea-wrapper,
.wefab-borderless-input .mantine-Select-wrapper,
.wefab-borderless-input .mantine-NumberInput-wrapper,
.wefab-borderless-input .mantine-FileInput-wrapper,
.wefab-borderless-input .mantine-ColorInput-wrapper {
  background-color: #ffffff !important;
  border: 1px solid var(--material-silver) !important;
  border-radius: 8px !important;
  transition: all 0.2s ease !important;
  min-height: 48px !important;
  display: flex !important;
  align-items: center !important;
}

/* Focus states for wrappers */
.wefab-borderless-input .mantine-Input-wrapper:focus-within,
.wefab-borderless-input .mantine-TextInput-wrapper:focus-within,
.wefab-borderless-input .mantine-Textarea-wrapper:focus-within,
.wefab-borderless-input .mantine-Select-wrapper:focus-within,
.wefab-borderless-input .mantine-NumberInput-wrapper:focus-within,
.wefab-borderless-input .mantine-FileInput-wrapper:focus-within,
.wefab-borderless-input .mantine-ColorInput-wrapper:focus-within {
  border-color: var(--safety-orange) !important;
  background-color: #ffffff !important;
  box-shadow: 0 0 0 3px rgba(255, 87, 34, 0.1) !important;
}

/* Hover states for wrappers */
.wefab-borderless-input .mantine-Input-wrapper:hover,
.wefab-borderless-input .mantine-TextInput-wrapper:hover,
.wefab-borderless-input .mantine-Textarea-wrapper:hover,
.wefab-borderless-input .mantine-Select-wrapper:hover,
.wefab-borderless-input .mantine-NumberInput-wrapper:hover,
.wefab-borderless-input .mantine-FileInput-wrapper:hover,
.wefab-borderless-input .mantine-ColorInput-wrapper:hover {
  background-color: #ffffff !important;
}

/* Remove all internal borders from inputs */
.wefab-borderless-input .mantine-Input-input,
.wefab-borderless-input .mantine-TextInput-input,
.wefab-borderless-input .mantine-Textarea-input,
.wefab-borderless-input .mantine-Select-input,
.wefab-borderless-input .mantine-NumberInput-input,
.wefab-borderless-input .mantine-FileInput-input,
.wefab-borderless-input .mantine-ColorInput-input,
.wefab-borderless-input input,
.wefab-borderless-input textarea,
.wefab-borderless-input select {
  border: none !important;
  border-top: none !important;
  border-left: none !important;
  border-right: none !important;
  border-bottom: none !important;
  background-color: transparent !important;
  font-size: 14px !important;
  padding: 12px 16px !important;
  outline: none !important;
  box-shadow: none !important;
  width: 100% !important;
}

/* Focus states for inputs */
.wefab-borderless-input .mantine-Input-input:focus,
.wefab-borderless-input .mantine-TextInput-input:focus,
.wefab-borderless-input .mantine-Textarea-input:focus,
.wefab-borderless-input .mantine-Select-input:focus,
.wefab-borderless-input .mantine-NumberInput-input:focus,
.wefab-borderless-input .mantine-FileInput-input:focus,
.wefab-borderless-input .mantine-ColorInput-input:focus,
.wefab-borderless-input input:focus,
.wefab-borderless-input textarea:focus,
.wefab-borderless-input select:focus {
  outline: none !important;
  box-shadow: none !important;
  border: none !important;
  border-top: none !important;
  border-left: none !important;
  border-right: none !important;
  border-bottom: none !important;
}

/* Placeholder styling */
.wefab-borderless-input .mantine-Input-input::placeholder,
.wefab-borderless-input .mantine-TextInput-input::placeholder,
.wefab-borderless-input .mantine-Textarea-input::placeholder,
.wefab-borderless-input .mantine-Select-input::placeholder,
.wefab-borderless-input .mantine-NumberInput-input::placeholder,
.wefab-borderless-input .mantine-FileInput-input::placeholder,
.wefab-borderless-input .mantine-ColorInput-input::placeholder {
  color: var(--blueprint-blue) !important;
}

/* Special handling for Textarea */
.wefab-borderless-input .mantine-Textarea-wrapper {
  min-height: 80px !important;
  align-items: flex-start !important;
  padding: 4px 0 !important;
}

.wefab-borderless-input .mantine-Textarea-input {
  min-height: 72px !important;
  padding: 12px 16px !important;
  resize: vertical !important;
}

/* Slider styling */
.wefab-borderless-input .mantine-Slider-root {
  margin: 20px 0 !important;
  padding: 0 8px !important;
}

.wefab-borderless-input .mantine-Slider-track {
  background-color: var(--material-silver) !important;
  height: 6px !important;
}

.wefab-borderless-input .mantine-Slider-bar {
  background-color: var(--safety-orange) !important;
  height: 6px !important;
}

.wefab-borderless-input .mantine-Slider-thumb {
  background-color: var(--safety-orange) !important;
  border: 2px solid white !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
  width: 20px !important;
  height: 20px !important;
}

/* Radio and Checkbox styling */
.wefab-borderless-input .mantine-Radio-root,
.wefab-borderless-input .mantine-Checkbox-root {
  margin: 8px 0 !important;
  padding: 4px 0 !important;
}

.wefab-borderless-input .mantine-Radio-input:checked,
.wefab-borderless-input .mantine-Checkbox-input:checked {
  background-color: var(--safety-orange) !important;
  border-color: var(--safety-orange) !important;
}

.wefab-borderless-input .mantine-Radio-input,
.wefab-borderless-input .mantine-Checkbox-input {
  border: 1px solid var(--material-silver) !important;
}

/* Switch styling */
.wefab-borderless-input .mantine-Switch-root {
  margin: 12px 0 !important;
}

.wefab-borderless-input .mantine-Switch-track[data-checked] {
  background-color: var(--safety-orange) !important;
  border-color: var(--safety-orange) !important;
}

.wefab-borderless-input .mantine-Switch-thumb {
  background-color: #ffffff !important;
}

/* File input specific styling */
.wefab-borderless-input .mantine-FileInput-wrapper {
  min-height: 48px !important;
  cursor: pointer !important;
}

.wefab-borderless-input .mantine-FileInput-placeholder {
  color: var(--blueprint-blue) !important;
}

/* Color input specific styling */
.wefab-borderless-input .mantine-ColorInput-wrapper {
  min-height: 48px !important;
}

/* Select dropdown specific styling */
.wefab-borderless-input .mantine-Select-dropdown {
  border: 1px solid var(--material-silver) !important;
  border-radius: 8px !important;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1) !important;
}

.wefab-borderless-input .mantine-Select-item[data-selected] {
  background-color: var(--safety-orange) !important;
  color: white !important;
}

/* ========== AGGRESSIVE BORDER REMOVAL ========== */
/* Remove all borders from any element inside borderless inputs */
.wefab-borderless-input *,
.wefab-borderless-input *::before,
.wefab-borderless-input *::after {
  border: none !important;
  border-top: none !important;
  border-left: none !important;
  border-right: none !important;
  border-bottom: none !important;
  outline: none !important;
  box-shadow: none !important;
}

/* Ensure the wrapper maintains the outer border */
.wefab-borderless-input .mantine-Input-wrapper,
.wefab-borderless-input .mantine-TextInput-wrapper,
.wefab-borderless-input .mantine-Textarea-wrapper,
.wefab-borderless-input .mantine-Select-wrapper,
.wefab-borderless-input .mantine-NumberInput-wrapper,
.wefab-borderless-input .mantine-FileInput-wrapper,
.wefab-borderless-input .mantine-ColorInput-wrapper {
  border: 1px solid var(--material-silver) !important;
  border-radius: 8px !important;
  background-color: white !important;
}

/* Override any nested input borders */
.wefab-borderless-input input[type="text"],
.wefab-borderless-input input[type="email"],
.wefab-borderless-input input[type="password"],
.wefab-borderless-input input[type="tel"],
.wefab-borderless-input input[type="url"],
.wefab-borderless-input input[type="number"],
.wefab-borderless-input input[type="date"],
.wefab-borderless-input input[type="datetime-local"],
.wefab-borderless-input input[type="time"],
.wefab-borderless-input input[type="file"],
.wefab-borderless-input input[type="color"],
.wefab-borderless-input textarea,
.wefab-borderless-input select {
  border: none !important;
  border-top: none !important;
  border-left: none !important;
  border-right: none !important;
  border-bottom: none !important;
  outline: none !important;
  box-shadow: none !important;
  background-color: transparent !important;
}

/* ========== NUCLEAR BORDER REMOVAL ========== */
/* Maximum specificity border removal */
.wefab-borderless-input input[class*="mantine"],
.wefab-borderless-input textarea[class*="mantine"],
.wefab-borderless-input select[class*="mantine"],
.wefab-borderless-input div[class*="mantine"] input,
.wefab-borderless-input div[class*="mantine"] textarea,
.wefab-borderless-input div[class*="mantine"] select {
  border: none !important;
  border-width: 0 !important;
  border-style: none !important;
  border-color: transparent !important;
  outline: none !important;
  outline-width: 0 !important;
  outline-style: none !important;
  outline-color: transparent !important;
  box-shadow: none !important;
}

/* Force transparent background for inputs */
.wefab-borderless-input input[class*="mantine"]:focus,
.wefab-borderless-input textarea[class*="mantine"]:focus,
.wefab-borderless-input select[class*="mantine"]:focus,
.wefab-borderless-input div[class*="mantine"] input:focus,
.wefab-borderless-input div[class*="mantine"] textarea:focus,
.wefab-borderless-input div[class*="mantine"] select:focus {
  border: none !important;
  border-width: 0 !important;
  outline: none !important;
  outline-width: 0 !important;
  box-shadow: none !important;
  background-color: transparent !important;
}

/* Override Mantine's CSS custom properties */
.wefab-borderless-input {
  --input-bd: none !important;
  --input-bd-focus: none !important;
  --input-bd-hover: none !important;
  --mantine-primary-color: var(--safety-orange) !important;
}

/* ========== ULTIMATE MANTINE OVERRIDE ========== */
/* Override all possible Mantine CSS variables and styles */
.wefab-borderless-input {
  --mantine-color-gray-4: transparent !important;
  --mantine-color-gray-3: transparent !important;
  --mantine-color-blue-6: var(--safety-orange) !important;
  --mantine-color-blue-filled: var(--safety-orange) !important;
  --input-border-color: transparent !important;
  --input-bd: 0 !important;
  --input-bd-focus: 0 !important;
  --input-bd-hover: 0 !important;
  --input-border-focus: 0 !important;
  --input-border-hover: 0 !important;
}

/* Use CSS custom properties with fallbacks */
.wefab-borderless-input [class*="mantine-Input"],
.wefab-borderless-input [class*="mantine-TextInput"], 
.wefab-borderless-input [class*="mantine-Textarea"],
.wefab-borderless-input [class*="mantine-Select"],
.wefab-borderless-input [class*="mantine-NumberInput"] {
  border: 0 !important;
  --input-bd: 0 !important;
  --input-bd-focus: 0 !important;
}

/* Target every possible input element */
.wefab-borderless-input [data-mantine-component="Input"] input,
.wefab-borderless-input [data-mantine-component="TextInput"] input,
.wefab-borderless-input [data-mantine-component="Textarea"] textarea,
.wefab-borderless-input [data-mantine-component="Select"] input,
.wefab-borderless-input [data-mantine-component="NumberInput"] input {
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
}

/* Table Grouping and Aggregation Styles */
.table-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: var(--space-md);
}

.table-header-left {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}

.wefab-grouping-info {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
}

.wefab-data-grid-group-row {
  background-color: rgba(26, 58, 95, 0.05);
}

.wefab-data-grid-group-cell {
  padding: 6px 12px;
  border-bottom: 1px solid var(--material-silver);
}

.wefab-group-header {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
}

.wefab-group-toggle {
  background: none;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  color: var(--blueprint-blue);
  padding: var(--space-xs);
  border-radius: var(--radius-xs);
}

.wefab-group-toggle:hover {
  background-color: rgba(26, 58, 95, 0.1);
}

.wefab-group-title {
  flex: 1 1;
}

.wefab-data-grid-aggregation-row {
  background-color: rgba(255, 87, 34, 0.05);
  font-weight: 500;
}

.wefab-data-grid-aggregation-cell {
  padding: 6px 12px;
  border-bottom: 1px solid var(--material-silver);
  font-size: 13px;
}

.wefab-data-grid-grouped-data-row {
  background-color: rgba(0, 0, 0, 0.02);
}

.wefab-data-grid-footer-row {
  background-color: var(--technical-white);
  font-weight: 600;
  border-top: 2px solid var(--blueprint-blue);
}

.wefab-data-grid-footer-cell {
  padding: var(--space-md);
  border-bottom: none;
}


/* Fix group toggle button focus/active states */
.wefab-group-toggle:focus {
  outline: none !important;
  box-shadow: none !important;
  border: none !important;
}

.wefab-group-toggle:active {
  outline: none !important;
  box-shadow: none !important;
  border: none !important;
}

.wefab-group-toggle:focus-visible {
  outline: none !important;
  box-shadow: none !important;
  border: none !important;
}


/* Update Table Grouping Styles to match TreeTable */
.wefab-data-grid-group-row {
  background-color: rgba(26, 58, 95, 0.02);
  border-left: 3px solid transparent;
}

.wefab-data-grid-group-row:hover {
  background-color: rgba(26, 58, 95, 0.05);
  border-left: 3px solid var(--blueprint-blue);
}

.wefab-data-grid-group-cell {
  padding: 6px 12px;
  border-bottom: 1px solid var(--material-silver);
  height: 36px;
}

.wefab-group-header {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 100%;
}

/* Ensure group text is not bold */
.wefab-group-header .text-body-small {
  font-weight: 400 !important;
}

/* Remove old button styles */
.wefab-group-toggle {
  display: none;
}

/* Enhanced Table Styles */
.wefab-data-grid {
  background: white;
  border-radius: var(--radius-md);
  border: 1px solid var(--material-silver);
  overflow: hidden;
}

/* Header Section */
.wefab-data-grid-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding: 12px 16px;
  border-bottom: 1px solid var(--material-silver);
  background: var(--technical-white);
}

.wefab-data-grid-title-section {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.wefab-grouping-badges {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px;
}

/* Toolbar */
.wefab-data-grid-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 16px;
  border-bottom: 1px solid var(--material-silver);
  background: white;
  min-height: 44px;
}

.wefab-toolbar-left {
  display: flex;
  align-items: center;
  flex: 1 1;
}

.wefab-toolbar-right {
  display: flex;
  align-items: center;
}

/* Grouping chips on the left */
.wefab-grouping-chips {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.wefab-grouping-label {
  color: var(--blueprint-blue) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  margin-right: 4px;
}

.wefab-grouping-chip-wrapper {
  cursor: pointer;
  transition: all 0.2s ease;
}

.wefab-grouping-chip-wrapper:hover .wefab-grouping-chip {
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(26, 58, 95, 0.15);
}

.wefab-grouping-chip {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  border: 1px solid var(--blueprint-blue) !important;
  color: var(--blueprint-blue) !important;
  background: rgba(26, 58, 95, 0.05) !important;
}

/* Toolbar icons */
.wefab-toolbar-icon {
  color: var(--machine-gray);
  border: 1px solid var(--material-silver);
  background: white;
  transition: all 0.2s ease;
}

.wefab-toolbar-icon:hover {
  color: var(--blueprint-blue);
  border-color: var(--blueprint-blue);
  background: rgba(26, 58, 95, 0.05);
}

.wefab-toolbar-icon[data-variant="filled"] {
  color: white;
  background: var(--blueprint-blue);
  border-color: var(--blueprint-blue);
}

/* Grouping select */
.wefab-grouping-select {
  min-width: 140px;
  font-size: 12px;
}

.wefab-grouping-select .mantine-Select-input {
  font-size: 12px !important;
  height: 28px !important;
  min-height: 28px !important;
}

/* Column Manager Dropdown */
.wefab-column-manager-dropdown {
  position: absolute;
  top: calc(100% + 4px);
  right: 0;
  z-index: 1001;
  background: white;
  border: 1px solid var(--material-silver);
  border-radius: var(--radius-sm);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  width: 280px;
  max-height: 400px;
  overflow-y: auto;
  margin-top: 2px;
}

.wefab-column-manager-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 12px;
  background: var(--technical-white);
  border-bottom: 1px solid var(--material-silver);
}

.wefab-column-manager-content {
  padding: 8px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.wefab-column-item {
  display: flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  padding: 3px 6px;
  border-radius: var(--radius-xs);
  transition: background-color 0.2s ease;
  font-size: 12px;
}

.wefab-column-item:hover {
  background: rgba(26, 58, 95, 0.05);
}

.wefab-column-checkbox {
  width: 12px;
  height: 12px;
  cursor: pointer;
  accent-color: var(--blueprint-blue);
}

/* Table Container */
.wefab-data-grid-container {
  max-height: 600px;
}

.wefab-data-grid-table {
  min-width: 100%;
  table-layout: auto;
  border-collapse: collapse;
  border-spacing: 0;
}

/* Remove ONLY vertical borders, keep horizontal borders for row separation */
.wefab-data-grid-table {
  border-collapse: collapse !important;
  border-spacing: 0 !important;
  table-layout: fixed !important;
}

.wefab-data-grid-table td,
.wefab-data-grid-table th {
  box-sizing: border-box !important;
  margin: 0 !important;
  border-right: none;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Frozen columns - clean, no borders */
.wefab-data-grid-table [style*="position: sticky"] {
  margin: 0 !important;
  border-right: none !important;
  box-shadow: none !important;
}

/* Header Cells with Resize Handle */
.wefab-data-grid-header-cell {
  position: relative;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}

/* Header Icons (Sort and Freeze) */
.wefab-header-icon {
  background: transparent !important;
  border: none !important;
  color: var(--blueprint-blue) !important;
  transition: color 0.2s ease !important;
}

.wefab-header-icon:hover {
  background: transparent !important;
  color: var(--blueprint-blue) !important;
}

.wefab-header-icon--active {
  color: var(--blueprint-blue) !important;
  background: transparent !important;
}

.wefab-header-icon:focus {
  outline: none !important;
  box-shadow: none !important;
  border: none !important;
  background: transparent !important;
}

.wefab-header-icon:active {
  outline: none !important;
  box-shadow: none !important;
  border: none !important;
  background: transparent !important;
}

.wefab-resize-handle {
  position: absolute;
  top: 0;
  right: -2px;
  width: 4px;
  height: 100%;
  cursor: col-resize;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--machine-gray);
  opacity: 0;
  transition: opacity 0.2s ease;
  z-index: 10;
}

.wefab-data-grid-header-cell:hover .wefab-resize-handle {
  opacity: 1;
}

.wefab-resize-handle:hover {
  color: var(--blueprint-blue);
  opacity: 1 !important;
}

/* Compact Text Sizes */
.wefab-data-grid-footer .mantine-Text-root,
.wefab-data-grid-pagination .mantine-Text-root {
  font-size: 11px !important;
}

/* Footer Section */
.wefab-data-grid-footer-section {
  background: var(--technical-white);
  border-top: 2px solid var(--blueprint-blue);
}

.wefab-data-grid-footer-cell {
  border-bottom: none;
}

/* Pagination chevrons - no background */
.wefab-pagination-chevron {
  background: transparent !important;
  border: none !important;
  color: var(--blueprint-blue) !important;
  transition: color 0.2s ease;
}

.wefab-pagination-chevron:hover:not([data-disabled]) {
  background: transparent !important;
  color: var(--blueprint-blue) !important;
}

.wefab-pagination-chevron[data-disabled] {
  color: var(--material-silver) !important;
  cursor: not-allowed;
}

/* Remove focus outlines from table buttons */
.wefab-data-grid button:focus,
.wefab-data-grid .mantine-UnstyledButton-root:focus,
.wefab-data-grid .mantine-ActionIcon-root:focus {
  outline: none !important;
  box-shadow: none !important;
}

/* MultiSelectDropdown Styles */
.wefab-multiselect-dropdown {
  position: relative;
  width: 100%;
}

.wefab-multiselect-trigger {
  transition: all 0.2s ease;
  border: 1px solid rgb(218, 215, 215);
  border-radius: var(--mantine-radius-sm);
  background: white;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}

.wefab-multiselect-trigger:hover:not(.wefab-multiselect-trigger--disabled) {
  /* border-color: var(--blueprint-blue) !important; */
  box-shadow: 0 0 0 1px rgba(59, 130, 246, 0.1);
}

.wefab-multiselect-trigger:focus-within {
  /* border-color: var(--blueprint-blue) !important; */
  box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.1) !important;
  outline: none;
}

.wefab-multiselect-trigger--disabled {
  background-color: var(--mantine-color-gray-0) !important;
  cursor: not-allowed !important;
  opacity: 0.6;
}

.wefab-multiselect-trigger--error {
  border-color: var(--mantine-color-error) !important;
}

.wefab-multiselect-trigger--sm {
  font-size: 13px;
}

.wefab-multiselect-trigger--md {
  font-size: 14px;
}

.wefab-multiselect-trigger--lg {
  font-size: 15px;
}

.wefab-multiselect-dropdown .mantine-Paper-root {
  border: 1px solid var(--mantine-color-gray-3);
  box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}

.wefab-multiselect-selected-item {
  display: inline-flex;
  align-items: center;
}

.wefab-multiselect-badge {
  padding: 2px 6px !important;
  font-weight: 500 !important;
  max-width: 200px;
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
}

.wefab-multiselect-badge .mantine-Text-root {
  max-width: 150px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  color: var(--blueprint-blue) !important;
  font-size: 11px !important;
}

.wefab-multiselect-remove-btn {
  padding: 0 !important;
  min-width: unset !important;
  width: 16px !important;
  height: 16px !important;
  border-radius: 50% !important;
  opacity: 0.8;
  transition: all 0.2s ease;
}

.wefab-multiselect-remove-btn:hover {
  opacity: 1 !important;
  background-color: rgba(255, 255, 255, 0.2) !important;
}

.wefab-multiselect-remove-btn .tabler-icon {
  color: var(--blueprint-blue) !important;
}

.wefab-multiselect-remove-btn:hover .tabler-icon {
  color: white !important;
}

/* Search box integration */
.wefab-multiselect-search {
  width: 100%;
}

.wefab-multiselect-search .wefab-search-container {
  border: 1px solid var(--mantine-color-gray-3);
  border-radius: var(--mantine-radius-sm);
  background: white;
  transition: border-color 0.2s ease;
}

.wefab-multiselect-search .wefab-search-container:focus-within {
  border-color: rgb(212, 212, 212) !important; 
  box-shadow: 0 0 0 1px rgba(59, 130, 246, 0.1);
}

/* Option hover states - removed, handled by component classes */

/* Create new option styling */
.wefab-multiselect-create-option {
  border: 1px dashed var(--blueprint-blue);
  background-color: transparent;
  transition: all 0.2s ease;
}

.wefab-multiselect-create-option:hover {
  background-color: transparent;
  border-style: solid;
}

/* Search input styling */
.wefab-multiselect-dropdown .mantine-TextInput-input {
  border: none;
  padding: 8px 12px;
  font-size: 14px;
}

.wefab-multiselect-dropdown .mantine-TextInput-input:focus {
  box-shadow: none;
}

/* Category headers */
.wefab-multiselect-category-header {
  background-color: var(--mantine-color-gray-0);
  border-bottom: 1px solid var(--mantine-color-gray-2);
  padding: 8px 12px;
  font-size: 11px;
  font-weight: 600;
  color: var(--mantine-color-dimmed);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

/* Stats footer */
.wefab-multiselect-stats {
  background-color: var(--mantine-color-gray-0);
  border-top: 1px solid var(--mantine-color-gray-2);
  padding: 8px 12px;
  font-size: 11px;
  color: var(--mantine-color-dimmed);
}

/* Card variants */
.wefab-multiselect-card {
  transition: all 0.2s ease;
  border-radius: 4px;
}

.wefab-multiselect-card:hover {
  /* No background color change */
}

.wefab-multiselect-card[aria-selected="true"] {
  /* No background color change */
}

.wefab-multiselect-card--supplier,
.wefab-multiselect-card--manufacturing {
  border: 1px solid #e5e7eb;
  margin: 2px 8px;
  padding: 10px 12px !important;
  border-radius: 8px;
  background: #ffffff !important;
  transition: all 0.2s ease;
}

.wefab-multiselect-card--supplier:hover,
.wefab-multiselect-card--manufacturing:hover {
  border-color: #e5e7eb;
  background-color: #faf8f7 !important;
}

.wefab-multiselect-card--supplier[aria-selected="true"],
.wefab-multiselect-card--manufacturing[aria-selected="true"] {
  border-color: #e5e7eb !important;
  background-color: #faf8f7 !important;
}

/* Sub-process styling - no background for subprocess items */
.wefab-multiselect-subprocess {
  margin-left: 8px;
  padding: 2px 0;
  background: transparent !important;
}

/* Hide scrollbars */
.hide-scrollbar::-webkit-scrollbar {
  display: none;
}

.hide-scrollbar {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.wefab-multiselect-subprocess:hover {
  background: transparent !important;
}

.wefab-multiselect-subprocess .mantine-Checkbox-input {
  background: white !important;
  border: 1px solid #cbd5e1;
}

.wefab-multiselect-subprocess .mantine-Checkbox-input:checked {
  background: #6b7280 !important;
  border-color: #6b7280 !important;
}

.wefab-subprocess-chip {
  font-size: 10px !important;
  height: 18px !important;
  padding: 2px 6px !important;
}


/* Enhanced EditableTable Form Styles */
.editable-table-form-enhanced {
  -webkit-backdrop-filter: blur(10px);
          backdrop-filter: blur(10px);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08);
  transition: all 0.3s ease;
}

.editable-table-form-enhanced:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.12);
}

.editable-form-grid-enhanced {
  animation: fadeIn 0.3s ease-in-out;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}


/* EditableTable column width fixes */
.editable-table-container {
  overflow-x: auto;
  max-width: 100%;
}

.editable-table th {
  min-width: 100px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.editable-table td {
  min-width: 100px;
  max-width: 300px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}



/* Profile Component Styles */
.wefab-profile-menu-item:hover {
  background-color: var(--technical-white) !important;
}

.wefab-profile-logout:hover {
  background-color: rgba(255, 87, 34, 0.05) !important;
}


/* Header NavLinks Color Overrides */
.wefab-header-navlinks .mantine-UnstyledButton-root {
  color: var(--machine-gray) !important;
}

/* Blue Variant */
.wefab-header-navlinks--blue .wefab-header-navlink--active {
  color: var(--blueprint-blue) !important;
  border-bottom-color: var(--blueprint-blue) !important;
}

.wefab-header-navlinks--blue .wefab-header-navlink:hover {
  color: var(--blueprint-blue) !important;
}

/* Orange Variant */
.wefab-header-navlinks--orange .wefab-header-navlink--active {
  color: var(--safety-orange) !important;
  border-bottom-color: var(--safety-orange) !important;
}

.wefab-header-navlinks--orange .wefab-header-navlink:hover {
  color: var(--safety-orange) !important;
}

/* Generic active and hover states for Mantine classes */
.wefab-header-navlinks--blue .mantine-UnstyledButton-root[data-active='true'],
.wefab-header-navlinks--blue .mantine-UnstyledButton-root.active {
  color: var(--blueprint-blue) !important;
  border-bottom-color: var(--blueprint-blue) !important;
}

.wefab-header-navlinks--blue .mantine-UnstyledButton-root:hover {
  color: var(--blueprint-blue) !important;
}

.wefab-header-navlinks--orange .mantine-UnstyledButton-root[data-active='true'],
.wefab-header-navlinks--orange .mantine-UnstyledButton-root.active {
  color: var(--safety-orange) !important;
  border-bottom-color: var(--safety-orange) !important;
}

.wefab-header-navlinks--orange .mantine-UnstyledButton-root:hover {
  color: var(--safety-orange) !important;
}

/* Mobile Navigation Dropdown */
.wefab-header-mobile-dropdown {
  display: block;
}

.wefab-header-mobile-navlinks .wefab-header-navlink-mobile:hover {
  background-color: var(--technical-white) !important;
}

/* Hide mobile dropdown on desktop */
@media (min-width: calc(var(--breakpoint-md) + 1px)) {
  .wefab-header-mobile-dropdown {
    display: none !important;
  }
}

/* Mobile Navigation Link Hover States - Blue Variant */
.wefab-header-navlinks--blue .wefab-header-navlink-mobile:hover {
  color: var(--blueprint-blue) !important;
  background-color: rgba(26, 58, 95, 0.05) !important;
}

/* Mobile Navigation Link Hover States - Orange Variant */
.wefab-header-navlinks--orange .wefab-header-navlink-mobile:hover {
  color: var(--safety-orange) !important;
  background-color: rgba(255, 87, 34, 0.05) !important;
}


/* Force burger visibility on mobile and ensure navlinks are hidden */
@media (max-width: var(--breakpoint-md)) {
  .wefab-header-burger {
    display: block !important;
    visibility: visible !important;
  }
  
  .wefab-header-navlinks {
    display: none !important;
    visibility: hidden !important;
  }
}

/* Ensure header has proper positioning context for mobile dropdown */
.wefab-header {
  position: relative;
  z-index: 100;
}

/* FORCE HIDE DESKTOP NAVLINKS ON MOBILE - OVERRIDE ALL */
@media (max-width: 768px) {
  .wefab-header-navlinks,
  .wefab-header-navlinks *,
  .wefab-header-navlinks .mantine-Group-root,
  .wefab-header-navlinks .mantine-UnstyledButton-root {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
  }
  
  /* Ensure burger is visible */
  .wefab-header-burger {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
  
  /* Only mobile dropdown should be visible when opened */
  .wefab-header-mobile-dropdown {
    display: block !important;
  }
}

/* FORCE SHOW DESKTOP NAVLINKS ON DESKTOP - HIDE MOBILE DROPDOWN */
@media (min-width: 769px) {
  .wefab-header-navlinks {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
  
  .wefab-header-burger {
    display: none !important;
    visibility: hidden !important;
  }
  
  .wefab-header-mobile-dropdown {
    display: none !important;
    visibility: hidden !important;
  }
}


/* Additional hiding for mobile */
@media (max-width: 768px) {
  .wefab-header-center,
  .wefab-header-navlinks-wrapper {
    display: none !important;
    width: 0 !important;
    visibility: hidden !important;
  }
}

@media (min-width: 769px) {
  .wefab-header-center,
  .wefab-header-navlinks-wrapper {
    display: flex !important;
    visibility: visible !important;
  }
}


/* Remove borders from sidebar toggle button */
.wefab-sidebar__toggle {
  border: none !important;
  background: transparent !important;
  outline: none !important;
  box-shadow: none !important;
  padding: 0.5rem !important;
}

.wefab-sidebar__toggle:hover {
  background: rgba(0, 0, 0, 0.05) !important;
  border: none !important;
  box-shadow: none !important;
}

.wefab-sidebar__toggle:focus {
  outline: none !important;
  border: none !important;
  box-shadow: none !important;
}

/* Ensure proper user info styling */
.wefab-sidebar__user-name {
  font-weight: 600 !important;
  font-size: 14px !important;
  color: var(--precision-black) !important;
  line-height: 1.2 !important;
  margin-bottom: 2px !important;
}

.wefab-sidebar__user-role {
  font-weight: 400 !important;
  font-size: 12px !important;
  color: var(--machine-gray) !important;
  line-height: 1.2 !important;
  opacity: 0.8 !important;
}

/* Update profile content layout */
.wefab-sidebar__profile-content {
  display: flex !important;
  align-items: center !important;
  gap: 0.75rem !important;
  padding: 1rem !important;
  width: 100% !important;
}

.wefab-sidebar__user-info {
  flex: 1 1 !important;
  min-width: 0 !important;
}


/* Reduce spacing in user profile section */
.wefab-sidebar__profile-content {
  display: flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
  padding: 0.75rem !important;
  width: 100% !important;
}

.wefab-sidebar__avatar {
  flex-shrink: 0 !important;
}

.wefab-sidebar__user-info {
  flex: 1 1 !important;
  min-width: 0 !important;
}

.wefab-sidebar__user-name {
  font-weight: 600 !important;
  font-size: 13px !important;
  color: var(--precision-black) !important;
  line-height: 1.1 !important;
  margin-bottom: 1px !important;
}

.wefab-sidebar__user-role {
  font-weight: 400 !important;
  font-size: 11px !important;
  color: var(--machine-gray) !important;
  line-height: 1.1 !important;
  opacity: 0.8 !important;
}

.wefab-sidebar__toggle {
  border: none !important;
  background: transparent !important;
  outline: none !important;
  box-shadow: none !important;
  padding: 0.25rem !important;
  flex-shrink: 0 !important;
}


/* Further reduce padding and remove hover background */
.wefab-sidebar__profile-content {
  display: flex !important;
  align-items: center !important;
  gap: 0.375rem !important;
  padding: 0.5rem !important;
  width: 100% !important;
}

.wefab-sidebar__toggle {
  border: none !important;
  background: transparent !important;
  outline: none !important;
  box-shadow: none !important;
  padding: 0.125rem !important;
  flex-shrink: 0 !important;
  transition: none !important;
}

.wefab-sidebar__toggle:hover {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  transform: none !important;
  opacity: 1 !important;
}

.wefab-sidebar__toggle:focus {
  outline: none !important;
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
}

.wefab-sidebar__toggle:active {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* Override any Mantine button styles */
.wefab-sidebar__toggle.mantine-UnstyledButton-root {
  background: transparent !important;
  border: none !important;
}

.wefab-sidebar__toggle.mantine-UnstyledButton-root:hover {
  background: transparent !important;
  border: none !important;
}

.wefab-sidebar__user-name {
  font-weight: 600 !important;
  font-size: 12px !important;
  color: var(--precision-black) !important;
  line-height: 1.0 !important;
  margin-bottom: 1px !important;
}

.wefab-sidebar__user-role {
  font-weight: 400 !important;
  font-size: 10px !important;
  color: var(--machine-gray) !important;
  line-height: 1.0 !important;
  opacity: 0.7 !important;
}


/* ========== RESPONSIVE LAYOUT SYSTEM ========== */

/* Main Content Area Responsive Layout */
.wefab-main-content {
  transition: margin-left 0.3s ease, padding 0.3s ease !important;
  background-color: var(--technical-white) !important;
  min-height: calc(100vh - 70px) !important;
}

/* Responsive breakpoints for main content */
@media (max-width: 768px) {
  .wefab-main-content {
    margin-left: 0 !important;
    padding: 0.5rem !important;
  }
  
  /* Hide sidebar on mobile */
  .wefab-sidebar {
    position: fixed !important;
    left: -280px !important;
    z-index: 1000 !important;
    transition: left 0.3s ease !important;
  }
  
  .wefab-sidebar--expanded {
    left: 0 !important;
  }
}

@media (min-width: 769px) and (max-width: 1024px) {
  .wefab-main-content {
    padding: 0.75rem !important;
  }
}

@media (min-width: 1025px) {
  .wefab-main-content {
    padding: 1rem !important;
  }
}

/* ========== CONSISTENT COMPONENT STYLING ========== */

/* WeFab Paper/Card Base Styles */
.wefab-paper,
.wefab-card,
.mantine-Paper-root,
.mantine-Card-root {
  background: white !important;
  border: 1px solid var(--material-silver) !important;
  border-radius: var(--radius-md) !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important;
  padding: var(--space-lg) !important;
  margin-bottom: var(--space-md) !important;
}

/* Component Container Consistency */
.wefab-component-container {
  background: white !important;
  border: 1px solid var(--material-silver) !important;
  border-radius: var(--radius-md) !important;
  padding: var(--space-lg) !important;
  margin-bottom: var(--space-lg) !important;
}

/* Section Headers */
.wefab-section-header {
  padding: var(--space-lg) var(--space-lg) var(--space-md) var(--space-lg) !important;
  border-bottom: 1px solid var(--material-silver) !important;
  background: var(--technical-white) !important;
  border-radius: var(--radius-md) var(--radius-md) 0 0 !important;
}

.wefab-section-title {
  font-size: var(--text-lg) !important;
  font-weight: 600 !important;
  color: var(--blueprint-blue) !important;
  margin: 0 !important;
}

/* Grid and Layout Consistency */
.wefab-grid-container {
  gap: var(--space-lg) !important;
}

.wefab-grid-item {
  background: white !important;
  border: 1px solid var(--material-silver) !important;
  border-radius: var(--radius-md) !important;
  padding: var(--space-lg) !important;
}

/* Form Component Styling */
.wefab-form-container {
  background: white !important;
  border: 1px solid var(--material-silver) !important;
  border-radius: var(--radius-md) !important;
  padding: var(--space-xl) !important;
}

/* Table Container Styling */
.wefab-table-container {
  background: white !important;
  border: 1px solid var(--material-silver) !important;
  border-radius: var(--radius-md) !important;
  overflow: hidden !important;
}

/* Stats/Metrics Card Styling */
.wefab-stats-container {
  display: grid !important;
  grid-gap: var(--space-lg) !important;
  gap: var(--space-lg) !important;
  margin-bottom: var(--space-xl) !important;
}

@media (min-width: 769px) {
  .wefab-stats-container {
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)) !important;
  }
}

@media (max-width: 768px) {
  .wefab-stats-container {
    grid-template-columns: 1fr !important;
    gap: var(--space-md) !important;
  }
}

/* Content Spacing */
.wefab-content-section {
  margin-bottom: var(--space-2xl) !important;
}

.wefab-content-section:last-child {
  margin-bottom: 0 !important;
}

/* Responsive Padding Adjustments */
@media (max-width: 480px) {
  .wefab-paper,
  .wefab-card,
  .wefab-component-container,
  .wefab-form-container {
    padding: var(--space-md) !important;
    margin-bottom: var(--space-md) !important;
  }
  
  .wefab-section-header {
    padding: var(--space-md) !important;
  }
}

/* Container Max Width Consistency */
.wefab-container {
  max-width: 1400px !important;
  margin: 0 auto !important;
  padding-left: var(--space-lg) !important;
  padding-right: var(--space-lg) !important;
}

@media (max-width: 768px) {
  .wefab-container {
    padding-left: var(--space-md) !important;
    padding-right: var(--space-md) !important;
  }
}


/* ========== LISTVIEW COMPONENT SPECIFIC STYLES ========== */
.list-item-card {
  padding: 0 !important;
  margin-bottom: 4px !important;
}

/* Minimal padding for ListView filter bar and stats cards */
.wefab-listview .mantine-Paper-root:not(.list-item-card) {
  padding: 6px !important;
  margin-bottom: 5px !important;
}

/* Add small space between ListView sections */
.wefab-listview > * + * {
  margin-top: 2px !important;
}

/* Fix ListView dropdown display issues */
.wefab-listview .mantine-Select-dropdown,
.wefab-listview [data-combobox-dropdown] {
  z-index: 1000 !important;
  background: white !important;
  border: 1px solid var(--material-silver) !important;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1) !important;
}

/* Reduce gap between list cards */
.list-item-card + .list-item-card {
  margin-top: 1px !important;
}
/* ========== CHAT COMPONENT RESPONSIVE STYLES ========== */
@media (max-width: 768px) {
  .wefab-chat-sidebar {
    min-width: 100% !important;
    border-right: none !important;
    border-bottom: 1px solid var(--material-silver) !important;
    border-top-right-radius: var(--radius-lg) !important;
  }
}

/* ========== PAGE.TSX SPECIFIC STYLES ========== */

/* Main page layout */
.wefab-page-layout {
  min-height: 100vh;
  padding-top: 10px !important;
}

.wefab-page-main-content {
  flex: 1 1;
  transition: margin-left 0.3s ease, padding 0.3s ease;
  background-color: var(--technical-white);
  min-height: calc(100vh - 10px);
  padding: 0.25rem;
  minWidth: 0;
  overflow: hidden;
}

/* Sidebar state adjustments for main content */
.wefab-page-main-content--collapsed {
  margin-left: 60px;
}

.wefab-page-main-content--expanded {
  margin-left: 260px;
}

/* Page container */
.wefab-page-container {
  max-width: 1400px;
  margin: 0 auto;
  padding-left: 0;
  padding-right: 0;
}

/* Page content sections */
.wefab-page-section {
  margin-bottom: 1.5rem;
}

.wefab-page-section:last-child {
  margin-bottom: 1rem;
}

/* Page section headers */
.wefab-page-section-header {
  padding: 1.5rem 1.5rem 1rem 1.5rem;
  border-bottom: 1px solid var(--material-silver);
  background: var(--technical-white);
  border-radius: var(--radius-md) var(--radius-md) 0 0;
  margin-bottom: 1.5rem;
}

.wefab-page-section-title {
  font-size: var(--text-xl);
  font-weight: 600;
  color: var(--blueprint-blue);
  margin: 0;
}

/* Page component containers */
.wefab-page-component {
  background: white;
  border: 1px solid var(--material-silver);
  border-radius: var(--radius-md);
  padding: 1.5rem;
  margin-bottom: 1.5rem;
}

.wefab-page-component:last-child {
  margin-bottom: 0;
}

/* Page component stack spacing */
.wefab-page-stack {
  gap: 1.5rem;
}

/* Page grid layout */
.wefab-page-grid {
  gap: 1.5rem;
}

.wefab-page-grid-item {
  background: white;
  border: 1px solid var(--material-silver);
  border-radius: var(--radius-md);
  padding: 1.5rem;
}

/* Mobile responsive adjustments for page layout */
@media (max-width: 768px) {
  .wefab-page-main-content {
    margin-left: 0 !important;
    padding: 1rem;
  }
  
  .wefab-page-section {
    margin-bottom: 2rem;
  }
  
  .wefab-page-component {
    padding: 1rem;
    margin-bottom: 1rem;
  }
  
  .wefab-page-section-header {
    padding: 1rem;
    margin-bottom: 1rem;
  }
  
  .wefab-page-stack {
    gap: 1rem;
  }
  
  .wefab-page-grid {
    gap: 1rem;
  }
  
  .wefab-page-grid-item {
    padding: 1rem;
  }
}

@media (min-width: 769px) and (max-width: 1024px) {
  .wefab-page-main-content {
    padding: 1.25rem;
  }
  
  .wefab-page-section {
    margin-bottom: 2.5rem;
  }
  
  .wefab-page-component {
    padding: 1.25rem;
    margin-bottom: 1.25rem;
  }
}


.wefab-page-main-content {
  flex: 1 1;
  transition: margin-left 0.3s ease, padding 0.3s ease;
  background-color: var(--technical-white);
  min-height: calc(100vh - 80px); /* Adjusted for new padding */
  padding: 1rem; /* Reduced from 1.5rem */
  min-width: 0;
  overflow: hidden;
}

/* Reduce section spacing */
.wefab-page-section {
  margin-bottom: 2rem; /* Reduced from 3rem */
}

.wefab-page-section:last-child {
  margin-bottom: 0;
}

/* Reduce component spacing */
.wefab-page-component {
  background: white;
  border: 1px solid var(--material-silver);
  border-radius: var(--radius-md);
  padding: 1.25rem; /* Reduced from 1.5rem */
  margin-bottom: 1.25rem; /* Reduced from 1.5rem */
}

.wefab-page-component:last-child {
  margin-bottom: 0;
}

/* Reduce section header padding */
.wefab-page-section-header {
  padding: 1rem 1.25rem 0.75rem 1.25rem; /* Reduced overall */
  border-bottom: 1px solid var(--material-silver);
  background: var(--technical-white);
  border-radius: var(--radius-md) var(--radius-md) 0 0;
  margin-bottom: 1rem; /* Reduced from 1.5rem */
}

/* Reduce stack spacing */
.wefab-page-stack {
  gap: 1.25rem; /* Reduced from 1.5rem */
}

.wefab-page-grid {
  gap: 1.25rem; /* Reduced from 1.5rem */
}

.wefab-page-grid-item {
  background: white;
  border: 1px solid var(--material-silver);
  border-radius: var(--radius-md);
  padding: 1.25rem; /* Reduced from 1.5rem */
}


.wefab-page-main-content {
  flex: 1 1;
  transition: margin-left 0.3s ease, padding 0.3s ease;
  background-color: var(--technical-white);
  min-height: calc(100vh - 60px) !important; /* Adjusted */
  padding: 0.75rem !important; /* Reduced further */
  min-width: 0;
  overflow: hidden;
}

.wefab-page-main-content--collapsed {
  margin-left: 60px !important; /* Reduced from 80px */
}

.wefab-page-main-content--expanded {
  margin-left: 260px !important; /* Reduced from 280px */
}


/* Also reduce section margins */
.wefab-page-section {
  margin-bottom: 1.5rem !important; /* Further reduced */
}

.wefab-page-section-header {
  padding: 0.75rem 1rem 0.5rem 1rem !important; /* Much tighter */
  margin-bottom: 0.75rem !important; /* Reduced */
}


/* ========================================== */
/* UTILITY CLASSES - Added 2024              */
/* ========================================== */
/* Purpose: Eliminate inline styles by providing reusable utility classes */
/* Following 8px spacing base system */

/* ========== LAYOUT UTILITIES ========== */

/* Display */
.flex { display: flex; }
.inline-flex { display: inline-flex; }
.block { display: block; }
.inline-block { display: inline-block; }
.grid { display: grid; }
.inline-grid { display: inline-grid; }
.hidden { display: none; }

/* Flex Direction */
.flex-row { flex-direction: row; }
.flex-row-reverse { flex-direction: row-reverse; }
.flex-col { flex-direction: column; }
.flex-col-reverse { flex-direction: column-reverse; }

/* Flex Wrap */
.flex-wrap { flex-wrap: wrap; }
.flex-nowrap { flex-wrap: nowrap; }
.flex-wrap-reverse { flex-wrap: wrap-reverse; }

/* Flex */
.flex-1 { flex: 1 1; }
.flex-auto { flex: 1 1 auto; }
.flex-initial { flex: 0 1 auto; }
.flex-none { flex: none; }

/* Justify Content */
.justify-start { justify-content: flex-start; }
.justify-end { justify-content: flex-end; }
.justify-center { justify-content: center; }
.justify-between { justify-content: space-between; }
.justify-around { justify-content: space-around; }
.justify-evenly { justify-content: space-evenly; }

/* Align Items */
.items-start { align-items: flex-start; }
.items-end { align-items: flex-end; }
.items-center { align-items: center; }
.items-baseline { align-items: baseline; }
.items-stretch { align-items: stretch; }

/* Align Self */
.self-auto { align-self: auto; }
.self-start { align-self: flex-start; }
.self-end { align-self: flex-end; }
.self-center { align-self: center; }
.self-stretch { align-self: stretch; }

/* Common Flex Combinations */
.flex-center {
  display: flex;
  align-items: center;
  justify-content: center;
}

.flex-between {
  display: flex;
  justify-content: space-between;
}

.flex-between-center {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.flex-start-center {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

.flex-end-center {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

/* ========== SPACING UTILITIES ========== */

/* Padding - All Sides */
.p-0 { padding: 0; }
.p-xs { padding: var(--space-xs); }    /* 4px */
.p-sm { padding: var(--space-sm); }    /* 8px */
.p-md { padding: var(--space-md); }    /* 12px */
.p-lg { padding: var(--space-lg); }    /* 16px */
.p-xl { padding: var(--space-xl); }    /* 24px */
.p-2xl { padding: var(--space-2xl); }  /* 32px */
.p-3xl { padding: var(--space-3xl); }  /* 48px */

/* Padding - Horizontal */
.px-0 { padding-left: 0; padding-right: 0; }
.px-xs { padding-left: var(--space-xs); padding-right: var(--space-xs); }
.px-sm { padding-left: var(--space-sm); padding-right: var(--space-sm); }
.px-md { padding-left: var(--space-md); padding-right: var(--space-md); }
.px-lg { padding-left: var(--space-lg); padding-right: var(--space-lg); }
.px-xl { padding-left: var(--space-xl); padding-right: var(--space-xl); }
.px-2xl { padding-left: var(--space-2xl); padding-right: var(--space-2xl); }

/* Padding - Vertical */
.py-0 { padding-top: 0; padding-bottom: 0; }
.py-xs { padding-top: var(--space-xs); padding-bottom: var(--space-xs); }
.py-sm { padding-top: var(--space-sm); padding-bottom: var(--space-sm); }
.py-md { padding-top: var(--space-md); padding-bottom: var(--space-md); }
.py-lg { padding-top: var(--space-lg); padding-bottom: var(--space-lg); }
.py-xl { padding-top: var(--space-xl); padding-bottom: var(--space-xl); }
.py-2xl { padding-top: var(--space-2xl); padding-bottom: var(--space-2xl); }

/* Padding - Individual Sides */
.pt-0 { padding-top: 0; }
.pt-xs { padding-top: var(--space-xs); }
.pt-sm { padding-top: var(--space-sm); }
.pt-md { padding-top: var(--space-md); }
.pt-lg { padding-top: var(--space-lg); }
.pt-xl { padding-top: var(--space-xl); }
.pt-2xl { padding-top: var(--space-2xl); }

.pr-0 { padding-right: 0; }
.pr-xs { padding-right: var(--space-xs); }
.pr-sm { padding-right: var(--space-sm); }
.pr-md { padding-right: var(--space-md); }
.pr-lg { padding-right: var(--space-lg); }
.pr-xl { padding-right: var(--space-xl); }
.pr-2xl { padding-right: var(--space-2xl); }

.pb-0 { padding-bottom: 0; }
.pb-xs { padding-bottom: var(--space-xs); }
.pb-sm { padding-bottom: var(--space-sm); }
.pb-md { padding-bottom: var(--space-md); }
.pb-lg { padding-bottom: var(--space-lg); }
.pb-xl { padding-bottom: var(--space-xl); }
.pb-2xl { padding-bottom: var(--space-2xl); }

.pl-0 { padding-left: 0; }
.pl-xs { padding-left: var(--space-xs); }
.pl-sm { padding-left: var(--space-sm); }
.pl-md { padding-left: var(--space-md); }
.pl-lg { padding-left: var(--space-lg); }
.pl-xl { padding-left: var(--space-xl); }
.pl-2xl { padding-left: var(--space-2xl); }

/* Margin - All Sides */
.m-0 { margin: 0; }
.m-xs { margin: var(--space-xs); }
.m-sm { margin: var(--space-sm); }
.m-md { margin: var(--space-md); }
.m-lg { margin: var(--space-lg); }
.m-xl { margin: var(--space-xl); }
.m-2xl { margin: var(--space-2xl); }
.m-auto { margin: auto; }

/* Margin - Horizontal */
.mx-0 { margin-left: 0; margin-right: 0; }
.mx-xs { margin-left: var(--space-xs); margin-right: var(--space-xs); }
.mx-sm { margin-left: var(--space-sm); margin-right: var(--space-sm); }
.mx-md { margin-left: var(--space-md); margin-right: var(--space-md); }
.mx-lg { margin-left: var(--space-lg); margin-right: var(--space-lg); }
.mx-xl { margin-left: var(--space-xl); margin-right: var(--space-xl); }
.mx-auto { margin-left: auto; margin-right: auto; }

/* Margin - Vertical */
.my-0 { margin-top: 0; margin-bottom: 0; }
.my-xs { margin-top: var(--space-xs); margin-bottom: var(--space-xs); }
.my-sm { margin-top: var(--space-sm); margin-bottom: var(--space-sm); }
.my-md { margin-top: var(--space-md); margin-bottom: var(--space-md); }
.my-lg { margin-top: var(--space-lg); margin-bottom: var(--space-lg); }
.my-xl { margin-top: var(--space-xl); margin-bottom: var(--space-xl); }

/* Margin - Individual Sides */
.mt-0 { margin-top: 0; }
.mt-xs { margin-top: var(--space-xs); }
.mt-sm { margin-top: var(--space-sm); }
.mt-md { margin-top: var(--space-md); }
.mt-lg { margin-top: var(--space-lg); }
.mt-xl { margin-top: var(--space-xl); }
.mt-2xl { margin-top: var(--space-2xl); }

.mr-0 { margin-right: 0; }
.mr-xs { margin-right: var(--space-xs); }
.mr-sm { margin-right: var(--space-sm); }
.mr-md { margin-right: var(--space-md); }
.mr-lg { margin-right: var(--space-lg); }
.mr-xl { margin-right: var(--space-xl); }
.mr-2xl { margin-right: var(--space-2xl); }

.mb-0 { margin-bottom: 0; }
.mb-xs { margin-bottom: var(--space-xs); }
.mb-sm { margin-bottom: var(--space-sm); }
.mb-md { margin-bottom: var(--space-md); }
.mb-lg { margin-bottom: var(--space-lg); }
.mb-xl { margin-bottom: var(--space-xl); }
.mb-2xl { margin-bottom: var(--space-2xl); }

.ml-0 { margin-left: 0; }
.ml-xs { margin-left: var(--space-xs); }
.ml-sm { margin-left: var(--space-sm); }
.ml-md { margin-left: var(--space-md); }
.ml-lg { margin-left: var(--space-lg); }
.ml-xl { margin-left: var(--space-xl); }
.ml-2xl { margin-left: var(--space-2xl); }

/* Gap (for flex/grid) */
.gap-0 { gap: 0; }
.gap-xs { gap: var(--space-xs); }
.gap-sm { gap: var(--space-sm); }
.gap-md { gap: var(--space-md); }
.gap-lg { gap: var(--space-lg); }
.gap-xl { gap: var(--space-xl); }
.gap-2xl { gap: var(--space-2xl); }

/* ========== SIZING UTILITIES ========== */

/* Width */
.w-auto { width: auto; }
.w-full { width: 100%; }
.w-screen { width: 100vw; }
.w-fit { width: -moz-fit-content; width: fit-content; }
.w-1-2 { width: 50%; }
.w-1-3 { width: 33.333333%; }
.w-2-3 { width: 66.666667%; }
.w-1-4 { width: 25%; }
.w-3-4 { width: 75%; }

/* Fixed widths */
.w-50 { width: 50px; }
.w-100 { width: 100px; }
.w-150 { width: 150px; }
.w-200 { width: 200px; }
.w-250 { width: 250px; }
.w-300 { width: 300px; }
.w-400 { width: 400px; }
.w-500 { width: 500px; }
.w-600 { width: 600px; }

/* Min Width */
.min-w-0 { min-width: 0; }
.min-w-full { min-width: 100%; }
.min-w-50 { min-width: 50px; }
.min-w-100 { min-width: 100px; }
.min-w-150 { min-width: 150px; }
.min-w-200 { min-width: 200px; }
.min-w-300 { min-width: 300px; }

/* Max Width */
.max-w-full { max-width: 100%; }
.max-w-screen { max-width: 100vw; }
.max-w-400 { max-width: 400px; }
.max-w-600 { max-width: 600px; }
.max-w-800 { max-width: 800px; }
.max-w-1000 { max-width: 1000px; }
.max-w-1200 { max-width: 1200px; }
.max-w-1400 { max-width: 1400px; }

/* Height */
.h-auto { height: auto; }
.h-full { height: 100%; }
.h-screen { height: 100vh; }
.h-fit { height: -moz-fit-content; height: fit-content; }

/* Fixed heights */
.h-50 { height: 50px; }
.h-100 { height: 100px; }
.h-150 { height: 150px; }
.h-200 { height: 200px; }
.h-300 { height: 300px; }
.h-400 { height: 400px; }

/* Min Height */
.min-h-0 { min-height: 0; }
.min-h-full { min-height: 100%; }
.min-h-screen { min-height: 100vh; }
.min-h-100 { min-height: 100px; }
.min-h-200 { min-height: 200px; }

/* ========== COLOR UTILITIES ========== */

/* Background Colors - Design System */
.bg-white { background-color: white; }
.bg-black { background-color: black; }
.bg-transparent { background-color: transparent; }
.bg-blueprint-blue { background-color: var(--blueprint-blue); }
.bg-technical-white { background-color: var(--technical-white); }
.bg-precision-black { background-color: var(--precision-black); }
.bg-machine-gray { background-color: var(--machine-gray); }
.bg-material-silver { background-color: var(--material-silver); }
.bg-safety-orange { background-color: var(--safety-orange); }
.bg-process-green { background-color: var(--process-green); }

/* Background Colors - Common Grays */
.bg-gray-50 { background-color: #F9FAFB; }
.bg-gray-100 { background-color: #F3F4F6; }
.bg-gray-200 { background-color: #E5E7EB; }
.bg-gray-300 { background-color: #D1D5DB; }
.bg-gray-400 { background-color: #9CA3AF; }
.bg-gray-500 { background-color: #6B7280; }
.bg-gray-600 { background-color: #4B5563; }
.bg-gray-700 { background-color: #374151; }
.bg-gray-800 { background-color: #1F2937; }
.bg-gray-900 { background-color: #111827; }

/* Background Colors - ProQ Palette */
.bg-proq-blue { background-color: #1269FF; }
.bg-proq-blue-light { background-color: #E6F0FF; }
.bg-proq-blue-dark { background-color: #0052CC; }

/* Text Colors - Design System */
.text-white { color: white; }
.text-black { color: black; }
.text-blueprint-blue { color: var(--blueprint-blue); }
.text-precision-black { color: var(--precision-black); }
.text-machine-gray { color: var(--machine-gray); }
.text-material-silver { color: var(--material-silver); }
.text-safety-orange { color: var(--safety-orange); }
.text-process-green { color: var(--process-green); }

/* Text Colors - Common Grays */
.text-gray-50 { color: #F9FAFB; }
.text-gray-100 { color: #F3F4F6; }
.text-gray-200 { color: #E5E7EB; }
.text-gray-300 { color: #D1D5DB; }
.text-gray-400 { color: #9CA3AF; }
.text-gray-500 { color: #6B7280; }
.text-gray-600 { color: #4B5563; }
.text-gray-700 { color: #374151; }
.text-gray-800 { color: #1F2937; }
.text-gray-900 { color: #111827; }

/* Text Colors - ProQ Palette */
.text-proq-blue { color: #1269FF; }
.text-proq-blue-dark { color: #0052CC; }

/* Border Colors */
.border-transparent { border-color: transparent; }
.border-white { border-color: white; }
.border-black { border-color: black; }
.border-material-silver { border-color: var(--material-silver); }
.border-gray-100 { border-color: #F3F4F6; }
.border-gray-200 { border-color: #E5E7EB; }
.border-gray-300 { border-color: #D1D5DB; }
.border-gray-400 { border-color: #9CA3AF; }
.border-proq-blue { border-color: #1269FF; }

/* ========== BORDER UTILITIES ========== */

/* Border Width */
.border-0 { border-width: 0; }
.border { border-width: 1px; }
.border-2 { border-width: 2px; }

/* Border Style */
.border-solid { border-style: solid; }
.border-dashed { border-style: dashed; }
.border-dotted { border-style: dotted; }
.border-none { border-style: none; }

/* Border Sides */
.border-t { border-top-width: 1px; border-top-style: solid; }
.border-r { border-right-width: 1px; border-right-style: solid; }
.border-b { border-bottom-width: 1px; border-bottom-style: solid; }
.border-l { border-left-width: 1px; border-left-style: solid; }

/* Border Radius */
.rounded-none { border-radius: 0; }
.rounded-sm { border-radius: var(--radius-sm); }   /* 4px */
.rounded-md { border-radius: var(--radius-md); }   /* 8px */
.rounded-lg { border-radius: var(--radius-lg); }   /* 12px */
.rounded-xl { border-radius: var(--radius-xl); }   /* 16px */
.rounded-full { border-radius: 9999px; }

/* ========== TYPOGRAPHY UTILITIES ========== */

/* Font Size */
.text-display { font-size: var(--text-display); }           /* 48px */
.text-h1 { font-size: var(--text-h1); }                     /* 36px */
.text-h2 { font-size: var(--text-h2); }                     /* 30px */
.text-h3 { font-size: var(--text-h3); }                     /* 24px */
.text-h4 { font-size: var(--text-h4); }                     /* 20px */
.text-body-large { font-size: var(--text-body-large); }     /* 16px */
.text-body { font-size: var(--text-body); }                 /* 16px */
.text-body-small { font-size: var(--text-body-small); }     /* 14px */
.text-caption { font-size: var(--text-caption); }           /* 12px */
.text-micro { font-size: var(--text-micro); }               /* 10px */

/* Font Weight */
.font-regular { font-weight: var(--weight-regular); }       /* 400 */
.font-medium { font-weight: var(--weight-medium); }         /* 500 */
.font-semibold { font-weight: var(--weight-semibold); }     /* 600 */
.font-bold { font-weight: var(--weight-bold); }             /* 700 */

/* Text Alignment */
.text-left { text-align: left; }
.text-center { text-align: center; }
.text-right { text-align: right; }
.text-justify { text-align: justify; }

/* Text Transform */
.uppercase { text-transform: uppercase; }
.lowercase { text-transform: lowercase; }
.capitalize { text-transform: capitalize; }
.normal-case { text-transform: none; }

/* Text Decoration */
.underline { text-decoration: underline; }
.line-through { text-decoration: line-through; }
.no-underline { text-decoration: none; }

/* Line Height */
.leading-none { line-height: 1; }
.leading-tight { line-height: 1.25; }
.leading-normal { line-height: 1.5; }
.leading-relaxed { line-height: 1.75; }
.leading-loose { line-height: 2; }

/* Text Overflow */
.truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.text-ellipsis { text-overflow: ellipsis; }
.text-clip { text-overflow: clip; }

/* White Space */
.whitespace-normal { white-space: normal; }
.whitespace-nowrap { white-space: nowrap; }
.whitespace-pre { white-space: pre; }
.whitespace-pre-line { white-space: pre-line; }
.whitespace-pre-wrap { white-space: pre-wrap; }

/* Word Break */
.break-normal { word-break: normal; overflow-wrap: normal; }
.break-words { overflow-wrap: break-word; }
.break-all { word-break: break-all; }

/* ========== POSITION UTILITIES ========== */

/* Position */
.static { position: static; }
.fixed { position: fixed; }
.absolute { position: absolute; }
.relative { position: relative; }
.sticky { position: -webkit-sticky; position: sticky; }

/* Top / Right / Bottom / Left */
.inset-0 { top: 0; right: 0; bottom: 0; left: 0; }
.top-0 { top: 0; }
.right-0 { right: 0; }
.bottom-0 { bottom: 0; }
.left-0 { left: 0; }

/* Z-Index */
.z-0 { z-index: 0; }
.z-10 { z-index: 10; }
.z-20 { z-index: 20; }
.z-30 { z-index: 30; }
.z-40 { z-index: 40; }
.z-50 { z-index: 50; }
.z-auto { z-index: auto; }

/* ========== OVERFLOW UTILITIES ========== */

.overflow-auto { overflow: auto; }
.overflow-hidden { overflow: hidden; }
.overflow-visible { overflow: visible; }
.overflow-scroll { overflow: scroll; }
.overflow-x-auto { overflow-x: auto; }
.overflow-y-auto { overflow-y: auto; }
.overflow-x-hidden { overflow-x: hidden; }
.overflow-y-hidden { overflow-y: hidden; }

/* ========== SHADOW UTILITIES ========== */

.shadow-none { box-shadow: none; }
.shadow-sm { box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05); }
.shadow { box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06); }
.shadow-md { box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); }
.shadow-lg { box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); }
.shadow-xl { box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); }

/* ========== CURSOR UTILITIES ========== */

.cursor-auto { cursor: auto; }
.cursor-pointer { cursor: pointer; }
.cursor-not-allowed { cursor: not-allowed; }
.cursor-default { cursor: default; }
.cursor-move { cursor: move; }
.cursor-text { cursor: text; }

/* ========== POINTER EVENTS ========== */

.pointer-events-none { pointer-events: none; }
.pointer-events-auto { pointer-events: auto; }

/* ========== OPACITY UTILITIES ========== */

.opacity-0 { opacity: 0; }
.opacity-25 { opacity: 0.25; }
.opacity-50 { opacity: 0.5; }
.opacity-75 { opacity: 0.75; }
.opacity-100 { opacity: 1; }

/* ========== COMMON PATTERN UTILITIES ========== */

/* Card Pattern */
.card {
  background-color: white;
  border: 1px solid var(--material-silver);
  border-radius: var(--radius-md);
  padding: var(--space-lg);
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
}

.card-compact {
  background-color: white;
  border: 1px solid var(--material-silver);
  border-radius: var(--radius-md);
  padding: var(--space-md);
}

/* Container Pattern */
.container {
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--space-xl);
  padding-right: var(--space-xl);
}

.container-fluid {
  width: 100%;
  padding-left: var(--space-xl);
  padding-right: var(--space-xl);
}

/* Section Pattern */
.section {
  padding-top: var(--space-2xl);
  padding-bottom: var(--space-2xl);
}

/* Divider Pattern */
.divider {
  height: 1px;
  background-color: var(--material-silver);
  margin-top: var(--space-lg);
  margin-bottom: var(--space-lg);
}

.divider-vertical {
  width: 1px;
  background-color: var(--material-silver);
  margin-left: var(--space-lg);
  margin-right: var(--space-lg);
}

/* ========== INTERACTION STATES ========== */

.hover-bg-gray-50:hover { background-color: #F9FAFB; }
.hover-bg-gray-100:hover { background-color: #F3F4F6; }
.hover-bg-proq-blue:hover { background-color: #1269FF; }
.hover-text-proq-blue:hover { color: #1269FF; }
.hover-opacity-75:hover { opacity: 0.75; }
.hover-opacity-100:hover { opacity: 1; }

/* ========== TRANSITION UTILITIES ========== */

.transition { transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; }
.transition-colors { transition-property: color, background-color, border-color; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; }
.transition-opacity { transition-property: opacity; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; }
.transition-transform { transition-property: transform; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; }

.duration-100 { transition-duration: 100ms; }
.duration-150 { transition-duration: 150ms; }
.duration-200 { transition-duration: 200ms; }
.duration-300 { transition-duration: 300ms; }
.duration-500 { transition-duration: 500ms; }

/* ========== PREVIEW HEADER STYLES (Contract, RFQ, Order, Quotation) ========== */

.preview-header {
  padding: 6px 10px;
  border-bottom: 1px solid #D1D5DB;
  background-color: white;
  width: 100%;
  max-width: 100%;
}

.preview-header-row {
  margin-bottom: 8px;
}

.preview-header-title {
  font-size: 17px !important;
  line-height: 1.2 !important;
  margin-bottom: 4px !important;
  font-weight: 600 !important;
  word-break: break-word !important;
}

.preview-header-id {
  font-size: 12px !important;
  color: #6B7280 !important;
  word-break: break-word !important;
}

.preview-header-meta {
  font-size: 12px !important;
  color: #6B7280 !important;
}

.preview-header-status-badge {
  font-weight: 600 !important;
  text-transform: uppercase !important;
}

/* Version Button - Blue border */
.preview-btn-version {
  color: #1269FF !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  padding: 4px 10px !important;
  height: 28px !important;
  border: 1px solid #1269FF !important;
  border-radius: 4px !important;
  background-color: transparent !important;
}

.preview-btn-version:hover {
  background-color: rgba(18, 105, 255, 0.05) !important;
}

/* Edit Icon Button - Gray border */
.preview-btn-edit {
  color: #1269FF !important;
  border: 1px solid #E5E7EB !important;
  border-radius: 4px !important;
  width: 28px !important;
  height: 28px !important;
}

.preview-btn-edit:hover {
  background-color: rgba(18, 105, 255, 0.05) !important;
  border-color: #1269FF !important;
}

/* Actions Button - Blue filled */
.preview-btn-actions {
  background-color: #1269FF !important;
  height: 28px !important;
  padding: 4px 12px !important;
}

.preview-btn-actions:hover {
  background-color: #0052CC !important;
}

/* Action buttons container */
.preview-action-buttons {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

/* ========== WORKFLOW TIMELINE COMPONENT ========== */

/* Container Card */
.wf-timeline-container {
  background: #FFFFFF;
  border: 1px solid #E9ECEF;
  border-radius: 16px;
  padding: 24px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

.wf-timeline-title {
  font-size: 14px;
  font-weight: 600;
  color: #212529;
  margin-bottom: 24px;
}

/* Timeline Container */
.wf-timeline {
  display: flex;
  flex-direction: column;
}

/* Step Row */
.wf-step-row {
  position: relative;
  padding-bottom: 16px;
}

.wf-step-row:last-child {
  padding-bottom: 0;
}

.wf-step-content {
  display: flex;
  gap: 16px;
  align-items: flex-start;
}

/* Main Step Indicators (32px) */
.wf-step-indicator {
  width: 32px;
  height: 32px;
  min-width: 32px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  font-weight: 600;
  flex-shrink: 0;
  position: relative;
  z-index: 2;
}

.wf-step-indicator-completed {
  background-color: #00CD77;
  color: white;
  box-shadow: 0 4px 12px rgba(0, 205, 119, 0.3);
}

.wf-step-indicator-in-progress {
  background-color: #F59E0B;
  color: white;
  box-shadow: 0 4px 12px rgba(245, 158, 11, 0.3);
}

.wf-step-indicator-pending {
  background-color: #F1F3F5;
  color: #ADB5BD;
  border: 2px solid #DEE2E6;
}

/* Pulse ring animation for in-progress indicator */
.wf-pulse-ring {
  position: relative;
}

.wf-pulse-ring::before {
  content: '';
  position: absolute;
  inset: -4px;
  border-radius: 50%;
  border: 2px solid #F59E0B;
  animation: wfPulseRingAnim 2s ease-out infinite;
}

@keyframes wfPulseRingAnim {
  0% {
    transform: scale(0.95);
    opacity: 1;
  }
  100% {
    transform: scale(1.3);
    opacity: 0;
  }
}

/* Connector Lines */
.wf-connector {
  position: absolute;
  left: 15px; /* Center of 32px indicator: (32px / 2) - (2px line width / 2) = 15px */
  top: 32px;
  width: 2px;
  z-index: 1;
}

.wf-connector-completed {
  background-color: #00CD77;
}

.wf-connector-in-progress {
  background-color: #E9ECEF;
}

.wf-connector-pending {
  background-color: #E9ECEF;
}

/* Step Body (content area) */
.wf-step-body {
  flex: 1 1;
  min-width: 0;
  padding-top: 4px;
}

.wf-step-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
}

.wf-step-info {
  flex: 1 1;
  min-width: 0;
}

.wf-step-label {
  font-size: 14px;
  font-weight: 600;
  color: #212529;
  margin: 0;
  line-height: 1.4;
}

.wf-step-subtitle {
  font-size: 12px;
  font-weight: 400;
  color: #6C757D;
  margin: 2px 0 0 0;
  line-height: 1.4;
}

.wf-step-completed-time {
  font-size: 11px;
  font-weight: 400;
  color: #00CD77;
  margin: 2px 0 0 0;
  line-height: 1.3;
}

.wf-step-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

/* Completed Check Icon (right side) */
.wf-completed-check {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: #00CD77;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

/* Assignee Row */
.wf-assignee-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 8px;
}

.wf-assignee-name {
  font-size: 14px;
  font-weight: 400;
  color: #495057;
}

/* Status Badges */
.wf-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: 9999px;
  font-size: 12px;
  font-weight: 500;
  white-space: nowrap;
}

.wf-badge-approved {
  background-color: #E6F9F2;
  color: #00824D;
}

.wf-badge-in-progress {
  background-color: #FEF3C7;
  color: #D97706;
  border: 1px solid rgba(245, 158, 11, 0.2);
}

.wf-badge-pending {
  background-color: #F1F3F5;
  color: #6C757D;
}

.wf-badge-rejected {
  background-color: #FEE2E2;
  color: #DC2626;
}

/* Status Dot */
.wf-status-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  flex-shrink: 0;
}

.wf-status-dot-approved {
  background-color: #00CD77;
}

.wf-status-dot-in-progress {
  background-color: #F59E0B;
  animation: wfPulseDot 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

.wf-status-dot-pending {
  background-color: #ADB5BD;
}

.wf-status-dot-rejected {
  background-color: #EF4444;
}

@keyframes wfPulseDot {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0.5;
  }
}

/* Nested Approval Sub-Levels */
.wf-approval-levels-container {
  margin-left: 8px;
  padding-left: 16px;
  margin-top: 16px;
  position: relative;
}

.wf-sub-level-row {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding-bottom: 16px;
  position: relative;
  margin-left: -16px;
  padding-left: 16px;
  border-left: 2px solid rgba(245, 158, 11, 0.4);
}

/* Remove the border from the last sub-level row - line stops at indicator center */
.wf-sub-level-row:last-child {
  border-left-color: transparent;
  padding-bottom: 0;
}

/* Sub-Level Indicators (14px) */
.wf-sub-level-indicator {
  width: 14px;
  height: 14px;
  min-width: 14px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 8px;
  font-weight: 600;
  flex-shrink: 0;
  margin-left: -25px; /* Position on top of the border line */
}

.wf-sub-level-indicator-approved {
  background-color: #00CD77;
  color: white;
}

.wf-sub-level-indicator-in-progress {
  background-color: #F59E0B;
  color: white;
}

.wf-sub-level-indicator-pending {
  background-color: #F1F3F5;
  color: #6C757D;
  border: 1px solid #DEE2E6;
}

.wf-sub-level-indicator-rejected {
  background-color: #EF4444;
  color: white;
}

/* Sub-Level Body */
.wf-sub-level-body {
  flex: 1 1;
  min-width: 0;
}

.wf-sub-level-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}

.wf-sub-level-name {
  font-size: 14px;
  font-weight: 500;
  color: #343A40;
  margin: 0;
}

/* Pending sub-levels have reduced opacity */
.wf-sub-level-pending {
  opacity: 0.6;
}

/* Avatar Styles */
.wf-avatar {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  font-weight: 600;
  flex-shrink: 0;
}

.wf-avatar-main {
  width: 24px;
  height: 24px;
  font-size: 10px;
}

.wf-avatar-sub {
  width: 20px;
  height: 20px;
  font-size: 9px;
}

/* Avatar with status ring */
.wf-avatar-ring {
  border-radius: 50%;
  display: inline-flex;
}

.wf-avatar-ring-main {
  padding: 2px;
  border: 2px solid;
}

.wf-avatar-ring-sub {
  padding: 1px;
  border: 1px solid;
}

.wf-avatar-ring-completed {
  border-color: #B3EBDA;
}

.wf-avatar-ring-in-progress {
  border-color: rgba(245, 158, 11, 0.3);
}

.wf-avatar-ring-pending {
  border-color: #E9ECEF;
}

/* Avatar Group (for multiple approvers) */
.wf-avatar-group {
  display: flex;
  align-items: center;
  margin-top: 6px;
}

.wf-avatar-group-item {
  margin-left: -6px;
  position: relative;
}

.wf-avatar-group-item:first-child {
  margin-left: 0;
}

.wf-approver-names {
  font-size: 12px;
  font-weight: 400;
  color: #6C757D;
  margin-left: 8px;
}

.wf-more-approvers {
  font-size: 11px;
  color: #6C757D;
  margin-left: 4px;
}

/* Reduced motion preference */
@media (prefers-reduced-motion: reduce) {
  .wf-pulse-ring::before {
    animation: none;
  }

  .wf-status-dot-in-progress {
    animation: none;
  }
}

/* Mobile Responsive Styles */
@media (max-width: 480px) {
  .wf-timeline-title {
    font-size: 13px;
  }

  .wf-step-indicator {
    width: 28px;
    height: 28px;
    min-width: 28px;
    font-size: 11px;
  }

  .wf-step-content {
    gap: 12px;
  }

  .wf-step-label {
    font-size: 13px;
  }

  .wf-step-subtitle,
  .wf-step-completed-time {
    font-size: 10px;
  }

  .wf-connector {
    left: 13px;
    top: 28px;
  }

  .wf-sub-level-indicator {
    width: 12px;
    height: 12px;
    min-width: 12px;
    font-size: 7px;
  }

  .wf-avatar-main {
    width: 20px;
    height: 20px;
    font-size: 8px;
  }

  .wf-avatar-sub {
    width: 18px;
    height: 18px;
    font-size: 8px;
  }

  .wf-assignee-name,
  .wf-approver-names {
    font-size: 11px;
  }

  .wf-sub-level-name {
    font-size: 12px;
  }

  .wf-badge {
    font-size: 10px;
    padding: 2px 6px;
  }
}


/*!*************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/app/globals.css ***!
  \*************************************************************************************************************************************************************************************************************************************************************************/
/* Import WeFab design system global styles */

/* Prevent double scrollbars - only layout content should scroll */
html, body {
  overflow: hidden !important;
  height: 100% !important;
  margin: 0;
  padding: 0;
}

/* Also prevent Next.js root element from scrolling */
#__next {
  height: 100%;
  overflow: hidden;
}

/* ProQSmart Button Colors - Filled variant */
.mantine-Button-root[data-variant="filled"]:not([data-loading]) {
  background-color: #1269FF !important;
  border-color: #1269FF !important;
  color: white !important;
}

.mantine-Button-root[data-variant="filled"]:not([data-loading]) .mantine-Button-label,
.mantine-Button-root[data-variant="filled"]:not([data-loading]) .mantine-Button-inner {
  color: white !important;
}

.mantine-Button-root[data-variant="filled"]:hover:not(:disabled):not([data-loading]) {
  background-color: #0D52CC !important;
  border-color: #0D52CC !important;
}

.mantine-Button-root[data-variant="filled"]:active:not(:disabled):not([data-loading]) {
  background-color: #0A42A8 !important;
  border-color: #0A42A8 !important;
}

/* Loading state - keep visible */
.mantine-Button-root[data-variant="filled"][data-loading] {
  background-color: #1269FF !important;
  border-color: #1269FF !important;
  opacity: 1 !important;
}

/* ProQSmart Button Colors - Outline variant */
.mantine-Button-root[data-variant="outline"]:not([data-loading]) {
  border-color: #1269FF !important;
  color: #1269FF !important;
  background-color: transparent !important;
}

.mantine-Button-root[data-variant="outline"]:not([data-loading]) .mantine-Button-label,
.mantine-Button-root[data-variant="outline"]:not([data-loading]) .mantine-Button-inner {
  color: #1269FF !important;
}

.mantine-Button-root[data-variant="outline"]:hover:not(:disabled):not([data-loading]) {
  background-color: #1269FF !important;
  color: white !important;
}

.mantine-Button-root[data-variant="outline"]:hover:not(:disabled):not([data-loading]) .mantine-Button-label,
.mantine-Button-root[data-variant="outline"]:hover:not(:disabled):not([data-loading]) .mantine-Button-inner {
  color: white !important;
}

.mantine-Button-root[data-variant="outline"]:active:not(:disabled):not([data-loading]) {
  background-color: #0D52CC !important;
  border-color: #0D52CC !important;
}

/* Sidebar compact styling for ProQSmart */
.wefab-sidebar {
  width: 220px !important; /* Reduced from default 260px */
  min-width: 220px !important;
  max-width: 220px !important;
  height: 100% !important;
  max-height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}

.wefab-sidebar__nav {
  flex: 1 1 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}

.wefab-sidebar__bottom {
  flex-shrink: 0 !important;
  margin-top: auto !important;
}

.wefab-sidebar--collapsed {
  width: 60px !important;
  min-width: 60px !important;
  max-width: 60px !important;
}

.wefab-sidebar--expanded .wefab-sidebar__nav {
  padding: 0.25rem 0.5rem !important; /* Reduced horizontal padding */
}

.wefab-sidebar--collapsed .wefab-sidebar__nav {
  padding: 0.25rem 0.25rem !important;
}

.wefab-sidebar__item {
  margin-bottom: 0.125rem !important;
  padding: 6px 10px !important; /* Reduced from 6px 12px */
}

.wefab-sidebar__item--child {
  padding-left: 28px !important; /* Reduced from 32px */
}

.wefab-sidebar__bottom {
  padding: 0.5rem 0.5rem !important; /* Reduced horizontal padding */
}

/* Company name card styling - make text wrap properly */
.wefab-sidebar--proqsmart .wefab-sidebar__bottom > div:first-child {
  padding: 6px 10px !important; /* Reduced padding */
}

.wefab-sidebar--proqsmart .wefab-sidebar__bottom > div:first-child > span {
  white-space: normal !important; /* Allow wrapping */
  word-break: break-word !important;
  line-height: 1.2 !important;
}

/* ProQSmart ScrollArea Styles */
.wefab-scroll-area--proqsmart .mantine-ScrollArea-scrollbar .mantine-ScrollArea-thumb {
  background-color: #1269FF !important;
}

.wefab-scroll-area--proqsmart .mantine-ScrollArea-scrollbar:hover .mantine-ScrollArea-thumb {
  background-color: #0D52CC !important;
  opacity: 0.9 !important;
}

.wefab-scroll-area--proqsmart .mantine-ScrollArea-scrollbar {
  background-color: rgba(18, 105, 255, 0.1) !important;
}

/* ProQSmart Native Scrollbar Styles (WebKit) */
.wefab-scroll-area--proqsmart::-webkit-scrollbar {
  height: 8px;
  width: 8px;
}

.wefab-scroll-area--proqsmart::-webkit-scrollbar-track {
  background-color: rgba(18, 105, 255, 0.05);
  border-radius: 4px;
}

.wefab-scroll-area--proqsmart::-webkit-scrollbar-thumb {
  background-color: rgba(18, 105, 255, 0.3);
  border-radius: 4px;
}

.wefab-scroll-area--proqsmart::-webkit-scrollbar-thumb:hover {
  background-color: rgba(18, 105, 255, 0.5);
}

/* ProQSmart Native Scrollbar Styles (Firefox) */
.wefab-scroll-area--proqsmart {
  scrollbar-width: thin;
  scrollbar-color: rgba(18, 105, 255, 0.3) rgba(18, 105, 255, 0.05);
}

/* TreeTable Chevron Button - Remove focus border */
.tree-chevron-button.mantine-focus-auto,
.tree-chevron-button.mantine-UnstyledButton-root {
  outline: none !important;
  box-shadow: none !important;
  border: none !important;
}

.tree-chevron-button.mantine-focus-auto:focus,
.tree-chevron-button.mantine-UnstyledButton-root:focus,
.tree-chevron-button.mantine-focus-auto:focus-visible,
.tree-chevron-button.mantine-UnstyledButton-root:focus-visible,
.tree-chevron-button.mantine-focus-auto:active,
.tree-chevron-button.mantine-UnstyledButton-root:active {
  outline: none !important;
  box-shadow: none !important;
  border: none !important;
}

/* Badge Styles */
.wefab-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 500;
  border-radius: 4px;
  white-space: nowrap;
  line-height: 1;
}

/* Badge Sizes */
.wefab-badge--xs {
  padding: 2px 6px;
  font-size: 10px;
}

.wefab-badge--sm {
  padding: 4px 8px;
  font-size: 11px;
}

.wefab-badge--md {
  padding: 6px 12px;
  font-size: 12px;
}

.wefab-badge--lg {
  padding: 8px 16px;
  font-size: 14px;
}

/* Badge Variants - Blue */
.wefab-badge--filled.wefab-badge--blue {
  background-color: #1269FF;
  color: white;
}

.wefab-badge--light.wefab-badge--blue {
  background-color: #DBEAFE;
  color: #1E40AF;
}

.wefab-badge--outline.wefab-badge--blue {
  background-color: transparent;
  color: #1269FF;
  border: 1px solid #1269FF;
}

/* Badge Variants - Green */
.wefab-badge--filled.wefab-badge--green {
  background-color: #10B981;
  color: white;
}

.wefab-badge--light.wefab-badge--green {
  background-color: #D1FAE5;
  color: #059669;
}

.wefab-badge--outline.wefab-badge--green {
  background-color: transparent;
  color: #10B981;
  border: 1px solid #10B981;
}

/* Badge Variants - Orange */
.wefab-badge--filled.wefab-badge--orange {
  background-color: #F59E0B;
  color: white;
}

.wefab-badge--light.wefab-badge--orange {
  background-color: #FEF3C7;
  color: #B45309;
}

.wefab-badge--outline.wefab-badge--orange {
  background-color: transparent;
  color: #F59E0B;
  border: 1px solid #F59E0B;
}

/* Badge Variants - Red */
.wefab-badge--filled.wefab-badge--red {
  background-color: #EF4444;
  color: white;
}

.wefab-badge--light.wefab-badge--red {
  background-color: #FEE2E2;
  color: #DC2626;
}

.wefab-badge--outline.wefab-badge--red {
  background-color: transparent;
  color: #EF4444;
  border: 1px solid #EF4444;
}

/* Badge Variants - Gray */
.wefab-badge--filled.wefab-badge--gray {
  background-color: #6B7280;
  color: white;
}

.wefab-badge--light.wefab-badge--gray {
  background-color: #F3F4F6;
  color: #374151;
}

.wefab-badge--outline.wefab-badge--gray {
  background-color: transparent;
  color: #6B7280;
  border: 1px solid #6B7280;
}

/* Badge Variants - Yellow */
.wefab-badge--filled.wefab-badge--yellow {
  background-color: #FBBF24;
  color: #78350F;
}

.wefab-badge--light.wefab-badge--yellow {
  background-color: #FEF3C7;
  color: #92400E;
}

.wefab-badge--outline.wefab-badge--yellow {
  background-color: transparent;
  color: #FBBF24;
  border: 1px solid #FBBF24;
}