UNPKG

@mantine/core

Version:

React components library focused on usability, accessibility and developer experience

1,350 lines (1,202 loc) 229 kB
@layer mantine {/* ----- 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; -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']) { padding-inline-end: var(--scrollarea-scrollbar-size); padding-inline-start: unset; } .m_c0783ff9:where([data-scrollbars='xy'], [data-scrollbars='x']):where([data-offset-scrollbars='xy'], [data-offset-scrollbars='x']) { padding-bottom: var(--scrollarea-scrollbar-size); } .m_f8f631dd { min-width: 100%; display: table; } .m_c44ba933 { 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; 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; 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); } :where([data-mantine-color-scheme='light']) .m_1b7284a3:where([data-with-border]) { border: calc(0.0625rem * var(--mantine-scale)) solid var(--mantine-color-gray-3); } :where([data-mantine-color-scheme='dark']) .m_1b7284a3:where([data-with-border]) { border: calc(0.0625rem * var(--mantine-scale)) solid var(--mantine-color-dark-4); } .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_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; 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; 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; 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_9814e45f { inset: 0; position: absolute; background: var(--overlay-bg, rgba(0, 0, 0, 0.6)); backdrop-filter: var(--overlay-filter); -webkit-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_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)); padding-inline-end: calc(var(--mb-padding, var(--mantine-spacing-md)) - calc(0.3125rem * var(--mantine-scale))); position: sticky; top: 0; background-color: var(--mantine-color-body); z-index: 1000; min-height: calc(3.75rem * var(--mantine-scale)); transition: padding-inline-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; } .m_fd1ab0aa:has([data-mantine-scrollbar][data-state='visible']) .m_b5489c3c { padding-inline-end: calc(var(--mb-padding, var(--mantine-spacing-md)) + calc(0.3125rem * var(--mantine-scale))); } .m_606cb269 { 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(--man