@charset "UTF-8";
:root {
  --gray-100: #f5f5f5;
  --gray-200: #e5e5e5;
  --gray-300: #d4d4d4;
  --gray-400: #a3a3a3;
  --gray-500: #737373;
  --gray-600: #525252;
  --gray-700: #404040;
  --gray-800: #262626;
  --gray-900: #171717;
  --color-white: #ffffff;
  --color-black: #000000;
  --color-transparent: transparent;
  --mix-light: var(--color-white);
  --mix-dark: var(--color-black);
  --content-on-white: var(--text-color-dark);
  --content-on-black: var(--text-color-light);
  --hover-defaut: color-mix(in srgb, var(--text-color) var(--state-hover-mix), var(--mix-dark) var(--state-hover-mix-rest));
  --hover-primary: color-mix(in srgb, var(--color-primary) var(--state-hover-mix), var(--mix-dark) var(--state-hover-mix-rest));
  --hover-secondary: color-mix(in srgb, var(--color-secondary) var(--state-hover-mix), var(--mix-dark) var(--state-hover-mix-rest));
  --hover-tertiary: color-mix(in srgb, var(--color-tertiary) var(--state-hover-mix), var(--mix-dark) var(--state-hover-mix-rest));
  --hover-dark: color-mix(in srgb, var(--color-dark) var(--state-hover-mix), var(--mix-light) var(--state-hover-mix-rest));
  --hover-danger: color-mix(in srgb, var(--color-danger) var(--state-hover-mix), var(--mix-dark) var(--state-hover-mix-rest));
  --hover-info: color-mix(in srgb, var(--color-info) var(--state-hover-mix), var(--mix-dark) var(--state-hover-mix-rest));
  --hover-light: color-mix(in srgb, var(--color-light) var(--state-hover-mix), var(--mix-dark) var(--state-hover-mix-rest));
  --hover-neutral: color-mix(in srgb, var(--color-neutral) var(--state-hover-mix), var(--mix-dark) var(--state-hover-mix-rest));
  --hover-success: color-mix(in srgb, var(--color-success) var(--state-hover-mix), var(--mix-dark) var(--state-hover-mix-rest));
  --hover-warning: color-mix(in srgb, var(--color-warning) var(--state-hover-mix), var(--mix-dark) var(--state-hover-mix-rest));
  --hover-white: color-mix(in srgb, var(--color-white) var(--state-hover-mix), var(--mix-dark) var(--state-hover-mix-rest));
  --hover-black: color-mix(in srgb, var(--color-black) var(--state-hover-mix), var(--mix-light) var(--state-hover-mix-rest));
  --active-defaut:color-mix(in srgb, var(--text-color) var(--state-active-mix), var(--mix-dark) var(--state-active-mix-rest));
  --active-primary: color-mix(in srgb, var(--color-primary) var(--state-active-mix), var(--mix-dark) var(--state-active-mix-rest));
  --active-secondary: color-mix(in srgb, var(--color-secondary) var(--state-active-mix), var(--mix-dark) var(--state-active-mix-rest));
  --active-tertiary: color-mix(in srgb, var(--color-tertiary) var(--state-active-mix), var(--mix-dark) var(--state-active-mix-rest));
  --active-dark: color-mix(in srgb, var(--color-dark) var(--state-active-mix), var(--mix-light) var(--state-active-mix-rest));
  --active-danger: color-mix(in srgb, var(--color-danger) var(--state-active-mix), var(--mix-dark) var(--state-active-mix-rest));
  --active-info: color-mix(in srgb, var(--color-info) var(--state-active-mix), var(--mix-dark) var(--state-active-mix-rest));
  --active-light: color-mix(in srgb, var(--color-light) var(--state-active-mix), var(--mix-dark) var(--state-active-mix-rest));
  --active-neutral: color-mix(in srgb, var(--color-neutral) var(--state-active-mix), var(--mix-dark) var(--state-active-mix-rest));
  --active-success: color-mix(in srgb, var(--color-success) var(--state-active-mix), var(--mix-dark) var(--state-active-mix-rest));
  --active-warning: color-mix(in srgb, var(--color-warning) var(--state-active-mix), var(--mix-dark) var(--state-active-mix-rest));
  --active-white: color-mix(in srgb, var(--color-white) var(--state-active-mix), var(--mix-dark) var(--state-active-mix-rest));
  --active-black: color-mix(in srgb, var(--color-black) var(--state-active-mix), var(--mix-light) var(--state-active-mix-rest));
  --color-primary-ghost: color-mix(in srgb, var(--color-primary) var(--state-ghost-transparent-mix), transparent);
  --color-secondary-ghost: color-mix(in srgb, var(--color-secondary) var(--state-ghost-transparent-mix), transparent);
  --color-tertiary-ghost: color-mix(in srgb, var(--color-tertiary) var(--state-ghost-transparent-mix), transparent);
  --color-dark-ghost: color-mix(in srgb, var(--color-dark) var(--state-ghost-transparent-mix), transparent);
  --color-danger-ghost: color-mix(in srgb, var(--color-danger) var(--state-ghost-transparent-mix), transparent);
  --color-info-ghost: color-mix(in srgb, var(--color-info) var(--state-ghost-transparent-mix), transparent);
  --color-light-ghost: color-mix(in srgb, var(--color-light) var(--state-ghost-transparent-mix), transparent);
  --color-neutral-ghost: color-mix(in srgb, var(--color-neutral) var(--state-ghost-transparent-mix), transparent);
  --color-success-ghost: color-mix(in srgb, var(--color-success) var(--state-ghost-transparent-mix), transparent);
  --color-warning-ghost: color-mix(in srgb, var(--color-warning) var(--state-ghost-transparent-mix), transparent);
  --color-white-ghost: color-mix(in srgb, var(--color-white) var(--state-ghost-transparent-mix), transparent);
  --color-black-ghost: color-mix(in srgb, var(--color-black) var(--state-ghost-transparent-mix), transparent);
  --hover-primary-ghost: color-mix(in srgb, var(--color-primary) var(--state-ghost-hover-mix), transparent var(--state-ghost-hover-mix-rest));
  --hover-secondary-ghost: color-mix(in srgb, var(--color-secondary) var(--state-ghost-hover-mix), transparent var(--state-ghost-hover-mix-rest));
  --hover-tertiary-ghost: color-mix(in srgb, var(--color-tertiary) var(--state-ghost-hover-mix), transparent var(--state-ghost-hover-mix-rest));
  --hover-dark-ghost: color-mix(in srgb, var(--color-dark) var(--state-ghost-hover-mix), transparent var(--state-ghost-hover-mix-rest));
  --hover-danger-ghost: color-mix(in srgb, var(--color-danger) var(--state-ghost-hover-mix), transparent var(--state-ghost-hover-mix-rest));
  --hover-info-ghost: color-mix(in srgb, var(--color-info) var(--state-ghost-hover-mix), transparent var(--state-ghost-hover-mix-rest));
  --hover-light-ghost: color-mix(in srgb, var(--color-light) var(--state-ghost-hover-mix), transparent var(--state-ghost-hover-mix-rest));
  --hover-neutral-ghost: color-mix(in srgb, var(--color-neutral) var(--state-ghost-hover-mix), transparent var(--state-ghost-hover-mix-rest));
  --hover-success-ghost: color-mix(in srgb, var(--color-success) var(--state-ghost-hover-mix), transparent var(--state-ghost-hover-mix-rest));
  --hover-warning-ghost: color-mix(in srgb, var(--color-warning) var(--state-ghost-hover-mix), transparent var(--state-ghost-hover-mix-rest));
  --hover-white-ghost: color-mix(in srgb, var(--color-white) var(--state-ghost-hover-mix), transparent var(--state-ghost-hover-mix-rest));
  --hover-black-ghost: color-mix(in srgb, var(--color-black) var(--state-ghost-hover-mix), transparent var(--state-ghost-hover-mix-rest));
  --active-primary-ghost: color-mix(in srgb, var(--color-primary) var(--state-ghost-active-mix), transparent var(--state-ghost-active-mix-rest));
  --active-secondary-ghost: color-mix(in srgb, var(--color-secondary) var(--state-ghost-active-mix), transparent var(--state-ghost-active-mix-rest));
  --active-tertiary-ghost: color-mix(in srgb, var(--color-tertiary) var(--state-ghost-active-mix), transparent var(--state-ghost-active-mix-rest));
  --active-dark-ghost: color-mix(in srgb, var(--color-dark) var(--state-ghost-active-mix), transparent var(--state-ghost-active-mix-rest));
  --active-danger-ghost: color-mix(in srgb, var(--color-danger) var(--state-ghost-active-mix), transparent var(--state-ghost-active-mix-rest));
  --active-info-ghost: color-mix(in srgb, var(--color-info) var(--state-ghost-active-mix), transparent var(--state-ghost-active-mix-rest));
  --active-light-ghost: color-mix(in srgb, var(--color-light) var(--state-ghost-active-mix), transparent var(--state-ghost-active-mix-rest));
  --active-neutral-ghost: color-mix(in srgb, var(--color-neutral) var(--state-ghost-active-mix), transparent var(--state-ghost-active-mix-rest));
  --active-success-ghost: color-mix(in srgb, var(--color-success) var(--state-ghost-active-mix), transparent var(--state-ghost-active-mix-rest));
  --active-warning-ghost: color-mix(in srgb, var(--color-warning) var(--state-ghost-active-mix), transparent var(--state-ghost-active-mix-rest));
  --active-white-ghost: color-mix(in srgb, var(--color-white) var(--state-ghost-active-mix), transparent var(--state-ghost-active-mix-rest));
  --active-black-ghost: color-mix(in srgb, var(--color-black) var(--state-ghost-active-mix), transparent var(--state-ghost-active-mix-rest));
  --selection-bg-color: var(--color-primary);
  --selection-text-color: var(--content-on-primary);
  --border-radius: 0.5rem;
  --border-width: 1px;
  --border-style: solid;
  --border-width-outline: 1px;
  --border-style-outline: solid;
  --border-radius-pill: 10rem;
  --border-radius-circle: 50%;
  --hr-border-width: var(--border-width);
  --hr-border-style: var(--border-style);
  --font-family-primary: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-family-secondary: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  --font-family-tertiary: system-ui, "Segoe UI", Roboto, Arial, sans-serif;
  --font-size-h1: 4rem;
  --font-size-h2: 3.5rem;
  --font-size-h3: 3rem;
  --font-size-h4: 2.5rem;
  --font-size-h5: 2rem;
  --font-size-h6: 1.5rem;
  --font-size: 1.4rem;
  --font-size-xs: 1rem;
  --font-size-sm: 1.2rem;
  --font-size-md: 1.4rem;
  --font-size-lg: 1.6rem;
  --font-size-xl: 1.8rem;
  --font-size-xxl: 2rem;
  --font-weight: 400;
  --font-weight-100: 100;
  --font-weight-200: 200;
  --font-weight-300: 300;
  --font-weight-400: 400;
  --font-weight-500: 500;
  --font-weight-600: 600;
  --font-weight-700: 700;
  --font-weight-800: 800;
  --font-weight-900: 900;
  --letter-spacing: normal;
  --letter-spacing-xs: -0.02em;
  --letter-spacing-sm: -0.01em;
  --letter-spacing-md: 0;
  --letter-spacing-lg: 0.025em;
  --letter-spacing-xl: 0.05em;
  --letter-spacing-xxl: 0.1em;
  --line-height: normal;
  --line-height-xs: 1;
  --line-height-sm: 1.2;
  --line-height-md: 1.5;
  --line-height-lg: 1.6;
  --line-height-xl: 1.75;
  --line-height-xxl: 2;
  --col-padding-x: 1rem;
  --col-padding-y: 1rem;
  --grid-padding-x: 1rem;
  --grid-padding-y: 1rem;
  --grid-gap: .5rem;
  --accordion-border-width: var(--border-width);
  --accordion-border-style: var(--border-style);
  --accordion-border-radius: var(--border-radius);
  --accordion-border-color: var(--border-color);
  --accordion-background-color: var(--color-transparent);
  --accordion-body-padding-x: 1rem;
  --accordion-body-padding-y: 1rem;
  --accordion-button-padding-x: 1.25rem;
  --accordion-button-padding-y: 1.25rem;
  --accordion-button-padding-x-sm: 1rem;
  --accordion-button-padding-y-sm: 1rem;
  --accordion-button-padding-x-md: 1.25rem;
  --accordion-button-padding-y-md: 1.25rem;
  --accordion-button-padding-x-lg: 1.5rem;
  --accordion-button-padding-y-lg: 1.5rem;
  --accordion-button-background-color: var(--color-transparent);
  --accordion-indicator-content: "+";
  --alert-container-padding-x: 0.5rem;
  --alert-container-padding-y: 0;
  --alert-gap: 1rem;
  --alert-border-width: var(--border-width);
  --alert-border-style: var(--border-style);
  --alert-border-radius: var(--border-radius);
  --alert-border-color: var(--border-color);
  --alert-background-color: var(--color-theme);
  --alert-header-padding-x: 1rem;
  --alert-header-padding-y: 1rem;
  --alert-body-padding-x: 1rem;
  --alert-body-padding-y: 1rem;
  --alert-footer-padding-x: 1rem;
  --alert-footer-padding-y: 1rem;
  --badge-border-radius: var(--border-radius);
  --badge-border-style: var(--border-style);
  --badge-border-width: var(--border-width);
  --badge-border-color: var(--border-color);
  --badge-background-color: var(--color-transparent);
  --badge-padding-x: .5rem;
  --badge-padding-y: .2rem;
  --badge-padding-x-sm: .4rem;
  --badge-padding-y-sm: .1rem;
  --badge-padding-x-md: .5rem;
  --badge-padding-y-md: .2rem;
  --badge-padding-x-lg: .6rem;
  --badge-padding-y-lg: .3rem;
  --button-border-radius: var(--border-radius);
  --button-border-style: var(--border-style);
  --button-border-width: var(--border-width);
  --button-border-color: var(--border-color);
  --button-background-color: var(--color-transparent);
  --button-outline-background-color: var(--color-transparent);
  --button-padding-x: 1.5rem;
  --button-padding-y: .75rem;
  --button-padding-x-sm: 1rem;
  --button-padding-y-sm: .5rem;
  --button-padding-x-md: 1.5rem;
  --button-padding-y-md: .75rem;
  --button-padding-x-lg: 2rem;
  --button-padding-y-lg: 1rem;
  --button-close-content: "×";
  --button-close-gap: 1rem;
  --card-border-style: var(--border-style);
  --card-border-width: var(--border-width);
  --card-border-radius: var(--border-radius);
  --card-border-color: var(--border-color);
  --card-background-color: var(--color-theme);
  --card-header-padding-x: 1rem;
  --card-header-padding-y: 1rem;
  --card-body-padding-x: 1rem;
  --card-body-padding-y: 1rem;
  --card-footer-padding-x: 1rem;
  --card-footer-padding-y: 1rem;
  --card-group-gap: 1rem;
  --card-min-width: 25rem;
  --collapse-border-width: var(--border-width);
  --collapse-border-style: var(--border-style);
  --collapse-border-radius: var(--border-radius);
  --collapse-border-color: var(--border-color);
  --collapse-background-color: var(--color-transparent);
  --collapse-body-padding-x: 1rem;
  --collapse-body-padding-y: 1rem;
  --collapse-button-padding-x: 1.25rem;
  --collapse-button-padding-y: 1.25rem;
  --collapse-button-padding-x-sm: 1rem;
  --collapse-button-padding-y-sm: 1rem;
  --collapse-button-padding-x-md: 1.25rem;
  --collapse-button-padding-y-md: 1.25rem;
  --collapse-button-padding-x-lg: 1.5rem;
  --collapse-button-padding-y-lg: 1.5rem;
  --collapse-button-background-color: var(--color-transparent);
  --collapse-indicator-content: "+";
  --dialog-width: min(90vw, 720px);
  --dialog-max-height: 85vh;
  --dialog-width-sm: min(90vw, 480px);
  --dialog-max-height-sm: 80vh;
  --dialog-width-md: min(90vw, 720px);
  --dialog-max-height-md: 85vh;
  --dialog-width-lg: min(95vw, 1100px);
  --dialog-max-height-lg: 90vh;
  --dialog-border-style: var(--border-style);
  --dialog-border-width: var(--border-width);
  --dialog-border-radius: var(--border-radius);
  --dialog-border-color: var(--border-color);
  --dialog-header-padding-x: 1rem;
  --dialog-header-padding-y: 1rem;
  --dialog-body-padding-x: 1rem;
  --dialog-body-padding-y: 1rem;
  --dialog-footer-padding-x: 1rem;
  --dialog-footer-padding-y: 1rem;
  --dialog-background-color: var(--color-theme);
  --dropdown-body-border-radius: var(--border-radius);
  --dropdown-body-border-style: var(--border-style);
  --dropdown-body-border-width: var(--border-width);
  --dropdown-body-border-color: var(--border-color);
  --dropdown-body-background-color: var(--color-theme);
  --form-control-gap: 1rem;
  --input-background-color: var(--color-theme);
  --input-border-style: var(--border-style);
  --input-border-width: var(--border-width);
  --input-border-radius: var(--border-radius);
  --input-border-color: var(--border-color);
  --input-padding-x: 1.5rem;
  --input-padding-y: 0;
  --input-border-focus-color: var(--input-accent-color);
  --input-box-shadow-focus: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--input-accent-color) 50%, transparent);
  --input-accent-color: var(--color-primary);
  --input-box-shadow-focus-invalid: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--input-accent-color-invalid) 50%, transparent);
  --input-accent-color-invalid: var(--color-danger);
  --textarea-padding-x: 1rem;
  --textarea-padding-y: 0.5rem;
  --input-height: 3.5rem;
  --input-switch-height: 2rem;
  --input-height-sm: 3rem;
  --input-height-md: 4rem;
  --input-height-lg: 5rem;
  --input-switch-height-sm: 1.5rem;
  --input-switch-height-md: 2rem;
  --input-switch-height-lg: 2.5rem;
  --link-border-radius: var(--border-radius);
  --link-border-style: var(--border-style);
  --link-border-width: var(--border-width);
  --link-padding-x: .25rem;
  --link-padding-y: .25rem;
  --list-border-width: var(--border-width);
  --list-border-style: var(--border-style);
  --list-border-radius: var(--border-radius);
  --list-border-color: var(--border-color);
  --list-item-padding-x: 1.5rem;
  --list-item-padding-y: .75rem;
  --list-item-padding-x-sm: 1rem;
  --list-item-padding-y-sm: .5rem;
  --list-item-padding-x-md: 1.5rem;
  --list-item-padding-y-md: .75rem;
  --list-item-padding-x-lg: 2rem;
  --list-item-padding-y-lg: 1rem;
  --list-item-border-width-inside-hover: 4px;
  --list-item-shadow-inset-reduce: 0 2px -2px;
  --list-inline-gap: 2rem;
  --navbar-gap: 2rem;
  --navbar-padding-x: 1.5rem;
  --navbar-padding-y: 1rem;
  --navbar-border-width: var(--border-width);
  --navbar-border-radius: 0;
  --navbar-border-style: var(--border-style);
  --navbar-border-color: var(--border-color);
  --navbar-collapse-gap: 2rem;
  --navbar-collapse-padding-y: 1rem;
  --navbar-collapse-padding-x: 0;
  --sidebar-width: 30rem;
  --sidebar-padding-x: 1rem;
  --sidebar-padding-y: 1rem;
  --sidebar-border-radius: var(--border-radius);
  --sidebar-border-width: var(--border-width);
  --sidebar-border-style: var(--border-style);
  --sidebar-border-color: var(--border-color);
  --sidebar-compact-width: var(--sidebar-width);
  --sidebar-compact-width-reduce: 6.5rem;
  --sidebar-compact-gap: 2rem;
  --sidebar-background-color: var(--background-color);
  --tab-panel-padding-y: 1rem;
  --tab-panel-padding-x: 1rem;
  --tab-panel-border-width: 0;
  --tab-panel-border-style: var(--border-style);
  --tab-panel-border-color: var(--border-color);
  --tab-panel-border-radius: var(--border-radius);
  --container-padding-x: 1.5rem;
  --container-padding-y: 1rem;
  --container-max-width: 1280px;
  --img-border-radius: var(--border-radius);
  --img-thumbnail-background-color: var(--background-color);
  --img-thumbnail-padding: .25rem;
  --img-thumbnail-border-width: var(--border-width);
  --img-thumbnail-border-color: var(--border-color);
  --img-thumbnail-border-style: var(--border-style);
  --img-thumbnail-border-radius: var(--border-radius);
  --table-border-style: var(--border-style);
  --table-border-width: var(--border-width);
  --table-border-color: var(--border-color);
  --table-border-divider-width: 2px;
  --table-border-divider-style: var(--border-style);
  --table-padding-y: .75rem;
  --table-padding-x: .75rem;
  --table-padding-y-sm: .5rem;
  --table-padding-x-sm: .5rem;
  --table-padding-y-md: .75rem;
  --table-padding-x-md: .75rem;
  --table-padding-y-lg: 1rem;
  --table-padding-x-lg: 1rem;
}

:root,
:root[data-theme=light] {
  color-scheme: light;
  --state-hover-mix: 70%;
  --state-hover-mix-rest: calc(100% - var(--state-hover-mix));
  --state-active-mix: 60%;
  --state-active-mix-rest: calc(100% - var(--state-active-mix));
  --state-focus-mix: 40%;
  --state-focus-mix-rest: calc(100% - var(--state-focus-mix));
  --state-ghost-transparent-mix: 30%;
  --state-ghost-hover-mix: 65%;
  --state-ghost-hover-mix-rest: calc(100% - var(--state-ghost-hover-mix));
  --state-ghost-active-mix: 75%;
  --state-ghost-active-mix-rest: calc(100% - var(--state-ghost-active-mix));
  --state-ghost-focus-mix: 40%;
  --state-ghost-focus-mix-rest: calc(100% - var(--state-ghost-focus-mix));
  --text-color-dark: #262626;
  --text-color-light: #f5f5f5;
  --color-primary: #008f5a;
  --color-secondary: #4B3FD1;
  --color-tertiary: #E63E63;
  --color-dark: #2F2F2F;
  --color-danger: #C0392B;
  --color-info: #1F8ED6;
  --color-neutral: #A0A0A0;
  --color-success: #2E9E5B;
  --color-warning: #C88719;
  --content-on-primary: var(--text-color-light);
  --content-on-secondary: var(--text-color-light);
  --content-on-tertiary: var(--text-color-light);
  --content-on-dark: var(--text-color-light);
  --content-on-danger: var(--text-color-light);
  --content-on-info: var(--text-color-light);
  --content-on-light: var(--text-color-dark);
  --content-on-neutral: var(--text-color-light);
  --content-on-success: var(--text-color-light);
  --content-on-warning: var(--text-color-light);
  --content-on-primary-ghost: var(--text-color-dark);
  --content-on-secondary-ghost: var(--text-color-dark);
  --content-on-tertiary-ghost: var(--text-color-dark);
  --content-on-dark-ghost: var(--text-color-dark);
  --content-on-danger-ghost: var(--text-color-dark);
  --content-on-info-ghost: var(--text-color-dark);
  --content-on-light-ghost: var(--text-color-dark);
  --content-on-neutral-ghost: var(--text-color-dark);
  --content-on-success-ghost: var(--text-color-dark);
  --content-on-warning-ghost: var(--text-color-dark);
  --content-on-white-ghost: var(--text-color-dark);
  --content-on-black-ghost: var(--text-color-dark);
  --background-color: var(--color-white);
  --color-theme: var(--background-color);
  --text-color: var(--text-color-dark);
  --border-color: var(--gray-200);
  --hr-border-color: var(--border-color);
  --button-hover-background-color: rgba(0, 0, 0, 0.2);
  --button-active-background-color: rgba(0, 0, 0, 0.4);
  --button-focus-color: rgba(0, 0, 0, 0.4);
  --button-disabled-background-color: var(--gray-500);
  --button-disabled-border-color: var(--gray-500);
  --button-disabled-color: var(--text-color-light);
  --button-outline-disabled-background-color: var(--color-transparent);
  --button-outline-disabled-border-color: var(--gray-500);
  --button-outline-disabled-color: var(--text-color-dark);
  --text-color-disabled: var(--gray-500);
  --dialog-backdrop-background: rgba(225, 225, 225, 0.5);
  --input-icon-select-arrow-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='4,6 8,10 12,6'/%3E%3C/svg%3E");
  --input-icon-switch-svg-before: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='grey'/%3E%3C/svg%3E");
  --input-icon-switch-svg-after: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='white'/%3E%3C/svg%3E");
  --input-content-on-accent-color: var(--text-color-light);
  --input-content-on-accent-color-invalid: var(--text-color-light);
  --input-disabled-color: var(--gray-500);
  --input-disabled-background-color: var(--gray-200);
  --link-disabled-color: var(--gray-500);
  --list-item-hover-background-color: rgba(0, 0, 0, 0.1);
  --list-item-active-background-color: rgba(0, 0, 0, 0.2);
  --box-shadow: 0 .05rem 1.5rem rgba(0, 0, 0, .08);
  --box-shadow-hover-before: 0 .4rem .8rem rgba(0, 0, 0, .08);
  --box-shadow-hover-after: 0 .8rem 1.6rem rgba(0, 0, 0, .08);
  --table-hover-background-color: rgba(0, 0, 0, 0.2);
  --table-active-background-color: rgba(0, 0, 0, 0.4);
  --table-striped-background-color: rgba(0, 0, 0, 0.1);
  --table-border-divider-color: var(--color-black);
}

:root[data-theme=dark] {
  color-scheme: dark;
  --state-hover-mix: 70%;
  --state-hover-mix-rest: calc(100% - var(--state-hover-mix));
  --state-active-mix: 60%;
  --state-active-mix-rest: calc(100% - var(--state-active-mix));
  --state-focus-mix: 40%;
  --state-focus-mix-rest: calc(100% - var(--state-focus-mix));
  --state-ghost-transparent-mix: 15%;
  --state-ghost-hover-mix: 65%;
  --state-ghost-hover-mix-rest: calc(100% - var(--state-ghost-hover-mix));
  --state-ghost-active-mix: 75%;
  --state-ghost-active-mix-rest: calc(100% - var(--state-ghost-active-mix));
  --state-ghost-focus-mix: 40%;
  --state-ghost-focus-mix-rest: calc(100% - var(--state-ghost-focus-mix));
  --text-color-dark: #262626;
  --text-color-light: #f5f5f5;
  --color-primary: #4fffb0;
  --color-secondary: #6658E8;
  --color-tertiary: #FF5878;
  --color-dark: #2F2F2F;
  --color-danger: #E25555;
  --color-info: #3EB4E8;
  --color-light: #DDDDDD;
  --color-neutral: #C7C7C7;
  --color-success: #4EBE79;
  --color-warning: #E6AE2A;
  --content-on-primary: var(--text-color-dark);
  --content-on-secondary: var(--text-color-light);
  --content-on-tertiary: var(--text-color-dark);
  --content-on-dark: var(--text-color-light);
  --content-on-danger: var(--text-color-dark);
  --content-on-info: var(--text-color-dark);
  --content-on-light: var(--text-color-dark);
  --content-on-neutral: var(--text-color-dark);
  --content-on-success: var(--text-color-dark);
  --content-on-warning: var(--text-color-dark);
  --content-on-primary-ghost: var(--text-color-light);
  --content-on-secondary-ghost: var(--text-color-light);
  --content-on-tertiary-ghost: var(--text-color-light);
  --content-on-dark-ghost: var(--text-color-light);
  --content-on-danger-ghost: var(--text-color-light);
  --content-on-info-ghost: var(--text-color-light);
  --content-on-light-ghost: var(--text-color-light);
  --content-on-neutral-ghost: var(--text-color-light);
  --content-on-success-ghost: var(--text-color-light);
  --content-on-warning-ghost: var(--text-color-light);
  --content-on-white-ghost: var(--text-color-light);
  --content-on-black-ghost: var(--text-color-light);
  --background-color: var(--gray-800);
  --color-theme: var(--background-color);
  --text-color: var(--text-color-light);
  --border-color: var(--gray-700);
  --hr-border-color: var(--border-color);
  --button-hover-background-color: rgba(225, 225, 225, 0.2);
  --button-active-background-color: rgba(225, 225, 225, 0.4);
  --button-focus-color: rgba(225, 225, 225, 0.4);
  --button-disabled-background-color: var(--gray-500);
  --button-disabled-border-color: var(--gray-500);
  --button-disabled-color: var(--text-color-dark);
  --button-outline-disabled-background-color: var(--color-transparent);
  --button-outline-disabled-border-color: var(--gray-500);
  --button-outline-disabled-color: var(--text-color-light);
  --text-color-disabled: var(--gray-500);
  --dialog-backdrop-background: rgba(0, 0, 0, 0.5);
  --input-icon-select-arrow-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='4,6 8,10 12,6'/%3E%3C/svg%3E");
  --input-icon-switch-svg-before: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='white'/%3E%3C/svg%3E");
  --input-icon-switch-svg-after: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='grey'/%3E%3C/svg%3E");
  --input-content-on-accent-color: var(--text-color-dark);
  --input-content-on-accent-color-invalid: var(--text-color-dark);
  --input-disabled-color: var(--gray-500);
  --input-disabled-background-color: var(--gray-700);
  --link-disabled-color: var(--gray-500);
  --list-item-hover-background-color: rgba(225, 225, 225, 0.2);
  --list-item-active-background-color: rgba(225, 225, 225, 0.4);
  --box-shadow: 0 .05rem 1.5rem rgba(0, 0, 0, .25);
  --box-shadow-hover-before: 0 .4rem .8rem rgba(0, 0, 0, .25);
  --box-shadow-hover-after: 0 .8rem 1.6rem rgba(0, 0, 0, .25);
  --table-hover-background-color: rgba(225, 225, 225, 0.2);
  --table-active-background-color: rgba(225, 225, 225, 0.4);
  --table-striped-background-color: rgba(0, 0, 0, 0.2);
  --table-border-divider-color: var(--color-white);
}

*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  font-size: 62.5%; /* 1rem = 10px */
  scroll-behavior: smooth;
  min-height: 100%;
}

body {
  font-family: var(--font-family-primary), sans-serif;
  font-size: var(--font-size);
  font-weight: var(--font-weight);
  color: var(--text-color);
  background-color: var(--background-color);
  line-height: var(--line-height);
  letter-spacing: var(--letter-spacing);
  min-height: 100%;
  overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-family-secondary), sans-serif;
}

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

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

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

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

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

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

button,
input,
textarea,
select,
option,
optgroup,
label,
fieldset,
legend {
  font-family: var(--font-family-primary), sans-serif;
  font-weight: var(--font-weight);
  letter-spacing: var(--letter-spacing);
}

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

button {
  cursor: pointer;
}

a {
  font-family: var(--font-family-primary), sans-serif;
  font-weight: var(--font-weight);
  letter-spacing: var(--letter-spacing);
  color: inherit;
  text-decoration: none;
}

hr {
  border: none;
  border-top: var(--hr-border-width) var(--hr-border-style) var(--hr-border-color);
}

:disabled {
  cursor: not-allowed;
}

::selection,
::-moz-selection {
  background-color: var(--selection-bg-color);
  color: var(--selection-text-color);
}

.row {
  display: flex;
  flex-wrap: wrap;
}

.row > * {
  width: 100%;
  padding-inline: var(--col-padding-x);
  padding-block: var(--col-padding-y);
}

.col {
  flex: 1 1 0;
  max-width: 100%;
}

.col-auto {
  flex: 0 0 auto;
  width: auto;
}

.col-1 {
  flex: 0 0 8.3333333333%;
  max-width: 8.3333333333%;
}

.col-2 {
  flex: 0 0 16.6666666667%;
  max-width: 16.6666666667%;
}

.col-3 {
  flex: 0 0 25%;
  max-width: 25%;
}

.col-4 {
  flex: 0 0 33.3333333333%;
  max-width: 33.3333333333%;
}

.col-5 {
  flex: 0 0 41.6666666667%;
  max-width: 41.6666666667%;
}

.col-6 {
  flex: 0 0 50%;
  max-width: 50%;
}

.col-7 {
  flex: 0 0 58.3333333333%;
  max-width: 58.3333333333%;
}

.col-8 {
  flex: 0 0 66.6666666667%;
  max-width: 66.6666666667%;
}

.col-9 {
  flex: 0 0 75%;
  max-width: 75%;
}

.col-10 {
  flex: 0 0 83.3333333333%;
  max-width: 83.3333333333%;
}

.col-11 {
  flex: 0 0 91.6666666667%;
  max-width: 91.6666666667%;
}

.col-12 {
  flex: 0 0 100%;
  max-width: 100%;
}

@media (min-width: 480px) {
  .col-1-xs {
    flex: 0 0 8.3333333333%;
    max-width: 8.3333333333%;
  }
  .col-2-xs {
    flex: 0 0 16.6666666667%;
    max-width: 16.6666666667%;
  }
  .col-3-xs {
    flex: 0 0 25%;
    max-width: 25%;
  }
  .col-4-xs {
    flex: 0 0 33.3333333333%;
    max-width: 33.3333333333%;
  }
  .col-5-xs {
    flex: 0 0 41.6666666667%;
    max-width: 41.6666666667%;
  }
  .col-6-xs {
    flex: 0 0 50%;
    max-width: 50%;
  }
  .col-7-xs {
    flex: 0 0 58.3333333333%;
    max-width: 58.3333333333%;
  }
  .col-8-xs {
    flex: 0 0 66.6666666667%;
    max-width: 66.6666666667%;
  }
  .col-9-xs {
    flex: 0 0 75%;
    max-width: 75%;
  }
  .col-10-xs {
    flex: 0 0 83.3333333333%;
    max-width: 83.3333333333%;
  }
  .col-11-xs {
    flex: 0 0 91.6666666667%;
    max-width: 91.6666666667%;
  }
  .col-12-xs {
    flex: 0 0 100%;
    max-width: 100%;
  }
}
@media (min-width: 640px) {
  .col-1-sm {
    flex: 0 0 8.3333333333%;
    max-width: 8.3333333333%;
  }
  .col-2-sm {
    flex: 0 0 16.6666666667%;
    max-width: 16.6666666667%;
  }
  .col-3-sm {
    flex: 0 0 25%;
    max-width: 25%;
  }
  .col-4-sm {
    flex: 0 0 33.3333333333%;
    max-width: 33.3333333333%;
  }
  .col-5-sm {
    flex: 0 0 41.6666666667%;
    max-width: 41.6666666667%;
  }
  .col-6-sm {
    flex: 0 0 50%;
    max-width: 50%;
  }
  .col-7-sm {
    flex: 0 0 58.3333333333%;
    max-width: 58.3333333333%;
  }
  .col-8-sm {
    flex: 0 0 66.6666666667%;
    max-width: 66.6666666667%;
  }
  .col-9-sm {
    flex: 0 0 75%;
    max-width: 75%;
  }
  .col-10-sm {
    flex: 0 0 83.3333333333%;
    max-width: 83.3333333333%;
  }
  .col-11-sm {
    flex: 0 0 91.6666666667%;
    max-width: 91.6666666667%;
  }
  .col-12-sm {
    flex: 0 0 100%;
    max-width: 100%;
  }
}
@media (min-width: 768px) {
  .col-1-md {
    flex: 0 0 8.3333333333%;
    max-width: 8.3333333333%;
  }
  .col-2-md {
    flex: 0 0 16.6666666667%;
    max-width: 16.6666666667%;
  }
  .col-3-md {
    flex: 0 0 25%;
    max-width: 25%;
  }
  .col-4-md {
    flex: 0 0 33.3333333333%;
    max-width: 33.3333333333%;
  }
  .col-5-md {
    flex: 0 0 41.6666666667%;
    max-width: 41.6666666667%;
  }
  .col-6-md {
    flex: 0 0 50%;
    max-width: 50%;
  }
  .col-7-md {
    flex: 0 0 58.3333333333%;
    max-width: 58.3333333333%;
  }
  .col-8-md {
    flex: 0 0 66.6666666667%;
    max-width: 66.6666666667%;
  }
  .col-9-md {
    flex: 0 0 75%;
    max-width: 75%;
  }
  .col-10-md {
    flex: 0 0 83.3333333333%;
    max-width: 83.3333333333%;
  }
  .col-11-md {
    flex: 0 0 91.6666666667%;
    max-width: 91.6666666667%;
  }
  .col-12-md {
    flex: 0 0 100%;
    max-width: 100%;
  }
}
@media (min-width: 1024px) {
  .col-1-lg {
    flex: 0 0 8.3333333333%;
    max-width: 8.3333333333%;
  }
  .col-2-lg {
    flex: 0 0 16.6666666667%;
    max-width: 16.6666666667%;
  }
  .col-3-lg {
    flex: 0 0 25%;
    max-width: 25%;
  }
  .col-4-lg {
    flex: 0 0 33.3333333333%;
    max-width: 33.3333333333%;
  }
  .col-5-lg {
    flex: 0 0 41.6666666667%;
    max-width: 41.6666666667%;
  }
  .col-6-lg {
    flex: 0 0 50%;
    max-width: 50%;
  }
  .col-7-lg {
    flex: 0 0 58.3333333333%;
    max-width: 58.3333333333%;
  }
  .col-8-lg {
    flex: 0 0 66.6666666667%;
    max-width: 66.6666666667%;
  }
  .col-9-lg {
    flex: 0 0 75%;
    max-width: 75%;
  }
  .col-10-lg {
    flex: 0 0 83.3333333333%;
    max-width: 83.3333333333%;
  }
  .col-11-lg {
    flex: 0 0 91.6666666667%;
    max-width: 91.6666666667%;
  }
  .col-12-lg {
    flex: 0 0 100%;
    max-width: 100%;
  }
}
@media (min-width: 1280px) {
  .col-1-xl {
    flex: 0 0 8.3333333333%;
    max-width: 8.3333333333%;
  }
  .col-2-xl {
    flex: 0 0 16.6666666667%;
    max-width: 16.6666666667%;
  }
  .col-3-xl {
    flex: 0 0 25%;
    max-width: 25%;
  }
  .col-4-xl {
    flex: 0 0 33.3333333333%;
    max-width: 33.3333333333%;
  }
  .col-5-xl {
    flex: 0 0 41.6666666667%;
    max-width: 41.6666666667%;
  }
  .col-6-xl {
    flex: 0 0 50%;
    max-width: 50%;
  }
  .col-7-xl {
    flex: 0 0 58.3333333333%;
    max-width: 58.3333333333%;
  }
  .col-8-xl {
    flex: 0 0 66.6666666667%;
    max-width: 66.6666666667%;
  }
  .col-9-xl {
    flex: 0 0 75%;
    max-width: 75%;
  }
  .col-10-xl {
    flex: 0 0 83.3333333333%;
    max-width: 83.3333333333%;
  }
  .col-11-xl {
    flex: 0 0 91.6666666667%;
    max-width: 91.6666666667%;
  }
  .col-12-xl {
    flex: 0 0 100%;
    max-width: 100%;
  }
}
@media (min-width: 1536px) {
  .col-1-xxl {
    flex: 0 0 8.3333333333%;
    max-width: 8.3333333333%;
  }
  .col-2-xxl {
    flex: 0 0 16.6666666667%;
    max-width: 16.6666666667%;
  }
  .col-3-xxl {
    flex: 0 0 25%;
    max-width: 25%;
  }
  .col-4-xxl {
    flex: 0 0 33.3333333333%;
    max-width: 33.3333333333%;
  }
  .col-5-xxl {
    flex: 0 0 41.6666666667%;
    max-width: 41.6666666667%;
  }
  .col-6-xxl {
    flex: 0 0 50%;
    max-width: 50%;
  }
  .col-7-xxl {
    flex: 0 0 58.3333333333%;
    max-width: 58.3333333333%;
  }
  .col-8-xxl {
    flex: 0 0 66.6666666667%;
    max-width: 66.6666666667%;
  }
  .col-9-xxl {
    flex: 0 0 75%;
    max-width: 75%;
  }
  .col-10-xxl {
    flex: 0 0 83.3333333333%;
    max-width: 83.3333333333%;
  }
  .col-11-xxl {
    flex: 0 0 91.6666666667%;
    max-width: 91.6666666667%;
  }
  .col-12-xxl {
    flex: 0 0 100%;
    max-width: 100%;
  }
}
.container,
.container-xs,
.container-sm,
.container-md,
.container-lg,
.container-xl,
.container-xxl {
  width: 100%;
  margin-inline: auto;
  padding-inline: var(--container-padding-x);
  padding-block: var(--container-padding-y);
}

.container-fluid {
  width: 100%;
  margin-inline: auto;
  padding-inline: var(--container-padding-x);
  padding-block: var(--container-padding-y);
}

.container {
  max-width: var(--container-max-width);
}

.container-xs {
  max-width: 480px;
}

.container-sm {
  max-width: 640px;
}

.container-md {
  max-width: 768px;
}

.container-lg {
  max-width: 1024px;
}

.container-xl {
  max-width: 1280px;
}

.container-xxl {
  max-width: 1536px;
}

.fd-row {
  flex-direction: row;
}

.fd-row-reverse {
  flex-direction: row-reverse;
}

.fd-column {
  flex-direction: column;
}

.fd-column-reverse {
  flex-direction: column-reverse;
}

.fw-wrap {
  flex-wrap: wrap;
}

.fw-nowrap {
  flex-wrap: nowrap;
}

.fw-wrap-reverse {
  flex-wrap: wrap-reverse;
}

.jc-start {
  justify-content: flex-start;
}

.jc-center {
  justify-content: center;
}

.jc-end {
  justify-content: flex-end;
}

.jc-between {
  justify-content: space-between;
}

.jc-around {
  justify-content: space-around;
}

.jc-evenly {
  justify-content: space-evenly;
}

.ai-start {
  align-items: flex-start;
}

.ai-center {
  align-items: center;
}

.ai-end {
  align-items: flex-end;
}

.ai-baseline {
  align-items: baseline;
}

.ai-stretch {
  align-items: stretch;
}

.as-start {
  align-self: flex-start;
}

.as-center {
  align-self: center;
}

.as-end {
  align-self: flex-end;
}

.as-stretch {
  align-self: stretch;
}

.as-baseline {
  align-self: baseline;
}

.ac-start {
  align-content: flex-start;
}

.ac-center {
  align-content: center;
}

.ac-end {
  align-content: flex-end;
}

.ac-between {
  align-content: space-between;
}

.ac-around {
  align-content: space-around;
}

.ac-stretch {
  align-content: stretch;
}

.flex-1-1-auto {
  flex: 1 1 auto;
}

.flex-fill {
  flex: 1 1 auto;
}

.flex-grow-0 {
  flex-grow: 0;
}

.flex-grow-1 {
  flex-grow: 1;
}

.flex-shrink-0 {
  flex-shrink: 0;
}

.flex-shrink-1 {
  flex-shrink: 1;
}

@media (min-width: 480px) {
  .fd-row-xs {
    flex-direction: row;
  }
  .fd-row-reverse-xs {
    flex-direction: row-reverse;
  }
  .fd-column-xs {
    flex-direction: column;
  }
  .fd-column-reverse-xs {
    flex-direction: column-reverse;
  }
  .fw-wrap-xs {
    flex-wrap: wrap;
  }
  .fw-nowrap-xs {
    flex-wrap: nowrap;
  }
  .fw-wrap-reverse-xs {
    flex-wrap: wrap-reverse;
  }
  .jc-start-xs {
    justify-content: flex-start;
  }
  .jc-center-xs {
    justify-content: center;
  }
  .jc-end-xs {
    justify-content: flex-end;
  }
  .jc-between-xs {
    justify-content: space-between;
  }
  .jc-around-xs {
    justify-content: space-around;
  }
  .jc-evenly-xs {
    justify-content: space-evenly;
  }
  .ai-start-xs {
    align-items: flex-start;
  }
  .ai-center-xs {
    align-items: center;
  }
  .ai-end-xs {
    align-items: flex-end;
  }
  .ai-baseline-xs {
    align-items: baseline;
  }
  .ai-stretch-xs {
    align-items: stretch;
  }
  .as-start-xs {
    align-self: flex-start;
  }
  .as-center-xs {
    align-self: center;
  }
  .as-end-xs {
    align-self: flex-end;
  }
  .as-stretch-xs {
    align-self: stretch;
  }
  .as-baseline-xs {
    align-self: baseline;
  }
  .ac-start-xs {
    align-content: flex-start;
  }
  .ac-center-xs {
    align-content: center;
  }
  .ac-end-xs {
    align-content: flex-end;
  }
  .ac-between-xs {
    align-content: space-between;
  }
  .ac-around-xs {
    align-content: space-around;
  }
  .ac-stretch-xs {
    align-content: stretch;
  }
  .flex-1-1-auto-xs {
    flex: 1 1 auto;
  }
  .flex-fill-xs {
    flex: 1 1 auto;
  }
  .flex-grow-0-xs {
    flex-grow: 0;
  }
  .flex-grow-1-xs {
    flex-grow: 1;
  }
  .flex-shrink-0-xs {
    flex-shrink: 0;
  }
  .flex-shrink-1-xs {
    flex-shrink: 1;
  }
}
@media (min-width: 640px) {
  .fd-row-sm {
    flex-direction: row;
  }
  .fd-row-reverse-sm {
    flex-direction: row-reverse;
  }
  .fd-column-sm {
    flex-direction: column;
  }
  .fd-column-reverse-sm {
    flex-direction: column-reverse;
  }
  .fw-wrap-sm {
    flex-wrap: wrap;
  }
  .fw-nowrap-sm {
    flex-wrap: nowrap;
  }
  .fw-wrap-reverse-sm {
    flex-wrap: wrap-reverse;
  }
  .jc-start-sm {
    justify-content: flex-start;
  }
  .jc-center-sm {
    justify-content: center;
  }
  .jc-end-sm {
    justify-content: flex-end;
  }
  .jc-between-sm {
    justify-content: space-between;
  }
  .jc-around-sm {
    justify-content: space-around;
  }
  .jc-evenly-sm {
    justify-content: space-evenly;
  }
  .ai-start-sm {
    align-items: flex-start;
  }
  .ai-center-sm {
    align-items: center;
  }
  .ai-end-sm {
    align-items: flex-end;
  }
  .ai-baseline-sm {
    align-items: baseline;
  }
  .ai-stretch-sm {
    align-items: stretch;
  }
  .as-start-sm {
    align-self: flex-start;
  }
  .as-center-sm {
    align-self: center;
  }
  .as-end-sm {
    align-self: flex-end;
  }
  .as-stretch-sm {
    align-self: stretch;
  }
  .as-baseline-sm {
    align-self: baseline;
  }
  .ac-start-sm {
    align-content: flex-start;
  }
  .ac-center-sm {
    align-content: center;
  }
  .ac-end-sm {
    align-content: flex-end;
  }
  .ac-between-sm {
    align-content: space-between;
  }
  .ac-around-sm {
    align-content: space-around;
  }
  .ac-stretch-sm {
    align-content: stretch;
  }
  .flex-1-1-auto-sm {
    flex: 1 1 auto;
  }
  .flex-fill-sm {
    flex: 1 1 auto;
  }
  .flex-grow-0-sm {
    flex-grow: 0;
  }
  .flex-grow-1-sm {
    flex-grow: 1;
  }
  .flex-shrink-0-sm {
    flex-shrink: 0;
  }
  .flex-shrink-1-sm {
    flex-shrink: 1;
  }
}
@media (min-width: 768px) {
  .fd-row-md {
    flex-direction: row;
  }
  .fd-row-reverse-md {
    flex-direction: row-reverse;
  }
  .fd-column-md {
    flex-direction: column;
  }
  .fd-column-reverse-md {
    flex-direction: column-reverse;
  }
  .fw-wrap-md {
    flex-wrap: wrap;
  }
  .fw-nowrap-md {
    flex-wrap: nowrap;
  }
  .fw-wrap-reverse-md {
    flex-wrap: wrap-reverse;
  }
  .jc-start-md {
    justify-content: flex-start;
  }
  .jc-center-md {
    justify-content: center;
  }
  .jc-end-md {
    justify-content: flex-end;
  }
  .jc-between-md {
    justify-content: space-between;
  }
  .jc-around-md {
    justify-content: space-around;
  }
  .jc-evenly-md {
    justify-content: space-evenly;
  }
  .ai-start-md {
    align-items: flex-start;
  }
  .ai-center-md {
    align-items: center;
  }
  .ai-end-md {
    align-items: flex-end;
  }
  .ai-baseline-md {
    align-items: baseline;
  }
  .ai-stretch-md {
    align-items: stretch;
  }
  .as-start-md {
    align-self: flex-start;
  }
  .as-center-md {
    align-self: center;
  }
  .as-end-md {
    align-self: flex-end;
  }
  .as-stretch-md {
    align-self: stretch;
  }
  .as-baseline-md {
    align-self: baseline;
  }
  .ac-start-md {
    align-content: flex-start;
  }
  .ac-center-md {
    align-content: center;
  }
  .ac-end-md {
    align-content: flex-end;
  }
  .ac-between-md {
    align-content: space-between;
  }
  .ac-around-md {
    align-content: space-around;
  }
  .ac-stretch-md {
    align-content: stretch;
  }
  .flex-1-1-auto-md {
    flex: 1 1 auto;
  }
  .flex-fill-md {
    flex: 1 1 auto;
  }
  .flex-grow-0-md {
    flex-grow: 0;
  }
  .flex-grow-1-md {
    flex-grow: 1;
  }
  .flex-shrink-0-md {
    flex-shrink: 0;
  }
  .flex-shrink-1-md {
    flex-shrink: 1;
  }
}
@media (min-width: 1024px) {
  .fd-row-lg {
    flex-direction: row;
  }
  .fd-row-reverse-lg {
    flex-direction: row-reverse;
  }
  .fd-column-lg {
    flex-direction: column;
  }
  .fd-column-reverse-lg {
    flex-direction: column-reverse;
  }
  .fw-wrap-lg {
    flex-wrap: wrap;
  }
  .fw-nowrap-lg {
    flex-wrap: nowrap;
  }
  .fw-wrap-reverse-lg {
    flex-wrap: wrap-reverse;
  }
  .jc-start-lg {
    justify-content: flex-start;
  }
  .jc-center-lg {
    justify-content: center;
  }
  .jc-end-lg {
    justify-content: flex-end;
  }
  .jc-between-lg {
    justify-content: space-between;
  }
  .jc-around-lg {
    justify-content: space-around;
  }
  .jc-evenly-lg {
    justify-content: space-evenly;
  }
  .ai-start-lg {
    align-items: flex-start;
  }
  .ai-center-lg {
    align-items: center;
  }
  .ai-end-lg {
    align-items: flex-end;
  }
  .ai-baseline-lg {
    align-items: baseline;
  }
  .ai-stretch-lg {
    align-items: stretch;
  }
  .as-start-lg {
    align-self: flex-start;
  }
  .as-center-lg {
    align-self: center;
  }
  .as-end-lg {
    align-self: flex-end;
  }
  .as-stretch-lg {
    align-self: stretch;
  }
  .as-baseline-lg {
    align-self: baseline;
  }
  .ac-start-lg {
    align-content: flex-start;
  }
  .ac-center-lg {
    align-content: center;
  }
  .ac-end-lg {
    align-content: flex-end;
  }
  .ac-between-lg {
    align-content: space-between;
  }
  .ac-around-lg {
    align-content: space-around;
  }
  .ac-stretch-lg {
    align-content: stretch;
  }
  .flex-1-1-auto-lg {
    flex: 1 1 auto;
  }
  .flex-fill-lg {
    flex: 1 1 auto;
  }
  .flex-grow-0-lg {
    flex-grow: 0;
  }
  .flex-grow-1-lg {
    flex-grow: 1;
  }
  .flex-shrink-0-lg {
    flex-shrink: 0;
  }
  .flex-shrink-1-lg {
    flex-shrink: 1;
  }
}
@media (min-width: 1280px) {
  .fd-row-xl {
    flex-direction: row;
  }
  .fd-row-reverse-xl {
    flex-direction: row-reverse;
  }
  .fd-column-xl {
    flex-direction: column;
  }
  .fd-column-reverse-xl {
    flex-direction: column-reverse;
  }
  .fw-wrap-xl {
    flex-wrap: wrap;
  }
  .fw-nowrap-xl {
    flex-wrap: nowrap;
  }
  .fw-wrap-reverse-xl {
    flex-wrap: wrap-reverse;
  }
  .jc-start-xl {
    justify-content: flex-start;
  }
  .jc-center-xl {
    justify-content: center;
  }
  .jc-end-xl {
    justify-content: flex-end;
  }
  .jc-between-xl {
    justify-content: space-between;
  }
  .jc-around-xl {
    justify-content: space-around;
  }
  .jc-evenly-xl {
    justify-content: space-evenly;
  }
  .ai-start-xl {
    align-items: flex-start;
  }
  .ai-center-xl {
    align-items: center;
  }
  .ai-end-xl {
    align-items: flex-end;
  }
  .ai-baseline-xl {
    align-items: baseline;
  }
  .ai-stretch-xl {
    align-items: stretch;
  }
  .as-start-xl {
    align-self: flex-start;
  }
  .as-center-xl {
    align-self: center;
  }
  .as-end-xl {
    align-self: flex-end;
  }
  .as-stretch-xl {
    align-self: stretch;
  }
  .as-baseline-xl {
    align-self: baseline;
  }
  .ac-start-xl {
    align-content: flex-start;
  }
  .ac-center-xl {
    align-content: center;
  }
  .ac-end-xl {
    align-content: flex-end;
  }
  .ac-between-xl {
    align-content: space-between;
  }
  .ac-around-xl {
    align-content: space-around;
  }
  .ac-stretch-xl {
    align-content: stretch;
  }
  .flex-1-1-auto-xl {
    flex: 1 1 auto;
  }
  .flex-fill-xl {
    flex: 1 1 auto;
  }
  .flex-grow-0-xl {
    flex-grow: 0;
  }
  .flex-grow-1-xl {
    flex-grow: 1;
  }
  .flex-shrink-0-xl {
    flex-shrink: 0;
  }
  .flex-shrink-1-xl {
    flex-shrink: 1;
  }
}
@media (min-width: 1536px) {
  .fd-row-xxl {
    flex-direction: row;
  }
  .fd-row-reverse-xxl {
    flex-direction: row-reverse;
  }
  .fd-column-xxl {
    flex-direction: column;
  }
  .fd-column-reverse-xxl {
    flex-direction: column-reverse;
  }
  .fw-wrap-xxl {
    flex-wrap: wrap;
  }
  .fw-nowrap-xxl {
    flex-wrap: nowrap;
  }
  .fw-wrap-reverse-xxl {
    flex-wrap: wrap-reverse;
  }
  .jc-start-xxl {
    justify-content: flex-start;
  }
  .jc-center-xxl {
    justify-content: center;
  }
  .jc-end-xxl {
    justify-content: flex-end;
  }
  .jc-between-xxl {
    justify-content: space-between;
  }
  .jc-around-xxl {
    justify-content: space-around;
  }
  .jc-evenly-xxl {
    justify-content: space-evenly;
  }
  .ai-start-xxl {
    align-items: flex-start;
  }
  .ai-center-xxl {
    align-items: center;
  }
  .ai-end-xxl {
    align-items: flex-end;
  }
  .ai-baseline-xxl {
    align-items: baseline;
  }
  .ai-stretch-xxl {
    align-items: stretch;
  }
  .as-start-xxl {
    align-self: flex-start;
  }
  .as-center-xxl {
    align-self: center;
  }
  .as-end-xxl {
    align-self: flex-end;
  }
  .as-stretch-xxl {
    align-self: stretch;
  }
  .as-baseline-xxl {
    align-self: baseline;
  }
  .ac-start-xxl {
    align-content: flex-start;
  }
  .ac-center-xxl {
    align-content: center;
  }
  .ac-end-xxl {
    align-content: flex-end;
  }
  .ac-between-xxl {
    align-content: space-between;
  }
  .ac-around-xxl {
    align-content: space-around;
  }
  .ac-stretch-xxl {
    align-content: stretch;
  }
  .flex-1-1-auto-xxl {
    flex: 1 1 auto;
  }
  .flex-fill-xxl {
    flex: 1 1 auto;
  }
  .flex-grow-0-xxl {
    flex-grow: 0;
  }
  .flex-grow-1-xxl {
    flex-grow: 1;
  }
  .flex-shrink-0-xxl {
    flex-shrink: 0;
  }
  .flex-shrink-1-xxl {
    flex-shrink: 1;
  }
}
.grid {
  display: flex;
  flex-wrap: wrap;
  gap: var(--grid-gap);
}

.grid > * {
  padding-inline: var(--grid-padding-x);
  padding-block: var(--grid-padding-y);
  min-width: 0;
}

.g-col {
  flex: 1 0 0;
}

.g-col-1 {
  flex: 0 0 calc(8.3333333333% - var(--grid-gap) * 0.9166666667);
  max-width: calc(8.3333333333% - var(--grid-gap) * 0.9166666667);
}

.g-col-2 {
  flex: 0 0 calc(16.6666666667% - var(--grid-gap) * 0.8333333333);
  max-width: calc(16.6666666667% - var(--grid-gap) * 0.8333333333);
}

.g-col-3 {
  flex: 0 0 calc(25% - var(--grid-gap) * 0.75);
  max-width: calc(25% - var(--grid-gap) * 0.75);
}

.g-col-4 {
  flex: 0 0 calc(33.3333333333% - var(--grid-gap) * 0.6666666667);
  max-width: calc(33.3333333333% - var(--grid-gap) * 0.6666666667);
}

.g-col-5 {
  flex: 0 0 calc(41.6666666667% - var(--grid-gap) * 0.5833333333);
  max-width: calc(41.6666666667% - var(--grid-gap) * 0.5833333333);
}

.g-col-6 {
  flex: 0 0 calc(50% - var(--grid-gap) * 0.5);
  max-width: calc(50% - var(--grid-gap) * 0.5);
}

.g-col-7 {
  flex: 0 0 calc(58.3333333333% - var(--grid-gap) * 0.4166666667);
  max-width: calc(58.3333333333% - var(--grid-gap) * 0.4166666667);
}

.g-col-8 {
  flex: 0 0 calc(66.6666666667% - var(--grid-gap) * 0.3333333333);
  max-width: calc(66.6666666667% - var(--grid-gap) * 0.3333333333);
}

.g-col-9 {
  flex: 0 0 calc(75% - var(--grid-gap) * 0.25);
  max-width: calc(75% - var(--grid-gap) * 0.25);
}

.g-col-10 {
  flex: 0 0 calc(83.3333333333% - var(--grid-gap) * 0.1666666667);
  max-width: calc(83.3333333333% - var(--grid-gap) * 0.1666666667);
}

.g-col-11 {
  flex: 0 0 calc(91.6666666667% - var(--grid-gap) * 0.0833333333);
  max-width: calc(91.6666666667% - var(--grid-gap) * 0.0833333333);
}

.g-col-12 {
  flex: 0 0 calc(100% - var(--grid-gap) * 0);
  max-width: calc(100% - var(--grid-gap) * 0);
}

@media (min-width: 480px) {
  .g-col-1-xs {
    flex: 0 0 calc(8.3333333333% - var(--grid-gap) * 0.9166666667);
    max-width: calc(8.3333333333% - var(--grid-gap) * 0.9166666667);
  }
  .g-col-2-xs {
    flex: 0 0 calc(16.6666666667% - var(--grid-gap) * 0.8333333333);
    max-width: calc(16.6666666667% - var(--grid-gap) * 0.8333333333);
  }
  .g-col-3-xs {
    flex: 0 0 calc(25% - var(--grid-gap) * 0.75);
    max-width: calc(25% - var(--grid-gap) * 0.75);
  }
  .g-col-4-xs {
    flex: 0 0 calc(33.3333333333% - var(--grid-gap) * 0.6666666667);
    max-width: calc(33.3333333333% - var(--grid-gap) * 0.6666666667);
  }
  .g-col-5-xs {
    flex: 0 0 calc(41.6666666667% - var(--grid-gap) * 0.5833333333);
    max-width: calc(41.6666666667% - var(--grid-gap) * 0.5833333333);
  }
  .g-col-6-xs {
    flex: 0 0 calc(50% - var(--grid-gap) * 0.5);
    max-width: calc(50% - var(--grid-gap) * 0.5);
  }
  .g-col-7-xs {
    flex: 0 0 calc(58.3333333333% - var(--grid-gap) * 0.4166666667);
    max-width: calc(58.3333333333% - var(--grid-gap) * 0.4166666667);
  }
  .g-col-8-xs {
    flex: 0 0 calc(66.6666666667% - var(--grid-gap) * 0.3333333333);
    max-width: calc(66.6666666667% - var(--grid-gap) * 0.3333333333);
  }
  .g-col-9-xs {
    flex: 0 0 calc(75% - var(--grid-gap) * 0.25);
    max-width: calc(75% - var(--grid-gap) * 0.25);
  }
  .g-col-10-xs {
    flex: 0 0 calc(83.3333333333% - var(--grid-gap) * 0.1666666667);
    max-width: calc(83.3333333333% - var(--grid-gap) * 0.1666666667);
  }
  .g-col-11-xs {
    flex: 0 0 calc(91.6666666667% - var(--grid-gap) * 0.0833333333);
    max-width: calc(91.6666666667% - var(--grid-gap) * 0.0833333333);
  }
  .g-col-12-xs {
    flex: 0 0 calc(100% - var(--grid-gap) * 0);
    max-width: calc(100% - var(--grid-gap) * 0);
  }
}
@media (min-width: 640px) {
  .g-col-1-sm {
    flex: 0 0 calc(8.3333333333% - var(--grid-gap) * 0.9166666667);
    max-width: calc(8.3333333333% - var(--grid-gap) * 0.9166666667);
  }
  .g-col-2-sm {
    flex: 0 0 calc(16.6666666667% - var(--grid-gap) * 0.8333333333);
    max-width: calc(16.6666666667% - var(--grid-gap) * 0.8333333333);
  }
  .g-col-3-sm {
    flex: 0 0 calc(25% - var(--grid-gap) * 0.75);
    max-width: calc(25% - var(--grid-gap) * 0.75);
  }
  .g-col-4-sm {
    flex: 0 0 calc(33.3333333333% - var(--grid-gap) * 0.6666666667);
    max-width: calc(33.3333333333% - var(--grid-gap) * 0.6666666667);
  }
  .g-col-5-sm {
    flex: 0 0 calc(41.6666666667% - var(--grid-gap) * 0.5833333333);
    max-width: calc(41.6666666667% - var(--grid-gap) * 0.5833333333);
  }
  .g-col-6-sm {
    flex: 0 0 calc(50% - var(--grid-gap) * 0.5);
    max-width: calc(50% - var(--grid-gap) * 0.5);
  }
  .g-col-7-sm {
    flex: 0 0 calc(58.3333333333% - var(--grid-gap) * 0.4166666667);
    max-width: calc(58.3333333333% - var(--grid-gap) * 0.4166666667);
  }
  .g-col-8-sm {
    flex: 0 0 calc(66.6666666667% - var(--grid-gap) * 0.3333333333);
    max-width: calc(66.6666666667% - var(--grid-gap) * 0.3333333333);
  }
  .g-col-9-sm {
    flex: 0 0 calc(75% - var(--grid-gap) * 0.25);
    max-width: calc(75% - var(--grid-gap) * 0.25);
  }
  .g-col-10-sm {
    flex: 0 0 calc(83.3333333333% - var(--grid-gap) * 0.1666666667);
    max-width: calc(83.3333333333% - var(--grid-gap) * 0.1666666667);
  }
  .g-col-11-sm {
    flex: 0 0 calc(91.6666666667% - var(--grid-gap) * 0.0833333333);
    max-width: calc(91.6666666667% - var(--grid-gap) * 0.0833333333);
  }
  .g-col-12-sm {
    flex: 0 0 calc(100% - var(--grid-gap) * 0);
    max-width: calc(100% - var(--grid-gap) * 0);
  }
}
@media (min-width: 768px) {
  .g-col-1-md {
    flex: 0 0 calc(8.3333333333% - var(--grid-gap) * 0.9166666667);
    max-width: calc(8.3333333333% - var(--grid-gap) * 0.9166666667);
  }
  .g-col-2-md {
    flex: 0 0 calc(16.6666666667% - var(--grid-gap) * 0.8333333333);
    max-width: calc(16.6666666667% - var(--grid-gap) * 0.8333333333);
  }
  .g-col-3-md {
    flex: 0 0 calc(25% - var(--grid-gap) * 0.75);
    max-width: calc(25% - var(--grid-gap) * 0.75);
  }
  .g-col-4-md {
    flex: 0 0 calc(33.3333333333% - var(--grid-gap) * 0.6666666667);
    max-width: calc(33.3333333333% - var(--grid-gap) * 0.6666666667);
  }
  .g-col-5-md {
    flex: 0 0 calc(41.6666666667% - var(--grid-gap) * 0.5833333333);
    max-width: calc(41.6666666667% - var(--grid-gap) * 0.5833333333);
  }
  .g-col-6-md {
    flex: 0 0 calc(50% - var(--grid-gap) * 0.5);
    max-width: calc(50% - var(--grid-gap) * 0.5);
  }
  .g-col-7-md {
    flex: 0 0 calc(58.3333333333% - var(--grid-gap) * 0.4166666667);
    max-width: calc(58.3333333333% - var(--grid-gap) * 0.4166666667);
  }
  .g-col-8-md {
    flex: 0 0 calc(66.6666666667% - var(--grid-gap) * 0.3333333333);
    max-width: calc(66.6666666667% - var(--grid-gap) * 0.3333333333);
  }
  .g-col-9-md {
    flex: 0 0 calc(75% - var(--grid-gap) * 0.25);
    max-width: calc(75% - var(--grid-gap) * 0.25);
  }
  .g-col-10-md {
    flex: 0 0 calc(83.3333333333% - var(--grid-gap) * 0.1666666667);
    max-width: calc(83.3333333333% - var(--grid-gap) * 0.1666666667);
  }
  .g-col-11-md {
    flex: 0 0 calc(91.6666666667% - var(--grid-gap) * 0.0833333333);
    max-width: calc(91.6666666667% - var(--grid-gap) * 0.0833333333);
  }
  .g-col-12-md {
    flex: 0 0 calc(100% - var(--grid-gap) * 0);
    max-width: calc(100% - var(--grid-gap) * 0);
  }
}
@media (min-width: 1024px) {
  .g-col-1-lg {
    flex: 0 0 calc(8.3333333333% - var(--grid-gap) * 0.9166666667);
    max-width: calc(8.3333333333% - var(--grid-gap) * 0.9166666667);
  }
  .g-col-2-lg {
    flex: 0 0 calc(16.6666666667% - var(--grid-gap) * 0.8333333333);
    max-width: calc(16.6666666667% - var(--grid-gap) * 0.8333333333);
  }
  .g-col-3-lg {
    flex: 0 0 calc(25% - var(--grid-gap) * 0.75);
    max-width: calc(25% - var(--grid-gap) * 0.75);
  }
  .g-col-4-lg {
    flex: 0 0 calc(33.3333333333% - var(--grid-gap) * 0.6666666667);
    max-width: calc(33.3333333333% - var(--grid-gap) * 0.6666666667);
  }
  .g-col-5-lg {
    flex: 0 0 calc(41.6666666667% - var(--grid-gap) * 0.5833333333);
    max-width: calc(41.6666666667% - var(--grid-gap) * 0.5833333333);
  }
  .g-col-6-lg {
    flex: 0 0 calc(50% - var(--grid-gap) * 0.5);
    max-width: calc(50% - var(--grid-gap) * 0.5);
  }
  .g-col-7-lg {
    flex: 0 0 calc(58.3333333333% - var(--grid-gap) * 0.4166666667);
    max-width: calc(58.3333333333% - var(--grid-gap) * 0.4166666667);
  }
  .g-col-8-lg {
    flex: 0 0 calc(66.6666666667% - var(--grid-gap) * 0.3333333333);
    max-width: calc(66.6666666667% - var(--grid-gap) * 0.3333333333);
  }
  .g-col-9-lg {
    flex: 0 0 calc(75% - var(--grid-gap) * 0.25);
    max-width: calc(75% - var(--grid-gap) * 0.25);
  }
  .g-col-10-lg {
    flex: 0 0 calc(83.3333333333% - var(--grid-gap) * 0.1666666667);
    max-width: calc(83.3333333333% - var(--grid-gap) * 0.1666666667);
  }
  .g-col-11-lg {
    flex: 0 0 calc(91.6666666667% - var(--grid-gap) * 0.0833333333);
    max-width: calc(91.6666666667% - var(--grid-gap) * 0.0833333333);
  }
  .g-col-12-lg {
    flex: 0 0 calc(100% - var(--grid-gap) * 0);
    max-width: calc(100% - var(--grid-gap) * 0);
  }
}
@media (min-width: 1280px) {
  .g-col-1-xl {
    flex: 0 0 calc(8.3333333333% - var(--grid-gap) * 0.9166666667);
    max-width: calc(8.3333333333% - var(--grid-gap) * 0.9166666667);
  }
  .g-col-2-xl {
    flex: 0 0 calc(16.6666666667% - var(--grid-gap) * 0.8333333333);
    max-width: calc(16.6666666667% - var(--grid-gap) * 0.8333333333);
  }
  .g-col-3-xl {
    flex: 0 0 calc(25% - var(--grid-gap) * 0.75);
    max-width: calc(25% - var(--grid-gap) * 0.75);
  }
  .g-col-4-xl {
    flex: 0 0 calc(33.3333333333% - var(--grid-gap) * 0.6666666667);
    max-width: calc(33.3333333333% - var(--grid-gap) * 0.6666666667);
  }
  .g-col-5-xl {
    flex: 0 0 calc(41.6666666667% - var(--grid-gap) * 0.5833333333);
    max-width: calc(41.6666666667% - var(--grid-gap) * 0.5833333333);
  }
  .g-col-6-xl {
    flex: 0 0 calc(50% - var(--grid-gap) * 0.5);
    max-width: calc(50% - var(--grid-gap) * 0.5);
  }
  .g-col-7-xl {
    flex: 0 0 calc(58.3333333333% - var(--grid-gap) * 0.4166666667);
    max-width: calc(58.3333333333% - var(--grid-gap) * 0.4166666667);
  }
  .g-col-8-xl {
    flex: 0 0 calc(66.6666666667% - var(--grid-gap) * 0.3333333333);
    max-width: calc(66.6666666667% - var(--grid-gap) * 0.3333333333);
  }
  .g-col-9-xl {
    flex: 0 0 calc(75% - var(--grid-gap) * 0.25);
    max-width: calc(75% - var(--grid-gap) * 0.25);
  }
  .g-col-10-xl {
    flex: 0 0 calc(83.3333333333% - var(--grid-gap) * 0.1666666667);
    max-width: calc(83.3333333333% - var(--grid-gap) * 0.1666666667);
  }
  .g-col-11-xl {
    flex: 0 0 calc(91.6666666667% - var(--grid-gap) * 0.0833333333);
    max-width: calc(91.6666666667% - var(--grid-gap) * 0.0833333333);
  }
  .g-col-12-xl {
    flex: 0 0 calc(100% - var(--grid-gap) * 0);
    max-width: calc(100% - var(--grid-gap) * 0);
  }
}
@media (min-width: 1536px) {
  .g-col-1-xxl {
    flex: 0 0 calc(8.3333333333% - var(--grid-gap) * 0.9166666667);
    max-width: calc(8.3333333333% - var(--grid-gap) * 0.9166666667);
  }
  .g-col-2-xxl {
    flex: 0 0 calc(16.6666666667% - var(--grid-gap) * 0.8333333333);
    max-width: calc(16.6666666667% - var(--grid-gap) * 0.8333333333);
  }
  .g-col-3-xxl {
    flex: 0 0 calc(25% - var(--grid-gap) * 0.75);
    max-width: calc(25% - var(--grid-gap) * 0.75);
  }
  .g-col-4-xxl {
    flex: 0 0 calc(33.3333333333% - var(--grid-gap) * 0.6666666667);
    max-width: calc(33.3333333333% - var(--grid-gap) * 0.6666666667);
  }
  .g-col-5-xxl {
    flex: 0 0 calc(41.6666666667% - var(--grid-gap) * 0.5833333333);
    max-width: calc(41.6666666667% - var(--grid-gap) * 0.5833333333);
  }
  .g-col-6-xxl {
    flex: 0 0 calc(50% - var(--grid-gap) * 0.5);
    max-width: calc(50% - var(--grid-gap) * 0.5);
  }
  .g-col-7-xxl {
    flex: 0 0 calc(58.3333333333% - var(--grid-gap) * 0.4166666667);
    max-width: calc(58.3333333333% - var(--grid-gap) * 0.4166666667);
  }
  .g-col-8-xxl {
    flex: 0 0 calc(66.6666666667% - var(--grid-gap) * 0.3333333333);
    max-width: calc(66.6666666667% - var(--grid-gap) * 0.3333333333);
  }
  .g-col-9-xxl {
    flex: 0 0 calc(75% - var(--grid-gap) * 0.25);
    max-width: calc(75% - var(--grid-gap) * 0.25);
  }
  .g-col-10-xxl {
    flex: 0 0 calc(83.3333333333% - var(--grid-gap) * 0.1666666667);
    max-width: calc(83.3333333333% - var(--grid-gap) * 0.1666666667);
  }
  .g-col-11-xxl {
    flex: 0 0 calc(91.6666666667% - var(--grid-gap) * 0.0833333333);
    max-width: calc(91.6666666667% - var(--grid-gap) * 0.0833333333);
  }
  .g-col-12-xxl {
    flex: 0 0 calc(100% - var(--grid-gap) * 0);
    max-width: calc(100% - var(--grid-gap) * 0);
  }
}
.accordion {
  --accordion-border: var(--accordion-border-width) var(--accordion-border-style) var(--accordion-border-color);
  border: var(--accordion-border);
  border-radius: var(--accordion-border-radius);
  background-color: var(--accordion-background-color);
  overflow: clip;
}

.accordion-btn {
  padding-inline: var(--accordion-button-padding-x);
  padding-block: var(--accordion-button-padding-y);
  border-inline: none;
  border-block: var(--accordion-border);
  width: 100%;
  display: inline-flex;
  align-items: center;
  background-color: var(--accordion-button-background-color);
  line-height: normal;
}
.accordion-btn[aria-expanded=false] {
  border-bottom: none;
}

.accordion-item:first-child .accordion-btn {
  border-top: none;
}

.accordion-btn-sm {
  padding-inline: var(--accordion-button-padding-x-sm);
  padding-block: var(--accordion-button-padding-y-sm);
}

.accordion-btn-md {
  padding-inline: var(--accordion-button-padding-x-md);
  padding-block: var(--accordion-button-padding-y-md);
}

.accordion-btn-lg {
  padding-inline: var(--accordion-button-padding-x-lg);
  padding-block: var(--accordion-button-padding-y-lg);
}

.accordion-body {
  padding-inline: var(--accordion-body-padding-x);
  padding-block: var(--accordion-body-padding-y);
}

.accordion-indicator::after {
  content: var(--accordion-indicator-content);
  display: inline-block;
  transition: transform 0.2s ease;
}

.accordion-btn.is-open .accordion-indicator::after {
  content: var(--accordion-indicator-content);
  transform: rotate(135deg);
}

.alert-container {
  z-index: 1000;
  display: flex;
  flex-direction: column;
  gap: var(--alert-gap);
  padding-inline: var(--alert-container-padding-x);
  padding-block: var(--alert-container-padding-y);
}

.alert {
  width: 100%;
  display: flex;
  flex-direction: column;
  overflow: clip;
  border-radius: var(--alert-border-radius);
  border-width: var(--alert-border-width);
  border-style: var(--alert-border-style);
  border-color: var(--alert-border-color);
  background-color: var(--alert-background-color);
}

.alert-header {
  padding-inline: var(--alert-header-padding-x);
  padding-block: var(--alert-header-padding-y);
}

.alert-body {
  flex: 1 1 auto;
  padding-inline: var(--alert-body-padding-x);
  padding-block: var(--alert-body-padding-y);
}

.alert-footer {
  padding-inline: var(--alert-footer-padding-x);
  padding-block: var(--alert-footer-padding-y);
}

.alert-primary {
  border-color: var(--color-primary);
  background-color: var(--color-primary);
  color: var(--content-on-primary);
}

.alert-secondary {
  border-color: var(--color-secondary);
  background-color: var(--color-secondary);
  color: var(--content-on-secondary);
}

.alert-tertiary {
  border-color: var(--color-tertiary);
  background-color: var(--color-tertiary);
  color: var(--content-on-tertiary);
}

.alert-success {
  border-color: var(--color-success);
  background-color: var(--color-success);
  color: var(--content-on-success);
}

.alert-info {
  border-color: var(--color-info);
  background-color: var(--color-info);
  color: var(--content-on-info);
}

.alert-warning {
  border-color: var(--color-warning);
  background-color: var(--color-warning);
  color: var(--content-on-warning);
}

.alert-danger {
  border-color: var(--color-danger);
  background-color: var(--color-danger);
  color: var(--content-on-danger);
}

.alert-neutral {
  border-color: var(--color-neutral);
  background-color: var(--color-neutral);
  color: var(--content-on-neutral);
}

.alert-light {
  border-color: var(--color-light);
  background-color: var(--color-light);
  color: var(--content-on-light);
}

.alert-dark {
  border-color: var(--color-dark);
  background-color: var(--color-dark);
  color: var(--content-on-dark);
}

.alert-white {
  border-color: var(--color-white);
  background-color: var(--color-white);
  color: var(--content-on-white);
}

.alert-black {
  border-color: var(--color-black);
  background-color: var(--color-black);
  color: var(--content-on-black);
}

.alert-primary-ghost {
  border-color: var(--color-primary-ghost);
  background-color: var(--color-primary-ghost);
  color: var(--content-on-primary-ghost);
}

.alert-secondary-ghost {
  border-color: var(--color-secondary-ghost);
  background-color: var(--color-secondary-ghost);
  color: var(--content-on-secondary-ghost);
}

.alert-tertiary-ghost {
  border-color: var(--color-tertiary-ghost);
  background-color: var(--color-tertiary-ghost);
  color: var(--content-on-tertiary-ghost);
}

.alert-success-ghost {
  border-color: var(--color-success-ghost);
  background-color: var(--color-success-ghost);
  color: var(--content-on-success-ghost);
}

.alert-info-ghost {
  border-color: var(--color-info-ghost);
  background-color: var(--color-info-ghost);
  color: var(--content-on-info-ghost);
}

.alert-warning-ghost {
  border-color: var(--color-warning-ghost);
  background-color: var(--color-warning-ghost);
  color: var(--content-on-warning-ghost);
}

.alert-danger-ghost {
  border-color: var(--color-danger-ghost);
  background-color: var(--color-danger-ghost);
  color: var(--content-on-danger-ghost);
}

.alert-neutral-ghost {
  border-color: var(--color-neutral-ghost);
  background-color: var(--color-neutral-ghost);
  color: var(--content-on-neutral-ghost);
}

.alert-light-ghost {
  border-color: var(--color-light-ghost);
  background-color: var(--color-light-ghost);
  color: var(--content-on-light-ghost);
}

.alert-dark-ghost {
  border-color: var(--color-dark-ghost);
  background-color: var(--color-dark-ghost);
  color: var(--content-on-dark-ghost);
}

.alert-white-ghost {
  border-color: var(--color-white-ghost);
  background-color: var(--color-white-ghost);
  color: var(--content-on-white-ghost);
}

.alert-black-ghost {
  border-color: var(--color-black-ghost);
  background-color: var(--color-black-ghost);
  color: var(--content-on-black-ghost);
}

.badge {
  border-radius: var(--badge-border-radius);
  border-width: var(--badge-border-width);
  border-style: var(--badge-border-style);
  border-color: var(--badge-border-color);
  background-color: var(--badge-background-color);
  padding-inline: var(--badge-padding-x);
  padding-block: var(--badge-padding-y);
  display: inline-flex;
  align-items: center;
  text-wrap: nowrap;
  line-height: normal;
}

.badge-sm {
  padding-inline: var(--badge-padding-x-sm);
  padding-block: var(--badge-padding-y-sm);
}

.badge-md {
  padding-inline: var(--badge-padding-x-md);
  padding-block: var(--badge-padding-y-md);
}

.badge-lg {
  padding-inline: var(--badge-padding-x-lg);
  padding-block: var(--badge-padding-y-lg);
}

.badge-primary {
  border-color: var(--color-transparent);
  background-color: var(--color-primary);
  color: var(--content-on-primary);
}

.badge-secondary {
  border-color: var(--color-transparent);
  background-color: var(--color-secondary);
  color: var(--content-on-secondary);
}

.badge-tertiary {
  border-color: var(--color-transparent);
  background-color: var(--color-tertiary);
  color: var(--content-on-tertiary);
}

.badge-success {
  border-color: var(--color-transparent);
  background-color: var(--color-success);
  color: var(--content-on-success);
}

.badge-info {
  border-color: var(--color-transparent);
  background-color: var(--color-info);
  color: var(--content-on-info);
}

.badge-warning {
  border-color: var(--color-transparent);
  background-color: var(--color-warning);
  color: var(--content-on-warning);
}

.badge-danger {
  border-color: var(--color-transparent);
  background-color: var(--color-danger);
  color: var(--content-on-danger);
}

.badge-neutral {
  border-color: var(--color-transparent);
  background-color: var(--color-neutral);
  color: var(--content-on-neutral);
}

.badge-light {
  border-color: var(--color-transparent);
  background-color: var(--color-light);
  color: var(--content-on-light);
}

.badge-dark {
  border-color: var(--color-transparent);
  background-color: var(--color-dark);
  color: var(--content-on-dark);
}

.badge-white {
  border-color: var(--color-transparent);
  background-color: var(--color-white);
  color: var(--content-on-white);
}

.badge-black {
  border-color: var(--color-transparent);
  background-color: var(--color-black);
  color: var(--content-on-black);
}

.badge-primary-ghost {
  border-color: var(--color-transparent);
  background-color: var(--color-primary-ghost);
  color: var(--content-on-primary-ghost);
}

.badge-secondary-ghost {
  border-color: var(--color-transparent);
  background-color: var(--color-secondary-ghost);
  color: var(--content-on-secondary-ghost);
}

.badge-tertiary-ghost {
  border-color: var(--color-transparent);
  background-color: var(--color-tertiary-ghost);
  color: var(--content-on-tertiary-ghost);
}

.badge-success-ghost {
  border-color: var(--color-transparent);
  background-color: var(--color-success-ghost);
  color: var(--content-on-success-ghost);
}

.badge-info-ghost {
  border-color: var(--color-transparent);
  background-color: var(--color-info-ghost);
  color: var(--content-on-info-ghost);
}

.badge-warning-ghost {
  border-color: var(--color-transparent);
  background-color: var(--color-warning-ghost);
  color: var(--content-on-warning-ghost);
}

.badge-danger-ghost {
  border-color: var(--color-transparent);
  background-color: var(--color-danger-ghost);
  color: var(--content-on-danger-ghost);
}

.badge-neutral-ghost {
  border-color: var(--color-transparent);
  background-color: var(--color-neutral-ghost);
  color: var(--content-on-neutral-ghost);
}

.badge-light-ghost {
  border-color: var(--color-transparent);
  background-color: var(--color-light-ghost);
  color: var(--content-on-light-ghost);
}

.badge-dark-ghost {
  border-color: var(--color-transparent);
  background-color: var(--color-dark-ghost);
  color: var(--content-on-dark-ghost);
}

.badge-white-ghost {
  border-color: var(--color-transparent);
  background-color: var(--color-white-ghost);
  color: var(--content-on-white-ghost);
}

.badge-black-ghost {
  border-color: var(--color-transparent);
  background-color: var(--color-black-ghost);
  color: var(--content-on-black-ghost);
}

.btn-group {
  display: inline-flex;
  width: 100%;
}
.btn-group button,
.btn-group .btn {
  border-radius: 0;
}
.btn-group button[class*=outline-]:not(:first-child),
.btn-group .btn[class*=outline-]:not(:first-child) {
  border-left: none;
}
.btn-group button:first-child,
.btn-group .btn:first-child {
  border-top-left-radius: var(--button-border-radius);
  border-bottom-left-radius: var(--button-border-radius);
}
.btn-group button:last-child,
.btn-group .btn:last-child {
  border-top-right-radius: var(--button-border-radius);
  border-bottom-right-radius: var(--button-border-radius);
}

.btn {
  padding-inline: var(--button-padding-x);
  padding-block: var(--button-padding-y);
  border-radius: var(--button-border-radius);
  border-width: var(--button-border-width);
  border-style: var(--button-border-style);
  border-color: var(--button-border-color);
  background-color: var(--button-background-color);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  text-wrap: nowrap;
  line-height: normal;
}

.btn-sm {
  padding-inline: var(--button-padding-x-sm);
  padding-block: var(--button-padding-y-sm);
}

.btn-md {
  padding-inline: var(--button-padding-x-md);
  padding-block: var(--button-padding-y-md);
}

.btn-lg {
  padding-inline: var(--button-padding-x-lg);
  padding-block: var(--button-padding-y-lg);
}

.close-indicator::after {
  content: var(--button-close-content);
}

.btn:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--button-hover-background-color);
}
.btn:not(:disabled):active, .btn:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--button-active-background-color);
}
.btn:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--button-border-color);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--button-border-color) 50%, transparent);
}
.btn:disabled {
  background-color: var(--button-disabled-background-color);
  border-color: var(--button-disabled-border-color);
  color: var(--button-disabled-color);
  opacity: 0.5;
}

.btn-primary {
  border-color: var(--color-transparent);
  background-color: var(--color-primary);
  color: var(--content-on-primary);
}
.btn-primary:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--hover-primary);
}
.btn-primary:not(:disabled):active, .btn-primary:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-primary);
}
.btn-primary:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-primary);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-primary) 50%, transparent);
}
.btn-primary:disabled {
  background-color: var(--button-disabled-background-color);
  border-color: var(--button-disabled-border-color);
  color: var(--button-disabled-color);
  opacity: 0.5;
}

.btn-secondary {
  border-color: var(--color-transparent);
  background-color: var(--color-secondary);
  color: var(--content-on-secondary);
}
.btn-secondary:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--hover-secondary);
}
.btn-secondary:not(:disabled):active, .btn-secondary:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-secondary);
}
.btn-secondary:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-secondary);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-secondary) 50%, transparent);
}
.btn-secondary:disabled {
  background-color: var(--button-disabled-background-color);
  border-color: var(--button-disabled-border-color);
  color: var(--button-disabled-color);
  opacity: 0.5;
}

.btn-tertiary {
  border-color: var(--color-transparent);
  background-color: var(--color-tertiary);
  color: var(--content-on-tertiary);
}
.btn-tertiary:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--hover-tertiary);
}
.btn-tertiary:not(:disabled):active, .btn-tertiary:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-tertiary);
}
.btn-tertiary:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-tertiary);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-tertiary) 50%, transparent);
}
.btn-tertiary:disabled {
  background-color: var(--button-disabled-background-color);
  border-color: var(--button-disabled-border-color);
  color: var(--button-disabled-color);
  opacity: 0.5;
}

.btn-success {
  border-color: var(--color-transparent);
  background-color: var(--color-success);
  color: var(--content-on-success);
}
.btn-success:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--hover-success);
}
.btn-success:not(:disabled):active, .btn-success:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-success);
}
.btn-success:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-success);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-success) 50%, transparent);
}
.btn-success:disabled {
  background-color: var(--button-disabled-background-color);
  border-color: var(--button-disabled-border-color);
  color: var(--button-disabled-color);
  opacity: 0.5;
}

.btn-info {
  border-color: var(--color-transparent);
  background-color: var(--color-info);
  color: var(--content-on-info);
}
.btn-info:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--hover-info);
}
.btn-info:not(:disabled):active, .btn-info:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-info);
}
.btn-info:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-info);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-info) 50%, transparent);
}
.btn-info:disabled {
  background-color: var(--button-disabled-background-color);
  border-color: var(--button-disabled-border-color);
  color: var(--button-disabled-color);
  opacity: 0.5;
}

.btn-warning {
  border-color: var(--color-transparent);
  background-color: var(--color-warning);
  color: var(--content-on-warning);
}
.btn-warning:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--hover-warning);
}
.btn-warning:not(:disabled):active, .btn-warning:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-warning);
}
.btn-warning:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-warning);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-warning) 50%, transparent);
}
.btn-warning:disabled {
  background-color: var(--button-disabled-background-color);
  border-color: var(--button-disabled-border-color);
  color: var(--button-disabled-color);
  opacity: 0.5;
}

.btn-danger {
  border-color: var(--color-transparent);
  background-color: var(--color-danger);
  color: var(--content-on-danger);
}
.btn-danger:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--hover-danger);
}
.btn-danger:not(:disabled):active, .btn-danger:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-danger);
}
.btn-danger:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-danger);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-danger) 50%, transparent);
}
.btn-danger:disabled {
  background-color: var(--button-disabled-background-color);
  border-color: var(--button-disabled-border-color);
  color: var(--button-disabled-color);
  opacity: 0.5;
}

.btn-neutral {
  border-color: var(--color-transparent);
  background-color: var(--color-neutral);
  color: var(--content-on-neutral);
}
.btn-neutral:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--hover-neutral);
}
.btn-neutral:not(:disabled):active, .btn-neutral:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-neutral);
}
.btn-neutral:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-neutral);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-neutral) 50%, transparent);
}
.btn-neutral:disabled {
  background-color: var(--button-disabled-background-color);
  border-color: var(--button-disabled-border-color);
  color: var(--button-disabled-color);
  opacity: 0.5;
}

.btn-light {
  border-color: var(--color-transparent);
  background-color: var(--color-light);
  color: var(--content-on-light);
}
.btn-light:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--hover-light);
}
.btn-light:not(:disabled):active, .btn-light:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-light);
}
.btn-light:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-light);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-light) 50%, transparent);
}
.btn-light:disabled {
  background-color: var(--button-disabled-background-color);
  border-color: var(--button-disabled-border-color);
  color: var(--button-disabled-color);
  opacity: 0.5;
}

.btn-dark {
  border-color: var(--color-transparent);
  background-color: var(--color-dark);
  color: var(--content-on-dark);
}
.btn-dark:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--hover-dark);
}
.btn-dark:not(:disabled):active, .btn-dark:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-dark);
}
.btn-dark:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-dark);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-dark) 50%, transparent);
}
.btn-dark:disabled {
  background-color: var(--button-disabled-background-color);
  border-color: var(--button-disabled-border-color);
  color: var(--button-disabled-color);
  opacity: 0.5;
}

.btn-white {
  border-color: var(--color-transparent);
  background-color: var(--color-white);
  color: var(--content-on-white);
}
.btn-white:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--hover-white);
}
.btn-white:not(:disabled):active, .btn-white:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-white);
}
.btn-white:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-white);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-white) 50%, transparent);
}
.btn-white:disabled {
  background-color: var(--button-disabled-background-color);
  border-color: var(--button-disabled-border-color);
  color: var(--button-disabled-color);
  opacity: 0.5;
}

.btn-black {
  border-color: var(--color-transparent);
  background-color: var(--color-black);
  color: var(--content-on-black);
}
.btn-black:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--hover-black);
}
.btn-black:not(:disabled):active, .btn-black:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-black);
}
.btn-black:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-black);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-black) 50%, transparent);
}
.btn-black:disabled {
  background-color: var(--button-disabled-background-color);
  border-color: var(--button-disabled-border-color);
  color: var(--button-disabled-color);
  opacity: 0.5;
}

.btn-primary-ghost {
  border-color: var(--color-transparent);
  background-color: var(--color-primary-ghost);
  color: var(--content-on-primary-ghost);
}
.btn-primary-ghost:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--hover-primary-ghost);
}
.btn-primary-ghost:not(:disabled):active, .btn-primary-ghost:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-primary-ghost);
}
.btn-primary-ghost:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-primary-ghost);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-primary-ghost) 50%, transparent);
}
.btn-primary-ghost:disabled {
  background-color: var(--button-disabled-background-color);
  border-color: var(--button-disabled-border-color);
  color: var(--button-disabled-color);
  opacity: 0.5;
}

.btn-secondary-ghost {
  border-color: var(--color-transparent);
  background-color: var(--color-secondary-ghost);
  color: var(--content-on-secondary-ghost);
}
.btn-secondary-ghost:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--hover-secondary-ghost);
}
.btn-secondary-ghost:not(:disabled):active, .btn-secondary-ghost:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-secondary-ghost);
}
.btn-secondary-ghost:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-secondary-ghost);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-secondary-ghost) 50%, transparent);
}
.btn-secondary-ghost:disabled {
  background-color: var(--button-disabled-background-color);
  border-color: var(--button-disabled-border-color);
  color: var(--button-disabled-color);
  opacity: 0.5;
}

.btn-tertiary-ghost {
  border-color: var(--color-transparent);
  background-color: var(--color-tertiary-ghost);
  color: var(--content-on-tertiary-ghost);
}
.btn-tertiary-ghost:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--hover-tertiary-ghost);
}
.btn-tertiary-ghost:not(:disabled):active, .btn-tertiary-ghost:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-tertiary-ghost);
}
.btn-tertiary-ghost:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-tertiary-ghost);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-tertiary-ghost) 50%, transparent);
}
.btn-tertiary-ghost:disabled {
  background-color: var(--button-disabled-background-color);
  border-color: var(--button-disabled-border-color);
  color: var(--button-disabled-color);
  opacity: 0.5;
}

.btn-success-ghost {
  border-color: var(--color-transparent);
  background-color: var(--color-success-ghost);
  color: var(--content-on-success-ghost);
}
.btn-success-ghost:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--hover-success-ghost);
}
.btn-success-ghost:not(:disabled):active, .btn-success-ghost:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-success-ghost);
}
.btn-success-ghost:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-success-ghost);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-success-ghost) 50%, transparent);
}
.btn-success-ghost:disabled {
  background-color: var(--button-disabled-background-color);
  border-color: var(--button-disabled-border-color);
  color: var(--button-disabled-color);
  opacity: 0.5;
}

.btn-info-ghost {
  border-color: var(--color-transparent);
  background-color: var(--color-info-ghost);
  color: var(--content-on-info-ghost);
}
.btn-info-ghost:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--hover-info-ghost);
}
.btn-info-ghost:not(:disabled):active, .btn-info-ghost:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-info-ghost);
}
.btn-info-ghost:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-info-ghost);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-info-ghost) 50%, transparent);
}
.btn-info-ghost:disabled {
  background-color: var(--button-disabled-background-color);
  border-color: var(--button-disabled-border-color);
  color: var(--button-disabled-color);
  opacity: 0.5;
}

.btn-warning-ghost {
  border-color: var(--color-transparent);
  background-color: var(--color-warning-ghost);
  color: var(--content-on-warning-ghost);
}
.btn-warning-ghost:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--hover-warning-ghost);
}
.btn-warning-ghost:not(:disabled):active, .btn-warning-ghost:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-warning-ghost);
}
.btn-warning-ghost:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-warning-ghost);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-warning-ghost) 50%, transparent);
}
.btn-warning-ghost:disabled {
  background-color: var(--button-disabled-background-color);
  border-color: var(--button-disabled-border-color);
  color: var(--button-disabled-color);
  opacity: 0.5;
}

.btn-danger-ghost {
  border-color: var(--color-transparent);
  background-color: var(--color-danger-ghost);
  color: var(--content-on-danger-ghost);
}
.btn-danger-ghost:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--hover-danger-ghost);
}
.btn-danger-ghost:not(:disabled):active, .btn-danger-ghost:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-danger-ghost);
}
.btn-danger-ghost:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-danger-ghost);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-danger-ghost) 50%, transparent);
}
.btn-danger-ghost:disabled {
  background-color: var(--button-disabled-background-color);
  border-color: var(--button-disabled-border-color);
  color: var(--button-disabled-color);
  opacity: 0.5;
}

.btn-neutral-ghost {
  border-color: var(--color-transparent);
  background-color: var(--color-neutral-ghost);
  color: var(--content-on-neutral-ghost);
}
.btn-neutral-ghost:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--hover-neutral-ghost);
}
.btn-neutral-ghost:not(:disabled):active, .btn-neutral-ghost:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-neutral-ghost);
}
.btn-neutral-ghost:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-neutral-ghost);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-neutral-ghost) 50%, transparent);
}
.btn-neutral-ghost:disabled {
  background-color: var(--button-disabled-background-color);
  border-color: var(--button-disabled-border-color);
  color: var(--button-disabled-color);
  opacity: 0.5;
}

.btn-light-ghost {
  border-color: var(--color-transparent);
  background-color: var(--color-light-ghost);
  color: var(--content-on-light-ghost);
}
.btn-light-ghost:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--hover-light-ghost);
}
.btn-light-ghost:not(:disabled):active, .btn-light-ghost:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-light-ghost);
}
.btn-light-ghost:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-light-ghost);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-light-ghost) 50%, transparent);
}
.btn-light-ghost:disabled {
  background-color: var(--button-disabled-background-color);
  border-color: var(--button-disabled-border-color);
  color: var(--button-disabled-color);
  opacity: 0.5;
}

.btn-dark-ghost {
  border-color: var(--color-transparent);
  background-color: var(--color-dark-ghost);
  color: var(--content-on-dark-ghost);
}
.btn-dark-ghost:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--hover-dark-ghost);
}
.btn-dark-ghost:not(:disabled):active, .btn-dark-ghost:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-dark-ghost);
}
.btn-dark-ghost:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-dark-ghost);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-dark-ghost) 50%, transparent);
}
.btn-dark-ghost:disabled {
  background-color: var(--button-disabled-background-color);
  border-color: var(--button-disabled-border-color);
  color: var(--button-disabled-color);
  opacity: 0.5;
}

.btn-white-ghost {
  border-color: var(--color-transparent);
  background-color: var(--color-white-ghost);
  color: var(--content-on-white-ghost);
}
.btn-white-ghost:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--hover-white-ghost);
}
.btn-white-ghost:not(:disabled):active, .btn-white-ghost:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-white-ghost);
}
.btn-white-ghost:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-white-ghost);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-white-ghost) 50%, transparent);
}
.btn-white-ghost:disabled {
  background-color: var(--button-disabled-background-color);
  border-color: var(--button-disabled-border-color);
  color: var(--button-disabled-color);
  opacity: 0.5;
}

.btn-black-ghost {
  border-color: var(--color-transparent);
  background-color: var(--color-black-ghost);
  color: var(--content-on-black-ghost);
}
.btn-black-ghost:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--hover-black-ghost);
}
.btn-black-ghost:not(:disabled):active, .btn-black-ghost:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-black-ghost);
}
.btn-black-ghost:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-black-ghost);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-black-ghost) 50%, transparent);
}
.btn-black-ghost:disabled {
  background-color: var(--button-disabled-background-color);
  border-color: var(--button-disabled-border-color);
  color: var(--button-disabled-color);
  opacity: 0.5;
}

.btn-outline {
  background-color: var(--button-outline-background-color);
}
.btn-outline:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--button-hover-background-color);
}
.btn-outline:not(:disabled):active, .btn-outline:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--button-active-background-color);
}
.btn-outline:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--button-border-color);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--button-border-color) 50%, transparent);
}
.btn-outline:disabled {
  background-color: var(--button-outline-disabled-background-color);
  border-color: var(--button-outline-disabled-border-color);
  color: var(--button-outline-disabled-color);
  opacity: 0.5;
}

.btn-outline-primary {
  background-color: var(--button-outline-background-color);
  color: var(--color-primary);
  border-color: var(--color-primary);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}
.btn-outline-primary:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--color-primary);
  color: var(--content-on-primary);
}
.btn-outline-primary:not(:disabled):active, .btn-outline-primary:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-primary);
  color: var(--content-on-primary);
}
.btn-outline-primary:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-primary);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-primary) 50%, transparent);
}
.btn-outline-primary:disabled {
  background-color: var(--button-outline-disabled-background-color);
  border-color: var(--button-outline-disabled-border-color);
  color: var(--button-outline-disabled-color);
  opacity: 0.5;
}

.btn-outline-secondary {
  background-color: var(--button-outline-background-color);
  color: var(--color-secondary);
  border-color: var(--color-secondary);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}
.btn-outline-secondary:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--color-secondary);
  color: var(--content-on-secondary);
}
.btn-outline-secondary:not(:disabled):active, .btn-outline-secondary:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-secondary);
  color: var(--content-on-secondary);
}
.btn-outline-secondary:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-secondary);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-secondary) 50%, transparent);
}
.btn-outline-secondary:disabled {
  background-color: var(--button-outline-disabled-background-color);
  border-color: var(--button-outline-disabled-border-color);
  color: var(--button-outline-disabled-color);
  opacity: 0.5;
}

.btn-outline-tertiary {
  background-color: var(--button-outline-background-color);
  color: var(--color-tertiary);
  border-color: var(--color-tertiary);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}
.btn-outline-tertiary:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--color-tertiary);
  color: var(--content-on-tertiary);
}
.btn-outline-tertiary:not(:disabled):active, .btn-outline-tertiary:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-tertiary);
  color: var(--content-on-tertiary);
}
.btn-outline-tertiary:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-tertiary);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-tertiary) 50%, transparent);
}
.btn-outline-tertiary:disabled {
  background-color: var(--button-outline-disabled-background-color);
  border-color: var(--button-outline-disabled-border-color);
  color: var(--button-outline-disabled-color);
  opacity: 0.5;
}

.btn-outline-success {
  background-color: var(--button-outline-background-color);
  color: var(--color-success);
  border-color: var(--color-success);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}
.btn-outline-success:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--color-success);
  color: var(--content-on-success);
}
.btn-outline-success:not(:disabled):active, .btn-outline-success:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-success);
  color: var(--content-on-success);
}
.btn-outline-success:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-success);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-success) 50%, transparent);
}
.btn-outline-success:disabled {
  background-color: var(--button-outline-disabled-background-color);
  border-color: var(--button-outline-disabled-border-color);
  color: var(--button-outline-disabled-color);
  opacity: 0.5;
}

.btn-outline-info {
  background-color: var(--button-outline-background-color);
  color: var(--color-info);
  border-color: var(--color-info);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}
.btn-outline-info:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--color-info);
  color: var(--content-on-info);
}
.btn-outline-info:not(:disabled):active, .btn-outline-info:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-info);
  color: var(--content-on-info);
}
.btn-outline-info:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-info);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-info) 50%, transparent);
}
.btn-outline-info:disabled {
  background-color: var(--button-outline-disabled-background-color);
  border-color: var(--button-outline-disabled-border-color);
  color: var(--button-outline-disabled-color);
  opacity: 0.5;
}

.btn-outline-warning {
  background-color: var(--button-outline-background-color);
  color: var(--color-warning);
  border-color: var(--color-warning);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}
.btn-outline-warning:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--color-warning);
  color: var(--content-on-warning);
}
.btn-outline-warning:not(:disabled):active, .btn-outline-warning:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-warning);
  color: var(--content-on-warning);
}
.btn-outline-warning:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-warning);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-warning) 50%, transparent);
}
.btn-outline-warning:disabled {
  background-color: var(--button-outline-disabled-background-color);
  border-color: var(--button-outline-disabled-border-color);
  color: var(--button-outline-disabled-color);
  opacity: 0.5;
}

.btn-outline-danger {
  background-color: var(--button-outline-background-color);
  color: var(--color-danger);
  border-color: var(--color-danger);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}
.btn-outline-danger:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--color-danger);
  color: var(--content-on-danger);
}
.btn-outline-danger:not(:disabled):active, .btn-outline-danger:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-danger);
  color: var(--content-on-danger);
}
.btn-outline-danger:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-danger);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-danger) 50%, transparent);
}
.btn-outline-danger:disabled {
  background-color: var(--button-outline-disabled-background-color);
  border-color: var(--button-outline-disabled-border-color);
  color: var(--button-outline-disabled-color);
  opacity: 0.5;
}

.btn-outline-neutral {
  background-color: var(--button-outline-background-color);
  color: var(--color-neutral);
  border-color: var(--color-neutral);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}
.btn-outline-neutral:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--color-neutral);
  color: var(--content-on-neutral);
}
.btn-outline-neutral:not(:disabled):active, .btn-outline-neutral:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-neutral);
  color: var(--content-on-neutral);
}
.btn-outline-neutral:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-neutral);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-neutral) 50%, transparent);
}
.btn-outline-neutral:disabled {
  background-color: var(--button-outline-disabled-background-color);
  border-color: var(--button-outline-disabled-border-color);
  color: var(--button-outline-disabled-color);
  opacity: 0.5;
}

.btn-outline-light {
  background-color: var(--button-outline-background-color);
  color: var(--color-light);
  border-color: var(--color-light);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}
.btn-outline-light:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--color-light);
  color: var(--content-on-light);
}
.btn-outline-light:not(:disabled):active, .btn-outline-light:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-light);
  color: var(--content-on-light);
}
.btn-outline-light:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-light);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-light) 50%, transparent);
}
.btn-outline-light:disabled {
  background-color: var(--button-outline-disabled-background-color);
  border-color: var(--button-outline-disabled-border-color);
  color: var(--button-outline-disabled-color);
  opacity: 0.5;
}

.btn-outline-dark {
  background-color: var(--button-outline-background-color);
  color: var(--color-dark);
  border-color: var(--color-dark);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}
.btn-outline-dark:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--color-dark);
  color: var(--content-on-dark);
}
.btn-outline-dark:not(:disabled):active, .btn-outline-dark:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-dark);
  color: var(--content-on-dark);
}
.btn-outline-dark:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-dark);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-dark) 50%, transparent);
}
.btn-outline-dark:disabled {
  background-color: var(--button-outline-disabled-background-color);
  border-color: var(--button-outline-disabled-border-color);
  color: var(--button-outline-disabled-color);
  opacity: 0.5;
}

.btn-outline-white {
  background-color: var(--button-outline-background-color);
  color: var(--color-white);
  border-color: var(--color-white);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}
.btn-outline-white:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--color-white);
  color: var(--content-on-white);
}
.btn-outline-white:not(:disabled):active, .btn-outline-white:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-white);
  color: var(--content-on-white);
}
.btn-outline-white:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-white);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-white) 50%, transparent);
}
.btn-outline-white:disabled {
  background-color: var(--button-outline-disabled-background-color);
  border-color: var(--button-outline-disabled-border-color);
  color: var(--button-outline-disabled-color);
  opacity: 0.5;
}

.btn-outline-black {
  background-color: var(--button-outline-background-color);
  color: var(--color-black);
  border-color: var(--color-black);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}
.btn-outline-black:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--color-black);
  color: var(--content-on-black);
}
.btn-outline-black:not(:disabled):active, .btn-outline-black:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-black);
  color: var(--content-on-black);
}
.btn-outline-black:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-black);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-black) 50%, transparent);
}
.btn-outline-black:disabled {
  background-color: var(--button-outline-disabled-background-color);
  border-color: var(--button-outline-disabled-border-color);
  color: var(--button-outline-disabled-color);
  opacity: 0.5;
}

.btn-outline-primary-ghost {
  background-color: var(--button-outline-background-color);
  color: var(--color-primary-ghost);
  border-color: var(--color-primary-ghost);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}
.btn-outline-primary-ghost:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--color-primary-ghost);
  color: var(--content-on-primary-ghost);
}
.btn-outline-primary-ghost:not(:disabled):active, .btn-outline-primary-ghost:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-primary-ghost);
  color: var(--content-on-primary-ghost);
}
.btn-outline-primary-ghost:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-primary-ghost);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-primary-ghost) 50%, transparent);
}
.btn-outline-primary-ghost:disabled {
  background-color: var(--button-outline-disabled-background-color);
  border-color: var(--button-outline-disabled-border-color);
  color: var(--button-outline-disabled-color);
  opacity: 0.5;
}

.btn-outline-secondary-ghost {
  background-color: var(--button-outline-background-color);
  color: var(--color-secondary-ghost);
  border-color: var(--color-secondary-ghost);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}
.btn-outline-secondary-ghost:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--color-secondary-ghost);
  color: var(--content-on-secondary-ghost);
}
.btn-outline-secondary-ghost:not(:disabled):active, .btn-outline-secondary-ghost:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-secondary-ghost);
  color: var(--content-on-secondary-ghost);
}
.btn-outline-secondary-ghost:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-secondary-ghost);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-secondary-ghost) 50%, transparent);
}
.btn-outline-secondary-ghost:disabled {
  background-color: var(--button-outline-disabled-background-color);
  border-color: var(--button-outline-disabled-border-color);
  color: var(--button-outline-disabled-color);
  opacity: 0.5;
}

.btn-outline-tertiary-ghost {
  background-color: var(--button-outline-background-color);
  color: var(--color-tertiary-ghost);
  border-color: var(--color-tertiary-ghost);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}
.btn-outline-tertiary-ghost:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--color-tertiary-ghost);
  color: var(--content-on-tertiary-ghost);
}
.btn-outline-tertiary-ghost:not(:disabled):active, .btn-outline-tertiary-ghost:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-tertiary-ghost);
  color: var(--content-on-tertiary-ghost);
}
.btn-outline-tertiary-ghost:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-tertiary-ghost);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-tertiary-ghost) 50%, transparent);
}
.btn-outline-tertiary-ghost:disabled {
  background-color: var(--button-outline-disabled-background-color);
  border-color: var(--button-outline-disabled-border-color);
  color: var(--button-outline-disabled-color);
  opacity: 0.5;
}

.btn-outline-success-ghost {
  background-color: var(--button-outline-background-color);
  color: var(--color-success-ghost);
  border-color: var(--color-success-ghost);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}
.btn-outline-success-ghost:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--color-success-ghost);
  color: var(--content-on-success-ghost);
}
.btn-outline-success-ghost:not(:disabled):active, .btn-outline-success-ghost:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-success-ghost);
  color: var(--content-on-success-ghost);
}
.btn-outline-success-ghost:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-success-ghost);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-success-ghost) 50%, transparent);
}
.btn-outline-success-ghost:disabled {
  background-color: var(--button-outline-disabled-background-color);
  border-color: var(--button-outline-disabled-border-color);
  color: var(--button-outline-disabled-color);
  opacity: 0.5;
}

.btn-outline-info-ghost {
  background-color: var(--button-outline-background-color);
  color: var(--color-info-ghost);
  border-color: var(--color-info-ghost);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}
.btn-outline-info-ghost:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--color-info-ghost);
  color: var(--content-on-info-ghost);
}
.btn-outline-info-ghost:not(:disabled):active, .btn-outline-info-ghost:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-info-ghost);
  color: var(--content-on-info-ghost);
}
.btn-outline-info-ghost:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-info-ghost);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-info-ghost) 50%, transparent);
}
.btn-outline-info-ghost:disabled {
  background-color: var(--button-outline-disabled-background-color);
  border-color: var(--button-outline-disabled-border-color);
  color: var(--button-outline-disabled-color);
  opacity: 0.5;
}

.btn-outline-warning-ghost {
  background-color: var(--button-outline-background-color);
  color: var(--color-warning-ghost);
  border-color: var(--color-warning-ghost);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}
.btn-outline-warning-ghost:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--color-warning-ghost);
  color: var(--content-on-warning-ghost);
}
.btn-outline-warning-ghost:not(:disabled):active, .btn-outline-warning-ghost:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-warning-ghost);
  color: var(--content-on-warning-ghost);
}
.btn-outline-warning-ghost:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-warning-ghost);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-warning-ghost) 50%, transparent);
}
.btn-outline-warning-ghost:disabled {
  background-color: var(--button-outline-disabled-background-color);
  border-color: var(--button-outline-disabled-border-color);
  color: var(--button-outline-disabled-color);
  opacity: 0.5;
}

.btn-outline-danger-ghost {
  background-color: var(--button-outline-background-color);
  color: var(--color-danger-ghost);
  border-color: var(--color-danger-ghost);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}
.btn-outline-danger-ghost:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--color-danger-ghost);
  color: var(--content-on-danger-ghost);
}
.btn-outline-danger-ghost:not(:disabled):active, .btn-outline-danger-ghost:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-danger-ghost);
  color: var(--content-on-danger-ghost);
}
.btn-outline-danger-ghost:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-danger-ghost);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-danger-ghost) 50%, transparent);
}
.btn-outline-danger-ghost:disabled {
  background-color: var(--button-outline-disabled-background-color);
  border-color: var(--button-outline-disabled-border-color);
  color: var(--button-outline-disabled-color);
  opacity: 0.5;
}

.btn-outline-neutral-ghost {
  background-color: var(--button-outline-background-color);
  color: var(--color-neutral-ghost);
  border-color: var(--color-neutral-ghost);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}
.btn-outline-neutral-ghost:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--color-neutral-ghost);
  color: var(--content-on-neutral-ghost);
}
.btn-outline-neutral-ghost:not(:disabled):active, .btn-outline-neutral-ghost:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-neutral-ghost);
  color: var(--content-on-neutral-ghost);
}
.btn-outline-neutral-ghost:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-neutral-ghost);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-neutral-ghost) 50%, transparent);
}
.btn-outline-neutral-ghost:disabled {
  background-color: var(--button-outline-disabled-background-color);
  border-color: var(--button-outline-disabled-border-color);
  color: var(--button-outline-disabled-color);
  opacity: 0.5;
}

.btn-outline-light-ghost {
  background-color: var(--button-outline-background-color);
  color: var(--color-light-ghost);
  border-color: var(--color-light-ghost);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}
.btn-outline-light-ghost:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--color-light-ghost);
  color: var(--content-on-light-ghost);
}
.btn-outline-light-ghost:not(:disabled):active, .btn-outline-light-ghost:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-light-ghost);
  color: var(--content-on-light-ghost);
}
.btn-outline-light-ghost:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-light-ghost);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-light-ghost) 50%, transparent);
}
.btn-outline-light-ghost:disabled {
  background-color: var(--button-outline-disabled-background-color);
  border-color: var(--button-outline-disabled-border-color);
  color: var(--button-outline-disabled-color);
  opacity: 0.5;
}

.btn-outline-dark-ghost {
  background-color: var(--button-outline-background-color);
  color: var(--color-dark-ghost);
  border-color: var(--color-dark-ghost);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}
.btn-outline-dark-ghost:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--color-dark-ghost);
  color: var(--content-on-dark-ghost);
}
.btn-outline-dark-ghost:not(:disabled):active, .btn-outline-dark-ghost:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-dark-ghost);
  color: var(--content-on-dark-ghost);
}
.btn-outline-dark-ghost:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-dark-ghost);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-dark-ghost) 50%, transparent);
}
.btn-outline-dark-ghost:disabled {
  background-color: var(--button-outline-disabled-background-color);
  border-color: var(--button-outline-disabled-border-color);
  color: var(--button-outline-disabled-color);
  opacity: 0.5;
}

.btn-outline-white-ghost {
  background-color: var(--button-outline-background-color);
  color: var(--color-white-ghost);
  border-color: var(--color-white-ghost);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}
.btn-outline-white-ghost:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--color-white-ghost);
  color: var(--content-on-white-ghost);
}
.btn-outline-white-ghost:not(:disabled):active, .btn-outline-white-ghost:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-white-ghost);
  color: var(--content-on-white-ghost);
}
.btn-outline-white-ghost:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-white-ghost);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-white-ghost) 50%, transparent);
}
.btn-outline-white-ghost:disabled {
  background-color: var(--button-outline-disabled-background-color);
  border-color: var(--button-outline-disabled-border-color);
  color: var(--button-outline-disabled-color);
  opacity: 0.5;
}

.btn-outline-black-ghost {
  background-color: var(--button-outline-background-color);
  color: var(--color-black-ghost);
  border-color: var(--color-black-ghost);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}
.btn-outline-black-ghost:not(:disabled):hover {
  border-color: var(--color-transparent);
  background-color: var(--color-black-ghost);
  color: var(--content-on-black-ghost);
}
.btn-outline-black-ghost:not(:disabled):active, .btn-outline-black-ghost:not(:disabled).active {
  border-color: var(--color-transparent);
  background-color: var(--active-black-ghost);
  color: var(--content-on-black-ghost);
}
.btn-outline-black-ghost:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-black-ghost);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-black-ghost) 50%, transparent);
}
.btn-outline-black-ghost:disabled {
  background-color: var(--button-outline-disabled-background-color);
  border-color: var(--button-outline-disabled-border-color);
  color: var(--button-outline-disabled-color);
  opacity: 0.5;
}

.card-container {
  display: flex;
  flex-wrap: wrap;
  gap: var(--card-group-gap);
  justify-content: center;
}

.card-container > .card {
  flex: 1 1 var(--card-min-width);
  width: 100%;
}

.card {
  display: flex;
  flex-direction: column;
  overflow: clip;
  border-radius: var(--card-border-radius);
  border-color: var(--card-border-color);
  border-style: var(--card-border-style);
  border-width: var(--card-border-width);
  background-color: var(--card-background-color);
}

.card-header {
  padding-inline: var(--card-header-padding-x);
  padding-block: var(--card-header-padding-y);
}

.card-body {
  flex: 1 1 auto;
  padding-inline: var(--card-body-padding-x);
  padding-block: var(--card-body-padding-y);
}

.card-footer {
  padding-inline: var(--card-footer-padding-x);
  padding-block: var(--card-footer-padding-y);
}

.card-primary {
  background-color: var(--color-primary);
  border-color: var(--color-primary);
  color: var(--content-on-primary);
}

.card-secondary {
  background-color: var(--color-secondary);
  border-color: var(--color-secondary);
  color: var(--content-on-secondary);
}

.card-tertiary {
  background-color: var(--color-tertiary);
  border-color: var(--color-tertiary);
  color: var(--content-on-tertiary);
}

.card-success {
  background-color: var(--color-success);
  border-color: var(--color-success);
  color: var(--content-on-success);
}

.card-info {
  background-color: var(--color-info);
  border-color: var(--color-info);
  color: var(--content-on-info);
}

.card-warning {
  background-color: var(--color-warning);
  border-color: var(--color-warning);
  color: var(--content-on-warning);
}

.card-danger {
  background-color: var(--color-danger);
  border-color: var(--color-danger);
  color: var(--content-on-danger);
}

.card-neutral {
  background-color: var(--color-neutral);
  border-color: var(--color-neutral);
  color: var(--content-on-neutral);
}

.card-light {
  background-color: var(--color-light);
  border-color: var(--color-light);
  color: var(--content-on-light);
}

.card-dark {
  background-color: var(--color-dark);
  border-color: var(--color-dark);
  color: var(--content-on-dark);
}

.card-white {
  background-color: var(--color-white);
  border-color: var(--color-white);
  color: var(--content-on-white);
}

.card-black {
  background-color: var(--color-black);
  border-color: var(--color-black);
  color: var(--content-on-black);
}

.card-primary-ghost {
  background-color: var(--color-primary-ghost);
  border-color: var(--color-primary-ghost);
  color: var(--content-on-primary-ghost);
}

.card-secondary-ghost {
  background-color: var(--color-secondary-ghost);
  border-color: var(--color-secondary-ghost);
  color: var(--content-on-secondary-ghost);
}

.card-tertiary-ghost {
  background-color: var(--color-tertiary-ghost);
  border-color: var(--color-tertiary-ghost);
  color: var(--content-on-tertiary-ghost);
}

.card-success-ghost {
  background-color: var(--color-success-ghost);
  border-color: var(--color-success-ghost);
  color: var(--content-on-success-ghost);
}

.card-info-ghost {
  background-color: var(--color-info-ghost);
  border-color: var(--color-info-ghost);
  color: var(--content-on-info-ghost);
}

.card-warning-ghost {
  background-color: var(--color-warning-ghost);
  border-color: var(--color-warning-ghost);
  color: var(--content-on-warning-ghost);
}

.card-danger-ghost {
  background-color: var(--color-danger-ghost);
  border-color: var(--color-danger-ghost);
  color: var(--content-on-danger-ghost);
}

.card-neutral-ghost {
  background-color: var(--color-neutral-ghost);
  border-color: var(--color-neutral-ghost);
  color: var(--content-on-neutral-ghost);
}

.card-light-ghost {
  background-color: var(--color-light-ghost);
  border-color: var(--color-light-ghost);
  color: var(--content-on-light-ghost);
}

.card-dark-ghost {
  background-color: var(--color-dark-ghost);
  border-color: var(--color-dark-ghost);
  color: var(--content-on-dark-ghost);
}

.card-white-ghost {
  background-color: var(--color-white-ghost);
  border-color: var(--color-white-ghost);
  color: var(--content-on-white-ghost);
}

.card-black-ghost {
  background-color: var(--color-black-ghost);
  border-color: var(--color-black-ghost);
  color: var(--content-on-black-ghost);
}

.collapse-item {
  border-color: var(--collapse-border-color);
  border-style: var(--collapse-border-style);
  border-width: var(--collapse-border-width);
  border-radius: var(--collapse-border-radius);
  background-color: var(--collapse-background-color);
  overflow: clip;
}

.collapse-btn {
  align-items: center;
  width: 100%;
  display: inline-flex;
  border: none;
  line-height: normal;
  border-bottom: var(--collapse-border-width) var(--collapse-border-style) var(--collapse-border-color);
  padding-inline: var(--collapse-button-padding-x);
  padding-block: var(--collapse-button-padding-y);
  background-color: var(--collapse-button-background-color);
}
.collapse-btn[aria-expanded=false] {
  border-bottom: none;
}

.collapse-btn-sm {
  padding-inline: var(--collapse-button-padding-x-sm);
  padding-block: var(--collapse-button-padding-y-sm);
}

.collapse-btn-md {
  padding-inline: var(--collapse-button-padding-x-md);
  padding-block: var(--collapse-button-padding-y-md);
}

.collapse-btn-lg {
  padding-inline: var(--collapse-button-padding-x-lg);
  padding-block: var(--collapse-button-padding-y-lg);
}

.collapse-body {
  padding-inline: var(--collapse-body-padding-x);
  padding-block: var(--collapse-body-padding-y);
}

.collapse-indicator::after {
  content: var(--collapse-indicator-content);
  display: inline-block;
  transition: transform 0.2s ease;
}

.collapse-btn.is-open .collapse-indicator::after {
  content: var(--collapse-indicator-content);
  transform: rotate(135deg);
}

body:has(dialog[open]) {
  overflow: hidden;
}

.dialog {
  flex-direction: column;
  position: fixed;
  top: 50%;
  left: 50%;
  overflow: clip;
  transform: translate(-50%, -50%);
  width: var(--dialog-width);
  max-height: var(--dialog-max-height);
  border-color: var(--dialog-border-color);
  border-style: var(--dialog-border-style);
  border-width: var(--dialog-border-width);
  border-radius: var(--dialog-border-radius);
  background: var(--dialog-background-color);
  transition: opacity 0.2s ease, transform 0.2s ease;
}
.dialog::backdrop {
  background: var(--color-transparent);
  transition: background 0.2s ease;
}
.dialog[open] {
  display: flex;
  opacity: 0;
  transform: translate(-50%, -50%) scale(0);
}
.dialog.show {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}
.dialog.show::backdrop {
  background: var(--dialog-backdrop-background);
}

.dialog-sm {
  width: var(--dialog-width-sm);
  max-height: var(--dialog-max-height-sm);
}

.dialog-md {
  width: var(--dialog-width-md);
  max-height: var(--dialog-max-height-md);
}

.dialog-lg {
  width: var(--dialog-width-lg);
  max-height: var(--dialog-max-height-lg);
}

.dialog-header {
  padding-inline: var(--dialog-header-padding-x);
  padding-block: var(--dialog-header-padding-y);
}

.dialog-body {
  flex: 1 1 auto;
  overflow-y: auto;
  padding-inline: var(--dialog-body-padding-x);
  padding-block: var(--dialog-body-padding-y);
}

.dialog-footer {
  padding-inline: var(--dialog-footer-padding-x);
  padding-block: var(--dialog-footer-padding-y);
}

.dialog-primary {
  background-color: var(--color-primary);
  border-color: var(--color-primary);
  color: var(--content-on-primary);
}

.dialog-secondary {
  background-color: var(--color-secondary);
  border-color: var(--color-secondary);
  color: var(--content-on-secondary);
}

.dialog-tertiary {
  background-color: var(--color-tertiary);
  border-color: var(--color-tertiary);
  color: var(--content-on-tertiary);
}

.dialog-success {
  background-color: var(--color-success);
  border-color: var(--color-success);
  color: var(--content-on-success);
}

.dialog-info {
  background-color: var(--color-info);
  border-color: var(--color-info);
  color: var(--content-on-info);
}

.dialog-warning {
  background-color: var(--color-warning);
  border-color: var(--color-warning);
  color: var(--content-on-warning);
}

.dialog-danger {
  background-color: var(--color-danger);
  border-color: var(--color-danger);
  color: var(--content-on-danger);
}

.dialog-neutral {
  background-color: var(--color-neutral);
  border-color: var(--color-neutral);
  color: var(--content-on-neutral);
}

.dialog-light {
  background-color: var(--color-light);
  border-color: var(--color-light);
  color: var(--content-on-light);
}

.dialog-dark {
  background-color: var(--color-dark);
  border-color: var(--color-dark);
  color: var(--content-on-dark);
}

.dialog-white {
  background-color: var(--color-white);
  border-color: var(--color-white);
  color: var(--content-on-white);
}

.dialog-black {
  background-color: var(--color-black);
  border-color: var(--color-black);
  color: var(--content-on-black);
}

.dialog-primary-ghost {
  background-color: var(--color-primary-ghost);
  border-color: var(--color-primary-ghost);
  color: var(--content-on-primary-ghost);
}

.dialog-secondary-ghost {
  background-color: var(--color-secondary-ghost);
  border-color: var(--color-secondary-ghost);
  color: var(--content-on-secondary-ghost);
}

.dialog-tertiary-ghost {
  background-color: var(--color-tertiary-ghost);
  border-color: var(--color-tertiary-ghost);
  color: var(--content-on-tertiary-ghost);
}

.dialog-success-ghost {
  background-color: var(--color-success-ghost);
  border-color: var(--color-success-ghost);
  color: var(--content-on-success-ghost);
}

.dialog-info-ghost {
  background-color: var(--color-info-ghost);
  border-color: var(--color-info-ghost);
  color: var(--content-on-info-ghost);
}

.dialog-warning-ghost {
  background-color: var(--color-warning-ghost);
  border-color: var(--color-warning-ghost);
  color: var(--content-on-warning-ghost);
}

.dialog-danger-ghost {
  background-color: var(--color-danger-ghost);
  border-color: var(--color-danger-ghost);
  color: var(--content-on-danger-ghost);
}

.dialog-neutral-ghost {
  background-color: var(--color-neutral-ghost);
  border-color: var(--color-neutral-ghost);
  color: var(--content-on-neutral-ghost);
}

.dialog-light-ghost {
  background-color: var(--color-light-ghost);
  border-color: var(--color-light-ghost);
  color: var(--content-on-light-ghost);
}

.dialog-dark-ghost {
  background-color: var(--color-dark-ghost);
  border-color: var(--color-dark-ghost);
  color: var(--content-on-dark-ghost);
}

.dialog-white-ghost {
  background-color: var(--color-white-ghost);
  border-color: var(--color-white-ghost);
  color: var(--content-on-white-ghost);
}

.dialog-black-ghost {
  background-color: var(--color-black-ghost);
  border-color: var(--color-black-ghost);
  color: var(--content-on-black-ghost);
}

.dropdown {
  position: relative;
  display: inline-flex;
}

.dropdown-body {
  background-color: var(--dropdown-body-background-color);
  border-radius: var(--dropdown-body-border-radius);
  border-color: var(--dropdown-body-border-color);
  border-style: var(--dropdown-body-border-style);
  border-width: var(--dropdown-body-border-width);
  max-width: 100vw;
  position: fixed;
  z-index: 1000;
  transition: opacity 0.1s ease;
}
.dropdown-body.show {
  opacity: 1;
}
.dropdown-body.hide {
  opacity: 0;
}

.form-control {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--form-control-gap);
}
.form-control label:has(input),
.form-control label:has(select),
.form-control label:has(textarea) {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--form-control-gap);
}
.form-control input[type=button],
.form-control input[type=reset],
.form-control input[type=submit],
.form-control input[type=file],
.form-control input[type=number],
.form-control input[type=color],
.form-control input[type=date],
.form-control input[type=datetime-local],
.form-control input[type=email],
.form-control input[type=month],
.form-control input[type=password],
.form-control input[type=search],
.form-control input[type=tel],
.form-control input[type=text],
.form-control input[type=time],
.form-control input[type=url],
.form-control input[type=week],
.form-control input[type=image],
.form-control select {
  height: var(--input-height);
}
.form-control input[type=date],
.form-control input[type=datetime-local],
.form-control input[type=email],
.form-control input[type=month],
.form-control input[type=password],
.form-control input[type=search],
.form-control input[type=tel],
.form-control input[type=text],
.form-control input[type=time],
.form-control input[type=url],
.form-control input[type=week],
.form-control select {
  width: 100%;
  background-color: var(--input-background-color);
  border-radius: var(--input-border-radius);
  border-color: var(--input-border-color);
  border-style: var(--input-border-style);
  border-width: var(--input-border-width);
  padding-block: var(--input-padding-y);
  padding-inline: var(--input-padding-x);
}
.form-control input[type=date]:focus,
.form-control input[type=datetime-local]:focus,
.form-control input[type=email]:focus,
.form-control input[type=month]:focus,
.form-control input[type=password]:focus,
.form-control input[type=search]:focus,
.form-control input[type=tel]:focus,
.form-control input[type=text]:focus,
.form-control input[type=time]:focus,
.form-control input[type=url]:focus,
.form-control input[type=week]:focus,
.form-control select:focus {
  outline: none;
  border-color: var(--input-border-focus-color);
  box-shadow: var(--input-box-shadow-focus);
}
.form-control input[type=button],
.form-control input[type=reset],
.form-control input[type=submit] {
  border-radius: var(--input-border-radius);
  border-color: var(--input-border-color);
  border-style: var(--input-border-style);
  border-width: var(--input-border-width);
  padding-block: var(--input-padding-y);
  padding-inline: var(--input-padding-x);
}
.form-control input[type=button]:focus,
.form-control input[type=reset]:focus,
.form-control input[type=submit]:focus {
  outline: none;
  border-color: var(--input-border-focus-color);
  box-shadow: var(--input-box-shadow-focus);
}
.form-control input[type=image] {
  border-radius: var(--input-border-radius);
  overflow: clip;
}
.form-control input[type=image]:focus {
  outline: none;
  border-color: var(--input-border-focus-color);
  box-shadow: var(--input-box-shadow-focus);
}
.form-control input[type=range] {
  width: 100%;
}
.form-control input[type=range],
.form-control input[type=radio],
.form-control input[type=checkbox] {
  accent-color: var(--input-accent-color);
}
.form-control input[type=range]:focus,
.form-control input[type=radio]:focus,
.form-control input[type=checkbox]:focus {
  outline: none;
  border-color: var(--input-border-focus-color);
  box-shadow: var(--input-box-shadow-focus);
}
.form-control input[type=file] {
  width: 100%;
  background-color: var(--input-background-color);
  border-radius: var(--input-border-radius);
  border-color: var(--input-border-color);
  border-style: var(--input-border-style);
  border-width: var(--input-border-width);
}
.form-control input[type=file]:focus {
  outline: none;
  border-color: var(--input-border-focus-color);
  box-shadow: var(--input-box-shadow-focus);
}
.form-control input[type=file]::file-selector-button {
  background-color: var(--input-accent-color);
  color: var(--input-content-on-accent-color);
  padding-inline: var(--input-padding-x);
  padding-block: var(--input-padding-y);
  margin-right: var(--input-padding-x);
  height: 100%;
  border: none;
  display: inline-flex;
  align-items: center;
}
.form-control input[type=file]::-webkit-file-upload-button {
  height: 100%;
  display: inline-flex;
  align-items: center;
}
.form-control input[type=number] {
  width: 100%;
  background-color: var(--input-background-color);
  border-radius: var(--input-border-radius);
  border-color: var(--input-border-color);
  border-style: var(--input-border-style);
  border-width: var(--input-border-width);
  padding-block: var(--input-padding-y);
  padding-left: var(--input-padding-x);
}
.form-control input[type=number]:focus {
  outline: none;
  border-color: var(--input-border-focus-color);
  box-shadow: var(--input-box-shadow-focus);
}
.form-control select {
  appearance: none;
  -webkit-appearance: none;
  background-image: var(--input-icon-select-arrow-svg);
  background-repeat: no-repeat;
  background-position: right var(--input-padding-x) center;
  background-size: 1.5rem;
}
.form-control select:focus {
  outline: none;
  border-color: var(--input-border-focus-color);
  box-shadow: var(--input-box-shadow-focus);
}
.form-control textarea {
  height: auto;
  resize: vertical;
  width: 100%;
  background-color: var(--input-background-color);
  border-radius: var(--input-border-radius);
  border-color: var(--input-border-color);
  border-style: var(--input-border-style);
  border-width: var(--input-border-width);
  padding-block: var(--textarea-padding-y);
  padding-inline: var(--textarea-padding-x);
}
.form-control textarea:focus {
  outline: none;
  border-color: var(--input-border-focus-color);
  box-shadow: var(--input-box-shadow-focus);
}
.form-control input[type=color] {
  border-color: var(--input-border-color);
  border-style: var(--input-border-style);
  border-width: var(--input-border-width);
  border-radius: var(--input-border-radius);
}
.form-control input[type=color]:focus {
  outline: none;
  border-color: var(--input-border-focus-color);
  box-shadow: var(--input-box-shadow-focus);
}
.form-control input[type=checkbox][role=switch] {
  appearance: none;
  -webkit-appearance: none;
  width: calc(var(--input-switch-height) * 2);
  height: var(--input-switch-height);
  border-radius: 50rem;
  border-color: var(--input-border-color);
  border-style: var(--input-border-style);
  border-width: var(--input-border-width);
  background-color: var(--input-background-color);
  background-image: var(--input-icon-switch-svg-before);
  background-repeat: no-repeat;
  background-position: left center;
  background-size: var(--input-switch-height);
  transition: background-color 0.1s, background-position 0.1s ease;
}
.form-control input[type=checkbox][role=switch]:checked {
  background-color: var(--input-accent-color);
  border-color: var(--input-accent-color);
  background-position: right center;
  background-image: var(--input-icon-switch-svg-after);
}
.form-control input[type=checkbox][role=switch]:focus-visible {
  outline: none;
  box-shadow: var(--input-box-shadow-focus);
}
.form-control input:disabled,
.form-control select:disabled,
.form-control textarea:disabled {
  color: var(--input-disabled-color);
  -webkit-text-fill-color: var(--input-disabled-color);
  background-color: var(--input-disabled-background-color);
  opacity: 0.5;
}

.validated input[type=checkbox][role=switch][aria-invalid=true], .validated input[type=checkbox][role=switch]:invalid {
  background-color: var(--input-accent-color-invalid);
  border-color: var(--input-accent-color-invalid);
}
.validated input[type=file][aria-invalid=true]::file-selector-button, .validated input[type=file]:invalid::file-selector-button {
  background-color: var(--input-accent-color-invalid);
  color: var(--input-content-on-accent-color-invalid);
}
.validated input[aria-invalid=true], .validated input:invalid,
.validated select[aria-invalid=true],
.validated select:invalid,
.validated textarea[aria-invalid=true],
.validated textarea:invalid {
  accent-color: var(--input-accent-color-invalid);
  border-color: var(--input-accent-color-invalid);
  box-shadow: var(--input-box-shadow-focus-invalid);
}
.validated input[aria-invalid=true]:focus, .validated input:invalid:focus,
.validated select[aria-invalid=true]:focus,
.validated select:invalid:focus,
.validated textarea[aria-invalid=true]:focus,
.validated textarea:invalid:focus {
  accent-color: var(--input-accent-color-invalid);
  border-color: var(--input-accent-color-invalid);
  box-shadow: var(--input-box-shadow-focus-invalid);
}

.form-control-sm input[type=button],
.form-control-sm input[type=reset],
.form-control-sm input[type=submit],
.form-control-sm input[type=file],
.form-control-sm input[type=number],
.form-control-sm input[type=color],
.form-control-sm input[type=date],
.form-control-sm input[type=datetime-local],
.form-control-sm input[type=email],
.form-control-sm input[type=month],
.form-control-sm input[type=password],
.form-control-sm input[type=search],
.form-control-sm input[type=tel],
.form-control-sm input[type=text],
.form-control-sm input[type=time],
.form-control-sm input[type=url],
.form-control-sm input[type=week],
.form-control-sm input[type=image],
.form-control-sm select {
  height: var(--input-height-sm);
}
.form-control-sm input[type=checkbox][role=switch] {
  width: calc(var(--input-switch-height-sm) * 2);
  height: var(--input-switch-height-sm);
  background-size: var(--input-switch-height-sm);
}
.form-control-sm input[type=range],
.form-control-sm input[type=checkbox]:not([role=switch]),
.form-control-sm input[type=radio] {
  zoom: 0.9;
}

.form-control-md input[type=button],
.form-control-md input[type=reset],
.form-control-md input[type=submit],
.form-control-md input[type=file],
.form-control-md input[type=number],
.form-control-md input[type=color],
.form-control-md input[type=date],
.form-control-md input[type=datetime-local],
.form-control-md input[type=email],
.form-control-md input[type=month],
.form-control-md input[type=password],
.form-control-md input[type=search],
.form-control-md input[type=tel],
.form-control-md input[type=text],
.form-control-md input[type=time],
.form-control-md input[type=url],
.form-control-md input[type=week],
.form-control-md input[type=image],
.form-control-md select {
  height: var(--input-height-md);
}
.form-control-md input[type=checkbox][role=switch] {
  width: calc(var(--input-switch-height-md) * 2);
  height: var(--input-switch-height-md);
  background-size: var(--input-switch-height-md);
}

.form-control-lg input[type=button],
.form-control-lg input[type=reset],
.form-control-lg input[type=submit],
.form-control-lg input[type=file],
.form-control-lg input[type=number],
.form-control-lg input[type=color],
.form-control-lg input[type=date],
.form-control-lg input[type=datetime-local],
.form-control-lg input[type=email],
.form-control-lg input[type=month],
.form-control-lg input[type=password],
.form-control-lg input[type=search],
.form-control-lg input[type=tel],
.form-control-lg input[type=text],
.form-control-lg input[type=time],
.form-control-lg input[type=url],
.form-control-lg input[type=week],
.form-control-lg input[type=image],
.form-control-lg select {
  height: var(--input-height-lg);
}
.form-control-lg input[type=checkbox][role=switch] {
  width: calc(var(--input-switch-height-lg) * 2);
  height: var(--input-switch-height-lg);
  background-size: var(--input-switch-height-lg);
}
.form-control-lg input[type=range],
.form-control-lg input[type=checkbox]:not([role=switch]),
.form-control-lg input[type=radio] {
  zoom: 1.5;
}

.link {
  padding-block: var(--link-padding-y);
  padding-inline: var(--link-padding-x);
  border-radius: var(--link-border-radius);
  border-style: var(--link-border-style);
  border-width: var(--link-border-width);
  border-color: var(--color-transparent);
  background-color: var(--color-transparent);
  text-decoration: underline;
  color: var(--text-color);
  text-decoration-color: var(--text-color);
}
.link:not(:disabled):hover {
  background-color: var(--color-transparent);
  color: var(--hover-defaut);
  text-decoration-color: var(--hover-defaut);
}
.link:not(:disabled):active, .link:not(:disabled).active {
  background-color: var(--color-transparent);
  color: var(--active-defaut);
  text-decoration-color: var(--active-defaut);
}
.link:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--text-color);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--text-color) 50%, transparent);
}
.link:disabled {
  background-color: var(--color-transparent);
  border-color: var(--color-transparent);
  text-decoration-color: var(--link-disabled-color);
  color: var(--link-disabled-color);
  opacity: 0.5;
}

.link-primary {
  padding-block: var(--link-padding-y);
  padding-inline: var(--link-padding-x);
  border-radius: var(--link-border-radius);
  border-style: var(--link-border-style);
  border-width: var(--link-border-width);
  border-color: var(--color-transparent);
  background-color: var(--color-transparent);
  text-decoration: underline;
  color: var(--color-primary);
  text-decoration-color: var(--color-primary);
}
.link-primary:not(:disabled):hover {
  background-color: var(--color-transparent);
  color: var(--hover-primary);
  text-decoration-color: var(--hover-primary);
}
.link-primary:not(:disabled):active, .link-primary:not(:disabled).active {
  background-color: var(--color-transparent);
  color: var(--active-primary);
  text-decoration-color: var(--active-primary);
}
.link-primary:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-primary);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-primary) 50%, transparent);
}
.link-primary:disabled {
  background-color: var(--color-transparent);
  border-color: var(--color-transparent);
  text-decoration-color: var(--link-disabled-color);
  color: var(--link-disabled-color);
  opacity: 0.5;
}

.link-secondary {
  padding-block: var(--link-padding-y);
  padding-inline: var(--link-padding-x);
  border-radius: var(--link-border-radius);
  border-style: var(--link-border-style);
  border-width: var(--link-border-width);
  border-color: var(--color-transparent);
  background-color: var(--color-transparent);
  text-decoration: underline;
  color: var(--color-secondary);
  text-decoration-color: var(--color-secondary);
}
.link-secondary:not(:disabled):hover {
  background-color: var(--color-transparent);
  color: var(--hover-secondary);
  text-decoration-color: var(--hover-secondary);
}
.link-secondary:not(:disabled):active, .link-secondary:not(:disabled).active {
  background-color: var(--color-transparent);
  color: var(--active-secondary);
  text-decoration-color: var(--active-secondary);
}
.link-secondary:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-secondary);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-secondary) 50%, transparent);
}
.link-secondary:disabled {
  background-color: var(--color-transparent);
  border-color: var(--color-transparent);
  text-decoration-color: var(--link-disabled-color);
  color: var(--link-disabled-color);
  opacity: 0.5;
}

.link-tertiary {
  padding-block: var(--link-padding-y);
  padding-inline: var(--link-padding-x);
  border-radius: var(--link-border-radius);
  border-style: var(--link-border-style);
  border-width: var(--link-border-width);
  border-color: var(--color-transparent);
  background-color: var(--color-transparent);
  text-decoration: underline;
  color: var(--color-tertiary);
  text-decoration-color: var(--color-tertiary);
}
.link-tertiary:not(:disabled):hover {
  background-color: var(--color-transparent);
  color: var(--hover-tertiary);
  text-decoration-color: var(--hover-tertiary);
}
.link-tertiary:not(:disabled):active, .link-tertiary:not(:disabled).active {
  background-color: var(--color-transparent);
  color: var(--active-tertiary);
  text-decoration-color: var(--active-tertiary);
}
.link-tertiary:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-tertiary);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-tertiary) 50%, transparent);
}
.link-tertiary:disabled {
  background-color: var(--color-transparent);
  border-color: var(--color-transparent);
  text-decoration-color: var(--link-disabled-color);
  color: var(--link-disabled-color);
  opacity: 0.5;
}

.link-success {
  padding-block: var(--link-padding-y);
  padding-inline: var(--link-padding-x);
  border-radius: var(--link-border-radius);
  border-style: var(--link-border-style);
  border-width: var(--link-border-width);
  border-color: var(--color-transparent);
  background-color: var(--color-transparent);
  text-decoration: underline;
  color: var(--color-success);
  text-decoration-color: var(--color-success);
}
.link-success:not(:disabled):hover {
  background-color: var(--color-transparent);
  color: var(--hover-success);
  text-decoration-color: var(--hover-success);
}
.link-success:not(:disabled):active, .link-success:not(:disabled).active {
  background-color: var(--color-transparent);
  color: var(--active-success);
  text-decoration-color: var(--active-success);
}
.link-success:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-success);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-success) 50%, transparent);
}
.link-success:disabled {
  background-color: var(--color-transparent);
  border-color: var(--color-transparent);
  text-decoration-color: var(--link-disabled-color);
  color: var(--link-disabled-color);
  opacity: 0.5;
}

.link-info {
  padding-block: var(--link-padding-y);
  padding-inline: var(--link-padding-x);
  border-radius: var(--link-border-radius);
  border-style: var(--link-border-style);
  border-width: var(--link-border-width);
  border-color: var(--color-transparent);
  background-color: var(--color-transparent);
  text-decoration: underline;
  color: var(--color-info);
  text-decoration-color: var(--color-info);
}
.link-info:not(:disabled):hover {
  background-color: var(--color-transparent);
  color: var(--hover-info);
  text-decoration-color: var(--hover-info);
}
.link-info:not(:disabled):active, .link-info:not(:disabled).active {
  background-color: var(--color-transparent);
  color: var(--active-info);
  text-decoration-color: var(--active-info);
}
.link-info:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-info);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-info) 50%, transparent);
}
.link-info:disabled {
  background-color: var(--color-transparent);
  border-color: var(--color-transparent);
  text-decoration-color: var(--link-disabled-color);
  color: var(--link-disabled-color);
  opacity: 0.5;
}

.link-warning {
  padding-block: var(--link-padding-y);
  padding-inline: var(--link-padding-x);
  border-radius: var(--link-border-radius);
  border-style: var(--link-border-style);
  border-width: var(--link-border-width);
  border-color: var(--color-transparent);
  background-color: var(--color-transparent);
  text-decoration: underline;
  color: var(--color-warning);
  text-decoration-color: var(--color-warning);
}
.link-warning:not(:disabled):hover {
  background-color: var(--color-transparent);
  color: var(--hover-warning);
  text-decoration-color: var(--hover-warning);
}
.link-warning:not(:disabled):active, .link-warning:not(:disabled).active {
  background-color: var(--color-transparent);
  color: var(--active-warning);
  text-decoration-color: var(--active-warning);
}
.link-warning:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-warning);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-warning) 50%, transparent);
}
.link-warning:disabled {
  background-color: var(--color-transparent);
  border-color: var(--color-transparent);
  text-decoration-color: var(--link-disabled-color);
  color: var(--link-disabled-color);
  opacity: 0.5;
}

.link-danger {
  padding-block: var(--link-padding-y);
  padding-inline: var(--link-padding-x);
  border-radius: var(--link-border-radius);
  border-style: var(--link-border-style);
  border-width: var(--link-border-width);
  border-color: var(--color-transparent);
  background-color: var(--color-transparent);
  text-decoration: underline;
  color: var(--color-danger);
  text-decoration-color: var(--color-danger);
}
.link-danger:not(:disabled):hover {
  background-color: var(--color-transparent);
  color: var(--hover-danger);
  text-decoration-color: var(--hover-danger);
}
.link-danger:not(:disabled):active, .link-danger:not(:disabled).active {
  background-color: var(--color-transparent);
  color: var(--active-danger);
  text-decoration-color: var(--active-danger);
}
.link-danger:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-danger);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-danger) 50%, transparent);
}
.link-danger:disabled {
  background-color: var(--color-transparent);
  border-color: var(--color-transparent);
  text-decoration-color: var(--link-disabled-color);
  color: var(--link-disabled-color);
  opacity: 0.5;
}

.link-neutral {
  padding-block: var(--link-padding-y);
  padding-inline: var(--link-padding-x);
  border-radius: var(--link-border-radius);
  border-style: var(--link-border-style);
  border-width: var(--link-border-width);
  border-color: var(--color-transparent);
  background-color: var(--color-transparent);
  text-decoration: underline;
  color: var(--color-neutral);
  text-decoration-color: var(--color-neutral);
}
.link-neutral:not(:disabled):hover {
  background-color: var(--color-transparent);
  color: var(--hover-neutral);
  text-decoration-color: var(--hover-neutral);
}
.link-neutral:not(:disabled):active, .link-neutral:not(:disabled).active {
  background-color: var(--color-transparent);
  color: var(--active-neutral);
  text-decoration-color: var(--active-neutral);
}
.link-neutral:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-neutral);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-neutral) 50%, transparent);
}
.link-neutral:disabled {
  background-color: var(--color-transparent);
  border-color: var(--color-transparent);
  text-decoration-color: var(--link-disabled-color);
  color: var(--link-disabled-color);
  opacity: 0.5;
}

.link-light {
  padding-block: var(--link-padding-y);
  padding-inline: var(--link-padding-x);
  border-radius: var(--link-border-radius);
  border-style: var(--link-border-style);
  border-width: var(--link-border-width);
  border-color: var(--color-transparent);
  background-color: var(--color-transparent);
  text-decoration: underline;
  color: var(--color-light);
  text-decoration-color: var(--color-light);
}
.link-light:not(:disabled):hover {
  background-color: var(--color-transparent);
  color: var(--hover-light);
  text-decoration-color: var(--hover-light);
}
.link-light:not(:disabled):active, .link-light:not(:disabled).active {
  background-color: var(--color-transparent);
  color: var(--active-light);
  text-decoration-color: var(--active-light);
}
.link-light:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-light);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-light) 50%, transparent);
}
.link-light:disabled {
  background-color: var(--color-transparent);
  border-color: var(--color-transparent);
  text-decoration-color: var(--link-disabled-color);
  color: var(--link-disabled-color);
  opacity: 0.5;
}

.link-dark {
  padding-block: var(--link-padding-y);
  padding-inline: var(--link-padding-x);
  border-radius: var(--link-border-radius);
  border-style: var(--link-border-style);
  border-width: var(--link-border-width);
  border-color: var(--color-transparent);
  background-color: var(--color-transparent);
  text-decoration: underline;
  color: var(--color-dark);
  text-decoration-color: var(--color-dark);
}
.link-dark:not(:disabled):hover {
  background-color: var(--color-transparent);
  color: var(--hover-dark);
  text-decoration-color: var(--hover-dark);
}
.link-dark:not(:disabled):active, .link-dark:not(:disabled).active {
  background-color: var(--color-transparent);
  color: var(--active-dark);
  text-decoration-color: var(--active-dark);
}
.link-dark:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-dark);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-dark) 50%, transparent);
}
.link-dark:disabled {
  background-color: var(--color-transparent);
  border-color: var(--color-transparent);
  text-decoration-color: var(--link-disabled-color);
  color: var(--link-disabled-color);
  opacity: 0.5;
}

.link-white {
  padding-block: var(--link-padding-y);
  padding-inline: var(--link-padding-x);
  border-radius: var(--link-border-radius);
  border-style: var(--link-border-style);
  border-width: var(--link-border-width);
  border-color: var(--color-transparent);
  background-color: var(--color-transparent);
  text-decoration: underline;
  color: var(--color-white);
  text-decoration-color: var(--color-white);
}
.link-white:not(:disabled):hover {
  background-color: var(--color-transparent);
  color: var(--hover-white);
  text-decoration-color: var(--hover-white);
}
.link-white:not(:disabled):active, .link-white:not(:disabled).active {
  background-color: var(--color-transparent);
  color: var(--active-white);
  text-decoration-color: var(--active-white);
}
.link-white:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-white);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-white) 50%, transparent);
}
.link-white:disabled {
  background-color: var(--color-transparent);
  border-color: var(--color-transparent);
  text-decoration-color: var(--link-disabled-color);
  color: var(--link-disabled-color);
  opacity: 0.5;
}

.link-black {
  padding-block: var(--link-padding-y);
  padding-inline: var(--link-padding-x);
  border-radius: var(--link-border-radius);
  border-style: var(--link-border-style);
  border-width: var(--link-border-width);
  border-color: var(--color-transparent);
  background-color: var(--color-transparent);
  text-decoration: underline;
  color: var(--color-black);
  text-decoration-color: var(--color-black);
}
.link-black:not(:disabled):hover {
  background-color: var(--color-transparent);
  color: var(--hover-black);
  text-decoration-color: var(--hover-black);
}
.link-black:not(:disabled):active, .link-black:not(:disabled).active {
  background-color: var(--color-transparent);
  color: var(--active-black);
  text-decoration-color: var(--active-black);
}
.link-black:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-black);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-black) 50%, transparent);
}
.link-black:disabled {
  background-color: var(--color-transparent);
  border-color: var(--color-transparent);
  text-decoration-color: var(--link-disabled-color);
  color: var(--link-disabled-color);
  opacity: 0.5;
}

.link-primary-ghost {
  padding-block: var(--link-padding-y);
  padding-inline: var(--link-padding-x);
  border-radius: var(--link-border-radius);
  border-style: var(--link-border-style);
  border-width: var(--link-border-width);
  border-color: var(--color-transparent);
  background-color: var(--color-transparent);
  text-decoration: underline;
  color: var(--color-primary-ghost);
  text-decoration-color: var(--color-primary-ghost);
}
.link-primary-ghost:not(:disabled):hover {
  background-color: var(--color-transparent);
  color: var(--hover-primary-ghost);
  text-decoration-color: var(--hover-primary-ghost);
}
.link-primary-ghost:not(:disabled):active, .link-primary-ghost:not(:disabled).active {
  background-color: var(--color-transparent);
  color: var(--active-primary-ghost);
  text-decoration-color: var(--active-primary-ghost);
}
.link-primary-ghost:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-primary-ghost);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-primary-ghost) 50%, transparent);
}
.link-primary-ghost:disabled {
  background-color: var(--color-transparent);
  border-color: var(--color-transparent);
  text-decoration-color: var(--link-disabled-color);
  color: var(--link-disabled-color);
  opacity: 0.5;
}

.link-secondary-ghost {
  padding-block: var(--link-padding-y);
  padding-inline: var(--link-padding-x);
  border-radius: var(--link-border-radius);
  border-style: var(--link-border-style);
  border-width: var(--link-border-width);
  border-color: var(--color-transparent);
  background-color: var(--color-transparent);
  text-decoration: underline;
  color: var(--color-secondary-ghost);
  text-decoration-color: var(--color-secondary-ghost);
}
.link-secondary-ghost:not(:disabled):hover {
  background-color: var(--color-transparent);
  color: var(--hover-secondary-ghost);
  text-decoration-color: var(--hover-secondary-ghost);
}
.link-secondary-ghost:not(:disabled):active, .link-secondary-ghost:not(:disabled).active {
  background-color: var(--color-transparent);
  color: var(--active-secondary-ghost);
  text-decoration-color: var(--active-secondary-ghost);
}
.link-secondary-ghost:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-secondary-ghost);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-secondary-ghost) 50%, transparent);
}
.link-secondary-ghost:disabled {
  background-color: var(--color-transparent);
  border-color: var(--color-transparent);
  text-decoration-color: var(--link-disabled-color);
  color: var(--link-disabled-color);
  opacity: 0.5;
}

.link-tertiary-ghost {
  padding-block: var(--link-padding-y);
  padding-inline: var(--link-padding-x);
  border-radius: var(--link-border-radius);
  border-style: var(--link-border-style);
  border-width: var(--link-border-width);
  border-color: var(--color-transparent);
  background-color: var(--color-transparent);
  text-decoration: underline;
  color: var(--color-tertiary-ghost);
  text-decoration-color: var(--color-tertiary-ghost);
}
.link-tertiary-ghost:not(:disabled):hover {
  background-color: var(--color-transparent);
  color: var(--hover-tertiary-ghost);
  text-decoration-color: var(--hover-tertiary-ghost);
}
.link-tertiary-ghost:not(:disabled):active, .link-tertiary-ghost:not(:disabled).active {
  background-color: var(--color-transparent);
  color: var(--active-tertiary-ghost);
  text-decoration-color: var(--active-tertiary-ghost);
}
.link-tertiary-ghost:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-tertiary-ghost);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-tertiary-ghost) 50%, transparent);
}
.link-tertiary-ghost:disabled {
  background-color: var(--color-transparent);
  border-color: var(--color-transparent);
  text-decoration-color: var(--link-disabled-color);
  color: var(--link-disabled-color);
  opacity: 0.5;
}

.link-success-ghost {
  padding-block: var(--link-padding-y);
  padding-inline: var(--link-padding-x);
  border-radius: var(--link-border-radius);
  border-style: var(--link-border-style);
  border-width: var(--link-border-width);
  border-color: var(--color-transparent);
  background-color: var(--color-transparent);
  text-decoration: underline;
  color: var(--color-success-ghost);
  text-decoration-color: var(--color-success-ghost);
}
.link-success-ghost:not(:disabled):hover {
  background-color: var(--color-transparent);
  color: var(--hover-success-ghost);
  text-decoration-color: var(--hover-success-ghost);
}
.link-success-ghost:not(:disabled):active, .link-success-ghost:not(:disabled).active {
  background-color: var(--color-transparent);
  color: var(--active-success-ghost);
  text-decoration-color: var(--active-success-ghost);
}
.link-success-ghost:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-success-ghost);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-success-ghost) 50%, transparent);
}
.link-success-ghost:disabled {
  background-color: var(--color-transparent);
  border-color: var(--color-transparent);
  text-decoration-color: var(--link-disabled-color);
  color: var(--link-disabled-color);
  opacity: 0.5;
}

.link-info-ghost {
  padding-block: var(--link-padding-y);
  padding-inline: var(--link-padding-x);
  border-radius: var(--link-border-radius);
  border-style: var(--link-border-style);
  border-width: var(--link-border-width);
  border-color: var(--color-transparent);
  background-color: var(--color-transparent);
  text-decoration: underline;
  color: var(--color-info-ghost);
  text-decoration-color: var(--color-info-ghost);
}
.link-info-ghost:not(:disabled):hover {
  background-color: var(--color-transparent);
  color: var(--hover-info-ghost);
  text-decoration-color: var(--hover-info-ghost);
}
.link-info-ghost:not(:disabled):active, .link-info-ghost:not(:disabled).active {
  background-color: var(--color-transparent);
  color: var(--active-info-ghost);
  text-decoration-color: var(--active-info-ghost);
}
.link-info-ghost:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-info-ghost);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-info-ghost) 50%, transparent);
}
.link-info-ghost:disabled {
  background-color: var(--color-transparent);
  border-color: var(--color-transparent);
  text-decoration-color: var(--link-disabled-color);
  color: var(--link-disabled-color);
  opacity: 0.5;
}

.link-warning-ghost {
  padding-block: var(--link-padding-y);
  padding-inline: var(--link-padding-x);
  border-radius: var(--link-border-radius);
  border-style: var(--link-border-style);
  border-width: var(--link-border-width);
  border-color: var(--color-transparent);
  background-color: var(--color-transparent);
  text-decoration: underline;
  color: var(--color-warning-ghost);
  text-decoration-color: var(--color-warning-ghost);
}
.link-warning-ghost:not(:disabled):hover {
  background-color: var(--color-transparent);
  color: var(--hover-warning-ghost);
  text-decoration-color: var(--hover-warning-ghost);
}
.link-warning-ghost:not(:disabled):active, .link-warning-ghost:not(:disabled).active {
  background-color: var(--color-transparent);
  color: var(--active-warning-ghost);
  text-decoration-color: var(--active-warning-ghost);
}
.link-warning-ghost:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-warning-ghost);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-warning-ghost) 50%, transparent);
}
.link-warning-ghost:disabled {
  background-color: var(--color-transparent);
  border-color: var(--color-transparent);
  text-decoration-color: var(--link-disabled-color);
  color: var(--link-disabled-color);
  opacity: 0.5;
}

.link-danger-ghost {
  padding-block: var(--link-padding-y);
  padding-inline: var(--link-padding-x);
  border-radius: var(--link-border-radius);
  border-style: var(--link-border-style);
  border-width: var(--link-border-width);
  border-color: var(--color-transparent);
  background-color: var(--color-transparent);
  text-decoration: underline;
  color: var(--color-danger-ghost);
  text-decoration-color: var(--color-danger-ghost);
}
.link-danger-ghost:not(:disabled):hover {
  background-color: var(--color-transparent);
  color: var(--hover-danger-ghost);
  text-decoration-color: var(--hover-danger-ghost);
}
.link-danger-ghost:not(:disabled):active, .link-danger-ghost:not(:disabled).active {
  background-color: var(--color-transparent);
  color: var(--active-danger-ghost);
  text-decoration-color: var(--active-danger-ghost);
}
.link-danger-ghost:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-danger-ghost);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-danger-ghost) 50%, transparent);
}
.link-danger-ghost:disabled {
  background-color: var(--color-transparent);
  border-color: var(--color-transparent);
  text-decoration-color: var(--link-disabled-color);
  color: var(--link-disabled-color);
  opacity: 0.5;
}

.link-neutral-ghost {
  padding-block: var(--link-padding-y);
  padding-inline: var(--link-padding-x);
  border-radius: var(--link-border-radius);
  border-style: var(--link-border-style);
  border-width: var(--link-border-width);
  border-color: var(--color-transparent);
  background-color: var(--color-transparent);
  text-decoration: underline;
  color: var(--color-neutral-ghost);
  text-decoration-color: var(--color-neutral-ghost);
}
.link-neutral-ghost:not(:disabled):hover {
  background-color: var(--color-transparent);
  color: var(--hover-neutral-ghost);
  text-decoration-color: var(--hover-neutral-ghost);
}
.link-neutral-ghost:not(:disabled):active, .link-neutral-ghost:not(:disabled).active {
  background-color: var(--color-transparent);
  color: var(--active-neutral-ghost);
  text-decoration-color: var(--active-neutral-ghost);
}
.link-neutral-ghost:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-neutral-ghost);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-neutral-ghost) 50%, transparent);
}
.link-neutral-ghost:disabled {
  background-color: var(--color-transparent);
  border-color: var(--color-transparent);
  text-decoration-color: var(--link-disabled-color);
  color: var(--link-disabled-color);
  opacity: 0.5;
}

.link-light-ghost {
  padding-block: var(--link-padding-y);
  padding-inline: var(--link-padding-x);
  border-radius: var(--link-border-radius);
  border-style: var(--link-border-style);
  border-width: var(--link-border-width);
  border-color: var(--color-transparent);
  background-color: var(--color-transparent);
  text-decoration: underline;
  color: var(--color-light-ghost);
  text-decoration-color: var(--color-light-ghost);
}
.link-light-ghost:not(:disabled):hover {
  background-color: var(--color-transparent);
  color: var(--hover-light-ghost);
  text-decoration-color: var(--hover-light-ghost);
}
.link-light-ghost:not(:disabled):active, .link-light-ghost:not(:disabled).active {
  background-color: var(--color-transparent);
  color: var(--active-light-ghost);
  text-decoration-color: var(--active-light-ghost);
}
.link-light-ghost:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-light-ghost);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-light-ghost) 50%, transparent);
}
.link-light-ghost:disabled {
  background-color: var(--color-transparent);
  border-color: var(--color-transparent);
  text-decoration-color: var(--link-disabled-color);
  color: var(--link-disabled-color);
  opacity: 0.5;
}

.link-dark-ghost {
  padding-block: var(--link-padding-y);
  padding-inline: var(--link-padding-x);
  border-radius: var(--link-border-radius);
  border-style: var(--link-border-style);
  border-width: var(--link-border-width);
  border-color: var(--color-transparent);
  background-color: var(--color-transparent);
  text-decoration: underline;
  color: var(--color-dark-ghost);
  text-decoration-color: var(--color-dark-ghost);
}
.link-dark-ghost:not(:disabled):hover {
  background-color: var(--color-transparent);
  color: var(--hover-dark-ghost);
  text-decoration-color: var(--hover-dark-ghost);
}
.link-dark-ghost:not(:disabled):active, .link-dark-ghost:not(:disabled).active {
  background-color: var(--color-transparent);
  color: var(--active-dark-ghost);
  text-decoration-color: var(--active-dark-ghost);
}
.link-dark-ghost:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-dark-ghost);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-dark-ghost) 50%, transparent);
}
.link-dark-ghost:disabled {
  background-color: var(--color-transparent);
  border-color: var(--color-transparent);
  text-decoration-color: var(--link-disabled-color);
  color: var(--link-disabled-color);
  opacity: 0.5;
}

.link-white-ghost {
  padding-block: var(--link-padding-y);
  padding-inline: var(--link-padding-x);
  border-radius: var(--link-border-radius);
  border-style: var(--link-border-style);
  border-width: var(--link-border-width);
  border-color: var(--color-transparent);
  background-color: var(--color-transparent);
  text-decoration: underline;
  color: var(--color-white-ghost);
  text-decoration-color: var(--color-white-ghost);
}
.link-white-ghost:not(:disabled):hover {
  background-color: var(--color-transparent);
  color: var(--hover-white-ghost);
  text-decoration-color: var(--hover-white-ghost);
}
.link-white-ghost:not(:disabled):active, .link-white-ghost:not(:disabled).active {
  background-color: var(--color-transparent);
  color: var(--active-white-ghost);
  text-decoration-color: var(--active-white-ghost);
}
.link-white-ghost:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-white-ghost);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-white-ghost) 50%, transparent);
}
.link-white-ghost:disabled {
  background-color: var(--color-transparent);
  border-color: var(--color-transparent);
  text-decoration-color: var(--link-disabled-color);
  color: var(--link-disabled-color);
  opacity: 0.5;
}

.link-black-ghost {
  padding-block: var(--link-padding-y);
  padding-inline: var(--link-padding-x);
  border-radius: var(--link-border-radius);
  border-style: var(--link-border-style);
  border-width: var(--link-border-width);
  border-color: var(--color-transparent);
  background-color: var(--color-transparent);
  text-decoration: underline;
  color: var(--color-black-ghost);
  text-decoration-color: var(--color-black-ghost);
}
.link-black-ghost:not(:disabled):hover {
  background-color: var(--color-transparent);
  color: var(--hover-black-ghost);
  text-decoration-color: var(--hover-black-ghost);
}
.link-black-ghost:not(:disabled):active, .link-black-ghost:not(:disabled).active {
  background-color: var(--color-transparent);
  color: var(--active-black-ghost);
  text-decoration-color: var(--active-black-ghost);
}
.link-black-ghost:not(:disabled):focus-visible {
  outline: none;
  border-color: var(--color-black-ghost);
  box-shadow: 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-black-ghost) 50%, transparent);
}
.link-black-ghost:disabled {
  background-color: var(--color-transparent);
  border-color: var(--color-transparent);
  text-decoration-color: var(--link-disabled-color);
  color: var(--link-disabled-color);
  opacity: 0.5;
}

.list {
  list-style: none;
  overflow: clip;
  border-radius: var(--list-border-radius);
  border-style: var(--list-border-style);
  border-color: var(--list-border-color);
  border-width: var(--list-border-width);
}

.list .list-item {
  padding-inline: var(--list-item-padding-x);
  padding-block: var(--list-item-padding-y);
}
.list .list-item:has(> .list-link) {
  padding: 0;
}
.list .list-item > .list-link {
  padding-inline: var(--list-item-padding-x);
  padding-block: var(--list-item-padding-y);
}

.list-sm .list-item {
  padding-inline: var(--list-item-padding-x-sm);
  padding-block: var(--list-item-padding-y-sm);
}
.list-sm .list-item:has(> .list-link) {
  padding: 0;
}
.list-sm .list-item > .list-link {
  padding-inline: var(--list-item-padding-x-sm);
  padding-block: var(--list-item-padding-y-sm);
}

.list-md .list-item {
  padding-inline: var(--list-item-padding-x-md);
  padding-block: var(--list-item-padding-y-md);
}
.list-md .list-item:has(> .list-link) {
  padding: 0;
}
.list-md .list-item > .list-link {
  padding-inline: var(--list-item-padding-x-md);
  padding-block: var(--list-item-padding-y-md);
}

.list-lg .list-item {
  padding-inline: var(--list-item-padding-x-lg);
  padding-block: var(--list-item-padding-y-lg);
}
.list-lg .list-item:has(> .list-link) {
  padding: 0;
}
.list-lg .list-item > .list-link {
  padding-inline: var(--list-item-padding-x-lg);
  padding-block: var(--list-item-padding-y-lg);
}

.list:not(.list-bordered) .list-item,
.list:not(.list-bordered) .list-link {
  border-radius: var(--list-border-radius);
}

.list-bordered .list-item {
  border-bottom-width: var(--list-border-width);
  border-bottom-style: var(--list-border-style);
  border-bottom-color: var(--list-border-color);
}
.list-bordered .list-item:last-child {
  border-bottom-width: 0;
}

.list-borderless {
  border: none;
}
.list-borderless .list-item {
  border: none;
}

.list-inline {
  display: inline-flex;
  list-style: none;
  gap: var(--list-inline-gap);
  border-radius: var(--list-border-radius);
  border-style: var(--list-border-style);
  border-color: var(--list-border-color);
  border-width: var(--list-border-width);
}
.list-inline .list-item {
  align-self: center;
  border-radius: var(--list-border-radius);
}
.list-inline .list-item .list-link {
  align-self: center;
}

.list-unstyled {
  list-style: none;
}

.list-item.active:not(.no-action) {
  background-color: var(--list-item-active-background-color);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--list-item-active-background-color);
}

.list-link {
  display: block;
  width: 100%;
}
.list-link:focus-visible {
  outline: none;
  border-color: var(--text-color);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--text-color) 50%, transparent);
}

.list-hover .list-item:not(.no-action):hover {
  background-color: var(--list-item-hover-background-color);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--list-item-hover-background-color);
}
.list-hover .list-item:not(.no-action):active, .list-hover .list-item:not(.no-action).active {
  background-color: var(--list-item-active-background-color);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--list-item-active-background-color);
}

.list-item-hover:hover {
  background-color: var(--list-item-hover-background-color);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--list-item-hover-background-color);
}
.list-item-hover:active {
  background-color: var(--list-item-active-background-color);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--list-item-active-background-color);
}

.list-primary {
  border-color: color-mix(in srgb, var(--color-primary) 50%, transparent);
  color: var(--color-primary);
}
.list-primary .list-item {
  border-color: color-mix(in srgb, var(--color-primary) 50%, transparent);
}
.list-primary .list-item.active {
  background-color: color-mix(in srgb, var(--color-primary) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-primary);
}
.list-primary .list-link:focus-visible {
  outline: none;
  border-color: var(--color-primary);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-primary) 50%, transparent);
}

.list-secondary {
  border-color: color-mix(in srgb, var(--color-secondary) 50%, transparent);
  color: var(--color-secondary);
}
.list-secondary .list-item {
  border-color: color-mix(in srgb, var(--color-secondary) 50%, transparent);
}
.list-secondary .list-item.active {
  background-color: color-mix(in srgb, var(--color-secondary) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-secondary);
}
.list-secondary .list-link:focus-visible {
  outline: none;
  border-color: var(--color-secondary);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-secondary) 50%, transparent);
}

.list-tertiary {
  border-color: color-mix(in srgb, var(--color-tertiary) 50%, transparent);
  color: var(--color-tertiary);
}
.list-tertiary .list-item {
  border-color: color-mix(in srgb, var(--color-tertiary) 50%, transparent);
}
.list-tertiary .list-item.active {
  background-color: color-mix(in srgb, var(--color-tertiary) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-tertiary);
}
.list-tertiary .list-link:focus-visible {
  outline: none;
  border-color: var(--color-tertiary);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-tertiary) 50%, transparent);
}

.list-success {
  border-color: color-mix(in srgb, var(--color-success) 50%, transparent);
  color: var(--color-success);
}
.list-success .list-item {
  border-color: color-mix(in srgb, var(--color-success) 50%, transparent);
}
.list-success .list-item.active {
  background-color: color-mix(in srgb, var(--color-success) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-success);
}
.list-success .list-link:focus-visible {
  outline: none;
  border-color: var(--color-success);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-success) 50%, transparent);
}

.list-info {
  border-color: color-mix(in srgb, var(--color-info) 50%, transparent);
  color: var(--color-info);
}
.list-info .list-item {
  border-color: color-mix(in srgb, var(--color-info) 50%, transparent);
}
.list-info .list-item.active {
  background-color: color-mix(in srgb, var(--color-info) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-info);
}
.list-info .list-link:focus-visible {
  outline: none;
  border-color: var(--color-info);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-info) 50%, transparent);
}

.list-warning {
  border-color: color-mix(in srgb, var(--color-warning) 50%, transparent);
  color: var(--color-warning);
}
.list-warning .list-item {
  border-color: color-mix(in srgb, var(--color-warning) 50%, transparent);
}
.list-warning .list-item.active {
  background-color: color-mix(in srgb, var(--color-warning) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-warning);
}
.list-warning .list-link:focus-visible {
  outline: none;
  border-color: var(--color-warning);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-warning) 50%, transparent);
}

.list-danger {
  border-color: color-mix(in srgb, var(--color-danger) 50%, transparent);
  color: var(--color-danger);
}
.list-danger .list-item {
  border-color: color-mix(in srgb, var(--color-danger) 50%, transparent);
}
.list-danger .list-item.active {
  background-color: color-mix(in srgb, var(--color-danger) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-danger);
}
.list-danger .list-link:focus-visible {
  outline: none;
  border-color: var(--color-danger);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-danger) 50%, transparent);
}

.list-neutral {
  border-color: color-mix(in srgb, var(--color-neutral) 50%, transparent);
  color: var(--color-neutral);
}
.list-neutral .list-item {
  border-color: color-mix(in srgb, var(--color-neutral) 50%, transparent);
}
.list-neutral .list-item.active {
  background-color: color-mix(in srgb, var(--color-neutral) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-neutral);
}
.list-neutral .list-link:focus-visible {
  outline: none;
  border-color: var(--color-neutral);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-neutral) 50%, transparent);
}

.list-light {
  border-color: color-mix(in srgb, var(--color-light) 50%, transparent);
  color: var(--color-light);
}
.list-light .list-item {
  border-color: color-mix(in srgb, var(--color-light) 50%, transparent);
}
.list-light .list-item.active {
  background-color: color-mix(in srgb, var(--color-light) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-light);
}
.list-light .list-link:focus-visible {
  outline: none;
  border-color: var(--color-light);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-light) 50%, transparent);
}

.list-dark {
  border-color: color-mix(in srgb, var(--color-dark) 50%, transparent);
  color: var(--color-dark);
}
.list-dark .list-item {
  border-color: color-mix(in srgb, var(--color-dark) 50%, transparent);
}
.list-dark .list-item.active {
  background-color: color-mix(in srgb, var(--color-dark) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-dark);
}
.list-dark .list-link:focus-visible {
  outline: none;
  border-color: var(--color-dark);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-dark) 50%, transparent);
}

.list-white {
  border-color: color-mix(in srgb, var(--color-white) 50%, transparent);
  color: var(--color-white);
}
.list-white .list-item {
  border-color: color-mix(in srgb, var(--color-white) 50%, transparent);
}
.list-white .list-item.active {
  background-color: color-mix(in srgb, var(--color-white) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-white);
}
.list-white .list-link:focus-visible {
  outline: none;
  border-color: var(--color-white);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-white) 50%, transparent);
}

.list-black {
  border-color: color-mix(in srgb, var(--color-black) 50%, transparent);
  color: var(--color-black);
}
.list-black .list-item {
  border-color: color-mix(in srgb, var(--color-black) 50%, transparent);
}
.list-black .list-item.active {
  background-color: color-mix(in srgb, var(--color-black) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-black);
}
.list-black .list-link:focus-visible {
  outline: none;
  border-color: var(--color-black);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-black) 50%, transparent);
}

.list-primary-ghost {
  border-color: color-mix(in srgb, var(--color-primary-ghost) 50%, transparent);
  color: var(--color-primary-ghost);
}
.list-primary-ghost .list-item {
  border-color: color-mix(in srgb, var(--color-primary-ghost) 50%, transparent);
}
.list-primary-ghost .list-item.active {
  background-color: color-mix(in srgb, var(--color-primary-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-primary-ghost);
}
.list-primary-ghost .list-link:focus-visible {
  outline: none;
  border-color: var(--color-primary-ghost);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-primary-ghost) 50%, transparent);
}

.list-secondary-ghost {
  border-color: color-mix(in srgb, var(--color-secondary-ghost) 50%, transparent);
  color: var(--color-secondary-ghost);
}
.list-secondary-ghost .list-item {
  border-color: color-mix(in srgb, var(--color-secondary-ghost) 50%, transparent);
}
.list-secondary-ghost .list-item.active {
  background-color: color-mix(in srgb, var(--color-secondary-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-secondary-ghost);
}
.list-secondary-ghost .list-link:focus-visible {
  outline: none;
  border-color: var(--color-secondary-ghost);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-secondary-ghost) 50%, transparent);
}

.list-tertiary-ghost {
  border-color: color-mix(in srgb, var(--color-tertiary-ghost) 50%, transparent);
  color: var(--color-tertiary-ghost);
}
.list-tertiary-ghost .list-item {
  border-color: color-mix(in srgb, var(--color-tertiary-ghost) 50%, transparent);
}
.list-tertiary-ghost .list-item.active {
  background-color: color-mix(in srgb, var(--color-tertiary-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-tertiary-ghost);
}
.list-tertiary-ghost .list-link:focus-visible {
  outline: none;
  border-color: var(--color-tertiary-ghost);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-tertiary-ghost) 50%, transparent);
}

.list-success-ghost {
  border-color: color-mix(in srgb, var(--color-success-ghost) 50%, transparent);
  color: var(--color-success-ghost);
}
.list-success-ghost .list-item {
  border-color: color-mix(in srgb, var(--color-success-ghost) 50%, transparent);
}
.list-success-ghost .list-item.active {
  background-color: color-mix(in srgb, var(--color-success-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-success-ghost);
}
.list-success-ghost .list-link:focus-visible {
  outline: none;
  border-color: var(--color-success-ghost);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-success-ghost) 50%, transparent);
}

.list-info-ghost {
  border-color: color-mix(in srgb, var(--color-info-ghost) 50%, transparent);
  color: var(--color-info-ghost);
}
.list-info-ghost .list-item {
  border-color: color-mix(in srgb, var(--color-info-ghost) 50%, transparent);
}
.list-info-ghost .list-item.active {
  background-color: color-mix(in srgb, var(--color-info-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-info-ghost);
}
.list-info-ghost .list-link:focus-visible {
  outline: none;
  border-color: var(--color-info-ghost);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-info-ghost) 50%, transparent);
}

.list-warning-ghost {
  border-color: color-mix(in srgb, var(--color-warning-ghost) 50%, transparent);
  color: var(--color-warning-ghost);
}
.list-warning-ghost .list-item {
  border-color: color-mix(in srgb, var(--color-warning-ghost) 50%, transparent);
}
.list-warning-ghost .list-item.active {
  background-color: color-mix(in srgb, var(--color-warning-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-warning-ghost);
}
.list-warning-ghost .list-link:focus-visible {
  outline: none;
  border-color: var(--color-warning-ghost);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-warning-ghost) 50%, transparent);
}

.list-danger-ghost {
  border-color: color-mix(in srgb, var(--color-danger-ghost) 50%, transparent);
  color: var(--color-danger-ghost);
}
.list-danger-ghost .list-item {
  border-color: color-mix(in srgb, var(--color-danger-ghost) 50%, transparent);
}
.list-danger-ghost .list-item.active {
  background-color: color-mix(in srgb, var(--color-danger-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-danger-ghost);
}
.list-danger-ghost .list-link:focus-visible {
  outline: none;
  border-color: var(--color-danger-ghost);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-danger-ghost) 50%, transparent);
}

.list-neutral-ghost {
  border-color: color-mix(in srgb, var(--color-neutral-ghost) 50%, transparent);
  color: var(--color-neutral-ghost);
}
.list-neutral-ghost .list-item {
  border-color: color-mix(in srgb, var(--color-neutral-ghost) 50%, transparent);
}
.list-neutral-ghost .list-item.active {
  background-color: color-mix(in srgb, var(--color-neutral-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-neutral-ghost);
}
.list-neutral-ghost .list-link:focus-visible {
  outline: none;
  border-color: var(--color-neutral-ghost);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-neutral-ghost) 50%, transparent);
}

.list-light-ghost {
  border-color: color-mix(in srgb, var(--color-light-ghost) 50%, transparent);
  color: var(--color-light-ghost);
}
.list-light-ghost .list-item {
  border-color: color-mix(in srgb, var(--color-light-ghost) 50%, transparent);
}
.list-light-ghost .list-item.active {
  background-color: color-mix(in srgb, var(--color-light-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-light-ghost);
}
.list-light-ghost .list-link:focus-visible {
  outline: none;
  border-color: var(--color-light-ghost);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-light-ghost) 50%, transparent);
}

.list-dark-ghost {
  border-color: color-mix(in srgb, var(--color-dark-ghost) 50%, transparent);
  color: var(--color-dark-ghost);
}
.list-dark-ghost .list-item {
  border-color: color-mix(in srgb, var(--color-dark-ghost) 50%, transparent);
}
.list-dark-ghost .list-item.active {
  background-color: color-mix(in srgb, var(--color-dark-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-dark-ghost);
}
.list-dark-ghost .list-link:focus-visible {
  outline: none;
  border-color: var(--color-dark-ghost);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-dark-ghost) 50%, transparent);
}

.list-white-ghost {
  border-color: color-mix(in srgb, var(--color-white-ghost) 50%, transparent);
  color: var(--color-white-ghost);
}
.list-white-ghost .list-item {
  border-color: color-mix(in srgb, var(--color-white-ghost) 50%, transparent);
}
.list-white-ghost .list-item.active {
  background-color: color-mix(in srgb, var(--color-white-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-white-ghost);
}
.list-white-ghost .list-link:focus-visible {
  outline: none;
  border-color: var(--color-white-ghost);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-white-ghost) 50%, transparent);
}

.list-black-ghost {
  border-color: color-mix(in srgb, var(--color-black-ghost) 50%, transparent);
  color: var(--color-black-ghost);
}
.list-black-ghost .list-item {
  border-color: color-mix(in srgb, var(--color-black-ghost) 50%, transparent);
}
.list-black-ghost .list-item.active {
  background-color: color-mix(in srgb, var(--color-black-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-black-ghost);
}
.list-black-ghost .list-link:focus-visible {
  outline: none;
  border-color: var(--color-black-ghost);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-black-ghost) 50%, transparent);
}

.list-item-primary {
  color: var(--color-primary);
}
.list-item-primary .list-link:focus-visible {
  outline: none;
  border-color: var(--color-primary);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-primary) 50%, transparent);
}

.list-item-secondary {
  color: var(--color-secondary);
}
.list-item-secondary .list-link:focus-visible {
  outline: none;
  border-color: var(--color-secondary);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-secondary) 50%, transparent);
}

.list-item-tertiary {
  color: var(--color-tertiary);
}
.list-item-tertiary .list-link:focus-visible {
  outline: none;
  border-color: var(--color-tertiary);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-tertiary) 50%, transparent);
}

.list-item-success {
  color: var(--color-success);
}
.list-item-success .list-link:focus-visible {
  outline: none;
  border-color: var(--color-success);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-success) 50%, transparent);
}

.list-item-info {
  color: var(--color-info);
}
.list-item-info .list-link:focus-visible {
  outline: none;
  border-color: var(--color-info);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-info) 50%, transparent);
}

.list-item-warning {
  color: var(--color-warning);
}
.list-item-warning .list-link:focus-visible {
  outline: none;
  border-color: var(--color-warning);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-warning) 50%, transparent);
}

.list-item-danger {
  color: var(--color-danger);
}
.list-item-danger .list-link:focus-visible {
  outline: none;
  border-color: var(--color-danger);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-danger) 50%, transparent);
}

.list-item-neutral {
  color: var(--color-neutral);
}
.list-item-neutral .list-link:focus-visible {
  outline: none;
  border-color: var(--color-neutral);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-neutral) 50%, transparent);
}

.list-item-light {
  color: var(--color-light);
}
.list-item-light .list-link:focus-visible {
  outline: none;
  border-color: var(--color-light);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-light) 50%, transparent);
}

.list-item-dark {
  color: var(--color-dark);
}
.list-item-dark .list-link:focus-visible {
  outline: none;
  border-color: var(--color-dark);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-dark) 50%, transparent);
}

.list-item-white {
  color: var(--color-white);
}
.list-item-white .list-link:focus-visible {
  outline: none;
  border-color: var(--color-white);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-white) 50%, transparent);
}

.list-item-black {
  color: var(--color-black);
}
.list-item-black .list-link:focus-visible {
  outline: none;
  border-color: var(--color-black);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-black) 50%, transparent);
}

.list-item-primary-ghost {
  color: var(--color-primary-ghost);
}
.list-item-primary-ghost .list-link:focus-visible {
  outline: none;
  border-color: var(--color-primary-ghost);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-primary-ghost) 50%, transparent);
}

.list-item-secondary-ghost {
  color: var(--color-secondary-ghost);
}
.list-item-secondary-ghost .list-link:focus-visible {
  outline: none;
  border-color: var(--color-secondary-ghost);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-secondary-ghost) 50%, transparent);
}

.list-item-tertiary-ghost {
  color: var(--color-tertiary-ghost);
}
.list-item-tertiary-ghost .list-link:focus-visible {
  outline: none;
  border-color: var(--color-tertiary-ghost);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-tertiary-ghost) 50%, transparent);
}

.list-item-success-ghost {
  color: var(--color-success-ghost);
}
.list-item-success-ghost .list-link:focus-visible {
  outline: none;
  border-color: var(--color-success-ghost);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-success-ghost) 50%, transparent);
}

.list-item-info-ghost {
  color: var(--color-info-ghost);
}
.list-item-info-ghost .list-link:focus-visible {
  outline: none;
  border-color: var(--color-info-ghost);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-info-ghost) 50%, transparent);
}

.list-item-warning-ghost {
  color: var(--color-warning-ghost);
}
.list-item-warning-ghost .list-link:focus-visible {
  outline: none;
  border-color: var(--color-warning-ghost);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-warning-ghost) 50%, transparent);
}

.list-item-danger-ghost {
  color: var(--color-danger-ghost);
}
.list-item-danger-ghost .list-link:focus-visible {
  outline: none;
  border-color: var(--color-danger-ghost);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-danger-ghost) 50%, transparent);
}

.list-item-neutral-ghost {
  color: var(--color-neutral-ghost);
}
.list-item-neutral-ghost .list-link:focus-visible {
  outline: none;
  border-color: var(--color-neutral-ghost);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-neutral-ghost) 50%, transparent);
}

.list-item-light-ghost {
  color: var(--color-light-ghost);
}
.list-item-light-ghost .list-link:focus-visible {
  outline: none;
  border-color: var(--color-light-ghost);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-light-ghost) 50%, transparent);
}

.list-item-dark-ghost {
  color: var(--color-dark-ghost);
}
.list-item-dark-ghost .list-link:focus-visible {
  outline: none;
  border-color: var(--color-dark-ghost);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-dark-ghost) 50%, transparent);
}

.list-item-white-ghost {
  color: var(--color-white-ghost);
}
.list-item-white-ghost .list-link:focus-visible {
  outline: none;
  border-color: var(--color-white-ghost);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-white-ghost) 50%, transparent);
}

.list-item-black-ghost {
  color: var(--color-black-ghost);
}
.list-item-black-ghost .list-link:focus-visible {
  outline: none;
  border-color: var(--color-black-ghost);
  box-shadow: inset 0 0 0.5rem 0.25rem color-mix(in srgb, var(--color-black-ghost) 50%, transparent);
}

.list-hover.list-primary .list-item:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-primary) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-primary);
}
.list-hover.list-primary .list-item:not(.no-action):active, .list-hover.list-primary .list-item:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-primary) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-primary);
}

.list-hover.list-secondary .list-item:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-secondary) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-secondary);
}
.list-hover.list-secondary .list-item:not(.no-action):active, .list-hover.list-secondary .list-item:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-secondary) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-secondary);
}

.list-hover.list-tertiary .list-item:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-tertiary) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-tertiary);
}
.list-hover.list-tertiary .list-item:not(.no-action):active, .list-hover.list-tertiary .list-item:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-tertiary) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-tertiary);
}

.list-hover.list-success .list-item:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-success) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-success);
}
.list-hover.list-success .list-item:not(.no-action):active, .list-hover.list-success .list-item:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-success) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-success);
}

.list-hover.list-info .list-item:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-info) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-info);
}
.list-hover.list-info .list-item:not(.no-action):active, .list-hover.list-info .list-item:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-info) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-info);
}

.list-hover.list-warning .list-item:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-warning) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-warning);
}
.list-hover.list-warning .list-item:not(.no-action):active, .list-hover.list-warning .list-item:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-warning) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-warning);
}

.list-hover.list-danger .list-item:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-danger) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-danger);
}
.list-hover.list-danger .list-item:not(.no-action):active, .list-hover.list-danger .list-item:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-danger) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-danger);
}

.list-hover.list-neutral .list-item:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-neutral) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-neutral);
}
.list-hover.list-neutral .list-item:not(.no-action):active, .list-hover.list-neutral .list-item:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-neutral) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-neutral);
}

.list-hover.list-light .list-item:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-light) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-light);
}
.list-hover.list-light .list-item:not(.no-action):active, .list-hover.list-light .list-item:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-light) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-light);
}

.list-hover.list-dark .list-item:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-dark) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-dark);
}
.list-hover.list-dark .list-item:not(.no-action):active, .list-hover.list-dark .list-item:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-dark) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-dark);
}

.list-hover.list-white .list-item:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-white) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-white);
}
.list-hover.list-white .list-item:not(.no-action):active, .list-hover.list-white .list-item:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-white) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-white);
}

.list-hover.list-black .list-item:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-black) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-black);
}
.list-hover.list-black .list-item:not(.no-action):active, .list-hover.list-black .list-item:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-black) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-black);
}

.list-hover.list-primary-ghost .list-item:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-primary-ghost) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-primary-ghost);
}
.list-hover.list-primary-ghost .list-item:not(.no-action):active, .list-hover.list-primary-ghost .list-item:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-primary-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-primary-ghost);
}

.list-hover.list-secondary-ghost .list-item:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-secondary-ghost) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-secondary-ghost);
}
.list-hover.list-secondary-ghost .list-item:not(.no-action):active, .list-hover.list-secondary-ghost .list-item:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-secondary-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-secondary-ghost);
}

.list-hover.list-tertiary-ghost .list-item:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-tertiary-ghost) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-tertiary-ghost);
}
.list-hover.list-tertiary-ghost .list-item:not(.no-action):active, .list-hover.list-tertiary-ghost .list-item:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-tertiary-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-tertiary-ghost);
}

.list-hover.list-success-ghost .list-item:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-success-ghost) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-success-ghost);
}
.list-hover.list-success-ghost .list-item:not(.no-action):active, .list-hover.list-success-ghost .list-item:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-success-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-success-ghost);
}

.list-hover.list-info-ghost .list-item:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-info-ghost) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-info-ghost);
}
.list-hover.list-info-ghost .list-item:not(.no-action):active, .list-hover.list-info-ghost .list-item:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-info-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-info-ghost);
}

.list-hover.list-warning-ghost .list-item:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-warning-ghost) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-warning-ghost);
}
.list-hover.list-warning-ghost .list-item:not(.no-action):active, .list-hover.list-warning-ghost .list-item:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-warning-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-warning-ghost);
}

.list-hover.list-danger-ghost .list-item:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-danger-ghost) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-danger-ghost);
}
.list-hover.list-danger-ghost .list-item:not(.no-action):active, .list-hover.list-danger-ghost .list-item:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-danger-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-danger-ghost);
}

.list-hover.list-neutral-ghost .list-item:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-neutral-ghost) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-neutral-ghost);
}
.list-hover.list-neutral-ghost .list-item:not(.no-action):active, .list-hover.list-neutral-ghost .list-item:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-neutral-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-neutral-ghost);
}

.list-hover.list-light-ghost .list-item:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-light-ghost) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-light-ghost);
}
.list-hover.list-light-ghost .list-item:not(.no-action):active, .list-hover.list-light-ghost .list-item:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-light-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-light-ghost);
}

.list-hover.list-dark-ghost .list-item:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-dark-ghost) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-dark-ghost);
}
.list-hover.list-dark-ghost .list-item:not(.no-action):active, .list-hover.list-dark-ghost .list-item:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-dark-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-dark-ghost);
}

.list-hover.list-white-ghost .list-item:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-white-ghost) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-white-ghost);
}
.list-hover.list-white-ghost .list-item:not(.no-action):active, .list-hover.list-white-ghost .list-item:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-white-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-white-ghost);
}

.list-hover.list-black-ghost .list-item:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-black-ghost) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-black-ghost);
}
.list-hover.list-black-ghost .list-item:not(.no-action):active, .list-hover.list-black-ghost .list-item:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-black-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-black-ghost);
}

.list-hover.list .list-item-primary:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-primary) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-primary);
}
.list-hover.list .list-item-primary:not(.no-action):active, .list-hover.list .list-item-primary:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-primary) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-primary);
}

.list-hover.list .list-item-secondary:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-secondary) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-secondary);
}
.list-hover.list .list-item-secondary:not(.no-action):active, .list-hover.list .list-item-secondary:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-secondary) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-secondary);
}

.list-hover.list .list-item-tertiary:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-tertiary) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-tertiary);
}
.list-hover.list .list-item-tertiary:not(.no-action):active, .list-hover.list .list-item-tertiary:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-tertiary) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-tertiary);
}

.list-hover.list .list-item-success:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-success) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-success);
}
.list-hover.list .list-item-success:not(.no-action):active, .list-hover.list .list-item-success:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-success) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-success);
}

.list-hover.list .list-item-info:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-info) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-info);
}
.list-hover.list .list-item-info:not(.no-action):active, .list-hover.list .list-item-info:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-info) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-info);
}

.list-hover.list .list-item-warning:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-warning) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-warning);
}
.list-hover.list .list-item-warning:not(.no-action):active, .list-hover.list .list-item-warning:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-warning) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-warning);
}

.list-hover.list .list-item-danger:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-danger) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-danger);
}
.list-hover.list .list-item-danger:not(.no-action):active, .list-hover.list .list-item-danger:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-danger) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-danger);
}

.list-hover.list .list-item-neutral:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-neutral) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-neutral);
}
.list-hover.list .list-item-neutral:not(.no-action):active, .list-hover.list .list-item-neutral:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-neutral) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-neutral);
}

.list-hover.list .list-item-light:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-light) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-light);
}
.list-hover.list .list-item-light:not(.no-action):active, .list-hover.list .list-item-light:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-light) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-light);
}

.list-hover.list .list-item-dark:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-dark) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-dark);
}
.list-hover.list .list-item-dark:not(.no-action):active, .list-hover.list .list-item-dark:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-dark) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-dark);
}

.list-hover.list .list-item-white:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-white) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-white);
}
.list-hover.list .list-item-white:not(.no-action):active, .list-hover.list .list-item-white:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-white) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-white);
}

.list-hover.list .list-item-black:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-black) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-black);
}
.list-hover.list .list-item-black:not(.no-action):active, .list-hover.list .list-item-black:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-black) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-black);
}

.list-hover.list .list-item-primary-ghost:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-primary-ghost) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-primary-ghost);
}
.list-hover.list .list-item-primary-ghost:not(.no-action):active, .list-hover.list .list-item-primary-ghost:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-primary-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-primary-ghost);
}

.list-hover.list .list-item-secondary-ghost:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-secondary-ghost) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-secondary-ghost);
}
.list-hover.list .list-item-secondary-ghost:not(.no-action):active, .list-hover.list .list-item-secondary-ghost:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-secondary-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-secondary-ghost);
}

.list-hover.list .list-item-tertiary-ghost:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-tertiary-ghost) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-tertiary-ghost);
}
.list-hover.list .list-item-tertiary-ghost:not(.no-action):active, .list-hover.list .list-item-tertiary-ghost:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-tertiary-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-tertiary-ghost);
}

.list-hover.list .list-item-success-ghost:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-success-ghost) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-success-ghost);
}
.list-hover.list .list-item-success-ghost:not(.no-action):active, .list-hover.list .list-item-success-ghost:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-success-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-success-ghost);
}

.list-hover.list .list-item-info-ghost:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-info-ghost) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-info-ghost);
}
.list-hover.list .list-item-info-ghost:not(.no-action):active, .list-hover.list .list-item-info-ghost:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-info-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-info-ghost);
}

.list-hover.list .list-item-warning-ghost:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-warning-ghost) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-warning-ghost);
}
.list-hover.list .list-item-warning-ghost:not(.no-action):active, .list-hover.list .list-item-warning-ghost:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-warning-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-warning-ghost);
}

.list-hover.list .list-item-danger-ghost:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-danger-ghost) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-danger-ghost);
}
.list-hover.list .list-item-danger-ghost:not(.no-action):active, .list-hover.list .list-item-danger-ghost:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-danger-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-danger-ghost);
}

.list-hover.list .list-item-neutral-ghost:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-neutral-ghost) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-neutral-ghost);
}
.list-hover.list .list-item-neutral-ghost:not(.no-action):active, .list-hover.list .list-item-neutral-ghost:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-neutral-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-neutral-ghost);
}

.list-hover.list .list-item-light-ghost:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-light-ghost) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-light-ghost);
}
.list-hover.list .list-item-light-ghost:not(.no-action):active, .list-hover.list .list-item-light-ghost:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-light-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-light-ghost);
}

.list-hover.list .list-item-dark-ghost:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-dark-ghost) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-dark-ghost);
}
.list-hover.list .list-item-dark-ghost:not(.no-action):active, .list-hover.list .list-item-dark-ghost:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-dark-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-dark-ghost);
}

.list-hover.list .list-item-white-ghost:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-white-ghost) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-white-ghost);
}
.list-hover.list .list-item-white-ghost:not(.no-action):active, .list-hover.list .list-item-white-ghost:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-white-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-white-ghost);
}

.list-hover.list .list-item-black-ghost:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-black-ghost) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-black-ghost);
}
.list-hover.list .list-item-black-ghost:not(.no-action):active, .list-hover.list .list-item-black-ghost:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-black-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-black-ghost);
}

.list-item-hover.list-item-primary:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-primary) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-primary);
}
.list-item-hover.list-item-primary:not(.no-action):active, .list-item-hover.list-item-primary:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-primary) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-primary);
}

.list-item-hover.list-item-secondary:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-secondary) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-secondary);
}
.list-item-hover.list-item-secondary:not(.no-action):active, .list-item-hover.list-item-secondary:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-secondary) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-secondary);
}

.list-item-hover.list-item-tertiary:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-tertiary) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-tertiary);
}
.list-item-hover.list-item-tertiary:not(.no-action):active, .list-item-hover.list-item-tertiary:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-tertiary) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-tertiary);
}

.list-item-hover.list-item-success:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-success) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-success);
}
.list-item-hover.list-item-success:not(.no-action):active, .list-item-hover.list-item-success:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-success) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-success);
}

.list-item-hover.list-item-info:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-info) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-info);
}
.list-item-hover.list-item-info:not(.no-action):active, .list-item-hover.list-item-info:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-info) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-info);
}

.list-item-hover.list-item-warning:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-warning) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-warning);
}
.list-item-hover.list-item-warning:not(.no-action):active, .list-item-hover.list-item-warning:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-warning) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-warning);
}

.list-item-hover.list-item-danger:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-danger) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-danger);
}
.list-item-hover.list-item-danger:not(.no-action):active, .list-item-hover.list-item-danger:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-danger) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-danger);
}

.list-item-hover.list-item-neutral:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-neutral) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-neutral);
}
.list-item-hover.list-item-neutral:not(.no-action):active, .list-item-hover.list-item-neutral:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-neutral) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-neutral);
}

.list-item-hover.list-item-light:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-light) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-light);
}
.list-item-hover.list-item-light:not(.no-action):active, .list-item-hover.list-item-light:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-light) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-light);
}

.list-item-hover.list-item-dark:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-dark) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-dark);
}
.list-item-hover.list-item-dark:not(.no-action):active, .list-item-hover.list-item-dark:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-dark) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-dark);
}

.list-item-hover.list-item-white:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-white) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-white);
}
.list-item-hover.list-item-white:not(.no-action):active, .list-item-hover.list-item-white:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-white) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-white);
}

.list-item-hover.list-item-black:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-black) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-black);
}
.list-item-hover.list-item-black:not(.no-action):active, .list-item-hover.list-item-black:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-black) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-black);
}

.list-item-hover.list-item-primary-ghost:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-primary-ghost) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-primary-ghost);
}
.list-item-hover.list-item-primary-ghost:not(.no-action):active, .list-item-hover.list-item-primary-ghost:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-primary-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-primary-ghost);
}

.list-item-hover.list-item-secondary-ghost:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-secondary-ghost) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-secondary-ghost);
}
.list-item-hover.list-item-secondary-ghost:not(.no-action):active, .list-item-hover.list-item-secondary-ghost:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-secondary-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-secondary-ghost);
}

.list-item-hover.list-item-tertiary-ghost:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-tertiary-ghost) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-tertiary-ghost);
}
.list-item-hover.list-item-tertiary-ghost:not(.no-action):active, .list-item-hover.list-item-tertiary-ghost:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-tertiary-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-tertiary-ghost);
}

.list-item-hover.list-item-success-ghost:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-success-ghost) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-success-ghost);
}
.list-item-hover.list-item-success-ghost:not(.no-action):active, .list-item-hover.list-item-success-ghost:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-success-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-success-ghost);
}

.list-item-hover.list-item-info-ghost:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-info-ghost) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-info-ghost);
}
.list-item-hover.list-item-info-ghost:not(.no-action):active, .list-item-hover.list-item-info-ghost:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-info-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-info-ghost);
}

.list-item-hover.list-item-warning-ghost:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-warning-ghost) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-warning-ghost);
}
.list-item-hover.list-item-warning-ghost:not(.no-action):active, .list-item-hover.list-item-warning-ghost:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-warning-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-warning-ghost);
}

.list-item-hover.list-item-danger-ghost:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-danger-ghost) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-danger-ghost);
}
.list-item-hover.list-item-danger-ghost:not(.no-action):active, .list-item-hover.list-item-danger-ghost:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-danger-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-danger-ghost);
}

.list-item-hover.list-item-neutral-ghost:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-neutral-ghost) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-neutral-ghost);
}
.list-item-hover.list-item-neutral-ghost:not(.no-action):active, .list-item-hover.list-item-neutral-ghost:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-neutral-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-neutral-ghost);
}

.list-item-hover.list-item-light-ghost:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-light-ghost) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-light-ghost);
}
.list-item-hover.list-item-light-ghost:not(.no-action):active, .list-item-hover.list-item-light-ghost:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-light-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-light-ghost);
}

.list-item-hover.list-item-dark-ghost:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-dark-ghost) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-dark-ghost);
}
.list-item-hover.list-item-dark-ghost:not(.no-action):active, .list-item-hover.list-item-dark-ghost:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-dark-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-dark-ghost);
}

.list-item-hover.list-item-white-ghost:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-white-ghost) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-white-ghost);
}
.list-item-hover.list-item-white-ghost:not(.no-action):active, .list-item-hover.list-item-white-ghost:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-white-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-white-ghost);
}

.list-item-hover.list-item-black-ghost:not(.no-action):hover {
  background-color: color-mix(in srgb, var(--color-black-ghost) 15%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-black-ghost);
}
.list-item-hover.list-item-black-ghost:not(.no-action):active, .list-item-hover.list-item-black-ghost:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-black-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-black-ghost);
}

.list-item-primary:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-primary) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-primary);
}

.list-item-secondary:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-secondary) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-secondary);
}

.list-item-tertiary:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-tertiary) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-tertiary);
}

.list-item-success:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-success) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-success);
}

.list-item-info:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-info) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-info);
}

.list-item-warning:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-warning) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-warning);
}

.list-item-danger:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-danger) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-danger);
}

.list-item-neutral:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-neutral) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-neutral);
}

.list-item-light:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-light) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-light);
}

.list-item-dark:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-dark) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-dark);
}

.list-item-white:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-white) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-white);
}

.list-item-black:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-black) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-black);
}

.list-item-primary-ghost:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-primary-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-primary-ghost);
}

.list-item-secondary-ghost:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-secondary-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-secondary-ghost);
}

.list-item-tertiary-ghost:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-tertiary-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-tertiary-ghost);
}

.list-item-success-ghost:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-success-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-success-ghost);
}

.list-item-info-ghost:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-info-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-info-ghost);
}

.list-item-warning-ghost:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-warning-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-warning-ghost);
}

.list-item-danger-ghost:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-danger-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-danger-ghost);
}

.list-item-neutral-ghost:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-neutral-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-neutral-ghost);
}

.list-item-light-ghost:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-light-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-light-ghost);
}

.list-item-dark-ghost:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-dark-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-dark-ghost);
}

.list-item-white-ghost:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-white-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-white-ghost);
}

.list-item-black-ghost:not(.no-action).active {
  background-color: color-mix(in srgb, var(--color-black-ghost) 30%, transparent);
  box-shadow: inset var(--list-item-border-width-inside-hover) var(--list-item-shadow-inset-reduce) var(--color-black-ghost);
}

.navbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-inline: var(--navbar-padding-x);
  padding-block: var(--navbar-padding-y);
  border-radius: var(--navbar-border-radius);
  border-width: var(--navbar-border-width);
  border-style: var(--navbar-border-style);
  border-color: var(--navbar-border-color);
}

.navbar-toggle {
  display: none;
}

.navbar-body {
  display: flex;
  width: 100%;
  text-align: center;
}
.navbar-body.navbar-left, .navbar-body.navbar-start {
  justify-content: flex-start;
  align-items: flex-start;
}
.navbar-body.navbar-center {
  justify-content: center;
  align-items: center;
}
.navbar-body.navbar-right, .navbar-body.navbar-end {
  justify-content: flex-end;
  align-items: flex-end;
}

.navbar-collapse {
  display: flex;
  padding-block: var(--navbar-collapse-padding-y);
  padding-inline: var(--navbar-collapse-padding-x);
  gap: var(--navbar-collapse-gap);
}
.navbar-collapse.list > .list-item {
  align-self: center;
  border-radius: var(--list-border-radius);
}
.navbar-collapse.list > .list-item .list-link {
  align-self: center;
}

@media (max-width: 768px) {
  .navbar {
    flex-wrap: wrap;
  }
  .navbar .navbar-body {
    flex-direction: column;
  }
  .navbar .navbar-body.navbar-left-bp, .navbar .navbar-body.navbar-start-bp {
    justify-content: flex-start;
    align-items: flex-start;
  }
  .navbar .navbar-body.navbar-center-bp {
    justify-content: center;
    align-items: center;
  }
  .navbar .navbar-body.navbar-right-bp, .navbar .navbar-body.navbar-end-bp {
    justify-content: flex-end;
    align-items: flex-end;
  }
  .navbar .navbar-body[hidden] {
    display: none;
  }
  .navbar .navbar-toggle {
    display: block;
  }
  .navbar .navbar-collapse {
    padding-block: var(--navbar-collapse-padding-y);
    padding-inline: var(--navbar-collapse-padding-x);
    flex-direction: column;
  }
}

@media (max-width: 480px) {
  .navbar-xs {
    flex-wrap: wrap;
  }
  .navbar-xs .navbar-body {
    flex-direction: column;
  }
  .navbar-xs .navbar-body.navbar-left-bp, .navbar-xs .navbar-body.navbar-start-bp {
    justify-content: flex-start;
    align-items: flex-start;
  }
  .navbar-xs .navbar-body.navbar-center-bp {
    justify-content: center;
    align-items: center;
  }
  .navbar-xs .navbar-body.navbar-right-bp, .navbar-xs .navbar-body.navbar-end-bp {
    justify-content: flex-end;
    align-items: flex-end;
  }
  .navbar-xs .navbar-body[hidden] {
    display: none;
  }
  .navbar-xs .navbar-toggle {
    display: block;
  }
  .navbar-xs .navbar-collapse {
    padding-block: var(--navbar-collapse-padding-y);
    padding-inline: var(--navbar-collapse-padding-x);
    flex-direction: column;
  }
}

@media (max-width: 640px) {
  .navbar-sm {
    flex-wrap: wrap;
  }
  .navbar-sm .navbar-body {
    flex-direction: column;
  }
  .navbar-sm .navbar-body.navbar-left-bp, .navbar-sm .navbar-body.navbar-start-bp {
    justify-content: flex-start;
    align-items: flex-start;
  }
  .navbar-sm .navbar-body.navbar-center-bp {
    justify-content: center;
    align-items: center;
  }
  .navbar-sm .navbar-body.navbar-right-bp, .navbar-sm .navbar-body.navbar-end-bp {
    justify-content: flex-end;
    align-items: flex-end;
  }
  .navbar-sm .navbar-body[hidden] {
    display: none;
  }
  .navbar-sm .navbar-toggle {
    display: block;
  }
  .navbar-sm .navbar-collapse {
    padding-block: var(--navbar-collapse-padding-y);
    padding-inline: var(--navbar-collapse-padding-x);
    flex-direction: column;
  }
}

@media (max-width: 768px) {
  .navbar-md {
    flex-wrap: wrap;
  }
  .navbar-md .navbar-body {
    flex-direction: column;
  }
  .navbar-md .navbar-body.navbar-left-bp, .navbar-md .navbar-body.navbar-start-bp {
    justify-content: flex-start;
    align-items: flex-start;
  }
  .navbar-md .navbar-body.navbar-center-bp {
    justify-content: center;
    align-items: center;
  }
  .navbar-md .navbar-body.navbar-right-bp, .navbar-md .navbar-body.navbar-end-bp {
    justify-content: flex-end;
    align-items: flex-end;
  }
  .navbar-md .navbar-body[hidden] {
    display: none;
  }
  .navbar-md .navbar-toggle {
    display: block;
  }
  .navbar-md .navbar-collapse {
    padding-block: var(--navbar-collapse-padding-y);
    padding-inline: var(--navbar-collapse-padding-x);
    flex-direction: column;
  }
}

@media (max-width: 1024px) {
  .navbar-lg {
    flex-wrap: wrap;
  }
  .navbar-lg .navbar-body {
    flex-direction: column;
  }
  .navbar-lg .navbar-body.navbar-left-bp, .navbar-lg .navbar-body.navbar-start-bp {
    justify-content: flex-start;
    align-items: flex-start;
  }
  .navbar-lg .navbar-body.navbar-center-bp {
    justify-content: center;
    align-items: center;
  }
  .navbar-lg .navbar-body.navbar-right-bp, .navbar-lg .navbar-body.navbar-end-bp {
    justify-content: flex-end;
    align-items: flex-end;
  }
  .navbar-lg .navbar-body[hidden] {
    display: none;
  }
  .navbar-lg .navbar-toggle {
    display: block;
  }
  .navbar-lg .navbar-collapse {
    padding-block: var(--navbar-collapse-padding-y);
    padding-inline: var(--navbar-collapse-padding-x);
    flex-direction: column;
  }
}

@media (max-width: 1280px) {
  .navbar-xl {
    flex-wrap: wrap;
  }
  .navbar-xl .navbar-body {
    flex-direction: column;
  }
  .navbar-xl .navbar-body.navbar-left-bp, .navbar-xl .navbar-body.navbar-start-bp {
    justify-content: flex-start;
    align-items: flex-start;
  }
  .navbar-xl .navbar-body.navbar-center-bp {
    justify-content: center;
    align-items: center;
  }
  .navbar-xl .navbar-body.navbar-right-bp, .navbar-xl .navbar-body.navbar-end-bp {
    justify-content: flex-end;
    align-items: flex-end;
  }
  .navbar-xl .navbar-body[hidden] {
    display: none;
  }
  .navbar-xl .navbar-toggle {
    display: block;
  }
  .navbar-xl .navbar-collapse {
    padding-block: var(--navbar-collapse-padding-y);
    padding-inline: var(--navbar-collapse-padding-x);
    flex-direction: column;
  }
}

@media (max-width: 1536px) {
  .navbar-xxl {
    flex-wrap: wrap;
  }
  .navbar-xxl .navbar-body {
    flex-direction: column;
  }
  .navbar-xxl .navbar-body.navbar-left-bp, .navbar-xxl .navbar-body.navbar-start-bp {
    justify-content: flex-start;
    align-items: flex-start;
  }
  .navbar-xxl .navbar-body.navbar-center-bp {
    justify-content: center;
    align-items: center;
  }
  .navbar-xxl .navbar-body.navbar-right-bp, .navbar-xxl .navbar-body.navbar-end-bp {
    justify-content: flex-end;
    align-items: flex-end;
  }
  .navbar-xxl .navbar-body[hidden] {
    display: none;
  }
  .navbar-xxl .navbar-toggle {
    display: block;
  }
  .navbar-xxl .navbar-collapse {
    padding-block: var(--navbar-collapse-padding-y);
    padding-inline: var(--navbar-collapse-padding-x);
    flex-direction: column;
  }
}

.outline {
  background-color: transparent;
  color: var(--text-color);
  border-color: var(--text-color);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}

.outline-primary {
  background-color: transparent;
  color: var(--color-primary);
  border-color: var(--color-primary);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}

.outline-secondary {
  background-color: transparent;
  color: var(--color-secondary);
  border-color: var(--color-secondary);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}

.outline-tertiary {
  background-color: transparent;
  color: var(--color-tertiary);
  border-color: var(--color-tertiary);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}

.outline-success {
  background-color: transparent;
  color: var(--color-success);
  border-color: var(--color-success);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}

.outline-info {
  background-color: transparent;
  color: var(--color-info);
  border-color: var(--color-info);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}

.outline-warning {
  background-color: transparent;
  color: var(--color-warning);
  border-color: var(--color-warning);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}

.outline-danger {
  background-color: transparent;
  color: var(--color-danger);
  border-color: var(--color-danger);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}

.outline-neutral {
  background-color: transparent;
  color: var(--color-neutral);
  border-color: var(--color-neutral);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}

.outline-light {
  background-color: transparent;
  color: var(--color-light);
  border-color: var(--color-light);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}

.outline-dark {
  background-color: transparent;
  color: var(--color-dark);
  border-color: var(--color-dark);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}

.outline-white {
  background-color: transparent;
  color: var(--color-white);
  border-color: var(--color-white);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}

.outline-black {
  background-color: transparent;
  color: var(--color-black);
  border-color: var(--color-black);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}

.outline-primary-ghost {
  background-color: transparent;
  color: var(--color-primary-ghost);
  border-color: var(--color-primary-ghost);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}

.outline-secondary-ghost {
  background-color: transparent;
  color: var(--color-secondary-ghost);
  border-color: var(--color-secondary-ghost);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}

.outline-tertiary-ghost {
  background-color: transparent;
  color: var(--color-tertiary-ghost);
  border-color: var(--color-tertiary-ghost);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}

.outline-success-ghost {
  background-color: transparent;
  color: var(--color-success-ghost);
  border-color: var(--color-success-ghost);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}

.outline-info-ghost {
  background-color: transparent;
  color: var(--color-info-ghost);
  border-color: var(--color-info-ghost);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}

.outline-warning-ghost {
  background-color: transparent;
  color: var(--color-warning-ghost);
  border-color: var(--color-warning-ghost);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}

.outline-danger-ghost {
  background-color: transparent;
  color: var(--color-danger-ghost);
  border-color: var(--color-danger-ghost);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}

.outline-neutral-ghost {
  background-color: transparent;
  color: var(--color-neutral-ghost);
  border-color: var(--color-neutral-ghost);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}

.outline-light-ghost {
  background-color: transparent;
  color: var(--color-light-ghost);
  border-color: var(--color-light-ghost);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}

.outline-dark-ghost {
  background-color: transparent;
  color: var(--color-dark-ghost);
  border-color: var(--color-dark-ghost);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}

.outline-white-ghost {
  background-color: transparent;
  color: var(--color-white-ghost);
  border-color: var(--color-white-ghost);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}

.outline-black-ghost {
  background-color: transparent;
  color: var(--color-black-ghost);
  border-color: var(--color-black-ghost);
  border-style: var(--border-style-outline);
  border-width: var(--border-width-outline);
}

.sidebar {
  top: 0;
  bottom: 0;
  position: fixed;
  overflow-y: auto;
  z-index: 1000;
  background-color: var(--sidebar-background-color);
  padding-inline: var(--sidebar-padding-x);
  padding-block: var(--sidebar-padding-y);
  width: var(--sidebar-width);
  transition: transform 0.2s ease;
}
.sidebar.sidebar-left {
  left: 0;
  border-right: var(--sidebar-border-color) var(--sidebar-border-style) var(--sidebar-border-width);
  border-top-right-radius: var(--sidebar-border-radius);
  border-bottom-right-radius: var(--sidebar-border-radius);
  transform: translateX(-100%);
}
.sidebar.sidebar-left.hide {
  transform: translateX(-100%);
}
.sidebar.sidebar-right {
  right: 0;
  border-left: var(--sidebar-border-color) var(--sidebar-border-style) var(--sidebar-border-width);
  border-top-left-radius: var(--sidebar-border-radius);
  border-bottom-left-radius: var(--sidebar-border-radius);
  transform: translateX(100%);
}
.sidebar.sidebar-right.hide {
  transform: translateX(100%);
}
.sidebar.show {
  transform: translateX(0);
}

.sidebar-fixed {
  top: 0;
  bottom: 0;
  position: fixed;
  overflow-y: auto;
  z-index: 1000;
  background-color: var(--sidebar-background-color);
  padding-inline: var(--sidebar-padding-x);
  padding-block: var(--sidebar-padding-y);
  width: var(--sidebar-width);
}
.sidebar-fixed.sidebar-left {
  left: 0;
  border-right: var(--sidebar-border-color) var(--sidebar-border-style) var(--sidebar-border-width);
  border-top-right-radius: var(--sidebar-border-radius);
  border-bottom-right-radius: var(--sidebar-border-radius);
}
.sidebar-fixed.sidebar-right {
  right: 0;
  border-left: var(--sidebar-border-color) var(--sidebar-border-style) var(--sidebar-border-width);
  border-top-left-radius: var(--sidebar-border-radius);
  border-bottom-left-radius: var(--sidebar-border-radius);
}

.sidebar-compact {
  top: 0;
  bottom: 0;
  position: fixed;
  overflow-y: auto;
  z-index: 1000;
  background-color: var(--sidebar-background-color);
  padding-inline: var(--sidebar-padding-x);
  padding-block: var(--sidebar-padding-y);
  width: var(--sidebar-compact-width);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  transition: width 0.2s ease;
}
.sidebar-compact .sidebar-item {
  display: flex;
  justify-content: center;
  gap: var(--sidebar-compact-gap);
}
.sidebar-compact.sidebar-left {
  left: 0;
  border-right: var(--sidebar-border-color) var(--sidebar-border-style) var(--sidebar-border-width);
  border-top-right-radius: var(--sidebar-border-radius);
  border-bottom-right-radius: var(--sidebar-border-radius);
}
.sidebar-compact.sidebar-right {
  right: 0;
  border-left: var(--sidebar-border-color) var(--sidebar-border-style) var(--sidebar-border-width);
  border-top-left-radius: var(--sidebar-border-radius);
  border-bottom-left-radius: var(--sidebar-border-radius);
}
.sidebar-compact.hide, .sidebar-compact[hidden] {
  width: var(--sidebar-compact-width-reduce);
}
.sidebar-compact.show {
  width: var(--sidebar-compact-width);
}

.sidebar-item {
  overflow-x: hidden;
}

.sidebar-item.hide {
  justify-content: center;
}
.sidebar-item.hide .sidebar-text {
  display: none;
}

.sidebar-item.show {
  justify-content: flex-start;
}
.sidebar-item.show .sidebar-text {
  display: block;
}

body:has(.sidebar.sidebar-shift),
body:has(.sidebar-compact.sidebar-shift) {
  transition: margin-left 0.2s ease, margin-right 0.2s ease;
}

body:has(.sidebar-compact.sidebar-left.sidebar-shift.show) {
  margin-left: var(--sidebar-compact-width);
}

body:has(.sidebar-compact.sidebar-left.sidebar-shift.hide) {
  margin-left: var(--sidebar-compact-width-reduce);
}

body:has(.sidebar-compact.sidebar-right.sidebar-shift.show) {
  margin-right: var(--sidebar-compact-width);
}

body:has(.sidebar-compact.sidebar-right.sidebar-shift.hide) {
  margin-right: var(--sidebar-compact-width-reduce);
}

body:has(.sidebar-compact.sidebar-left):not(:has(.sidebar-compact.sidebar-left.sidebar-shift)) {
  margin-left: var(--sidebar-compact-width-reduce);
}

body:has(.sidebar-compact.sidebar-right):not(:has(.sidebar-compact.sidebar-right.sidebar-shift)) {
  margin-right: var(--sidebar-compact-width-reduce);
}

body:has(.sidebar.sidebar-shift.sidebar-left.show) {
  margin-left: var(--sidebar-width);
}

body:has(.sidebar.sidebar-shift.sidebar-right.show) {
  margin-right: var(--sidebar-width);
}

body:has(.sidebar-fixed.sidebar-left) {
  margin-left: var(--sidebar-width);
}

body:has(.sidebar-fixed.sidebar-right) {
  margin-right: var(--sidebar-width);
}

[data-ui=tab-panel] {
  display: none;
}
[data-ui=tab-panel].show {
  display: block;
}

.tab-panel {
  border-color: var(--tab-panel-border-color);
  border-style: var(--tab-panel-border-style);
  border-width: var(--tab-panel-border-width);
  border-radius: var(--tab-panel-border-radius);
  padding-block: var(--tab-panel-padding-y);
  padding-inline: var(--tab-panel-padding-x);
}

table.table {
  border-width: var(--table-border-width);
  border-style: var(--table-border-style);
  border-color: var(--table-border-color);
  border-collapse: collapse;
  width: 100%;
}
table.table thead tr th, table.table thead tr td {
  border-top: var(--table-border-width) var(--table-border-style) var(--table-border-color);
  padding-block: var(--table-padding-y);
  padding-inline: var(--table-padding-x);
}
table.table tbody tr th, table.table tbody tr td {
  border-top: var(--table-border-width) var(--table-border-style) var(--table-border-color);
  padding-block: var(--table-padding-y);
  padding-inline: var(--table-padding-x);
}
table.table tfoot tr th, table.table tfoot tr td {
  border-top: var(--table-border-width) var(--table-border-style) var(--table-border-color);
  padding-block: var(--table-padding-y);
  padding-inline: var(--table-padding-x);
}
table.table.table-borderless {
  border: none;
}
table.table.table-borderless thead tr th, table.table.table-borderless thead tr td,
table.table.table-borderless tbody tr th,
table.table.table-borderless tbody tr td,
table.table.table-borderless tfoot tr th,
table.table.table-borderless tfoot tr td {
  border: none;
}
table.table.table-bordered thead tr th, table.table.table-bordered thead tr td,
table.table.table-bordered tbody tr th,
table.table.table-bordered tbody tr td,
table.table.table-bordered tfoot tr th,
table.table.table-bordered tfoot tr td {
  border: var(--table-border-width) var(--table-border-style) var(--table-border-color);
}

table.table-sm thead tr th, table.table-sm thead tr td,
table.table-sm tbody tr th,
table.table-sm tbody tr td,
table.table-sm tfoot tr th,
table.table-sm tfoot tr td {
  padding-block: var(--table-padding-y-sm);
  padding-inline: var(--table-padding-x-sm);
}

table.table-md thead tr th, table.table-md thead tr td,
table.table-md tbody tr th,
table.table-md tbody tr td,
table.table-md tfoot tr th,
table.table-md tfoot tr td {
  padding-block: var(--table-padding-y-md);
  padding-inline: var(--table-padding-x-md);
}

table.table-lg thead tr th, table.table-lg thead tr td,
table.table-lg tbody tr th,
table.table-lg tbody tr td,
table.table-lg tfoot tr th,
table.table-lg tfoot tr td {
  padding-block: var(--table-padding-y-lg);
  padding-inline: var(--table-padding-x-lg);
}

.table-group-divider > tr:first-child {
  border-top: var(--table-border-divider-width) var(--table-border-divider-style) var(--table-border-divider-color);
}

.table-responsive {
  overflow-x: auto;
}

@layer table-l01, table-l02, table-l03, table-l04, table-l05, table-l06, table-l07, table-l08, table-l09, table-l10, table-l11, table-l12;
@layer table-l01 {
  .table-striped tbody tr:nth-child(even) {
    box-shadow: inset 0 0 0 9999px var(--table-striped-background-color);
  }
  .table-striped-odd tbody tr:nth-child(odd) {
    box-shadow: inset 0 0 0 9999px var(--table-striped-background-color);
  }
  .table-striped-column tbody tr th:nth-child(even),
  .table-striped-column tbody tr td:nth-child(even) {
    box-shadow: inset 0 0 0 9999px var(--table-striped-background-color);
  }
  .table-striped-column-odd tbody tr th:nth-child(odd),
  .table-striped-column-odd tbody tr td:nth-child(odd) {
    box-shadow: inset 0 0 0 9999px var(--table-striped-background-color);
  }
}
@layer table-l02 {
  table.table-hover tbody tr:hover {
    box-shadow: inset 0 0 0 9999px var(--table-hover-background-color);
  }
  table.table-hover tbody tr:active,
  table.table-hover tbody tr.active {
    box-shadow: inset 0 0 0 9999px var(--table-active-background-color);
  }
}
@layer table-l03 {
  thead.table-hover tr:hover,
  tbody.table-hover tr:hover,
  tfoot.table-hover tr:hover {
    box-shadow: inset 0 0 0 9999px var(--table-hover-background-color);
  }
  thead.table-hover tr:active,
  thead.table-hover tr.active,
  tbody.table-hover tr:active,
  tbody.table-hover tr.active,
  tfoot.table-hover tr:active,
  tfoot.table-hover tr.active {
    box-shadow: inset 0 0 0 9999px var(--table-active-background-color);
  }
}
@layer table-l04 {
  tr.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--table-hover-background-color);
  }
  tr.table-hover:active,
  tr.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--table-active-background-color);
  }
}
@layer table-l05 {
  th.table-hover:hover,
  td.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--table-hover-background-color);
  }
  th.table-hover:active,
  td.table-hover:active,
  th.table-hover.active,
  td.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--table-active-background-color);
  }
}
@layer table-l06 {
  table.table-primary {
    background-color: var(--color-primary);
    color: var(--content-on-primary);
  }
  table.table-primary.table-hover tbody tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-primary);
  }
  table.table-primary.table-hover tbody tr:active,
  table.table-primary.table-hover tbody tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-primary);
  }
  table.table-secondary {
    background-color: var(--color-secondary);
    color: var(--content-on-secondary);
  }
  table.table-secondary.table-hover tbody tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-secondary);
  }
  table.table-secondary.table-hover tbody tr:active,
  table.table-secondary.table-hover tbody tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-secondary);
  }
  table.table-tertiary {
    background-color: var(--color-tertiary);
    color: var(--content-on-tertiary);
  }
  table.table-tertiary.table-hover tbody tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-tertiary);
  }
  table.table-tertiary.table-hover tbody tr:active,
  table.table-tertiary.table-hover tbody tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-tertiary);
  }
  table.table-success {
    background-color: var(--color-success);
    color: var(--content-on-success);
  }
  table.table-success.table-hover tbody tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-success);
  }
  table.table-success.table-hover tbody tr:active,
  table.table-success.table-hover tbody tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-success);
  }
  table.table-info {
    background-color: var(--color-info);
    color: var(--content-on-info);
  }
  table.table-info.table-hover tbody tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-info);
  }
  table.table-info.table-hover tbody tr:active,
  table.table-info.table-hover tbody tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-info);
  }
  table.table-warning {
    background-color: var(--color-warning);
    color: var(--content-on-warning);
  }
  table.table-warning.table-hover tbody tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-warning);
  }
  table.table-warning.table-hover tbody tr:active,
  table.table-warning.table-hover tbody tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-warning);
  }
  table.table-danger {
    background-color: var(--color-danger);
    color: var(--content-on-danger);
  }
  table.table-danger.table-hover tbody tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-danger);
  }
  table.table-danger.table-hover tbody tr:active,
  table.table-danger.table-hover tbody tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-danger);
  }
  table.table-neutral {
    background-color: var(--color-neutral);
    color: var(--content-on-neutral);
  }
  table.table-neutral.table-hover tbody tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-neutral);
  }
  table.table-neutral.table-hover tbody tr:active,
  table.table-neutral.table-hover tbody tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-neutral);
  }
  table.table-light {
    background-color: var(--color-light);
    color: var(--content-on-light);
  }
  table.table-light.table-hover tbody tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-light);
  }
  table.table-light.table-hover tbody tr:active,
  table.table-light.table-hover tbody tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-light);
  }
  table.table-dark {
    background-color: var(--color-dark);
    color: var(--content-on-dark);
  }
  table.table-dark.table-hover tbody tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-dark);
  }
  table.table-dark.table-hover tbody tr:active,
  table.table-dark.table-hover tbody tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-dark);
  }
  table.table-white {
    background-color: var(--color-white);
    color: var(--content-on-white);
  }
  table.table-white.table-hover tbody tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-white);
  }
  table.table-white.table-hover tbody tr:active,
  table.table-white.table-hover tbody tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-white);
  }
  table.table-black {
    background-color: var(--color-black);
    color: var(--content-on-black);
  }
  table.table-black.table-hover tbody tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-black);
  }
  table.table-black.table-hover tbody tr:active,
  table.table-black.table-hover tbody tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-black);
  }
  table.table-primary-ghost {
    background-color: var(--color-primary-ghost);
    color: var(--content-on-primary-ghost);
  }
  table.table-primary-ghost.table-hover tbody tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-primary-ghost);
  }
  table.table-primary-ghost.table-hover tbody tr:active,
  table.table-primary-ghost.table-hover tbody tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-primary-ghost);
  }
  table.table-secondary-ghost {
    background-color: var(--color-secondary-ghost);
    color: var(--content-on-secondary-ghost);
  }
  table.table-secondary-ghost.table-hover tbody tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-secondary-ghost);
  }
  table.table-secondary-ghost.table-hover tbody tr:active,
  table.table-secondary-ghost.table-hover tbody tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-secondary-ghost);
  }
  table.table-tertiary-ghost {
    background-color: var(--color-tertiary-ghost);
    color: var(--content-on-tertiary-ghost);
  }
  table.table-tertiary-ghost.table-hover tbody tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-tertiary-ghost);
  }
  table.table-tertiary-ghost.table-hover tbody tr:active,
  table.table-tertiary-ghost.table-hover tbody tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-tertiary-ghost);
  }
  table.table-success-ghost {
    background-color: var(--color-success-ghost);
    color: var(--content-on-success-ghost);
  }
  table.table-success-ghost.table-hover tbody tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-success-ghost);
  }
  table.table-success-ghost.table-hover tbody tr:active,
  table.table-success-ghost.table-hover tbody tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-success-ghost);
  }
  table.table-info-ghost {
    background-color: var(--color-info-ghost);
    color: var(--content-on-info-ghost);
  }
  table.table-info-ghost.table-hover tbody tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-info-ghost);
  }
  table.table-info-ghost.table-hover tbody tr:active,
  table.table-info-ghost.table-hover tbody tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-info-ghost);
  }
  table.table-warning-ghost {
    background-color: var(--color-warning-ghost);
    color: var(--content-on-warning-ghost);
  }
  table.table-warning-ghost.table-hover tbody tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-warning-ghost);
  }
  table.table-warning-ghost.table-hover tbody tr:active,
  table.table-warning-ghost.table-hover tbody tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-warning-ghost);
  }
  table.table-danger-ghost {
    background-color: var(--color-danger-ghost);
    color: var(--content-on-danger-ghost);
  }
  table.table-danger-ghost.table-hover tbody tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-danger-ghost);
  }
  table.table-danger-ghost.table-hover tbody tr:active,
  table.table-danger-ghost.table-hover tbody tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-danger-ghost);
  }
  table.table-neutral-ghost {
    background-color: var(--color-neutral-ghost);
    color: var(--content-on-neutral-ghost);
  }
  table.table-neutral-ghost.table-hover tbody tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-neutral-ghost);
  }
  table.table-neutral-ghost.table-hover tbody tr:active,
  table.table-neutral-ghost.table-hover tbody tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-neutral-ghost);
  }
  table.table-light-ghost {
    background-color: var(--color-light-ghost);
    color: var(--content-on-light-ghost);
  }
  table.table-light-ghost.table-hover tbody tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-light-ghost);
  }
  table.table-light-ghost.table-hover tbody tr:active,
  table.table-light-ghost.table-hover tbody tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-light-ghost);
  }
  table.table-dark-ghost {
    background-color: var(--color-dark-ghost);
    color: var(--content-on-dark-ghost);
  }
  table.table-dark-ghost.table-hover tbody tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-dark-ghost);
  }
  table.table-dark-ghost.table-hover tbody tr:active,
  table.table-dark-ghost.table-hover tbody tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-dark-ghost);
  }
  table.table-white-ghost {
    background-color: var(--color-white-ghost);
    color: var(--content-on-white-ghost);
  }
  table.table-white-ghost.table-hover tbody tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-white-ghost);
  }
  table.table-white-ghost.table-hover tbody tr:active,
  table.table-white-ghost.table-hover tbody tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-white-ghost);
  }
  table.table-black-ghost {
    background-color: var(--color-black-ghost);
    color: var(--content-on-black-ghost);
  }
  table.table-black-ghost.table-hover tbody tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-black-ghost);
  }
  table.table-black-ghost.table-hover tbody tr:active,
  table.table-black-ghost.table-hover tbody tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-black-ghost);
  }
}
@layer table-l07 {
  .table-hover tbody.table-primary {
    background-color: var(--color-primary);
    color: var(--content-on-primary);
  }
  .table-hover tbody.table-primary tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-primary);
  }
  .table-hover tbody.table-primary tr:active,
  .table-hover tbody.table-primary tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-primary);
  }
  .table-hover tbody.table-secondary {
    background-color: var(--color-secondary);
    color: var(--content-on-secondary);
  }
  .table-hover tbody.table-secondary tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-secondary);
  }
  .table-hover tbody.table-secondary tr:active,
  .table-hover tbody.table-secondary tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-secondary);
  }
  .table-hover tbody.table-tertiary {
    background-color: var(--color-tertiary);
    color: var(--content-on-tertiary);
  }
  .table-hover tbody.table-tertiary tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-tertiary);
  }
  .table-hover tbody.table-tertiary tr:active,
  .table-hover tbody.table-tertiary tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-tertiary);
  }
  .table-hover tbody.table-success {
    background-color: var(--color-success);
    color: var(--content-on-success);
  }
  .table-hover tbody.table-success tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-success);
  }
  .table-hover tbody.table-success tr:active,
  .table-hover tbody.table-success tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-success);
  }
  .table-hover tbody.table-info {
    background-color: var(--color-info);
    color: var(--content-on-info);
  }
  .table-hover tbody.table-info tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-info);
  }
  .table-hover tbody.table-info tr:active,
  .table-hover tbody.table-info tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-info);
  }
  .table-hover tbody.table-warning {
    background-color: var(--color-warning);
    color: var(--content-on-warning);
  }
  .table-hover tbody.table-warning tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-warning);
  }
  .table-hover tbody.table-warning tr:active,
  .table-hover tbody.table-warning tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-warning);
  }
  .table-hover tbody.table-danger {
    background-color: var(--color-danger);
    color: var(--content-on-danger);
  }
  .table-hover tbody.table-danger tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-danger);
  }
  .table-hover tbody.table-danger tr:active,
  .table-hover tbody.table-danger tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-danger);
  }
  .table-hover tbody.table-neutral {
    background-color: var(--color-neutral);
    color: var(--content-on-neutral);
  }
  .table-hover tbody.table-neutral tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-neutral);
  }
  .table-hover tbody.table-neutral tr:active,
  .table-hover tbody.table-neutral tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-neutral);
  }
  .table-hover tbody.table-light {
    background-color: var(--color-light);
    color: var(--content-on-light);
  }
  .table-hover tbody.table-light tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-light);
  }
  .table-hover tbody.table-light tr:active,
  .table-hover tbody.table-light tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-light);
  }
  .table-hover tbody.table-dark {
    background-color: var(--color-dark);
    color: var(--content-on-dark);
  }
  .table-hover tbody.table-dark tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-dark);
  }
  .table-hover tbody.table-dark tr:active,
  .table-hover tbody.table-dark tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-dark);
  }
  .table-hover tbody.table-white {
    background-color: var(--color-white);
    color: var(--content-on-white);
  }
  .table-hover tbody.table-white tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-white);
  }
  .table-hover tbody.table-white tr:active,
  .table-hover tbody.table-white tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-white);
  }
  .table-hover tbody.table-black {
    background-color: var(--color-black);
    color: var(--content-on-black);
  }
  .table-hover tbody.table-black tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-black);
  }
  .table-hover tbody.table-black tr:active,
  .table-hover tbody.table-black tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-black);
  }
  .table-hover tbody.table-primary-ghost {
    background-color: var(--color-primary-ghost);
    color: var(--content-on-primary-ghost);
  }
  .table-hover tbody.table-primary-ghost tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-primary-ghost);
  }
  .table-hover tbody.table-primary-ghost tr:active,
  .table-hover tbody.table-primary-ghost tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-primary-ghost);
  }
  .table-hover tbody.table-secondary-ghost {
    background-color: var(--color-secondary-ghost);
    color: var(--content-on-secondary-ghost);
  }
  .table-hover tbody.table-secondary-ghost tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-secondary-ghost);
  }
  .table-hover tbody.table-secondary-ghost tr:active,
  .table-hover tbody.table-secondary-ghost tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-secondary-ghost);
  }
  .table-hover tbody.table-tertiary-ghost {
    background-color: var(--color-tertiary-ghost);
    color: var(--content-on-tertiary-ghost);
  }
  .table-hover tbody.table-tertiary-ghost tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-tertiary-ghost);
  }
  .table-hover tbody.table-tertiary-ghost tr:active,
  .table-hover tbody.table-tertiary-ghost tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-tertiary-ghost);
  }
  .table-hover tbody.table-success-ghost {
    background-color: var(--color-success-ghost);
    color: var(--content-on-success-ghost);
  }
  .table-hover tbody.table-success-ghost tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-success-ghost);
  }
  .table-hover tbody.table-success-ghost tr:active,
  .table-hover tbody.table-success-ghost tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-success-ghost);
  }
  .table-hover tbody.table-info-ghost {
    background-color: var(--color-info-ghost);
    color: var(--content-on-info-ghost);
  }
  .table-hover tbody.table-info-ghost tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-info-ghost);
  }
  .table-hover tbody.table-info-ghost tr:active,
  .table-hover tbody.table-info-ghost tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-info-ghost);
  }
  .table-hover tbody.table-warning-ghost {
    background-color: var(--color-warning-ghost);
    color: var(--content-on-warning-ghost);
  }
  .table-hover tbody.table-warning-ghost tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-warning-ghost);
  }
  .table-hover tbody.table-warning-ghost tr:active,
  .table-hover tbody.table-warning-ghost tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-warning-ghost);
  }
  .table-hover tbody.table-danger-ghost {
    background-color: var(--color-danger-ghost);
    color: var(--content-on-danger-ghost);
  }
  .table-hover tbody.table-danger-ghost tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-danger-ghost);
  }
  .table-hover tbody.table-danger-ghost tr:active,
  .table-hover tbody.table-danger-ghost tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-danger-ghost);
  }
  .table-hover tbody.table-neutral-ghost {
    background-color: var(--color-neutral-ghost);
    color: var(--content-on-neutral-ghost);
  }
  .table-hover tbody.table-neutral-ghost tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-neutral-ghost);
  }
  .table-hover tbody.table-neutral-ghost tr:active,
  .table-hover tbody.table-neutral-ghost tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-neutral-ghost);
  }
  .table-hover tbody.table-light-ghost {
    background-color: var(--color-light-ghost);
    color: var(--content-on-light-ghost);
  }
  .table-hover tbody.table-light-ghost tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-light-ghost);
  }
  .table-hover tbody.table-light-ghost tr:active,
  .table-hover tbody.table-light-ghost tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-light-ghost);
  }
  .table-hover tbody.table-dark-ghost {
    background-color: var(--color-dark-ghost);
    color: var(--content-on-dark-ghost);
  }
  .table-hover tbody.table-dark-ghost tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-dark-ghost);
  }
  .table-hover tbody.table-dark-ghost tr:active,
  .table-hover tbody.table-dark-ghost tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-dark-ghost);
  }
  .table-hover tbody.table-white-ghost {
    background-color: var(--color-white-ghost);
    color: var(--content-on-white-ghost);
  }
  .table-hover tbody.table-white-ghost tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-white-ghost);
  }
  .table-hover tbody.table-white-ghost tr:active,
  .table-hover tbody.table-white-ghost tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-white-ghost);
  }
  .table-hover tbody.table-black-ghost {
    background-color: var(--color-black-ghost);
    color: var(--content-on-black-ghost);
  }
  .table-hover tbody.table-black-ghost tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-black-ghost);
  }
  .table-hover tbody.table-black-ghost tr:active,
  .table-hover tbody.table-black-ghost tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-black-ghost);
  }
}
@layer table-l08 {
  thead.table-primary,
  tbody.table-primary,
  tfoot.table-primary {
    background-color: var(--color-primary);
    color: var(--content-on-primary);
  }
  thead.table-primary.table-hover tr:hover,
  tbody.table-primary.table-hover tr:hover,
  tfoot.table-primary.table-hover tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-primary);
  }
  thead.table-primary.table-hover tr:active, thead.table-primary.table-hover tr.active,
  tbody.table-primary.table-hover tr:active,
  tbody.table-primary.table-hover tr.active,
  tfoot.table-primary.table-hover tr:active,
  tfoot.table-primary.table-hover tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-primary);
  }
  thead.table-secondary,
  tbody.table-secondary,
  tfoot.table-secondary {
    background-color: var(--color-secondary);
    color: var(--content-on-secondary);
  }
  thead.table-secondary.table-hover tr:hover,
  tbody.table-secondary.table-hover tr:hover,
  tfoot.table-secondary.table-hover tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-secondary);
  }
  thead.table-secondary.table-hover tr:active, thead.table-secondary.table-hover tr.active,
  tbody.table-secondary.table-hover tr:active,
  tbody.table-secondary.table-hover tr.active,
  tfoot.table-secondary.table-hover tr:active,
  tfoot.table-secondary.table-hover tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-secondary);
  }
  thead.table-tertiary,
  tbody.table-tertiary,
  tfoot.table-tertiary {
    background-color: var(--color-tertiary);
    color: var(--content-on-tertiary);
  }
  thead.table-tertiary.table-hover tr:hover,
  tbody.table-tertiary.table-hover tr:hover,
  tfoot.table-tertiary.table-hover tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-tertiary);
  }
  thead.table-tertiary.table-hover tr:active, thead.table-tertiary.table-hover tr.active,
  tbody.table-tertiary.table-hover tr:active,
  tbody.table-tertiary.table-hover tr.active,
  tfoot.table-tertiary.table-hover tr:active,
  tfoot.table-tertiary.table-hover tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-tertiary);
  }
  thead.table-success,
  tbody.table-success,
  tfoot.table-success {
    background-color: var(--color-success);
    color: var(--content-on-success);
  }
  thead.table-success.table-hover tr:hover,
  tbody.table-success.table-hover tr:hover,
  tfoot.table-success.table-hover tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-success);
  }
  thead.table-success.table-hover tr:active, thead.table-success.table-hover tr.active,
  tbody.table-success.table-hover tr:active,
  tbody.table-success.table-hover tr.active,
  tfoot.table-success.table-hover tr:active,
  tfoot.table-success.table-hover tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-success);
  }
  thead.table-info,
  tbody.table-info,
  tfoot.table-info {
    background-color: var(--color-info);
    color: var(--content-on-info);
  }
  thead.table-info.table-hover tr:hover,
  tbody.table-info.table-hover tr:hover,
  tfoot.table-info.table-hover tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-info);
  }
  thead.table-info.table-hover tr:active, thead.table-info.table-hover tr.active,
  tbody.table-info.table-hover tr:active,
  tbody.table-info.table-hover tr.active,
  tfoot.table-info.table-hover tr:active,
  tfoot.table-info.table-hover tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-info);
  }
  thead.table-warning,
  tbody.table-warning,
  tfoot.table-warning {
    background-color: var(--color-warning);
    color: var(--content-on-warning);
  }
  thead.table-warning.table-hover tr:hover,
  tbody.table-warning.table-hover tr:hover,
  tfoot.table-warning.table-hover tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-warning);
  }
  thead.table-warning.table-hover tr:active, thead.table-warning.table-hover tr.active,
  tbody.table-warning.table-hover tr:active,
  tbody.table-warning.table-hover tr.active,
  tfoot.table-warning.table-hover tr:active,
  tfoot.table-warning.table-hover tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-warning);
  }
  thead.table-danger,
  tbody.table-danger,
  tfoot.table-danger {
    background-color: var(--color-danger);
    color: var(--content-on-danger);
  }
  thead.table-danger.table-hover tr:hover,
  tbody.table-danger.table-hover tr:hover,
  tfoot.table-danger.table-hover tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-danger);
  }
  thead.table-danger.table-hover tr:active, thead.table-danger.table-hover tr.active,
  tbody.table-danger.table-hover tr:active,
  tbody.table-danger.table-hover tr.active,
  tfoot.table-danger.table-hover tr:active,
  tfoot.table-danger.table-hover tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-danger);
  }
  thead.table-neutral,
  tbody.table-neutral,
  tfoot.table-neutral {
    background-color: var(--color-neutral);
    color: var(--content-on-neutral);
  }
  thead.table-neutral.table-hover tr:hover,
  tbody.table-neutral.table-hover tr:hover,
  tfoot.table-neutral.table-hover tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-neutral);
  }
  thead.table-neutral.table-hover tr:active, thead.table-neutral.table-hover tr.active,
  tbody.table-neutral.table-hover tr:active,
  tbody.table-neutral.table-hover tr.active,
  tfoot.table-neutral.table-hover tr:active,
  tfoot.table-neutral.table-hover tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-neutral);
  }
  thead.table-light,
  tbody.table-light,
  tfoot.table-light {
    background-color: var(--color-light);
    color: var(--content-on-light);
  }
  thead.table-light.table-hover tr:hover,
  tbody.table-light.table-hover tr:hover,
  tfoot.table-light.table-hover tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-light);
  }
  thead.table-light.table-hover tr:active, thead.table-light.table-hover tr.active,
  tbody.table-light.table-hover tr:active,
  tbody.table-light.table-hover tr.active,
  tfoot.table-light.table-hover tr:active,
  tfoot.table-light.table-hover tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-light);
  }
  thead.table-dark,
  tbody.table-dark,
  tfoot.table-dark {
    background-color: var(--color-dark);
    color: var(--content-on-dark);
  }
  thead.table-dark.table-hover tr:hover,
  tbody.table-dark.table-hover tr:hover,
  tfoot.table-dark.table-hover tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-dark);
  }
  thead.table-dark.table-hover tr:active, thead.table-dark.table-hover tr.active,
  tbody.table-dark.table-hover tr:active,
  tbody.table-dark.table-hover tr.active,
  tfoot.table-dark.table-hover tr:active,
  tfoot.table-dark.table-hover tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-dark);
  }
  thead.table-white,
  tbody.table-white,
  tfoot.table-white {
    background-color: var(--color-white);
    color: var(--content-on-white);
  }
  thead.table-white.table-hover tr:hover,
  tbody.table-white.table-hover tr:hover,
  tfoot.table-white.table-hover tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-white);
  }
  thead.table-white.table-hover tr:active, thead.table-white.table-hover tr.active,
  tbody.table-white.table-hover tr:active,
  tbody.table-white.table-hover tr.active,
  tfoot.table-white.table-hover tr:active,
  tfoot.table-white.table-hover tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-white);
  }
  thead.table-black,
  tbody.table-black,
  tfoot.table-black {
    background-color: var(--color-black);
    color: var(--content-on-black);
  }
  thead.table-black.table-hover tr:hover,
  tbody.table-black.table-hover tr:hover,
  tfoot.table-black.table-hover tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-black);
  }
  thead.table-black.table-hover tr:active, thead.table-black.table-hover tr.active,
  tbody.table-black.table-hover tr:active,
  tbody.table-black.table-hover tr.active,
  tfoot.table-black.table-hover tr:active,
  tfoot.table-black.table-hover tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-black);
  }
  thead.table-primary-ghost,
  tbody.table-primary-ghost,
  tfoot.table-primary-ghost {
    background-color: var(--color-primary-ghost);
    color: var(--content-on-primary-ghost);
  }
  thead.table-primary-ghost.table-hover tr:hover,
  tbody.table-primary-ghost.table-hover tr:hover,
  tfoot.table-primary-ghost.table-hover tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-primary-ghost);
  }
  thead.table-primary-ghost.table-hover tr:active, thead.table-primary-ghost.table-hover tr.active,
  tbody.table-primary-ghost.table-hover tr:active,
  tbody.table-primary-ghost.table-hover tr.active,
  tfoot.table-primary-ghost.table-hover tr:active,
  tfoot.table-primary-ghost.table-hover tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-primary-ghost);
  }
  thead.table-secondary-ghost,
  tbody.table-secondary-ghost,
  tfoot.table-secondary-ghost {
    background-color: var(--color-secondary-ghost);
    color: var(--content-on-secondary-ghost);
  }
  thead.table-secondary-ghost.table-hover tr:hover,
  tbody.table-secondary-ghost.table-hover tr:hover,
  tfoot.table-secondary-ghost.table-hover tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-secondary-ghost);
  }
  thead.table-secondary-ghost.table-hover tr:active, thead.table-secondary-ghost.table-hover tr.active,
  tbody.table-secondary-ghost.table-hover tr:active,
  tbody.table-secondary-ghost.table-hover tr.active,
  tfoot.table-secondary-ghost.table-hover tr:active,
  tfoot.table-secondary-ghost.table-hover tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-secondary-ghost);
  }
  thead.table-tertiary-ghost,
  tbody.table-tertiary-ghost,
  tfoot.table-tertiary-ghost {
    background-color: var(--color-tertiary-ghost);
    color: var(--content-on-tertiary-ghost);
  }
  thead.table-tertiary-ghost.table-hover tr:hover,
  tbody.table-tertiary-ghost.table-hover tr:hover,
  tfoot.table-tertiary-ghost.table-hover tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-tertiary-ghost);
  }
  thead.table-tertiary-ghost.table-hover tr:active, thead.table-tertiary-ghost.table-hover tr.active,
  tbody.table-tertiary-ghost.table-hover tr:active,
  tbody.table-tertiary-ghost.table-hover tr.active,
  tfoot.table-tertiary-ghost.table-hover tr:active,
  tfoot.table-tertiary-ghost.table-hover tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-tertiary-ghost);
  }
  thead.table-success-ghost,
  tbody.table-success-ghost,
  tfoot.table-success-ghost {
    background-color: var(--color-success-ghost);
    color: var(--content-on-success-ghost);
  }
  thead.table-success-ghost.table-hover tr:hover,
  tbody.table-success-ghost.table-hover tr:hover,
  tfoot.table-success-ghost.table-hover tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-success-ghost);
  }
  thead.table-success-ghost.table-hover tr:active, thead.table-success-ghost.table-hover tr.active,
  tbody.table-success-ghost.table-hover tr:active,
  tbody.table-success-ghost.table-hover tr.active,
  tfoot.table-success-ghost.table-hover tr:active,
  tfoot.table-success-ghost.table-hover tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-success-ghost);
  }
  thead.table-info-ghost,
  tbody.table-info-ghost,
  tfoot.table-info-ghost {
    background-color: var(--color-info-ghost);
    color: var(--content-on-info-ghost);
  }
  thead.table-info-ghost.table-hover tr:hover,
  tbody.table-info-ghost.table-hover tr:hover,
  tfoot.table-info-ghost.table-hover tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-info-ghost);
  }
  thead.table-info-ghost.table-hover tr:active, thead.table-info-ghost.table-hover tr.active,
  tbody.table-info-ghost.table-hover tr:active,
  tbody.table-info-ghost.table-hover tr.active,
  tfoot.table-info-ghost.table-hover tr:active,
  tfoot.table-info-ghost.table-hover tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-info-ghost);
  }
  thead.table-warning-ghost,
  tbody.table-warning-ghost,
  tfoot.table-warning-ghost {
    background-color: var(--color-warning-ghost);
    color: var(--content-on-warning-ghost);
  }
  thead.table-warning-ghost.table-hover tr:hover,
  tbody.table-warning-ghost.table-hover tr:hover,
  tfoot.table-warning-ghost.table-hover tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-warning-ghost);
  }
  thead.table-warning-ghost.table-hover tr:active, thead.table-warning-ghost.table-hover tr.active,
  tbody.table-warning-ghost.table-hover tr:active,
  tbody.table-warning-ghost.table-hover tr.active,
  tfoot.table-warning-ghost.table-hover tr:active,
  tfoot.table-warning-ghost.table-hover tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-warning-ghost);
  }
  thead.table-danger-ghost,
  tbody.table-danger-ghost,
  tfoot.table-danger-ghost {
    background-color: var(--color-danger-ghost);
    color: var(--content-on-danger-ghost);
  }
  thead.table-danger-ghost.table-hover tr:hover,
  tbody.table-danger-ghost.table-hover tr:hover,
  tfoot.table-danger-ghost.table-hover tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-danger-ghost);
  }
  thead.table-danger-ghost.table-hover tr:active, thead.table-danger-ghost.table-hover tr.active,
  tbody.table-danger-ghost.table-hover tr:active,
  tbody.table-danger-ghost.table-hover tr.active,
  tfoot.table-danger-ghost.table-hover tr:active,
  tfoot.table-danger-ghost.table-hover tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-danger-ghost);
  }
  thead.table-neutral-ghost,
  tbody.table-neutral-ghost,
  tfoot.table-neutral-ghost {
    background-color: var(--color-neutral-ghost);
    color: var(--content-on-neutral-ghost);
  }
  thead.table-neutral-ghost.table-hover tr:hover,
  tbody.table-neutral-ghost.table-hover tr:hover,
  tfoot.table-neutral-ghost.table-hover tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-neutral-ghost);
  }
  thead.table-neutral-ghost.table-hover tr:active, thead.table-neutral-ghost.table-hover tr.active,
  tbody.table-neutral-ghost.table-hover tr:active,
  tbody.table-neutral-ghost.table-hover tr.active,
  tfoot.table-neutral-ghost.table-hover tr:active,
  tfoot.table-neutral-ghost.table-hover tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-neutral-ghost);
  }
  thead.table-light-ghost,
  tbody.table-light-ghost,
  tfoot.table-light-ghost {
    background-color: var(--color-light-ghost);
    color: var(--content-on-light-ghost);
  }
  thead.table-light-ghost.table-hover tr:hover,
  tbody.table-light-ghost.table-hover tr:hover,
  tfoot.table-light-ghost.table-hover tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-light-ghost);
  }
  thead.table-light-ghost.table-hover tr:active, thead.table-light-ghost.table-hover tr.active,
  tbody.table-light-ghost.table-hover tr:active,
  tbody.table-light-ghost.table-hover tr.active,
  tfoot.table-light-ghost.table-hover tr:active,
  tfoot.table-light-ghost.table-hover tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-light-ghost);
  }
  thead.table-dark-ghost,
  tbody.table-dark-ghost,
  tfoot.table-dark-ghost {
    background-color: var(--color-dark-ghost);
    color: var(--content-on-dark-ghost);
  }
  thead.table-dark-ghost.table-hover tr:hover,
  tbody.table-dark-ghost.table-hover tr:hover,
  tfoot.table-dark-ghost.table-hover tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-dark-ghost);
  }
  thead.table-dark-ghost.table-hover tr:active, thead.table-dark-ghost.table-hover tr.active,
  tbody.table-dark-ghost.table-hover tr:active,
  tbody.table-dark-ghost.table-hover tr.active,
  tfoot.table-dark-ghost.table-hover tr:active,
  tfoot.table-dark-ghost.table-hover tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-dark-ghost);
  }
  thead.table-white-ghost,
  tbody.table-white-ghost,
  tfoot.table-white-ghost {
    background-color: var(--color-white-ghost);
    color: var(--content-on-white-ghost);
  }
  thead.table-white-ghost.table-hover tr:hover,
  tbody.table-white-ghost.table-hover tr:hover,
  tfoot.table-white-ghost.table-hover tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-white-ghost);
  }
  thead.table-white-ghost.table-hover tr:active, thead.table-white-ghost.table-hover tr.active,
  tbody.table-white-ghost.table-hover tr:active,
  tbody.table-white-ghost.table-hover tr.active,
  tfoot.table-white-ghost.table-hover tr:active,
  tfoot.table-white-ghost.table-hover tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-white-ghost);
  }
  thead.table-black-ghost,
  tbody.table-black-ghost,
  tfoot.table-black-ghost {
    background-color: var(--color-black-ghost);
    color: var(--content-on-black-ghost);
  }
  thead.table-black-ghost.table-hover tr:hover,
  tbody.table-black-ghost.table-hover tr:hover,
  tfoot.table-black-ghost.table-hover tr:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-black-ghost);
  }
  thead.table-black-ghost.table-hover tr:active, thead.table-black-ghost.table-hover tr.active,
  tbody.table-black-ghost.table-hover tr:active,
  tbody.table-black-ghost.table-hover tr.active,
  tfoot.table-black-ghost.table-hover tr:active,
  tfoot.table-black-ghost.table-hover tr.active {
    box-shadow: inset 0 0 0 9999px var(--active-black-ghost);
  }
}
@layer table-l09 {
  table.table-hover tbody tr.table-primary {
    background-color: var(--color-primary);
    color: var(--content-on-primary);
  }
  table.table-hover tbody tr.table-primary:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-primary);
  }
  table.table-hover tbody tr.table-primary:active, table.table-hover tbody tr.table-primary.active {
    box-shadow: inset 0 0 0 9999px var(--active-primary);
  }
  thead.table-hover tr.table-primary,
  tbody.table-hover tr.table-primary,
  tfoot.table-hover tr.table-primary {
    background-color: var(--color-primary);
    color: var(--content-on-primary);
  }
  thead.table-hover tr.table-primary:hover,
  tbody.table-hover tr.table-primary:hover,
  tfoot.table-hover tr.table-primary:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-primary);
  }
  thead.table-hover tr.table-primary:active, thead.table-hover tr.table-primary.active,
  tbody.table-hover tr.table-primary:active,
  tbody.table-hover tr.table-primary.active,
  tfoot.table-hover tr.table-primary:active,
  tfoot.table-hover tr.table-primary.active {
    box-shadow: inset 0 0 0 9999px var(--active-primary);
  }
  table.table-hover tbody tr.table-secondary {
    background-color: var(--color-secondary);
    color: var(--content-on-secondary);
  }
  table.table-hover tbody tr.table-secondary:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-secondary);
  }
  table.table-hover tbody tr.table-secondary:active, table.table-hover tbody tr.table-secondary.active {
    box-shadow: inset 0 0 0 9999px var(--active-secondary);
  }
  thead.table-hover tr.table-secondary,
  tbody.table-hover tr.table-secondary,
  tfoot.table-hover tr.table-secondary {
    background-color: var(--color-secondary);
    color: var(--content-on-secondary);
  }
  thead.table-hover tr.table-secondary:hover,
  tbody.table-hover tr.table-secondary:hover,
  tfoot.table-hover tr.table-secondary:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-secondary);
  }
  thead.table-hover tr.table-secondary:active, thead.table-hover tr.table-secondary.active,
  tbody.table-hover tr.table-secondary:active,
  tbody.table-hover tr.table-secondary.active,
  tfoot.table-hover tr.table-secondary:active,
  tfoot.table-hover tr.table-secondary.active {
    box-shadow: inset 0 0 0 9999px var(--active-secondary);
  }
  table.table-hover tbody tr.table-tertiary {
    background-color: var(--color-tertiary);
    color: var(--content-on-tertiary);
  }
  table.table-hover tbody tr.table-tertiary:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-tertiary);
  }
  table.table-hover tbody tr.table-tertiary:active, table.table-hover tbody tr.table-tertiary.active {
    box-shadow: inset 0 0 0 9999px var(--active-tertiary);
  }
  thead.table-hover tr.table-tertiary,
  tbody.table-hover tr.table-tertiary,
  tfoot.table-hover tr.table-tertiary {
    background-color: var(--color-tertiary);
    color: var(--content-on-tertiary);
  }
  thead.table-hover tr.table-tertiary:hover,
  tbody.table-hover tr.table-tertiary:hover,
  tfoot.table-hover tr.table-tertiary:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-tertiary);
  }
  thead.table-hover tr.table-tertiary:active, thead.table-hover tr.table-tertiary.active,
  tbody.table-hover tr.table-tertiary:active,
  tbody.table-hover tr.table-tertiary.active,
  tfoot.table-hover tr.table-tertiary:active,
  tfoot.table-hover tr.table-tertiary.active {
    box-shadow: inset 0 0 0 9999px var(--active-tertiary);
  }
  table.table-hover tbody tr.table-success {
    background-color: var(--color-success);
    color: var(--content-on-success);
  }
  table.table-hover tbody tr.table-success:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-success);
  }
  table.table-hover tbody tr.table-success:active, table.table-hover tbody tr.table-success.active {
    box-shadow: inset 0 0 0 9999px var(--active-success);
  }
  thead.table-hover tr.table-success,
  tbody.table-hover tr.table-success,
  tfoot.table-hover tr.table-success {
    background-color: var(--color-success);
    color: var(--content-on-success);
  }
  thead.table-hover tr.table-success:hover,
  tbody.table-hover tr.table-success:hover,
  tfoot.table-hover tr.table-success:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-success);
  }
  thead.table-hover tr.table-success:active, thead.table-hover tr.table-success.active,
  tbody.table-hover tr.table-success:active,
  tbody.table-hover tr.table-success.active,
  tfoot.table-hover tr.table-success:active,
  tfoot.table-hover tr.table-success.active {
    box-shadow: inset 0 0 0 9999px var(--active-success);
  }
  table.table-hover tbody tr.table-info {
    background-color: var(--color-info);
    color: var(--content-on-info);
  }
  table.table-hover tbody tr.table-info:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-info);
  }
  table.table-hover tbody tr.table-info:active, table.table-hover tbody tr.table-info.active {
    box-shadow: inset 0 0 0 9999px var(--active-info);
  }
  thead.table-hover tr.table-info,
  tbody.table-hover tr.table-info,
  tfoot.table-hover tr.table-info {
    background-color: var(--color-info);
    color: var(--content-on-info);
  }
  thead.table-hover tr.table-info:hover,
  tbody.table-hover tr.table-info:hover,
  tfoot.table-hover tr.table-info:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-info);
  }
  thead.table-hover tr.table-info:active, thead.table-hover tr.table-info.active,
  tbody.table-hover tr.table-info:active,
  tbody.table-hover tr.table-info.active,
  tfoot.table-hover tr.table-info:active,
  tfoot.table-hover tr.table-info.active {
    box-shadow: inset 0 0 0 9999px var(--active-info);
  }
  table.table-hover tbody tr.table-warning {
    background-color: var(--color-warning);
    color: var(--content-on-warning);
  }
  table.table-hover tbody tr.table-warning:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-warning);
  }
  table.table-hover tbody tr.table-warning:active, table.table-hover tbody tr.table-warning.active {
    box-shadow: inset 0 0 0 9999px var(--active-warning);
  }
  thead.table-hover tr.table-warning,
  tbody.table-hover tr.table-warning,
  tfoot.table-hover tr.table-warning {
    background-color: var(--color-warning);
    color: var(--content-on-warning);
  }
  thead.table-hover tr.table-warning:hover,
  tbody.table-hover tr.table-warning:hover,
  tfoot.table-hover tr.table-warning:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-warning);
  }
  thead.table-hover tr.table-warning:active, thead.table-hover tr.table-warning.active,
  tbody.table-hover tr.table-warning:active,
  tbody.table-hover tr.table-warning.active,
  tfoot.table-hover tr.table-warning:active,
  tfoot.table-hover tr.table-warning.active {
    box-shadow: inset 0 0 0 9999px var(--active-warning);
  }
  table.table-hover tbody tr.table-danger {
    background-color: var(--color-danger);
    color: var(--content-on-danger);
  }
  table.table-hover tbody tr.table-danger:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-danger);
  }
  table.table-hover tbody tr.table-danger:active, table.table-hover tbody tr.table-danger.active {
    box-shadow: inset 0 0 0 9999px var(--active-danger);
  }
  thead.table-hover tr.table-danger,
  tbody.table-hover tr.table-danger,
  tfoot.table-hover tr.table-danger {
    background-color: var(--color-danger);
    color: var(--content-on-danger);
  }
  thead.table-hover tr.table-danger:hover,
  tbody.table-hover tr.table-danger:hover,
  tfoot.table-hover tr.table-danger:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-danger);
  }
  thead.table-hover tr.table-danger:active, thead.table-hover tr.table-danger.active,
  tbody.table-hover tr.table-danger:active,
  tbody.table-hover tr.table-danger.active,
  tfoot.table-hover tr.table-danger:active,
  tfoot.table-hover tr.table-danger.active {
    box-shadow: inset 0 0 0 9999px var(--active-danger);
  }
  table.table-hover tbody tr.table-neutral {
    background-color: var(--color-neutral);
    color: var(--content-on-neutral);
  }
  table.table-hover tbody tr.table-neutral:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-neutral);
  }
  table.table-hover tbody tr.table-neutral:active, table.table-hover tbody tr.table-neutral.active {
    box-shadow: inset 0 0 0 9999px var(--active-neutral);
  }
  thead.table-hover tr.table-neutral,
  tbody.table-hover tr.table-neutral,
  tfoot.table-hover tr.table-neutral {
    background-color: var(--color-neutral);
    color: var(--content-on-neutral);
  }
  thead.table-hover tr.table-neutral:hover,
  tbody.table-hover tr.table-neutral:hover,
  tfoot.table-hover tr.table-neutral:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-neutral);
  }
  thead.table-hover tr.table-neutral:active, thead.table-hover tr.table-neutral.active,
  tbody.table-hover tr.table-neutral:active,
  tbody.table-hover tr.table-neutral.active,
  tfoot.table-hover tr.table-neutral:active,
  tfoot.table-hover tr.table-neutral.active {
    box-shadow: inset 0 0 0 9999px var(--active-neutral);
  }
  table.table-hover tbody tr.table-light {
    background-color: var(--color-light);
    color: var(--content-on-light);
  }
  table.table-hover tbody tr.table-light:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-light);
  }
  table.table-hover tbody tr.table-light:active, table.table-hover tbody tr.table-light.active {
    box-shadow: inset 0 0 0 9999px var(--active-light);
  }
  thead.table-hover tr.table-light,
  tbody.table-hover tr.table-light,
  tfoot.table-hover tr.table-light {
    background-color: var(--color-light);
    color: var(--content-on-light);
  }
  thead.table-hover tr.table-light:hover,
  tbody.table-hover tr.table-light:hover,
  tfoot.table-hover tr.table-light:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-light);
  }
  thead.table-hover tr.table-light:active, thead.table-hover tr.table-light.active,
  tbody.table-hover tr.table-light:active,
  tbody.table-hover tr.table-light.active,
  tfoot.table-hover tr.table-light:active,
  tfoot.table-hover tr.table-light.active {
    box-shadow: inset 0 0 0 9999px var(--active-light);
  }
  table.table-hover tbody tr.table-dark {
    background-color: var(--color-dark);
    color: var(--content-on-dark);
  }
  table.table-hover tbody tr.table-dark:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-dark);
  }
  table.table-hover tbody tr.table-dark:active, table.table-hover tbody tr.table-dark.active {
    box-shadow: inset 0 0 0 9999px var(--active-dark);
  }
  thead.table-hover tr.table-dark,
  tbody.table-hover tr.table-dark,
  tfoot.table-hover tr.table-dark {
    background-color: var(--color-dark);
    color: var(--content-on-dark);
  }
  thead.table-hover tr.table-dark:hover,
  tbody.table-hover tr.table-dark:hover,
  tfoot.table-hover tr.table-dark:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-dark);
  }
  thead.table-hover tr.table-dark:active, thead.table-hover tr.table-dark.active,
  tbody.table-hover tr.table-dark:active,
  tbody.table-hover tr.table-dark.active,
  tfoot.table-hover tr.table-dark:active,
  tfoot.table-hover tr.table-dark.active {
    box-shadow: inset 0 0 0 9999px var(--active-dark);
  }
  table.table-hover tbody tr.table-white {
    background-color: var(--color-white);
    color: var(--content-on-white);
  }
  table.table-hover tbody tr.table-white:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-white);
  }
  table.table-hover tbody tr.table-white:active, table.table-hover tbody tr.table-white.active {
    box-shadow: inset 0 0 0 9999px var(--active-white);
  }
  thead.table-hover tr.table-white,
  tbody.table-hover tr.table-white,
  tfoot.table-hover tr.table-white {
    background-color: var(--color-white);
    color: var(--content-on-white);
  }
  thead.table-hover tr.table-white:hover,
  tbody.table-hover tr.table-white:hover,
  tfoot.table-hover tr.table-white:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-white);
  }
  thead.table-hover tr.table-white:active, thead.table-hover tr.table-white.active,
  tbody.table-hover tr.table-white:active,
  tbody.table-hover tr.table-white.active,
  tfoot.table-hover tr.table-white:active,
  tfoot.table-hover tr.table-white.active {
    box-shadow: inset 0 0 0 9999px var(--active-white);
  }
  table.table-hover tbody tr.table-black {
    background-color: var(--color-black);
    color: var(--content-on-black);
  }
  table.table-hover tbody tr.table-black:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-black);
  }
  table.table-hover tbody tr.table-black:active, table.table-hover tbody tr.table-black.active {
    box-shadow: inset 0 0 0 9999px var(--active-black);
  }
  thead.table-hover tr.table-black,
  tbody.table-hover tr.table-black,
  tfoot.table-hover tr.table-black {
    background-color: var(--color-black);
    color: var(--content-on-black);
  }
  thead.table-hover tr.table-black:hover,
  tbody.table-hover tr.table-black:hover,
  tfoot.table-hover tr.table-black:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-black);
  }
  thead.table-hover tr.table-black:active, thead.table-hover tr.table-black.active,
  tbody.table-hover tr.table-black:active,
  tbody.table-hover tr.table-black.active,
  tfoot.table-hover tr.table-black:active,
  tfoot.table-hover tr.table-black.active {
    box-shadow: inset 0 0 0 9999px var(--active-black);
  }
  table.table-hover tbody tr.table-primary-ghost {
    background-color: var(--color-primary-ghost);
    color: var(--content-on-primary-ghost);
  }
  table.table-hover tbody tr.table-primary-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-primary-ghost);
  }
  table.table-hover tbody tr.table-primary-ghost:active, table.table-hover tbody tr.table-primary-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-primary-ghost);
  }
  thead.table-hover tr.table-primary-ghost,
  tbody.table-hover tr.table-primary-ghost,
  tfoot.table-hover tr.table-primary-ghost {
    background-color: var(--color-primary-ghost);
    color: var(--content-on-primary-ghost);
  }
  thead.table-hover tr.table-primary-ghost:hover,
  tbody.table-hover tr.table-primary-ghost:hover,
  tfoot.table-hover tr.table-primary-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-primary-ghost);
  }
  thead.table-hover tr.table-primary-ghost:active, thead.table-hover tr.table-primary-ghost.active,
  tbody.table-hover tr.table-primary-ghost:active,
  tbody.table-hover tr.table-primary-ghost.active,
  tfoot.table-hover tr.table-primary-ghost:active,
  tfoot.table-hover tr.table-primary-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-primary-ghost);
  }
  table.table-hover tbody tr.table-secondary-ghost {
    background-color: var(--color-secondary-ghost);
    color: var(--content-on-secondary-ghost);
  }
  table.table-hover tbody tr.table-secondary-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-secondary-ghost);
  }
  table.table-hover tbody tr.table-secondary-ghost:active, table.table-hover tbody tr.table-secondary-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-secondary-ghost);
  }
  thead.table-hover tr.table-secondary-ghost,
  tbody.table-hover tr.table-secondary-ghost,
  tfoot.table-hover tr.table-secondary-ghost {
    background-color: var(--color-secondary-ghost);
    color: var(--content-on-secondary-ghost);
  }
  thead.table-hover tr.table-secondary-ghost:hover,
  tbody.table-hover tr.table-secondary-ghost:hover,
  tfoot.table-hover tr.table-secondary-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-secondary-ghost);
  }
  thead.table-hover tr.table-secondary-ghost:active, thead.table-hover tr.table-secondary-ghost.active,
  tbody.table-hover tr.table-secondary-ghost:active,
  tbody.table-hover tr.table-secondary-ghost.active,
  tfoot.table-hover tr.table-secondary-ghost:active,
  tfoot.table-hover tr.table-secondary-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-secondary-ghost);
  }
  table.table-hover tbody tr.table-tertiary-ghost {
    background-color: var(--color-tertiary-ghost);
    color: var(--content-on-tertiary-ghost);
  }
  table.table-hover tbody tr.table-tertiary-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-tertiary-ghost);
  }
  table.table-hover tbody tr.table-tertiary-ghost:active, table.table-hover tbody tr.table-tertiary-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-tertiary-ghost);
  }
  thead.table-hover tr.table-tertiary-ghost,
  tbody.table-hover tr.table-tertiary-ghost,
  tfoot.table-hover tr.table-tertiary-ghost {
    background-color: var(--color-tertiary-ghost);
    color: var(--content-on-tertiary-ghost);
  }
  thead.table-hover tr.table-tertiary-ghost:hover,
  tbody.table-hover tr.table-tertiary-ghost:hover,
  tfoot.table-hover tr.table-tertiary-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-tertiary-ghost);
  }
  thead.table-hover tr.table-tertiary-ghost:active, thead.table-hover tr.table-tertiary-ghost.active,
  tbody.table-hover tr.table-tertiary-ghost:active,
  tbody.table-hover tr.table-tertiary-ghost.active,
  tfoot.table-hover tr.table-tertiary-ghost:active,
  tfoot.table-hover tr.table-tertiary-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-tertiary-ghost);
  }
  table.table-hover tbody tr.table-success-ghost {
    background-color: var(--color-success-ghost);
    color: var(--content-on-success-ghost);
  }
  table.table-hover tbody tr.table-success-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-success-ghost);
  }
  table.table-hover tbody tr.table-success-ghost:active, table.table-hover tbody tr.table-success-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-success-ghost);
  }
  thead.table-hover tr.table-success-ghost,
  tbody.table-hover tr.table-success-ghost,
  tfoot.table-hover tr.table-success-ghost {
    background-color: var(--color-success-ghost);
    color: var(--content-on-success-ghost);
  }
  thead.table-hover tr.table-success-ghost:hover,
  tbody.table-hover tr.table-success-ghost:hover,
  tfoot.table-hover tr.table-success-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-success-ghost);
  }
  thead.table-hover tr.table-success-ghost:active, thead.table-hover tr.table-success-ghost.active,
  tbody.table-hover tr.table-success-ghost:active,
  tbody.table-hover tr.table-success-ghost.active,
  tfoot.table-hover tr.table-success-ghost:active,
  tfoot.table-hover tr.table-success-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-success-ghost);
  }
  table.table-hover tbody tr.table-info-ghost {
    background-color: var(--color-info-ghost);
    color: var(--content-on-info-ghost);
  }
  table.table-hover tbody tr.table-info-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-info-ghost);
  }
  table.table-hover tbody tr.table-info-ghost:active, table.table-hover tbody tr.table-info-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-info-ghost);
  }
  thead.table-hover tr.table-info-ghost,
  tbody.table-hover tr.table-info-ghost,
  tfoot.table-hover tr.table-info-ghost {
    background-color: var(--color-info-ghost);
    color: var(--content-on-info-ghost);
  }
  thead.table-hover tr.table-info-ghost:hover,
  tbody.table-hover tr.table-info-ghost:hover,
  tfoot.table-hover tr.table-info-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-info-ghost);
  }
  thead.table-hover tr.table-info-ghost:active, thead.table-hover tr.table-info-ghost.active,
  tbody.table-hover tr.table-info-ghost:active,
  tbody.table-hover tr.table-info-ghost.active,
  tfoot.table-hover tr.table-info-ghost:active,
  tfoot.table-hover tr.table-info-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-info-ghost);
  }
  table.table-hover tbody tr.table-warning-ghost {
    background-color: var(--color-warning-ghost);
    color: var(--content-on-warning-ghost);
  }
  table.table-hover tbody tr.table-warning-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-warning-ghost);
  }
  table.table-hover tbody tr.table-warning-ghost:active, table.table-hover tbody tr.table-warning-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-warning-ghost);
  }
  thead.table-hover tr.table-warning-ghost,
  tbody.table-hover tr.table-warning-ghost,
  tfoot.table-hover tr.table-warning-ghost {
    background-color: var(--color-warning-ghost);
    color: var(--content-on-warning-ghost);
  }
  thead.table-hover tr.table-warning-ghost:hover,
  tbody.table-hover tr.table-warning-ghost:hover,
  tfoot.table-hover tr.table-warning-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-warning-ghost);
  }
  thead.table-hover tr.table-warning-ghost:active, thead.table-hover tr.table-warning-ghost.active,
  tbody.table-hover tr.table-warning-ghost:active,
  tbody.table-hover tr.table-warning-ghost.active,
  tfoot.table-hover tr.table-warning-ghost:active,
  tfoot.table-hover tr.table-warning-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-warning-ghost);
  }
  table.table-hover tbody tr.table-danger-ghost {
    background-color: var(--color-danger-ghost);
    color: var(--content-on-danger-ghost);
  }
  table.table-hover tbody tr.table-danger-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-danger-ghost);
  }
  table.table-hover tbody tr.table-danger-ghost:active, table.table-hover tbody tr.table-danger-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-danger-ghost);
  }
  thead.table-hover tr.table-danger-ghost,
  tbody.table-hover tr.table-danger-ghost,
  tfoot.table-hover tr.table-danger-ghost {
    background-color: var(--color-danger-ghost);
    color: var(--content-on-danger-ghost);
  }
  thead.table-hover tr.table-danger-ghost:hover,
  tbody.table-hover tr.table-danger-ghost:hover,
  tfoot.table-hover tr.table-danger-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-danger-ghost);
  }
  thead.table-hover tr.table-danger-ghost:active, thead.table-hover tr.table-danger-ghost.active,
  tbody.table-hover tr.table-danger-ghost:active,
  tbody.table-hover tr.table-danger-ghost.active,
  tfoot.table-hover tr.table-danger-ghost:active,
  tfoot.table-hover tr.table-danger-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-danger-ghost);
  }
  table.table-hover tbody tr.table-neutral-ghost {
    background-color: var(--color-neutral-ghost);
    color: var(--content-on-neutral-ghost);
  }
  table.table-hover tbody tr.table-neutral-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-neutral-ghost);
  }
  table.table-hover tbody tr.table-neutral-ghost:active, table.table-hover tbody tr.table-neutral-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-neutral-ghost);
  }
  thead.table-hover tr.table-neutral-ghost,
  tbody.table-hover tr.table-neutral-ghost,
  tfoot.table-hover tr.table-neutral-ghost {
    background-color: var(--color-neutral-ghost);
    color: var(--content-on-neutral-ghost);
  }
  thead.table-hover tr.table-neutral-ghost:hover,
  tbody.table-hover tr.table-neutral-ghost:hover,
  tfoot.table-hover tr.table-neutral-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-neutral-ghost);
  }
  thead.table-hover tr.table-neutral-ghost:active, thead.table-hover tr.table-neutral-ghost.active,
  tbody.table-hover tr.table-neutral-ghost:active,
  tbody.table-hover tr.table-neutral-ghost.active,
  tfoot.table-hover tr.table-neutral-ghost:active,
  tfoot.table-hover tr.table-neutral-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-neutral-ghost);
  }
  table.table-hover tbody tr.table-light-ghost {
    background-color: var(--color-light-ghost);
    color: var(--content-on-light-ghost);
  }
  table.table-hover tbody tr.table-light-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-light-ghost);
  }
  table.table-hover tbody tr.table-light-ghost:active, table.table-hover tbody tr.table-light-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-light-ghost);
  }
  thead.table-hover tr.table-light-ghost,
  tbody.table-hover tr.table-light-ghost,
  tfoot.table-hover tr.table-light-ghost {
    background-color: var(--color-light-ghost);
    color: var(--content-on-light-ghost);
  }
  thead.table-hover tr.table-light-ghost:hover,
  tbody.table-hover tr.table-light-ghost:hover,
  tfoot.table-hover tr.table-light-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-light-ghost);
  }
  thead.table-hover tr.table-light-ghost:active, thead.table-hover tr.table-light-ghost.active,
  tbody.table-hover tr.table-light-ghost:active,
  tbody.table-hover tr.table-light-ghost.active,
  tfoot.table-hover tr.table-light-ghost:active,
  tfoot.table-hover tr.table-light-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-light-ghost);
  }
  table.table-hover tbody tr.table-dark-ghost {
    background-color: var(--color-dark-ghost);
    color: var(--content-on-dark-ghost);
  }
  table.table-hover tbody tr.table-dark-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-dark-ghost);
  }
  table.table-hover tbody tr.table-dark-ghost:active, table.table-hover tbody tr.table-dark-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-dark-ghost);
  }
  thead.table-hover tr.table-dark-ghost,
  tbody.table-hover tr.table-dark-ghost,
  tfoot.table-hover tr.table-dark-ghost {
    background-color: var(--color-dark-ghost);
    color: var(--content-on-dark-ghost);
  }
  thead.table-hover tr.table-dark-ghost:hover,
  tbody.table-hover tr.table-dark-ghost:hover,
  tfoot.table-hover tr.table-dark-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-dark-ghost);
  }
  thead.table-hover tr.table-dark-ghost:active, thead.table-hover tr.table-dark-ghost.active,
  tbody.table-hover tr.table-dark-ghost:active,
  tbody.table-hover tr.table-dark-ghost.active,
  tfoot.table-hover tr.table-dark-ghost:active,
  tfoot.table-hover tr.table-dark-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-dark-ghost);
  }
  table.table-hover tbody tr.table-white-ghost {
    background-color: var(--color-white-ghost);
    color: var(--content-on-white-ghost);
  }
  table.table-hover tbody tr.table-white-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-white-ghost);
  }
  table.table-hover tbody tr.table-white-ghost:active, table.table-hover tbody tr.table-white-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-white-ghost);
  }
  thead.table-hover tr.table-white-ghost,
  tbody.table-hover tr.table-white-ghost,
  tfoot.table-hover tr.table-white-ghost {
    background-color: var(--color-white-ghost);
    color: var(--content-on-white-ghost);
  }
  thead.table-hover tr.table-white-ghost:hover,
  tbody.table-hover tr.table-white-ghost:hover,
  tfoot.table-hover tr.table-white-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-white-ghost);
  }
  thead.table-hover tr.table-white-ghost:active, thead.table-hover tr.table-white-ghost.active,
  tbody.table-hover tr.table-white-ghost:active,
  tbody.table-hover tr.table-white-ghost.active,
  tfoot.table-hover tr.table-white-ghost:active,
  tfoot.table-hover tr.table-white-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-white-ghost);
  }
  table.table-hover tbody tr.table-black-ghost {
    background-color: var(--color-black-ghost);
    color: var(--content-on-black-ghost);
  }
  table.table-hover tbody tr.table-black-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-black-ghost);
  }
  table.table-hover tbody tr.table-black-ghost:active, table.table-hover tbody tr.table-black-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-black-ghost);
  }
  thead.table-hover tr.table-black-ghost,
  tbody.table-hover tr.table-black-ghost,
  tfoot.table-hover tr.table-black-ghost {
    background-color: var(--color-black-ghost);
    color: var(--content-on-black-ghost);
  }
  thead.table-hover tr.table-black-ghost:hover,
  tbody.table-hover tr.table-black-ghost:hover,
  tfoot.table-hover tr.table-black-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-black-ghost);
  }
  thead.table-hover tr.table-black-ghost:active, thead.table-hover tr.table-black-ghost.active,
  tbody.table-hover tr.table-black-ghost:active,
  tbody.table-hover tr.table-black-ghost.active,
  tfoot.table-hover tr.table-black-ghost:active,
  tfoot.table-hover tr.table-black-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-black-ghost);
  }
}
@layer table-l10 {
  tr.table-primary {
    background-color: var(--color-primary);
    color: var(--content-on-primary);
  }
  tr.table-primary.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-primary);
  }
  tr.table-primary.table-hover:active, tr.table-primary.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-primary);
  }
  tr.table-secondary {
    background-color: var(--color-secondary);
    color: var(--content-on-secondary);
  }
  tr.table-secondary.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-secondary);
  }
  tr.table-secondary.table-hover:active, tr.table-secondary.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-secondary);
  }
  tr.table-tertiary {
    background-color: var(--color-tertiary);
    color: var(--content-on-tertiary);
  }
  tr.table-tertiary.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-tertiary);
  }
  tr.table-tertiary.table-hover:active, tr.table-tertiary.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-tertiary);
  }
  tr.table-success {
    background-color: var(--color-success);
    color: var(--content-on-success);
  }
  tr.table-success.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-success);
  }
  tr.table-success.table-hover:active, tr.table-success.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-success);
  }
  tr.table-info {
    background-color: var(--color-info);
    color: var(--content-on-info);
  }
  tr.table-info.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-info);
  }
  tr.table-info.table-hover:active, tr.table-info.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-info);
  }
  tr.table-warning {
    background-color: var(--color-warning);
    color: var(--content-on-warning);
  }
  tr.table-warning.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-warning);
  }
  tr.table-warning.table-hover:active, tr.table-warning.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-warning);
  }
  tr.table-danger {
    background-color: var(--color-danger);
    color: var(--content-on-danger);
  }
  tr.table-danger.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-danger);
  }
  tr.table-danger.table-hover:active, tr.table-danger.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-danger);
  }
  tr.table-neutral {
    background-color: var(--color-neutral);
    color: var(--content-on-neutral);
  }
  tr.table-neutral.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-neutral);
  }
  tr.table-neutral.table-hover:active, tr.table-neutral.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-neutral);
  }
  tr.table-light {
    background-color: var(--color-light);
    color: var(--content-on-light);
  }
  tr.table-light.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-light);
  }
  tr.table-light.table-hover:active, tr.table-light.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-light);
  }
  tr.table-dark {
    background-color: var(--color-dark);
    color: var(--content-on-dark);
  }
  tr.table-dark.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-dark);
  }
  tr.table-dark.table-hover:active, tr.table-dark.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-dark);
  }
  tr.table-white {
    background-color: var(--color-white);
    color: var(--content-on-white);
  }
  tr.table-white.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-white);
  }
  tr.table-white.table-hover:active, tr.table-white.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-white);
  }
  tr.table-black {
    background-color: var(--color-black);
    color: var(--content-on-black);
  }
  tr.table-black.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-black);
  }
  tr.table-black.table-hover:active, tr.table-black.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-black);
  }
  tr.table-primary-ghost {
    background-color: var(--color-primary-ghost);
    color: var(--content-on-primary-ghost);
  }
  tr.table-primary-ghost.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-primary-ghost);
  }
  tr.table-primary-ghost.table-hover:active, tr.table-primary-ghost.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-primary-ghost);
  }
  tr.table-secondary-ghost {
    background-color: var(--color-secondary-ghost);
    color: var(--content-on-secondary-ghost);
  }
  tr.table-secondary-ghost.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-secondary-ghost);
  }
  tr.table-secondary-ghost.table-hover:active, tr.table-secondary-ghost.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-secondary-ghost);
  }
  tr.table-tertiary-ghost {
    background-color: var(--color-tertiary-ghost);
    color: var(--content-on-tertiary-ghost);
  }
  tr.table-tertiary-ghost.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-tertiary-ghost);
  }
  tr.table-tertiary-ghost.table-hover:active, tr.table-tertiary-ghost.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-tertiary-ghost);
  }
  tr.table-success-ghost {
    background-color: var(--color-success-ghost);
    color: var(--content-on-success-ghost);
  }
  tr.table-success-ghost.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-success-ghost);
  }
  tr.table-success-ghost.table-hover:active, tr.table-success-ghost.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-success-ghost);
  }
  tr.table-info-ghost {
    background-color: var(--color-info-ghost);
    color: var(--content-on-info-ghost);
  }
  tr.table-info-ghost.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-info-ghost);
  }
  tr.table-info-ghost.table-hover:active, tr.table-info-ghost.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-info-ghost);
  }
  tr.table-warning-ghost {
    background-color: var(--color-warning-ghost);
    color: var(--content-on-warning-ghost);
  }
  tr.table-warning-ghost.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-warning-ghost);
  }
  tr.table-warning-ghost.table-hover:active, tr.table-warning-ghost.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-warning-ghost);
  }
  tr.table-danger-ghost {
    background-color: var(--color-danger-ghost);
    color: var(--content-on-danger-ghost);
  }
  tr.table-danger-ghost.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-danger-ghost);
  }
  tr.table-danger-ghost.table-hover:active, tr.table-danger-ghost.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-danger-ghost);
  }
  tr.table-neutral-ghost {
    background-color: var(--color-neutral-ghost);
    color: var(--content-on-neutral-ghost);
  }
  tr.table-neutral-ghost.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-neutral-ghost);
  }
  tr.table-neutral-ghost.table-hover:active, tr.table-neutral-ghost.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-neutral-ghost);
  }
  tr.table-light-ghost {
    background-color: var(--color-light-ghost);
    color: var(--content-on-light-ghost);
  }
  tr.table-light-ghost.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-light-ghost);
  }
  tr.table-light-ghost.table-hover:active, tr.table-light-ghost.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-light-ghost);
  }
  tr.table-dark-ghost {
    background-color: var(--color-dark-ghost);
    color: var(--content-on-dark-ghost);
  }
  tr.table-dark-ghost.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-dark-ghost);
  }
  tr.table-dark-ghost.table-hover:active, tr.table-dark-ghost.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-dark-ghost);
  }
  tr.table-white-ghost {
    background-color: var(--color-white-ghost);
    color: var(--content-on-white-ghost);
  }
  tr.table-white-ghost.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-white-ghost);
  }
  tr.table-white-ghost.table-hover:active, tr.table-white-ghost.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-white-ghost);
  }
  tr.table-black-ghost {
    background-color: var(--color-black-ghost);
    color: var(--content-on-black-ghost);
  }
  tr.table-black-ghost.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-black-ghost);
  }
  tr.table-black-ghost.table-hover:active, tr.table-black-ghost.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-black-ghost);
  }
}
@layer table-l11 {
  table.table-hover tbody th.table-primary,
  table.table-hover tbody td.table-primary {
    background-color: var(--color-primary);
    color: var(--content-on-primary);
  }
  table.table-hover tbody th.table-primary:hover,
  table.table-hover tbody td.table-primary:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-primary);
  }
  table.table-hover tbody th.table-primary:active, table.table-hover tbody th.table-primary.active,
  table.table-hover tbody td.table-primary:active,
  table.table-hover tbody td.table-primary.active {
    box-shadow: inset 0 0 0 9999px var(--active-primary);
  }
  thead.table-hover th.table-primary,
  thead.table-hover td.table-primary,
  tbody.table-hover th.table-primary,
  tbody.table-hover td.table-primary,
  tfoot.table-hover th.table-primary,
  tfoot.table-hover td.table-primary,
  tr.table-hover th.table-primary,
  tr.table-hover td.table-primary {
    background-color: var(--color-primary);
    color: var(--content-on-primary);
  }
  thead.table-hover th.table-primary:hover,
  thead.table-hover td.table-primary:hover,
  tbody.table-hover th.table-primary:hover,
  tbody.table-hover td.table-primary:hover,
  tfoot.table-hover th.table-primary:hover,
  tfoot.table-hover td.table-primary:hover,
  tr.table-hover th.table-primary:hover,
  tr.table-hover td.table-primary:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-primary);
  }
  thead.table-hover th.table-primary:active, thead.table-hover th.table-primary.active,
  thead.table-hover td.table-primary:active,
  thead.table-hover td.table-primary.active,
  tbody.table-hover th.table-primary:active,
  tbody.table-hover th.table-primary.active,
  tbody.table-hover td.table-primary:active,
  tbody.table-hover td.table-primary.active,
  tfoot.table-hover th.table-primary:active,
  tfoot.table-hover th.table-primary.active,
  tfoot.table-hover td.table-primary:active,
  tfoot.table-hover td.table-primary.active,
  tr.table-hover th.table-primary:active,
  tr.table-hover th.table-primary.active,
  tr.table-hover td.table-primary:active,
  tr.table-hover td.table-primary.active {
    box-shadow: inset 0 0 0 9999px var(--active-primary);
  }
  table.table-hover tbody th.table-secondary,
  table.table-hover tbody td.table-secondary {
    background-color: var(--color-secondary);
    color: var(--content-on-secondary);
  }
  table.table-hover tbody th.table-secondary:hover,
  table.table-hover tbody td.table-secondary:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-secondary);
  }
  table.table-hover tbody th.table-secondary:active, table.table-hover tbody th.table-secondary.active,
  table.table-hover tbody td.table-secondary:active,
  table.table-hover tbody td.table-secondary.active {
    box-shadow: inset 0 0 0 9999px var(--active-secondary);
  }
  thead.table-hover th.table-secondary,
  thead.table-hover td.table-secondary,
  tbody.table-hover th.table-secondary,
  tbody.table-hover td.table-secondary,
  tfoot.table-hover th.table-secondary,
  tfoot.table-hover td.table-secondary,
  tr.table-hover th.table-secondary,
  tr.table-hover td.table-secondary {
    background-color: var(--color-secondary);
    color: var(--content-on-secondary);
  }
  thead.table-hover th.table-secondary:hover,
  thead.table-hover td.table-secondary:hover,
  tbody.table-hover th.table-secondary:hover,
  tbody.table-hover td.table-secondary:hover,
  tfoot.table-hover th.table-secondary:hover,
  tfoot.table-hover td.table-secondary:hover,
  tr.table-hover th.table-secondary:hover,
  tr.table-hover td.table-secondary:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-secondary);
  }
  thead.table-hover th.table-secondary:active, thead.table-hover th.table-secondary.active,
  thead.table-hover td.table-secondary:active,
  thead.table-hover td.table-secondary.active,
  tbody.table-hover th.table-secondary:active,
  tbody.table-hover th.table-secondary.active,
  tbody.table-hover td.table-secondary:active,
  tbody.table-hover td.table-secondary.active,
  tfoot.table-hover th.table-secondary:active,
  tfoot.table-hover th.table-secondary.active,
  tfoot.table-hover td.table-secondary:active,
  tfoot.table-hover td.table-secondary.active,
  tr.table-hover th.table-secondary:active,
  tr.table-hover th.table-secondary.active,
  tr.table-hover td.table-secondary:active,
  tr.table-hover td.table-secondary.active {
    box-shadow: inset 0 0 0 9999px var(--active-secondary);
  }
  table.table-hover tbody th.table-tertiary,
  table.table-hover tbody td.table-tertiary {
    background-color: var(--color-tertiary);
    color: var(--content-on-tertiary);
  }
  table.table-hover tbody th.table-tertiary:hover,
  table.table-hover tbody td.table-tertiary:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-tertiary);
  }
  table.table-hover tbody th.table-tertiary:active, table.table-hover tbody th.table-tertiary.active,
  table.table-hover tbody td.table-tertiary:active,
  table.table-hover tbody td.table-tertiary.active {
    box-shadow: inset 0 0 0 9999px var(--active-tertiary);
  }
  thead.table-hover th.table-tertiary,
  thead.table-hover td.table-tertiary,
  tbody.table-hover th.table-tertiary,
  tbody.table-hover td.table-tertiary,
  tfoot.table-hover th.table-tertiary,
  tfoot.table-hover td.table-tertiary,
  tr.table-hover th.table-tertiary,
  tr.table-hover td.table-tertiary {
    background-color: var(--color-tertiary);
    color: var(--content-on-tertiary);
  }
  thead.table-hover th.table-tertiary:hover,
  thead.table-hover td.table-tertiary:hover,
  tbody.table-hover th.table-tertiary:hover,
  tbody.table-hover td.table-tertiary:hover,
  tfoot.table-hover th.table-tertiary:hover,
  tfoot.table-hover td.table-tertiary:hover,
  tr.table-hover th.table-tertiary:hover,
  tr.table-hover td.table-tertiary:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-tertiary);
  }
  thead.table-hover th.table-tertiary:active, thead.table-hover th.table-tertiary.active,
  thead.table-hover td.table-tertiary:active,
  thead.table-hover td.table-tertiary.active,
  tbody.table-hover th.table-tertiary:active,
  tbody.table-hover th.table-tertiary.active,
  tbody.table-hover td.table-tertiary:active,
  tbody.table-hover td.table-tertiary.active,
  tfoot.table-hover th.table-tertiary:active,
  tfoot.table-hover th.table-tertiary.active,
  tfoot.table-hover td.table-tertiary:active,
  tfoot.table-hover td.table-tertiary.active,
  tr.table-hover th.table-tertiary:active,
  tr.table-hover th.table-tertiary.active,
  tr.table-hover td.table-tertiary:active,
  tr.table-hover td.table-tertiary.active {
    box-shadow: inset 0 0 0 9999px var(--active-tertiary);
  }
  table.table-hover tbody th.table-success,
  table.table-hover tbody td.table-success {
    background-color: var(--color-success);
    color: var(--content-on-success);
  }
  table.table-hover tbody th.table-success:hover,
  table.table-hover tbody td.table-success:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-success);
  }
  table.table-hover tbody th.table-success:active, table.table-hover tbody th.table-success.active,
  table.table-hover tbody td.table-success:active,
  table.table-hover tbody td.table-success.active {
    box-shadow: inset 0 0 0 9999px var(--active-success);
  }
  thead.table-hover th.table-success,
  thead.table-hover td.table-success,
  tbody.table-hover th.table-success,
  tbody.table-hover td.table-success,
  tfoot.table-hover th.table-success,
  tfoot.table-hover td.table-success,
  tr.table-hover th.table-success,
  tr.table-hover td.table-success {
    background-color: var(--color-success);
    color: var(--content-on-success);
  }
  thead.table-hover th.table-success:hover,
  thead.table-hover td.table-success:hover,
  tbody.table-hover th.table-success:hover,
  tbody.table-hover td.table-success:hover,
  tfoot.table-hover th.table-success:hover,
  tfoot.table-hover td.table-success:hover,
  tr.table-hover th.table-success:hover,
  tr.table-hover td.table-success:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-success);
  }
  thead.table-hover th.table-success:active, thead.table-hover th.table-success.active,
  thead.table-hover td.table-success:active,
  thead.table-hover td.table-success.active,
  tbody.table-hover th.table-success:active,
  tbody.table-hover th.table-success.active,
  tbody.table-hover td.table-success:active,
  tbody.table-hover td.table-success.active,
  tfoot.table-hover th.table-success:active,
  tfoot.table-hover th.table-success.active,
  tfoot.table-hover td.table-success:active,
  tfoot.table-hover td.table-success.active,
  tr.table-hover th.table-success:active,
  tr.table-hover th.table-success.active,
  tr.table-hover td.table-success:active,
  tr.table-hover td.table-success.active {
    box-shadow: inset 0 0 0 9999px var(--active-success);
  }
  table.table-hover tbody th.table-info,
  table.table-hover tbody td.table-info {
    background-color: var(--color-info);
    color: var(--content-on-info);
  }
  table.table-hover tbody th.table-info:hover,
  table.table-hover tbody td.table-info:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-info);
  }
  table.table-hover tbody th.table-info:active, table.table-hover tbody th.table-info.active,
  table.table-hover tbody td.table-info:active,
  table.table-hover tbody td.table-info.active {
    box-shadow: inset 0 0 0 9999px var(--active-info);
  }
  thead.table-hover th.table-info,
  thead.table-hover td.table-info,
  tbody.table-hover th.table-info,
  tbody.table-hover td.table-info,
  tfoot.table-hover th.table-info,
  tfoot.table-hover td.table-info,
  tr.table-hover th.table-info,
  tr.table-hover td.table-info {
    background-color: var(--color-info);
    color: var(--content-on-info);
  }
  thead.table-hover th.table-info:hover,
  thead.table-hover td.table-info:hover,
  tbody.table-hover th.table-info:hover,
  tbody.table-hover td.table-info:hover,
  tfoot.table-hover th.table-info:hover,
  tfoot.table-hover td.table-info:hover,
  tr.table-hover th.table-info:hover,
  tr.table-hover td.table-info:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-info);
  }
  thead.table-hover th.table-info:active, thead.table-hover th.table-info.active,
  thead.table-hover td.table-info:active,
  thead.table-hover td.table-info.active,
  tbody.table-hover th.table-info:active,
  tbody.table-hover th.table-info.active,
  tbody.table-hover td.table-info:active,
  tbody.table-hover td.table-info.active,
  tfoot.table-hover th.table-info:active,
  tfoot.table-hover th.table-info.active,
  tfoot.table-hover td.table-info:active,
  tfoot.table-hover td.table-info.active,
  tr.table-hover th.table-info:active,
  tr.table-hover th.table-info.active,
  tr.table-hover td.table-info:active,
  tr.table-hover td.table-info.active {
    box-shadow: inset 0 0 0 9999px var(--active-info);
  }
  table.table-hover tbody th.table-warning,
  table.table-hover tbody td.table-warning {
    background-color: var(--color-warning);
    color: var(--content-on-warning);
  }
  table.table-hover tbody th.table-warning:hover,
  table.table-hover tbody td.table-warning:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-warning);
  }
  table.table-hover tbody th.table-warning:active, table.table-hover tbody th.table-warning.active,
  table.table-hover tbody td.table-warning:active,
  table.table-hover tbody td.table-warning.active {
    box-shadow: inset 0 0 0 9999px var(--active-warning);
  }
  thead.table-hover th.table-warning,
  thead.table-hover td.table-warning,
  tbody.table-hover th.table-warning,
  tbody.table-hover td.table-warning,
  tfoot.table-hover th.table-warning,
  tfoot.table-hover td.table-warning,
  tr.table-hover th.table-warning,
  tr.table-hover td.table-warning {
    background-color: var(--color-warning);
    color: var(--content-on-warning);
  }
  thead.table-hover th.table-warning:hover,
  thead.table-hover td.table-warning:hover,
  tbody.table-hover th.table-warning:hover,
  tbody.table-hover td.table-warning:hover,
  tfoot.table-hover th.table-warning:hover,
  tfoot.table-hover td.table-warning:hover,
  tr.table-hover th.table-warning:hover,
  tr.table-hover td.table-warning:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-warning);
  }
  thead.table-hover th.table-warning:active, thead.table-hover th.table-warning.active,
  thead.table-hover td.table-warning:active,
  thead.table-hover td.table-warning.active,
  tbody.table-hover th.table-warning:active,
  tbody.table-hover th.table-warning.active,
  tbody.table-hover td.table-warning:active,
  tbody.table-hover td.table-warning.active,
  tfoot.table-hover th.table-warning:active,
  tfoot.table-hover th.table-warning.active,
  tfoot.table-hover td.table-warning:active,
  tfoot.table-hover td.table-warning.active,
  tr.table-hover th.table-warning:active,
  tr.table-hover th.table-warning.active,
  tr.table-hover td.table-warning:active,
  tr.table-hover td.table-warning.active {
    box-shadow: inset 0 0 0 9999px var(--active-warning);
  }
  table.table-hover tbody th.table-danger,
  table.table-hover tbody td.table-danger {
    background-color: var(--color-danger);
    color: var(--content-on-danger);
  }
  table.table-hover tbody th.table-danger:hover,
  table.table-hover tbody td.table-danger:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-danger);
  }
  table.table-hover tbody th.table-danger:active, table.table-hover tbody th.table-danger.active,
  table.table-hover tbody td.table-danger:active,
  table.table-hover tbody td.table-danger.active {
    box-shadow: inset 0 0 0 9999px var(--active-danger);
  }
  thead.table-hover th.table-danger,
  thead.table-hover td.table-danger,
  tbody.table-hover th.table-danger,
  tbody.table-hover td.table-danger,
  tfoot.table-hover th.table-danger,
  tfoot.table-hover td.table-danger,
  tr.table-hover th.table-danger,
  tr.table-hover td.table-danger {
    background-color: var(--color-danger);
    color: var(--content-on-danger);
  }
  thead.table-hover th.table-danger:hover,
  thead.table-hover td.table-danger:hover,
  tbody.table-hover th.table-danger:hover,
  tbody.table-hover td.table-danger:hover,
  tfoot.table-hover th.table-danger:hover,
  tfoot.table-hover td.table-danger:hover,
  tr.table-hover th.table-danger:hover,
  tr.table-hover td.table-danger:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-danger);
  }
  thead.table-hover th.table-danger:active, thead.table-hover th.table-danger.active,
  thead.table-hover td.table-danger:active,
  thead.table-hover td.table-danger.active,
  tbody.table-hover th.table-danger:active,
  tbody.table-hover th.table-danger.active,
  tbody.table-hover td.table-danger:active,
  tbody.table-hover td.table-danger.active,
  tfoot.table-hover th.table-danger:active,
  tfoot.table-hover th.table-danger.active,
  tfoot.table-hover td.table-danger:active,
  tfoot.table-hover td.table-danger.active,
  tr.table-hover th.table-danger:active,
  tr.table-hover th.table-danger.active,
  tr.table-hover td.table-danger:active,
  tr.table-hover td.table-danger.active {
    box-shadow: inset 0 0 0 9999px var(--active-danger);
  }
  table.table-hover tbody th.table-neutral,
  table.table-hover tbody td.table-neutral {
    background-color: var(--color-neutral);
    color: var(--content-on-neutral);
  }
  table.table-hover tbody th.table-neutral:hover,
  table.table-hover tbody td.table-neutral:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-neutral);
  }
  table.table-hover tbody th.table-neutral:active, table.table-hover tbody th.table-neutral.active,
  table.table-hover tbody td.table-neutral:active,
  table.table-hover tbody td.table-neutral.active {
    box-shadow: inset 0 0 0 9999px var(--active-neutral);
  }
  thead.table-hover th.table-neutral,
  thead.table-hover td.table-neutral,
  tbody.table-hover th.table-neutral,
  tbody.table-hover td.table-neutral,
  tfoot.table-hover th.table-neutral,
  tfoot.table-hover td.table-neutral,
  tr.table-hover th.table-neutral,
  tr.table-hover td.table-neutral {
    background-color: var(--color-neutral);
    color: var(--content-on-neutral);
  }
  thead.table-hover th.table-neutral:hover,
  thead.table-hover td.table-neutral:hover,
  tbody.table-hover th.table-neutral:hover,
  tbody.table-hover td.table-neutral:hover,
  tfoot.table-hover th.table-neutral:hover,
  tfoot.table-hover td.table-neutral:hover,
  tr.table-hover th.table-neutral:hover,
  tr.table-hover td.table-neutral:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-neutral);
  }
  thead.table-hover th.table-neutral:active, thead.table-hover th.table-neutral.active,
  thead.table-hover td.table-neutral:active,
  thead.table-hover td.table-neutral.active,
  tbody.table-hover th.table-neutral:active,
  tbody.table-hover th.table-neutral.active,
  tbody.table-hover td.table-neutral:active,
  tbody.table-hover td.table-neutral.active,
  tfoot.table-hover th.table-neutral:active,
  tfoot.table-hover th.table-neutral.active,
  tfoot.table-hover td.table-neutral:active,
  tfoot.table-hover td.table-neutral.active,
  tr.table-hover th.table-neutral:active,
  tr.table-hover th.table-neutral.active,
  tr.table-hover td.table-neutral:active,
  tr.table-hover td.table-neutral.active {
    box-shadow: inset 0 0 0 9999px var(--active-neutral);
  }
  table.table-hover tbody th.table-light,
  table.table-hover tbody td.table-light {
    background-color: var(--color-light);
    color: var(--content-on-light);
  }
  table.table-hover tbody th.table-light:hover,
  table.table-hover tbody td.table-light:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-light);
  }
  table.table-hover tbody th.table-light:active, table.table-hover tbody th.table-light.active,
  table.table-hover tbody td.table-light:active,
  table.table-hover tbody td.table-light.active {
    box-shadow: inset 0 0 0 9999px var(--active-light);
  }
  thead.table-hover th.table-light,
  thead.table-hover td.table-light,
  tbody.table-hover th.table-light,
  tbody.table-hover td.table-light,
  tfoot.table-hover th.table-light,
  tfoot.table-hover td.table-light,
  tr.table-hover th.table-light,
  tr.table-hover td.table-light {
    background-color: var(--color-light);
    color: var(--content-on-light);
  }
  thead.table-hover th.table-light:hover,
  thead.table-hover td.table-light:hover,
  tbody.table-hover th.table-light:hover,
  tbody.table-hover td.table-light:hover,
  tfoot.table-hover th.table-light:hover,
  tfoot.table-hover td.table-light:hover,
  tr.table-hover th.table-light:hover,
  tr.table-hover td.table-light:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-light);
  }
  thead.table-hover th.table-light:active, thead.table-hover th.table-light.active,
  thead.table-hover td.table-light:active,
  thead.table-hover td.table-light.active,
  tbody.table-hover th.table-light:active,
  tbody.table-hover th.table-light.active,
  tbody.table-hover td.table-light:active,
  tbody.table-hover td.table-light.active,
  tfoot.table-hover th.table-light:active,
  tfoot.table-hover th.table-light.active,
  tfoot.table-hover td.table-light:active,
  tfoot.table-hover td.table-light.active,
  tr.table-hover th.table-light:active,
  tr.table-hover th.table-light.active,
  tr.table-hover td.table-light:active,
  tr.table-hover td.table-light.active {
    box-shadow: inset 0 0 0 9999px var(--active-light);
  }
  table.table-hover tbody th.table-dark,
  table.table-hover tbody td.table-dark {
    background-color: var(--color-dark);
    color: var(--content-on-dark);
  }
  table.table-hover tbody th.table-dark:hover,
  table.table-hover tbody td.table-dark:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-dark);
  }
  table.table-hover tbody th.table-dark:active, table.table-hover tbody th.table-dark.active,
  table.table-hover tbody td.table-dark:active,
  table.table-hover tbody td.table-dark.active {
    box-shadow: inset 0 0 0 9999px var(--active-dark);
  }
  thead.table-hover th.table-dark,
  thead.table-hover td.table-dark,
  tbody.table-hover th.table-dark,
  tbody.table-hover td.table-dark,
  tfoot.table-hover th.table-dark,
  tfoot.table-hover td.table-dark,
  tr.table-hover th.table-dark,
  tr.table-hover td.table-dark {
    background-color: var(--color-dark);
    color: var(--content-on-dark);
  }
  thead.table-hover th.table-dark:hover,
  thead.table-hover td.table-dark:hover,
  tbody.table-hover th.table-dark:hover,
  tbody.table-hover td.table-dark:hover,
  tfoot.table-hover th.table-dark:hover,
  tfoot.table-hover td.table-dark:hover,
  tr.table-hover th.table-dark:hover,
  tr.table-hover td.table-dark:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-dark);
  }
  thead.table-hover th.table-dark:active, thead.table-hover th.table-dark.active,
  thead.table-hover td.table-dark:active,
  thead.table-hover td.table-dark.active,
  tbody.table-hover th.table-dark:active,
  tbody.table-hover th.table-dark.active,
  tbody.table-hover td.table-dark:active,
  tbody.table-hover td.table-dark.active,
  tfoot.table-hover th.table-dark:active,
  tfoot.table-hover th.table-dark.active,
  tfoot.table-hover td.table-dark:active,
  tfoot.table-hover td.table-dark.active,
  tr.table-hover th.table-dark:active,
  tr.table-hover th.table-dark.active,
  tr.table-hover td.table-dark:active,
  tr.table-hover td.table-dark.active {
    box-shadow: inset 0 0 0 9999px var(--active-dark);
  }
  table.table-hover tbody th.table-white,
  table.table-hover tbody td.table-white {
    background-color: var(--color-white);
    color: var(--content-on-white);
  }
  table.table-hover tbody th.table-white:hover,
  table.table-hover tbody td.table-white:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-white);
  }
  table.table-hover tbody th.table-white:active, table.table-hover tbody th.table-white.active,
  table.table-hover tbody td.table-white:active,
  table.table-hover tbody td.table-white.active {
    box-shadow: inset 0 0 0 9999px var(--active-white);
  }
  thead.table-hover th.table-white,
  thead.table-hover td.table-white,
  tbody.table-hover th.table-white,
  tbody.table-hover td.table-white,
  tfoot.table-hover th.table-white,
  tfoot.table-hover td.table-white,
  tr.table-hover th.table-white,
  tr.table-hover td.table-white {
    background-color: var(--color-white);
    color: var(--content-on-white);
  }
  thead.table-hover th.table-white:hover,
  thead.table-hover td.table-white:hover,
  tbody.table-hover th.table-white:hover,
  tbody.table-hover td.table-white:hover,
  tfoot.table-hover th.table-white:hover,
  tfoot.table-hover td.table-white:hover,
  tr.table-hover th.table-white:hover,
  tr.table-hover td.table-white:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-white);
  }
  thead.table-hover th.table-white:active, thead.table-hover th.table-white.active,
  thead.table-hover td.table-white:active,
  thead.table-hover td.table-white.active,
  tbody.table-hover th.table-white:active,
  tbody.table-hover th.table-white.active,
  tbody.table-hover td.table-white:active,
  tbody.table-hover td.table-white.active,
  tfoot.table-hover th.table-white:active,
  tfoot.table-hover th.table-white.active,
  tfoot.table-hover td.table-white:active,
  tfoot.table-hover td.table-white.active,
  tr.table-hover th.table-white:active,
  tr.table-hover th.table-white.active,
  tr.table-hover td.table-white:active,
  tr.table-hover td.table-white.active {
    box-shadow: inset 0 0 0 9999px var(--active-white);
  }
  table.table-hover tbody th.table-black,
  table.table-hover tbody td.table-black {
    background-color: var(--color-black);
    color: var(--content-on-black);
  }
  table.table-hover tbody th.table-black:hover,
  table.table-hover tbody td.table-black:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-black);
  }
  table.table-hover tbody th.table-black:active, table.table-hover tbody th.table-black.active,
  table.table-hover tbody td.table-black:active,
  table.table-hover tbody td.table-black.active {
    box-shadow: inset 0 0 0 9999px var(--active-black);
  }
  thead.table-hover th.table-black,
  thead.table-hover td.table-black,
  tbody.table-hover th.table-black,
  tbody.table-hover td.table-black,
  tfoot.table-hover th.table-black,
  tfoot.table-hover td.table-black,
  tr.table-hover th.table-black,
  tr.table-hover td.table-black {
    background-color: var(--color-black);
    color: var(--content-on-black);
  }
  thead.table-hover th.table-black:hover,
  thead.table-hover td.table-black:hover,
  tbody.table-hover th.table-black:hover,
  tbody.table-hover td.table-black:hover,
  tfoot.table-hover th.table-black:hover,
  tfoot.table-hover td.table-black:hover,
  tr.table-hover th.table-black:hover,
  tr.table-hover td.table-black:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-black);
  }
  thead.table-hover th.table-black:active, thead.table-hover th.table-black.active,
  thead.table-hover td.table-black:active,
  thead.table-hover td.table-black.active,
  tbody.table-hover th.table-black:active,
  tbody.table-hover th.table-black.active,
  tbody.table-hover td.table-black:active,
  tbody.table-hover td.table-black.active,
  tfoot.table-hover th.table-black:active,
  tfoot.table-hover th.table-black.active,
  tfoot.table-hover td.table-black:active,
  tfoot.table-hover td.table-black.active,
  tr.table-hover th.table-black:active,
  tr.table-hover th.table-black.active,
  tr.table-hover td.table-black:active,
  tr.table-hover td.table-black.active {
    box-shadow: inset 0 0 0 9999px var(--active-black);
  }
  table.table-hover tbody th.table-primary-ghost,
  table.table-hover tbody td.table-primary-ghost {
    background-color: var(--color-primary-ghost);
    color: var(--content-on-primary-ghost);
  }
  table.table-hover tbody th.table-primary-ghost:hover,
  table.table-hover tbody td.table-primary-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-primary-ghost);
  }
  table.table-hover tbody th.table-primary-ghost:active, table.table-hover tbody th.table-primary-ghost.active,
  table.table-hover tbody td.table-primary-ghost:active,
  table.table-hover tbody td.table-primary-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-primary-ghost);
  }
  thead.table-hover th.table-primary-ghost,
  thead.table-hover td.table-primary-ghost,
  tbody.table-hover th.table-primary-ghost,
  tbody.table-hover td.table-primary-ghost,
  tfoot.table-hover th.table-primary-ghost,
  tfoot.table-hover td.table-primary-ghost,
  tr.table-hover th.table-primary-ghost,
  tr.table-hover td.table-primary-ghost {
    background-color: var(--color-primary-ghost);
    color: var(--content-on-primary-ghost);
  }
  thead.table-hover th.table-primary-ghost:hover,
  thead.table-hover td.table-primary-ghost:hover,
  tbody.table-hover th.table-primary-ghost:hover,
  tbody.table-hover td.table-primary-ghost:hover,
  tfoot.table-hover th.table-primary-ghost:hover,
  tfoot.table-hover td.table-primary-ghost:hover,
  tr.table-hover th.table-primary-ghost:hover,
  tr.table-hover td.table-primary-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-primary-ghost);
  }
  thead.table-hover th.table-primary-ghost:active, thead.table-hover th.table-primary-ghost.active,
  thead.table-hover td.table-primary-ghost:active,
  thead.table-hover td.table-primary-ghost.active,
  tbody.table-hover th.table-primary-ghost:active,
  tbody.table-hover th.table-primary-ghost.active,
  tbody.table-hover td.table-primary-ghost:active,
  tbody.table-hover td.table-primary-ghost.active,
  tfoot.table-hover th.table-primary-ghost:active,
  tfoot.table-hover th.table-primary-ghost.active,
  tfoot.table-hover td.table-primary-ghost:active,
  tfoot.table-hover td.table-primary-ghost.active,
  tr.table-hover th.table-primary-ghost:active,
  tr.table-hover th.table-primary-ghost.active,
  tr.table-hover td.table-primary-ghost:active,
  tr.table-hover td.table-primary-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-primary-ghost);
  }
  table.table-hover tbody th.table-secondary-ghost,
  table.table-hover tbody td.table-secondary-ghost {
    background-color: var(--color-secondary-ghost);
    color: var(--content-on-secondary-ghost);
  }
  table.table-hover tbody th.table-secondary-ghost:hover,
  table.table-hover tbody td.table-secondary-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-secondary-ghost);
  }
  table.table-hover tbody th.table-secondary-ghost:active, table.table-hover tbody th.table-secondary-ghost.active,
  table.table-hover tbody td.table-secondary-ghost:active,
  table.table-hover tbody td.table-secondary-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-secondary-ghost);
  }
  thead.table-hover th.table-secondary-ghost,
  thead.table-hover td.table-secondary-ghost,
  tbody.table-hover th.table-secondary-ghost,
  tbody.table-hover td.table-secondary-ghost,
  tfoot.table-hover th.table-secondary-ghost,
  tfoot.table-hover td.table-secondary-ghost,
  tr.table-hover th.table-secondary-ghost,
  tr.table-hover td.table-secondary-ghost {
    background-color: var(--color-secondary-ghost);
    color: var(--content-on-secondary-ghost);
  }
  thead.table-hover th.table-secondary-ghost:hover,
  thead.table-hover td.table-secondary-ghost:hover,
  tbody.table-hover th.table-secondary-ghost:hover,
  tbody.table-hover td.table-secondary-ghost:hover,
  tfoot.table-hover th.table-secondary-ghost:hover,
  tfoot.table-hover td.table-secondary-ghost:hover,
  tr.table-hover th.table-secondary-ghost:hover,
  tr.table-hover td.table-secondary-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-secondary-ghost);
  }
  thead.table-hover th.table-secondary-ghost:active, thead.table-hover th.table-secondary-ghost.active,
  thead.table-hover td.table-secondary-ghost:active,
  thead.table-hover td.table-secondary-ghost.active,
  tbody.table-hover th.table-secondary-ghost:active,
  tbody.table-hover th.table-secondary-ghost.active,
  tbody.table-hover td.table-secondary-ghost:active,
  tbody.table-hover td.table-secondary-ghost.active,
  tfoot.table-hover th.table-secondary-ghost:active,
  tfoot.table-hover th.table-secondary-ghost.active,
  tfoot.table-hover td.table-secondary-ghost:active,
  tfoot.table-hover td.table-secondary-ghost.active,
  tr.table-hover th.table-secondary-ghost:active,
  tr.table-hover th.table-secondary-ghost.active,
  tr.table-hover td.table-secondary-ghost:active,
  tr.table-hover td.table-secondary-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-secondary-ghost);
  }
  table.table-hover tbody th.table-tertiary-ghost,
  table.table-hover tbody td.table-tertiary-ghost {
    background-color: var(--color-tertiary-ghost);
    color: var(--content-on-tertiary-ghost);
  }
  table.table-hover tbody th.table-tertiary-ghost:hover,
  table.table-hover tbody td.table-tertiary-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-tertiary-ghost);
  }
  table.table-hover tbody th.table-tertiary-ghost:active, table.table-hover tbody th.table-tertiary-ghost.active,
  table.table-hover tbody td.table-tertiary-ghost:active,
  table.table-hover tbody td.table-tertiary-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-tertiary-ghost);
  }
  thead.table-hover th.table-tertiary-ghost,
  thead.table-hover td.table-tertiary-ghost,
  tbody.table-hover th.table-tertiary-ghost,
  tbody.table-hover td.table-tertiary-ghost,
  tfoot.table-hover th.table-tertiary-ghost,
  tfoot.table-hover td.table-tertiary-ghost,
  tr.table-hover th.table-tertiary-ghost,
  tr.table-hover td.table-tertiary-ghost {
    background-color: var(--color-tertiary-ghost);
    color: var(--content-on-tertiary-ghost);
  }
  thead.table-hover th.table-tertiary-ghost:hover,
  thead.table-hover td.table-tertiary-ghost:hover,
  tbody.table-hover th.table-tertiary-ghost:hover,
  tbody.table-hover td.table-tertiary-ghost:hover,
  tfoot.table-hover th.table-tertiary-ghost:hover,
  tfoot.table-hover td.table-tertiary-ghost:hover,
  tr.table-hover th.table-tertiary-ghost:hover,
  tr.table-hover td.table-tertiary-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-tertiary-ghost);
  }
  thead.table-hover th.table-tertiary-ghost:active, thead.table-hover th.table-tertiary-ghost.active,
  thead.table-hover td.table-tertiary-ghost:active,
  thead.table-hover td.table-tertiary-ghost.active,
  tbody.table-hover th.table-tertiary-ghost:active,
  tbody.table-hover th.table-tertiary-ghost.active,
  tbody.table-hover td.table-tertiary-ghost:active,
  tbody.table-hover td.table-tertiary-ghost.active,
  tfoot.table-hover th.table-tertiary-ghost:active,
  tfoot.table-hover th.table-tertiary-ghost.active,
  tfoot.table-hover td.table-tertiary-ghost:active,
  tfoot.table-hover td.table-tertiary-ghost.active,
  tr.table-hover th.table-tertiary-ghost:active,
  tr.table-hover th.table-tertiary-ghost.active,
  tr.table-hover td.table-tertiary-ghost:active,
  tr.table-hover td.table-tertiary-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-tertiary-ghost);
  }
  table.table-hover tbody th.table-success-ghost,
  table.table-hover tbody td.table-success-ghost {
    background-color: var(--color-success-ghost);
    color: var(--content-on-success-ghost);
  }
  table.table-hover tbody th.table-success-ghost:hover,
  table.table-hover tbody td.table-success-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-success-ghost);
  }
  table.table-hover tbody th.table-success-ghost:active, table.table-hover tbody th.table-success-ghost.active,
  table.table-hover tbody td.table-success-ghost:active,
  table.table-hover tbody td.table-success-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-success-ghost);
  }
  thead.table-hover th.table-success-ghost,
  thead.table-hover td.table-success-ghost,
  tbody.table-hover th.table-success-ghost,
  tbody.table-hover td.table-success-ghost,
  tfoot.table-hover th.table-success-ghost,
  tfoot.table-hover td.table-success-ghost,
  tr.table-hover th.table-success-ghost,
  tr.table-hover td.table-success-ghost {
    background-color: var(--color-success-ghost);
    color: var(--content-on-success-ghost);
  }
  thead.table-hover th.table-success-ghost:hover,
  thead.table-hover td.table-success-ghost:hover,
  tbody.table-hover th.table-success-ghost:hover,
  tbody.table-hover td.table-success-ghost:hover,
  tfoot.table-hover th.table-success-ghost:hover,
  tfoot.table-hover td.table-success-ghost:hover,
  tr.table-hover th.table-success-ghost:hover,
  tr.table-hover td.table-success-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-success-ghost);
  }
  thead.table-hover th.table-success-ghost:active, thead.table-hover th.table-success-ghost.active,
  thead.table-hover td.table-success-ghost:active,
  thead.table-hover td.table-success-ghost.active,
  tbody.table-hover th.table-success-ghost:active,
  tbody.table-hover th.table-success-ghost.active,
  tbody.table-hover td.table-success-ghost:active,
  tbody.table-hover td.table-success-ghost.active,
  tfoot.table-hover th.table-success-ghost:active,
  tfoot.table-hover th.table-success-ghost.active,
  tfoot.table-hover td.table-success-ghost:active,
  tfoot.table-hover td.table-success-ghost.active,
  tr.table-hover th.table-success-ghost:active,
  tr.table-hover th.table-success-ghost.active,
  tr.table-hover td.table-success-ghost:active,
  tr.table-hover td.table-success-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-success-ghost);
  }
  table.table-hover tbody th.table-info-ghost,
  table.table-hover tbody td.table-info-ghost {
    background-color: var(--color-info-ghost);
    color: var(--content-on-info-ghost);
  }
  table.table-hover tbody th.table-info-ghost:hover,
  table.table-hover tbody td.table-info-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-info-ghost);
  }
  table.table-hover tbody th.table-info-ghost:active, table.table-hover tbody th.table-info-ghost.active,
  table.table-hover tbody td.table-info-ghost:active,
  table.table-hover tbody td.table-info-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-info-ghost);
  }
  thead.table-hover th.table-info-ghost,
  thead.table-hover td.table-info-ghost,
  tbody.table-hover th.table-info-ghost,
  tbody.table-hover td.table-info-ghost,
  tfoot.table-hover th.table-info-ghost,
  tfoot.table-hover td.table-info-ghost,
  tr.table-hover th.table-info-ghost,
  tr.table-hover td.table-info-ghost {
    background-color: var(--color-info-ghost);
    color: var(--content-on-info-ghost);
  }
  thead.table-hover th.table-info-ghost:hover,
  thead.table-hover td.table-info-ghost:hover,
  tbody.table-hover th.table-info-ghost:hover,
  tbody.table-hover td.table-info-ghost:hover,
  tfoot.table-hover th.table-info-ghost:hover,
  tfoot.table-hover td.table-info-ghost:hover,
  tr.table-hover th.table-info-ghost:hover,
  tr.table-hover td.table-info-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-info-ghost);
  }
  thead.table-hover th.table-info-ghost:active, thead.table-hover th.table-info-ghost.active,
  thead.table-hover td.table-info-ghost:active,
  thead.table-hover td.table-info-ghost.active,
  tbody.table-hover th.table-info-ghost:active,
  tbody.table-hover th.table-info-ghost.active,
  tbody.table-hover td.table-info-ghost:active,
  tbody.table-hover td.table-info-ghost.active,
  tfoot.table-hover th.table-info-ghost:active,
  tfoot.table-hover th.table-info-ghost.active,
  tfoot.table-hover td.table-info-ghost:active,
  tfoot.table-hover td.table-info-ghost.active,
  tr.table-hover th.table-info-ghost:active,
  tr.table-hover th.table-info-ghost.active,
  tr.table-hover td.table-info-ghost:active,
  tr.table-hover td.table-info-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-info-ghost);
  }
  table.table-hover tbody th.table-warning-ghost,
  table.table-hover tbody td.table-warning-ghost {
    background-color: var(--color-warning-ghost);
    color: var(--content-on-warning-ghost);
  }
  table.table-hover tbody th.table-warning-ghost:hover,
  table.table-hover tbody td.table-warning-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-warning-ghost);
  }
  table.table-hover tbody th.table-warning-ghost:active, table.table-hover tbody th.table-warning-ghost.active,
  table.table-hover tbody td.table-warning-ghost:active,
  table.table-hover tbody td.table-warning-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-warning-ghost);
  }
  thead.table-hover th.table-warning-ghost,
  thead.table-hover td.table-warning-ghost,
  tbody.table-hover th.table-warning-ghost,
  tbody.table-hover td.table-warning-ghost,
  tfoot.table-hover th.table-warning-ghost,
  tfoot.table-hover td.table-warning-ghost,
  tr.table-hover th.table-warning-ghost,
  tr.table-hover td.table-warning-ghost {
    background-color: var(--color-warning-ghost);
    color: var(--content-on-warning-ghost);
  }
  thead.table-hover th.table-warning-ghost:hover,
  thead.table-hover td.table-warning-ghost:hover,
  tbody.table-hover th.table-warning-ghost:hover,
  tbody.table-hover td.table-warning-ghost:hover,
  tfoot.table-hover th.table-warning-ghost:hover,
  tfoot.table-hover td.table-warning-ghost:hover,
  tr.table-hover th.table-warning-ghost:hover,
  tr.table-hover td.table-warning-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-warning-ghost);
  }
  thead.table-hover th.table-warning-ghost:active, thead.table-hover th.table-warning-ghost.active,
  thead.table-hover td.table-warning-ghost:active,
  thead.table-hover td.table-warning-ghost.active,
  tbody.table-hover th.table-warning-ghost:active,
  tbody.table-hover th.table-warning-ghost.active,
  tbody.table-hover td.table-warning-ghost:active,
  tbody.table-hover td.table-warning-ghost.active,
  tfoot.table-hover th.table-warning-ghost:active,
  tfoot.table-hover th.table-warning-ghost.active,
  tfoot.table-hover td.table-warning-ghost:active,
  tfoot.table-hover td.table-warning-ghost.active,
  tr.table-hover th.table-warning-ghost:active,
  tr.table-hover th.table-warning-ghost.active,
  tr.table-hover td.table-warning-ghost:active,
  tr.table-hover td.table-warning-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-warning-ghost);
  }
  table.table-hover tbody th.table-danger-ghost,
  table.table-hover tbody td.table-danger-ghost {
    background-color: var(--color-danger-ghost);
    color: var(--content-on-danger-ghost);
  }
  table.table-hover tbody th.table-danger-ghost:hover,
  table.table-hover tbody td.table-danger-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-danger-ghost);
  }
  table.table-hover tbody th.table-danger-ghost:active, table.table-hover tbody th.table-danger-ghost.active,
  table.table-hover tbody td.table-danger-ghost:active,
  table.table-hover tbody td.table-danger-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-danger-ghost);
  }
  thead.table-hover th.table-danger-ghost,
  thead.table-hover td.table-danger-ghost,
  tbody.table-hover th.table-danger-ghost,
  tbody.table-hover td.table-danger-ghost,
  tfoot.table-hover th.table-danger-ghost,
  tfoot.table-hover td.table-danger-ghost,
  tr.table-hover th.table-danger-ghost,
  tr.table-hover td.table-danger-ghost {
    background-color: var(--color-danger-ghost);
    color: var(--content-on-danger-ghost);
  }
  thead.table-hover th.table-danger-ghost:hover,
  thead.table-hover td.table-danger-ghost:hover,
  tbody.table-hover th.table-danger-ghost:hover,
  tbody.table-hover td.table-danger-ghost:hover,
  tfoot.table-hover th.table-danger-ghost:hover,
  tfoot.table-hover td.table-danger-ghost:hover,
  tr.table-hover th.table-danger-ghost:hover,
  tr.table-hover td.table-danger-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-danger-ghost);
  }
  thead.table-hover th.table-danger-ghost:active, thead.table-hover th.table-danger-ghost.active,
  thead.table-hover td.table-danger-ghost:active,
  thead.table-hover td.table-danger-ghost.active,
  tbody.table-hover th.table-danger-ghost:active,
  tbody.table-hover th.table-danger-ghost.active,
  tbody.table-hover td.table-danger-ghost:active,
  tbody.table-hover td.table-danger-ghost.active,
  tfoot.table-hover th.table-danger-ghost:active,
  tfoot.table-hover th.table-danger-ghost.active,
  tfoot.table-hover td.table-danger-ghost:active,
  tfoot.table-hover td.table-danger-ghost.active,
  tr.table-hover th.table-danger-ghost:active,
  tr.table-hover th.table-danger-ghost.active,
  tr.table-hover td.table-danger-ghost:active,
  tr.table-hover td.table-danger-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-danger-ghost);
  }
  table.table-hover tbody th.table-neutral-ghost,
  table.table-hover tbody td.table-neutral-ghost {
    background-color: var(--color-neutral-ghost);
    color: var(--content-on-neutral-ghost);
  }
  table.table-hover tbody th.table-neutral-ghost:hover,
  table.table-hover tbody td.table-neutral-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-neutral-ghost);
  }
  table.table-hover tbody th.table-neutral-ghost:active, table.table-hover tbody th.table-neutral-ghost.active,
  table.table-hover tbody td.table-neutral-ghost:active,
  table.table-hover tbody td.table-neutral-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-neutral-ghost);
  }
  thead.table-hover th.table-neutral-ghost,
  thead.table-hover td.table-neutral-ghost,
  tbody.table-hover th.table-neutral-ghost,
  tbody.table-hover td.table-neutral-ghost,
  tfoot.table-hover th.table-neutral-ghost,
  tfoot.table-hover td.table-neutral-ghost,
  tr.table-hover th.table-neutral-ghost,
  tr.table-hover td.table-neutral-ghost {
    background-color: var(--color-neutral-ghost);
    color: var(--content-on-neutral-ghost);
  }
  thead.table-hover th.table-neutral-ghost:hover,
  thead.table-hover td.table-neutral-ghost:hover,
  tbody.table-hover th.table-neutral-ghost:hover,
  tbody.table-hover td.table-neutral-ghost:hover,
  tfoot.table-hover th.table-neutral-ghost:hover,
  tfoot.table-hover td.table-neutral-ghost:hover,
  tr.table-hover th.table-neutral-ghost:hover,
  tr.table-hover td.table-neutral-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-neutral-ghost);
  }
  thead.table-hover th.table-neutral-ghost:active, thead.table-hover th.table-neutral-ghost.active,
  thead.table-hover td.table-neutral-ghost:active,
  thead.table-hover td.table-neutral-ghost.active,
  tbody.table-hover th.table-neutral-ghost:active,
  tbody.table-hover th.table-neutral-ghost.active,
  tbody.table-hover td.table-neutral-ghost:active,
  tbody.table-hover td.table-neutral-ghost.active,
  tfoot.table-hover th.table-neutral-ghost:active,
  tfoot.table-hover th.table-neutral-ghost.active,
  tfoot.table-hover td.table-neutral-ghost:active,
  tfoot.table-hover td.table-neutral-ghost.active,
  tr.table-hover th.table-neutral-ghost:active,
  tr.table-hover th.table-neutral-ghost.active,
  tr.table-hover td.table-neutral-ghost:active,
  tr.table-hover td.table-neutral-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-neutral-ghost);
  }
  table.table-hover tbody th.table-light-ghost,
  table.table-hover tbody td.table-light-ghost {
    background-color: var(--color-light-ghost);
    color: var(--content-on-light-ghost);
  }
  table.table-hover tbody th.table-light-ghost:hover,
  table.table-hover tbody td.table-light-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-light-ghost);
  }
  table.table-hover tbody th.table-light-ghost:active, table.table-hover tbody th.table-light-ghost.active,
  table.table-hover tbody td.table-light-ghost:active,
  table.table-hover tbody td.table-light-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-light-ghost);
  }
  thead.table-hover th.table-light-ghost,
  thead.table-hover td.table-light-ghost,
  tbody.table-hover th.table-light-ghost,
  tbody.table-hover td.table-light-ghost,
  tfoot.table-hover th.table-light-ghost,
  tfoot.table-hover td.table-light-ghost,
  tr.table-hover th.table-light-ghost,
  tr.table-hover td.table-light-ghost {
    background-color: var(--color-light-ghost);
    color: var(--content-on-light-ghost);
  }
  thead.table-hover th.table-light-ghost:hover,
  thead.table-hover td.table-light-ghost:hover,
  tbody.table-hover th.table-light-ghost:hover,
  tbody.table-hover td.table-light-ghost:hover,
  tfoot.table-hover th.table-light-ghost:hover,
  tfoot.table-hover td.table-light-ghost:hover,
  tr.table-hover th.table-light-ghost:hover,
  tr.table-hover td.table-light-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-light-ghost);
  }
  thead.table-hover th.table-light-ghost:active, thead.table-hover th.table-light-ghost.active,
  thead.table-hover td.table-light-ghost:active,
  thead.table-hover td.table-light-ghost.active,
  tbody.table-hover th.table-light-ghost:active,
  tbody.table-hover th.table-light-ghost.active,
  tbody.table-hover td.table-light-ghost:active,
  tbody.table-hover td.table-light-ghost.active,
  tfoot.table-hover th.table-light-ghost:active,
  tfoot.table-hover th.table-light-ghost.active,
  tfoot.table-hover td.table-light-ghost:active,
  tfoot.table-hover td.table-light-ghost.active,
  tr.table-hover th.table-light-ghost:active,
  tr.table-hover th.table-light-ghost.active,
  tr.table-hover td.table-light-ghost:active,
  tr.table-hover td.table-light-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-light-ghost);
  }
  table.table-hover tbody th.table-dark-ghost,
  table.table-hover tbody td.table-dark-ghost {
    background-color: var(--color-dark-ghost);
    color: var(--content-on-dark-ghost);
  }
  table.table-hover tbody th.table-dark-ghost:hover,
  table.table-hover tbody td.table-dark-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-dark-ghost);
  }
  table.table-hover tbody th.table-dark-ghost:active, table.table-hover tbody th.table-dark-ghost.active,
  table.table-hover tbody td.table-dark-ghost:active,
  table.table-hover tbody td.table-dark-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-dark-ghost);
  }
  thead.table-hover th.table-dark-ghost,
  thead.table-hover td.table-dark-ghost,
  tbody.table-hover th.table-dark-ghost,
  tbody.table-hover td.table-dark-ghost,
  tfoot.table-hover th.table-dark-ghost,
  tfoot.table-hover td.table-dark-ghost,
  tr.table-hover th.table-dark-ghost,
  tr.table-hover td.table-dark-ghost {
    background-color: var(--color-dark-ghost);
    color: var(--content-on-dark-ghost);
  }
  thead.table-hover th.table-dark-ghost:hover,
  thead.table-hover td.table-dark-ghost:hover,
  tbody.table-hover th.table-dark-ghost:hover,
  tbody.table-hover td.table-dark-ghost:hover,
  tfoot.table-hover th.table-dark-ghost:hover,
  tfoot.table-hover td.table-dark-ghost:hover,
  tr.table-hover th.table-dark-ghost:hover,
  tr.table-hover td.table-dark-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-dark-ghost);
  }
  thead.table-hover th.table-dark-ghost:active, thead.table-hover th.table-dark-ghost.active,
  thead.table-hover td.table-dark-ghost:active,
  thead.table-hover td.table-dark-ghost.active,
  tbody.table-hover th.table-dark-ghost:active,
  tbody.table-hover th.table-dark-ghost.active,
  tbody.table-hover td.table-dark-ghost:active,
  tbody.table-hover td.table-dark-ghost.active,
  tfoot.table-hover th.table-dark-ghost:active,
  tfoot.table-hover th.table-dark-ghost.active,
  tfoot.table-hover td.table-dark-ghost:active,
  tfoot.table-hover td.table-dark-ghost.active,
  tr.table-hover th.table-dark-ghost:active,
  tr.table-hover th.table-dark-ghost.active,
  tr.table-hover td.table-dark-ghost:active,
  tr.table-hover td.table-dark-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-dark-ghost);
  }
  table.table-hover tbody th.table-white-ghost,
  table.table-hover tbody td.table-white-ghost {
    background-color: var(--color-white-ghost);
    color: var(--content-on-white-ghost);
  }
  table.table-hover tbody th.table-white-ghost:hover,
  table.table-hover tbody td.table-white-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-white-ghost);
  }
  table.table-hover tbody th.table-white-ghost:active, table.table-hover tbody th.table-white-ghost.active,
  table.table-hover tbody td.table-white-ghost:active,
  table.table-hover tbody td.table-white-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-white-ghost);
  }
  thead.table-hover th.table-white-ghost,
  thead.table-hover td.table-white-ghost,
  tbody.table-hover th.table-white-ghost,
  tbody.table-hover td.table-white-ghost,
  tfoot.table-hover th.table-white-ghost,
  tfoot.table-hover td.table-white-ghost,
  tr.table-hover th.table-white-ghost,
  tr.table-hover td.table-white-ghost {
    background-color: var(--color-white-ghost);
    color: var(--content-on-white-ghost);
  }
  thead.table-hover th.table-white-ghost:hover,
  thead.table-hover td.table-white-ghost:hover,
  tbody.table-hover th.table-white-ghost:hover,
  tbody.table-hover td.table-white-ghost:hover,
  tfoot.table-hover th.table-white-ghost:hover,
  tfoot.table-hover td.table-white-ghost:hover,
  tr.table-hover th.table-white-ghost:hover,
  tr.table-hover td.table-white-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-white-ghost);
  }
  thead.table-hover th.table-white-ghost:active, thead.table-hover th.table-white-ghost.active,
  thead.table-hover td.table-white-ghost:active,
  thead.table-hover td.table-white-ghost.active,
  tbody.table-hover th.table-white-ghost:active,
  tbody.table-hover th.table-white-ghost.active,
  tbody.table-hover td.table-white-ghost:active,
  tbody.table-hover td.table-white-ghost.active,
  tfoot.table-hover th.table-white-ghost:active,
  tfoot.table-hover th.table-white-ghost.active,
  tfoot.table-hover td.table-white-ghost:active,
  tfoot.table-hover td.table-white-ghost.active,
  tr.table-hover th.table-white-ghost:active,
  tr.table-hover th.table-white-ghost.active,
  tr.table-hover td.table-white-ghost:active,
  tr.table-hover td.table-white-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-white-ghost);
  }
  table.table-hover tbody th.table-black-ghost,
  table.table-hover tbody td.table-black-ghost {
    background-color: var(--color-black-ghost);
    color: var(--content-on-black-ghost);
  }
  table.table-hover tbody th.table-black-ghost:hover,
  table.table-hover tbody td.table-black-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-black-ghost);
  }
  table.table-hover tbody th.table-black-ghost:active, table.table-hover tbody th.table-black-ghost.active,
  table.table-hover tbody td.table-black-ghost:active,
  table.table-hover tbody td.table-black-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-black-ghost);
  }
  thead.table-hover th.table-black-ghost,
  thead.table-hover td.table-black-ghost,
  tbody.table-hover th.table-black-ghost,
  tbody.table-hover td.table-black-ghost,
  tfoot.table-hover th.table-black-ghost,
  tfoot.table-hover td.table-black-ghost,
  tr.table-hover th.table-black-ghost,
  tr.table-hover td.table-black-ghost {
    background-color: var(--color-black-ghost);
    color: var(--content-on-black-ghost);
  }
  thead.table-hover th.table-black-ghost:hover,
  thead.table-hover td.table-black-ghost:hover,
  tbody.table-hover th.table-black-ghost:hover,
  tbody.table-hover td.table-black-ghost:hover,
  tfoot.table-hover th.table-black-ghost:hover,
  tfoot.table-hover td.table-black-ghost:hover,
  tr.table-hover th.table-black-ghost:hover,
  tr.table-hover td.table-black-ghost:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-black-ghost);
  }
  thead.table-hover th.table-black-ghost:active, thead.table-hover th.table-black-ghost.active,
  thead.table-hover td.table-black-ghost:active,
  thead.table-hover td.table-black-ghost.active,
  tbody.table-hover th.table-black-ghost:active,
  tbody.table-hover th.table-black-ghost.active,
  tbody.table-hover td.table-black-ghost:active,
  tbody.table-hover td.table-black-ghost.active,
  tfoot.table-hover th.table-black-ghost:active,
  tfoot.table-hover th.table-black-ghost.active,
  tfoot.table-hover td.table-black-ghost:active,
  tfoot.table-hover td.table-black-ghost.active,
  tr.table-hover th.table-black-ghost:active,
  tr.table-hover th.table-black-ghost.active,
  tr.table-hover td.table-black-ghost:active,
  tr.table-hover td.table-black-ghost.active {
    box-shadow: inset 0 0 0 9999px var(--active-black-ghost);
  }
}
@layer table-l12 {
  th.table-primary,
  td.table-primary {
    background-color: var(--color-primary);
    color: var(--content-on-primary);
  }
  th.table-primary.table-hover:hover,
  td.table-primary.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-primary);
  }
  th.table-primary.table-hover:active, th.table-primary.table-hover.active,
  td.table-primary.table-hover:active,
  td.table-primary.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-primary);
  }
  th.table-secondary,
  td.table-secondary {
    background-color: var(--color-secondary);
    color: var(--content-on-secondary);
  }
  th.table-secondary.table-hover:hover,
  td.table-secondary.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-secondary);
  }
  th.table-secondary.table-hover:active, th.table-secondary.table-hover.active,
  td.table-secondary.table-hover:active,
  td.table-secondary.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-secondary);
  }
  th.table-tertiary,
  td.table-tertiary {
    background-color: var(--color-tertiary);
    color: var(--content-on-tertiary);
  }
  th.table-tertiary.table-hover:hover,
  td.table-tertiary.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-tertiary);
  }
  th.table-tertiary.table-hover:active, th.table-tertiary.table-hover.active,
  td.table-tertiary.table-hover:active,
  td.table-tertiary.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-tertiary);
  }
  th.table-success,
  td.table-success {
    background-color: var(--color-success);
    color: var(--content-on-success);
  }
  th.table-success.table-hover:hover,
  td.table-success.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-success);
  }
  th.table-success.table-hover:active, th.table-success.table-hover.active,
  td.table-success.table-hover:active,
  td.table-success.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-success);
  }
  th.table-info,
  td.table-info {
    background-color: var(--color-info);
    color: var(--content-on-info);
  }
  th.table-info.table-hover:hover,
  td.table-info.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-info);
  }
  th.table-info.table-hover:active, th.table-info.table-hover.active,
  td.table-info.table-hover:active,
  td.table-info.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-info);
  }
  th.table-warning,
  td.table-warning {
    background-color: var(--color-warning);
    color: var(--content-on-warning);
  }
  th.table-warning.table-hover:hover,
  td.table-warning.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-warning);
  }
  th.table-warning.table-hover:active, th.table-warning.table-hover.active,
  td.table-warning.table-hover:active,
  td.table-warning.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-warning);
  }
  th.table-danger,
  td.table-danger {
    background-color: var(--color-danger);
    color: var(--content-on-danger);
  }
  th.table-danger.table-hover:hover,
  td.table-danger.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-danger);
  }
  th.table-danger.table-hover:active, th.table-danger.table-hover.active,
  td.table-danger.table-hover:active,
  td.table-danger.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-danger);
  }
  th.table-neutral,
  td.table-neutral {
    background-color: var(--color-neutral);
    color: var(--content-on-neutral);
  }
  th.table-neutral.table-hover:hover,
  td.table-neutral.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-neutral);
  }
  th.table-neutral.table-hover:active, th.table-neutral.table-hover.active,
  td.table-neutral.table-hover:active,
  td.table-neutral.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-neutral);
  }
  th.table-light,
  td.table-light {
    background-color: var(--color-light);
    color: var(--content-on-light);
  }
  th.table-light.table-hover:hover,
  td.table-light.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-light);
  }
  th.table-light.table-hover:active, th.table-light.table-hover.active,
  td.table-light.table-hover:active,
  td.table-light.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-light);
  }
  th.table-dark,
  td.table-dark {
    background-color: var(--color-dark);
    color: var(--content-on-dark);
  }
  th.table-dark.table-hover:hover,
  td.table-dark.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-dark);
  }
  th.table-dark.table-hover:active, th.table-dark.table-hover.active,
  td.table-dark.table-hover:active,
  td.table-dark.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-dark);
  }
  th.table-white,
  td.table-white {
    background-color: var(--color-white);
    color: var(--content-on-white);
  }
  th.table-white.table-hover:hover,
  td.table-white.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-white);
  }
  th.table-white.table-hover:active, th.table-white.table-hover.active,
  td.table-white.table-hover:active,
  td.table-white.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-white);
  }
  th.table-black,
  td.table-black {
    background-color: var(--color-black);
    color: var(--content-on-black);
  }
  th.table-black.table-hover:hover,
  td.table-black.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-black);
  }
  th.table-black.table-hover:active, th.table-black.table-hover.active,
  td.table-black.table-hover:active,
  td.table-black.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-black);
  }
  th.table-primary-ghost,
  td.table-primary-ghost {
    background-color: var(--color-primary-ghost);
    color: var(--content-on-primary-ghost);
  }
  th.table-primary-ghost.table-hover:hover,
  td.table-primary-ghost.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-primary-ghost);
  }
  th.table-primary-ghost.table-hover:active, th.table-primary-ghost.table-hover.active,
  td.table-primary-ghost.table-hover:active,
  td.table-primary-ghost.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-primary-ghost);
  }
  th.table-secondary-ghost,
  td.table-secondary-ghost {
    background-color: var(--color-secondary-ghost);
    color: var(--content-on-secondary-ghost);
  }
  th.table-secondary-ghost.table-hover:hover,
  td.table-secondary-ghost.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-secondary-ghost);
  }
  th.table-secondary-ghost.table-hover:active, th.table-secondary-ghost.table-hover.active,
  td.table-secondary-ghost.table-hover:active,
  td.table-secondary-ghost.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-secondary-ghost);
  }
  th.table-tertiary-ghost,
  td.table-tertiary-ghost {
    background-color: var(--color-tertiary-ghost);
    color: var(--content-on-tertiary-ghost);
  }
  th.table-tertiary-ghost.table-hover:hover,
  td.table-tertiary-ghost.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-tertiary-ghost);
  }
  th.table-tertiary-ghost.table-hover:active, th.table-tertiary-ghost.table-hover.active,
  td.table-tertiary-ghost.table-hover:active,
  td.table-tertiary-ghost.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-tertiary-ghost);
  }
  th.table-success-ghost,
  td.table-success-ghost {
    background-color: var(--color-success-ghost);
    color: var(--content-on-success-ghost);
  }
  th.table-success-ghost.table-hover:hover,
  td.table-success-ghost.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-success-ghost);
  }
  th.table-success-ghost.table-hover:active, th.table-success-ghost.table-hover.active,
  td.table-success-ghost.table-hover:active,
  td.table-success-ghost.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-success-ghost);
  }
  th.table-info-ghost,
  td.table-info-ghost {
    background-color: var(--color-info-ghost);
    color: var(--content-on-info-ghost);
  }
  th.table-info-ghost.table-hover:hover,
  td.table-info-ghost.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-info-ghost);
  }
  th.table-info-ghost.table-hover:active, th.table-info-ghost.table-hover.active,
  td.table-info-ghost.table-hover:active,
  td.table-info-ghost.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-info-ghost);
  }
  th.table-warning-ghost,
  td.table-warning-ghost {
    background-color: var(--color-warning-ghost);
    color: var(--content-on-warning-ghost);
  }
  th.table-warning-ghost.table-hover:hover,
  td.table-warning-ghost.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-warning-ghost);
  }
  th.table-warning-ghost.table-hover:active, th.table-warning-ghost.table-hover.active,
  td.table-warning-ghost.table-hover:active,
  td.table-warning-ghost.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-warning-ghost);
  }
  th.table-danger-ghost,
  td.table-danger-ghost {
    background-color: var(--color-danger-ghost);
    color: var(--content-on-danger-ghost);
  }
  th.table-danger-ghost.table-hover:hover,
  td.table-danger-ghost.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-danger-ghost);
  }
  th.table-danger-ghost.table-hover:active, th.table-danger-ghost.table-hover.active,
  td.table-danger-ghost.table-hover:active,
  td.table-danger-ghost.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-danger-ghost);
  }
  th.table-neutral-ghost,
  td.table-neutral-ghost {
    background-color: var(--color-neutral-ghost);
    color: var(--content-on-neutral-ghost);
  }
  th.table-neutral-ghost.table-hover:hover,
  td.table-neutral-ghost.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-neutral-ghost);
  }
  th.table-neutral-ghost.table-hover:active, th.table-neutral-ghost.table-hover.active,
  td.table-neutral-ghost.table-hover:active,
  td.table-neutral-ghost.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-neutral-ghost);
  }
  th.table-light-ghost,
  td.table-light-ghost {
    background-color: var(--color-light-ghost);
    color: var(--content-on-light-ghost);
  }
  th.table-light-ghost.table-hover:hover,
  td.table-light-ghost.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-light-ghost);
  }
  th.table-light-ghost.table-hover:active, th.table-light-ghost.table-hover.active,
  td.table-light-ghost.table-hover:active,
  td.table-light-ghost.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-light-ghost);
  }
  th.table-dark-ghost,
  td.table-dark-ghost {
    background-color: var(--color-dark-ghost);
    color: var(--content-on-dark-ghost);
  }
  th.table-dark-ghost.table-hover:hover,
  td.table-dark-ghost.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-dark-ghost);
  }
  th.table-dark-ghost.table-hover:active, th.table-dark-ghost.table-hover.active,
  td.table-dark-ghost.table-hover:active,
  td.table-dark-ghost.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-dark-ghost);
  }
  th.table-white-ghost,
  td.table-white-ghost {
    background-color: var(--color-white-ghost);
    color: var(--content-on-white-ghost);
  }
  th.table-white-ghost.table-hover:hover,
  td.table-white-ghost.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-white-ghost);
  }
  th.table-white-ghost.table-hover:active, th.table-white-ghost.table-hover.active,
  td.table-white-ghost.table-hover:active,
  td.table-white-ghost.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-white-ghost);
  }
  th.table-black-ghost,
  td.table-black-ghost {
    background-color: var(--color-black-ghost);
    color: var(--content-on-black-ghost);
  }
  th.table-black-ghost.table-hover:hover,
  td.table-black-ghost.table-hover:hover {
    box-shadow: inset 0 0 0 9999px var(--hover-black-ghost);
  }
  th.table-black-ghost.table-hover:active, th.table-black-ghost.table-hover.active,
  td.table-black-ghost.table-hover:active,
  td.table-black-ghost.table-hover.active {
    box-shadow: inset 0 0 0 9999px var(--active-black-ghost);
  }
}
.anim-shake-x {
  animation-name: shake-x;
}

.anim-shake-y {
  animation-name: shake-y;
}

.anim-rotate {
  animation-name: rotate;
}

.anim-fade-in {
  animation-name: fade-in;
}

.anim-fade-out {
  animation-name: fade-out;
}

.anim-fade-in-out {
  animation-name: fade-in-out;
}

.anim-fade-out-in {
  animation-name: fade-out-in;
}

.anim-slide-in-top {
  animation-name: fade-in, slide-in-top;
}

.anim-slide-in-bottom {
  animation-name: fade-in, slide-in-bottom;
}

.anim-slide-in-left {
  animation-name: fade-in, slide-in-left;
}

.anim-slide-in-right {
  animation-name: fade-in, slide-in-right;
}

.anim-slide-out-top {
  animation-name: fade-out, slide-out-top;
}

.anim-slide-out-bottom {
  animation-name: fade-out, slide-out-bottom;
}

.anim-slide-out-left {
  animation-name: fade-out, slide-out-left;
}

.anim-slide-out-right {
  animation-name: fade-out, slide-out-right;
}

.anim-scale-in {
  animation-name: fade-in, scale-in;
}

.anim-scale-out {
  animation-name: fade-out, scale-out;
}

.anim-alert-auto {
  animation: alert-auto 5s ease forwards;
}

.anim-alert-enter {
  animation-name: alert-enter;
}

.anim-alert-exit {
  animation-name: alert-exit;
}

.anim-reverse {
  animation-direction: reverse;
}

.anim-infinite {
  animation-iteration-count: infinite;
}

.anim-0 {
  animation-duration: 0ms;
}

.anim-100 {
  animation-duration: 100ms;
}

.anim-200 {
  animation-duration: 200ms;
}

.anim-300 {
  animation-duration: 300ms;
}

.anim-400 {
  animation-duration: 400ms;
}

.anim-500 {
  animation-duration: 500ms;
}

.anim-600 {
  animation-duration: 600ms;
}

.anim-700 {
  animation-duration: 700ms;
}

.anim-800 {
  animation-duration: 800ms;
}

.anim-900 {
  animation-duration: 900ms;
}

.anim-1000 {
  animation-duration: 1000ms;
}

.no-transition {
  transition: none !important;
}

.no-transition::before {
  transition: none !important;
}

.no-transition::after {
  transition: none !important;
}

.no-animation {
  animation: none !important;
}

.no-animation::before {
  animation: none !important;
}

.no-animation::after {
  animation: none !important;
}

.bg-primary {
  background-color: var(--color-primary);
}

.bg-secondary {
  background-color: var(--color-secondary);
}

.bg-tertiary {
  background-color: var(--color-tertiary);
}

.bg-success {
  background-color: var(--color-success);
}

.bg-info {
  background-color: var(--color-info);
}

.bg-warning {
  background-color: var(--color-warning);
}

.bg-danger {
  background-color: var(--color-danger);
}

.bg-neutral {
  background-color: var(--color-neutral);
}

.bg-light {
  background-color: var(--color-light);
}

.bg-dark {
  background-color: var(--color-dark);
}

.bg-white {
  background-color: var(--color-white);
}

.bg-black {
  background-color: var(--color-black);
}

.bg-primary-ghost {
  background-color: var(--color-primary-ghost);
}

.bg-secondary-ghost {
  background-color: var(--color-secondary-ghost);
}

.bg-tertiary-ghost {
  background-color: var(--color-tertiary-ghost);
}

.bg-success-ghost {
  background-color: var(--color-success-ghost);
}

.bg-info-ghost {
  background-color: var(--color-info-ghost);
}

.bg-warning-ghost {
  background-color: var(--color-warning-ghost);
}

.bg-danger-ghost {
  background-color: var(--color-danger-ghost);
}

.bg-neutral-ghost {
  background-color: var(--color-neutral-ghost);
}

.bg-light-ghost {
  background-color: var(--color-light-ghost);
}

.bg-dark-ghost {
  background-color: var(--color-dark-ghost);
}

.bg-white-ghost {
  background-color: var(--color-white-ghost);
}

.bg-black-ghost {
  background-color: var(--color-black-ghost);
}

.bg-transparent {
  background-color: var(--color-transparent);
}

.border-top {
  border-top: var(--border-width) var(--border-style) var(--border-color);
}

.border-bottom {
  border-bottom: var(--border-width) var(--border-style) var(--border-color);
}

.border-left {
  border-left: var(--border-width) var(--border-style) var(--border-color);
}

.border-right {
  border-right: var(--border-width) var(--border-style) var(--border-color);
}

.border-y {
  border-top: var(--border-width) var(--border-style) var(--border-color);
  border-bottom: var(--border-width) var(--border-style) var(--border-color);
}

.border-x {
  border-left: var(--border-width) var(--border-style) var(--border-color);
  border-right: var(--border-width) var(--border-style) var(--border-color);
}

.border {
  border: var(--border-width) var(--border-style) var(--border-color);
}

.border-solid {
  border-style: solid;
}

.border-dashed {
  border-style: dashed;
}

.border-dotted {
  border-style: dotted;
}

.border-double {
  border-style: double;
}

.border-none {
  border-style: none;
}

.border-0 {
  border-width: 0;
}

.border-1 {
  border-width: 1px;
}

.border-2 {
  border-width: 2px;
}

.border-3 {
  border-width: 3px;
}

.border-4 {
  border-width: 4px;
}

.border-5 {
  border-width: 5px;
}

.rounded-0 {
  border-radius: 0;
}

.rounded {
  border-radius: var(--border-radius);
}

.rounded-pill {
  border-radius: var(--border-radius-pill);
}

.rounded-circle {
  border-radius: var(--border-radius-circle);
}

.no-border {
  border: none !important;
}

.no-border-top {
  border-top: none !important;
}

.no-border-bottom {
  border-bottom: none !important;
}

.no-border-left {
  border-left: none !important;
}

.no-border-right {
  border-right: none !important;
}

.no-border-x {
  border-left: none !important;
  border-right: none !important;
}

.no-border-y {
  border-top: none !important;
  border-bottom: none !important;
}

.no-radius {
  border-radius: 0 !important;
}

.no-radius-top {
  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
}

.no-radius-bottom {
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

.no-radius-left {
  border-top-left-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
}

.no-radius-right {
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

.border-transparent {
  border-color: var(--color-transparent);
}

.border-primary {
  border-color: var(--color-primary);
}

.border-secondary {
  border-color: var(--color-secondary);
}

.border-tertiary {
  border-color: var(--color-tertiary);
}

.border-success {
  border-color: var(--color-success);
}

.border-info {
  border-color: var(--color-info);
}

.border-warning {
  border-color: var(--color-warning);
}

.border-danger {
  border-color: var(--color-danger);
}

.border-neutral {
  border-color: var(--color-neutral);
}

.border-light {
  border-color: var(--color-light);
}

.border-dark {
  border-color: var(--color-dark);
}

.border-white {
  border-color: var(--color-white);
}

.border-black {
  border-color: var(--color-black);
}

.border-primary-ghost {
  border-color: var(--color-primary-ghost);
}

.border-secondary-ghost {
  border-color: var(--color-secondary-ghost);
}

.border-tertiary-ghost {
  border-color: var(--color-tertiary-ghost);
}

.border-success-ghost {
  border-color: var(--color-success-ghost);
}

.border-info-ghost {
  border-color: var(--color-info-ghost);
}

.border-warning-ghost {
  border-color: var(--color-warning-ghost);
}

.border-danger-ghost {
  border-color: var(--color-danger-ghost);
}

.border-neutral-ghost {
  border-color: var(--color-neutral-ghost);
}

.border-light-ghost {
  border-color: var(--color-light-ghost);
}

.border-dark-ghost {
  border-color: var(--color-dark-ghost);
}

.border-white-ghost {
  border-color: var(--color-white-ghost);
}

.border-black-ghost {
  border-color: var(--color-black-ghost);
}

.cursor-none {
  cursor: none;
}

.cursor-auto {
  cursor: auto;
}

.cursor-pointer {
  cursor: pointer;
}

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

.cursor-help {
  cursor: help;
}

.cursor-progress {
  cursor: progress;
}

.cursor-wait {
  cursor: wait;
}

.cursor-grab {
  cursor: grab;
}

.cursor-grabbing {
  cursor: grabbing;
}

.cursor-text {
  cursor: text;
}

.cursor-copy {
  cursor: copy;
}

.cursor-alias {
  cursor: alias;
}

.d-none {
  display: none;
}

.d-inline {
  display: inline;
}

.d-inline-block {
  display: inline-block;
}

.d-block {
  display: block;
}

.d-grid {
  display: grid;
}

.d-flex {
  display: flex;
}

.d-inline-flex {
  display: inline-flex;
}

@media (min-width: 480px) {
  .d-none-xs {
    display: none;
  }
  .d-inline-xs {
    display: inline;
  }
  .d-inline-block-xs {
    display: inline-block;
  }
  .d-block-xs {
    display: block;
  }
  .d-grid-xs {
    display: grid;
  }
  .d-flex-xs {
    display: flex;
  }
  .d-inline-flex-xs {
    display: inline-flex;
  }
}
@media (min-width: 640px) {
  .d-none-sm {
    display: none;
  }
  .d-inline-sm {
    display: inline;
  }
  .d-inline-block-sm {
    display: inline-block;
  }
  .d-block-sm {
    display: block;
  }
  .d-grid-sm {
    display: grid;
  }
  .d-flex-sm {
    display: flex;
  }
  .d-inline-flex-sm {
    display: inline-flex;
  }
}
@media (min-width: 768px) {
  .d-none-md {
    display: none;
  }
  .d-inline-md {
    display: inline;
  }
  .d-inline-block-md {
    display: inline-block;
  }
  .d-block-md {
    display: block;
  }
  .d-grid-md {
    display: grid;
  }
  .d-flex-md {
    display: flex;
  }
  .d-inline-flex-md {
    display: inline-flex;
  }
}
@media (min-width: 1024px) {
  .d-none-lg {
    display: none;
  }
  .d-inline-lg {
    display: inline;
  }
  .d-inline-block-lg {
    display: inline-block;
  }
  .d-block-lg {
    display: block;
  }
  .d-grid-lg {
    display: grid;
  }
  .d-flex-lg {
    display: flex;
  }
  .d-inline-flex-lg {
    display: inline-flex;
  }
}
@media (min-width: 1280px) {
  .d-none-xl {
    display: none;
  }
  .d-inline-xl {
    display: inline;
  }
  .d-inline-block-xl {
    display: inline-block;
  }
  .d-block-xl {
    display: block;
  }
  .d-grid-xl {
    display: grid;
  }
  .d-flex-xl {
    display: flex;
  }
  .d-inline-flex-xl {
    display: inline-flex;
  }
}
@media (min-width: 1536px) {
  .d-none-xxl {
    display: none;
  }
  .d-inline-xxl {
    display: inline;
  }
  .d-inline-block-xxl {
    display: inline-block;
  }
  .d-block-xxl {
    display: block;
  }
  .d-grid-xxl {
    display: grid;
  }
  .d-flex-xxl {
    display: flex;
  }
  .d-inline-flex-xxl {
    display: inline-flex;
  }
}
.font-primary {
  font-family: var(--font-family-primary), sans-serif;
}

.font-secondary {
  font-family: var(--font-family-secondary), sans-serif;
}

.font-tertiary {
  font-family: var(--font-family-tertiary), sans-serif;
}

.fw-100 {
  font-weight: 100;
}

.fw-200 {
  font-weight: 200;
}

.fw-300 {
  font-weight: 300;
}

.fw-400 {
  font-weight: 400;
}

.fw-500 {
  font-weight: 500;
}

.fw-600 {
  font-weight: 600;
}

.fw-700 {
  font-weight: 700;
}

.fw-800 {
  font-weight: 800;
}

.fw-900 {
  font-weight: 900;
}

.fw-inherit {
  font-weight: inherit;
}

.fw-initial {
  font-weight: initial;
}

.fs-h1 {
  font-size: var(--font-size-h1);
}

.fs-h2 {
  font-size: var(--font-size-h2);
}

.fs-h3 {
  font-size: var(--font-size-h3);
}

.fs-h4 {
  font-size: var(--font-size-h4);
}

.fs-h5 {
  font-size: var(--font-size-h5);
}

.fs-h6 {
  font-size: var(--font-size-h6);
}

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

.fs-2 {
  font-size: var(--font-size-sm);
}

.fs-3 {
  font-size: var(--font-size-md);
}

.fs-4 {
  font-size: var(--font-size-lg);
}

.fs-5 {
  font-size: var(--font-size-xl);
}

.fs-6 {
  font-size: var(--font-size-xxl);
}

.fs-inherit {
  font-size: inherit;
}

.fs-initial {
  font-size: initial;
}

@media (min-width: 480px) {
  .fw-100-xs {
    font-weight: 100;
  }
  .fw-200-xs {
    font-weight: 200;
  }
  .fw-300-xs {
    font-weight: 300;
  }
  .fw-400-xs {
    font-weight: 400;
  }
  .fw-500-xs {
    font-weight: 500;
  }
  .fw-600-xs {
    font-weight: 600;
  }
  .fw-700-xs {
    font-weight: 700;
  }
  .fw-800-xs {
    font-weight: 800;
  }
  .fw-900-xs {
    font-weight: 900;
  }
  .fw-inherit-xs {
    font-weight: inherit;
  }
  .fw-initial-xs {
    font-weight: initial;
  }
  .fs-h1-xs {
    font-size: var(--font-size-h1);
  }
  .fs-h2-xs {
    font-size: var(--font-size-h2);
  }
  .fs-h3-xs {
    font-size: var(--font-size-h3);
  }
  .fs-h4-xs {
    font-size: var(--font-size-h4);
  }
  .fs-h5-xs {
    font-size: var(--font-size-h5);
  }
  .fs-h6-xs {
    font-size: var(--font-size-h6);
  }
  .fs-1-xs {
    font-size: var(--font-size-xs);
  }
  .fs-2-xs {
    font-size: var(--font-size-sm);
  }
  .fs-3-xs {
    font-size: var(--font-size-md);
  }
  .fs-4-xs {
    font-size: var(--font-size-lg);
  }
  .fs-5-xs {
    font-size: var(--font-size-xl);
  }
  .fs-6-xs {
    font-size: var(--font-size-xxl);
  }
  .fs-inherit-xs {
    font-size: inherit;
  }
  .fs-initial-xs {
    font-size: initial;
  }
}
@media (min-width: 640px) {
  .fw-100-sm {
    font-weight: 100;
  }
  .fw-200-sm {
    font-weight: 200;
  }
  .fw-300-sm {
    font-weight: 300;
  }
  .fw-400-sm {
    font-weight: 400;
  }
  .fw-500-sm {
    font-weight: 500;
  }
  .fw-600-sm {
    font-weight: 600;
  }
  .fw-700-sm {
    font-weight: 700;
  }
  .fw-800-sm {
    font-weight: 800;
  }
  .fw-900-sm {
    font-weight: 900;
  }
  .fw-inherit-sm {
    font-weight: inherit;
  }
  .fw-initial-sm {
    font-weight: initial;
  }
  .fs-h1-sm {
    font-size: var(--font-size-h1);
  }
  .fs-h2-sm {
    font-size: var(--font-size-h2);
  }
  .fs-h3-sm {
    font-size: var(--font-size-h3);
  }
  .fs-h4-sm {
    font-size: var(--font-size-h4);
  }
  .fs-h5-sm {
    font-size: var(--font-size-h5);
  }
  .fs-h6-sm {
    font-size: var(--font-size-h6);
  }
  .fs-1-sm {
    font-size: var(--font-size-xs);
  }
  .fs-2-sm {
    font-size: var(--font-size-sm);
  }
  .fs-3-sm {
    font-size: var(--font-size-md);
  }
  .fs-4-sm {
    font-size: var(--font-size-lg);
  }
  .fs-5-sm {
    font-size: var(--font-size-xl);
  }
  .fs-6-sm {
    font-size: var(--font-size-xxl);
  }
  .fs-inherit-sm {
    font-size: inherit;
  }
  .fs-initial-sm {
    font-size: initial;
  }
}
@media (min-width: 768px) {
  .fw-100-md {
    font-weight: 100;
  }
  .fw-200-md {
    font-weight: 200;
  }
  .fw-300-md {
    font-weight: 300;
  }
  .fw-400-md {
    font-weight: 400;
  }
  .fw-500-md {
    font-weight: 500;
  }
  .fw-600-md {
    font-weight: 600;
  }
  .fw-700-md {
    font-weight: 700;
  }
  .fw-800-md {
    font-weight: 800;
  }
  .fw-900-md {
    font-weight: 900;
  }
  .fw-inherit-md {
    font-weight: inherit;
  }
  .fw-initial-md {
    font-weight: initial;
  }
  .fs-h1-md {
    font-size: var(--font-size-h1);
  }
  .fs-h2-md {
    font-size: var(--font-size-h2);
  }
  .fs-h3-md {
    font-size: var(--font-size-h3);
  }
  .fs-h4-md {
    font-size: var(--font-size-h4);
  }
  .fs-h5-md {
    font-size: var(--font-size-h5);
  }
  .fs-h6-md {
    font-size: var(--font-size-h6);
  }
  .fs-1-md {
    font-size: var(--font-size-xs);
  }
  .fs-2-md {
    font-size: var(--font-size-sm);
  }
  .fs-3-md {
    font-size: var(--font-size-md);
  }
  .fs-4-md {
    font-size: var(--font-size-lg);
  }
  .fs-5-md {
    font-size: var(--font-size-xl);
  }
  .fs-6-md {
    font-size: var(--font-size-xxl);
  }
  .fs-inherit-md {
    font-size: inherit;
  }
  .fs-initial-md {
    font-size: initial;
  }
}
@media (min-width: 1024px) {
  .fw-100-lg {
    font-weight: 100;
  }
  .fw-200-lg {
    font-weight: 200;
  }
  .fw-300-lg {
    font-weight: 300;
  }
  .fw-400-lg {
    font-weight: 400;
  }
  .fw-500-lg {
    font-weight: 500;
  }
  .fw-600-lg {
    font-weight: 600;
  }
  .fw-700-lg {
    font-weight: 700;
  }
  .fw-800-lg {
    font-weight: 800;
  }
  .fw-900-lg {
    font-weight: 900;
  }
  .fw-inherit-lg {
    font-weight: inherit;
  }
  .fw-initial-lg {
    font-weight: initial;
  }
  .fs-h1-lg {
    font-size: var(--font-size-h1);
  }
  .fs-h2-lg {
    font-size: var(--font-size-h2);
  }
  .fs-h3-lg {
    font-size: var(--font-size-h3);
  }
  .fs-h4-lg {
    font-size: var(--font-size-h4);
  }
  .fs-h5-lg {
    font-size: var(--font-size-h5);
  }
  .fs-h6-lg {
    font-size: var(--font-size-h6);
  }
  .fs-1-lg {
    font-size: var(--font-size-xs);
  }
  .fs-2-lg {
    font-size: var(--font-size-sm);
  }
  .fs-3-lg {
    font-size: var(--font-size-md);
  }
  .fs-4-lg {
    font-size: var(--font-size-lg);
  }
  .fs-5-lg {
    font-size: var(--font-size-xl);
  }
  .fs-6-lg {
    font-size: var(--font-size-xxl);
  }
  .fs-inherit-lg {
    font-size: inherit;
  }
  .fs-initial-lg {
    font-size: initial;
  }
}
@media (min-width: 1280px) {
  .fw-100-xl {
    font-weight: 100;
  }
  .fw-200-xl {
    font-weight: 200;
  }
  .fw-300-xl {
    font-weight: 300;
  }
  .fw-400-xl {
    font-weight: 400;
  }
  .fw-500-xl {
    font-weight: 500;
  }
  .fw-600-xl {
    font-weight: 600;
  }
  .fw-700-xl {
    font-weight: 700;
  }
  .fw-800-xl {
    font-weight: 800;
  }
  .fw-900-xl {
    font-weight: 900;
  }
  .fw-inherit-xl {
    font-weight: inherit;
  }
  .fw-initial-xl {
    font-weight: initial;
  }
  .fs-h1-xl {
    font-size: var(--font-size-h1);
  }
  .fs-h2-xl {
    font-size: var(--font-size-h2);
  }
  .fs-h3-xl {
    font-size: var(--font-size-h3);
  }
  .fs-h4-xl {
    font-size: var(--font-size-h4);
  }
  .fs-h5-xl {
    font-size: var(--font-size-h5);
  }
  .fs-h6-xl {
    font-size: var(--font-size-h6);
  }
  .fs-1-xl {
    font-size: var(--font-size-xs);
  }
  .fs-2-xl {
    font-size: var(--font-size-sm);
  }
  .fs-3-xl {
    font-size: var(--font-size-md);
  }
  .fs-4-xl {
    font-size: var(--font-size-lg);
  }
  .fs-5-xl {
    font-size: var(--font-size-xl);
  }
  .fs-6-xl {
    font-size: var(--font-size-xxl);
  }
  .fs-inherit-xl {
    font-size: inherit;
  }
  .fs-initial-xl {
    font-size: initial;
  }
}
@media (min-width: 1536px) {
  .fw-100-xxl {
    font-weight: 100;
  }
  .fw-200-xxl {
    font-weight: 200;
  }
  .fw-300-xxl {
    font-weight: 300;
  }
  .fw-400-xxl {
    font-weight: 400;
  }
  .fw-500-xxl {
    font-weight: 500;
  }
  .fw-600-xxl {
    font-weight: 600;
  }
  .fw-700-xxl {
    font-weight: 700;
  }
  .fw-800-xxl {
    font-weight: 800;
  }
  .fw-900-xxl {
    font-weight: 900;
  }
  .fw-inherit-xxl {
    font-weight: inherit;
  }
  .fw-initial-xxl {
    font-weight: initial;
  }
  .fs-h1-xxl {
    font-size: var(--font-size-h1);
  }
  .fs-h2-xxl {
    font-size: var(--font-size-h2);
  }
  .fs-h3-xxl {
    font-size: var(--font-size-h3);
  }
  .fs-h4-xxl {
    font-size: var(--font-size-h4);
  }
  .fs-h5-xxl {
    font-size: var(--font-size-h5);
  }
  .fs-h6-xxl {
    font-size: var(--font-size-h6);
  }
  .fs-1-xxl {
    font-size: var(--font-size-xs);
  }
  .fs-2-xxl {
    font-size: var(--font-size-sm);
  }
  .fs-3-xxl {
    font-size: var(--font-size-md);
  }
  .fs-4-xxl {
    font-size: var(--font-size-lg);
  }
  .fs-5-xxl {
    font-size: var(--font-size-xl);
  }
  .fs-6-xxl {
    font-size: var(--font-size-xxl);
  }
  .fs-inherit-xxl {
    font-size: inherit;
  }
  .fs-initial-xxl {
    font-size: initial;
  }
}
.img-fluid {
  max-width: 100%;
  height: auto;
}

.img-cover {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.img-contain {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.img-rounded {
  border-radius: var(--img-border-radius);
}

.img-thumbnail {
  padding: var(--img-thumbnail-padding);
  background-color: var(--img-thumbnail-background-color);
  border: var(--img-thumbnail-border-width) var(--img-thumbnail-border-style) var(--img-thumbnail-border-color);
  border-radius: var(--img-thumbnail-border-radius);
}

@keyframes slide-in-top {
  0% {
    transform: translateY(-66.66%);
  }
  100% {
    transform: translateY(0);
  }
}
@keyframes slide-in-bottom {
  0% {
    transform: translateY(66.66%);
  }
  100% {
    transform: translateY(0);
  }
}
@keyframes slide-in-left {
  0% {
    transform: translateX(-66.66%);
  }
  100% {
    transform: translateX(0);
  }
}
@keyframes slide-in-right {
  0% {
    transform: translateX(66.66%);
  }
  100% {
    transform: translateX(0);
  }
}
@keyframes slide-out-top {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-66.66%);
  }
}
@keyframes slide-out-bottom {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(66.66%);
  }
}
@keyframes slide-out-left {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-66.66%);
  }
}
@keyframes slide-out-right {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(66.66%);
  }
}
@keyframes scale-in {
  0% {
    transform: scale(0.7);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes scale-out {
  0% {
    transform: scale(1.3);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes shake-x {
  0%, 100% {
    transform: translateX(0);
  }
  10% {
    transform: translateX(-18px);
  }
  20% {
    transform: translateX(16px);
  }
  30% {
    transform: translateX(-14px);
  }
  40% {
    transform: translateX(12px);
  }
  50% {
    transform: translateX(-10px);
  }
  60% {
    transform: translateX(8px);
  }
  70% {
    transform: translateX(-6px);
  }
  80% {
    transform: translateX(4px);
  }
  90% {
    transform: translateX(-1px);
  }
}
@keyframes shake-y {
  0%, 100% {
    transform: translateY(0);
  }
  10% {
    transform: translateY(-18px);
  }
  20% {
    transform: translateY(16px);
  }
  30% {
    transform: translateY(-14px);
  }
  40% {
    transform: translateY(12px);
  }
  50% {
    transform: translateY(-10px);
  }
  60% {
    transform: translateY(8px);
  }
  70% {
    transform: translateY(-6px);
  }
  80% {
    transform: translateY(4px);
  }
  90% {
    transform: translateY(-1px);
  }
}
@keyframes rotate {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fade-out {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes fade-out-in {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fade-in-out {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes alert-auto {
  0% {
    opacity: 0;
    transform: translateY(-10px);
  }
  10% {
    opacity: 1;
    transform: translateY(0);
  }
  80% {
    opacity: 1;
    transform: translateY(0);
  }
  100% {
    opacity: 0;
    transform: translateY(-10px);
  }
}
@keyframes alert-enter {
  0% {
    opacity: 0;
    transform: translateY(-10px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes alert-exit {
  0% {
    opacity: 1;
    transform: translateY(0);
  }
  100% {
    opacity: 0;
    transform: translateY(-10px);
  }
}
.overflow-hidden {
  overflow: hidden;
}

.overflow-visible {
  overflow: visible;
}

.overflow-auto {
  overflow: auto;
}

.overflow-y-auto {
  overflow-y: auto;
}

.overflow-x-auto {
  overflow-x: auto;
}

.overflow-y-hidden {
  overflow-y: hidden;
}

.overflow-x-hidden {
  overflow-x: hidden;
}

@media (min-width: 480px) {
  .overflow-hidden-xs {
    overflow: hidden;
  }
  .overflow-visible-xs {
    overflow: visible;
  }
  .overflow-auto-xs {
    overflow: auto;
  }
  .overflow-y-auto-xs {
    overflow-y: auto;
  }
  .overflow-x-auto-xs {
    overflow-x: auto;
  }
  .overflow-y-hidden-xs {
    overflow-y: hidden;
  }
  .overflow-x-hidden-xs {
    overflow-x: hidden;
  }
}
@media (min-width: 640px) {
  .overflow-hidden-sm {
    overflow: hidden;
  }
  .overflow-visible-sm {
    overflow: visible;
  }
  .overflow-auto-sm {
    overflow: auto;
  }
  .overflow-y-auto-sm {
    overflow-y: auto;
  }
  .overflow-x-auto-sm {
    overflow-x: auto;
  }
  .overflow-y-hidden-sm {
    overflow-y: hidden;
  }
  .overflow-x-hidden-sm {
    overflow-x: hidden;
  }
}
@media (min-width: 768px) {
  .overflow-hidden-md {
    overflow: hidden;
  }
  .overflow-visible-md {
    overflow: visible;
  }
  .overflow-auto-md {
    overflow: auto;
  }
  .overflow-y-auto-md {
    overflow-y: auto;
  }
  .overflow-x-auto-md {
    overflow-x: auto;
  }
  .overflow-y-hidden-md {
    overflow-y: hidden;
  }
  .overflow-x-hidden-md {
    overflow-x: hidden;
  }
}
@media (min-width: 1024px) {
  .overflow-hidden-lg {
    overflow: hidden;
  }
  .overflow-visible-lg {
    overflow: visible;
  }
  .overflow-auto-lg {
    overflow: auto;
  }
  .overflow-y-auto-lg {
    overflow-y: auto;
  }
  .overflow-x-auto-lg {
    overflow-x: auto;
  }
  .overflow-y-hidden-lg {
    overflow-y: hidden;
  }
  .overflow-x-hidden-lg {
    overflow-x: hidden;
  }
}
@media (min-width: 1280px) {
  .overflow-hidden-xl {
    overflow: hidden;
  }
  .overflow-visible-xl {
    overflow: visible;
  }
  .overflow-auto-xl {
    overflow: auto;
  }
  .overflow-y-auto-xl {
    overflow-y: auto;
  }
  .overflow-x-auto-xl {
    overflow-x: auto;
  }
  .overflow-y-hidden-xl {
    overflow-y: hidden;
  }
  .overflow-x-hidden-xl {
    overflow-x: hidden;
  }
}
@media (min-width: 1536px) {
  .overflow-hidden-xxl {
    overflow: hidden;
  }
  .overflow-visible-xxl {
    overflow: visible;
  }
  .overflow-auto-xxl {
    overflow: auto;
  }
  .overflow-y-auto-xxl {
    overflow-y: auto;
  }
  .overflow-x-auto-xxl {
    overflow-x: auto;
  }
  .overflow-y-hidden-xxl {
    overflow-y: hidden;
  }
  .overflow-x-hidden-xxl {
    overflow-x: hidden;
  }
}
.static {
  position: static;
}

.relative {
  position: relative;
}

.absolute {
  position: absolute;
}

.fixed {
  position: fixed;
}

.sticky {
  position: sticky;
}

.z-auto {
  z-index: auto;
}

.z-n1 {
  z-index: -1;
}

.z-0 {
  z-index: 0;
}

.z-10 {
  z-index: 10;
}

.z-20 {
  z-index: 20;
}

.z-30 {
  z-index: 30;
}

.z-40 {
  z-index: 40;
}

.z-50 {
  z-index: 50;
}

.z-60 {
  z-index: 60;
}

.z-70 {
  z-index: 70;
}

.z-80 {
  z-index: 80;
}

.z-90 {
  z-index: 90;
}

.z-100 {
  z-index: 100;
}

.z-max {
  z-index: 9999;
}

.top-0 {
  top: 0;
}

.bottom-0 {
  bottom: 0;
}

.left-0 {
  left: 0;
}

.right-0 {
  right: 0;
}

.top-50 {
  top: 50%;
}

.right-50 {
  right: 50%;
}

.bottom-50 {
  bottom: 50%;
}

.left-50 {
  left: 50%;
}

.top-100 {
  top: 100%;
}

.right-100 {
  right: 100%;
}

.bottom-100 {
  bottom: 100%;
}

.left-100 {
  left: 100%;
}

.inset-x-0 {
  left: 0;
  right: 0;
}

.inset-y-0 {
  top: 0;
  bottom: 0;
}

.inset-0 {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

.translate-middle-x {
  transform: translateX(-50%);
}

.translate-middle-y {
  transform: translateY(-50%);
}

.translate-middle-x.translate-middle-y,
.translate-middle {
  transform: translate(-50%, -50%);
}

.align-baseline {
  vertical-align: baseline;
}

.align-top {
  vertical-align: top;
}

.align-middle {
  vertical-align: middle;
}

.align-bottom {
  vertical-align: bottom;
}

.align-text-top {
  vertical-align: text-top;
}

.align-text-bottom {
  vertical-align: text-bottom;
}

.shadow-hover {
  transition: box-shadow 0.2s ease;
}

.shadow {
  box-shadow: var(--box-shadow);
}

.shadow-hover {
  box-shadow: var(--box-shadow-hover-before);
}
.shadow-hover:hover {
  box-shadow: var(--box-shadow-hover-after);
}

.shadow-none {
  box-shadow: none;
}

.fit-width {
  width: fit-content;
}

.fit-height {
  height: fit-content;
}

.fit-size {
  width: fit-content;
  height: fit-content;
}

.fit-max-width {
  width: max-content;
}

.fit-max-height {
  height: max-content;
}

.fit-max-size {
  width: max-content;
  height: max-content;
}

.fit-min-width {
  width: min-content;
}

.fit-min-height {
  height: min-content;
}

.fit-min-size {
  width: min-content;
  height: min-content;
}

.w-0 {
  width: 0;
}

.min-w-0 {
  min-width: 0;
}

.max-w-0 {
  max-width: 0;
}

.w-10 {
  width: 10%;
}

.min-w-10 {
  min-width: 10%;
}

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

.w-20 {
  width: 20%;
}

.min-w-20 {
  min-width: 20%;
}

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

.w-25 {
  width: 25%;
}

.min-w-25 {
  min-width: 25%;
}

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

.w-30 {
  width: 30%;
}

.min-w-30 {
  min-width: 30%;
}

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

.w-33 {
  width: 33.333%;
}

.min-w-33 {
  min-width: 33.333%;
}

.max-w-33 {
  max-width: 33.333%;
}

.w-40 {
  width: 40%;
}

.min-w-40 {
  min-width: 40%;
}

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

.w-50 {
  width: 50%;
}

.min-w-50 {
  min-width: 50%;
}

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

.w-60 {
  width: 60%;
}

.min-w-60 {
  min-width: 60%;
}

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

.w-66 {
  width: 66.666%;
}

.min-w-66 {
  min-width: 66.666%;
}

.max-w-66 {
  max-width: 66.666%;
}

.w-70 {
  width: 70%;
}

.min-w-70 {
  min-width: 70%;
}

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

.w-75 {
  width: 75%;
}

.min-w-75 {
  min-width: 75%;
}

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

.w-80 {
  width: 80%;
}

.min-w-80 {
  min-width: 80%;
}

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

.w-90 {
  width: 90%;
}

.min-w-90 {
  min-width: 90%;
}

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

.w-100 {
  width: 100%;
}

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

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

.w-auto {
  width: auto;
}

.h-0 {
  height: 0;
}

.min-h-0 {
  min-height: 0;
}

.max-h-0 {
  max-height: 0;
}

.h-10 {
  height: 10vh;
}

.min-h-10 {
  min-height: 10vh;
}

.max-h-10 {
  max-height: 10vh;
}

.h-20 {
  height: 20vh;
}

.min-h-20 {
  min-height: 20vh;
}

.max-h-20 {
  max-height: 20vh;
}

.h-25 {
  height: 25vh;
}

.min-h-25 {
  min-height: 25vh;
}

.max-h-25 {
  max-height: 25vh;
}

.h-30 {
  height: 30vh;
}

.min-h-30 {
  min-height: 30vh;
}

.max-h-30 {
  max-height: 30vh;
}

.h-40 {
  height: 40vh;
}

.min-h-40 {
  min-height: 40vh;
}

.max-h-40 {
  max-height: 40vh;
}

.h-50 {
  height: 50vh;
}

.min-h-50 {
  min-height: 50vh;
}

.max-h-50 {
  max-height: 50vh;
}

.h-60 {
  height: 60vh;
}

.min-h-60 {
  min-height: 60vh;
}

.max-h-60 {
  max-height: 60vh;
}

.h-70 {
  height: 70vh;
}

.min-h-70 {
  min-height: 70vh;
}

.max-h-70 {
  max-height: 70vh;
}

.h-75 {
  height: 75vh;
}

.min-h-75 {
  min-height: 75vh;
}

.max-h-75 {
  max-height: 75vh;
}

.h-80 {
  height: 80vh;
}

.min-h-80 {
  min-height: 80vh;
}

.max-h-80 {
  max-height: 80vh;
}

.h-90 {
  height: 90vh;
}

.min-h-90 {
  min-height: 90vh;
}

.max-h-90 {
  max-height: 90vh;
}

.h-100 {
  height: 100vh;
}

.min-h-100 {
  min-height: 100vh;
}

.max-h-100 {
  max-height: 100vh;
}

@media (min-width: 480px) {
  .fit-width-xs {
    width: fit-content;
  }
  .fit-height-xs {
    height: fit-content;
  }
  .fit-size-xs {
    width: fit-content;
    height: fit-content;
  }
  .fit-max-width-xs {
    width: max-content;
  }
  .fit-max-height-xs {
    height: max-content;
  }
  .fit-max-size-xs {
    width: max-content;
    height: max-content;
  }
  .fit-min-width-xs {
    width: min-content;
  }
  .fit-min-height-xs {
    height: min-content;
  }
  .fit-min-size-xs {
    width: min-content;
    height: min-content;
  }
  .w-0-xs {
    width: 0;
  }
  .min-w-0-xs {
    min-width: 0;
  }
  .max-w-0-xs {
    max-width: 0;
  }
  .w-10-xs {
    width: 10%;
  }
  .min-w-10-xs {
    min-width: 10%;
  }
  .max-w-10-xs {
    max-width: 10%;
  }
  .w-20-xs {
    width: 20%;
  }
  .min-w-20-xs {
    min-width: 20%;
  }
  .max-w-20-xs {
    max-width: 20%;
  }
  .w-25-xs {
    width: 25%;
  }
  .min-w-25-xs {
    min-width: 25%;
  }
  .max-w-25-xs {
    max-width: 25%;
  }
  .w-30-xs {
    width: 30%;
  }
  .min-w-30-xs {
    min-width: 30%;
  }
  .max-w-30-xs {
    max-width: 30%;
  }
  .w-33-xs {
    width: 33.333%;
  }
  .min-w-33-xs {
    min-width: 33.333%;
  }
  .max-w-33-xs {
    max-width: 33.333%;
  }
  .w-40-xs {
    width: 40%;
  }
  .min-w-40-xs {
    min-width: 40%;
  }
  .max-w-40-xs {
    max-width: 40%;
  }
  .w-50-xs {
    width: 50%;
  }
  .min-w-50-xs {
    min-width: 50%;
  }
  .max-w-50-xs {
    max-width: 50%;
  }
  .w-60-xs {
    width: 60%;
  }
  .min-w-60-xs {
    min-width: 60%;
  }
  .max-w-60-xs {
    max-width: 60%;
  }
  .w-66-xs {
    width: 66.666%;
  }
  .min-w-66-xs {
    min-width: 66.666%;
  }
  .max-w-66-xs {
    max-width: 66.666%;
  }
  .w-70-xs {
    width: 70%;
  }
  .min-w-70-xs {
    min-width: 70%;
  }
  .max-w-70-xs {
    max-width: 70%;
  }
  .w-75-xs {
    width: 75%;
  }
  .min-w-75-xs {
    min-width: 75%;
  }
  .max-w-75-xs {
    max-width: 75%;
  }
  .w-80-xs {
    width: 80%;
  }
  .min-w-80-xs {
    min-width: 80%;
  }
  .max-w-80-xs {
    max-width: 80%;
  }
  .w-90-xs {
    width: 90%;
  }
  .min-w-90-xs {
    min-width: 90%;
  }
  .max-w-90-xs {
    max-width: 90%;
  }
  .w-100-xs {
    width: 100%;
  }
  .min-w-100-xs {
    min-width: 100%;
  }
  .max-w-100-xs {
    max-width: 100%;
  }
  .w-auto-xs {
    width: auto;
  }
  .h-0-xs {
    height: 0;
  }
  .min-h-0-xs {
    min-height: 0;
  }
  .max-h-0-xs {
    max-height: 0;
  }
  .h-10-xs {
    height: 10vh;
  }
  .min-h-10-xs {
    min-height: 10vh;
  }
  .max-h-10-xs {
    max-height: 10vh;
  }
  .h-20-xs {
    height: 20vh;
  }
  .min-h-20-xs {
    min-height: 20vh;
  }
  .max-h-20-xs {
    max-height: 20vh;
  }
  .h-25-xs {
    height: 25vh;
  }
  .min-h-25-xs {
    min-height: 25vh;
  }
  .max-h-25-xs {
    max-height: 25vh;
  }
  .h-30-xs {
    height: 30vh;
  }
  .min-h-30-xs {
    min-height: 30vh;
  }
  .max-h-30-xs {
    max-height: 30vh;
  }
  .h-40-xs {
    height: 40vh;
  }
  .min-h-40-xs {
    min-height: 40vh;
  }
  .max-h-40-xs {
    max-height: 40vh;
  }
  .h-50-xs {
    height: 50vh;
  }
  .min-h-50-xs {
    min-height: 50vh;
  }
  .max-h-50-xs {
    max-height: 50vh;
  }
  .h-60-xs {
    height: 60vh;
  }
  .min-h-60-xs {
    min-height: 60vh;
  }
  .max-h-60-xs {
    max-height: 60vh;
  }
  .h-70-xs {
    height: 70vh;
  }
  .min-h-70-xs {
    min-height: 70vh;
  }
  .max-h-70-xs {
    max-height: 70vh;
  }
  .h-75-xs {
    height: 75vh;
  }
  .min-h-75-xs {
    min-height: 75vh;
  }
  .max-h-75-xs {
    max-height: 75vh;
  }
  .h-80-xs {
    height: 80vh;
  }
  .min-h-80-xs {
    min-height: 80vh;
  }
  .max-h-80-xs {
    max-height: 80vh;
  }
  .h-90-xs {
    height: 90vh;
  }
  .min-h-90-xs {
    min-height: 90vh;
  }
  .max-h-90-xs {
    max-height: 90vh;
  }
  .h-100-xs {
    height: 100vh;
  }
  .min-h-100-xs {
    min-height: 100vh;
  }
  .max-h-100-xs {
    max-height: 100vh;
  }
}
@media (min-width: 640px) {
  .fit-width-sm {
    width: fit-content;
  }
  .fit-height-sm {
    height: fit-content;
  }
  .fit-size-sm {
    width: fit-content;
    height: fit-content;
  }
  .fit-max-width-sm {
    width: max-content;
  }
  .fit-max-height-sm {
    height: max-content;
  }
  .fit-max-size-sm {
    width: max-content;
    height: max-content;
  }
  .fit-min-width-sm {
    width: min-content;
  }
  .fit-min-height-sm {
    height: min-content;
  }
  .fit-min-size-sm {
    width: min-content;
    height: min-content;
  }
  .w-0-sm {
    width: 0;
  }
  .min-w-0-sm {
    min-width: 0;
  }
  .max-w-0-sm {
    max-width: 0;
  }
  .w-10-sm {
    width: 10%;
  }
  .min-w-10-sm {
    min-width: 10%;
  }
  .max-w-10-sm {
    max-width: 10%;
  }
  .w-20-sm {
    width: 20%;
  }
  .min-w-20-sm {
    min-width: 20%;
  }
  .max-w-20-sm {
    max-width: 20%;
  }
  .w-25-sm {
    width: 25%;
  }
  .min-w-25-sm {
    min-width: 25%;
  }
  .max-w-25-sm {
    max-width: 25%;
  }
  .w-30-sm {
    width: 30%;
  }
  .min-w-30-sm {
    min-width: 30%;
  }
  .max-w-30-sm {
    max-width: 30%;
  }
  .w-33-sm {
    width: 33.333%;
  }
  .min-w-33-sm {
    min-width: 33.333%;
  }
  .max-w-33-sm {
    max-width: 33.333%;
  }
  .w-40-sm {
    width: 40%;
  }
  .min-w-40-sm {
    min-width: 40%;
  }
  .max-w-40-sm {
    max-width: 40%;
  }
  .w-50-sm {
    width: 50%;
  }
  .min-w-50-sm {
    min-width: 50%;
  }
  .max-w-50-sm {
    max-width: 50%;
  }
  .w-60-sm {
    width: 60%;
  }
  .min-w-60-sm {
    min-width: 60%;
  }
  .max-w-60-sm {
    max-width: 60%;
  }
  .w-66-sm {
    width: 66.666%;
  }
  .min-w-66-sm {
    min-width: 66.666%;
  }
  .max-w-66-sm {
    max-width: 66.666%;
  }
  .w-70-sm {
    width: 70%;
  }
  .min-w-70-sm {
    min-width: 70%;
  }
  .max-w-70-sm {
    max-width: 70%;
  }
  .w-75-sm {
    width: 75%;
  }
  .min-w-75-sm {
    min-width: 75%;
  }
  .max-w-75-sm {
    max-width: 75%;
  }
  .w-80-sm {
    width: 80%;
  }
  .min-w-80-sm {
    min-width: 80%;
  }
  .max-w-80-sm {
    max-width: 80%;
  }
  .w-90-sm {
    width: 90%;
  }
  .min-w-90-sm {
    min-width: 90%;
  }
  .max-w-90-sm {
    max-width: 90%;
  }
  .w-100-sm {
    width: 100%;
  }
  .min-w-100-sm {
    min-width: 100%;
  }
  .max-w-100-sm {
    max-width: 100%;
  }
  .w-auto-sm {
    width: auto;
  }
  .h-0-sm {
    height: 0;
  }
  .min-h-0-sm {
    min-height: 0;
  }
  .max-h-0-sm {
    max-height: 0;
  }
  .h-10-sm {
    height: 10vh;
  }
  .min-h-10-sm {
    min-height: 10vh;
  }
  .max-h-10-sm {
    max-height: 10vh;
  }
  .h-20-sm {
    height: 20vh;
  }
  .min-h-20-sm {
    min-height: 20vh;
  }
  .max-h-20-sm {
    max-height: 20vh;
  }
  .h-25-sm {
    height: 25vh;
  }
  .min-h-25-sm {
    min-height: 25vh;
  }
  .max-h-25-sm {
    max-height: 25vh;
  }
  .h-30-sm {
    height: 30vh;
  }
  .min-h-30-sm {
    min-height: 30vh;
  }
  .max-h-30-sm {
    max-height: 30vh;
  }
  .h-40-sm {
    height: 40vh;
  }
  .min-h-40-sm {
    min-height: 40vh;
  }
  .max-h-40-sm {
    max-height: 40vh;
  }
  .h-50-sm {
    height: 50vh;
  }
  .min-h-50-sm {
    min-height: 50vh;
  }
  .max-h-50-sm {
    max-height: 50vh;
  }
  .h-60-sm {
    height: 60vh;
  }
  .min-h-60-sm {
    min-height: 60vh;
  }
  .max-h-60-sm {
    max-height: 60vh;
  }
  .h-70-sm {
    height: 70vh;
  }
  .min-h-70-sm {
    min-height: 70vh;
  }
  .max-h-70-sm {
    max-height: 70vh;
  }
  .h-75-sm {
    height: 75vh;
  }
  .min-h-75-sm {
    min-height: 75vh;
  }
  .max-h-75-sm {
    max-height: 75vh;
  }
  .h-80-sm {
    height: 80vh;
  }
  .min-h-80-sm {
    min-height: 80vh;
  }
  .max-h-80-sm {
    max-height: 80vh;
  }
  .h-90-sm {
    height: 90vh;
  }
  .min-h-90-sm {
    min-height: 90vh;
  }
  .max-h-90-sm {
    max-height: 90vh;
  }
  .h-100-sm {
    height: 100vh;
  }
  .min-h-100-sm {
    min-height: 100vh;
  }
  .max-h-100-sm {
    max-height: 100vh;
  }
}
@media (min-width: 768px) {
  .fit-width-md {
    width: fit-content;
  }
  .fit-height-md {
    height: fit-content;
  }
  .fit-size-md {
    width: fit-content;
    height: fit-content;
  }
  .fit-max-width-md {
    width: max-content;
  }
  .fit-max-height-md {
    height: max-content;
  }
  .fit-max-size-md {
    width: max-content;
    height: max-content;
  }
  .fit-min-width-md {
    width: min-content;
  }
  .fit-min-height-md {
    height: min-content;
  }
  .fit-min-size-md {
    width: min-content;
    height: min-content;
  }
  .w-0-md {
    width: 0;
  }
  .min-w-0-md {
    min-width: 0;
  }
  .max-w-0-md {
    max-width: 0;
  }
  .w-10-md {
    width: 10%;
  }
  .min-w-10-md {
    min-width: 10%;
  }
  .max-w-10-md {
    max-width: 10%;
  }
  .w-20-md {
    width: 20%;
  }
  .min-w-20-md {
    min-width: 20%;
  }
  .max-w-20-md {
    max-width: 20%;
  }
  .w-25-md {
    width: 25%;
  }
  .min-w-25-md {
    min-width: 25%;
  }
  .max-w-25-md {
    max-width: 25%;
  }
  .w-30-md {
    width: 30%;
  }
  .min-w-30-md {
    min-width: 30%;
  }
  .max-w-30-md {
    max-width: 30%;
  }
  .w-33-md {
    width: 33.333%;
  }
  .min-w-33-md {
    min-width: 33.333%;
  }
  .max-w-33-md {
    max-width: 33.333%;
  }
  .w-40-md {
    width: 40%;
  }
  .min-w-40-md {
    min-width: 40%;
  }
  .max-w-40-md {
    max-width: 40%;
  }
  .w-50-md {
    width: 50%;
  }
  .min-w-50-md {
    min-width: 50%;
  }
  .max-w-50-md {
    max-width: 50%;
  }
  .w-60-md {
    width: 60%;
  }
  .min-w-60-md {
    min-width: 60%;
  }
  .max-w-60-md {
    max-width: 60%;
  }
  .w-66-md {
    width: 66.666%;
  }
  .min-w-66-md {
    min-width: 66.666%;
  }
  .max-w-66-md {
    max-width: 66.666%;
  }
  .w-70-md {
    width: 70%;
  }
  .min-w-70-md {
    min-width: 70%;
  }
  .max-w-70-md {
    max-width: 70%;
  }
  .w-75-md {
    width: 75%;
  }
  .min-w-75-md {
    min-width: 75%;
  }
  .max-w-75-md {
    max-width: 75%;
  }
  .w-80-md {
    width: 80%;
  }
  .min-w-80-md {
    min-width: 80%;
  }
  .max-w-80-md {
    max-width: 80%;
  }
  .w-90-md {
    width: 90%;
  }
  .min-w-90-md {
    min-width: 90%;
  }
  .max-w-90-md {
    max-width: 90%;
  }
  .w-100-md {
    width: 100%;
  }
  .min-w-100-md {
    min-width: 100%;
  }
  .max-w-100-md {
    max-width: 100%;
  }
  .w-auto-md {
    width: auto;
  }
  .h-0-md {
    height: 0;
  }
  .min-h-0-md {
    min-height: 0;
  }
  .max-h-0-md {
    max-height: 0;
  }
  .h-10-md {
    height: 10vh;
  }
  .min-h-10-md {
    min-height: 10vh;
  }
  .max-h-10-md {
    max-height: 10vh;
  }
  .h-20-md {
    height: 20vh;
  }
  .min-h-20-md {
    min-height: 20vh;
  }
  .max-h-20-md {
    max-height: 20vh;
  }
  .h-25-md {
    height: 25vh;
  }
  .min-h-25-md {
    min-height: 25vh;
  }
  .max-h-25-md {
    max-height: 25vh;
  }
  .h-30-md {
    height: 30vh;
  }
  .min-h-30-md {
    min-height: 30vh;
  }
  .max-h-30-md {
    max-height: 30vh;
  }
  .h-40-md {
    height: 40vh;
  }
  .min-h-40-md {
    min-height: 40vh;
  }
  .max-h-40-md {
    max-height: 40vh;
  }
  .h-50-md {
    height: 50vh;
  }
  .min-h-50-md {
    min-height: 50vh;
  }
  .max-h-50-md {
    max-height: 50vh;
  }
  .h-60-md {
    height: 60vh;
  }
  .min-h-60-md {
    min-height: 60vh;
  }
  .max-h-60-md {
    max-height: 60vh;
  }
  .h-70-md {
    height: 70vh;
  }
  .min-h-70-md {
    min-height: 70vh;
  }
  .max-h-70-md {
    max-height: 70vh;
  }
  .h-75-md {
    height: 75vh;
  }
  .min-h-75-md {
    min-height: 75vh;
  }
  .max-h-75-md {
    max-height: 75vh;
  }
  .h-80-md {
    height: 80vh;
  }
  .min-h-80-md {
    min-height: 80vh;
  }
  .max-h-80-md {
    max-height: 80vh;
  }
  .h-90-md {
    height: 90vh;
  }
  .min-h-90-md {
    min-height: 90vh;
  }
  .max-h-90-md {
    max-height: 90vh;
  }
  .h-100-md {
    height: 100vh;
  }
  .min-h-100-md {
    min-height: 100vh;
  }
  .max-h-100-md {
    max-height: 100vh;
  }
}
@media (min-width: 1024px) {
  .fit-width-lg {
    width: fit-content;
  }
  .fit-height-lg {
    height: fit-content;
  }
  .fit-size-lg {
    width: fit-content;
    height: fit-content;
  }
  .fit-max-width-lg {
    width: max-content;
  }
  .fit-max-height-lg {
    height: max-content;
  }
  .fit-max-size-lg {
    width: max-content;
    height: max-content;
  }
  .fit-min-width-lg {
    width: min-content;
  }
  .fit-min-height-lg {
    height: min-content;
  }
  .fit-min-size-lg {
    width: min-content;
    height: min-content;
  }
  .w-0-lg {
    width: 0;
  }
  .min-w-0-lg {
    min-width: 0;
  }
  .max-w-0-lg {
    max-width: 0;
  }
  .w-10-lg {
    width: 10%;
  }
  .min-w-10-lg {
    min-width: 10%;
  }
  .max-w-10-lg {
    max-width: 10%;
  }
  .w-20-lg {
    width: 20%;
  }
  .min-w-20-lg {
    min-width: 20%;
  }
  .max-w-20-lg {
    max-width: 20%;
  }
  .w-25-lg {
    width: 25%;
  }
  .min-w-25-lg {
    min-width: 25%;
  }
  .max-w-25-lg {
    max-width: 25%;
  }
  .w-30-lg {
    width: 30%;
  }
  .min-w-30-lg {
    min-width: 30%;
  }
  .max-w-30-lg {
    max-width: 30%;
  }
  .w-33-lg {
    width: 33.333%;
  }
  .min-w-33-lg {
    min-width: 33.333%;
  }
  .max-w-33-lg {
    max-width: 33.333%;
  }
  .w-40-lg {
    width: 40%;
  }
  .min-w-40-lg {
    min-width: 40%;
  }
  .max-w-40-lg {
    max-width: 40%;
  }
  .w-50-lg {
    width: 50%;
  }
  .min-w-50-lg {
    min-width: 50%;
  }
  .max-w-50-lg {
    max-width: 50%;
  }
  .w-60-lg {
    width: 60%;
  }
  .min-w-60-lg {
    min-width: 60%;
  }
  .max-w-60-lg {
    max-width: 60%;
  }
  .w-66-lg {
    width: 66.666%;
  }
  .min-w-66-lg {
    min-width: 66.666%;
  }
  .max-w-66-lg {
    max-width: 66.666%;
  }
  .w-70-lg {
    width: 70%;
  }
  .min-w-70-lg {
    min-width: 70%;
  }
  .max-w-70-lg {
    max-width: 70%;
  }
  .w-75-lg {
    width: 75%;
  }
  .min-w-75-lg {
    min-width: 75%;
  }
  .max-w-75-lg {
    max-width: 75%;
  }
  .w-80-lg {
    width: 80%;
  }
  .min-w-80-lg {
    min-width: 80%;
  }
  .max-w-80-lg {
    max-width: 80%;
  }
  .w-90-lg {
    width: 90%;
  }
  .min-w-90-lg {
    min-width: 90%;
  }
  .max-w-90-lg {
    max-width: 90%;
  }
  .w-100-lg {
    width: 100%;
  }
  .min-w-100-lg {
    min-width: 100%;
  }
  .max-w-100-lg {
    max-width: 100%;
  }
  .w-auto-lg {
    width: auto;
  }
  .h-0-lg {
    height: 0;
  }
  .min-h-0-lg {
    min-height: 0;
  }
  .max-h-0-lg {
    max-height: 0;
  }
  .h-10-lg {
    height: 10vh;
  }
  .min-h-10-lg {
    min-height: 10vh;
  }
  .max-h-10-lg {
    max-height: 10vh;
  }
  .h-20-lg {
    height: 20vh;
  }
  .min-h-20-lg {
    min-height: 20vh;
  }
  .max-h-20-lg {
    max-height: 20vh;
  }
  .h-25-lg {
    height: 25vh;
  }
  .min-h-25-lg {
    min-height: 25vh;
  }
  .max-h-25-lg {
    max-height: 25vh;
  }
  .h-30-lg {
    height: 30vh;
  }
  .min-h-30-lg {
    min-height: 30vh;
  }
  .max-h-30-lg {
    max-height: 30vh;
  }
  .h-40-lg {
    height: 40vh;
  }
  .min-h-40-lg {
    min-height: 40vh;
  }
  .max-h-40-lg {
    max-height: 40vh;
  }
  .h-50-lg {
    height: 50vh;
  }
  .min-h-50-lg {
    min-height: 50vh;
  }
  .max-h-50-lg {
    max-height: 50vh;
  }
  .h-60-lg {
    height: 60vh;
  }
  .min-h-60-lg {
    min-height: 60vh;
  }
  .max-h-60-lg {
    max-height: 60vh;
  }
  .h-70-lg {
    height: 70vh;
  }
  .min-h-70-lg {
    min-height: 70vh;
  }
  .max-h-70-lg {
    max-height: 70vh;
  }
  .h-75-lg {
    height: 75vh;
  }
  .min-h-75-lg {
    min-height: 75vh;
  }
  .max-h-75-lg {
    max-height: 75vh;
  }
  .h-80-lg {
    height: 80vh;
  }
  .min-h-80-lg {
    min-height: 80vh;
  }
  .max-h-80-lg {
    max-height: 80vh;
  }
  .h-90-lg {
    height: 90vh;
  }
  .min-h-90-lg {
    min-height: 90vh;
  }
  .max-h-90-lg {
    max-height: 90vh;
  }
  .h-100-lg {
    height: 100vh;
  }
  .min-h-100-lg {
    min-height: 100vh;
  }
  .max-h-100-lg {
    max-height: 100vh;
  }
}
@media (min-width: 1280px) {
  .fit-width-xl {
    width: fit-content;
  }
  .fit-height-xl {
    height: fit-content;
  }
  .fit-size-xl {
    width: fit-content;
    height: fit-content;
  }
  .fit-max-width-xl {
    width: max-content;
  }
  .fit-max-height-xl {
    height: max-content;
  }
  .fit-max-size-xl {
    width: max-content;
    height: max-content;
  }
  .fit-min-width-xl {
    width: min-content;
  }
  .fit-min-height-xl {
    height: min-content;
  }
  .fit-min-size-xl {
    width: min-content;
    height: min-content;
  }
  .w-0-xl {
    width: 0;
  }
  .min-w-0-xl {
    min-width: 0;
  }
  .max-w-0-xl {
    max-width: 0;
  }
  .w-10-xl {
    width: 10%;
  }
  .min-w-10-xl {
    min-width: 10%;
  }
  .max-w-10-xl {
    max-width: 10%;
  }
  .w-20-xl {
    width: 20%;
  }
  .min-w-20-xl {
    min-width: 20%;
  }
  .max-w-20-xl {
    max-width: 20%;
  }
  .w-25-xl {
    width: 25%;
  }
  .min-w-25-xl {
    min-width: 25%;
  }
  .max-w-25-xl {
    max-width: 25%;
  }
  .w-30-xl {
    width: 30%;
  }
  .min-w-30-xl {
    min-width: 30%;
  }
  .max-w-30-xl {
    max-width: 30%;
  }
  .w-33-xl {
    width: 33.333%;
  }
  .min-w-33-xl {
    min-width: 33.333%;
  }
  .max-w-33-xl {
    max-width: 33.333%;
  }
  .w-40-xl {
    width: 40%;
  }
  .min-w-40-xl {
    min-width: 40%;
  }
  .max-w-40-xl {
    max-width: 40%;
  }
  .w-50-xl {
    width: 50%;
  }
  .min-w-50-xl {
    min-width: 50%;
  }
  .max-w-50-xl {
    max-width: 50%;
  }
  .w-60-xl {
    width: 60%;
  }
  .min-w-60-xl {
    min-width: 60%;
  }
  .max-w-60-xl {
    max-width: 60%;
  }
  .w-66-xl {
    width: 66.666%;
  }
  .min-w-66-xl {
    min-width: 66.666%;
  }
  .max-w-66-xl {
    max-width: 66.666%;
  }
  .w-70-xl {
    width: 70%;
  }
  .min-w-70-xl {
    min-width: 70%;
  }
  .max-w-70-xl {
    max-width: 70%;
  }
  .w-75-xl {
    width: 75%;
  }
  .min-w-75-xl {
    min-width: 75%;
  }
  .max-w-75-xl {
    max-width: 75%;
  }
  .w-80-xl {
    width: 80%;
  }
  .min-w-80-xl {
    min-width: 80%;
  }
  .max-w-80-xl {
    max-width: 80%;
  }
  .w-90-xl {
    width: 90%;
  }
  .min-w-90-xl {
    min-width: 90%;
  }
  .max-w-90-xl {
    max-width: 90%;
  }
  .w-100-xl {
    width: 100%;
  }
  .min-w-100-xl {
    min-width: 100%;
  }
  .max-w-100-xl {
    max-width: 100%;
  }
  .w-auto-xl {
    width: auto;
  }
  .h-0-xl {
    height: 0;
  }
  .min-h-0-xl {
    min-height: 0;
  }
  .max-h-0-xl {
    max-height: 0;
  }
  .h-10-xl {
    height: 10vh;
  }
  .min-h-10-xl {
    min-height: 10vh;
  }
  .max-h-10-xl {
    max-height: 10vh;
  }
  .h-20-xl {
    height: 20vh;
  }
  .min-h-20-xl {
    min-height: 20vh;
  }
  .max-h-20-xl {
    max-height: 20vh;
  }
  .h-25-xl {
    height: 25vh;
  }
  .min-h-25-xl {
    min-height: 25vh;
  }
  .max-h-25-xl {
    max-height: 25vh;
  }
  .h-30-xl {
    height: 30vh;
  }
  .min-h-30-xl {
    min-height: 30vh;
  }
  .max-h-30-xl {
    max-height: 30vh;
  }
  .h-40-xl {
    height: 40vh;
  }
  .min-h-40-xl {
    min-height: 40vh;
  }
  .max-h-40-xl {
    max-height: 40vh;
  }
  .h-50-xl {
    height: 50vh;
  }
  .min-h-50-xl {
    min-height: 50vh;
  }
  .max-h-50-xl {
    max-height: 50vh;
  }
  .h-60-xl {
    height: 60vh;
  }
  .min-h-60-xl {
    min-height: 60vh;
  }
  .max-h-60-xl {
    max-height: 60vh;
  }
  .h-70-xl {
    height: 70vh;
  }
  .min-h-70-xl {
    min-height: 70vh;
  }
  .max-h-70-xl {
    max-height: 70vh;
  }
  .h-75-xl {
    height: 75vh;
  }
  .min-h-75-xl {
    min-height: 75vh;
  }
  .max-h-75-xl {
    max-height: 75vh;
  }
  .h-80-xl {
    height: 80vh;
  }
  .min-h-80-xl {
    min-height: 80vh;
  }
  .max-h-80-xl {
    max-height: 80vh;
  }
  .h-90-xl {
    height: 90vh;
  }
  .min-h-90-xl {
    min-height: 90vh;
  }
  .max-h-90-xl {
    max-height: 90vh;
  }
  .h-100-xl {
    height: 100vh;
  }
  .min-h-100-xl {
    min-height: 100vh;
  }
  .max-h-100-xl {
    max-height: 100vh;
  }
}
@media (min-width: 1536px) {
  .fit-width-xxl {
    width: fit-content;
  }
  .fit-height-xxl {
    height: fit-content;
  }
  .fit-size-xxl {
    width: fit-content;
    height: fit-content;
  }
  .fit-max-width-xxl {
    width: max-content;
  }
  .fit-max-height-xxl {
    height: max-content;
  }
  .fit-max-size-xxl {
    width: max-content;
    height: max-content;
  }
  .fit-min-width-xxl {
    width: min-content;
  }
  .fit-min-height-xxl {
    height: min-content;
  }
  .fit-min-size-xxl {
    width: min-content;
    height: min-content;
  }
  .w-0-xxl {
    width: 0;
  }
  .min-w-0-xxl {
    min-width: 0;
  }
  .max-w-0-xxl {
    max-width: 0;
  }
  .w-10-xxl {
    width: 10%;
  }
  .min-w-10-xxl {
    min-width: 10%;
  }
  .max-w-10-xxl {
    max-width: 10%;
  }
  .w-20-xxl {
    width: 20%;
  }
  .min-w-20-xxl {
    min-width: 20%;
  }
  .max-w-20-xxl {
    max-width: 20%;
  }
  .w-25-xxl {
    width: 25%;
  }
  .min-w-25-xxl {
    min-width: 25%;
  }
  .max-w-25-xxl {
    max-width: 25%;
  }
  .w-30-xxl {
    width: 30%;
  }
  .min-w-30-xxl {
    min-width: 30%;
  }
  .max-w-30-xxl {
    max-width: 30%;
  }
  .w-33-xxl {
    width: 33.333%;
  }
  .min-w-33-xxl {
    min-width: 33.333%;
  }
  .max-w-33-xxl {
    max-width: 33.333%;
  }
  .w-40-xxl {
    width: 40%;
  }
  .min-w-40-xxl {
    min-width: 40%;
  }
  .max-w-40-xxl {
    max-width: 40%;
  }
  .w-50-xxl {
    width: 50%;
  }
  .min-w-50-xxl {
    min-width: 50%;
  }
  .max-w-50-xxl {
    max-width: 50%;
  }
  .w-60-xxl {
    width: 60%;
  }
  .min-w-60-xxl {
    min-width: 60%;
  }
  .max-w-60-xxl {
    max-width: 60%;
  }
  .w-66-xxl {
    width: 66.666%;
  }
  .min-w-66-xxl {
    min-width: 66.666%;
  }
  .max-w-66-xxl {
    max-width: 66.666%;
  }
  .w-70-xxl {
    width: 70%;
  }
  .min-w-70-xxl {
    min-width: 70%;
  }
  .max-w-70-xxl {
    max-width: 70%;
  }
  .w-75-xxl {
    width: 75%;
  }
  .min-w-75-xxl {
    min-width: 75%;
  }
  .max-w-75-xxl {
    max-width: 75%;
  }
  .w-80-xxl {
    width: 80%;
  }
  .min-w-80-xxl {
    min-width: 80%;
  }
  .max-w-80-xxl {
    max-width: 80%;
  }
  .w-90-xxl {
    width: 90%;
  }
  .min-w-90-xxl {
    min-width: 90%;
  }
  .max-w-90-xxl {
    max-width: 90%;
  }
  .w-100-xxl {
    width: 100%;
  }
  .min-w-100-xxl {
    min-width: 100%;
  }
  .max-w-100-xxl {
    max-width: 100%;
  }
  .w-auto-xxl {
    width: auto;
  }
  .h-0-xxl {
    height: 0;
  }
  .min-h-0-xxl {
    min-height: 0;
  }
  .max-h-0-xxl {
    max-height: 0;
  }
  .h-10-xxl {
    height: 10vh;
  }
  .min-h-10-xxl {
    min-height: 10vh;
  }
  .max-h-10-xxl {
    max-height: 10vh;
  }
  .h-20-xxl {
    height: 20vh;
  }
  .min-h-20-xxl {
    min-height: 20vh;
  }
  .max-h-20-xxl {
    max-height: 20vh;
  }
  .h-25-xxl {
    height: 25vh;
  }
  .min-h-25-xxl {
    min-height: 25vh;
  }
  .max-h-25-xxl {
    max-height: 25vh;
  }
  .h-30-xxl {
    height: 30vh;
  }
  .min-h-30-xxl {
    min-height: 30vh;
  }
  .max-h-30-xxl {
    max-height: 30vh;
  }
  .h-40-xxl {
    height: 40vh;
  }
  .min-h-40-xxl {
    min-height: 40vh;
  }
  .max-h-40-xxl {
    max-height: 40vh;
  }
  .h-50-xxl {
    height: 50vh;
  }
  .min-h-50-xxl {
    min-height: 50vh;
  }
  .max-h-50-xxl {
    max-height: 50vh;
  }
  .h-60-xxl {
    height: 60vh;
  }
  .min-h-60-xxl {
    min-height: 60vh;
  }
  .max-h-60-xxl {
    max-height: 60vh;
  }
  .h-70-xxl {
    height: 70vh;
  }
  .min-h-70-xxl {
    min-height: 70vh;
  }
  .max-h-70-xxl {
    max-height: 70vh;
  }
  .h-75-xxl {
    height: 75vh;
  }
  .min-h-75-xxl {
    min-height: 75vh;
  }
  .max-h-75-xxl {
    max-height: 75vh;
  }
  .h-80-xxl {
    height: 80vh;
  }
  .min-h-80-xxl {
    min-height: 80vh;
  }
  .max-h-80-xxl {
    max-height: 80vh;
  }
  .h-90-xxl {
    height: 90vh;
  }
  .min-h-90-xxl {
    min-height: 90vh;
  }
  .max-h-90-xxl {
    max-height: 90vh;
  }
  .h-100-xxl {
    height: 100vh;
  }
  .min-h-100-xxl {
    min-height: 100vh;
  }
  .max-h-100-xxl {
    max-height: 100vh;
  }
}
.m-0 {
  margin: 0;
}

.mt-0 {
  margin-top: 0;
}

.mb-0 {
  margin-bottom: 0;
}

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

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

.ms-0 {
  margin-inline-start: 0;
}

.me-0 {
  margin-inline-end: 0;
}

.mx-0 {
  margin-inline: 0;
}

.my-0 {
  margin-block: 0;
}

.m-1 {
  margin: 0.5rem;
}

.mt-1 {
  margin-top: 0.5rem;
}

.mb-1 {
  margin-bottom: 0.5rem;
}

.ml-1 {
  margin-left: 0.5rem;
}

.mr-1 {
  margin-right: 0.5rem;
}

.ms-1 {
  margin-inline-start: 0.5rem;
}

.me-1 {
  margin-inline-end: 0.5rem;
}

.mx-1 {
  margin-inline: 0.5rem;
}

.my-1 {
  margin-block: 0.5rem;
}

.m-2 {
  margin: 1rem;
}

.mt-2 {
  margin-top: 1rem;
}

.mb-2 {
  margin-bottom: 1rem;
}

.ml-2 {
  margin-left: 1rem;
}

.mr-2 {
  margin-right: 1rem;
}

.ms-2 {
  margin-inline-start: 1rem;
}

.me-2 {
  margin-inline-end: 1rem;
}

.mx-2 {
  margin-inline: 1rem;
}

.my-2 {
  margin-block: 1rem;
}

.m-3 {
  margin: 1.5rem;
}

.mt-3 {
  margin-top: 1.5rem;
}

.mb-3 {
  margin-bottom: 1.5rem;
}

.ml-3 {
  margin-left: 1.5rem;
}

.mr-3 {
  margin-right: 1.5rem;
}

.ms-3 {
  margin-inline-start: 1.5rem;
}

.me-3 {
  margin-inline-end: 1.5rem;
}

.mx-3 {
  margin-inline: 1.5rem;
}

.my-3 {
  margin-block: 1.5rem;
}

.m-4 {
  margin: 2rem;
}

.mt-4 {
  margin-top: 2rem;
}

.mb-4 {
  margin-bottom: 2rem;
}

.ml-4 {
  margin-left: 2rem;
}

.mr-4 {
  margin-right: 2rem;
}

.ms-4 {
  margin-inline-start: 2rem;
}

.me-4 {
  margin-inline-end: 2rem;
}

.mx-4 {
  margin-inline: 2rem;
}

.my-4 {
  margin-block: 2rem;
}

.m-5 {
  margin: 2.5rem;
}

.mt-5 {
  margin-top: 2.5rem;
}

.mb-5 {
  margin-bottom: 2.5rem;
}

.ml-5 {
  margin-left: 2.5rem;
}

.mr-5 {
  margin-right: 2.5rem;
}

.ms-5 {
  margin-inline-start: 2.5rem;
}

.me-5 {
  margin-inline-end: 2.5rem;
}

.mx-5 {
  margin-inline: 2.5rem;
}

.my-5 {
  margin-block: 2.5rem;
}

.m-6 {
  margin: 3rem;
}

.mt-6 {
  margin-top: 3rem;
}

.mb-6 {
  margin-bottom: 3rem;
}

.ml-6 {
  margin-left: 3rem;
}

.mr-6 {
  margin-right: 3rem;
}

.ms-6 {
  margin-inline-start: 3rem;
}

.me-6 {
  margin-inline-end: 3rem;
}

.mx-6 {
  margin-inline: 3rem;
}

.my-6 {
  margin-block: 3rem;
}

.m-7 {
  margin: 4rem;
}

.mt-7 {
  margin-top: 4rem;
}

.mb-7 {
  margin-bottom: 4rem;
}

.ml-7 {
  margin-left: 4rem;
}

.mr-7 {
  margin-right: 4rem;
}

.ms-7 {
  margin-inline-start: 4rem;
}

.me-7 {
  margin-inline-end: 4rem;
}

.mx-7 {
  margin-inline: 4rem;
}

.my-7 {
  margin-block: 4rem;
}

.m-8 {
  margin: 5rem;
}

.mt-8 {
  margin-top: 5rem;
}

.mb-8 {
  margin-bottom: 5rem;
}

.ml-8 {
  margin-left: 5rem;
}

.mr-8 {
  margin-right: 5rem;
}

.ms-8 {
  margin-inline-start: 5rem;
}

.me-8 {
  margin-inline-end: 5rem;
}

.mx-8 {
  margin-inline: 5rem;
}

.my-8 {
  margin-block: 5rem;
}

.m-9 {
  margin: 6rem;
}

.mt-9 {
  margin-top: 6rem;
}

.mb-9 {
  margin-bottom: 6rem;
}

.ml-9 {
  margin-left: 6rem;
}

.mr-9 {
  margin-right: 6rem;
}

.ms-9 {
  margin-inline-start: 6rem;
}

.me-9 {
  margin-inline-end: 6rem;
}

.mx-9 {
  margin-inline: 6rem;
}

.my-9 {
  margin-block: 6rem;
}

.m-auto {
  margin: auto;
}

.mt-auto {
  margin-top: auto;
}

.mb-auto {
  margin-bottom: auto;
}

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

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

.ms-auto {
  margin-inline-start: auto;
}

.me-auto {
  margin-inline-end: auto;
}

.mx-auto {
  margin-inline: auto;
}

.my-auto {
  margin-block: auto;
}

.p-0 {
  padding: 0;
}

.pt-0 {
  padding-top: 0;
}

.pb-0 {
  padding-bottom: 0;
}

.pl-0 {
  padding-left: 0;
}

.pr-0 {
  padding-right: 0;
}

.ps-0 {
  padding-inline-start: 0;
}

.pe-0 {
  padding-inline-end: 0;
}

.px-0 {
  padding-inline: 0;
}

.py-0 {
  padding-block: 0;
}

.p-1 {
  padding: 0.5rem;
}

.pt-1 {
  padding-top: 0.5rem;
}

.pb-1 {
  padding-bottom: 0.5rem;
}

.pl-1 {
  padding-left: 0.5rem;
}

.pr-1 {
  padding-right: 0.5rem;
}

.ps-1 {
  padding-inline-start: 0.5rem;
}

.pe-1 {
  padding-inline-end: 0.5rem;
}

.px-1 {
  padding-inline: 0.5rem;
}

.py-1 {
  padding-block: 0.5rem;
}

.p-2 {
  padding: 1rem;
}

.pt-2 {
  padding-top: 1rem;
}

.pb-2 {
  padding-bottom: 1rem;
}

.pl-2 {
  padding-left: 1rem;
}

.pr-2 {
  padding-right: 1rem;
}

.ps-2 {
  padding-inline-start: 1rem;
}

.pe-2 {
  padding-inline-end: 1rem;
}

.px-2 {
  padding-inline: 1rem;
}

.py-2 {
  padding-block: 1rem;
}

.p-3 {
  padding: 1.5rem;
}

.pt-3 {
  padding-top: 1.5rem;
}

.pb-3 {
  padding-bottom: 1.5rem;
}

.pl-3 {
  padding-left: 1.5rem;
}

.pr-3 {
  padding-right: 1.5rem;
}

.ps-3 {
  padding-inline-start: 1.5rem;
}

.pe-3 {
  padding-inline-end: 1.5rem;
}

.px-3 {
  padding-inline: 1.5rem;
}

.py-3 {
  padding-block: 1.5rem;
}

.p-4 {
  padding: 2rem;
}

.pt-4 {
  padding-top: 2rem;
}

.pb-4 {
  padding-bottom: 2rem;
}

.pl-4 {
  padding-left: 2rem;
}

.pr-4 {
  padding-right: 2rem;
}

.ps-4 {
  padding-inline-start: 2rem;
}

.pe-4 {
  padding-inline-end: 2rem;
}

.px-4 {
  padding-inline: 2rem;
}

.py-4 {
  padding-block: 2rem;
}

.p-5 {
  padding: 2.5rem;
}

.pt-5 {
  padding-top: 2.5rem;
}

.pb-5 {
  padding-bottom: 2.5rem;
}

.pl-5 {
  padding-left: 2.5rem;
}

.pr-5 {
  padding-right: 2.5rem;
}

.ps-5 {
  padding-inline-start: 2.5rem;
}

.pe-5 {
  padding-inline-end: 2.5rem;
}

.px-5 {
  padding-inline: 2.5rem;
}

.py-5 {
  padding-block: 2.5rem;
}

.p-6 {
  padding: 3rem;
}

.pt-6 {
  padding-top: 3rem;
}

.pb-6 {
  padding-bottom: 3rem;
}

.pl-6 {
  padding-left: 3rem;
}

.pr-6 {
  padding-right: 3rem;
}

.ps-6 {
  padding-inline-start: 3rem;
}

.pe-6 {
  padding-inline-end: 3rem;
}

.px-6 {
  padding-inline: 3rem;
}

.py-6 {
  padding-block: 3rem;
}

.p-7 {
  padding: 4rem;
}

.pt-7 {
  padding-top: 4rem;
}

.pb-7 {
  padding-bottom: 4rem;
}

.pl-7 {
  padding-left: 4rem;
}

.pr-7 {
  padding-right: 4rem;
}

.ps-7 {
  padding-inline-start: 4rem;
}

.pe-7 {
  padding-inline-end: 4rem;
}

.px-7 {
  padding-inline: 4rem;
}

.py-7 {
  padding-block: 4rem;
}

.p-8 {
  padding: 5rem;
}

.pt-8 {
  padding-top: 5rem;
}

.pb-8 {
  padding-bottom: 5rem;
}

.pl-8 {
  padding-left: 5rem;
}

.pr-8 {
  padding-right: 5rem;
}

.ps-8 {
  padding-inline-start: 5rem;
}

.pe-8 {
  padding-inline-end: 5rem;
}

.px-8 {
  padding-inline: 5rem;
}

.py-8 {
  padding-block: 5rem;
}

.p-9 {
  padding: 6rem;
}

.pt-9 {
  padding-top: 6rem;
}

.pb-9 {
  padding-bottom: 6rem;
}

.pl-9 {
  padding-left: 6rem;
}

.pr-9 {
  padding-right: 6rem;
}

.ps-9 {
  padding-inline-start: 6rem;
}

.pe-9 {
  padding-inline-end: 6rem;
}

.px-9 {
  padding-inline: 6rem;
}

.py-9 {
  padding-block: 6rem;
}

.gap-0 {
  gap: 0;
}

.gap-1 {
  gap: 0.5rem;
}

.gap-2 {
  gap: 1rem;
}

.gap-3 {
  gap: 1.5rem;
}

.gap-4 {
  gap: 2rem;
}

.gap-5 {
  gap: 2.5rem;
}

.gap-6 {
  gap: 3rem;
}

.gap-7 {
  gap: 4rem;
}

.gap-8 {
  gap: 5rem;
}

.gap-9 {
  gap: 6rem;
}

@media (min-width: 480px) {
  .m-0-xs {
    margin: 0;
  }
  .mt-0-xs {
    margin-top: 0;
  }
  .mb-0-xs {
    margin-bottom: 0;
  }
  .ml-0-xs {
    margin-left: 0;
  }
  .mr-0-xs {
    margin-right: 0;
  }
  .ms-0-xs {
    margin-inline-start: 0;
  }
  .me-0-xs {
    margin-inline-end: 0;
  }
  .mx-0-xs {
    margin-inline: 0;
  }
  .my-0-xs {
    margin-block: 0;
  }
  .m-1-xs {
    margin: 0.5rem;
  }
  .mt-1-xs {
    margin-top: 0.5rem;
  }
  .mb-1-xs {
    margin-bottom: 0.5rem;
  }
  .ml-1-xs {
    margin-left: 0.5rem;
  }
  .mr-1-xs {
    margin-right: 0.5rem;
  }
  .ms-1-xs {
    margin-inline-start: 0.5rem;
  }
  .me-1-xs {
    margin-inline-end: 0.5rem;
  }
  .mx-1-xs {
    margin-inline: 0.5rem;
  }
  .my-1-xs {
    margin-block: 0.5rem;
  }
  .m-2-xs {
    margin: 1rem;
  }
  .mt-2-xs {
    margin-top: 1rem;
  }
  .mb-2-xs {
    margin-bottom: 1rem;
  }
  .ml-2-xs {
    margin-left: 1rem;
  }
  .mr-2-xs {
    margin-right: 1rem;
  }
  .ms-2-xs {
    margin-inline-start: 1rem;
  }
  .me-2-xs {
    margin-inline-end: 1rem;
  }
  .mx-2-xs {
    margin-inline: 1rem;
  }
  .my-2-xs {
    margin-block: 1rem;
  }
  .m-3-xs {
    margin: 1.5rem;
  }
  .mt-3-xs {
    margin-top: 1.5rem;
  }
  .mb-3-xs {
    margin-bottom: 1.5rem;
  }
  .ml-3-xs {
    margin-left: 1.5rem;
  }
  .mr-3-xs {
    margin-right: 1.5rem;
  }
  .ms-3-xs {
    margin-inline-start: 1.5rem;
  }
  .me-3-xs {
    margin-inline-end: 1.5rem;
  }
  .mx-3-xs {
    margin-inline: 1.5rem;
  }
  .my-3-xs {
    margin-block: 1.5rem;
  }
  .m-4-xs {
    margin: 2rem;
  }
  .mt-4-xs {
    margin-top: 2rem;
  }
  .mb-4-xs {
    margin-bottom: 2rem;
  }
  .ml-4-xs {
    margin-left: 2rem;
  }
  .mr-4-xs {
    margin-right: 2rem;
  }
  .ms-4-xs {
    margin-inline-start: 2rem;
  }
  .me-4-xs {
    margin-inline-end: 2rem;
  }
  .mx-4-xs {
    margin-inline: 2rem;
  }
  .my-4-xs {
    margin-block: 2rem;
  }
  .m-5-xs {
    margin: 2.5rem;
  }
  .mt-5-xs {
    margin-top: 2.5rem;
  }
  .mb-5-xs {
    margin-bottom: 2.5rem;
  }
  .ml-5-xs {
    margin-left: 2.5rem;
  }
  .mr-5-xs {
    margin-right: 2.5rem;
  }
  .ms-5-xs {
    margin-inline-start: 2.5rem;
  }
  .me-5-xs {
    margin-inline-end: 2.5rem;
  }
  .mx-5-xs {
    margin-inline: 2.5rem;
  }
  .my-5-xs {
    margin-block: 2.5rem;
  }
  .m-6-xs {
    margin: 3rem;
  }
  .mt-6-xs {
    margin-top: 3rem;
  }
  .mb-6-xs {
    margin-bottom: 3rem;
  }
  .ml-6-xs {
    margin-left: 3rem;
  }
  .mr-6-xs {
    margin-right: 3rem;
  }
  .ms-6-xs {
    margin-inline-start: 3rem;
  }
  .me-6-xs {
    margin-inline-end: 3rem;
  }
  .mx-6-xs {
    margin-inline: 3rem;
  }
  .my-6-xs {
    margin-block: 3rem;
  }
  .m-7-xs {
    margin: 4rem;
  }
  .mt-7-xs {
    margin-top: 4rem;
  }
  .mb-7-xs {
    margin-bottom: 4rem;
  }
  .ml-7-xs {
    margin-left: 4rem;
  }
  .mr-7-xs {
    margin-right: 4rem;
  }
  .ms-7-xs {
    margin-inline-start: 4rem;
  }
  .me-7-xs {
    margin-inline-end: 4rem;
  }
  .mx-7-xs {
    margin-inline: 4rem;
  }
  .my-7-xs {
    margin-block: 4rem;
  }
  .m-8-xs {
    margin: 5rem;
  }
  .mt-8-xs {
    margin-top: 5rem;
  }
  .mb-8-xs {
    margin-bottom: 5rem;
  }
  .ml-8-xs {
    margin-left: 5rem;
  }
  .mr-8-xs {
    margin-right: 5rem;
  }
  .ms-8-xs {
    margin-inline-start: 5rem;
  }
  .me-8-xs {
    margin-inline-end: 5rem;
  }
  .mx-8-xs {
    margin-inline: 5rem;
  }
  .my-8-xs {
    margin-block: 5rem;
  }
  .m-9-xs {
    margin: 6rem;
  }
  .mt-9-xs {
    margin-top: 6rem;
  }
  .mb-9-xs {
    margin-bottom: 6rem;
  }
  .ml-9-xs {
    margin-left: 6rem;
  }
  .mr-9-xs {
    margin-right: 6rem;
  }
  .ms-9-xs {
    margin-inline-start: 6rem;
  }
  .me-9-xs {
    margin-inline-end: 6rem;
  }
  .mx-9-xs {
    margin-inline: 6rem;
  }
  .my-9-xs {
    margin-block: 6rem;
  }
  .m-auto-xs {
    margin: auto;
  }
  .mt-auto-xs {
    margin-top: auto;
  }
  .mb-auto-xs {
    margin-bottom: auto;
  }
  .ml-auto-xs {
    margin-left: auto;
  }
  .mr-auto-xs {
    margin-right: auto;
  }
  .ms-auto-xs {
    margin-inline-start: auto;
  }
  .me-auto-xs {
    margin-inline-end: auto;
  }
  .mx-auto-xs {
    margin-inline: auto;
  }
  .my-auto-xs {
    margin-block: auto;
  }
}
@media (min-width: 640px) {
  .m-0-sm {
    margin: 0;
  }
  .mt-0-sm {
    margin-top: 0;
  }
  .mb-0-sm {
    margin-bottom: 0;
  }
  .ml-0-sm {
    margin-left: 0;
  }
  .mr-0-sm {
    margin-right: 0;
  }
  .ms-0-sm {
    margin-inline-start: 0;
  }
  .me-0-sm {
    margin-inline-end: 0;
  }
  .mx-0-sm {
    margin-inline: 0;
  }
  .my-0-sm {
    margin-block: 0;
  }
  .m-1-sm {
    margin: 0.5rem;
  }
  .mt-1-sm {
    margin-top: 0.5rem;
  }
  .mb-1-sm {
    margin-bottom: 0.5rem;
  }
  .ml-1-sm {
    margin-left: 0.5rem;
  }
  .mr-1-sm {
    margin-right: 0.5rem;
  }
  .ms-1-sm {
    margin-inline-start: 0.5rem;
  }
  .me-1-sm {
    margin-inline-end: 0.5rem;
  }
  .mx-1-sm {
    margin-inline: 0.5rem;
  }
  .my-1-sm {
    margin-block: 0.5rem;
  }
  .m-2-sm {
    margin: 1rem;
  }
  .mt-2-sm {
    margin-top: 1rem;
  }
  .mb-2-sm {
    margin-bottom: 1rem;
  }
  .ml-2-sm {
    margin-left: 1rem;
  }
  .mr-2-sm {
    margin-right: 1rem;
  }
  .ms-2-sm {
    margin-inline-start: 1rem;
  }
  .me-2-sm {
    margin-inline-end: 1rem;
  }
  .mx-2-sm {
    margin-inline: 1rem;
  }
  .my-2-sm {
    margin-block: 1rem;
  }
  .m-3-sm {
    margin: 1.5rem;
  }
  .mt-3-sm {
    margin-top: 1.5rem;
  }
  .mb-3-sm {
    margin-bottom: 1.5rem;
  }
  .ml-3-sm {
    margin-left: 1.5rem;
  }
  .mr-3-sm {
    margin-right: 1.5rem;
  }
  .ms-3-sm {
    margin-inline-start: 1.5rem;
  }
  .me-3-sm {
    margin-inline-end: 1.5rem;
  }
  .mx-3-sm {
    margin-inline: 1.5rem;
  }
  .my-3-sm {
    margin-block: 1.5rem;
  }
  .m-4-sm {
    margin: 2rem;
  }
  .mt-4-sm {
    margin-top: 2rem;
  }
  .mb-4-sm {
    margin-bottom: 2rem;
  }
  .ml-4-sm {
    margin-left: 2rem;
  }
  .mr-4-sm {
    margin-right: 2rem;
  }
  .ms-4-sm {
    margin-inline-start: 2rem;
  }
  .me-4-sm {
    margin-inline-end: 2rem;
  }
  .mx-4-sm {
    margin-inline: 2rem;
  }
  .my-4-sm {
    margin-block: 2rem;
  }
  .m-5-sm {
    margin: 2.5rem;
  }
  .mt-5-sm {
    margin-top: 2.5rem;
  }
  .mb-5-sm {
    margin-bottom: 2.5rem;
  }
  .ml-5-sm {
    margin-left: 2.5rem;
  }
  .mr-5-sm {
    margin-right: 2.5rem;
  }
  .ms-5-sm {
    margin-inline-start: 2.5rem;
  }
  .me-5-sm {
    margin-inline-end: 2.5rem;
  }
  .mx-5-sm {
    margin-inline: 2.5rem;
  }
  .my-5-sm {
    margin-block: 2.5rem;
  }
  .m-6-sm {
    margin: 3rem;
  }
  .mt-6-sm {
    margin-top: 3rem;
  }
  .mb-6-sm {
    margin-bottom: 3rem;
  }
  .ml-6-sm {
    margin-left: 3rem;
  }
  .mr-6-sm {
    margin-right: 3rem;
  }
  .ms-6-sm {
    margin-inline-start: 3rem;
  }
  .me-6-sm {
    margin-inline-end: 3rem;
  }
  .mx-6-sm {
    margin-inline: 3rem;
  }
  .my-6-sm {
    margin-block: 3rem;
  }
  .m-7-sm {
    margin: 4rem;
  }
  .mt-7-sm {
    margin-top: 4rem;
  }
  .mb-7-sm {
    margin-bottom: 4rem;
  }
  .ml-7-sm {
    margin-left: 4rem;
  }
  .mr-7-sm {
    margin-right: 4rem;
  }
  .ms-7-sm {
    margin-inline-start: 4rem;
  }
  .me-7-sm {
    margin-inline-end: 4rem;
  }
  .mx-7-sm {
    margin-inline: 4rem;
  }
  .my-7-sm {
    margin-block: 4rem;
  }
  .m-8-sm {
    margin: 5rem;
  }
  .mt-8-sm {
    margin-top: 5rem;
  }
  .mb-8-sm {
    margin-bottom: 5rem;
  }
  .ml-8-sm {
    margin-left: 5rem;
  }
  .mr-8-sm {
    margin-right: 5rem;
  }
  .ms-8-sm {
    margin-inline-start: 5rem;
  }
  .me-8-sm {
    margin-inline-end: 5rem;
  }
  .mx-8-sm {
    margin-inline: 5rem;
  }
  .my-8-sm {
    margin-block: 5rem;
  }
  .m-9-sm {
    margin: 6rem;
  }
  .mt-9-sm {
    margin-top: 6rem;
  }
  .mb-9-sm {
    margin-bottom: 6rem;
  }
  .ml-9-sm {
    margin-left: 6rem;
  }
  .mr-9-sm {
    margin-right: 6rem;
  }
  .ms-9-sm {
    margin-inline-start: 6rem;
  }
  .me-9-sm {
    margin-inline-end: 6rem;
  }
  .mx-9-sm {
    margin-inline: 6rem;
  }
  .my-9-sm {
    margin-block: 6rem;
  }
  .m-auto-sm {
    margin: auto;
  }
  .mt-auto-sm {
    margin-top: auto;
  }
  .mb-auto-sm {
    margin-bottom: auto;
  }
  .ml-auto-sm {
    margin-left: auto;
  }
  .mr-auto-sm {
    margin-right: auto;
  }
  .ms-auto-sm {
    margin-inline-start: auto;
  }
  .me-auto-sm {
    margin-inline-end: auto;
  }
  .mx-auto-sm {
    margin-inline: auto;
  }
  .my-auto-sm {
    margin-block: auto;
  }
}
@media (min-width: 768px) {
  .m-0-md {
    margin: 0;
  }
  .mt-0-md {
    margin-top: 0;
  }
  .mb-0-md {
    margin-bottom: 0;
  }
  .ml-0-md {
    margin-left: 0;
  }
  .mr-0-md {
    margin-right: 0;
  }
  .ms-0-md {
    margin-inline-start: 0;
  }
  .me-0-md {
    margin-inline-end: 0;
  }
  .mx-0-md {
    margin-inline: 0;
  }
  .my-0-md {
    margin-block: 0;
  }
  .m-1-md {
    margin: 0.5rem;
  }
  .mt-1-md {
    margin-top: 0.5rem;
  }
  .mb-1-md {
    margin-bottom: 0.5rem;
  }
  .ml-1-md {
    margin-left: 0.5rem;
  }
  .mr-1-md {
    margin-right: 0.5rem;
  }
  .ms-1-md {
    margin-inline-start: 0.5rem;
  }
  .me-1-md {
    margin-inline-end: 0.5rem;
  }
  .mx-1-md {
    margin-inline: 0.5rem;
  }
  .my-1-md {
    margin-block: 0.5rem;
  }
  .m-2-md {
    margin: 1rem;
  }
  .mt-2-md {
    margin-top: 1rem;
  }
  .mb-2-md {
    margin-bottom: 1rem;
  }
  .ml-2-md {
    margin-left: 1rem;
  }
  .mr-2-md {
    margin-right: 1rem;
  }
  .ms-2-md {
    margin-inline-start: 1rem;
  }
  .me-2-md {
    margin-inline-end: 1rem;
  }
  .mx-2-md {
    margin-inline: 1rem;
  }
  .my-2-md {
    margin-block: 1rem;
  }
  .m-3-md {
    margin: 1.5rem;
  }
  .mt-3-md {
    margin-top: 1.5rem;
  }
  .mb-3-md {
    margin-bottom: 1.5rem;
  }
  .ml-3-md {
    margin-left: 1.5rem;
  }
  .mr-3-md {
    margin-right: 1.5rem;
  }
  .ms-3-md {
    margin-inline-start: 1.5rem;
  }
  .me-3-md {
    margin-inline-end: 1.5rem;
  }
  .mx-3-md {
    margin-inline: 1.5rem;
  }
  .my-3-md {
    margin-block: 1.5rem;
  }
  .m-4-md {
    margin: 2rem;
  }
  .mt-4-md {
    margin-top: 2rem;
  }
  .mb-4-md {
    margin-bottom: 2rem;
  }
  .ml-4-md {
    margin-left: 2rem;
  }
  .mr-4-md {
    margin-right: 2rem;
  }
  .ms-4-md {
    margin-inline-start: 2rem;
  }
  .me-4-md {
    margin-inline-end: 2rem;
  }
  .mx-4-md {
    margin-inline: 2rem;
  }
  .my-4-md {
    margin-block: 2rem;
  }
  .m-5-md {
    margin: 2.5rem;
  }
  .mt-5-md {
    margin-top: 2.5rem;
  }
  .mb-5-md {
    margin-bottom: 2.5rem;
  }
  .ml-5-md {
    margin-left: 2.5rem;
  }
  .mr-5-md {
    margin-right: 2.5rem;
  }
  .ms-5-md {
    margin-inline-start: 2.5rem;
  }
  .me-5-md {
    margin-inline-end: 2.5rem;
  }
  .mx-5-md {
    margin-inline: 2.5rem;
  }
  .my-5-md {
    margin-block: 2.5rem;
  }
  .m-6-md {
    margin: 3rem;
  }
  .mt-6-md {
    margin-top: 3rem;
  }
  .mb-6-md {
    margin-bottom: 3rem;
  }
  .ml-6-md {
    margin-left: 3rem;
  }
  .mr-6-md {
    margin-right: 3rem;
  }
  .ms-6-md {
    margin-inline-start: 3rem;
  }
  .me-6-md {
    margin-inline-end: 3rem;
  }
  .mx-6-md {
    margin-inline: 3rem;
  }
  .my-6-md {
    margin-block: 3rem;
  }
  .m-7-md {
    margin: 4rem;
  }
  .mt-7-md {
    margin-top: 4rem;
  }
  .mb-7-md {
    margin-bottom: 4rem;
  }
  .ml-7-md {
    margin-left: 4rem;
  }
  .mr-7-md {
    margin-right: 4rem;
  }
  .ms-7-md {
    margin-inline-start: 4rem;
  }
  .me-7-md {
    margin-inline-end: 4rem;
  }
  .mx-7-md {
    margin-inline: 4rem;
  }
  .my-7-md {
    margin-block: 4rem;
  }
  .m-8-md {
    margin: 5rem;
  }
  .mt-8-md {
    margin-top: 5rem;
  }
  .mb-8-md {
    margin-bottom: 5rem;
  }
  .ml-8-md {
    margin-left: 5rem;
  }
  .mr-8-md {
    margin-right: 5rem;
  }
  .ms-8-md {
    margin-inline-start: 5rem;
  }
  .me-8-md {
    margin-inline-end: 5rem;
  }
  .mx-8-md {
    margin-inline: 5rem;
  }
  .my-8-md {
    margin-block: 5rem;
  }
  .m-9-md {
    margin: 6rem;
  }
  .mt-9-md {
    margin-top: 6rem;
  }
  .mb-9-md {
    margin-bottom: 6rem;
  }
  .ml-9-md {
    margin-left: 6rem;
  }
  .mr-9-md {
    margin-right: 6rem;
  }
  .ms-9-md {
    margin-inline-start: 6rem;
  }
  .me-9-md {
    margin-inline-end: 6rem;
  }
  .mx-9-md {
    margin-inline: 6rem;
  }
  .my-9-md {
    margin-block: 6rem;
  }
  .m-auto-md {
    margin: auto;
  }
  .mt-auto-md {
    margin-top: auto;
  }
  .mb-auto-md {
    margin-bottom: auto;
  }
  .ml-auto-md {
    margin-left: auto;
  }
  .mr-auto-md {
    margin-right: auto;
  }
  .ms-auto-md {
    margin-inline-start: auto;
  }
  .me-auto-md {
    margin-inline-end: auto;
  }
  .mx-auto-md {
    margin-inline: auto;
  }
  .my-auto-md {
    margin-block: auto;
  }
}
@media (min-width: 1024px) {
  .m-0-lg {
    margin: 0;
  }
  .mt-0-lg {
    margin-top: 0;
  }
  .mb-0-lg {
    margin-bottom: 0;
  }
  .ml-0-lg {
    margin-left: 0;
  }
  .mr-0-lg {
    margin-right: 0;
  }
  .ms-0-lg {
    margin-inline-start: 0;
  }
  .me-0-lg {
    margin-inline-end: 0;
  }
  .mx-0-lg {
    margin-inline: 0;
  }
  .my-0-lg {
    margin-block: 0;
  }
  .m-1-lg {
    margin: 0.5rem;
  }
  .mt-1-lg {
    margin-top: 0.5rem;
  }
  .mb-1-lg {
    margin-bottom: 0.5rem;
  }
  .ml-1-lg {
    margin-left: 0.5rem;
  }
  .mr-1-lg {
    margin-right: 0.5rem;
  }
  .ms-1-lg {
    margin-inline-start: 0.5rem;
  }
  .me-1-lg {
    margin-inline-end: 0.5rem;
  }
  .mx-1-lg {
    margin-inline: 0.5rem;
  }
  .my-1-lg {
    margin-block: 0.5rem;
  }
  .m-2-lg {
    margin: 1rem;
  }
  .mt-2-lg {
    margin-top: 1rem;
  }
  .mb-2-lg {
    margin-bottom: 1rem;
  }
  .ml-2-lg {
    margin-left: 1rem;
  }
  .mr-2-lg {
    margin-right: 1rem;
  }
  .ms-2-lg {
    margin-inline-start: 1rem;
  }
  .me-2-lg {
    margin-inline-end: 1rem;
  }
  .mx-2-lg {
    margin-inline: 1rem;
  }
  .my-2-lg {
    margin-block: 1rem;
  }
  .m-3-lg {
    margin: 1.5rem;
  }
  .mt-3-lg {
    margin-top: 1.5rem;
  }
  .mb-3-lg {
    margin-bottom: 1.5rem;
  }
  .ml-3-lg {
    margin-left: 1.5rem;
  }
  .mr-3-lg {
    margin-right: 1.5rem;
  }
  .ms-3-lg {
    margin-inline-start: 1.5rem;
  }
  .me-3-lg {
    margin-inline-end: 1.5rem;
  }
  .mx-3-lg {
    margin-inline: 1.5rem;
  }
  .my-3-lg {
    margin-block: 1.5rem;
  }
  .m-4-lg {
    margin: 2rem;
  }
  .mt-4-lg {
    margin-top: 2rem;
  }
  .mb-4-lg {
    margin-bottom: 2rem;
  }
  .ml-4-lg {
    margin-left: 2rem;
  }
  .mr-4-lg {
    margin-right: 2rem;
  }
  .ms-4-lg {
    margin-inline-start: 2rem;
  }
  .me-4-lg {
    margin-inline-end: 2rem;
  }
  .mx-4-lg {
    margin-inline: 2rem;
  }
  .my-4-lg {
    margin-block: 2rem;
  }
  .m-5-lg {
    margin: 2.5rem;
  }
  .mt-5-lg {
    margin-top: 2.5rem;
  }
  .mb-5-lg {
    margin-bottom: 2.5rem;
  }
  .ml-5-lg {
    margin-left: 2.5rem;
  }
  .mr-5-lg {
    margin-right: 2.5rem;
  }
  .ms-5-lg {
    margin-inline-start: 2.5rem;
  }
  .me-5-lg {
    margin-inline-end: 2.5rem;
  }
  .mx-5-lg {
    margin-inline: 2.5rem;
  }
  .my-5-lg {
    margin-block: 2.5rem;
  }
  .m-6-lg {
    margin: 3rem;
  }
  .mt-6-lg {
    margin-top: 3rem;
  }
  .mb-6-lg {
    margin-bottom: 3rem;
  }
  .ml-6-lg {
    margin-left: 3rem;
  }
  .mr-6-lg {
    margin-right: 3rem;
  }
  .ms-6-lg {
    margin-inline-start: 3rem;
  }
  .me-6-lg {
    margin-inline-end: 3rem;
  }
  .mx-6-lg {
    margin-inline: 3rem;
  }
  .my-6-lg {
    margin-block: 3rem;
  }
  .m-7-lg {
    margin: 4rem;
  }
  .mt-7-lg {
    margin-top: 4rem;
  }
  .mb-7-lg {
    margin-bottom: 4rem;
  }
  .ml-7-lg {
    margin-left: 4rem;
  }
  .mr-7-lg {
    margin-right: 4rem;
  }
  .ms-7-lg {
    margin-inline-start: 4rem;
  }
  .me-7-lg {
    margin-inline-end: 4rem;
  }
  .mx-7-lg {
    margin-inline: 4rem;
  }
  .my-7-lg {
    margin-block: 4rem;
  }
  .m-8-lg {
    margin: 5rem;
  }
  .mt-8-lg {
    margin-top: 5rem;
  }
  .mb-8-lg {
    margin-bottom: 5rem;
  }
  .ml-8-lg {
    margin-left: 5rem;
  }
  .mr-8-lg {
    margin-right: 5rem;
  }
  .ms-8-lg {
    margin-inline-start: 5rem;
  }
  .me-8-lg {
    margin-inline-end: 5rem;
  }
  .mx-8-lg {
    margin-inline: 5rem;
  }
  .my-8-lg {
    margin-block: 5rem;
  }
  .m-9-lg {
    margin: 6rem;
  }
  .mt-9-lg {
    margin-top: 6rem;
  }
  .mb-9-lg {
    margin-bottom: 6rem;
  }
  .ml-9-lg {
    margin-left: 6rem;
  }
  .mr-9-lg {
    margin-right: 6rem;
  }
  .ms-9-lg {
    margin-inline-start: 6rem;
  }
  .me-9-lg {
    margin-inline-end: 6rem;
  }
  .mx-9-lg {
    margin-inline: 6rem;
  }
  .my-9-lg {
    margin-block: 6rem;
  }
  .m-auto-lg {
    margin: auto;
  }
  .mt-auto-lg {
    margin-top: auto;
  }
  .mb-auto-lg {
    margin-bottom: auto;
  }
  .ml-auto-lg {
    margin-left: auto;
  }
  .mr-auto-lg {
    margin-right: auto;
  }
  .ms-auto-lg {
    margin-inline-start: auto;
  }
  .me-auto-lg {
    margin-inline-end: auto;
  }
  .mx-auto-lg {
    margin-inline: auto;
  }
  .my-auto-lg {
    margin-block: auto;
  }
}
@media (min-width: 1280px) {
  .m-0-xl {
    margin: 0;
  }
  .mt-0-xl {
    margin-top: 0;
  }
  .mb-0-xl {
    margin-bottom: 0;
  }
  .ml-0-xl {
    margin-left: 0;
  }
  .mr-0-xl {
    margin-right: 0;
  }
  .ms-0-xl {
    margin-inline-start: 0;
  }
  .me-0-xl {
    margin-inline-end: 0;
  }
  .mx-0-xl {
    margin-inline: 0;
  }
  .my-0-xl {
    margin-block: 0;
  }
  .m-1-xl {
    margin: 0.5rem;
  }
  .mt-1-xl {
    margin-top: 0.5rem;
  }
  .mb-1-xl {
    margin-bottom: 0.5rem;
  }
  .ml-1-xl {
    margin-left: 0.5rem;
  }
  .mr-1-xl {
    margin-right: 0.5rem;
  }
  .ms-1-xl {
    margin-inline-start: 0.5rem;
  }
  .me-1-xl {
    margin-inline-end: 0.5rem;
  }
  .mx-1-xl {
    margin-inline: 0.5rem;
  }
  .my-1-xl {
    margin-block: 0.5rem;
  }
  .m-2-xl {
    margin: 1rem;
  }
  .mt-2-xl {
    margin-top: 1rem;
  }
  .mb-2-xl {
    margin-bottom: 1rem;
  }
  .ml-2-xl {
    margin-left: 1rem;
  }
  .mr-2-xl {
    margin-right: 1rem;
  }
  .ms-2-xl {
    margin-inline-start: 1rem;
  }
  .me-2-xl {
    margin-inline-end: 1rem;
  }
  .mx-2-xl {
    margin-inline: 1rem;
  }
  .my-2-xl {
    margin-block: 1rem;
  }
  .m-3-xl {
    margin: 1.5rem;
  }
  .mt-3-xl {
    margin-top: 1.5rem;
  }
  .mb-3-xl {
    margin-bottom: 1.5rem;
  }
  .ml-3-xl {
    margin-left: 1.5rem;
  }
  .mr-3-xl {
    margin-right: 1.5rem;
  }
  .ms-3-xl {
    margin-inline-start: 1.5rem;
  }
  .me-3-xl {
    margin-inline-end: 1.5rem;
  }
  .mx-3-xl {
    margin-inline: 1.5rem;
  }
  .my-3-xl {
    margin-block: 1.5rem;
  }
  .m-4-xl {
    margin: 2rem;
  }
  .mt-4-xl {
    margin-top: 2rem;
  }
  .mb-4-xl {
    margin-bottom: 2rem;
  }
  .ml-4-xl {
    margin-left: 2rem;
  }
  .mr-4-xl {
    margin-right: 2rem;
  }
  .ms-4-xl {
    margin-inline-start: 2rem;
  }
  .me-4-xl {
    margin-inline-end: 2rem;
  }
  .mx-4-xl {
    margin-inline: 2rem;
  }
  .my-4-xl {
    margin-block: 2rem;
  }
  .m-5-xl {
    margin: 2.5rem;
  }
  .mt-5-xl {
    margin-top: 2.5rem;
  }
  .mb-5-xl {
    margin-bottom: 2.5rem;
  }
  .ml-5-xl {
    margin-left: 2.5rem;
  }
  .mr-5-xl {
    margin-right: 2.5rem;
  }
  .ms-5-xl {
    margin-inline-start: 2.5rem;
  }
  .me-5-xl {
    margin-inline-end: 2.5rem;
  }
  .mx-5-xl {
    margin-inline: 2.5rem;
  }
  .my-5-xl {
    margin-block: 2.5rem;
  }
  .m-6-xl {
    margin: 3rem;
  }
  .mt-6-xl {
    margin-top: 3rem;
  }
  .mb-6-xl {
    margin-bottom: 3rem;
  }
  .ml-6-xl {
    margin-left: 3rem;
  }
  .mr-6-xl {
    margin-right: 3rem;
  }
  .ms-6-xl {
    margin-inline-start: 3rem;
  }
  .me-6-xl {
    margin-inline-end: 3rem;
  }
  .mx-6-xl {
    margin-inline: 3rem;
  }
  .my-6-xl {
    margin-block: 3rem;
  }
  .m-7-xl {
    margin: 4rem;
  }
  .mt-7-xl {
    margin-top: 4rem;
  }
  .mb-7-xl {
    margin-bottom: 4rem;
  }
  .ml-7-xl {
    margin-left: 4rem;
  }
  .mr-7-xl {
    margin-right: 4rem;
  }
  .ms-7-xl {
    margin-inline-start: 4rem;
  }
  .me-7-xl {
    margin-inline-end: 4rem;
  }
  .mx-7-xl {
    margin-inline: 4rem;
  }
  .my-7-xl {
    margin-block: 4rem;
  }
  .m-8-xl {
    margin: 5rem;
  }
  .mt-8-xl {
    margin-top: 5rem;
  }
  .mb-8-xl {
    margin-bottom: 5rem;
  }
  .ml-8-xl {
    margin-left: 5rem;
  }
  .mr-8-xl {
    margin-right: 5rem;
  }
  .ms-8-xl {
    margin-inline-start: 5rem;
  }
  .me-8-xl {
    margin-inline-end: 5rem;
  }
  .mx-8-xl {
    margin-inline: 5rem;
  }
  .my-8-xl {
    margin-block: 5rem;
  }
  .m-9-xl {
    margin: 6rem;
  }
  .mt-9-xl {
    margin-top: 6rem;
  }
  .mb-9-xl {
    margin-bottom: 6rem;
  }
  .ml-9-xl {
    margin-left: 6rem;
  }
  .mr-9-xl {
    margin-right: 6rem;
  }
  .ms-9-xl {
    margin-inline-start: 6rem;
  }
  .me-9-xl {
    margin-inline-end: 6rem;
  }
  .mx-9-xl {
    margin-inline: 6rem;
  }
  .my-9-xl {
    margin-block: 6rem;
  }
  .m-auto-xl {
    margin: auto;
  }
  .mt-auto-xl {
    margin-top: auto;
  }
  .mb-auto-xl {
    margin-bottom: auto;
  }
  .ml-auto-xl {
    margin-left: auto;
  }
  .mr-auto-xl {
    margin-right: auto;
  }
  .ms-auto-xl {
    margin-inline-start: auto;
  }
  .me-auto-xl {
    margin-inline-end: auto;
  }
  .mx-auto-xl {
    margin-inline: auto;
  }
  .my-auto-xl {
    margin-block: auto;
  }
}
@media (min-width: 1536px) {
  .m-0-xxl {
    margin: 0;
  }
  .mt-0-xxl {
    margin-top: 0;
  }
  .mb-0-xxl {
    margin-bottom: 0;
  }
  .ml-0-xxl {
    margin-left: 0;
  }
  .mr-0-xxl {
    margin-right: 0;
  }
  .ms-0-xxl {
    margin-inline-start: 0;
  }
  .me-0-xxl {
    margin-inline-end: 0;
  }
  .mx-0-xxl {
    margin-inline: 0;
  }
  .my-0-xxl {
    margin-block: 0;
  }
  .m-1-xxl {
    margin: 0.5rem;
  }
  .mt-1-xxl {
    margin-top: 0.5rem;
  }
  .mb-1-xxl {
    margin-bottom: 0.5rem;
  }
  .ml-1-xxl {
    margin-left: 0.5rem;
  }
  .mr-1-xxl {
    margin-right: 0.5rem;
  }
  .ms-1-xxl {
    margin-inline-start: 0.5rem;
  }
  .me-1-xxl {
    margin-inline-end: 0.5rem;
  }
  .mx-1-xxl {
    margin-inline: 0.5rem;
  }
  .my-1-xxl {
    margin-block: 0.5rem;
  }
  .m-2-xxl {
    margin: 1rem;
  }
  .mt-2-xxl {
    margin-top: 1rem;
  }
  .mb-2-xxl {
    margin-bottom: 1rem;
  }
  .ml-2-xxl {
    margin-left: 1rem;
  }
  .mr-2-xxl {
    margin-right: 1rem;
  }
  .ms-2-xxl {
    margin-inline-start: 1rem;
  }
  .me-2-xxl {
    margin-inline-end: 1rem;
  }
  .mx-2-xxl {
    margin-inline: 1rem;
  }
  .my-2-xxl {
    margin-block: 1rem;
  }
  .m-3-xxl {
    margin: 1.5rem;
  }
  .mt-3-xxl {
    margin-top: 1.5rem;
  }
  .mb-3-xxl {
    margin-bottom: 1.5rem;
  }
  .ml-3-xxl {
    margin-left: 1.5rem;
  }
  .mr-3-xxl {
    margin-right: 1.5rem;
  }
  .ms-3-xxl {
    margin-inline-start: 1.5rem;
  }
  .me-3-xxl {
    margin-inline-end: 1.5rem;
  }
  .mx-3-xxl {
    margin-inline: 1.5rem;
  }
  .my-3-xxl {
    margin-block: 1.5rem;
  }
  .m-4-xxl {
    margin: 2rem;
  }
  .mt-4-xxl {
    margin-top: 2rem;
  }
  .mb-4-xxl {
    margin-bottom: 2rem;
  }
  .ml-4-xxl {
    margin-left: 2rem;
  }
  .mr-4-xxl {
    margin-right: 2rem;
  }
  .ms-4-xxl {
    margin-inline-start: 2rem;
  }
  .me-4-xxl {
    margin-inline-end: 2rem;
  }
  .mx-4-xxl {
    margin-inline: 2rem;
  }
  .my-4-xxl {
    margin-block: 2rem;
  }
  .m-5-xxl {
    margin: 2.5rem;
  }
  .mt-5-xxl {
    margin-top: 2.5rem;
  }
  .mb-5-xxl {
    margin-bottom: 2.5rem;
  }
  .ml-5-xxl {
    margin-left: 2.5rem;
  }
  .mr-5-xxl {
    margin-right: 2.5rem;
  }
  .ms-5-xxl {
    margin-inline-start: 2.5rem;
  }
  .me-5-xxl {
    margin-inline-end: 2.5rem;
  }
  .mx-5-xxl {
    margin-inline: 2.5rem;
  }
  .my-5-xxl {
    margin-block: 2.5rem;
  }
  .m-6-xxl {
    margin: 3rem;
  }
  .mt-6-xxl {
    margin-top: 3rem;
  }
  .mb-6-xxl {
    margin-bottom: 3rem;
  }
  .ml-6-xxl {
    margin-left: 3rem;
  }
  .mr-6-xxl {
    margin-right: 3rem;
  }
  .ms-6-xxl {
    margin-inline-start: 3rem;
  }
  .me-6-xxl {
    margin-inline-end: 3rem;
  }
  .mx-6-xxl {
    margin-inline: 3rem;
  }
  .my-6-xxl {
    margin-block: 3rem;
  }
  .m-7-xxl {
    margin: 4rem;
  }
  .mt-7-xxl {
    margin-top: 4rem;
  }
  .mb-7-xxl {
    margin-bottom: 4rem;
  }
  .ml-7-xxl {
    margin-left: 4rem;
  }
  .mr-7-xxl {
    margin-right: 4rem;
  }
  .ms-7-xxl {
    margin-inline-start: 4rem;
  }
  .me-7-xxl {
    margin-inline-end: 4rem;
  }
  .mx-7-xxl {
    margin-inline: 4rem;
  }
  .my-7-xxl {
    margin-block: 4rem;
  }
  .m-8-xxl {
    margin: 5rem;
  }
  .mt-8-xxl {
    margin-top: 5rem;
  }
  .mb-8-xxl {
    margin-bottom: 5rem;
  }
  .ml-8-xxl {
    margin-left: 5rem;
  }
  .mr-8-xxl {
    margin-right: 5rem;
  }
  .ms-8-xxl {
    margin-inline-start: 5rem;
  }
  .me-8-xxl {
    margin-inline-end: 5rem;
  }
  .mx-8-xxl {
    margin-inline: 5rem;
  }
  .my-8-xxl {
    margin-block: 5rem;
  }
  .m-9-xxl {
    margin: 6rem;
  }
  .mt-9-xxl {
    margin-top: 6rem;
  }
  .mb-9-xxl {
    margin-bottom: 6rem;
  }
  .ml-9-xxl {
    margin-left: 6rem;
  }
  .mr-9-xxl {
    margin-right: 6rem;
  }
  .ms-9-xxl {
    margin-inline-start: 6rem;
  }
  .me-9-xxl {
    margin-inline-end: 6rem;
  }
  .mx-9-xxl {
    margin-inline: 6rem;
  }
  .my-9-xxl {
    margin-block: 6rem;
  }
  .m-auto-xxl {
    margin: auto;
  }
  .mt-auto-xxl {
    margin-top: auto;
  }
  .mb-auto-xxl {
    margin-bottom: auto;
  }
  .ml-auto-xxl {
    margin-left: auto;
  }
  .mr-auto-xxl {
    margin-right: auto;
  }
  .ms-auto-xxl {
    margin-inline-start: auto;
  }
  .me-auto-xxl {
    margin-inline-end: auto;
  }
  .mx-auto-xxl {
    margin-inline: auto;
  }
  .my-auto-xxl {
    margin-block: auto;
  }
}
@media (min-width: 480px) {
  .p-0-xs {
    padding: 0;
  }
  .pt-0-xs {
    padding-top: 0;
  }
  .pb-0-xs {
    padding-bottom: 0;
  }
  .pl-0-xs {
    padding-left: 0;
  }
  .pr-0-xs {
    padding-right: 0;
  }
  .ps-0-xs {
    padding-inline-start: 0;
  }
  .pe-0-xs {
    padding-inline-end: 0;
  }
  .px-0-xs {
    padding-inline: 0;
  }
  .py-0-xs {
    padding-block: 0;
  }
  .p-1-xs {
    padding: 0.5rem;
  }
  .pt-1-xs {
    padding-top: 0.5rem;
  }
  .pb-1-xs {
    padding-bottom: 0.5rem;
  }
  .pl-1-xs {
    padding-left: 0.5rem;
  }
  .pr-1-xs {
    padding-right: 0.5rem;
  }
  .ps-1-xs {
    padding-inline-start: 0.5rem;
  }
  .pe-1-xs {
    padding-inline-end: 0.5rem;
  }
  .px-1-xs {
    padding-inline: 0.5rem;
  }
  .py-1-xs {
    padding-block: 0.5rem;
  }
  .p-2-xs {
    padding: 1rem;
  }
  .pt-2-xs {
    padding-top: 1rem;
  }
  .pb-2-xs {
    padding-bottom: 1rem;
  }
  .pl-2-xs {
    padding-left: 1rem;
  }
  .pr-2-xs {
    padding-right: 1rem;
  }
  .ps-2-xs {
    padding-inline-start: 1rem;
  }
  .pe-2-xs {
    padding-inline-end: 1rem;
  }
  .px-2-xs {
    padding-inline: 1rem;
  }
  .py-2-xs {
    padding-block: 1rem;
  }
  .p-3-xs {
    padding: 1.5rem;
  }
  .pt-3-xs {
    padding-top: 1.5rem;
  }
  .pb-3-xs {
    padding-bottom: 1.5rem;
  }
  .pl-3-xs {
    padding-left: 1.5rem;
  }
  .pr-3-xs {
    padding-right: 1.5rem;
  }
  .ps-3-xs {
    padding-inline-start: 1.5rem;
  }
  .pe-3-xs {
    padding-inline-end: 1.5rem;
  }
  .px-3-xs {
    padding-inline: 1.5rem;
  }
  .py-3-xs {
    padding-block: 1.5rem;
  }
  .p-4-xs {
    padding: 2rem;
  }
  .pt-4-xs {
    padding-top: 2rem;
  }
  .pb-4-xs {
    padding-bottom: 2rem;
  }
  .pl-4-xs {
    padding-left: 2rem;
  }
  .pr-4-xs {
    padding-right: 2rem;
  }
  .ps-4-xs {
    padding-inline-start: 2rem;
  }
  .pe-4-xs {
    padding-inline-end: 2rem;
  }
  .px-4-xs {
    padding-inline: 2rem;
  }
  .py-4-xs {
    padding-block: 2rem;
  }
  .p-5-xs {
    padding: 2.5rem;
  }
  .pt-5-xs {
    padding-top: 2.5rem;
  }
  .pb-5-xs {
    padding-bottom: 2.5rem;
  }
  .pl-5-xs {
    padding-left: 2.5rem;
  }
  .pr-5-xs {
    padding-right: 2.5rem;
  }
  .ps-5-xs {
    padding-inline-start: 2.5rem;
  }
  .pe-5-xs {
    padding-inline-end: 2.5rem;
  }
  .px-5-xs {
    padding-inline: 2.5rem;
  }
  .py-5-xs {
    padding-block: 2.5rem;
  }
  .p-6-xs {
    padding: 3rem;
  }
  .pt-6-xs {
    padding-top: 3rem;
  }
  .pb-6-xs {
    padding-bottom: 3rem;
  }
  .pl-6-xs {
    padding-left: 3rem;
  }
  .pr-6-xs {
    padding-right: 3rem;
  }
  .ps-6-xs {
    padding-inline-start: 3rem;
  }
  .pe-6-xs {
    padding-inline-end: 3rem;
  }
  .px-6-xs {
    padding-inline: 3rem;
  }
  .py-6-xs {
    padding-block: 3rem;
  }
  .p-7-xs {
    padding: 4rem;
  }
  .pt-7-xs {
    padding-top: 4rem;
  }
  .pb-7-xs {
    padding-bottom: 4rem;
  }
  .pl-7-xs {
    padding-left: 4rem;
  }
  .pr-7-xs {
    padding-right: 4rem;
  }
  .ps-7-xs {
    padding-inline-start: 4rem;
  }
  .pe-7-xs {
    padding-inline-end: 4rem;
  }
  .px-7-xs {
    padding-inline: 4rem;
  }
  .py-7-xs {
    padding-block: 4rem;
  }
  .p-8-xs {
    padding: 5rem;
  }
  .pt-8-xs {
    padding-top: 5rem;
  }
  .pb-8-xs {
    padding-bottom: 5rem;
  }
  .pl-8-xs {
    padding-left: 5rem;
  }
  .pr-8-xs {
    padding-right: 5rem;
  }
  .ps-8-xs {
    padding-inline-start: 5rem;
  }
  .pe-8-xs {
    padding-inline-end: 5rem;
  }
  .px-8-xs {
    padding-inline: 5rem;
  }
  .py-8-xs {
    padding-block: 5rem;
  }
  .p-9-xs {
    padding: 6rem;
  }
  .pt-9-xs {
    padding-top: 6rem;
  }
  .pb-9-xs {
    padding-bottom: 6rem;
  }
  .pl-9-xs {
    padding-left: 6rem;
  }
  .pr-9-xs {
    padding-right: 6rem;
  }
  .ps-9-xs {
    padding-inline-start: 6rem;
  }
  .pe-9-xs {
    padding-inline-end: 6rem;
  }
  .px-9-xs {
    padding-inline: 6rem;
  }
  .py-9-xs {
    padding-block: 6rem;
  }
}
@media (min-width: 640px) {
  .p-0-sm {
    padding: 0;
  }
  .pt-0-sm {
    padding-top: 0;
  }
  .pb-0-sm {
    padding-bottom: 0;
  }
  .pl-0-sm {
    padding-left: 0;
  }
  .pr-0-sm {
    padding-right: 0;
  }
  .ps-0-sm {
    padding-inline-start: 0;
  }
  .pe-0-sm {
    padding-inline-end: 0;
  }
  .px-0-sm {
    padding-inline: 0;
  }
  .py-0-sm {
    padding-block: 0;
  }
  .p-1-sm {
    padding: 0.5rem;
  }
  .pt-1-sm {
    padding-top: 0.5rem;
  }
  .pb-1-sm {
    padding-bottom: 0.5rem;
  }
  .pl-1-sm {
    padding-left: 0.5rem;
  }
  .pr-1-sm {
    padding-right: 0.5rem;
  }
  .ps-1-sm {
    padding-inline-start: 0.5rem;
  }
  .pe-1-sm {
    padding-inline-end: 0.5rem;
  }
  .px-1-sm {
    padding-inline: 0.5rem;
  }
  .py-1-sm {
    padding-block: 0.5rem;
  }
  .p-2-sm {
    padding: 1rem;
  }
  .pt-2-sm {
    padding-top: 1rem;
  }
  .pb-2-sm {
    padding-bottom: 1rem;
  }
  .pl-2-sm {
    padding-left: 1rem;
  }
  .pr-2-sm {
    padding-right: 1rem;
  }
  .ps-2-sm {
    padding-inline-start: 1rem;
  }
  .pe-2-sm {
    padding-inline-end: 1rem;
  }
  .px-2-sm {
    padding-inline: 1rem;
  }
  .py-2-sm {
    padding-block: 1rem;
  }
  .p-3-sm {
    padding: 1.5rem;
  }
  .pt-3-sm {
    padding-top: 1.5rem;
  }
  .pb-3-sm {
    padding-bottom: 1.5rem;
  }
  .pl-3-sm {
    padding-left: 1.5rem;
  }
  .pr-3-sm {
    padding-right: 1.5rem;
  }
  .ps-3-sm {
    padding-inline-start: 1.5rem;
  }
  .pe-3-sm {
    padding-inline-end: 1.5rem;
  }
  .px-3-sm {
    padding-inline: 1.5rem;
  }
  .py-3-sm {
    padding-block: 1.5rem;
  }
  .p-4-sm {
    padding: 2rem;
  }
  .pt-4-sm {
    padding-top: 2rem;
  }
  .pb-4-sm {
    padding-bottom: 2rem;
  }
  .pl-4-sm {
    padding-left: 2rem;
  }
  .pr-4-sm {
    padding-right: 2rem;
  }
  .ps-4-sm {
    padding-inline-start: 2rem;
  }
  .pe-4-sm {
    padding-inline-end: 2rem;
  }
  .px-4-sm {
    padding-inline: 2rem;
  }
  .py-4-sm {
    padding-block: 2rem;
  }
  .p-5-sm {
    padding: 2.5rem;
  }
  .pt-5-sm {
    padding-top: 2.5rem;
  }
  .pb-5-sm {
    padding-bottom: 2.5rem;
  }
  .pl-5-sm {
    padding-left: 2.5rem;
  }
  .pr-5-sm {
    padding-right: 2.5rem;
  }
  .ps-5-sm {
    padding-inline-start: 2.5rem;
  }
  .pe-5-sm {
    padding-inline-end: 2.5rem;
  }
  .px-5-sm {
    padding-inline: 2.5rem;
  }
  .py-5-sm {
    padding-block: 2.5rem;
  }
  .p-6-sm {
    padding: 3rem;
  }
  .pt-6-sm {
    padding-top: 3rem;
  }
  .pb-6-sm {
    padding-bottom: 3rem;
  }
  .pl-6-sm {
    padding-left: 3rem;
  }
  .pr-6-sm {
    padding-right: 3rem;
  }
  .ps-6-sm {
    padding-inline-start: 3rem;
  }
  .pe-6-sm {
    padding-inline-end: 3rem;
  }
  .px-6-sm {
    padding-inline: 3rem;
  }
  .py-6-sm {
    padding-block: 3rem;
  }
  .p-7-sm {
    padding: 4rem;
  }
  .pt-7-sm {
    padding-top: 4rem;
  }
  .pb-7-sm {
    padding-bottom: 4rem;
  }
  .pl-7-sm {
    padding-left: 4rem;
  }
  .pr-7-sm {
    padding-right: 4rem;
  }
  .ps-7-sm {
    padding-inline-start: 4rem;
  }
  .pe-7-sm {
    padding-inline-end: 4rem;
  }
  .px-7-sm {
    padding-inline: 4rem;
  }
  .py-7-sm {
    padding-block: 4rem;
  }
  .p-8-sm {
    padding: 5rem;
  }
  .pt-8-sm {
    padding-top: 5rem;
  }
  .pb-8-sm {
    padding-bottom: 5rem;
  }
  .pl-8-sm {
    padding-left: 5rem;
  }
  .pr-8-sm {
    padding-right: 5rem;
  }
  .ps-8-sm {
    padding-inline-start: 5rem;
  }
  .pe-8-sm {
    padding-inline-end: 5rem;
  }
  .px-8-sm {
    padding-inline: 5rem;
  }
  .py-8-sm {
    padding-block: 5rem;
  }
  .p-9-sm {
    padding: 6rem;
  }
  .pt-9-sm {
    padding-top: 6rem;
  }
  .pb-9-sm {
    padding-bottom: 6rem;
  }
  .pl-9-sm {
    padding-left: 6rem;
  }
  .pr-9-sm {
    padding-right: 6rem;
  }
  .ps-9-sm {
    padding-inline-start: 6rem;
  }
  .pe-9-sm {
    padding-inline-end: 6rem;
  }
  .px-9-sm {
    padding-inline: 6rem;
  }
  .py-9-sm {
    padding-block: 6rem;
  }
}
@media (min-width: 768px) {
  .p-0-md {
    padding: 0;
  }
  .pt-0-md {
    padding-top: 0;
  }
  .pb-0-md {
    padding-bottom: 0;
  }
  .pl-0-md {
    padding-left: 0;
  }
  .pr-0-md {
    padding-right: 0;
  }
  .ps-0-md {
    padding-inline-start: 0;
  }
  .pe-0-md {
    padding-inline-end: 0;
  }
  .px-0-md {
    padding-inline: 0;
  }
  .py-0-md {
    padding-block: 0;
  }
  .p-1-md {
    padding: 0.5rem;
  }
  .pt-1-md {
    padding-top: 0.5rem;
  }
  .pb-1-md {
    padding-bottom: 0.5rem;
  }
  .pl-1-md {
    padding-left: 0.5rem;
  }
  .pr-1-md {
    padding-right: 0.5rem;
  }
  .ps-1-md {
    padding-inline-start: 0.5rem;
  }
  .pe-1-md {
    padding-inline-end: 0.5rem;
  }
  .px-1-md {
    padding-inline: 0.5rem;
  }
  .py-1-md {
    padding-block: 0.5rem;
  }
  .p-2-md {
    padding: 1rem;
  }
  .pt-2-md {
    padding-top: 1rem;
  }
  .pb-2-md {
    padding-bottom: 1rem;
  }
  .pl-2-md {
    padding-left: 1rem;
  }
  .pr-2-md {
    padding-right: 1rem;
  }
  .ps-2-md {
    padding-inline-start: 1rem;
  }
  .pe-2-md {
    padding-inline-end: 1rem;
  }
  .px-2-md {
    padding-inline: 1rem;
  }
  .py-2-md {
    padding-block: 1rem;
  }
  .p-3-md {
    padding: 1.5rem;
  }
  .pt-3-md {
    padding-top: 1.5rem;
  }
  .pb-3-md {
    padding-bottom: 1.5rem;
  }
  .pl-3-md {
    padding-left: 1.5rem;
  }
  .pr-3-md {
    padding-right: 1.5rem;
  }
  .ps-3-md {
    padding-inline-start: 1.5rem;
  }
  .pe-3-md {
    padding-inline-end: 1.5rem;
  }
  .px-3-md {
    padding-inline: 1.5rem;
  }
  .py-3-md {
    padding-block: 1.5rem;
  }
  .p-4-md {
    padding: 2rem;
  }
  .pt-4-md {
    padding-top: 2rem;
  }
  .pb-4-md {
    padding-bottom: 2rem;
  }
  .pl-4-md {
    padding-left: 2rem;
  }
  .pr-4-md {
    padding-right: 2rem;
  }
  .ps-4-md {
    padding-inline-start: 2rem;
  }
  .pe-4-md {
    padding-inline-end: 2rem;
  }
  .px-4-md {
    padding-inline: 2rem;
  }
  .py-4-md {
    padding-block: 2rem;
  }
  .p-5-md {
    padding: 2.5rem;
  }
  .pt-5-md {
    padding-top: 2.5rem;
  }
  .pb-5-md {
    padding-bottom: 2.5rem;
  }
  .pl-5-md {
    padding-left: 2.5rem;
  }
  .pr-5-md {
    padding-right: 2.5rem;
  }
  .ps-5-md {
    padding-inline-start: 2.5rem;
  }
  .pe-5-md {
    padding-inline-end: 2.5rem;
  }
  .px-5-md {
    padding-inline: 2.5rem;
  }
  .py-5-md {
    padding-block: 2.5rem;
  }
  .p-6-md {
    padding: 3rem;
  }
  .pt-6-md {
    padding-top: 3rem;
  }
  .pb-6-md {
    padding-bottom: 3rem;
  }
  .pl-6-md {
    padding-left: 3rem;
  }
  .pr-6-md {
    padding-right: 3rem;
  }
  .ps-6-md {
    padding-inline-start: 3rem;
  }
  .pe-6-md {
    padding-inline-end: 3rem;
  }
  .px-6-md {
    padding-inline: 3rem;
  }
  .py-6-md {
    padding-block: 3rem;
  }
  .p-7-md {
    padding: 4rem;
  }
  .pt-7-md {
    padding-top: 4rem;
  }
  .pb-7-md {
    padding-bottom: 4rem;
  }
  .pl-7-md {
    padding-left: 4rem;
  }
  .pr-7-md {
    padding-right: 4rem;
  }
  .ps-7-md {
    padding-inline-start: 4rem;
  }
  .pe-7-md {
    padding-inline-end: 4rem;
  }
  .px-7-md {
    padding-inline: 4rem;
  }
  .py-7-md {
    padding-block: 4rem;
  }
  .p-8-md {
    padding: 5rem;
  }
  .pt-8-md {
    padding-top: 5rem;
  }
  .pb-8-md {
    padding-bottom: 5rem;
  }
  .pl-8-md {
    padding-left: 5rem;
  }
  .pr-8-md {
    padding-right: 5rem;
  }
  .ps-8-md {
    padding-inline-start: 5rem;
  }
  .pe-8-md {
    padding-inline-end: 5rem;
  }
  .px-8-md {
    padding-inline: 5rem;
  }
  .py-8-md {
    padding-block: 5rem;
  }
  .p-9-md {
    padding: 6rem;
  }
  .pt-9-md {
    padding-top: 6rem;
  }
  .pb-9-md {
    padding-bottom: 6rem;
  }
  .pl-9-md {
    padding-left: 6rem;
  }
  .pr-9-md {
    padding-right: 6rem;
  }
  .ps-9-md {
    padding-inline-start: 6rem;
  }
  .pe-9-md {
    padding-inline-end: 6rem;
  }
  .px-9-md {
    padding-inline: 6rem;
  }
  .py-9-md {
    padding-block: 6rem;
  }
}
@media (min-width: 1024px) {
  .p-0-lg {
    padding: 0;
  }
  .pt-0-lg {
    padding-top: 0;
  }
  .pb-0-lg {
    padding-bottom: 0;
  }
  .pl-0-lg {
    padding-left: 0;
  }
  .pr-0-lg {
    padding-right: 0;
  }
  .ps-0-lg {
    padding-inline-start: 0;
  }
  .pe-0-lg {
    padding-inline-end: 0;
  }
  .px-0-lg {
    padding-inline: 0;
  }
  .py-0-lg {
    padding-block: 0;
  }
  .p-1-lg {
    padding: 0.5rem;
  }
  .pt-1-lg {
    padding-top: 0.5rem;
  }
  .pb-1-lg {
    padding-bottom: 0.5rem;
  }
  .pl-1-lg {
    padding-left: 0.5rem;
  }
  .pr-1-lg {
    padding-right: 0.5rem;
  }
  .ps-1-lg {
    padding-inline-start: 0.5rem;
  }
  .pe-1-lg {
    padding-inline-end: 0.5rem;
  }
  .px-1-lg {
    padding-inline: 0.5rem;
  }
  .py-1-lg {
    padding-block: 0.5rem;
  }
  .p-2-lg {
    padding: 1rem;
  }
  .pt-2-lg {
    padding-top: 1rem;
  }
  .pb-2-lg {
    padding-bottom: 1rem;
  }
  .pl-2-lg {
    padding-left: 1rem;
  }
  .pr-2-lg {
    padding-right: 1rem;
  }
  .ps-2-lg {
    padding-inline-start: 1rem;
  }
  .pe-2-lg {
    padding-inline-end: 1rem;
  }
  .px-2-lg {
    padding-inline: 1rem;
  }
  .py-2-lg {
    padding-block: 1rem;
  }
  .p-3-lg {
    padding: 1.5rem;
  }
  .pt-3-lg {
    padding-top: 1.5rem;
  }
  .pb-3-lg {
    padding-bottom: 1.5rem;
  }
  .pl-3-lg {
    padding-left: 1.5rem;
  }
  .pr-3-lg {
    padding-right: 1.5rem;
  }
  .ps-3-lg {
    padding-inline-start: 1.5rem;
  }
  .pe-3-lg {
    padding-inline-end: 1.5rem;
  }
  .px-3-lg {
    padding-inline: 1.5rem;
  }
  .py-3-lg {
    padding-block: 1.5rem;
  }
  .p-4-lg {
    padding: 2rem;
  }
  .pt-4-lg {
    padding-top: 2rem;
  }
  .pb-4-lg {
    padding-bottom: 2rem;
  }
  .pl-4-lg {
    padding-left: 2rem;
  }
  .pr-4-lg {
    padding-right: 2rem;
  }
  .ps-4-lg {
    padding-inline-start: 2rem;
  }
  .pe-4-lg {
    padding-inline-end: 2rem;
  }
  .px-4-lg {
    padding-inline: 2rem;
  }
  .py-4-lg {
    padding-block: 2rem;
  }
  .p-5-lg {
    padding: 2.5rem;
  }
  .pt-5-lg {
    padding-top: 2.5rem;
  }
  .pb-5-lg {
    padding-bottom: 2.5rem;
  }
  .pl-5-lg {
    padding-left: 2.5rem;
  }
  .pr-5-lg {
    padding-right: 2.5rem;
  }
  .ps-5-lg {
    padding-inline-start: 2.5rem;
  }
  .pe-5-lg {
    padding-inline-end: 2.5rem;
  }
  .px-5-lg {
    padding-inline: 2.5rem;
  }
  .py-5-lg {
    padding-block: 2.5rem;
  }
  .p-6-lg {
    padding: 3rem;
  }
  .pt-6-lg {
    padding-top: 3rem;
  }
  .pb-6-lg {
    padding-bottom: 3rem;
  }
  .pl-6-lg {
    padding-left: 3rem;
  }
  .pr-6-lg {
    padding-right: 3rem;
  }
  .ps-6-lg {
    padding-inline-start: 3rem;
  }
  .pe-6-lg {
    padding-inline-end: 3rem;
  }
  .px-6-lg {
    padding-inline: 3rem;
  }
  .py-6-lg {
    padding-block: 3rem;
  }
  .p-7-lg {
    padding: 4rem;
  }
  .pt-7-lg {
    padding-top: 4rem;
  }
  .pb-7-lg {
    padding-bottom: 4rem;
  }
  .pl-7-lg {
    padding-left: 4rem;
  }
  .pr-7-lg {
    padding-right: 4rem;
  }
  .ps-7-lg {
    padding-inline-start: 4rem;
  }
  .pe-7-lg {
    padding-inline-end: 4rem;
  }
  .px-7-lg {
    padding-inline: 4rem;
  }
  .py-7-lg {
    padding-block: 4rem;
  }
  .p-8-lg {
    padding: 5rem;
  }
  .pt-8-lg {
    padding-top: 5rem;
  }
  .pb-8-lg {
    padding-bottom: 5rem;
  }
  .pl-8-lg {
    padding-left: 5rem;
  }
  .pr-8-lg {
    padding-right: 5rem;
  }
  .ps-8-lg {
    padding-inline-start: 5rem;
  }
  .pe-8-lg {
    padding-inline-end: 5rem;
  }
  .px-8-lg {
    padding-inline: 5rem;
  }
  .py-8-lg {
    padding-block: 5rem;
  }
  .p-9-lg {
    padding: 6rem;
  }
  .pt-9-lg {
    padding-top: 6rem;
  }
  .pb-9-lg {
    padding-bottom: 6rem;
  }
  .pl-9-lg {
    padding-left: 6rem;
  }
  .pr-9-lg {
    padding-right: 6rem;
  }
  .ps-9-lg {
    padding-inline-start: 6rem;
  }
  .pe-9-lg {
    padding-inline-end: 6rem;
  }
  .px-9-lg {
    padding-inline: 6rem;
  }
  .py-9-lg {
    padding-block: 6rem;
  }
}
@media (min-width: 1280px) {
  .p-0-xl {
    padding: 0;
  }
  .pt-0-xl {
    padding-top: 0;
  }
  .pb-0-xl {
    padding-bottom: 0;
  }
  .pl-0-xl {
    padding-left: 0;
  }
  .pr-0-xl {
    padding-right: 0;
  }
  .ps-0-xl {
    padding-inline-start: 0;
  }
  .pe-0-xl {
    padding-inline-end: 0;
  }
  .px-0-xl {
    padding-inline: 0;
  }
  .py-0-xl {
    padding-block: 0;
  }
  .p-1-xl {
    padding: 0.5rem;
  }
  .pt-1-xl {
    padding-top: 0.5rem;
  }
  .pb-1-xl {
    padding-bottom: 0.5rem;
  }
  .pl-1-xl {
    padding-left: 0.5rem;
  }
  .pr-1-xl {
    padding-right: 0.5rem;
  }
  .ps-1-xl {
    padding-inline-start: 0.5rem;
  }
  .pe-1-xl {
    padding-inline-end: 0.5rem;
  }
  .px-1-xl {
    padding-inline: 0.5rem;
  }
  .py-1-xl {
    padding-block: 0.5rem;
  }
  .p-2-xl {
    padding: 1rem;
  }
  .pt-2-xl {
    padding-top: 1rem;
  }
  .pb-2-xl {
    padding-bottom: 1rem;
  }
  .pl-2-xl {
    padding-left: 1rem;
  }
  .pr-2-xl {
    padding-right: 1rem;
  }
  .ps-2-xl {
    padding-inline-start: 1rem;
  }
  .pe-2-xl {
    padding-inline-end: 1rem;
  }
  .px-2-xl {
    padding-inline: 1rem;
  }
  .py-2-xl {
    padding-block: 1rem;
  }
  .p-3-xl {
    padding: 1.5rem;
  }
  .pt-3-xl {
    padding-top: 1.5rem;
  }
  .pb-3-xl {
    padding-bottom: 1.5rem;
  }
  .pl-3-xl {
    padding-left: 1.5rem;
  }
  .pr-3-xl {
    padding-right: 1.5rem;
  }
  .ps-3-xl {
    padding-inline-start: 1.5rem;
  }
  .pe-3-xl {
    padding-inline-end: 1.5rem;
  }
  .px-3-xl {
    padding-inline: 1.5rem;
  }
  .py-3-xl {
    padding-block: 1.5rem;
  }
  .p-4-xl {
    padding: 2rem;
  }
  .pt-4-xl {
    padding-top: 2rem;
  }
  .pb-4-xl {
    padding-bottom: 2rem;
  }
  .pl-4-xl {
    padding-left: 2rem;
  }
  .pr-4-xl {
    padding-right: 2rem;
  }
  .ps-4-xl {
    padding-inline-start: 2rem;
  }
  .pe-4-xl {
    padding-inline-end: 2rem;
  }
  .px-4-xl {
    padding-inline: 2rem;
  }
  .py-4-xl {
    padding-block: 2rem;
  }
  .p-5-xl {
    padding: 2.5rem;
  }
  .pt-5-xl {
    padding-top: 2.5rem;
  }
  .pb-5-xl {
    padding-bottom: 2.5rem;
  }
  .pl-5-xl {
    padding-left: 2.5rem;
  }
  .pr-5-xl {
    padding-right: 2.5rem;
  }
  .ps-5-xl {
    padding-inline-start: 2.5rem;
  }
  .pe-5-xl {
    padding-inline-end: 2.5rem;
  }
  .px-5-xl {
    padding-inline: 2.5rem;
  }
  .py-5-xl {
    padding-block: 2.5rem;
  }
  .p-6-xl {
    padding: 3rem;
  }
  .pt-6-xl {
    padding-top: 3rem;
  }
  .pb-6-xl {
    padding-bottom: 3rem;
  }
  .pl-6-xl {
    padding-left: 3rem;
  }
  .pr-6-xl {
    padding-right: 3rem;
  }
  .ps-6-xl {
    padding-inline-start: 3rem;
  }
  .pe-6-xl {
    padding-inline-end: 3rem;
  }
  .px-6-xl {
    padding-inline: 3rem;
  }
  .py-6-xl {
    padding-block: 3rem;
  }
  .p-7-xl {
    padding: 4rem;
  }
  .pt-7-xl {
    padding-top: 4rem;
  }
  .pb-7-xl {
    padding-bottom: 4rem;
  }
  .pl-7-xl {
    padding-left: 4rem;
  }
  .pr-7-xl {
    padding-right: 4rem;
  }
  .ps-7-xl {
    padding-inline-start: 4rem;
  }
  .pe-7-xl {
    padding-inline-end: 4rem;
  }
  .px-7-xl {
    padding-inline: 4rem;
  }
  .py-7-xl {
    padding-block: 4rem;
  }
  .p-8-xl {
    padding: 5rem;
  }
  .pt-8-xl {
    padding-top: 5rem;
  }
  .pb-8-xl {
    padding-bottom: 5rem;
  }
  .pl-8-xl {
    padding-left: 5rem;
  }
  .pr-8-xl {
    padding-right: 5rem;
  }
  .ps-8-xl {
    padding-inline-start: 5rem;
  }
  .pe-8-xl {
    padding-inline-end: 5rem;
  }
  .px-8-xl {
    padding-inline: 5rem;
  }
  .py-8-xl {
    padding-block: 5rem;
  }
  .p-9-xl {
    padding: 6rem;
  }
  .pt-9-xl {
    padding-top: 6rem;
  }
  .pb-9-xl {
    padding-bottom: 6rem;
  }
  .pl-9-xl {
    padding-left: 6rem;
  }
  .pr-9-xl {
    padding-right: 6rem;
  }
  .ps-9-xl {
    padding-inline-start: 6rem;
  }
  .pe-9-xl {
    padding-inline-end: 6rem;
  }
  .px-9-xl {
    padding-inline: 6rem;
  }
  .py-9-xl {
    padding-block: 6rem;
  }
}
@media (min-width: 1536px) {
  .p-0-xxl {
    padding: 0;
  }
  .pt-0-xxl {
    padding-top: 0;
  }
  .pb-0-xxl {
    padding-bottom: 0;
  }
  .pl-0-xxl {
    padding-left: 0;
  }
  .pr-0-xxl {
    padding-right: 0;
  }
  .ps-0-xxl {
    padding-inline-start: 0;
  }
  .pe-0-xxl {
    padding-inline-end: 0;
  }
  .px-0-xxl {
    padding-inline: 0;
  }
  .py-0-xxl {
    padding-block: 0;
  }
  .p-1-xxl {
    padding: 0.5rem;
  }
  .pt-1-xxl {
    padding-top: 0.5rem;
  }
  .pb-1-xxl {
    padding-bottom: 0.5rem;
  }
  .pl-1-xxl {
    padding-left: 0.5rem;
  }
  .pr-1-xxl {
    padding-right: 0.5rem;
  }
  .ps-1-xxl {
    padding-inline-start: 0.5rem;
  }
  .pe-1-xxl {
    padding-inline-end: 0.5rem;
  }
  .px-1-xxl {
    padding-inline: 0.5rem;
  }
  .py-1-xxl {
    padding-block: 0.5rem;
  }
  .p-2-xxl {
    padding: 1rem;
  }
  .pt-2-xxl {
    padding-top: 1rem;
  }
  .pb-2-xxl {
    padding-bottom: 1rem;
  }
  .pl-2-xxl {
    padding-left: 1rem;
  }
  .pr-2-xxl {
    padding-right: 1rem;
  }
  .ps-2-xxl {
    padding-inline-start: 1rem;
  }
  .pe-2-xxl {
    padding-inline-end: 1rem;
  }
  .px-2-xxl {
    padding-inline: 1rem;
  }
  .py-2-xxl {
    padding-block: 1rem;
  }
  .p-3-xxl {
    padding: 1.5rem;
  }
  .pt-3-xxl {
    padding-top: 1.5rem;
  }
  .pb-3-xxl {
    padding-bottom: 1.5rem;
  }
  .pl-3-xxl {
    padding-left: 1.5rem;
  }
  .pr-3-xxl {
    padding-right: 1.5rem;
  }
  .ps-3-xxl {
    padding-inline-start: 1.5rem;
  }
  .pe-3-xxl {
    padding-inline-end: 1.5rem;
  }
  .px-3-xxl {
    padding-inline: 1.5rem;
  }
  .py-3-xxl {
    padding-block: 1.5rem;
  }
  .p-4-xxl {
    padding: 2rem;
  }
  .pt-4-xxl {
    padding-top: 2rem;
  }
  .pb-4-xxl {
    padding-bottom: 2rem;
  }
  .pl-4-xxl {
    padding-left: 2rem;
  }
  .pr-4-xxl {
    padding-right: 2rem;
  }
  .ps-4-xxl {
    padding-inline-start: 2rem;
  }
  .pe-4-xxl {
    padding-inline-end: 2rem;
  }
  .px-4-xxl {
    padding-inline: 2rem;
  }
  .py-4-xxl {
    padding-block: 2rem;
  }
  .p-5-xxl {
    padding: 2.5rem;
  }
  .pt-5-xxl {
    padding-top: 2.5rem;
  }
  .pb-5-xxl {
    padding-bottom: 2.5rem;
  }
  .pl-5-xxl {
    padding-left: 2.5rem;
  }
  .pr-5-xxl {
    padding-right: 2.5rem;
  }
  .ps-5-xxl {
    padding-inline-start: 2.5rem;
  }
  .pe-5-xxl {
    padding-inline-end: 2.5rem;
  }
  .px-5-xxl {
    padding-inline: 2.5rem;
  }
  .py-5-xxl {
    padding-block: 2.5rem;
  }
  .p-6-xxl {
    padding: 3rem;
  }
  .pt-6-xxl {
    padding-top: 3rem;
  }
  .pb-6-xxl {
    padding-bottom: 3rem;
  }
  .pl-6-xxl {
    padding-left: 3rem;
  }
  .pr-6-xxl {
    padding-right: 3rem;
  }
  .ps-6-xxl {
    padding-inline-start: 3rem;
  }
  .pe-6-xxl {
    padding-inline-end: 3rem;
  }
  .px-6-xxl {
    padding-inline: 3rem;
  }
  .py-6-xxl {
    padding-block: 3rem;
  }
  .p-7-xxl {
    padding: 4rem;
  }
  .pt-7-xxl {
    padding-top: 4rem;
  }
  .pb-7-xxl {
    padding-bottom: 4rem;
  }
  .pl-7-xxl {
    padding-left: 4rem;
  }
  .pr-7-xxl {
    padding-right: 4rem;
  }
  .ps-7-xxl {
    padding-inline-start: 4rem;
  }
  .pe-7-xxl {
    padding-inline-end: 4rem;
  }
  .px-7-xxl {
    padding-inline: 4rem;
  }
  .py-7-xxl {
    padding-block: 4rem;
  }
  .p-8-xxl {
    padding: 5rem;
  }
  .pt-8-xxl {
    padding-top: 5rem;
  }
  .pb-8-xxl {
    padding-bottom: 5rem;
  }
  .pl-8-xxl {
    padding-left: 5rem;
  }
  .pr-8-xxl {
    padding-right: 5rem;
  }
  .ps-8-xxl {
    padding-inline-start: 5rem;
  }
  .pe-8-xxl {
    padding-inline-end: 5rem;
  }
  .px-8-xxl {
    padding-inline: 5rem;
  }
  .py-8-xxl {
    padding-block: 5rem;
  }
  .p-9-xxl {
    padding: 6rem;
  }
  .pt-9-xxl {
    padding-top: 6rem;
  }
  .pb-9-xxl {
    padding-bottom: 6rem;
  }
  .pl-9-xxl {
    padding-left: 6rem;
  }
  .pr-9-xxl {
    padding-right: 6rem;
  }
  .ps-9-xxl {
    padding-inline-start: 6rem;
  }
  .pe-9-xxl {
    padding-inline-end: 6rem;
  }
  .px-9-xxl {
    padding-inline: 6rem;
  }
  .py-9-xxl {
    padding-block: 6rem;
  }
}
@media (min-width: 480px) {
  .gap-0-xs {
    gap: 0;
  }
  .gap-1-xs {
    gap: 0.5rem;
  }
  .gap-2-xs {
    gap: 1rem;
  }
  .gap-3-xs {
    gap: 1.5rem;
  }
  .gap-4-xs {
    gap: 2rem;
  }
  .gap-5-xs {
    gap: 2.5rem;
  }
  .gap-6-xs {
    gap: 3rem;
  }
  .gap-7-xs {
    gap: 4rem;
  }
  .gap-8-xs {
    gap: 5rem;
  }
  .gap-9-xs {
    gap: 6rem;
  }
}
@media (min-width: 640px) {
  .gap-0-sm {
    gap: 0;
  }
  .gap-1-sm {
    gap: 0.5rem;
  }
  .gap-2-sm {
    gap: 1rem;
  }
  .gap-3-sm {
    gap: 1.5rem;
  }
  .gap-4-sm {
    gap: 2rem;
  }
  .gap-5-sm {
    gap: 2.5rem;
  }
  .gap-6-sm {
    gap: 3rem;
  }
  .gap-7-sm {
    gap: 4rem;
  }
  .gap-8-sm {
    gap: 5rem;
  }
  .gap-9-sm {
    gap: 6rem;
  }
}
@media (min-width: 768px) {
  .gap-0-md {
    gap: 0;
  }
  .gap-1-md {
    gap: 0.5rem;
  }
  .gap-2-md {
    gap: 1rem;
  }
  .gap-3-md {
    gap: 1.5rem;
  }
  .gap-4-md {
    gap: 2rem;
  }
  .gap-5-md {
    gap: 2.5rem;
  }
  .gap-6-md {
    gap: 3rem;
  }
  .gap-7-md {
    gap: 4rem;
  }
  .gap-8-md {
    gap: 5rem;
  }
  .gap-9-md {
    gap: 6rem;
  }
}
@media (min-width: 1024px) {
  .gap-0-lg {
    gap: 0;
  }
  .gap-1-lg {
    gap: 0.5rem;
  }
  .gap-2-lg {
    gap: 1rem;
  }
  .gap-3-lg {
    gap: 1.5rem;
  }
  .gap-4-lg {
    gap: 2rem;
  }
  .gap-5-lg {
    gap: 2.5rem;
  }
  .gap-6-lg {
    gap: 3rem;
  }
  .gap-7-lg {
    gap: 4rem;
  }
  .gap-8-lg {
    gap: 5rem;
  }
  .gap-9-lg {
    gap: 6rem;
  }
}
@media (min-width: 1280px) {
  .gap-0-xl {
    gap: 0;
  }
  .gap-1-xl {
    gap: 0.5rem;
  }
  .gap-2-xl {
    gap: 1rem;
  }
  .gap-3-xl {
    gap: 1.5rem;
  }
  .gap-4-xl {
    gap: 2rem;
  }
  .gap-5-xl {
    gap: 2.5rem;
  }
  .gap-6-xl {
    gap: 3rem;
  }
  .gap-7-xl {
    gap: 4rem;
  }
  .gap-8-xl {
    gap: 5rem;
  }
  .gap-9-xl {
    gap: 6rem;
  }
}
@media (min-width: 1536px) {
  .gap-0-xxl {
    gap: 0;
  }
  .gap-1-xxl {
    gap: 0.5rem;
  }
  .gap-2-xxl {
    gap: 1rem;
  }
  .gap-3-xxl {
    gap: 1.5rem;
  }
  .gap-4-xxl {
    gap: 2rem;
  }
  .gap-5-xxl {
    gap: 2.5rem;
  }
  .gap-6-xxl {
    gap: 3rem;
  }
  .gap-7-xxl {
    gap: 4rem;
  }
  .gap-8-xxl {
    gap: 5rem;
  }
  .gap-9-xxl {
    gap: 6rem;
  }
}
.text-start {
  text-align: start;
}

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

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

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

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

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

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

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

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

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

.text-italic {
  font-style: italic;
}

.text-normal {
  font-style: normal;
}

.lh-default {
  line-height: var(--line-height);
}

.lh-1 {
  line-height: var(--line-height-xs);
}

.lh-2 {
  line-height: var(--line-height-sm);
}

.lh-3 {
  line-height: var(--line-height-md);
}

.lh-4 {
  line-height: var(--line-height-lg);
}

.lh-5 {
  line-height: var(--line-height-xl);
}

.lh-6 {
  line-height: var(--line-height-xxl);
}

.lh-inherit {
  line-height: inherit;
}

.lh-initial {
  line-height: initial;
}

.ls-default {
  letter-spacing: var(--letter-spacing);
}

.ls-1 {
  letter-spacing: var(--letter-spacing-xs);
}

.ls-2 {
  letter-spacing: var(--letter-spacing-sm);
}

.ls-3 {
  letter-spacing: var(--letter-spacing-md);
}

.ls-4 {
  letter-spacing: var(--letter-spacing-lg);
}

.ls-5 {
  letter-spacing: var(--letter-spacing-xl);
}

.ls-6 {
  letter-spacing: var(--letter-spacing-xxl);
}

.ls-inherit {
  letter-spacing: inherit;
}

.ls-initial {
  letter-spacing: initial;
}

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

.text-wrap {
  white-space: normal;
}

.text-truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 100%;
}

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

.text-underline {
  text-decoration: underline;
}

.text-line-through {
  text-decoration: line-through;
}

.text-no-decoration {
  text-decoration: none;
}

.text-serif {
  font-family: serif;
}

.text-sans-serif {
  font-family: sans-serif;
}

.text-mono {
  font-family: monospace;
}

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

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

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

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

.text-on-primary {
  color: var(--content-on-primary);
}

.text-hover-primary:hover {
  color: var(--color-primary);
}

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

.text-on-secondary {
  color: var(--content-on-secondary);
}

.text-hover-secondary:hover {
  color: var(--color-secondary);
}

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

.text-on-tertiary {
  color: var(--content-on-tertiary);
}

.text-hover-tertiary:hover {
  color: var(--color-tertiary);
}

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

.text-on-success {
  color: var(--content-on-success);
}

.text-hover-success:hover {
  color: var(--color-success);
}

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

.text-on-info {
  color: var(--content-on-info);
}

.text-hover-info:hover {
  color: var(--color-info);
}

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

.text-on-warning {
  color: var(--content-on-warning);
}

.text-hover-warning:hover {
  color: var(--color-warning);
}

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

.text-on-danger {
  color: var(--content-on-danger);
}

.text-hover-danger:hover {
  color: var(--color-danger);
}

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

.text-on-neutral {
  color: var(--content-on-neutral);
}

.text-hover-neutral:hover {
  color: var(--color-neutral);
}

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

.text-on-light {
  color: var(--content-on-light);
}

.text-hover-light:hover {
  color: var(--color-light);
}

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

.text-on-dark {
  color: var(--content-on-dark);
}

.text-hover-dark:hover {
  color: var(--color-dark);
}

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

.text-on-white {
  color: var(--content-on-white);
}

.text-hover-white:hover {
  color: var(--color-white);
}

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

.text-on-black {
  color: var(--content-on-black);
}

.text-hover-black:hover {
  color: var(--color-black);
}

.text-primary-ghost {
  color: var(--color-primary-ghost);
}

.text-on-primary-ghost {
  color: var(--content-on-primary-ghost);
}

.text-hover-primary-ghost:hover {
  color: var(--color-primary-ghost);
}

.text-secondary-ghost {
  color: var(--color-secondary-ghost);
}

.text-on-secondary-ghost {
  color: var(--content-on-secondary-ghost);
}

.text-hover-secondary-ghost:hover {
  color: var(--color-secondary-ghost);
}

.text-tertiary-ghost {
  color: var(--color-tertiary-ghost);
}

.text-on-tertiary-ghost {
  color: var(--content-on-tertiary-ghost);
}

.text-hover-tertiary-ghost:hover {
  color: var(--color-tertiary-ghost);
}

.text-success-ghost {
  color: var(--color-success-ghost);
}

.text-on-success-ghost {
  color: var(--content-on-success-ghost);
}

.text-hover-success-ghost:hover {
  color: var(--color-success-ghost);
}

.text-info-ghost {
  color: var(--color-info-ghost);
}

.text-on-info-ghost {
  color: var(--content-on-info-ghost);
}

.text-hover-info-ghost:hover {
  color: var(--color-info-ghost);
}

.text-warning-ghost {
  color: var(--color-warning-ghost);
}

.text-on-warning-ghost {
  color: var(--content-on-warning-ghost);
}

.text-hover-warning-ghost:hover {
  color: var(--color-warning-ghost);
}

.text-danger-ghost {
  color: var(--color-danger-ghost);
}

.text-on-danger-ghost {
  color: var(--content-on-danger-ghost);
}

.text-hover-danger-ghost:hover {
  color: var(--color-danger-ghost);
}

.text-neutral-ghost {
  color: var(--color-neutral-ghost);
}

.text-on-neutral-ghost {
  color: var(--content-on-neutral-ghost);
}

.text-hover-neutral-ghost:hover {
  color: var(--color-neutral-ghost);
}

.text-light-ghost {
  color: var(--color-light-ghost);
}

.text-on-light-ghost {
  color: var(--content-on-light-ghost);
}

.text-hover-light-ghost:hover {
  color: var(--color-light-ghost);
}

.text-dark-ghost {
  color: var(--color-dark-ghost);
}

.text-on-dark-ghost {
  color: var(--content-on-dark-ghost);
}

.text-hover-dark-ghost:hover {
  color: var(--color-dark-ghost);
}

.text-white-ghost {
  color: var(--color-white-ghost);
}

.text-on-white-ghost {
  color: var(--content-on-white-ghost);
}

.text-hover-white-ghost:hover {
  color: var(--color-white-ghost);
}

.text-black-ghost {
  color: var(--color-black-ghost);
}

.text-on-black-ghost {
  color: var(--content-on-black-ghost);
}

.text-hover-black-ghost:hover {
  color: var(--color-black-ghost);
}

@media (min-width: 480px) {
  .text-start-xs {
    text-align: start;
  }
  .text-left-xs {
    text-align: left;
  }
  .text-center-xs {
    text-align: center;
  }
  .text-end-xs {
    text-align: end;
  }
  .text-right-xs {
    text-align: right;
  }
  .text-justify-xs {
    text-align: justify;
  }
  .lh-default-xs {
    line-height: var(--line-height);
  }
  .lh-1-xs {
    line-height: var(--line-height-xs);
  }
  .lh-2-xs {
    line-height: var(--line-height-sm);
  }
  .lh-3-xs {
    line-height: var(--line-height-md);
  }
  .lh-4-xs {
    line-height: var(--line-height-lg);
  }
  .lh-5-xs {
    line-height: var(--line-height-xl);
  }
  .lh-6-xs {
    line-height: var(--line-height-xxl);
  }
  .lh-inherit-xs {
    line-height: inherit;
  }
  .lh-initial-xs {
    line-height: initial;
  }
  .ls-default-xs {
    letter-spacing: var(--letter-spacing);
  }
  .ls-1-xs {
    letter-spacing: var(--letter-spacing-xs);
  }
  .ls-2-xs {
    letter-spacing: var(--letter-spacing-sm);
  }
  .ls-3-xs {
    letter-spacing: var(--letter-spacing-md);
  }
  .ls-4-xs {
    letter-spacing: var(--letter-spacing-lg);
  }
  .ls-5-xs {
    letter-spacing: var(--letter-spacing-xl);
  }
  .ls-6-xs {
    letter-spacing: var(--letter-spacing-xxl);
  }
  .ls-inherit-xs {
    letter-spacing: inherit;
  }
  .ls-initial-xs {
    letter-spacing: initial;
  }
  .text-nowrap-xs {
    white-space: nowrap;
  }
  .text-wrap-xs {
    white-space: normal;
  }
  .text-truncate-xs {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
  }
  .text-break-xs {
    word-wrap: break-word;
    overflow-wrap: break-word;
  }
}
@media (min-width: 640px) {
  .text-start-sm {
    text-align: start;
  }
  .text-left-sm {
    text-align: left;
  }
  .text-center-sm {
    text-align: center;
  }
  .text-end-sm {
    text-align: end;
  }
  .text-right-sm {
    text-align: right;
  }
  .text-justify-sm {
    text-align: justify;
  }
  .lh-default-sm {
    line-height: var(--line-height);
  }
  .lh-1-sm {
    line-height: var(--line-height-xs);
  }
  .lh-2-sm {
    line-height: var(--line-height-sm);
  }
  .lh-3-sm {
    line-height: var(--line-height-md);
  }
  .lh-4-sm {
    line-height: var(--line-height-lg);
  }
  .lh-5-sm {
    line-height: var(--line-height-xl);
  }
  .lh-6-sm {
    line-height: var(--line-height-xxl);
  }
  .lh-inherit-sm {
    line-height: inherit;
  }
  .lh-initial-sm {
    line-height: initial;
  }
  .ls-default-sm {
    letter-spacing: var(--letter-spacing);
  }
  .ls-1-sm {
    letter-spacing: var(--letter-spacing-xs);
  }
  .ls-2-sm {
    letter-spacing: var(--letter-spacing-sm);
  }
  .ls-3-sm {
    letter-spacing: var(--letter-spacing-md);
  }
  .ls-4-sm {
    letter-spacing: var(--letter-spacing-lg);
  }
  .ls-5-sm {
    letter-spacing: var(--letter-spacing-xl);
  }
  .ls-6-sm {
    letter-spacing: var(--letter-spacing-xxl);
  }
  .ls-inherit-sm {
    letter-spacing: inherit;
  }
  .ls-initial-sm {
    letter-spacing: initial;
  }
  .text-nowrap-sm {
    white-space: nowrap;
  }
  .text-wrap-sm {
    white-space: normal;
  }
  .text-truncate-sm {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
  }
  .text-break-sm {
    word-wrap: break-word;
    overflow-wrap: break-word;
  }
}
@media (min-width: 768px) {
  .text-start-md {
    text-align: start;
  }
  .text-left-md {
    text-align: left;
  }
  .text-center-md {
    text-align: center;
  }
  .text-end-md {
    text-align: end;
  }
  .text-right-md {
    text-align: right;
  }
  .text-justify-md {
    text-align: justify;
  }
  .lh-default-md {
    line-height: var(--line-height);
  }
  .lh-1-md {
    line-height: var(--line-height-xs);
  }
  .lh-2-md {
    line-height: var(--line-height-sm);
  }
  .lh-3-md {
    line-height: var(--line-height-md);
  }
  .lh-4-md {
    line-height: var(--line-height-lg);
  }
  .lh-5-md {
    line-height: var(--line-height-xl);
  }
  .lh-6-md {
    line-height: var(--line-height-xxl);
  }
  .lh-inherit-md {
    line-height: inherit;
  }
  .lh-initial-md {
    line-height: initial;
  }
  .ls-default-md {
    letter-spacing: var(--letter-spacing);
  }
  .ls-1-md {
    letter-spacing: var(--letter-spacing-xs);
  }
  .ls-2-md {
    letter-spacing: var(--letter-spacing-sm);
  }
  .ls-3-md {
    letter-spacing: var(--letter-spacing-md);
  }
  .ls-4-md {
    letter-spacing: var(--letter-spacing-lg);
  }
  .ls-5-md {
    letter-spacing: var(--letter-spacing-xl);
  }
  .ls-6-md {
    letter-spacing: var(--letter-spacing-xxl);
  }
  .ls-inherit-md {
    letter-spacing: inherit;
  }
  .ls-initial-md {
    letter-spacing: initial;
  }
  .text-nowrap-md {
    white-space: nowrap;
  }
  .text-wrap-md {
    white-space: normal;
  }
  .text-truncate-md {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
  }
  .text-break-md {
    word-wrap: break-word;
    overflow-wrap: break-word;
  }
}
@media (min-width: 1024px) {
  .text-start-lg {
    text-align: start;
  }
  .text-left-lg {
    text-align: left;
  }
  .text-center-lg {
    text-align: center;
  }
  .text-end-lg {
    text-align: end;
  }
  .text-right-lg {
    text-align: right;
  }
  .text-justify-lg {
    text-align: justify;
  }
  .lh-default-lg {
    line-height: var(--line-height);
  }
  .lh-1-lg {
    line-height: var(--line-height-xs);
  }
  .lh-2-lg {
    line-height: var(--line-height-sm);
  }
  .lh-3-lg {
    line-height: var(--line-height-md);
  }
  .lh-4-lg {
    line-height: var(--line-height-lg);
  }
  .lh-5-lg {
    line-height: var(--line-height-xl);
  }
  .lh-6-lg {
    line-height: var(--line-height-xxl);
  }
  .lh-inherit-lg {
    line-height: inherit;
  }
  .lh-initial-lg {
    line-height: initial;
  }
  .ls-default-lg {
    letter-spacing: var(--letter-spacing);
  }
  .ls-1-lg {
    letter-spacing: var(--letter-spacing-xs);
  }
  .ls-2-lg {
    letter-spacing: var(--letter-spacing-sm);
  }
  .ls-3-lg {
    letter-spacing: var(--letter-spacing-md);
  }
  .ls-4-lg {
    letter-spacing: var(--letter-spacing-lg);
  }
  .ls-5-lg {
    letter-spacing: var(--letter-spacing-xl);
  }
  .ls-6-lg {
    letter-spacing: var(--letter-spacing-xxl);
  }
  .ls-inherit-lg {
    letter-spacing: inherit;
  }
  .ls-initial-lg {
    letter-spacing: initial;
  }
  .text-nowrap-lg {
    white-space: nowrap;
  }
  .text-wrap-lg {
    white-space: normal;
  }
  .text-truncate-lg {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
  }
  .text-break-lg {
    word-wrap: break-word;
    overflow-wrap: break-word;
  }
}
@media (min-width: 1280px) {
  .text-start-xl {
    text-align: start;
  }
  .text-left-xl {
    text-align: left;
  }
  .text-center-xl {
    text-align: center;
  }
  .text-end-xl {
    text-align: end;
  }
  .text-right-xl {
    text-align: right;
  }
  .text-justify-xl {
    text-align: justify;
  }
  .lh-default-xl {
    line-height: var(--line-height);
  }
  .lh-1-xl {
    line-height: var(--line-height-xs);
  }
  .lh-2-xl {
    line-height: var(--line-height-sm);
  }
  .lh-3-xl {
    line-height: var(--line-height-md);
  }
  .lh-4-xl {
    line-height: var(--line-height-lg);
  }
  .lh-5-xl {
    line-height: var(--line-height-xl);
  }
  .lh-6-xl {
    line-height: var(--line-height-xxl);
  }
  .lh-inherit-xl {
    line-height: inherit;
  }
  .lh-initial-xl {
    line-height: initial;
  }
  .ls-default-xl {
    letter-spacing: var(--letter-spacing);
  }
  .ls-1-xl {
    letter-spacing: var(--letter-spacing-xs);
  }
  .ls-2-xl {
    letter-spacing: var(--letter-spacing-sm);
  }
  .ls-3-xl {
    letter-spacing: var(--letter-spacing-md);
  }
  .ls-4-xl {
    letter-spacing: var(--letter-spacing-lg);
  }
  .ls-5-xl {
    letter-spacing: var(--letter-spacing-xl);
  }
  .ls-6-xl {
    letter-spacing: var(--letter-spacing-xxl);
  }
  .ls-inherit-xl {
    letter-spacing: inherit;
  }
  .ls-initial-xl {
    letter-spacing: initial;
  }
  .text-nowrap-xl {
    white-space: nowrap;
  }
  .text-wrap-xl {
    white-space: normal;
  }
  .text-truncate-xl {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
  }
  .text-break-xl {
    word-wrap: break-word;
    overflow-wrap: break-word;
  }
}
@media (min-width: 1536px) {
  .text-start-xxl {
    text-align: start;
  }
  .text-left-xxl {
    text-align: left;
  }
  .text-center-xxl {
    text-align: center;
  }
  .text-end-xxl {
    text-align: end;
  }
  .text-right-xxl {
    text-align: right;
  }
  .text-justify-xxl {
    text-align: justify;
  }
  .lh-default-xxl {
    line-height: var(--line-height);
  }
  .lh-1-xxl {
    line-height: var(--line-height-xs);
  }
  .lh-2-xxl {
    line-height: var(--line-height-sm);
  }
  .lh-3-xxl {
    line-height: var(--line-height-md);
  }
  .lh-4-xxl {
    line-height: var(--line-height-lg);
  }
  .lh-5-xxl {
    line-height: var(--line-height-xl);
  }
  .lh-6-xxl {
    line-height: var(--line-height-xxl);
  }
  .lh-inherit-xxl {
    line-height: inherit;
  }
  .lh-initial-xxl {
    line-height: initial;
  }
  .ls-default-xxl {
    letter-spacing: var(--letter-spacing);
  }
  .ls-1-xxl {
    letter-spacing: var(--letter-spacing-xs);
  }
  .ls-2-xxl {
    letter-spacing: var(--letter-spacing-sm);
  }
  .ls-3-xxl {
    letter-spacing: var(--letter-spacing-md);
  }
  .ls-4-xxl {
    letter-spacing: var(--letter-spacing-lg);
  }
  .ls-5-xxl {
    letter-spacing: var(--letter-spacing-xl);
  }
  .ls-6-xxl {
    letter-spacing: var(--letter-spacing-xxl);
  }
  .ls-inherit-xxl {
    letter-spacing: inherit;
  }
  .ls-initial-xxl {
    letter-spacing: initial;
  }
  .text-nowrap-xxl {
    white-space: nowrap;
  }
  .text-wrap-xxl {
    white-space: normal;
  }
  .text-truncate-xxl {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
  }
  .text-break-xxl {
    word-wrap: break-word;
    overflow-wrap: break-word;
  }
}
.visible {
  visibility: visible;
}

.hidden {
  visibility: hidden;
}

.opacity-0 {
  opacity: 0;
}

.opacity-1 {
  opacity: 0.1;
}

.opacity-2 {
  opacity: 0.2;
}

.opacity-3 {
  opacity: 0.3;
}

.opacity-4 {
  opacity: 0.4;
}

.opacity-5 {
  opacity: 0.5;
}

.opacity-6 {
  opacity: 0.6;
}

.opacity-7 {
  opacity: 0.7;
}

.opacity-8 {
  opacity: 0.8;
}

.opacity-9 {
  opacity: 0.9;
}

.opacity-10 {
  opacity: 1;
}

@media (min-width: 480px) {
  .visible-xs {
    visibility: visible;
  }
  .hidden-xs {
    visibility: hidden;
  }
  .opacity-0-xs {
    opacity: 0;
  }
  .opacity-1-xs {
    opacity: 0.1;
  }
  .opacity-2-xs {
    opacity: 0.2;
  }
  .opacity-3-xs {
    opacity: 0.3;
  }
  .opacity-4-xs {
    opacity: 0.4;
  }
  .opacity-5-xs {
    opacity: 0.5;
  }
  .opacity-6-xs {
    opacity: 0.6;
  }
  .opacity-7-xs {
    opacity: 0.7;
  }
  .opacity-8-xs {
    opacity: 0.8;
  }
  .opacity-9-xs {
    opacity: 0.9;
  }
  .opacity-10-xs {
    opacity: 1;
  }
}
@media (min-width: 640px) {
  .visible-sm {
    visibility: visible;
  }
  .hidden-sm {
    visibility: hidden;
  }
  .opacity-0-sm {
    opacity: 0;
  }
  .opacity-1-sm {
    opacity: 0.1;
  }
  .opacity-2-sm {
    opacity: 0.2;
  }
  .opacity-3-sm {
    opacity: 0.3;
  }
  .opacity-4-sm {
    opacity: 0.4;
  }
  .opacity-5-sm {
    opacity: 0.5;
  }
  .opacity-6-sm {
    opacity: 0.6;
  }
  .opacity-7-sm {
    opacity: 0.7;
  }
  .opacity-8-sm {
    opacity: 0.8;
  }
  .opacity-9-sm {
    opacity: 0.9;
  }
  .opacity-10-sm {
    opacity: 1;
  }
}
@media (min-width: 768px) {
  .visible-md {
    visibility: visible;
  }
  .hidden-md {
    visibility: hidden;
  }
  .opacity-0-md {
    opacity: 0;
  }
  .opacity-1-md {
    opacity: 0.1;
  }
  .opacity-2-md {
    opacity: 0.2;
  }
  .opacity-3-md {
    opacity: 0.3;
  }
  .opacity-4-md {
    opacity: 0.4;
  }
  .opacity-5-md {
    opacity: 0.5;
  }
  .opacity-6-md {
    opacity: 0.6;
  }
  .opacity-7-md {
    opacity: 0.7;
  }
  .opacity-8-md {
    opacity: 0.8;
  }
  .opacity-9-md {
    opacity: 0.9;
  }
  .opacity-10-md {
    opacity: 1;
  }
}
@media (min-width: 1024px) {
  .visible-lg {
    visibility: visible;
  }
  .hidden-lg {
    visibility: hidden;
  }
  .opacity-0-lg {
    opacity: 0;
  }
  .opacity-1-lg {
    opacity: 0.1;
  }
  .opacity-2-lg {
    opacity: 0.2;
  }
  .opacity-3-lg {
    opacity: 0.3;
  }
  .opacity-4-lg {
    opacity: 0.4;
  }
  .opacity-5-lg {
    opacity: 0.5;
  }
  .opacity-6-lg {
    opacity: 0.6;
  }
  .opacity-7-lg {
    opacity: 0.7;
  }
  .opacity-8-lg {
    opacity: 0.8;
  }
  .opacity-9-lg {
    opacity: 0.9;
  }
  .opacity-10-lg {
    opacity: 1;
  }
}
@media (min-width: 1280px) {
  .visible-xl {
    visibility: visible;
  }
  .hidden-xl {
    visibility: hidden;
  }
  .opacity-0-xl {
    opacity: 0;
  }
  .opacity-1-xl {
    opacity: 0.1;
  }
  .opacity-2-xl {
    opacity: 0.2;
  }
  .opacity-3-xl {
    opacity: 0.3;
  }
  .opacity-4-xl {
    opacity: 0.4;
  }
  .opacity-5-xl {
    opacity: 0.5;
  }
  .opacity-6-xl {
    opacity: 0.6;
  }
  .opacity-7-xl {
    opacity: 0.7;
  }
  .opacity-8-xl {
    opacity: 0.8;
  }
  .opacity-9-xl {
    opacity: 0.9;
  }
  .opacity-10-xl {
    opacity: 1;
  }
}
@media (min-width: 1536px) {
  .visible-xxl {
    visibility: visible;
  }
  .hidden-xxl {
    visibility: hidden;
  }
  .opacity-0-xxl {
    opacity: 0;
  }
  .opacity-1-xxl {
    opacity: 0.1;
  }
  .opacity-2-xxl {
    opacity: 0.2;
  }
  .opacity-3-xxl {
    opacity: 0.3;
  }
  .opacity-4-xxl {
    opacity: 0.4;
  }
  .opacity-5-xxl {
    opacity: 0.5;
  }
  .opacity-6-xxl {
    opacity: 0.6;
  }
  .opacity-7-xxl {
    opacity: 0.7;
  }
  .opacity-8-xxl {
    opacity: 0.8;
  }
  .opacity-9-xxl {
    opacity: 0.9;
  }
  .opacity-10-xxl {
    opacity: 1;
  }
}