@charset "UTF-8";
/* http://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

body {
  line-height: 1.5;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: "";
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

* {
  box-sizing: border-box;
}

strong {
  font-weight: bold;
}

a {
  text-underline-offset: 2px;
}

body, input, textarea, button {
  font-family: "Noto Sans", "Noto Sans KR", "Noto Sans JP", "Arial", sans-serif;
}

:root {
  --font-size: 13px;
  --font-size-input: 13px;
  --font-size-button: 13px;
}

body {
  font-size: var(--font-size);
}

input {
  font-size: var(--font-size-input);
  padding-top: 2px;
}

button {
  font-size: var(--font-size-button);
}

textarea {
  font-size: var(--font-size-input);
}

:root {
  --white: #ffffff;
  --black: #000000;
  --gray-100: #FAFAFA;
  --gray-200: #EAEAEA;
  --gray-300: #CCCCCC;
  --gray-400: #A9A9A9;
  --gray-500: #666666;
  --gray-600: #555555;
  --gray-700: #444444;
  --gray-800: #292929;
  --primary-100: #EAF1FE;
  --primary-200: #DDEEFF;
  --primary-300: #B7D2FA;
  --primary-400: #A4B4FF;
  --primary-500: #5672EF;
  --primary-600: #232E8F;
  --blue: #5672EF;
  --blue-bg: #DDEEFF;
  --red: #EB0000;
  --red-bg: #FFE3E2;
  --orange: #F99341;
  --orange-bg: #FFF8DE;
  --green: #2FA04D;
  --green-bg: #E9FEE7;
  --purple: #945BD9;
  --purple-bg: #EAD8FF;
  --gray-bg: #EAEAEA;
  --color-text: #555555;
  --color-text-light: #A9A9A9;
  --color-gray: #666666;
  --color-gray-border: #CCCCCC;
  --color-icon-light: #D5D5D5;
  --border: #CCCCCC;
  --border-light: #EAEAEA;
  --color-hover: #E8EEFC;
  --color-focus: #5672EF;
  --color-error: #EB0000;
  --primary: #5672EF;
  --secondary: #F99341;
  --success: #2FA04D;
  --info: #5672EF;
  --warning: #F99341;
  --danger: #EB0000;
  --light: #FAFAFA;
  --dark: #444444;
  --gray: #A9A9A9;
  --border-width: 1px;
  --border-radius: 0.25rem;
  --border-radius-lg: 0.3rem;
  --border-radius-sm: 0.2rem;
  --rounded-pill: 50rem;
  --rounded-circle: 50%;
  --border-input: 0.8px solid #EAEAEA;
  --icon-font-family: Material Symbols Outlined, monospace;
}

:root {
  --header-bg: #5672EF;
  --header-text: #ffffff;
  --body-bg: #ffffff;
  --body-text: #000000;
  --button-default-bg: #ffffff;
  --button-default-text: #555555;
  --header-tab-bg: #A4B4FF;
  --header-tab-selected: #ffffff;
  --header-tab-text: #555555;
  --border: #CCCCCC;
  --border-light: #EAEAEA;
  --border-hover: #000000;
  --color-hover: #E8EEFC;
  --colored-bg: #EAF1FE;
  --radio-group: #A9A9A9;
  --gray-100: #FAFAFA;
  --gray-200: #EAEAEA;
  --gray-400: #A9A9A9;
  --gray-500: #666666;
  --primary-100: #EAF1FE;
  --primary-200: #DDEEFF;
  --primary-300: #B7D2FA;
}

[data-theme=dark] {
  --header-bg: #26282a;
  --header-text: #EAEAEA;
  --body-bg: #1c1d1f;
  --body-text: #CCCCCC;
  --button-default-bg: tranperant;
  --button-default-text: #CCCCCC;
  --header-tab-bg: #3b3d41;
  --header-tab-selected: #1c1d1f;
  --header-tab-text: #ffffff;
  --border: #444444;
  --border-light: #555555;
  --border-hover: #555555;
  --color-hover: #444444;
  --colored-bg: #414244;
  --radio-group: #555555;
  --gray-100: #292929;
  --gray-200: #444444;
  --gray-400: #666666;
  --gray-500: #A9A9A9;
  --primary-100: #232E8F;
  --primary-200: #232E8F;
  --primary-300: #5672EF;
}

.w-0 {
  width: 0px !important;
}

.h-0 {
  height: 0px !important;
}

.w-1 {
  width: 1px !important;
}

.h-1 {
  height: 1px !important;
}

.w-2 {
  width: 2px !important;
}

.h-2 {
  height: 2px !important;
}

.w-3 {
  width: 3px !important;
}

.h-3 {
  height: 3px !important;
}

.w-4 {
  width: 4px !important;
}

.h-4 {
  height: 4px !important;
}

.w-5 {
  width: 5px !important;
}

.h-5 {
  height: 5px !important;
}

.w-6 {
  width: 6px !important;
}

.h-6 {
  height: 6px !important;
}

.w-7 {
  width: 7px !important;
}

.h-7 {
  height: 7px !important;
}

.w-8 {
  width: 8px !important;
}

.h-8 {
  height: 8px !important;
}

.w-9 {
  width: 9px !important;
}

.h-9 {
  height: 9px !important;
}

.w-10 {
  width: 10px !important;
}

.h-10 {
  height: 10px !important;
}

.w-11 {
  width: 11px !important;
}

.h-11 {
  height: 11px !important;
}

.w-12 {
  width: 12px !important;
}

.h-12 {
  height: 12px !important;
}

.w-13 {
  width: 13px !important;
}

.h-13 {
  height: 13px !important;
}

.w-14 {
  width: 14px !important;
}

.h-14 {
  height: 14px !important;
}

.w-15 {
  width: 15px !important;
}

.h-15 {
  height: 15px !important;
}

.w-16 {
  width: 16px !important;
}

.h-16 {
  height: 16px !important;
}

.w-17 {
  width: 17px !important;
}

.h-17 {
  height: 17px !important;
}

.w-18 {
  width: 18px !important;
}

.h-18 {
  height: 18px !important;
}

.w-19 {
  width: 19px !important;
}

.h-19 {
  height: 19px !important;
}

.w-20 {
  width: 20px !important;
}

.h-20 {
  height: 20px !important;
}

.w-21 {
  width: 21px !important;
}

.h-21 {
  height: 21px !important;
}

.w-22 {
  width: 22px !important;
}

.h-22 {
  height: 22px !important;
}

.w-23 {
  width: 23px !important;
}

.h-23 {
  height: 23px !important;
}

.w-24 {
  width: 24px !important;
}

.h-24 {
  height: 24px !important;
}

.w-25 {
  width: 25px !important;
}

.h-25 {
  height: 25px !important;
}

.w-26 {
  width: 26px !important;
}

.h-26 {
  height: 26px !important;
}

.w-27 {
  width: 27px !important;
}

.h-27 {
  height: 27px !important;
}

.w-28 {
  width: 28px !important;
}

.h-28 {
  height: 28px !important;
}

.w-29 {
  width: 29px !important;
}

.h-29 {
  height: 29px !important;
}

.w-30 {
  width: 30px !important;
}

.h-30 {
  height: 30px !important;
}

.w-31 {
  width: 31px !important;
}

.h-31 {
  height: 31px !important;
}

.w-32 {
  width: 32px !important;
}

.h-32 {
  height: 32px !important;
}

.w-33 {
  width: 33px !important;
}

.h-33 {
  height: 33px !important;
}

.w-34 {
  width: 34px !important;
}

.h-34 {
  height: 34px !important;
}

.w-35 {
  width: 35px !important;
}

.h-35 {
  height: 35px !important;
}

.w-36 {
  width: 36px !important;
}

.h-36 {
  height: 36px !important;
}

.w-37 {
  width: 37px !important;
}

.h-37 {
  height: 37px !important;
}

.w-38 {
  width: 38px !important;
}

.h-38 {
  height: 38px !important;
}

.w-39 {
  width: 39px !important;
}

.h-39 {
  height: 39px !important;
}

.w-40 {
  width: 40px !important;
}

.h-40 {
  height: 40px !important;
}

.w-41 {
  width: 41px !important;
}

.h-41 {
  height: 41px !important;
}

.w-42 {
  width: 42px !important;
}

.h-42 {
  height: 42px !important;
}

.w-43 {
  width: 43px !important;
}

.h-43 {
  height: 43px !important;
}

.w-44 {
  width: 44px !important;
}

.h-44 {
  height: 44px !important;
}

.w-45 {
  width: 45px !important;
}

.h-45 {
  height: 45px !important;
}

.w-46 {
  width: 46px !important;
}

.h-46 {
  height: 46px !important;
}

.w-47 {
  width: 47px !important;
}

.h-47 {
  height: 47px !important;
}

.w-48 {
  width: 48px !important;
}

.h-48 {
  height: 48px !important;
}

.w-49 {
  width: 49px !important;
}

.h-49 {
  height: 49px !important;
}

.w-50 {
  width: 50px !important;
}

.h-50 {
  height: 50px !important;
}

.w-51 {
  width: 51px !important;
}

.h-51 {
  height: 51px !important;
}

.w-52 {
  width: 52px !important;
}

.h-52 {
  height: 52px !important;
}

.w-53 {
  width: 53px !important;
}

.h-53 {
  height: 53px !important;
}

.w-54 {
  width: 54px !important;
}

.h-54 {
  height: 54px !important;
}

.w-55 {
  width: 55px !important;
}

.h-55 {
  height: 55px !important;
}

.w-56 {
  width: 56px !important;
}

.h-56 {
  height: 56px !important;
}

.w-57 {
  width: 57px !important;
}

.h-57 {
  height: 57px !important;
}

.w-58 {
  width: 58px !important;
}

.h-58 {
  height: 58px !important;
}

.w-59 {
  width: 59px !important;
}

.h-59 {
  height: 59px !important;
}

.w-60 {
  width: 60px !important;
}

.h-60 {
  height: 60px !important;
}

.w-61 {
  width: 61px !important;
}

.h-61 {
  height: 61px !important;
}

.w-62 {
  width: 62px !important;
}

.h-62 {
  height: 62px !important;
}

.w-63 {
  width: 63px !important;
}

.h-63 {
  height: 63px !important;
}

.w-64 {
  width: 64px !important;
}

.h-64 {
  height: 64px !important;
}

.w-72 {
  width: 72px !important;
}

.h-72 {
  height: 72px !important;
}

.w-80 {
  width: 80px !important;
}

.h-80 {
  height: 80px !important;
}

.w-88 {
  width: 88px !important;
}

.h-88 {
  height: 88px !important;
}

.w-96 {
  width: 96px !important;
}

.h-96 {
  height: 96px !important;
}

.w-104 {
  width: 104px !important;
}

.h-104 {
  height: 104px !important;
}

.w-112 {
  width: 112px !important;
}

.h-112 {
  height: 112px !important;
}

.w-120 {
  width: 120px !important;
}

.h-120 {
  height: 120px !important;
}

.w-128 {
  width: 128px !important;
}

.h-128 {
  height: 128px !important;
}

.w-136 {
  width: 136px !important;
}

.h-136 {
  height: 136px !important;
}

.w-144 {
  width: 144px !important;
}

.h-144 {
  height: 144px !important;
}

.w-152 {
  width: 152px !important;
}

.h-152 {
  height: 152px !important;
}

.w-160 {
  width: 160px !important;
}

.h-160 {
  height: 160px !important;
}

.w-168 {
  width: 168px !important;
}

.h-168 {
  height: 168px !important;
}

.w-176 {
  width: 176px !important;
}

.h-176 {
  height: 176px !important;
}

.w-184 {
  width: 184px !important;
}

.h-184 {
  height: 184px !important;
}

.w-192 {
  width: 192px !important;
}

.h-192 {
  height: 192px !important;
}

.w-200 {
  width: 200px !important;
}

.h-200 {
  height: 200px !important;
}

.w-208 {
  width: 208px !important;
}

.h-208 {
  height: 208px !important;
}

.w-216 {
  width: 216px !important;
}

.h-216 {
  height: 216px !important;
}

.w-224 {
  width: 224px !important;
}

.h-224 {
  height: 224px !important;
}

.w-232 {
  width: 232px !important;
}

.h-232 {
  height: 232px !important;
}

.w-240 {
  width: 240px !important;
}

.h-240 {
  height: 240px !important;
}

.w-248 {
  width: 248px !important;
}

.h-248 {
  height: 248px !important;
}

.w-256 {
  width: 256px !important;
}

.h-256 {
  height: 256px !important;
}

.w-264 {
  width: 264px !important;
}

.h-264 {
  height: 264px !important;
}

.w-272 {
  width: 272px !important;
}

.h-272 {
  height: 272px !important;
}

.w-280 {
  width: 280px !important;
}

.h-280 {
  height: 280px !important;
}

.w-288 {
  width: 288px !important;
}

.h-288 {
  height: 288px !important;
}

.w-296 {
  width: 296px !important;
}

.h-296 {
  height: 296px !important;
}

.w-304 {
  width: 304px !important;
}

.h-304 {
  height: 304px !important;
}

.w-312 {
  width: 312px !important;
}

.h-312 {
  height: 312px !important;
}

.w-320 {
  width: 320px !important;
}

.h-320 {
  height: 320px !important;
}

.w-328 {
  width: 328px !important;
}

.h-328 {
  height: 328px !important;
}

.w-336 {
  width: 336px !important;
}

.h-336 {
  height: 336px !important;
}

.w-344 {
  width: 344px !important;
}

.h-344 {
  height: 344px !important;
}

.w-352 {
  width: 352px !important;
}

.h-352 {
  height: 352px !important;
}

.w-360 {
  width: 360px !important;
}

.h-360 {
  height: 360px !important;
}

.w-368 {
  width: 368px !important;
}

.h-368 {
  height: 368px !important;
}

.w-376 {
  width: 376px !important;
}

.h-376 {
  height: 376px !important;
}

.w-384 {
  width: 384px !important;
}

.h-384 {
  height: 384px !important;
}

.w-392 {
  width: 392px !important;
}

.h-392 {
  height: 392px !important;
}

.w-400 {
  width: 400px !important;
}

.h-400 {
  height: 400px !important;
}

.w-408 {
  width: 408px !important;
}

.h-408 {
  height: 408px !important;
}

.w-416 {
  width: 416px !important;
}

.h-416 {
  height: 416px !important;
}

.w-424 {
  width: 424px !important;
}

.h-424 {
  height: 424px !important;
}

.w-432 {
  width: 432px !important;
}

.h-432 {
  height: 432px !important;
}

.w-440 {
  width: 440px !important;
}

.h-440 {
  height: 440px !important;
}

.w-448 {
  width: 448px !important;
}

.h-448 {
  height: 448px !important;
}

.w-456 {
  width: 456px !important;
}

.h-456 {
  height: 456px !important;
}

.w-464 {
  width: 464px !important;
}

.h-464 {
  height: 464px !important;
}

.w-472 {
  width: 472px !important;
}

.h-472 {
  height: 472px !important;
}

.w-480 {
  width: 480px !important;
}

.h-480 {
  height: 480px !important;
}

.w-488 {
  width: 488px !important;
}

.h-488 {
  height: 488px !important;
}

.w-496 {
  width: 496px !important;
}

.h-496 {
  height: 496px !important;
}

.w-504 {
  width: 504px !important;
}

.h-504 {
  height: 504px !important;
}

.w-512 {
  width: 512px !important;
}

.h-512 {
  height: 512px !important;
}

.w-520 {
  width: 520px !important;
}

.h-520 {
  height: 520px !important;
}

.w-528 {
  width: 528px !important;
}

.h-528 {
  height: 528px !important;
}

.w-536 {
  width: 536px !important;
}

.h-536 {
  height: 536px !important;
}

.w-544 {
  width: 544px !important;
}

.h-544 {
  height: 544px !important;
}

.w-552 {
  width: 552px !important;
}

.h-552 {
  height: 552px !important;
}

.w-560 {
  width: 560px !important;
}

.h-560 {
  height: 560px !important;
}

.w-568 {
  width: 568px !important;
}

.h-568 {
  height: 568px !important;
}

.w-576 {
  width: 576px !important;
}

.h-576 {
  height: 576px !important;
}

.w-584 {
  width: 584px !important;
}

.h-584 {
  height: 584px !important;
}

.w-592 {
  width: 592px !important;
}

.h-592 {
  height: 592px !important;
}

.w-600 {
  width: 600px !important;
}

.h-600 {
  height: 600px !important;
}

.w-608 {
  width: 608px !important;
}

.h-608 {
  height: 608px !important;
}

.w-616 {
  width: 616px !important;
}

.h-616 {
  height: 616px !important;
}

.w-624 {
  width: 624px !important;
}

.h-624 {
  height: 624px !important;
}

.w-632 {
  width: 632px !important;
}

.h-632 {
  height: 632px !important;
}

.w-640 {
  width: 640px !important;
}

.h-640 {
  height: 640px !important;
}

.w-648 {
  width: 648px !important;
}

.h-648 {
  height: 648px !important;
}

.w-656 {
  width: 656px !important;
}

.h-656 {
  height: 656px !important;
}

.w-664 {
  width: 664px !important;
}

.h-664 {
  height: 664px !important;
}

.w-672 {
  width: 672px !important;
}

.h-672 {
  height: 672px !important;
}

.w-680 {
  width: 680px !important;
}

.h-680 {
  height: 680px !important;
}

.w-688 {
  width: 688px !important;
}

.h-688 {
  height: 688px !important;
}

.w-696 {
  width: 696px !important;
}

.h-696 {
  height: 696px !important;
}

.w-704 {
  width: 704px !important;
}

.h-704 {
  height: 704px !important;
}

.w-712 {
  width: 712px !important;
}

.h-712 {
  height: 712px !important;
}

.w-720 {
  width: 720px !important;
}

.h-720 {
  height: 720px !important;
}

.w-728 {
  width: 728px !important;
}

.h-728 {
  height: 728px !important;
}

.w-736 {
  width: 736px !important;
}

.h-736 {
  height: 736px !important;
}

.w-744 {
  width: 744px !important;
}

.h-744 {
  height: 744px !important;
}

.w-752 {
  width: 752px !important;
}

.h-752 {
  height: 752px !important;
}

.w-760 {
  width: 760px !important;
}

.h-760 {
  height: 760px !important;
}

.w-768 {
  width: 768px !important;
}

.h-768 {
  height: 768px !important;
}

.w-776 {
  width: 776px !important;
}

.h-776 {
  height: 776px !important;
}

.w-784 {
  width: 784px !important;
}

.h-784 {
  height: 784px !important;
}

.w-792 {
  width: 792px !important;
}

.h-792 {
  height: 792px !important;
}

.w-800 {
  width: 800px !important;
}

.h-800 {
  height: 800px !important;
}

.w-808 {
  width: 808px !important;
}

.h-808 {
  height: 808px !important;
}

.w-816 {
  width: 816px !important;
}

.h-816 {
  height: 816px !important;
}

.w-824 {
  width: 824px !important;
}

.h-824 {
  height: 824px !important;
}

.w-832 {
  width: 832px !important;
}

.h-832 {
  height: 832px !important;
}

.w-840 {
  width: 840px !important;
}

.h-840 {
  height: 840px !important;
}

.w-848 {
  width: 848px !important;
}

.h-848 {
  height: 848px !important;
}

.w-856 {
  width: 856px !important;
}

.h-856 {
  height: 856px !important;
}

.w-864 {
  width: 864px !important;
}

.h-864 {
  height: 864px !important;
}

.w-872 {
  width: 872px !important;
}

.h-872 {
  height: 872px !important;
}

.w-880 {
  width: 880px !important;
}

.h-880 {
  height: 880px !important;
}

.w-888 {
  width: 888px !important;
}

.h-888 {
  height: 888px !important;
}

.w-896 {
  width: 896px !important;
}

.h-896 {
  height: 896px !important;
}

.w-904 {
  width: 904px !important;
}

.h-904 {
  height: 904px !important;
}

.w-912 {
  width: 912px !important;
}

.h-912 {
  height: 912px !important;
}

.w-920 {
  width: 920px !important;
}

.h-920 {
  height: 920px !important;
}

.w-928 {
  width: 928px !important;
}

.h-928 {
  height: 928px !important;
}

.w-936 {
  width: 936px !important;
}

.h-936 {
  height: 936px !important;
}

.w-944 {
  width: 944px !important;
}

.h-944 {
  height: 944px !important;
}

.w-952 {
  width: 952px !important;
}

.h-952 {
  height: 952px !important;
}

.w-960 {
  width: 960px !important;
}

.h-960 {
  height: 960px !important;
}

.w-968 {
  width: 968px !important;
}

.h-968 {
  height: 968px !important;
}

.w-976 {
  width: 976px !important;
}

.h-976 {
  height: 976px !important;
}

.w-984 {
  width: 984px !important;
}

.h-984 {
  height: 984px !important;
}

.w-992 {
  width: 992px !important;
}

.h-992 {
  height: 992px !important;
}

.w-1000 {
  width: 1000px !important;
}

.h-1000 {
  height: 1000px !important;
}

.w-1008 {
  width: 1008px !important;
}

.h-1008 {
  height: 1008px !important;
}

.w-1016 {
  width: 1016px !important;
}

.h-1016 {
  height: 1016px !important;
}

.w-1024 {
  width: 1024px !important;
}

.h-1024 {
  height: 1024px !important;
}

.w-1032 {
  width: 1032px !important;
}

.h-1032 {
  height: 1032px !important;
}

.w-1040 {
  width: 1040px !important;
}

.h-1040 {
  height: 1040px !important;
}

.w-1048 {
  width: 1048px !important;
}

.h-1048 {
  height: 1048px !important;
}

.w-1056 {
  width: 1056px !important;
}

.h-1056 {
  height: 1056px !important;
}

.w-1064 {
  width: 1064px !important;
}

.h-1064 {
  height: 1064px !important;
}

.w-1072 {
  width: 1072px !important;
}

.h-1072 {
  height: 1072px !important;
}

.w-1080 {
  width: 1080px !important;
}

.h-1080 {
  height: 1080px !important;
}

.w-1088 {
  width: 1088px !important;
}

.h-1088 {
  height: 1088px !important;
}

.w-1096 {
  width: 1096px !important;
}

.h-1096 {
  height: 1096px !important;
}

.w-1104 {
  width: 1104px !important;
}

.h-1104 {
  height: 1104px !important;
}

.h-full {
  height: 100% !important;
}

.w-full {
  width: 100% !important;
}

.mt-0 {
  margin-top: 0px !important;
}

.mt-1 {
  margin-top: 1px !important;
}

.mt-2 {
  margin-top: 2px !important;
}

.mt-3 {
  margin-top: 3px !important;
}

.mt-4 {
  margin-top: 4px !important;
}

.mt-5 {
  margin-top: 5px !important;
}

.mt-6 {
  margin-top: 6px !important;
}

.mt-7 {
  margin-top: 7px !important;
}

.mt-8 {
  margin-top: 8px !important;
}

.mt-9 {
  margin-top: 9px !important;
}

.mt-10 {
  margin-top: 10px !important;
}

.mt-11 {
  margin-top: 11px !important;
}

.mt-12 {
  margin-top: 12px !important;
}

.mt-13 {
  margin-top: 13px !important;
}

.mt-14 {
  margin-top: 14px !important;
}

.mt-15 {
  margin-top: 15px !important;
}

.mt-16 {
  margin-top: 16px !important;
}

.mt-17 {
  margin-top: 17px !important;
}

.mt-18 {
  margin-top: 18px !important;
}

.mt-19 {
  margin-top: 19px !important;
}

.mt-20 {
  margin-top: 20px !important;
}

.mt-21 {
  margin-top: 21px !important;
}

.mt-22 {
  margin-top: 22px !important;
}

.mt-23 {
  margin-top: 23px !important;
}

.mt-24 {
  margin-top: 24px !important;
}

.mt-25 {
  margin-top: 25px !important;
}

.mt-26 {
  margin-top: 26px !important;
}

.mt-27 {
  margin-top: 27px !important;
}

.mt-28 {
  margin-top: 28px !important;
}

.mt-29 {
  margin-top: 29px !important;
}

.mt-30 {
  margin-top: 30px !important;
}

.mt-31 {
  margin-top: 31px !important;
}

.mt-32 {
  margin-top: 32px !important;
}

.mt-33 {
  margin-top: 33px !important;
}

.mt-34 {
  margin-top: 34px !important;
}

.mt-35 {
  margin-top: 35px !important;
}

.mt-36 {
  margin-top: 36px !important;
}

.mt-37 {
  margin-top: 37px !important;
}

.mt-38 {
  margin-top: 38px !important;
}

.mt-39 {
  margin-top: 39px !important;
}

.mt-40 {
  margin-top: 40px !important;
}

.mt-41 {
  margin-top: 41px !important;
}

.mt-42 {
  margin-top: 42px !important;
}

.mt-43 {
  margin-top: 43px !important;
}

.mt-44 {
  margin-top: 44px !important;
}

.mt-45 {
  margin-top: 45px !important;
}

.mt-46 {
  margin-top: 46px !important;
}

.mt-47 {
  margin-top: 47px !important;
}

.mt-48 {
  margin-top: 48px !important;
}

.mt-56 {
  margin-top: 56px !important;
}

.mt-64 {
  margin-top: 64px !important;
}

.mt-72 {
  margin-top: 72px !important;
}

.mt-80 {
  margin-top: 80px !important;
}

.mt-88 {
  margin-top: 88px !important;
}

.mt-96 {
  margin-top: 96px !important;
}

.mt-104 {
  margin-top: 104px !important;
}

.mt-112 {
  margin-top: 112px !important;
}

.mt-120 {
  margin-top: 120px !important;
}

.mt-128 {
  margin-top: 128px !important;
}

.mt-136 {
  margin-top: 136px !important;
}

.mt-144 {
  margin-top: 144px !important;
}

.mt-152 {
  margin-top: 152px !important;
}

.mt-160 {
  margin-top: 160px !important;
}

.mt-168 {
  margin-top: 168px !important;
}

.mt-176 {
  margin-top: 176px !important;
}

.mt-184 {
  margin-top: 184px !important;
}

.mt-192 {
  margin-top: 192px !important;
}

.mt-200 {
  margin-top: 200px !important;
}

.mb-0 {
  margin-bottom: 0px !important;
}

.mb-1 {
  margin-bottom: 1px !important;
}

.mb-2 {
  margin-bottom: 2px !important;
}

.mb-3 {
  margin-bottom: 3px !important;
}

.mb-4 {
  margin-bottom: 4px !important;
}

.mb-5 {
  margin-bottom: 5px !important;
}

.mb-6 {
  margin-bottom: 6px !important;
}

.mb-7 {
  margin-bottom: 7px !important;
}

.mb-8 {
  margin-bottom: 8px !important;
}

.mb-9 {
  margin-bottom: 9px !important;
}

.mb-10 {
  margin-bottom: 10px !important;
}

.mb-11 {
  margin-bottom: 11px !important;
}

.mb-12 {
  margin-bottom: 12px !important;
}

.mb-13 {
  margin-bottom: 13px !important;
}

.mb-14 {
  margin-bottom: 14px !important;
}

.mb-15 {
  margin-bottom: 15px !important;
}

.mb-16 {
  margin-bottom: 16px !important;
}

.mb-17 {
  margin-bottom: 17px !important;
}

.mb-18 {
  margin-bottom: 18px !important;
}

.mb-19 {
  margin-bottom: 19px !important;
}

.mb-20 {
  margin-bottom: 20px !important;
}

.mb-21 {
  margin-bottom: 21px !important;
}

.mb-22 {
  margin-bottom: 22px !important;
}

.mb-23 {
  margin-bottom: 23px !important;
}

.mb-24 {
  margin-bottom: 24px !important;
}

.mb-25 {
  margin-bottom: 25px !important;
}

.mb-26 {
  margin-bottom: 26px !important;
}

.mb-27 {
  margin-bottom: 27px !important;
}

.mb-28 {
  margin-bottom: 28px !important;
}

.mb-29 {
  margin-bottom: 29px !important;
}

.mb-30 {
  margin-bottom: 30px !important;
}

.mb-31 {
  margin-bottom: 31px !important;
}

.mb-32 {
  margin-bottom: 32px !important;
}

.mb-33 {
  margin-bottom: 33px !important;
}

.mb-34 {
  margin-bottom: 34px !important;
}

.mb-35 {
  margin-bottom: 35px !important;
}

.mb-36 {
  margin-bottom: 36px !important;
}

.mb-37 {
  margin-bottom: 37px !important;
}

.mb-38 {
  margin-bottom: 38px !important;
}

.mb-39 {
  margin-bottom: 39px !important;
}

.mb-40 {
  margin-bottom: 40px !important;
}

.mb-41 {
  margin-bottom: 41px !important;
}

.mb-42 {
  margin-bottom: 42px !important;
}

.mb-43 {
  margin-bottom: 43px !important;
}

.mb-44 {
  margin-bottom: 44px !important;
}

.mb-45 {
  margin-bottom: 45px !important;
}

.mb-46 {
  margin-bottom: 46px !important;
}

.mb-47 {
  margin-bottom: 47px !important;
}

.mb-48 {
  margin-bottom: 48px !important;
}

.mb-56 {
  margin-bottom: 56px !important;
}

.mb-64 {
  margin-bottom: 64px !important;
}

.mb-72 {
  margin-bottom: 72px !important;
}

.mb-80 {
  margin-bottom: 80px !important;
}

.mb-88 {
  margin-bottom: 88px !important;
}

.mb-96 {
  margin-bottom: 96px !important;
}

.mb-104 {
  margin-bottom: 104px !important;
}

.mb-112 {
  margin-bottom: 112px !important;
}

.mb-120 {
  margin-bottom: 120px !important;
}

.mb-128 {
  margin-bottom: 128px !important;
}

.mb-136 {
  margin-bottom: 136px !important;
}

.mb-144 {
  margin-bottom: 144px !important;
}

.mb-152 {
  margin-bottom: 152px !important;
}

.mb-160 {
  margin-bottom: 160px !important;
}

.mb-168 {
  margin-bottom: 168px !important;
}

.mb-176 {
  margin-bottom: 176px !important;
}

.mb-184 {
  margin-bottom: 184px !important;
}

.mb-192 {
  margin-bottom: 192px !important;
}

.mb-200 {
  margin-bottom: 200px !important;
}

.ml-0 {
  margin-left: 0px !important;
}

.ml-1 {
  margin-left: 1px !important;
}

.ml-2 {
  margin-left: 2px !important;
}

.ml-3 {
  margin-left: 3px !important;
}

.ml-4 {
  margin-left: 4px !important;
}

.ml-5 {
  margin-left: 5px !important;
}

.ml-6 {
  margin-left: 6px !important;
}

.ml-7 {
  margin-left: 7px !important;
}

.ml-8 {
  margin-left: 8px !important;
}

.ml-9 {
  margin-left: 9px !important;
}

.ml-10 {
  margin-left: 10px !important;
}

.ml-11 {
  margin-left: 11px !important;
}

.ml-12 {
  margin-left: 12px !important;
}

.ml-13 {
  margin-left: 13px !important;
}

.ml-14 {
  margin-left: 14px !important;
}

.ml-15 {
  margin-left: 15px !important;
}

.ml-16 {
  margin-left: 16px !important;
}

.ml-17 {
  margin-left: 17px !important;
}

.ml-18 {
  margin-left: 18px !important;
}

.ml-19 {
  margin-left: 19px !important;
}

.ml-20 {
  margin-left: 20px !important;
}

.ml-21 {
  margin-left: 21px !important;
}

.ml-22 {
  margin-left: 22px !important;
}

.ml-23 {
  margin-left: 23px !important;
}

.ml-24 {
  margin-left: 24px !important;
}

.ml-25 {
  margin-left: 25px !important;
}

.ml-26 {
  margin-left: 26px !important;
}

.ml-27 {
  margin-left: 27px !important;
}

.ml-28 {
  margin-left: 28px !important;
}

.ml-29 {
  margin-left: 29px !important;
}

.ml-30 {
  margin-left: 30px !important;
}

.ml-31 {
  margin-left: 31px !important;
}

.ml-32 {
  margin-left: 32px !important;
}

.ml-33 {
  margin-left: 33px !important;
}

.ml-34 {
  margin-left: 34px !important;
}

.ml-35 {
  margin-left: 35px !important;
}

.ml-36 {
  margin-left: 36px !important;
}

.ml-37 {
  margin-left: 37px !important;
}

.ml-38 {
  margin-left: 38px !important;
}

.ml-39 {
  margin-left: 39px !important;
}

.ml-40 {
  margin-left: 40px !important;
}

.ml-41 {
  margin-left: 41px !important;
}

.ml-42 {
  margin-left: 42px !important;
}

.ml-43 {
  margin-left: 43px !important;
}

.ml-44 {
  margin-left: 44px !important;
}

.ml-45 {
  margin-left: 45px !important;
}

.ml-46 {
  margin-left: 46px !important;
}

.ml-47 {
  margin-left: 47px !important;
}

.ml-48 {
  margin-left: 48px !important;
}

.ml-56 {
  margin-left: 56px !important;
}

.ml-64 {
  margin-left: 64px !important;
}

.ml-72 {
  margin-left: 72px !important;
}

.ml-80 {
  margin-left: 80px !important;
}

.ml-88 {
  margin-left: 88px !important;
}

.ml-96 {
  margin-left: 96px !important;
}

.ml-104 {
  margin-left: 104px !important;
}

.ml-112 {
  margin-left: 112px !important;
}

.ml-120 {
  margin-left: 120px !important;
}

.ml-128 {
  margin-left: 128px !important;
}

.ml-136 {
  margin-left: 136px !important;
}

.ml-144 {
  margin-left: 144px !important;
}

.ml-152 {
  margin-left: 152px !important;
}

.ml-160 {
  margin-left: 160px !important;
}

.ml-168 {
  margin-left: 168px !important;
}

.ml-176 {
  margin-left: 176px !important;
}

.ml-184 {
  margin-left: 184px !important;
}

.ml-192 {
  margin-left: 192px !important;
}

.ml-200 {
  margin-left: 200px !important;
}

.mr-0 {
  margin-right: 0px !important;
}

.mr-1 {
  margin-right: 1px !important;
}

.mr-2 {
  margin-right: 2px !important;
}

.mr-3 {
  margin-right: 3px !important;
}

.mr-4 {
  margin-right: 4px !important;
}

.mr-5 {
  margin-right: 5px !important;
}

.mr-6 {
  margin-right: 6px !important;
}

.mr-7 {
  margin-right: 7px !important;
}

.mr-8 {
  margin-right: 8px !important;
}

.mr-9 {
  margin-right: 9px !important;
}

.mr-10 {
  margin-right: 10px !important;
}

.mr-11 {
  margin-right: 11px !important;
}

.mr-12 {
  margin-right: 12px !important;
}

.mr-13 {
  margin-right: 13px !important;
}

.mr-14 {
  margin-right: 14px !important;
}

.mr-15 {
  margin-right: 15px !important;
}

.mr-16 {
  margin-right: 16px !important;
}

.mr-17 {
  margin-right: 17px !important;
}

.mr-18 {
  margin-right: 18px !important;
}

.mr-19 {
  margin-right: 19px !important;
}

.mr-20 {
  margin-right: 20px !important;
}

.mr-21 {
  margin-right: 21px !important;
}

.mr-22 {
  margin-right: 22px !important;
}

.mr-23 {
  margin-right: 23px !important;
}

.mr-24 {
  margin-right: 24px !important;
}

.mr-25 {
  margin-right: 25px !important;
}

.mr-26 {
  margin-right: 26px !important;
}

.mr-27 {
  margin-right: 27px !important;
}

.mr-28 {
  margin-right: 28px !important;
}

.mr-29 {
  margin-right: 29px !important;
}

.mr-30 {
  margin-right: 30px !important;
}

.mr-31 {
  margin-right: 31px !important;
}

.mr-32 {
  margin-right: 32px !important;
}

.mr-33 {
  margin-right: 33px !important;
}

.mr-34 {
  margin-right: 34px !important;
}

.mr-35 {
  margin-right: 35px !important;
}

.mr-36 {
  margin-right: 36px !important;
}

.mr-37 {
  margin-right: 37px !important;
}

.mr-38 {
  margin-right: 38px !important;
}

.mr-39 {
  margin-right: 39px !important;
}

.mr-40 {
  margin-right: 40px !important;
}

.mr-41 {
  margin-right: 41px !important;
}

.mr-42 {
  margin-right: 42px !important;
}

.mr-43 {
  margin-right: 43px !important;
}

.mr-44 {
  margin-right: 44px !important;
}

.mr-45 {
  margin-right: 45px !important;
}

.mr-46 {
  margin-right: 46px !important;
}

.mr-47 {
  margin-right: 47px !important;
}

.mr-48 {
  margin-right: 48px !important;
}

.mr-56 {
  margin-right: 56px !important;
}

.mr-64 {
  margin-right: 64px !important;
}

.mr-72 {
  margin-right: 72px !important;
}

.mr-80 {
  margin-right: 80px !important;
}

.mr-88 {
  margin-right: 88px !important;
}

.mr-96 {
  margin-right: 96px !important;
}

.mr-104 {
  margin-right: 104px !important;
}

.mr-112 {
  margin-right: 112px !important;
}

.mr-120 {
  margin-right: 120px !important;
}

.mr-128 {
  margin-right: 128px !important;
}

.mr-136 {
  margin-right: 136px !important;
}

.mr-144 {
  margin-right: 144px !important;
}

.mr-152 {
  margin-right: 152px !important;
}

.mr-160 {
  margin-right: 160px !important;
}

.mr-168 {
  margin-right: 168px !important;
}

.mr-176 {
  margin-right: 176px !important;
}

.mr-184 {
  margin-right: 184px !important;
}

.mr-192 {
  margin-right: 192px !important;
}

.mr-200 {
  margin-right: 200px !important;
}

.mx-0 {
  margin-left: 0px !important;
  margin-right: 0px !important;
}

.mx-1 {
  margin-left: 1px !important;
  margin-right: 1px !important;
}

.mx-2 {
  margin-left: 2px !important;
  margin-right: 2px !important;
}

.mx-3 {
  margin-left: 3px !important;
  margin-right: 3px !important;
}

.mx-4 {
  margin-left: 4px !important;
  margin-right: 4px !important;
}

.mx-5 {
  margin-left: 5px !important;
  margin-right: 5px !important;
}

.mx-6 {
  margin-left: 6px !important;
  margin-right: 6px !important;
}

.mx-7 {
  margin-left: 7px !important;
  margin-right: 7px !important;
}

.mx-8 {
  margin-left: 8px !important;
  margin-right: 8px !important;
}

.mx-9 {
  margin-left: 9px !important;
  margin-right: 9px !important;
}

.mx-10 {
  margin-left: 10px !important;
  margin-right: 10px !important;
}

.mx-11 {
  margin-left: 11px !important;
  margin-right: 11px !important;
}

.mx-12 {
  margin-left: 12px !important;
  margin-right: 12px !important;
}

.mx-13 {
  margin-left: 13px !important;
  margin-right: 13px !important;
}

.mx-14 {
  margin-left: 14px !important;
  margin-right: 14px !important;
}

.mx-15 {
  margin-left: 15px !important;
  margin-right: 15px !important;
}

.mx-16 {
  margin-left: 16px !important;
  margin-right: 16px !important;
}

.mx-17 {
  margin-left: 17px !important;
  margin-right: 17px !important;
}

.mx-18 {
  margin-left: 18px !important;
  margin-right: 18px !important;
}

.mx-19 {
  margin-left: 19px !important;
  margin-right: 19px !important;
}

.mx-20 {
  margin-left: 20px !important;
  margin-right: 20px !important;
}

.mx-21 {
  margin-left: 21px !important;
  margin-right: 21px !important;
}

.mx-22 {
  margin-left: 22px !important;
  margin-right: 22px !important;
}

.mx-23 {
  margin-left: 23px !important;
  margin-right: 23px !important;
}

.mx-24 {
  margin-left: 24px !important;
  margin-right: 24px !important;
}

.mx-25 {
  margin-left: 25px !important;
  margin-right: 25px !important;
}

.mx-26 {
  margin-left: 26px !important;
  margin-right: 26px !important;
}

.mx-27 {
  margin-left: 27px !important;
  margin-right: 27px !important;
}

.mx-28 {
  margin-left: 28px !important;
  margin-right: 28px !important;
}

.mx-29 {
  margin-left: 29px !important;
  margin-right: 29px !important;
}

.mx-30 {
  margin-left: 30px !important;
  margin-right: 30px !important;
}

.mx-31 {
  margin-left: 31px !important;
  margin-right: 31px !important;
}

.mx-32 {
  margin-left: 32px !important;
  margin-right: 32px !important;
}

.mx-33 {
  margin-left: 33px !important;
  margin-right: 33px !important;
}

.mx-34 {
  margin-left: 34px !important;
  margin-right: 34px !important;
}

.mx-35 {
  margin-left: 35px !important;
  margin-right: 35px !important;
}

.mx-36 {
  margin-left: 36px !important;
  margin-right: 36px !important;
}

.mx-37 {
  margin-left: 37px !important;
  margin-right: 37px !important;
}

.mx-38 {
  margin-left: 38px !important;
  margin-right: 38px !important;
}

.mx-39 {
  margin-left: 39px !important;
  margin-right: 39px !important;
}

.mx-40 {
  margin-left: 40px !important;
  margin-right: 40px !important;
}

.mx-41 {
  margin-left: 41px !important;
  margin-right: 41px !important;
}

.mx-42 {
  margin-left: 42px !important;
  margin-right: 42px !important;
}

.mx-43 {
  margin-left: 43px !important;
  margin-right: 43px !important;
}

.mx-44 {
  margin-left: 44px !important;
  margin-right: 44px !important;
}

.mx-45 {
  margin-left: 45px !important;
  margin-right: 45px !important;
}

.mx-46 {
  margin-left: 46px !important;
  margin-right: 46px !important;
}

.mx-47 {
  margin-left: 47px !important;
  margin-right: 47px !important;
}

.mx-48 {
  margin-left: 48px !important;
  margin-right: 48px !important;
}

.mx-56 {
  margin-left: 56px !important;
  margin-right: 56px !important;
}

.mx-64 {
  margin-left: 64px !important;
  margin-right: 64px !important;
}

.mx-72 {
  margin-left: 72px !important;
  margin-right: 72px !important;
}

.mx-80 {
  margin-left: 80px !important;
  margin-right: 80px !important;
}

.mx-88 {
  margin-left: 88px !important;
  margin-right: 88px !important;
}

.mx-96 {
  margin-left: 96px !important;
  margin-right: 96px !important;
}

.mx-104 {
  margin-left: 104px !important;
  margin-right: 104px !important;
}

.mx-112 {
  margin-left: 112px !important;
  margin-right: 112px !important;
}

.mx-120 {
  margin-left: 120px !important;
  margin-right: 120px !important;
}

.mx-128 {
  margin-left: 128px !important;
  margin-right: 128px !important;
}

.mx-136 {
  margin-left: 136px !important;
  margin-right: 136px !important;
}

.mx-144 {
  margin-left: 144px !important;
  margin-right: 144px !important;
}

.mx-152 {
  margin-left: 152px !important;
  margin-right: 152px !important;
}

.mx-160 {
  margin-left: 160px !important;
  margin-right: 160px !important;
}

.mx-168 {
  margin-left: 168px !important;
  margin-right: 168px !important;
}

.mx-176 {
  margin-left: 176px !important;
  margin-right: 176px !important;
}

.mx-184 {
  margin-left: 184px !important;
  margin-right: 184px !important;
}

.mx-192 {
  margin-left: 192px !important;
  margin-right: 192px !important;
}

.mx-200 {
  margin-left: 200px !important;
  margin-right: 200px !important;
}

.my-0 {
  margin-top: 0px !important;
  margin-bottom: 0px !important;
}

.my-1 {
  margin-top: 1px !important;
  margin-bottom: 1px !important;
}

.my-2 {
  margin-top: 2px !important;
  margin-bottom: 2px !important;
}

.my-3 {
  margin-top: 3px !important;
  margin-bottom: 3px !important;
}

.my-4 {
  margin-top: 4px !important;
  margin-bottom: 4px !important;
}

.my-5 {
  margin-top: 5px !important;
  margin-bottom: 5px !important;
}

.my-6 {
  margin-top: 6px !important;
  margin-bottom: 6px !important;
}

.my-7 {
  margin-top: 7px !important;
  margin-bottom: 7px !important;
}

.my-8 {
  margin-top: 8px !important;
  margin-bottom: 8px !important;
}

.my-9 {
  margin-top: 9px !important;
  margin-bottom: 9px !important;
}

.my-10 {
  margin-top: 10px !important;
  margin-bottom: 10px !important;
}

.my-11 {
  margin-top: 11px !important;
  margin-bottom: 11px !important;
}

.my-12 {
  margin-top: 12px !important;
  margin-bottom: 12px !important;
}

.my-13 {
  margin-top: 13px !important;
  margin-bottom: 13px !important;
}

.my-14 {
  margin-top: 14px !important;
  margin-bottom: 14px !important;
}

.my-15 {
  margin-top: 15px !important;
  margin-bottom: 15px !important;
}

.my-16 {
  margin-top: 16px !important;
  margin-bottom: 16px !important;
}

.my-17 {
  margin-top: 17px !important;
  margin-bottom: 17px !important;
}

.my-18 {
  margin-top: 18px !important;
  margin-bottom: 18px !important;
}

.my-19 {
  margin-top: 19px !important;
  margin-bottom: 19px !important;
}

.my-20 {
  margin-top: 20px !important;
  margin-bottom: 20px !important;
}

.my-21 {
  margin-top: 21px !important;
  margin-bottom: 21px !important;
}

.my-22 {
  margin-top: 22px !important;
  margin-bottom: 22px !important;
}

.my-23 {
  margin-top: 23px !important;
  margin-bottom: 23px !important;
}

.my-24 {
  margin-top: 24px !important;
  margin-bottom: 24px !important;
}

.my-25 {
  margin-top: 25px !important;
  margin-bottom: 25px !important;
}

.my-26 {
  margin-top: 26px !important;
  margin-bottom: 26px !important;
}

.my-27 {
  margin-top: 27px !important;
  margin-bottom: 27px !important;
}

.my-28 {
  margin-top: 28px !important;
  margin-bottom: 28px !important;
}

.my-29 {
  margin-top: 29px !important;
  margin-bottom: 29px !important;
}

.my-30 {
  margin-top: 30px !important;
  margin-bottom: 30px !important;
}

.my-31 {
  margin-top: 31px !important;
  margin-bottom: 31px !important;
}

.my-32 {
  margin-top: 32px !important;
  margin-bottom: 32px !important;
}

.my-33 {
  margin-top: 33px !important;
  margin-bottom: 33px !important;
}

.my-34 {
  margin-top: 34px !important;
  margin-bottom: 34px !important;
}

.my-35 {
  margin-top: 35px !important;
  margin-bottom: 35px !important;
}

.my-36 {
  margin-top: 36px !important;
  margin-bottom: 36px !important;
}

.my-37 {
  margin-top: 37px !important;
  margin-bottom: 37px !important;
}

.my-38 {
  margin-top: 38px !important;
  margin-bottom: 38px !important;
}

.my-39 {
  margin-top: 39px !important;
  margin-bottom: 39px !important;
}

.my-40 {
  margin-top: 40px !important;
  margin-bottom: 40px !important;
}

.my-41 {
  margin-top: 41px !important;
  margin-bottom: 41px !important;
}

.my-42 {
  margin-top: 42px !important;
  margin-bottom: 42px !important;
}

.my-43 {
  margin-top: 43px !important;
  margin-bottom: 43px !important;
}

.my-44 {
  margin-top: 44px !important;
  margin-bottom: 44px !important;
}

.my-45 {
  margin-top: 45px !important;
  margin-bottom: 45px !important;
}

.my-46 {
  margin-top: 46px !important;
  margin-bottom: 46px !important;
}

.my-47 {
  margin-top: 47px !important;
  margin-bottom: 47px !important;
}

.my-48 {
  margin-top: 48px !important;
  margin-bottom: 48px !important;
}

.my-56 {
  margin-top: 56px !important;
  margin-bottom: 56px !important;
}

.my-64 {
  margin-top: 64px !important;
  margin-bottom: 64px !important;
}

.my-72 {
  margin-top: 72px !important;
  margin-bottom: 72px !important;
}

.my-80 {
  margin-top: 80px !important;
  margin-bottom: 80px !important;
}

.my-88 {
  margin-top: 88px !important;
  margin-bottom: 88px !important;
}

.my-96 {
  margin-top: 96px !important;
  margin-bottom: 96px !important;
}

.my-104 {
  margin-top: 104px !important;
  margin-bottom: 104px !important;
}

.my-112 {
  margin-top: 112px !important;
  margin-bottom: 112px !important;
}

.my-120 {
  margin-top: 120px !important;
  margin-bottom: 120px !important;
}

.my-128 {
  margin-top: 128px !important;
  margin-bottom: 128px !important;
}

.my-136 {
  margin-top: 136px !important;
  margin-bottom: 136px !important;
}

.my-144 {
  margin-top: 144px !important;
  margin-bottom: 144px !important;
}

.my-152 {
  margin-top: 152px !important;
  margin-bottom: 152px !important;
}

.my-160 {
  margin-top: 160px !important;
  margin-bottom: 160px !important;
}

.my-168 {
  margin-top: 168px !important;
  margin-bottom: 168px !important;
}

.my-176 {
  margin-top: 176px !important;
  margin-bottom: 176px !important;
}

.my-184 {
  margin-top: 184px !important;
  margin-bottom: 184px !important;
}

.my-192 {
  margin-top: 192px !important;
  margin-bottom: 192px !important;
}

.my-200 {
  margin-top: 200px !important;
  margin-bottom: 200px !important;
}

.ma-0 {
  margin-left: 0px !important;
  margin-top: 0px !important;
  margin-right: 0px !important;
  margin-bottom: 0px !important;
}

.ma-1 {
  margin-left: 1px !important;
  margin-top: 1px !important;
  margin-right: 1px !important;
  margin-bottom: 1px !important;
}

.ma-2 {
  margin-left: 2px !important;
  margin-top: 2px !important;
  margin-right: 2px !important;
  margin-bottom: 2px !important;
}

.ma-3 {
  margin-left: 3px !important;
  margin-top: 3px !important;
  margin-right: 3px !important;
  margin-bottom: 3px !important;
}

.ma-4 {
  margin-left: 4px !important;
  margin-top: 4px !important;
  margin-right: 4px !important;
  margin-bottom: 4px !important;
}

.ma-5 {
  margin-left: 5px !important;
  margin-top: 5px !important;
  margin-right: 5px !important;
  margin-bottom: 5px !important;
}

.ma-6 {
  margin-left: 6px !important;
  margin-top: 6px !important;
  margin-right: 6px !important;
  margin-bottom: 6px !important;
}

.ma-7 {
  margin-left: 7px !important;
  margin-top: 7px !important;
  margin-right: 7px !important;
  margin-bottom: 7px !important;
}

.ma-8 {
  margin-left: 8px !important;
  margin-top: 8px !important;
  margin-right: 8px !important;
  margin-bottom: 8px !important;
}

.ma-9 {
  margin-left: 9px !important;
  margin-top: 9px !important;
  margin-right: 9px !important;
  margin-bottom: 9px !important;
}

.ma-10 {
  margin-left: 10px !important;
  margin-top: 10px !important;
  margin-right: 10px !important;
  margin-bottom: 10px !important;
}

.ma-11 {
  margin-left: 11px !important;
  margin-top: 11px !important;
  margin-right: 11px !important;
  margin-bottom: 11px !important;
}

.ma-12 {
  margin-left: 12px !important;
  margin-top: 12px !important;
  margin-right: 12px !important;
  margin-bottom: 12px !important;
}

.ma-13 {
  margin-left: 13px !important;
  margin-top: 13px !important;
  margin-right: 13px !important;
  margin-bottom: 13px !important;
}

.ma-14 {
  margin-left: 14px !important;
  margin-top: 14px !important;
  margin-right: 14px !important;
  margin-bottom: 14px !important;
}

.ma-15 {
  margin-left: 15px !important;
  margin-top: 15px !important;
  margin-right: 15px !important;
  margin-bottom: 15px !important;
}

.ma-16 {
  margin-left: 16px !important;
  margin-top: 16px !important;
  margin-right: 16px !important;
  margin-bottom: 16px !important;
}

.ma-17 {
  margin-left: 17px !important;
  margin-top: 17px !important;
  margin-right: 17px !important;
  margin-bottom: 17px !important;
}

.ma-18 {
  margin-left: 18px !important;
  margin-top: 18px !important;
  margin-right: 18px !important;
  margin-bottom: 18px !important;
}

.ma-19 {
  margin-left: 19px !important;
  margin-top: 19px !important;
  margin-right: 19px !important;
  margin-bottom: 19px !important;
}

.ma-20 {
  margin-left: 20px !important;
  margin-top: 20px !important;
  margin-right: 20px !important;
  margin-bottom: 20px !important;
}

.ma-21 {
  margin-left: 21px !important;
  margin-top: 21px !important;
  margin-right: 21px !important;
  margin-bottom: 21px !important;
}

.ma-22 {
  margin-left: 22px !important;
  margin-top: 22px !important;
  margin-right: 22px !important;
  margin-bottom: 22px !important;
}

.ma-23 {
  margin-left: 23px !important;
  margin-top: 23px !important;
  margin-right: 23px !important;
  margin-bottom: 23px !important;
}

.ma-24 {
  margin-left: 24px !important;
  margin-top: 24px !important;
  margin-right: 24px !important;
  margin-bottom: 24px !important;
}

.ma-25 {
  margin-left: 25px !important;
  margin-top: 25px !important;
  margin-right: 25px !important;
  margin-bottom: 25px !important;
}

.ma-26 {
  margin-left: 26px !important;
  margin-top: 26px !important;
  margin-right: 26px !important;
  margin-bottom: 26px !important;
}

.ma-27 {
  margin-left: 27px !important;
  margin-top: 27px !important;
  margin-right: 27px !important;
  margin-bottom: 27px !important;
}

.ma-28 {
  margin-left: 28px !important;
  margin-top: 28px !important;
  margin-right: 28px !important;
  margin-bottom: 28px !important;
}

.ma-29 {
  margin-left: 29px !important;
  margin-top: 29px !important;
  margin-right: 29px !important;
  margin-bottom: 29px !important;
}

.ma-30 {
  margin-left: 30px !important;
  margin-top: 30px !important;
  margin-right: 30px !important;
  margin-bottom: 30px !important;
}

.ma-31 {
  margin-left: 31px !important;
  margin-top: 31px !important;
  margin-right: 31px !important;
  margin-bottom: 31px !important;
}

.ma-32 {
  margin-left: 32px !important;
  margin-top: 32px !important;
  margin-right: 32px !important;
  margin-bottom: 32px !important;
}

.ma-33 {
  margin-left: 33px !important;
  margin-top: 33px !important;
  margin-right: 33px !important;
  margin-bottom: 33px !important;
}

.ma-34 {
  margin-left: 34px !important;
  margin-top: 34px !important;
  margin-right: 34px !important;
  margin-bottom: 34px !important;
}

.ma-35 {
  margin-left: 35px !important;
  margin-top: 35px !important;
  margin-right: 35px !important;
  margin-bottom: 35px !important;
}

.ma-36 {
  margin-left: 36px !important;
  margin-top: 36px !important;
  margin-right: 36px !important;
  margin-bottom: 36px !important;
}

.ma-37 {
  margin-left: 37px !important;
  margin-top: 37px !important;
  margin-right: 37px !important;
  margin-bottom: 37px !important;
}

.ma-38 {
  margin-left: 38px !important;
  margin-top: 38px !important;
  margin-right: 38px !important;
  margin-bottom: 38px !important;
}

.ma-39 {
  margin-left: 39px !important;
  margin-top: 39px !important;
  margin-right: 39px !important;
  margin-bottom: 39px !important;
}

.ma-40 {
  margin-left: 40px !important;
  margin-top: 40px !important;
  margin-right: 40px !important;
  margin-bottom: 40px !important;
}

.ma-41 {
  margin-left: 41px !important;
  margin-top: 41px !important;
  margin-right: 41px !important;
  margin-bottom: 41px !important;
}

.ma-42 {
  margin-left: 42px !important;
  margin-top: 42px !important;
  margin-right: 42px !important;
  margin-bottom: 42px !important;
}

.ma-43 {
  margin-left: 43px !important;
  margin-top: 43px !important;
  margin-right: 43px !important;
  margin-bottom: 43px !important;
}

.ma-44 {
  margin-left: 44px !important;
  margin-top: 44px !important;
  margin-right: 44px !important;
  margin-bottom: 44px !important;
}

.ma-45 {
  margin-left: 45px !important;
  margin-top: 45px !important;
  margin-right: 45px !important;
  margin-bottom: 45px !important;
}

.ma-46 {
  margin-left: 46px !important;
  margin-top: 46px !important;
  margin-right: 46px !important;
  margin-bottom: 46px !important;
}

.ma-47 {
  margin-left: 47px !important;
  margin-top: 47px !important;
  margin-right: 47px !important;
  margin-bottom: 47px !important;
}

.ma-48 {
  margin-left: 48px !important;
  margin-top: 48px !important;
  margin-right: 48px !important;
  margin-bottom: 48px !important;
}

.ma-56 {
  margin-left: 56px !important;
  margin-top: 56px !important;
  margin-right: 56px !important;
  margin-bottom: 56px !important;
}

.ma-64 {
  margin-left: 64px !important;
  margin-top: 64px !important;
  margin-right: 64px !important;
  margin-bottom: 64px !important;
}

.ma-72 {
  margin-left: 72px !important;
  margin-top: 72px !important;
  margin-right: 72px !important;
  margin-bottom: 72px !important;
}

.ma-80 {
  margin-left: 80px !important;
  margin-top: 80px !important;
  margin-right: 80px !important;
  margin-bottom: 80px !important;
}

.ma-88 {
  margin-left: 88px !important;
  margin-top: 88px !important;
  margin-right: 88px !important;
  margin-bottom: 88px !important;
}

.ma-96 {
  margin-left: 96px !important;
  margin-top: 96px !important;
  margin-right: 96px !important;
  margin-bottom: 96px !important;
}

.ma-104 {
  margin-left: 104px !important;
  margin-top: 104px !important;
  margin-right: 104px !important;
  margin-bottom: 104px !important;
}

.ma-112 {
  margin-left: 112px !important;
  margin-top: 112px !important;
  margin-right: 112px !important;
  margin-bottom: 112px !important;
}

.ma-120 {
  margin-left: 120px !important;
  margin-top: 120px !important;
  margin-right: 120px !important;
  margin-bottom: 120px !important;
}

.ma-128 {
  margin-left: 128px !important;
  margin-top: 128px !important;
  margin-right: 128px !important;
  margin-bottom: 128px !important;
}

.ma-136 {
  margin-left: 136px !important;
  margin-top: 136px !important;
  margin-right: 136px !important;
  margin-bottom: 136px !important;
}

.ma-144 {
  margin-left: 144px !important;
  margin-top: 144px !important;
  margin-right: 144px !important;
  margin-bottom: 144px !important;
}

.ma-152 {
  margin-left: 152px !important;
  margin-top: 152px !important;
  margin-right: 152px !important;
  margin-bottom: 152px !important;
}

.ma-160 {
  margin-left: 160px !important;
  margin-top: 160px !important;
  margin-right: 160px !important;
  margin-bottom: 160px !important;
}

.ma-168 {
  margin-left: 168px !important;
  margin-top: 168px !important;
  margin-right: 168px !important;
  margin-bottom: 168px !important;
}

.ma-176 {
  margin-left: 176px !important;
  margin-top: 176px !important;
  margin-right: 176px !important;
  margin-bottom: 176px !important;
}

.ma-184 {
  margin-left: 184px !important;
  margin-top: 184px !important;
  margin-right: 184px !important;
  margin-bottom: 184px !important;
}

.ma-192 {
  margin-left: 192px !important;
  margin-top: 192px !important;
  margin-right: 192px !important;
  margin-bottom: 192px !important;
}

.ma-200 {
  margin-left: 200px !important;
  margin-top: 200px !important;
  margin-right: 200px !important;
  margin-bottom: 200px !important;
}

.mt-n1 {
  margin-top: -1px !important;
}

.mt-n2 {
  margin-top: -2px !important;
}

.mt-n3 {
  margin-top: -3px !important;
}

.mt-n4 {
  margin-top: -4px !important;
}

.mt-n5 {
  margin-top: -5px !important;
}

.mt-n6 {
  margin-top: -6px !important;
}

.mt-n7 {
  margin-top: -7px !important;
}

.mt-n8 {
  margin-top: -8px !important;
}

.mt-n9 {
  margin-top: -9px !important;
}

.mt-n10 {
  margin-top: -10px !important;
}

.mt-n11 {
  margin-top: -11px !important;
}

.mt-n12 {
  margin-top: -12px !important;
}

.mt-n13 {
  margin-top: -13px !important;
}

.mt-n14 {
  margin-top: -14px !important;
}

.mt-n15 {
  margin-top: -15px !important;
}

.mt-n16 {
  margin-top: -16px !important;
}

.mt-n17 {
  margin-top: -17px !important;
}

.mt-n18 {
  margin-top: -18px !important;
}

.mt-n19 {
  margin-top: -19px !important;
}

.mt-n20 {
  margin-top: -20px !important;
}

.mt-n21 {
  margin-top: -21px !important;
}

.mt-n22 {
  margin-top: -22px !important;
}

.mt-n23 {
  margin-top: -23px !important;
}

.mt-n24 {
  margin-top: -24px !important;
}

.mt-n25 {
  margin-top: -25px !important;
}

.mt-n26 {
  margin-top: -26px !important;
}

.mt-n27 {
  margin-top: -27px !important;
}

.mt-n28 {
  margin-top: -28px !important;
}

.mt-n29 {
  margin-top: -29px !important;
}

.mt-n30 {
  margin-top: -30px !important;
}

.mt-n31 {
  margin-top: -31px !important;
}

.mt-n32 {
  margin-top: -32px !important;
}

.mt-n33 {
  margin-top: -33px !important;
}

.mt-n34 {
  margin-top: -34px !important;
}

.mt-n35 {
  margin-top: -35px !important;
}

.mt-n36 {
  margin-top: -36px !important;
}

.mt-n37 {
  margin-top: -37px !important;
}

.mt-n38 {
  margin-top: -38px !important;
}

.mt-n39 {
  margin-top: -39px !important;
}

.mt-n40 {
  margin-top: -40px !important;
}

.mt-n41 {
  margin-top: -41px !important;
}

.mt-n42 {
  margin-top: -42px !important;
}

.mt-n43 {
  margin-top: -43px !important;
}

.mt-n44 {
  margin-top: -44px !important;
}

.mt-n45 {
  margin-top: -45px !important;
}

.mt-n46 {
  margin-top: -46px !important;
}

.mt-n47 {
  margin-top: -47px !important;
}

.mt-n48 {
  margin-top: -48px !important;
}

.mb-n1 {
  margin-bottom: -1px !important;
}

.mb-n2 {
  margin-bottom: -2px !important;
}

.mb-n3 {
  margin-bottom: -3px !important;
}

.mb-n4 {
  margin-bottom: -4px !important;
}

.mb-n5 {
  margin-bottom: -5px !important;
}

.mb-n6 {
  margin-bottom: -6px !important;
}

.mb-n7 {
  margin-bottom: -7px !important;
}

.mb-n8 {
  margin-bottom: -8px !important;
}

.mb-n9 {
  margin-bottom: -9px !important;
}

.mb-n10 {
  margin-bottom: -10px !important;
}

.mb-n11 {
  margin-bottom: -11px !important;
}

.mb-n12 {
  margin-bottom: -12px !important;
}

.mb-n13 {
  margin-bottom: -13px !important;
}

.mb-n14 {
  margin-bottom: -14px !important;
}

.mb-n15 {
  margin-bottom: -15px !important;
}

.mb-n16 {
  margin-bottom: -16px !important;
}

.mb-n17 {
  margin-bottom: -17px !important;
}

.mb-n18 {
  margin-bottom: -18px !important;
}

.mb-n19 {
  margin-bottom: -19px !important;
}

.mb-n20 {
  margin-bottom: -20px !important;
}

.mb-n21 {
  margin-bottom: -21px !important;
}

.mb-n22 {
  margin-bottom: -22px !important;
}

.mb-n23 {
  margin-bottom: -23px !important;
}

.mb-n24 {
  margin-bottom: -24px !important;
}

.mb-n25 {
  margin-bottom: -25px !important;
}

.mb-n26 {
  margin-bottom: -26px !important;
}

.mb-n27 {
  margin-bottom: -27px !important;
}

.mb-n28 {
  margin-bottom: -28px !important;
}

.mb-n29 {
  margin-bottom: -29px !important;
}

.mb-n30 {
  margin-bottom: -30px !important;
}

.mb-n31 {
  margin-bottom: -31px !important;
}

.mb-n32 {
  margin-bottom: -32px !important;
}

.mb-n33 {
  margin-bottom: -33px !important;
}

.mb-n34 {
  margin-bottom: -34px !important;
}

.mb-n35 {
  margin-bottom: -35px !important;
}

.mb-n36 {
  margin-bottom: -36px !important;
}

.mb-n37 {
  margin-bottom: -37px !important;
}

.mb-n38 {
  margin-bottom: -38px !important;
}

.mb-n39 {
  margin-bottom: -39px !important;
}

.mb-n40 {
  margin-bottom: -40px !important;
}

.mb-n41 {
  margin-bottom: -41px !important;
}

.mb-n42 {
  margin-bottom: -42px !important;
}

.mb-n43 {
  margin-bottom: -43px !important;
}

.mb-n44 {
  margin-bottom: -44px !important;
}

.mb-n45 {
  margin-bottom: -45px !important;
}

.mb-n46 {
  margin-bottom: -46px !important;
}

.mb-n47 {
  margin-bottom: -47px !important;
}

.mb-n48 {
  margin-bottom: -48px !important;
}

.ml-n1 {
  margin-left: -1px !important;
}

.ml-n2 {
  margin-left: -2px !important;
}

.ml-n3 {
  margin-left: -3px !important;
}

.ml-n4 {
  margin-left: -4px !important;
}

.ml-n5 {
  margin-left: -5px !important;
}

.ml-n6 {
  margin-left: -6px !important;
}

.ml-n7 {
  margin-left: -7px !important;
}

.ml-n8 {
  margin-left: -8px !important;
}

.ml-n9 {
  margin-left: -9px !important;
}

.ml-n10 {
  margin-left: -10px !important;
}

.ml-n11 {
  margin-left: -11px !important;
}

.ml-n12 {
  margin-left: -12px !important;
}

.ml-n13 {
  margin-left: -13px !important;
}

.ml-n14 {
  margin-left: -14px !important;
}

.ml-n15 {
  margin-left: -15px !important;
}

.ml-n16 {
  margin-left: -16px !important;
}

.ml-n17 {
  margin-left: -17px !important;
}

.ml-n18 {
  margin-left: -18px !important;
}

.ml-n19 {
  margin-left: -19px !important;
}

.ml-n20 {
  margin-left: -20px !important;
}

.ml-n21 {
  margin-left: -21px !important;
}

.ml-n22 {
  margin-left: -22px !important;
}

.ml-n23 {
  margin-left: -23px !important;
}

.ml-n24 {
  margin-left: -24px !important;
}

.ml-n25 {
  margin-left: -25px !important;
}

.ml-n26 {
  margin-left: -26px !important;
}

.ml-n27 {
  margin-left: -27px !important;
}

.ml-n28 {
  margin-left: -28px !important;
}

.ml-n29 {
  margin-left: -29px !important;
}

.ml-n30 {
  margin-left: -30px !important;
}

.ml-n31 {
  margin-left: -31px !important;
}

.ml-n32 {
  margin-left: -32px !important;
}

.ml-n33 {
  margin-left: -33px !important;
}

.ml-n34 {
  margin-left: -34px !important;
}

.ml-n35 {
  margin-left: -35px !important;
}

.ml-n36 {
  margin-left: -36px !important;
}

.ml-n37 {
  margin-left: -37px !important;
}

.ml-n38 {
  margin-left: -38px !important;
}

.ml-n39 {
  margin-left: -39px !important;
}

.ml-n40 {
  margin-left: -40px !important;
}

.ml-n41 {
  margin-left: -41px !important;
}

.ml-n42 {
  margin-left: -42px !important;
}

.ml-n43 {
  margin-left: -43px !important;
}

.ml-n44 {
  margin-left: -44px !important;
}

.ml-n45 {
  margin-left: -45px !important;
}

.ml-n46 {
  margin-left: -46px !important;
}

.ml-n47 {
  margin-left: -47px !important;
}

.ml-n48 {
  margin-left: -48px !important;
}

.mr-n1 {
  margin-right: -1px !important;
}

.mr-n2 {
  margin-right: -2px !important;
}

.mr-n3 {
  margin-right: -3px !important;
}

.mr-n4 {
  margin-right: -4px !important;
}

.mr-n5 {
  margin-right: -5px !important;
}

.mr-n6 {
  margin-right: -6px !important;
}

.mr-n7 {
  margin-right: -7px !important;
}

.mr-n8 {
  margin-right: -8px !important;
}

.mr-n9 {
  margin-right: -9px !important;
}

.mr-n10 {
  margin-right: -10px !important;
}

.mr-n11 {
  margin-right: -11px !important;
}

.mr-n12 {
  margin-right: -12px !important;
}

.mr-n13 {
  margin-right: -13px !important;
}

.mr-n14 {
  margin-right: -14px !important;
}

.mr-n15 {
  margin-right: -15px !important;
}

.mr-n16 {
  margin-right: -16px !important;
}

.mr-n17 {
  margin-right: -17px !important;
}

.mr-n18 {
  margin-right: -18px !important;
}

.mr-n19 {
  margin-right: -19px !important;
}

.mr-n20 {
  margin-right: -20px !important;
}

.mr-n21 {
  margin-right: -21px !important;
}

.mr-n22 {
  margin-right: -22px !important;
}

.mr-n23 {
  margin-right: -23px !important;
}

.mr-n24 {
  margin-right: -24px !important;
}

.mr-n25 {
  margin-right: -25px !important;
}

.mr-n26 {
  margin-right: -26px !important;
}

.mr-n27 {
  margin-right: -27px !important;
}

.mr-n28 {
  margin-right: -28px !important;
}

.mr-n29 {
  margin-right: -29px !important;
}

.mr-n30 {
  margin-right: -30px !important;
}

.mr-n31 {
  margin-right: -31px !important;
}

.mr-n32 {
  margin-right: -32px !important;
}

.mr-n33 {
  margin-right: -33px !important;
}

.mr-n34 {
  margin-right: -34px !important;
}

.mr-n35 {
  margin-right: -35px !important;
}

.mr-n36 {
  margin-right: -36px !important;
}

.mr-n37 {
  margin-right: -37px !important;
}

.mr-n38 {
  margin-right: -38px !important;
}

.mr-n39 {
  margin-right: -39px !important;
}

.mr-n40 {
  margin-right: -40px !important;
}

.mr-n41 {
  margin-right: -41px !important;
}

.mr-n42 {
  margin-right: -42px !important;
}

.mr-n43 {
  margin-right: -43px !important;
}

.mr-n44 {
  margin-right: -44px !important;
}

.mr-n45 {
  margin-right: -45px !important;
}

.mr-n46 {
  margin-right: -46px !important;
}

.mr-n47 {
  margin-right: -47px !important;
}

.mr-n48 {
  margin-right: -48px !important;
}

.mx-n1 {
  margin-left: -1px !important;
  margin-right: -1px !important;
}

.mx-n2 {
  margin-left: -2px !important;
  margin-right: -2px !important;
}

.mx-n3 {
  margin-left: -3px !important;
  margin-right: -3px !important;
}

.mx-n4 {
  margin-left: -4px !important;
  margin-right: -4px !important;
}

.mx-n5 {
  margin-left: -5px !important;
  margin-right: -5px !important;
}

.mx-n6 {
  margin-left: -6px !important;
  margin-right: -6px !important;
}

.mx-n7 {
  margin-left: -7px !important;
  margin-right: -7px !important;
}

.mx-n8 {
  margin-left: -8px !important;
  margin-right: -8px !important;
}

.mx-n9 {
  margin-left: -9px !important;
  margin-right: -9px !important;
}

.mx-n10 {
  margin-left: -10px !important;
  margin-right: -10px !important;
}

.mx-n11 {
  margin-left: -11px !important;
  margin-right: -11px !important;
}

.mx-n12 {
  margin-left: -12px !important;
  margin-right: -12px !important;
}

.mx-n13 {
  margin-left: -13px !important;
  margin-right: -13px !important;
}

.mx-n14 {
  margin-left: -14px !important;
  margin-right: -14px !important;
}

.mx-n15 {
  margin-left: -15px !important;
  margin-right: -15px !important;
}

.mx-n16 {
  margin-left: -16px !important;
  margin-right: -16px !important;
}

.mx-n17 {
  margin-left: -17px !important;
  margin-right: -17px !important;
}

.mx-n18 {
  margin-left: -18px !important;
  margin-right: -18px !important;
}

.mx-n19 {
  margin-left: -19px !important;
  margin-right: -19px !important;
}

.mx-n20 {
  margin-left: -20px !important;
  margin-right: -20px !important;
}

.mx-n21 {
  margin-left: -21px !important;
  margin-right: -21px !important;
}

.mx-n22 {
  margin-left: -22px !important;
  margin-right: -22px !important;
}

.mx-n23 {
  margin-left: -23px !important;
  margin-right: -23px !important;
}

.mx-n24 {
  margin-left: -24px !important;
  margin-right: -24px !important;
}

.mx-n25 {
  margin-left: -25px !important;
  margin-right: -25px !important;
}

.mx-n26 {
  margin-left: -26px !important;
  margin-right: -26px !important;
}

.mx-n27 {
  margin-left: -27px !important;
  margin-right: -27px !important;
}

.mx-n28 {
  margin-left: -28px !important;
  margin-right: -28px !important;
}

.mx-n29 {
  margin-left: -29px !important;
  margin-right: -29px !important;
}

.mx-n30 {
  margin-left: -30px !important;
  margin-right: -30px !important;
}

.mx-n31 {
  margin-left: -31px !important;
  margin-right: -31px !important;
}

.mx-n32 {
  margin-left: -32px !important;
  margin-right: -32px !important;
}

.mx-n33 {
  margin-left: -33px !important;
  margin-right: -33px !important;
}

.mx-n34 {
  margin-left: -34px !important;
  margin-right: -34px !important;
}

.mx-n35 {
  margin-left: -35px !important;
  margin-right: -35px !important;
}

.mx-n36 {
  margin-left: -36px !important;
  margin-right: -36px !important;
}

.mx-n37 {
  margin-left: -37px !important;
  margin-right: -37px !important;
}

.mx-n38 {
  margin-left: -38px !important;
  margin-right: -38px !important;
}

.mx-n39 {
  margin-left: -39px !important;
  margin-right: -39px !important;
}

.mx-n40 {
  margin-left: -40px !important;
  margin-right: -40px !important;
}

.mx-n41 {
  margin-left: -41px !important;
  margin-right: -41px !important;
}

.mx-n42 {
  margin-left: -42px !important;
  margin-right: -42px !important;
}

.mx-n43 {
  margin-left: -43px !important;
  margin-right: -43px !important;
}

.mx-n44 {
  margin-left: -44px !important;
  margin-right: -44px !important;
}

.mx-n45 {
  margin-left: -45px !important;
  margin-right: -45px !important;
}

.mx-n46 {
  margin-left: -46px !important;
  margin-right: -46px !important;
}

.mx-n47 {
  margin-left: -47px !important;
  margin-right: -47px !important;
}

.mx-n48 {
  margin-left: -48px !important;
  margin-right: -48px !important;
}

.my-n1 {
  margin-top: -1px !important;
  margin-bottom: -1px !important;
}

.my-n2 {
  margin-top: -2px !important;
  margin-bottom: -2px !important;
}

.my-n3 {
  margin-top: -3px !important;
  margin-bottom: -3px !important;
}

.my-n4 {
  margin-top: -4px !important;
  margin-bottom: -4px !important;
}

.my-n5 {
  margin-top: -5px !important;
  margin-bottom: -5px !important;
}

.my-n6 {
  margin-top: -6px !important;
  margin-bottom: -6px !important;
}

.my-n7 {
  margin-top: -7px !important;
  margin-bottom: -7px !important;
}

.my-n8 {
  margin-top: -8px !important;
  margin-bottom: -8px !important;
}

.my-n9 {
  margin-top: -9px !important;
  margin-bottom: -9px !important;
}

.my-n10 {
  margin-top: -10px !important;
  margin-bottom: -10px !important;
}

.my-n11 {
  margin-top: -11px !important;
  margin-bottom: -11px !important;
}

.my-n12 {
  margin-top: -12px !important;
  margin-bottom: -12px !important;
}

.my-n13 {
  margin-top: -13px !important;
  margin-bottom: -13px !important;
}

.my-n14 {
  margin-top: -14px !important;
  margin-bottom: -14px !important;
}

.my-n15 {
  margin-top: -15px !important;
  margin-bottom: -15px !important;
}

.my-n16 {
  margin-top: -16px !important;
  margin-bottom: -16px !important;
}

.my-n17 {
  margin-top: -17px !important;
  margin-bottom: -17px !important;
}

.my-n18 {
  margin-top: -18px !important;
  margin-bottom: -18px !important;
}

.my-n19 {
  margin-top: -19px !important;
  margin-bottom: -19px !important;
}

.my-n20 {
  margin-top: -20px !important;
  margin-bottom: -20px !important;
}

.my-n21 {
  margin-top: -21px !important;
  margin-bottom: -21px !important;
}

.my-n22 {
  margin-top: -22px !important;
  margin-bottom: -22px !important;
}

.my-n23 {
  margin-top: -23px !important;
  margin-bottom: -23px !important;
}

.my-n24 {
  margin-top: -24px !important;
  margin-bottom: -24px !important;
}

.my-n25 {
  margin-top: -25px !important;
  margin-bottom: -25px !important;
}

.my-n26 {
  margin-top: -26px !important;
  margin-bottom: -26px !important;
}

.my-n27 {
  margin-top: -27px !important;
  margin-bottom: -27px !important;
}

.my-n28 {
  margin-top: -28px !important;
  margin-bottom: -28px !important;
}

.my-n29 {
  margin-top: -29px !important;
  margin-bottom: -29px !important;
}

.my-n30 {
  margin-top: -30px !important;
  margin-bottom: -30px !important;
}

.my-n31 {
  margin-top: -31px !important;
  margin-bottom: -31px !important;
}

.my-n32 {
  margin-top: -32px !important;
  margin-bottom: -32px !important;
}

.my-n33 {
  margin-top: -33px !important;
  margin-bottom: -33px !important;
}

.my-n34 {
  margin-top: -34px !important;
  margin-bottom: -34px !important;
}

.my-n35 {
  margin-top: -35px !important;
  margin-bottom: -35px !important;
}

.my-n36 {
  margin-top: -36px !important;
  margin-bottom: -36px !important;
}

.my-n37 {
  margin-top: -37px !important;
  margin-bottom: -37px !important;
}

.my-n38 {
  margin-top: -38px !important;
  margin-bottom: -38px !important;
}

.my-n39 {
  margin-top: -39px !important;
  margin-bottom: -39px !important;
}

.my-n40 {
  margin-top: -40px !important;
  margin-bottom: -40px !important;
}

.my-n41 {
  margin-top: -41px !important;
  margin-bottom: -41px !important;
}

.my-n42 {
  margin-top: -42px !important;
  margin-bottom: -42px !important;
}

.my-n43 {
  margin-top: -43px !important;
  margin-bottom: -43px !important;
}

.my-n44 {
  margin-top: -44px !important;
  margin-bottom: -44px !important;
}

.my-n45 {
  margin-top: -45px !important;
  margin-bottom: -45px !important;
}

.my-n46 {
  margin-top: -46px !important;
  margin-bottom: -46px !important;
}

.my-n47 {
  margin-top: -47px !important;
  margin-bottom: -47px !important;
}

.my-n48 {
  margin-top: -48px !important;
  margin-bottom: -48px !important;
}

.ma-n1 {
  margin-left: -1px !important;
  margin-top: -1px !important;
  margin-right: -1px !important;
  margin-bottom: -1px !important;
}

.ma-n2 {
  margin-left: -2px !important;
  margin-top: -2px !important;
  margin-right: -2px !important;
  margin-bottom: -2px !important;
}

.ma-n3 {
  margin-left: -3px !important;
  margin-top: -3px !important;
  margin-right: -3px !important;
  margin-bottom: -3px !important;
}

.ma-n4 {
  margin-left: -4px !important;
  margin-top: -4px !important;
  margin-right: -4px !important;
  margin-bottom: -4px !important;
}

.ma-n5 {
  margin-left: -5px !important;
  margin-top: -5px !important;
  margin-right: -5px !important;
  margin-bottom: -5px !important;
}

.ma-n6 {
  margin-left: -6px !important;
  margin-top: -6px !important;
  margin-right: -6px !important;
  margin-bottom: -6px !important;
}

.ma-n7 {
  margin-left: -7px !important;
  margin-top: -7px !important;
  margin-right: -7px !important;
  margin-bottom: -7px !important;
}

.ma-n8 {
  margin-left: -8px !important;
  margin-top: -8px !important;
  margin-right: -8px !important;
  margin-bottom: -8px !important;
}

.ma-n9 {
  margin-left: -9px !important;
  margin-top: -9px !important;
  margin-right: -9px !important;
  margin-bottom: -9px !important;
}

.ma-n10 {
  margin-left: -10px !important;
  margin-top: -10px !important;
  margin-right: -10px !important;
  margin-bottom: -10px !important;
}

.ma-n11 {
  margin-left: -11px !important;
  margin-top: -11px !important;
  margin-right: -11px !important;
  margin-bottom: -11px !important;
}

.ma-n12 {
  margin-left: -12px !important;
  margin-top: -12px !important;
  margin-right: -12px !important;
  margin-bottom: -12px !important;
}

.ma-n13 {
  margin-left: -13px !important;
  margin-top: -13px !important;
  margin-right: -13px !important;
  margin-bottom: -13px !important;
}

.ma-n14 {
  margin-left: -14px !important;
  margin-top: -14px !important;
  margin-right: -14px !important;
  margin-bottom: -14px !important;
}

.ma-n15 {
  margin-left: -15px !important;
  margin-top: -15px !important;
  margin-right: -15px !important;
  margin-bottom: -15px !important;
}

.ma-n16 {
  margin-left: -16px !important;
  margin-top: -16px !important;
  margin-right: -16px !important;
  margin-bottom: -16px !important;
}

.ma-n17 {
  margin-left: -17px !important;
  margin-top: -17px !important;
  margin-right: -17px !important;
  margin-bottom: -17px !important;
}

.ma-n18 {
  margin-left: -18px !important;
  margin-top: -18px !important;
  margin-right: -18px !important;
  margin-bottom: -18px !important;
}

.ma-n19 {
  margin-left: -19px !important;
  margin-top: -19px !important;
  margin-right: -19px !important;
  margin-bottom: -19px !important;
}

.ma-n20 {
  margin-left: -20px !important;
  margin-top: -20px !important;
  margin-right: -20px !important;
  margin-bottom: -20px !important;
}

.ma-n21 {
  margin-left: -21px !important;
  margin-top: -21px !important;
  margin-right: -21px !important;
  margin-bottom: -21px !important;
}

.ma-n22 {
  margin-left: -22px !important;
  margin-top: -22px !important;
  margin-right: -22px !important;
  margin-bottom: -22px !important;
}

.ma-n23 {
  margin-left: -23px !important;
  margin-top: -23px !important;
  margin-right: -23px !important;
  margin-bottom: -23px !important;
}

.ma-n24 {
  margin-left: -24px !important;
  margin-top: -24px !important;
  margin-right: -24px !important;
  margin-bottom: -24px !important;
}

.ma-n25 {
  margin-left: -25px !important;
  margin-top: -25px !important;
  margin-right: -25px !important;
  margin-bottom: -25px !important;
}

.ma-n26 {
  margin-left: -26px !important;
  margin-top: -26px !important;
  margin-right: -26px !important;
  margin-bottom: -26px !important;
}

.ma-n27 {
  margin-left: -27px !important;
  margin-top: -27px !important;
  margin-right: -27px !important;
  margin-bottom: -27px !important;
}

.ma-n28 {
  margin-left: -28px !important;
  margin-top: -28px !important;
  margin-right: -28px !important;
  margin-bottom: -28px !important;
}

.ma-n29 {
  margin-left: -29px !important;
  margin-top: -29px !important;
  margin-right: -29px !important;
  margin-bottom: -29px !important;
}

.ma-n30 {
  margin-left: -30px !important;
  margin-top: -30px !important;
  margin-right: -30px !important;
  margin-bottom: -30px !important;
}

.ma-n31 {
  margin-left: -31px !important;
  margin-top: -31px !important;
  margin-right: -31px !important;
  margin-bottom: -31px !important;
}

.ma-n32 {
  margin-left: -32px !important;
  margin-top: -32px !important;
  margin-right: -32px !important;
  margin-bottom: -32px !important;
}

.ma-n33 {
  margin-left: -33px !important;
  margin-top: -33px !important;
  margin-right: -33px !important;
  margin-bottom: -33px !important;
}

.ma-n34 {
  margin-left: -34px !important;
  margin-top: -34px !important;
  margin-right: -34px !important;
  margin-bottom: -34px !important;
}

.ma-n35 {
  margin-left: -35px !important;
  margin-top: -35px !important;
  margin-right: -35px !important;
  margin-bottom: -35px !important;
}

.ma-n36 {
  margin-left: -36px !important;
  margin-top: -36px !important;
  margin-right: -36px !important;
  margin-bottom: -36px !important;
}

.ma-n37 {
  margin-left: -37px !important;
  margin-top: -37px !important;
  margin-right: -37px !important;
  margin-bottom: -37px !important;
}

.ma-n38 {
  margin-left: -38px !important;
  margin-top: -38px !important;
  margin-right: -38px !important;
  margin-bottom: -38px !important;
}

.ma-n39 {
  margin-left: -39px !important;
  margin-top: -39px !important;
  margin-right: -39px !important;
  margin-bottom: -39px !important;
}

.ma-n40 {
  margin-left: -40px !important;
  margin-top: -40px !important;
  margin-right: -40px !important;
  margin-bottom: -40px !important;
}

.ma-n41 {
  margin-left: -41px !important;
  margin-top: -41px !important;
  margin-right: -41px !important;
  margin-bottom: -41px !important;
}

.ma-n42 {
  margin-left: -42px !important;
  margin-top: -42px !important;
  margin-right: -42px !important;
  margin-bottom: -42px !important;
}

.ma-n43 {
  margin-left: -43px !important;
  margin-top: -43px !important;
  margin-right: -43px !important;
  margin-bottom: -43px !important;
}

.ma-n44 {
  margin-left: -44px !important;
  margin-top: -44px !important;
  margin-right: -44px !important;
  margin-bottom: -44px !important;
}

.ma-n45 {
  margin-left: -45px !important;
  margin-top: -45px !important;
  margin-right: -45px !important;
  margin-bottom: -45px !important;
}

.ma-n46 {
  margin-left: -46px !important;
  margin-top: -46px !important;
  margin-right: -46px !important;
  margin-bottom: -46px !important;
}

.ma-n47 {
  margin-left: -47px !important;
  margin-top: -47px !important;
  margin-right: -47px !important;
  margin-bottom: -47px !important;
}

.ma-n48 {
  margin-left: -48px !important;
  margin-top: -48px !important;
  margin-right: -48px !important;
  margin-bottom: -48px !important;
}

.pt-0 {
  padding-top: 0px !important;
}

.pt-1 {
  padding-top: 1px !important;
}

.pt-2 {
  padding-top: 2px !important;
}

.pt-3 {
  padding-top: 3px !important;
}

.pt-4 {
  padding-top: 4px !important;
}

.pt-5 {
  padding-top: 5px !important;
}

.pt-6 {
  padding-top: 6px !important;
}

.pt-7 {
  padding-top: 7px !important;
}

.pt-8 {
  padding-top: 8px !important;
}

.pt-9 {
  padding-top: 9px !important;
}

.pt-10 {
  padding-top: 10px !important;
}

.pt-11 {
  padding-top: 11px !important;
}

.pt-12 {
  padding-top: 12px !important;
}

.pt-13 {
  padding-top: 13px !important;
}

.pt-14 {
  padding-top: 14px !important;
}

.pt-15 {
  padding-top: 15px !important;
}

.pt-16 {
  padding-top: 16px !important;
}

.pt-17 {
  padding-top: 17px !important;
}

.pt-18 {
  padding-top: 18px !important;
}

.pt-19 {
  padding-top: 19px !important;
}

.pt-20 {
  padding-top: 20px !important;
}

.pt-21 {
  padding-top: 21px !important;
}

.pt-22 {
  padding-top: 22px !important;
}

.pt-23 {
  padding-top: 23px !important;
}

.pt-24 {
  padding-top: 24px !important;
}

.pt-25 {
  padding-top: 25px !important;
}

.pt-26 {
  padding-top: 26px !important;
}

.pt-27 {
  padding-top: 27px !important;
}

.pt-28 {
  padding-top: 28px !important;
}

.pt-29 {
  padding-top: 29px !important;
}

.pt-30 {
  padding-top: 30px !important;
}

.pt-31 {
  padding-top: 31px !important;
}

.pt-32 {
  padding-top: 32px !important;
}

.pt-33 {
  padding-top: 33px !important;
}

.pt-34 {
  padding-top: 34px !important;
}

.pt-35 {
  padding-top: 35px !important;
}

.pt-36 {
  padding-top: 36px !important;
}

.pt-37 {
  padding-top: 37px !important;
}

.pt-38 {
  padding-top: 38px !important;
}

.pt-39 {
  padding-top: 39px !important;
}

.pt-40 {
  padding-top: 40px !important;
}

.pt-41 {
  padding-top: 41px !important;
}

.pt-42 {
  padding-top: 42px !important;
}

.pt-43 {
  padding-top: 43px !important;
}

.pt-44 {
  padding-top: 44px !important;
}

.pt-45 {
  padding-top: 45px !important;
}

.pt-46 {
  padding-top: 46px !important;
}

.pt-47 {
  padding-top: 47px !important;
}

.pt-48 {
  padding-top: 48px !important;
}

.pt-56 {
  padding-top: 56px !important;
}

.pt-64 {
  padding-top: 64px !important;
}

.pt-72 {
  padding-top: 72px !important;
}

.pt-80 {
  padding-top: 80px !important;
}

.pt-88 {
  padding-top: 88px !important;
}

.pt-96 {
  padding-top: 96px !important;
}

.pt-104 {
  padding-top: 104px !important;
}

.pt-112 {
  padding-top: 112px !important;
}

.pt-120 {
  padding-top: 120px !important;
}

.pt-128 {
  padding-top: 128px !important;
}

.pt-136 {
  padding-top: 136px !important;
}

.pt-144 {
  padding-top: 144px !important;
}

.pt-152 {
  padding-top: 152px !important;
}

.pt-160 {
  padding-top: 160px !important;
}

.pt-168 {
  padding-top: 168px !important;
}

.pt-176 {
  padding-top: 176px !important;
}

.pt-184 {
  padding-top: 184px !important;
}

.pt-192 {
  padding-top: 192px !important;
}

.pt-200 {
  padding-top: 200px !important;
}

.pb-0 {
  padding-bottom: 0px !important;
}

.pb-1 {
  padding-bottom: 1px !important;
}

.pb-2 {
  padding-bottom: 2px !important;
}

.pb-3 {
  padding-bottom: 3px !important;
}

.pb-4 {
  padding-bottom: 4px !important;
}

.pb-5 {
  padding-bottom: 5px !important;
}

.pb-6 {
  padding-bottom: 6px !important;
}

.pb-7 {
  padding-bottom: 7px !important;
}

.pb-8 {
  padding-bottom: 8px !important;
}

.pb-9 {
  padding-bottom: 9px !important;
}

.pb-10 {
  padding-bottom: 10px !important;
}

.pb-11 {
  padding-bottom: 11px !important;
}

.pb-12 {
  padding-bottom: 12px !important;
}

.pb-13 {
  padding-bottom: 13px !important;
}

.pb-14 {
  padding-bottom: 14px !important;
}

.pb-15 {
  padding-bottom: 15px !important;
}

.pb-16 {
  padding-bottom: 16px !important;
}

.pb-17 {
  padding-bottom: 17px !important;
}

.pb-18 {
  padding-bottom: 18px !important;
}

.pb-19 {
  padding-bottom: 19px !important;
}

.pb-20 {
  padding-bottom: 20px !important;
}

.pb-21 {
  padding-bottom: 21px !important;
}

.pb-22 {
  padding-bottom: 22px !important;
}

.pb-23 {
  padding-bottom: 23px !important;
}

.pb-24 {
  padding-bottom: 24px !important;
}

.pb-25 {
  padding-bottom: 25px !important;
}

.pb-26 {
  padding-bottom: 26px !important;
}

.pb-27 {
  padding-bottom: 27px !important;
}

.pb-28 {
  padding-bottom: 28px !important;
}

.pb-29 {
  padding-bottom: 29px !important;
}

.pb-30 {
  padding-bottom: 30px !important;
}

.pb-31 {
  padding-bottom: 31px !important;
}

.pb-32 {
  padding-bottom: 32px !important;
}

.pb-33 {
  padding-bottom: 33px !important;
}

.pb-34 {
  padding-bottom: 34px !important;
}

.pb-35 {
  padding-bottom: 35px !important;
}

.pb-36 {
  padding-bottom: 36px !important;
}

.pb-37 {
  padding-bottom: 37px !important;
}

.pb-38 {
  padding-bottom: 38px !important;
}

.pb-39 {
  padding-bottom: 39px !important;
}

.pb-40 {
  padding-bottom: 40px !important;
}

.pb-41 {
  padding-bottom: 41px !important;
}

.pb-42 {
  padding-bottom: 42px !important;
}

.pb-43 {
  padding-bottom: 43px !important;
}

.pb-44 {
  padding-bottom: 44px !important;
}

.pb-45 {
  padding-bottom: 45px !important;
}

.pb-46 {
  padding-bottom: 46px !important;
}

.pb-47 {
  padding-bottom: 47px !important;
}

.pb-48 {
  padding-bottom: 48px !important;
}

.pb-56 {
  padding-bottom: 56px !important;
}

.pb-64 {
  padding-bottom: 64px !important;
}

.pb-72 {
  padding-bottom: 72px !important;
}

.pb-80 {
  padding-bottom: 80px !important;
}

.pb-88 {
  padding-bottom: 88px !important;
}

.pb-96 {
  padding-bottom: 96px !important;
}

.pb-104 {
  padding-bottom: 104px !important;
}

.pb-112 {
  padding-bottom: 112px !important;
}

.pb-120 {
  padding-bottom: 120px !important;
}

.pb-128 {
  padding-bottom: 128px !important;
}

.pb-136 {
  padding-bottom: 136px !important;
}

.pb-144 {
  padding-bottom: 144px !important;
}

.pb-152 {
  padding-bottom: 152px !important;
}

.pb-160 {
  padding-bottom: 160px !important;
}

.pb-168 {
  padding-bottom: 168px !important;
}

.pb-176 {
  padding-bottom: 176px !important;
}

.pb-184 {
  padding-bottom: 184px !important;
}

.pb-192 {
  padding-bottom: 192px !important;
}

.pb-200 {
  padding-bottom: 200px !important;
}

.pl-0 {
  padding-left: 0px !important;
}

.pl-1 {
  padding-left: 1px !important;
}

.pl-2 {
  padding-left: 2px !important;
}

.pl-3 {
  padding-left: 3px !important;
}

.pl-4 {
  padding-left: 4px !important;
}

.pl-5 {
  padding-left: 5px !important;
}

.pl-6 {
  padding-left: 6px !important;
}

.pl-7 {
  padding-left: 7px !important;
}

.pl-8 {
  padding-left: 8px !important;
}

.pl-9 {
  padding-left: 9px !important;
}

.pl-10 {
  padding-left: 10px !important;
}

.pl-11 {
  padding-left: 11px !important;
}

.pl-12 {
  padding-left: 12px !important;
}

.pl-13 {
  padding-left: 13px !important;
}

.pl-14 {
  padding-left: 14px !important;
}

.pl-15 {
  padding-left: 15px !important;
}

.pl-16 {
  padding-left: 16px !important;
}

.pl-17 {
  padding-left: 17px !important;
}

.pl-18 {
  padding-left: 18px !important;
}

.pl-19 {
  padding-left: 19px !important;
}

.pl-20 {
  padding-left: 20px !important;
}

.pl-21 {
  padding-left: 21px !important;
}

.pl-22 {
  padding-left: 22px !important;
}

.pl-23 {
  padding-left: 23px !important;
}

.pl-24 {
  padding-left: 24px !important;
}

.pl-25 {
  padding-left: 25px !important;
}

.pl-26 {
  padding-left: 26px !important;
}

.pl-27 {
  padding-left: 27px !important;
}

.pl-28 {
  padding-left: 28px !important;
}

.pl-29 {
  padding-left: 29px !important;
}

.pl-30 {
  padding-left: 30px !important;
}

.pl-31 {
  padding-left: 31px !important;
}

.pl-32 {
  padding-left: 32px !important;
}

.pl-33 {
  padding-left: 33px !important;
}

.pl-34 {
  padding-left: 34px !important;
}

.pl-35 {
  padding-left: 35px !important;
}

.pl-36 {
  padding-left: 36px !important;
}

.pl-37 {
  padding-left: 37px !important;
}

.pl-38 {
  padding-left: 38px !important;
}

.pl-39 {
  padding-left: 39px !important;
}

.pl-40 {
  padding-left: 40px !important;
}

.pl-41 {
  padding-left: 41px !important;
}

.pl-42 {
  padding-left: 42px !important;
}

.pl-43 {
  padding-left: 43px !important;
}

.pl-44 {
  padding-left: 44px !important;
}

.pl-45 {
  padding-left: 45px !important;
}

.pl-46 {
  padding-left: 46px !important;
}

.pl-47 {
  padding-left: 47px !important;
}

.pl-48 {
  padding-left: 48px !important;
}

.pl-56 {
  padding-left: 56px !important;
}

.pl-64 {
  padding-left: 64px !important;
}

.pl-72 {
  padding-left: 72px !important;
}

.pl-80 {
  padding-left: 80px !important;
}

.pl-88 {
  padding-left: 88px !important;
}

.pl-96 {
  padding-left: 96px !important;
}

.pl-104 {
  padding-left: 104px !important;
}

.pl-112 {
  padding-left: 112px !important;
}

.pl-120 {
  padding-left: 120px !important;
}

.pl-128 {
  padding-left: 128px !important;
}

.pl-136 {
  padding-left: 136px !important;
}

.pl-144 {
  padding-left: 144px !important;
}

.pl-152 {
  padding-left: 152px !important;
}

.pl-160 {
  padding-left: 160px !important;
}

.pl-168 {
  padding-left: 168px !important;
}

.pl-176 {
  padding-left: 176px !important;
}

.pl-184 {
  padding-left: 184px !important;
}

.pl-192 {
  padding-left: 192px !important;
}

.pl-200 {
  padding-left: 200px !important;
}

.pr-0 {
  padding-right: 0px !important;
}

.pr-1 {
  padding-right: 1px !important;
}

.pr-2 {
  padding-right: 2px !important;
}

.pr-3 {
  padding-right: 3px !important;
}

.pr-4 {
  padding-right: 4px !important;
}

.pr-5 {
  padding-right: 5px !important;
}

.pr-6 {
  padding-right: 6px !important;
}

.pr-7 {
  padding-right: 7px !important;
}

.pr-8 {
  padding-right: 8px !important;
}

.pr-9 {
  padding-right: 9px !important;
}

.pr-10 {
  padding-right: 10px !important;
}

.pr-11 {
  padding-right: 11px !important;
}

.pr-12 {
  padding-right: 12px !important;
}

.pr-13 {
  padding-right: 13px !important;
}

.pr-14 {
  padding-right: 14px !important;
}

.pr-15 {
  padding-right: 15px !important;
}

.pr-16 {
  padding-right: 16px !important;
}

.pr-17 {
  padding-right: 17px !important;
}

.pr-18 {
  padding-right: 18px !important;
}

.pr-19 {
  padding-right: 19px !important;
}

.pr-20 {
  padding-right: 20px !important;
}

.pr-21 {
  padding-right: 21px !important;
}

.pr-22 {
  padding-right: 22px !important;
}

.pr-23 {
  padding-right: 23px !important;
}

.pr-24 {
  padding-right: 24px !important;
}

.pr-25 {
  padding-right: 25px !important;
}

.pr-26 {
  padding-right: 26px !important;
}

.pr-27 {
  padding-right: 27px !important;
}

.pr-28 {
  padding-right: 28px !important;
}

.pr-29 {
  padding-right: 29px !important;
}

.pr-30 {
  padding-right: 30px !important;
}

.pr-31 {
  padding-right: 31px !important;
}

.pr-32 {
  padding-right: 32px !important;
}

.pr-33 {
  padding-right: 33px !important;
}

.pr-34 {
  padding-right: 34px !important;
}

.pr-35 {
  padding-right: 35px !important;
}

.pr-36 {
  padding-right: 36px !important;
}

.pr-37 {
  padding-right: 37px !important;
}

.pr-38 {
  padding-right: 38px !important;
}

.pr-39 {
  padding-right: 39px !important;
}

.pr-40 {
  padding-right: 40px !important;
}

.pr-41 {
  padding-right: 41px !important;
}

.pr-42 {
  padding-right: 42px !important;
}

.pr-43 {
  padding-right: 43px !important;
}

.pr-44 {
  padding-right: 44px !important;
}

.pr-45 {
  padding-right: 45px !important;
}

.pr-46 {
  padding-right: 46px !important;
}

.pr-47 {
  padding-right: 47px !important;
}

.pr-48 {
  padding-right: 48px !important;
}

.pr-56 {
  padding-right: 56px !important;
}

.pr-64 {
  padding-right: 64px !important;
}

.pr-72 {
  padding-right: 72px !important;
}

.pr-80 {
  padding-right: 80px !important;
}

.pr-88 {
  padding-right: 88px !important;
}

.pr-96 {
  padding-right: 96px !important;
}

.pr-104 {
  padding-right: 104px !important;
}

.pr-112 {
  padding-right: 112px !important;
}

.pr-120 {
  padding-right: 120px !important;
}

.pr-128 {
  padding-right: 128px !important;
}

.pr-136 {
  padding-right: 136px !important;
}

.pr-144 {
  padding-right: 144px !important;
}

.pr-152 {
  padding-right: 152px !important;
}

.pr-160 {
  padding-right: 160px !important;
}

.pr-168 {
  padding-right: 168px !important;
}

.pr-176 {
  padding-right: 176px !important;
}

.pr-184 {
  padding-right: 184px !important;
}

.pr-192 {
  padding-right: 192px !important;
}

.pr-200 {
  padding-right: 200px !important;
}

.px-0 {
  padding-left: 0px !important;
  padding-right: 0px !important;
}

.px-1 {
  padding-left: 1px !important;
  padding-right: 1px !important;
}

.px-2 {
  padding-left: 2px !important;
  padding-right: 2px !important;
}

.px-3 {
  padding-left: 3px !important;
  padding-right: 3px !important;
}

.px-4 {
  padding-left: 4px !important;
  padding-right: 4px !important;
}

.px-5 {
  padding-left: 5px !important;
  padding-right: 5px !important;
}

.px-6 {
  padding-left: 6px !important;
  padding-right: 6px !important;
}

.px-7 {
  padding-left: 7px !important;
  padding-right: 7px !important;
}

.px-8 {
  padding-left: 8px !important;
  padding-right: 8px !important;
}

.px-9 {
  padding-left: 9px !important;
  padding-right: 9px !important;
}

.px-10 {
  padding-left: 10px !important;
  padding-right: 10px !important;
}

.px-11 {
  padding-left: 11px !important;
  padding-right: 11px !important;
}

.px-12 {
  padding-left: 12px !important;
  padding-right: 12px !important;
}

.px-13 {
  padding-left: 13px !important;
  padding-right: 13px !important;
}

.px-14 {
  padding-left: 14px !important;
  padding-right: 14px !important;
}

.px-15 {
  padding-left: 15px !important;
  padding-right: 15px !important;
}

.px-16 {
  padding-left: 16px !important;
  padding-right: 16px !important;
}

.px-17 {
  padding-left: 17px !important;
  padding-right: 17px !important;
}

.px-18 {
  padding-left: 18px !important;
  padding-right: 18px !important;
}

.px-19 {
  padding-left: 19px !important;
  padding-right: 19px !important;
}

.px-20 {
  padding-left: 20px !important;
  padding-right: 20px !important;
}

.px-21 {
  padding-left: 21px !important;
  padding-right: 21px !important;
}

.px-22 {
  padding-left: 22px !important;
  padding-right: 22px !important;
}

.px-23 {
  padding-left: 23px !important;
  padding-right: 23px !important;
}

.px-24 {
  padding-left: 24px !important;
  padding-right: 24px !important;
}

.px-25 {
  padding-left: 25px !important;
  padding-right: 25px !important;
}

.px-26 {
  padding-left: 26px !important;
  padding-right: 26px !important;
}

.px-27 {
  padding-left: 27px !important;
  padding-right: 27px !important;
}

.px-28 {
  padding-left: 28px !important;
  padding-right: 28px !important;
}

.px-29 {
  padding-left: 29px !important;
  padding-right: 29px !important;
}

.px-30 {
  padding-left: 30px !important;
  padding-right: 30px !important;
}

.px-31 {
  padding-left: 31px !important;
  padding-right: 31px !important;
}

.px-32 {
  padding-left: 32px !important;
  padding-right: 32px !important;
}

.px-33 {
  padding-left: 33px !important;
  padding-right: 33px !important;
}

.px-34 {
  padding-left: 34px !important;
  padding-right: 34px !important;
}

.px-35 {
  padding-left: 35px !important;
  padding-right: 35px !important;
}

.px-36 {
  padding-left: 36px !important;
  padding-right: 36px !important;
}

.px-37 {
  padding-left: 37px !important;
  padding-right: 37px !important;
}

.px-38 {
  padding-left: 38px !important;
  padding-right: 38px !important;
}

.px-39 {
  padding-left: 39px !important;
  padding-right: 39px !important;
}

.px-40 {
  padding-left: 40px !important;
  padding-right: 40px !important;
}

.px-41 {
  padding-left: 41px !important;
  padding-right: 41px !important;
}

.px-42 {
  padding-left: 42px !important;
  padding-right: 42px !important;
}

.px-43 {
  padding-left: 43px !important;
  padding-right: 43px !important;
}

.px-44 {
  padding-left: 44px !important;
  padding-right: 44px !important;
}

.px-45 {
  padding-left: 45px !important;
  padding-right: 45px !important;
}

.px-46 {
  padding-left: 46px !important;
  padding-right: 46px !important;
}

.px-47 {
  padding-left: 47px !important;
  padding-right: 47px !important;
}

.px-48 {
  padding-left: 48px !important;
  padding-right: 48px !important;
}

.px-56 {
  padding-left: 56px !important;
  padding-right: 56px !important;
}

.px-64 {
  padding-left: 64px !important;
  padding-right: 64px !important;
}

.px-72 {
  padding-left: 72px !important;
  padding-right: 72px !important;
}

.px-80 {
  padding-left: 80px !important;
  padding-right: 80px !important;
}

.px-88 {
  padding-left: 88px !important;
  padding-right: 88px !important;
}

.px-96 {
  padding-left: 96px !important;
  padding-right: 96px !important;
}

.px-104 {
  padding-left: 104px !important;
  padding-right: 104px !important;
}

.px-112 {
  padding-left: 112px !important;
  padding-right: 112px !important;
}

.px-120 {
  padding-left: 120px !important;
  padding-right: 120px !important;
}

.px-128 {
  padding-left: 128px !important;
  padding-right: 128px !important;
}

.px-136 {
  padding-left: 136px !important;
  padding-right: 136px !important;
}

.px-144 {
  padding-left: 144px !important;
  padding-right: 144px !important;
}

.px-152 {
  padding-left: 152px !important;
  padding-right: 152px !important;
}

.px-160 {
  padding-left: 160px !important;
  padding-right: 160px !important;
}

.px-168 {
  padding-left: 168px !important;
  padding-right: 168px !important;
}

.px-176 {
  padding-left: 176px !important;
  padding-right: 176px !important;
}

.px-184 {
  padding-left: 184px !important;
  padding-right: 184px !important;
}

.px-192 {
  padding-left: 192px !important;
  padding-right: 192px !important;
}

.px-200 {
  padding-left: 200px !important;
  padding-right: 200px !important;
}

.py-0 {
  padding-top: 0px !important;
  padding-bottom: 0px !important;
}

.py-1 {
  padding-top: 1px !important;
  padding-bottom: 1px !important;
}

.py-2 {
  padding-top: 2px !important;
  padding-bottom: 2px !important;
}

.py-3 {
  padding-top: 3px !important;
  padding-bottom: 3px !important;
}

.py-4 {
  padding-top: 4px !important;
  padding-bottom: 4px !important;
}

.py-5 {
  padding-top: 5px !important;
  padding-bottom: 5px !important;
}

.py-6 {
  padding-top: 6px !important;
  padding-bottom: 6px !important;
}

.py-7 {
  padding-top: 7px !important;
  padding-bottom: 7px !important;
}

.py-8 {
  padding-top: 8px !important;
  padding-bottom: 8px !important;
}

.py-9 {
  padding-top: 9px !important;
  padding-bottom: 9px !important;
}

.py-10 {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}

.py-11 {
  padding-top: 11px !important;
  padding-bottom: 11px !important;
}

.py-12 {
  padding-top: 12px !important;
  padding-bottom: 12px !important;
}

.py-13 {
  padding-top: 13px !important;
  padding-bottom: 13px !important;
}

.py-14 {
  padding-top: 14px !important;
  padding-bottom: 14px !important;
}

.py-15 {
  padding-top: 15px !important;
  padding-bottom: 15px !important;
}

.py-16 {
  padding-top: 16px !important;
  padding-bottom: 16px !important;
}

.py-17 {
  padding-top: 17px !important;
  padding-bottom: 17px !important;
}

.py-18 {
  padding-top: 18px !important;
  padding-bottom: 18px !important;
}

.py-19 {
  padding-top: 19px !important;
  padding-bottom: 19px !important;
}

.py-20 {
  padding-top: 20px !important;
  padding-bottom: 20px !important;
}

.py-21 {
  padding-top: 21px !important;
  padding-bottom: 21px !important;
}

.py-22 {
  padding-top: 22px !important;
  padding-bottom: 22px !important;
}

.py-23 {
  padding-top: 23px !important;
  padding-bottom: 23px !important;
}

.py-24 {
  padding-top: 24px !important;
  padding-bottom: 24px !important;
}

.py-25 {
  padding-top: 25px !important;
  padding-bottom: 25px !important;
}

.py-26 {
  padding-top: 26px !important;
  padding-bottom: 26px !important;
}

.py-27 {
  padding-top: 27px !important;
  padding-bottom: 27px !important;
}

.py-28 {
  padding-top: 28px !important;
  padding-bottom: 28px !important;
}

.py-29 {
  padding-top: 29px !important;
  padding-bottom: 29px !important;
}

.py-30 {
  padding-top: 30px !important;
  padding-bottom: 30px !important;
}

.py-31 {
  padding-top: 31px !important;
  padding-bottom: 31px !important;
}

.py-32 {
  padding-top: 32px !important;
  padding-bottom: 32px !important;
}

.py-33 {
  padding-top: 33px !important;
  padding-bottom: 33px !important;
}

.py-34 {
  padding-top: 34px !important;
  padding-bottom: 34px !important;
}

.py-35 {
  padding-top: 35px !important;
  padding-bottom: 35px !important;
}

.py-36 {
  padding-top: 36px !important;
  padding-bottom: 36px !important;
}

.py-37 {
  padding-top: 37px !important;
  padding-bottom: 37px !important;
}

.py-38 {
  padding-top: 38px !important;
  padding-bottom: 38px !important;
}

.py-39 {
  padding-top: 39px !important;
  padding-bottom: 39px !important;
}

.py-40 {
  padding-top: 40px !important;
  padding-bottom: 40px !important;
}

.py-41 {
  padding-top: 41px !important;
  padding-bottom: 41px !important;
}

.py-42 {
  padding-top: 42px !important;
  padding-bottom: 42px !important;
}

.py-43 {
  padding-top: 43px !important;
  padding-bottom: 43px !important;
}

.py-44 {
  padding-top: 44px !important;
  padding-bottom: 44px !important;
}

.py-45 {
  padding-top: 45px !important;
  padding-bottom: 45px !important;
}

.py-46 {
  padding-top: 46px !important;
  padding-bottom: 46px !important;
}

.py-47 {
  padding-top: 47px !important;
  padding-bottom: 47px !important;
}

.py-48 {
  padding-top: 48px !important;
  padding-bottom: 48px !important;
}

.py-56 {
  padding-top: 56px !important;
  padding-bottom: 56px !important;
}

.py-64 {
  padding-top: 64px !important;
  padding-bottom: 64px !important;
}

.py-72 {
  padding-top: 72px !important;
  padding-bottom: 72px !important;
}

.py-80 {
  padding-top: 80px !important;
  padding-bottom: 80px !important;
}

.py-88 {
  padding-top: 88px !important;
  padding-bottom: 88px !important;
}

.py-96 {
  padding-top: 96px !important;
  padding-bottom: 96px !important;
}

.py-104 {
  padding-top: 104px !important;
  padding-bottom: 104px !important;
}

.py-112 {
  padding-top: 112px !important;
  padding-bottom: 112px !important;
}

.py-120 {
  padding-top: 120px !important;
  padding-bottom: 120px !important;
}

.py-128 {
  padding-top: 128px !important;
  padding-bottom: 128px !important;
}

.py-136 {
  padding-top: 136px !important;
  padding-bottom: 136px !important;
}

.py-144 {
  padding-top: 144px !important;
  padding-bottom: 144px !important;
}

.py-152 {
  padding-top: 152px !important;
  padding-bottom: 152px !important;
}

.py-160 {
  padding-top: 160px !important;
  padding-bottom: 160px !important;
}

.py-168 {
  padding-top: 168px !important;
  padding-bottom: 168px !important;
}

.py-176 {
  padding-top: 176px !important;
  padding-bottom: 176px !important;
}

.py-184 {
  padding-top: 184px !important;
  padding-bottom: 184px !important;
}

.py-192 {
  padding-top: 192px !important;
  padding-bottom: 192px !important;
}

.py-200 {
  padding-top: 200px !important;
  padding-bottom: 200px !important;
}

.pa-0 {
  padding-left: 0px !important;
  padding-top: 0px !important;
  padding-right: 0px !important;
  padding-bottom: 0px !important;
}

.pa-1 {
  padding-left: 1px !important;
  padding-top: 1px !important;
  padding-right: 1px !important;
  padding-bottom: 1px !important;
}

.pa-2 {
  padding-left: 2px !important;
  padding-top: 2px !important;
  padding-right: 2px !important;
  padding-bottom: 2px !important;
}

.pa-3 {
  padding-left: 3px !important;
  padding-top: 3px !important;
  padding-right: 3px !important;
  padding-bottom: 3px !important;
}

.pa-4 {
  padding-left: 4px !important;
  padding-top: 4px !important;
  padding-right: 4px !important;
  padding-bottom: 4px !important;
}

.pa-5 {
  padding-left: 5px !important;
  padding-top: 5px !important;
  padding-right: 5px !important;
  padding-bottom: 5px !important;
}

.pa-6 {
  padding-left: 6px !important;
  padding-top: 6px !important;
  padding-right: 6px !important;
  padding-bottom: 6px !important;
}

.pa-7 {
  padding-left: 7px !important;
  padding-top: 7px !important;
  padding-right: 7px !important;
  padding-bottom: 7px !important;
}

.pa-8 {
  padding-left: 8px !important;
  padding-top: 8px !important;
  padding-right: 8px !important;
  padding-bottom: 8px !important;
}

.pa-9 {
  padding-left: 9px !important;
  padding-top: 9px !important;
  padding-right: 9px !important;
  padding-bottom: 9px !important;
}

.pa-10 {
  padding-left: 10px !important;
  padding-top: 10px !important;
  padding-right: 10px !important;
  padding-bottom: 10px !important;
}

.pa-11 {
  padding-left: 11px !important;
  padding-top: 11px !important;
  padding-right: 11px !important;
  padding-bottom: 11px !important;
}

.pa-12 {
  padding-left: 12px !important;
  padding-top: 12px !important;
  padding-right: 12px !important;
  padding-bottom: 12px !important;
}

.pa-13 {
  padding-left: 13px !important;
  padding-top: 13px !important;
  padding-right: 13px !important;
  padding-bottom: 13px !important;
}

.pa-14 {
  padding-left: 14px !important;
  padding-top: 14px !important;
  padding-right: 14px !important;
  padding-bottom: 14px !important;
}

.pa-15 {
  padding-left: 15px !important;
  padding-top: 15px !important;
  padding-right: 15px !important;
  padding-bottom: 15px !important;
}

.pa-16 {
  padding-left: 16px !important;
  padding-top: 16px !important;
  padding-right: 16px !important;
  padding-bottom: 16px !important;
}

.pa-17 {
  padding-left: 17px !important;
  padding-top: 17px !important;
  padding-right: 17px !important;
  padding-bottom: 17px !important;
}

.pa-18 {
  padding-left: 18px !important;
  padding-top: 18px !important;
  padding-right: 18px !important;
  padding-bottom: 18px !important;
}

.pa-19 {
  padding-left: 19px !important;
  padding-top: 19px !important;
  padding-right: 19px !important;
  padding-bottom: 19px !important;
}

.pa-20 {
  padding-left: 20px !important;
  padding-top: 20px !important;
  padding-right: 20px !important;
  padding-bottom: 20px !important;
}

.pa-21 {
  padding-left: 21px !important;
  padding-top: 21px !important;
  padding-right: 21px !important;
  padding-bottom: 21px !important;
}

.pa-22 {
  padding-left: 22px !important;
  padding-top: 22px !important;
  padding-right: 22px !important;
  padding-bottom: 22px !important;
}

.pa-23 {
  padding-left: 23px !important;
  padding-top: 23px !important;
  padding-right: 23px !important;
  padding-bottom: 23px !important;
}

.pa-24 {
  padding-left: 24px !important;
  padding-top: 24px !important;
  padding-right: 24px !important;
  padding-bottom: 24px !important;
}

.pa-25 {
  padding-left: 25px !important;
  padding-top: 25px !important;
  padding-right: 25px !important;
  padding-bottom: 25px !important;
}

.pa-26 {
  padding-left: 26px !important;
  padding-top: 26px !important;
  padding-right: 26px !important;
  padding-bottom: 26px !important;
}

.pa-27 {
  padding-left: 27px !important;
  padding-top: 27px !important;
  padding-right: 27px !important;
  padding-bottom: 27px !important;
}

.pa-28 {
  padding-left: 28px !important;
  padding-top: 28px !important;
  padding-right: 28px !important;
  padding-bottom: 28px !important;
}

.pa-29 {
  padding-left: 29px !important;
  padding-top: 29px !important;
  padding-right: 29px !important;
  padding-bottom: 29px !important;
}

.pa-30 {
  padding-left: 30px !important;
  padding-top: 30px !important;
  padding-right: 30px !important;
  padding-bottom: 30px !important;
}

.pa-31 {
  padding-left: 31px !important;
  padding-top: 31px !important;
  padding-right: 31px !important;
  padding-bottom: 31px !important;
}

.pa-32 {
  padding-left: 32px !important;
  padding-top: 32px !important;
  padding-right: 32px !important;
  padding-bottom: 32px !important;
}

.pa-33 {
  padding-left: 33px !important;
  padding-top: 33px !important;
  padding-right: 33px !important;
  padding-bottom: 33px !important;
}

.pa-34 {
  padding-left: 34px !important;
  padding-top: 34px !important;
  padding-right: 34px !important;
  padding-bottom: 34px !important;
}

.pa-35 {
  padding-left: 35px !important;
  padding-top: 35px !important;
  padding-right: 35px !important;
  padding-bottom: 35px !important;
}

.pa-36 {
  padding-left: 36px !important;
  padding-top: 36px !important;
  padding-right: 36px !important;
  padding-bottom: 36px !important;
}

.pa-37 {
  padding-left: 37px !important;
  padding-top: 37px !important;
  padding-right: 37px !important;
  padding-bottom: 37px !important;
}

.pa-38 {
  padding-left: 38px !important;
  padding-top: 38px !important;
  padding-right: 38px !important;
  padding-bottom: 38px !important;
}

.pa-39 {
  padding-left: 39px !important;
  padding-top: 39px !important;
  padding-right: 39px !important;
  padding-bottom: 39px !important;
}

.pa-40 {
  padding-left: 40px !important;
  padding-top: 40px !important;
  padding-right: 40px !important;
  padding-bottom: 40px !important;
}

.pa-41 {
  padding-left: 41px !important;
  padding-top: 41px !important;
  padding-right: 41px !important;
  padding-bottom: 41px !important;
}

.pa-42 {
  padding-left: 42px !important;
  padding-top: 42px !important;
  padding-right: 42px !important;
  padding-bottom: 42px !important;
}

.pa-43 {
  padding-left: 43px !important;
  padding-top: 43px !important;
  padding-right: 43px !important;
  padding-bottom: 43px !important;
}

.pa-44 {
  padding-left: 44px !important;
  padding-top: 44px !important;
  padding-right: 44px !important;
  padding-bottom: 44px !important;
}

.pa-45 {
  padding-left: 45px !important;
  padding-top: 45px !important;
  padding-right: 45px !important;
  padding-bottom: 45px !important;
}

.pa-46 {
  padding-left: 46px !important;
  padding-top: 46px !important;
  padding-right: 46px !important;
  padding-bottom: 46px !important;
}

.pa-47 {
  padding-left: 47px !important;
  padding-top: 47px !important;
  padding-right: 47px !important;
  padding-bottom: 47px !important;
}

.pa-48 {
  padding-left: 48px !important;
  padding-top: 48px !important;
  padding-right: 48px !important;
  padding-bottom: 48px !important;
}

.pa-56 {
  padding-left: 56px !important;
  padding-top: 56px !important;
  padding-right: 56px !important;
  padding-bottom: 56px !important;
}

.pa-64 {
  padding-left: 64px !important;
  padding-top: 64px !important;
  padding-right: 64px !important;
  padding-bottom: 64px !important;
}

.pa-72 {
  padding-left: 72px !important;
  padding-top: 72px !important;
  padding-right: 72px !important;
  padding-bottom: 72px !important;
}

.pa-80 {
  padding-left: 80px !important;
  padding-top: 80px !important;
  padding-right: 80px !important;
  padding-bottom: 80px !important;
}

.pa-88 {
  padding-left: 88px !important;
  padding-top: 88px !important;
  padding-right: 88px !important;
  padding-bottom: 88px !important;
}

.pa-96 {
  padding-left: 96px !important;
  padding-top: 96px !important;
  padding-right: 96px !important;
  padding-bottom: 96px !important;
}

.pa-104 {
  padding-left: 104px !important;
  padding-top: 104px !important;
  padding-right: 104px !important;
  padding-bottom: 104px !important;
}

.pa-112 {
  padding-left: 112px !important;
  padding-top: 112px !important;
  padding-right: 112px !important;
  padding-bottom: 112px !important;
}

.pa-120 {
  padding-left: 120px !important;
  padding-top: 120px !important;
  padding-right: 120px !important;
  padding-bottom: 120px !important;
}

.pa-128 {
  padding-left: 128px !important;
  padding-top: 128px !important;
  padding-right: 128px !important;
  padding-bottom: 128px !important;
}

.pa-136 {
  padding-left: 136px !important;
  padding-top: 136px !important;
  padding-right: 136px !important;
  padding-bottom: 136px !important;
}

.pa-144 {
  padding-left: 144px !important;
  padding-top: 144px !important;
  padding-right: 144px !important;
  padding-bottom: 144px !important;
}

.pa-152 {
  padding-left: 152px !important;
  padding-top: 152px !important;
  padding-right: 152px !important;
  padding-bottom: 152px !important;
}

.pa-160 {
  padding-left: 160px !important;
  padding-top: 160px !important;
  padding-right: 160px !important;
  padding-bottom: 160px !important;
}

.pa-168 {
  padding-left: 168px !important;
  padding-top: 168px !important;
  padding-right: 168px !important;
  padding-bottom: 168px !important;
}

.pa-176 {
  padding-left: 176px !important;
  padding-top: 176px !important;
  padding-right: 176px !important;
  padding-bottom: 176px !important;
}

.pa-184 {
  padding-left: 184px !important;
  padding-top: 184px !important;
  padding-right: 184px !important;
  padding-bottom: 184px !important;
}

.pa-192 {
  padding-left: 192px !important;
  padding-top: 192px !important;
  padding-right: 192px !important;
  padding-bottom: 192px !important;
}

.pa-200 {
  padding-left: 200px !important;
  padding-top: 200px !important;
  padding-right: 200px !important;
  padding-bottom: 200px !important;
}

.pt-n1 {
  padding-top: -1px !important;
}

.pt-n2 {
  padding-top: -2px !important;
}

.pt-n3 {
  padding-top: -3px !important;
}

.pt-n4 {
  padding-top: -4px !important;
}

.pt-n5 {
  padding-top: -5px !important;
}

.pt-n6 {
  padding-top: -6px !important;
}

.pt-n7 {
  padding-top: -7px !important;
}

.pt-n8 {
  padding-top: -8px !important;
}

.pt-n9 {
  padding-top: -9px !important;
}

.pt-n10 {
  padding-top: -10px !important;
}

.pt-n11 {
  padding-top: -11px !important;
}

.pt-n12 {
  padding-top: -12px !important;
}

.pt-n13 {
  padding-top: -13px !important;
}

.pt-n14 {
  padding-top: -14px !important;
}

.pt-n15 {
  padding-top: -15px !important;
}

.pt-n16 {
  padding-top: -16px !important;
}

.pt-n17 {
  padding-top: -17px !important;
}

.pt-n18 {
  padding-top: -18px !important;
}

.pt-n19 {
  padding-top: -19px !important;
}

.pt-n20 {
  padding-top: -20px !important;
}

.pt-n21 {
  padding-top: -21px !important;
}

.pt-n22 {
  padding-top: -22px !important;
}

.pt-n23 {
  padding-top: -23px !important;
}

.pt-n24 {
  padding-top: -24px !important;
}

.pt-n25 {
  padding-top: -25px !important;
}

.pt-n26 {
  padding-top: -26px !important;
}

.pt-n27 {
  padding-top: -27px !important;
}

.pt-n28 {
  padding-top: -28px !important;
}

.pt-n29 {
  padding-top: -29px !important;
}

.pt-n30 {
  padding-top: -30px !important;
}

.pt-n31 {
  padding-top: -31px !important;
}

.pt-n32 {
  padding-top: -32px !important;
}

.pt-n33 {
  padding-top: -33px !important;
}

.pt-n34 {
  padding-top: -34px !important;
}

.pt-n35 {
  padding-top: -35px !important;
}

.pt-n36 {
  padding-top: -36px !important;
}

.pt-n37 {
  padding-top: -37px !important;
}

.pt-n38 {
  padding-top: -38px !important;
}

.pt-n39 {
  padding-top: -39px !important;
}

.pt-n40 {
  padding-top: -40px !important;
}

.pt-n41 {
  padding-top: -41px !important;
}

.pt-n42 {
  padding-top: -42px !important;
}

.pt-n43 {
  padding-top: -43px !important;
}

.pt-n44 {
  padding-top: -44px !important;
}

.pt-n45 {
  padding-top: -45px !important;
}

.pt-n46 {
  padding-top: -46px !important;
}

.pt-n47 {
  padding-top: -47px !important;
}

.pt-n48 {
  padding-top: -48px !important;
}

.pb-n1 {
  padding-bottom: -1px !important;
}

.pb-n2 {
  padding-bottom: -2px !important;
}

.pb-n3 {
  padding-bottom: -3px !important;
}

.pb-n4 {
  padding-bottom: -4px !important;
}

.pb-n5 {
  padding-bottom: -5px !important;
}

.pb-n6 {
  padding-bottom: -6px !important;
}

.pb-n7 {
  padding-bottom: -7px !important;
}

.pb-n8 {
  padding-bottom: -8px !important;
}

.pb-n9 {
  padding-bottom: -9px !important;
}

.pb-n10 {
  padding-bottom: -10px !important;
}

.pb-n11 {
  padding-bottom: -11px !important;
}

.pb-n12 {
  padding-bottom: -12px !important;
}

.pb-n13 {
  padding-bottom: -13px !important;
}

.pb-n14 {
  padding-bottom: -14px !important;
}

.pb-n15 {
  padding-bottom: -15px !important;
}

.pb-n16 {
  padding-bottom: -16px !important;
}

.pb-n17 {
  padding-bottom: -17px !important;
}

.pb-n18 {
  padding-bottom: -18px !important;
}

.pb-n19 {
  padding-bottom: -19px !important;
}

.pb-n20 {
  padding-bottom: -20px !important;
}

.pb-n21 {
  padding-bottom: -21px !important;
}

.pb-n22 {
  padding-bottom: -22px !important;
}

.pb-n23 {
  padding-bottom: -23px !important;
}

.pb-n24 {
  padding-bottom: -24px !important;
}

.pb-n25 {
  padding-bottom: -25px !important;
}

.pb-n26 {
  padding-bottom: -26px !important;
}

.pb-n27 {
  padding-bottom: -27px !important;
}

.pb-n28 {
  padding-bottom: -28px !important;
}

.pb-n29 {
  padding-bottom: -29px !important;
}

.pb-n30 {
  padding-bottom: -30px !important;
}

.pb-n31 {
  padding-bottom: -31px !important;
}

.pb-n32 {
  padding-bottom: -32px !important;
}

.pb-n33 {
  padding-bottom: -33px !important;
}

.pb-n34 {
  padding-bottom: -34px !important;
}

.pb-n35 {
  padding-bottom: -35px !important;
}

.pb-n36 {
  padding-bottom: -36px !important;
}

.pb-n37 {
  padding-bottom: -37px !important;
}

.pb-n38 {
  padding-bottom: -38px !important;
}

.pb-n39 {
  padding-bottom: -39px !important;
}

.pb-n40 {
  padding-bottom: -40px !important;
}

.pb-n41 {
  padding-bottom: -41px !important;
}

.pb-n42 {
  padding-bottom: -42px !important;
}

.pb-n43 {
  padding-bottom: -43px !important;
}

.pb-n44 {
  padding-bottom: -44px !important;
}

.pb-n45 {
  padding-bottom: -45px !important;
}

.pb-n46 {
  padding-bottom: -46px !important;
}

.pb-n47 {
  padding-bottom: -47px !important;
}

.pb-n48 {
  padding-bottom: -48px !important;
}

.pl-n1 {
  padding-left: -1px !important;
}

.pl-n2 {
  padding-left: -2px !important;
}

.pl-n3 {
  padding-left: -3px !important;
}

.pl-n4 {
  padding-left: -4px !important;
}

.pl-n5 {
  padding-left: -5px !important;
}

.pl-n6 {
  padding-left: -6px !important;
}

.pl-n7 {
  padding-left: -7px !important;
}

.pl-n8 {
  padding-left: -8px !important;
}

.pl-n9 {
  padding-left: -9px !important;
}

.pl-n10 {
  padding-left: -10px !important;
}

.pl-n11 {
  padding-left: -11px !important;
}

.pl-n12 {
  padding-left: -12px !important;
}

.pl-n13 {
  padding-left: -13px !important;
}

.pl-n14 {
  padding-left: -14px !important;
}

.pl-n15 {
  padding-left: -15px !important;
}

.pl-n16 {
  padding-left: -16px !important;
}

.pl-n17 {
  padding-left: -17px !important;
}

.pl-n18 {
  padding-left: -18px !important;
}

.pl-n19 {
  padding-left: -19px !important;
}

.pl-n20 {
  padding-left: -20px !important;
}

.pl-n21 {
  padding-left: -21px !important;
}

.pl-n22 {
  padding-left: -22px !important;
}

.pl-n23 {
  padding-left: -23px !important;
}

.pl-n24 {
  padding-left: -24px !important;
}

.pl-n25 {
  padding-left: -25px !important;
}

.pl-n26 {
  padding-left: -26px !important;
}

.pl-n27 {
  padding-left: -27px !important;
}

.pl-n28 {
  padding-left: -28px !important;
}

.pl-n29 {
  padding-left: -29px !important;
}

.pl-n30 {
  padding-left: -30px !important;
}

.pl-n31 {
  padding-left: -31px !important;
}

.pl-n32 {
  padding-left: -32px !important;
}

.pl-n33 {
  padding-left: -33px !important;
}

.pl-n34 {
  padding-left: -34px !important;
}

.pl-n35 {
  padding-left: -35px !important;
}

.pl-n36 {
  padding-left: -36px !important;
}

.pl-n37 {
  padding-left: -37px !important;
}

.pl-n38 {
  padding-left: -38px !important;
}

.pl-n39 {
  padding-left: -39px !important;
}

.pl-n40 {
  padding-left: -40px !important;
}

.pl-n41 {
  padding-left: -41px !important;
}

.pl-n42 {
  padding-left: -42px !important;
}

.pl-n43 {
  padding-left: -43px !important;
}

.pl-n44 {
  padding-left: -44px !important;
}

.pl-n45 {
  padding-left: -45px !important;
}

.pl-n46 {
  padding-left: -46px !important;
}

.pl-n47 {
  padding-left: -47px !important;
}

.pl-n48 {
  padding-left: -48px !important;
}

.pr-n1 {
  padding-right: -1px !important;
}

.pr-n2 {
  padding-right: -2px !important;
}

.pr-n3 {
  padding-right: -3px !important;
}

.pr-n4 {
  padding-right: -4px !important;
}

.pr-n5 {
  padding-right: -5px !important;
}

.pr-n6 {
  padding-right: -6px !important;
}

.pr-n7 {
  padding-right: -7px !important;
}

.pr-n8 {
  padding-right: -8px !important;
}

.pr-n9 {
  padding-right: -9px !important;
}

.pr-n10 {
  padding-right: -10px !important;
}

.pr-n11 {
  padding-right: -11px !important;
}

.pr-n12 {
  padding-right: -12px !important;
}

.pr-n13 {
  padding-right: -13px !important;
}

.pr-n14 {
  padding-right: -14px !important;
}

.pr-n15 {
  padding-right: -15px !important;
}

.pr-n16 {
  padding-right: -16px !important;
}

.pr-n17 {
  padding-right: -17px !important;
}

.pr-n18 {
  padding-right: -18px !important;
}

.pr-n19 {
  padding-right: -19px !important;
}

.pr-n20 {
  padding-right: -20px !important;
}

.pr-n21 {
  padding-right: -21px !important;
}

.pr-n22 {
  padding-right: -22px !important;
}

.pr-n23 {
  padding-right: -23px !important;
}

.pr-n24 {
  padding-right: -24px !important;
}

.pr-n25 {
  padding-right: -25px !important;
}

.pr-n26 {
  padding-right: -26px !important;
}

.pr-n27 {
  padding-right: -27px !important;
}

.pr-n28 {
  padding-right: -28px !important;
}

.pr-n29 {
  padding-right: -29px !important;
}

.pr-n30 {
  padding-right: -30px !important;
}

.pr-n31 {
  padding-right: -31px !important;
}

.pr-n32 {
  padding-right: -32px !important;
}

.pr-n33 {
  padding-right: -33px !important;
}

.pr-n34 {
  padding-right: -34px !important;
}

.pr-n35 {
  padding-right: -35px !important;
}

.pr-n36 {
  padding-right: -36px !important;
}

.pr-n37 {
  padding-right: -37px !important;
}

.pr-n38 {
  padding-right: -38px !important;
}

.pr-n39 {
  padding-right: -39px !important;
}

.pr-n40 {
  padding-right: -40px !important;
}

.pr-n41 {
  padding-right: -41px !important;
}

.pr-n42 {
  padding-right: -42px !important;
}

.pr-n43 {
  padding-right: -43px !important;
}

.pr-n44 {
  padding-right: -44px !important;
}

.pr-n45 {
  padding-right: -45px !important;
}

.pr-n46 {
  padding-right: -46px !important;
}

.pr-n47 {
  padding-right: -47px !important;
}

.pr-n48 {
  padding-right: -48px !important;
}

.px-n1 {
  padding-left: -1px !important;
  padding-right: -1px !important;
}

.px-n2 {
  padding-left: -2px !important;
  padding-right: -2px !important;
}

.px-n3 {
  padding-left: -3px !important;
  padding-right: -3px !important;
}

.px-n4 {
  padding-left: -4px !important;
  padding-right: -4px !important;
}

.px-n5 {
  padding-left: -5px !important;
  padding-right: -5px !important;
}

.px-n6 {
  padding-left: -6px !important;
  padding-right: -6px !important;
}

.px-n7 {
  padding-left: -7px !important;
  padding-right: -7px !important;
}

.px-n8 {
  padding-left: -8px !important;
  padding-right: -8px !important;
}

.px-n9 {
  padding-left: -9px !important;
  padding-right: -9px !important;
}

.px-n10 {
  padding-left: -10px !important;
  padding-right: -10px !important;
}

.px-n11 {
  padding-left: -11px !important;
  padding-right: -11px !important;
}

.px-n12 {
  padding-left: -12px !important;
  padding-right: -12px !important;
}

.px-n13 {
  padding-left: -13px !important;
  padding-right: -13px !important;
}

.px-n14 {
  padding-left: -14px !important;
  padding-right: -14px !important;
}

.px-n15 {
  padding-left: -15px !important;
  padding-right: -15px !important;
}

.px-n16 {
  padding-left: -16px !important;
  padding-right: -16px !important;
}

.px-n17 {
  padding-left: -17px !important;
  padding-right: -17px !important;
}

.px-n18 {
  padding-left: -18px !important;
  padding-right: -18px !important;
}

.px-n19 {
  padding-left: -19px !important;
  padding-right: -19px !important;
}

.px-n20 {
  padding-left: -20px !important;
  padding-right: -20px !important;
}

.px-n21 {
  padding-left: -21px !important;
  padding-right: -21px !important;
}

.px-n22 {
  padding-left: -22px !important;
  padding-right: -22px !important;
}

.px-n23 {
  padding-left: -23px !important;
  padding-right: -23px !important;
}

.px-n24 {
  padding-left: -24px !important;
  padding-right: -24px !important;
}

.px-n25 {
  padding-left: -25px !important;
  padding-right: -25px !important;
}

.px-n26 {
  padding-left: -26px !important;
  padding-right: -26px !important;
}

.px-n27 {
  padding-left: -27px !important;
  padding-right: -27px !important;
}

.px-n28 {
  padding-left: -28px !important;
  padding-right: -28px !important;
}

.px-n29 {
  padding-left: -29px !important;
  padding-right: -29px !important;
}

.px-n30 {
  padding-left: -30px !important;
  padding-right: -30px !important;
}

.px-n31 {
  padding-left: -31px !important;
  padding-right: -31px !important;
}

.px-n32 {
  padding-left: -32px !important;
  padding-right: -32px !important;
}

.px-n33 {
  padding-left: -33px !important;
  padding-right: -33px !important;
}

.px-n34 {
  padding-left: -34px !important;
  padding-right: -34px !important;
}

.px-n35 {
  padding-left: -35px !important;
  padding-right: -35px !important;
}

.px-n36 {
  padding-left: -36px !important;
  padding-right: -36px !important;
}

.px-n37 {
  padding-left: -37px !important;
  padding-right: -37px !important;
}

.px-n38 {
  padding-left: -38px !important;
  padding-right: -38px !important;
}

.px-n39 {
  padding-left: -39px !important;
  padding-right: -39px !important;
}

.px-n40 {
  padding-left: -40px !important;
  padding-right: -40px !important;
}

.px-n41 {
  padding-left: -41px !important;
  padding-right: -41px !important;
}

.px-n42 {
  padding-left: -42px !important;
  padding-right: -42px !important;
}

.px-n43 {
  padding-left: -43px !important;
  padding-right: -43px !important;
}

.px-n44 {
  padding-left: -44px !important;
  padding-right: -44px !important;
}

.px-n45 {
  padding-left: -45px !important;
  padding-right: -45px !important;
}

.px-n46 {
  padding-left: -46px !important;
  padding-right: -46px !important;
}

.px-n47 {
  padding-left: -47px !important;
  padding-right: -47px !important;
}

.px-n48 {
  padding-left: -48px !important;
  padding-right: -48px !important;
}

.py-n1 {
  padding-top: -1px !important;
  padding-bottom: -1px !important;
}

.py-n2 {
  padding-top: -2px !important;
  padding-bottom: -2px !important;
}

.py-n3 {
  padding-top: -3px !important;
  padding-bottom: -3px !important;
}

.py-n4 {
  padding-top: -4px !important;
  padding-bottom: -4px !important;
}

.py-n5 {
  padding-top: -5px !important;
  padding-bottom: -5px !important;
}

.py-n6 {
  padding-top: -6px !important;
  padding-bottom: -6px !important;
}

.py-n7 {
  padding-top: -7px !important;
  padding-bottom: -7px !important;
}

.py-n8 {
  padding-top: -8px !important;
  padding-bottom: -8px !important;
}

.py-n9 {
  padding-top: -9px !important;
  padding-bottom: -9px !important;
}

.py-n10 {
  padding-top: -10px !important;
  padding-bottom: -10px !important;
}

.py-n11 {
  padding-top: -11px !important;
  padding-bottom: -11px !important;
}

.py-n12 {
  padding-top: -12px !important;
  padding-bottom: -12px !important;
}

.py-n13 {
  padding-top: -13px !important;
  padding-bottom: -13px !important;
}

.py-n14 {
  padding-top: -14px !important;
  padding-bottom: -14px !important;
}

.py-n15 {
  padding-top: -15px !important;
  padding-bottom: -15px !important;
}

.py-n16 {
  padding-top: -16px !important;
  padding-bottom: -16px !important;
}

.py-n17 {
  padding-top: -17px !important;
  padding-bottom: -17px !important;
}

.py-n18 {
  padding-top: -18px !important;
  padding-bottom: -18px !important;
}

.py-n19 {
  padding-top: -19px !important;
  padding-bottom: -19px !important;
}

.py-n20 {
  padding-top: -20px !important;
  padding-bottom: -20px !important;
}

.py-n21 {
  padding-top: -21px !important;
  padding-bottom: -21px !important;
}

.py-n22 {
  padding-top: -22px !important;
  padding-bottom: -22px !important;
}

.py-n23 {
  padding-top: -23px !important;
  padding-bottom: -23px !important;
}

.py-n24 {
  padding-top: -24px !important;
  padding-bottom: -24px !important;
}

.py-n25 {
  padding-top: -25px !important;
  padding-bottom: -25px !important;
}

.py-n26 {
  padding-top: -26px !important;
  padding-bottom: -26px !important;
}

.py-n27 {
  padding-top: -27px !important;
  padding-bottom: -27px !important;
}

.py-n28 {
  padding-top: -28px !important;
  padding-bottom: -28px !important;
}

.py-n29 {
  padding-top: -29px !important;
  padding-bottom: -29px !important;
}

.py-n30 {
  padding-top: -30px !important;
  padding-bottom: -30px !important;
}

.py-n31 {
  padding-top: -31px !important;
  padding-bottom: -31px !important;
}

.py-n32 {
  padding-top: -32px !important;
  padding-bottom: -32px !important;
}

.py-n33 {
  padding-top: -33px !important;
  padding-bottom: -33px !important;
}

.py-n34 {
  padding-top: -34px !important;
  padding-bottom: -34px !important;
}

.py-n35 {
  padding-top: -35px !important;
  padding-bottom: -35px !important;
}

.py-n36 {
  padding-top: -36px !important;
  padding-bottom: -36px !important;
}

.py-n37 {
  padding-top: -37px !important;
  padding-bottom: -37px !important;
}

.py-n38 {
  padding-top: -38px !important;
  padding-bottom: -38px !important;
}

.py-n39 {
  padding-top: -39px !important;
  padding-bottom: -39px !important;
}

.py-n40 {
  padding-top: -40px !important;
  padding-bottom: -40px !important;
}

.py-n41 {
  padding-top: -41px !important;
  padding-bottom: -41px !important;
}

.py-n42 {
  padding-top: -42px !important;
  padding-bottom: -42px !important;
}

.py-n43 {
  padding-top: -43px !important;
  padding-bottom: -43px !important;
}

.py-n44 {
  padding-top: -44px !important;
  padding-bottom: -44px !important;
}

.py-n45 {
  padding-top: -45px !important;
  padding-bottom: -45px !important;
}

.py-n46 {
  padding-top: -46px !important;
  padding-bottom: -46px !important;
}

.py-n47 {
  padding-top: -47px !important;
  padding-bottom: -47px !important;
}

.py-n48 {
  padding-top: -48px !important;
  padding-bottom: -48px !important;
}

.pa-n1 {
  padding-left: -1px !important;
  padding-top: -1px !important;
  padding-right: -1px !important;
  padding-bottom: -1px !important;
}

.pa-n2 {
  padding-left: -2px !important;
  padding-top: -2px !important;
  padding-right: -2px !important;
  padding-bottom: -2px !important;
}

.pa-n3 {
  padding-left: -3px !important;
  padding-top: -3px !important;
  padding-right: -3px !important;
  padding-bottom: -3px !important;
}

.pa-n4 {
  padding-left: -4px !important;
  padding-top: -4px !important;
  padding-right: -4px !important;
  padding-bottom: -4px !important;
}

.pa-n5 {
  padding-left: -5px !important;
  padding-top: -5px !important;
  padding-right: -5px !important;
  padding-bottom: -5px !important;
}

.pa-n6 {
  padding-left: -6px !important;
  padding-top: -6px !important;
  padding-right: -6px !important;
  padding-bottom: -6px !important;
}

.pa-n7 {
  padding-left: -7px !important;
  padding-top: -7px !important;
  padding-right: -7px !important;
  padding-bottom: -7px !important;
}

.pa-n8 {
  padding-left: -8px !important;
  padding-top: -8px !important;
  padding-right: -8px !important;
  padding-bottom: -8px !important;
}

.pa-n9 {
  padding-left: -9px !important;
  padding-top: -9px !important;
  padding-right: -9px !important;
  padding-bottom: -9px !important;
}

.pa-n10 {
  padding-left: -10px !important;
  padding-top: -10px !important;
  padding-right: -10px !important;
  padding-bottom: -10px !important;
}

.pa-n11 {
  padding-left: -11px !important;
  padding-top: -11px !important;
  padding-right: -11px !important;
  padding-bottom: -11px !important;
}

.pa-n12 {
  padding-left: -12px !important;
  padding-top: -12px !important;
  padding-right: -12px !important;
  padding-bottom: -12px !important;
}

.pa-n13 {
  padding-left: -13px !important;
  padding-top: -13px !important;
  padding-right: -13px !important;
  padding-bottom: -13px !important;
}

.pa-n14 {
  padding-left: -14px !important;
  padding-top: -14px !important;
  padding-right: -14px !important;
  padding-bottom: -14px !important;
}

.pa-n15 {
  padding-left: -15px !important;
  padding-top: -15px !important;
  padding-right: -15px !important;
  padding-bottom: -15px !important;
}

.pa-n16 {
  padding-left: -16px !important;
  padding-top: -16px !important;
  padding-right: -16px !important;
  padding-bottom: -16px !important;
}

.pa-n17 {
  padding-left: -17px !important;
  padding-top: -17px !important;
  padding-right: -17px !important;
  padding-bottom: -17px !important;
}

.pa-n18 {
  padding-left: -18px !important;
  padding-top: -18px !important;
  padding-right: -18px !important;
  padding-bottom: -18px !important;
}

.pa-n19 {
  padding-left: -19px !important;
  padding-top: -19px !important;
  padding-right: -19px !important;
  padding-bottom: -19px !important;
}

.pa-n20 {
  padding-left: -20px !important;
  padding-top: -20px !important;
  padding-right: -20px !important;
  padding-bottom: -20px !important;
}

.pa-n21 {
  padding-left: -21px !important;
  padding-top: -21px !important;
  padding-right: -21px !important;
  padding-bottom: -21px !important;
}

.pa-n22 {
  padding-left: -22px !important;
  padding-top: -22px !important;
  padding-right: -22px !important;
  padding-bottom: -22px !important;
}

.pa-n23 {
  padding-left: -23px !important;
  padding-top: -23px !important;
  padding-right: -23px !important;
  padding-bottom: -23px !important;
}

.pa-n24 {
  padding-left: -24px !important;
  padding-top: -24px !important;
  padding-right: -24px !important;
  padding-bottom: -24px !important;
}

.pa-n25 {
  padding-left: -25px !important;
  padding-top: -25px !important;
  padding-right: -25px !important;
  padding-bottom: -25px !important;
}

.pa-n26 {
  padding-left: -26px !important;
  padding-top: -26px !important;
  padding-right: -26px !important;
  padding-bottom: -26px !important;
}

.pa-n27 {
  padding-left: -27px !important;
  padding-top: -27px !important;
  padding-right: -27px !important;
  padding-bottom: -27px !important;
}

.pa-n28 {
  padding-left: -28px !important;
  padding-top: -28px !important;
  padding-right: -28px !important;
  padding-bottom: -28px !important;
}

.pa-n29 {
  padding-left: -29px !important;
  padding-top: -29px !important;
  padding-right: -29px !important;
  padding-bottom: -29px !important;
}

.pa-n30 {
  padding-left: -30px !important;
  padding-top: -30px !important;
  padding-right: -30px !important;
  padding-bottom: -30px !important;
}

.pa-n31 {
  padding-left: -31px !important;
  padding-top: -31px !important;
  padding-right: -31px !important;
  padding-bottom: -31px !important;
}

.pa-n32 {
  padding-left: -32px !important;
  padding-top: -32px !important;
  padding-right: -32px !important;
  padding-bottom: -32px !important;
}

.pa-n33 {
  padding-left: -33px !important;
  padding-top: -33px !important;
  padding-right: -33px !important;
  padding-bottom: -33px !important;
}

.pa-n34 {
  padding-left: -34px !important;
  padding-top: -34px !important;
  padding-right: -34px !important;
  padding-bottom: -34px !important;
}

.pa-n35 {
  padding-left: -35px !important;
  padding-top: -35px !important;
  padding-right: -35px !important;
  padding-bottom: -35px !important;
}

.pa-n36 {
  padding-left: -36px !important;
  padding-top: -36px !important;
  padding-right: -36px !important;
  padding-bottom: -36px !important;
}

.pa-n37 {
  padding-left: -37px !important;
  padding-top: -37px !important;
  padding-right: -37px !important;
  padding-bottom: -37px !important;
}

.pa-n38 {
  padding-left: -38px !important;
  padding-top: -38px !important;
  padding-right: -38px !important;
  padding-bottom: -38px !important;
}

.pa-n39 {
  padding-left: -39px !important;
  padding-top: -39px !important;
  padding-right: -39px !important;
  padding-bottom: -39px !important;
}

.pa-n40 {
  padding-left: -40px !important;
  padding-top: -40px !important;
  padding-right: -40px !important;
  padding-bottom: -40px !important;
}

.pa-n41 {
  padding-left: -41px !important;
  padding-top: -41px !important;
  padding-right: -41px !important;
  padding-bottom: -41px !important;
}

.pa-n42 {
  padding-left: -42px !important;
  padding-top: -42px !important;
  padding-right: -42px !important;
  padding-bottom: -42px !important;
}

.pa-n43 {
  padding-left: -43px !important;
  padding-top: -43px !important;
  padding-right: -43px !important;
  padding-bottom: -43px !important;
}

.pa-n44 {
  padding-left: -44px !important;
  padding-top: -44px !important;
  padding-right: -44px !important;
  padding-bottom: -44px !important;
}

.pa-n45 {
  padding-left: -45px !important;
  padding-top: -45px !important;
  padding-right: -45px !important;
  padding-bottom: -45px !important;
}

.pa-n46 {
  padding-left: -46px !important;
  padding-top: -46px !important;
  padding-right: -46px !important;
  padding-bottom: -46px !important;
}

.pa-n47 {
  padding-left: -47px !important;
  padding-top: -47px !important;
  padding-right: -47px !important;
  padding-bottom: -47px !important;
}

.pa-n48 {
  padding-left: -48px !important;
  padding-top: -48px !important;
  padding-right: -48px !important;
  padding-bottom: -48px !important;
}

.mt-auto {
  margin-top: auto !important;
}

.mb-auto {
  margin-bottom: auto !important;
}

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

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

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

.my-auto {
  margin-top: auto !important;
  margin-bottom: auto !important;
}

.ma-auto {
  margin-left: auto !important;
  margin-top: auto !important;
  margin-right: auto !important;
  margin-bottom: auto !important;
}

.max-w-4 {
  max-width: 4px !important;
}

.max-h-4 {
  max-height: 4px !important;
}

.max-w-8 {
  max-width: 8px !important;
}

.max-h-8 {
  max-height: 8px !important;
}

.max-w-12 {
  max-width: 12px !important;
}

.max-h-12 {
  max-height: 12px !important;
}

.max-w-16 {
  max-width: 16px !important;
}

.max-h-16 {
  max-height: 16px !important;
}

.max-w-20 {
  max-width: 20px !important;
}

.max-h-20 {
  max-height: 20px !important;
}

.max-w-24 {
  max-width: 24px !important;
}

.max-h-24 {
  max-height: 24px !important;
}

.max-w-28 {
  max-width: 28px !important;
}

.max-h-28 {
  max-height: 28px !important;
}

.max-w-32 {
  max-width: 32px !important;
}

.max-h-32 {
  max-height: 32px !important;
}

.max-w-48 {
  max-width: 48px !important;
}

.max-h-48 {
  max-height: 48px !important;
}

.max-w-64 {
  max-width: 64px !important;
}

.max-h-64 {
  max-height: 64px !important;
}

.max-w-80 {
  max-width: 80px !important;
}

.max-h-80 {
  max-height: 80px !important;
}

.max-w-96 {
  max-width: 96px !important;
}

.max-h-96 {
  max-height: 96px !important;
}

.max-w-112 {
  max-width: 112px !important;
}

.max-h-112 {
  max-height: 112px !important;
}

.max-w-128 {
  max-width: 128px !important;
}

.max-h-128 {
  max-height: 128px !important;
}

.max-w-144 {
  max-width: 144px !important;
}

.max-h-144 {
  max-height: 144px !important;
}

.max-w-160 {
  max-width: 160px !important;
}

.max-h-160 {
  max-height: 160px !important;
}

.max-w-176 {
  max-width: 176px !important;
}

.max-h-176 {
  max-height: 176px !important;
}

.max-w-192 {
  max-width: 192px !important;
}

.max-h-192 {
  max-height: 192px !important;
}

.max-w-208 {
  max-width: 208px !important;
}

.max-h-208 {
  max-height: 208px !important;
}

.max-w-224 {
  max-width: 224px !important;
}

.max-h-224 {
  max-height: 224px !important;
}

.max-w-240 {
  max-width: 240px !important;
}

.max-h-240 {
  max-height: 240px !important;
}

.max-w-256 {
  max-width: 256px !important;
}

.max-h-256 {
  max-height: 256px !important;
}

.max-w-272 {
  max-width: 272px !important;
}

.max-h-272 {
  max-height: 272px !important;
}

.max-w-288 {
  max-width: 288px !important;
}

.max-h-288 {
  max-height: 288px !important;
}

.max-w-304 {
  max-width: 304px !important;
}

.max-h-304 {
  max-height: 304px !important;
}

.max-w-320 {
  max-width: 320px !important;
}

.max-h-320 {
  max-height: 320px !important;
}

.max-w-336 {
  max-width: 336px !important;
}

.max-h-336 {
  max-height: 336px !important;
}

.max-w-352 {
  max-width: 352px !important;
}

.max-h-352 {
  max-height: 352px !important;
}

.max-w-368 {
  max-width: 368px !important;
}

.max-h-368 {
  max-height: 368px !important;
}

.max-w-384 {
  max-width: 384px !important;
}

.max-h-384 {
  max-height: 384px !important;
}

.max-w-400 {
  max-width: 400px !important;
}

.max-h-400 {
  max-height: 400px !important;
}

.max-w-416 {
  max-width: 416px !important;
}

.max-h-416 {
  max-height: 416px !important;
}

.max-w-432 {
  max-width: 432px !important;
}

.max-h-432 {
  max-height: 432px !important;
}

.max-w-448 {
  max-width: 448px !important;
}

.max-h-448 {
  max-height: 448px !important;
}

.max-w-464 {
  max-width: 464px !important;
}

.max-h-464 {
  max-height: 464px !important;
}

.max-w-480 {
  max-width: 480px !important;
}

.max-h-480 {
  max-height: 480px !important;
}

.max-w-496 {
  max-width: 496px !important;
}

.max-h-496 {
  max-height: 496px !important;
}

.max-w-512 {
  max-width: 512px !important;
}

.max-h-512 {
  max-height: 512px !important;
}

.max-w-528 {
  max-width: 528px !important;
}

.max-h-528 {
  max-height: 528px !important;
}

.max-w-544 {
  max-width: 544px !important;
}

.max-h-544 {
  max-height: 544px !important;
}

.max-w-560 {
  max-width: 560px !important;
}

.max-h-560 {
  max-height: 560px !important;
}

.max-w-576 {
  max-width: 576px !important;
}

.max-h-576 {
  max-height: 576px !important;
}

.max-w-592 {
  max-width: 592px !important;
}

.max-h-592 {
  max-height: 592px !important;
}

.max-w-608 {
  max-width: 608px !important;
}

.max-h-608 {
  max-height: 608px !important;
}

.max-w-624 {
  max-width: 624px !important;
}

.max-h-624 {
  max-height: 624px !important;
}

.max-w-640 {
  max-width: 640px !important;
}

.max-h-640 {
  max-height: 640px !important;
}

.max-w-656 {
  max-width: 656px !important;
}

.max-h-656 {
  max-height: 656px !important;
}

.max-w-672 {
  max-width: 672px !important;
}

.max-h-672 {
  max-height: 672px !important;
}

.max-w-688 {
  max-width: 688px !important;
}

.max-h-688 {
  max-height: 688px !important;
}

.max-w-704 {
  max-width: 704px !important;
}

.max-h-704 {
  max-height: 704px !important;
}

.max-w-720 {
  max-width: 720px !important;
}

.max-h-720 {
  max-height: 720px !important;
}

.max-w-736 {
  max-width: 736px !important;
}

.max-h-736 {
  max-height: 736px !important;
}

.max-w-752 {
  max-width: 752px !important;
}

.max-h-752 {
  max-height: 752px !important;
}

.max-w-768 {
  max-width: 768px !important;
}

.max-h-768 {
  max-height: 768px !important;
}

.max-w-784 {
  max-width: 784px !important;
}

.max-h-784 {
  max-height: 784px !important;
}

.max-w-800 {
  max-width: 800px !important;
}

.max-h-800 {
  max-height: 800px !important;
}

.max-w-816 {
  max-width: 816px !important;
}

.max-h-816 {
  max-height: 816px !important;
}

.max-w-832 {
  max-width: 832px !important;
}

.max-h-832 {
  max-height: 832px !important;
}

.max-w-848 {
  max-width: 848px !important;
}

.max-h-848 {
  max-height: 848px !important;
}

.max-w-864 {
  max-width: 864px !important;
}

.max-h-864 {
  max-height: 864px !important;
}

.max-w-880 {
  max-width: 880px !important;
}

.max-h-880 {
  max-height: 880px !important;
}

.max-w-896 {
  max-width: 896px !important;
}

.max-h-896 {
  max-height: 896px !important;
}

.max-w-912 {
  max-width: 912px !important;
}

.max-h-912 {
  max-height: 912px !important;
}

.max-w-928 {
  max-width: 928px !important;
}

.max-h-928 {
  max-height: 928px !important;
}

.max-w-944 {
  max-width: 944px !important;
}

.max-h-944 {
  max-height: 944px !important;
}

.max-w-960 {
  max-width: 960px !important;
}

.max-h-960 {
  max-height: 960px !important;
}

.max-w-976 {
  max-width: 976px !important;
}

.max-h-976 {
  max-height: 976px !important;
}

.max-w-992 {
  max-width: 992px !important;
}

.max-h-992 {
  max-height: 992px !important;
}

.max-w-1008 {
  max-width: 1008px !important;
}

.max-h-1008 {
  max-height: 1008px !important;
}

.max-w-1024 {
  max-width: 1024px !important;
}

.max-h-1024 {
  max-height: 1024px !important;
}

.max-w-1040 {
  max-width: 1040px !important;
}

.max-h-1040 {
  max-height: 1040px !important;
}

.max-w-1056 {
  max-width: 1056px !important;
}

.max-h-1056 {
  max-height: 1056px !important;
}

.max-w-1072 {
  max-width: 1072px !important;
}

.max-h-1072 {
  max-height: 1072px !important;
}

.max-w-1088 {
  max-width: 1088px !important;
}

.max-h-1088 {
  max-height: 1088px !important;
}

.max-w-1104 {
  max-width: 1104px !important;
}

.max-h-1104 {
  max-height: 1104px !important;
}

.max-w-1120 {
  max-width: 1120px !important;
}

.max-h-1120 {
  max-height: 1120px !important;
}

.max-w-1136 {
  max-width: 1136px !important;
}

.max-h-1136 {
  max-height: 1136px !important;
}

.max-w-1152 {
  max-width: 1152px !important;
}

.max-h-1152 {
  max-height: 1152px !important;
}

.max-w-1168 {
  max-width: 1168px !important;
}

.max-h-1168 {
  max-height: 1168px !important;
}

.max-w-1184 {
  max-width: 1184px !important;
}

.max-h-1184 {
  max-height: 1184px !important;
}

.max-w-1200 {
  max-width: 1200px !important;
}

.max-h-1200 {
  max-height: 1200px !important;
}

.max-w-1216 {
  max-width: 1216px !important;
}

.max-h-1216 {
  max-height: 1216px !important;
}

.max-w-1232 {
  max-width: 1232px !important;
}

.max-h-1232 {
  max-height: 1232px !important;
}

.max-w-1248 {
  max-width: 1248px !important;
}

.max-h-1248 {
  max-height: 1248px !important;
}

.max-w-1264 {
  max-width: 1264px !important;
}

.max-h-1264 {
  max-height: 1264px !important;
}

.max-w-1280 {
  max-width: 1280px !important;
}

.max-h-1280 {
  max-height: 1280px !important;
}

.min-w-4 {
  min-width: 4px !important;
}

.min-h-4 {
  min-height: 4px !important;
}

.min-w-8 {
  min-width: 8px !important;
}

.min-h-8 {
  min-height: 8px !important;
}

.min-w-12 {
  min-width: 12px !important;
}

.min-h-12 {
  min-height: 12px !important;
}

.min-w-16 {
  min-width: 16px !important;
}

.min-h-16 {
  min-height: 16px !important;
}

.min-w-20 {
  min-width: 20px !important;
}

.min-h-20 {
  min-height: 20px !important;
}

.min-w-24 {
  min-width: 24px !important;
}

.min-h-24 {
  min-height: 24px !important;
}

.min-w-28 {
  min-width: 28px !important;
}

.min-h-28 {
  min-height: 28px !important;
}

.min-w-32 {
  min-width: 32px !important;
}

.min-h-32 {
  min-height: 32px !important;
}

.min-w-48 {
  min-width: 48px !important;
}

.min-h-48 {
  min-height: 48px !important;
}

.min-w-64 {
  min-width: 64px !important;
}

.min-h-64 {
  min-height: 64px !important;
}

.min-w-80 {
  min-width: 80px !important;
}

.min-h-80 {
  min-height: 80px !important;
}

.min-w-96 {
  min-width: 96px !important;
}

.min-h-96 {
  min-height: 96px !important;
}

.min-w-112 {
  min-width: 112px !important;
}

.min-h-112 {
  min-height: 112px !important;
}

.min-w-128 {
  min-width: 128px !important;
}

.min-h-128 {
  min-height: 128px !important;
}

.min-w-144 {
  min-width: 144px !important;
}

.min-h-144 {
  min-height: 144px !important;
}

.min-w-160 {
  min-width: 160px !important;
}

.min-h-160 {
  min-height: 160px !important;
}

.min-w-176 {
  min-width: 176px !important;
}

.min-h-176 {
  min-height: 176px !important;
}

.min-w-192 {
  min-width: 192px !important;
}

.min-h-192 {
  min-height: 192px !important;
}

.min-w-208 {
  min-width: 208px !important;
}

.min-h-208 {
  min-height: 208px !important;
}

.min-w-224 {
  min-width: 224px !important;
}

.min-h-224 {
  min-height: 224px !important;
}

.min-w-240 {
  min-width: 240px !important;
}

.min-h-240 {
  min-height: 240px !important;
}

.min-w-256 {
  min-width: 256px !important;
}

.min-h-256 {
  min-height: 256px !important;
}

.min-w-272 {
  min-width: 272px !important;
}

.min-h-272 {
  min-height: 272px !important;
}

.min-w-288 {
  min-width: 288px !important;
}

.min-h-288 {
  min-height: 288px !important;
}

.min-w-304 {
  min-width: 304px !important;
}

.min-h-304 {
  min-height: 304px !important;
}

.min-w-320 {
  min-width: 320px !important;
}

.min-h-320 {
  min-height: 320px !important;
}

.min-w-336 {
  min-width: 336px !important;
}

.min-h-336 {
  min-height: 336px !important;
}

.min-w-352 {
  min-width: 352px !important;
}

.min-h-352 {
  min-height: 352px !important;
}

.min-w-368 {
  min-width: 368px !important;
}

.min-h-368 {
  min-height: 368px !important;
}

.min-w-384 {
  min-width: 384px !important;
}

.min-h-384 {
  min-height: 384px !important;
}

.min-w-400 {
  min-width: 400px !important;
}

.min-h-400 {
  min-height: 400px !important;
}

.min-w-416 {
  min-width: 416px !important;
}

.min-h-416 {
  min-height: 416px !important;
}

.min-w-432 {
  min-width: 432px !important;
}

.min-h-432 {
  min-height: 432px !important;
}

.min-w-448 {
  min-width: 448px !important;
}

.min-h-448 {
  min-height: 448px !important;
}

.min-w-464 {
  min-width: 464px !important;
}

.min-h-464 {
  min-height: 464px !important;
}

.min-w-480 {
  min-width: 480px !important;
}

.min-h-480 {
  min-height: 480px !important;
}

.min-w-496 {
  min-width: 496px !important;
}

.min-h-496 {
  min-height: 496px !important;
}

.min-w-512 {
  min-width: 512px !important;
}

.min-h-512 {
  min-height: 512px !important;
}

.min-w-528 {
  min-width: 528px !important;
}

.min-h-528 {
  min-height: 528px !important;
}

.min-w-544 {
  min-width: 544px !important;
}

.min-h-544 {
  min-height: 544px !important;
}

.min-w-560 {
  min-width: 560px !important;
}

.min-h-560 {
  min-height: 560px !important;
}

.min-w-576 {
  min-width: 576px !important;
}

.min-h-576 {
  min-height: 576px !important;
}

.min-w-592 {
  min-width: 592px !important;
}

.min-h-592 {
  min-height: 592px !important;
}

.min-w-608 {
  min-width: 608px !important;
}

.min-h-608 {
  min-height: 608px !important;
}

.min-w-624 {
  min-width: 624px !important;
}

.min-h-624 {
  min-height: 624px !important;
}

.min-w-640 {
  min-width: 640px !important;
}

.min-h-640 {
  min-height: 640px !important;
}

.min-w-656 {
  min-width: 656px !important;
}

.min-h-656 {
  min-height: 656px !important;
}

.min-w-672 {
  min-width: 672px !important;
}

.min-h-672 {
  min-height: 672px !important;
}

.min-w-688 {
  min-width: 688px !important;
}

.min-h-688 {
  min-height: 688px !important;
}

.min-w-704 {
  min-width: 704px !important;
}

.min-h-704 {
  min-height: 704px !important;
}

.min-w-720 {
  min-width: 720px !important;
}

.min-h-720 {
  min-height: 720px !important;
}

.min-w-736 {
  min-width: 736px !important;
}

.min-h-736 {
  min-height: 736px !important;
}

.min-w-752 {
  min-width: 752px !important;
}

.min-h-752 {
  min-height: 752px !important;
}

.min-w-768 {
  min-width: 768px !important;
}

.min-h-768 {
  min-height: 768px !important;
}

.min-w-784 {
  min-width: 784px !important;
}

.min-h-784 {
  min-height: 784px !important;
}

.min-w-800 {
  min-width: 800px !important;
}

.min-h-800 {
  min-height: 800px !important;
}

.min-w-816 {
  min-width: 816px !important;
}

.min-h-816 {
  min-height: 816px !important;
}

.min-w-832 {
  min-width: 832px !important;
}

.min-h-832 {
  min-height: 832px !important;
}

.min-w-848 {
  min-width: 848px !important;
}

.min-h-848 {
  min-height: 848px !important;
}

.min-w-864 {
  min-width: 864px !important;
}

.min-h-864 {
  min-height: 864px !important;
}

.min-w-880 {
  min-width: 880px !important;
}

.min-h-880 {
  min-height: 880px !important;
}

.min-w-896 {
  min-width: 896px !important;
}

.min-h-896 {
  min-height: 896px !important;
}

.min-w-912 {
  min-width: 912px !important;
}

.min-h-912 {
  min-height: 912px !important;
}

.min-w-928 {
  min-width: 928px !important;
}

.min-h-928 {
  min-height: 928px !important;
}

.min-w-944 {
  min-width: 944px !important;
}

.min-h-944 {
  min-height: 944px !important;
}

.min-w-960 {
  min-width: 960px !important;
}

.min-h-960 {
  min-height: 960px !important;
}

.min-w-976 {
  min-width: 976px !important;
}

.min-h-976 {
  min-height: 976px !important;
}

.min-w-992 {
  min-width: 992px !important;
}

.min-h-992 {
  min-height: 992px !important;
}

.min-w-1008 {
  min-width: 1008px !important;
}

.min-h-1008 {
  min-height: 1008px !important;
}

.min-w-1024 {
  min-width: 1024px !important;
}

.min-h-1024 {
  min-height: 1024px !important;
}

.min-w-1040 {
  min-width: 1040px !important;
}

.min-h-1040 {
  min-height: 1040px !important;
}

.min-w-1056 {
  min-width: 1056px !important;
}

.min-h-1056 {
  min-height: 1056px !important;
}

.min-w-1072 {
  min-width: 1072px !important;
}

.min-h-1072 {
  min-height: 1072px !important;
}

.min-w-1088 {
  min-width: 1088px !important;
}

.min-h-1088 {
  min-height: 1088px !important;
}

.min-w-1104 {
  min-width: 1104px !important;
}

.min-h-1104 {
  min-height: 1104px !important;
}

.min-w-1120 {
  min-width: 1120px !important;
}

.min-h-1120 {
  min-height: 1120px !important;
}

.min-w-1136 {
  min-width: 1136px !important;
}

.min-h-1136 {
  min-height: 1136px !important;
}

.min-w-1152 {
  min-width: 1152px !important;
}

.min-h-1152 {
  min-height: 1152px !important;
}

.min-w-1168 {
  min-width: 1168px !important;
}

.min-h-1168 {
  min-height: 1168px !important;
}

.min-w-1184 {
  min-width: 1184px !important;
}

.min-h-1184 {
  min-height: 1184px !important;
}

.min-w-1200 {
  min-width: 1200px !important;
}

.min-h-1200 {
  min-height: 1200px !important;
}

.min-w-1216 {
  min-width: 1216px !important;
}

.min-h-1216 {
  min-height: 1216px !important;
}

.min-w-1232 {
  min-width: 1232px !important;
}

.min-h-1232 {
  min-height: 1232px !important;
}

.min-w-1248 {
  min-width: 1248px !important;
}

.min-h-1248 {
  min-height: 1248px !important;
}

.min-w-1264 {
  min-width: 1264px !important;
}

.min-h-1264 {
  min-height: 1264px !important;
}

.min-w-1280 {
  min-width: 1280px !important;
}

.min-h-1280 {
  min-height: 1280px !important;
}

.min-w-0 {
  min-width: 0 !important;
}

.min-h-0 {
  min-height: 0 !important;
}

.d-none {
  display: none !important;
}

.d-inline {
  display: inline !important;
}

.d-inline-block {
  display: inline-block !important;
}

.d-block {
  display: block !important;
}

.d-table {
  display: table !important;
}

.d-table-cell {
  display: table-cell !important;
}

.d-table-row {
  display: table-row !important;
}

.d-flex {
  display: flex !important;
}

.d-inline-flex {
  display: inline-flex !important;
}

.overflow-auto {
  overflow: auto !important;
}

.overflow-y-auto {
  overflow-y: auto !important;
}

.overflow-x-auto {
  overflow-x: auto !important;
}

.overflow-hidden {
  overflow: hidden !important;
}

.overflow-y-hidden {
  overflow-y: hidden !important;
}

.overflow-x-hidden {
  overflow-x: hidden !important;
}

.overflow-visible {
  overflow: visible !important;
}

.overflow-y-visible {
  overflow-y: visible !important;
}

.overflow-x-visible {
  overflow-x: visible !important;
}

.visible {
  visibility: visible !important;
}

.invisible {
  visibility: hidden !important;
}

.position-static {
  position: static !important;
}

.position-relative {
  position: relative !important;
}

.position-absolute {
  position: absolute !important;
}

.position-fixed {
  position: fixed !important;
}

.position-sticky {
  position: sticky !important;
}

.top-0 {
  top: 0px !important;
}

.right-0 {
  right: 0px !important;
}

.bottom-0 {
  bottom: 0px !important;
}

.left-0 {
  left: 0px !important;
}

.inset-0 {
  inset: 0px !important;
}

.inset-x-0 {
  right: 0px !important;
  left: 0px !important;
}

.inset-y-0 {
  top: 0px !important;
  bottom: 0px !important;
}

.top-1 {
  top: 1px !important;
}

.right-1 {
  right: 1px !important;
}

.bottom-1 {
  bottom: 1px !important;
}

.left-1 {
  left: 1px !important;
}

.inset-1 {
  inset: 1px !important;
}

.inset-x-1 {
  right: 1px !important;
  left: 1px !important;
}

.inset-y-1 {
  top: 1px !important;
  bottom: 1px !important;
}

.top-2 {
  top: 2px !important;
}

.right-2 {
  right: 2px !important;
}

.bottom-2 {
  bottom: 2px !important;
}

.left-2 {
  left: 2px !important;
}

.inset-2 {
  inset: 2px !important;
}

.inset-x-2 {
  right: 2px !important;
  left: 2px !important;
}

.inset-y-2 {
  top: 2px !important;
  bottom: 2px !important;
}

.top-3 {
  top: 3px !important;
}

.right-3 {
  right: 3px !important;
}

.bottom-3 {
  bottom: 3px !important;
}

.left-3 {
  left: 3px !important;
}

.inset-3 {
  inset: 3px !important;
}

.inset-x-3 {
  right: 3px !important;
  left: 3px !important;
}

.inset-y-3 {
  top: 3px !important;
  bottom: 3px !important;
}

.top-4 {
  top: 4px !important;
}

.right-4 {
  right: 4px !important;
}

.bottom-4 {
  bottom: 4px !important;
}

.left-4 {
  left: 4px !important;
}

.inset-4 {
  inset: 4px !important;
}

.inset-x-4 {
  right: 4px !important;
  left: 4px !important;
}

.inset-y-4 {
  top: 4px !important;
  bottom: 4px !important;
}

.top-5 {
  top: 5px !important;
}

.right-5 {
  right: 5px !important;
}

.bottom-5 {
  bottom: 5px !important;
}

.left-5 {
  left: 5px !important;
}

.inset-5 {
  inset: 5px !important;
}

.inset-x-5 {
  right: 5px !important;
  left: 5px !important;
}

.inset-y-5 {
  top: 5px !important;
  bottom: 5px !important;
}

.top-6 {
  top: 6px !important;
}

.right-6 {
  right: 6px !important;
}

.bottom-6 {
  bottom: 6px !important;
}

.left-6 {
  left: 6px !important;
}

.inset-6 {
  inset: 6px !important;
}

.inset-x-6 {
  right: 6px !important;
  left: 6px !important;
}

.inset-y-6 {
  top: 6px !important;
  bottom: 6px !important;
}

.top-7 {
  top: 7px !important;
}

.right-7 {
  right: 7px !important;
}

.bottom-7 {
  bottom: 7px !important;
}

.left-7 {
  left: 7px !important;
}

.inset-7 {
  inset: 7px !important;
}

.inset-x-7 {
  right: 7px !important;
  left: 7px !important;
}

.inset-y-7 {
  top: 7px !important;
  bottom: 7px !important;
}

.top-8 {
  top: 8px !important;
}

.right-8 {
  right: 8px !important;
}

.bottom-8 {
  bottom: 8px !important;
}

.left-8 {
  left: 8px !important;
}

.inset-8 {
  inset: 8px !important;
}

.inset-x-8 {
  right: 8px !important;
  left: 8px !important;
}

.inset-y-8 {
  top: 8px !important;
  bottom: 8px !important;
}

.top-9 {
  top: 9px !important;
}

.right-9 {
  right: 9px !important;
}

.bottom-9 {
  bottom: 9px !important;
}

.left-9 {
  left: 9px !important;
}

.inset-9 {
  inset: 9px !important;
}

.inset-x-9 {
  right: 9px !important;
  left: 9px !important;
}

.inset-y-9 {
  top: 9px !important;
  bottom: 9px !important;
}

.top-10 {
  top: 10px !important;
}

.right-10 {
  right: 10px !important;
}

.bottom-10 {
  bottom: 10px !important;
}

.left-10 {
  left: 10px !important;
}

.inset-10 {
  inset: 10px !important;
}

.inset-x-10 {
  right: 10px !important;
  left: 10px !important;
}

.inset-y-10 {
  top: 10px !important;
  bottom: 10px !important;
}

.top-11 {
  top: 11px !important;
}

.right-11 {
  right: 11px !important;
}

.bottom-11 {
  bottom: 11px !important;
}

.left-11 {
  left: 11px !important;
}

.inset-11 {
  inset: 11px !important;
}

.inset-x-11 {
  right: 11px !important;
  left: 11px !important;
}

.inset-y-11 {
  top: 11px !important;
  bottom: 11px !important;
}

.top-12 {
  top: 12px !important;
}

.right-12 {
  right: 12px !important;
}

.bottom-12 {
  bottom: 12px !important;
}

.left-12 {
  left: 12px !important;
}

.inset-12 {
  inset: 12px !important;
}

.inset-x-12 {
  right: 12px !important;
  left: 12px !important;
}

.inset-y-12 {
  top: 12px !important;
  bottom: 12px !important;
}

.top-13 {
  top: 13px !important;
}

.right-13 {
  right: 13px !important;
}

.bottom-13 {
  bottom: 13px !important;
}

.left-13 {
  left: 13px !important;
}

.inset-13 {
  inset: 13px !important;
}

.inset-x-13 {
  right: 13px !important;
  left: 13px !important;
}

.inset-y-13 {
  top: 13px !important;
  bottom: 13px !important;
}

.top-14 {
  top: 14px !important;
}

.right-14 {
  right: 14px !important;
}

.bottom-14 {
  bottom: 14px !important;
}

.left-14 {
  left: 14px !important;
}

.inset-14 {
  inset: 14px !important;
}

.inset-x-14 {
  right: 14px !important;
  left: 14px !important;
}

.inset-y-14 {
  top: 14px !important;
  bottom: 14px !important;
}

.top-15 {
  top: 15px !important;
}

.right-15 {
  right: 15px !important;
}

.bottom-15 {
  bottom: 15px !important;
}

.left-15 {
  left: 15px !important;
}

.inset-15 {
  inset: 15px !important;
}

.inset-x-15 {
  right: 15px !important;
  left: 15px !important;
}

.inset-y-15 {
  top: 15px !important;
  bottom: 15px !important;
}

.top-16 {
  top: 16px !important;
}

.right-16 {
  right: 16px !important;
}

.bottom-16 {
  bottom: 16px !important;
}

.left-16 {
  left: 16px !important;
}

.inset-16 {
  inset: 16px !important;
}

.inset-x-16 {
  right: 16px !important;
  left: 16px !important;
}

.inset-y-16 {
  top: 16px !important;
  bottom: 16px !important;
}

.top-17 {
  top: 17px !important;
}

.right-17 {
  right: 17px !important;
}

.bottom-17 {
  bottom: 17px !important;
}

.left-17 {
  left: 17px !important;
}

.inset-17 {
  inset: 17px !important;
}

.inset-x-17 {
  right: 17px !important;
  left: 17px !important;
}

.inset-y-17 {
  top: 17px !important;
  bottom: 17px !important;
}

.top-18 {
  top: 18px !important;
}

.right-18 {
  right: 18px !important;
}

.bottom-18 {
  bottom: 18px !important;
}

.left-18 {
  left: 18px !important;
}

.inset-18 {
  inset: 18px !important;
}

.inset-x-18 {
  right: 18px !important;
  left: 18px !important;
}

.inset-y-18 {
  top: 18px !important;
  bottom: 18px !important;
}

.top-19 {
  top: 19px !important;
}

.right-19 {
  right: 19px !important;
}

.bottom-19 {
  bottom: 19px !important;
}

.left-19 {
  left: 19px !important;
}

.inset-19 {
  inset: 19px !important;
}

.inset-x-19 {
  right: 19px !important;
  left: 19px !important;
}

.inset-y-19 {
  top: 19px !important;
  bottom: 19px !important;
}

.top-20 {
  top: 20px !important;
}

.right-20 {
  right: 20px !important;
}

.bottom-20 {
  bottom: 20px !important;
}

.left-20 {
  left: 20px !important;
}

.inset-20 {
  inset: 20px !important;
}

.inset-x-20 {
  right: 20px !important;
  left: 20px !important;
}

.inset-y-20 {
  top: 20px !important;
  bottom: 20px !important;
}

.top-21 {
  top: 21px !important;
}

.right-21 {
  right: 21px !important;
}

.bottom-21 {
  bottom: 21px !important;
}

.left-21 {
  left: 21px !important;
}

.inset-21 {
  inset: 21px !important;
}

.inset-x-21 {
  right: 21px !important;
  left: 21px !important;
}

.inset-y-21 {
  top: 21px !important;
  bottom: 21px !important;
}

.top-22 {
  top: 22px !important;
}

.right-22 {
  right: 22px !important;
}

.bottom-22 {
  bottom: 22px !important;
}

.left-22 {
  left: 22px !important;
}

.inset-22 {
  inset: 22px !important;
}

.inset-x-22 {
  right: 22px !important;
  left: 22px !important;
}

.inset-y-22 {
  top: 22px !important;
  bottom: 22px !important;
}

.top-23 {
  top: 23px !important;
}

.right-23 {
  right: 23px !important;
}

.bottom-23 {
  bottom: 23px !important;
}

.left-23 {
  left: 23px !important;
}

.inset-23 {
  inset: 23px !important;
}

.inset-x-23 {
  right: 23px !important;
  left: 23px !important;
}

.inset-y-23 {
  top: 23px !important;
  bottom: 23px !important;
}

.top-24 {
  top: 24px !important;
}

.right-24 {
  right: 24px !important;
}

.bottom-24 {
  bottom: 24px !important;
}

.left-24 {
  left: 24px !important;
}

.inset-24 {
  inset: 24px !important;
}

.inset-x-24 {
  right: 24px !important;
  left: 24px !important;
}

.inset-y-24 {
  top: 24px !important;
  bottom: 24px !important;
}

.top-25 {
  top: 25px !important;
}

.right-25 {
  right: 25px !important;
}

.bottom-25 {
  bottom: 25px !important;
}

.left-25 {
  left: 25px !important;
}

.inset-25 {
  inset: 25px !important;
}

.inset-x-25 {
  right: 25px !important;
  left: 25px !important;
}

.inset-y-25 {
  top: 25px !important;
  bottom: 25px !important;
}

.top-26 {
  top: 26px !important;
}

.right-26 {
  right: 26px !important;
}

.bottom-26 {
  bottom: 26px !important;
}

.left-26 {
  left: 26px !important;
}

.inset-26 {
  inset: 26px !important;
}

.inset-x-26 {
  right: 26px !important;
  left: 26px !important;
}

.inset-y-26 {
  top: 26px !important;
  bottom: 26px !important;
}

.top-27 {
  top: 27px !important;
}

.right-27 {
  right: 27px !important;
}

.bottom-27 {
  bottom: 27px !important;
}

.left-27 {
  left: 27px !important;
}

.inset-27 {
  inset: 27px !important;
}

.inset-x-27 {
  right: 27px !important;
  left: 27px !important;
}

.inset-y-27 {
  top: 27px !important;
  bottom: 27px !important;
}

.top-28 {
  top: 28px !important;
}

.right-28 {
  right: 28px !important;
}

.bottom-28 {
  bottom: 28px !important;
}

.left-28 {
  left: 28px !important;
}

.inset-28 {
  inset: 28px !important;
}

.inset-x-28 {
  right: 28px !important;
  left: 28px !important;
}

.inset-y-28 {
  top: 28px !important;
  bottom: 28px !important;
}

.top-29 {
  top: 29px !important;
}

.right-29 {
  right: 29px !important;
}

.bottom-29 {
  bottom: 29px !important;
}

.left-29 {
  left: 29px !important;
}

.inset-29 {
  inset: 29px !important;
}

.inset-x-29 {
  right: 29px !important;
  left: 29px !important;
}

.inset-y-29 {
  top: 29px !important;
  bottom: 29px !important;
}

.top-30 {
  top: 30px !important;
}

.right-30 {
  right: 30px !important;
}

.bottom-30 {
  bottom: 30px !important;
}

.left-30 {
  left: 30px !important;
}

.inset-30 {
  inset: 30px !important;
}

.inset-x-30 {
  right: 30px !important;
  left: 30px !important;
}

.inset-y-30 {
  top: 30px !important;
  bottom: 30px !important;
}

.top-31 {
  top: 31px !important;
}

.right-31 {
  right: 31px !important;
}

.bottom-31 {
  bottom: 31px !important;
}

.left-31 {
  left: 31px !important;
}

.inset-31 {
  inset: 31px !important;
}

.inset-x-31 {
  right: 31px !important;
  left: 31px !important;
}

.inset-y-31 {
  top: 31px !important;
  bottom: 31px !important;
}

.top-32 {
  top: 32px !important;
}

.right-32 {
  right: 32px !important;
}

.bottom-32 {
  bottom: 32px !important;
}

.left-32 {
  left: 32px !important;
}

.inset-32 {
  inset: 32px !important;
}

.inset-x-32 {
  right: 32px !important;
  left: 32px !important;
}

.inset-y-32 {
  top: 32px !important;
  bottom: 32px !important;
}

.top-n0 {
  top: 0px !important;
}

.right-n0 {
  right: 0px !important;
}

.bottom-n0 {
  bottom: 0px !important;
}

.left-n0 {
  left: 0px !important;
}

.inset-n0 {
  inset: 0px !important;
}

.inset-x-n0 {
  right: 0px !important;
  left: 0px !important;
}

.inset-y-n0 {
  top: 0px !important;
  bottom: 0px !important;
}

.top-n1 {
  top: -1px !important;
}

.right-n1 {
  right: -1px !important;
}

.bottom-n1 {
  bottom: -1px !important;
}

.left-n1 {
  left: -1px !important;
}

.inset-n1 {
  inset: -1px !important;
}

.inset-x-n1 {
  right: -1px !important;
  left: -1px !important;
}

.inset-y-n1 {
  top: -1px !important;
  bottom: -1px !important;
}

.top-n2 {
  top: -2px !important;
}

.right-n2 {
  right: -2px !important;
}

.bottom-n2 {
  bottom: -2px !important;
}

.left-n2 {
  left: -2px !important;
}

.inset-n2 {
  inset: -2px !important;
}

.inset-x-n2 {
  right: -2px !important;
  left: -2px !important;
}

.inset-y-n2 {
  top: -2px !important;
  bottom: -2px !important;
}

.top-n3 {
  top: -3px !important;
}

.right-n3 {
  right: -3px !important;
}

.bottom-n3 {
  bottom: -3px !important;
}

.left-n3 {
  left: -3px !important;
}

.inset-n3 {
  inset: -3px !important;
}

.inset-x-n3 {
  right: -3px !important;
  left: -3px !important;
}

.inset-y-n3 {
  top: -3px !important;
  bottom: -3px !important;
}

.top-n4 {
  top: -4px !important;
}

.right-n4 {
  right: -4px !important;
}

.bottom-n4 {
  bottom: -4px !important;
}

.left-n4 {
  left: -4px !important;
}

.inset-n4 {
  inset: -4px !important;
}

.inset-x-n4 {
  right: -4px !important;
  left: -4px !important;
}

.inset-y-n4 {
  top: -4px !important;
  bottom: -4px !important;
}

.top-n5 {
  top: -5px !important;
}

.right-n5 {
  right: -5px !important;
}

.bottom-n5 {
  bottom: -5px !important;
}

.left-n5 {
  left: -5px !important;
}

.inset-n5 {
  inset: -5px !important;
}

.inset-x-n5 {
  right: -5px !important;
  left: -5px !important;
}

.inset-y-n5 {
  top: -5px !important;
  bottom: -5px !important;
}

.top-n6 {
  top: -6px !important;
}

.right-n6 {
  right: -6px !important;
}

.bottom-n6 {
  bottom: -6px !important;
}

.left-n6 {
  left: -6px !important;
}

.inset-n6 {
  inset: -6px !important;
}

.inset-x-n6 {
  right: -6px !important;
  left: -6px !important;
}

.inset-y-n6 {
  top: -6px !important;
  bottom: -6px !important;
}

.top-n7 {
  top: -7px !important;
}

.right-n7 {
  right: -7px !important;
}

.bottom-n7 {
  bottom: -7px !important;
}

.left-n7 {
  left: -7px !important;
}

.inset-n7 {
  inset: -7px !important;
}

.inset-x-n7 {
  right: -7px !important;
  left: -7px !important;
}

.inset-y-n7 {
  top: -7px !important;
  bottom: -7px !important;
}

.top-n8 {
  top: -8px !important;
}

.right-n8 {
  right: -8px !important;
}

.bottom-n8 {
  bottom: -8px !important;
}

.left-n8 {
  left: -8px !important;
}

.inset-n8 {
  inset: -8px !important;
}

.inset-x-n8 {
  right: -8px !important;
  left: -8px !important;
}

.inset-y-n8 {
  top: -8px !important;
  bottom: -8px !important;
}

.top-n9 {
  top: -9px !important;
}

.right-n9 {
  right: -9px !important;
}

.bottom-n9 {
  bottom: -9px !important;
}

.left-n9 {
  left: -9px !important;
}

.inset-n9 {
  inset: -9px !important;
}

.inset-x-n9 {
  right: -9px !important;
  left: -9px !important;
}

.inset-y-n9 {
  top: -9px !important;
  bottom: -9px !important;
}

.top-n10 {
  top: -10px !important;
}

.right-n10 {
  right: -10px !important;
}

.bottom-n10 {
  bottom: -10px !important;
}

.left-n10 {
  left: -10px !important;
}

.inset-n10 {
  inset: -10px !important;
}

.inset-x-n10 {
  right: -10px !important;
  left: -10px !important;
}

.inset-y-n10 {
  top: -10px !important;
  bottom: -10px !important;
}

.top-n11 {
  top: -11px !important;
}

.right-n11 {
  right: -11px !important;
}

.bottom-n11 {
  bottom: -11px !important;
}

.left-n11 {
  left: -11px !important;
}

.inset-n11 {
  inset: -11px !important;
}

.inset-x-n11 {
  right: -11px !important;
  left: -11px !important;
}

.inset-y-n11 {
  top: -11px !important;
  bottom: -11px !important;
}

.top-n12 {
  top: -12px !important;
}

.right-n12 {
  right: -12px !important;
}

.bottom-n12 {
  bottom: -12px !important;
}

.left-n12 {
  left: -12px !important;
}

.inset-n12 {
  inset: -12px !important;
}

.inset-x-n12 {
  right: -12px !important;
  left: -12px !important;
}

.inset-y-n12 {
  top: -12px !important;
  bottom: -12px !important;
}

.top-n13 {
  top: -13px !important;
}

.right-n13 {
  right: -13px !important;
}

.bottom-n13 {
  bottom: -13px !important;
}

.left-n13 {
  left: -13px !important;
}

.inset-n13 {
  inset: -13px !important;
}

.inset-x-n13 {
  right: -13px !important;
  left: -13px !important;
}

.inset-y-n13 {
  top: -13px !important;
  bottom: -13px !important;
}

.top-n14 {
  top: -14px !important;
}

.right-n14 {
  right: -14px !important;
}

.bottom-n14 {
  bottom: -14px !important;
}

.left-n14 {
  left: -14px !important;
}

.inset-n14 {
  inset: -14px !important;
}

.inset-x-n14 {
  right: -14px !important;
  left: -14px !important;
}

.inset-y-n14 {
  top: -14px !important;
  bottom: -14px !important;
}

.top-n15 {
  top: -15px !important;
}

.right-n15 {
  right: -15px !important;
}

.bottom-n15 {
  bottom: -15px !important;
}

.left-n15 {
  left: -15px !important;
}

.inset-n15 {
  inset: -15px !important;
}

.inset-x-n15 {
  right: -15px !important;
  left: -15px !important;
}

.inset-y-n15 {
  top: -15px !important;
  bottom: -15px !important;
}

.top-n16 {
  top: -16px !important;
}

.right-n16 {
  right: -16px !important;
}

.bottom-n16 {
  bottom: -16px !important;
}

.left-n16 {
  left: -16px !important;
}

.inset-n16 {
  inset: -16px !important;
}

.inset-x-n16 {
  right: -16px !important;
  left: -16px !important;
}

.inset-y-n16 {
  top: -16px !important;
  bottom: -16px !important;
}

.top-n17 {
  top: -17px !important;
}

.right-n17 {
  right: -17px !important;
}

.bottom-n17 {
  bottom: -17px !important;
}

.left-n17 {
  left: -17px !important;
}

.inset-n17 {
  inset: -17px !important;
}

.inset-x-n17 {
  right: -17px !important;
  left: -17px !important;
}

.inset-y-n17 {
  top: -17px !important;
  bottom: -17px !important;
}

.top-n18 {
  top: -18px !important;
}

.right-n18 {
  right: -18px !important;
}

.bottom-n18 {
  bottom: -18px !important;
}

.left-n18 {
  left: -18px !important;
}

.inset-n18 {
  inset: -18px !important;
}

.inset-x-n18 {
  right: -18px !important;
  left: -18px !important;
}

.inset-y-n18 {
  top: -18px !important;
  bottom: -18px !important;
}

.top-n19 {
  top: -19px !important;
}

.right-n19 {
  right: -19px !important;
}

.bottom-n19 {
  bottom: -19px !important;
}

.left-n19 {
  left: -19px !important;
}

.inset-n19 {
  inset: -19px !important;
}

.inset-x-n19 {
  right: -19px !important;
  left: -19px !important;
}

.inset-y-n19 {
  top: -19px !important;
  bottom: -19px !important;
}

.top-n20 {
  top: -20px !important;
}

.right-n20 {
  right: -20px !important;
}

.bottom-n20 {
  bottom: -20px !important;
}

.left-n20 {
  left: -20px !important;
}

.inset-n20 {
  inset: -20px !important;
}

.inset-x-n20 {
  right: -20px !important;
  left: -20px !important;
}

.inset-y-n20 {
  top: -20px !important;
  bottom: -20px !important;
}

.top-n21 {
  top: -21px !important;
}

.right-n21 {
  right: -21px !important;
}

.bottom-n21 {
  bottom: -21px !important;
}

.left-n21 {
  left: -21px !important;
}

.inset-n21 {
  inset: -21px !important;
}

.inset-x-n21 {
  right: -21px !important;
  left: -21px !important;
}

.inset-y-n21 {
  top: -21px !important;
  bottom: -21px !important;
}

.top-n22 {
  top: -22px !important;
}

.right-n22 {
  right: -22px !important;
}

.bottom-n22 {
  bottom: -22px !important;
}

.left-n22 {
  left: -22px !important;
}

.inset-n22 {
  inset: -22px !important;
}

.inset-x-n22 {
  right: -22px !important;
  left: -22px !important;
}

.inset-y-n22 {
  top: -22px !important;
  bottom: -22px !important;
}

.top-n23 {
  top: -23px !important;
}

.right-n23 {
  right: -23px !important;
}

.bottom-n23 {
  bottom: -23px !important;
}

.left-n23 {
  left: -23px !important;
}

.inset-n23 {
  inset: -23px !important;
}

.inset-x-n23 {
  right: -23px !important;
  left: -23px !important;
}

.inset-y-n23 {
  top: -23px !important;
  bottom: -23px !important;
}

.top-n24 {
  top: -24px !important;
}

.right-n24 {
  right: -24px !important;
}

.bottom-n24 {
  bottom: -24px !important;
}

.left-n24 {
  left: -24px !important;
}

.inset-n24 {
  inset: -24px !important;
}

.inset-x-n24 {
  right: -24px !important;
  left: -24px !important;
}

.inset-y-n24 {
  top: -24px !important;
  bottom: -24px !important;
}

.top-n25 {
  top: -25px !important;
}

.right-n25 {
  right: -25px !important;
}

.bottom-n25 {
  bottom: -25px !important;
}

.left-n25 {
  left: -25px !important;
}

.inset-n25 {
  inset: -25px !important;
}

.inset-x-n25 {
  right: -25px !important;
  left: -25px !important;
}

.inset-y-n25 {
  top: -25px !important;
  bottom: -25px !important;
}

.top-n26 {
  top: -26px !important;
}

.right-n26 {
  right: -26px !important;
}

.bottom-n26 {
  bottom: -26px !important;
}

.left-n26 {
  left: -26px !important;
}

.inset-n26 {
  inset: -26px !important;
}

.inset-x-n26 {
  right: -26px !important;
  left: -26px !important;
}

.inset-y-n26 {
  top: -26px !important;
  bottom: -26px !important;
}

.top-n27 {
  top: -27px !important;
}

.right-n27 {
  right: -27px !important;
}

.bottom-n27 {
  bottom: -27px !important;
}

.left-n27 {
  left: -27px !important;
}

.inset-n27 {
  inset: -27px !important;
}

.inset-x-n27 {
  right: -27px !important;
  left: -27px !important;
}

.inset-y-n27 {
  top: -27px !important;
  bottom: -27px !important;
}

.top-n28 {
  top: -28px !important;
}

.right-n28 {
  right: -28px !important;
}

.bottom-n28 {
  bottom: -28px !important;
}

.left-n28 {
  left: -28px !important;
}

.inset-n28 {
  inset: -28px !important;
}

.inset-x-n28 {
  right: -28px !important;
  left: -28px !important;
}

.inset-y-n28 {
  top: -28px !important;
  bottom: -28px !important;
}

.top-n29 {
  top: -29px !important;
}

.right-n29 {
  right: -29px !important;
}

.bottom-n29 {
  bottom: -29px !important;
}

.left-n29 {
  left: -29px !important;
}

.inset-n29 {
  inset: -29px !important;
}

.inset-x-n29 {
  right: -29px !important;
  left: -29px !important;
}

.inset-y-n29 {
  top: -29px !important;
  bottom: -29px !important;
}

.top-n30 {
  top: -30px !important;
}

.right-n30 {
  right: -30px !important;
}

.bottom-n30 {
  bottom: -30px !important;
}

.left-n30 {
  left: -30px !important;
}

.inset-n30 {
  inset: -30px !important;
}

.inset-x-n30 {
  right: -30px !important;
  left: -30px !important;
}

.inset-y-n30 {
  top: -30px !important;
  bottom: -30px !important;
}

.top-n31 {
  top: -31px !important;
}

.right-n31 {
  right: -31px !important;
}

.bottom-n31 {
  bottom: -31px !important;
}

.left-n31 {
  left: -31px !important;
}

.inset-n31 {
  inset: -31px !important;
}

.inset-x-n31 {
  right: -31px !important;
  left: -31px !important;
}

.inset-y-n31 {
  top: -31px !important;
  bottom: -31px !important;
}

.top-n32 {
  top: -32px !important;
}

.right-n32 {
  right: -32px !important;
}

.bottom-n32 {
  bottom: -32px !important;
}

.left-n32 {
  left: -32px !important;
}

.inset-n32 {
  inset: -32px !important;
}

.inset-x-n32 {
  right: -32px !important;
  left: -32px !important;
}

.inset-y-n32 {
  top: -32px !important;
  bottom: -32px !important;
}

.z-index-0 {
  z-index: 0 !important;
}

.z-index-1 {
  z-index: 1 !important;
}

.z-index-2 {
  z-index: 2 !important;
}

.z-index-3 {
  z-index: 3 !important;
}

.z-index-4 {
  z-index: 4 !important;
}

.z-index-5 {
  z-index: 5 !important;
}

.z-index-6 {
  z-index: 6 !important;
}

.z-index-7 {
  z-index: 7 !important;
}

.z-index-8 {
  z-index: 8 !important;
}

.z-index-9 {
  z-index: 9 !important;
}

.z-index-10 {
  z-index: 10 !important;
}

.z-index-20 {
  z-index: 20 !important;
}

.z-index-30 {
  z-index: 30 !important;
}

.z-index-40 {
  z-index: 40 !important;
}

.z-index-50 {
  z-index: 50 !important;
}

.z-index-60 {
  z-index: 60 !important;
}

.z-index-70 {
  z-index: 70 !important;
}

.z-index-80 {
  z-index: 80 !important;
}

.z-index-90 {
  z-index: 90 !important;
}

.z-index-100 {
  z-index: 100 !important;
}

.shadow {
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2), 0 1px 2px -1px rgba(0, 0, 0, 0.2) !important;
}

.opacity-0 {
  opacity: 0 !important;
}

.opacity-10 {
  opacity: 0.1 !important;
}

.opacity-50 {
  opacity: 0.5 !important;
}

.opacity-70 {
  opacity: 0.7 !important;
}

.opacity-100 {
  opacity: 1 !important;
}

.flex-row {
  flex-direction: row !important;
}

.flex-column {
  flex-direction: column !important;
}

.flex-row-reverse {
  flex-direction: row-reverse !important;
}

.flex-column-reverse {
  flex-direction: column-reverse !important;
}

.flex-wrap {
  flex-wrap: wrap !important;
}

.flex-nowrap {
  flex-wrap: nowrap !important;
}

.flex-wrap-reverse {
  flex-wrap: wrap-reverse !important;
}

.flex-fill {
  flex: 1 1 auto !important;
}

.flex-basis-1 {
  flex: 0 0 8.3333333333% !important;
}

.flex-basis-2 {
  flex: 0 0 16.6666666666% !important;
}

.flex-basis-3 {
  flex: 0 0 24.9999999999% !important;
}

.flex-basis-4 {
  flex: 0 0 33.3333333332% !important;
}

.flex-basis-5 {
  flex: 0 0 41.6666666665% !important;
}

.flex-basis-6 {
  flex: 0 0 49.9999999998% !important;
}

.flex-basis-7 {
  flex: 0 0 58.3333333331% !important;
}

.flex-basis-8 {
  flex: 0 0 66.6666666664% !important;
}

.flex-basis-9 {
  flex: 0 0 74.9999999997% !important;
}

.flex-basis-10 {
  flex: 0 0 83.333333333% !important;
}

.flex-basis-11 {
  flex: 0 0 91.6666666663% !important;
}

.flex-basis-12 {
  flex: 0 0 99.9999999996% !important;
}

.flex-basis-full {
  flex-basis: 100% !important;
}

.flex-basis-0 {
  flex-basis: 0 !important;
}

.flex-basis-auto {
  flex-basis: auto !important;
}

.justify-content-start {
  justify-content: flex-start !important;
}

.justify-content-end {
  justify-content: flex-end !important;
}

.justify-content-center {
  justify-content: center !important;
}

.justify-content-between {
  justify-content: space-between !important;
}

.justify-content-around {
  justify-content: space-around !important;
}

.align-items-start {
  align-items: flex-start !important;
}

.align-items-end {
  align-items: flex-end !important;
}

.align-items-center {
  align-items: center !important;
}

.align-items-baseline {
  align-items: baseline !important;
}

.align-items-stretch {
  align-items: stretch !important;
}

.align-content-start {
  align-content: flex-start !important;
}

.align-content-end {
  align-content: flex-end !important;
}

.align-content-center {
  align-content: center !important;
}

.align-content-between {
  align-content: space-between !important;
}

.align-content-around {
  align-content: space-around !important;
}

.align-content-stretch {
  align-content: stretch !important;
}

.align-self-auto {
  align-self: auto !important;
}

.align-self-start {
  align-self: flex-start !important;
}

.align-self-end {
  align-self: flex-end !important;
}

.align-self-center {
  align-self: center !important;
}

.align-self-baseline {
  align-self: baseline !important;
}

.align-self-stretch {
  align-self: stretch !important;
}

.gap-0 {
  gap: 0px !important;
}

.gap-x-0 {
  column-gap: 0px !important;
}

.gap-y-0 {
  row-gap: 0px !important;
}

.gap-1 {
  gap: 1px !important;
}

.gap-x-1 {
  column-gap: 1px !important;
}

.gap-y-1 {
  row-gap: 1px !important;
}

.gap-2 {
  gap: 2px !important;
}

.gap-x-2 {
  column-gap: 2px !important;
}

.gap-y-2 {
  row-gap: 2px !important;
}

.gap-3 {
  gap: 3px !important;
}

.gap-x-3 {
  column-gap: 3px !important;
}

.gap-y-3 {
  row-gap: 3px !important;
}

.gap-4 {
  gap: 4px !important;
}

.gap-x-4 {
  column-gap: 4px !important;
}

.gap-y-4 {
  row-gap: 4px !important;
}

.gap-5 {
  gap: 5px !important;
}

.gap-x-5 {
  column-gap: 5px !important;
}

.gap-y-5 {
  row-gap: 5px !important;
}

.gap-6 {
  gap: 6px !important;
}

.gap-x-6 {
  column-gap: 6px !important;
}

.gap-y-6 {
  row-gap: 6px !important;
}

.gap-7 {
  gap: 7px !important;
}

.gap-x-7 {
  column-gap: 7px !important;
}

.gap-y-7 {
  row-gap: 7px !important;
}

.gap-8 {
  gap: 8px !important;
}

.gap-x-8 {
  column-gap: 8px !important;
}

.gap-y-8 {
  row-gap: 8px !important;
}

.gap-9 {
  gap: 9px !important;
}

.gap-x-9 {
  column-gap: 9px !important;
}

.gap-y-9 {
  row-gap: 9px !important;
}

.gap-10 {
  gap: 10px !important;
}

.gap-x-10 {
  column-gap: 10px !important;
}

.gap-y-10 {
  row-gap: 10px !important;
}

.gap-11 {
  gap: 11px !important;
}

.gap-x-11 {
  column-gap: 11px !important;
}

.gap-y-11 {
  row-gap: 11px !important;
}

.gap-12 {
  gap: 12px !important;
}

.gap-x-12 {
  column-gap: 12px !important;
}

.gap-y-12 {
  row-gap: 12px !important;
}

.gap-13 {
  gap: 13px !important;
}

.gap-x-13 {
  column-gap: 13px !important;
}

.gap-y-13 {
  row-gap: 13px !important;
}

.gap-14 {
  gap: 14px !important;
}

.gap-x-14 {
  column-gap: 14px !important;
}

.gap-y-14 {
  row-gap: 14px !important;
}

.gap-15 {
  gap: 15px !important;
}

.gap-x-15 {
  column-gap: 15px !important;
}

.gap-y-15 {
  row-gap: 15px !important;
}

.gap-16 {
  gap: 16px !important;
}

.gap-x-16 {
  column-gap: 16px !important;
}

.gap-y-16 {
  row-gap: 16px !important;
}

.gap-17 {
  gap: 17px !important;
}

.gap-x-17 {
  column-gap: 17px !important;
}

.gap-y-17 {
  row-gap: 17px !important;
}

.gap-18 {
  gap: 18px !important;
}

.gap-x-18 {
  column-gap: 18px !important;
}

.gap-y-18 {
  row-gap: 18px !important;
}

.gap-19 {
  gap: 19px !important;
}

.gap-x-19 {
  column-gap: 19px !important;
}

.gap-y-19 {
  row-gap: 19px !important;
}

.gap-20 {
  gap: 20px !important;
}

.gap-x-20 {
  column-gap: 20px !important;
}

.gap-y-20 {
  row-gap: 20px !important;
}

.gap-21 {
  gap: 21px !important;
}

.gap-x-21 {
  column-gap: 21px !important;
}

.gap-y-21 {
  row-gap: 21px !important;
}

.gap-22 {
  gap: 22px !important;
}

.gap-x-22 {
  column-gap: 22px !important;
}

.gap-y-22 {
  row-gap: 22px !important;
}

.gap-23 {
  gap: 23px !important;
}

.gap-x-23 {
  column-gap: 23px !important;
}

.gap-y-23 {
  row-gap: 23px !important;
}

.gap-24 {
  gap: 24px !important;
}

.gap-x-24 {
  column-gap: 24px !important;
}

.gap-y-24 {
  row-gap: 24px !important;
}

.gap-25 {
  gap: 25px !important;
}

.gap-x-25 {
  column-gap: 25px !important;
}

.gap-y-25 {
  row-gap: 25px !important;
}

.gap-26 {
  gap: 26px !important;
}

.gap-x-26 {
  column-gap: 26px !important;
}

.gap-y-26 {
  row-gap: 26px !important;
}

.gap-27 {
  gap: 27px !important;
}

.gap-x-27 {
  column-gap: 27px !important;
}

.gap-y-27 {
  row-gap: 27px !important;
}

.gap-28 {
  gap: 28px !important;
}

.gap-x-28 {
  column-gap: 28px !important;
}

.gap-y-28 {
  row-gap: 28px !important;
}

.gap-29 {
  gap: 29px !important;
}

.gap-x-29 {
  column-gap: 29px !important;
}

.gap-y-29 {
  row-gap: 29px !important;
}

.gap-30 {
  gap: 30px !important;
}

.gap-x-30 {
  column-gap: 30px !important;
}

.gap-y-30 {
  row-gap: 30px !important;
}

.gap-31 {
  gap: 31px !important;
}

.gap-x-31 {
  column-gap: 31px !important;
}

.gap-y-31 {
  row-gap: 31px !important;
}

.gap-32 {
  gap: 32px !important;
}

.gap-x-32 {
  column-gap: 32px !important;
}

.gap-y-32 {
  row-gap: 32px !important;
}

.order-0 {
  order: 0 !important;
}

.order-1 {
  order: 1 !important;
}

.order-2 {
  order: 2 !important;
}

.order-3 {
  order: 3 !important;
}

.order-4 {
  order: 4 !important;
}

.order-5 {
  order: 5 !important;
}

.order-6 {
  order: 6 !important;
}

.order-7 {
  order: 7 !important;
}

.order-8 {
  order: 8 !important;
}

.order-9 {
  order: 9 !important;
}

.order-10 {
  order: 10 !important;
}

.order-11 {
  order: 11 !important;
}

.order-12 {
  order: 12 !important;
}

.order-first {
  order: 0 !important;
}

.order-last {
  order: 13 !important;
}

.float-left {
  float: left !important;
}

.float-right {
  float: right !important;
}

.float-none {
  float: none !important;
}

.clearfix::after {
  display: block;
  clear: both;
  content: "";
}

.border {
  border: 1px solid var(--border-light) !important;
}

.border-top {
  border-top: 1px solid var(--border-light) !important;
}

.border-right {
  border-right: 1px solid var(--border-light) !important;
}

.border-bottom {
  border-bottom: 1px solid var(--border-light) !important;
}

.border-left {
  border-left: 1px solid var(--border-light) !important;
}

.border-0 {
  border: none !important;
}

.border-top-0 {
  border-top: none !important;
}

.border-right-0 {
  border-right: none !important;
}

.border-bottom-0 {
  border-bottom: none !important;
}

.border-left-0 {
  border-left: none !important;
}

.border-w-0 {
  border-width: 0px !important;
}

.border-w-1 {
  border-width: 1px !important;
}

.border-w-2 {
  border-width: 2px !important;
}

.border-w-3 {
  border-width: 3px !important;
}

.border-w-4 {
  border-width: 4px !important;
}

.border-w-5 {
  border-width: 5px !important;
}

.border-w-6 {
  border-width: 6px !important;
}

.border-w-7 {
  border-width: 7px !important;
}

.border-w-8 {
  border-width: 8px !important;
}

.border-w-9 {
  border-width: 9px !important;
}

.border-w-10 {
  border-width: 10px !important;
}

.border-w-11 {
  border-width: 11px !important;
}

.rounded {
  border-radius: var(--border-radius) !important;
}

.rounded-top {
  border-top-left-radius: var(--border-radius) !important;
  border-top-right-radius: var(--border-radius) !important;
}

.rounded-right {
  border-top-right-radius: var(--border-radius) !important;
  border-bottom-right-radius: var(--border-radius) !important;
}

.rounded-bottom {
  border-bottom-right-radius: var(--border-radius) !important;
  border-bottom-left-radius: var(--border-radius) !important;
}

.rounded-left {
  border-top-left-radius: var(--border-radius) !important;
  border-bottom-left-radius: var(--border-radius) !important;
}

.rounded-sm {
  border-radius: var(--border-radius-sm) !important;
}

.rounded-lg {
  border-radius: var(--border-radius-lg) !important;
}

.rounded-0 {
  border-radius: 0px !important;
}

.rounded-top-0 {
  border-top-left-radius: 0px !important;
  border-top-right-radius: 0px !important;
}

.rounded-right-0 {
  border-top-right-radius: 0px !important;
  border-bottom-right-radius: 0px !important;
}

.rounded-bottom-0 {
  border-bottom-right-radius: 0px !important;
  border-bottom-left-radius: 0px !important;
}

.rounded-left-0 {
  border-top-left-radius: 0px !important;
  border-bottom-left-radius: 0px !important;
}

.rounded-top-left-0 {
  border-top-left-radius: 0px !important;
}

.rounded-top-right-0 {
  border-top-right-radius: 0px !important;
}

.rounded-bottom-left-0 {
  border-bottom-left-radius: 0px !important;
}

.rounded-bottom-right-0 {
  border-bottom-right-radius: 0px !important;
}

.rounded-1 {
  border-radius: 1px !important;
}

.rounded-top-1 {
  border-top-left-radius: 1px !important;
  border-top-right-radius: 1px !important;
}

.rounded-right-1 {
  border-top-right-radius: 1px !important;
  border-bottom-right-radius: 1px !important;
}

.rounded-bottom-1 {
  border-bottom-right-radius: 1px !important;
  border-bottom-left-radius: 1px !important;
}

.rounded-left-1 {
  border-top-left-radius: 1px !important;
  border-bottom-left-radius: 1px !important;
}

.rounded-top-left-1 {
  border-top-left-radius: 1px !important;
}

.rounded-top-right-1 {
  border-top-right-radius: 1px !important;
}

.rounded-bottom-left-1 {
  border-bottom-left-radius: 1px !important;
}

.rounded-bottom-right-1 {
  border-bottom-right-radius: 1px !important;
}

.rounded-2 {
  border-radius: 2px !important;
}

.rounded-top-2 {
  border-top-left-radius: 2px !important;
  border-top-right-radius: 2px !important;
}

.rounded-right-2 {
  border-top-right-radius: 2px !important;
  border-bottom-right-radius: 2px !important;
}

.rounded-bottom-2 {
  border-bottom-right-radius: 2px !important;
  border-bottom-left-radius: 2px !important;
}

.rounded-left-2 {
  border-top-left-radius: 2px !important;
  border-bottom-left-radius: 2px !important;
}

.rounded-top-left-2 {
  border-top-left-radius: 2px !important;
}

.rounded-top-right-2 {
  border-top-right-radius: 2px !important;
}

.rounded-bottom-left-2 {
  border-bottom-left-radius: 2px !important;
}

.rounded-bottom-right-2 {
  border-bottom-right-radius: 2px !important;
}

.rounded-3 {
  border-radius: 3px !important;
}

.rounded-top-3 {
  border-top-left-radius: 3px !important;
  border-top-right-radius: 3px !important;
}

.rounded-right-3 {
  border-top-right-radius: 3px !important;
  border-bottom-right-radius: 3px !important;
}

.rounded-bottom-3 {
  border-bottom-right-radius: 3px !important;
  border-bottom-left-radius: 3px !important;
}

.rounded-left-3 {
  border-top-left-radius: 3px !important;
  border-bottom-left-radius: 3px !important;
}

.rounded-top-left-3 {
  border-top-left-radius: 3px !important;
}

.rounded-top-right-3 {
  border-top-right-radius: 3px !important;
}

.rounded-bottom-left-3 {
  border-bottom-left-radius: 3px !important;
}

.rounded-bottom-right-3 {
  border-bottom-right-radius: 3px !important;
}

.rounded-4 {
  border-radius: 4px !important;
}

.rounded-top-4 {
  border-top-left-radius: 4px !important;
  border-top-right-radius: 4px !important;
}

.rounded-right-4 {
  border-top-right-radius: 4px !important;
  border-bottom-right-radius: 4px !important;
}

.rounded-bottom-4 {
  border-bottom-right-radius: 4px !important;
  border-bottom-left-radius: 4px !important;
}

.rounded-left-4 {
  border-top-left-radius: 4px !important;
  border-bottom-left-radius: 4px !important;
}

.rounded-top-left-4 {
  border-top-left-radius: 4px !important;
}

.rounded-top-right-4 {
  border-top-right-radius: 4px !important;
}

.rounded-bottom-left-4 {
  border-bottom-left-radius: 4px !important;
}

.rounded-bottom-right-4 {
  border-bottom-right-radius: 4px !important;
}

.rounded-5 {
  border-radius: 5px !important;
}

.rounded-top-5 {
  border-top-left-radius: 5px !important;
  border-top-right-radius: 5px !important;
}

.rounded-right-5 {
  border-top-right-radius: 5px !important;
  border-bottom-right-radius: 5px !important;
}

.rounded-bottom-5 {
  border-bottom-right-radius: 5px !important;
  border-bottom-left-radius: 5px !important;
}

.rounded-left-5 {
  border-top-left-radius: 5px !important;
  border-bottom-left-radius: 5px !important;
}

.rounded-top-left-5 {
  border-top-left-radius: 5px !important;
}

.rounded-top-right-5 {
  border-top-right-radius: 5px !important;
}

.rounded-bottom-left-5 {
  border-bottom-left-radius: 5px !important;
}

.rounded-bottom-right-5 {
  border-bottom-right-radius: 5px !important;
}

.rounded-6 {
  border-radius: 6px !important;
}

.rounded-top-6 {
  border-top-left-radius: 6px !important;
  border-top-right-radius: 6px !important;
}

.rounded-right-6 {
  border-top-right-radius: 6px !important;
  border-bottom-right-radius: 6px !important;
}

.rounded-bottom-6 {
  border-bottom-right-radius: 6px !important;
  border-bottom-left-radius: 6px !important;
}

.rounded-left-6 {
  border-top-left-radius: 6px !important;
  border-bottom-left-radius: 6px !important;
}

.rounded-top-left-6 {
  border-top-left-radius: 6px !important;
}

.rounded-top-right-6 {
  border-top-right-radius: 6px !important;
}

.rounded-bottom-left-6 {
  border-bottom-left-radius: 6px !important;
}

.rounded-bottom-right-6 {
  border-bottom-right-radius: 6px !important;
}

.rounded-7 {
  border-radius: 7px !important;
}

.rounded-top-7 {
  border-top-left-radius: 7px !important;
  border-top-right-radius: 7px !important;
}

.rounded-right-7 {
  border-top-right-radius: 7px !important;
  border-bottom-right-radius: 7px !important;
}

.rounded-bottom-7 {
  border-bottom-right-radius: 7px !important;
  border-bottom-left-radius: 7px !important;
}

.rounded-left-7 {
  border-top-left-radius: 7px !important;
  border-bottom-left-radius: 7px !important;
}

.rounded-top-left-7 {
  border-top-left-radius: 7px !important;
}

.rounded-top-right-7 {
  border-top-right-radius: 7px !important;
}

.rounded-bottom-left-7 {
  border-bottom-left-radius: 7px !important;
}

.rounded-bottom-right-7 {
  border-bottom-right-radius: 7px !important;
}

.rounded-8 {
  border-radius: 8px !important;
}

.rounded-top-8 {
  border-top-left-radius: 8px !important;
  border-top-right-radius: 8px !important;
}

.rounded-right-8 {
  border-top-right-radius: 8px !important;
  border-bottom-right-radius: 8px !important;
}

.rounded-bottom-8 {
  border-bottom-right-radius: 8px !important;
  border-bottom-left-radius: 8px !important;
}

.rounded-left-8 {
  border-top-left-radius: 8px !important;
  border-bottom-left-radius: 8px !important;
}

.rounded-top-left-8 {
  border-top-left-radius: 8px !important;
}

.rounded-top-right-8 {
  border-top-right-radius: 8px !important;
}

.rounded-bottom-left-8 {
  border-bottom-left-radius: 8px !important;
}

.rounded-bottom-right-8 {
  border-bottom-right-radius: 8px !important;
}

.rounded-9 {
  border-radius: 9px !important;
}

.rounded-top-9 {
  border-top-left-radius: 9px !important;
  border-top-right-radius: 9px !important;
}

.rounded-right-9 {
  border-top-right-radius: 9px !important;
  border-bottom-right-radius: 9px !important;
}

.rounded-bottom-9 {
  border-bottom-right-radius: 9px !important;
  border-bottom-left-radius: 9px !important;
}

.rounded-left-9 {
  border-top-left-radius: 9px !important;
  border-bottom-left-radius: 9px !important;
}

.rounded-top-left-9 {
  border-top-left-radius: 9px !important;
}

.rounded-top-right-9 {
  border-top-right-radius: 9px !important;
}

.rounded-bottom-left-9 {
  border-bottom-left-radius: 9px !important;
}

.rounded-bottom-right-9 {
  border-bottom-right-radius: 9px !important;
}

.rounded-10 {
  border-radius: 10px !important;
}

.rounded-top-10 {
  border-top-left-radius: 10px !important;
  border-top-right-radius: 10px !important;
}

.rounded-right-10 {
  border-top-right-radius: 10px !important;
  border-bottom-right-radius: 10px !important;
}

.rounded-bottom-10 {
  border-bottom-right-radius: 10px !important;
  border-bottom-left-radius: 10px !important;
}

.rounded-left-10 {
  border-top-left-radius: 10px !important;
  border-bottom-left-radius: 10px !important;
}

.rounded-top-left-10 {
  border-top-left-radius: 10px !important;
}

.rounded-top-right-10 {
  border-top-right-radius: 10px !important;
}

.rounded-bottom-left-10 {
  border-bottom-left-radius: 10px !important;
}

.rounded-bottom-right-10 {
  border-bottom-right-radius: 10px !important;
}

.rounded-11 {
  border-radius: 11px !important;
}

.rounded-top-11 {
  border-top-left-radius: 11px !important;
  border-top-right-radius: 11px !important;
}

.rounded-right-11 {
  border-top-right-radius: 11px !important;
  border-bottom-right-radius: 11px !important;
}

.rounded-bottom-11 {
  border-bottom-right-radius: 11px !important;
  border-bottom-left-radius: 11px !important;
}

.rounded-left-11 {
  border-top-left-radius: 11px !important;
  border-bottom-left-radius: 11px !important;
}

.rounded-top-left-11 {
  border-top-left-radius: 11px !important;
}

.rounded-top-right-11 {
  border-top-right-radius: 11px !important;
}

.rounded-bottom-left-11 {
  border-bottom-left-radius: 11px !important;
}

.rounded-bottom-right-11 {
  border-bottom-right-radius: 11px !important;
}

.rounded-12 {
  border-radius: 12px !important;
}

.rounded-top-12 {
  border-top-left-radius: 12px !important;
  border-top-right-radius: 12px !important;
}

.rounded-right-12 {
  border-top-right-radius: 12px !important;
  border-bottom-right-radius: 12px !important;
}

.rounded-bottom-12 {
  border-bottom-right-radius: 12px !important;
  border-bottom-left-radius: 12px !important;
}

.rounded-left-12 {
  border-top-left-radius: 12px !important;
  border-bottom-left-radius: 12px !important;
}

.rounded-top-left-12 {
  border-top-left-radius: 12px !important;
}

.rounded-top-right-12 {
  border-top-right-radius: 12px !important;
}

.rounded-bottom-left-12 {
  border-bottom-left-radius: 12px !important;
}

.rounded-bottom-right-12 {
  border-bottom-right-radius: 12px !important;
}

.rounded-13 {
  border-radius: 13px !important;
}

.rounded-top-13 {
  border-top-left-radius: 13px !important;
  border-top-right-radius: 13px !important;
}

.rounded-right-13 {
  border-top-right-radius: 13px !important;
  border-bottom-right-radius: 13px !important;
}

.rounded-bottom-13 {
  border-bottom-right-radius: 13px !important;
  border-bottom-left-radius: 13px !important;
}

.rounded-left-13 {
  border-top-left-radius: 13px !important;
  border-bottom-left-radius: 13px !important;
}

.rounded-top-left-13 {
  border-top-left-radius: 13px !important;
}

.rounded-top-right-13 {
  border-top-right-radius: 13px !important;
}

.rounded-bottom-left-13 {
  border-bottom-left-radius: 13px !important;
}

.rounded-bottom-right-13 {
  border-bottom-right-radius: 13px !important;
}

.rounded-14 {
  border-radius: 14px !important;
}

.rounded-top-14 {
  border-top-left-radius: 14px !important;
  border-top-right-radius: 14px !important;
}

.rounded-right-14 {
  border-top-right-radius: 14px !important;
  border-bottom-right-radius: 14px !important;
}

.rounded-bottom-14 {
  border-bottom-right-radius: 14px !important;
  border-bottom-left-radius: 14px !important;
}

.rounded-left-14 {
  border-top-left-radius: 14px !important;
  border-bottom-left-radius: 14px !important;
}

.rounded-top-left-14 {
  border-top-left-radius: 14px !important;
}

.rounded-top-right-14 {
  border-top-right-radius: 14px !important;
}

.rounded-bottom-left-14 {
  border-bottom-left-radius: 14px !important;
}

.rounded-bottom-right-14 {
  border-bottom-right-radius: 14px !important;
}

.rounded-15 {
  border-radius: 15px !important;
}

.rounded-top-15 {
  border-top-left-radius: 15px !important;
  border-top-right-radius: 15px !important;
}

.rounded-right-15 {
  border-top-right-radius: 15px !important;
  border-bottom-right-radius: 15px !important;
}

.rounded-bottom-15 {
  border-bottom-right-radius: 15px !important;
  border-bottom-left-radius: 15px !important;
}

.rounded-left-15 {
  border-top-left-radius: 15px !important;
  border-bottom-left-radius: 15px !important;
}

.rounded-top-left-15 {
  border-top-left-radius: 15px !important;
}

.rounded-top-right-15 {
  border-top-right-radius: 15px !important;
}

.rounded-bottom-left-15 {
  border-bottom-left-radius: 15px !important;
}

.rounded-bottom-right-15 {
  border-bottom-right-radius: 15px !important;
}

.rounded-16 {
  border-radius: 16px !important;
}

.rounded-top-16 {
  border-top-left-radius: 16px !important;
  border-top-right-radius: 16px !important;
}

.rounded-right-16 {
  border-top-right-radius: 16px !important;
  border-bottom-right-radius: 16px !important;
}

.rounded-bottom-16 {
  border-bottom-right-radius: 16px !important;
  border-bottom-left-radius: 16px !important;
}

.rounded-left-16 {
  border-top-left-radius: 16px !important;
  border-bottom-left-radius: 16px !important;
}

.rounded-top-left-16 {
  border-top-left-radius: 16px !important;
}

.rounded-top-right-16 {
  border-top-right-radius: 16px !important;
}

.rounded-bottom-left-16 {
  border-bottom-left-radius: 16px !important;
}

.rounded-bottom-right-16 {
  border-bottom-right-radius: 16px !important;
}

.rounded-17 {
  border-radius: 17px !important;
}

.rounded-top-17 {
  border-top-left-radius: 17px !important;
  border-top-right-radius: 17px !important;
}

.rounded-right-17 {
  border-top-right-radius: 17px !important;
  border-bottom-right-radius: 17px !important;
}

.rounded-bottom-17 {
  border-bottom-right-radius: 17px !important;
  border-bottom-left-radius: 17px !important;
}

.rounded-left-17 {
  border-top-left-radius: 17px !important;
  border-bottom-left-radius: 17px !important;
}

.rounded-top-left-17 {
  border-top-left-radius: 17px !important;
}

.rounded-top-right-17 {
  border-top-right-radius: 17px !important;
}

.rounded-bottom-left-17 {
  border-bottom-left-radius: 17px !important;
}

.rounded-bottom-right-17 {
  border-bottom-right-radius: 17px !important;
}

.rounded-18 {
  border-radius: 18px !important;
}

.rounded-top-18 {
  border-top-left-radius: 18px !important;
  border-top-right-radius: 18px !important;
}

.rounded-right-18 {
  border-top-right-radius: 18px !important;
  border-bottom-right-radius: 18px !important;
}

.rounded-bottom-18 {
  border-bottom-right-radius: 18px !important;
  border-bottom-left-radius: 18px !important;
}

.rounded-left-18 {
  border-top-left-radius: 18px !important;
  border-bottom-left-radius: 18px !important;
}

.rounded-top-left-18 {
  border-top-left-radius: 18px !important;
}

.rounded-top-right-18 {
  border-top-right-radius: 18px !important;
}

.rounded-bottom-left-18 {
  border-bottom-left-radius: 18px !important;
}

.rounded-bottom-right-18 {
  border-bottom-right-radius: 18px !important;
}

.rounded-19 {
  border-radius: 19px !important;
}

.rounded-top-19 {
  border-top-left-radius: 19px !important;
  border-top-right-radius: 19px !important;
}

.rounded-right-19 {
  border-top-right-radius: 19px !important;
  border-bottom-right-radius: 19px !important;
}

.rounded-bottom-19 {
  border-bottom-right-radius: 19px !important;
  border-bottom-left-radius: 19px !important;
}

.rounded-left-19 {
  border-top-left-radius: 19px !important;
  border-bottom-left-radius: 19px !important;
}

.rounded-top-left-19 {
  border-top-left-radius: 19px !important;
}

.rounded-top-right-19 {
  border-top-right-radius: 19px !important;
}

.rounded-bottom-left-19 {
  border-bottom-left-radius: 19px !important;
}

.rounded-bottom-right-19 {
  border-bottom-right-radius: 19px !important;
}

.rounded-20 {
  border-radius: 20px !important;
}

.rounded-top-20 {
  border-top-left-radius: 20px !important;
  border-top-right-radius: 20px !important;
}

.rounded-right-20 {
  border-top-right-radius: 20px !important;
  border-bottom-right-radius: 20px !important;
}

.rounded-bottom-20 {
  border-bottom-right-radius: 20px !important;
  border-bottom-left-radius: 20px !important;
}

.rounded-left-20 {
  border-top-left-radius: 20px !important;
  border-bottom-left-radius: 20px !important;
}

.rounded-top-left-20 {
  border-top-left-radius: 20px !important;
}

.rounded-top-right-20 {
  border-top-right-radius: 20px !important;
}

.rounded-bottom-left-20 {
  border-bottom-left-radius: 20px !important;
}

.rounded-bottom-right-20 {
  border-bottom-right-radius: 20px !important;
}

.rounded-21 {
  border-radius: 21px !important;
}

.rounded-top-21 {
  border-top-left-radius: 21px !important;
  border-top-right-radius: 21px !important;
}

.rounded-right-21 {
  border-top-right-radius: 21px !important;
  border-bottom-right-radius: 21px !important;
}

.rounded-bottom-21 {
  border-bottom-right-radius: 21px !important;
  border-bottom-left-radius: 21px !important;
}

.rounded-left-21 {
  border-top-left-radius: 21px !important;
  border-bottom-left-radius: 21px !important;
}

.rounded-top-left-21 {
  border-top-left-radius: 21px !important;
}

.rounded-top-right-21 {
  border-top-right-radius: 21px !important;
}

.rounded-bottom-left-21 {
  border-bottom-left-radius: 21px !important;
}

.rounded-bottom-right-21 {
  border-bottom-right-radius: 21px !important;
}

.rounded-22 {
  border-radius: 22px !important;
}

.rounded-top-22 {
  border-top-left-radius: 22px !important;
  border-top-right-radius: 22px !important;
}

.rounded-right-22 {
  border-top-right-radius: 22px !important;
  border-bottom-right-radius: 22px !important;
}

.rounded-bottom-22 {
  border-bottom-right-radius: 22px !important;
  border-bottom-left-radius: 22px !important;
}

.rounded-left-22 {
  border-top-left-radius: 22px !important;
  border-bottom-left-radius: 22px !important;
}

.rounded-top-left-22 {
  border-top-left-radius: 22px !important;
}

.rounded-top-right-22 {
  border-top-right-radius: 22px !important;
}

.rounded-bottom-left-22 {
  border-bottom-left-radius: 22px !important;
}

.rounded-bottom-right-22 {
  border-bottom-right-radius: 22px !important;
}

.rounded-23 {
  border-radius: 23px !important;
}

.rounded-top-23 {
  border-top-left-radius: 23px !important;
  border-top-right-radius: 23px !important;
}

.rounded-right-23 {
  border-top-right-radius: 23px !important;
  border-bottom-right-radius: 23px !important;
}

.rounded-bottom-23 {
  border-bottom-right-radius: 23px !important;
  border-bottom-left-radius: 23px !important;
}

.rounded-left-23 {
  border-top-left-radius: 23px !important;
  border-bottom-left-radius: 23px !important;
}

.rounded-top-left-23 {
  border-top-left-radius: 23px !important;
}

.rounded-top-right-23 {
  border-top-right-radius: 23px !important;
}

.rounded-bottom-left-23 {
  border-bottom-left-radius: 23px !important;
}

.rounded-bottom-right-23 {
  border-bottom-right-radius: 23px !important;
}

.rounded-24 {
  border-radius: 24px !important;
}

.rounded-top-24 {
  border-top-left-radius: 24px !important;
  border-top-right-radius: 24px !important;
}

.rounded-right-24 {
  border-top-right-radius: 24px !important;
  border-bottom-right-radius: 24px !important;
}

.rounded-bottom-24 {
  border-bottom-right-radius: 24px !important;
  border-bottom-left-radius: 24px !important;
}

.rounded-left-24 {
  border-top-left-radius: 24px !important;
  border-bottom-left-radius: 24px !important;
}

.rounded-top-left-24 {
  border-top-left-radius: 24px !important;
}

.rounded-top-right-24 {
  border-top-right-radius: 24px !important;
}

.rounded-bottom-left-24 {
  border-bottom-left-radius: 24px !important;
}

.rounded-bottom-right-24 {
  border-bottom-right-radius: 24px !important;
}

.rounded-25 {
  border-radius: 25px !important;
}

.rounded-top-25 {
  border-top-left-radius: 25px !important;
  border-top-right-radius: 25px !important;
}

.rounded-right-25 {
  border-top-right-radius: 25px !important;
  border-bottom-right-radius: 25px !important;
}

.rounded-bottom-25 {
  border-bottom-right-radius: 25px !important;
  border-bottom-left-radius: 25px !important;
}

.rounded-left-25 {
  border-top-left-radius: 25px !important;
  border-bottom-left-radius: 25px !important;
}

.rounded-top-left-25 {
  border-top-left-radius: 25px !important;
}

.rounded-top-right-25 {
  border-top-right-radius: 25px !important;
}

.rounded-bottom-left-25 {
  border-bottom-left-radius: 25px !important;
}

.rounded-bottom-right-25 {
  border-bottom-right-radius: 25px !important;
}

.rounded-26 {
  border-radius: 26px !important;
}

.rounded-top-26 {
  border-top-left-radius: 26px !important;
  border-top-right-radius: 26px !important;
}

.rounded-right-26 {
  border-top-right-radius: 26px !important;
  border-bottom-right-radius: 26px !important;
}

.rounded-bottom-26 {
  border-bottom-right-radius: 26px !important;
  border-bottom-left-radius: 26px !important;
}

.rounded-left-26 {
  border-top-left-radius: 26px !important;
  border-bottom-left-radius: 26px !important;
}

.rounded-top-left-26 {
  border-top-left-radius: 26px !important;
}

.rounded-top-right-26 {
  border-top-right-radius: 26px !important;
}

.rounded-bottom-left-26 {
  border-bottom-left-radius: 26px !important;
}

.rounded-bottom-right-26 {
  border-bottom-right-radius: 26px !important;
}

.rounded-27 {
  border-radius: 27px !important;
}

.rounded-top-27 {
  border-top-left-radius: 27px !important;
  border-top-right-radius: 27px !important;
}

.rounded-right-27 {
  border-top-right-radius: 27px !important;
  border-bottom-right-radius: 27px !important;
}

.rounded-bottom-27 {
  border-bottom-right-radius: 27px !important;
  border-bottom-left-radius: 27px !important;
}

.rounded-left-27 {
  border-top-left-radius: 27px !important;
  border-bottom-left-radius: 27px !important;
}

.rounded-top-left-27 {
  border-top-left-radius: 27px !important;
}

.rounded-top-right-27 {
  border-top-right-radius: 27px !important;
}

.rounded-bottom-left-27 {
  border-bottom-left-radius: 27px !important;
}

.rounded-bottom-right-27 {
  border-bottom-right-radius: 27px !important;
}

.rounded-28 {
  border-radius: 28px !important;
}

.rounded-top-28 {
  border-top-left-radius: 28px !important;
  border-top-right-radius: 28px !important;
}

.rounded-right-28 {
  border-top-right-radius: 28px !important;
  border-bottom-right-radius: 28px !important;
}

.rounded-bottom-28 {
  border-bottom-right-radius: 28px !important;
  border-bottom-left-radius: 28px !important;
}

.rounded-left-28 {
  border-top-left-radius: 28px !important;
  border-bottom-left-radius: 28px !important;
}

.rounded-top-left-28 {
  border-top-left-radius: 28px !important;
}

.rounded-top-right-28 {
  border-top-right-radius: 28px !important;
}

.rounded-bottom-left-28 {
  border-bottom-left-radius: 28px !important;
}

.rounded-bottom-right-28 {
  border-bottom-right-radius: 28px !important;
}

.rounded-29 {
  border-radius: 29px !important;
}

.rounded-top-29 {
  border-top-left-radius: 29px !important;
  border-top-right-radius: 29px !important;
}

.rounded-right-29 {
  border-top-right-radius: 29px !important;
  border-bottom-right-radius: 29px !important;
}

.rounded-bottom-29 {
  border-bottom-right-radius: 29px !important;
  border-bottom-left-radius: 29px !important;
}

.rounded-left-29 {
  border-top-left-radius: 29px !important;
  border-bottom-left-radius: 29px !important;
}

.rounded-top-left-29 {
  border-top-left-radius: 29px !important;
}

.rounded-top-right-29 {
  border-top-right-radius: 29px !important;
}

.rounded-bottom-left-29 {
  border-bottom-left-radius: 29px !important;
}

.rounded-bottom-right-29 {
  border-bottom-right-radius: 29px !important;
}

.rounded-30 {
  border-radius: 30px !important;
}

.rounded-top-30 {
  border-top-left-radius: 30px !important;
  border-top-right-radius: 30px !important;
}

.rounded-right-30 {
  border-top-right-radius: 30px !important;
  border-bottom-right-radius: 30px !important;
}

.rounded-bottom-30 {
  border-bottom-right-radius: 30px !important;
  border-bottom-left-radius: 30px !important;
}

.rounded-left-30 {
  border-top-left-radius: 30px !important;
  border-bottom-left-radius: 30px !important;
}

.rounded-top-left-30 {
  border-top-left-radius: 30px !important;
}

.rounded-top-right-30 {
  border-top-right-radius: 30px !important;
}

.rounded-bottom-left-30 {
  border-bottom-left-radius: 30px !important;
}

.rounded-bottom-right-30 {
  border-bottom-right-radius: 30px !important;
}

.rounded-31 {
  border-radius: 31px !important;
}

.rounded-top-31 {
  border-top-left-radius: 31px !important;
  border-top-right-radius: 31px !important;
}

.rounded-right-31 {
  border-top-right-radius: 31px !important;
  border-bottom-right-radius: 31px !important;
}

.rounded-bottom-31 {
  border-bottom-right-radius: 31px !important;
  border-bottom-left-radius: 31px !important;
}

.rounded-left-31 {
  border-top-left-radius: 31px !important;
  border-bottom-left-radius: 31px !important;
}

.rounded-top-left-31 {
  border-top-left-radius: 31px !important;
}

.rounded-top-right-31 {
  border-top-right-radius: 31px !important;
}

.rounded-bottom-left-31 {
  border-bottom-left-radius: 31px !important;
}

.rounded-bottom-right-31 {
  border-bottom-right-radius: 31px !important;
}

.rounded-circle {
  border-radius: var(--rounded-circle) !important;
}

.rounded-pill {
  border-radius: var(--rounded-pill) !important;
}

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

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

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

.text-justify {
  text-align: justify !important;
}

.text-normal {
  white-space: normal !important;
}

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

.text-pre-wrap {
  white-space: pre-wrap !important;
}

.text-decoration-none {
  text-decoration: none !important;
}

.text-decoration-underline {
  text-decoration: underline !important;
}

.text-break {
  word-break: break-word !important;
  word-wrap: break-word !important;
}

.text-ellipsis {
  text-overflow: ellipsis !important;
}

.text-clip {
  text-overflow: clip !important;
}

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

.text-line-clamp {
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  white-space: normal !important;
}

.align-baseline {
  vertical-align: baseline !important;
}

.align-top {
  vertical-align: top !important;
}

.align-middle {
  vertical-align: middle !important;
}

.align-bottom {
  vertical-align: bottom !important;
}

.align-text-bottom {
  vertical-align: text-bottom !important;
}

.align-text-top {
  vertical-align: text-top !important;
}

.code-chip-base, .code-chip-orange, .code-chip-purple, .code-chip-green, .code-chip-blue, .code-chip-gray, .code-chip-black, .code-chip-red {
  padding: 0 8px;
  border: 1px solid #BCC6D3;
  border-radius: 100px;
  background-color: white;
  white-space: nowrap;
}

.code-chip-red {
  color: var(--red);
  border-color: var(--red);
  background-color: var(--red-bg);
}

.code-chip-black {
  color: var(--body-text);
  border-color: var(--body-text);
  background-color: var(--body-bg);
}

.code-chip-gray {
  color: var(--gray);
  border-color: var(--gray-500);
  background-color: var(--gray-bg);
}

.code-chip-blue {
  color: var(--blue);
  border-color: var(--blue);
  background-color: var(--blue-bg);
}

.code-chip-green {
  color: var(--green);
  border-color: var(--green);
  background-color: var(--green-bg);
}

.code-chip-purple {
  color: var(--purple);
  border-color: var(--purple);
  background-color: var(--purple-bg);
}

.code-chip-orange {
  color: var(--orange);
  border-color: var(--orange);
  background-color: var(--orange-bg);
}

.bg-transparent {
  background-color: transparent !important;
}

.bg-transparent {
  background-color: transparent !important;
}

.bg-white {
  background-color: #ffffff !important;
}

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

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

.bg-black {
  background-color: #000000 !important;
}

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

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

.bg-gray-100 {
  background-color: #FAFAFA !important;
}

.text-gray-100 {
  color: #FAFAFA !important;
}

.border-gray-100 {
  border-color: #FAFAFA !important;
}

.bg-gray-200 {
  background-color: #EAEAEA !important;
}

.text-gray-200 {
  color: #EAEAEA !important;
}

.border-gray-200 {
  border-color: #EAEAEA !important;
}

.bg-gray-300 {
  background-color: #CCCCCC !important;
}

.text-gray-300 {
  color: #CCCCCC !important;
}

.border-gray-300 {
  border-color: #CCCCCC !important;
}

.bg-gray-400 {
  background-color: #A9A9A9 !important;
}

.text-gray-400 {
  color: #A9A9A9 !important;
}

.border-gray-400 {
  border-color: #A9A9A9 !important;
}

.bg-gray-500 {
  background-color: #666666 !important;
}

.text-gray-500 {
  color: #666666 !important;
}

.border-gray-500 {
  border-color: #666666 !important;
}

.bg-gray-600 {
  background-color: #555555 !important;
}

.text-gray-600 {
  color: #555555 !important;
}

.border-gray-600 {
  border-color: #555555 !important;
}

.bg-gray-700 {
  background-color: #444444 !important;
}

.text-gray-700 {
  color: #444444 !important;
}

.border-gray-700 {
  border-color: #444444 !important;
}

.bg-primary-100 {
  background-color: #EAF1FE !important;
}

.text-primary-100 {
  color: #EAF1FE !important;
}

.border-primary-100 {
  border-color: #EAF1FE !important;
}

.bg-primary-200 {
  background-color: #DDEEFF !important;
}

.text-primary-200 {
  color: #DDEEFF !important;
}

.border-primary-200 {
  border-color: #DDEEFF !important;
}

.bg-primary-300 {
  background-color: #B7D2FA !important;
}

.text-primary-300 {
  color: #B7D2FA !important;
}

.border-primary-300 {
  border-color: #B7D2FA !important;
}

.bg-primary-400 {
  background-color: #A4B4FF !important;
}

.text-primary-400 {
  color: #A4B4FF !important;
}

.border-primary-400 {
  border-color: #A4B4FF !important;
}

.bg-primary-500 {
  background-color: #5672EF !important;
}

.text-primary-500 {
  color: #5672EF !important;
}

.border-primary-500 {
  border-color: #5672EF !important;
}

.bg-primary-600 {
  background-color: #232E8F !important;
}

.text-primary-600 {
  color: #232E8F !important;
}

.border-primary-600 {
  border-color: #232E8F !important;
}

.bg-orange {
  background-color: #F99341 !important;
}

.text-orange {
  color: #F99341 !important;
}

.border-orange {
  border-color: #F99341 !important;
}

.bg-green {
  background-color: #2FA04D !important;
}

.text-green {
  color: #2FA04D !important;
}

.border-green {
  border-color: #2FA04D !important;
}

.bg-red {
  background-color: #EB0000 !important;
}

.text-red {
  color: #EB0000 !important;
}

.border-red {
  border-color: #EB0000 !important;
}

.bg-blue {
  background-color: #5672EF !important;
}

.text-blue {
  color: #5672EF !important;
}

.border-blue {
  border-color: #5672EF !important;
}

.bg-primary {
  background-color: #5672EF !important;
}

.text-primary {
  color: #5672EF !important;
}

.border-primary {
  border-color: #5672EF !important;
}

.bg-secondary {
  background-color: #F99341 !important;
}

.text-secondary {
  color: #F99341 !important;
}

.border-secondary {
  border-color: #F99341 !important;
}

.bg-success {
  background-color: #2FA04D !important;
}

.text-success {
  color: #2FA04D !important;
}

.border-success {
  border-color: #2FA04D !important;
}

.bg-info {
  background-color: #5672EF !important;
}

.text-info {
  color: #5672EF !important;
}

.border-info {
  border-color: #5672EF !important;
}

.bg-warning {
  background-color: #F99341 !important;
}

.text-warning {
  color: #F99341 !important;
}

.border-warning {
  border-color: #F99341 !important;
}

.bg-danger {
  background-color: #EB0000 !important;
}

.text-danger {
  color: #EB0000 !important;
}

.border-danger {
  border-color: #EB0000 !important;
}

.bg-light {
  background-color: #FAFAFA !important;
}

.text-light {
  color: #FAFAFA !important;
}

.border-light {
  border-color: #FAFAFA !important;
}

.bg-dark {
  background-color: #444444 !important;
}

.text-dark {
  color: #444444 !important;
}

.border-dark {
  border-color: #444444 !important;
}

.bg-gray {
  background-color: #A9A9A9 !important;
}

.text-gray {
  color: #A9A9A9 !important;
}

.border-gray {
  border-color: #A9A9A9 !important;
}

.bg-purple {
  background-color: #945BD9 !important;
}

.text-purple {
  color: #945BD9 !important;
}

.border-purple {
  border-color: #945BD9 !important;
}

.cursor-pointer {
  cursor: pointer !important;
}

.cursor-default {
  cursor: default !important;
}

.focus-outline-none:focus {
  outline: none !important;
}

/* Layout Utility */
.flex-row, .bs-layout-horizontal, .bs-layout-horizontal-wrap {
  display: flex;
  flex-direction: row;
}

.flex-row-inline, .bs-layout-horizontal-inline {
  display: inline-flex;
  flex-direction: row;
}

.flex-column, .bs-layout-vertical, .bs-layout-vertical-wrap {
  display: flex;
  flex-direction: column;
}

.flex-column-inline, .bs-layout-vertical-inline {
  display: inline-flex;
  flex-direction: column;
}

.flex-wrap, .bs-layout-vertical-wrap, .bs-layout-horizontal-wrap {
  flex-wrap: wrap;
}

.flex-grow-0 {
  flex-grow: 0;
}

.flex-shrink-0 {
  flex-shrink: 0;
}

.flex-grow-1 {
  flex-grow: 1;
}

.flex-shrink-1 {
  flex-shrink: 1;
}

.flex-grow-2 {
  flex-grow: 2;
}

.flex-shrink-2 {
  flex-shrink: 2;
}

.flex-grow-3 {
  flex-grow: 3;
}

.flex-shrink-3 {
  flex-shrink: 3;
}

.flex-grow-4 {
  flex-grow: 4;
}

.flex-shrink-4 {
  flex-shrink: 4;
}

.flex-grow-5 {
  flex-grow: 5;
}

.flex-shrink-5 {
  flex-shrink: 5;
}

.flex-grow-6 {
  flex-grow: 6;
}

.flex-shrink-6 {
  flex-shrink: 6;
}

.flex-grow-7 {
  flex-grow: 7;
}

.flex-shrink-7 {
  flex-shrink: 7;
}

.flex-grow-8 {
  flex-grow: 8;
}

.flex-shrink-8 {
  flex-shrink: 8;
}

.gap-0 {
  gap: 0px;
}

.gap-1 {
  gap: 1px;
}

.gap-2 {
  gap: 2px;
}

.gap-3 {
  gap: 3px;
}

.gap-4 {
  gap: 4px;
}

.gap-5 {
  gap: 5px;
}

.gap-6 {
  gap: 6px;
}

.gap-7 {
  gap: 7px;
}

.gap-8 {
  gap: 8px;
}

.gap-9 {
  gap: 9px;
}

.gap-10 {
  gap: 10px;
}

.gap-11 {
  gap: 11px;
}

.gap-12 {
  gap: 12px;
}

.gap-13 {
  gap: 13px;
}

.gap-14 {
  gap: 14px;
}

.gap-15 {
  gap: 15px;
}

.gap-16 {
  gap: 16px;
}

.gap-17 {
  gap: 17px;
}

.gap-18 {
  gap: 18px;
}

.gap-19 {
  gap: 19px;
}

.gap-20 {
  gap: 20px;
}

.gap-21 {
  gap: 21px;
}

.gap-22 {
  gap: 22px;
}

.gap-23 {
  gap: 23px;
}

.gap-24 {
  gap: 24px;
}

.gap-25 {
  gap: 25px;
}

.gap-26 {
  gap: 26px;
}

.gap-27 {
  gap: 27px;
}

.gap-28 {
  gap: 28px;
}

.gap-29 {
  gap: 29px;
}

.gap-30 {
  gap: 30px;
}

.gap-31 {
  gap: 31px;
}

.gap-32 {
  gap: 32px;
}

.gap-33 {
  gap: 33px;
}

.gap-34 {
  gap: 34px;
}

.gap-35 {
  gap: 35px;
}

.gap-36 {
  gap: 36px;
}

.gap-37 {
  gap: 37px;
}

.gap-38 {
  gap: 38px;
}

.gap-39 {
  gap: 39px;
}

.gap-40 {
  gap: 40px;
}

.gap-41 {
  gap: 41px;
}

.gap-42 {
  gap: 42px;
}

.gap-43 {
  gap: 43px;
}

.gap-44 {
  gap: 44px;
}

.gap-45 {
  gap: 45px;
}

.gap-46 {
  gap: 46px;
}

.gap-47 {
  gap: 47px;
}

.gap-48 {
  gap: 48px;
}

.gap-49 {
  gap: 49px;
}

.gap-50 {
  gap: 50px;
}

.gap-51 {
  gap: 51px;
}

.gap-52 {
  gap: 52px;
}

.gap-53 {
  gap: 53px;
}

.gap-54 {
  gap: 54px;
}

.gap-55 {
  gap: 55px;
}

.gap-56 {
  gap: 56px;
}

.gap-57 {
  gap: 57px;
}

.gap-58 {
  gap: 58px;
}

.gap-59 {
  gap: 59px;
}

.gap-60 {
  gap: 60px;
}

.gap-61 {
  gap: 61px;
}

.gap-62 {
  gap: 62px;
}

.gap-63 {
  gap: 63px;
}

.gap-64 {
  gap: 64px;
}

.flex-align-start {
  align-items: flex-start;
}

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

.flex-align-end {
  align-items: flex-end;
}

.flex-content-start {
  justify-content: flex-start;
}

.flex-content-center {
  justify-content: center;
}

.flex-content-end {
  justify-content: flex-end;
}

/* Bluesea Layout */
.bs-layout-form {
  border-bottom: 1px solid var(--border);
}
.bs-layout-form > div {
  display: flex;
  align-items: center;
}
.bs-layout-form > div > .title {
  padding: 8px 16px;
  width: 12.3076em;
  line-height: 1.2em;
  color: var(--body-text);
}
.bs-layout-form > div > :not(.title) {
  padding: 8px;
  width: 10em;
  flex-grow: 1;
  color: var(--body-text);
}
.bs-layout-form > div:nth-child(odd) {
  background-color: var(--gray-100);
}
.bs-layout-form.title-w-8 > div > .title {
  width: 8em;
}
.bs-layout-form.title-w-10 > div > .title {
  width: 10em;
}
.bs-layout-form.title-w-14 > div > .title {
  width: 14em;
}
.bs-layout-form.title-w-16 > div > .title {
  width: 16em;
}
.bs-layout-form.title-w-18 > div > .title {
  width: 18em;
}
.bs-layout-form.title-w-20 > div > .title {
  width: 20em;
}

.bs-layout-card > .card-title {
  padding: 16px 0;
  border-bottom: 0.8px solid var(--border-light);
  font-size: 1.2em;
  font-weight: 500;
}

.bs-layout-table {
  border-collapse: collapse;
}
.bs-layout-table > tr > td, .bs-layout-table > tr > th, .bs-layout-table > tbody > tr > td, .bs-layout-table > tbody > tr > th {
  padding: 8px;
  border: 1px solid var(--border);
  vertical-align: middle;
  text-align: left;
}
.bs-layout-table > tr > td:first-child, .bs-layout-table > tr > th:first-child, .bs-layout-table > tbody > tr > td:first-child, .bs-layout-table > tbody > tr > th:first-child {
  border-left: 0;
}
.bs-layout-table > tr > td:last-child, .bs-layout-table > tr > th:last-child, .bs-layout-table > tbody > tr > td:last-child, .bs-layout-table > tbody > tr > th:last-child {
  border-right: 0;
}

.slide-down-enter-active,
.slide-down-leave-active {
  transition: all 0.2s ease-out;
}

.slide-down-enter-to,
.slide-down-leave-from {
  overflow: hidden;
}

.slide-down-enter-from,
.slide-down-leave-to {
  max-height: 0;
  opacity: 0;
  overflow: hidden;
}

.notification-enter-active,
.notification-leave-active {
  transition: all 0.3s ease-out;
}

.notification-enter-to,
.notification-leave-from {
  margin-top: 0;
}

.notification-enter-from {
  margin-top: -35px;
  opacity: 0;
}

.notification-leave-to {
  opacity: 0;
}

.alarm-enter-active,
.alarm-leave-active {
  transition: all 0.3s ease-out;
  z-index: -1;
}

.alarm-enter-to,
.alarm-leave-from {
  margin-top: 0;
}

.alarm-enter-from,
.alarm-leave-to {
  margin-bottom: -230px;
  opacity: 0;
}

.fade-move,
.fade-enter-active,
.fade-leave-active {
  transition: all 0.3s cubic-bezier(0.55, 0, 0.1, 1);
}

.fade-enter-from,
.fade-leave-to {
  opacity: 0;
  transform: scaleY(0.01);
}

.fade-enter-active,
.fade-leave-active {
  position: absolute;
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.bs-box-component-wrap, .bs-select-wrap, .bs-input-wrap {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: left;
}
.bs-box-component-wrap .message, .bs-select-wrap .message, .bs-input-wrap .message {
  margin-top: 4px;
  font-size: 0.9em;
}

.bs-box-component-base, .bs-select-wrap > .selected, .bs-input-base {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: left;
  background-color: var(--body-bg);
}

.bs-input-wrap .suffix,
.bs-input-wrap .prefix {
  font-size: 0.9em;
  margin-right: 4px;
  margin-left: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}
.bs-input-wrap .suffix:first-child,
.bs-input-wrap .prefix:first-child {
  margin-left: 4px;
}
.bs-input-wrap .suffix .font-icon,
.bs-input-wrap .prefix .font-icon {
  font-size: 0.9em;
}
.bs-input-wrap .suffix img,
.bs-input-wrap .prefix img {
  width: 0.9em;
  height: 0.9em;
}

[data-theme=dark] .bs-input-wrap .suffix img,
[data-theme=dark] .bs-input-wrap .prefix img {
  filter: invert(1);
}

.bs-input-base {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}
.bs-input-base > input {
  border: 0;
  border-radius: 0;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  flex-basis: 1em;
  padding: 0 6px;
  background-color: transparent;
  width: 100%;
  color: var(--body-text);
}
.bs-input-base > textarea {
  border: 0;
  border-radius: 4px;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  padding: 6px;
  line-height: 1.4;
  font-family: sans-serif;
  background-color: var(--body-bg);
  color: var(--body-text);
}
.bs-input-base:hover {
  border-color: var(--border-hover);
}
.bs-input-base:has(:focus) {
  border-color: var(--color-focus);
  border-width: 1px;
}

.bs-text-input.modified > .input-area,
.bs-number-input.modified > .input-area,
.bs-price-input.modified > .input-area,
.bs-date-input.modified > .input-area,
.bs-date-range.modified > .input-area,
.bs-multi-lang-text-input.modified > .input-area,
.bs-multi-lang-text-area.modified > .input-area,
.bs-multi-lang-rich-text.modified > .input-area,
.bs-text-area.modified > .input-area,
.bs-rich-text.modified > .input-area {
  border-color: var(--purple) !important;
}
.bs-text-input.error > .input-area,
.bs-number-input.error > .input-area,
.bs-price-input.error > .input-area,
.bs-date-input.error > .input-area,
.bs-date-range.error > .input-area,
.bs-multi-lang-text-input.error > .input-area,
.bs-multi-lang-text-area.error > .input-area,
.bs-multi-lang-rich-text.error > .input-area,
.bs-text-area.error > .input-area,
.bs-rich-text.error > .input-area {
  border-color: var(--danger) !important;
}
.bs-text-input.error > .input-area > input,
.bs-number-input.error > .input-area > input,
.bs-price-input.error > .input-area > input,
.bs-date-input.error > .input-area > input,
.bs-date-range.error > .input-area > input,
.bs-multi-lang-text-input.error > .input-area > input,
.bs-multi-lang-text-area.error > .input-area > input,
.bs-multi-lang-rich-text.error > .input-area > input,
.bs-text-area.error > .input-area > input,
.bs-rich-text.error > .input-area > input {
  color: var(--danger) !important;
}
.bs-text-input.disabled > .input-area,
.bs-number-input.disabled > .input-area,
.bs-price-input.disabled > .input-area,
.bs-date-input.disabled > .input-area,
.bs-date-range.disabled > .input-area,
.bs-multi-lang-text-input.disabled > .input-area,
.bs-multi-lang-text-area.disabled > .input-area,
.bs-multi-lang-rich-text.disabled > .input-area,
.bs-text-area.disabled > .input-area,
.bs-rich-text.disabled > .input-area {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}
.bs-text-input.disabled > .input-area > input,
.bs-number-input.disabled > .input-area > input,
.bs-price-input.disabled > .input-area > input,
.bs-date-input.disabled > .input-area > input,
.bs-date-range.disabled > .input-area > input,
.bs-multi-lang-text-input.disabled > .input-area > input,
.bs-multi-lang-text-area.disabled > .input-area > input,
.bs-multi-lang-rich-text.disabled > .input-area > input,
.bs-text-area.disabled > .input-area > input,
.bs-rich-text.disabled > .input-area > input {
  color: var(--gray-400) !important;
  background-color: var(--gray-100) !important;
}
.bs-text-input.disabled > .input-area > textarea,
.bs-number-input.disabled > .input-area > textarea,
.bs-price-input.disabled > .input-area > textarea,
.bs-date-input.disabled > .input-area > textarea,
.bs-date-range.disabled > .input-area > textarea,
.bs-multi-lang-text-input.disabled > .input-area > textarea,
.bs-multi-lang-text-area.disabled > .input-area > textarea,
.bs-multi-lang-rich-text.disabled > .input-area > textarea,
.bs-text-area.disabled > .input-area > textarea,
.bs-rich-text.disabled > .input-area > textarea {
  background-color: var(--gray-100) !important;
}

.bs-date-input .view-mode,
.bs-date-range .view-mode {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}
.bs-date-input .view-mode::before,
.bs-date-range .view-mode::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-date-input .extra-dates,
.bs-date-range .extra-dates,
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  color: var(--body-text);
  margin-top: 4px;
}
.bs-date-input .extra-dates .extra-date,
.bs-date-range .extra-dates .extra-date,
.bs-calendar .extra-dates .extra-date,
.bs-calendar-range .extra-dates .extra-date {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8125rem;
}
.bs-date-input .extra-dates .extra-date::before,
.bs-date-range .extra-dates .extra-date::before,
.bs-calendar .extra-dates .extra-date::before,
.bs-calendar-range .extra-dates .extra-date::before {
  content: "globe";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}

.bs-checkbox-base {
  display: inline-block;
  color: var(--body-text);
  white-space: nowrap;
}
.bs-checkbox-base input {
  appearance: none;
  margin: 0;
  outline: 0;
}
.bs-checkbox-base input::before {
  font-family: var(--icon-font-family);
  font-size: 20px;
  vertical-align: middle;
  cursor: pointer;
  color: var(--body-text);
}
.bs-checkbox-base input:hover {
  color: var(--gray-500);
}
.bs-checkbox-base input:hover ~ label {
  color: var(--gray-500);
}
.bs-checkbox-base input:focus::before {
  color: var(--color-focus);
}
.bs-checkbox-base input:focus ~ label {
  color: var(--color-focus);
}
.bs-checkbox-base.modified input::before {
  color: var(--purple) !important;
}
.bs-checkbox-base.modified input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-base.error input::before {
  color: var(--danger) !important;
}
.bs-checkbox-base.error input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-base.disabled input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-base.disabled input ~ label {
  color: var(--gray-400) !important;
}
.bs-checkbox-base label {
  display: inline-block;
  vertical-align: middle;
  padding: 4px 2px;
  cursor: pointer;
}

.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input::before {
  color: var(--purple) !important;
}
.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input::before {
  color: var(--danger) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-group.disabled input::before,
.bs-radio-button-group.disabled input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-group.disabled input ~ label,
.bs-radio-button-group.disabled input ~ label {
  color: var(--gray-400) !important;
}

.bs-select-wrap {
  position: relative;
  outline: 0;
  background-color: var(--body-bg);
  color: var(--body-text);
  min-width: 64px;
}
.bs-select-wrap:hover > .selected {
  border-color: var(--border-hover);
}
.bs-select-wrap:focus > .selected {
  border-color: var(--color-focus);
}
.bs-select-wrap > .selected {
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 0 6px;
  min-width: 100%;
  cursor: pointer;
  display: flex;
}
.bs-select-wrap > .selected .label {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .placeholder {
  color: var(--gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .dropdown-btn {
  font-family: var(--icon-font-family);
  margin-right: -4px;
  margin-left: 4px;
  user-select: none;
  transition: transform 0.2s linear;
}
.bs-select-wrap.popup-open .dropdown-btn {
  transform: rotate(180deg);
}
.bs-select-wrap.modified > .selected {
  border-color: var(--purple) !important;
}
.bs-select-wrap.error > .selected {
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}
.bs-select-wrap.disabled > .selected {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-500) !important;
}
.bs-select-wrap.view-mode {
  background-color: transparent;
}
.bs-select-wrap .small-progress {
  font-family: var(--icon-font-family);
  font-size: 0.9em;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 0 2px;
  color: var(--gray-400);
  animation: spin 1s linear infinite;
}

.bs-field-error {
  color: var(--color-error);
  margin-top: 4px;
}

.bs-clickable, header.default-header .header-logo, header.default-header .sidebar-menu .menu-btn, header.default-header .sidebar-menu .sidebar-menu-item a.sidebar-menu-link, header.default-header .sidebar-menu .sidebar-menu-item div.sidebar-menu-link, header.default-header .header-tabs .header-tab .close-btn {
  user-select: none;
  cursor: pointer;
}
.bs-clickable:hover, header.default-header .header-logo:hover, header.default-header .sidebar-menu .menu-btn:hover, header.default-header .sidebar-menu .sidebar-menu-item a.sidebar-menu-link:hover, header.default-header .sidebar-menu .sidebar-menu-item div.sidebar-menu-link:hover, header.default-header .header-tabs .header-tab .close-btn:hover {
  filter: opacity(75%);
}
.bs-clickable:active, header.default-header .header-logo:active, header.default-header .sidebar-menu .menu-btn:active, header.default-header .sidebar-menu .sidebar-menu-item a.sidebar-menu-link:active, header.default-header .sidebar-menu .sidebar-menu-item div.sidebar-menu-link:active, header.default-header .header-tabs .header-tab .close-btn:active {
  filter: opacity(50%);
}
.bs-clickable.disabled, header.default-header .disabled.header-logo, header.default-header .sidebar-menu .disabled.menu-btn, header.default-header .sidebar-menu .sidebar-menu-item a.disabled.sidebar-menu-link, header.default-header .sidebar-menu .sidebar-menu-item div.disabled.sidebar-menu-link, header.default-header .header-tabs .header-tab .disabled.close-btn {
  filter: opacity(40%);
}

.component-shadow-base {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}

[data-theme=dark] .component-shadow-base {
  box-shadow: 2px 2px 8px rgba(255, 255, 255, 0.1);
}

.font-icon {
  font-family: var(--icon-font-family);
  font-size: 1rem;
  max-width: 1em;
}
.font-icon.filled {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}

.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}

.fade-enter,
.fade-leave-to {
  opacity: 0;
}

.text-description {
  margin-top: 2px;
  color: var(--gray-400);
  font-size: 0.923em;
}

.bs-drop-position {
  position: absolute;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--primary-400);
  opacity: 0.7;
  z-index: 100;
}
.bs-drop-position.vertical {
  left: 0;
  width: 100%;
  height: 8px;
}
.bs-drop-position.vertical.before {
  top: -4px;
}
.bs-drop-position.vertical.after {
  bottom: -4px;
}
.bs-drop-position.horizontal {
  left: 0;
  width: 8px;
  height: 100%;
}
.bs-drop-position.horizontal.before {
  left: -4px;
}
.bs-drop-position.horizontal.after {
  right: -4px;
}

.bs-droppable-horizontal {
  transition: transform 0.3s ease;
}
.bs-droppable-horizontal.bs-dropping-before, .bs-droppable-horizontal.bs-dropping-after-following {
  transform: translateX(12px);
  z-index: 1;
}
.bs-droppable-horizontal.bs-dropping-after, .bs-droppable-horizontal.bs-dropping-before-preceding {
  transform: translateX(-12px);
  z-index: 1;
}

.bs-dragging-source {
  opacity: 0.5;
}

:root {
  --color-menu-bg: #464854;
  --color-menu-border: #2D2E36;
  --header-height: 44px;
  --sidebar-menu-width: 220px;
}

header.default-header {
  height: var(--header-height);
  background-color: var(--header-bg);
  display: flex;
  align-items: center;
  position: fixed;
  width: 100%;
  top: 0;
  z-index: 200;
}
header.default-header .header-logo {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  color: var(--header-text);
  font-size: 1.2307em;
  font-weight: 500;
  line-height: 1;
}
header.default-header .header-logo em {
  display: inline-flex;
  align-items: center;
  margin-right: 6px;
  padding: 2px 4px;
  border-radius: 4px;
  background-color: var(--header-text);
  color: var(--header-bg);
  font-size: 1em;
  font-weight: 700;
}
header.default-header.fixed-menu .header-logo {
  min-width: calc(var(--sidebar-menu-width) - 48px);
}
header.default-header .sidebar-menu {
  width: 48px;
  align-self: stretch;
}
header.default-header .sidebar-menu .menu-btn {
  font-size: 1.375rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: var(--header-height);
  max-width: var(--header-height);
  line-height: var(--header-height);
  color: var(--header-text);
  margin-left: 8px;
}
header.default-header .sidebar-menu .menu-container {
  position: absolute;
  background-color: var(--color-menu-bg);
  height: calc(100vh - var(--header-height));
  width: var(--sidebar-menu-width);
  overflow: auto;
  padding-bottom: 100px;
}
header.default-header .sidebar-menu .sidebar-menu-item {
  border-top: 1px solid var(--color-menu-border);
  color: var(--header-text);
}
header.default-header .sidebar-menu .sidebar-menu-item a.sidebar-menu-link, header.default-header .sidebar-menu .sidebar-menu-item div.sidebar-menu-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px;
  color: #A9A9AE;
  text-decoration: none;
}
header.default-header .sidebar-menu .sidebar-menu-item a.sidebar-menu-link .font-icon, header.default-header .sidebar-menu .sidebar-menu-item div.sidebar-menu-link .font-icon {
  font-size: 0.8rem;
}
header.default-header .sidebar-menu .sidebar-menu-item .sidebar-submenu {
  padding: 8px 16px 8px 8px;
  background-color: var(--color-menu-border);
}
header.default-header .sidebar-menu .sidebar-menu-item .sidebar-submenu > a.sidebar-menu-link, header.default-header .sidebar-menu .sidebar-menu-item .sidebar-submenu > div.sidebar-menu-link {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 0 8px 20px;
}
header.default-header .sidebar-menu .sidebar-menu-item .sidebar-submenu > a.sidebar-menu-link:before, header.default-header .sidebar-menu .sidebar-menu-item .sidebar-submenu > div.sidebar-menu-link:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 8px;
  display: block;
  width: 2px;
  height: 2px;
  background-color: var(--gray-400);
}
header.default-header .sidebar-menu .sidebar-menu-item .sidebar-submenu > a.sidebar-menu-link .font-icon, header.default-header .sidebar-menu .sidebar-menu-item .sidebar-submenu > div.sidebar-menu-link .font-icon {
  margin-left: 8px;
  font-size: 0.8rem;
}
header.default-header .sidebar-menu .sidebar-menu-item .sidebar-submenu > a.sidebar-menu-link .font-icon.filled, header.default-header .sidebar-menu .sidebar-menu-item .sidebar-submenu > div.sidebar-menu-link .font-icon.filled {
  color: var(--secondary);
}
header.default-header .header-tabs {
  margin: 0 4px 0 16px;
  display: flex;
  align-items: end;
  gap: 1px;
  flex-grow: 1;
  align-self: end;
  overflow-x: auto;
  scrollbar-width: none;
}
header.default-header .header-tabs .header-tab {
  background-color: var(--header-tab-bg);
  padding: 0 12px;
  height: 32px;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  display: flex;
  align-items: center;
  flex-grow: 1;
  position: relative;
  max-width: 180px;
  min-width: 48px;
  color: var(--header-text);
  cursor: pointer;
}
header.default-header .header-tabs .header-tab .header-title {
  padding-right: 6px;
  width: 50px;
  flex-basis: 180px;
  overflow: hidden;
  white-space: nowrap;
  mask-image: linear-gradient(to right, #000 85%, transparent 95%);
}
header.default-header .header-tabs .header-tab .close-btn {
  right: 4px;
  display: none;
}
header.default-header .header-tabs .header-tab:hover .header-title {
  mask-image: linear-gradient(to right, #000 80%, transparent 90%);
}
header.default-header .header-tabs .header-tab:hover .close-btn {
  position: absolute;
  top: 4px;
  right: 8px;
  display: block;
}
header.default-header .header-tabs .header-tab:hover:not(.selected) {
  background-color: color-mix(in srgb, var(--header-tab-bg) 80%, white 20%);
}
header.default-header .header-tabs .header-tab.selected {
  color: var(--header-tab-text);
  background-color: var(--header-tab-selected);
}
header.default-header .header-tabs .header-tab.selected:hover {
  background-color: var(--header-tab-selected);
}
header.default-header .header-tab-list-button {
  align-self: end;
}
header.default-header .header-tab-list-button .tab-list-button {
  min-width: 20px;
  height: 32px;
  padding: 4px 2px;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  color: var(--header-text);
  background-color: var(--header-tab-bg);
  user-select: none;
  cursor: pointer;
}
header.default-header .header-tab-list-button .tab-list-button:hover:not(:active) {
  opacity: 0.8;
}
header.default-header .header-tab-list-button .tab-list-button:active {
  opacity: 1;
}

html {
  background-color: var(--body-bg);
}

.default-body {
  background-color: var(--body-bg);
  color: var(--body-text);
  margin-top: var(--header-height);
  min-height: calc(100vh - var(--header-height));
}
.default-body.fixed-menu {
  padding-left: var(--sidebar-menu-width);
}
.default-body .body-tab:has(> div.h-full) {
  height: calc(100vh - var(--header-height));
}
.default-body .fixed-header {
  position: fixed;
  width: 100%;
  min-height: 43px;
  border-bottom: 1px solid var(--border);
  background-color: var(--body-bg);
  padding: 8px 16px;
  z-index: 10;
}
.default-body.fixed-menu .fixed-header {
  width: calc(100% - var(--sidebar-menu-width));
}
.default-body .colored-bg {
  flex-grow: 1;
  background-color: var(--colored-bg);
}
.default-body .colored-bg > .box-style {
  background-color: var(--body-bg);
  border-radius: 10px;
}
.default-body .colored-bg .dashboard-box-style {
  background-color: var(--body-bg);
  padding: 16px;
  border-radius: 10px;
}
.default-body .colored-bg .dashboard-box-style .title {
  font-weight: 500;
  line-height: 1;
  margin-bottom: 8px;
}

.menu-slide-enter-active,
.menu-slide-leave-active {
  transition: all 0.2s ease-out;
}

.menu-slide-enter-from {
  transform: translateX(-100%);
}

.menu-slide-leave-to {
  transform: translateX(-100%);
  opacity: 0;
}

.bs-button[data-v-b7ae95cb] {
  color: var(--color-text);
  border: none;
  border-radius: 2px;
  padding: 4px 8px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  height: 26px;
  vertical-align: middle;
  white-space: nowrap;
  text-decoration: none;
  margin-right: 1px;
}

.bs-button.border-0 > .font-icon.left[data-v-b7ae95cb] {
  margin-right: 0;
}

.bs-button.border-0 > .font-icon.right[data-v-b7ae95cb] {
  margin-left: 0;
}

.bs-button.bg-transparent[data-v-b7ae95cb]:not(:disabled):hover {
  opacity: 0.8;
}

.bs-button.bg-transparent[data-v-b7ae95cb]:not(:disabled):active {
  opacity: 0.8;
}

.bs-button[data-v-b7ae95cb]:disabled {
  cursor: default;
  opacity: 0.6;
}

.bs-button.default[data-v-b7ae95cb] {
  background-color: var(--button-default-bg);
  border: 1px solid var(--border);
  color: var(--button-default-text);
}

.bs-button.default[data-v-b7ae95cb]:not(:disabled):hover {
  background-color: var(--gray-100);
}

.bs-button.default[data-v-b7ae95cb]:not(:disabled):active {
  background-color: var(--gray-200);
}

.bs-button.blue[data-v-b7ae95cb] {
  background-color: var(--blue);
  border: 1px solid var(--blue);
  color: var(--white);
}

.bs-button.blue[data-v-b7ae95cb]:not(:disabled):hover {
  background-color: color-mix(in srgb, var(--blue) 90%, black 10%);
}

.bs-button.blue[data-v-b7ae95cb]:not(:disabled):active {
  background-color: color-mix(in srgb, var(--blue) 80%, black 20%);
}

.bs-button.red[data-v-b7ae95cb] {
  background-color: var(--red);
  color: var(--white);
}

.bs-button.red[data-v-b7ae95cb]:not(:disabled):hover {
  background-color: color-mix(in srgb, var(--red) 90%, black 10%);
}

.bs-button.red[data-v-b7ae95cb]:not(:disabled):active {
  background-color: color-mix(in srgb, var(--red) 80%, black 20%);
}

.bs-button.orange[data-v-b7ae95cb] {
  background-color: var(--orange);
  color: var(--white);
}

.bs-button.orange[data-v-b7ae95cb]:not(:disabled):hover {
  background-color: color-mix(in srgb, var(--orange) 90%, black 10%);
}

.bs-button.orange[data-v-b7ae95cb]:not(:disabled):active {
  background-color: color-mix(in srgb, var(--orange) 80%, black 20%);
}

.bs-button.green[data-v-b7ae95cb] {
  background-color: var(--green);
  color: var(--white);
}

.bs-button.green[data-v-b7ae95cb]:not(:disabled):hover {
  background-color: color-mix(in srgb, var(--green) 90%, black 10%);
}

.bs-button.green[data-v-b7ae95cb]:not(:disabled):active {
  background-color: color-mix(in srgb, var(--green) 80%, black 20%);
}

.bs-button.gray[data-v-b7ae95cb] {
  background-color: var(--gray);
  color: var(--white);
}

.bs-button.gray[data-v-b7ae95cb]:not(:disabled):hover {
  background-color: color-mix(in srgb, var(--gray) 90%, black 10%);
}

.bs-button.gray[data-v-b7ae95cb]:not(:disabled):active {
  background-color: color-mix(in srgb, var(--gray) 80%, black 20%);
}

.bs-button.underline[data-v-b7ae95cb] {
  padding: 0 8px;
  border: 0 none;
  border-radius: 0;
  text-decoration: underline;
  text-underline-offset: 2px;
  background-color: var(--button-default-bg);
  color: var(--button-default-text);
}

.bs-button.underline.blue[data-v-b7ae95cb]:not(:disabled):hover {
  background-color: color-mix(in srgb, var(--blue) 95%, black 5%);
}

.bs-button.underline.blue[data-v-b7ae95cb]:not(:disabled):active {
  background-color: color-mix(in srgb, var(--blue) 90%, black 10%);
}

.bs-button.underline.red[data-v-b7ae95cb]:not(:disabled):active {
  background-color: color-mix(in srgb, var(--red) 90%, black 10%);
}

.bs-button.underline.orange[data-v-b7ae95cb]:not(:disabled):active {
  background-color: color-mix(in srgb, var(--orange) 90%, black 10%);
}

.bs-button.underline.green[data-v-b7ae95cb]:not(:disabled):active {
  background-color: color-mix(in srgb, var(--green) 90%, black 10%);
}

.bs-button.underline.gray[data-v-b7ae95cb]:not(:disabled):active {
  background-color: color-mix(in srgb, var(--gray) 90%, black 10%);
}

[data-theme=dark] .bs-button.default[data-v-b7ae95cb]:not(:disabled):hover {
  background-color: var(--gray-800);
}

[data-theme=dark] .bs-button.default[data-v-b7ae95cb]:not(:disabled):active {
  background-color: var(--gray-700);
}

.bs-form-label.required:after {
  content: "*";
  color: var(--primary);
  margin-left: 2px;
}

.bs-box-component-wrap, .bs-select-wrap, .bs-input-wrap {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: left;
}

.bs-box-component-wrap .message, .bs-select-wrap .message, .bs-input-wrap .message {
  margin-top: 4px;
  font-size: 0.9em;
}

.bs-box-component-base, .bs-select-wrap > .selected, .bs-input-base {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: left;
  background-color: var(--body-bg);
}

.bs-input-wrap .suffix,
.bs-input-wrap .prefix {
  font-size: 0.9em;
  margin-right: 4px;
  margin-left: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}

.bs-input-wrap .suffix:first-child,
.bs-input-wrap .prefix:first-child {
  margin-left: 4px;
}

.bs-input-wrap .suffix .font-icon,
.bs-input-wrap .prefix .font-icon {
  font-size: 0.9em;
}

.bs-input-wrap .suffix img,
.bs-input-wrap .prefix img {
  width: 0.9em;
  height: 0.9em;
}

[data-theme=dark] .bs-input-wrap .suffix img,
[data-theme=dark] .bs-input-wrap .prefix img {
  filter: invert(1);
}

.bs-input-base {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}

.bs-input-base > input {
  border: 0;
  border-radius: 0;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  flex-basis: 1em;
  padding: 0 6px;
  background-color: transparent;
  width: 100%;
  color: var(--body-text);
}

.bs-input-base > textarea {
  border: 0;
  border-radius: 4px;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  padding: 6px;
  line-height: 1.4;
  font-family: sans-serif;
  background-color: var(--body-bg);
  color: var(--body-text);
}

.bs-input-base:hover {
  border-color: var(--border-hover);
}

.bs-input-base:has(:focus) {
  border-color: var(--color-focus);
  border-width: 1px;
}

.bs-text-input.modified > .input-area,
.bs-number-input.modified > .input-area,
.bs-price-input.modified > .input-area,
.bs-date-input.modified > .input-area,
.bs-date-range.modified > .input-area,
.bs-multi-lang-text-input.modified > .input-area,
.bs-multi-lang-text-area.modified > .input-area,
.bs-multi-lang-rich-text.modified > .input-area,
.bs-text-area.modified > .input-area,
.bs-rich-text.modified > .input-area {
  border-color: var(--purple) !important;
}

.bs-text-input.error > .input-area,
.bs-number-input.error > .input-area,
.bs-price-input.error > .input-area,
.bs-date-input.error > .input-area,
.bs-date-range.error > .input-area,
.bs-multi-lang-text-input.error > .input-area,
.bs-multi-lang-text-area.error > .input-area,
.bs-multi-lang-rich-text.error > .input-area,
.bs-text-area.error > .input-area,
.bs-rich-text.error > .input-area {
  border-color: var(--danger) !important;
}

.bs-text-input.error > .input-area > input,
.bs-number-input.error > .input-area > input,
.bs-price-input.error > .input-area > input,
.bs-date-input.error > .input-area > input,
.bs-date-range.error > .input-area > input,
.bs-multi-lang-text-input.error > .input-area > input,
.bs-multi-lang-text-area.error > .input-area > input,
.bs-multi-lang-rich-text.error > .input-area > input,
.bs-text-area.error > .input-area > input,
.bs-rich-text.error > .input-area > input {
  color: var(--danger) !important;
}

.bs-text-input.disabled > .input-area,
.bs-number-input.disabled > .input-area,
.bs-price-input.disabled > .input-area,
.bs-date-input.disabled > .input-area,
.bs-date-range.disabled > .input-area,
.bs-multi-lang-text-input.disabled > .input-area,
.bs-multi-lang-text-area.disabled > .input-area,
.bs-multi-lang-rich-text.disabled > .input-area,
.bs-text-area.disabled > .input-area,
.bs-rich-text.disabled > .input-area {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}

.bs-text-input.disabled > .input-area > input,
.bs-number-input.disabled > .input-area > input,
.bs-price-input.disabled > .input-area > input,
.bs-date-input.disabled > .input-area > input,
.bs-date-range.disabled > .input-area > input,
.bs-multi-lang-text-input.disabled > .input-area > input,
.bs-multi-lang-text-area.disabled > .input-area > input,
.bs-multi-lang-rich-text.disabled > .input-area > input,
.bs-text-area.disabled > .input-area > input,
.bs-rich-text.disabled > .input-area > input {
  color: var(--gray-400) !important;
  background-color: var(--gray-100) !important;
}

.bs-text-input.disabled > .input-area > textarea,
.bs-number-input.disabled > .input-area > textarea,
.bs-price-input.disabled > .input-area > textarea,
.bs-date-input.disabled > .input-area > textarea,
.bs-date-range.disabled > .input-area > textarea,
.bs-multi-lang-text-input.disabled > .input-area > textarea,
.bs-multi-lang-text-area.disabled > .input-area > textarea,
.bs-multi-lang-rich-text.disabled > .input-area > textarea,
.bs-text-area.disabled > .input-area > textarea,
.bs-rich-text.disabled > .input-area > textarea {
  background-color: var(--gray-100) !important;
}

.bs-date-input .view-mode,
.bs-date-range .view-mode {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}

.bs-date-input .view-mode::before,
.bs-date-range .view-mode::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-date-input .extra-dates,
.bs-date-range .extra-dates,
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  color: var(--body-text);
  margin-top: 4px;
}

.bs-date-input .extra-dates .extra-date,
.bs-date-range .extra-dates .extra-date,
.bs-calendar .extra-dates .extra-date,
.bs-calendar-range .extra-dates .extra-date {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8125rem;
}

.bs-date-input .extra-dates .extra-date::before,
.bs-date-range .extra-dates .extra-date::before,
.bs-calendar .extra-dates .extra-date::before,
.bs-calendar-range .extra-dates .extra-date::before {
  content: "globe";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}

.bs-checkbox-base {
  display: inline-block;
  color: var(--body-text);
  white-space: nowrap;
}

.bs-checkbox-base input {
  appearance: none;
  margin: 0;
  outline: 0;
}

.bs-checkbox-base input::before {
  font-family: var(--icon-font-family);
  font-size: 20px;
  vertical-align: middle;
  cursor: pointer;
  color: var(--body-text);
}

.bs-checkbox-base input:hover {
  color: var(--gray-500);
}

.bs-checkbox-base input:hover ~ label {
  color: var(--gray-500);
}

.bs-checkbox-base input:focus::before {
  color: var(--color-focus);
}

.bs-checkbox-base input:focus ~ label {
  color: var(--color-focus);
}

.bs-checkbox-base.modified input::before {
  color: var(--purple) !important;
}

.bs-checkbox-base.modified input ~ label {
  color: var(--purple) !important;
}

.bs-checkbox-base.error input::before {
  color: var(--danger) !important;
}

.bs-checkbox-base.error input ~ label {
  color: var(--danger) !important;
}

.bs-checkbox-base.disabled input::before {
  color: var(--gray-400) !important;
}

.bs-checkbox-base.disabled input ~ label {
  color: var(--gray-400) !important;
}

.bs-checkbox-base label {
  display: inline-block;
  vertical-align: middle;
  padding: 4px 2px;
  cursor: pointer;
}

.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input::before {
  color: var(--purple) !important;
}

.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input ~ label {
  color: var(--purple) !important;
}

.bs-checkbox-group.error .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input::before {
  color: var(--danger) !important;
}

.bs-checkbox-group.error .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input ~ label {
  color: var(--danger) !important;
}

.bs-checkbox-group.disabled input::before,
.bs-radio-button-group.disabled input::before {
  color: var(--gray-400) !important;
}

.bs-checkbox-group.disabled input ~ label,
.bs-radio-button-group.disabled input ~ label {
  color: var(--gray-400) !important;
}

.bs-select-wrap {
  position: relative;
  outline: 0;
  background-color: var(--body-bg);
  color: var(--body-text);
  min-width: 64px;
}

.bs-select-wrap:hover > .selected {
  border-color: var(--border-hover);
}

.bs-select-wrap:focus > .selected {
  border-color: var(--color-focus);
}

.bs-select-wrap > .selected {
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 0 6px;
  min-width: 100%;
  cursor: pointer;
  display: flex;
}

.bs-select-wrap > .selected .label {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.bs-select-wrap > .selected .placeholder {
  color: var(--gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
}

.bs-select-wrap > .selected .dropdown-btn {
  font-family: var(--icon-font-family);
  margin-right: -4px;
  margin-left: 4px;
  user-select: none;
  transition: transform 0.2s linear;
}

.bs-select-wrap.popup-open .dropdown-btn {
  transform: rotate(180deg);
}

.bs-select-wrap.modified > .selected {
  border-color: var(--purple) !important;
}

.bs-select-wrap.error > .selected {
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}

.bs-select-wrap.disabled > .selected {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-500) !important;
}

.bs-select-wrap.view-mode {
  background-color: transparent;
}

.bs-select-wrap .small-progress {
  font-family: var(--icon-font-family);
  font-size: 0.9em;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 0 2px;
  color: var(--gray-400);
  animation: spin 1s linear infinite;
}

.bs-field-error {
  color: var(--color-error);
  margin-top: 4px;
}

.bs-clickable {
  user-select: none;
  cursor: pointer;
}

.bs-clickable:hover {
  filter: opacity(75%);
}

.bs-clickable:active {
  filter: opacity(50%);
}

.bs-clickable.disabled {
  filter: opacity(40%);
}

.component-shadow-base, .bs-popup {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}

[data-theme=dark] .component-shadow-base, [data-theme=dark] .bs-popup {
  box-shadow: 2px 2px 8px rgba(255, 255, 255, 0.1);
}

.font-icon {
  font-family: var(--icon-font-family);
  font-size: 1rem;
  max-width: 1em;
}

.font-icon.filled {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}

.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}

.fade-enter,
.fade-leave-to {
  opacity: 0;
}

.text-description {
  margin-top: 2px;
  color: var(--gray-400);
  font-size: 0.923em;
}

.bs-drop-position {
  position: absolute;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--primary-400);
  opacity: 0.7;
  z-index: 100;
}

.bs-drop-position.vertical {
  left: 0;
  width: 100%;
  height: 8px;
}

.bs-drop-position.vertical.before {
  top: -4px;
}

.bs-drop-position.vertical.after {
  bottom: -4px;
}

.bs-drop-position.horizontal {
  left: 0;
  width: 8px;
  height: 100%;
}

.bs-drop-position.horizontal.before {
  left: -4px;
}

.bs-drop-position.horizontal.after {
  right: -4px;
}

.bs-droppable-horizontal {
  transition: transform 0.3s ease;
}

.bs-droppable-horizontal.bs-dropping-before, .bs-droppable-horizontal.bs-dropping-after-following {
  transform: translateX(12px);
  z-index: 1;
}

.bs-droppable-horizontal.bs-dropping-after, .bs-droppable-horizontal.bs-dropping-before-preceding {
  transform: translateX(-12px);
  z-index: 1;
}

.bs-dragging-source {
  opacity: 0.5;
}

.bs-popup {
  position: fixed;
  border: 1px solid var(--border);
  border-radius: 4px;
  background-color: var(--body-bg);
  color: var(--body-text);
  z-index: 300;
  min-width: 48px;
  min-height: 24px;
}

[data-theme=dark] .bs-select-popup > .popup-items > .popup-item.selected-item {
  color: var(--primary-400);
}

[data-theme=dark] .bs-select-popup > .popup-items > .popup-item.selected-item .checkbox::before {
  color: var(--primary-400);
}

.bs-select-popup {
  min-width: 120px;
  max-height: 300px;
  overflow: hidden;
  line-height: 1;
}

.bs-select-popup > .popup-search > input {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
  padding: 2px 4px;
  width: 100%;
  color: var(--body-text);
  outline: 0;
}

.bs-select-popup > .popup-search > input:focus {
  border-color: var(--color-focus);
  border-width: 1px;
}

.bs-select-popup > .popup-items > .popup-item {
  padding: 6px 16px;
  height: 28px;
  cursor: pointer;
  display: flex;
  align-items: center;
}

.bs-select-popup > .popup-items > .popup-item .checkbox {
  display: inline-flex;
  width: 20px;
  margin-left: -10px;
}

.bs-select-popup > .popup-items > .popup-item .checkbox::before {
  font-family: var(--icon-font-family);
  content: "";
  font-size: 16px;
  color: var(--color-text);
  margin-right: 2px;
}

.bs-select-popup > .popup-items > .popup-item .label {
  flex-grow: 1;
  white-space: nowrap;
  cursor: pointer;
}

.bs-select-popup > .popup-items > .popup-item .label.null-label {
  color: var(--color-text-light);
}

.bs-select-popup > .popup-items > .popup-item.hovered {
  background-color: var(--color-hover);
}

.bs-select-popup > .popup-items > .popup-item.selected-item {
  color: var(--primary);
  font-weight: bold;
}

.bs-select-popup > .popup-items > .popup-item.selected-item .checkbox::before {
  content: "check";
  color: var(--primary);
}

.bs-box-component-wrap, .bs-select-wrap, .bs-select, .bs-input-wrap {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: left;
}

.bs-box-component-wrap .message, .bs-select-wrap .message, .bs-select .message, .bs-input-wrap .message {
  margin-top: 4px;
  font-size: 0.9em;
}

.bs-box-component-base, .bs-select-wrap > .selected, .bs-select > .selected, .bs-input-base {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: left;
  background-color: var(--body-bg);
}

.bs-input-wrap .suffix,
.bs-input-wrap .prefix {
  font-size: 0.9em;
  margin-right: 4px;
  margin-left: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}

.bs-input-wrap .suffix:first-child,
.bs-input-wrap .prefix:first-child {
  margin-left: 4px;
}

.bs-input-wrap .suffix .font-icon,
.bs-input-wrap .prefix .font-icon {
  font-size: 0.9em;
}

.bs-input-wrap .suffix img,
.bs-input-wrap .prefix img {
  width: 0.9em;
  height: 0.9em;
}

[data-theme=dark] .bs-input-wrap .suffix img,
[data-theme=dark] .bs-input-wrap .prefix img {
  filter: invert(1);
}

.bs-input-base {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}

.bs-input-base > input {
  border: 0;
  border-radius: 0;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  flex-basis: 1em;
  padding: 0 6px;
  background-color: transparent;
  width: 100%;
  color: var(--body-text);
}

.bs-input-base > textarea {
  border: 0;
  border-radius: 4px;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  padding: 6px;
  line-height: 1.4;
  font-family: sans-serif;
  background-color: var(--body-bg);
  color: var(--body-text);
}

.bs-input-base:hover {
  border-color: var(--border-hover);
}

.bs-input-base:has(:focus) {
  border-color: var(--color-focus);
  border-width: 1px;
}

.bs-text-input.modified > .input-area,
.bs-number-input.modified > .input-area,
.bs-price-input.modified > .input-area,
.bs-date-input.modified > .input-area,
.bs-date-range.modified > .input-area,
.bs-multi-lang-text-input.modified > .input-area,
.bs-multi-lang-text-area.modified > .input-area,
.bs-multi-lang-rich-text.modified > .input-area,
.bs-text-area.modified > .input-area,
.bs-rich-text.modified > .input-area {
  border-color: var(--purple) !important;
}

.bs-text-input.error > .input-area,
.bs-number-input.error > .input-area,
.bs-price-input.error > .input-area,
.bs-date-input.error > .input-area,
.bs-date-range.error > .input-area,
.bs-multi-lang-text-input.error > .input-area,
.bs-multi-lang-text-area.error > .input-area,
.bs-multi-lang-rich-text.error > .input-area,
.bs-text-area.error > .input-area,
.bs-rich-text.error > .input-area {
  border-color: var(--danger) !important;
}

.bs-text-input.error > .input-area > input,
.bs-number-input.error > .input-area > input,
.bs-price-input.error > .input-area > input,
.bs-date-input.error > .input-area > input,
.bs-date-range.error > .input-area > input,
.bs-multi-lang-text-input.error > .input-area > input,
.bs-multi-lang-text-area.error > .input-area > input,
.bs-multi-lang-rich-text.error > .input-area > input,
.bs-text-area.error > .input-area > input,
.bs-rich-text.error > .input-area > input {
  color: var(--danger) !important;
}

.bs-text-input.disabled > .input-area,
.bs-number-input.disabled > .input-area,
.bs-price-input.disabled > .input-area,
.bs-date-input.disabled > .input-area,
.bs-date-range.disabled > .input-area,
.bs-multi-lang-text-input.disabled > .input-area,
.bs-multi-lang-text-area.disabled > .input-area,
.bs-multi-lang-rich-text.disabled > .input-area,
.bs-text-area.disabled > .input-area,
.bs-rich-text.disabled > .input-area {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}

.bs-text-input.disabled > .input-area > input,
.bs-number-input.disabled > .input-area > input,
.bs-price-input.disabled > .input-area > input,
.bs-date-input.disabled > .input-area > input,
.bs-date-range.disabled > .input-area > input,
.bs-multi-lang-text-input.disabled > .input-area > input,
.bs-multi-lang-text-area.disabled > .input-area > input,
.bs-multi-lang-rich-text.disabled > .input-area > input,
.bs-text-area.disabled > .input-area > input,
.bs-rich-text.disabled > .input-area > input {
  color: var(--gray-400) !important;
  background-color: var(--gray-100) !important;
}

.bs-text-input.disabled > .input-area > textarea,
.bs-number-input.disabled > .input-area > textarea,
.bs-price-input.disabled > .input-area > textarea,
.bs-date-input.disabled > .input-area > textarea,
.bs-date-range.disabled > .input-area > textarea,
.bs-multi-lang-text-input.disabled > .input-area > textarea,
.bs-multi-lang-text-area.disabled > .input-area > textarea,
.bs-multi-lang-rich-text.disabled > .input-area > textarea,
.bs-text-area.disabled > .input-area > textarea,
.bs-rich-text.disabled > .input-area > textarea {
  background-color: var(--gray-100) !important;
}

.bs-date-input .view-mode,
.bs-date-range .view-mode {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}

.bs-date-input .view-mode::before,
.bs-date-range .view-mode::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-date-input .extra-dates,
.bs-date-range .extra-dates,
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  color: var(--body-text);
  margin-top: 4px;
}

.bs-date-input .extra-dates .extra-date,
.bs-date-range .extra-dates .extra-date,
.bs-calendar .extra-dates .extra-date,
.bs-calendar-range .extra-dates .extra-date {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8125rem;
}

.bs-date-input .extra-dates .extra-date::before,
.bs-date-range .extra-dates .extra-date::before,
.bs-calendar .extra-dates .extra-date::before,
.bs-calendar-range .extra-dates .extra-date::before {
  content: "globe";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}

.bs-checkbox-base {
  display: inline-block;
  color: var(--body-text);
  white-space: nowrap;
}

.bs-checkbox-base input {
  appearance: none;
  margin: 0;
  outline: 0;
}

.bs-checkbox-base input::before {
  font-family: var(--icon-font-family);
  font-size: 20px;
  vertical-align: middle;
  cursor: pointer;
  color: var(--body-text);
}

.bs-checkbox-base input:hover {
  color: var(--gray-500);
}

.bs-checkbox-base input:hover ~ label {
  color: var(--gray-500);
}

.bs-checkbox-base input:focus::before {
  color: var(--color-focus);
}

.bs-checkbox-base input:focus ~ label {
  color: var(--color-focus);
}

.bs-checkbox-base.modified input::before {
  color: var(--purple) !important;
}

.bs-checkbox-base.modified input ~ label {
  color: var(--purple) !important;
}

.bs-checkbox-base.error input::before {
  color: var(--danger) !important;
}

.bs-checkbox-base.error input ~ label {
  color: var(--danger) !important;
}

.bs-checkbox-base.disabled input::before {
  color: var(--gray-400) !important;
}

.bs-checkbox-base.disabled input ~ label {
  color: var(--gray-400) !important;
}

.bs-checkbox-base label {
  display: inline-block;
  vertical-align: middle;
  padding: 4px 2px;
  cursor: pointer;
}

.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input::before {
  color: var(--purple) !important;
}

.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input ~ label {
  color: var(--purple) !important;
}

.bs-checkbox-group.error .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input::before {
  color: var(--danger) !important;
}

.bs-checkbox-group.error .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input ~ label {
  color: var(--danger) !important;
}

.bs-checkbox-group.disabled input::before,
.bs-radio-button-group.disabled input::before {
  color: var(--gray-400) !important;
}

.bs-checkbox-group.disabled input ~ label,
.bs-radio-button-group.disabled input ~ label {
  color: var(--gray-400) !important;
}

.bs-select-wrap, .bs-select {
  position: relative;
  outline: 0;
  background-color: var(--body-bg);
  color: var(--body-text);
  min-width: 64px;
}

.bs-select-wrap:hover > .selected, .bs-select:hover > .selected {
  border-color: var(--border-hover);
}

.bs-select-wrap:focus > .selected, .bs-select:focus > .selected {
  border-color: var(--color-focus);
}

.bs-select-wrap > .selected, .bs-select > .selected {
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 0 6px;
  min-width: 100%;
  cursor: pointer;
  display: flex;
}

.bs-select-wrap > .selected .label, .bs-select > .selected .label {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.bs-select-wrap > .selected .placeholder, .bs-select > .selected .placeholder {
  color: var(--gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
}

.bs-select-wrap > .selected .dropdown-btn, .bs-select > .selected .dropdown-btn {
  font-family: var(--icon-font-family);
  margin-right: -4px;
  margin-left: 4px;
  user-select: none;
  transition: transform 0.2s linear;
}

.bs-select-wrap.popup-open .dropdown-btn, .popup-open.bs-select .dropdown-btn {
  transform: rotate(180deg);
}

.bs-select-wrap.modified > .selected, .modified.bs-select > .selected {
  border-color: var(--purple) !important;
}

.bs-select-wrap.error > .selected, .error.bs-select > .selected {
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}

.bs-select-wrap.disabled > .selected, .disabled.bs-select > .selected {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-500) !important;
}

.bs-select-wrap.view-mode, .view-mode.bs-select {
  background-color: transparent;
}

.bs-select-wrap .small-progress, .bs-select .small-progress {
  font-family: var(--icon-font-family);
  font-size: 0.9em;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 0 2px;
  color: var(--gray-400);
  animation: spin 1s linear infinite;
}

.bs-field-error {
  color: var(--color-error);
  margin-top: 4px;
}

.bs-clickable {
  user-select: none;
  cursor: pointer;
}

.bs-clickable:hover {
  filter: opacity(75%);
}

.bs-clickable:active {
  filter: opacity(50%);
}

.bs-clickable.disabled {
  filter: opacity(40%);
}

.component-shadow-base {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}

[data-theme=dark] .component-shadow-base {
  box-shadow: 2px 2px 8px rgba(255, 255, 255, 0.1);
}

.font-icon {
  font-family: var(--icon-font-family);
  font-size: 1rem;
  max-width: 1em;
}

.font-icon.filled {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}

.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}

.fade-enter,
.fade-leave-to {
  opacity: 0;
}

.text-description {
  margin-top: 2px;
  color: var(--gray-400);
  font-size: 0.923em;
}

.bs-drop-position {
  position: absolute;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--primary-400);
  opacity: 0.7;
  z-index: 100;
}

.bs-drop-position.vertical {
  left: 0;
  width: 100%;
  height: 8px;
}

.bs-drop-position.vertical.before {
  top: -4px;
}

.bs-drop-position.vertical.after {
  bottom: -4px;
}

.bs-drop-position.horizontal {
  left: 0;
  width: 8px;
  height: 100%;
}

.bs-drop-position.horizontal.before {
  left: -4px;
}

.bs-drop-position.horizontal.after {
  right: -4px;
}

.bs-droppable-horizontal {
  transition: transform 0.3s ease;
}

.bs-droppable-horizontal.bs-dropping-before, .bs-droppable-horizontal.bs-dropping-after-following {
  transform: translateX(12px);
  z-index: 1;
}

.bs-droppable-horizontal.bs-dropping-after, .bs-droppable-horizontal.bs-dropping-before-preceding {
  transform: translateX(-12px);
  z-index: 1;
}

.bs-dragging-source {
  opacity: 0.5;
}

.bs-box-component-wrap, .bs-select-wrap, .bs-input-wrap {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: left;
}

.bs-box-component-wrap .message, .bs-select-wrap .message, .bs-input-wrap .message {
  margin-top: 4px;
  font-size: 0.9em;
}

.bs-box-component-base, .bs-select-wrap > .selected, .bs-input-base {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: left;
  background-color: var(--body-bg);
}

.bs-input-wrap .suffix,
.bs-input-wrap .prefix {
  font-size: 0.9em;
  margin-right: 4px;
  margin-left: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}

.bs-input-wrap .suffix:first-child,
.bs-input-wrap .prefix:first-child {
  margin-left: 4px;
}

.bs-input-wrap .suffix .font-icon, .bs-input-wrap .suffix .bs-context-menu > .menu.has-submenu::after,
.bs-input-wrap .prefix .font-icon,
.bs-input-wrap .prefix .bs-context-menu > .menu.has-submenu::after {
  font-size: 0.9em;
}

.bs-input-wrap .suffix img,
.bs-input-wrap .prefix img {
  width: 0.9em;
  height: 0.9em;
}

[data-theme=dark] .bs-input-wrap .suffix img,
[data-theme=dark] .bs-input-wrap .prefix img {
  filter: invert(1);
}

.bs-input-base {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}

.bs-input-base > input {
  border: 0;
  border-radius: 0;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  flex-basis: 1em;
  padding: 0 6px;
  background-color: transparent;
  width: 100%;
  color: var(--body-text);
}

.bs-input-base > textarea {
  border: 0;
  border-radius: 4px;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  padding: 6px;
  line-height: 1.4;
  font-family: sans-serif;
  background-color: var(--body-bg);
  color: var(--body-text);
}

.bs-input-base:hover {
  border-color: var(--border-hover);
}

.bs-input-base:has(:focus) {
  border-color: var(--color-focus);
  border-width: 1px;
}

.bs-text-input.modified > .input-area,
.bs-number-input.modified > .input-area,
.bs-price-input.modified > .input-area,
.bs-date-input.modified > .input-area,
.bs-date-range.modified > .input-area,
.bs-multi-lang-text-input.modified > .input-area,
.bs-multi-lang-text-area.modified > .input-area,
.bs-multi-lang-rich-text.modified > .input-area,
.bs-text-area.modified > .input-area,
.bs-rich-text.modified > .input-area {
  border-color: var(--purple) !important;
}

.bs-text-input.error > .input-area,
.bs-number-input.error > .input-area,
.bs-price-input.error > .input-area,
.bs-date-input.error > .input-area,
.bs-date-range.error > .input-area,
.bs-multi-lang-text-input.error > .input-area,
.bs-multi-lang-text-area.error > .input-area,
.bs-multi-lang-rich-text.error > .input-area,
.bs-text-area.error > .input-area,
.bs-rich-text.error > .input-area {
  border-color: var(--danger) !important;
}

.bs-text-input.error > .input-area > input,
.bs-number-input.error > .input-area > input,
.bs-price-input.error > .input-area > input,
.bs-date-input.error > .input-area > input,
.bs-date-range.error > .input-area > input,
.bs-multi-lang-text-input.error > .input-area > input,
.bs-multi-lang-text-area.error > .input-area > input,
.bs-multi-lang-rich-text.error > .input-area > input,
.bs-text-area.error > .input-area > input,
.bs-rich-text.error > .input-area > input {
  color: var(--danger) !important;
}

.bs-text-input.disabled > .input-area,
.bs-number-input.disabled > .input-area,
.bs-price-input.disabled > .input-area,
.bs-date-input.disabled > .input-area,
.bs-date-range.disabled > .input-area,
.bs-multi-lang-text-input.disabled > .input-area,
.bs-multi-lang-text-area.disabled > .input-area,
.bs-multi-lang-rich-text.disabled > .input-area,
.bs-text-area.disabled > .input-area,
.bs-rich-text.disabled > .input-area {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}

.bs-text-input.disabled > .input-area > input,
.bs-number-input.disabled > .input-area > input,
.bs-price-input.disabled > .input-area > input,
.bs-date-input.disabled > .input-area > input,
.bs-date-range.disabled > .input-area > input,
.bs-multi-lang-text-input.disabled > .input-area > input,
.bs-multi-lang-text-area.disabled > .input-area > input,
.bs-multi-lang-rich-text.disabled > .input-area > input,
.bs-text-area.disabled > .input-area > input,
.bs-rich-text.disabled > .input-area > input {
  color: var(--gray-400) !important;
  background-color: var(--gray-100) !important;
}

.bs-text-input.disabled > .input-area > textarea,
.bs-number-input.disabled > .input-area > textarea,
.bs-price-input.disabled > .input-area > textarea,
.bs-date-input.disabled > .input-area > textarea,
.bs-date-range.disabled > .input-area > textarea,
.bs-multi-lang-text-input.disabled > .input-area > textarea,
.bs-multi-lang-text-area.disabled > .input-area > textarea,
.bs-multi-lang-rich-text.disabled > .input-area > textarea,
.bs-text-area.disabled > .input-area > textarea,
.bs-rich-text.disabled > .input-area > textarea {
  background-color: var(--gray-100) !important;
}

.bs-date-input .view-mode,
.bs-date-range .view-mode {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}

.bs-date-input .view-mode::before,
.bs-date-range .view-mode::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-date-input .extra-dates,
.bs-date-range .extra-dates,
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  color: var(--body-text);
  margin-top: 4px;
}

.bs-date-input .extra-dates .extra-date,
.bs-date-range .extra-dates .extra-date,
.bs-calendar .extra-dates .extra-date,
.bs-calendar-range .extra-dates .extra-date {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8125rem;
}

.bs-date-input .extra-dates .extra-date::before,
.bs-date-range .extra-dates .extra-date::before,
.bs-calendar .extra-dates .extra-date::before,
.bs-calendar-range .extra-dates .extra-date::before {
  content: "globe";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}

.bs-checkbox-base {
  display: inline-block;
  color: var(--body-text);
  white-space: nowrap;
}

.bs-checkbox-base input {
  appearance: none;
  margin: 0;
  outline: 0;
}

.bs-checkbox-base input::before {
  font-family: var(--icon-font-family);
  font-size: 20px;
  vertical-align: middle;
  cursor: pointer;
  color: var(--body-text);
}

.bs-checkbox-base input:hover {
  color: var(--gray-500);
}

.bs-checkbox-base input:hover ~ label {
  color: var(--gray-500);
}

.bs-checkbox-base input:focus::before {
  color: var(--color-focus);
}

.bs-checkbox-base input:focus ~ label {
  color: var(--color-focus);
}

.bs-checkbox-base.modified input::before {
  color: var(--purple) !important;
}

.bs-checkbox-base.modified input ~ label {
  color: var(--purple) !important;
}

.bs-checkbox-base.error input::before {
  color: var(--danger) !important;
}

.bs-checkbox-base.error input ~ label {
  color: var(--danger) !important;
}

.bs-checkbox-base.disabled input::before {
  color: var(--gray-400) !important;
}

.bs-checkbox-base.disabled input ~ label {
  color: var(--gray-400) !important;
}

.bs-checkbox-base label {
  display: inline-block;
  vertical-align: middle;
  padding: 4px 2px;
  cursor: pointer;
}

.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input::before {
  color: var(--purple) !important;
}

.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input ~ label {
  color: var(--purple) !important;
}

.bs-checkbox-group.error .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input::before {
  color: var(--danger) !important;
}

.bs-checkbox-group.error .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input ~ label {
  color: var(--danger) !important;
}

.bs-checkbox-group.disabled input::before,
.bs-radio-button-group.disabled input::before {
  color: var(--gray-400) !important;
}

.bs-checkbox-group.disabled input ~ label,
.bs-radio-button-group.disabled input ~ label {
  color: var(--gray-400) !important;
}

.bs-select-wrap {
  position: relative;
  outline: 0;
  background-color: var(--body-bg);
  color: var(--body-text);
  min-width: 64px;
}

.bs-select-wrap:hover > .selected {
  border-color: var(--border-hover);
}

.bs-select-wrap:focus > .selected {
  border-color: var(--color-focus);
}

.bs-select-wrap > .selected {
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 0 6px;
  min-width: 100%;
  cursor: pointer;
  display: flex;
}

.bs-select-wrap > .selected .label {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.bs-select-wrap > .selected .placeholder {
  color: var(--gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
}

.bs-select-wrap > .selected .dropdown-btn {
  font-family: var(--icon-font-family);
  margin-right: -4px;
  margin-left: 4px;
  user-select: none;
  transition: transform 0.2s linear;
}

.bs-select-wrap.popup-open .dropdown-btn {
  transform: rotate(180deg);
}

.bs-select-wrap.modified > .selected {
  border-color: var(--purple) !important;
}

.bs-select-wrap.error > .selected {
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}

.bs-select-wrap.disabled > .selected {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-500) !important;
}

.bs-select-wrap.view-mode {
  background-color: transparent;
}

.bs-select-wrap .small-progress {
  font-family: var(--icon-font-family);
  font-size: 0.9em;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 0 2px;
  color: var(--gray-400);
  animation: spin 1s linear infinite;
}

.bs-field-error {
  color: var(--color-error);
  margin-top: 4px;
}

.bs-clickable {
  user-select: none;
  cursor: pointer;
}

.bs-clickable:hover {
  filter: opacity(75%);
}

.bs-clickable:active {
  filter: opacity(50%);
}

.bs-clickable.disabled {
  filter: opacity(40%);
}

.component-shadow-base {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}

[data-theme=dark] .component-shadow-base {
  box-shadow: 2px 2px 8px rgba(255, 255, 255, 0.1);
}

.font-icon, .bs-context-menu > .menu.has-submenu::after {
  font-family: var(--icon-font-family);
  font-size: 1rem;
  max-width: 1em;
}

.font-icon.filled, .bs-context-menu > .filled.menu.has-submenu::after {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}

.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}

.fade-enter,
.fade-leave-to {
  opacity: 0;
}

.text-description {
  margin-top: 2px;
  color: var(--gray-400);
  font-size: 0.923em;
}

.bs-drop-position {
  position: absolute;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--primary-400);
  opacity: 0.7;
  z-index: 100;
}

.bs-drop-position.vertical {
  left: 0;
  width: 100%;
  height: 8px;
}

.bs-drop-position.vertical.before {
  top: -4px;
}

.bs-drop-position.vertical.after {
  bottom: -4px;
}

.bs-drop-position.horizontal {
  left: 0;
  width: 8px;
  height: 100%;
}

.bs-drop-position.horizontal.before {
  left: -4px;
}

.bs-drop-position.horizontal.after {
  right: -4px;
}

.bs-droppable-horizontal {
  transition: transform 0.3s ease;
}

.bs-droppable-horizontal.bs-dropping-before, .bs-droppable-horizontal.bs-dropping-after-following {
  transform: translateX(12px);
  z-index: 1;
}

.bs-droppable-horizontal.bs-dropping-after, .bs-droppable-horizontal.bs-dropping-before-preceding {
  transform: translateX(-12px);
  z-index: 1;
}

.bs-dragging-source {
  opacity: 0.5;
}

.bs-context-menu {
  padding: 4px 0;
  min-width: 120px;
  min-height: auto;
  max-height: 500px;
  overflow: auto;
  cursor: default;
}

.bs-context-menu > .menu {
  padding: 6px 12px;
  display: flex;
  align-items: flex-start;
  white-space: nowrap;
  cursor: pointer;
}

.bs-context-menu > .menu.disabled {
  color: var(--gray-400);
}

.bs-context-menu > .menu:not(.disabled):hover {
  background-color: var(--color-hover);
}

.bs-context-menu > .menu.has-submenu::after {
  content: "chevron_right";
  position: absolute;
  right: 2px;
}

.bs-context-menu > .menu.separator {
  padding: 0;
  margin: 4px 0;
  border-bottom: 1px solid var(--border);
}

.bs-context-menu > .menu.no-padding {
  padding: 0;
}

.bs-context-menu > .menu a {
  text-decoration: none;
  color: var(--body-text);
  width: 100%;
  padding: 6px 12px;
}

.bs-popup-button {
  display: inline-block;
  position: relative;
}

.bs-popup-button .bs-context-menu {
  position: absolute;
  min-width: 100%;
}

.bs-popup-button.icon-only > button {
  border: 0 !important;
  padding: 4px 0;
}

.bs-popup-button.icon-only > button > .font-icon {
  font-size: 1.2rem;
}

.bs-popup-button.icon-only > button > .font-icon.right {
  display: none;
}

.bs-box-component-wrap, .bs-select-wrap, .bs-input-wrap, .bs-text-input {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: left;
}

.bs-box-component-wrap .message, .bs-select-wrap .message, .bs-input-wrap .message, .bs-text-input .message {
  margin-top: 4px;
  font-size: 0.9em;
}

.bs-box-component-base, .bs-select-wrap > .selected, .bs-input-base, .bs-text-input > .input-area {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: left;
  background-color: var(--body-bg);
}

.bs-input-wrap .suffix, .bs-text-input .suffix,
.bs-input-wrap .prefix,
.bs-text-input .prefix {
  font-size: 0.9em;
  margin-right: 4px;
  margin-left: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}

.bs-input-wrap .suffix:first-child, .bs-text-input .suffix:first-child,
.bs-input-wrap .prefix:first-child,
.bs-text-input .prefix:first-child {
  margin-left: 4px;
}

.bs-input-wrap .suffix .font-icon, .bs-text-input .suffix .font-icon,
.bs-input-wrap .prefix .font-icon,
.bs-text-input .prefix .font-icon {
  font-size: 0.9em;
}

.bs-input-wrap .suffix img, .bs-text-input .suffix img,
.bs-input-wrap .prefix img,
.bs-text-input .prefix img {
  width: 0.9em;
  height: 0.9em;
}

[data-theme=dark] .bs-input-wrap .suffix img, [data-theme=dark] .bs-text-input .suffix img,
[data-theme=dark] .bs-input-wrap .prefix img,
[data-theme=dark] .bs-text-input .prefix img {
  filter: invert(1);
}

.bs-input-base, .bs-text-input > .input-area {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}

.bs-input-base > input, .bs-text-input > .input-area > input {
  border: 0;
  border-radius: 0;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  flex-basis: 1em;
  padding: 0 6px;
  background-color: transparent;
  width: 100%;
  color: var(--body-text);
}

.bs-input-base > textarea, .bs-text-input > .input-area > textarea {
  border: 0;
  border-radius: 4px;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  padding: 6px;
  line-height: 1.4;
  font-family: sans-serif;
  background-color: var(--body-bg);
  color: var(--body-text);
}

.bs-input-base:hover, .bs-text-input > .input-area:hover {
  border-color: var(--border-hover);
}

.bs-input-base:has(:focus), .bs-text-input > .input-area:has(:focus) {
  border-color: var(--color-focus);
  border-width: 1px;
}

.bs-text-input.modified > .input-area,
.bs-number-input.modified > .input-area,
.bs-price-input.modified > .input-area,
.bs-date-input.modified > .input-area,
.bs-date-range.modified > .input-area,
.bs-multi-lang-text-input.modified > .input-area,
.bs-multi-lang-text-area.modified > .input-area,
.bs-multi-lang-rich-text.modified > .input-area,
.bs-text-area.modified > .input-area,
.bs-rich-text.modified > .input-area {
  border-color: var(--purple) !important;
}

.bs-text-input.error > .input-area,
.bs-number-input.error > .input-area,
.bs-price-input.error > .input-area,
.bs-date-input.error > .input-area,
.bs-date-range.error > .input-area,
.bs-multi-lang-text-input.error > .input-area,
.bs-multi-lang-text-area.error > .input-area,
.bs-multi-lang-rich-text.error > .input-area,
.bs-text-area.error > .input-area,
.bs-rich-text.error > .input-area {
  border-color: var(--danger) !important;
}

.bs-text-input.error > .input-area > input,
.bs-number-input.error > .input-area > input,
.bs-price-input.error > .input-area > input,
.bs-date-input.error > .input-area > input,
.bs-date-range.error > .input-area > input,
.bs-multi-lang-text-input.error > .input-area > input,
.bs-multi-lang-text-area.error > .input-area > input,
.bs-multi-lang-rich-text.error > .input-area > input,
.bs-text-area.error > .input-area > input,
.bs-rich-text.error > .input-area > input {
  color: var(--danger) !important;
}

.bs-text-input.disabled > .input-area,
.bs-number-input.disabled > .input-area,
.bs-price-input.disabled > .input-area,
.bs-date-input.disabled > .input-area,
.bs-date-range.disabled > .input-area,
.bs-multi-lang-text-input.disabled > .input-area,
.bs-multi-lang-text-area.disabled > .input-area,
.bs-multi-lang-rich-text.disabled > .input-area,
.bs-text-area.disabled > .input-area,
.bs-rich-text.disabled > .input-area {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}

.bs-text-input.disabled > .input-area > input,
.bs-number-input.disabled > .input-area > input,
.bs-price-input.disabled > .input-area > input,
.bs-date-input.disabled > .input-area > input,
.bs-date-range.disabled > .input-area > input,
.bs-multi-lang-text-input.disabled > .input-area > input,
.bs-multi-lang-text-area.disabled > .input-area > input,
.bs-multi-lang-rich-text.disabled > .input-area > input,
.bs-text-area.disabled > .input-area > input,
.bs-rich-text.disabled > .input-area > input {
  color: var(--gray-400) !important;
  background-color: var(--gray-100) !important;
}

.bs-text-input.disabled > .input-area > textarea,
.bs-number-input.disabled > .input-area > textarea,
.bs-price-input.disabled > .input-area > textarea,
.bs-date-input.disabled > .input-area > textarea,
.bs-date-range.disabled > .input-area > textarea,
.bs-multi-lang-text-input.disabled > .input-area > textarea,
.bs-multi-lang-text-area.disabled > .input-area > textarea,
.bs-multi-lang-rich-text.disabled > .input-area > textarea,
.bs-text-area.disabled > .input-area > textarea,
.bs-rich-text.disabled > .input-area > textarea {
  background-color: var(--gray-100) !important;
}

.bs-date-input .view-mode,
.bs-date-range .view-mode {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}

.bs-date-input .view-mode::before,
.bs-date-range .view-mode::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-date-input .extra-dates,
.bs-date-range .extra-dates,
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  color: var(--body-text);
  margin-top: 4px;
}

.bs-date-input .extra-dates .extra-date,
.bs-date-range .extra-dates .extra-date,
.bs-calendar .extra-dates .extra-date,
.bs-calendar-range .extra-dates .extra-date {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8125rem;
}

.bs-date-input .extra-dates .extra-date::before,
.bs-date-range .extra-dates .extra-date::before,
.bs-calendar .extra-dates .extra-date::before,
.bs-calendar-range .extra-dates .extra-date::before {
  content: "globe";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}

.bs-checkbox-base {
  display: inline-block;
  color: var(--body-text);
  white-space: nowrap;
}

.bs-checkbox-base input {
  appearance: none;
  margin: 0;
  outline: 0;
}

.bs-checkbox-base input::before {
  font-family: var(--icon-font-family);
  font-size: 20px;
  vertical-align: middle;
  cursor: pointer;
  color: var(--body-text);
}

.bs-checkbox-base input:hover {
  color: var(--gray-500);
}

.bs-checkbox-base input:hover ~ label {
  color: var(--gray-500);
}

.bs-checkbox-base input:focus::before {
  color: var(--color-focus);
}

.bs-checkbox-base input:focus ~ label {
  color: var(--color-focus);
}

.bs-checkbox-base.modified input::before {
  color: var(--purple) !important;
}

.bs-checkbox-base.modified input ~ label {
  color: var(--purple) !important;
}

.bs-checkbox-base.error input::before {
  color: var(--danger) !important;
}

.bs-checkbox-base.error input ~ label {
  color: var(--danger) !important;
}

.bs-checkbox-base.disabled input::before {
  color: var(--gray-400) !important;
}

.bs-checkbox-base.disabled input ~ label {
  color: var(--gray-400) !important;
}

.bs-checkbox-base label {
  display: inline-block;
  vertical-align: middle;
  padding: 4px 2px;
  cursor: pointer;
}

.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input::before {
  color: var(--purple) !important;
}

.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input ~ label {
  color: var(--purple) !important;
}

.bs-checkbox-group.error .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input::before {
  color: var(--danger) !important;
}

.bs-checkbox-group.error .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input ~ label {
  color: var(--danger) !important;
}

.bs-checkbox-group.disabled input::before,
.bs-radio-button-group.disabled input::before {
  color: var(--gray-400) !important;
}

.bs-checkbox-group.disabled input ~ label,
.bs-radio-button-group.disabled input ~ label {
  color: var(--gray-400) !important;
}

.bs-select-wrap {
  position: relative;
  outline: 0;
  background-color: var(--body-bg);
  color: var(--body-text);
  min-width: 64px;
}

.bs-select-wrap:hover > .selected {
  border-color: var(--border-hover);
}

.bs-select-wrap:focus > .selected {
  border-color: var(--color-focus);
}

.bs-select-wrap > .selected {
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 0 6px;
  min-width: 100%;
  cursor: pointer;
  display: flex;
}

.bs-select-wrap > .selected .label {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.bs-select-wrap > .selected .placeholder {
  color: var(--gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
}

.bs-select-wrap > .selected .dropdown-btn {
  font-family: var(--icon-font-family);
  margin-right: -4px;
  margin-left: 4px;
  user-select: none;
  transition: transform 0.2s linear;
}

.bs-select-wrap.popup-open .dropdown-btn {
  transform: rotate(180deg);
}

.bs-select-wrap.modified > .selected {
  border-color: var(--purple) !important;
}

.bs-select-wrap.error > .selected {
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}

.bs-select-wrap.disabled > .selected {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-500) !important;
}

.bs-select-wrap.view-mode {
  background-color: transparent;
}

.bs-select-wrap .small-progress {
  font-family: var(--icon-font-family);
  font-size: 0.9em;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 0 2px;
  color: var(--gray-400);
  animation: spin 1s linear infinite;
}

.bs-field-error {
  color: var(--color-error);
  margin-top: 4px;
}

.bs-clickable {
  user-select: none;
  cursor: pointer;
}

.bs-clickable:hover {
  filter: opacity(75%);
}

.bs-clickable:active {
  filter: opacity(50%);
}

.bs-clickable.disabled {
  filter: opacity(40%);
}

.component-shadow-base {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}

[data-theme=dark] .component-shadow-base {
  box-shadow: 2px 2px 8px rgba(255, 255, 255, 0.1);
}

.font-icon {
  font-family: var(--icon-font-family);
  font-size: 1rem;
  max-width: 1em;
}

.font-icon.filled {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}

.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}

.fade-enter,
.fade-leave-to {
  opacity: 0;
}

.text-description {
  margin-top: 2px;
  color: var(--gray-400);
  font-size: 0.923em;
}

.bs-drop-position {
  position: absolute;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--primary-400);
  opacity: 0.7;
  z-index: 100;
}

.bs-drop-position.vertical {
  left: 0;
  width: 100%;
  height: 8px;
}

.bs-drop-position.vertical.before {
  top: -4px;
}

.bs-drop-position.vertical.after {
  bottom: -4px;
}

.bs-drop-position.horizontal {
  left: 0;
  width: 8px;
  height: 100%;
}

.bs-drop-position.horizontal.before {
  left: -4px;
}

.bs-drop-position.horizontal.after {
  right: -4px;
}

.bs-droppable-horizontal {
  transition: transform 0.3s ease;
}

.bs-droppable-horizontal.bs-dropping-before, .bs-droppable-horizontal.bs-dropping-after-following {
  transform: translateX(12px);
  z-index: 1;
}

.bs-droppable-horizontal.bs-dropping-after, .bs-droppable-horizontal.bs-dropping-before-preceding {
  transform: translateX(-12px);
  z-index: 1;
}

.bs-dragging-source {
  opacity: 0.5;
}

.bs-text-input > .input-area {
  width: 100%;
}

.bs-text-input.value-right input {
  text-align: right;
}

.bs-text-input.value-center input {
  text-align: center;
}

.bs-link a[data-v-29df56e5] {
  color: var(--body-text);
} /* Layout Utility */
.flex-row, .bs-layout-horizontal, .bs-layout-horizontal-wrap {
  display: flex;
  flex-direction: row;
}

.flex-row-inline, .bs-layout-horizontal-inline {
  display: inline-flex;
  flex-direction: row;
}

.flex-column, .bs-layout-vertical, .bs-progressbar .inner-progressbar, .bs-layout-vertical-wrap {
  display: flex;
  flex-direction: column;
}

.flex-column-inline, .bs-layout-vertical-inline {
  display: inline-flex;
  flex-direction: column;
}

.flex-wrap, .bs-layout-vertical-wrap, .bs-layout-horizontal-wrap {
  flex-wrap: wrap;
}

.flex-grow-0 {
  flex-grow: 0;
}

.flex-shrink-0 {
  flex-shrink: 0;
}

.flex-grow-1 {
  flex-grow: 1;
}

.flex-shrink-1 {
  flex-shrink: 1;
}

.flex-grow-2 {
  flex-grow: 2;
}

.flex-shrink-2 {
  flex-shrink: 2;
}

.flex-grow-3 {
  flex-grow: 3;
}

.flex-shrink-3 {
  flex-shrink: 3;
}

.flex-grow-4 {
  flex-grow: 4;
}

.flex-shrink-4 {
  flex-shrink: 4;
}

.flex-grow-5 {
  flex-grow: 5;
}

.flex-shrink-5 {
  flex-shrink: 5;
}

.flex-grow-6 {
  flex-grow: 6;
}

.flex-shrink-6 {
  flex-shrink: 6;
}

.flex-grow-7 {
  flex-grow: 7;
}

.flex-shrink-7 {
  flex-shrink: 7;
}

.flex-grow-8 {
  flex-grow: 8;
}

.flex-shrink-8 {
  flex-shrink: 8;
}

.gap-0 {
  gap: 0px;
}

.gap-1 {
  gap: 1px;
}

.gap-2 {
  gap: 2px;
}

.gap-3 {
  gap: 3px;
}

.gap-4 {
  gap: 4px;
}

.gap-5 {
  gap: 5px;
}

.gap-6 {
  gap: 6px;
}

.gap-7 {
  gap: 7px;
}

.gap-8 {
  gap: 8px;
}

.gap-9 {
  gap: 9px;
}

.gap-10 {
  gap: 10px;
}

.gap-11 {
  gap: 11px;
}

.gap-12 {
  gap: 12px;
}

.gap-13 {
  gap: 13px;
}

.gap-14 {
  gap: 14px;
}

.gap-15 {
  gap: 15px;
}

.gap-16 {
  gap: 16px;
}

.gap-17 {
  gap: 17px;
}

.gap-18 {
  gap: 18px;
}

.gap-19 {
  gap: 19px;
}

.gap-20 {
  gap: 20px;
}

.gap-21 {
  gap: 21px;
}

.gap-22 {
  gap: 22px;
}

.gap-23 {
  gap: 23px;
}

.gap-24 {
  gap: 24px;
}

.gap-25 {
  gap: 25px;
}

.gap-26 {
  gap: 26px;
}

.gap-27 {
  gap: 27px;
}

.gap-28 {
  gap: 28px;
}

.gap-29 {
  gap: 29px;
}

.gap-30 {
  gap: 30px;
}

.gap-31 {
  gap: 31px;
}

.gap-32 {
  gap: 32px;
}

.gap-33 {
  gap: 33px;
}

.gap-34 {
  gap: 34px;
}

.gap-35 {
  gap: 35px;
}

.gap-36 {
  gap: 36px;
}

.gap-37 {
  gap: 37px;
}

.gap-38 {
  gap: 38px;
}

.gap-39 {
  gap: 39px;
}

.gap-40 {
  gap: 40px;
}

.gap-41 {
  gap: 41px;
}

.gap-42 {
  gap: 42px;
}

.gap-43 {
  gap: 43px;
}

.gap-44 {
  gap: 44px;
}

.gap-45 {
  gap: 45px;
}

.gap-46 {
  gap: 46px;
}

.gap-47 {
  gap: 47px;
}

.gap-48 {
  gap: 48px;
}

.gap-49 {
  gap: 49px;
}

.gap-50 {
  gap: 50px;
}

.gap-51 {
  gap: 51px;
}

.gap-52 {
  gap: 52px;
}

.gap-53 {
  gap: 53px;
}

.gap-54 {
  gap: 54px;
}

.gap-55 {
  gap: 55px;
}

.gap-56 {
  gap: 56px;
}

.gap-57 {
  gap: 57px;
}

.gap-58 {
  gap: 58px;
}

.gap-59 {
  gap: 59px;
}

.gap-60 {
  gap: 60px;
}

.gap-61 {
  gap: 61px;
}

.gap-62 {
  gap: 62px;
}

.gap-63 {
  gap: 63px;
}

.gap-64 {
  gap: 64px;
}

.flex-align-start {
  align-items: flex-start;
}

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

.flex-align-end {
  align-items: flex-end;
}

.flex-content-start {
  justify-content: flex-start;
}

.flex-content-center {
  justify-content: center;
}

.flex-content-end {
  justify-content: flex-end;
}

/* Bluesea Layout */
.bs-layout-form {
  border-bottom: 1px solid var(--border);
}

.bs-layout-form > div {
  display: flex;
  align-items: center;
}

.bs-layout-form > div > .title {
  padding: 8px 16px;
  width: 12.3076em;
  line-height: 1.2em;
  color: var(--body-text);
}

.bs-layout-form > div > :not(.title) {
  padding: 8px;
  width: 10em;
  flex-grow: 1;
  color: var(--body-text);
}

.bs-layout-form > div:nth-child(odd) {
  background-color: var(--gray-100);
}

.bs-layout-form.title-w-8 > div > .title {
  width: 8em;
}

.bs-layout-form.title-w-10 > div > .title {
  width: 10em;
}

.bs-layout-form.title-w-14 > div > .title {
  width: 14em;
}

.bs-layout-form.title-w-16 > div > .title {
  width: 16em;
}

.bs-layout-form.title-w-18 > div > .title {
  width: 18em;
}

.bs-layout-form.title-w-20 > div > .title {
  width: 20em;
}

.bs-layout-card > .card-title {
  padding: 16px 0;
  border-bottom: 0.8px solid var(--border-light);
  font-size: 1.2em;
  font-weight: 500;
}

.bs-layout-table {
  border-collapse: collapse;
}

.bs-layout-table > tr > td, .bs-layout-table > tr > th, .bs-layout-table > tbody > tr > td, .bs-layout-table > tbody > tr > th {
  padding: 8px;
  border: 1px solid var(--border);
  vertical-align: middle;
  text-align: left;
}

.bs-layout-table > tr > td:first-child, .bs-layout-table > tr > th:first-child, .bs-layout-table > tbody > tr > td:first-child, .bs-layout-table > tbody > tr > th:first-child {
  border-left: 0;
}

.bs-layout-table > tr > td:last-child, .bs-layout-table > tr > th:last-child, .bs-layout-table > tbody > tr > td:last-child, .bs-layout-table > tbody > tr > th:last-child {
  border-right: 0;
}

.bs-progressbar {
  height: 28px;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: var(--border-radius) !important;
  line-height: 24px;
  position: relative;
  background-color: var(--body-bg);
}

.bs-progressbar .inner-progressbar {
  background-color: var(--primary);
  height: 100%;
  line-height: 24px;
  position: relative;
  transition: width 500ms;
}

.bs-progressbar .show-percent {
  position: absolute;
  padding: 0 4px;
  height: 100%;
  transition: left 0.3s, right 0.3s;
}

.bs-progressbar .indeterminate {
  position: relative;
  width: 100%;
  height: 100%;
  line-height: 24px;
  background-color: var(--body-bg);
}

.bs-progressbar .indeterminate .in-box {
  background-color: var(--primary);
  position: absolute;
  width: 20%;
  height: 100%;
  border-radius: var(--border-radius) !important;
  animation: moveBar 3s ease-in-out infinite;
}

@keyframes moveBar {
  from {
    left: -20%;
  }
  to {
    left: 100%;
  }
}
.bs-console[data-v-f33a4477] {
  height: 100px;
  padding: 4px 6px;
  border: 1px solid var(--border);
  overflow: auto;
  background-color: var(--body-bg);
  white-space: pre;
}

.bs-console > span[data-v-f33a4477] {
  display: block;
  line-height: 1.6em;
}

.bs-loading-icon {
  display: flex;
  align-items: center;
  justify-content: center;
}

.bs-loading-icon > .font-icon {
  animation: spin 1s linear infinite;
}

.bs-date {
  display: inline-flex;
  gap: 4px;
}

.bs-date::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-box-component-wrap, .bs-select-wrap, .bs-input-wrap {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: left;
}

.bs-box-component-wrap .message, .bs-select-wrap .message, .bs-input-wrap .message {
  margin-top: 4px;
  font-size: 0.9em;
}

.bs-box-component-base, .bs-select-wrap > .selected, .bs-input-base {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: left;
  background-color: var(--body-bg);
}

.bs-input-wrap .suffix,
.bs-input-wrap .prefix {
  font-size: 0.9em;
  margin-right: 4px;
  margin-left: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}

.bs-input-wrap .suffix:first-child,
.bs-input-wrap .prefix:first-child {
  margin-left: 4px;
}

.bs-input-wrap .suffix .font-icon,
.bs-input-wrap .prefix .font-icon {
  font-size: 0.9em;
}

.bs-input-wrap .suffix img,
.bs-input-wrap .prefix img {
  width: 0.9em;
  height: 0.9em;
}

[data-theme=dark] .bs-input-wrap .suffix img,
[data-theme=dark] .bs-input-wrap .prefix img {
  filter: invert(1);
}

.bs-input-base {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}

.bs-input-base > input {
  border: 0;
  border-radius: 0;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  flex-basis: 1em;
  padding: 0 6px;
  background-color: transparent;
  width: 100%;
  color: var(--body-text);
}

.bs-input-base > textarea {
  border: 0;
  border-radius: 4px;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  padding: 6px;
  line-height: 1.4;
  font-family: sans-serif;
  background-color: var(--body-bg);
  color: var(--body-text);
}

.bs-input-base:hover {
  border-color: var(--border-hover);
}

.bs-input-base:has(:focus) {
  border-color: var(--color-focus);
  border-width: 1px;
}

.bs-text-input.modified > .input-area,
.bs-number-input.modified > .input-area,
.bs-price-input.modified > .input-area,
.bs-date-input.modified > .input-area,
.bs-date-range.modified > .input-area,
.bs-multi-lang-text-input.modified > .input-area,
.bs-multi-lang-text-area.modified > .input-area,
.bs-multi-lang-rich-text.modified > .input-area,
.bs-text-area.modified > .input-area,
.bs-rich-text.modified > .input-area {
  border-color: var(--purple) !important;
}

.bs-text-input.error > .input-area,
.bs-number-input.error > .input-area,
.bs-price-input.error > .input-area,
.bs-date-input.error > .input-area,
.bs-date-range.error > .input-area,
.bs-multi-lang-text-input.error > .input-area,
.bs-multi-lang-text-area.error > .input-area,
.bs-multi-lang-rich-text.error > .input-area,
.bs-text-area.error > .input-area,
.bs-rich-text.error > .input-area {
  border-color: var(--danger) !important;
}

.bs-text-input.error > .input-area > input,
.bs-number-input.error > .input-area > input,
.bs-price-input.error > .input-area > input,
.bs-date-input.error > .input-area > input,
.bs-date-range.error > .input-area > input,
.bs-multi-lang-text-input.error > .input-area > input,
.bs-multi-lang-text-area.error > .input-area > input,
.bs-multi-lang-rich-text.error > .input-area > input,
.bs-text-area.error > .input-area > input,
.bs-rich-text.error > .input-area > input {
  color: var(--danger) !important;
}

.bs-text-input.disabled > .input-area,
.bs-number-input.disabled > .input-area,
.bs-price-input.disabled > .input-area,
.bs-date-input.disabled > .input-area,
.bs-date-range.disabled > .input-area,
.bs-multi-lang-text-input.disabled > .input-area,
.bs-multi-lang-text-area.disabled > .input-area,
.bs-multi-lang-rich-text.disabled > .input-area,
.bs-text-area.disabled > .input-area,
.bs-rich-text.disabled > .input-area {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}

.bs-text-input.disabled > .input-area > input,
.bs-number-input.disabled > .input-area > input,
.bs-price-input.disabled > .input-area > input,
.bs-date-input.disabled > .input-area > input,
.bs-date-range.disabled > .input-area > input,
.bs-multi-lang-text-input.disabled > .input-area > input,
.bs-multi-lang-text-area.disabled > .input-area > input,
.bs-multi-lang-rich-text.disabled > .input-area > input,
.bs-text-area.disabled > .input-area > input,
.bs-rich-text.disabled > .input-area > input {
  color: var(--gray-400) !important;
  background-color: var(--gray-100) !important;
}

.bs-text-input.disabled > .input-area > textarea,
.bs-number-input.disabled > .input-area > textarea,
.bs-price-input.disabled > .input-area > textarea,
.bs-date-input.disabled > .input-area > textarea,
.bs-date-range.disabled > .input-area > textarea,
.bs-multi-lang-text-input.disabled > .input-area > textarea,
.bs-multi-lang-text-area.disabled > .input-area > textarea,
.bs-multi-lang-rich-text.disabled > .input-area > textarea,
.bs-text-area.disabled > .input-area > textarea,
.bs-rich-text.disabled > .input-area > textarea {
  background-color: var(--gray-100) !important;
}

.bs-date-input .view-mode,
.bs-date-range .view-mode {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}

.bs-date-input .view-mode::before,
.bs-date-range .view-mode::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-date-input .extra-dates,
.bs-date-range .extra-dates,
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  color: var(--body-text);
  margin-top: 4px;
}

.bs-date-input .extra-dates .extra-date,
.bs-date-range .extra-dates .extra-date,
.bs-calendar .extra-dates .extra-date,
.bs-calendar-range .extra-dates .extra-date {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8125rem;
}

.bs-date-input .extra-dates .extra-date::before,
.bs-date-range .extra-dates .extra-date::before,
.bs-calendar .extra-dates .extra-date::before,
.bs-calendar-range .extra-dates .extra-date::before {
  content: "globe";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}

.bs-checkbox-base {
  display: inline-block;
  color: var(--body-text);
  white-space: nowrap;
}

.bs-checkbox-base input {
  appearance: none;
  margin: 0;
  outline: 0;
}

.bs-checkbox-base input::before {
  font-family: var(--icon-font-family);
  font-size: 20px;
  vertical-align: middle;
  cursor: pointer;
  color: var(--body-text);
}

.bs-checkbox-base input:hover {
  color: var(--gray-500);
}

.bs-checkbox-base input:hover ~ label {
  color: var(--gray-500);
}

.bs-checkbox-base input:focus::before {
  color: var(--color-focus);
}

.bs-checkbox-base input:focus ~ label {
  color: var(--color-focus);
}

.bs-checkbox-base.modified input::before {
  color: var(--purple) !important;
}

.bs-checkbox-base.modified input ~ label {
  color: var(--purple) !important;
}

.bs-checkbox-base.error input::before {
  color: var(--danger) !important;
}

.bs-checkbox-base.error input ~ label {
  color: var(--danger) !important;
}

.bs-checkbox-base.disabled input::before {
  color: var(--gray-400) !important;
}

.bs-checkbox-base.disabled input ~ label {
  color: var(--gray-400) !important;
}

.bs-checkbox-base label {
  display: inline-block;
  vertical-align: middle;
  padding: 4px 2px;
  cursor: pointer;
}

.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input::before {
  color: var(--purple) !important;
}

.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input ~ label {
  color: var(--purple) !important;
}

.bs-checkbox-group.error .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input::before {
  color: var(--danger) !important;
}

.bs-checkbox-group.error .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input ~ label {
  color: var(--danger) !important;
}

.bs-checkbox-group.disabled input::before,
.bs-radio-button-group.disabled input::before {
  color: var(--gray-400) !important;
}

.bs-checkbox-group.disabled input ~ label,
.bs-radio-button-group.disabled input ~ label {
  color: var(--gray-400) !important;
}

.bs-select-wrap {
  position: relative;
  outline: 0;
  background-color: var(--body-bg);
  color: var(--body-text);
  min-width: 64px;
}

.bs-select-wrap:hover > .selected {
  border-color: var(--border-hover);
}

.bs-select-wrap:focus > .selected {
  border-color: var(--color-focus);
}

.bs-select-wrap > .selected {
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 0 6px;
  min-width: 100%;
  cursor: pointer;
  display: flex;
}

.bs-select-wrap > .selected .label {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.bs-select-wrap > .selected .placeholder {
  color: var(--gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
}

.bs-select-wrap > .selected .dropdown-btn {
  font-family: var(--icon-font-family);
  margin-right: -4px;
  margin-left: 4px;
  user-select: none;
  transition: transform 0.2s linear;
}

.bs-select-wrap.popup-open .dropdown-btn {
  transform: rotate(180deg);
}

.bs-select-wrap.modified > .selected {
  border-color: var(--purple) !important;
}

.bs-select-wrap.error > .selected {
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}

.bs-select-wrap.disabled > .selected {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-500) !important;
}

.bs-select-wrap.view-mode {
  background-color: transparent;
}

.bs-select-wrap .small-progress {
  font-family: var(--icon-font-family);
  font-size: 0.9em;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 0 2px;
  color: var(--gray-400);
  animation: spin 1s linear infinite;
}

.bs-field-error {
  color: var(--color-error);
  margin-top: 4px;
}

.bs-clickable, .page-navigation > span {
  user-select: none;
  cursor: pointer;
}

.bs-clickable:hover, .page-navigation > span:hover {
  filter: opacity(75%);
}

.bs-clickable:active, .page-navigation > span:active {
  filter: opacity(50%);
}

.bs-clickable.disabled, .page-navigation > span.disabled {
  filter: opacity(40%);
}

.component-shadow-base {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}

[data-theme=dark] .component-shadow-base {
  box-shadow: 2px 2px 8px rgba(255, 255, 255, 0.1);
}

.font-icon {
  font-family: var(--icon-font-family);
  font-size: 1rem;
  max-width: 1em;
}

.font-icon.filled {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}

.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}

.fade-enter,
.fade-leave-to {
  opacity: 0;
}

.text-description {
  margin-top: 2px;
  color: var(--gray-400);
  font-size: 0.923em;
}

.bs-drop-position {
  position: absolute;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--primary-400);
  opacity: 0.7;
  z-index: 100;
}

.bs-drop-position.vertical {
  left: 0;
  width: 100%;
  height: 8px;
}

.bs-drop-position.vertical.before {
  top: -4px;
}

.bs-drop-position.vertical.after {
  bottom: -4px;
}

.bs-drop-position.horizontal {
  left: 0;
  width: 8px;
  height: 100%;
}

.bs-drop-position.horizontal.before {
  left: -4px;
}

.bs-drop-position.horizontal.after {
  right: -4px;
}

.bs-droppable-horizontal {
  transition: transform 0.3s ease;
}

.bs-droppable-horizontal.bs-dropping-before, .bs-droppable-horizontal.bs-dropping-after-following {
  transform: translateX(12px);
  z-index: 1;
}

.bs-droppable-horizontal.bs-dropping-after, .bs-droppable-horizontal.bs-dropping-before-preceding {
  transform: translateX(-12px);
  z-index: 1;
}

.bs-dragging-source {
  opacity: 0.5;
}

.page-navigation {
  padding: 8px;
  display: flex;
  gap: 2px;
  align-items: center;
  justify-content: center;
  color: var(--body-text);
  line-height: 1;
}

.page-navigation > span {
  display: inline-flex;
  padding: 4px 6px;
  align-items: center;
  justify-content: center;
}

.page-navigation > span.on {
  background-color: var(--primary-300);
  border-radius: 2px;
}

.page-navigation > span:not(.page) {
  padding: 3px;
  font-size: 1.4em;
}

.page-navigation > span.disabled {
  color: var(--gray-400);
  cursor: initial;
}

.page-navigation > span:not(.disabled):hover {
  border-radius: 2px;
}

.bs-calendar .year-month {
  padding: 8px 8px 8px 0;
}

.bs-calendar table {
  font-size: 0.75rem;
}

.bs-calendar table tr th, .bs-calendar table tr td {
  height: 34px;
  text-align: center;
  vertical-align: middle;
  padding-top: 4px;
}

.bs-calendar table tr th {
  font-weight: 500;
}

.bs-calendar table tr td {
  cursor: pointer;
  user-select: none;
}

.bs-calendar table tr td > div {
  min-width: 34px;
  height: 34px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.bs-calendar table tr td.today > div {
  background-color: var(--gray-200);
  border-radius: 50%;
}

.bs-calendar table tr td.other-month > div {
  opacity: 0.5;
}

.bs-calendar table tr td.dow-0 > div {
  color: var(--red);
}

.bs-calendar table tr td.dow-6 > div {
  color: var(--blue);
}

.bs-calendar table tr td.selected > div {
  background-color: var(--blue);
  color: var(--white);
  border-radius: 50%;
}

.bs-calendar table tr td.range-selected > div {
  background-color: var(--blue);
  color: var(--white);
  border-radius: 0;
}

.bs-calendar table tr td:first-child.range-selected > div, .bs-calendar table tr td.range-selected-start > div {
  border-radius: 50% 0 0 50%;
}

.bs-calendar table tr td:last-child.range-selected > div, .bs-calendar table tr td.range-selected-end > div {
  border-radius: 0 50% 50% 0;
}

.bs-calendar table tr td.range-selected-start.range-selected-end > div, .bs-calendar table tr td:first-child.range-selected-end > div, .bs-calendar table tr td:last-child.range-selected-start > div {
  border-radius: 50%;
}

.bs-calendar table tr.weekdays {
  border-bottom: 1px solid var(--gray-200);
}

.bs-calendar table.disabled {
  background-color: var(--gray-200);
  border-radius: 4px;
  opacity: 0.7;
}

.bs-calendar table.disabled tr > td {
  cursor: default;
}

.bs-calendar .select-wrap {
  background-color: var(--gray-100);
}

.bs-calendar-range .tilde {
  font-size: 1.2rem;
  padding: 8px;
}

.bs-box-component-wrap, .bs-select-wrap, .bs-input-wrap, .bs-number-input {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: left;
}

.bs-box-component-wrap .message, .bs-select-wrap .message, .bs-input-wrap .message, .bs-number-input .message {
  margin-top: 4px;
  font-size: 0.9em;
}

.bs-box-component-base, .bs-select-wrap > .selected, .bs-input-base, .bs-number-input .input-area {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: left;
  background-color: var(--body-bg);
}

.bs-input-wrap .suffix, .bs-number-input .suffix,
.bs-input-wrap .prefix,
.bs-number-input .prefix {
  font-size: 0.9em;
  margin-right: 4px;
  margin-left: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}

.bs-input-wrap .suffix:first-child, .bs-number-input .suffix:first-child,
.bs-input-wrap .prefix:first-child,
.bs-number-input .prefix:first-child {
  margin-left: 4px;
}

.bs-input-wrap .suffix .font-icon, .bs-number-input .suffix .font-icon,
.bs-input-wrap .prefix .font-icon,
.bs-number-input .prefix .font-icon {
  font-size: 0.9em;
}

.bs-input-wrap .suffix img, .bs-number-input .suffix img,
.bs-input-wrap .prefix img,
.bs-number-input .prefix img {
  width: 0.9em;
  height: 0.9em;
}

[data-theme=dark] .bs-input-wrap .suffix img, [data-theme=dark] .bs-number-input .suffix img,
[data-theme=dark] .bs-input-wrap .prefix img,
[data-theme=dark] .bs-number-input .prefix img {
  filter: invert(1);
}

.bs-input-base, .bs-number-input .input-area {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}

.bs-input-base > input, .bs-number-input .input-area > input {
  border: 0;
  border-radius: 0;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  flex-basis: 1em;
  padding: 0 6px;
  background-color: transparent;
  width: 100%;
  color: var(--body-text);
}

.bs-input-base > textarea, .bs-number-input .input-area > textarea {
  border: 0;
  border-radius: 4px;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  padding: 6px;
  line-height: 1.4;
  font-family: sans-serif;
  background-color: var(--body-bg);
  color: var(--body-text);
}

.bs-input-base:hover, .bs-number-input .input-area:hover {
  border-color: var(--border-hover);
}

.bs-input-base:has(:focus), .bs-number-input .input-area:has(:focus) {
  border-color: var(--color-focus);
  border-width: 1px;
}

.bs-text-input.modified > .input-area,
.bs-number-input.modified > .input-area,
.bs-price-input.modified > .input-area,
.bs-date-input.modified > .input-area,
.bs-date-range.modified > .input-area,
.bs-multi-lang-text-input.modified > .input-area,
.bs-multi-lang-text-area.modified > .input-area,
.bs-multi-lang-rich-text.modified > .input-area,
.bs-text-area.modified > .input-area,
.bs-rich-text.modified > .input-area {
  border-color: var(--purple) !important;
}

.bs-text-input.error > .input-area,
.bs-number-input.error > .input-area,
.bs-price-input.error > .input-area,
.bs-date-input.error > .input-area,
.bs-date-range.error > .input-area,
.bs-multi-lang-text-input.error > .input-area,
.bs-multi-lang-text-area.error > .input-area,
.bs-multi-lang-rich-text.error > .input-area,
.bs-text-area.error > .input-area,
.bs-rich-text.error > .input-area {
  border-color: var(--danger) !important;
}

.bs-text-input.error > .input-area > input,
.bs-number-input.error > .input-area > input,
.bs-price-input.error > .input-area > input,
.bs-date-input.error > .input-area > input,
.bs-date-range.error > .input-area > input,
.bs-multi-lang-text-input.error > .input-area > input,
.bs-multi-lang-text-area.error > .input-area > input,
.bs-multi-lang-rich-text.error > .input-area > input,
.bs-text-area.error > .input-area > input,
.bs-rich-text.error > .input-area > input {
  color: var(--danger) !important;
}

.bs-text-input.disabled > .input-area,
.bs-number-input.disabled > .input-area,
.bs-price-input.disabled > .input-area,
.bs-date-input.disabled > .input-area,
.bs-date-range.disabled > .input-area,
.bs-multi-lang-text-input.disabled > .input-area,
.bs-multi-lang-text-area.disabled > .input-area,
.bs-multi-lang-rich-text.disabled > .input-area,
.bs-text-area.disabled > .input-area,
.bs-rich-text.disabled > .input-area {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}

.bs-text-input.disabled > .input-area > input,
.bs-number-input.disabled > .input-area > input,
.bs-price-input.disabled > .input-area > input,
.bs-date-input.disabled > .input-area > input,
.bs-date-range.disabled > .input-area > input,
.bs-multi-lang-text-input.disabled > .input-area > input,
.bs-multi-lang-text-area.disabled > .input-area > input,
.bs-multi-lang-rich-text.disabled > .input-area > input,
.bs-text-area.disabled > .input-area > input,
.bs-rich-text.disabled > .input-area > input {
  color: var(--gray-400) !important;
  background-color: var(--gray-100) !important;
}

.bs-text-input.disabled > .input-area > textarea,
.bs-number-input.disabled > .input-area > textarea,
.bs-price-input.disabled > .input-area > textarea,
.bs-date-input.disabled > .input-area > textarea,
.bs-date-range.disabled > .input-area > textarea,
.bs-multi-lang-text-input.disabled > .input-area > textarea,
.bs-multi-lang-text-area.disabled > .input-area > textarea,
.bs-multi-lang-rich-text.disabled > .input-area > textarea,
.bs-text-area.disabled > .input-area > textarea,
.bs-rich-text.disabled > .input-area > textarea {
  background-color: var(--gray-100) !important;
}

.bs-date-input .view-mode,
.bs-date-range .view-mode {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}

.bs-date-input .view-mode::before,
.bs-date-range .view-mode::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-date-input .extra-dates,
.bs-date-range .extra-dates,
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  color: var(--body-text);
  margin-top: 4px;
}

.bs-date-input .extra-dates .extra-date,
.bs-date-range .extra-dates .extra-date,
.bs-calendar .extra-dates .extra-date,
.bs-calendar-range .extra-dates .extra-date {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8125rem;
}

.bs-date-input .extra-dates .extra-date::before,
.bs-date-range .extra-dates .extra-date::before,
.bs-calendar .extra-dates .extra-date::before,
.bs-calendar-range .extra-dates .extra-date::before {
  content: "globe";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}

.bs-checkbox-base {
  display: inline-block;
  color: var(--body-text);
  white-space: nowrap;
}

.bs-checkbox-base input {
  appearance: none;
  margin: 0;
  outline: 0;
}

.bs-checkbox-base input::before {
  font-family: var(--icon-font-family);
  font-size: 20px;
  vertical-align: middle;
  cursor: pointer;
  color: var(--body-text);
}

.bs-checkbox-base input:hover {
  color: var(--gray-500);
}

.bs-checkbox-base input:hover ~ label {
  color: var(--gray-500);
}

.bs-checkbox-base input:focus::before {
  color: var(--color-focus);
}

.bs-checkbox-base input:focus ~ label {
  color: var(--color-focus);
}

.bs-checkbox-base.modified input::before {
  color: var(--purple) !important;
}

.bs-checkbox-base.modified input ~ label {
  color: var(--purple) !important;
}

.bs-checkbox-base.error input::before {
  color: var(--danger) !important;
}

.bs-checkbox-base.error input ~ label {
  color: var(--danger) !important;
}

.bs-checkbox-base.disabled input::before {
  color: var(--gray-400) !important;
}

.bs-checkbox-base.disabled input ~ label {
  color: var(--gray-400) !important;
}

.bs-checkbox-base label {
  display: inline-block;
  vertical-align: middle;
  padding: 4px 2px;
  cursor: pointer;
}

.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input::before {
  color: var(--purple) !important;
}

.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input ~ label {
  color: var(--purple) !important;
}

.bs-checkbox-group.error .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input::before {
  color: var(--danger) !important;
}

.bs-checkbox-group.error .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input ~ label {
  color: var(--danger) !important;
}

.bs-checkbox-group.disabled input::before,
.bs-radio-button-group.disabled input::before {
  color: var(--gray-400) !important;
}

.bs-checkbox-group.disabled input ~ label,
.bs-radio-button-group.disabled input ~ label {
  color: var(--gray-400) !important;
}

.bs-select-wrap {
  position: relative;
  outline: 0;
  background-color: var(--body-bg);
  color: var(--body-text);
  min-width: 64px;
}

.bs-select-wrap:hover > .selected {
  border-color: var(--border-hover);
}

.bs-select-wrap:focus > .selected {
  border-color: var(--color-focus);
}

.bs-select-wrap > .selected {
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 0 6px;
  min-width: 100%;
  cursor: pointer;
  display: flex;
}

.bs-select-wrap > .selected .label {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.bs-select-wrap > .selected .placeholder {
  color: var(--gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
}

.bs-select-wrap > .selected .dropdown-btn {
  font-family: var(--icon-font-family);
  margin-right: -4px;
  margin-left: 4px;
  user-select: none;
  transition: transform 0.2s linear;
}

.bs-select-wrap.popup-open .dropdown-btn {
  transform: rotate(180deg);
}

.bs-select-wrap.modified > .selected {
  border-color: var(--purple) !important;
}

.bs-select-wrap.error > .selected {
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}

.bs-select-wrap.disabled > .selected {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-500) !important;
}

.bs-select-wrap.view-mode {
  background-color: transparent;
}

.bs-select-wrap .small-progress {
  font-family: var(--icon-font-family);
  font-size: 0.9em;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 0 2px;
  color: var(--gray-400);
  animation: spin 1s linear infinite;
}

.bs-field-error {
  color: var(--color-error);
  margin-top: 4px;
}

.bs-clickable {
  user-select: none;
  cursor: pointer;
}

.bs-clickable:hover {
  filter: opacity(75%);
}

.bs-clickable:active {
  filter: opacity(50%);
}

.bs-clickable.disabled {
  filter: opacity(40%);
}

.component-shadow-base {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}

[data-theme=dark] .component-shadow-base {
  box-shadow: 2px 2px 8px rgba(255, 255, 255, 0.1);
}

.font-icon {
  font-family: var(--icon-font-family);
  font-size: 1rem;
  max-width: 1em;
}

.font-icon.filled {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}

.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}

.fade-enter,
.fade-leave-to {
  opacity: 0;
}

.text-description {
  margin-top: 2px;
  color: var(--gray-400);
  font-size: 0.923em;
}

.bs-drop-position {
  position: absolute;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--primary-400);
  opacity: 0.7;
  z-index: 100;
}

.bs-drop-position.vertical {
  left: 0;
  width: 100%;
  height: 8px;
}

.bs-drop-position.vertical.before {
  top: -4px;
}

.bs-drop-position.vertical.after {
  bottom: -4px;
}

.bs-drop-position.horizontal {
  left: 0;
  width: 8px;
  height: 100%;
}

.bs-drop-position.horizontal.before {
  left: -4px;
}

.bs-drop-position.horizontal.after {
  right: -4px;
}

.bs-droppable-horizontal {
  transition: transform 0.3s ease;
}

.bs-droppable-horizontal.bs-dropping-before, .bs-droppable-horizontal.bs-dropping-after-following {
  transform: translateX(12px);
  z-index: 1;
}

.bs-droppable-horizontal.bs-dropping-after, .bs-droppable-horizontal.bs-dropping-before-preceding {
  transform: translateX(-12px);
  z-index: 1;
}

.bs-dragging-source {
  opacity: 0.5;
}

.bs-number-input .input-area {
  width: 100%;
}

.bs-number-input.value-right input {
  text-align: right;
}

.bs-number-input.value-center input {
  text-align: center;
}

.bs-box-component-wrap, .bs-select-wrap, .bs-input-wrap, .bs-price-input {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: left;
}

.bs-box-component-wrap .message, .bs-select-wrap .message, .bs-input-wrap .message, .bs-price-input .message {
  margin-top: 4px;
  font-size: 0.9em;
}

.bs-box-component-base, .bs-select-wrap > .selected, .bs-input-base, .bs-price-input .input-area {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: left;
  background-color: var(--body-bg);
}

.bs-input-wrap .suffix, .bs-price-input .suffix,
.bs-input-wrap .prefix,
.bs-price-input .prefix {
  font-size: 0.9em;
  margin-right: 4px;
  margin-left: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}

.bs-input-wrap .suffix:first-child, .bs-price-input .suffix:first-child,
.bs-input-wrap .prefix:first-child,
.bs-price-input .prefix:first-child {
  margin-left: 4px;
}

.bs-input-wrap .suffix .font-icon, .bs-price-input .suffix .font-icon,
.bs-input-wrap .prefix .font-icon,
.bs-price-input .prefix .font-icon {
  font-size: 0.9em;
}

.bs-input-wrap .suffix img, .bs-price-input .suffix img,
.bs-input-wrap .prefix img,
.bs-price-input .prefix img {
  width: 0.9em;
  height: 0.9em;
}

[data-theme=dark] .bs-input-wrap .suffix img, [data-theme=dark] .bs-price-input .suffix img,
[data-theme=dark] .bs-input-wrap .prefix img,
[data-theme=dark] .bs-price-input .prefix img {
  filter: invert(1);
}

.bs-input-base, .bs-price-input .input-area {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}

.bs-input-base > input, .bs-price-input .input-area > input {
  border: 0;
  border-radius: 0;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  flex-basis: 1em;
  padding: 0 6px;
  background-color: transparent;
  width: 100%;
  color: var(--body-text);
}

.bs-input-base > textarea, .bs-price-input .input-area > textarea {
  border: 0;
  border-radius: 4px;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  padding: 6px;
  line-height: 1.4;
  font-family: sans-serif;
  background-color: var(--body-bg);
  color: var(--body-text);
}

.bs-input-base:hover, .bs-price-input .input-area:hover {
  border-color: var(--border-hover);
}

.bs-input-base:has(:focus), .bs-price-input .input-area:has(:focus) {
  border-color: var(--color-focus);
  border-width: 1px;
}

.bs-text-input.modified > .input-area,
.bs-number-input.modified > .input-area,
.bs-price-input.modified > .input-area,
.bs-date-input.modified > .input-area,
.bs-date-range.modified > .input-area,
.bs-multi-lang-text-input.modified > .input-area,
.bs-multi-lang-text-area.modified > .input-area,
.bs-multi-lang-rich-text.modified > .input-area,
.bs-text-area.modified > .input-area,
.bs-rich-text.modified > .input-area {
  border-color: var(--purple) !important;
}

.bs-text-input.error > .input-area,
.bs-number-input.error > .input-area,
.bs-price-input.error > .input-area,
.bs-date-input.error > .input-area,
.bs-date-range.error > .input-area,
.bs-multi-lang-text-input.error > .input-area,
.bs-multi-lang-text-area.error > .input-area,
.bs-multi-lang-rich-text.error > .input-area,
.bs-text-area.error > .input-area,
.bs-rich-text.error > .input-area {
  border-color: var(--danger) !important;
}

.bs-text-input.error > .input-area > input,
.bs-number-input.error > .input-area > input,
.bs-price-input.error > .input-area > input,
.bs-date-input.error > .input-area > input,
.bs-date-range.error > .input-area > input,
.bs-multi-lang-text-input.error > .input-area > input,
.bs-multi-lang-text-area.error > .input-area > input,
.bs-multi-lang-rich-text.error > .input-area > input,
.bs-text-area.error > .input-area > input,
.bs-rich-text.error > .input-area > input {
  color: var(--danger) !important;
}

.bs-text-input.disabled > .input-area,
.bs-number-input.disabled > .input-area,
.bs-price-input.disabled > .input-area,
.bs-date-input.disabled > .input-area,
.bs-date-range.disabled > .input-area,
.bs-multi-lang-text-input.disabled > .input-area,
.bs-multi-lang-text-area.disabled > .input-area,
.bs-multi-lang-rich-text.disabled > .input-area,
.bs-text-area.disabled > .input-area,
.bs-rich-text.disabled > .input-area {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}

.bs-text-input.disabled > .input-area > input,
.bs-number-input.disabled > .input-area > input,
.bs-price-input.disabled > .input-area > input,
.bs-date-input.disabled > .input-area > input,
.bs-date-range.disabled > .input-area > input,
.bs-multi-lang-text-input.disabled > .input-area > input,
.bs-multi-lang-text-area.disabled > .input-area > input,
.bs-multi-lang-rich-text.disabled > .input-area > input,
.bs-text-area.disabled > .input-area > input,
.bs-rich-text.disabled > .input-area > input {
  color: var(--gray-400) !important;
  background-color: var(--gray-100) !important;
}

.bs-text-input.disabled > .input-area > textarea,
.bs-number-input.disabled > .input-area > textarea,
.bs-price-input.disabled > .input-area > textarea,
.bs-date-input.disabled > .input-area > textarea,
.bs-date-range.disabled > .input-area > textarea,
.bs-multi-lang-text-input.disabled > .input-area > textarea,
.bs-multi-lang-text-area.disabled > .input-area > textarea,
.bs-multi-lang-rich-text.disabled > .input-area > textarea,
.bs-text-area.disabled > .input-area > textarea,
.bs-rich-text.disabled > .input-area > textarea {
  background-color: var(--gray-100) !important;
}

.bs-date-input .view-mode,
.bs-date-range .view-mode {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}

.bs-date-input .view-mode::before,
.bs-date-range .view-mode::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-date-input .extra-dates,
.bs-date-range .extra-dates,
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  color: var(--body-text);
  margin-top: 4px;
}

.bs-date-input .extra-dates .extra-date,
.bs-date-range .extra-dates .extra-date,
.bs-calendar .extra-dates .extra-date,
.bs-calendar-range .extra-dates .extra-date {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8125rem;
}

.bs-date-input .extra-dates .extra-date::before,
.bs-date-range .extra-dates .extra-date::before,
.bs-calendar .extra-dates .extra-date::before,
.bs-calendar-range .extra-dates .extra-date::before {
  content: "globe";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}

.bs-checkbox-base {
  display: inline-block;
  color: var(--body-text);
  white-space: nowrap;
}

.bs-checkbox-base input {
  appearance: none;
  margin: 0;
  outline: 0;
}

.bs-checkbox-base input::before {
  font-family: var(--icon-font-family);
  font-size: 20px;
  vertical-align: middle;
  cursor: pointer;
  color: var(--body-text);
}

.bs-checkbox-base input:hover {
  color: var(--gray-500);
}

.bs-checkbox-base input:hover ~ label {
  color: var(--gray-500);
}

.bs-checkbox-base input:focus::before {
  color: var(--color-focus);
}

.bs-checkbox-base input:focus ~ label {
  color: var(--color-focus);
}

.bs-checkbox-base.modified input::before {
  color: var(--purple) !important;
}

.bs-checkbox-base.modified input ~ label {
  color: var(--purple) !important;
}

.bs-checkbox-base.error input::before {
  color: var(--danger) !important;
}

.bs-checkbox-base.error input ~ label {
  color: var(--danger) !important;
}

.bs-checkbox-base.disabled input::before {
  color: var(--gray-400) !important;
}

.bs-checkbox-base.disabled input ~ label {
  color: var(--gray-400) !important;
}

.bs-checkbox-base label {
  display: inline-block;
  vertical-align: middle;
  padding: 4px 2px;
  cursor: pointer;
}

.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input::before {
  color: var(--purple) !important;
}

.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input ~ label {
  color: var(--purple) !important;
}

.bs-checkbox-group.error .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input::before {
  color: var(--danger) !important;
}

.bs-checkbox-group.error .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input ~ label {
  color: var(--danger) !important;
}

.bs-checkbox-group.disabled input::before,
.bs-radio-button-group.disabled input::before {
  color: var(--gray-400) !important;
}

.bs-checkbox-group.disabled input ~ label,
.bs-radio-button-group.disabled input ~ label {
  color: var(--gray-400) !important;
}

.bs-select-wrap {
  position: relative;
  outline: 0;
  background-color: var(--body-bg);
  color: var(--body-text);
  min-width: 64px;
}

.bs-select-wrap:hover > .selected {
  border-color: var(--border-hover);
}

.bs-select-wrap:focus > .selected {
  border-color: var(--color-focus);
}

.bs-select-wrap > .selected {
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 0 6px;
  min-width: 100%;
  cursor: pointer;
  display: flex;
}

.bs-select-wrap > .selected .label {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.bs-select-wrap > .selected .placeholder {
  color: var(--gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
}

.bs-select-wrap > .selected .dropdown-btn {
  font-family: var(--icon-font-family);
  margin-right: -4px;
  margin-left: 4px;
  user-select: none;
  transition: transform 0.2s linear;
}

.bs-select-wrap.popup-open .dropdown-btn {
  transform: rotate(180deg);
}

.bs-select-wrap.modified > .selected {
  border-color: var(--purple) !important;
}

.bs-select-wrap.error > .selected {
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}

.bs-select-wrap.disabled > .selected {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-500) !important;
}

.bs-select-wrap.view-mode {
  background-color: transparent;
}

.bs-select-wrap .small-progress {
  font-family: var(--icon-font-family);
  font-size: 0.9em;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 0 2px;
  color: var(--gray-400);
  animation: spin 1s linear infinite;
}

.bs-field-error {
  color: var(--color-error);
  margin-top: 4px;
}

.bs-clickable {
  user-select: none;
  cursor: pointer;
}

.bs-clickable:hover {
  filter: opacity(75%);
}

.bs-clickable:active {
  filter: opacity(50%);
}

.bs-clickable.disabled {
  filter: opacity(40%);
}

.component-shadow-base {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}

[data-theme=dark] .component-shadow-base {
  box-shadow: 2px 2px 8px rgba(255, 255, 255, 0.1);
}

.font-icon {
  font-family: var(--icon-font-family);
  font-size: 1rem;
  max-width: 1em;
}

.font-icon.filled {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}

.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}

.fade-enter,
.fade-leave-to {
  opacity: 0;
}

.text-description {
  margin-top: 2px;
  color: var(--gray-400);
  font-size: 0.923em;
}

.bs-drop-position {
  position: absolute;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--primary-400);
  opacity: 0.7;
  z-index: 100;
}

.bs-drop-position.vertical {
  left: 0;
  width: 100%;
  height: 8px;
}

.bs-drop-position.vertical.before {
  top: -4px;
}

.bs-drop-position.vertical.after {
  bottom: -4px;
}

.bs-drop-position.horizontal {
  left: 0;
  width: 8px;
  height: 100%;
}

.bs-drop-position.horizontal.before {
  left: -4px;
}

.bs-drop-position.horizontal.after {
  right: -4px;
}

.bs-droppable-horizontal {
  transition: transform 0.3s ease;
}

.bs-droppable-horizontal.bs-dropping-before, .bs-droppable-horizontal.bs-dropping-after-following {
  transform: translateX(12px);
  z-index: 1;
}

.bs-droppable-horizontal.bs-dropping-after, .bs-droppable-horizontal.bs-dropping-before-preceding {
  transform: translateX(-12px);
  z-index: 1;
}

.bs-dragging-source {
  opacity: 0.5;
}

.bs-price-input .input-area {
  width: 100%;
}

.bs-price-input .input-area input {
  text-align: right;
}

.bs-price-input .currency-code {
  font-size: 0.9em;
  margin-right: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
}

.bs-color-input input[type=color] {
  width: 32px;
  height: 26px;
  margin-right: -1px;
  border-radius: 2px 0 0 2px;
  border-color: var(--border);
  background-color: var(--body-bg);
}

.bs-color-input input[type=color]:focus {
  outline: none;
  border-color: var(--color-focus);
  border-width: 1px;
  z-index: 1;
}

.bs-color-input .bs-text-input .input-area {
  border-radius: 0 2px 2px 0;
}

.bs-color-input.error input[type=color] {
  border-color: var(--danger);
}

.bs-color-input.error .bs-text-input .input-area {
  border-color: var(--danger);
}

.bs-color-input.modified input[type=color] {
  border-color: var(--purple);
}

.bs-color-input.modified .bs-text-input .input-area {
  border-color: var(--purple);
}

.bs-color-input.disabled input[type=color] {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}

.bs-color-input .view-mode {
  line-height: 1;
}

.bs-color-input .view-mode .color-preview {
  width: 28px;
  height: 18px;
  border-radius: 2px;
}

.bs-box-component-wrap, .bs-select-wrap, .bs-input-wrap, .bs-date-input {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: left;
}

.bs-box-component-wrap .message, .bs-select-wrap .message, .bs-input-wrap .message, .bs-date-input .message {
  margin-top: 4px;
  font-size: 0.9em;
}

.bs-box-component-base, .bs-select-wrap > .selected, .bs-input-base, .bs-date-input .input-area {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: left;
  background-color: var(--body-bg);
}

.bs-input-wrap .suffix, .bs-date-input .suffix,
.bs-input-wrap .prefix,
.bs-date-input .prefix {
  font-size: 0.9em;
  margin-right: 4px;
  margin-left: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}

.bs-input-wrap .suffix:first-child, .bs-date-input .suffix:first-child,
.bs-input-wrap .prefix:first-child,
.bs-date-input .prefix:first-child {
  margin-left: 4px;
}

.bs-input-wrap .suffix .font-icon, .bs-date-input .suffix .font-icon,
.bs-input-wrap .prefix .font-icon,
.bs-date-input .prefix .font-icon {
  font-size: 0.9em;
}

.bs-input-wrap .suffix img, .bs-date-input .suffix img,
.bs-input-wrap .prefix img,
.bs-date-input .prefix img {
  width: 0.9em;
  height: 0.9em;
}

[data-theme=dark] .bs-input-wrap .suffix img, [data-theme=dark] .bs-date-input .suffix img,
[data-theme=dark] .bs-input-wrap .prefix img,
[data-theme=dark] .bs-date-input .prefix img {
  filter: invert(1);
}

.bs-input-base, .bs-date-input .input-area {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}

.bs-input-base > input, .bs-date-input .input-area > input {
  border: 0;
  border-radius: 0;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  flex-basis: 1em;
  padding: 0 6px;
  background-color: transparent;
  width: 100%;
  color: var(--body-text);
}

.bs-input-base > textarea, .bs-date-input .input-area > textarea {
  border: 0;
  border-radius: 4px;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  padding: 6px;
  line-height: 1.4;
  font-family: sans-serif;
  background-color: var(--body-bg);
  color: var(--body-text);
}

.bs-input-base:hover, .bs-date-input .input-area:hover {
  border-color: var(--border-hover);
}

.bs-input-base:has(:focus), .bs-date-input .input-area:has(:focus) {
  border-color: var(--color-focus);
  border-width: 1px;
}

.bs-text-input.modified > .input-area,
.bs-number-input.modified > .input-area,
.bs-price-input.modified > .input-area,
.bs-date-input.modified > .input-area,
.bs-date-range.modified > .input-area,
.bs-multi-lang-text-input.modified > .input-area,
.bs-multi-lang-text-area.modified > .input-area,
.bs-multi-lang-rich-text.modified > .input-area,
.bs-text-area.modified > .input-area,
.bs-rich-text.modified > .input-area {
  border-color: var(--purple) !important;
}

.bs-text-input.error > .input-area,
.bs-number-input.error > .input-area,
.bs-price-input.error > .input-area,
.bs-date-input.error > .input-area,
.bs-date-range.error > .input-area,
.bs-multi-lang-text-input.error > .input-area,
.bs-multi-lang-text-area.error > .input-area,
.bs-multi-lang-rich-text.error > .input-area,
.bs-text-area.error > .input-area,
.bs-rich-text.error > .input-area {
  border-color: var(--danger) !important;
}

.bs-text-input.error > .input-area > input,
.bs-number-input.error > .input-area > input,
.bs-price-input.error > .input-area > input,
.bs-date-input.error > .input-area > input,
.bs-date-range.error > .input-area > input,
.bs-multi-lang-text-input.error > .input-area > input,
.bs-multi-lang-text-area.error > .input-area > input,
.bs-multi-lang-rich-text.error > .input-area > input,
.bs-text-area.error > .input-area > input,
.bs-rich-text.error > .input-area > input {
  color: var(--danger) !important;
}

.bs-text-input.disabled > .input-area,
.bs-number-input.disabled > .input-area,
.bs-price-input.disabled > .input-area,
.bs-date-input.disabled > .input-area,
.bs-date-range.disabled > .input-area,
.bs-multi-lang-text-input.disabled > .input-area,
.bs-multi-lang-text-area.disabled > .input-area,
.bs-multi-lang-rich-text.disabled > .input-area,
.bs-text-area.disabled > .input-area,
.bs-rich-text.disabled > .input-area {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}

.bs-text-input.disabled > .input-area > input,
.bs-number-input.disabled > .input-area > input,
.bs-price-input.disabled > .input-area > input,
.bs-date-input.disabled > .input-area > input,
.bs-date-range.disabled > .input-area > input,
.bs-multi-lang-text-input.disabled > .input-area > input,
.bs-multi-lang-text-area.disabled > .input-area > input,
.bs-multi-lang-rich-text.disabled > .input-area > input,
.bs-text-area.disabled > .input-area > input,
.bs-rich-text.disabled > .input-area > input {
  color: var(--gray-400) !important;
  background-color: var(--gray-100) !important;
}

.bs-text-input.disabled > .input-area > textarea,
.bs-number-input.disabled > .input-area > textarea,
.bs-price-input.disabled > .input-area > textarea,
.bs-date-input.disabled > .input-area > textarea,
.bs-date-range.disabled > .input-area > textarea,
.bs-multi-lang-text-input.disabled > .input-area > textarea,
.bs-multi-lang-text-area.disabled > .input-area > textarea,
.bs-multi-lang-rich-text.disabled > .input-area > textarea,
.bs-text-area.disabled > .input-area > textarea,
.bs-rich-text.disabled > .input-area > textarea {
  background-color: var(--gray-100) !important;
}

.bs-date-input .view-mode,
.bs-date-range .view-mode {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}

.bs-date-input .view-mode::before,
.bs-date-range .view-mode::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-date-input .extra-dates,
.bs-date-range .extra-dates,
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  color: var(--body-text);
  margin-top: 4px;
}

.bs-date-input .extra-dates .extra-date,
.bs-date-range .extra-dates .extra-date,
.bs-calendar .extra-dates .extra-date,
.bs-calendar-range .extra-dates .extra-date {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8125rem;
}

.bs-date-input .extra-dates .extra-date::before,
.bs-date-range .extra-dates .extra-date::before,
.bs-calendar .extra-dates .extra-date::before,
.bs-calendar-range .extra-dates .extra-date::before {
  content: "globe";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}

.bs-checkbox-base {
  display: inline-block;
  color: var(--body-text);
  white-space: nowrap;
}

.bs-checkbox-base input {
  appearance: none;
  margin: 0;
  outline: 0;
}

.bs-checkbox-base input::before {
  font-family: var(--icon-font-family);
  font-size: 20px;
  vertical-align: middle;
  cursor: pointer;
  color: var(--body-text);
}

.bs-checkbox-base input:hover {
  color: var(--gray-500);
}

.bs-checkbox-base input:hover ~ label {
  color: var(--gray-500);
}

.bs-checkbox-base input:focus::before {
  color: var(--color-focus);
}

.bs-checkbox-base input:focus ~ label {
  color: var(--color-focus);
}

.bs-checkbox-base.modified input::before {
  color: var(--purple) !important;
}

.bs-checkbox-base.modified input ~ label {
  color: var(--purple) !important;
}

.bs-checkbox-base.error input::before {
  color: var(--danger) !important;
}

.bs-checkbox-base.error input ~ label {
  color: var(--danger) !important;
}

.bs-checkbox-base.disabled input::before {
  color: var(--gray-400) !important;
}

.bs-checkbox-base.disabled input ~ label {
  color: var(--gray-400) !important;
}

.bs-checkbox-base label {
  display: inline-block;
  vertical-align: middle;
  padding: 4px 2px;
  cursor: pointer;
}

.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input::before {
  color: var(--purple) !important;
}

.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input ~ label {
  color: var(--purple) !important;
}

.bs-checkbox-group.error .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input::before {
  color: var(--danger) !important;
}

.bs-checkbox-group.error .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input ~ label {
  color: var(--danger) !important;
}

.bs-checkbox-group.disabled input::before,
.bs-radio-button-group.disabled input::before {
  color: var(--gray-400) !important;
}

.bs-checkbox-group.disabled input ~ label,
.bs-radio-button-group.disabled input ~ label {
  color: var(--gray-400) !important;
}

.bs-select-wrap {
  position: relative;
  outline: 0;
  background-color: var(--body-bg);
  color: var(--body-text);
  min-width: 64px;
}

.bs-select-wrap:hover > .selected {
  border-color: var(--border-hover);
}

.bs-select-wrap:focus > .selected {
  border-color: var(--color-focus);
}

.bs-select-wrap > .selected {
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 0 6px;
  min-width: 100%;
  cursor: pointer;
  display: flex;
}

.bs-select-wrap > .selected .label {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.bs-select-wrap > .selected .placeholder {
  color: var(--gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
}

.bs-select-wrap > .selected .dropdown-btn {
  font-family: var(--icon-font-family);
  margin-right: -4px;
  margin-left: 4px;
  user-select: none;
  transition: transform 0.2s linear;
}

.bs-select-wrap.popup-open .dropdown-btn {
  transform: rotate(180deg);
}

.bs-select-wrap.modified > .selected {
  border-color: var(--purple) !important;
}

.bs-select-wrap.error > .selected {
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}

.bs-select-wrap.disabled > .selected {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-500) !important;
}

.bs-select-wrap.view-mode {
  background-color: transparent;
}

.bs-select-wrap .small-progress {
  font-family: var(--icon-font-family);
  font-size: 0.9em;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 0 2px;
  color: var(--gray-400);
  animation: spin 1s linear infinite;
}

.bs-field-error {
  color: var(--color-error);
  margin-top: 4px;
}

.bs-clickable {
  user-select: none;
  cursor: pointer;
}

.bs-clickable:hover {
  filter: opacity(75%);
}

.bs-clickable:active {
  filter: opacity(50%);
}

.bs-clickable.disabled {
  filter: opacity(40%);
}

.component-shadow-base {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}

[data-theme=dark] .component-shadow-base {
  box-shadow: 2px 2px 8px rgba(255, 255, 255, 0.1);
}

.font-icon {
  font-family: var(--icon-font-family);
  font-size: 1rem;
  max-width: 1em;
}

.font-icon.filled {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}

.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}

.fade-enter,
.fade-leave-to {
  opacity: 0;
}

.text-description {
  margin-top: 2px;
  color: var(--gray-400);
  font-size: 0.923em;
}

.bs-drop-position {
  position: absolute;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--primary-400);
  opacity: 0.7;
  z-index: 100;
}

.bs-drop-position.vertical {
  left: 0;
  width: 100%;
  height: 8px;
}

.bs-drop-position.vertical.before {
  top: -4px;
}

.bs-drop-position.vertical.after {
  bottom: -4px;
}

.bs-drop-position.horizontal {
  left: 0;
  width: 8px;
  height: 100%;
}

.bs-drop-position.horizontal.before {
  left: -4px;
}

.bs-drop-position.horizontal.after {
  right: -4px;
}

.bs-droppable-horizontal {
  transition: transform 0.3s ease;
}

.bs-droppable-horizontal.bs-dropping-before, .bs-droppable-horizontal.bs-dropping-after-following {
  transform: translateX(12px);
  z-index: 1;
}

.bs-droppable-horizontal.bs-dropping-after, .bs-droppable-horizontal.bs-dropping-before-preceding {
  transform: translateX(-12px);
  z-index: 1;
}

.bs-dragging-source {
  opacity: 0.5;
}

.bs-date-input {
  width: 200px;
}

.bs-date-input .input-area {
  width: 100%;
  display: flex;
  align-items: center;
}

.bs-date-input .input-area .font-icon {
  padding: 0 6px;
  min-width: 26px;
  font-size: 14px;
}

.bs-date-input .input-area input {
  border-left: 1px solid var(--border);
}

.bs-date-input.disabled .font-icon {
  color: var(--gray-400);
}

.bs-box-component-wrap, .bs-select-wrap, .bs-input-wrap, .bs-date-range {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: left;
}

.bs-box-component-wrap .message, .bs-select-wrap .message, .bs-input-wrap .message, .bs-date-range .message {
  margin-top: 4px;
  font-size: 0.9em;
}

.bs-box-component-base, .bs-select-wrap > .selected, .bs-input-base, .bs-date-range .input-area {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: left;
  background-color: var(--body-bg);
}

.bs-input-wrap .suffix, .bs-date-range .suffix,
.bs-input-wrap .prefix,
.bs-date-range .prefix {
  font-size: 0.9em;
  margin-right: 4px;
  margin-left: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}

.bs-input-wrap .suffix:first-child, .bs-date-range .suffix:first-child,
.bs-input-wrap .prefix:first-child,
.bs-date-range .prefix:first-child {
  margin-left: 4px;
}

.bs-input-wrap .suffix .font-icon, .bs-date-range .suffix .font-icon,
.bs-input-wrap .prefix .font-icon,
.bs-date-range .prefix .font-icon {
  font-size: 0.9em;
}

.bs-input-wrap .suffix img, .bs-date-range .suffix img,
.bs-input-wrap .prefix img,
.bs-date-range .prefix img {
  width: 0.9em;
  height: 0.9em;
}

[data-theme=dark] .bs-input-wrap .suffix img, [data-theme=dark] .bs-date-range .suffix img,
[data-theme=dark] .bs-input-wrap .prefix img,
[data-theme=dark] .bs-date-range .prefix img {
  filter: invert(1);
}

.bs-input-base, .bs-date-range .input-area {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}

.bs-input-base > input, .bs-date-range .input-area > input {
  border: 0;
  border-radius: 0;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  flex-basis: 1em;
  padding: 0 6px;
  background-color: transparent;
  width: 100%;
  color: var(--body-text);
}

.bs-input-base > textarea, .bs-date-range .input-area > textarea {
  border: 0;
  border-radius: 4px;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  padding: 6px;
  line-height: 1.4;
  font-family: sans-serif;
  background-color: var(--body-bg);
  color: var(--body-text);
}

.bs-input-base:hover, .bs-date-range .input-area:hover {
  border-color: var(--border-hover);
}

.bs-input-base:has(:focus), .bs-date-range .input-area:has(:focus) {
  border-color: var(--color-focus);
  border-width: 1px;
}

.bs-text-input.modified > .input-area,
.bs-number-input.modified > .input-area,
.bs-price-input.modified > .input-area,
.bs-date-input.modified > .input-area,
.bs-date-range.modified > .input-area,
.bs-multi-lang-text-input.modified > .input-area,
.bs-multi-lang-text-area.modified > .input-area,
.bs-multi-lang-rich-text.modified > .input-area,
.bs-text-area.modified > .input-area,
.bs-rich-text.modified > .input-area {
  border-color: var(--purple) !important;
}

.bs-text-input.error > .input-area,
.bs-number-input.error > .input-area,
.bs-price-input.error > .input-area,
.bs-date-input.error > .input-area,
.bs-date-range.error > .input-area,
.bs-multi-lang-text-input.error > .input-area,
.bs-multi-lang-text-area.error > .input-area,
.bs-multi-lang-rich-text.error > .input-area,
.bs-text-area.error > .input-area,
.bs-rich-text.error > .input-area {
  border-color: var(--danger) !important;
}

.bs-text-input.error > .input-area > input,
.bs-number-input.error > .input-area > input,
.bs-price-input.error > .input-area > input,
.bs-date-input.error > .input-area > input,
.bs-date-range.error > .input-area > input,
.bs-multi-lang-text-input.error > .input-area > input,
.bs-multi-lang-text-area.error > .input-area > input,
.bs-multi-lang-rich-text.error > .input-area > input,
.bs-text-area.error > .input-area > input,
.bs-rich-text.error > .input-area > input {
  color: var(--danger) !important;
}

.bs-text-input.disabled > .input-area,
.bs-number-input.disabled > .input-area,
.bs-price-input.disabled > .input-area,
.bs-date-input.disabled > .input-area,
.bs-date-range.disabled > .input-area,
.bs-multi-lang-text-input.disabled > .input-area,
.bs-multi-lang-text-area.disabled > .input-area,
.bs-multi-lang-rich-text.disabled > .input-area,
.bs-text-area.disabled > .input-area,
.bs-rich-text.disabled > .input-area {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}

.bs-text-input.disabled > .input-area > input,
.bs-number-input.disabled > .input-area > input,
.bs-price-input.disabled > .input-area > input,
.bs-date-input.disabled > .input-area > input,
.bs-date-range.disabled > .input-area > input,
.bs-multi-lang-text-input.disabled > .input-area > input,
.bs-multi-lang-text-area.disabled > .input-area > input,
.bs-multi-lang-rich-text.disabled > .input-area > input,
.bs-text-area.disabled > .input-area > input,
.bs-rich-text.disabled > .input-area > input {
  color: var(--gray-400) !important;
  background-color: var(--gray-100) !important;
}

.bs-text-input.disabled > .input-area > textarea,
.bs-number-input.disabled > .input-area > textarea,
.bs-price-input.disabled > .input-area > textarea,
.bs-date-input.disabled > .input-area > textarea,
.bs-date-range.disabled > .input-area > textarea,
.bs-multi-lang-text-input.disabled > .input-area > textarea,
.bs-multi-lang-text-area.disabled > .input-area > textarea,
.bs-multi-lang-rich-text.disabled > .input-area > textarea,
.bs-text-area.disabled > .input-area > textarea,
.bs-rich-text.disabled > .input-area > textarea {
  background-color: var(--gray-100) !important;
}

.bs-date-input .view-mode,
.bs-date-range .view-mode {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}

.bs-date-input .view-mode::before,
.bs-date-range .view-mode::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-date-input .extra-dates,
.bs-date-range .extra-dates,
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  color: var(--body-text);
  margin-top: 4px;
}

.bs-date-input .extra-dates .extra-date,
.bs-date-range .extra-dates .extra-date,
.bs-calendar .extra-dates .extra-date,
.bs-calendar-range .extra-dates .extra-date {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8125rem;
}

.bs-date-input .extra-dates .extra-date::before,
.bs-date-range .extra-dates .extra-date::before,
.bs-calendar .extra-dates .extra-date::before,
.bs-calendar-range .extra-dates .extra-date::before {
  content: "globe";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}

.bs-checkbox-base {
  display: inline-block;
  color: var(--body-text);
  white-space: nowrap;
}

.bs-checkbox-base input {
  appearance: none;
  margin: 0;
  outline: 0;
}

.bs-checkbox-base input::before {
  font-family: var(--icon-font-family);
  font-size: 20px;
  vertical-align: middle;
  cursor: pointer;
  color: var(--body-text);
}

.bs-checkbox-base input:hover {
  color: var(--gray-500);
}

.bs-checkbox-base input:hover ~ label {
  color: var(--gray-500);
}

.bs-checkbox-base input:focus::before {
  color: var(--color-focus);
}

.bs-checkbox-base input:focus ~ label {
  color: var(--color-focus);
}

.bs-checkbox-base.modified input::before {
  color: var(--purple) !important;
}

.bs-checkbox-base.modified input ~ label {
  color: var(--purple) !important;
}

.bs-checkbox-base.error input::before {
  color: var(--danger) !important;
}

.bs-checkbox-base.error input ~ label {
  color: var(--danger) !important;
}

.bs-checkbox-base.disabled input::before {
  color: var(--gray-400) !important;
}

.bs-checkbox-base.disabled input ~ label {
  color: var(--gray-400) !important;
}

.bs-checkbox-base label {
  display: inline-block;
  vertical-align: middle;
  padding: 4px 2px;
  cursor: pointer;
}

.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input::before {
  color: var(--purple) !important;
}

.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input ~ label {
  color: var(--purple) !important;
}

.bs-checkbox-group.error .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input::before {
  color: var(--danger) !important;
}

.bs-checkbox-group.error .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input ~ label {
  color: var(--danger) !important;
}

.bs-checkbox-group.disabled input::before,
.bs-radio-button-group.disabled input::before {
  color: var(--gray-400) !important;
}

.bs-checkbox-group.disabled input ~ label,
.bs-radio-button-group.disabled input ~ label {
  color: var(--gray-400) !important;
}

.bs-select-wrap {
  position: relative;
  outline: 0;
  background-color: var(--body-bg);
  color: var(--body-text);
  min-width: 64px;
}

.bs-select-wrap:hover > .selected {
  border-color: var(--border-hover);
}

.bs-select-wrap:focus > .selected {
  border-color: var(--color-focus);
}

.bs-select-wrap > .selected {
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 0 6px;
  min-width: 100%;
  cursor: pointer;
  display: flex;
}

.bs-select-wrap > .selected .label {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.bs-select-wrap > .selected .placeholder {
  color: var(--gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
}

.bs-select-wrap > .selected .dropdown-btn {
  font-family: var(--icon-font-family);
  margin-right: -4px;
  margin-left: 4px;
  user-select: none;
  transition: transform 0.2s linear;
}

.bs-select-wrap.popup-open .dropdown-btn {
  transform: rotate(180deg);
}

.bs-select-wrap.modified > .selected {
  border-color: var(--purple) !important;
}

.bs-select-wrap.error > .selected {
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}

.bs-select-wrap.disabled > .selected {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-500) !important;
}

.bs-select-wrap.view-mode {
  background-color: transparent;
}

.bs-select-wrap .small-progress {
  font-family: var(--icon-font-family);
  font-size: 0.9em;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 0 2px;
  color: var(--gray-400);
  animation: spin 1s linear infinite;
}

.bs-field-error {
  color: var(--color-error);
  margin-top: 4px;
}

.bs-clickable {
  user-select: none;
  cursor: pointer;
}

.bs-clickable:hover {
  filter: opacity(75%);
}

.bs-clickable:active {
  filter: opacity(50%);
}

.bs-clickable.disabled {
  filter: opacity(40%);
}

.component-shadow-base {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}

[data-theme=dark] .component-shadow-base {
  box-shadow: 2px 2px 8px rgba(255, 255, 255, 0.1);
}

.font-icon {
  font-family: var(--icon-font-family);
  font-size: 1rem;
  max-width: 1em;
}

.font-icon.filled {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}

.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}

.fade-enter,
.fade-leave-to {
  opacity: 0;
}

.text-description {
  margin-top: 2px;
  color: var(--gray-400);
  font-size: 0.923em;
}

.bs-drop-position {
  position: absolute;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--primary-400);
  opacity: 0.7;
  z-index: 100;
}

.bs-drop-position.vertical {
  left: 0;
  width: 100%;
  height: 8px;
}

.bs-drop-position.vertical.before {
  top: -4px;
}

.bs-drop-position.vertical.after {
  bottom: -4px;
}

.bs-drop-position.horizontal {
  left: 0;
  width: 8px;
  height: 100%;
}

.bs-drop-position.horizontal.before {
  left: -4px;
}

.bs-drop-position.horizontal.after {
  right: -4px;
}

.bs-droppable-horizontal {
  transition: transform 0.3s ease;
}

.bs-droppable-horizontal.bs-dropping-before, .bs-droppable-horizontal.bs-dropping-after-following {
  transform: translateX(12px);
  z-index: 1;
}

.bs-droppable-horizontal.bs-dropping-after, .bs-droppable-horizontal.bs-dropping-before-preceding {
  transform: translateX(-12px);
  z-index: 1;
}

.bs-dragging-source {
  opacity: 0.5;
}

.bs-date-range .input-area {
  width: 100%;
  display: flex;
  align-items: center;
  padding-right: 8px;
}

.bs-date-range .input-area .font-icon {
  padding: 0 6px;
  min-width: 26px;
  font-size: 14px;
}

.bs-date-range .input-area .font-icon + input {
  border-left: 1px solid var(--border);
}

.bs-date-range .input-area input {
  border-radius: 0;
  padding-right: 0;
  width: 4em;
  flex-grow: 1;
}

.bs-date-range .input-area input:disabled {
  color: var(--gray-400);
  background-color: var(--gray-100) !important;
}

.bs-date-range.disabled .font-icon {
  color: var(--gray-400);
}

.bs-box-component-wrap, .bs-select-wrap, .bs-input-wrap {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: left;
}

.bs-box-component-wrap .message, .bs-select-wrap .message, .bs-input-wrap .message {
  margin-top: 4px;
  font-size: 0.9em;
}

.bs-box-component-base, .bs-select-wrap > .selected, .bs-input-base {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: left;
  background-color: var(--body-bg);
}

.bs-input-wrap .suffix,
.bs-input-wrap .prefix {
  font-size: 0.9em;
  margin-right: 4px;
  margin-left: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}

.bs-input-wrap .suffix:first-child,
.bs-input-wrap .prefix:first-child {
  margin-left: 4px;
}

.bs-input-wrap .suffix .font-icon,
.bs-input-wrap .prefix .font-icon {
  font-size: 0.9em;
}

.bs-input-wrap .suffix img,
.bs-input-wrap .prefix img {
  width: 0.9em;
  height: 0.9em;
}

[data-theme=dark] .bs-input-wrap .suffix img,
[data-theme=dark] .bs-input-wrap .prefix img {
  filter: invert(1);
}

.bs-input-base {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}

.bs-input-base > input {
  border: 0;
  border-radius: 0;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  flex-basis: 1em;
  padding: 0 6px;
  background-color: transparent;
  width: 100%;
  color: var(--body-text);
}

.bs-input-base > textarea {
  border: 0;
  border-radius: 4px;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  padding: 6px;
  line-height: 1.4;
  font-family: sans-serif;
  background-color: var(--body-bg);
  color: var(--body-text);
}

.bs-input-base:hover {
  border-color: var(--border-hover);
}

.bs-input-base:has(:focus) {
  border-color: var(--color-focus);
  border-width: 1px;
}

.bs-text-input.modified > .input-area,
.bs-number-input.modified > .input-area,
.bs-price-input.modified > .input-area,
.bs-date-input.modified > .input-area,
.bs-date-range.modified > .input-area,
.bs-multi-lang-text-input.modified > .input-area,
.bs-multi-lang-text-area.modified > .input-area,
.bs-multi-lang-rich-text.modified > .input-area,
.bs-text-area.modified > .input-area,
.bs-rich-text.modified > .input-area {
  border-color: var(--purple) !important;
}

.bs-text-input.error > .input-area,
.bs-number-input.error > .input-area,
.bs-price-input.error > .input-area,
.bs-date-input.error > .input-area,
.bs-date-range.error > .input-area,
.bs-multi-lang-text-input.error > .input-area,
.bs-multi-lang-text-area.error > .input-area,
.bs-multi-lang-rich-text.error > .input-area,
.bs-text-area.error > .input-area,
.bs-rich-text.error > .input-area {
  border-color: var(--danger) !important;
}

.bs-text-input.error > .input-area > input,
.bs-number-input.error > .input-area > input,
.bs-price-input.error > .input-area > input,
.bs-date-input.error > .input-area > input,
.bs-date-range.error > .input-area > input,
.bs-multi-lang-text-input.error > .input-area > input,
.bs-multi-lang-text-area.error > .input-area > input,
.bs-multi-lang-rich-text.error > .input-area > input,
.bs-text-area.error > .input-area > input,
.bs-rich-text.error > .input-area > input {
  color: var(--danger) !important;
}

.bs-text-input.disabled > .input-area,
.bs-number-input.disabled > .input-area,
.bs-price-input.disabled > .input-area,
.bs-date-input.disabled > .input-area,
.bs-date-range.disabled > .input-area,
.bs-multi-lang-text-input.disabled > .input-area,
.bs-multi-lang-text-area.disabled > .input-area,
.bs-multi-lang-rich-text.disabled > .input-area,
.bs-text-area.disabled > .input-area,
.bs-rich-text.disabled > .input-area {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}

.bs-text-input.disabled > .input-area > input,
.bs-number-input.disabled > .input-area > input,
.bs-price-input.disabled > .input-area > input,
.bs-date-input.disabled > .input-area > input,
.bs-date-range.disabled > .input-area > input,
.bs-multi-lang-text-input.disabled > .input-area > input,
.bs-multi-lang-text-area.disabled > .input-area > input,
.bs-multi-lang-rich-text.disabled > .input-area > input,
.bs-text-area.disabled > .input-area > input,
.bs-rich-text.disabled > .input-area > input {
  color: var(--gray-400) !important;
  background-color: var(--gray-100) !important;
}

.bs-text-input.disabled > .input-area > textarea,
.bs-number-input.disabled > .input-area > textarea,
.bs-price-input.disabled > .input-area > textarea,
.bs-date-input.disabled > .input-area > textarea,
.bs-date-range.disabled > .input-area > textarea,
.bs-multi-lang-text-input.disabled > .input-area > textarea,
.bs-multi-lang-text-area.disabled > .input-area > textarea,
.bs-multi-lang-rich-text.disabled > .input-area > textarea,
.bs-text-area.disabled > .input-area > textarea,
.bs-rich-text.disabled > .input-area > textarea {
  background-color: var(--gray-100) !important;
}

.bs-date-input .view-mode,
.bs-date-range .view-mode {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}

.bs-date-input .view-mode::before,
.bs-date-range .view-mode::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-date-input .extra-dates,
.bs-date-range .extra-dates,
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  color: var(--body-text);
  margin-top: 4px;
}

.bs-date-input .extra-dates .extra-date,
.bs-date-range .extra-dates .extra-date,
.bs-calendar .extra-dates .extra-date,
.bs-calendar-range .extra-dates .extra-date {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8125rem;
}

.bs-date-input .extra-dates .extra-date::before,
.bs-date-range .extra-dates .extra-date::before,
.bs-calendar .extra-dates .extra-date::before,
.bs-calendar-range .extra-dates .extra-date::before {
  content: "globe";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}

.bs-checkbox-base, .bs-radio-button {
  display: inline-block;
  color: var(--body-text);
  white-space: nowrap;
}

.bs-checkbox-base input, .bs-radio-button input {
  appearance: none;
  margin: 0;
  outline: 0;
}

.bs-checkbox-base input::before, .bs-radio-button input::before {
  font-family: var(--icon-font-family);
  font-size: 20px;
  vertical-align: middle;
  cursor: pointer;
  color: var(--body-text);
}

.bs-checkbox-base input:hover, .bs-radio-button input:hover {
  color: var(--gray-500);
}

.bs-checkbox-base input:hover ~ label, .bs-radio-button input:hover ~ label {
  color: var(--gray-500);
}

.bs-checkbox-base input:focus::before, .bs-radio-button input:focus::before {
  color: var(--color-focus);
}

.bs-checkbox-base input:focus ~ label, .bs-radio-button input:focus ~ label {
  color: var(--color-focus);
}

.bs-checkbox-base.modified input::before, .modified.bs-radio-button input::before {
  color: var(--purple) !important;
}

.bs-checkbox-base.modified input ~ label, .modified.bs-radio-button input ~ label {
  color: var(--purple) !important;
}

.bs-checkbox-base.error input::before, .error.bs-radio-button input::before {
  color: var(--danger) !important;
}

.bs-checkbox-base.error input ~ label, .error.bs-radio-button input ~ label {
  color: var(--danger) !important;
}

.bs-checkbox-base.disabled input::before, .disabled.bs-radio-button input::before {
  color: var(--gray-400) !important;
}

.bs-checkbox-base.disabled input ~ label, .disabled.bs-radio-button input ~ label {
  color: var(--gray-400) !important;
}

.bs-checkbox-base label, .bs-radio-button label {
  display: inline-block;
  vertical-align: middle;
  padding: 4px 2px;
  cursor: pointer;
}

.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input::before {
  color: var(--purple) !important;
}

.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input ~ label {
  color: var(--purple) !important;
}

.bs-checkbox-group.error .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input::before {
  color: var(--danger) !important;
}

.bs-checkbox-group.error .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input ~ label {
  color: var(--danger) !important;
}

.bs-checkbox-group.disabled input::before,
.bs-radio-button-group.disabled input::before {
  color: var(--gray-400) !important;
}

.bs-checkbox-group.disabled input ~ label,
.bs-radio-button-group.disabled input ~ label {
  color: var(--gray-400) !important;
}

.bs-select-wrap {
  position: relative;
  outline: 0;
  background-color: var(--body-bg);
  color: var(--body-text);
  min-width: 64px;
}

.bs-select-wrap:hover > .selected {
  border-color: var(--border-hover);
}

.bs-select-wrap:focus > .selected {
  border-color: var(--color-focus);
}

.bs-select-wrap > .selected {
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 0 6px;
  min-width: 100%;
  cursor: pointer;
  display: flex;
}

.bs-select-wrap > .selected .label {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.bs-select-wrap > .selected .placeholder {
  color: var(--gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
}

.bs-select-wrap > .selected .dropdown-btn {
  font-family: var(--icon-font-family);
  margin-right: -4px;
  margin-left: 4px;
  user-select: none;
  transition: transform 0.2s linear;
}

.bs-select-wrap.popup-open .dropdown-btn {
  transform: rotate(180deg);
}

.bs-select-wrap.modified > .selected {
  border-color: var(--purple) !important;
}

.bs-select-wrap.error > .selected {
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}

.bs-select-wrap.disabled > .selected {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-500) !important;
}

.bs-select-wrap.view-mode {
  background-color: transparent;
}

.bs-select-wrap .small-progress {
  font-family: var(--icon-font-family);
  font-size: 0.9em;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 0 2px;
  color: var(--gray-400);
  animation: spin 1s linear infinite;
}

.bs-field-error {
  color: var(--color-error);
  margin-top: 4px;
}

.bs-clickable {
  user-select: none;
  cursor: pointer;
}

.bs-clickable:hover {
  filter: opacity(75%);
}

.bs-clickable:active {
  filter: opacity(50%);
}

.bs-clickable.disabled {
  filter: opacity(40%);
}

.component-shadow-base {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}

[data-theme=dark] .component-shadow-base {
  box-shadow: 2px 2px 8px rgba(255, 255, 255, 0.1);
}

.font-icon {
  font-family: var(--icon-font-family);
  font-size: 1rem;
  max-width: 1em;
}

.font-icon.filled {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}

.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}

.fade-enter,
.fade-leave-to {
  opacity: 0;
}

.text-description {
  margin-top: 2px;
  color: var(--gray-400);
  font-size: 0.923em;
}

.bs-drop-position {
  position: absolute;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--primary-400);
  opacity: 0.7;
  z-index: 100;
}

.bs-drop-position.vertical {
  left: 0;
  width: 100%;
  height: 8px;
}

.bs-drop-position.vertical.before {
  top: -4px;
}

.bs-drop-position.vertical.after {
  bottom: -4px;
}

.bs-drop-position.horizontal {
  left: 0;
  width: 8px;
  height: 100%;
}

.bs-drop-position.horizontal.before {
  left: -4px;
}

.bs-drop-position.horizontal.after {
  right: -4px;
}

.bs-droppable-horizontal {
  transition: transform 0.3s ease;
}

.bs-droppable-horizontal.bs-dropping-before, .bs-droppable-horizontal.bs-dropping-after-following {
  transform: translateX(12px);
  z-index: 1;
}

.bs-droppable-horizontal.bs-dropping-after, .bs-droppable-horizontal.bs-dropping-before-preceding {
  transform: translateX(-12px);
  z-index: 1;
}

.bs-dragging-source {
  opacity: 0.5;
}

.bs-radio-button input::before {
  content: "radio_button_unchecked";
}

.bs-radio-button .font-icon {
  vertical-align: middle;
}

.bs-radio-button .text-label {
  vertical-align: middle;
}

.bs-radio-button.checked input::before {
  content: "radio_button_checked";
}

.bs-box-component-wrap, .bs-select-wrap, .bs-input-wrap {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: left;
}

.bs-box-component-wrap .message, .bs-select-wrap .message, .bs-input-wrap .message {
  margin-top: 4px;
  font-size: 0.9em;
}

.bs-box-component-base, .bs-select-wrap > .selected, .bs-input-base {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: left;
  background-color: var(--body-bg);
}

.bs-input-wrap .suffix,
.bs-input-wrap .prefix {
  font-size: 0.9em;
  margin-right: 4px;
  margin-left: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}

.bs-input-wrap .suffix:first-child,
.bs-input-wrap .prefix:first-child {
  margin-left: 4px;
}

.bs-input-wrap .suffix .font-icon,
.bs-input-wrap .prefix .font-icon {
  font-size: 0.9em;
}

.bs-input-wrap .suffix img,
.bs-input-wrap .prefix img {
  width: 0.9em;
  height: 0.9em;
}

[data-theme=dark] .bs-input-wrap .suffix img,
[data-theme=dark] .bs-input-wrap .prefix img {
  filter: invert(1);
}

.bs-input-base {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}

.bs-input-base > input {
  border: 0;
  border-radius: 0;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  flex-basis: 1em;
  padding: 0 6px;
  background-color: transparent;
  width: 100%;
  color: var(--body-text);
}

.bs-input-base > textarea {
  border: 0;
  border-radius: 4px;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  padding: 6px;
  line-height: 1.4;
  font-family: sans-serif;
  background-color: var(--body-bg);
  color: var(--body-text);
}

.bs-input-base:hover {
  border-color: var(--border-hover);
}

.bs-input-base:has(:focus) {
  border-color: var(--color-focus);
  border-width: 1px;
}

.bs-text-input.modified > .input-area,
.bs-number-input.modified > .input-area,
.bs-price-input.modified > .input-area,
.bs-date-input.modified > .input-area,
.bs-date-range.modified > .input-area,
.bs-multi-lang-text-input.modified > .input-area,
.bs-multi-lang-text-area.modified > .input-area,
.bs-multi-lang-rich-text.modified > .input-area,
.bs-text-area.modified > .input-area,
.bs-rich-text.modified > .input-area {
  border-color: var(--purple) !important;
}

.bs-text-input.error > .input-area,
.bs-number-input.error > .input-area,
.bs-price-input.error > .input-area,
.bs-date-input.error > .input-area,
.bs-date-range.error > .input-area,
.bs-multi-lang-text-input.error > .input-area,
.bs-multi-lang-text-area.error > .input-area,
.bs-multi-lang-rich-text.error > .input-area,
.bs-text-area.error > .input-area,
.bs-rich-text.error > .input-area {
  border-color: var(--danger) !important;
}

.bs-text-input.error > .input-area > input,
.bs-number-input.error > .input-area > input,
.bs-price-input.error > .input-area > input,
.bs-date-input.error > .input-area > input,
.bs-date-range.error > .input-area > input,
.bs-multi-lang-text-input.error > .input-area > input,
.bs-multi-lang-text-area.error > .input-area > input,
.bs-multi-lang-rich-text.error > .input-area > input,
.bs-text-area.error > .input-area > input,
.bs-rich-text.error > .input-area > input {
  color: var(--danger) !important;
}

.bs-text-input.disabled > .input-area,
.bs-number-input.disabled > .input-area,
.bs-price-input.disabled > .input-area,
.bs-date-input.disabled > .input-area,
.bs-date-range.disabled > .input-area,
.bs-multi-lang-text-input.disabled > .input-area,
.bs-multi-lang-text-area.disabled > .input-area,
.bs-multi-lang-rich-text.disabled > .input-area,
.bs-text-area.disabled > .input-area,
.bs-rich-text.disabled > .input-area {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}

.bs-text-input.disabled > .input-area > input,
.bs-number-input.disabled > .input-area > input,
.bs-price-input.disabled > .input-area > input,
.bs-date-input.disabled > .input-area > input,
.bs-date-range.disabled > .input-area > input,
.bs-multi-lang-text-input.disabled > .input-area > input,
.bs-multi-lang-text-area.disabled > .input-area > input,
.bs-multi-lang-rich-text.disabled > .input-area > input,
.bs-text-area.disabled > .input-area > input,
.bs-rich-text.disabled > .input-area > input {
  color: var(--gray-400) !important;
  background-color: var(--gray-100) !important;
}

.bs-text-input.disabled > .input-area > textarea,
.bs-number-input.disabled > .input-area > textarea,
.bs-price-input.disabled > .input-area > textarea,
.bs-date-input.disabled > .input-area > textarea,
.bs-date-range.disabled > .input-area > textarea,
.bs-multi-lang-text-input.disabled > .input-area > textarea,
.bs-multi-lang-text-area.disabled > .input-area > textarea,
.bs-multi-lang-rich-text.disabled > .input-area > textarea,
.bs-text-area.disabled > .input-area > textarea,
.bs-rich-text.disabled > .input-area > textarea {
  background-color: var(--gray-100) !important;
}

.bs-date-input .view-mode,
.bs-date-range .view-mode {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}

.bs-date-input .view-mode::before,
.bs-date-range .view-mode::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-date-input .extra-dates,
.bs-date-range .extra-dates,
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  color: var(--body-text);
  margin-top: 4px;
}

.bs-date-input .extra-dates .extra-date,
.bs-date-range .extra-dates .extra-date,
.bs-calendar .extra-dates .extra-date,
.bs-calendar-range .extra-dates .extra-date {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8125rem;
}

.bs-date-input .extra-dates .extra-date::before,
.bs-date-range .extra-dates .extra-date::before,
.bs-calendar .extra-dates .extra-date::before,
.bs-calendar-range .extra-dates .extra-date::before {
  content: "globe";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}

.bs-checkbox-base {
  display: inline-block;
  color: var(--body-text);
  white-space: nowrap;
}

.bs-checkbox-base input {
  appearance: none;
  margin: 0;
  outline: 0;
}

.bs-checkbox-base input::before {
  font-family: var(--icon-font-family);
  font-size: 20px;
  vertical-align: middle;
  cursor: pointer;
  color: var(--body-text);
}

.bs-checkbox-base input:hover {
  color: var(--gray-500);
}

.bs-checkbox-base input:hover ~ label {
  color: var(--gray-500);
}

.bs-checkbox-base input:focus::before {
  color: var(--color-focus);
}

.bs-checkbox-base input:focus ~ label {
  color: var(--color-focus);
}

.bs-checkbox-base.modified input::before {
  color: var(--purple) !important;
}

.bs-checkbox-base.modified input ~ label {
  color: var(--purple) !important;
}

.bs-checkbox-base.error input::before {
  color: var(--danger) !important;
}

.bs-checkbox-base.error input ~ label {
  color: var(--danger) !important;
}

.bs-checkbox-base.disabled input::before {
  color: var(--gray-400) !important;
}

.bs-checkbox-base.disabled input ~ label {
  color: var(--gray-400) !important;
}

.bs-checkbox-base label {
  display: inline-block;
  vertical-align: middle;
  padding: 4px 2px;
  cursor: pointer;
}

.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input::before {
  color: var(--purple) !important;
}

.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input ~ label {
  color: var(--purple) !important;
}

.bs-checkbox-group.error .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input::before {
  color: var(--danger) !important;
}

.bs-checkbox-group.error .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input ~ label {
  color: var(--danger) !important;
}

.bs-checkbox-group.disabled input::before,
.bs-radio-button-group.disabled input::before {
  color: var(--gray-400) !important;
}

.bs-checkbox-group.disabled input ~ label,
.bs-radio-button-group.disabled input ~ label {
  color: var(--gray-400) !important;
}

.bs-select-wrap {
  position: relative;
  outline: 0;
  background-color: var(--body-bg);
  color: var(--body-text);
  min-width: 64px;
}

.bs-select-wrap:hover > .selected {
  border-color: var(--border-hover);
}

.bs-select-wrap:focus > .selected {
  border-color: var(--color-focus);
}

.bs-select-wrap > .selected {
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 0 6px;
  min-width: 100%;
  cursor: pointer;
  display: flex;
}

.bs-select-wrap > .selected .label {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.bs-select-wrap > .selected .placeholder {
  color: var(--gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
}

.bs-select-wrap > .selected .dropdown-btn {
  font-family: var(--icon-font-family);
  margin-right: -4px;
  margin-left: 4px;
  user-select: none;
  transition: transform 0.2s linear;
}

.bs-select-wrap.popup-open .dropdown-btn {
  transform: rotate(180deg);
}

.bs-select-wrap.modified > .selected {
  border-color: var(--purple) !important;
}

.bs-select-wrap.error > .selected {
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}

.bs-select-wrap.disabled > .selected {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-500) !important;
}

.bs-select-wrap.view-mode {
  background-color: transparent;
}

.bs-select-wrap .small-progress {
  font-family: var(--icon-font-family);
  font-size: 0.9em;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 0 2px;
  color: var(--gray-400);
  animation: spin 1s linear infinite;
}

.bs-field-error {
  color: var(--color-error);
  margin-top: 4px;
}

.bs-clickable {
  user-select: none;
  cursor: pointer;
}

.bs-clickable:hover {
  filter: opacity(75%);
}

.bs-clickable:active {
  filter: opacity(50%);
}

.bs-clickable.disabled {
  filter: opacity(40%);
}

.component-shadow-base {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}

[data-theme=dark] .component-shadow-base {
  box-shadow: 2px 2px 8px rgba(255, 255, 255, 0.1);
}

.font-icon {
  font-family: var(--icon-font-family);
  font-size: 1rem;
  max-width: 1em;
}

.font-icon.filled {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}

.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}

.fade-enter,
.fade-leave-to {
  opacity: 0;
}

.text-description {
  margin-top: 2px;
  color: var(--gray-400);
  font-size: 0.923em;
}

.bs-drop-position {
  position: absolute;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--primary-400);
  opacity: 0.7;
  z-index: 100;
}

.bs-drop-position.vertical {
  left: 0;
  width: 100%;
  height: 8px;
}

.bs-drop-position.vertical.before {
  top: -4px;
}

.bs-drop-position.vertical.after {
  bottom: -4px;
}

.bs-drop-position.horizontal {
  left: 0;
  width: 8px;
  height: 100%;
}

.bs-drop-position.horizontal.before {
  left: -4px;
}

.bs-drop-position.horizontal.after {
  right: -4px;
}

.bs-droppable-horizontal {
  transition: transform 0.3s ease;
}

.bs-droppable-horizontal.bs-dropping-before, .bs-droppable-horizontal.bs-dropping-after-following {
  transform: translateX(12px);
  z-index: 1;
}

.bs-droppable-horizontal.bs-dropping-after, .bs-droppable-horizontal.bs-dropping-before-preceding {
  transform: translateX(-12px);
  z-index: 1;
}

.bs-dragging-source {
  opacity: 0.5;
}

.bs-radio-button-group {
  display: inline-block;
}

.bs-radio-button-group > .radio-button-group {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 8px;
}

.bs-radio-button-group.vertical > .radio-button-group {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.bs-radio-button-group.switch-style .radio-button-group {
  overflow: hidden;
  gap: 0;
  border-radius: 4px;
  background-color: var(--body-bg);
}

.bs-radio-button-group.switch-style .bs-radio-button {
  position: relative;
}

.bs-radio-button-group.switch-style .bs-radio-button input {
  display: none;
  position: absolute;
}

.bs-radio-button-group.switch-style .bs-radio-button label {
  position: relative;
  padding: 7px;
  color: #999;
  transition: color 0.4s;
}

.bs-radio-button-group.switch-style .bs-radio-button label:after {
  content: "";
  position: absolute;
  top: 0;
  transition: left 0.5s ease;
  height: 100%;
  width: 100%;
  border-radius: 4px;
  background-color: #000;
  z-index: -1;
}

.bs-radio-button-group.switch-style .bs-radio-button:nth-of-type(1) label:after {
  left: 100%;
}

.bs-radio-button-group.switch-style .bs-radio-button:nth-of-type(2) label:after {
  left: -100%;
}

.bs-radio-button-group.switch-style .bs-radio-button.checked label {
  position: relative;
  color: var(--white);
  font-weight: 500;
  z-index: 1;
}

.bs-radio-button-group.switch-style .bs-radio-button.checked label:after {
  left: 0;
}

.bs-radio-button-group.switch-style.disabled .bs-radio-button.checked label {
  color: var(--white) !important;
}

.bs-radio-button-group.switch-style.disabled .bs-radio-button.checked label:after {
  background-color: var(--gray-400);
}

.bs-radio-button-group.button-style .radio-button-group, .bs-radio-button-group.button-group-style .radio-button-group {
  gap: 4px;
}

.bs-radio-button-group.button-style .bs-radio-button input, .bs-radio-button-group.button-group-style .bs-radio-button input {
  display: none;
  position: absolute;
}

.bs-radio-button-group.button-style .bs-radio-button label, .bs-radio-button-group.button-group-style .bs-radio-button label {
  padding: 0 8px;
  border-radius: 2px;
  border: 1px solid var(--border);
  color: var(--body-text);
  line-height: 22.9px;
  white-space: nowrap;
}

.bs-radio-button-group.button-style .bs-radio-button.checked label, .bs-radio-button-group.button-group-style .bs-radio-button.checked label {
  background-color: var(--radio-group);
  border-color: var(--radio-group);
}

.bs-radio-button-group.button-style .bs-radio-button.checked label span, .bs-radio-button-group.button-group-style .bs-radio-button.checked label span {
  color: var(--white);
}

.bs-radio-button-group.button-style.disabled .bs-radio-button.checked label, .bs-radio-button-group.disabled.button-group-style .bs-radio-button.checked label {
  color: var(--white) !important;
}

.bs-radio-button-group.button-style.modified .bs-radio-button.checked label, .bs-radio-button-group.modified.button-group-style .bs-radio-button.checked label {
  background-color: var(--purple);
  border-color: var(--purple);
  color: var(--white) !important;
}

.bs-radio-button-group.button-group-style .radio-button-group {
  gap: 0;
}

.bs-radio-button-group.button-group-style .bs-radio-button:not(:first-child) {
  margin-left: -1px;
}

.bs-radio-button-group.button-group-style .bs-radio-button.checked {
  z-index: 1;
}

.bs-radio-button-group.button-group-style .bs-radio-button > label {
  border-radius: 0;
}

.bs-radio-button-group.button-group-style .bs-radio-button:first-child > label {
  border-top-left-radius: 2px;
  border-bottom-left-radius: 2px;
}

.bs-radio-button-group.button-group-style .bs-radio-button:last-child > label {
  border-top-right-radius: 2px;
  border-bottom-right-radius: 2px;
}

.bs-radio-button-group.button-group-style.disabled .bs-radio-button.checked label {
  color: var(--white) !important;
}

.bs-radio-button-group.button-group-style.modified .radio-button-group {
  border-color: var(--purple);
}

.bs-radio-button-group.button-group-style.modified .bs-radio-button {
  border-color: var(--purple);
}

.bs-radio-button-group.button-group-style.modified .bs-radio-button.checked label {
  background-color: var(--purple);
  color: var(--white) !important;
}

.bs-radio-button-group.nowrap > .radio-button-group {
  flex-wrap: nowrap;
}

.bs-box-component-wrap, .bs-select-wrap, .bs-input-wrap {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: left;
}

.bs-box-component-wrap .message, .bs-select-wrap .message, .bs-input-wrap .message {
  margin-top: 4px;
  font-size: 0.9em;
}

.bs-box-component-base, .bs-select-wrap > .selected, .bs-input-base {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: left;
  background-color: var(--body-bg);
}

.bs-input-wrap .suffix,
.bs-input-wrap .prefix {
  font-size: 0.9em;
  margin-right: 4px;
  margin-left: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}

.bs-input-wrap .suffix:first-child,
.bs-input-wrap .prefix:first-child {
  margin-left: 4px;
}

.bs-input-wrap .suffix .font-icon,
.bs-input-wrap .prefix .font-icon {
  font-size: 0.9em;
}

.bs-input-wrap .suffix img,
.bs-input-wrap .prefix img {
  width: 0.9em;
  height: 0.9em;
}

[data-theme=dark] .bs-input-wrap .suffix img,
[data-theme=dark] .bs-input-wrap .prefix img {
  filter: invert(1);
}

.bs-input-base {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}

.bs-input-base > input {
  border: 0;
  border-radius: 0;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  flex-basis: 1em;
  padding: 0 6px;
  background-color: transparent;
  width: 100%;
  color: var(--body-text);
}

.bs-input-base > textarea {
  border: 0;
  border-radius: 4px;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  padding: 6px;
  line-height: 1.4;
  font-family: sans-serif;
  background-color: var(--body-bg);
  color: var(--body-text);
}

.bs-input-base:hover {
  border-color: var(--border-hover);
}

.bs-input-base:has(:focus) {
  border-color: var(--color-focus);
  border-width: 1px;
}

.bs-text-input.modified > .input-area,
.bs-number-input.modified > .input-area,
.bs-price-input.modified > .input-area,
.bs-date-input.modified > .input-area,
.bs-date-range.modified > .input-area,
.bs-multi-lang-text-input.modified > .input-area,
.bs-multi-lang-text-area.modified > .input-area,
.bs-multi-lang-rich-text.modified > .input-area,
.bs-text-area.modified > .input-area,
.bs-rich-text.modified > .input-area {
  border-color: var(--purple) !important;
}

.bs-text-input.error > .input-area,
.bs-number-input.error > .input-area,
.bs-price-input.error > .input-area,
.bs-date-input.error > .input-area,
.bs-date-range.error > .input-area,
.bs-multi-lang-text-input.error > .input-area,
.bs-multi-lang-text-area.error > .input-area,
.bs-multi-lang-rich-text.error > .input-area,
.bs-text-area.error > .input-area,
.bs-rich-text.error > .input-area {
  border-color: var(--danger) !important;
}

.bs-text-input.error > .input-area > input,
.bs-number-input.error > .input-area > input,
.bs-price-input.error > .input-area > input,
.bs-date-input.error > .input-area > input,
.bs-date-range.error > .input-area > input,
.bs-multi-lang-text-input.error > .input-area > input,
.bs-multi-lang-text-area.error > .input-area > input,
.bs-multi-lang-rich-text.error > .input-area > input,
.bs-text-area.error > .input-area > input,
.bs-rich-text.error > .input-area > input {
  color: var(--danger) !important;
}

.bs-text-input.disabled > .input-area,
.bs-number-input.disabled > .input-area,
.bs-price-input.disabled > .input-area,
.bs-date-input.disabled > .input-area,
.bs-date-range.disabled > .input-area,
.bs-multi-lang-text-input.disabled > .input-area,
.bs-multi-lang-text-area.disabled > .input-area,
.bs-multi-lang-rich-text.disabled > .input-area,
.bs-text-area.disabled > .input-area,
.bs-rich-text.disabled > .input-area {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}

.bs-text-input.disabled > .input-area > input,
.bs-number-input.disabled > .input-area > input,
.bs-price-input.disabled > .input-area > input,
.bs-date-input.disabled > .input-area > input,
.bs-date-range.disabled > .input-area > input,
.bs-multi-lang-text-input.disabled > .input-area > input,
.bs-multi-lang-text-area.disabled > .input-area > input,
.bs-multi-lang-rich-text.disabled > .input-area > input,
.bs-text-area.disabled > .input-area > input,
.bs-rich-text.disabled > .input-area > input {
  color: var(--gray-400) !important;
  background-color: var(--gray-100) !important;
}

.bs-text-input.disabled > .input-area > textarea,
.bs-number-input.disabled > .input-area > textarea,
.bs-price-input.disabled > .input-area > textarea,
.bs-date-input.disabled > .input-area > textarea,
.bs-date-range.disabled > .input-area > textarea,
.bs-multi-lang-text-input.disabled > .input-area > textarea,
.bs-multi-lang-text-area.disabled > .input-area > textarea,
.bs-multi-lang-rich-text.disabled > .input-area > textarea,
.bs-text-area.disabled > .input-area > textarea,
.bs-rich-text.disabled > .input-area > textarea {
  background-color: var(--gray-100) !important;
}

.bs-date-input .view-mode,
.bs-date-range .view-mode {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}

.bs-date-input .view-mode::before,
.bs-date-range .view-mode::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-date-input .extra-dates,
.bs-date-range .extra-dates,
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  color: var(--body-text);
  margin-top: 4px;
}

.bs-date-input .extra-dates .extra-date,
.bs-date-range .extra-dates .extra-date,
.bs-calendar .extra-dates .extra-date,
.bs-calendar-range .extra-dates .extra-date {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8125rem;
}

.bs-date-input .extra-dates .extra-date::before,
.bs-date-range .extra-dates .extra-date::before,
.bs-calendar .extra-dates .extra-date::before,
.bs-calendar-range .extra-dates .extra-date::before {
  content: "globe";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}

.bs-checkbox-base, .bs-checkbox {
  display: inline-block;
  color: var(--body-text);
  white-space: nowrap;
}

.bs-checkbox-base input, .bs-checkbox input {
  appearance: none;
  margin: 0;
  outline: 0;
}

.bs-checkbox-base input::before, .bs-checkbox input::before {
  font-family: var(--icon-font-family);
  font-size: 20px;
  vertical-align: middle;
  cursor: pointer;
  color: var(--body-text);
}

.bs-checkbox-base input:hover, .bs-checkbox input:hover {
  color: var(--gray-500);
}

.bs-checkbox-base input:hover ~ label, .bs-checkbox input:hover ~ label {
  color: var(--gray-500);
}

.bs-checkbox-base input:focus::before, .bs-checkbox input:focus::before {
  color: var(--color-focus);
}

.bs-checkbox-base input:focus ~ label, .bs-checkbox input:focus ~ label {
  color: var(--color-focus);
}

.bs-checkbox-base.modified input::before, .modified.bs-checkbox input::before {
  color: var(--purple) !important;
}

.bs-checkbox-base.modified input ~ label, .modified.bs-checkbox input ~ label {
  color: var(--purple) !important;
}

.bs-checkbox-base.error input::before, .error.bs-checkbox input::before {
  color: var(--danger) !important;
}

.bs-checkbox-base.error input ~ label, .error.bs-checkbox input ~ label {
  color: var(--danger) !important;
}

.bs-checkbox-base.disabled input::before, .disabled.bs-checkbox input::before {
  color: var(--gray-400) !important;
}

.bs-checkbox-base.disabled input ~ label, .disabled.bs-checkbox input ~ label {
  color: var(--gray-400) !important;
}

.bs-checkbox-base label, .bs-checkbox label {
  display: inline-block;
  vertical-align: middle;
  padding: 4px 2px;
  cursor: pointer;
}

.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input::before {
  color: var(--purple) !important;
}

.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input ~ label {
  color: var(--purple) !important;
}

.bs-checkbox-group.error .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input::before {
  color: var(--danger) !important;
}

.bs-checkbox-group.error .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input ~ label {
  color: var(--danger) !important;
}

.bs-checkbox-group.disabled input::before,
.bs-radio-button-group.disabled input::before {
  color: var(--gray-400) !important;
}

.bs-checkbox-group.disabled input ~ label,
.bs-radio-button-group.disabled input ~ label {
  color: var(--gray-400) !important;
}

.bs-select-wrap {
  position: relative;
  outline: 0;
  background-color: var(--body-bg);
  color: var(--body-text);
  min-width: 64px;
}

.bs-select-wrap:hover > .selected {
  border-color: var(--border-hover);
}

.bs-select-wrap:focus > .selected {
  border-color: var(--color-focus);
}

.bs-select-wrap > .selected {
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 0 6px;
  min-width: 100%;
  cursor: pointer;
  display: flex;
}

.bs-select-wrap > .selected .label {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.bs-select-wrap > .selected .placeholder {
  color: var(--gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
}

.bs-select-wrap > .selected .dropdown-btn {
  font-family: var(--icon-font-family);
  margin-right: -4px;
  margin-left: 4px;
  user-select: none;
  transition: transform 0.2s linear;
}

.bs-select-wrap.popup-open .dropdown-btn {
  transform: rotate(180deg);
}

.bs-select-wrap.modified > .selected {
  border-color: var(--purple) !important;
}

.bs-select-wrap.error > .selected {
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}

.bs-select-wrap.disabled > .selected {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-500) !important;
}

.bs-select-wrap.view-mode {
  background-color: transparent;
}

.bs-select-wrap .small-progress {
  font-family: var(--icon-font-family);
  font-size: 0.9em;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 0 2px;
  color: var(--gray-400);
  animation: spin 1s linear infinite;
}

.bs-field-error {
  color: var(--color-error);
  margin-top: 4px;
}

.bs-clickable {
  user-select: none;
  cursor: pointer;
}

.bs-clickable:hover {
  filter: opacity(75%);
}

.bs-clickable:active {
  filter: opacity(50%);
}

.bs-clickable.disabled {
  filter: opacity(40%);
}

.component-shadow-base {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}

[data-theme=dark] .component-shadow-base {
  box-shadow: 2px 2px 8px rgba(255, 255, 255, 0.1);
}

.font-icon {
  font-family: var(--icon-font-family);
  font-size: 1rem;
  max-width: 1em;
}

.font-icon.filled {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}

.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}

.fade-enter,
.fade-leave-to {
  opacity: 0;
}

.text-description {
  margin-top: 2px;
  color: var(--gray-400);
  font-size: 0.923em;
}

.bs-drop-position {
  position: absolute;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--primary-400);
  opacity: 0.7;
  z-index: 100;
}

.bs-drop-position.vertical {
  left: 0;
  width: 100%;
  height: 8px;
}

.bs-drop-position.vertical.before {
  top: -4px;
}

.bs-drop-position.vertical.after {
  bottom: -4px;
}

.bs-drop-position.horizontal {
  left: 0;
  width: 8px;
  height: 100%;
}

.bs-drop-position.horizontal.before {
  left: -4px;
}

.bs-drop-position.horizontal.after {
  right: -4px;
}

.bs-droppable-horizontal {
  transition: transform 0.3s ease;
}

.bs-droppable-horizontal.bs-dropping-before, .bs-droppable-horizontal.bs-dropping-after-following {
  transform: translateX(12px);
  z-index: 1;
}

.bs-droppable-horizontal.bs-dropping-after, .bs-droppable-horizontal.bs-dropping-before-preceding {
  transform: translateX(-12px);
  z-index: 1;
}

.bs-dragging-source {
  opacity: 0.5;
}

.bs-checkbox input::before {
  content: "check_box_outline_blank";
}

.bs-checkbox.checked input::before {
  content: "check_box";
}

.bs-checkbox.reverted.checked input::before {
  font-variation-settings: "FILL" 1, "wght" 500, "GRAD" 0, "opsz" 48;
}

.bs-checkbox-group {
  display: inline-block;
}

.bs-checkbox-group > .items {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 8px;
}

.bs-checkbox-group.vertical > .items {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.bs-checkbox-group.nowrap > .items {
  flex-wrap: nowrap;
}

.bs-box-component-wrap, .bs-select-wrap, .bs-multi-select, .bs-input-wrap {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: left;
}

.bs-box-component-wrap .message, .bs-select-wrap .message, .bs-multi-select .message, .bs-input-wrap .message {
  margin-top: 4px;
  font-size: 0.9em;
}

.bs-box-component-base, .bs-select-wrap > .selected, .bs-multi-select > .selected, .bs-input-base {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: left;
  background-color: var(--body-bg);
}

.bs-input-wrap .suffix,
.bs-input-wrap .prefix {
  font-size: 0.9em;
  margin-right: 4px;
  margin-left: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}

.bs-input-wrap .suffix:first-child,
.bs-input-wrap .prefix:first-child {
  margin-left: 4px;
}

.bs-input-wrap .suffix .font-icon,
.bs-input-wrap .prefix .font-icon {
  font-size: 0.9em;
}

.bs-input-wrap .suffix img,
.bs-input-wrap .prefix img {
  width: 0.9em;
  height: 0.9em;
}

[data-theme=dark] .bs-input-wrap .suffix img,
[data-theme=dark] .bs-input-wrap .prefix img {
  filter: invert(1);
}

.bs-input-base {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}

.bs-input-base > input {
  border: 0;
  border-radius: 0;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  flex-basis: 1em;
  padding: 0 6px;
  background-color: transparent;
  width: 100%;
  color: var(--body-text);
}

.bs-input-base > textarea {
  border: 0;
  border-radius: 4px;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  padding: 6px;
  line-height: 1.4;
  font-family: sans-serif;
  background-color: var(--body-bg);
  color: var(--body-text);
}

.bs-input-base:hover {
  border-color: var(--border-hover);
}

.bs-input-base:has(:focus) {
  border-color: var(--color-focus);
  border-width: 1px;
}

.bs-text-input.modified > .input-area,
.bs-number-input.modified > .input-area,
.bs-price-input.modified > .input-area,
.bs-date-input.modified > .input-area,
.bs-date-range.modified > .input-area,
.bs-multi-lang-text-input.modified > .input-area,
.bs-multi-lang-text-area.modified > .input-area,
.bs-multi-lang-rich-text.modified > .input-area,
.bs-text-area.modified > .input-area,
.bs-rich-text.modified > .input-area {
  border-color: var(--purple) !important;
}

.bs-text-input.error > .input-area,
.bs-number-input.error > .input-area,
.bs-price-input.error > .input-area,
.bs-date-input.error > .input-area,
.bs-date-range.error > .input-area,
.bs-multi-lang-text-input.error > .input-area,
.bs-multi-lang-text-area.error > .input-area,
.bs-multi-lang-rich-text.error > .input-area,
.bs-text-area.error > .input-area,
.bs-rich-text.error > .input-area {
  border-color: var(--danger) !important;
}

.bs-text-input.error > .input-area > input,
.bs-number-input.error > .input-area > input,
.bs-price-input.error > .input-area > input,
.bs-date-input.error > .input-area > input,
.bs-date-range.error > .input-area > input,
.bs-multi-lang-text-input.error > .input-area > input,
.bs-multi-lang-text-area.error > .input-area > input,
.bs-multi-lang-rich-text.error > .input-area > input,
.bs-text-area.error > .input-area > input,
.bs-rich-text.error > .input-area > input {
  color: var(--danger) !important;
}

.bs-text-input.disabled > .input-area,
.bs-number-input.disabled > .input-area,
.bs-price-input.disabled > .input-area,
.bs-date-input.disabled > .input-area,
.bs-date-range.disabled > .input-area,
.bs-multi-lang-text-input.disabled > .input-area,
.bs-multi-lang-text-area.disabled > .input-area,
.bs-multi-lang-rich-text.disabled > .input-area,
.bs-text-area.disabled > .input-area,
.bs-rich-text.disabled > .input-area {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}

.bs-text-input.disabled > .input-area > input,
.bs-number-input.disabled > .input-area > input,
.bs-price-input.disabled > .input-area > input,
.bs-date-input.disabled > .input-area > input,
.bs-date-range.disabled > .input-area > input,
.bs-multi-lang-text-input.disabled > .input-area > input,
.bs-multi-lang-text-area.disabled > .input-area > input,
.bs-multi-lang-rich-text.disabled > .input-area > input,
.bs-text-area.disabled > .input-area > input,
.bs-rich-text.disabled > .input-area > input {
  color: var(--gray-400) !important;
  background-color: var(--gray-100) !important;
}

.bs-text-input.disabled > .input-area > textarea,
.bs-number-input.disabled > .input-area > textarea,
.bs-price-input.disabled > .input-area > textarea,
.bs-date-input.disabled > .input-area > textarea,
.bs-date-range.disabled > .input-area > textarea,
.bs-multi-lang-text-input.disabled > .input-area > textarea,
.bs-multi-lang-text-area.disabled > .input-area > textarea,
.bs-multi-lang-rich-text.disabled > .input-area > textarea,
.bs-text-area.disabled > .input-area > textarea,
.bs-rich-text.disabled > .input-area > textarea {
  background-color: var(--gray-100) !important;
}

.bs-date-input .view-mode,
.bs-date-range .view-mode {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}

.bs-date-input .view-mode::before,
.bs-date-range .view-mode::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-date-input .extra-dates,
.bs-date-range .extra-dates,
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  color: var(--body-text);
  margin-top: 4px;
}

.bs-date-input .extra-dates .extra-date,
.bs-date-range .extra-dates .extra-date,
.bs-calendar .extra-dates .extra-date,
.bs-calendar-range .extra-dates .extra-date {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8125rem;
}

.bs-date-input .extra-dates .extra-date::before,
.bs-date-range .extra-dates .extra-date::before,
.bs-calendar .extra-dates .extra-date::before,
.bs-calendar-range .extra-dates .extra-date::before {
  content: "globe";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}

.bs-checkbox-base {
  display: inline-block;
  color: var(--body-text);
  white-space: nowrap;
}

.bs-checkbox-base input {
  appearance: none;
  margin: 0;
  outline: 0;
}

.bs-checkbox-base input::before {
  font-family: var(--icon-font-family);
  font-size: 20px;
  vertical-align: middle;
  cursor: pointer;
  color: var(--body-text);
}

.bs-checkbox-base input:hover {
  color: var(--gray-500);
}

.bs-checkbox-base input:hover ~ label {
  color: var(--gray-500);
}

.bs-checkbox-base input:focus::before {
  color: var(--color-focus);
}

.bs-checkbox-base input:focus ~ label {
  color: var(--color-focus);
}

.bs-checkbox-base.modified input::before {
  color: var(--purple) !important;
}

.bs-checkbox-base.modified input ~ label {
  color: var(--purple) !important;
}

.bs-checkbox-base.error input::before {
  color: var(--danger) !important;
}

.bs-checkbox-base.error input ~ label {
  color: var(--danger) !important;
}

.bs-checkbox-base.disabled input::before {
  color: var(--gray-400) !important;
}

.bs-checkbox-base.disabled input ~ label {
  color: var(--gray-400) !important;
}

.bs-checkbox-base label {
  display: inline-block;
  vertical-align: middle;
  padding: 4px 2px;
  cursor: pointer;
}

.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input::before {
  color: var(--purple) !important;
}

.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input ~ label {
  color: var(--purple) !important;
}

.bs-checkbox-group.error .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input::before {
  color: var(--danger) !important;
}

.bs-checkbox-group.error .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input ~ label {
  color: var(--danger) !important;
}

.bs-checkbox-group.disabled input::before,
.bs-radio-button-group.disabled input::before {
  color: var(--gray-400) !important;
}

.bs-checkbox-group.disabled input ~ label,
.bs-radio-button-group.disabled input ~ label {
  color: var(--gray-400) !important;
}

.bs-select-wrap, .bs-multi-select {
  position: relative;
  outline: 0;
  background-color: var(--body-bg);
  color: var(--body-text);
  min-width: 64px;
}

.bs-select-wrap:hover > .selected, .bs-multi-select:hover > .selected {
  border-color: var(--border-hover);
}

.bs-select-wrap:focus > .selected, .bs-multi-select:focus > .selected {
  border-color: var(--color-focus);
}

.bs-select-wrap > .selected, .bs-multi-select > .selected {
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 0 6px;
  min-width: 100%;
  cursor: pointer;
  display: flex;
}

.bs-select-wrap > .selected .label, .bs-multi-select > .selected .label {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.bs-select-wrap > .selected .placeholder, .bs-multi-select > .selected .placeholder {
  color: var(--gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
}

.bs-select-wrap > .selected .dropdown-btn, .bs-multi-select > .selected .dropdown-btn {
  font-family: var(--icon-font-family);
  margin-right: -4px;
  margin-left: 4px;
  user-select: none;
  transition: transform 0.2s linear;
}

.bs-select-wrap.popup-open .dropdown-btn, .popup-open.bs-multi-select .dropdown-btn {
  transform: rotate(180deg);
}

.bs-select-wrap.modified > .selected, .modified.bs-multi-select > .selected {
  border-color: var(--purple) !important;
}

.bs-select-wrap.error > .selected, .error.bs-multi-select > .selected {
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}

.bs-select-wrap.disabled > .selected, .disabled.bs-multi-select > .selected {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-500) !important;
}

.bs-select-wrap.view-mode, .view-mode.bs-multi-select {
  background-color: transparent;
}

.bs-select-wrap .small-progress, .bs-multi-select .small-progress {
  font-family: var(--icon-font-family);
  font-size: 0.9em;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 0 2px;
  color: var(--gray-400);
  animation: spin 1s linear infinite;
}

.bs-field-error {
  color: var(--color-error);
  margin-top: 4px;
}

.bs-clickable {
  user-select: none;
  cursor: pointer;
}

.bs-clickable:hover {
  filter: opacity(75%);
}

.bs-clickable:active {
  filter: opacity(50%);
}

.bs-clickable.disabled {
  filter: opacity(40%);
}

.component-shadow-base {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}

[data-theme=dark] .component-shadow-base {
  box-shadow: 2px 2px 8px rgba(255, 255, 255, 0.1);
}

.font-icon {
  font-family: var(--icon-font-family);
  font-size: 1rem;
  max-width: 1em;
}

.font-icon.filled {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}

.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}

.fade-enter,
.fade-leave-to {
  opacity: 0;
}

.text-description {
  margin-top: 2px;
  color: var(--gray-400);
  font-size: 0.923em;
}

.bs-drop-position {
  position: absolute;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--primary-400);
  opacity: 0.7;
  z-index: 100;
}

.bs-drop-position.vertical {
  left: 0;
  width: 100%;
  height: 8px;
}

.bs-drop-position.vertical.before {
  top: -4px;
}

.bs-drop-position.vertical.after {
  bottom: -4px;
}

.bs-drop-position.horizontal {
  left: 0;
  width: 8px;
  height: 100%;
}

.bs-drop-position.horizontal.before {
  left: -4px;
}

.bs-drop-position.horizontal.after {
  right: -4px;
}

.bs-droppable-horizontal {
  transition: transform 0.3s ease;
}

.bs-droppable-horizontal.bs-dropping-before, .bs-droppable-horizontal.bs-dropping-after-following {
  transform: translateX(12px);
  z-index: 1;
}

.bs-droppable-horizontal.bs-dropping-after, .bs-droppable-horizontal.bs-dropping-before-preceding {
  transform: translateX(-12px);
  z-index: 1;
}

.bs-dragging-source {
  opacity: 0.5;
}

.bs-multi-select .label {
  margin-right: 4px;
}

.bs-multi-select .label:not(:last-child)::after {
  content: ",";
} /* Layout Utility */
.flex-row, .bs-layout-horizontal, .bs-tree-row .row-caption, .bs-layout-horizontal-wrap {
  display: flex;
  flex-direction: row;
}

.flex-row-inline, .bs-layout-horizontal-inline {
  display: inline-flex;
  flex-direction: row;
}

.flex-column, .bs-layout-vertical, .bs-layout-vertical-wrap {
  display: flex;
  flex-direction: column;
}

.flex-column-inline, .bs-layout-vertical-inline {
  display: inline-flex;
  flex-direction: column;
}

.flex-wrap, .bs-layout-vertical-wrap, .bs-layout-horizontal-wrap {
  flex-wrap: wrap;
}

.flex-grow-0 {
  flex-grow: 0;
}

.flex-shrink-0 {
  flex-shrink: 0;
}

.flex-grow-1 {
  flex-grow: 1;
}

.flex-shrink-1 {
  flex-shrink: 1;
}

.flex-grow-2 {
  flex-grow: 2;
}

.flex-shrink-2 {
  flex-shrink: 2;
}

.flex-grow-3 {
  flex-grow: 3;
}

.flex-shrink-3 {
  flex-shrink: 3;
}

.flex-grow-4 {
  flex-grow: 4;
}

.flex-shrink-4 {
  flex-shrink: 4;
}

.flex-grow-5 {
  flex-grow: 5;
}

.flex-shrink-5 {
  flex-shrink: 5;
}

.flex-grow-6 {
  flex-grow: 6;
}

.flex-shrink-6 {
  flex-shrink: 6;
}

.flex-grow-7 {
  flex-grow: 7;
}

.flex-shrink-7 {
  flex-shrink: 7;
}

.flex-grow-8 {
  flex-grow: 8;
}

.flex-shrink-8 {
  flex-shrink: 8;
}

.gap-0 {
  gap: 0px;
}

.gap-1 {
  gap: 1px;
}

.gap-2 {
  gap: 2px;
}

.gap-3 {
  gap: 3px;
}

.gap-4 {
  gap: 4px;
}

.gap-5 {
  gap: 5px;
}

.gap-6 {
  gap: 6px;
}

.gap-7 {
  gap: 7px;
}

.gap-8 {
  gap: 8px;
}

.gap-9 {
  gap: 9px;
}

.gap-10 {
  gap: 10px;
}

.gap-11 {
  gap: 11px;
}

.gap-12 {
  gap: 12px;
}

.gap-13 {
  gap: 13px;
}

.gap-14 {
  gap: 14px;
}

.gap-15 {
  gap: 15px;
}

.gap-16 {
  gap: 16px;
}

.gap-17 {
  gap: 17px;
}

.gap-18 {
  gap: 18px;
}

.gap-19 {
  gap: 19px;
}

.gap-20 {
  gap: 20px;
}

.gap-21 {
  gap: 21px;
}

.gap-22 {
  gap: 22px;
}

.gap-23 {
  gap: 23px;
}

.gap-24 {
  gap: 24px;
}

.gap-25 {
  gap: 25px;
}

.gap-26 {
  gap: 26px;
}

.gap-27 {
  gap: 27px;
}

.gap-28 {
  gap: 28px;
}

.gap-29 {
  gap: 29px;
}

.gap-30 {
  gap: 30px;
}

.gap-31 {
  gap: 31px;
}

.gap-32 {
  gap: 32px;
}

.gap-33 {
  gap: 33px;
}

.gap-34 {
  gap: 34px;
}

.gap-35 {
  gap: 35px;
}

.gap-36 {
  gap: 36px;
}

.gap-37 {
  gap: 37px;
}

.gap-38 {
  gap: 38px;
}

.gap-39 {
  gap: 39px;
}

.gap-40 {
  gap: 40px;
}

.gap-41 {
  gap: 41px;
}

.gap-42 {
  gap: 42px;
}

.gap-43 {
  gap: 43px;
}

.gap-44 {
  gap: 44px;
}

.gap-45 {
  gap: 45px;
}

.gap-46 {
  gap: 46px;
}

.gap-47 {
  gap: 47px;
}

.gap-48 {
  gap: 48px;
}

.gap-49 {
  gap: 49px;
}

.gap-50 {
  gap: 50px;
}

.gap-51 {
  gap: 51px;
}

.gap-52 {
  gap: 52px;
}

.gap-53 {
  gap: 53px;
}

.gap-54 {
  gap: 54px;
}

.gap-55 {
  gap: 55px;
}

.gap-56 {
  gap: 56px;
}

.gap-57 {
  gap: 57px;
}

.gap-58 {
  gap: 58px;
}

.gap-59 {
  gap: 59px;
}

.gap-60 {
  gap: 60px;
}

.gap-61 {
  gap: 61px;
}

.gap-62 {
  gap: 62px;
}

.gap-63 {
  gap: 63px;
}

.gap-64 {
  gap: 64px;
}

.flex-align-start {
  align-items: flex-start;
}

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

.flex-align-end {
  align-items: flex-end;
}

.flex-content-start {
  justify-content: flex-start;
}

.flex-content-center {
  justify-content: center;
}

.flex-content-end {
  justify-content: flex-end;
}

/* Bluesea Layout */
.bs-layout-form {
  border-bottom: 1px solid var(--border);
}

.bs-layout-form > div {
  display: flex;
  align-items: center;
}

.bs-layout-form > div > .title {
  padding: 8px 16px;
  width: 12.3076em;
  line-height: 1.2em;
  color: var(--body-text);
}

.bs-layout-form > div > :not(.title) {
  padding: 8px;
  width: 10em;
  flex-grow: 1;
  color: var(--body-text);
}

.bs-layout-form > div:nth-child(odd) {
  background-color: var(--gray-100);
}

.bs-layout-form.title-w-8 > div > .title {
  width: 8em;
}

.bs-layout-form.title-w-10 > div > .title {
  width: 10em;
}

.bs-layout-form.title-w-14 > div > .title {
  width: 14em;
}

.bs-layout-form.title-w-16 > div > .title {
  width: 16em;
}

.bs-layout-form.title-w-18 > div > .title {
  width: 18em;
}

.bs-layout-form.title-w-20 > div > .title {
  width: 20em;
}

.bs-layout-card > .card-title {
  padding: 16px 0;
  border-bottom: 0.8px solid var(--border-light);
  font-size: 1.2em;
  font-weight: 500;
}

.bs-layout-table {
  border-collapse: collapse;
}

.bs-layout-table > tr > td, .bs-layout-table > tr > th, .bs-layout-table > tbody > tr > td, .bs-layout-table > tbody > tr > th {
  padding: 8px;
  border: 1px solid var(--border);
  vertical-align: middle;
  text-align: left;
}

.bs-layout-table > tr > td:first-child, .bs-layout-table > tr > th:first-child, .bs-layout-table > tbody > tr > td:first-child, .bs-layout-table > tbody > tr > th:first-child {
  border-left: 0;
}

.bs-layout-table > tr > td:last-child, .bs-layout-table > tr > th:last-child, .bs-layout-table > tbody > tr > td:last-child, .bs-layout-table > tbody > tr > th:last-child {
  border-right: 0;
}

.bs-tree-row .row-caption {
  position: relative;
  align-items: center;
  height: 28px;
  padding: 0 3px;
  border-radius: 4px;
  cursor: pointer;
  border: 1px solid transparent;
}

.bs-tree-row .row-caption.selected {
  background-color: var(--blue-bg);
}

.bs-tree-row .row-caption.selected .caption {
  color: var(--blue);
  font-weight: bold;
}

.bs-tree-row .row-caption.focused {
  border: 1px solid var(--blue);
}

.bs-tree-row .row-caption .caption {
  padding: 3px;
  cursor: pointer;
  user-select: none;
  flex-grow: 1;
  white-space: nowrap;
}

.bs-tree-row .row-caption > .expand-icon {
  transform: rotate(-90deg);
  transition: transform 300ms ease;
}

.bs-tree-row .row-caption > .expand-icon.open {
  transform: none;
}

.bs-tree-row .row-caption > .expand-icon:not(.need-expand) {
  visibility: hidden;
}

.bs-tree-row .row-caption > .move-buttons {
  display: none;
  position: absolute;
  right: 0;
}

.bs-tree-row .row-caption > .move-buttons > .font-icon {
  padding: 0 2px;
  border-radius: 50%;
  margin: 0 2px;
  background-color: var(--body-bg);
}

.bs-tree-row .row-caption > .move-buttons > .font-icon:hover {
  opacity: 1;
  filter: opacity(1);
}

.bs-tree-row .row-caption:hover {
  background-color: var(--gray-200);
}

.bs-tree-row .row-caption:hover > .move-buttons {
  display: inline;
}

.bs-tree-row .row-caption.selected {
  background-color: var(--primary-100);
}

.bs-tree-row .row-caption.disabled {
  color: var(--gray-400);
}

.bs-tree-row .row-caption.disabled .caption.selected {
  color: var(--primary-400);
}

.bs-tree-row .child-rows {
  margin-left: 12px;
}

.bs-tree.compact .bs-tree-row .row-caption {
  height: 24px;
}

.bs-tree.compact .bs-tree-row .row-caption .caption {
  padding: 2px 4px;
}

.bs-tree {
  overflow: auto;
  position: relative;
  outline: 0;
}

.bs-tree > .tree-wrap {
  min-width: max-content;
}

.bs-tree .bs-tree-row .row-caption > .bs-tree-position-mark {
  border: 1px solid var(--primary);
  background-color: var(--primary-400);
  opacity: 0.3;
  border-radius: 2px;
  z-index: 1;
}

.bs-tree .bs-tree-row:first-child > .row-caption > .bs-tree-position-mark.top {
  transform: translateY(2px);
}

.bs-tree .bs-tree-row:last-child > .row-caption > .bs-tree-position-mark.bottom {
  transform: translateY(-2px);
}

.bs-box-component-wrap, .bs-select-wrap, .bs-tree-select, .bs-input-wrap {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: left;
}

.bs-box-component-wrap .message, .bs-select-wrap .message, .bs-tree-select .message, .bs-input-wrap .message {
  margin-top: 4px;
  font-size: 0.9em;
}

.bs-box-component-base, .bs-select-wrap > .selected, .bs-tree-select > .selected, .bs-input-base {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: left;
  background-color: var(--body-bg);
}

.bs-input-wrap .suffix,
.bs-input-wrap .prefix {
  font-size: 0.9em;
  margin-right: 4px;
  margin-left: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}

.bs-input-wrap .suffix:first-child,
.bs-input-wrap .prefix:first-child {
  margin-left: 4px;
}

.bs-input-wrap .suffix .font-icon,
.bs-input-wrap .prefix .font-icon {
  font-size: 0.9em;
}

.bs-input-wrap .suffix img,
.bs-input-wrap .prefix img {
  width: 0.9em;
  height: 0.9em;
}

[data-theme=dark] .bs-input-wrap .suffix img,
[data-theme=dark] .bs-input-wrap .prefix img {
  filter: invert(1);
}

.bs-input-base {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}

.bs-input-base > input {
  border: 0;
  border-radius: 0;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  flex-basis: 1em;
  padding: 0 6px;
  background-color: transparent;
  width: 100%;
  color: var(--body-text);
}

.bs-input-base > textarea {
  border: 0;
  border-radius: 4px;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  padding: 6px;
  line-height: 1.4;
  font-family: sans-serif;
  background-color: var(--body-bg);
  color: var(--body-text);
}

.bs-input-base:hover {
  border-color: var(--border-hover);
}

.bs-input-base:has(:focus) {
  border-color: var(--color-focus);
  border-width: 1px;
}

.bs-text-input.modified > .input-area,
.bs-number-input.modified > .input-area,
.bs-price-input.modified > .input-area,
.bs-date-input.modified > .input-area,
.bs-date-range.modified > .input-area,
.bs-multi-lang-text-input.modified > .input-area,
.bs-multi-lang-text-area.modified > .input-area,
.bs-multi-lang-rich-text.modified > .input-area,
.bs-text-area.modified > .input-area,
.bs-rich-text.modified > .input-area {
  border-color: var(--purple) !important;
}

.bs-text-input.error > .input-area,
.bs-number-input.error > .input-area,
.bs-price-input.error > .input-area,
.bs-date-input.error > .input-area,
.bs-date-range.error > .input-area,
.bs-multi-lang-text-input.error > .input-area,
.bs-multi-lang-text-area.error > .input-area,
.bs-multi-lang-rich-text.error > .input-area,
.bs-text-area.error > .input-area,
.bs-rich-text.error > .input-area {
  border-color: var(--danger) !important;
}

.bs-text-input.error > .input-area > input,
.bs-number-input.error > .input-area > input,
.bs-price-input.error > .input-area > input,
.bs-date-input.error > .input-area > input,
.bs-date-range.error > .input-area > input,
.bs-multi-lang-text-input.error > .input-area > input,
.bs-multi-lang-text-area.error > .input-area > input,
.bs-multi-lang-rich-text.error > .input-area > input,
.bs-text-area.error > .input-area > input,
.bs-rich-text.error > .input-area > input {
  color: var(--danger) !important;
}

.bs-text-input.disabled > .input-area,
.bs-number-input.disabled > .input-area,
.bs-price-input.disabled > .input-area,
.bs-date-input.disabled > .input-area,
.bs-date-range.disabled > .input-area,
.bs-multi-lang-text-input.disabled > .input-area,
.bs-multi-lang-text-area.disabled > .input-area,
.bs-multi-lang-rich-text.disabled > .input-area,
.bs-text-area.disabled > .input-area,
.bs-rich-text.disabled > .input-area {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}

.bs-text-input.disabled > .input-area > input,
.bs-number-input.disabled > .input-area > input,
.bs-price-input.disabled > .input-area > input,
.bs-date-input.disabled > .input-area > input,
.bs-date-range.disabled > .input-area > input,
.bs-multi-lang-text-input.disabled > .input-area > input,
.bs-multi-lang-text-area.disabled > .input-area > input,
.bs-multi-lang-rich-text.disabled > .input-area > input,
.bs-text-area.disabled > .input-area > input,
.bs-rich-text.disabled > .input-area > input {
  color: var(--gray-400) !important;
  background-color: var(--gray-100) !important;
}

.bs-text-input.disabled > .input-area > textarea,
.bs-number-input.disabled > .input-area > textarea,
.bs-price-input.disabled > .input-area > textarea,
.bs-date-input.disabled > .input-area > textarea,
.bs-date-range.disabled > .input-area > textarea,
.bs-multi-lang-text-input.disabled > .input-area > textarea,
.bs-multi-lang-text-area.disabled > .input-area > textarea,
.bs-multi-lang-rich-text.disabled > .input-area > textarea,
.bs-text-area.disabled > .input-area > textarea,
.bs-rich-text.disabled > .input-area > textarea {
  background-color: var(--gray-100) !important;
}

.bs-date-input .view-mode,
.bs-date-range .view-mode {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}

.bs-date-input .view-mode::before,
.bs-date-range .view-mode::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-date-input .extra-dates,
.bs-date-range .extra-dates,
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  color: var(--body-text);
  margin-top: 4px;
}

.bs-date-input .extra-dates .extra-date,
.bs-date-range .extra-dates .extra-date,
.bs-calendar .extra-dates .extra-date,
.bs-calendar-range .extra-dates .extra-date {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8125rem;
}

.bs-date-input .extra-dates .extra-date::before,
.bs-date-range .extra-dates .extra-date::before,
.bs-calendar .extra-dates .extra-date::before,
.bs-calendar-range .extra-dates .extra-date::before {
  content: "globe";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}

.bs-checkbox-base {
  display: inline-block;
  color: var(--body-text);
  white-space: nowrap;
}

.bs-checkbox-base input {
  appearance: none;
  margin: 0;
  outline: 0;
}

.bs-checkbox-base input::before {
  font-family: var(--icon-font-family);
  font-size: 20px;
  vertical-align: middle;
  cursor: pointer;
  color: var(--body-text);
}

.bs-checkbox-base input:hover {
  color: var(--gray-500);
}

.bs-checkbox-base input:hover ~ label {
  color: var(--gray-500);
}

.bs-checkbox-base input:focus::before {
  color: var(--color-focus);
}

.bs-checkbox-base input:focus ~ label {
  color: var(--color-focus);
}

.bs-checkbox-base.modified input::before {
  color: var(--purple) !important;
}

.bs-checkbox-base.modified input ~ label {
  color: var(--purple) !important;
}

.bs-checkbox-base.error input::before {
  color: var(--danger) !important;
}

.bs-checkbox-base.error input ~ label {
  color: var(--danger) !important;
}

.bs-checkbox-base.disabled input::before {
  color: var(--gray-400) !important;
}

.bs-checkbox-base.disabled input ~ label {
  color: var(--gray-400) !important;
}

.bs-checkbox-base label {
  display: inline-block;
  vertical-align: middle;
  padding: 4px 2px;
  cursor: pointer;
}

.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input::before {
  color: var(--purple) !important;
}

.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input ~ label {
  color: var(--purple) !important;
}

.bs-checkbox-group.error .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input::before {
  color: var(--danger) !important;
}

.bs-checkbox-group.error .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input ~ label {
  color: var(--danger) !important;
}

.bs-checkbox-group.disabled input::before,
.bs-radio-button-group.disabled input::before {
  color: var(--gray-400) !important;
}

.bs-checkbox-group.disabled input ~ label,
.bs-radio-button-group.disabled input ~ label {
  color: var(--gray-400) !important;
}

.bs-select-wrap, .bs-tree-select {
  position: relative;
  outline: 0;
  background-color: var(--body-bg);
  color: var(--body-text);
  min-width: 64px;
}

.bs-select-wrap:hover > .selected, .bs-tree-select:hover > .selected {
  border-color: var(--border-hover);
}

.bs-select-wrap:focus > .selected, .bs-tree-select:focus > .selected {
  border-color: var(--color-focus);
}

.bs-select-wrap > .selected, .bs-tree-select > .selected {
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 0 6px;
  min-width: 100%;
  cursor: pointer;
  display: flex;
}

.bs-select-wrap > .selected .label, .bs-tree-select > .selected .label {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.bs-select-wrap > .selected .placeholder, .bs-tree-select > .selected .placeholder {
  color: var(--gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
}

.bs-select-wrap > .selected .dropdown-btn, .bs-tree-select > .selected .dropdown-btn {
  font-family: var(--icon-font-family);
  margin-right: -4px;
  margin-left: 4px;
  user-select: none;
  transition: transform 0.2s linear;
}

.bs-select-wrap.popup-open .dropdown-btn, .popup-open.bs-tree-select .dropdown-btn {
  transform: rotate(180deg);
}

.bs-select-wrap.modified > .selected, .modified.bs-tree-select > .selected {
  border-color: var(--purple) !important;
}

.bs-select-wrap.error > .selected, .error.bs-tree-select > .selected {
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}

.bs-select-wrap.disabled > .selected, .disabled.bs-tree-select > .selected {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-500) !important;
}

.bs-select-wrap.view-mode, .view-mode.bs-tree-select {
  background-color: transparent;
}

.bs-select-wrap .small-progress, .bs-tree-select .small-progress {
  font-family: var(--icon-font-family);
  font-size: 0.9em;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 0 2px;
  color: var(--gray-400);
  animation: spin 1s linear infinite;
}

.bs-field-error {
  color: var(--color-error);
  margin-top: 4px;
}

.bs-clickable {
  user-select: none;
  cursor: pointer;
}

.bs-clickable:hover {
  filter: opacity(75%);
}

.bs-clickable:active {
  filter: opacity(50%);
}

.bs-clickable.disabled {
  filter: opacity(40%);
}

.component-shadow-base {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}

[data-theme=dark] .component-shadow-base {
  box-shadow: 2px 2px 8px rgba(255, 255, 255, 0.1);
}

.font-icon {
  font-family: var(--icon-font-family);
  font-size: 1rem;
  max-width: 1em;
}

.font-icon.filled {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}

.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}

.fade-enter,
.fade-leave-to {
  opacity: 0;
}

.text-description {
  margin-top: 2px;
  color: var(--gray-400);
  font-size: 0.923em;
}

.bs-drop-position {
  position: absolute;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--primary-400);
  opacity: 0.7;
  z-index: 100;
}

.bs-drop-position.vertical {
  left: 0;
  width: 100%;
  height: 8px;
}

.bs-drop-position.vertical.before {
  top: -4px;
}

.bs-drop-position.vertical.after {
  bottom: -4px;
}

.bs-drop-position.horizontal {
  left: 0;
  width: 8px;
  height: 100%;
}

.bs-drop-position.horizontal.before {
  left: -4px;
}

.bs-drop-position.horizontal.after {
  right: -4px;
}

.bs-droppable-horizontal {
  transition: transform 0.3s ease;
}

.bs-droppable-horizontal.bs-dropping-before, .bs-droppable-horizontal.bs-dropping-after-following {
  transform: translateX(12px);
  z-index: 1;
}

.bs-droppable-horizontal.bs-dropping-after, .bs-droppable-horizontal.bs-dropping-before-preceding {
  transform: translateX(-12px);
  z-index: 1;
}

.bs-dragging-source {
  opacity: 0.5;
}

.bs-tree-select .bs-popup {
  min-width: 200px;
}

.bs-box-component-wrap, .bs-select-wrap, .bs-multi-tree-select, .bs-input-wrap {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: left;
}

.bs-box-component-wrap .message, .bs-select-wrap .message, .bs-multi-tree-select .message, .bs-input-wrap .message {
  margin-top: 4px;
  font-size: 0.9em;
}

.bs-box-component-base, .bs-select-wrap > .selected, .bs-multi-tree-select > .selected, .bs-input-base {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: left;
  background-color: var(--body-bg);
}

.bs-input-wrap .suffix,
.bs-input-wrap .prefix {
  font-size: 0.9em;
  margin-right: 4px;
  margin-left: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}

.bs-input-wrap .suffix:first-child,
.bs-input-wrap .prefix:first-child {
  margin-left: 4px;
}

.bs-input-wrap .suffix .font-icon,
.bs-input-wrap .prefix .font-icon {
  font-size: 0.9em;
}

.bs-input-wrap .suffix img,
.bs-input-wrap .prefix img {
  width: 0.9em;
  height: 0.9em;
}

[data-theme=dark] .bs-input-wrap .suffix img,
[data-theme=dark] .bs-input-wrap .prefix img {
  filter: invert(1);
}

.bs-input-base {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}

.bs-input-base > input {
  border: 0;
  border-radius: 0;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  flex-basis: 1em;
  padding: 0 6px;
  background-color: transparent;
  width: 100%;
  color: var(--body-text);
}

.bs-input-base > textarea {
  border: 0;
  border-radius: 4px;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  padding: 6px;
  line-height: 1.4;
  font-family: sans-serif;
  background-color: var(--body-bg);
  color: var(--body-text);
}

.bs-input-base:hover {
  border-color: var(--border-hover);
}

.bs-input-base:has(:focus) {
  border-color: var(--color-focus);
  border-width: 1px;
}

.bs-text-input.modified > .input-area,
.bs-number-input.modified > .input-area,
.bs-price-input.modified > .input-area,
.bs-date-input.modified > .input-area,
.bs-date-range.modified > .input-area,
.bs-multi-lang-text-input.modified > .input-area,
.bs-multi-lang-text-area.modified > .input-area,
.bs-multi-lang-rich-text.modified > .input-area,
.bs-text-area.modified > .input-area,
.bs-rich-text.modified > .input-area {
  border-color: var(--purple) !important;
}

.bs-text-input.error > .input-area,
.bs-number-input.error > .input-area,
.bs-price-input.error > .input-area,
.bs-date-input.error > .input-area,
.bs-date-range.error > .input-area,
.bs-multi-lang-text-input.error > .input-area,
.bs-multi-lang-text-area.error > .input-area,
.bs-multi-lang-rich-text.error > .input-area,
.bs-text-area.error > .input-area,
.bs-rich-text.error > .input-area {
  border-color: var(--danger) !important;
}

.bs-text-input.error > .input-area > input,
.bs-number-input.error > .input-area > input,
.bs-price-input.error > .input-area > input,
.bs-date-input.error > .input-area > input,
.bs-date-range.error > .input-area > input,
.bs-multi-lang-text-input.error > .input-area > input,
.bs-multi-lang-text-area.error > .input-area > input,
.bs-multi-lang-rich-text.error > .input-area > input,
.bs-text-area.error > .input-area > input,
.bs-rich-text.error > .input-area > input {
  color: var(--danger) !important;
}

.bs-text-input.disabled > .input-area,
.bs-number-input.disabled > .input-area,
.bs-price-input.disabled > .input-area,
.bs-date-input.disabled > .input-area,
.bs-date-range.disabled > .input-area,
.bs-multi-lang-text-input.disabled > .input-area,
.bs-multi-lang-text-area.disabled > .input-area,
.bs-multi-lang-rich-text.disabled > .input-area,
.bs-text-area.disabled > .input-area,
.bs-rich-text.disabled > .input-area {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}

.bs-text-input.disabled > .input-area > input,
.bs-number-input.disabled > .input-area > input,
.bs-price-input.disabled > .input-area > input,
.bs-date-input.disabled > .input-area > input,
.bs-date-range.disabled > .input-area > input,
.bs-multi-lang-text-input.disabled > .input-area > input,
.bs-multi-lang-text-area.disabled > .input-area > input,
.bs-multi-lang-rich-text.disabled > .input-area > input,
.bs-text-area.disabled > .input-area > input,
.bs-rich-text.disabled > .input-area > input {
  color: var(--gray-400) !important;
  background-color: var(--gray-100) !important;
}

.bs-text-input.disabled > .input-area > textarea,
.bs-number-input.disabled > .input-area > textarea,
.bs-price-input.disabled > .input-area > textarea,
.bs-date-input.disabled > .input-area > textarea,
.bs-date-range.disabled > .input-area > textarea,
.bs-multi-lang-text-input.disabled > .input-area > textarea,
.bs-multi-lang-text-area.disabled > .input-area > textarea,
.bs-multi-lang-rich-text.disabled > .input-area > textarea,
.bs-text-area.disabled > .input-area > textarea,
.bs-rich-text.disabled > .input-area > textarea {
  background-color: var(--gray-100) !important;
}

.bs-date-input .view-mode,
.bs-date-range .view-mode {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}

.bs-date-input .view-mode::before,
.bs-date-range .view-mode::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-date-input .extra-dates,
.bs-date-range .extra-dates,
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  color: var(--body-text);
  margin-top: 4px;
}

.bs-date-input .extra-dates .extra-date,
.bs-date-range .extra-dates .extra-date,
.bs-calendar .extra-dates .extra-date,
.bs-calendar-range .extra-dates .extra-date {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8125rem;
}

.bs-date-input .extra-dates .extra-date::before,
.bs-date-range .extra-dates .extra-date::before,
.bs-calendar .extra-dates .extra-date::before,
.bs-calendar-range .extra-dates .extra-date::before {
  content: "globe";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}

.bs-checkbox-base {
  display: inline-block;
  color: var(--body-text);
  white-space: nowrap;
}

.bs-checkbox-base input {
  appearance: none;
  margin: 0;
  outline: 0;
}

.bs-checkbox-base input::before {
  font-family: var(--icon-font-family);
  font-size: 20px;
  vertical-align: middle;
  cursor: pointer;
  color: var(--body-text);
}

.bs-checkbox-base input:hover {
  color: var(--gray-500);
}

.bs-checkbox-base input:hover ~ label {
  color: var(--gray-500);
}

.bs-checkbox-base input:focus::before {
  color: var(--color-focus);
}

.bs-checkbox-base input:focus ~ label {
  color: var(--color-focus);
}

.bs-checkbox-base.modified input::before {
  color: var(--purple) !important;
}

.bs-checkbox-base.modified input ~ label {
  color: var(--purple) !important;
}

.bs-checkbox-base.error input::before {
  color: var(--danger) !important;
}

.bs-checkbox-base.error input ~ label {
  color: var(--danger) !important;
}

.bs-checkbox-base.disabled input::before {
  color: var(--gray-400) !important;
}

.bs-checkbox-base.disabled input ~ label {
  color: var(--gray-400) !important;
}

.bs-checkbox-base label {
  display: inline-block;
  vertical-align: middle;
  padding: 4px 2px;
  cursor: pointer;
}

.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input::before {
  color: var(--purple) !important;
}

.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input ~ label {
  color: var(--purple) !important;
}

.bs-checkbox-group.error .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input::before {
  color: var(--danger) !important;
}

.bs-checkbox-group.error .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input ~ label {
  color: var(--danger) !important;
}

.bs-checkbox-group.disabled input::before,
.bs-radio-button-group.disabled input::before {
  color: var(--gray-400) !important;
}

.bs-checkbox-group.disabled input ~ label,
.bs-radio-button-group.disabled input ~ label {
  color: var(--gray-400) !important;
}

.bs-select-wrap, .bs-multi-tree-select {
  position: relative;
  outline: 0;
  background-color: var(--body-bg);
  color: var(--body-text);
  min-width: 64px;
}

.bs-select-wrap:hover > .selected, .bs-multi-tree-select:hover > .selected {
  border-color: var(--border-hover);
}

.bs-select-wrap:focus > .selected, .bs-multi-tree-select:focus > .selected {
  border-color: var(--color-focus);
}

.bs-select-wrap > .selected, .bs-multi-tree-select > .selected {
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 0 6px;
  min-width: 100%;
  cursor: pointer;
  display: flex;
}

.bs-select-wrap > .selected .label, .bs-multi-tree-select > .selected .label {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.bs-select-wrap > .selected .placeholder, .bs-multi-tree-select > .selected .placeholder {
  color: var(--gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
}

.bs-select-wrap > .selected .dropdown-btn, .bs-multi-tree-select > .selected .dropdown-btn {
  font-family: var(--icon-font-family);
  margin-right: -4px;
  margin-left: 4px;
  user-select: none;
  transition: transform 0.2s linear;
}

.bs-select-wrap.popup-open .dropdown-btn, .popup-open.bs-multi-tree-select .dropdown-btn {
  transform: rotate(180deg);
}

.bs-select-wrap.modified > .selected, .modified.bs-multi-tree-select > .selected {
  border-color: var(--purple) !important;
}

.bs-select-wrap.error > .selected, .error.bs-multi-tree-select > .selected {
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}

.bs-select-wrap.disabled > .selected, .disabled.bs-multi-tree-select > .selected {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-500) !important;
}

.bs-select-wrap.view-mode, .view-mode.bs-multi-tree-select {
  background-color: transparent;
}

.bs-select-wrap .small-progress, .bs-multi-tree-select .small-progress {
  font-family: var(--icon-font-family);
  font-size: 0.9em;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 0 2px;
  color: var(--gray-400);
  animation: spin 1s linear infinite;
}

.bs-field-error {
  color: var(--color-error);
  margin-top: 4px;
}

.bs-clickable {
  user-select: none;
  cursor: pointer;
}

.bs-clickable:hover {
  filter: opacity(75%);
}

.bs-clickable:active {
  filter: opacity(50%);
}

.bs-clickable.disabled {
  filter: opacity(40%);
}

.component-shadow-base {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}

[data-theme=dark] .component-shadow-base {
  box-shadow: 2px 2px 8px rgba(255, 255, 255, 0.1);
}

.font-icon {
  font-family: var(--icon-font-family);
  font-size: 1rem;
  max-width: 1em;
}

.font-icon.filled {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}

.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}

.fade-enter,
.fade-leave-to {
  opacity: 0;
}

.text-description {
  margin-top: 2px;
  color: var(--gray-400);
  font-size: 0.923em;
}

.bs-drop-position {
  position: absolute;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--primary-400);
  opacity: 0.7;
  z-index: 100;
}

.bs-drop-position.vertical {
  left: 0;
  width: 100%;
  height: 8px;
}

.bs-drop-position.vertical.before {
  top: -4px;
}

.bs-drop-position.vertical.after {
  bottom: -4px;
}

.bs-drop-position.horizontal {
  left: 0;
  width: 8px;
  height: 100%;
}

.bs-drop-position.horizontal.before {
  left: -4px;
}

.bs-drop-position.horizontal.after {
  right: -4px;
}

.bs-droppable-horizontal {
  transition: transform 0.3s ease;
}

.bs-droppable-horizontal.bs-dropping-before, .bs-droppable-horizontal.bs-dropping-after-following {
  transform: translateX(12px);
  z-index: 1;
}

.bs-droppable-horizontal.bs-dropping-after, .bs-droppable-horizontal.bs-dropping-before-preceding {
  transform: translateX(-12px);
  z-index: 1;
}

.bs-dragging-source {
  opacity: 0.5;
}

.bs-multi-tree-select .bs-popup {
  min-width: 200px;
}

.bs-popup-select[data-v-d74fd89c] {
  column-gap: 8px !important;
}

.bs-box-component-wrap, .bs-select-wrap, .bs-input-wrap, .bs-text-area {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: left;
}

.bs-box-component-wrap .message, .bs-select-wrap .message, .bs-input-wrap .message, .bs-text-area .message {
  margin-top: 4px;
  font-size: 0.9em;
}

.bs-box-component-base, .bs-select-wrap > .selected, .bs-input-base, .bs-text-area .input-area {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: left;
  background-color: var(--body-bg);
}

.bs-input-wrap .suffix, .bs-text-area .suffix,
.bs-input-wrap .prefix,
.bs-text-area .prefix {
  font-size: 0.9em;
  margin-right: 4px;
  margin-left: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}

.bs-input-wrap .suffix:first-child, .bs-text-area .suffix:first-child,
.bs-input-wrap .prefix:first-child,
.bs-text-area .prefix:first-child {
  margin-left: 4px;
}

.bs-input-wrap .suffix .font-icon, .bs-text-area .suffix .font-icon,
.bs-input-wrap .prefix .font-icon,
.bs-text-area .prefix .font-icon {
  font-size: 0.9em;
}

.bs-input-wrap .suffix img, .bs-text-area .suffix img,
.bs-input-wrap .prefix img,
.bs-text-area .prefix img {
  width: 0.9em;
  height: 0.9em;
}

[data-theme=dark] .bs-input-wrap .suffix img, [data-theme=dark] .bs-text-area .suffix img,
[data-theme=dark] .bs-input-wrap .prefix img,
[data-theme=dark] .bs-text-area .prefix img {
  filter: invert(1);
}

.bs-input-base, .bs-text-area .input-area {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}

.bs-input-base > input, .bs-text-area .input-area > input {
  border: 0;
  border-radius: 0;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  flex-basis: 1em;
  padding: 0 6px;
  background-color: transparent;
  width: 100%;
  color: var(--body-text);
}

.bs-input-base > textarea, .bs-text-area .input-area > textarea {
  border: 0;
  border-radius: 4px;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  padding: 6px;
  line-height: 1.4;
  font-family: sans-serif;
  background-color: var(--body-bg);
  color: var(--body-text);
}

.bs-input-base:hover, .bs-text-area .input-area:hover {
  border-color: var(--border-hover);
}

.bs-input-base:has(:focus), .bs-text-area .input-area:has(:focus) {
  border-color: var(--color-focus);
  border-width: 1px;
}

.bs-text-input.modified > .input-area,
.bs-number-input.modified > .input-area,
.bs-price-input.modified > .input-area,
.bs-date-input.modified > .input-area,
.bs-date-range.modified > .input-area,
.bs-multi-lang-text-input.modified > .input-area,
.bs-multi-lang-text-area.modified > .input-area,
.bs-multi-lang-rich-text.modified > .input-area,
.bs-text-area.modified > .input-area,
.bs-rich-text.modified > .input-area {
  border-color: var(--purple) !important;
}

.bs-text-input.error > .input-area,
.bs-number-input.error > .input-area,
.bs-price-input.error > .input-area,
.bs-date-input.error > .input-area,
.bs-date-range.error > .input-area,
.bs-multi-lang-text-input.error > .input-area,
.bs-multi-lang-text-area.error > .input-area,
.bs-multi-lang-rich-text.error > .input-area,
.bs-text-area.error > .input-area,
.bs-rich-text.error > .input-area {
  border-color: var(--danger) !important;
}

.bs-text-input.error > .input-area > input,
.bs-number-input.error > .input-area > input,
.bs-price-input.error > .input-area > input,
.bs-date-input.error > .input-area > input,
.bs-date-range.error > .input-area > input,
.bs-multi-lang-text-input.error > .input-area > input,
.bs-multi-lang-text-area.error > .input-area > input,
.bs-multi-lang-rich-text.error > .input-area > input,
.bs-text-area.error > .input-area > input,
.bs-rich-text.error > .input-area > input {
  color: var(--danger) !important;
}

.bs-text-input.disabled > .input-area,
.bs-number-input.disabled > .input-area,
.bs-price-input.disabled > .input-area,
.bs-date-input.disabled > .input-area,
.bs-date-range.disabled > .input-area,
.bs-multi-lang-text-input.disabled > .input-area,
.bs-multi-lang-text-area.disabled > .input-area,
.bs-multi-lang-rich-text.disabled > .input-area,
.bs-text-area.disabled > .input-area,
.bs-rich-text.disabled > .input-area {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}

.bs-text-input.disabled > .input-area > input,
.bs-number-input.disabled > .input-area > input,
.bs-price-input.disabled > .input-area > input,
.bs-date-input.disabled > .input-area > input,
.bs-date-range.disabled > .input-area > input,
.bs-multi-lang-text-input.disabled > .input-area > input,
.bs-multi-lang-text-area.disabled > .input-area > input,
.bs-multi-lang-rich-text.disabled > .input-area > input,
.bs-text-area.disabled > .input-area > input,
.bs-rich-text.disabled > .input-area > input {
  color: var(--gray-400) !important;
  background-color: var(--gray-100) !important;
}

.bs-text-input.disabled > .input-area > textarea,
.bs-number-input.disabled > .input-area > textarea,
.bs-price-input.disabled > .input-area > textarea,
.bs-date-input.disabled > .input-area > textarea,
.bs-date-range.disabled > .input-area > textarea,
.bs-multi-lang-text-input.disabled > .input-area > textarea,
.bs-multi-lang-text-area.disabled > .input-area > textarea,
.bs-multi-lang-rich-text.disabled > .input-area > textarea,
.bs-text-area.disabled > .input-area > textarea,
.bs-rich-text.disabled > .input-area > textarea {
  background-color: var(--gray-100) !important;
}

.bs-date-input .view-mode,
.bs-date-range .view-mode {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}

.bs-date-input .view-mode::before,
.bs-date-range .view-mode::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-date-input .extra-dates,
.bs-date-range .extra-dates,
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  color: var(--body-text);
  margin-top: 4px;
}

.bs-date-input .extra-dates .extra-date,
.bs-date-range .extra-dates .extra-date,
.bs-calendar .extra-dates .extra-date,
.bs-calendar-range .extra-dates .extra-date {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8125rem;
}

.bs-date-input .extra-dates .extra-date::before,
.bs-date-range .extra-dates .extra-date::before,
.bs-calendar .extra-dates .extra-date::before,
.bs-calendar-range .extra-dates .extra-date::before {
  content: "globe";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}

.bs-checkbox-base {
  display: inline-block;
  color: var(--body-text);
  white-space: nowrap;
}

.bs-checkbox-base input {
  appearance: none;
  margin: 0;
  outline: 0;
}

.bs-checkbox-base input::before {
  font-family: var(--icon-font-family);
  font-size: 20px;
  vertical-align: middle;
  cursor: pointer;
  color: var(--body-text);
}

.bs-checkbox-base input:hover {
  color: var(--gray-500);
}

.bs-checkbox-base input:hover ~ label {
  color: var(--gray-500);
}

.bs-checkbox-base input:focus::before {
  color: var(--color-focus);
}

.bs-checkbox-base input:focus ~ label {
  color: var(--color-focus);
}

.bs-checkbox-base.modified input::before {
  color: var(--purple) !important;
}

.bs-checkbox-base.modified input ~ label {
  color: var(--purple) !important;
}

.bs-checkbox-base.error input::before {
  color: var(--danger) !important;
}

.bs-checkbox-base.error input ~ label {
  color: var(--danger) !important;
}

.bs-checkbox-base.disabled input::before {
  color: var(--gray-400) !important;
}

.bs-checkbox-base.disabled input ~ label {
  color: var(--gray-400) !important;
}

.bs-checkbox-base label {
  display: inline-block;
  vertical-align: middle;
  padding: 4px 2px;
  cursor: pointer;
}

.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input::before {
  color: var(--purple) !important;
}

.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input ~ label {
  color: var(--purple) !important;
}

.bs-checkbox-group.error .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input::before {
  color: var(--danger) !important;
}

.bs-checkbox-group.error .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input ~ label {
  color: var(--danger) !important;
}

.bs-checkbox-group.disabled input::before,
.bs-radio-button-group.disabled input::before {
  color: var(--gray-400) !important;
}

.bs-checkbox-group.disabled input ~ label,
.bs-radio-button-group.disabled input ~ label {
  color: var(--gray-400) !important;
}

.bs-select-wrap {
  position: relative;
  outline: 0;
  background-color: var(--body-bg);
  color: var(--body-text);
  min-width: 64px;
}

.bs-select-wrap:hover > .selected {
  border-color: var(--border-hover);
}

.bs-select-wrap:focus > .selected {
  border-color: var(--color-focus);
}

.bs-select-wrap > .selected {
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 0 6px;
  min-width: 100%;
  cursor: pointer;
  display: flex;
}

.bs-select-wrap > .selected .label {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.bs-select-wrap > .selected .placeholder {
  color: var(--gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
}

.bs-select-wrap > .selected .dropdown-btn {
  font-family: var(--icon-font-family);
  margin-right: -4px;
  margin-left: 4px;
  user-select: none;
  transition: transform 0.2s linear;
}

.bs-select-wrap.popup-open .dropdown-btn {
  transform: rotate(180deg);
}

.bs-select-wrap.modified > .selected {
  border-color: var(--purple) !important;
}

.bs-select-wrap.error > .selected {
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}

.bs-select-wrap.disabled > .selected {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-500) !important;
}

.bs-select-wrap.view-mode {
  background-color: transparent;
}

.bs-select-wrap .small-progress {
  font-family: var(--icon-font-family);
  font-size: 0.9em;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 0 2px;
  color: var(--gray-400);
  animation: spin 1s linear infinite;
}

.bs-field-error {
  color: var(--color-error);
  margin-top: 4px;
}

.bs-clickable {
  user-select: none;
  cursor: pointer;
}

.bs-clickable:hover {
  filter: opacity(75%);
}

.bs-clickable:active {
  filter: opacity(50%);
}

.bs-clickable.disabled {
  filter: opacity(40%);
}

.component-shadow-base {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}

[data-theme=dark] .component-shadow-base {
  box-shadow: 2px 2px 8px rgba(255, 255, 255, 0.1);
}

.font-icon {
  font-family: var(--icon-font-family);
  font-size: 1rem;
  max-width: 1em;
}

.font-icon.filled {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}

.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}

.fade-enter,
.fade-leave-to {
  opacity: 0;
}

.text-description {
  margin-top: 2px;
  color: var(--gray-400);
  font-size: 0.923em;
}

.bs-drop-position {
  position: absolute;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--primary-400);
  opacity: 0.7;
  z-index: 100;
}

.bs-drop-position.vertical {
  left: 0;
  width: 100%;
  height: 8px;
}

.bs-drop-position.vertical.before {
  top: -4px;
}

.bs-drop-position.vertical.after {
  bottom: -4px;
}

.bs-drop-position.horizontal {
  left: 0;
  width: 8px;
  height: 100%;
}

.bs-drop-position.horizontal.before {
  left: -4px;
}

.bs-drop-position.horizontal.after {
  right: -4px;
}

.bs-droppable-horizontal {
  transition: transform 0.3s ease;
}

.bs-droppable-horizontal.bs-dropping-before, .bs-droppable-horizontal.bs-dropping-after-following {
  transform: translateX(12px);
  z-index: 1;
}

.bs-droppable-horizontal.bs-dropping-after, .bs-droppable-horizontal.bs-dropping-before-preceding {
  transform: translateX(-12px);
  z-index: 1;
}

.bs-dragging-source {
  opacity: 0.5;
}

.bs-text-area .input-area {
  width: 100%;
  height: 100%;
}

.bs-text-area .input-area .prefix,
.bs-text-area .input-area .suffix {
  margin-top: 6px;
  white-space: nowrap;
}

.bs-text-area .view-mode {
  white-space: pre;
  line-height: 1.5em;
}

.tool-button-font-size[data-v-ef5774f0] {
  border: 1px solid var(--border);
  border-radius: 2px;
}

input[data-v-ef5774f0] {
  width: 48px;
  height: 24px;
  padding: 2px 4px;
  border: 0;
  border-left: 1px solid var(--border);
  border-right: 1px solid var(--border);
  background-color: var(--body-bg);
  color: var(--body-text);
}

input[data-v-d556d8eb] {
  width: 48px;
  height: 26px;
  padding: 2px 4px;
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}

span.table-property[data-v-537f70be] {
  position: relative;
}

span.table-property[data-v-537f70be]:after {
  content: "settings";
  position: absolute;
  font-size: 0.5em;
  right: -2px;
  bottom: 5px;
}

div[data-v-c1655c12] {
  color: var(--color-text);
}

.rich-text-toolbar {
  width: 100%;
  padding: 8px;
  line-height: 1;
  border-bottom: 1px solid var(--border);
  background-color: var(--body-bg);
  z-index: 1;
}

.rich-text-toolbar > div .separator {
  padding-right: 4px;
  margin-right: 4px;
  border-right: 1px solid var(--border);
  height: 100%;
}

.rich-text-toolbar > div div.font-icon {
  padding: 4px;
  max-width: 2em;
  border-radius: 4px;
}

.rich-text-toolbar > div div.font-icon.active {
  background-color: var(--gray-200);
}

.rich-text-toolbar > div div > span.font-icon {
  padding: 4px;
  max-width: 2em;
  border-radius: 4px;
}

.rich-text-toolbar > div div > span.font-icon.disabled {
  color: var(--gray-400);
}

.rich-text-toolbar .tool-button-group {
  border: 1px solid var(--border);
  border-radius: 2px;
}

.rich-text-toolbar .tool-button-group > div {
  border-right: 1px solid var(--border);
  border-radius: 0 !important;
}

.rich-text-toolbar .tool-button-group > div:last-child {
  border-right: 0 !important;
}

.bs-box-component-wrap, .bs-select-wrap, .bs-input-wrap, .bs-rich-text {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: left;
}

.bs-box-component-wrap .message, .bs-select-wrap .message, .bs-input-wrap .message, .bs-rich-text .message {
  margin-top: 4px;
  font-size: 0.9em;
}

.bs-box-component-base, .bs-select-wrap > .selected, .bs-input-base, .bs-rich-text > .input-area {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: left;
  background-color: var(--body-bg);
}

.bs-input-wrap .suffix, .bs-rich-text .suffix,
.bs-input-wrap .prefix,
.bs-rich-text .prefix {
  font-size: 0.9em;
  margin-right: 4px;
  margin-left: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}

.bs-input-wrap .suffix:first-child, .bs-rich-text .suffix:first-child,
.bs-input-wrap .prefix:first-child,
.bs-rich-text .prefix:first-child {
  margin-left: 4px;
}

.bs-input-wrap .suffix .font-icon, .bs-rich-text .suffix .font-icon,
.bs-input-wrap .prefix .font-icon,
.bs-rich-text .prefix .font-icon {
  font-size: 0.9em;
}

.bs-input-wrap .suffix img, .bs-rich-text .suffix img,
.bs-input-wrap .prefix img,
.bs-rich-text .prefix img {
  width: 0.9em;
  height: 0.9em;
}

[data-theme=dark] .bs-input-wrap .suffix img, [data-theme=dark] .bs-rich-text .suffix img,
[data-theme=dark] .bs-input-wrap .prefix img,
[data-theme=dark] .bs-rich-text .prefix img {
  filter: invert(1);
}

.bs-input-base, .bs-rich-text > .input-area {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}

.bs-input-base > input, .bs-rich-text > .input-area > input {
  border: 0;
  border-radius: 0;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  flex-basis: 1em;
  padding: 0 6px;
  background-color: transparent;
  width: 100%;
  color: var(--body-text);
}

.bs-input-base > textarea, .bs-rich-text > .input-area > textarea {
  border: 0;
  border-radius: 4px;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  padding: 6px;
  line-height: 1.4;
  font-family: sans-serif;
  background-color: var(--body-bg);
  color: var(--body-text);
}

.bs-input-base:hover, .bs-rich-text > .input-area:hover {
  border-color: var(--border-hover);
}

.bs-input-base:has(:focus), .bs-rich-text > .input-area:has(:focus) {
  border-color: var(--color-focus);
  border-width: 1px;
}

.bs-text-input.modified > .input-area,
.bs-number-input.modified > .input-area,
.bs-price-input.modified > .input-area,
.bs-date-input.modified > .input-area,
.bs-date-range.modified > .input-area,
.bs-multi-lang-text-input.modified > .input-area,
.bs-multi-lang-text-area.modified > .input-area,
.bs-multi-lang-rich-text.modified > .input-area,
.bs-text-area.modified > .input-area,
.bs-rich-text.modified > .input-area {
  border-color: var(--purple) !important;
}

.bs-text-input.error > .input-area,
.bs-number-input.error > .input-area,
.bs-price-input.error > .input-area,
.bs-date-input.error > .input-area,
.bs-date-range.error > .input-area,
.bs-multi-lang-text-input.error > .input-area,
.bs-multi-lang-text-area.error > .input-area,
.bs-multi-lang-rich-text.error > .input-area,
.bs-text-area.error > .input-area,
.bs-rich-text.error > .input-area {
  border-color: var(--danger) !important;
}

.bs-text-input.error > .input-area > input,
.bs-number-input.error > .input-area > input,
.bs-price-input.error > .input-area > input,
.bs-date-input.error > .input-area > input,
.bs-date-range.error > .input-area > input,
.bs-multi-lang-text-input.error > .input-area > input,
.bs-multi-lang-text-area.error > .input-area > input,
.bs-multi-lang-rich-text.error > .input-area > input,
.bs-text-area.error > .input-area > input,
.bs-rich-text.error > .input-area > input {
  color: var(--danger) !important;
}

.bs-text-input.disabled > .input-area,
.bs-number-input.disabled > .input-area,
.bs-price-input.disabled > .input-area,
.bs-date-input.disabled > .input-area,
.bs-date-range.disabled > .input-area,
.bs-multi-lang-text-input.disabled > .input-area,
.bs-multi-lang-text-area.disabled > .input-area,
.bs-multi-lang-rich-text.disabled > .input-area,
.bs-text-area.disabled > .input-area,
.bs-rich-text.disabled > .input-area {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}

.bs-text-input.disabled > .input-area > input,
.bs-number-input.disabled > .input-area > input,
.bs-price-input.disabled > .input-area > input,
.bs-date-input.disabled > .input-area > input,
.bs-date-range.disabled > .input-area > input,
.bs-multi-lang-text-input.disabled > .input-area > input,
.bs-multi-lang-text-area.disabled > .input-area > input,
.bs-multi-lang-rich-text.disabled > .input-area > input,
.bs-text-area.disabled > .input-area > input,
.bs-rich-text.disabled > .input-area > input {
  color: var(--gray-400) !important;
  background-color: var(--gray-100) !important;
}

.bs-text-input.disabled > .input-area > textarea,
.bs-number-input.disabled > .input-area > textarea,
.bs-price-input.disabled > .input-area > textarea,
.bs-date-input.disabled > .input-area > textarea,
.bs-date-range.disabled > .input-area > textarea,
.bs-multi-lang-text-input.disabled > .input-area > textarea,
.bs-multi-lang-text-area.disabled > .input-area > textarea,
.bs-multi-lang-rich-text.disabled > .input-area > textarea,
.bs-text-area.disabled > .input-area > textarea,
.bs-rich-text.disabled > .input-area > textarea {
  background-color: var(--gray-100) !important;
}

.bs-date-input .view-mode,
.bs-date-range .view-mode {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}

.bs-date-input .view-mode::before,
.bs-date-range .view-mode::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-date-input .extra-dates,
.bs-date-range .extra-dates,
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  color: var(--body-text);
  margin-top: 4px;
}

.bs-date-input .extra-dates .extra-date,
.bs-date-range .extra-dates .extra-date,
.bs-calendar .extra-dates .extra-date,
.bs-calendar-range .extra-dates .extra-date {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8125rem;
}

.bs-date-input .extra-dates .extra-date::before,
.bs-date-range .extra-dates .extra-date::before,
.bs-calendar .extra-dates .extra-date::before,
.bs-calendar-range .extra-dates .extra-date::before {
  content: "globe";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}

.bs-checkbox-base {
  display: inline-block;
  color: var(--body-text);
  white-space: nowrap;
}

.bs-checkbox-base input {
  appearance: none;
  margin: 0;
  outline: 0;
}

.bs-checkbox-base input::before {
  font-family: var(--icon-font-family);
  font-size: 20px;
  vertical-align: middle;
  cursor: pointer;
  color: var(--body-text);
}

.bs-checkbox-base input:hover {
  color: var(--gray-500);
}

.bs-checkbox-base input:hover ~ label {
  color: var(--gray-500);
}

.bs-checkbox-base input:focus::before {
  color: var(--color-focus);
}

.bs-checkbox-base input:focus ~ label {
  color: var(--color-focus);
}

.bs-checkbox-base.modified input::before {
  color: var(--purple) !important;
}

.bs-checkbox-base.modified input ~ label {
  color: var(--purple) !important;
}

.bs-checkbox-base.error input::before {
  color: var(--danger) !important;
}

.bs-checkbox-base.error input ~ label {
  color: var(--danger) !important;
}

.bs-checkbox-base.disabled input::before {
  color: var(--gray-400) !important;
}

.bs-checkbox-base.disabled input ~ label {
  color: var(--gray-400) !important;
}

.bs-checkbox-base label {
  display: inline-block;
  vertical-align: middle;
  padding: 4px 2px;
  cursor: pointer;
}

.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input::before {
  color: var(--purple) !important;
}

.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input ~ label {
  color: var(--purple) !important;
}

.bs-checkbox-group.error .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input::before {
  color: var(--danger) !important;
}

.bs-checkbox-group.error .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input ~ label {
  color: var(--danger) !important;
}

.bs-checkbox-group.disabled input::before,
.bs-radio-button-group.disabled input::before {
  color: var(--gray-400) !important;
}

.bs-checkbox-group.disabled input ~ label,
.bs-radio-button-group.disabled input ~ label {
  color: var(--gray-400) !important;
}

.bs-select-wrap {
  position: relative;
  outline: 0;
  background-color: var(--body-bg);
  color: var(--body-text);
  min-width: 64px;
}

.bs-select-wrap:hover > .selected {
  border-color: var(--border-hover);
}

.bs-select-wrap:focus > .selected {
  border-color: var(--color-focus);
}

.bs-select-wrap > .selected {
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 0 6px;
  min-width: 100%;
  cursor: pointer;
  display: flex;
}

.bs-select-wrap > .selected .label {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.bs-select-wrap > .selected .placeholder {
  color: var(--gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
}

.bs-select-wrap > .selected .dropdown-btn {
  font-family: var(--icon-font-family);
  margin-right: -4px;
  margin-left: 4px;
  user-select: none;
  transition: transform 0.2s linear;
}

.bs-select-wrap.popup-open .dropdown-btn {
  transform: rotate(180deg);
}

.bs-select-wrap.modified > .selected {
  border-color: var(--purple) !important;
}

.bs-select-wrap.error > .selected {
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}

.bs-select-wrap.disabled > .selected {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-500) !important;
}

.bs-select-wrap.view-mode {
  background-color: transparent;
}

.bs-select-wrap .small-progress {
  font-family: var(--icon-font-family);
  font-size: 0.9em;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 0 2px;
  color: var(--gray-400);
  animation: spin 1s linear infinite;
}

.bs-field-error {
  color: var(--color-error);
  margin-top: 4px;
}

.bs-clickable {
  user-select: none;
  cursor: pointer;
}

.bs-clickable:hover {
  filter: opacity(75%);
}

.bs-clickable:active {
  filter: opacity(50%);
}

.bs-clickable.disabled {
  filter: opacity(40%);
}

.component-shadow-base {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}

[data-theme=dark] .component-shadow-base {
  box-shadow: 2px 2px 8px rgba(255, 255, 255, 0.1);
}

.font-icon {
  font-family: var(--icon-font-family);
  font-size: 1rem;
  max-width: 1em;
}

.font-icon.filled {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}

.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}

.fade-enter,
.fade-leave-to {
  opacity: 0;
}

.text-description {
  margin-top: 2px;
  color: var(--gray-400);
  font-size: 0.923em;
}

.bs-drop-position {
  position: absolute;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--primary-400);
  opacity: 0.7;
  z-index: 100;
}

.bs-drop-position.vertical {
  left: 0;
  width: 100%;
  height: 8px;
}

.bs-drop-position.vertical.before {
  top: -4px;
}

.bs-drop-position.vertical.after {
  bottom: -4px;
}

.bs-drop-position.horizontal {
  left: 0;
  width: 8px;
  height: 100%;
}

.bs-drop-position.horizontal.before {
  left: -4px;
}

.bs-drop-position.horizontal.after {
  right: -4px;
}

.bs-droppable-horizontal {
  transition: transform 0.3s ease;
}

.bs-droppable-horizontal.bs-dropping-before, .bs-droppable-horizontal.bs-dropping-after-following {
  transform: translateX(12px);
  z-index: 1;
}

.bs-droppable-horizontal.bs-dropping-after, .bs-droppable-horizontal.bs-dropping-before-preceding {
  transform: translateX(-12px);
  z-index: 1;
}

.bs-dragging-source {
  opacity: 0.5;
}

.bs-rich-text > .input-area {
  border: 1px solid var(--border);
  border-radius: 2px;
  width: 100%;
  height: 100%;
  overflow: hidden;
  transition-property: all;
  transition-timing-function: ease;
}

.bs-rich-text > .input-area > .editor-container {
  background-color: var(--gray-200);
  flex-grow: 1;
  width: 100%;
  overflow: hidden;
  padding: 8px;
}

.bs-rich-text.disabled > .input-area {
  background-color: var(--gray-100);
}

.bs-rich-text > .view-mode {
  height: 100%;
  overflow: auto;
}

.bs-media-preview {
  text-align: center;
  min-width: 50px;
  min-height: 50px;
}

.bs-media-preview .button {
  background-color: var(--white);
  position: absolute;
  border-radius: 4px;
  line-height: 1;
  opacity: 0.5;
  text-decoration: none;
  color: var(--color-text);
  font-size: 1.4em;
}

.bs-media-preview .show-on-hover {
  display: none;
}

.bs-media-preview:hover .show-on-hover {
  display: block;
}

.bs-image-upload {
  display: inline-block;
}

.bs-image-upload.modified .image-box {
  border-color: var(--purple) !important;
}

.bs-image-upload.error .image-box {
  border-color: var(--red) !important;
}

.bs-image-upload .image-box {
  border: 1px solid var(--border);
  line-height: 0;
}

.bs-image-upload .image-box img {
  object-fit: contain;
}

.bs-image-upload > span.disabled {
  cursor: default;
  color: #999;
}

.bs-image-upload .upload-btn-wrapper {
  background-color: var(--gray-100);
}

.bs-image-upload .upload-btn-wrapper .upload-btn, .bs-image-upload .upload-btn-wrapper .youtube-btn {
  color: #999;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-grow: 1;
}

.bs-image-upload .upload-btn-wrapper .upload-btn .font-icon, .bs-image-upload .upload-btn-wrapper .youtube-btn .font-icon {
  font-size: 1.4em;
}

.bs-image-upload .upload-btn-wrapper .upload-btn:hover:not(.disabled), .bs-image-upload .upload-btn-wrapper .youtube-btn:hover:not(.disabled) {
  background-color: var(--gray-200);
  color: var(--color-text);
}

.bs-image-upload .upload-btn-wrapper .upload-btn:not(:first-child), .bs-image-upload .upload-btn-wrapper .youtube-btn:not(:first-child) {
  border-top: 1px solid var(--gray-200);
}

.bs-image-upload .upload-btn-wrapper.dropping {
  background-color: var(--primary-200);
  border: 3px dashed var(--primary);
  border-radius: 8px;
  transform: scale(110%);
}

.bs-image-upload .disabled .upload-btn-wrapper {
  opacity: 0.5;
}

.bs-image-upload .disabled .image-box {
  border-color: var(--border) !important;
}

.image-upload-move[data-v-b7698f30],
.image-upload-enter-active[data-v-b7698f30],
.image-upload-leave-active[data-v-b7698f30] {
  transition: all 0.3s ease;
}

.image-upload-leave-from[data-v-b7698f30],
.image-upload-leave-to[data-v-b7698f30] {
  display: none;
}

.image-upload-enter-from[data-v-b7698f30] {
  opacity: 0;
}

.image-upload-leave-active[data-v-b7698f30] {
  position: absolute;
}

.bs-positioned-image-upload .image-box {
  border: 1px solid var(--border);
}

.bs-positioned-image-upload .image-box img {
  object-fit: contain;
}

.bs-positioned-image-upload > span.disabled {
  cursor: default;
  color: #999;
}

.bs-positioned-image-upload .close-btn {
  background-color: var(--white);
  cursor: pointer;
  position: absolute;
  top: 0;
  right: 0;
}

.bs-positioned-image-upload .upload-btn {
  background-color: var(--gray-100);
  color: #999;
}

.bs-file-upload {
  display: inline-block;
}

.bs-file-upload.modified .file-box {
  border-color: var(--purple) !important;
}

.bs-file-upload.error .file-box {
  border-color: var(--red) !important;
}

.bs-file-upload .file-box {
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 8px 12px;
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 40px;
}

.bs-file-upload .file-box .file-icon {
  color: var(--gray-500);
  font-size: 1.2em;
}

.bs-file-upload .file-box .file-name {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.bs-file-upload .file-box a.file-name {
  color: var(--primary);
  text-decoration: none;
}

.bs-file-upload .file-box a.file-name:hover {
  text-decoration: underline;
}

.bs-file-upload .file-box .remove-btn {
  border: none;
  background: none;
  padding: 4px;
  color: var(--gray-500);
  display: flex;
  align-items: center;
  justify-content: center;
}

.bs-file-upload .file-box .remove-btn:hover {
  color: var(--red);
}

.bs-file-upload .upload-btn-wrapper {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.bs-file-upload .upload-btn-wrapper .upload-btn {
  display: flex;
  align-items: center;
  gap: 4px;
  color: var(--gray-500);
  padding: 4px 8px;
  border-radius: 4px;
}

.bs-file-upload .upload-btn-wrapper .upload-btn:hover:not(.disabled) {
  background-color: var(--gray-100);
  color: var(--color-text);
}

.bs-file-upload .upload-btn-wrapper .no-file {
  color: var(--gray-400);
}

.bs-file-upload .upload-btn-wrapper.dropping {
  background-color: var(--primary-200);
  border: 2px dashed var(--primary);
  border-radius: 4px;
}

.bs-file-upload .disabled .file-box {
  opacity: 0.5;
  border-color: var(--border) !important;
}

.resize-handle[data-v-f4cd842f] {
  position: absolute;
  width: 5px;
  right: -1px;
  top: 0;
  bottom: 0;
  cursor: col-resize;
  z-index: 10000;
  opacity: 0.2;
}

.resize-handle .resize-guide[data-v-f4cd842f] {
  position: absolute;
  border-left: 1px dashed #000000;
  top: 0;
  right: 0;
  bottom: -500px;
}

.sort-icon[data-v-f129d656] {
  line-height: 1;
}

.sort-icon.descending[data-v-f129d656] {
  transform: rotate(180deg);
}

.checked .font-icon {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
  color: var(--primary);
}

.checked .font-icon[data-v-83bdbd76] {
  font-variation-settings: "FILL" 1, "wght" 700, "GRAD" 0, "opsz" 48;
  color: var(--primary);
}

.disabled[data-v-83bdbd76] {
  color: var(--gray-400);
}

.drag-handle > .font-icon {
  font-size: 1.8em;
  margin-left: -2px;
  cursor: grab;
  user-select: none;
}

.drag-handle > .font-icon:active {
  cursor: grabbing;
}

:root {
  --grid-cell-padding: 8px;
  --grid-row-odd-color: var(--body-bg);
  --grid-row-even-color: var(--gray-100);
}

.bs-grid {
  position: relative;
  display: flex;
  flex-direction: column;
}

.bs-grid > .table-wrap {
  overflow: auto;
  flex-grow: 1;
  background-color: var(--gray-100);
  border-top: 1px solid var(--gray-200);
  border-bottom: 1px solid var(--gray-200);
}

.bs-grid > .table-wrap > table {
  flex-grow: 1;
  table-layout: fixed;
  border-collapse: collapse;
  box-shadow: 0 1px 8px rgba(0, 0, 0, 0.03), 0 1px 4px rgba(0, 0, 0, 0.03);
}

.bs-grid > .table-wrap > table > thead > tr > td, .bs-grid > .table-wrap > table > thead > tr > th, .bs-grid > .table-wrap > table tbody > tr > td, .bs-grid > .table-wrap > table tbody > tr > th {
  vertical-align: middle;
}

.bs-grid > .table-wrap > table > thead > tr > td > div, .bs-grid > .table-wrap > table > thead > tr > th > div, .bs-grid > .table-wrap > table tbody > tr > td > div, .bs-grid > .table-wrap > table tbody > tr > th > div {
  padding: var(--grid-cell-padding);
  overflow: hidden;
  min-height: 1em;
}

.bs-grid > .table-wrap > table > thead > tr > td > div > a, .bs-grid > .table-wrap > table > thead > tr > th > div > a, .bs-grid > .table-wrap > table tbody > tr > td > div > a, .bs-grid > .table-wrap > table tbody > tr > th > div > a {
  color: var(--body-text) !important;
}

.bs-grid > .table-wrap > table > thead > tr > td.editing > div, .bs-grid > .table-wrap > table tbody > tr > td.editing > div {
  overflow: visible;
}

.bs-grid > .table-wrap > table > thead > tr.header-row > .func-cell {
  min-width: 32px;
  line-height: 1;
}

.bs-grid > .table-wrap > table > thead > tr.header-row > .func-cell > div {
  border-right: 1px solid var(--gray-200);
}

.bs-grid > .table-wrap > table > thead > tr.header-row > .func-cell:last-child > div {
  border-right: 0 none;
}

.bs-grid > .table-wrap > table > thead > tr.header-row > .func-cell.checkbox {
  color: var(--color-text-light);
}

.bs-grid > .table-wrap > table > thead > tr.header-row > .func-cell.checkbox.checked {
  color: var(--color-text);
}

.bs-grid > .table-wrap > table > thead > tr.header-row > .func-cell.serial-no {
  min-width: 40px;
}

.bs-grid > .table-wrap > table > thead > tr.header-row > .func-cell.edit-icon {
  min-width: 33px;
}

.bs-grid > .table-wrap > table > thead > tr.header-row:has(.has-filter) th > div {
  height: 50px;
}

.bs-grid > .table-wrap > table > thead > tr.header-row > th {
  position: sticky;
  top: 0;
  z-index: 1;
  white-space: nowrap;
  vertical-align: middle;
  background-color: var(--gray-100);
}

.bs-grid > .table-wrap > table > thead > tr.header-row > th:has(.bs-select, .bs-multi-select, .bs-tree-select, .bs-tree-multi-select):not(:has(.empty)) {
  background-color: var(--primary-100);
}

.bs-grid > .table-wrap > table > thead > tr.header-row > th:last-child > div {
  border-right-color: transparent;
}

.bs-grid > .table-wrap > table > thead > tr.header-row > th > div {
  border-right: 1px solid var(--gray-200);
  border-bottom: 1px solid var(--gray-200);
  min-height: 36.5px;
  text-align: left;
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow: visible;
}

.bs-grid > .table-wrap > table > thead > tr.header-row > th > div .bs-select, .bs-grid > .table-wrap > table > thead > tr.header-row > th > div .bs-multi-select, .bs-grid > .table-wrap > table > thead > tr.header-row > th > div .bs-tree-select {
  margin-top: 4px;
  width: 100%;
  background-color: transparent;
}

.bs-grid > .table-wrap > table > thead > tr.header-row > th > div .bs-select > .selected, .bs-grid > .table-wrap > table > thead > tr.header-row > th > div .bs-multi-select > .selected, .bs-grid > .table-wrap > table > thead > tr.header-row > th > div .bs-tree-select > .selected {
  width: 100%;
  border: 0;
  height: 16px;
  padding: 0;
  background-color: transparent;
}

.bs-grid > .table-wrap > table > thead > tr.header-row > th > div .bs-select > .bs-select-popup, .bs-grid > .table-wrap > table > thead > tr.header-row > th > div .bs-multi-select > .bs-select-popup, .bs-grid > .table-wrap > table > thead > tr.header-row > th > div .bs-tree-select > .bs-select-popup {
  margin-top: 4px;
  margin-left: -4px;
}

.bs-grid > .table-wrap > table > thead > tr.header-row > th.fixed {
  z-index: 3;
}

.bs-grid > .table-wrap > table > tbody > tr > td.fixed {
  position: sticky;
  left: 0;
  z-index: 2;
  white-space: nowrap;
}

.bs-grid > .table-wrap > table > tbody > tr.data-row {
  position: relative;
}

.bs-grid > .table-wrap > table > tbody > tr.data-row > td > div {
  border-right: 1px solid transparent;
}

.bs-grid > .table-wrap > table > tbody > tr.data-row:nth-child(odd) > td {
  background-color: var(--grid-row-odd-color);
}

.bs-grid > .table-wrap > table > tbody > tr.data-row:nth-child(odd) > td > div {
  border-color: var(--grid-row-odd-color);
}

.bs-grid > .table-wrap > table > tbody > tr.data-row:nth-child(even) > td {
  background-color: var(--grid-row-even-color);
}

.bs-grid > .table-wrap > table > tbody > tr.data-row:nth-child(even) > td > div {
  border-color: var(--grid-row-even-color);
}

.bs-grid > .table-wrap > table > tbody > tr > td.func-cell {
  line-height: 1;
}

.bs-grid > .table-wrap > table > tbody > tr > td.func-cell.serial-no {
  text-align: right;
}

.bs-grid > .table-wrap > table > tbody > tr > td.func-cell.checkbox {
  color: var(--color-text-light);
}

.bs-grid > .table-wrap > table > tbody > tr > td.func-cell.checkbox.checked {
  color: var(--color-text);
}

.bs-grid > .table-wrap > table > tbody > tr.data-row:hover > td {
  background-color: var(--gray-200);
}

.bs-grid > .table-wrap > table > tbody > tr.data-row:hover > td > div {
  border-right-color: var(--gray-200);
}

.bs-grid > .table-wrap > table > tbody > tr.data-row:hover > td:first-child > div {
  border-right-color: var(--gray-200);
}

.bs-grid > .table-wrap > table > tbody > tr.data-row:hover > td:last-child > div {
  border-right-color: var(--gray-200);
}

.bs-grid > .table-wrap > table > tbody > tr.data-row.selected > td {
  background-color: var(--primary-200);
}

.bs-grid > .table-wrap > table > tbody > tr.data-row.selected > td > div {
  border-right-color: var(--primary-200);
}

.bs-grid > .table-wrap > table > tbody > tr.data-row.selected:hover td:first-child > div {
  border-right-color: var(--primary-200) !important;
}

.bs-grid > .table-wrap > table > tbody > tr.data-row.selected:hover td:last-child > div {
  border-right-color: var(--primary-200) !important;
}

.bs-grid.h-scrolled .header-row .fixed:after,
.bs-grid.h-scrolled .data-row .fixed:after {
  display: block;
  position: absolute;
  top: 0;
  right: -8px;
  width: 8px;
  height: 100%;
  content: "";
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.05) 0%, rgba(0, 0, 0, 0) 100%);
}

.bs-grid.v-scrolled .header-row > th > div {
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.07);
}

[data-theme=dark] .bs-grid.h-scrolled .header-row .fixed:after,
[data-theme=dark] .bs-grid.h-scrolled .data-row .fixed:after {
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0) 100%);
}

[data-theme=dark] .bs-grid > .table-wrap > table > thead > tr.header-row > th:has(.bs-select, .bs-multi-select, .bs-tree-select, .bs-tree-multi-select):not(:has(.empty)) {
  background-color: var(--primary-400);
  color: var(--dark);
}

[data-theme=dark] .bs-grid > .table-wrap > table > thead > tr.header-row > th:has(.bs-select, .bs-multi-select, .bs-tree-select, .bs-tree-multi-select):not(:has(.empty)) .bs-select, [data-theme=dark] .bs-grid > .table-wrap > table > thead > tr.header-row > th:has(.bs-select, .bs-multi-select, .bs-tree-select, .bs-tree-multi-select):not(:has(.empty)) .bs-multi-select, [data-theme=dark] .bs-grid > .table-wrap > table > thead > tr.header-row > th:has(.bs-select, .bs-multi-select, .bs-tree-select, .bs-tree-multi-select):not(:has(.empty)) .bs-tree-select, [data-theme=dark] .bs-grid > .table-wrap > table > thead > tr.header-row > th:has(.bs-select, .bs-multi-select, .bs-tree-select, .bs-tree-multi-select):not(:has(.empty)) .bs-tree-multi-select {
  color: var(--dark);
}

.bs-grid.with-border > .table-wrap > table > tbody > tr {
  border-bottom: 1px solid var(--gray-200);
}

.bs-grid.with-border > .table-wrap > table > tbody > tr.data-row:nth-child(even):not(:hover) > td {
  background-color: var(--grid-row-odd-color);
}

.bs-grid.with-border > .table-wrap > table > tbody > tr.data-row:nth-child(even):not(:hover) > td > div {
  border-color: var(--grid-row-odd-color);
}

.bs-grid > .table-wrap > table > tbody > tr.data-row:hover > .bs-grid-merged-cell {
  background-color: var(--grid-row-odd-color);
}

.bs-box-component-wrap, .bs-select-wrap, .bs-input-wrap {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: left;
}

.bs-box-component-wrap .message, .bs-select-wrap .message, .bs-input-wrap .message {
  margin-top: 4px;
  font-size: 0.9em;
}

.bs-box-component-base, .bs-select-wrap > .selected, .bs-input-base, .bs-text-filter .input-wrap, .bs-text-filter .textarea-wrap {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: left;
  background-color: var(--body-bg);
}

.bs-input-wrap .suffix,
.bs-input-wrap .prefix {
  font-size: 0.9em;
  margin-right: 4px;
  margin-left: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}

.bs-input-wrap .suffix:first-child,
.bs-input-wrap .prefix:first-child {
  margin-left: 4px;
}

.bs-input-wrap .suffix .font-icon,
.bs-input-wrap .prefix .font-icon {
  font-size: 0.9em;
}

.bs-input-wrap .suffix img,
.bs-input-wrap .prefix img {
  width: 0.9em;
  height: 0.9em;
}

[data-theme=dark] .bs-input-wrap .suffix img,
[data-theme=dark] .bs-input-wrap .prefix img {
  filter: invert(1);
}

.bs-input-base, .bs-text-filter .input-wrap, .bs-text-filter .textarea-wrap {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}

.bs-input-base > input, .bs-text-filter .input-wrap > input, .bs-text-filter .textarea-wrap > input {
  border: 0;
  border-radius: 0;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  flex-basis: 1em;
  padding: 0 6px;
  background-color: transparent;
  width: 100%;
  color: var(--body-text);
}

.bs-input-base > textarea, .bs-text-filter .input-wrap > textarea, .bs-text-filter .textarea-wrap > textarea {
  border: 0;
  border-radius: 4px;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  padding: 6px;
  line-height: 1.4;
  font-family: sans-serif;
  background-color: var(--body-bg);
  color: var(--body-text);
}

.bs-input-base:hover, .bs-text-filter .input-wrap:hover, .bs-text-filter .textarea-wrap:hover {
  border-color: var(--border-hover);
}

.bs-input-base:has(:focus), .bs-text-filter .input-wrap:has(:focus), .bs-text-filter .textarea-wrap:has(:focus) {
  border-color: var(--color-focus);
  border-width: 1px;
}

.bs-text-input.modified > .input-area,
.bs-number-input.modified > .input-area,
.bs-price-input.modified > .input-area,
.bs-date-input.modified > .input-area,
.bs-date-range.modified > .input-area,
.bs-multi-lang-text-input.modified > .input-area,
.bs-multi-lang-text-area.modified > .input-area,
.bs-multi-lang-rich-text.modified > .input-area,
.bs-text-area.modified > .input-area,
.bs-rich-text.modified > .input-area {
  border-color: var(--purple) !important;
}

.bs-text-input.error > .input-area,
.bs-number-input.error > .input-area,
.bs-price-input.error > .input-area,
.bs-date-input.error > .input-area,
.bs-date-range.error > .input-area,
.bs-multi-lang-text-input.error > .input-area,
.bs-multi-lang-text-area.error > .input-area,
.bs-multi-lang-rich-text.error > .input-area,
.bs-text-area.error > .input-area,
.bs-rich-text.error > .input-area {
  border-color: var(--danger) !important;
}

.bs-text-input.error > .input-area > input,
.bs-number-input.error > .input-area > input,
.bs-price-input.error > .input-area > input,
.bs-date-input.error > .input-area > input,
.bs-date-range.error > .input-area > input,
.bs-multi-lang-text-input.error > .input-area > input,
.bs-multi-lang-text-area.error > .input-area > input,
.bs-multi-lang-rich-text.error > .input-area > input,
.bs-text-area.error > .input-area > input,
.bs-rich-text.error > .input-area > input {
  color: var(--danger) !important;
}

.bs-text-input.disabled > .input-area,
.bs-number-input.disabled > .input-area,
.bs-price-input.disabled > .input-area,
.bs-date-input.disabled > .input-area,
.bs-date-range.disabled > .input-area,
.bs-multi-lang-text-input.disabled > .input-area,
.bs-multi-lang-text-area.disabled > .input-area,
.bs-multi-lang-rich-text.disabled > .input-area,
.bs-text-area.disabled > .input-area,
.bs-rich-text.disabled > .input-area {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}

.bs-text-input.disabled > .input-area > input,
.bs-number-input.disabled > .input-area > input,
.bs-price-input.disabled > .input-area > input,
.bs-date-input.disabled > .input-area > input,
.bs-date-range.disabled > .input-area > input,
.bs-multi-lang-text-input.disabled > .input-area > input,
.bs-multi-lang-text-area.disabled > .input-area > input,
.bs-multi-lang-rich-text.disabled > .input-area > input,
.bs-text-area.disabled > .input-area > input,
.bs-rich-text.disabled > .input-area > input {
  color: var(--gray-400) !important;
  background-color: var(--gray-100) !important;
}

.bs-text-input.disabled > .input-area > textarea,
.bs-number-input.disabled > .input-area > textarea,
.bs-price-input.disabled > .input-area > textarea,
.bs-date-input.disabled > .input-area > textarea,
.bs-date-range.disabled > .input-area > textarea,
.bs-multi-lang-text-input.disabled > .input-area > textarea,
.bs-multi-lang-text-area.disabled > .input-area > textarea,
.bs-multi-lang-rich-text.disabled > .input-area > textarea,
.bs-text-area.disabled > .input-area > textarea,
.bs-rich-text.disabled > .input-area > textarea {
  background-color: var(--gray-100) !important;
}

.bs-date-input .view-mode,
.bs-date-range .view-mode {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}

.bs-date-input .view-mode::before,
.bs-date-range .view-mode::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-date-input .extra-dates,
.bs-date-range .extra-dates,
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  color: var(--body-text);
  margin-top: 4px;
}

.bs-date-input .extra-dates .extra-date,
.bs-date-range .extra-dates .extra-date,
.bs-calendar .extra-dates .extra-date,
.bs-calendar-range .extra-dates .extra-date {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8125rem;
}

.bs-date-input .extra-dates .extra-date::before,
.bs-date-range .extra-dates .extra-date::before,
.bs-calendar .extra-dates .extra-date::before,
.bs-calendar-range .extra-dates .extra-date::before {
  content: "globe";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}

.bs-checkbox-base {
  display: inline-block;
  color: var(--body-text);
  white-space: nowrap;
}

.bs-checkbox-base input {
  appearance: none;
  margin: 0;
  outline: 0;
}

.bs-checkbox-base input::before {
  font-family: var(--icon-font-family);
  font-size: 20px;
  vertical-align: middle;
  cursor: pointer;
  color: var(--body-text);
}

.bs-checkbox-base input:hover {
  color: var(--gray-500);
}

.bs-checkbox-base input:hover ~ label {
  color: var(--gray-500);
}

.bs-checkbox-base input:focus::before {
  color: var(--color-focus);
}

.bs-checkbox-base input:focus ~ label {
  color: var(--color-focus);
}

.bs-checkbox-base.modified input::before {
  color: var(--purple) !important;
}

.bs-checkbox-base.modified input ~ label {
  color: var(--purple) !important;
}

.bs-checkbox-base.error input::before {
  color: var(--danger) !important;
}

.bs-checkbox-base.error input ~ label {
  color: var(--danger) !important;
}

.bs-checkbox-base.disabled input::before {
  color: var(--gray-400) !important;
}

.bs-checkbox-base.disabled input ~ label {
  color: var(--gray-400) !important;
}

.bs-checkbox-base label {
  display: inline-block;
  vertical-align: middle;
  padding: 4px 2px;
  cursor: pointer;
}

.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input::before {
  color: var(--purple) !important;
}

.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input ~ label {
  color: var(--purple) !important;
}

.bs-checkbox-group.error .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input::before {
  color: var(--danger) !important;
}

.bs-checkbox-group.error .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input ~ label {
  color: var(--danger) !important;
}

.bs-checkbox-group.disabled input::before,
.bs-radio-button-group.disabled input::before {
  color: var(--gray-400) !important;
}

.bs-checkbox-group.disabled input ~ label,
.bs-radio-button-group.disabled input ~ label {
  color: var(--gray-400) !important;
}

.bs-select-wrap {
  position: relative;
  outline: 0;
  background-color: var(--body-bg);
  color: var(--body-text);
  min-width: 64px;
}

.bs-select-wrap:hover > .selected {
  border-color: var(--border-hover);
}

.bs-select-wrap:focus > .selected {
  border-color: var(--color-focus);
}

.bs-select-wrap > .selected {
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 0 6px;
  min-width: 100%;
  cursor: pointer;
  display: flex;
}

.bs-select-wrap > .selected .label {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.bs-select-wrap > .selected .placeholder {
  color: var(--gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
}

.bs-select-wrap > .selected .dropdown-btn {
  font-family: var(--icon-font-family);
  margin-right: -4px;
  margin-left: 4px;
  user-select: none;
  transition: transform 0.2s linear;
}

.bs-select-wrap.popup-open .dropdown-btn {
  transform: rotate(180deg);
}

.bs-select-wrap.modified > .selected {
  border-color: var(--purple) !important;
}

.bs-select-wrap.error > .selected {
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}

.bs-select-wrap.disabled > .selected {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-500) !important;
}

.bs-select-wrap.view-mode {
  background-color: transparent;
}

.bs-select-wrap .small-progress {
  font-family: var(--icon-font-family);
  font-size: 0.9em;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 0 2px;
  color: var(--gray-400);
  animation: spin 1s linear infinite;
}

.bs-field-error {
  color: var(--color-error);
  margin-top: 4px;
}

.bs-clickable {
  user-select: none;
  cursor: pointer;
}

.bs-clickable:hover {
  filter: opacity(75%);
}

.bs-clickable:active {
  filter: opacity(50%);
}

.bs-clickable.disabled {
  filter: opacity(40%);
}

.component-shadow-base {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}

[data-theme=dark] .component-shadow-base {
  box-shadow: 2px 2px 8px rgba(255, 255, 255, 0.1);
}

.font-icon {
  font-family: var(--icon-font-family);
  font-size: 1rem;
  max-width: 1em;
}

.font-icon.filled {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}

.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}

.fade-enter,
.fade-leave-to {
  opacity: 0;
}

.text-description {
  margin-top: 2px;
  color: var(--gray-400);
  font-size: 0.923em;
}

.bs-drop-position {
  position: absolute;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--primary-400);
  opacity: 0.7;
  z-index: 100;
}

.bs-drop-position.vertical {
  left: 0;
  width: 100%;
  height: 8px;
}

.bs-drop-position.vertical.before {
  top: -4px;
}

.bs-drop-position.vertical.after {
  bottom: -4px;
}

.bs-drop-position.horizontal {
  left: 0;
  width: 8px;
  height: 100%;
}

.bs-drop-position.horizontal.before {
  left: -4px;
}

.bs-drop-position.horizontal.after {
  right: -4px;
}

.bs-droppable-horizontal {
  transition: transform 0.3s ease;
}

.bs-droppable-horizontal.bs-dropping-before, .bs-droppable-horizontal.bs-dropping-after-following {
  transform: translateX(12px);
  z-index: 1;
}

.bs-droppable-horizontal.bs-dropping-after, .bs-droppable-horizontal.bs-dropping-before-preceding {
  transform: translateX(-12px);
  z-index: 1;
}

.bs-dragging-source {
  opacity: 0.5;
}

.bs-text-filter {
  position: relative;
  display: inline-flex;
  flex-direction: column;
  align-items: start;
  width: 300px;
  min-width: 100px;
}

.bs-text-filter .input-wrap {
  border: 1px solid var(--border);
  border-radius: 2px;
  width: 100%;
  align-items: start;
}

.bs-text-filter .textarea-wrap {
  border: 1px solid var(--border);
  border-radius: 2px;
  width: 100%;
  height: 72px;
  align-items: start;
}

.bs-text-filter .textarea-wrap textarea {
  resize: none;
}

.bs-text-filter .filter-caption {
  margin-top: 8px;
  font-size: 0.923em;
  color: var(--gray-400);
}

.bs-text-filter .filter-caption > span {
  margin-right: 4px;
}

.bs-text-filter .filter-caption > span:not(:last-child)::after {
  content: ",";
}

.bs-text-filter.modified .input-wrap,
.bs-text-filter.modified .textarea-wrap {
  border-color: var(--primary) !important;
}

.bs-text-filter.modified .input-wrap input,
.bs-text-filter.modified .input-wrap textarea,
.bs-text-filter.modified .textarea-wrap input,
.bs-text-filter.modified .textarea-wrap textarea {
  color: var(--primary) !important;
}

.bs-text-filter.error .input-wrap,
.bs-text-filter.error .textarea-wrap {
  border-color: var(--danger) !important;
}

.bs-text-filter.error .input-wrap input,
.bs-text-filter.error .input-wrap textarea,
.bs-text-filter.error .textarea-wrap input,
.bs-text-filter.error .textarea-wrap textarea {
  color: var(--danger) !important;
}

.bs-box-component-wrap, .bs-select-wrap, .bs-input-wrap, .bs-date-range-filter {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: left;
}

.bs-box-component-wrap .message, .bs-select-wrap .message, .bs-input-wrap .message, .bs-date-range-filter .message {
  margin-top: 4px;
  font-size: 0.9em;
}

.bs-box-component-base, .bs-select-wrap > .selected, .bs-input-base, .bs-date-range-filter .input-area {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: left;
  background-color: var(--body-bg);
}

.bs-input-wrap .suffix, .bs-date-range-filter .suffix,
.bs-input-wrap .prefix,
.bs-date-range-filter .prefix {
  font-size: 0.9em;
  margin-right: 4px;
  margin-left: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}

.bs-input-wrap .suffix:first-child, .bs-date-range-filter .suffix:first-child,
.bs-input-wrap .prefix:first-child,
.bs-date-range-filter .prefix:first-child {
  margin-left: 4px;
}

.bs-input-wrap .suffix .font-icon, .bs-date-range-filter .suffix .font-icon,
.bs-input-wrap .prefix .font-icon,
.bs-date-range-filter .prefix .font-icon {
  font-size: 0.9em;
}

.bs-input-wrap .suffix img, .bs-date-range-filter .suffix img,
.bs-input-wrap .prefix img,
.bs-date-range-filter .prefix img {
  width: 0.9em;
  height: 0.9em;
}

[data-theme=dark] .bs-input-wrap .suffix img, [data-theme=dark] .bs-date-range-filter .suffix img,
[data-theme=dark] .bs-input-wrap .prefix img,
[data-theme=dark] .bs-date-range-filter .prefix img {
  filter: invert(1);
}

.bs-input-base, .bs-date-range-filter .input-area {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}

.bs-input-base > input, .bs-date-range-filter .input-area > input {
  border: 0;
  border-radius: 0;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  flex-basis: 1em;
  padding: 0 6px;
  background-color: transparent;
  width: 100%;
  color: var(--body-text);
}

.bs-input-base > textarea, .bs-date-range-filter .input-area > textarea {
  border: 0;
  border-radius: 4px;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  padding: 6px;
  line-height: 1.4;
  font-family: sans-serif;
  background-color: var(--body-bg);
  color: var(--body-text);
}

.bs-input-base:hover, .bs-date-range-filter .input-area:hover {
  border-color: var(--border-hover);
}

.bs-input-base:has(:focus), .bs-date-range-filter .input-area:has(:focus) {
  border-color: var(--color-focus);
  border-width: 1px;
}

.bs-text-input.modified > .input-area,
.bs-number-input.modified > .input-area,
.bs-price-input.modified > .input-area,
.bs-date-input.modified > .input-area,
.bs-date-range.modified > .input-area,
.bs-multi-lang-text-input.modified > .input-area,
.bs-multi-lang-text-area.modified > .input-area,
.bs-multi-lang-rich-text.modified > .input-area,
.bs-text-area.modified > .input-area,
.bs-rich-text.modified > .input-area {
  border-color: var(--purple) !important;
}

.bs-text-input.error > .input-area,
.bs-number-input.error > .input-area,
.bs-price-input.error > .input-area,
.bs-date-input.error > .input-area,
.bs-date-range.error > .input-area,
.bs-multi-lang-text-input.error > .input-area,
.bs-multi-lang-text-area.error > .input-area,
.bs-multi-lang-rich-text.error > .input-area,
.bs-text-area.error > .input-area,
.bs-rich-text.error > .input-area {
  border-color: var(--danger) !important;
}

.bs-text-input.error > .input-area > input,
.bs-number-input.error > .input-area > input,
.bs-price-input.error > .input-area > input,
.bs-date-input.error > .input-area > input,
.bs-date-range.error > .input-area > input,
.bs-multi-lang-text-input.error > .input-area > input,
.bs-multi-lang-text-area.error > .input-area > input,
.bs-multi-lang-rich-text.error > .input-area > input,
.bs-text-area.error > .input-area > input,
.bs-rich-text.error > .input-area > input {
  color: var(--danger) !important;
}

.bs-text-input.disabled > .input-area,
.bs-number-input.disabled > .input-area,
.bs-price-input.disabled > .input-area,
.bs-date-input.disabled > .input-area,
.bs-date-range.disabled > .input-area,
.bs-multi-lang-text-input.disabled > .input-area,
.bs-multi-lang-text-area.disabled > .input-area,
.bs-multi-lang-rich-text.disabled > .input-area,
.bs-text-area.disabled > .input-area,
.bs-rich-text.disabled > .input-area {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}

.bs-text-input.disabled > .input-area > input,
.bs-number-input.disabled > .input-area > input,
.bs-price-input.disabled > .input-area > input,
.bs-date-input.disabled > .input-area > input,
.bs-date-range.disabled > .input-area > input,
.bs-multi-lang-text-input.disabled > .input-area > input,
.bs-multi-lang-text-area.disabled > .input-area > input,
.bs-multi-lang-rich-text.disabled > .input-area > input,
.bs-text-area.disabled > .input-area > input,
.bs-rich-text.disabled > .input-area > input {
  color: var(--gray-400) !important;
  background-color: var(--gray-100) !important;
}

.bs-text-input.disabled > .input-area > textarea,
.bs-number-input.disabled > .input-area > textarea,
.bs-price-input.disabled > .input-area > textarea,
.bs-date-input.disabled > .input-area > textarea,
.bs-date-range.disabled > .input-area > textarea,
.bs-multi-lang-text-input.disabled > .input-area > textarea,
.bs-multi-lang-text-area.disabled > .input-area > textarea,
.bs-multi-lang-rich-text.disabled > .input-area > textarea,
.bs-text-area.disabled > .input-area > textarea,
.bs-rich-text.disabled > .input-area > textarea {
  background-color: var(--gray-100) !important;
}

.bs-date-input .view-mode,
.bs-date-range .view-mode {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}

.bs-date-input .view-mode::before,
.bs-date-range .view-mode::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-date-input .extra-dates,
.bs-date-range .extra-dates,
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  color: var(--body-text);
  margin-top: 4px;
}

.bs-date-input .extra-dates .extra-date,
.bs-date-range .extra-dates .extra-date,
.bs-calendar .extra-dates .extra-date,
.bs-calendar-range .extra-dates .extra-date {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8125rem;
}

.bs-date-input .extra-dates .extra-date::before,
.bs-date-range .extra-dates .extra-date::before,
.bs-calendar .extra-dates .extra-date::before,
.bs-calendar-range .extra-dates .extra-date::before {
  content: "globe";
  width: 1em;
  font-family: var(--icon-font-family);
}

.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}

.bs-checkbox-base {
  display: inline-block;
  color: var(--body-text);
  white-space: nowrap;
}

.bs-checkbox-base input {
  appearance: none;
  margin: 0;
  outline: 0;
}

.bs-checkbox-base input::before {
  font-family: var(--icon-font-family);
  font-size: 20px;
  vertical-align: middle;
  cursor: pointer;
  color: var(--body-text);
}

.bs-checkbox-base input:hover {
  color: var(--gray-500);
}

.bs-checkbox-base input:hover ~ label {
  color: var(--gray-500);
}

.bs-checkbox-base input:focus::before {
  color: var(--color-focus);
}

.bs-checkbox-base input:focus ~ label {
  color: var(--color-focus);
}

.bs-checkbox-base.modified input::before {
  color: var(--purple) !important;
}

.bs-checkbox-base.modified input ~ label {
  color: var(--purple) !important;
}

.bs-checkbox-base.error input::before {
  color: var(--danger) !important;
}

.bs-checkbox-base.error input ~ label {
  color: var(--danger) !important;
}

.bs-checkbox-base.disabled input::before {
  color: var(--gray-400) !important;
}

.bs-checkbox-base.disabled input ~ label {
  color: var(--gray-400) !important;
}

.bs-checkbox-base label {
  display: inline-block;
  vertical-align: middle;
  padding: 4px 2px;
  cursor: pointer;
}

.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input::before {
  color: var(--purple) !important;
}

.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input ~ label {
  color: var(--purple) !important;
}

.bs-checkbox-group.error .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input::before {
  color: var(--danger) !important;
}

.bs-checkbox-group.error .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input ~ label {
  color: var(--danger) !important;
}

.bs-checkbox-group.disabled input::before,
.bs-radio-button-group.disabled input::before {
  color: var(--gray-400) !important;
}

.bs-checkbox-group.disabled input ~ label,
.bs-radio-button-group.disabled input ~ label {
  color: var(--gray-400) !important;
}

.bs-select-wrap {
  position: relative;
  outline: 0;
  background-color: var(--body-bg);
  color: var(--body-text);
  min-width: 64px;
}

.bs-select-wrap:hover > .selected {
  border-color: var(--border-hover);
}

.bs-select-wrap:focus > .selected {
  border-color: var(--color-focus);
}

.bs-select-wrap > .selected {
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 0 6px;
  min-width: 100%;
  cursor: pointer;
  display: flex;
}

.bs-select-wrap > .selected .label {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.bs-select-wrap > .selected .placeholder {
  color: var(--gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
}

.bs-select-wrap > .selected .dropdown-btn {
  font-family: var(--icon-font-family);
  margin-right: -4px;
  margin-left: 4px;
  user-select: none;
  transition: transform 0.2s linear;
}

.bs-select-wrap.popup-open .dropdown-btn {
  transform: rotate(180deg);
}

.bs-select-wrap.modified > .selected {
  border-color: var(--purple) !important;
}

.bs-select-wrap.error > .selected {
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}

.bs-select-wrap.disabled > .selected {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-500) !important;
}

.bs-select-wrap.view-mode {
  background-color: transparent;
}

.bs-select-wrap .small-progress {
  font-family: var(--icon-font-family);
  font-size: 0.9em;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 0 2px;
  color: var(--gray-400);
  animation: spin 1s linear infinite;
}

.bs-field-error {
  color: var(--color-error);
  margin-top: 4px;
}

.bs-clickable {
  user-select: none;
  cursor: pointer;
}

.bs-clickable:hover {
  filter: opacity(75%);
}

.bs-clickable:active {
  filter: opacity(50%);
}

.bs-clickable.disabled {
  filter: opacity(40%);
}

.component-shadow-base {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}

[data-theme=dark] .component-shadow-base {
  box-shadow: 2px 2px 8px rgba(255, 255, 255, 0.1);
}

.font-icon {
  font-family: var(--icon-font-family);
  font-size: 1rem;
  max-width: 1em;
}

.font-icon.filled {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}

.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}

.fade-enter,
.fade-leave-to {
  opacity: 0;
}

.text-description {
  margin-top: 2px;
  color: var(--gray-400);
  font-size: 0.923em;
}

.bs-drop-position {
  position: absolute;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--primary-400);
  opacity: 0.7;
  z-index: 100;
}

.bs-drop-position.vertical {
  left: 0;
  width: 100%;
  height: 8px;
}

.bs-drop-position.vertical.before {
  top: -4px;
}

.bs-drop-position.vertical.after {
  bottom: -4px;
}

.bs-drop-position.horizontal {
  left: 0;
  width: 8px;
  height: 100%;
}

.bs-drop-position.horizontal.before {
  left: -4px;
}

.bs-drop-position.horizontal.after {
  right: -4px;
}

.bs-droppable-horizontal {
  transition: transform 0.3s ease;
}

.bs-droppable-horizontal.bs-dropping-before, .bs-droppable-horizontal.bs-dropping-after-following {
  transform: translateX(12px);
  z-index: 1;
}

.bs-droppable-horizontal.bs-dropping-after, .bs-droppable-horizontal.bs-dropping-before-preceding {
  transform: translateX(-12px);
  z-index: 1;
}

.bs-dragging-source {
  opacity: 0.5;
}

.bs-date-range-filter .input-area {
  border: 1px solid var(--border);
  border-radius: 2px;
  width: 100%;
  display: flex;
  align-items: center;
  padding-right: 8px;
}

.bs-date-range-filter .input-area .font-icon {
  margin: 0 6px;
  font-size: 14px;
}

.bs-date-range-filter .input-area input {
  border-radius: 0;
  padding-right: 0;
  width: 9em;
}

.date-filters .bs-clickable {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 26px;
  height: 26px;
  border: 1px solid var(--border);
  border-radius: 2px;
}

.date-filters .input-area .bs-clickable {
  border: 0 none;
  margin: 0;
}

.bs-grid-lookup {
  background-color: var(--body-bg);
  line-height: 1;
}

.bs-grid-control {
  display: flex;
  align-items: center;
  color: var(--gray);
}

.bs-grid-control > div {
  padding-right: 8px;
}

.bs-grid-control .bs-select.page-length {
  min-width: auto;
}

.bs-grid-control .bs-select.page-length .selected {
  height: 18px;
  border: 0;
  padding: 0;
  border-radius: 0;
}

.bs-card-layout {
  width: 100%;
}

.bs-card-layout .card-layout-header {
  height: 44px;
  border-bottom: 1px solid var(--border-light);
}

.bs-card-layout .card-layout-title {
  font-size: 1rem;
  margin-left: 6px;
}

.bs-card-layout .expand-btn {
  display: inline-block;
  transition: transform 0.2s linear;
  transform: rotate(0);
  font-size: 1.4rem;
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
  color: var(--gray-500);
}

.bs-card-layout.expanded .expand-btn {
  transform: rotate(90deg);
}

.bs-card-layout .title-icon {
  color: var(--gray-700);
  font-size: 1.4rem;
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}

.bs-card-layout .title-icon-box {
  background-color: var(--gray-700);
  width: 1rem;
  height: 1rem;
  border-radius: 2px;
  margin: 0 6px 0 4px;
} /* Layout Utility */
.flex-row, .bs-layout-horizontal, .bs-tab-sheet .tab-bar .tabs, .bs-layout-horizontal-wrap {
  display: flex;
  flex-direction: row;
}

.flex-row-inline, .bs-layout-horizontal-inline {
  display: inline-flex;
  flex-direction: row;
}

.flex-column, .bs-layout-vertical, .bs-layout-vertical-wrap {
  display: flex;
  flex-direction: column;
}

.flex-column-inline, .bs-layout-vertical-inline {
  display: inline-flex;
  flex-direction: column;
}

.flex-wrap, .bs-layout-vertical-wrap, .bs-layout-horizontal-wrap {
  flex-wrap: wrap;
}

.flex-grow-0 {
  flex-grow: 0;
}

.flex-shrink-0 {
  flex-shrink: 0;
}

.flex-grow-1 {
  flex-grow: 1;
}

.flex-shrink-1 {
  flex-shrink: 1;
}

.flex-grow-2 {
  flex-grow: 2;
}

.flex-shrink-2 {
  flex-shrink: 2;
}

.flex-grow-3 {
  flex-grow: 3;
}

.flex-shrink-3 {
  flex-shrink: 3;
}

.flex-grow-4 {
  flex-grow: 4;
}

.flex-shrink-4 {
  flex-shrink: 4;
}

.flex-grow-5 {
  flex-grow: 5;
}

.flex-shrink-5 {
  flex-shrink: 5;
}

.flex-grow-6 {
  flex-grow: 6;
}

.flex-shrink-6 {
  flex-shrink: 6;
}

.flex-grow-7 {
  flex-grow: 7;
}

.flex-shrink-7 {
  flex-shrink: 7;
}

.flex-grow-8 {
  flex-grow: 8;
}

.flex-shrink-8 {
  flex-shrink: 8;
}

.gap-0 {
  gap: 0px;
}

.gap-1 {
  gap: 1px;
}

.gap-2 {
  gap: 2px;
}

.gap-3 {
  gap: 3px;
}

.gap-4 {
  gap: 4px;
}

.gap-5 {
  gap: 5px;
}

.gap-6 {
  gap: 6px;
}

.gap-7 {
  gap: 7px;
}

.gap-8 {
  gap: 8px;
}

.gap-9 {
  gap: 9px;
}

.gap-10 {
  gap: 10px;
}

.gap-11 {
  gap: 11px;
}

.gap-12 {
  gap: 12px;
}

.gap-13 {
  gap: 13px;
}

.gap-14 {
  gap: 14px;
}

.gap-15 {
  gap: 15px;
}

.gap-16 {
  gap: 16px;
}

.gap-17 {
  gap: 17px;
}

.gap-18 {
  gap: 18px;
}

.gap-19 {
  gap: 19px;
}

.gap-20 {
  gap: 20px;
}

.gap-21 {
  gap: 21px;
}

.gap-22 {
  gap: 22px;
}

.gap-23 {
  gap: 23px;
}

.gap-24 {
  gap: 24px;
}

.gap-25 {
  gap: 25px;
}

.gap-26 {
  gap: 26px;
}

.gap-27 {
  gap: 27px;
}

.gap-28 {
  gap: 28px;
}

.gap-29 {
  gap: 29px;
}

.gap-30 {
  gap: 30px;
}

.gap-31 {
  gap: 31px;
}

.gap-32 {
  gap: 32px;
}

.gap-33 {
  gap: 33px;
}

.gap-34 {
  gap: 34px;
}

.gap-35 {
  gap: 35px;
}

.gap-36 {
  gap: 36px;
}

.gap-37 {
  gap: 37px;
}

.gap-38 {
  gap: 38px;
}

.gap-39 {
  gap: 39px;
}

.gap-40 {
  gap: 40px;
}

.gap-41 {
  gap: 41px;
}

.gap-42 {
  gap: 42px;
}

.gap-43 {
  gap: 43px;
}

.gap-44 {
  gap: 44px;
}

.gap-45 {
  gap: 45px;
}

.gap-46 {
  gap: 46px;
}

.gap-47 {
  gap: 47px;
}

.gap-48 {
  gap: 48px;
}

.gap-49 {
  gap: 49px;
}

.gap-50 {
  gap: 50px;
}

.gap-51 {
  gap: 51px;
}

.gap-52 {
  gap: 52px;
}

.gap-53 {
  gap: 53px;
}

.gap-54 {
  gap: 54px;
}

.gap-55 {
  gap: 55px;
}

.gap-56 {
  gap: 56px;
}

.gap-57 {
  gap: 57px;
}

.gap-58 {
  gap: 58px;
}

.gap-59 {
  gap: 59px;
}

.gap-60 {
  gap: 60px;
}

.gap-61 {
  gap: 61px;
}

.gap-62 {
  gap: 62px;
}

.gap-63 {
  gap: 63px;
}

.gap-64 {
  gap: 64px;
}

.flex-align-start {
  align-items: flex-start;
}

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

.flex-align-end {
  align-items: flex-end;
}

.flex-content-start {
  justify-content: flex-start;
}

.flex-content-center {
  justify-content: center;
}

.flex-content-end {
  justify-content: flex-end;
}

/* Bluesea Layout */
.bs-layout-form {
  border-bottom: 1px solid var(--border);
}

.bs-layout-form > div {
  display: flex;
  align-items: center;
}

.bs-layout-form > div > .title {
  padding: 8px 16px;
  width: 12.3076em;
  line-height: 1.2em;
  color: var(--body-text);
}

.bs-layout-form > div > :not(.title) {
  padding: 8px;
  width: 10em;
  flex-grow: 1;
  color: var(--body-text);
}

.bs-layout-form > div:nth-child(odd) {
  background-color: var(--gray-100);
}

.bs-layout-form.title-w-8 > div > .title {
  width: 8em;
}

.bs-layout-form.title-w-10 > div > .title {
  width: 10em;
}

.bs-layout-form.title-w-14 > div > .title {
  width: 14em;
}

.bs-layout-form.title-w-16 > div > .title {
  width: 16em;
}

.bs-layout-form.title-w-18 > div > .title {
  width: 18em;
}

.bs-layout-form.title-w-20 > div > .title {
  width: 20em;
}

.bs-layout-card > .card-title {
  padding: 16px 0;
  border-bottom: 0.8px solid var(--border-light);
  font-size: 1.2em;
  font-weight: 500;
}

.bs-layout-table {
  border-collapse: collapse;
}

.bs-layout-table > tr > td, .bs-layout-table > tr > th, .bs-layout-table > tbody > tr > td, .bs-layout-table > tbody > tr > th {
  padding: 8px;
  border: 1px solid var(--border);
  vertical-align: middle;
  text-align: left;
}

.bs-layout-table > tr > td:first-child, .bs-layout-table > tr > th:first-child, .bs-layout-table > tbody > tr > td:first-child, .bs-layout-table > tbody > tr > th:first-child {
  border-left: 0;
}

.bs-layout-table > tr > td:last-child, .bs-layout-table > tr > th:last-child, .bs-layout-table > tbody > tr > td:last-child, .bs-layout-table > tbody > tr > th:last-child {
  border-right: 0;
}

.bs-tab-sheet {
  height: 200px;
}

.bs-tab-sheet .tab-bar {
  width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
}

.bs-tab-sheet .tab-bar::-webkit-scrollbar {
  display: none;
}

.bs-tab-sheet .tab-bar .tabs {
  padding-top: 8px;
  border-width: 0 0 1px 0;
  border-style: solid;
  border-color: var(--border);
}

.bs-tab-sheet .tab-bar .tabs .tab {
  position: relative;
  padding: 11px 16px 10px;
  color: var(--body-text);
  margin-bottom: -1px;
  white-space: nowrap;
  cursor: pointer;
  overflow-x: hidden;
}

.bs-tab-sheet .tab-bar .tabs .tab + .tab:before {
  content: "|";
  display: block;
  position: absolute;
  top: 10px;
  left: 0;
  width: 1px;
  height: 14px;
  color: var(--border);
}

.bs-tab-sheet .tab-bar .tabs .tab:hover {
  color: var(--primary);
}

.bs-tab-sheet .tab-bar .tabs .tab.selected {
  position: relative;
  z-index: 1;
  padding: 10px 15px 10px;
  border-width: 1px 1px 0 1px;
  border-style: solid;
  border-color: var(--border);
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  color: var(--primary);
  background-color: var(--body-bg);
}

.bs-tab-sheet .tab-bar .tabs .tab.selected:before, .bs-tab-sheet .tab-bar .tabs .tab.selected + .tab:before {
  content: "";
  display: none;
}

.bs-tab-sheet .tab-bar .tabs .tab.disabled {
  color: var(--gray-400);
  cursor: default;
}

.bs-tab-sheet.detail-top {
  padding: 43px 16px 16px 16px;
}

.bs-tab-sheet.detail-top > .tab-bar {
  position: fixed;
  z-index: 5;
}

.bs-tab-sheet.detail-top > .tab-bar .tabs {
  border: 0 none;
  background-color: var(--colored-bg);
}

.bs-tab-sheet.detail-top > .tab-bar .tabs .tab {
  border: 0 none;
  margin-bottom: 0;
}

.bs-tab-sheet.detail-top > .tab-bar .tabs .tab:hover {
  color: var(--primary);
}

.bs-tab-sheet.detail-top > .tab-bar .tabs .tab.selected {
  color: var(--primary);
  background-color: var(--body-bg);
  border-top-right-radius: 10px;
  border-top-left-radius: 10px;
}

.bs-tab-sheet.detail-top > .tab-bar ~ div {
  margin-top: 48px;
  background-color: var(--body-bg);
  border-radius: 10px;
}

.bs-tab-sheet.detail-top > .tab-bar.first-tab ~ div {
  border-top-left-radius: 0;
}

.bs-tab-sheet.compact .tab-bar .tabs .tab {
  padding: 5px 12px 4px;
  border-top-right-radius: 6px;
  border-top-left-radius: 6px;
}

.bs-tab-sheet.compact .tab-bar .tabs .tab.selected {
  padding: 4px 11px 4px;
}

.bs-tab-sheet.compact .tab-bar .tabs .tab + .tab:before {
  top: 4px;
}

.bs-tab-sheet.border-bottom-0 .tab-bar .tabs {
  border-bottom: 0;
}

.bs-list-layout-item {
  position: relative;
  background-color: var(--body-bg);
  border: 1px solid var(--gray-300);
  margin-top: -1px;
}

.bs-list-layout-item.selected {
  border-color: var(--primary);
  z-index: 1;
}

.bs-list-layout-item.selected > .list-item-title {
  background-color: var(--primary-200);
}

.bs-list-layout-item.selected > .list-item-title .font-icon {
  color: var(--primary);
}

.bs-list-layout-item > .list-item-title {
  padding: 8px;
  background-color: var(--gray-200);
}

.bs-list-layout-item:first-child {
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}

.bs-list-layout-item:first-child > .list-item-title {
  border-top-left-radius: 7px;
  border-top-right-radius: 7px;
}

.bs-list-layout-item:last-child {
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
}

.bs-list-layout-item:last-child:not(.expanded) > .list-item-title {
  border-bottom-left-radius: 7px;
  border-bottom-right-radius: 7px;
}

.bs-list-layout-item.expanded > .list-item-title {
  border-bottom: 1px solid var(--gray-300);
}

.bs-list-layout-item .bs-checkbox.checked input::before {
  font-variation-settings: "FILL" 1, "wght" 700, "GRAD" 0, "opsz" 48;
}

.bs-list-layout-item > .list-item-content {
  padding: 8px;
}

.bs-button[data-v-487255f8] {
  padding: 3px;
  height: auto;
}

.bs-button[data-v-487255f8] .font-icon {
  font-size: 12px;
}

.bs-horizontal-layout-resizer {
  cursor: ew-resize;
  transform: scaleX(4);
  user-select: none;
}

.bs-horizontal-layout-resizer .resize-line {
  background-color: var(--gray-200);
  width: 1px;
  height: 100%;
  transform: scaleX(0.25);
}

.bs-vertical-layout-resizer {
  cursor: ns-resize;
  transform: scaleY(4);
  user-select: none;
}

.bs-vertical-layout-resizer .resize-line {
  background-color: var(--gray-200);
  width: 100%;
  height: 1px;
  transform: scaleY(0.25);
}

.remove-btn[data-v-bb93c689],
.add-btn[data-v-bb93c689] .bs-button {
  width: 28px;
  height: auto;
}

.remove-btn[data-v-bb93c689] .font-icon,
.add-btn[data-v-bb93c689] .bs-button ::v-deep(.font-icon) {
  font-size: 12px;
}

.bs-multi-lang-text-input > div {
  display: flex;
}

.bs-multi-lang-text-input .bs-text-input > .input-area > .prefix {
  min-width: 2.4em;
  text-align: center;
  line-height: 1.2;
  white-space: nowrap;
}

.bs-multi-lang-text-input .bs-text-input.required-locale > .input-area > .prefix:after {
  content: "*";
  color: var(--primary);
  margin-left: 1px;
}

.bs-multi-lang-text-area > div {
  display: flex;
}

.bs-multi-lang-text-area .bs-text-area > .input-area > .prefix {
  min-width: 2.4em;
  text-align: center;
  line-height: 1.2;
  white-space: nowrap;
}

.bs-multi-lang-text-area .bs-text-area.required-locale > .input-area > .prefix:after {
  content: "*";
  color: var(--primary);
  margin-left: 1px;
}

.bs-multi-lang-rich-text > div {
  padding-bottom: 4px;
  display: flex;
}

.bs-multi-lang-rich-text .locale-tag {
  align-self: center;
  font-size: 0.9em;
  background-color: var(--gray-200);
  padding: 4px;
  border-radius: 2px;
  line-height: 1.2;
  min-width: 2.4em;
  text-align: center;
}

.bs-multi-lang-rich-text .locale-tag.required-locale:after {
  content: "*";
  color: var(--primary);
  margin-left: 1px;
}

[data-v-f2c0b0b0] .font-icon.left {
  margin-right: 0 !important;
}

.bs-multi-lang-image-upload > .images > div {
  padding-bottom: 4px;
  display: flex;
}

.bs-multi-lang-image-upload > .images .locale-tag {
  font-size: 0.9em;
  margin-bottom: 4px;
  background-color: var(--gray-200);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1.2;
  min-width: 2.4em;
  text-align: center;
  align-self: start;
}

.bs-multi-lang-image-upload > .images .locale-tag.required-locale:after {
  content: "*";
  color: var(--primary);
  margin-left: 1px;
}

.bs-code-editor {
  height: 100%;
}

.bs-code-editor .cm-editor {
  border: 1px solid var(--border);
  background-color: var(--body-bg);
}

.bs-code-editor.modified .cm-editor {
  border-color: var(--purple);
}

.bs-code-editor.disabled .cm-editor {
  border-color: var(--gray-400);
  background-color: var(--gray-100);
}

.bs-code-editor.error .cm-editor {
  border-color: var(--danger);
}

.bs-code-editor .cm-focused {
  outline: 0;
}

.bs-code-editor .cm-panel.cm-search {
  font-size: var(--font-size);
}

.bs-code-editor .cm-panel.cm-search input, .bs-code-editor .cm-panel.cm-search .cm-button, .bs-code-editor .cm-panel.cm-search label {
  font-size: 100%;
}

.bs-code-editor .cm-panel.cm-search label > input {
  vertical-align: middle;
}

.bs-code-editor .ͼ2 .cm-gutters {
  background-color: var(--gray-200) !important;
  border-right-color: var(--border) !important;
}

.bs-code-editor .ͼ2 .cm-activeLineGutter {
  background-color: var(--primary-200);
}

[data-theme=dark] .ͼ2 .cm-activeLineGutter {
  background-color: var(--primary-400);
}

.bs-html-editor .bs-tab-sheet .tabs {
  padding-top: 0;
}

.bs-html-editor.modified .bs-code-editor .cm-editor {
  border-color: var(--purple);
}

.bs-html-editor.disabled .bs-code-editor .cm-editor {
  border-color: var(--gray-400);
  background-color: var(--gray-100);
}

.bs-html-editor.error .bs-code-editor .cm-editor {
  border-color: var(--danger);
}

.bs-multi-lang-html-editor > div {
  padding-bottom: 4px;
  display: flex;
}

.bs-multi-lang-html-editor .locale-tag-wrapper {
  padding-top: 3px;
  padding-right: 2px;
}

.bs-multi-lang-html-editor .locale-tag-wrapper .locale-tag {
  align-self: center;
  font-size: 0.9em;
  background-color: var(--gray-200);
  padding: 2px 8px;
  border-radius: 2px;
  line-height: 1.2;
  min-width: 2.4em;
  text-align: center;
}

.bs-multi-lang-html-editor .locale-tag-wrapper .locale-tag.required-locale:after {
  content: "*";
  color: var(--primary);
  margin-left: 1px;
}

.bs-name-input .label {
  font-size: 0.9em;
  color: var(--gray-400);
}

.bs-address-input .address-caption {
  font-size: 0.9em;
  color: var(--gray-400);
}

.modal-wrapper {
  position: fixed;
  z-index: 201;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
}

.modal-wrapper > .modal-panel {
  background-color: var(--body-bg);
  color: var(--body-text);
  border: 1px solid var(--border);
  padding: 24px;
  border-radius: 4px;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
  outline: 0;
  cursor: move;
  position: relative;
}

.modal-wrapper > .modal-panel.maximized {
  width: calc(100% - 16px) !important;
  height: calc(100% - 16px) !important;
  margin: 8px;
  cursor: default;
}

[data-theme=dark] .modal-wrapper > .modal-panel {
  box-shadow: 0 4px 8px rgba(255, 255, 255, 0.1);
}

.bs-modal-container .modal-curtain {
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  background-color: #000;
  opacity: 0.3;
  z-index: 200;
}

.bs-modal-frame {
  cursor: default;
  height: 100%;
}

.bs-modal-frame .title-bar {
  padding-bottom: 24px;
}

.bs-modal-frame .title-bar .title {
  font-size: 1.3846em;
}

.bs-modal-frame .title-bar .title-buttons {
  text-align: right;
}

.bs-modal-frame .title-bar .close-btn {
  padding: 4px;
}

.bs-modal-frame .title-bar .close-btn .font-icon {
  font-size: 1.6em;
}

.bs-modal-frame > .buttons {
  padding-top: 24px;
}

.bs-tooltip {
  position: fixed;
  z-index: 10000;
  max-width: 240px;
  padding: 8px;
  border: 1px solid var(--primary);
  background-color: var(--body-bg);
  color: var(--body-text);
  border-radius: 4px;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2), 0 1px 2px -1px rgba(0, 0, 0, 0.2);
}

.bs-tooltip:before {
  content: " ";
  position: absolute;
  width: 12px;
  height: 12px;
  left: calc(50% - 6px);
  top: -6px;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--body-bg);
  transform: rotate(135deg);
  clip-path: polygon(0% 10%, 0% 100%, 90% 100%);
  z-index: -1;
}

.bs-tooltip.center {
  transform: translateX(-50%);
}

.bs-tooltip > div {
  overflow: auto;
}

.bs-notification-container > .top-notification {
  position: fixed;
  z-index: 250;
  top: 50px;
  left: 50%;
  transform: translateX(-50%);
}

.bs-notification-container > .top-notification > div {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 11px 12px;
  border: 1px solid var(--green);
  border-radius: 4px;
  color: var(--green);
  background-color: var(--body-bg);
  box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.2);
  line-height: 1.4;
}

.bs-notification-container > .top-notification > div:before {
  content: "check_circle";
  display: inline-block;
  width: 1.0769em;
  height: 1.0769em;
  margin-right: 6px;
  font-family: var(--icon-font-family);
  font-variation-settings: "FILL" 1, "wght" 700, "GRAD" 0, "opsz" 48;
}

.bs-notification-container > .top-notification > div.error {
  border: 1px solid var(--red);
  color: var(--red);
}

.bs-notification-container > .top-notification > div.error:before {
  content: "cancel";
}

.bs-notification-container > .bottom-notification {
  position: fixed;
  z-index: 250;
  bottom: 20px;
  right: 20px;
}

.bs-notification-container > .bs-loading-icon {
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  background-color: #000;
  opacity: 0.1;
  z-index: 300;
}

.bs-notification-container > .bs-loading-icon > .font-icon {
  font-size: 52px;
  color: var(--white);
  opacity: 1;
}

[data-theme=dark] .bs-notification-container > .top-notification > div {
  box-shadow: 0 4px 4px rgba(255, 255, 255, 0.1);
}

.bs-alarm-frame[data-v-801443a4] {
  width: 408px;
  height: 234px;
  padding: 24px;
  background-color: var(--color-body-bg);
  border: 2px solid var(--orange);
  border-radius: 2px;
  box-shadow: 0 3px 3px 3px rgba(0, 0, 0, 0.1);
}

.bs-alarm-frame .title-bar[data-v-801443a4] {
  padding-bottom: 16px;
}

.bs-alarm-frame .title-bar .title[data-v-801443a4] {
  font-size: 1.0769em;
}

.bs-alarm-frame .title-bar .title .font-icon[data-v-801443a4] {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 4px 12px;
  background-color: var(--orange);
  border-radius: 100%;
  color: white;
  line-height: 1;
}

.bs-alarm-frame .title-bar .title > span[data-v-801443a4] {
  color: var(--orange);
  font-weight: 500;
}

.bs-alarm-frame .buttons[data-v-801443a4] {
  padding-top: 16px;
}

.bs-context-menu-container .context-menu-curtain {
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 300;
}

.menu-search[data-v-0072cd9c] {
  margin: 8px 10px 8px 12px;
}

.menu-search .menu-search-box[data-v-0072cd9c] {
  position: relative;
}

.menu-search .menu-search-box input[data-v-0072cd9c] {
  padding: 4px 36px 5px 8px;
  background: #2D2E36;
  border: 1px solid #A9A9AE;
  border-radius: 4px;
  width: 100%;
  color: #A9A9AE;
  outline: none;
}

.menu-search .menu-search-box .icon[data-v-0072cd9c] {
  position: absolute;
  font-size: 14px;
  top: 0;
  right: 4px;
  height: 100%;
}

.menu-search .menu-search-box .icon > button > span[data-v-0072cd9c] {
  display: block;
}

.menu-search button[data-v-0072cd9c] {
  background-color: transparent;
  border: none;
  cursor: pointer;
  padding: 0;
  margin: 0;
  color: #A9A9AE;
}