blob: c729b25d3d9e24118e27b07a42bde29b970fb376 [file] [log] [blame] [edit]
@charset "UTF-8";
/*!
* Bootstrap v6.0.0-dev (https://getbootstrap.com/)
* Copyright 2011-2026 The Bootstrap Authors
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
*/
:root {
--bs-blue-025: color-mix(in lab, var(--bs-white) 94%, oklch(60% 0.24 240deg));
--bs-blue-050: color-mix(in lab, var(--bs-white) 90%, oklch(60% 0.24 240deg));
--bs-blue-100: color-mix(in lab, var(--bs-white) 80%, oklch(60% 0.24 240deg));
--bs-blue-200: color-mix(in lab, var(--bs-white) 60%, oklch(60% 0.24 240deg));
--bs-blue-300: color-mix(in lab, var(--bs-white) 40%, oklch(60% 0.24 240deg));
--bs-blue-400: color-mix(in lab, var(--bs-white) 20%, oklch(60% 0.24 240deg));
--bs-blue-500: oklch(60% 0.24 240deg);
--bs-blue-600: color-mix(in lab, var(--bs-black) 16%, oklch(60% 0.24 240deg));
--bs-blue-700: color-mix(in lab, var(--bs-black) 32%, oklch(60% 0.24 240deg));
--bs-blue-800: color-mix(in lab, var(--bs-black) 48%, oklch(60% 0.24 240deg));
--bs-blue-900: color-mix(in lab, var(--bs-black) 64%, oklch(60% 0.24 240deg));
--bs-blue-950: color-mix(in lab, var(--bs-black) 76%, oklch(60% 0.24 240deg));
--bs-blue-975: color-mix(in lab, var(--bs-black) 88%, oklch(60% 0.24 240deg));
--bs-indigo-025: color-mix(in lab, var(--bs-white) 94%, oklch(56% 0.26 288deg));
--bs-indigo-050: color-mix(in lab, var(--bs-white) 90%, oklch(56% 0.26 288deg));
--bs-indigo-100: color-mix(in lab, var(--bs-white) 80%, oklch(56% 0.26 288deg));
--bs-indigo-200: color-mix(in lab, var(--bs-white) 60%, oklch(56% 0.26 288deg));
--bs-indigo-300: color-mix(in lab, var(--bs-white) 40%, oklch(56% 0.26 288deg));
--bs-indigo-400: color-mix(in lab, var(--bs-white) 20%, oklch(56% 0.26 288deg));
--bs-indigo-500: oklch(56% 0.26 288deg);
--bs-indigo-600: color-mix(in lab, var(--bs-black) 16%, oklch(56% 0.26 288deg));
--bs-indigo-700: color-mix(in lab, var(--bs-black) 32%, oklch(56% 0.26 288deg));
--bs-indigo-800: color-mix(in lab, var(--bs-black) 48%, oklch(56% 0.26 288deg));
--bs-indigo-900: color-mix(in lab, var(--bs-black) 64%, oklch(56% 0.26 288deg));
--bs-indigo-950: color-mix(in lab, var(--bs-black) 76%, oklch(56% 0.26 288deg));
--bs-indigo-975: color-mix(in lab, var(--bs-black) 88%, oklch(56% 0.26 288deg));
--bs-violet-025: color-mix(in lab, var(--bs-white) 94%, oklch(56% 0.24 300deg));
--bs-violet-050: color-mix(in lab, var(--bs-white) 90%, oklch(56% 0.24 300deg));
--bs-violet-100: color-mix(in lab, var(--bs-white) 80%, oklch(56% 0.24 300deg));
--bs-violet-200: color-mix(in lab, var(--bs-white) 60%, oklch(56% 0.24 300deg));
--bs-violet-300: color-mix(in lab, var(--bs-white) 40%, oklch(56% 0.24 300deg));
--bs-violet-400: color-mix(in lab, var(--bs-white) 20%, oklch(56% 0.24 300deg));
--bs-violet-500: oklch(56% 0.24 300deg);
--bs-violet-600: color-mix(in lab, var(--bs-black) 16%, oklch(56% 0.24 300deg));
--bs-violet-700: color-mix(in lab, var(--bs-black) 32%, oklch(56% 0.24 300deg));
--bs-violet-800: color-mix(in lab, var(--bs-black) 48%, oklch(56% 0.24 300deg));
--bs-violet-900: color-mix(in lab, var(--bs-black) 64%, oklch(56% 0.24 300deg));
--bs-violet-950: color-mix(in lab, var(--bs-black) 76%, oklch(56% 0.24 300deg));
--bs-violet-975: color-mix(in lab, var(--bs-black) 88%, oklch(56% 0.24 300deg));
--bs-purple-025: color-mix(in lab, var(--bs-white) 94%, oklch(56% 0.24 320deg));
--bs-purple-050: color-mix(in lab, var(--bs-white) 90%, oklch(56% 0.24 320deg));
--bs-purple-100: color-mix(in lab, var(--bs-white) 80%, oklch(56% 0.24 320deg));
--bs-purple-200: color-mix(in lab, var(--bs-white) 60%, oklch(56% 0.24 320deg));
--bs-purple-300: color-mix(in lab, var(--bs-white) 40%, oklch(56% 0.24 320deg));
--bs-purple-400: color-mix(in lab, var(--bs-white) 20%, oklch(56% 0.24 320deg));
--bs-purple-500: oklch(56% 0.24 320deg);
--bs-purple-600: color-mix(in lab, var(--bs-black) 16%, oklch(56% 0.24 320deg));
--bs-purple-700: color-mix(in lab, var(--bs-black) 32%, oklch(56% 0.24 320deg));
--bs-purple-800: color-mix(in lab, var(--bs-black) 48%, oklch(56% 0.24 320deg));
--bs-purple-900: color-mix(in lab, var(--bs-black) 64%, oklch(56% 0.24 320deg));
--bs-purple-950: color-mix(in lab, var(--bs-black) 76%, oklch(56% 0.24 320deg));
--bs-purple-975: color-mix(in lab, var(--bs-black) 88%, oklch(56% 0.24 320deg));
--bs-pink-025: color-mix(in lab, var(--bs-white) 94%, oklch(60% 0.22 4deg));
--bs-pink-050: color-mix(in lab, var(--bs-white) 90%, oklch(60% 0.22 4deg));
--bs-pink-100: color-mix(in lab, var(--bs-white) 80%, oklch(60% 0.22 4deg));
--bs-pink-200: color-mix(in lab, var(--bs-white) 60%, oklch(60% 0.22 4deg));
--bs-pink-300: color-mix(in lab, var(--bs-white) 40%, oklch(60% 0.22 4deg));
--bs-pink-400: color-mix(in lab, var(--bs-white) 20%, oklch(60% 0.22 4deg));
--bs-pink-500: oklch(60% 0.22 4deg);
--bs-pink-600: color-mix(in lab, var(--bs-black) 16%, oklch(60% 0.22 4deg));
--bs-pink-700: color-mix(in lab, var(--bs-black) 32%, oklch(60% 0.22 4deg));
--bs-pink-800: color-mix(in lab, var(--bs-black) 48%, oklch(60% 0.22 4deg));
--bs-pink-900: color-mix(in lab, var(--bs-black) 64%, oklch(60% 0.22 4deg));
--bs-pink-950: color-mix(in lab, var(--bs-black) 76%, oklch(60% 0.22 4deg));
--bs-pink-975: color-mix(in lab, var(--bs-black) 88%, oklch(60% 0.22 4deg));
--bs-red-025: color-mix(in lab, var(--bs-white) 94%, oklch(60% 0.22 20deg));
--bs-red-050: color-mix(in lab, var(--bs-white) 90%, oklch(60% 0.22 20deg));
--bs-red-100: color-mix(in lab, var(--bs-white) 80%, oklch(60% 0.22 20deg));
--bs-red-200: color-mix(in lab, var(--bs-white) 60%, oklch(60% 0.22 20deg));
--bs-red-300: color-mix(in lab, var(--bs-white) 40%, oklch(60% 0.22 20deg));
--bs-red-400: color-mix(in lab, var(--bs-white) 20%, oklch(60% 0.22 20deg));
--bs-red-500: oklch(60% 0.22 20deg);
--bs-red-600: color-mix(in lab, var(--bs-black) 16%, oklch(60% 0.22 20deg));
--bs-red-700: color-mix(in lab, var(--bs-black) 32%, oklch(60% 0.22 20deg));
--bs-red-800: color-mix(in lab, var(--bs-black) 48%, oklch(60% 0.22 20deg));
--bs-red-900: color-mix(in lab, var(--bs-black) 64%, oklch(60% 0.22 20deg));
--bs-red-950: color-mix(in lab, var(--bs-black) 76%, oklch(60% 0.22 20deg));
--bs-red-975: color-mix(in lab, var(--bs-black) 88%, oklch(60% 0.22 20deg));
--bs-orange-025: color-mix(in lab, var(--bs-white) 94%, oklch(70% 0.22 52deg));
--bs-orange-050: color-mix(in lab, var(--bs-white) 90%, oklch(70% 0.22 52deg));
--bs-orange-100: color-mix(in lab, var(--bs-white) 80%, oklch(70% 0.22 52deg));
--bs-orange-200: color-mix(in lab, var(--bs-white) 60%, oklch(70% 0.22 52deg));
--bs-orange-300: color-mix(in lab, var(--bs-white) 40%, oklch(70% 0.22 52deg));
--bs-orange-400: color-mix(in lab, var(--bs-white) 20%, oklch(70% 0.22 52deg));
--bs-orange-500: oklch(70% 0.22 52deg);
--bs-orange-600: color-mix(in lab, var(--bs-black) 16%, oklch(70% 0.22 52deg));
--bs-orange-700: color-mix(in lab, var(--bs-black) 32%, oklch(70% 0.22 52deg));
--bs-orange-800: color-mix(in lab, var(--bs-black) 48%, oklch(70% 0.22 52deg));
--bs-orange-900: color-mix(in lab, var(--bs-black) 64%, oklch(70% 0.22 52deg));
--bs-orange-950: color-mix(in lab, var(--bs-black) 76%, oklch(70% 0.22 52deg));
--bs-orange-975: color-mix(in lab, var(--bs-black) 88%, oklch(70% 0.22 52deg));
--bs-amber-025: color-mix(in lab, var(--bs-white) 94%, oklch(79% 0.2 78deg));
--bs-amber-050: color-mix(in lab, var(--bs-white) 90%, oklch(79% 0.2 78deg));
--bs-amber-100: color-mix(in lab, var(--bs-white) 80%, oklch(79% 0.2 78deg));
--bs-amber-200: color-mix(in lab, var(--bs-white) 60%, oklch(79% 0.2 78deg));
--bs-amber-300: color-mix(in lab, var(--bs-white) 40%, oklch(79% 0.2 78deg));
--bs-amber-400: color-mix(in lab, var(--bs-white) 20%, oklch(79% 0.2 78deg));
--bs-amber-500: oklch(79% 0.2 78deg);
--bs-amber-600: color-mix(in lab, var(--bs-black) 16%, oklch(79% 0.2 78deg));
--bs-amber-700: color-mix(in lab, var(--bs-black) 32%, oklch(79% 0.2 78deg));
--bs-amber-800: color-mix(in lab, var(--bs-black) 48%, oklch(79% 0.2 78deg));
--bs-amber-900: color-mix(in lab, var(--bs-black) 64%, oklch(79% 0.2 78deg));
--bs-amber-950: color-mix(in lab, var(--bs-black) 76%, oklch(79% 0.2 78deg));
--bs-amber-975: color-mix(in lab, var(--bs-black) 88%, oklch(79% 0.2 78deg));
--bs-yellow-025: color-mix(in lab, var(--bs-white) 94%, oklch(88% 0.24 88deg));
--bs-yellow-050: color-mix(in lab, var(--bs-white) 90%, oklch(88% 0.24 88deg));
--bs-yellow-100: color-mix(in lab, var(--bs-white) 80%, oklch(88% 0.24 88deg));
--bs-yellow-200: color-mix(in lab, var(--bs-white) 60%, oklch(88% 0.24 88deg));
--bs-yellow-300: color-mix(in lab, var(--bs-white) 40%, oklch(88% 0.24 88deg));
--bs-yellow-400: color-mix(in lab, var(--bs-white) 20%, oklch(88% 0.24 88deg));
--bs-yellow-500: oklch(88% 0.24 88deg);
--bs-yellow-600: color-mix(in lab, var(--bs-black) 16%, oklch(88% 0.24 88deg));
--bs-yellow-700: color-mix(in lab, var(--bs-black) 32%, oklch(88% 0.24 88deg));
--bs-yellow-800: color-mix(in lab, var(--bs-black) 48%, oklch(88% 0.24 88deg));
--bs-yellow-900: color-mix(in lab, var(--bs-black) 64%, oklch(88% 0.24 88deg));
--bs-yellow-950: color-mix(in lab, var(--bs-black) 76%, oklch(88% 0.24 88deg));
--bs-yellow-975: color-mix(in lab, var(--bs-black) 88%, oklch(88% 0.24 88deg));
--bs-lime-025: color-mix(in lab, var(--bs-white) 94%, oklch(65% 0.24 135deg));
--bs-lime-050: color-mix(in lab, var(--bs-white) 90%, oklch(65% 0.24 135deg));
--bs-lime-100: color-mix(in lab, var(--bs-white) 80%, oklch(65% 0.24 135deg));
--bs-lime-200: color-mix(in lab, var(--bs-white) 60%, oklch(65% 0.24 135deg));
--bs-lime-300: color-mix(in lab, var(--bs-white) 40%, oklch(65% 0.24 135deg));
--bs-lime-400: color-mix(in lab, var(--bs-white) 20%, oklch(65% 0.24 135deg));
--bs-lime-500: oklch(65% 0.24 135deg);
--bs-lime-600: color-mix(in lab, var(--bs-black) 16%, oklch(65% 0.24 135deg));
--bs-lime-700: color-mix(in lab, var(--bs-black) 32%, oklch(65% 0.24 135deg));
--bs-lime-800: color-mix(in lab, var(--bs-black) 48%, oklch(65% 0.24 135deg));
--bs-lime-900: color-mix(in lab, var(--bs-black) 64%, oklch(65% 0.24 135deg));
--bs-lime-950: color-mix(in lab, var(--bs-black) 76%, oklch(65% 0.24 135deg));
--bs-lime-975: color-mix(in lab, var(--bs-black) 88%, oklch(65% 0.24 135deg));
--bs-green-025: color-mix(in lab, var(--bs-white) 94%, oklch(64% 0.22 160deg));
--bs-green-050: color-mix(in lab, var(--bs-white) 90%, oklch(64% 0.22 160deg));
--bs-green-100: color-mix(in lab, var(--bs-white) 80%, oklch(64% 0.22 160deg));
--bs-green-200: color-mix(in lab, var(--bs-white) 60%, oklch(64% 0.22 160deg));
--bs-green-300: color-mix(in lab, var(--bs-white) 40%, oklch(64% 0.22 160deg));
--bs-green-400: color-mix(in lab, var(--bs-white) 20%, oklch(64% 0.22 160deg));
--bs-green-500: oklch(64% 0.22 160deg);
--bs-green-600: color-mix(in lab, var(--bs-black) 16%, oklch(64% 0.22 160deg));
--bs-green-700: color-mix(in lab, var(--bs-black) 32%, oklch(64% 0.22 160deg));
--bs-green-800: color-mix(in lab, var(--bs-black) 48%, oklch(64% 0.22 160deg));
--bs-green-900: color-mix(in lab, var(--bs-black) 64%, oklch(64% 0.22 160deg));
--bs-green-950: color-mix(in lab, var(--bs-black) 76%, oklch(64% 0.22 160deg));
--bs-green-975: color-mix(in lab, var(--bs-black) 88%, oklch(64% 0.22 160deg));
--bs-teal-025: color-mix(in lab, var(--bs-white) 94%, oklch(68% 0.22 190deg));
--bs-teal-050: color-mix(in lab, var(--bs-white) 90%, oklch(68% 0.22 190deg));
--bs-teal-100: color-mix(in lab, var(--bs-white) 80%, oklch(68% 0.22 190deg));
--bs-teal-200: color-mix(in lab, var(--bs-white) 60%, oklch(68% 0.22 190deg));
--bs-teal-300: color-mix(in lab, var(--bs-white) 40%, oklch(68% 0.22 190deg));
--bs-teal-400: color-mix(in lab, var(--bs-white) 20%, oklch(68% 0.22 190deg));
--bs-teal-500: oklch(68% 0.22 190deg);
--bs-teal-600: color-mix(in lab, var(--bs-black) 16%, oklch(68% 0.22 190deg));
--bs-teal-700: color-mix(in lab, var(--bs-black) 32%, oklch(68% 0.22 190deg));
--bs-teal-800: color-mix(in lab, var(--bs-black) 48%, oklch(68% 0.22 190deg));
--bs-teal-900: color-mix(in lab, var(--bs-black) 64%, oklch(68% 0.22 190deg));
--bs-teal-950: color-mix(in lab, var(--bs-black) 76%, oklch(68% 0.22 190deg));
--bs-teal-975: color-mix(in lab, var(--bs-black) 88%, oklch(68% 0.22 190deg));
--bs-cyan-025: color-mix(in lab, var(--bs-white) 94%, oklch(69% 0.22 220deg));
--bs-cyan-050: color-mix(in lab, var(--bs-white) 90%, oklch(69% 0.22 220deg));
--bs-cyan-100: color-mix(in lab, var(--bs-white) 80%, oklch(69% 0.22 220deg));
--bs-cyan-200: color-mix(in lab, var(--bs-white) 60%, oklch(69% 0.22 220deg));
--bs-cyan-300: color-mix(in lab, var(--bs-white) 40%, oklch(69% 0.22 220deg));
--bs-cyan-400: color-mix(in lab, var(--bs-white) 20%, oklch(69% 0.22 220deg));
--bs-cyan-500: oklch(69% 0.22 220deg);
--bs-cyan-600: color-mix(in lab, var(--bs-black) 16%, oklch(69% 0.22 220deg));
--bs-cyan-700: color-mix(in lab, var(--bs-black) 32%, oklch(69% 0.22 220deg));
--bs-cyan-800: color-mix(in lab, var(--bs-black) 48%, oklch(69% 0.22 220deg));
--bs-cyan-900: color-mix(in lab, var(--bs-black) 64%, oklch(69% 0.22 220deg));
--bs-cyan-950: color-mix(in lab, var(--bs-black) 76%, oklch(69% 0.22 220deg));
--bs-cyan-975: color-mix(in lab, var(--bs-black) 88%, oklch(69% 0.22 220deg));
--bs-brown-025: color-mix(in lab, var(--bs-white) 94%, oklch(60% 0.12 54deg));
--bs-brown-050: color-mix(in lab, var(--bs-white) 90%, oklch(60% 0.12 54deg));
--bs-brown-100: color-mix(in lab, var(--bs-white) 80%, oklch(60% 0.12 54deg));
--bs-brown-200: color-mix(in lab, var(--bs-white) 60%, oklch(60% 0.12 54deg));
--bs-brown-300: color-mix(in lab, var(--bs-white) 40%, oklch(60% 0.12 54deg));
--bs-brown-400: color-mix(in lab, var(--bs-white) 20%, oklch(60% 0.12 54deg));
--bs-brown-500: oklch(60% 0.12 54deg);
--bs-brown-600: color-mix(in lab, var(--bs-black) 16%, oklch(60% 0.12 54deg));
--bs-brown-700: color-mix(in lab, var(--bs-black) 32%, oklch(60% 0.12 54deg));
--bs-brown-800: color-mix(in lab, var(--bs-black) 48%, oklch(60% 0.12 54deg));
--bs-brown-900: color-mix(in lab, var(--bs-black) 64%, oklch(60% 0.12 54deg));
--bs-brown-950: color-mix(in lab, var(--bs-black) 76%, oklch(60% 0.12 54deg));
--bs-brown-975: color-mix(in lab, var(--bs-black) 88%, oklch(60% 0.12 54deg));
--bs-gray-025: color-mix(in lab, var(--bs-white) 94%, oklch(60% 0.02 245deg));
--bs-gray-050: color-mix(in lab, var(--bs-white) 90%, oklch(60% 0.02 245deg));
--bs-gray-100: color-mix(in lab, var(--bs-white) 80%, oklch(60% 0.02 245deg));
--bs-gray-200: color-mix(in lab, var(--bs-white) 60%, oklch(60% 0.02 245deg));
--bs-gray-300: color-mix(in lab, var(--bs-white) 40%, oklch(60% 0.02 245deg));
--bs-gray-400: color-mix(in lab, var(--bs-white) 20%, oklch(60% 0.02 245deg));
--bs-gray-500: oklch(60% 0.02 245deg);
--bs-gray-600: color-mix(in lab, var(--bs-black) 16%, oklch(60% 0.02 245deg));
--bs-gray-700: color-mix(in lab, var(--bs-black) 32%, oklch(60% 0.02 245deg));
--bs-gray-800: color-mix(in lab, var(--bs-black) 48%, oklch(60% 0.02 245deg));
--bs-gray-900: color-mix(in lab, var(--bs-black) 64%, oklch(60% 0.02 245deg));
--bs-gray-950: color-mix(in lab, var(--bs-black) 76%, oklch(60% 0.02 245deg));
--bs-gray-975: color-mix(in lab, var(--bs-black) 88%, oklch(60% 0.02 245deg));
--bs-pewter-025: color-mix(in lab, var(--bs-white) 94%, oklch(65% 0.01 290deg));
--bs-pewter-050: color-mix(in lab, var(--bs-white) 90%, oklch(65% 0.01 290deg));
--bs-pewter-100: color-mix(in lab, var(--bs-white) 80%, oklch(65% 0.01 290deg));
--bs-pewter-200: color-mix(in lab, var(--bs-white) 60%, oklch(65% 0.01 290deg));
--bs-pewter-300: color-mix(in lab, var(--bs-white) 40%, oklch(65% 0.01 290deg));
--bs-pewter-400: color-mix(in lab, var(--bs-white) 20%, oklch(65% 0.01 290deg));
--bs-pewter-500: oklch(65% 0.01 290deg);
--bs-pewter-600: color-mix(in lab, var(--bs-black) 16%, oklch(65% 0.01 290deg));
--bs-pewter-700: color-mix(in lab, var(--bs-black) 32%, oklch(65% 0.01 290deg));
--bs-pewter-800: color-mix(in lab, var(--bs-black) 48%, oklch(65% 0.01 290deg));
--bs-pewter-900: color-mix(in lab, var(--bs-black) 64%, oklch(65% 0.01 290deg));
--bs-pewter-950: color-mix(in lab, var(--bs-black) 76%, oklch(65% 0.01 290deg));
--bs-pewter-975: color-mix(in lab, var(--bs-black) 88%, oklch(65% 0.01 290deg));
}
@layer colors, theme, config, root, reboot, layout, content, forms, components, custom, helpers, utilities;
:root {
--bs-black: #000;
--bs-white: #fff;
--bs-gradient: linear-gradient(180deg, color-mix(var(--bs-white) 15%, transparent), color-mix(var(--bs-white) 0%, transparent));
--bs-font-weight-lighter: lighter;
--bs-font-weight-light: 300;
--bs-font-weight-normal: 400;
--bs-font-weight-medium: 500;
--bs-font-weight-semibold: 600;
--bs-font-weight-bold: 700;
--bs-font-weight-bolder: bolder;
--bs-body-font-family: system-ui;
--bs-body-font-size: var(--bs-font-size-base);
--bs-body-font-weight: 400;
--bs-body-line-height: 1.5;
--bs-heading-color: inherit;
--bs-hr-border-color: var(--bs-border-color);
--bs-link-color: light-dark(var(--bs-primary-base), var(--bs-primary-text));
--bs-link-decoration: underline;
--bs-link-hover-color: color-mix(in oklch, var(--bs-link-color) 90%, #000);
--bs-font-mono: SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
--bs-code-font-size: 95%;
--bs-code-color: var(--bs-fg-2);
--bs-border-width: 1px;
--bs-border-style: solid;
--bs-border-color: light-dark(color-mix(in oklch, var(--bs-gray-100), var(--bs-gray-200)), var(--bs-gray-700));
--bs-border-color-translucent: color-mix(in oklch, var(--bs-fg-body) 15%, transparent);
--bs-border-radius: 0.5rem;
--bs-border-radius-xs: 0.375rem;
--bs-border-radius-sm: 0.5rem;
--bs-border-radius-lg: 0.75rem;
--bs-border-radius-xl: 1rem;
--bs-border-radius-2xl: 2rem;
--bs-border-radius-pill: 50rem;
--bs-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
--bs-box-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
--bs-box-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175);
--bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.075);
--bs-spacer: 1rem;
--bs-focus-ring-width: 3px;
--bs-focus-ring-offset: 1px;
--bs-focus-ring-color: var(--bs-primary-focus-ring);
--bs-focus-ring: var(--bs-focus-ring-width) solid var(--bs-focus-ring-color);
--bs-control-checked-bg: var(--bs-primary-base);
--bs-control-checked-border-color: var(--bs-control-checked-bg);
--bs-control-active-bg: var(--bs-primary-base);
--bs-control-active-border-color: var(--bs-control-active-bg);
--bs-control-disabled-bg: var(--bs-bg-3);
--bs-control-disabled-opacity: 0.65;
--bs-btn-input-fg: var(--bs-fg-body);
--bs-btn-input-bg: var(--bs-bg-body);
--bs-btn-input-min-height: 2.375rem;
--bs-btn-input-padding-y: 0.375rem;
--bs-btn-input-padding-x: 0.75rem;
--bs-btn-input-font-size: var(--bs-font-size-base);
--bs-btn-input-line-height: var(--bs-line-height-base);
--bs-btn-input-border-radius: var(--bs-border-radius);
--bs-btn-input-xs-min-height: 1.5rem;
--bs-btn-input-xs-padding-y: 0.125rem;
--bs-btn-input-xs-padding-x: 0.5rem;
--bs-btn-input-xs-font-size: var(--bs-font-size-xs);
--bs-btn-input-xs-line-height: 1.125;
--bs-btn-input-xs-border-radius: var(--bs-border-radius-xs);
--bs-btn-input-sm-min-height: 2rem;
--bs-btn-input-sm-padding-y: 0.25rem;
--bs-btn-input-sm-padding-x: 0.625rem;
--bs-btn-input-sm-font-size: var(--bs-font-size-sm);
--bs-btn-input-sm-line-height: var(--bs-line-height-sm);
--bs-btn-input-sm-border-radius: var(--bs-border-radius-sm);
--bs-btn-input-lg-min-height: 2.75rem;
--bs-btn-input-lg-padding-y: 0.5rem;
--bs-btn-input-lg-padding-x: 1rem;
--bs-btn-input-lg-font-size: var(--bs-font-size-md);
--bs-btn-input-lg-line-height: var(--bs-line-height-md);
--bs-btn-input-lg-border-radius: var(--bs-border-radius-lg);
--bs-form-valid-color: var(--bs-success-text);
--bs-form-valid-border-color: var(--bs-success-text);
--bs-form-invalid-color: var(--bs-danger-text);
--bs-form-invalid-border-color: var(--bs-danger-text);
--bs-font-size-xs: 0.75rem;
--bs-line-height-xs: 1.25;
--bs-font-size-sm: 0.875rem;
--bs-line-height-sm: 1.5;
--bs-font-size-md: 1rem;
--bs-line-height-md: 1.5;
--bs-font-size-lg: clamp(1.25rem, 1rem + 0.625vw, 1.5rem);
--bs-line-height-lg: 1.5;
--bs-font-size-xl: clamp(1.5rem, 1.1rem + 0.75vw, 1.75rem);
--bs-line-height-xl: 1.4285714286;
--bs-font-size-2xl: clamp(1.75rem, 1.3rem + 1vw, 2rem);
--bs-line-height-2xl: 1.3333333333;
--bs-font-size-3xl: clamp(2rem, 1.5rem + 1.875vw, 2.5rem);
--bs-line-height-3xl: 1.2;
--bs-font-size-4xl: clamp(2.25rem, 1.75rem + 2.5vw, 3rem);
--bs-line-height-4xl: 1.1;
--bs-font-size-5xl: clamp(3rem, 2rem + 5vw, 4rem);
--bs-line-height-5xl: 1.1;
--bs-font-size-6xl: clamp(3.75rem, 2.5rem + 6.25vw, 5rem);
--bs-line-height-6xl: 1;
--bs-primary-base: var(--bs-blue-500);
--bs-primary-text: light-dark(var(--bs-blue-600), var(--bs-blue-400));
--bs-primary-text-emphasis: light-dark(var(--bs-blue-800), var(--bs-blue-200));
--bs-primary-bg: var(--bs-blue-500);
--bs-primary-bg-subtle: light-dark(var(--bs-blue-100), var(--bs-blue-900));
--bs-primary-bg-muted: light-dark(var(--bs-blue-200), var(--bs-blue-800));
--bs-primary-border: light-dark(var(--bs-blue-300), var(--bs-blue-600));
--bs-primary-focus-ring: light-dark(color-mix(in oklch, var(--bs-blue-500) 50%, var(--bs-bg-body)), color-mix(in oklch, var(--bs-blue-500) 75%, var(--bs-bg-body)));
--bs-primary-contrast: var(--bs-white);
--bs-accent-base: var(--bs-indigo-500);
--bs-accent-text: light-dark(var(--bs-indigo-600), color-mix(in oklch, var(--bs-indigo-400), var(--bs-indigo-300)));
--bs-accent-text-emphasis: light-dark(var(--bs-indigo-800), var(--bs-indigo-300));
--bs-accent-bg: var(--bs-indigo-500);
--bs-accent-bg-subtle: light-dark(var(--bs-indigo-100), var(--bs-indigo-900));
--bs-accent-bg-muted: light-dark(var(--bs-indigo-200), var(--bs-indigo-800));
--bs-accent-border: light-dark(var(--bs-indigo-300), var(--bs-indigo-600));
--bs-accent-focus-ring: light-dark(color-mix(in oklch, var(--bs-indigo-500) 50%, var(--bs-bg-body)), color-mix(in oklch, var(--bs-indigo-500) 75%, var(--bs-bg-body)));
--bs-accent-contrast: var(--bs-white);
--bs-success-base: var(--bs-green-500);
--bs-success-text: light-dark(var(--bs-green-600), var(--bs-green-400));
--bs-success-text-emphasis: light-dark(var(--bs-green-800), var(--bs-green-300));
--bs-success-bg: var(--bs-green-500);
--bs-success-bg-subtle: light-dark(var(--bs-green-100), var(--bs-green-900));
--bs-success-bg-muted: light-dark(var(--bs-green-200), var(--bs-green-800));
--bs-success-border: light-dark(var(--bs-green-300), var(--bs-green-600));
--bs-success-focus-ring: light-dark(color-mix(in oklch, var(--bs-green-500) 50%, var(--bs-bg-body)), color-mix(in oklch, var(--bs-green-500) 75%, var(--bs-bg-body)));
--bs-success-contrast: var(--bs-white);
--bs-danger-base: var(--bs-red-500);
--bs-danger-text: light-dark(var(--bs-red-600), var(--bs-red-400));
--bs-danger-text-emphasis: light-dark(var(--bs-red-800), var(--bs-red-300));
--bs-danger-bg: var(--bs-red-500);
--bs-danger-bg-subtle: light-dark(var(--bs-red-100), var(--bs-red-900));
--bs-danger-bg-muted: light-dark(var(--bs-red-200), var(--bs-red-800));
--bs-danger-border: light-dark(var(--bs-red-300), var(--bs-red-600));
--bs-danger-focus-ring: light-dark(color-mix(in oklch, var(--bs-red-500) 50%, var(--bs-bg-body)), color-mix(in oklch, var(--bs-red-500) 75%, var(--bs-bg-body)));
--bs-danger-contrast: var(--bs-white);
--bs-warning-base: var(--bs-yellow-500);
--bs-warning-text: light-dark(var(--bs-yellow-700), var(--bs-yellow-400));
--bs-warning-text-emphasis: light-dark(var(--bs-yellow-800), var(--bs-yellow-300));
--bs-warning-bg: var(--bs-yellow-500);
--bs-warning-bg-subtle: light-dark(var(--bs-yellow-100), var(--bs-yellow-900));
--bs-warning-bg-muted: light-dark(var(--bs-yellow-200), var(--bs-yellow-800));
--bs-warning-border: light-dark(var(--bs-yellow-300), var(--bs-yellow-600));
--bs-warning-focus-ring: light-dark(color-mix(in oklch, var(--bs-yellow-500) 50%, var(--bs-bg-body)), color-mix(in oklch, var(--bs-yellow-400) 85%, var(--bs-bg-body)));
--bs-warning-contrast: var(--bs-gray-900);
--bs-info-base: var(--bs-cyan-500);
--bs-info-text: light-dark(var(--bs-cyan-600), var(--bs-cyan-400));
--bs-info-text-emphasis: light-dark(var(--bs-cyan-800), var(--bs-cyan-300));
--bs-info-bg: var(--bs-cyan-500);
--bs-info-bg-subtle: light-dark(var(--bs-cyan-100), var(--bs-cyan-900));
--bs-info-bg-muted: light-dark(var(--bs-cyan-200), var(--bs-cyan-800));
--bs-info-border: light-dark(var(--bs-cyan-300), var(--bs-cyan-600));
--bs-info-focus-ring: light-dark(color-mix(in oklch, var(--bs-cyan-500) 50%, var(--bs-bg-body)), color-mix(in oklch, var(--bs-cyan-500) 75%, var(--bs-bg-body)));
--bs-info-contrast: var(--bs-gray-900);
--bs-inverse-base: var(--bs-gray-900);
--bs-inverse-text: light-dark(var(--bs-gray-900), var(--bs-gray-200));
--bs-inverse-text-emphasis: light-dark(var(--bs-gray-975), var(--bs-white));
--bs-inverse-bg: light-dark(var(--bs-gray-900), var(--bs-gray-025));
--bs-inverse-bg-subtle: light-dark(var(--bs-gray-100), var(--bs-gray-900));
--bs-inverse-bg-muted: light-dark(var(--bs-gray-200), var(--bs-gray-300));
--bs-inverse-border: light-dark(var(--bs-gray-400), var(--bs-gray-100));
--bs-inverse-focus-ring: color-mix(in oklch, light-dark(var(--bs-gray-900), var(--bs-gray-100)) 50%, var(--bs-bg-body));
--bs-inverse-contrast: light-dark(var(--bs-white), var(--bs-gray-900));
--bs-secondary-base: var(--bs-gray-200);
--bs-secondary-text: light-dark(var(--bs-gray-600), var(--bs-gray-400));
--bs-secondary-text-emphasis: light-dark(var(--bs-gray-800), var(--bs-gray-200));
--bs-secondary-bg: light-dark(var(--bs-gray-100), var(--bs-gray-600));
--bs-secondary-bg-subtle: light-dark(var(--bs-gray-050), var(--bs-gray-800));
--bs-secondary-bg-muted: light-dark(var(--bs-gray-100), var(--bs-gray-700));
--bs-secondary-border: light-dark(var(--bs-gray-300), var(--bs-gray-600));
--bs-secondary-focus-ring: color-mix(in oklch, light-dark(var(--bs-gray-500), var(--bs-gray-300)) 50%, var(--bs-bg-body));
--bs-secondary-contrast: light-dark(var(--bs-gray-900), var(--bs-white));
--bs-bg-body: light-dark(var(--bs-white), var(--bs-gray-975));
--bs-bg-1: light-dark(var(--bs-gray-025), var(--bs-gray-950));
--bs-bg-2: light-dark(var(--bs-gray-050), var(--bs-gray-900));
--bs-bg-3: light-dark(var(--bs-gray-100), var(--bs-gray-800));
--bs-bg-4: light-dark(var(--bs-gray-200), var(--bs-gray-700));
--bs-bg-white: var(--bs-white);
--bs-bg-black: var(--bs-black);
--bs-bg-transparent: transparent;
--bs-bg-inherit: inherit;
--bs-fg-body: light-dark(var(--bs-gray-900), var(--bs-gray-050));
--bs-fg-1: light-dark(var(--bs-gray-800), var(--bs-gray-200));
--bs-fg-2: light-dark(var(--bs-gray-700), var(--bs-gray-300));
--bs-fg-3: light-dark(var(--bs-gray-600), var(--bs-gray-500));
--bs-fg-4: light-dark(var(--bs-gray-500), var(--bs-gray-600));
--bs-fg-white: var(--bs-white);
--bs-fg-black: var(--bs-black);
--bs-fg-inherit: inherit;
--bs-border-bg: var(--bs-bg-body);
--bs-border-body: light-dark(var(--bs-gray-300), var(--bs-gray-800));
--bs-border-muted: light-dark(var(--bs-gray-200), var(--bs-gray-800));
--bs-border-subtle: light-dark(var(--bs-gray-100), var(--bs-gray-900));
--bs-border-emphasized: light-dark(var(--bs-gray-400), var(--bs-gray-600));
--bs-border-white: var(--bs-white);
--bs-border-black: var(--bs-black);
--bs-breakpoint-xs: 0;
--bs-breakpoint-sm: 576px;
--bs-breakpoint-md: 768px;
--bs-breakpoint-lg: 1024px;
--bs-breakpoint-xl: 1280px;
--bs-breakpoint-2xl: 1536px;
color-scheme: light dark;
}
[data-bs-theme=dark] {
color-scheme: dark;
}
[data-bs-theme=light] {
color-scheme: light;
}
@layer reboot {
*,
*::before,
*::after {
box-sizing: border-box;
}
:root {
accent-color: var(--bs-primary-base);
}
@media (prefers-reduced-motion: no-preference) {
:root {
scroll-behavior: smooth;
}
}
body {
margin: 0;
font-family: var(--bs-body-font-family);
font-size: var(--bs-body-font-size);
font-weight: var(--bs-body-font-weight);
line-height: var(--bs-body-line-height);
color: var(--bs-fg-body);
text-align: var(--bs-body-text-align);
background-color: var(--bs-bg-body);
-webkit-text-size-adjust: 100%;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
hr {
margin: var(--bs-hr-margin-y, var(--bs-spacer)) 0;
border: 0;
border-block-start: var(--bs-border-width) solid var(--bs-hr-border-color);
}
h6,
.h6, h5,
.h5, h4,
.h4, h3,
.h3, h2,
.h2, h1,
.h1 {
margin-top: 0;
margin-bottom: 0.5rem;
font-weight: 500;
line-height: 1.2;
color: var(--bs-heading-color);
}
h1,
.h1 {
font-size: var(--bs-font-size-3xl);
}
h2,
.h2 {
font-size: var(--bs-font-size-2xl);
}
h3,
.h3 {
font-size: var(--bs-font-size-xl);
}
h4,
.h4 {
font-size: var(--bs-font-size-lg);
}
h5,
.h5 {
font-size: var(--bs-font-size-md);
}
h6,
.h6 {
font-size: var(--bs-font-size-sm);
}
p {
margin-top: 0;
margin-bottom: 1rem;
}
abbr[title] {
-webkit-text-decoration: underline dotted;
text-decoration: underline dotted;
cursor: help;
-webkit-text-decoration-skip-ink: none;
text-decoration-skip-ink: none;
}
address {
margin-bottom: 1rem;
font-style: normal;
line-height: inherit;
}
ol,
ul {
padding-inline-start: 2rem;
}
ol,
ul,
dl {
margin-top: 0;
margin-bottom: 1rem;
}
ol ol,
ul ul,
ol ul,
ul ol {
margin-bottom: 0;
}
dt {
font-weight: 700;
}
dd {
margin-inline-start: 0;
margin-bottom: 0.5rem;
}
blockquote {
margin: 0 0 1rem;
}
blockquote > * {
margin-block: 0;
}
b,
strong {
font-weight: bolder;
}
small,
.small {
font-size: var(--bs-small-font-size, 87.5%);
}
mark,
.mark {
--bs-mark-padding: 0.1875em;
--bs-mark-color: var(--bs-fg-body);
--bs-mark-bg: light-dark(var(--bs-yellow-100), var(--bs-yellow-900));
padding: var(--bs-mark-padding);
color: var(--bs-mark-color);
background-color: var(--bs-mark-bg);
}
sub,
sup {
position: relative;
font-size: var(--bs-sub-sup-font-size, 0.75em);
line-height: 0;
vertical-align: baseline;
}
sub {
bottom: -0.25em;
}
sup {
top: -0.5em;
}
a {
color: var(--bs-theme-text, var(--bs-link-color));
-webkit-text-decoration: var(--bs-link-decoration);
text-decoration: var(--bs-link-decoration);
text-underline-offset: 0.2em;
}
a:hover {
color: var(--bs-theme-text-emphasis, var(--bs-link-hover-color));
-webkit-text-decoration: var(--bs-link-hover-decoration, var(--bs-link-decoration));
text-decoration: var(--bs-link-hover-decoration, var(--bs-link-decoration));
}
a:not([href]):not([class]), a:not([href]):not([class]):hover {
color: inherit;
text-decoration: none;
}
pre,
code,
kbd,
samp {
font-family: var(--bs-font-mono);
font-size: 1em;
}
pre {
display: block;
margin-top: 0;
margin-bottom: 1rem;
overflow: auto;
font-size: var(--bs-code-font-size);
color: var(--bs-code-color, inherit);
}
pre code {
font-size: inherit;
color: inherit;
word-break: normal;
}
code {
font-size: var(--bs-code-font-size);
color: var(--bs-code-color);
word-wrap: break-word;
}
a > code {
color: inherit;
}
kbd {
--bs-kbd-padding-y: 0.125rem;
--bs-kbd-padding-x: 0.25rem;
--bs-kbd-font-size: var(--bs-font-size-xs);
--bs-kbd-color: var(--bs-bg-body);
--bs-kbd-bg: var(--bs-fg-2);
--bs-kbd-border-radius: var(--bs-border-radius-sm);
padding: var(--bs-kbd-padding-y) var(--bs-kbd-padding-x);
font-size: var(--bs-kbd-font-size);
color: var(--bs-kbd-color);
background-color: var(--bs-kbd-bg);
border-radius: var(--bs-kbd-border-radius);
}
kbd kbd {
padding: 0;
font-size: 1em;
font-weight: inherit;
}
figure {
margin: 0 0 1rem;
}
img,
svg {
vertical-align: middle;
}
table {
caption-side: bottom;
border-collapse: collapse;
}
caption {
padding-block: 0.5rem;
color: var(--bs-fg-3);
text-align: start;
}
th {
text-align: inherit;
text-align: -webkit-match-parent;
}
thead,
tbody,
tfoot,
tr,
td,
th {
border-color: inherit;
border-style: solid;
border-width: 0;
}
label {
display: inline-block;
}
button {
border-radius: 0;
}
button:focus:not(:focus-visible) {
outline: 0;
}
input,
button,
select,
optgroup,
textarea {
margin: 0;
font-family: inherit;
font-size: inherit;
line-height: inherit;
}
button,
select {
text-transform: none;
}
[role=button] {
cursor: pointer;
}
select {
word-wrap: normal;
}
select:disabled {
opacity: 1;
}
[list]:not([type=date]):not([type=datetime-local]):not([type=month]):not([type=week]):not([type=time])::-webkit-calendar-picker-indicator {
display: none !important;
}
button,
[type=button],
[type=reset],
[type=submit] {
-webkit-appearance: button;
}
button:not(:disabled),
[type=button]:not(:disabled),
[type=reset]:not(:disabled),
[type=submit]:not(:disabled) {
cursor: pointer;
}
::-moz-focus-inner {
padding: 0;
border-style: none;
}
textarea {
resize: vertical;
}
fieldset {
min-width: 0;
padding: 0;
margin: 0;
border: 0;
}
legend {
float: inline-start;
width: 100%;
padding: 0;
margin-bottom: 0.5rem;
font-size: 1.5rem;
line-height: inherit;
}
legend + * {
clear: inline-start;
}
::-webkit-datetime-edit-fields-wrapper,
::-webkit-datetime-edit-text,
::-webkit-datetime-edit-millisecond-field,
::-webkit-datetime-edit-second-field,
::-webkit-datetime-edit-minute-field,
::-webkit-datetime-edit-hour-field,
::-webkit-datetime-edit-ampm-field,
::-webkit-datetime-edit-day-field,
::-webkit-datetime-edit-week-field,
::-webkit-datetime-edit-month-field,
::-webkit-datetime-edit-year-field {
padding: 0;
}
::-webkit-inner-spin-button {
height: auto;
}
[type=search] {
-webkit-appearance: textfield;
outline-offset: -2px;
}
[type=search]::-webkit-search-cancel-button {
cursor: pointer;
filter: grayscale(1);
}
[type=tel],
[type=url],
[type=email],
[type=number] {
direction: ltr;
}
::-webkit-search-decoration {
-webkit-appearance: none;
}
::-webkit-color-swatch-wrapper {
padding: 0;
}
::file-selector-button {
font: inherit;
-webkit-appearance: button;
}
output {
display: inline-block;
}
iframe {
border: 0;
}
summary {
display: list-item;
cursor: pointer;
}
progress {
vertical-align: baseline;
}
[hidden] {
display: none !important;
}
}
@layer content {
.list-unstyled {
padding-inline-start: 0;
list-style: none;
}
.list-inline {
padding-inline-start: 0;
list-style: none;
}
.list-inline-item {
display: inline-block;
}
.list-inline-item:not(:last-child) {
margin-inline-end: var(--bs-list-inline-padding, var(--bs-spacer)/2);
}
.initialism {
font-size: var(--bs-initialism-font-size, var(--bs-font-size-xs));
text-transform: uppercase;
}
.blockquote {
--bs-blockquote-gap: calc(var(--bs-spacer) / 2);
--bs-blockquote-padding-x: var(--bs-spacer);
--bs-blockquote-margin-y: 1rem;
--bs-blockquote-font-size: var(--bs-font-size-md);
--bs-blockquote-border-width: 0.25rem;
--bs-blockquote-border-color: var(--bs-border-color);
--bs-blockquote-footer-font-size: var(--bs-font-size-sm);
--bs-blockquote-footer-color: var(--bs-fg-3);
display: flex;
flex-direction: column;
gap: var(--bs-blockquote-gap);
padding-inline-start: var(--bs-blockquote-padding-x);
margin-bottom: var(--bs-blockquote-margin-y);
font-size: var(--bs-blockquote-font-size);
border-inline-start: var(--bs-blockquote-border-width) solid var(--bs-blockquote-border-color);
}
.blockquote > * {
margin-bottom: 0;
}
figure.blockquote blockquote {
margin-bottom: 0;
}
.blockquote-footer {
font-size: var(--bs-blockquote-footer-font-size);
color: var(--bs-blockquote-footer-color);
}
.blockquote-footer::before {
content: "— ";
}
}
@layer content {
.table {
--bs-table-cell-padding-y: 0.5rem;
--bs-table-cell-padding-x: 0.5rem;
--bs-table-cell-vertical-align: top;
--bs-table-color: var(--bs-fg-body);
--bs-table-bg: var(--bs-bg-body);
--bs-table-accent-bg: transparent;
--bs-table-border-width: var(--bs-border-width);
--bs-table-border-color: var(--bs-border-color);
--bs-table-group-separator-color: currentcolor;
--bs-table-striped-color: var(--bs-table-color);
--bs-table-striped-bg-factor: 0.05;
--bs-table-striped-bg: color-mix(in srgb, var(--bs-table-color) var(--bs-table-striped-bg-factor), transparent);
--bs-table-active-color: var(--bs-table-color);
--bs-table-active-bg-factor: 0.1;
--bs-table-active-bg: color-mix(in srgb, var(--bs-table-color) var(--bs-table-active-bg-factor), transparent);
--bs-table-hover-color: var(--bs-table-color);
--bs-table-hover-bg-factor: 0.075;
--bs-table-hover-bg: color-mix(in srgb, var(--bs-table-color) var(--bs-table-hover-bg-factor), transparent);
--bs-table-color-type: initial;
--bs-table-bg-type: initial;
--bs-table-color-state: initial;
--bs-table-bg-state: initial;
width: 100%;
margin-bottom: 1rem;
vertical-align: var(--bs-table-cell-vertical-align);
border-color: var(--bs-theme-border, var(--bs-table-border-color));
}
.table > :not(caption) > * > * {
padding: var(--bs-table-cell-padding-y) var(--bs-table-cell-padding-x);
color: var(--bs-table-color-state, var(--bs-table-color-type, var(--bs-theme-text, var(--bs-table-color))));
background-color: var(--bs-theme-bg-subtle, var(--bs-table-bg));
border-block-end-width: var(--bs-table-border-width);
box-shadow: inset 0 0 0 9999px var(--bs-table-bg-state, var(--bs-table-bg-type, var(--bs-theme-bg-subtle, var(--bs-table-accent-bg))));
}
.table > tbody {
vertical-align: inherit;
}
.table > thead {
vertical-align: bottom;
}
.table-group-divider {
border-block-start: calc(var(--bs-table-border-width) * 2) solid var(--bs-table-group-separator-color);
}
.caption-top {
caption-side: top;
}
.table-sm > :not(caption) > * > * {
--bs-table-cell-padding-y: .25rem;
--bs-table-cell-padding-x: .25rem;
}
.table-bordered > :not(caption) > * {
border-width: var(--bs-table-border-width) 0;
}
.table-bordered > :not(caption) > * > * {
border-width: 0 var(--bs-table-border-width);
}
.table-borderless > :not(caption) > * > * {
border-block-end-width: 0;
}
.table-borderless > :not(:first-child) {
border-block-start-width: 0;
}
.table-striped > tbody > tr:nth-of-type(odd) > * {
--bs-table-color-type: var(--bs-theme-text, var(--bs-table-striped-color));
--bs-table-bg-type: color-mix(in srgb, var(--bs-theme-text, var(--bs-table-color)) var(--bs-table-striped-bg-factor), transparent);
}
.table-striped-columns > :not(caption) > tr > :nth-child(even) {
--bs-table-color-type: var(--bs-theme-text, var(--bs-table-striped-color));
--bs-table-bg-type: color-mix(in srgb, var(--bs-theme-text, var(--bs-table-color)) var(--bs-table-striped-bg-factor), transparent);
}
.table-active {
--bs-table-color-state: var(--bs-theme-text, var(--bs-table-active-color));
--bs-table-bg-state: color-mix(in srgb, var(--bs-theme-text, var(--bs-table-color)) var(--bs-table-active-bg-factor), transparent);
}
.table-hover > tbody > tr:hover > * {
--bs-table-color-state: var(--bs-theme-text, var(--bs-table-hover-color));
--bs-table-bg-state: color-mix(in srgb, var(--bs-theme-text, var(--bs-table-color)) var(--bs-table-hover-bg-factor), transparent);
}
.table-responsive {
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
@media (width < 576px) {
.sm\:table-responsive {
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
}
@media (width < 768px) {
.md\:table-responsive {
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
}
@media (width < 1024px) {
.lg\:table-responsive {
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
}
@media (width < 1280px) {
.xl\:table-responsive {
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
}
@media (width < 1536px) {
.\32 xl\:table-responsive {
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
}
}
@layer content {
.img-fluid {
max-width: 100%;
height: auto;
}
.img-thumbnail {
--bs-thumbnail-padding: 0.25rem;
--bs-thumbnail-bg: var(--bs-bg-body);
--bs-thumbnail-border-width: var(--bs-border-width);
--bs-thumbnail-border-color: var(--bs-border-color);
--bs-thumbnail-border-radius: var(--bs-border-radius);
--bs-thumbnail-box-shadow: var(--bs-box-shadow-sm);
padding: var(--bs-thumbnail-padding);
background-color: var(--bs-thumbnail-bg);
border: var(--bs-thumbnail-border-width) solid var(--bs-thumbnail-border-color);
border-radius: var(--bs-thumbnail-border-radius);
box-shadow: var(--bs-thumbnail-box-shadow);
max-width: 100%;
height: auto;
}
.figure {
--bs-figure-gap: calc(var(--bs-spacer) * 0.5);
--bs-figure-caption-font-size: var(--bs-font-size-sm);
--bs-figure-caption-color: var(--bs-fg-3);
display: flex;
flex-direction: column;
gap: var(--bs-figure-gap);
}
.figure-caption {
font-size: var(--bs-figure-caption-font-size);
color: var(--bs-figure-caption-color);
}
}
@layer content {
.prose {
--bs-content-font-size: 1rem;
--bs-content-gap: 20px;
--bs-heading-color: light-dark(var(--bs-gray-900), var(--bs-white));
position: relative;
display: flex;
flex-direction: column;
gap: var(--bs-content-gap);
max-width: 1000px;
margin-inline: auto;
font-size: var(--bs-content-font-size);
line-height: 1.5;
}
@media (width >= 1024px) {
.prose {
--bs-content-font-size: var(--bs-font-size-md);
--bs-content-gap: 24px;
}
}
.prose :where(p, ul, ol, dl, pre, table, blockquote):not(:where(.not-prose, .not-prose *)) {
margin-block: 0;
}
.prose :where(ul, ol):not([class]):not(:where(.not-prose, .not-prose *)) li:not(:last-child) {
margin-bottom: calc(var(--bs-content-gap) / 4);
}
.prose :where(li ul, li ol):not(:where(.not-prose, .not-prose *)) {
margin-top: calc(var(--bs-content-gap) / 4);
}
.prose :where(hr):not(:where(.not-prose, .not-prose *)) {
margin: calc(var(--bs-content-gap) * 1.5) 0;
border: 0;
border-block-start: var(--bs-border-width) solid var(--bs-hr-border-color);
}
.prose :where(h1, h2, h3, h4, h5, h6):not([class]):not(:where(.not-prose, .not-prose *)) {
margin-top: 0;
margin-bottom: calc(var(--bs-content-gap) / -2);
font-weight: 500;
line-height: 1.25;
}
.prose :where(h1, h2, h3, h4, h5, h6):not([class]):not(:where(.not-prose, .not-prose *)) code {
font-weight: 600;
color: inherit;
}
.prose :where(h1, h2):not(:first-child):not(:where(.not-prose, .not-prose *)) {
margin-top: calc(var(--bs-content-gap) * 0.75);
}
.prose :where(h3, h4, h5, h6):not(:first-child):not(:where(.not-prose, .not-prose *)) {
margin-top: calc(var(--bs-content-gap) * 0.5);
}
.prose :where(h1):not(:where(.not-prose, .not-prose *)) {
font-size: 2.25em;
line-height: 1.1;
}
.prose :where(h2):not(:where(.not-prose, .not-prose *)) {
font-size: 1.75em;
}
.prose :where(h3):not(:where(.not-prose, .not-prose *)) {
font-size: 1.5em;
}
.prose :where(h4):not(:where(.not-prose, .not-prose *)) {
font-size: 1.25em;
}
.prose :where(h5):not(:where(.not-prose, .not-prose *)) {
font-size: 1.125em;
}
.prose :where(h6):not(:where(.not-prose, .not-prose *)) {
font-size: 1em;
}
.prose :where(a:not([class])):not(:where(.not-prose, .not-prose *)) {
color: var(--bs-link-color);
text-decoration: underline;
text-decoration-color: color-mix(in srgb, var(--bs-link-color) 25%, transparent);
text-underline-offset: 4px;
transition: 0.1s text-decoration-color ease-in-out;
}
@media (prefers-reduced-motion: reduce) {
.prose :where(a:not([class])):not(:where(.not-prose, .not-prose *)) {
transition: none;
}
}
.prose :where(a:not([class])):not(:where(.not-prose, .not-prose *)):hover {
text-decoration-color: var(--bs-link-hover-color);
}
.prose :where(img):not(:where(.not-prose, .not-prose *)) {
max-width: 100%;
}
.prose :where(blockquote):not(:where(.not-prose, .not-prose *)) {
padding-inline-start: calc(var(--bs-content-gap) / 2);
margin: 0;
border-inline-start: 4px solid var(--bs-border-color);
}
.prose :where(table):not(:where(.not-prose, .not-prose *)) {
width: 100%;
border-spacing: 0;
border-collapse: collapse;
}
.prose :where(table:not([class])):not(:where(.not-prose, .not-prose *)) td,
.prose :where(table:not([class])):not(:where(.not-prose, .not-prose *)) th {
padding: 6px 12px;
text-align: inherit;
border: 1px solid var(--bs-border-color);
}
.prose :where(dt):not(:where(.not-prose, .not-prose *)) {
font-weight: 500;
}
.prose :where(video, img):not(:where(.not-prose, .not-prose *)) {
max-width: 100%;
}
}
@layer layout {
.container,
.container-fluid,
.\32 xl\:container,
.xl\:container,
.lg\:container,
.md\:container,
.sm\:container {
--bs-gutter-x: 1.5rem;
--bs-gutter-y: 0;
width: 100%;
padding-inline: calc(var(--bs-gutter-x) * 0.5);
margin-inline: auto;
}
@media (width >= 576px) {
.sm\:container, .container {
max-width: 540px;
}
}
@media (width >= 768px) {
.md\:container, .sm\:container, .container {
max-width: 720px;
}
}
@media (width >= 1024px) {
.lg\:container, .md\:container, .sm\:container, .container {
max-width: 960px;
}
}
@media (width >= 1280px) {
.xl\:container, .lg\:container, .md\:container, .sm\:container, .container {
max-width: 1200px;
}
}
@media (width >= 1536px) {
.\32 xl\:container, .xl\:container, .lg\:container, .md\:container, .sm\:container, .container {
max-width: 1440px;
}
}
}
@layer layout {
.row {
--bs-gutter-x: 1.5rem;
--bs-gutter-y: 0;
display: flex;
flex-wrap: wrap;
margin-inline: calc(-0.5 * var(--bs-gutter-x));
margin-top: calc(-1 * var(--bs-gutter-y));
}
.row > * {
flex-shrink: 0;
width: 100%;
max-width: 100%;
padding-inline: calc(var(--bs-gutter-x) * 0.5);
margin-top: var(--bs-gutter-y);
}
.col {
flex: 1 0 0;
}
.row-cols-auto > * {
flex: 0 0 auto;
width: auto;
}
.row-cols-1 > * {
flex: 0 0 auto;
width: 100%;
}
.row-cols-2 > * {
flex: 0 0 auto;
width: 50%;
}
.row-cols-3 > * {
flex: 0 0 auto;
width: 33.3333333333%;
}
.row-cols-4 > * {
flex: 0 0 auto;
width: 25%;
}
.row-cols-5 > * {
flex: 0 0 auto;
width: 20%;
}
.row-cols-6 > * {
flex: 0 0 auto;
width: 16.6666666667%;
}
.col-auto {
flex: 0 0 auto;
width: auto;
}
.col-1 {
flex: 0 0 auto;
width: 8.3333333333%;
}
.col-2 {
flex: 0 0 auto;
width: 16.6666666667%;
}
.col-3 {
flex: 0 0 auto;
width: 25%;
}
.col-4 {
flex: 0 0 auto;
width: 33.3333333333%;
}
.col-5 {
flex: 0 0 auto;
width: 41.6666666667%;
}
.col-6 {
flex: 0 0 auto;
width: 50%;
}
.col-7 {
flex: 0 0 auto;
width: 58.3333333333%;
}
.col-8 {
flex: 0 0 auto;
width: 66.6666666667%;
}
.col-9 {
flex: 0 0 auto;
width: 75%;
}
.col-10 {
flex: 0 0 auto;
width: 83.3333333333%;
}
.col-11 {
flex: 0 0 auto;
width: 91.6666666667%;
}
.col-12 {
flex: 0 0 auto;
width: 100%;
}
.offset-1 {
margin-inline-start: 8.3333333333%;
}
.offset-2 {
margin-inline-start: 16.6666666667%;
}
.offset-3 {
margin-inline-start: 25%;
}
.offset-4 {
margin-inline-start: 33.3333333333%;
}
.offset-5 {
margin-inline-start: 41.6666666667%;
}
.offset-6 {
margin-inline-start: 50%;
}
.offset-7 {
margin-inline-start: 58.3333333333%;
}
.offset-8 {
margin-inline-start: 66.6666666667%;
}
.offset-9 {
margin-inline-start: 75%;
}
.offset-10 {
margin-inline-start: 83.3333333333%;
}
.offset-11 {
margin-inline-start: 91.6666666667%;
}
.g-0,
.gx-0 {
--bs-gutter-x: 0;
}
.g-0,
.gy-0 {
--bs-gutter-y: 0;
}
.g-1,
.gx-1 {
--bs-gutter-x: 0.25rem;
}
.g-1,
.gy-1 {
--bs-gutter-y: 0.25rem;
}
.g-2,
.gx-2 {
--bs-gutter-x: 0.5rem;
}
.g-2,
.gy-2 {
--bs-gutter-y: 0.5rem;
}
.g-3,
.gx-3 {
--bs-gutter-x: 1rem;
}
.g-3,
.gy-3 {
--bs-gutter-y: 1rem;
}
.g-4,
.gx-4 {
--bs-gutter-x: 1.5rem;
}
.g-4,
.gy-4 {
--bs-gutter-y: 1.5rem;
}
.g-5,
.gx-5 {
--bs-gutter-x: 3rem;
}
.g-5,
.gy-5 {
--bs-gutter-y: 3rem;
}
@media (width >= 576px) {
.sm\:col {
flex: 1 0 0;
}
.sm\:row-cols-auto > * {
flex: 0 0 auto;
width: auto;
}
.sm\:row-cols-1 > * {
flex: 0 0 auto;
width: 100%;
}
.sm\:row-cols-2 > * {
flex: 0 0 auto;
width: 50%;
}
.sm\:row-cols-3 > * {
flex: 0 0 auto;
width: 33.3333333333%;
}
.sm\:row-cols-4 > * {
flex: 0 0 auto;
width: 25%;
}
.sm\:row-cols-5 > * {
flex: 0 0 auto;
width: 20%;
}
.sm\:row-cols-6 > * {
flex: 0 0 auto;
width: 16.6666666667%;
}
.sm\:col-auto {
flex: 0 0 auto;
width: auto;
}
.sm\:col-1 {
flex: 0 0 auto;
width: 8.3333333333%;
}
.sm\:col-2 {
flex: 0 0 auto;
width: 16.6666666667%;
}
.sm\:col-3 {
flex: 0 0 auto;
width: 25%;
}
.sm\:col-4 {
flex: 0 0 auto;
width: 33.3333333333%;
}
.sm\:col-5 {
flex: 0 0 auto;
width: 41.6666666667%;
}
.sm\:col-6 {
flex: 0 0 auto;
width: 50%;
}
.sm\:col-7 {
flex: 0 0 auto;
width: 58.3333333333%;
}
.sm\:col-8 {
flex: 0 0 auto;
width: 66.6666666667%;
}
.sm\:col-9 {
flex: 0 0 auto;
width: 75%;
}
.sm\:col-10 {
flex: 0 0 auto;
width: 83.3333333333%;
}
.sm\:col-11 {
flex: 0 0 auto;
width: 91.6666666667%;
}
.sm\:col-12 {
flex: 0 0 auto;
width: 100%;
}
.sm\:offset-0 {
margin-inline-start: 0;
}
.sm\:offset-1 {
margin-inline-start: 8.3333333333%;
}
.sm\:offset-2 {
margin-inline-start: 16.6666666667%;
}
.sm\:offset-3 {
margin-inline-start: 25%;
}
.sm\:offset-4 {
margin-inline-start: 33.3333333333%;
}
.sm\:offset-5 {
margin-inline-start: 41.6666666667%;
}
.sm\:offset-6 {
margin-inline-start: 50%;
}
.sm\:offset-7 {
margin-inline-start: 58.3333333333%;
}
.sm\:offset-8 {
margin-inline-start: 66.6666666667%;
}
.sm\:offset-9 {
margin-inline-start: 75%;
}
.sm\:offset-10 {
margin-inline-start: 83.3333333333%;
}
.sm\:offset-11 {
margin-inline-start: 91.6666666667%;
}
.sm\:g-0,
.sm\:gx-0 {
--bs-gutter-x: 0;
}
.sm\:g-0,
.sm\:gy-0 {
--bs-gutter-y: 0;
}
.sm\:g-1,
.sm\:gx-1 {
--bs-gutter-x: 0.25rem;
}
.sm\:g-1,
.sm\:gy-1 {
--bs-gutter-y: 0.25rem;
}
.sm\:g-2,
.sm\:gx-2 {
--bs-gutter-x: 0.5rem;
}
.sm\:g-2,
.sm\:gy-2 {
--bs-gutter-y: 0.5rem;
}
.sm\:g-3,
.sm\:gx-3 {
--bs-gutter-x: 1rem;
}
.sm\:g-3,
.sm\:gy-3 {
--bs-gutter-y: 1rem;
}
.sm\:g-4,
.sm\:gx-4 {
--bs-gutter-x: 1.5rem;
}
.sm\:g-4,
.sm\:gy-4 {
--bs-gutter-y: 1.5rem;
}
.sm\:g-5,
.sm\:gx-5 {
--bs-gutter-x: 3rem;
}
.sm\:g-5,
.sm\:gy-5 {
--bs-gutter-y: 3rem;
}
}
@media (width >= 768px) {
.md\:col {
flex: 1 0 0;
}
.md\:row-cols-auto > * {
flex: 0 0 auto;
width: auto;
}
.md\:row-cols-1 > * {
flex: 0 0 auto;
width: 100%;
}
.md\:row-cols-2 > * {
flex: 0 0 auto;
width: 50%;
}
.md\:row-cols-3 > * {
flex: 0 0 auto;
width: 33.3333333333%;
}
.md\:row-cols-4 > * {
flex: 0 0 auto;
width: 25%;
}
.md\:row-cols-5 > * {
flex: 0 0 auto;
width: 20%;
}
.md\:row-cols-6 > * {
flex: 0 0 auto;
width: 16.6666666667%;
}
.md\:col-auto {
flex: 0 0 auto;
width: auto;
}
.md\:col-1 {
flex: 0 0 auto;
width: 8.3333333333%;
}
.md\:col-2 {
flex: 0 0 auto;
width: 16.6666666667%;
}
.md\:col-3 {
flex: 0 0 auto;
width: 25%;
}
.md\:col-4 {
flex: 0 0 auto;
width: 33.3333333333%;
}
.md\:col-5 {
flex: 0 0 auto;
width: 41.6666666667%;
}
.md\:col-6 {
flex: 0 0 auto;
width: 50%;
}
.md\:col-7 {
flex: 0 0 auto;
width: 58.3333333333%;
}
.md\:col-8 {
flex: 0 0 auto;
width: 66.6666666667%;
}
.md\:col-9 {
flex: 0 0 auto;
width: 75%;
}
.md\:col-10 {
flex: 0 0 auto;
width: 83.3333333333%;
}
.md\:col-11 {
flex: 0 0 auto;
width: 91.6666666667%;
}
.md\:col-12 {
flex: 0 0 auto;
width: 100%;
}
.md\:offset-0 {
margin-inline-start: 0;
}
.md\:offset-1 {
margin-inline-start: 8.3333333333%;
}
.md\:offset-2 {
margin-inline-start: 16.6666666667%;
}
.md\:offset-3 {
margin-inline-start: 25%;
}
.md\:offset-4 {
margin-inline-start: 33.3333333333%;
}
.md\:offset-5 {
margin-inline-start: 41.6666666667%;
}
.md\:offset-6 {
margin-inline-start: 50%;
}
.md\:offset-7 {
margin-inline-start: 58.3333333333%;
}
.md\:offset-8 {
margin-inline-start: 66.6666666667%;
}
.md\:offset-9 {
margin-inline-start: 75%;
}
.md\:offset-10 {
margin-inline-start: 83.3333333333%;
}
.md\:offset-11 {
margin-inline-start: 91.6666666667%;
}
.md\:g-0,
.md\:gx-0 {
--bs-gutter-x: 0;
}
.md\:g-0,
.md\:gy-0 {
--bs-gutter-y: 0;
}
.md\:g-1,
.md\:gx-1 {
--bs-gutter-x: 0.25rem;
}
.md\:g-1,
.md\:gy-1 {
--bs-gutter-y: 0.25rem;
}
.md\:g-2,
.md\:gx-2 {
--bs-gutter-x: 0.5rem;
}
.md\:g-2,
.md\:gy-2 {
--bs-gutter-y: 0.5rem;
}
.md\:g-3,
.md\:gx-3 {
--bs-gutter-x: 1rem;
}
.md\:g-3,
.md\:gy-3 {
--bs-gutter-y: 1rem;
}
.md\:g-4,
.md\:gx-4 {
--bs-gutter-x: 1.5rem;
}
.md\:g-4,
.md\:gy-4 {
--bs-gutter-y: 1.5rem;
}
.md\:g-5,
.md\:gx-5 {
--bs-gutter-x: 3rem;
}
.md\:g-5,
.md\:gy-5 {
--bs-gutter-y: 3rem;
}
}
@media (width >= 1024px) {
.lg\:col {
flex: 1 0 0;
}
.lg\:row-cols-auto > * {
flex: 0 0 auto;
width: auto;
}
.lg\:row-cols-1 > * {
flex: 0 0 auto;
width: 100%;
}
.lg\:row-cols-2 > * {
flex: 0 0 auto;
width: 50%;
}
.lg\:row-cols-3 > * {
flex: 0 0 auto;
width: 33.3333333333%;
}
.lg\:row-cols-4 > * {
flex: 0 0 auto;
width: 25%;
}
.lg\:row-cols-5 > * {
flex: 0 0 auto;
width: 20%;
}
.lg\:row-cols-6 > * {
flex: 0 0 auto;
width: 16.6666666667%;
}
.lg\:col-auto {
flex: 0 0 auto;
width: auto;
}
.lg\:col-1 {
flex: 0 0 auto;
width: 8.3333333333%;
}
.lg\:col-2 {
flex: 0 0 auto;
width: 16.6666666667%;
}
.lg\:col-3 {
flex: 0 0 auto;
width: 25%;
}
.lg\:col-4 {
flex: 0 0 auto;
width: 33.3333333333%;
}
.lg\:col-5 {
flex: 0 0 auto;
width: 41.6666666667%;
}
.lg\:col-6 {
flex: 0 0 auto;
width: 50%;
}
.lg\:col-7 {
flex: 0 0 auto;
width: 58.3333333333%;
}
.lg\:col-8 {
flex: 0 0 auto;
width: 66.6666666667%;
}
.lg\:col-9 {
flex: 0 0 auto;
width: 75%;
}
.lg\:col-10 {
flex: 0 0 auto;
width: 83.3333333333%;
}
.lg\:col-11 {
flex: 0 0 auto;
width: 91.6666666667%;
}
.lg\:col-12 {
flex: 0 0 auto;
width: 100%;
}
.lg\:offset-0 {
margin-inline-start: 0;
}
.lg\:offset-1 {
margin-inline-start: 8.3333333333%;
}
.lg\:offset-2 {
margin-inline-start: 16.6666666667%;
}
.lg\:offset-3 {
margin-inline-start: 25%;
}
.lg\:offset-4 {
margin-inline-start: 33.3333333333%;
}
.lg\:offset-5 {
margin-inline-start: 41.6666666667%;
}
.lg\:offset-6 {
margin-inline-start: 50%;
}
.lg\:offset-7 {
margin-inline-start: 58.3333333333%;
}
.lg\:offset-8 {
margin-inline-start: 66.6666666667%;
}
.lg\:offset-9 {
margin-inline-start: 75%;
}
.lg\:offset-10 {
margin-inline-start: 83.3333333333%;
}
.lg\:offset-11 {
margin-inline-start: 91.6666666667%;
}
.lg\:g-0,
.lg\:gx-0 {
--bs-gutter-x: 0;
}
.lg\:g-0,
.lg\:gy-0 {
--bs-gutter-y: 0;
}
.lg\:g-1,
.lg\:gx-1 {
--bs-gutter-x: 0.25rem;
}
.lg\:g-1,
.lg\:gy-1 {
--bs-gutter-y: 0.25rem;
}
.lg\:g-2,
.lg\:gx-2 {
--bs-gutter-x: 0.5rem;
}
.lg\:g-2,
.lg\:gy-2 {
--bs-gutter-y: 0.5rem;
}
.lg\:g-3,
.lg\:gx-3 {
--bs-gutter-x: 1rem;
}
.lg\:g-3,
.lg\:gy-3 {
--bs-gutter-y: 1rem;
}
.lg\:g-4,
.lg\:gx-4 {
--bs-gutter-x: 1.5rem;
}
.lg\:g-4,
.lg\:gy-4 {
--bs-gutter-y: 1.5rem;
}
.lg\:g-5,
.lg\:gx-5 {
--bs-gutter-x: 3rem;
}
.lg\:g-5,
.lg\:gy-5 {
--bs-gutter-y: 3rem;
}
}
@media (width >= 1280px) {
.xl\:col {
flex: 1 0 0;
}
.xl\:row-cols-auto > * {
flex: 0 0 auto;
width: auto;
}
.xl\:row-cols-1 > * {
flex: 0 0 auto;
width: 100%;
}
.xl\:row-cols-2 > * {
flex: 0 0 auto;
width: 50%;
}
.xl\:row-cols-3 > * {
flex: 0 0 auto;
width: 33.3333333333%;
}
.xl\:row-cols-4 > * {
flex: 0 0 auto;
width: 25%;
}
.xl\:row-cols-5 > * {
flex: 0 0 auto;
width: 20%;
}
.xl\:row-cols-6 > * {
flex: 0 0 auto;
width: 16.6666666667%;
}
.xl\:col-auto {
flex: 0 0 auto;
width: auto;
}
.xl\:col-1 {
flex: 0 0 auto;
width: 8.3333333333%;
}
.xl\:col-2 {
flex: 0 0 auto;
width: 16.6666666667%;
}
.xl\:col-3 {
flex: 0 0 auto;
width: 25%;
}
.xl\:col-4 {
flex: 0 0 auto;
width: 33.3333333333%;
}
.xl\:col-5 {
flex: 0 0 auto;
width: 41.6666666667%;
}
.xl\:col-6 {
flex: 0 0 auto;
width: 50%;
}
.xl\:col-7 {
flex: 0 0 auto;
width: 58.3333333333%;
}
.xl\:col-8 {
flex: 0 0 auto;
width: 66.6666666667%;
}
.xl\:col-9 {
flex: 0 0 auto;
width: 75%;
}
.xl\:col-10 {
flex: 0 0 auto;
width: 83.3333333333%;
}
.xl\:col-11 {
flex: 0 0 auto;
width: 91.6666666667%;
}
.xl\:col-12 {
flex: 0 0 auto;
width: 100%;
}
.xl\:offset-0 {
margin-inline-start: 0;
}
.xl\:offset-1 {
margin-inline-start: 8.3333333333%;
}
.xl\:offset-2 {
margin-inline-start: 16.6666666667%;
}
.xl\:offset-3 {
margin-inline-start: 25%;
}
.xl\:offset-4 {
margin-inline-start: 33.3333333333%;
}
.xl\:offset-5 {
margin-inline-start: 41.6666666667%;
}
.xl\:offset-6 {
margin-inline-start: 50%;
}
.xl\:offset-7 {
margin-inline-start: 58.3333333333%;
}
.xl\:offset-8 {
margin-inline-start: 66.6666666667%;
}
.xl\:offset-9 {
margin-inline-start: 75%;
}
.xl\:offset-10 {
margin-inline-start: 83.3333333333%;
}
.xl\:offset-11 {
margin-inline-start: 91.6666666667%;
}
.xl\:g-0,
.xl\:gx-0 {
--bs-gutter-x: 0;
}
.xl\:g-0,
.xl\:gy-0 {
--bs-gutter-y: 0;
}
.xl\:g-1,
.xl\:gx-1 {
--bs-gutter-x: 0.25rem;
}
.xl\:g-1,
.xl\:gy-1 {
--bs-gutter-y: 0.25rem;
}
.xl\:g-2,
.xl\:gx-2 {
--bs-gutter-x: 0.5rem;
}
.xl\:g-2,
.xl\:gy-2 {
--bs-gutter-y: 0.5rem;
}
.xl\:g-3,
.xl\:gx-3 {
--bs-gutter-x: 1rem;
}
.xl\:g-3,
.xl\:gy-3 {
--bs-gutter-y: 1rem;
}
.xl\:g-4,
.xl\:gx-4 {
--bs-gutter-x: 1.5rem;
}
.xl\:g-4,
.xl\:gy-4 {
--bs-gutter-y: 1.5rem;
}
.xl\:g-5,
.xl\:gx-5 {
--bs-gutter-x: 3rem;
}
.xl\:g-5,
.xl\:gy-5 {
--bs-gutter-y: 3rem;
}
}
@media (width >= 1536px) {
.\32 xl\:col {
flex: 1 0 0;
}
.\32 xl\:row-cols-auto > * {
flex: 0 0 auto;
width: auto;
}
.\32 xl\:row-cols-1 > * {
flex: 0 0 auto;
width: 100%;
}
.\32 xl\:row-cols-2 > * {
flex: 0 0 auto;
width: 50%;
}
.\32 xl\:row-cols-3 > * {
flex: 0 0 auto;
width: 33.3333333333%;
}
.\32 xl\:row-cols-4 > * {
flex: 0 0 auto;
width: 25%;
}
.\32 xl\:row-cols-5 > * {
flex: 0 0 auto;
width: 20%;
}
.\32 xl\:row-cols-6 > * {
flex: 0 0 auto;
width: 16.6666666667%;
}
.\32 xl\:col-auto {
flex: 0 0 auto;
width: auto;
}
.\32 xl\:col-1 {
flex: 0 0 auto;
width: 8.3333333333%;
}
.\32 xl\:col-2 {
flex: 0 0 auto;
width: 16.6666666667%;
}
.\32 xl\:col-3 {
flex: 0 0 auto;
width: 25%;
}
.\32 xl\:col-4 {
flex: 0 0 auto;
width: 33.3333333333%;
}
.\32 xl\:col-5 {
flex: 0 0 auto;
width: 41.6666666667%;
}
.\32 xl\:col-6 {
flex: 0 0 auto;
width: 50%;
}
.\32 xl\:col-7 {
flex: 0 0 auto;
width: 58.3333333333%;
}
.\32 xl\:col-8 {
flex: 0 0 auto;
width: 66.6666666667%;
}
.\32 xl\:col-9 {
flex: 0 0 auto;
width: 75%;
}
.\32 xl\:col-10 {
flex: 0 0 auto;
width: 83.3333333333%;
}
.\32 xl\:col-11 {
flex: 0 0 auto;
width: 91.6666666667%;
}
.\32 xl\:col-12 {
flex: 0 0 auto;
width: 100%;
}
.\32 xl\:offset-0 {
margin-inline-start: 0;
}
.\32 xl\:offset-1 {
margin-inline-start: 8.3333333333%;
}
.\32 xl\:offset-2 {
margin-inline-start: 16.6666666667%;
}
.\32 xl\:offset-3 {
margin-inline-start: 25%;
}
.\32 xl\:offset-4 {
margin-inline-start: 33.3333333333%;
}
.\32 xl\:offset-5 {
margin-inline-start: 41.6666666667%;
}
.\32 xl\:offset-6 {
margin-inline-start: 50%;
}
.\32 xl\:offset-7 {
margin-inline-start: 58.3333333333%;
}
.\32 xl\:offset-8 {
margin-inline-start: 66.6666666667%;
}
.\32 xl\:offset-9 {
margin-inline-start: 75%;
}
.\32 xl\:offset-10 {
margin-inline-start: 83.3333333333%;
}
.\32 xl\:offset-11 {
margin-inline-start: 91.6666666667%;
}
.\32 xl\:g-0,
.\32 xl\:gx-0 {
--bs-gutter-x: 0;
}
.\32 xl\:g-0,
.\32 xl\:gy-0 {
--bs-gutter-y: 0;
}
.\32 xl\:g-1,
.\32 xl\:gx-1 {
--bs-gutter-x: 0.25rem;
}
.\32 xl\:g-1,
.\32 xl\:gy-1 {
--bs-gutter-y: 0.25rem;
}
.\32 xl\:g-2,
.\32 xl\:gx-2 {
--bs-gutter-x: 0.5rem;
}
.\32 xl\:g-2,
.\32 xl\:gy-2 {
--bs-gutter-y: 0.5rem;
}
.\32 xl\:g-3,
.\32 xl\:gx-3 {
--bs-gutter-x: 1rem;
}
.\32 xl\:g-3,
.\32 xl\:gy-3 {
--bs-gutter-y: 1rem;
}
.\32 xl\:g-4,
.\32 xl\:gx-4 {
--bs-gutter-x: 1.5rem;
}
.\32 xl\:g-4,
.\32 xl\:gy-4 {
--bs-gutter-y: 1.5rem;
}
.\32 xl\:g-5,
.\32 xl\:gx-5 {
--bs-gutter-x: 3rem;
}
.\32 xl\:g-5,
.\32 xl\:gy-5 {
--bs-gutter-y: 3rem;
}
}
.grid {
--bs-columns: 12;
--bs-rows: 1;
--bs-gap: 1.5rem;
display: grid;
grid-template-rows: repeat(var(--bs-rows), 1fr);
grid-template-columns: repeat(var(--bs-columns), 1fr);
gap: var(--bs-gap);
}
.g-col-1 {
grid-column: auto/span 1;
}
.g-col-2 {
grid-column: auto/span 2;
}
.g-col-3 {
grid-column: auto/span 3;
}
.g-col-4 {
grid-column: auto/span 4;
}
.g-col-5 {
grid-column: auto/span 5;
}
.g-col-6 {
grid-column: auto/span 6;
}
.g-col-7 {
grid-column: auto/span 7;
}
.g-col-8 {
grid-column: auto/span 8;
}
.g-col-9 {
grid-column: auto/span 9;
}
.g-col-10 {
grid-column: auto/span 10;
}
.g-col-11 {
grid-column: auto/span 11;
}
.g-col-12 {
grid-column: auto/span 12;
}
.g-start-1 {
grid-column-start: 1;
}
.g-start-2 {
grid-column-start: 2;
}
.g-start-3 {
grid-column-start: 3;
}
.g-start-4 {
grid-column-start: 4;
}
.g-start-5 {
grid-column-start: 5;
}
.g-start-6 {
grid-column-start: 6;
}
.g-start-7 {
grid-column-start: 7;
}
.g-start-8 {
grid-column-start: 8;
}
.g-start-9 {
grid-column-start: 9;
}
.g-start-10 {
grid-column-start: 10;
}
.g-start-11 {
grid-column-start: 11;
}
@media (width >= 576px) {
.sm\:g-col-1 {
grid-column: auto/span 1;
}
.sm\:g-col-2 {
grid-column: auto/span 2;
}
.sm\:g-col-3 {
grid-column: auto/span 3;
}
.sm\:g-col-4 {
grid-column: auto/span 4;
}
.sm\:g-col-5 {
grid-column: auto/span 5;
}
.sm\:g-col-6 {
grid-column: auto/span 6;
}
.sm\:g-col-7 {
grid-column: auto/span 7;
}
.sm\:g-col-8 {
grid-column: auto/span 8;
}
.sm\:g-col-9 {
grid-column: auto/span 9;
}
.sm\:g-col-10 {
grid-column: auto/span 10;
}
.sm\:g-col-11 {
grid-column: auto/span 11;
}
.sm\:g-col-12 {
grid-column: auto/span 12;
}
.sm\:g-start-1 {
grid-column-start: 1;
}
.sm\:g-start-2 {
grid-column-start: 2;
}
.sm\:g-start-3 {
grid-column-start: 3;
}
.sm\:g-start-4 {
grid-column-start: 4;
}
.sm\:g-start-5 {
grid-column-start: 5;
}
.sm\:g-start-6 {
grid-column-start: 6;
}
.sm\:g-start-7 {
grid-column-start: 7;
}
.sm\:g-start-8 {
grid-column-start: 8;
}
.sm\:g-start-9 {
grid-column-start: 9;
}
.sm\:g-start-10 {
grid-column-start: 10;
}
.sm\:g-start-11 {
grid-column-start: 11;
}
}
@media (width >= 768px) {
.md\:g-col-1 {
grid-column: auto/span 1;
}
.md\:g-col-2 {
grid-column: auto/span 2;
}
.md\:g-col-3 {
grid-column: auto/span 3;
}
.md\:g-col-4 {
grid-column: auto/span 4;
}
.md\:g-col-5 {
grid-column: auto/span 5;
}
.md\:g-col-6 {
grid-column: auto/span 6;
}
.md\:g-col-7 {
grid-column: auto/span 7;
}
.md\:g-col-8 {
grid-column: auto/span 8;
}
.md\:g-col-9 {
grid-column: auto/span 9;
}
.md\:g-col-10 {
grid-column: auto/span 10;
}
.md\:g-col-11 {
grid-column: auto/span 11;
}
.md\:g-col-12 {
grid-column: auto/span 12;
}
.md\:g-start-1 {
grid-column-start: 1;
}
.md\:g-start-2 {
grid-column-start: 2;
}
.md\:g-start-3 {
grid-column-start: 3;
}
.md\:g-start-4 {
grid-column-start: 4;
}
.md\:g-start-5 {
grid-column-start: 5;
}
.md\:g-start-6 {
grid-column-start: 6;
}
.md\:g-start-7 {
grid-column-start: 7;
}
.md\:g-start-8 {
grid-column-start: 8;
}
.md\:g-start-9 {
grid-column-start: 9;
}
.md\:g-start-10 {
grid-column-start: 10;
}
.md\:g-start-11 {
grid-column-start: 11;
}
}
@media (width >= 1024px) {
.lg\:g-col-1 {
grid-column: auto/span 1;
}
.lg\:g-col-2 {
grid-column: auto/span 2;
}
.lg\:g-col-3 {
grid-column: auto/span 3;
}
.lg\:g-col-4 {
grid-column: auto/span 4;
}
.lg\:g-col-5 {
grid-column: auto/span 5;
}
.lg\:g-col-6 {
grid-column: auto/span 6;
}
.lg\:g-col-7 {
grid-column: auto/span 7;
}
.lg\:g-col-8 {
grid-column: auto/span 8;
}
.lg\:g-col-9 {
grid-column: auto/span 9;
}
.lg\:g-col-10 {
grid-column: auto/span 10;
}
.lg\:g-col-11 {
grid-column: auto/span 11;
}
.lg\:g-col-12 {
grid-column: auto/span 12;
}
.lg\:g-start-1 {
grid-column-start: 1;
}
.lg\:g-start-2 {
grid-column-start: 2;
}
.lg\:g-start-3 {
grid-column-start: 3;
}
.lg\:g-start-4 {
grid-column-start: 4;
}
.lg\:g-start-5 {
grid-column-start: 5;
}
.lg\:g-start-6 {
grid-column-start: 6;
}
.lg\:g-start-7 {
grid-column-start: 7;
}
.lg\:g-start-8 {
grid-column-start: 8;
}
.lg\:g-start-9 {
grid-column-start: 9;
}
.lg\:g-start-10 {
grid-column-start: 10;
}
.lg\:g-start-11 {
grid-column-start: 11;
}
}
@media (width >= 1280px) {
.xl\:g-col-1 {
grid-column: auto/span 1;
}
.xl\:g-col-2 {
grid-column: auto/span 2;
}
.xl\:g-col-3 {
grid-column: auto/span 3;
}
.xl\:g-col-4 {
grid-column: auto/span 4;
}
.xl\:g-col-5 {
grid-column: auto/span 5;
}
.xl\:g-col-6 {
grid-column: auto/span 6;
}
.xl\:g-col-7 {
grid-column: auto/span 7;
}
.xl\:g-col-8 {
grid-column: auto/span 8;
}
.xl\:g-col-9 {
grid-column: auto/span 9;
}
.xl\:g-col-10 {
grid-column: auto/span 10;
}
.xl\:g-col-11 {
grid-column: auto/span 11;
}
.xl\:g-col-12 {
grid-column: auto/span 12;
}
.xl\:g-start-1 {
grid-column-start: 1;
}
.xl\:g-start-2 {
grid-column-start: 2;
}
.xl\:g-start-3 {
grid-column-start: 3;
}
.xl\:g-start-4 {
grid-column-start: 4;
}
.xl\:g-start-5 {
grid-column-start: 5;
}
.xl\:g-start-6 {
grid-column-start: 6;
}
.xl\:g-start-7 {
grid-column-start: 7;
}
.xl\:g-start-8 {
grid-column-start: 8;
}
.xl\:g-start-9 {
grid-column-start: 9;
}
.xl\:g-start-10 {
grid-column-start: 10;
}
.xl\:g-start-11 {
grid-column-start: 11;
}
}
@media (width >= 1536px) {
.\32 xl\:g-col-1 {
grid-column: auto/span 1;
}
.\32 xl\:g-col-2 {
grid-column: auto/span 2;
}
.\32 xl\:g-col-3 {
grid-column: auto/span 3;
}
.\32 xl\:g-col-4 {
grid-column: auto/span 4;
}
.\32 xl\:g-col-5 {
grid-column: auto/span 5;
}
.\32 xl\:g-col-6 {
grid-column: auto/span 6;
}
.\32 xl\:g-col-7 {
grid-column: auto/span 7;
}
.\32 xl\:g-col-8 {
grid-column: auto/span 8;
}
.\32 xl\:g-col-9 {
grid-column: auto/span 9;
}
.\32 xl\:g-col-10 {
grid-column: auto/span 10;
}
.\32 xl\:g-col-11 {
grid-column: auto/span 11;
}
.\32 xl\:g-col-12 {
grid-column: auto/span 12;
}
.\32 xl\:g-start-1 {
grid-column-start: 1;
}
.\32 xl\:g-start-2 {
grid-column-start: 2;
}
.\32 xl\:g-start-3 {
grid-column-start: 3;
}
.\32 xl\:g-start-4 {
grid-column-start: 4;
}
.\32 xl\:g-start-5 {
grid-column-start: 5;
}
.\32 xl\:g-start-6 {
grid-column-start: 6;
}
.\32 xl\:g-start-7 {
grid-column-start: 7;
}
.\32 xl\:g-start-8 {
grid-column-start: 8;
}
.\32 xl\:g-start-9 {
grid-column-start: 9;
}
.\32 xl\:g-start-10 {
grid-column-start: 10;
}
.\32 xl\:g-start-11 {
grid-column-start: 11;
}
}
.grid-cols-subgrid {
grid-template-columns: subgrid;
}
.grid-fill {
--bs-gap: 1.5rem;
display: grid;
grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
grid-auto-flow: row;
gap: var(--bs-gap);
}
}
@layer forms {
.form-label,
.col-form-label {
font-size: var(--bs-label-font-size, var(--bs-font-size-sm));
font-style: var(--bs-label-font-style, inherit);
font-weight: var(--bs-label-font-weight, inherit);
color: var(--bs-label-color, var(--bs-fg-body));
}
.form-label {
margin-bottom: var(--bs-label-margin-bottom, calc(var(--bs-spacer) / 2));
}
.col-form-label {
--bs-label-padding-y: calc(var(--bs-btn-input-padding-y) + var(--bs-border-width));
padding-block: var(--bs-label-padding-y);
margin-bottom: 0;
}
.col-form-label-lg {
--bs-label-padding-y: calc(var(--bs-btn-input-lg-padding-y) + var(--bs-border-width));
font-size: var(--bs-btn-input-lg-font-size);
}
.col-form-label-sm {
--bs-label-padding-y: calc(var(--bs-btn-input-sm-padding-y) + var(--bs-border-width));
font-size: var(--bs-btn-input-sm-font-size);
}
}
@layer forms {
.form-text {
--bs-form-text-margin-top: 0.25rem;
--bs-form-text-font-size: var(--bs-font-size-sm);
--bs-form-text-color: var(--bs-fg-3);
margin-top: var(--bs-form-text-margin-top);
font-size: var(--bs-form-text-font-size);
font-style: var(--bs-form-text-font-style);
font-weight: var(--bs-form-text-font-weight);
color: var(--bs-form-text-color);
}
}
@layer forms {
.form-control {
--bs-control-min-height: var(--bs-btn-input-min-height);
--bs-control-padding-y: var(--bs-btn-input-padding-y);
--bs-control-padding-x: var(--bs-btn-input-padding-x);
--bs-control-font-size: var(--bs-btn-input-font-size);
--bs-control-line-height: var(--bs-btn-input-line-height);
--bs-control-fg: var(--bs-btn-input-fg);
--bs-control-bg: var(--bs-btn-input-bg);
--bs-control-border-width: var(--bs-border-width);
--bs-control-border-color: var(--bs-border-color);
--bs-control-border-radius: var(--bs-border-radius);
--bs-control-box-shadow: var(--bs-box-shadow-inset);
--bs-control-action-bg: var(--bs-bg-1);
--bs-control-action-hover-bg: var(--bs-bg-2);
--bs-control-transition-property: border-color, box-shadow;
--bs-control-transition-timing: 0.15s ease-in-out;
--bs-control-transition: var(--bs-control-transition-property) var(--bs-control-transition-timing);
--bs-control-placeholder-color: var(--bs-fg-3);
--bs-control-disabled-color: var(--bs-control-fg);
--bs-control-disabled-bg: var(--bs-bg-2);
--bs-control-disabled-border-color: var(--bs-control-border-color);
--bs-control-select-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%2300000080' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
--bs-control-select-bg-position: right 0.75rem center;
--bs-control-select-bg-size: 16px 12px;
--bs-control-select-bg-dark: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='white' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
display: flex;
width: 100%;
min-height: var(--bs-control-min-height);
padding: var(--bs-control-padding-y) var(--bs-control-padding-x);
font-size: var(--bs-control-font-size);
line-height: var(--bs-control-line-height);
color: var(--bs-control-fg);
-webkit-appearance: none;
appearance: none;
background-color: var(--bs-control-bg);
background-clip: padding-box;
border: var(--bs-control-border-width) solid var(--bs-control-border-color);
border-radius: var(--bs-control-border-radius);
box-shadow: var(--bs-control-box-shadow);
transition: var(--bs-control-transition);
}
@media (prefers-reduced-motion: reduce) {
.form-control {
transition: none;
}
}
.form-control:focus-visible {
--bs-focus-ring-offset: -1px;
outline: var(--bs-focus-ring);
outline-offset: var(--bs-focus-ring-offset);
}
.form-control::placeholder {
color: var(--bs-control-placeholder-color);
opacity: 1;
}
.form-control:disabled {
color: var(--bs-control-disabled-color);
background-color: var(--bs-control-disabled-bg);
border-color: var(--bs-control-disabled-border-color);
opacity: 1;
}
.form-control::-webkit-datetime-edit {
display: block;
height: 1.5rem;
padding: 0;
margin-bottom: -0.125rem;
}
.form-control::-webkit-datetime-edit-fields-wrapper {
height: 1.5rem;
}
.form-control[type=file] {
overflow: hidden;
}
.form-control[type=file]:not(:disabled):not([readonly]) {
cursor: pointer;
}
.form-control::file-selector-button {
min-height: var(--bs-control-min-height);
padding: var(--bs-control-padding-y) var(--bs-control-padding-x);
margin: calc(var(--bs-control-padding-y) * -1) calc(var(--bs-control-padding-x) * -1);
margin-inline-end: var(--bs-control-padding-x);
color: var(--bs-control-fg);
background-color: var(--bs-control-action-bg);
pointer-events: none;
border-color: inherit;
border-style: solid;
border-width: 0;
border-inline-end-width: var(--bs-control-border-width);
border-radius: 0;
transition: var(--bs-control-transition);
}
@media (prefers-reduced-motion: reduce) {
.form-control::file-selector-button {
transition: none;
}
}
.form-control:hover:not(:disabled):not([readonly])::file-selector-button {
background-color: var(--bs-control-action-hover-bg);
}
.form-control-plaintext {
display: block;
width: 100%;
padding: var(--bs-control-padding-y) 0;
margin-bottom: 0;
line-height: var(--bs-control-line-height);
color: var(--bs-control-fg);
background-color: transparent;
border: solid transparent;
border-width: var(--bs-control-border-width) 0;
}
.form-control-plaintext:focus {
outline: 0;
}
.form-control-plaintext.form-control-sm, .form-control-plaintext.form-control-lg {
padding-inline: 0;
}
select.form-control {
padding-inline-end: calc(var(--bs-control-padding-x) * 3);
background-image: var(--bs-control-select-bg);
background-repeat: no-repeat;
background-position: var(--bs-control-select-bg-position);
background-size: var(--bs-control-select-bg-size);
}
select.form-control[multiple], select.form-control[size]:not([size="1"]) {
padding-inline-end: var(--bs-control-padding-x);
background-image: none;
}
@media (prefers-color-scheme: dark) {
select.form-control {
background-image: var(--bs-control-select-bg-dark);
}
}
.form-control-sm {
--bs-control-min-height: var(--bs-btn-input-sm-min-height);
--bs-control-padding-y: var(--bs-btn-input-sm-padding-y);
--bs-control-padding-x: var(--bs-btn-input-sm-padding-x);
--bs-control-font-size: var(--bs-btn-input-sm-font-size);
--bs-control-line-height: var(--bs-btn-input-sm-line-height);
--bs-control-border-radius: var(--bs-btn-input-sm-border-radius);
}
.form-control-lg {
--bs-control-min-height: var(--bs-btn-input-lg-min-height);
--bs-control-padding-y: var(--bs-btn-input-lg-padding-y);
--bs-control-padding-x: var(--bs-btn-input-lg-padding-x);
--bs-control-font-size: var(--bs-btn-input-lg-font-size);
--bs-control-line-height: var(--bs-btn-input-lg-line-height);
--bs-control-border-radius: var(--bs-btn-input-lg-border-radius);
}
.form-control-color {
width: var(--bs-control-min-height);
padding: var(--bs-control-padding-y);
}
.form-control-color:not(:disabled):not([readonly]) {
cursor: pointer;
}
.form-control-color::-moz-color-swatch {
border: 0 !important;
border-radius: var(--bs-border-radius-sm);
}
.form-control-color::-webkit-color-swatch {
border: 0 !important;
border-radius: var(--bs-border-radius-sm);
}
.form-ghost {
display: block;
width: 100%;
padding: 0;
font: inherit;
color: inherit;
-webkit-appearance: none;
appearance: none;
background: transparent;
border: 0;
}
.form-ghost:focus {
outline: 0;
}
.form-ghost::placeholder {
color: var(--bs-fg-3);
opacity: 1;
}
.form-ghost:disabled {
color: var(--bs-fg-4);
cursor: not-allowed;
}
}
@layer forms {
.checkgroup {
display: flex;
gap: var(--bs-gap, 0.5rem);
align-items: var(--bs-align-items, start);
}
.checkgroup .description {
color: var(--bs-fg-3);
}
.check {
--bs-check-size: 1.25rem;
--bs-check-margin-block: 0.125rem;
--bs-check-bg: transparent;
--bs-check-border-color: var(--bs-border-color);
--bs-check-border-radius: 0.375rem;
--bs-check-checked-bg: var(--bs-control-checked-bg);
--bs-check-checked-border-color: var(--bs-control-checked-border-color);
--bs-check-indeterminate-bg: var(--bs-control-checked-bg);
--bs-check-indeterminate-border-color: var(--bs-control-checked-border-color);
--bs-check-active-bg: var(--bs-control-active-bg);
--bs-check-active-border-color: var(--bs-control-active-border-color);
--bs-check-disabled-bg: var(--bs-control-disabled-bg);
--bs-check-disabled-opacity: var(--bs-control-disabled-opacity);
display: grid;
grid-template-columns: repeat(1, minmax(0, 1fr));
margin-block: var(--bs-check-margin-block);
}
.check :where(svg, input) {
flex-shrink: 0;
grid-row-start: 1;
grid-column-start: 1;
width: var(--bs-check-size);
height: var(--bs-check-size);
}
.check :where(input) {
-webkit-appearance: none;
appearance: none;
background-color: var(--bs-theme-bg, var(--bs-check-bg));
border: 1px solid var(--bs-theme-bg, var(--bs-check-border-color));
border-radius: 0.3em;
}
.check :where(input:checked, input:indeterminate) {
background-color: var(--bs-theme-bg, var(--bs-check-checked-bg));
border-color: var(--bs-theme-bg, var(--bs-check-checked-border-color));
}
.check :where(input:focus-visible) {
outline: var(--bs-focus-ring);
outline-offset: var(--bs-focus-ring-offset);
}
.check:has(input:checked) .checked, .check:has(input:indeterminate) .indeterminate {
display: block;
color: var(--bs-theme-contrast, var(--bs-primary-contrast));
stroke: currentcolor;
}
.check:has(input:disabled) {
--bs-check-bg: var(--bs-check-disabled-bg);
}
.check:has(input:disabled) ~ label {
color: var(--bs-fg-3);
cursor: default;
}
.check:has(input:disabled:checked) {
opacity: var(--bs-check-disabled-opacity);
}
.check :where(svg) {
pointer-events: none;
}
.check :where(svg path) {
display: none;
}
.check-sm {
--bs-check-size: 1rem;
}
.check-lg {
--bs-check-size: 1.5rem;
--bs-check-margin-block: 0;
}
}
@layer forms {
.radiogroup {
display: flex;
gap: var(--bs-gap, 0.5rem);
align-items: var(--bs-align-items, start);
}
.radiogroup .description {
color: var(--bs-fg-3);
}
.radio {
--bs-radio-size: 1.25rem;
--bs-radio-margin-block: 0.125rem;
--bs-radio-bg: transparent;
--bs-radio-border-color: var(--bs-border-color);
--bs-radio-checked-bg: var(--bs-control-checked-bg);
--bs-radio-checked-border-color: var(--bs-control-checked-border-color);
--bs-radio-disabled-bg: var(--bs-control-disabled-bg);
--bs-radio-disabled-opacity: var(--bs-control-disabled-opacity);
position: relative;
flex-shrink: 0;
width: var(--bs-radio-size);
height: var(--bs-radio-size);
margin-block: var(--bs-radio-margin-block);
-webkit-appearance: none;
appearance: none;
background-color: var(--bs-theme-bg, var(--bs-radio-bg));
border: 1px solid var(--bs-theme-bg, var(--bs-radio-border-color));
border-radius: 50%;
}
.radio:checked {
color: var(--bs-theme-contrast, var(--bs-primary-contrast));
background-color: var(--bs-theme-bg, var(--bs-radio-checked-bg));
border-color: var(--bs-theme-bg, var(--bs-radio-checked-border-color));
}
.radio:checked::before {
position: absolute;
inset: 0.25rem;
content: "";
background-color: currentcolor;
border-radius: 50%;
}
.radio:disabled {
--bs-radio-bg: var(--bs-radio-disabled-bg);
}
.radio:disabled ~ label {
color: var(--bs-secondary-text);
cursor: default;
}
.radio:focus-visible {
outline: var(--bs-focus-ring);
outline-offset: var(--bs-focus-ring-offset);
}
.radio-sm {
--bs-radio-size: 1rem;
}
.radio-lg {
--bs-radio-size: 1.5rem;
--bs-radio-margin-block: 0;
}
}
@layer forms {
.switch {
--bs-switch-height: 1.25rem;
--bs-switch-width: calc(var(--bs-switch-height) * 1.5);
--bs-switch-padding: 0.0625rem;
--bs-switch-margin-block: 0.125rem;
--bs-switch-bg: var(--bs-bg-3);
--bs-switch-border-width: var(--bs-border-width);
--bs-switch-border-color: var(--bs-border-color);
--bs-switch-indicator-bg: var(--bs-white);
--bs-switch-checked-bg: var(--bs-control-checked-bg);
--bs-switch-checked-border-color: var(--bs-switch-checked-bg);
--bs-switch-checked-indicator-bg: var(--bs-white);
--bs-switch-disabled-bg: var(--bs-control-disabled-bg);
--bs-switch-disabled-indicator-bg: var(--bs-fg-3);
position: relative;
display: flex;
flex-shrink: 0;
align-items: stretch;
justify-content: flex-start;
width: var(--bs-switch-width);
height: var(--bs-switch-height);
padding: var(--bs-switch-padding);
margin-block: var(--bs-switch-margin-block);
background-color: var(--bs-switch-bg);
border: var(--bs-switch-border-width) solid var(--bs-switch-border-color);
border-radius: 10rem;
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.05);
transition: 0.15s ease-in-out;
transition-property: padding-inline-start, background-color;
}
.switch::before {
flex-shrink: 0;
width: calc(var(--bs-switch-height) - var(--bs-switch-padding) * 2 - var(--bs-switch-border-width) * 2);
height: calc(var(--bs-switch-height) - var(--bs-switch-padding) * 2 - var(--bs-switch-border-width) * 2);
content: "";
background-color: var(--bs-theme-contrast, var(--bs-switch-indicator-bg));
border-radius: 50%;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}
.switch input {
position: absolute;
inset: 0;
-webkit-appearance: none;
appearance: none;
background-color: transparent;
outline: 0;
}
.switch:focus-within {
outline: var(--bs-focus-ring);
outline-offset: var(--bs-focus-ring-offset);
}
.switch:has(input:checked) {
padding-inline-start: calc(var(--bs-switch-height) / 2 + var(--bs-switch-padding));
background-color: var(--bs-theme-bg, var(--bs-switch-checked-bg));
border-color: var(--bs-theme-bg, var(--bs-switch-checked-border-color));
}
.switch:has(input:disabled) {
--bs-switch-bg: var(--bs-switch-disabled-bg);
--bs-switch-indicator-bg: var(--bs-switch-disabled-indicator-bg);
}
.switch:has(input:disabled)::before {
opacity: 0.4;
}
.switch:has(input:disabled) ~ label {
color: var(--bs-secondary-text);
cursor: default;
}
.switch-sm {
--bs-switch-height: 1rem;
}
.switch-lg {
--bs-switch-height: 1.5rem;
--bs-switch-margin-block: 0;
}
}
@layer forms {
.form-range {
--bs-range-track-width: 100%;
--bs-range-track-height: 0.5rem;
--bs-range-track-cursor: pointer;
--bs-range-track-bg: var(--bs-bg-3);
--bs-range-track-border-radius: 1rem;
--bs-range-track-box-shadow: var(--bs-box-shadow-inset);
--bs-range-thumb-width: 1rem;
--bs-range-thumb-height: var(--bs-range-thumb-width);
--bs-range-thumb-bg: var(--bs-primary-base);
--bs-range-thumb-border: 0;
--bs-range-thumb-border-radius: 1rem;
--bs-range-thumb-box-shadow: 0 0.1rem 0.25rem rgba(0, 0, 0, 0.1);
--bs-range-thumb-active-bg: color-mix(in oklch, var(--bs-primary-base) 70%, var(--bs-bg-body));
--bs-range-thumb-disabled-bg: var(--bs-fg-3);
--bs-range-thumb-transition-property: background-color, border-color, box-shadow;
--bs-range-thumb-transition-timing: 0.15s ease-in-out;
--bs-range-thumb-transition: var(--bs-range-thumb-transition-property) var(--bs-range-thumb-transition-timing);
width: 100%;
height: calc(var(--bs-range-thumb-height) + var(--bs-focus-ring-width) * 2);
padding: 0;
-webkit-appearance: none;
appearance: none;
background-color: transparent;
}
.form-range:focus {
outline: 0;
}
.form-range:focus::-webkit-slider-thumb {
outline: var(--bs-focus-ring);
outline-offset: var(--bs-focus-ring-offset);
--bs-focus-ring-offset: 1px;
}
.form-range:focus::-moz-range-thumb {
outline: var(--bs-focus-ring);
outline-offset: var(--bs-focus-ring-offset);
--bs-focus-ring-offset: 1px;
}
.form-range::-moz-focus-outer {
border: 0;
}
.form-range::-webkit-slider-thumb {
width: var(--bs-range-thumb-width);
height: var(--bs-range-thumb-height);
-webkit-appearance: none;
appearance: none;
background-color: var(--bs-range-thumb-bg);
border: var(--bs-range-thumb-border);
border-radius: var(--bs-range-thumb-border-radius);
box-shadow: var(--bs-range-thumb-box-shadow);
-webkit-transition: var(--bs-range-thumb-transition);
transition: var(--bs-range-thumb-transition);
}
@media (prefers-reduced-motion: reduce) {
.form-range::-webkit-slider-thumb {
-webkit-transition: none;
transition: none;
}
}
.form-range::-webkit-slider-thumb:active {
background-color: var(--bs-range-thumb-active-bg);
}
.form-range::-webkit-slider-thumb {
margin-top: calc((var(--bs-range-track-height) - var(--bs-range-thumb-height)) * 0.5);
}
.form-range::-moz-range-thumb {
width: var(--bs-range-thumb-width);
height: var(--bs-range-thumb-height);
appearance: none;
background-color: var(--bs-range-thumb-bg);
border: var(--bs-range-thumb-border);
border-radius: var(--bs-range-thumb-border-radius);
box-shadow: var(--bs-range-thumb-box-shadow);
-moz-transition: var(--bs-range-thumb-transition);
transition: var(--bs-range-thumb-transition);
}
@media (prefers-reduced-motion: reduce) {
.form-range::-moz-range-thumb {
-moz-transition: none;
transition: none;
}
}
.form-range::-moz-range-thumb:active {
background-color: var(--bs-range-thumb-active-bg);
}
.form-range::-webkit-slider-runnable-track {
width: var(--bs-range-track-width);
height: var(--bs-range-track-height);
color: transparent;
cursor: var(--bs-range-track-cursor);
background-color: var(--bs-range-track-bg);
border-color: transparent;
border-radius: var(--bs-range-track-border-radius);
box-shadow: var(--bs-range-track-box-shadow);
}
.form-range::-moz-range-track {
width: var(--bs-range-track-width);
height: var(--bs-range-track-height);
color: transparent;
cursor: var(--bs-range-track-cursor);
background-color: var(--bs-range-track-bg);
border-color: transparent;
border-radius: var(--bs-range-track-border-radius);
box-shadow: var(--bs-range-track-box-shadow);
}
.form-range:disabled {
pointer-events: none;
}
.form-range:disabled::-webkit-slider-thumb {
background-color: var(--bs-range-thumb-disabled-bg);
}
.form-range:disabled::-moz-range-thumb {
background-color: var(--bs-range-thumb-disabled-bg);
}
}
@layer forms {
.form-floating {
--bs-form-floating-height: calc(3.5rem + var(--bs-border-width) * 2);
--bs-form-floating-line-height: 1.25;
--bs-form-floating-padding-x: var(--bs-btn-input-padding-x);
--bs-form-floating-padding-y: 1rem;
--bs-form-floating-input-padding-t: 1.625rem;
--bs-form-floating-input-padding-b: 0.625rem;
--bs-form-floating-label-height: 1.5em;
--bs-form-floating-label-opacity: 0.65;
--bs-form-floating-label-transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem);
--bs-form-floating-label-disabled-color: var(--bs-fg-3);
--bs-form-floating-transition-property: opacity, transform;
--bs-form-floating-transition-timing: 0.1s ease-in-out;
--bs-form-floating-transition: var(--bs-form-floating-transition-property) var(--bs-form-floating-transition-timing);
position: relative;
}
.form-floating > label {
position: absolute;
inset-block-start: 0;
inset-inline-start: 0;
z-index: 2;
display: flex;
align-items: center;
max-width: 100%;
height: 100%;
padding: var(--bs-form-floating-padding-y) var(--bs-form-floating-padding-x);
overflow: hidden;
color: color-mix(in oklch, var(--bs-fg-body) var(--bs-form-floating-label-opacity), transparent);
text-align: start;
text-overflow: ellipsis;
white-space: nowrap;
pointer-events: none;
border: var(--bs-input-btn-border-width) solid transparent;
transform-origin: 0 0;
transition: var(--bs-form-floating-transition);
}
@media (prefers-reduced-motion: reduce) {
.form-floating > label {
transition: none;
}
}
.form-floating > .form-control,
.form-floating > .form-control-plaintext {
height: var(--bs-form-floating-height);
min-height: var(--bs-form-floating-height);
padding: var(--bs-form-floating-padding-y) var(--bs-form-floating-padding-x);
line-height: var(--bs-form-floating-line-height);
}
.form-floating > .form-control::placeholder,
.form-floating > .form-control-plaintext::placeholder {
color: transparent;
}
.form-floating > .form-control:focus, .form-floating > .form-control:not(:placeholder-shown),
.form-floating > .form-control-plaintext:focus,
.form-floating > .form-control-plaintext:not(:placeholder-shown) {
padding-top: var(--bs-form-floating-input-padding-t);
padding-bottom: var(--bs-form-floating-input-padding-b);
}
.form-floating > .form-control:-webkit-autofill,
.form-floating > .form-control-plaintext:-webkit-autofill {
padding-top: var(--bs-form-floating-input-padding-t);
padding-bottom: var(--bs-form-floating-input-padding-b);
}
.form-floating > .form-control:focus ~ label,
.form-floating > .form-control:not(:placeholder-shown) ~ label,
.form-floating > .form-control-plaintext ~ label {
transform: var(--bs-form-floating-label-transform);
}
.form-floating > .form-control:-webkit-autofill ~ label {
transform: var(--bs-form-floating-label-transform);
}
.form-floating > textarea:focus ~ label::after,
.form-floating > textarea:not(:placeholder-shown) ~ label::after {
position: absolute;
inset: var(--bs-form-floating-padding-y) calc(var(--bs-form-floating-padding-x) * 0.5);
z-index: -1;
height: var(--bs-form-floating-label-height);
content: "";
background-color: var(--bs-control-bg);
border-radius: var(--bs-btn-input-border-radius);
}
.form-floating > textarea:disabled ~ label::after {
background-color: var(--bs-control-disabled-bg);
}
.form-floating > .form-control-plaintext ~ label {
border-width: var(--bs-control-border-width) 0;
}
.form-floating > :disabled ~ label,
.form-floating > .form-control:disabled ~ label {
color: var(--bs-form-floating-label-disabled-color);
}
}
@layer components {
.input-group {
--bs-input-group-addon-padding-y: var(--bs-btn-input-padding-y);
--bs-input-group-addon-padding-x: var(--bs-btn-input-padding-x);
--bs-input-group-addon-font-size: var(--bs-btn-input-font-size);
--bs-input-group-addon-line-height: var(--bs-btn-input-line-height);
--bs-input-group-addon-color: var(--bs-fg-body);
--bs-input-group-addon-bg: var(--bs-bg-2);
--bs-input-group-addon-border-color: var(--bs-border-color);
position: relative;
display: flex;
flex-wrap: wrap;
align-items: stretch;
width: 100%;
}
.input-group > .form-control,
.input-group > .form-floating {
position: relative;
flex: 1 1 auto;
width: 1%;
min-width: 0;
}
.input-group > .form-control:focus,
.input-group > .form-floating:focus-within {
z-index: 5;
}
.input-group > .input-group-btn {
position: relative;
z-index: 2;
}
.input-group > .input-group-btn:focus {
z-index: 5;
}
.input-group-text {
display: flex;
align-items: center;
padding: var(--bs-input-group-addon-padding-y) var(--bs-input-group-addon-padding-x);
font-size: var(--bs-input-group-addon-font-size);
line-height: var(--bs-input-group-addon-line-height);
color: var(--bs-input-group-addon-color);
text-align: center;
white-space: nowrap;
background-color: var(--bs-input-group-addon-bg);
border: var(--bs-border-width) solid var(--bs-input-group-addon-border-color);
border-radius: var(--bs-btn-input-border-radius);
}
.input-group-sm > .form-control,
.input-group-sm > .input-group-text,
.input-group-sm > .btn {
min-height: var(--bs-btn-input-sm-min-height);
padding: var(--bs-btn-input-sm-padding-y) var(--bs-btn-input-sm-padding-x);
font-size: var(--bs-btn-input-sm-font-size);
border-radius: var(--bs-btn-input-sm-border-radius);
}
.input-group-lg > .form-control,
.input-group-lg > .input-group-text,
.input-group-lg > .btn {
min-height: var(--bs-btn-input-lg-min-height);
padding: var(--bs-btn-input-lg-padding-y) var(--bs-btn-input-lg-padding-x);
font-size: var(--bs-btn-input-lg-font-size);
border-radius: var(--bs-btn-input-lg-border-radius);
}
.input-group:not(.has-validation) > :not(:last-child):not(.menu-toggle-split):not(.menu):not(.form-floating),
.input-group:not(.has-validation) > .menu-toggle-split:nth-last-child(n+3),
.input-group:not(.has-validation) > .form-floating:not(:last-child) > .form-control,
.input-group:not(.has-validation) > .form-floating:not(:last-child) > .form-select {
border-start-end-radius: 0;
border-end-end-radius: 0;
}
.input-group.has-validation > :nth-last-child(n+3):not(.menu-toggle-split):not(.menu):not(.form-floating),
.input-group.has-validation > .menu-toggle-split:nth-last-child(n+4),
.input-group.has-validation > .form-floating:nth-last-child(n+3) > .form-control,
.input-group.has-validation > .form-floating:nth-last-child(n+3) > .form-select {
border-start-end-radius: 0;
border-end-end-radius: 0;
}
.input-group > :not(:first-child):not(.menu) {
margin-inline-start: calc(-1 * var(--bs-border-width));
border-start-start-radius: 0;
border-end-start-radius: 0;
}
.input-group > .form-floating:not(:first-child) > .form-control,
.input-group > .form-floating:not(:first-child) > .form-select {
border-start-start-radius: 0;
border-end-start-radius: 0;
}
}
@layer forms {
.strength {
--bs-strength-height: 0.375rem;
--bs-strength-gap: 0.25rem;
--bs-strength-margin-top: 0.25rem;
--bs-strength-border-radius: var(--bs-border-radius-pill);
--bs-strength-bg: var(--bs-bg-2);
--bs-strength-color: var(--bs-bg-2);
--bs-strength-weak-color: var(--bs-danger-bg);
--bs-strength-fair-color: var(--bs-warning-bg);
--bs-strength-good-color: var(--bs-info-bg);
--bs-strength-strong-color: var(--bs-success-bg);
display: flex;
gap: var(--bs-strength-gap);
width: 100%;
margin-top: var(--bs-strength-margin-top);
}
.strength-segment {
flex: 1;
height: var(--bs-strength-height);
background-color: var(--bs-strength-bg);
border-radius: var(--bs-strength-border-radius);
transition: background-color 0.2s ease-in-out, width 0.3s ease-in-out;
}
@media (prefers-reduced-motion: reduce) {
.strength-segment {
transition: none;
}
}
.strength-segment.active {
background-color: var(--bs-strength-color);
}
.strength[data-bs-strength=weak] {
--bs-strength-color: var(--bs-strength-weak-color);
}
.strength[data-bs-strength=fair] {
--bs-strength-color: var(--bs-strength-fair-color);
}
.strength[data-bs-strength=good] {
--bs-strength-color: var(--bs-strength-good-color);
}
.strength[data-bs-strength=strong] {
--bs-strength-color: var(--bs-strength-strong-color);
}
.strength-text {
display: block;
margin-top: var(--bs-strength-margin-top);
font-size: var(--bs-font-size-xs);
color: var(--bs-strength-color, var(--bs-fg-3));
transition: color 0.2s ease-in-out;
}
@media (prefers-reduced-motion: reduce) {
.strength-text {
transition: none;
}
}
.strength-text:empty {
display: none;
}
.strength-bar {
--bs-strength-height: 0.375rem;
--bs-strength-gap: 0.25rem;
--bs-strength-margin-top: 0.25rem;
--bs-strength-border-radius: var(--bs-border-radius-pill);
--bs-strength-bg: var(--bs-bg-2);
--bs-strength-color: var(--bs-bg-2);
--bs-strength-weak-color: var(--bs-danger-bg);
--bs-strength-fair-color: var(--bs-warning-bg);
--bs-strength-good-color: var(--bs-info-bg);
--bs-strength-strong-color: var(--bs-success-bg);
--bs-strength-color: transparent;
--bs-strength-width: 0%;
width: 100%;
height: var(--bs-strength-height);
margin-top: var(--bs-strength-margin-top);
overflow: hidden;
background-color: var(--bs-strength-bg);
border-radius: var(--bs-strength-border-radius);
}
.strength-bar::after {
display: block;
width: var(--bs-strength-width);
height: 100%;
content: "";
background-color: var(--bs-strength-color);
border-radius: var(--bs-strength-border-radius);
transition: background-color 0.2s ease-in-out, width 0.3s ease-in-out;
}
@media (prefers-reduced-motion: reduce) {
.strength-bar::after {
transition: none;
}
}
.strength-bar[data-bs-strength=weak] {
--bs-strength-color: var(--bs-strength-weak-color);
--bs-strength-width: 25%;
}
.strength-bar[data-bs-strength=fair] {
--bs-strength-color: var(--bs-strength-fair-color);
--bs-strength-width: 50%;
}
.strength-bar[data-bs-strength=good] {
--bs-strength-color: var(--bs-strength-good-color);
--bs-strength-width: 75%;
}
.strength-bar[data-bs-strength=strong] {
--bs-strength-color: var(--bs-strength-strong-color);
--bs-strength-width: 100%;
}
}
@layer components {
.otp {
--bs-otp-size: var(--bs-btn-input-lg-min-height);
--bs-otp-font-size: var(--bs-btn-input-font-size);
--bs-otp-gap: 0.5rem;
display: inline-flex;
gap: var(--bs-otp-gap);
}
.otp .form-control {
width: var(--bs-otp-size);
min-height: var(--bs-otp-size);
padding: 0;
font-size: var(--bs-otp-font-size);
font-weight: 500;
line-height: 1;
text-align: center;
border-radius: var(--bs-otp-border-radius, var(--bs-btn-input-border-radius));
}
.otp .form-control::-webkit-outer-spin-button, .otp .form-control::-webkit-inner-spin-button {
margin: 0;
-webkit-appearance: none;
appearance: none;
}
.otp .form-control[type=number] {
-webkit-appearance: textfield;
appearance: textfield;
}
.otp .form-control:focus, .otp .form-control:focus-visible {
z-index: 1;
}
.otp.is-valid .form-control, .was-validated .otp:valid .form-control {
border-color: var(--bs-form-valid-border-color);
}
.otp.is-valid .form-control:focus, .was-validated .otp:valid .form-control:focus {
--bs-focus-ring-color: rgba(var(--bs-success-rgb), .25);
border-color: var(--bs-form-valid-border-color);
}
.otp.is-invalid .form-control, .was-validated .otp:invalid .form-control {
border-color: var(--bs-form-invalid-border-color);
}
.otp.is-invalid .form-control:focus, .was-validated .otp:invalid .form-control:focus {
--bs-focus-ring-color: rgba(var(--bs-danger-rgb), .25);
border-color: var(--bs-form-invalid-border-color);
}
.otp.input-group {
gap: 0;
width: auto;
}
.otp.input-group .form-control {
flex: 0 0 auto;
}
.otp-separator {
display: flex;
align-items: center;
padding-inline: var(--bs-otp-gap);
font-size: var(--bs-otp-font-size);
color: var(--bs-fg-4);
-webkit-user-select: none;
user-select: none;
}
.otp-sm {
--bs-otp-size: var(--bs-btn-input-sm-min-height);
--bs-otp-font-size: var(--bs-btn-input-sm-font-size);
--bs-otp-border-radius: var(--bs-btn-input-sm-border-radius);
}
.otp-lg {
--bs-otp-size: var(--bs-btn-input-lg-min-height);
--bs-otp-font-size: var(--bs-btn-input-lg-font-size);
--bs-otp-border-radius: var(--bs-btn-input-lg-border-radius);
}
}
@layer forms {
.form-adorn {
--bs-form-adorn-gap: 0.375rem;
--bs-form-adorn-icon-size: 1rem;
--bs-form-adorn-icon-color: var(--bs-fg-2);
gap: var(--bs-form-adorn-gap);
align-items: center;
}
.form-adorn:focus-visible {
outline: 0;
}
.form-adorn:focus-within {
--bs-focus-ring-offset: -1px;
border-color: var(--bs-focus-ring-color);
outline: var(--bs-focus-ring);
outline-offset: var(--bs-focus-ring-offset);
}
.form-adorn > .form-ghost {
flex: 1;
min-width: 0;
}
.form-adorn.form-adorn-end > .form-ghost {
order: -1;
}
.form-adorn-icon {
display: flex;
flex-shrink: 0;
align-items: center;
justify-content: center;
color: var(--bs-form-adorn-icon-color);
pointer-events: none;
}
.form-adorn-icon > svg {
width: var(--bs-form-adorn-icon-size);
height: var(--bs-form-adorn-icon-size);
}
.form-adorn-text {
flex-shrink: 0;
color: var(--bs-form-adorn-icon-color);
pointer-events: none;
-webkit-user-select: none;
user-select: none;
}
}
@layer forms {
.chip-input {
--bs-chip-input-padding-y: 0.75rem;
--bs-chip-input-padding-x: 0.75rem;
--bs-chip-input-gap: 0.375rem;
--bs-chip-input-ghost-min-width: 5rem;
--bs-control-fg: var(--bs-btn-input-fg);
--bs-control-bg: var(--bs-btn-input-bg);
--bs-control-border-width: var(--bs-border-width);
--bs-control-border-color: var(--bs-border-color);
--bs-control-border-radius: var(--bs-border-radius);
display: flex;
flex-wrap: wrap;
gap: var(--bs-chip-input-gap);
align-items: center;
padding: var(--bs-chip-input-padding-y) var(--bs-chip-input-padding-x);
color: var(--bs-control-fg);
background-color: var(--bs-control-bg);
border: var(--bs-control-border-width) solid var(--bs-control-border-color);
border-radius: var(--bs-control-border-radius);
}
.chip-input:focus-within {
--bs-focus-ring-offset: -1px;
border-color: var(--bs-focus-ring-color);
outline: var(--bs-focus-ring);
outline-offset: var(--bs-focus-ring-offset);
}
.chip-input > .form-ghost {
flex: 1 1 0;
min-width: var(--bs-chip-input-ghost-min-width);
min-height: 1.75rem;
}
.chip-input.disabled, .chip-input:has(.form-ghost:disabled) {
background-color: var(--bs-bg-2);
opacity: 1;
}
.chip-input.disabled > .chip, .chip-input:has(.form-ghost:disabled) > .chip {
opacity: var(--bs-control-disabled-opacity);
}
.chip-input.disabled > .chip .chip-dismiss, .chip-input:has(.form-ghost:disabled) > .chip .chip-dismiss {
pointer-events: none;
}
.chip-input.disabled > .form-ghost, .chip-input:has(.form-ghost:disabled) > .form-ghost {
cursor: not-allowed;
}
}
@layer components {
.combobox-toggle {
display: inline-flex;
gap: 0.5rem;
align-items: center;
justify-content: space-between;
width: 100%;
padding-inline-end: var(--bs-control-padding-x);
text-align: start;
cursor: pointer;
}
.combobox-toggle.show {
background-color: var(--bs-bg-1);
}
.combobox-toggle:disabled, .combobox-toggle.disabled {
cursor: not-allowed;
opacity: 0.65;
}
.combobox-value {
display: flex;
flex: 1;
gap: 0.5rem;
align-items: center;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.combobox-placeholder {
color: color-mix(in oklch, currentcolor 65%, transparent);
}
.combobox-caret {
flex-shrink: 0;
transition: transform 0.2s ease-in-out;
}
@media (prefers-reduced-motion: reduce) {
.combobox-caret {
transition: none;
}
}
.show > .combobox-caret {
transform: rotate(180deg);
}
.combobox-toggle + .menu {
--bs-menu-max-height: 300px;
--bs-menu-overflow-y: auto;
}
.combobox-search {
position: sticky;
top: 0;
z-index: 1;
padding: var(--bs-menu-padding-x, 0.25rem);
background-color: var(--bs-menu-bg, var(--bs-bg-body));
}
.combobox-search-input {
width: 100%;
}
.combobox-no-results {
padding: 1rem;
font-size: var(--bs-font-size-sm);
color: var(--bs-fg-3);
text-align: center;
}
}
@layer components {
.tooltip {
--bs-tooltip-zindex: 1080;
--bs-tooltip-max-width: 200px;
--bs-tooltip-padding-x: 0.75rem;
--bs-tooltip-padding-y: 0.375rem;
--bs-tooltip-font-size: var(--bs-font-size-sm);
--bs-tooltip-color: var(--bs-bg-body);
--bs-tooltip-bg: var(--bs-fg-body);
--bs-tooltip-border-radius: var(--bs-border-radius);
--bs-tooltip-opacity: 0.95;
--bs-tooltip-arrow-width: 0.8rem;
--bs-tooltip-arrow-height: 0.4rem;
z-index: var(--bs-tooltip-zindex);
display: block;
font-family: var(--bs-body-font-family);
font-style: normal;
font-weight: var(--bs-body-font-weight);
line-height: var(--bs-body-line-height);
text-align: start;
text-decoration: none;
text-shadow: none;
text-transform: none;
letter-spacing: normal;
word-break: normal;
white-space: normal;
word-spacing: normal;
line-break: auto;
font-size: var(--bs-tooltip-font-size);
word-wrap: break-word;
opacity: 0;
}
.tooltip.show {
opacity: var(--bs-tooltip-opacity);
}
.tooltip .tooltip-arrow {
display: block;
width: var(--bs-tooltip-arrow-width);
height: var(--bs-tooltip-arrow-height);
}
.tooltip .tooltip-arrow::before {
position: absolute;
content: "";
border-color: transparent;
border-style: solid;
}
.bs-tooltip-top .tooltip-arrow, .bs-tooltip-auto[data-bs-placement^=top] .tooltip-arrow {
bottom: calc(-1 * var(--bs-tooltip-arrow-height));
}
.bs-tooltip-top .tooltip-arrow::before, .bs-tooltip-auto[data-bs-placement^=top] .tooltip-arrow::before {
top: -1px;
border-width: var(--bs-tooltip-arrow-height) calc(var(--bs-tooltip-arrow-width) * 0.5) 0;
border-block-start-color: var(--bs-tooltip-bg);
}
.bs-tooltip-end .tooltip-arrow, .bs-tooltip-auto[data-bs-placement^=right] .tooltip-arrow {
left: calc(-1 * var(--bs-tooltip-arrow-height));
width: var(--bs-tooltip-arrow-height);
height: var(--bs-tooltip-arrow-width);
}
.bs-tooltip-end .tooltip-arrow::before, .bs-tooltip-auto[data-bs-placement^=right] .tooltip-arrow::before {
right: -1px;
border-width: calc(var(--bs-tooltip-arrow-width) * 0.5) var(--bs-tooltip-arrow-height) calc(var(--bs-tooltip-arrow-width) * 0.5) 0;
border-inline-end-color: var(--bs-tooltip-bg);
}
.bs-tooltip-bottom .tooltip-arrow, .bs-tooltip-auto[data-bs-placement^=bottom] .tooltip-arrow {
top: calc(-1 * var(--bs-tooltip-arrow-height));
}
.bs-tooltip-bottom .tooltip-arrow::before, .bs-tooltip-auto[data-bs-placement^=bottom] .tooltip-arrow::before {
bottom: -1px;
border-width: 0 calc(var(--bs-tooltip-arrow-width) * 0.5) var(--bs-tooltip-arrow-height);
border-block-end-color: var(--bs-tooltip-bg);
}
.bs-tooltip-start .tooltip-arrow, .bs-tooltip-auto[data-bs-placement^=left] .tooltip-arrow {
right: calc(-1 * var(--bs-tooltip-arrow-height));
width: var(--bs-tooltip-arrow-height);
height: var(--bs-tooltip-arrow-width);
}
.bs-tooltip-start .tooltip-arrow::before, .bs-tooltip-auto[data-bs-placement^=left] .tooltip-arrow::before {
left: -1px;
border-width: calc(var(--bs-tooltip-arrow-width) * 0.5) 0 calc(var(--bs-tooltip-arrow-width) * 0.5) var(--bs-tooltip-arrow-height);
border-inline-start-color: var(--bs-tooltip-bg);
}
.tooltip-inner {
max-width: var(--bs-tooltip-max-width);
padding: var(--bs-tooltip-padding-y) var(--bs-tooltip-padding-x);
color: var(--bs-tooltip-color);
text-align: center;
background-color: var(--bs-tooltip-bg);
border-radius: var(--bs-tooltip-border-radius);
}
}
@layer components {
.valid-feedback {
display: none;
width: 100%;
margin-top: 0.5rem;
font-size: var(--bs-font-size-xs);
color: var(--bs-form-valid-color);
}
.valid-tooltip {
position: absolute;
top: 100%;
z-index: 5;
display: none;
max-width: 100%;
padding: var(--bs-tooltip-padding-y) var(--bs-tooltip-padding-x);
margin-top: 0.1rem;
font-size: var(--bs-tooltip-font-size);
color: var(--bs-success-contrast);
background-color: var(--bs-success-bg);
border-radius: var(--bs-tooltip-border-radius);
}
.was-validated :valid ~ .valid-feedback,
.was-validated :valid ~ .valid-tooltip,
.is-valid ~ .valid-feedback,
.is-valid ~ .valid-tooltip {
display: block;
}
.was-validated .form-control:valid, .form-control.is-valid {
border-color: var(--bs-success-border);
padding-inline-end: calc(var(--bs-control-padding-x) * 3.5);
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%2300a748' d='M2.3 6.73.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1'/%3e%3c/svg%3e");
background-repeat: no-repeat;
background-position: right var(--bs-control-padding-x) center;
background-size: 1rem;
}
.was-validated .form-control:valid:focus-visible, .form-control.is-valid:focus-visible {
outline: var(--bs-focus-ring-width) solid var(--bs-success-focus-ring);
outline-offset: var(--bs-focus-ring-offset);
border-color: var(--bs-success-border);
}
.was-validated textarea.form-control:valid, textarea.form-control.is-valid {
background-position: right var(--bs-control-padding-x) top var(--bs-control-padding-x);
}
.was-validated .form-check-input:valid, .form-check-input.is-valid {
border-color: var(--bs-success-border);
}
.was-validated .form-check-input:valid:checked, .form-check-input.is-valid:checked {
background-color: var(--bs-form-valid-color);
}
.was-validated .form-check-input:valid ~ .form-check-label, .form-check-input.is-valid ~ .form-check-label {
color: var(--bs-form-valid-color);
}
.form-check-inline .form-check-input ~ .valid-feedback {
margin-inline-start: 0.5em;
}
.was-validated .input-group > .form-control:not(:focus):valid, .input-group > .form-control:not(:focus).is-valid,
.was-validated .input-group > .form-select:not(:focus):valid,
.input-group > .form-select:not(:focus).is-valid,
.was-validated .input-group > .form-floating:not(:focus-within):valid,
.input-group > .form-floating:not(:focus-within).is-valid {
z-index: 3;
}
.invalid-feedback {
display: none;
width: 100%;
margin-top: 0.5rem;
font-size: var(--bs-font-size-xs);
color: var(--bs-form-invalid-color);
}
.invalid-tooltip {
position: absolute;
top: 100%;
z-index: 5;
display: none;
max-width: 100%;
padding: var(--bs-tooltip-padding-y) var(--bs-tooltip-padding-x);
margin-top: 0.1rem;
font-size: var(--bs-tooltip-font-size);
color: var(--bs-danger-contrast);
background-color: var(--bs-danger-bg);
border-radius: var(--bs-tooltip-border-radius);
}
.was-validated :invalid ~ .invalid-feedback,
.was-validated :invalid ~ .invalid-tooltip,
.is-invalid ~ .invalid-feedback,
.is-invalid ~ .invalid-tooltip {
display: block;
}
.was-validated .form-control:invalid, .form-control.is-invalid {
border-color: var(--bs-danger-border);
padding-inline-end: calc(var(--bs-control-padding-x) * 3.5);
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dd0d37'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dd0d37' stroke='none'/%3e%3c/svg%3e");
background-repeat: no-repeat;
background-position: right var(--bs-control-padding-x) center;
background-size: 1rem;
}
.was-validated .form-control:invalid:focus-visible, .form-control.is-invalid:focus-visible {
outline: var(--bs-focus-ring-width) solid var(--bs-danger-focus-ring);
outline-offset: var(--bs-focus-ring-offset);
border-color: var(--bs-danger-border);
}
.was-validated textarea.form-control:invalid, textarea.form-control.is-invalid {
background-position: right var(--bs-control-padding-x) top var(--bs-control-padding-x);
}
.was-validated .form-check-input:invalid, .form-check-input.is-invalid {
border-color: var(--bs-danger-border);
}
.was-validated .form-check-input:invalid:checked, .form-check-input.is-invalid:checked {
background-color: var(--bs-form-invalid-color);
}
.was-validated .form-check-input:invalid ~ .form-check-label, .form-check-input.is-invalid ~ .form-check-label {
color: var(--bs-form-invalid-color);
}
.form-check-inline .form-check-input ~ .invalid-feedback {
margin-inline-start: 0.5em;
}
.was-validated .input-group > .form-control:not(:focus):invalid, .input-group > .form-control:not(:focus).is-invalid,
.was-validated .input-group > .form-select:not(:focus):invalid,
.input-group > .form-select:not(:focus).is-invalid,
.was-validated .input-group > .form-floating:not(:focus-within):invalid,
.input-group > .form-floating:not(:focus-within).is-invalid {
z-index: 4;
}
}
@layer components {
.btn, .btn-link, .btn-icon, .btn-solid, .btn-outline, .btn-subtle, .btn-text {
--bs-btn-min-height: var(--bs-btn-input-min-height);
--bs-btn-padding-x: var(--bs-btn-input-padding-x);
--bs-btn-padding-y: var(--bs-btn-input-padding-y);
--bs-btn-font-size: var(--bs-btn-input-font-size);
--bs-btn-font-weight: var(--bs-btn-input-font-weight);
--bs-btn-line-height: var(--bs-btn-input-line-height);
--bs-btn-color: var(--bs-fg-body);
--bs-btn-white-space: nowrap;
--bs-btn-border-width: var(--bs-border-width);
--bs-btn-border-color: transparent;
--bs-btn-border-radius: var(--bs-border-radius);
--bs-btn-hover-border-color: transparent;
--bs-btn-disabled-opacity: 0.65;
--bs-btn-transition-timing: 0.15s ease-in-out;
--bs-btn-transition-property: color, background-color, border-color, box-shadow;
--bs-btn-transition: var(--bs-btn-transition-property) var(--bs-btn-transition-timing);
display: inline-flex;
gap: var(--bs-btn-gap, 0.25rem);
align-items: center;
justify-content: center;
min-height: var(--bs-btn-min-height);
padding: var(--bs-btn-padding-y) var(--bs-btn-padding-x);
font-size: var(--bs-btn-font-size);
font-weight: var(--bs-btn-font-weight);
line-height: var(--bs-btn-line-height);
color: var(--bs-btn-color);
text-decoration: none;
white-space: var(--bs-btn-white-space);
vertical-align: middle;
cursor: pointer;
-webkit-user-select: none;
user-select: none;
background-color: var(--bs-btn-bg, var(--bs-bg-2));
border: var(--bs-btn-border-width) solid var(--bs-btn-border-color);
border-radius: var(--bs-btn-border-radius);
transition: var(--bs-btn-transition);
}
@media (prefers-reduced-motion: reduce) {
.btn, .btn-link, .btn-icon, .btn-solid, .btn-outline, .btn-subtle, .btn-text {
transition: none;
}
}
.btn:hover, .btn-link:hover, .btn-icon:hover, .btn-solid:hover, .btn-outline:hover, .btn-subtle:hover, .btn-text:hover {
color: var(--bs-btn-hover-color);
background-color: var(--bs-btn-hover-bg, var(--bs-bg-3));
border-color: var(--bs-btn-hover-border-color);
}
.btn:focus-visible, .btn-link:focus-visible, .btn-icon:focus-visible, .btn-solid:focus-visible, .btn-outline:focus-visible, .btn-subtle:focus-visible, .btn-text:focus-visible {
outline: var(--bs-focus-ring);
outline-offset: var(--bs-focus-ring-offset);
--bs-focus-ring-offset: 1px;
}
.btn.active, .btn.show, .btn-link.active, .btn-link.show, .btn-icon.active, .btn-icon.show, .btn-solid.active, .btn-solid.show, .btn-outline.active, .btn-outline.show, .btn-subtle.active, .btn-subtle.show, .btn-text.active, .btn-text.show {
color: var(--bs-btn-active-color);
background-color: var(--bs-btn-active-bg, var(--bs-bg-3));
border-color: var(--bs-btn-active-border-color);
}
.btn.active:focus-visible, .btn.show:focus-visible, .btn-link.active:focus-visible, .btn-link.show:focus-visible, .btn-icon.active:focus-visible, .btn-icon.show:focus-visible, .btn-solid.active:focus-visible, .btn-solid.show:focus-visible, .btn-outline.active:focus-visible, .btn-outline.show:focus-visible, .btn-subtle.active:focus-visible, .btn-subtle.show:focus-visible, .btn-text.active:focus-visible, .btn-text.show:focus-visible {
outline: var(--bs-focus-ring);
outline-offset: var(--bs-focus-ring-offset);
}
.btn:disabled, .btn.disabled, fieldset:disabled .btn, .btn-link:disabled, .btn-link.disabled, fieldset:disabled .btn-link, .btn-icon:disabled, .btn-icon.disabled, fieldset:disabled .btn-icon, .btn-solid:disabled, .btn-solid.disabled, fieldset:disabled .btn-solid, .btn-outline:disabled, .btn-outline.disabled, fieldset:disabled .btn-outline, .btn-subtle:disabled, .btn-subtle.disabled, fieldset:disabled .btn-subtle, .btn-text:disabled, .btn-text.disabled, fieldset:disabled .btn-text {
color: var(--bs-btn-disabled-color);
pointer-events: none;
background-color: var(--bs-btn-disabled-bg, var(--bs-bg-1));
border-color: var(--bs-btn-disabled-border-color);
opacity: var(--bs-btn-disabled-opacity);
}
.btn-solid {
--bs-btn-bg: var(--bs-theme-bg);
--bs-btn-color: var(--bs-theme-contrast);
--bs-btn-border-color: var(--bs-theme-bg);
--bs-btn-active-bg: oklch(from var(--bs-theme-bg) calc(l * .9) calc(c * 1.15) h);
--bs-btn-active-border-color: oklch(from var(--bs-theme-bg) calc(l * .9) calc(c * 1.15) h);
--bs-btn-active-color: oklch(from var(--bs-theme-contrast) calc(l * .9) calc(c * 1.15) h);
--bs-btn-disabled-bg: var(--bs-theme-bg);
--bs-btn-disabled-color: var(--bs-theme-contrast);
--bs-btn-disabled-border-color: var(--bs-theme-bg);
}
.btn-solid:hover {
--bs-btn-hover-bg: oklch(from var(--bs-theme-bg) calc(l * .95) calc(c * 1.1) h);
--bs-btn-hover-border-color: oklch(from var(--bs-theme-bg) calc(l * .95) calc(c * 1.1) h);
--bs-btn-hover-color: oklch(from var(--bs-theme-contrast) calc(l * .95) calc(c * 1.1) h);
}
.btn-solid:focus-visible {
outline-color: var(--bs-theme-focus-ring);
}
.btn-solid:active, .btn-solid.active, .btn-solid.btn-check:has(input:checked) {
--bs-btn-active-bg: oklch(from var(--bs-theme-bg) calc(l * .9) calc(c * 1.15) h);
--bs-btn-active-border-color: oklch(from var(--bs-theme-bg) calc(l * .9) calc(c * 1.15) h);
--bs-btn-active-color: oklch(from var(--bs-theme-contrast) calc(l * .9) calc(c * 1.15) h);
}
.btn-solid:disabled, .btn-solid.disabled, .btn-solid.btn-check:has(input:disabled) {
--bs-btn-disabled-bg: var(--bs-theme-bg);
--bs-btn-disabled-color: var(--bs-theme-contrast);
--bs-btn-disabled-border-color: var(--bs-theme-bg);
}
.btn-outline {
--bs-btn-bg: transparent;
--bs-btn-color: var(--bs-theme-text);
--bs-btn-border-color: var(--bs-theme-border);
--bs-btn-active-bg: oklch(from var(--bs-theme-bg) calc(l * .9) calc(c * 1.15) h);
--bs-btn-active-color: oklch(from var(--bs-theme-contrast) calc(l * .9) calc(c * 1.15) h);
--bs-btn-active-border-color: oklch(from var(--bs-theme-bg) calc(l * .9) calc(c * 1.15) h);
--bs-btn-disabled-bg: transparent;
--bs-btn-disabled-color: var(--bs-theme-text);
--bs-btn-disabled-border-color: var(--bs-theme-border);
}
.btn-outline:hover {
--bs-btn-hover-bg: oklch(from var(--bs-theme-bg) calc(l * .95) calc(c * 1.1) h);
--bs-btn-hover-color: oklch(from var(--bs-theme-contrast) calc(l * .95) calc(c * 1.1) h);
--bs-btn-hover-border-color: oklch(from var(--bs-theme-bg) calc(l * .95) calc(c * 1.1) h);
}
.btn-outline:focus-visible {
outline-color: var(--bs-theme-focus-ring);
}
.btn-outline:active, .btn-outline.active, .btn-outline.btn-check:has(input:checked) {
--bs-btn-active-bg: oklch(from var(--bs-theme-bg) calc(l * .9) calc(c * 1.15) h);
--bs-btn-active-color: oklch(from var(--bs-theme-contrast) calc(l * .9) calc(c * 1.15) h);
--bs-btn-active-border-color: oklch(from var(--bs-theme-bg) calc(l * .9) calc(c * 1.15) h);
}
.btn-outline:disabled, .btn-outline.disabled, .btn-outline.btn-check:has(input:disabled) {
--bs-btn-disabled-bg: transparent;
--bs-btn-disabled-color: var(--bs-theme-text);
--bs-btn-disabled-border-color: var(--bs-theme-border);
}
.btn-subtle {
--bs-btn-bg: var(--bs-theme-bg-subtle);
--bs-btn-color: var(--bs-theme-text);
--bs-btn-border-color: transparent;
--bs-btn-active-bg: var(--bs-theme-bg-subtle);
--bs-btn-active-color: oklch(from var(--bs-theme-text-emphasis) calc(l * .9) calc(c * 1.15) h);
--bs-btn-disabled-bg: var(--bs-theme-bg-subtle);
--bs-btn-disabled-color: var(--bs-theme-text);
--bs-btn-disabled-border-color: transparent;
}
.btn-subtle:hover {
--bs-btn-hover-bg: color-mix(in oklch, var(--bs-theme-bg-muted) 50%, var(--bs-theme-bg-subtle));
--bs-btn-hover-color: oklch(from var(--bs-theme-text-emphasis) calc(l * .95) calc(c * 1.1) h);
}
.btn-subtle:focus-visible {
outline-color: var(--bs-theme-focus-ring);
}
.btn-subtle:active, .btn-subtle.active, .btn-subtle.btn-check:has(input:checked) {
--bs-btn-active-bg: var(--bs-theme-bg-subtle);
--bs-btn-active-color: oklch(from var(--bs-theme-text-emphasis) calc(l * .9) calc(c * 1.15) h);
}
.btn-subtle:disabled, .btn-subtle.disabled, .btn-subtle.btn-check:has(input:disabled) {
--bs-btn-disabled-bg: var(--bs-theme-bg-subtle);
--bs-btn-disabled-color: var(--bs-theme-text);
--bs-btn-disabled-border-color: transparent;
}
.btn-text {
--bs-btn-color: var(--bs-theme-text);
--bs-btn-bg: transparent;
--bs-btn-border-color: transparent;
--bs-btn-active-color: oklch(from var(--bs-theme-text) calc(l * .9) calc(c * 1.15) h);
--bs-btn-active-bg: var(--bs-theme-bg-subtle);
--bs-btn-disabled-color: var(--bs-theme-text);
--bs-btn-disabled-bg: transparent;
--bs-btn-disabled-border-color: transparent;
}
.btn-text:hover {
--bs-btn-hover-color: oklch(from var(--bs-theme-text) calc(l * .95) calc(c * 1.1) h);
--bs-btn-hover-bg: var(--bs-theme-bg-subtle);
}
.btn-text:focus-visible {
outline-color: var(--bs-theme-focus-ring);
}
.btn-text:active, .btn-text.active, .btn-text.btn-check:has(input:checked) {
--bs-btn-active-color: oklch(from var(--bs-theme-text) calc(l * .9) calc(c * 1.15) h);
--bs-btn-active-bg: var(--bs-theme-bg-subtle);
}
.btn-text:disabled, .btn-text.disabled, .btn-text.btn-check:has(input:disabled) {
--bs-btn-disabled-color: var(--bs-theme-text);
--bs-btn-disabled-bg: transparent;
--bs-btn-disabled-border-color: transparent;
}
.btn-link {
--bs-btn-font-weight: var(--bs-font-weight-normal);
--bs-btn-color: var(--bs-link-color);
--bs-btn-bg: transparent;
--bs-btn-border-color: transparent;
--bs-btn-hover-color: var(--bs-link-hover-color);
--bs-btn-hover-bg: transparent;
--bs-btn-hover-border-color: transparent;
--bs-btn-active-color: var(--bs-link-hover-color);
--bs-btn-active-bg: transparent;
--bs-btn-active-border-color: transparent;
--bs-btn-disabled-color: var(--bs-fg-3);
--bs-btn-disabled-border-color: transparent;
color: var(--bs-theme-text, var(--bs-btn-color));
-webkit-text-decoration: var(--bs-link-decoration);
text-decoration: var(--bs-link-decoration);
}
.btn-link:focus-visible {
color: var(--bs-theme-text, var(--bs-btn-color));
}
.btn-link:hover {
color: var(--bs-theme-text-emphasis, var(--bs-btn-hover-color));
}
.btn-xs,
.btn-group-xs > [class*=btn-] {
--bs-btn-min-height: var(--bs-btn-input-xs-min-height);
--bs-btn-padding-y: var(--bs-btn-input-xs-padding-y);
--bs-btn-padding-x: var(--bs-btn-input-xs-padding-x);
--bs-btn-font-size: var(--bs-btn-input-xs-font-size);
--bs-btn-line-height: var(--bs-btn-input-xs-line-height);
--bs-btn-border-radius: var(--bs-btn-input-xs-border-radius);
}
.btn-sm,
.btn-group-sm > [class*=btn-] {
--bs-btn-min-height: var(--bs-btn-input-sm-min-height);
--bs-btn-padding-y: var(--bs-btn-input-sm-padding-y);
--bs-btn-padding-x: var(--bs-btn-input-sm-padding-x);
--bs-btn-font-size: var(--bs-btn-input-sm-font-size);
--bs-btn-line-height: var(--bs-btn-input-sm-line-height);
--bs-btn-border-radius: var(--bs-btn-input-sm-border-radius);
}
.btn-lg,
.btn-group-lg > [class*=btn-] {
--bs-btn-min-height: var(--bs-btn-input-lg-min-height);
--bs-btn-padding-y: var(--bs-btn-input-lg-padding-y);
--bs-btn-padding-x: var(--bs-btn-input-lg-padding-x);
--bs-btn-font-size: var(--bs-btn-input-lg-font-size);
--bs-btn-line-height: var(--bs-btn-input-lg-line-height);
--bs-btn-border-radius: var(--bs-btn-input-lg-border-radius);
}
.btn-icon {
align-items: center;
justify-content: center;
aspect-ratio: 1;
padding: 0;
}
.btn-check > input {
position: absolute;
clip: rect(0, 0, 0, 0);
pointer-events: none;
}
.btn-check:has(input:checked) {
color: var(--bs-btn-active-color);
background-color: var(--bs-btn-active-bg, var(--bs-bg-3));
border-color: var(--bs-btn-active-border-color);
box-shadow: var(--bs-btn-active-shadow);
}
.btn-check:has(input:focus-visible) {
outline: var(--bs-focus-ring);
outline-offset: var(--bs-focus-ring-offset);
--bs-focus-ring-offset: 1px;
}
.btn-check:has(input:disabled) {
color: var(--bs-btn-disabled-color);
pointer-events: none;
background-color: var(--bs-btn-disabled-bg, var(--bs-bg-1));
border-color: var(--bs-btn-disabled-border-color);
opacity: var(--bs-btn-disabled-opacity);
box-shadow: none;
}
.btn-styled {
--bs-btn-gradient-start: rgba(255, 255, 255, 0.125);
--bs-btn-gradient-end: rgba(0, 0, 0, 0.075);
--bs-btn-border-mix-color: #000;
--bs-btn-border-mix-amount: 10%;
--bs-btn-border-hover-mix-amount: 12.5%;
--bs-btn-border-active-mix-amount: 20%;
--bs-btn-shadow: 0 1px 2px rgb(0 0 0 / 15%), inset 0 1px 0 rgb(255 255 255 / 10%);
--bs-btn-active-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15);
background-image: linear-gradient(to bottom, var(--bs-btn-gradient-start), var(--bs-btn-gradient-end));
border-color: color-mix(in lab, var(--bs-theme-bg), var(--bs-btn-border-mix-color) var(--bs-btn-border-mix-amount));
box-shadow: var(--bs-btn-shadow);
}
.btn-styled:hover {
background-image: linear-gradient(to bottom, var(--bs-btn-gradient-start), var(--bs-btn-gradient-end));
border-color: color-mix(in lab, var(--bs-theme-bg), var(--bs-btn-border-mix-color) var(--bs-btn-border-hover-mix-amount));
}
.btn-styled:active, .btn-styled.active {
background-image: none;
border-color: color-mix(in lab, var(--bs-theme-bg), var(--bs-btn-border-mix-color) var(--bs-btn-border-active-mix-amount));
box-shadow: var(--bs-btn-active-shadow);
}
.btn-styled:disabled, .btn-styled.disabled {
background-image: none;
box-shadow: none;
}
}
@layer components {
.btn-group,
.btn-group-vertical {
position: relative;
display: inline-flex;
vertical-align: middle;
}
.btn-group > [class*=btn-],
.btn-group-vertical > [class*=btn-] {
position: relative;
flex: 1 1 auto;
}
.btn-group > [class*=btn-]:hover,
.btn-group-vertical > [class*=btn-]:hover {
z-index: 1;
}
.btn-group > .btn-check:has(input:checked),
.btn-group > [class*=btn-]:active,
.btn-group > [class*=btn-].active,
.btn-group-vertical > .btn-check:has(input:checked),
.btn-group-vertical > [class*=btn-]:active,
.btn-group-vertical > [class*=btn-].active {
z-index: 2;
}
.btn-group > .btn-check:has(input:focus),
.btn-group > [class*=btn-]:focus,
.btn-group-vertical > .btn-check:has(input:focus),
.btn-group-vertical > [class*=btn-]:focus {
z-index: 3;
}
.btn-toolbar {
display: flex;
flex-wrap: wrap;
gap: 0.5rem;
justify-content: flex-start;
}
.btn-toolbar .input-group {
width: auto;
}
.btn-group {
border-radius: var(--bs-btn-border-radius);
}
.btn-group > [class*=btn-]:not(:first-child),
.btn-group > .btn-group:not(:first-child) {
margin-inline-start: calc(-1 * var(--bs-btn-border-width));
}
.btn-group > [class*=btn-]:not(:last-child):not(:has(+ .menu)),
.btn-group > .btn-group:not(:last-child) > [class*=btn-] {
border-start-end-radius: 0;
border-end-end-radius: 0;
}
.btn-group > [class*=btn-]:not(:first-child),
.btn-group > .btn-group:not(:first-child) > [class*=btn-] {
border-start-start-radius: 0;
border-end-start-radius: 0;
}
.btn-group-vertical {
flex-direction: column;
align-items: flex-start;
justify-content: center;
}
.btn-group-vertical > [class*=btn-],
.btn-group-vertical > .btn-group {
width: 100%;
}
.btn-group-vertical > [class*=btn-]:not(:first-child),
.btn-group-vertical > .btn-group:not(:first-child) {
margin-top: calc(-1 * var(--bs-btn-border-width));
}
.btn-group-vertical > [class*=btn-]:not(:last-child):not(:has(+ .menu)),
.btn-group-vertical > .btn-group:not(:last-child) > [class*=btn-] {
border-end-start-radius: 0;
border-end-end-radius: 0;
}
.btn-group-vertical > [class*=btn-]:not(:first-child),
.btn-group-vertical > .btn-group:not(:first-child) > [class*=btn-] {
border-start-start-radius: 0;
border-start-end-radius: 0;
}
}
@layer components {
.btn-close {
--bs-btn-close-size: 1.25rem;
--bs-btn-close-color: var(--bs-fg-body);
--bs-btn-close-opacity: 0.5;
--bs-btn-close-hover-opacity: 0.75;
--bs-btn-close-focus-opacity: 0.85;
--bs-btn-close-disabled-opacity: 0.25;
box-sizing: content-box;
width: var(--bs-btn-close-size);
height: var(--bs-btn-close-size);
padding: 0;
color: var(--bs-btn-close-color);
background: transparent;
border: 0;
border-radius: var(--bs-border-radius-sm);
opacity: var(--bs-btn-close-opacity);
}
.btn-close > svg {
display: block;
width: 100%;
height: 100%;
fill: currentcolor;
}
.btn-close:hover {
color: var(--bs-btn-close-color);
text-decoration: none;
opacity: var(--bs-btn-close-hover-opacity);
}
.btn-close:focus-visible {
opacity: var(--bs-btn-close-focus-opacity);
outline: var(--bs-focus-ring);
}
.btn-close:disabled, .btn-close.disabled {
pointer-events: none;
-webkit-user-select: none;
user-select: none;
opacity: var(--bs-btn-close-disabled-opacity);
}
}
@layer components {
.accordion {
--bs-accordion-padding-x: 1.25rem;
--bs-accordion-padding-y: 1rem;
--bs-accordion-color: var(--bs-fg-body);
--bs-accordion-bg: var(--bs-bg-body);
--bs-accordion-transition-property: color, background-color, border-radius;
--bs-accordion-transition-timing: .15s ease-in-out;
--bs-accordion-transition: var(--bs-accordion-transition-property) var(--bs-accordion-timing);
--bs-accordion-border-color: var(--bs-border-color);
--bs-accordion-border-width: var(--bs-border-width);
--bs-accordion-border-radius: var(--bs-accordion-radius, var(--bs-border-radius-lg));
--bs-accordion-btn-color: var(--bs-fg-2);
--bs-accordion-btn-bg: var(--bs-bg-body);
--bs-accordion-btn-icon-width: 1rem;
--bs-accordion-btn-icon-transform: rotate(-180deg);
--bs-accordion-btn-icon-transition: transform 0.2s ease-in-out;
--bs-accordion-active-color: var(--bs-fg);
--bs-accordion-active-bg: var(--bs-bg-2);
}
.accordion-header {
display: flex;
align-items: center;
width: 100%;
padding: var(--bs-accordion-btn-padding-y, var(--bs-accordion-padding-y)) var(--bs-accordion-btn-padding-x, var(--bs-accordion-padding-x));
font-size: var(--bs-accordion-font-size, var(--bs-font-size-base));
color: var(--bs-accordion-btn-color);
text-align: start;
list-style: none;
cursor: pointer;
background-color: var(--bs-accordion-btn-bg);
transition: var(--bs-accordion-transition);
}
@media (prefers-reduced-motion: reduce) {
.accordion-header {
transition: none;
}
}
.accordion-header .accordion-icon {
flex-shrink: 0;
width: var(--bs-accordion-btn-icon-width);
height: var(--bs-accordion-btn-icon-width);
margin-inline-start: auto;
color: currentcolor;
transition: var(--bs-accordion-btn-icon-transition);
}
@media (prefers-reduced-motion: reduce) {
.accordion-header .accordion-icon {
transition: none;
}
}
.accordion-header:hover {
z-index: 2;
}
.accordion-header:focus-visible {
position: relative;
z-index: 3;
outline: var(--bs-focus-ring);
outline-offset: var(--bs-focus-ring-offset);
outline-offset: -1px;
}
.accordion-item {
color: var(--bs-accordion-color);
background-color: var(--bs-accordion-bg);
border: var(--bs-accordion-border-width) solid var(--bs-accordion-border-color);
}
.accordion-item:first-of-type {
border-start-start-radius: var(--bs-accordion-border-radius);
border-start-end-radius: var(--bs-accordion-border-radius);
}
.accordion-item:first-of-type > .accordion-header {
border-start-start-radius: calc(var(--bs-accordion-border-radius) - var(--bs-accordion-border-width));
border-start-end-radius: calc(var(--bs-accordion-border-radius) - var(--bs-accordion-border-width));
}
.accordion-item:not(:first-of-type) {
border-block-start: 0;
}
.accordion-item:last-of-type {
border-end-start-radius: var(--bs-accordion-border-radius);
border-end-end-radius: var(--bs-accordion-border-radius);
}
.accordion-item:last-of-type > .accordion-header {
border-end-start-radius: calc(var(--bs-accordion-border-radius) - var(--bs-accordion-border-width));
border-end-end-radius: calc(var(--bs-accordion-border-radius) - var(--bs-accordion-border-width));
}
.accordion-item:last-of-type > .accordion-body {
border-end-start-radius: var(--bs-accordion-border-radius);
border-end-end-radius: var(--bs-accordion-border-radius);
}
.accordion-item[open] {
border-color: var(--bs-theme-border, var(--bs-accordion-border-color));
}
.accordion-item[open] > .accordion-header {
color: var(--bs-theme-text, var(--bs-accordion-active-color));
background-color: var(--bs-theme-bg-subtle, var(--bs-accordion-active-bg));
box-shadow: inset 0 calc(-1 * var(--bs-accordion-border-width)) 0 var(--bs-theme-border, var(--bs-accordion-border-color));
}
.accordion-item[open] > .accordion-header .accordion-icon {
transform: var(--bs-accordion-btn-icon-transform);
}
.accordion-item[open]:last-of-type > .accordion-header {
border-end-start-radius: 0;
border-end-end-radius: 0;
}
.accordion-body {
padding: var(--bs-accordion-body-padding-y, var(--bs-accordion-padding-y)) var(--bs-accordion-body-padding-x, var(--bs-accordion-padding-x));
}
.accordion-flush > .accordion-item {
border-inline: 0;
border-radius: 0;
}
.accordion-flush > .accordion-item:first-child {
border-block-start: 0;
}
.accordion-flush > .accordion-item:last-child {
border-block-end: 0;
}
.accordion-flush > .accordion-item > .accordion-header,
.accordion-flush > .accordion-item > .accordion-body {
border-radius: 0;
}
}
@layer components {
.alert {
--bs-alert-gap: 0.75rem;
--bs-alert-bg: var(--bs-theme-bg-subtle, var(--bs-bg-1));
--bs-alert-padding-x: 1rem;
--bs-alert-padding-y: 1rem;
--bs-alert-color: var(--bs-theme-text, inherit);
--bs-alert-border-color: var(--bs-theme-border, var(--bs-border-color));
--bs-alert-border: var(--bs-border-width) solid var(--bs-alert-border-color);
--bs-alert-border-radius: var(--bs-border-radius);
--bs-alert-link-color: inherit;
--bs-hr-border-color: var(--bs-theme-border, var(--bs-border-color));
display: flex;
gap: var(--bs-alert-gap);
align-items: start;
padding: var(--bs-alert-padding-y) var(--bs-alert-padding-x);
color: var(--bs-alert-color);
background-color: var(--bs-alert-bg);
border: var(--bs-alert-border);
border-radius: var(--bs-alert-border-radius);
}
.alert-heading {
color: inherit;
}
.alert-link {
font-weight: var(--bs-font-weight-semibold);
color: var(--bs-alert-link-color);
}
}
@layer components {
.avatar {
--bs-avatar-size: 2.5rem;
--bs-avatar-border-radius: 50%;
--bs-avatar-border-width: 2px;
--bs-avatar-border-color: var(--bs-bg-body);
--bs-avatar-bg: var(--bs-bg-2);
--bs-avatar-color: var(--bs-fg-body);
--bs-avatar-status-size: 0.75rem;
--bs-avatar-status-border-width: 2px;
--bs-avatar-status-border-color: var(--bs-bg-body);
--bs-avatar-stack-spacing: -0.3;
--bs-avatar-stack-transition: transform .2s ease-in-out;
position: relative;
display: inline-flex;
align-items: center;
justify-content: center;
width: var(--bs-avatar-size);
height: var(--bs-avatar-size);
font-size: calc(var(--bs-avatar-size) * 0.4);
font-weight: var(--bs-avatar-font-weight, var(--bs-font-weight-medium));
line-height: 1;
color: var(--bs-theme-contrast, var(--bs-avatar-color));
text-transform: uppercase;
vertical-align: middle;
background-color: var(--bs-theme-bg, var(--bs-avatar-bg));
border-radius: var(--bs-avatar-border-radius);
}
.avatar-subtle {
color: var(--bs-theme-text, var(--bs-avatar-color));
background-color: var(--bs-theme-bg-subtle, var(--bs-avatar-bg));
}
.avatar-img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
border-radius: inherit;
}
.avatar-status {
position: absolute;
right: calc(var(--bs-avatar-status-border-width) * -1);
bottom: calc(var(--bs-avatar-status-border-width) * -1);
width: var(--bs-avatar-status-size);
height: var(--bs-avatar-status-size);
background-color: var(--bs-gray-400);
border: var(--bs-avatar-status-border-width) solid var(--bs-avatar-status-border-color);
border-radius: 50%;
}
.avatar-status.status-online {
background-color: var(--bs-green-500);
}
.avatar-status.status-offline {
background-color: var(--bs-gray-400);
border-radius: 20%;
}
.avatar-status.status-busy {
background-color: var(--bs-red-500);
border-radius: 20%;
}
.avatar-status.status-away {
background-color: var(--bs-yellow-500);
}
.avatar-stack {
display: inline-flex;
flex-direction: row-reverse;
}
.avatar-stack .avatar {
margin-left: calc(var(--bs-avatar-size) * var(--bs-avatar-stack-spacing));
border: var(--bs-avatar-border-width) solid var(--bs-avatar-border-color);
-webkit-mask-image: none;
mask-image: none;
transition: var(--bs-avatar-stack-transition);
}
@media (prefers-reduced-motion: reduce) {
.avatar-stack .avatar {
transition: none;
}
}
.avatar-stack .avatar:last-child {
margin-left: 0;
}
.avatar-stack .avatar:hover {
z-index: 1;
transform: translateY(-2px);
}
.avatar-xs,
.avatar-stack-xs {
--bs-avatar-size: 1.5rem;
--bs-avatar-status-size: 0.625rem;
}
.avatar-sm,
.avatar-stack-sm {
--bs-avatar-size: 2rem;
}
.avatar-lg,
.avatar-stack-lg {
--bs-avatar-size: 3rem;
--bs-avatar-status-size: 1rem;
}
.avatar-xl,
.avatar-stack-xl {
--bs-avatar-size: 4rem;
--bs-avatar-status-size: 1.25rem;
}
}
@layer components {
.badge {
--bs-badge-padding-x: 0.625em;
--bs-badge-padding-y: 0.25em;
--bs-badge-font-size: clamp(12px, 0.75em, 0.75em);
--bs-badge-font-weight: var(--bs-font-weight-semibold);
--bs-badge-color: inherit;
--bs-badge-bg: var(--bs-bg-2);
--bs-badge-border-width: var(--bs-border-width);
--bs-badge-border-color: transparent;
--bs-badge-border-radius: var(--bs-border-radius-lg);
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 1.375rem;
padding: var(--bs-badge-padding-y) var(--bs-badge-padding-x);
font-size: var(--bs-badge-font-size);
font-weight: var(--bs-badge-font-weight);
line-height: 1;
color: var(--bs-theme-contrast, var(--bs-badge-color));
text-align: center;
white-space: nowrap;
vertical-align: baseline;
background-color: var(--bs-theme-bg, var(--bs-badge-bg));
border: var(--bs-badge-border-width) solid var(--bs-badge-border-color);
border-radius: var(--bs-badge-border-radius);
}
.badge:empty {
display: none;
}
.btn .badge {
position: relative;
top: -1px;
}
.badge-subtle {
--bs-badge-color: var(--bs-theme-text);
--bs-badge-bg: var(--bs-theme-bg-subtle);
--bs-badge-border-color: transparent;
color: var(--bs-badge-color);
background-color: var(--bs-badge-bg);
border-color: var(--bs-badge-border-color);
}
.badge-outline {
--bs-badge-color: var(--bs-theme-text);
--bs-badge-bg: transparent;
--bs-badge-border-color: var(--bs-theme-border);
color: var(--bs-badge-color);
background-color: var(--bs-badge-bg);
border-color: var(--bs-badge-border-color);
}
}
@layer components {
.breadcrumb {
--bs-breadcrumb-margin-bottom: 1rem;
--bs-breadcrumb-font-size: inherit;
--bs-breadcrumb-bg: transparent;
--bs-breadcrumb-border-radius: var(--bs-border-radius);
--bs-breadcrumb-divider-color: var(--bs-fg-4);
--bs-breadcrumb-link-padding-x: 0.75rem;
--bs-breadcrumb-link-padding-y: 0.25rem;
--bs-breadcrumb-link-color: var(--bs-fg-3);
--bs-breadcrumb-link-hover-color: var(--bs-fg-2);
--bs-breadcrumb-link-hover-bg: var(--bs-bg-1);
--bs-breadcrumb-link-active-color: var(--bs-fg-1);
--bs-breadcrumb-link-border-radius: var(--bs-border-radius-lg);
display: flex;
flex-wrap: wrap;
align-items: center;
padding: var(--bs-breadcrumb-padding-y, 0) var(--bs-breadcrumb-padding-x, 0);
font-size: var(--bs-breadcrumb-font-size);
list-style: none;
background-color: var(--bs-breadcrumb-bg);
border-radius: var(--bs-breadcrumb-border-radius);
}
.breadcrumb-item {
display: flex;
}
.breadcrumb-divider {
margin-inline: calc(var(--bs-breadcrumb-link-padding-x) / 4);
color: var(--bs-breadcrumb-divider-color);
}
.breadcrumb-link {
position: relative;
display: flex;
align-items: center;
justify-content: center;
min-height: 2.25rem;
padding: var(--bs-breadcrumb-link-padding-y) var(--bs-breadcrumb-link-padding-x);
color: var(--bs-breadcrumb-link-color);
text-decoration: none;
border-radius: var(--bs-breadcrumb-link-border-radius);
transition: 0.1s text-decoration-color ease-in-out;
}
@media (prefers-reduced-motion: reduce) {
.breadcrumb-link {
transition: none;
}
}
.breadcrumb-link:hover {
z-index: 2;
color: var(--bs-breadcrumb-link-hover-color);
background-color: var(--bs-breadcrumb-link-hover-bg);
}
.breadcrumb-link.active {
color: var(--bs-breadcrumb-link-active-color);
}
}
@layer components {
.chip {
--bs-chip-height: 1.75rem;
--bs-chip-padding-x: 0.625rem;
--bs-chip-gap: 0.3125rem;
--bs-chip-border-radius: var(--bs-border-radius-pill);
--bs-chip-img-size: 1.25rem;
--bs-chip-icon-size: 1rem;
--bs-chip-dismiss-size: 1rem;
--bs-chip-dismiss-opacity: 0.65;
--bs-chip-dismiss-hover-opacity: 1;
--bs-chip-color: var(--bs-theme-text, var(--bs-fg-body));
--bs-chip-bg: var(--bs-theme-bg-subtle, var(--bs-bg-2));
--bs-chip-border-color: transparent;
--bs-chip-selected-color: var(--bs-theme-contrast, var(--bs-primary-contrast));
--bs-chip-selected-bg: var(--bs-theme-bg, var(--bs-primary-bg));
--bs-chip-selected-border-color: var(--bs-theme-bg, var(--bs-primary-bg));
display: inline-flex;
gap: var(--bs-chip-gap);
align-items: center;
height: var(--bs-chip-height);
padding-inline: var(--bs-chip-padding-x);
font-size: var(--bs-chip-font-size, var(--bs-font-size-sm));
font-weight: var(--bs-chip-font-weight, var(--bs-font-weight-base));
line-height: var(--bs-chip-line-height, 1.25rem);
color: var(--bs-chip-color);
text-decoration: none;
white-space: nowrap;
vertical-align: middle;
cursor: pointer;
background-color: var(--bs-chip-bg);
border: var(--bs-border-width) solid var(--bs-chip-border-color);
border-radius: var(--bs-chip-border-radius);
}
.chip:hover {
--bs-chip-bg: var(--bs-theme-bg-muted, var(--bs-bg-3));
}
.chip:focus-visible {
outline: 0;
}
.chip.active {
--bs-chip-color: var(--bs-chip-selected-color);
--bs-chip-bg: var(--bs-chip-selected-bg);
--bs-chip-border-color: var(--bs-chip-selected-border-color);
}
.chip.active:hover {
--bs-chip-bg: var(--bs-chip-selected-bg);
opacity: 0.9;
}
.chip.disabled, .chip:disabled {
pointer-events: none;
opacity: 0.65;
}
.chip-img {
width: var(--bs-chip-img-size);
height: var(--bs-chip-img-size);
border-radius: 50%;
}
.chip-img:first-child {
margin-inline-start: -0.375rem;
}
.chip-icon {
display: flex;
flex-shrink: 0;
align-items: center;
justify-content: center;
margin-inline-start: calc(var(--bs-chip-gap) * -0.25);
}
.chip-icon > svg {
display: block;
width: var(--bs-chip-icon-size);
height: var(--bs-chip-icon-size);
}
.chip-icon > img {
width: var(--bs-chip-icon-size);
height: var(--bs-chip-icon-size);
-o-object-fit: cover;
object-fit: cover;
border-radius: 50%;
}
.chip-dismiss {
display: flex;
flex-shrink: 0;
align-items: center;
justify-content: center;
width: var(--bs-chip-min-height);
height: var(--bs-chip-min-height);
padding: 0;
margin-inline-end: calc(var(--bs-chip-padding-x) * -0.25);
color: inherit;
cursor: pointer;
background: transparent;
border: 0;
opacity: var(--bs-chip-dismiss-opacity);
}
.chip-dismiss:hover {
opacity: var(--bs-chip-dismiss-hover-opacity);
}
.chip-dismiss:focus-visible {
outline: 0;
opacity: 1;
outline: var(--bs-focus-ring);
}
.chip-dismiss > svg {
display: block;
width: var(--bs-chip-dismiss-size);
height: var(--bs-chip-dismiss-size);
}
}
@layer components {
.card {
--bs-card-spacer-y: 1rem;
--bs-card-spacer-x: 1rem;
--bs-card-subtitle-color: inherit;
--bs-card-border-width: var(--bs-border-width);
--bs-card-border-color: var(--bs-border-color-translucent);
--bs-card-border-radius: var(--bs-border-radius-lg);
--bs-card-box-shadow: none;
--bs-card-inner-border-radius: calc(var(--bs-border-radius-lg) - var(--bs-border-width));
--bs-card-cap-padding-y: 0.75rem;
--bs-card-cap-padding-x: 1rem;
--bs-card-cap-bg: var(--bs-bg-1);
--bs-card-cap-color: inherit;
--bs-card-height: auto;
--bs-card-color: inherit;
--bs-card-bg: var(--bs-bg-body);
--bs-card-img-overlay-padding: 1rem;
--bs-card-group-margin: 0.75rem;
--bs-card-body-gap: 0.5rem;
position: relative;
display: flex;
flex-direction: column;
min-width: 0;
height: var(--bs-card-height);
color: var(--bs-fg-body);
word-wrap: break-word;
background-color: var(--bs-card-bg);
box-shadow: var(--bs-card-box-shadow);
}
.card > hr {
margin-inline: 0;
}
.card-body {
display: flex;
flex: 1 1 auto;
flex-direction: column;
gap: var(--bs-card-body-gap);
align-items: flex-start;
padding: var(--bs-card-spacer-y) var(--bs-card-spacer-x);
color: var(--bs-card-color);
border: solid var(--bs-theme-bg, var(--bs-card-border-color));
border-width: 0 var(--bs-card-border-width);
}
.card-body > * {
margin-block: 0;
}
.card-body,
.card-list {
border: solid var(--bs-theme-bg, var(--bs-card-border-color));
border-width: 0 var(--bs-card-border-width);
}
.card-body:first-child,
.card-list:first-child {
border-start-start-radius: var(--bs-card-border-radius);
border-start-end-radius: var(--bs-card-border-radius);
border-top-width: var(--bs-card-border-width);
}
.card-body:last-child,
.card-list:last-child {
border-end-start-radius: var(--bs-card-border-radius);
border-end-end-radius: var(--bs-card-border-radius);
border-bottom-width: var(--bs-card-border-width);
}
.card-body:not(:first-child):not(:last-child),
.card-list:not(:first-child):not(:last-child) {
border-block-end-width: var(--bs-card-border-width);
}
.card-title,
.card-subtitle,
.card-text {
align-self: stretch;
}
.card-subtitle {
margin-top: calc(var(--bs-card-body-gap) * -0.5);
}
.card-header {
padding: var(--bs-card-cap-padding-y) var(--bs-card-cap-padding-x);
margin-bottom: 0;
color: var(--bs-theme-contrast, var(--bs-card-cap-color));
background-color: var(--bs-theme-bg, var(--bs-card-cap-bg));
border: var(--bs-card-border-width) solid var(--bs-theme-bg, var(--bs-card-border-color));
}
.card-header:first-child {
border-radius: var(--bs-card-inner-border-radius) var(--bs-card-inner-border-radius) 0 0;
}
.card-footer {
padding: var(--bs-card-cap-padding-y) var(--bs-card-cap-padding-x);
color: var(--bs-card-cap-color);
background-color: var(--bs-theme-bg, var(--bs-card-cap-bg));
border: var(--bs-card-border-width) solid var(--bs-theme-bg, var(--bs-card-border-color));
}
.card-footer:last-child {
border-radius: 0 0 var(--bs-card-inner-border-radius) var(--bs-card-inner-border-radius);
}
.card-translucent {
background-color: color-mix(in oklch, var(--bs-card-bg) 80%, transparent);
-webkit-backdrop-filter: blur(5px) saturate(180%);
backdrop-filter: blur(5px) saturate(180%);
}
.card-translucent .card-header,
.card-translucent .card-footer {
background-color: color-mix(in oklch, var(--bs-card-cap-bg) 60%, transparent);
}
.card-subtle {
border-color: var(--bs-theme-border, var(--bs-card-border-color));
}
.card-subtle .card-header {
color: var(--bs-theme-text-emphasis, currentcolor);
background-color: var(--bs-theme-bg-subtle, var(--bs-card-cap-bg));
border-color: var(--bs-theme-border, var(--bs-card-border-color));
}
.card-subtle .card-footer {
color: var(--bs-theme-text-emphasis, currentcolor);
background-color: var(--bs-theme-bg-subtle, var(--bs-card-cap-bg));
border-color: var(--bs-theme-border, var(--bs-card-border-color));
}
.card-subtle .card-body,
.card-subtle .card-list {
border-color: var(--bs-theme-border, var(--bs-card-border-color));
}
.nav.card-header-tabs {
margin-inline: calc(-0.5 * var(--bs-card-cap-padding-x));
margin-bottom: calc(-1 * var(--bs-card-cap-padding-y));
border-block-end: 0;
}
.nav.card-header-tabs .nav-link.active {
background-color: var(--bs-card-bg);
border-block-end-color: var(--bs-card-bg);
}
.card-img-overlay {
position: absolute;
inset: 0;
padding: var(--bs-card-img-overlay-padding);
border-radius: var(--bs-card-inner-border-radius);
}
.card-img,
.card-img-top,
.card-img-bottom {
width: 100%;
outline: var(--bs-card-border-width) solid var(--bs-card-border-color);
outline-offset: calc(var(--bs-card-border-width) * -1);
}
.card-img,
.card-img-top {
border-start-start-radius: var(--bs-card-inner-border-radius);
border-start-end-radius: var(--bs-card-inner-border-radius);
}
.card-img,
.card-img-bottom {
border-end-start-radius: var(--bs-card-inner-border-radius);
border-end-end-radius: var(--bs-card-inner-border-radius);
}
.card-row {
flex-direction: row;
}
.card-row .card-body,
.card-row .card-list {
border-width: var(--bs-card-border-width) 0;
border-radius: 0;
}
.card-row .card-body:first-child,
.card-row .card-list:first-child {
border-start-start-radius: var(--bs-card-inner-border-radius);
border-end-start-radius: var(--bs-card-inner-border-radius);
border-inline-start-width: var(--bs-card-border-width);
}
.card-row .card-body:last-child,
.card-row .card-list:last-child {
border-start-end-radius: var(--bs-card-inner-border-radius);
border-end-end-radius: var(--bs-card-inner-border-radius);
border-inline-end-width: var(--bs-card-border-width);
}
.card-row .card-body:not(:first-child):not(:last-child),
.card-row .card-list:not(:first-child):not(:last-child) {
border-inline-end-width: var(--bs-card-border-width);
}
.card-img-start {
border-start-start-radius: var(--bs-card-inner-border-radius);
border-end-start-radius: var(--bs-card-inner-border-radius);
}
.card-img-end {
border-start-end-radius: var(--bs-card-inner-border-radius);
border-end-end-radius: var(--bs-card-inner-border-radius);
}
.card-group > .card {
margin-bottom: var(--bs-card-group-margin);
}
@media (width >= 576px) {
.card-group {
display: flex;
flex-flow: row wrap;
}
.card-group > .card {
flex: 1 0 0;
margin-bottom: 0;
}
.card-group > .card + .card {
margin-inline-start: 0;
border-inline-start: 0;
}
.card-group > .card:not(:last-child) {
border-start-end-radius: 0;
border-end-end-radius: 0;
}
.card-group > .card:not(:last-child) > .card-img-top,
.card-group > .card:not(:last-child) > .card-header {
border-start-end-radius: 0;
}
.card-group > .card:not(:last-child) > .card-img-bottom,
.card-group > .card:not(:last-child) > .card-footer {
border-end-end-radius: 0;
}
.card-group > .card:not(:first-child) {
border-start-start-radius: 0;
border-end-start-radius: 0;
}
.card-group > .card:not(:first-child) > .card-img-top,
.card-group > .card:not(:first-child) > .card-header {
border-start-start-radius: 0;
}
.card-group > .card:not(:first-child) > .card-img-bottom,
.card-group > .card:not(:first-child) > .card-footer {
border-end-start-radius: 0;
}
}
}
@layer components {
.carousel {
position: relative;
--bs-carousel-control-color: #fff;
--bs-carousel-control-width: 15%;
--bs-carousel-control-opacity: 0.5;
--bs-carousel-control-hover-opacity: 0.9;
--bs-carousel-control-transition: opacity 0.15s ease;
--bs-carousel-control-icon-filter: none;
--bs-carousel-indicator-width: 30px;
--bs-carousel-indicator-height: 3px;
--bs-carousel-indicator-hit-area-height: 10px;
--bs-carousel-indicator-spacer: 3px;
--bs-carousel-indicator-opacity: 0.5;
--bs-carousel-indicator-active-bg: var(--bs-white);
--bs-carousel-indicator-active-opacity: 1;
--bs-carousel-indicator-transition: opacity 0.6s ease;
--bs-carousel-caption-width: 70%;
--bs-carousel-caption-color: var(--bs-white);
--bs-carousel-caption-padding-y: 1.25rem;
--bs-carousel-caption-spacer: 1.25rem;
--bs-carousel-control-icon-width: 2rem;
--bs-carousel-control-prev-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='white'><path d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0'/></svg>");
--bs-carousel-control-next-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='white'><path d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708'/></svg>");
--bs-carousel-transition-duration: 0.6s;
--bs-carousel-transition: transform 0.6s ease-in-out;
}
.carousel.pointer-event {
touch-action: pan-y;
}
.carousel-inner {
position: relative;
display: flow-root;
width: 100%;
overflow: hidden;
}
.carousel-item {
position: relative;
display: none;
float: inline-start;
width: 100%;
margin-inline-end: -100%;
backface-visibility: hidden;
transition: var(--bs-carousel-transition);
}
@media (prefers-reduced-motion: reduce) {
.carousel-item {
transition: none;
}
}
.carousel-item.active,
.carousel-item-next,
.carousel-item-prev {
display: block;
}
.carousel-item-next:not(.carousel-item-start),
.active.carousel-item-end {
transform: translateX(100%);
}
.carousel-item-prev:not(.carousel-item-end),
.active.carousel-item-start {
transform: translateX(-100%);
}
.carousel-fade .carousel-item {
opacity: 0;
transition-property: opacity;
transform: none;
}
.carousel-fade .carousel-item.active,
.carousel-fade .carousel-item-next.carousel-item-start,
.carousel-fade .carousel-item-prev.carousel-item-end {
z-index: 1;
opacity: 1;
}
.carousel-fade .active.carousel-item-start,
.carousel-fade .active.carousel-item-end {
z-index: 0;
opacity: 0;
transition: opacity 0s var(--bs-carousel-transition-duration);
}
@media (prefers-reduced-motion: reduce) {
.carousel-fade .active.carousel-item-start,
.carousel-fade .active.carousel-item-end {
transition: none;
}
}
.carousel-control-prev,
.carousel-control-next {
position: absolute;
inset-block: 0;
z-index: 1;
display: flex;
align-items: center;
justify-content: center;
width: var(--bs-carousel-control-width);
padding: 0;
color: var(--bs-carousel-control-color);
text-align: center;
background: none;
filter: var(--bs-carousel-control-icon-filter);
border: 0;
opacity: var(--bs-carousel-control-opacity);
transition: var(--bs-carousel-control-transition);
}
@media (prefers-reduced-motion: reduce) {
.carousel-control-prev,
.carousel-control-next {
transition: none;
}
}
.carousel-control-prev:hover, .carousel-control-prev:focus,
.carousel-control-next:hover,
.carousel-control-next:focus {
color: var(--bs-carousel-control-color);
text-decoration: none;
outline: 0;
opacity: var(--bs-carousel-control-hover-opacity);
}
.carousel-control-prev {
inset-inline-start: 0;
}
.carousel-control-next {
inset-inline-end: 0;
}
.carousel-control-prev-icon,
.carousel-control-next-icon {
display: inline-block;
width: var(--bs-carousel-control-icon-width);
height: var(--bs-carousel-control-icon-width);
background-repeat: no-repeat;
background-position: 50%;
background-size: 100% 100%;
}
.carousel-control-prev-icon {
background-image: var(--bs-carousel-control-prev-icon-bg);
}
[dir=rtl] .carousel-control-prev-icon {
background-image: var(--bs-carousel-control-next-icon-bg);
}
.carousel-control-next-icon {
background-image: var(--bs-carousel-control-next-icon-bg);
}
[dir=rtl] .carousel-control-next-icon {
background-image: var(--bs-carousel-control-prev-icon-bg);
}
.carousel-indicators {
position: absolute;
inset: auto 0 0;
z-index: 2;
display: flex;
justify-content: center;
padding: 0;
margin-inline: var(--bs-carousel-control-width);
margin-bottom: 1rem;
}
.carousel-indicators [data-bs-target] {
box-sizing: content-box;
flex: 0 1 auto;
width: var(--bs-carousel-indicator-width);
height: var(--bs-carousel-indicator-height);
padding: 0;
margin-inline: var(--bs-carousel-indicator-spacer);
text-indent: -999px;
cursor: pointer;
background-color: var(--bs-carousel-indicator-active-bg);
background-clip: padding-box;
border: 0;
border-block: var(--bs-carousel-indicator-hit-area-height) solid transparent;
opacity: var(--bs-carousel-indicator-opacity);
transition: var(--bs-carousel-indicator-transition);
}
@media (prefers-reduced-motion: reduce) {
.carousel-indicators [data-bs-target] {
transition: none;
}
}
.carousel-indicators .active {
opacity: var(--bs-carousel-indicator-active-opacity);
}
.carousel-caption {
position: absolute;
right: calc((100% - var(--bs-carousel-caption-width)) * 0.5);
bottom: var(--bs-carousel-caption-spacer);
left: calc((100% - var(--bs-carousel-caption-width)) * 0.5);
padding-top: var(--bs-carousel-caption-padding-y);
padding-bottom: var(--bs-carousel-caption-padding-y);
color: var(--bs-carousel-caption-color);
text-align: center;
}
.carousel-dark {
--bs-carousel-indicator-active-bg: #000;
--bs-carousel-caption-color: #000;
--bs-carousel-control-icon-filter: invert(1) grayscale(100);
}
@media (prefers-color-scheme: dark) {
:root {
--bs-carousel-indicator-active-bg: #000;
--bs-carousel-caption-color: #000;
--bs-carousel-control-icon-filter: invert(1) grayscale(100);
}
}
}
@layer components {
[data-vc=calendar] {
--bs-datepicker-padding: 1rem;
--bs-datepicker-bg: var(--bs-bg-body);
--bs-datepicker-color: var(--bs-fg-body);
--bs-datepicker-border-color: var(--bs-border-color-translucent);
--bs-datepicker-border-width: var(--bs-border-width);
--bs-datepicker-border-radius: var(--bs-border-radius-lg);
--bs-datepicker-box-shadow: var(--bs-box-shadow);
--bs-datepicker-font-size: var(--bs-font-size-sm);
--bs-datepicker-min-width: 280px;
--bs-datepicker-zindex: 1000;
--bs-datepicker-header-font-weight: 600;
--bs-datepicker-weekday-color: var(--bs-fg-3);
--bs-datepicker-day-hover-bg: var(--bs-bg-1);
--bs-datepicker-day-selected-bg: var(--bs-primary-bg);
--bs-datepicker-day-selected-color: var(--bs-primary-contrast);
--bs-datepicker-day-today-bg: var(--bs-bg-2);
--bs-datepicker-day-today-color: var(--bs-fg-1);
--bs-datepicker-day-disabled-color: var(--bs-fg-4);
position: absolute;
z-index: var(--bs-datepicker-zindex);
box-sizing: border-box;
display: flex;
flex-direction: column;
min-width: var(--bs-datepicker-min-width);
padding: var(--bs-datepicker-padding);
font-family: var(--bs-font-sans-serif);
font-size: var(--bs-datepicker-font-size);
color: var(--bs-datepicker-color);
color-scheme: light dark;
background-color: var(--bs-datepicker-bg);
border: var(--bs-datepicker-border-width) solid var(--bs-datepicker-border-color);
border-radius: var(--bs-datepicker-border-radius);
box-shadow: var(--bs-datepicker-box-shadow);
opacity: 1;
}
[data-vc=calendar][data-bs-theme=light] {
color-scheme: light;
}
[data-vc=calendar][data-bs-theme=dark] {
color-scheme: dark;
}
[data-vc=calendar] button:focus-visible {
position: relative;
z-index: 1;
outline: var(--bs-focus-ring);
}
[data-vc-calendar-hidden] {
pointer-events: none;
opacity: 0;
}
[data-vc=calendar]:not([data-vc-input]) {
position: relative;
width: -moz-fit-content;
width: fit-content;
padding: 0;
border: 0;
box-shadow: none;
}
[data-vc-position=bottom] {
margin-block-start: 0.25rem;
}
[data-vc-position=top] {
margin-block-end: -0.25rem;
}
[data-vc-arrow] {
position: relative;
display: block;
width: 2rem;
height: 2rem;
color: var(--bs-datepicker-color);
pointer-events: auto;
cursor: pointer;
background-color: transparent;
border: 0;
border-radius: var(--bs-border-radius);
}
[data-vc-arrow]::before {
position: absolute;
inset: 0.25rem;
content: "";
background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%236b7280' d='M12 16c-.3 0-.5-.1-.7-.3l-6-6c-.4-.4-.4-1 0-1.4s1-.4 1.4 0l5.3 5.3 5.3-5.3c.4-.4 1-.4 1.4 0s.4 1 0 1.4l-6 6c-.2.2-.4.3-.7.3'/></svg>");
background-repeat: no-repeat;
background-position: center;
}
[data-vc-arrow]:hover {
background-color: var(--bs-datepicker-day-hover-bg);
}
[data-vc-arrow=prev]::before {
transform: rotate(90deg);
}
[data-vc-arrow=next]::before {
transform: rotate(-90deg);
}
[data-vc=controls] {
position: absolute;
top: 0;
right: 0;
left: 0;
z-index: 20;
display: flex;
align-items: center;
justify-content: space-between;
padding-top: 1rem;
padding-right: 1rem;
padding-left: 1rem;
pointer-events: none;
}
[data-vc=grid] {
display: flex;
flex-grow: 1;
flex-wrap: wrap;
gap: 1.75rem;
}
[data-vc=column] {
display: flex;
flex-grow: 1;
flex-direction: column;
min-width: 240px;
}
[data-vc=header] {
position: relative;
display: flex;
align-items: center;
margin-bottom: 0.75rem;
}
[data-vc-header=content] {
display: inline-flex;
flex-grow: 1;
align-items: center;
justify-content: center;
white-space: pre-wrap;
}
[data-vc=month],
[data-vc=year] {
padding: 0.25rem 0.5rem;
margin-inline: -0.125rem;
font-size: 1rem;
font-weight: var(--bs-datepicker-header-font-weight);
color: var(--bs-datepicker-color);
background-color: transparent;
border: 0;
border-radius: var(--bs-border-radius);
}
[data-vc=month]:disabled,
[data-vc=year]:disabled {
color: var(--bs-datepicker-day-disabled-color);
pointer-events: none;
}
[data-vc=month]:hover:not(:disabled),
[data-vc=year]:hover:not(:disabled) {
background-color: var(--bs-datepicker-day-hover-bg);
}
[data-vc=content] {
display: flex;
flex-grow: 1;
flex-direction: column;
}
[data-vc=months],
[data-vc=years] {
display: grid;
flex-grow: 1;
grid-template-columns: repeat(var(--bs-vc-columns, 4), minmax(0, 1fr));
row-gap: 1rem;
-moz-column-gap: 0.25rem;
column-gap: 0.25rem;
align-items: center;
}
[data-vc=years] {
--bs-vc-columns: 5;
}
[data-vc-months-month],
[data-vc-years-year] {
display: flex;
align-items: center;
justify-content: center;
height: 2.5rem;
padding: 0.25rem;
font-size: 0.75rem;
font-weight: 600;
line-height: 1rem;
color: var(--bs-datepicker-weekday-color);
text-align: center;
word-break: break-all;
cursor: pointer;
background-color: transparent;
border: 0;
border-radius: var(--bs-border-radius);
}
[data-vc-months-month]:disabled,
[data-vc-years-year]:disabled {
color: var(--bs-datepicker-day-disabled-color);
pointer-events: none;
}
[data-vc-months-month]:hover:not(:disabled),
[data-vc-years-year]:hover:not(:disabled) {
background-color: var(--bs-datepicker-day-hover-bg);
}
[data-vc-months-month][data-vc-months-month-selected], [data-vc-months-month][data-vc-years-year-selected],
[data-vc-years-year][data-vc-months-month-selected],
[data-vc-years-year][data-vc-years-year-selected] {
color: var(--bs-datepicker-day-selected-color);
background-color: var(--bs-datepicker-day-selected-bg);
}
[data-vc-months-month][data-vc-months-month-selected]:hover, [data-vc-months-month][data-vc-years-year-selected]:hover,
[data-vc-years-year][data-vc-months-month-selected]:hover,
[data-vc-years-year][data-vc-years-year-selected]:hover {
color: var(--bs-datepicker-day-selected-color);
background-color: var(--bs-datepicker-day-selected-bg);
}
[data-vc=week] {
display: grid;
grid-template-columns: repeat(7, 1fr);
justify-items: center;
margin-bottom: 0.5rem;
}
[data-vc-week-day] {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
min-width: 1.875rem;
padding: 0;
margin: 0;
font-size: 0.75rem;
font-weight: 600;
line-height: 1rem;
color: var(--bs-datepicker-weekday-color);
background-color: transparent;
border: 0;
}
button[data-vc-week-day] {
cursor: pointer;
}
[data-vc=dates] {
pointer-events: none;
}
[data-vc-dates=row] {
display: grid;
grid-template-columns: repeat(7, 1fr);
align-items: center;
justify-items: center;
width: 100%;
}
[data-vc-date] {
position: relative;
display: flex;
align-items: center;
justify-content: center;
width: 100%;
padding-top: 0.125rem;
padding-bottom: 0.125rem;
pointer-events: auto;
}
[data-vc-date]:not(:has([data-vc-date-btn])), [data-vc-date][data-vc-date-disabled], [data-vc-date][data-vc-date-disabled] [data-vc-date-btn] {
pointer-events: none;
}
[data-vc-date-btn] {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
min-width: 1.875rem;
height: 100%;
min-height: 1.875rem;
padding: 0;
font-size: 0.75rem;
font-weight: 400;
line-height: 1rem;
color: var(--bs-datepicker-color);
cursor: pointer;
background-color: transparent;
border: 0;
border-radius: var(--bs-border-radius);
}
[data-vc-date-btn]:hover {
background-color: var(--bs-datepicker-day-hover-bg);
}
[data-vc-date-today] [data-vc-date-btn] {
font-weight: 600;
color: var(--bs-datepicker-day-today-color);
background-color: var(--bs-datepicker-day-today-bg);
}
[data-vc-date-month=next] [data-vc-date-btn],
[data-vc-date-month=prev] [data-vc-date-btn] {
opacity: 0.5;
}
[data-vc-date-disabled] [data-vc-date-btn] {
color: var(--bs-datepicker-day-disabled-color);
}
[data-vc-date-hover] [data-vc-date-btn] {
background-color: var(--bs-datepicker-day-hover-bg);
border-radius: 0;
}
[data-vc-date-hover=first] [data-vc-date-btn] {
border-start-start-radius: var(--bs-border-radius);
border-end-start-radius: var(--bs-border-radius);
}
[data-vc-date-hover=last] [data-vc-date-btn] {
border-start-end-radius: var(--bs-border-radius);
border-end-end-radius: var(--bs-border-radius);
}
[data-vc-date-hover=first-and-last] [data-vc-date-btn] {
border-radius: var(--bs-border-radius);
}
[data-vc-date-selected=middle] [data-vc-date-btn] {
border-radius: 0;
opacity: 0.8;
}
[data-vc-date-selected] [data-vc-date-btn] {
color: var(--bs-datepicker-day-selected-color);
background-color: var(--bs-datepicker-day-selected-bg);
}
[data-vc-date-selected=first] [data-vc-date-btn] {
border-top-left-radius: var(--bs-border-radius);
border-top-right-radius: 0;
border-bottom-right-radius: 0;
border-bottom-left-radius: var(--bs-border-radius);
}
[data-vc-date-selected=last] [data-vc-date-btn] {
border-top-left-radius: 0;
border-top-right-radius: var(--bs-border-radius);
border-bottom-right-radius: var(--bs-border-radius);
border-bottom-left-radius: 0;
}
[data-vc-date-selected=first-and-last] [data-vc-date-btn] {
border-radius: var(--bs-border-radius);
}
}
@layer components {
.dialog-open {
overflow: hidden;
scrollbar-gutter: stable;
}
.dialog {
--bs-dialog-padding: 1rem;
--bs-dialog-width: 500px;
--bs-dialog-margin: 1.75rem;
--bs-dialog-color: var(--bs-fg-body);
--bs-dialog-bg: var(--bs-bg-body);
--bs-dialog-border-color: var(--bs-border-color-translucent);
--bs-dialog-border-width: var(--bs-border-width);
--bs-dialog-border-radius: var(--bs-border-radius-lg);
--bs-dialog-box-shadow: var(--bs-box-shadow-lg);
--bs-dialog-backdrop-bg: rgba(0, 0, 0, 0.5);
--bs-dialog-backdrop-blur: 8px;
--bs-dialog-header-padding: 1rem;
--bs-dialog-header-border-color: var(--bs-border-color);
--bs-dialog-header-border-width: var(--bs-border-width);
--bs-dialog-footer-padding: 1rem;
--bs-dialog-footer-border-color: var(--bs-border-color);
--bs-dialog-footer-border-width: var(--bs-border-width);
--bs-dialog-footer-gap: 0.5rem;
max-width: var(--bs-dialog-width);
max-height: calc(100% - var(--bs-dialog-margin) * 2);
padding: 0;
margin: auto;
color: var(--bs-dialog-color);
background-color: var(--bs-dialog-bg);
background-clip: padding-box;
border: var(--bs-dialog-border-width) solid var(--bs-dialog-border-color);
border-radius: var(--bs-dialog-border-radius);
box-shadow: var(--bs-dialog-box-shadow);
}
.dialog::backdrop {
background-color: var(--bs-dialog-backdrop-bg);
-webkit-backdrop-filter: blur(var(--bs-dialog-backdrop-blur));
backdrop-filter: blur(var(--bs-dialog-backdrop-blur));
}
.dialog.fade {
opacity: 0;
transition: opacity 0.15s linear;
}
@media (prefers-reduced-motion: reduce) {
.dialog.fade {
transition: none;
}
}
.dialog.fade::backdrop {
opacity: 0;
transition: opacity 0.15s linear;
}
@media (prefers-reduced-motion: reduce) {
.dialog.fade::backdrop {
transition: none;
}
}
.dialog.fade[open] {
opacity: 1;
}
.dialog.fade[open]::backdrop {
opacity: 1;
}
.dialog.dialog-static {
transform: scale(1.02);
}
.dialog.dialog-nonmodal {
position: fixed;
inset-block-start: 50%;
inset-inline-start: 50%;
z-index: 1055;
margin-inline: 0;
transform: translate(-50%, -50%);
}
.dialog.dialog-overflow {
position: fixed;
inset: 0;
width: 100%;
max-width: 100%;
height: 100%;
max-height: 100%;
padding: var(--bs-dialog-margin);
margin: 0;
overflow-y: auto;
overscroll-behavior: contain;
background: transparent;
border: 0;
box-shadow: none;
}
.dialog.dialog-overflow > .dialog-box {
max-width: var(--bs-dialog-width);
margin-block-end: var(--bs-dialog-margin);
margin-inline: auto;
color: var(--bs-dialog-color);
background-color: var(--bs-dialog-bg);
background-clip: padding-box;
border: var(--bs-dialog-border-width) solid var(--bs-dialog-border-color);
border-radius: var(--bs-dialog-border-radius);
box-shadow: var(--bs-dialog-box-shadow);
}
.dialog.dialog-scrollable[open] {
display: flex;
flex-direction: column;
max-height: calc(100% - var(--bs-dialog-margin) * 2);
}
.dialog.dialog-scrollable[open] .dialog-body {
overflow-y: auto;
}
.dialog-sm {
--bs-dialog-width: 280px;
}
.dialog-lg {
--bs-dialog-width: 800px;
}
.dialog-xl {
--bs-dialog-width: 1140px;
}
.dialog-fullscreen {
--bs-dialog-width: 100vw;
--bs-dialog-margin: 0;
--bs-dialog-border-radius: 0;
width: 100%;
max-width: none;
height: 100%;
max-height: none;
}
@media (width < 576px) {
.sm-down\:dialog-fullscreen {
--bs-dialog-width: 100vw;
--bs-dialog-margin: 0;
--bs-dialog-border-radius: 0;
width: 100%;
max-width: none;
height: 100%;
max-height: none;
}
}
@media (width < 768px) {
.md-down\:dialog-fullscreen {
--bs-dialog-width: 100vw;
--bs-dialog-margin: 0;
--bs-dialog-border-radius: 0;
width: 100%;
max-width: none;
height: 100%;
max-height: none;
}
}
@media (width < 1024px) {
.lg-down\:dialog-fullscreen {
--bs-dialog-width: 100vw;
--bs-dialog-margin: 0;
--bs-dialog-border-radius: 0;
width: 100%;
max-width: none;
height: 100%;
max-height: none;
}
}
@media (width < 1280px) {
.xl-down\:dialog-fullscreen {
--bs-dialog-width: 100vw;
--bs-dialog-margin: 0;
--bs-dialog-border-radius: 0;
width: 100%;
max-width: none;
height: 100%;
max-height: none;
}
}
@media (width < 1536px) {
.\32 xl-down\:dialog-fullscreen {
--bs-dialog-width: 100vw;
--bs-dialog-margin: 0;
--bs-dialog-border-radius: 0;
width: 100%;
max-width: none;
height: 100%;
max-height: none;
}
}
.dialog-header {
display: flex;
flex-shrink: 0;
align-items: center;
padding: var(--bs-dialog-header-padding);
border-block-end: var(--bs-dialog-header-border-width) solid var(--bs-dialog-header-border-color);
}
.dialog-header .btn-close {
margin-inline-start: auto;
}
.dialog-title {
margin-bottom: 0;
font-size: var(--bs-font-size-md);
line-height: 1.5;
}
.dialog-body {
position: relative;
flex: 1 1 auto;
padding: var(--bs-dialog-padding);
overflow-y: auto;
}
.dialog-footer {
display: flex;
flex-shrink: 0;
flex-wrap: wrap;
gap: var(--bs-dialog-footer-gap);
align-items: center;
justify-content: flex-end;
padding: var(--bs-dialog-footer-padding);
border-block-start: var(--bs-dialog-footer-border-width) solid var(--bs-dialog-footer-border-color);
}
}
@layer components {
.menu {
--bs-menu-zindex: 1000;
--bs-menu-gap: 0.125rem;
--bs-menu-min-width: 10rem;
--bs-menu-padding-x: 0.25rem;
--bs-menu-padding-y: 0.25rem;
--bs-menu-spacer: 0.125rem;
--bs-menu-font-size: var(--bs-font-size-sm);
--bs-menu-color: var(--bs-fg-body);
--bs-menu-bg: var(--bs-bg-body);
--bs-menu-box-shadow: var(--bs-box-shadow);
--bs-menu-divider-bg: var(--bs-border-color-translucent);
--bs-menu-divider-margin-y: 0.125rem;
--bs-menu-divider-margin-x: 0.25rem;
--bs-menu-item-color: var(--bs-menu-color, var(--bs-fg-body));
--bs-menu-item-hover-color: var(--bs-menu-color, var(--bs-fg-body));
--bs-menu-item-hover-bg: var(--bs-bg-1);
--bs-menu-item-active-color: var(--bs-primary-contrast);
--bs-menu-item-active-bg: var(--bs-primary-bg);
--bs-menu-item-disabled-color: var(--bs-fg-3);
--bs-menu-item-gap: 0.5rem;
--bs-menu-item-padding-x: 0.75rem;
--bs-menu-item-padding-y: 0.25rem;
--bs-menu-item-border-radius: var(--bs-border-radius);
--bs-menu-icon-size: 1rem;
--bs-menu-image-size: 1.5rem;
--bs-menu-description-font-size: var(--bs-font-size-xs);
--bs-menu-check-color: currentcolor;
--bs-menu-header-color: var(--bs-fg-3);
--bs-menu-header-padding-x: 0.75rem;
--bs-menu-header-padding-y: 0.25rem;
position: absolute;
z-index: var(--bs-menu-zindex);
display: none;
flex-direction: column;
gap: var(--bs-menu-gap);
min-width: var(--bs-menu-min-width);
max-height: var(--bs-menu-max-height, none);
padding: var(--bs-menu-padding-y) var(--bs-menu-padding-x);
margin: 0;
overflow-y: var(--bs-menu-overflow-y, initial);
overscroll-behavior: contain;
font-size: var(--bs-menu-font-size);
color: var(--bs-menu-color);
text-align: start;
list-style: none;
background-color: var(--bs-menu-bg);
background-clip: padding-box;
border: var(--bs-menu-border-width, var(--bs-border-width)) solid var(--bs-menu-border-color, var(--bs-border-color-translucent));
border-radius: var(--bs-menu-border-radius, var(--bs-border-radius-lg));
box-shadow: var(--bs-menu-box-shadow);
}
.menu.show {
display: flex;
}
.menu-scrollable {
--bs-menu-max-height: 80dvh;
--bs-menu-overflow-y: auto;
}
.menu-translucent {
--bs-menu-item-hover-bg-light: color-mix(in oklch, var(--bs-bg-1) 90%, transparent);
--bs-menu-item-hover-bg-dark: color-mix(in oklch, var(--bs-bg-1) 80%, transparent);
--bs-menu-item-active-bg-light: color-mix(in oklch, var(--bs-primary-bg) 80%, transparent);
--bs-menu-item-active-bg-dark: color-mix(in oklch, var(--bs-primary-bg) 70%, transparent);
--bs-menu-item-active-bg: light-dark(var(--bs-menu-item-active-bg-light), var(--bs-menu-item-active-bg-dark));
--bs-menu-item-hover-bg: light-dark(var(--bs-menu-item-hover-bg-light), var(--bs-menu-item-hover-bg-dark));
background-color: color-mix(in oklch, var(--bs-menu-bg) 80%, transparent);
-webkit-backdrop-filter: blur(5px) saturate(180%);
backdrop-filter: blur(5px) saturate(180%);
}
.menu-divider {
height: 0;
margin: var(--bs-menu-divider-margin-y) var(--bs-menu-divider-margin-x);
overflow: hidden;
border-block-start: 1px solid var(--bs-menu-divider-bg);
opacity: 1;
}
.menu-item {
display: flex;
gap: var(--bs-menu-item-gap);
align-items: center;
width: 100%;
padding: var(--bs-menu-item-padding-y) var(--bs-menu-item-padding-x);
font-weight: var(--bs-menu-item-font-weight, var(--bs-font-weight-normal));
color: var(--bs-theme-text, var(--bs-menu-item-color));
text-align: inherit;
text-decoration: none;
white-space: nowrap;
cursor: pointer;
background-color: transparent;
border: 0;
outline: 0;
border-radius: var(--bs-menu-item-border-radius, 0);
}
.menu-item:hover, .menu-item:focus {
color: var(--bs-theme-text, var(--bs-menu-item-hover-color));
background-color: var(--bs-theme-bg-subtle, var(--bs-menu-item-hover-bg));
}
.menu-item.active, .menu-item:active {
color: var(--bs-theme-contrast, var(--bs-menu-item-active-color));
background-color: var(--bs-theme-bg, var(--bs-menu-item-active-bg));
}
.menu-item.active .menu-item-icon, .menu-item:active .menu-item-icon {
color: inherit !important;
}
.menu-item.selected {
font-weight: 600;
}
.menu-item.disabled, .menu-item:disabled {
color: var(--bs-menu-item-disabled-color);
pointer-events: none;
background-color: transparent;
}
.menu-item-icon {
flex-shrink: 0;
align-self: flex-start;
width: var(--bs-menu-icon-size);
height: auto;
margin-top: 0.125rem;
}
.menu-image {
width: var(--bs-menu-image-size);
height: var(--bs-menu-image-size);
-o-object-fit: cover;
object-fit: cover;
border-radius: var(--bs-border-radius-sm);
}
.menu-item-content {
display: flex;
flex: 1;
flex-direction: column;
min-width: -moz-fit-content;
min-width: fit-content;
}
.menu-item-description {
font-size: var(--bs-menu-description-font-size);
font-weight: var(--bs-font-weight-normal);
color: color-mix(in oklch, currentcolor 65%, transparent);
}
.menu-item-check {
flex-shrink: 0;
align-self: flex-start;
margin-block-start: 0.125rem;
margin-inline-start: auto;
color: var(--bs-menu-check-color);
visibility: hidden;
}
.selected > .menu-item-check {
visibility: visible;
}
.menu-header {
display: block;
padding: var(--bs-menu-header-padding-y) var(--bs-menu-header-padding-x);
margin-bottom: 0;
font-size: var(--bs-font-size-sm);
color: var(--bs-menu-header-color);
white-space: nowrap;
}
.menu-text {
display: block;
padding: var(--bs-menu-item-padding-y) var(--bs-menu-item-padding-x);
color: var(--bs-fg-2);
}
.submenu {
position: relative;
}
.submenu > .menu-item {
display: flex;
align-items: center;
justify-content: space-between;
}
.submenu > .menu-item::after {
display: inline-block;
flex-shrink: 0;
width: 0.375em;
height: 0.375em;
margin-inline-start: auto;
content: "";
border-color: currentcolor;
border-style: solid;
border-width: 0 0.125em 0.125em 0;
transform: rotate(-45deg);
}
[dir=rtl] .submenu > .menu-item::after {
transform: rotate(135deg);
}
.submenu > .menu {
top: 0;
margin-top: calc(-1 * var(--bs-menu-padding-y));
}
.submenu:hover > .menu-item, .submenu:focus-within > .menu-item {
color: var(--bs-menu-item-hover-color);
background-color: var(--bs-menu-item-hover-bg);
}
.submenu.show > .menu-item {
color: var(--bs-menu-item-hover-color);
background-color: var(--bs-menu-item-hover-bg);
}
@media (max-width: 575.98px) {
.submenu:has(.submenu-stacked) {
position: static;
}
.submenu-stacked {
position: absolute;
inset: 0;
z-index: 1;
display: flex;
flex-direction: column;
gap: var(--bs-menu-gap);
min-width: 0;
padding: var(--bs-menu-padding-y) var(--bs-menu-padding-x);
background-color: var(--bs-menu-bg);
border: 0;
border-radius: 0;
box-shadow: none;
}
.submenu-back {
display: flex;
gap: var(--bs-menu-item-gap);
align-items: center;
padding: var(--bs-menu-item-padding-y) var(--bs-menu-item-padding-x);
font-weight: var(--bs-font-weight-semibold, 600);
color: var(--bs-menu-item-color);
}
.submenu-back::before {
display: inline-block;
flex-shrink: 0;
width: 0.375em;
height: 0.375em;
content: "";
border-color: currentcolor;
border-style: solid;
border-width: 0.125em 0 0 0.125em;
transform: rotate(-45deg);
}
[dir=rtl] .submenu-back::before {
border-width: 0 0.125em 0.125em 0;
}
.submenu-dimmed {
pointer-events: none;
filter: blur(2px);
opacity: 0.3;
}
}
}
@layer components {
.list-group {
--bs-list-group-color: var(--bs-fg-body);
--bs-list-group-bg: var(--bs-bg-body);
--bs-list-group-border-color: var(--bs-border-color);
--bs-list-group-border-width: var(--bs-border-width);
--bs-list-group-border-radius: var(--bs-border-radius);
--bs-list-group-item-padding-x: 1rem;
--bs-list-group-item-padding-y: 0.5rem;
--bs-list-group-action-color: var(--bs-fg-2);
--bs-list-group-action-hover-color: var(--bs-fg-1);
--bs-list-group-action-hover-bg: var(--bs-bg-1);
--bs-list-group-action-active-color: var(--bs-fg-body);
--bs-list-group-action-active-bg: var(--bs-bg-2);
--bs-list-group-disabled-color: var(--bs-fg-3);
--bs-list-group-disabled-bg: var(--bs-bg-body);
--bs-list-group-active-color: var(--bs-primary-contrast);
--bs-list-group-active-bg: var(--bs-primary-bg);
--bs-list-group-active-border-color: var(--bs-primary-bg);
display: flex;
flex-direction: column;
padding-inline-start: 0;
margin-bottom: 0;
border-radius: var(--bs-list-group-border-radius);
}
.list-group-numbered {
list-style-type: none;
counter-reset: section;
}
.list-group-numbered > .list-group-item::before {
content: counters(section, ".") ". ";
counter-increment: section;
}
.list-group-item {
position: relative;
display: block;
padding: var(--bs-list-group-item-padding-y) var(--bs-list-group-item-padding-x);
color: var(--bs-theme-text, var(--bs-list-group-color));
background-color: var(--bs-theme-bg-subtle, var(--bs-list-group-bg));
border: var(--bs-list-group-border-width) solid var(--bs-theme-border, var(--bs-list-group-border-color));
}
.list-group-item:first-child {
border-start-start-radius: inherit;
border-start-end-radius: inherit;
}
.list-group-item:last-child {
border-end-start-radius: inherit;
border-end-end-radius: inherit;
}
.list-group-item.disabled, .list-group-item:disabled {
color: var(--bs-list-group-disabled-color);
pointer-events: none;
background-color: var(--bs-list-group-disabled-bg);
}
.list-group-item.active {
z-index: 2;
color: var(--bs-list-group-active-color);
background-color: var(--bs-list-group-active-bg);
border-color: var(--bs-list-group-active-border-color);
}
.list-group-item + .list-group-item {
border-block-start-width: 0;
}
.list-group-item + .list-group-item.active {
margin-top: calc(-1 * var(--bs-list-group-border-width));
border-block-start-width: var(--bs-list-group-border-width);
}
.list-group-item-action {
width: 100%;
color: var(--bs-theme-text, var(--bs-list-group-action-color));
text-align: inherit;
text-decoration: none;
}
.list-group-item-action:not(.active):hover, .list-group-item-action:not(.active):focus {
z-index: 1;
color: var(--bs-theme-text-emphasis, var(--bs-list-group-action-hover-color));
text-decoration: none;
background-color: var(--bs-theme-bg-muted, var(--bs-list-group-action-hover-bg));
}
.list-group-item-action:not(.active):active {
color: var(--bs-theme-text-emphasis, var(--bs-list-group-action-active-color));
background-color: var(--bs-theme-bg-muted, var(--bs-list-group-action-active-bg));
}
.list-group-horizontal {
flex-direction: row;
}
.list-group-horizontal > .list-group-item:first-child:not(:last-child) {
border-end-start-radius: var(--bs-list-group-border-radius);
border-start-end-radius: 0;
}
.list-group-horizontal > .list-group-item:last-child:not(:first-child) {
border-start-end-radius: var(--bs-list-group-border-radius);
border-end-start-radius: 0;
}
.list-group-horizontal > .list-group-item.active {
margin-top: 0;
}
.list-group-horizontal > .list-group-item + .list-group-item {
border-block-start-width: var(--bs-list-group-border-width);
border-inline-start-width: 0;
}
.list-group-horizontal > .list-group-item + .list-group-item.active {
margin-inline-start: calc(-1 * var(--bs-list-group-border-width));
border-inline-start-width: var(--bs-list-group-border-width);
}
@media (width >= 576px) {
.sm\:list-group-horizontal {
flex-direction: row;
}
.sm\:list-group-horizontal > .list-group-item:first-child:not(:last-child) {
border-end-start-radius: var(--bs-list-group-border-radius);
border-start-end-radius: 0;
}
.sm\:list-group-horizontal > .list-group-item:last-child:not(:first-child) {
border-start-end-radius: var(--bs-list-group-border-radius);
border-end-start-radius: 0;
}
.sm\:list-group-horizontal > .list-group-item.active {
margin-top: 0;
}
.sm\:list-group-horizontal > .list-group-item + .list-group-item {
border-block-start-width: var(--bs-list-group-border-width);
border-inline-start-width: 0;
}
.sm\:list-group-horizontal > .list-group-item + .list-group-item.active {
margin-inline-start: calc(-1 * var(--bs-list-group-border-width));
border-inline-start-width: var(--bs-list-group-border-width);
}
}
@media (width >= 768px) {
.md\:list-group-horizontal {
flex-direction: row;
}
.md\:list-group-horizontal > .list-group-item:first-child:not(:last-child) {
border-end-start-radius: var(--bs-list-group-border-radius);
border-start-end-radius: 0;
}
.md\:list-group-horizontal > .list-group-item:last-child:not(:first-child) {
border-start-end-radius: var(--bs-list-group-border-radius);
border-end-start-radius: 0;
}
.md\:list-group-horizontal > .list-group-item.active {
margin-top: 0;
}
.md\:list-group-horizontal > .list-group-item + .list-group-item {
border-block-start-width: var(--bs-list-group-border-width);
border-inline-start-width: 0;
}
.md\:list-group-horizontal > .list-group-item + .list-group-item.active {
margin-inline-start: calc(-1 * var(--bs-list-group-border-width));
border-inline-start-width: var(--bs-list-group-border-width);
}
}
@media (width >= 1024px) {
.lg\:list-group-horizontal {
flex-direction: row;
}
.lg\:list-group-horizontal > .list-group-item:first-child:not(:last-child) {
border-end-start-radius: var(--bs-list-group-border-radius);
border-start-end-radius: 0;
}
.lg\:list-group-horizontal > .list-group-item:last-child:not(:first-child) {
border-start-end-radius: var(--bs-list-group-border-radius);
border-end-start-radius: 0;
}
.lg\:list-group-horizontal > .list-group-item.active {
margin-top: 0;
}
.lg\:list-group-horizontal > .list-group-item + .list-group-item {
border-block-start-width: var(--bs-list-group-border-width);
border-inline-start-width: 0;
}
.lg\:list-group-horizontal > .list-group-item + .list-group-item.active {
margin-inline-start: calc(-1 * var(--bs-list-group-border-width));
border-inline-start-width: var(--bs-list-group-border-width);
}
}
@media (width >= 1280px) {
.xl\:list-group-horizontal {
flex-direction: row;
}
.xl\:list-group-horizontal > .list-group-item:first-child:not(:last-child) {
border-end-start-radius: var(--bs-list-group-border-radius);
border-start-end-radius: 0;
}
.xl\:list-group-horizontal > .list-group-item:last-child:not(:first-child) {
border-start-end-radius: var(--bs-list-group-border-radius);
border-end-start-radius: 0;
}
.xl\:list-group-horizontal > .list-group-item.active {
margin-top: 0;
}
.xl\:list-group-horizontal > .list-group-item + .list-group-item {
border-block-start-width: var(--bs-list-group-border-width);
border-inline-start-width: 0;
}
.xl\:list-group-horizontal > .list-group-item + .list-group-item.active {
margin-inline-start: calc(-1 * var(--bs-list-group-border-width));
border-inline-start-width: var(--bs-list-group-border-width);
}
}
@media (width >= 1536px) {
.\32 xl\:list-group-horizontal {
flex-direction: row;
}
.\32 xl\:list-group-horizontal > .list-group-item:first-child:not(:last-child) {
border-end-start-radius: var(--bs-list-group-border-radius);
border-start-end-radius: 0;
}
.\32 xl\:list-group-horizontal > .list-group-item:last-child:not(:first-child) {
border-start-end-radius: var(--bs-list-group-border-radius);
border-end-start-radius: 0;
}
.\32 xl\:list-group-horizontal > .list-group-item.active {
margin-top: 0;
}
.\32 xl\:list-group-horizontal > .list-group-item + .list-group-item {
border-block-start-width: var(--bs-list-group-border-width);
border-inline-start-width: 0;
}
.\32 xl\:list-group-horizontal > .list-group-item + .list-group-item.active {
margin-inline-start: calc(-1 * var(--bs-list-group-border-width));
border-inline-start-width: var(--bs-list-group-border-width);
}
}
.list-group-flush {
border-radius: 0;
}
.list-group-flush > .list-group-item {
border-width: 0 0 var(--bs-list-group-border-width);
}
.list-group-flush > .list-group-item:last-child {
border-block-end-width: 0;
}
}
@layer components {
.nav {
--bs-nav-gap: 0.125rem;
--bs-nav-link-gap: 0.5rem;
--bs-nav-link-align: center;
--bs-nav-link-justify: center;
--bs-nav-link-padding-x: 0.75rem;
--bs-nav-link-padding-y: 0.375rem;
--bs-nav-link-color: var(--bs-fg-2);
--bs-nav-link-hover-color: var(--bs-fg-1);
--bs-nav-link-hover-bg: var(--bs-bg-1);
--bs-nav-link-active-color: var(--bs-fg-body);
--bs-nav-link-active-bg: var(--bs-bg-2);
--bs-nav-link-disabled-color: var(--bs-fg-4);
--bs-nav-link-border-width: var(--bs-border-width);
--bs-nav-link-transition-property: color, background-color, border-color;
--bs-nav-link-transition-timing: 0.15s ease-in-out;
--bs-nav-link-transition: var(--bs-nav-link-transition-property) var(--bs-nav-link-transition-timing);
display: flex;
flex-wrap: wrap;
gap: var(--bs-nav-gap);
padding-inline-start: 0;
margin-bottom: 0;
list-style: none;
}
.nav-item {
display: flex;
}
.nav-link {
display: flex;
gap: var(--bs-nav-link-gap);
align-items: var(--bs-nav-link-align);
justify-content: var(--bs-nav-link-justify);
padding: var(--bs-nav-link-padding-y) var(--bs-nav-link-padding-x);
font-weight: var(--bs-nav-link-font-weight);
color: var(--bs-nav-link-color);
text-decoration: none;
white-space: nowrap;
background: none;
border: var(--bs-nav-link-border-width) solid transparent;
border-radius: var(--bs-border-radius);
transition: var(--bs-nav-link-transition);
}
@media (prefers-reduced-motion: reduce) {
.nav-link {
transition: none;
}
}
.nav-link:hover, .nav-link:focus {
color: var(--bs-nav-link-hover-color);
background-color: var(--bs-nav-link-hover-bg);
}
.nav-link:focus-visible {
--bs-focus-ring-offset: 1px;
color: var(--bs-nav-link-hover-color);
outline: var(--bs-focus-ring);
outline-offset: var(--bs-focus-ring-offset);
}
.nav-link.active, .nav-link:active {
color: var(--bs-nav-link-active-color);
background-color: var(--bs-nav-link-active-bg);
}
.nav-link.disabled, .nav-link:disabled {
color: var(--bs-nav-link-disabled-color);
pointer-events: none;
cursor: default;
}
.nav-tabs {
--bs-nav-tabs-border-width: var(--bs-border-width);
--bs-nav-tabs-border-color: var(--bs-border-color);
--bs-nav-tabs-border-radius: var(--bs-border-radius);
--bs-nav-tabs-link-hover-border-color: var(--bs-border-subtle);
--bs-nav-tabs-link-active-color: var(--bs-fg-color);
--bs-nav-tabs-link-active-bg: var(--bs-bg-body);
--bs-nav-tabs-link-active-border-color: var(--bs-border-color) var(--bs-border-color) var(--bs-bg-body);
box-shadow: inset 0 calc(-1 * var(--bs-nav-tabs-border-width)) 0 var(--bs-nav-tabs-border-color);
}
.nav-tabs .nav-link {
border: var(--bs-nav-tabs-border-width) solid transparent;
border-bottom-color: var(--bs-nav-tabs-border-color);
border-end-start-radius: 0;
border-end-end-radius: 0;
}
.nav-tabs .nav-link:hover {
isolation: isolate;
border-color: var(--bs-nav-tabs-link-hover-border-color);
border-bottom-color: var(--bs-nav-tabs-border-color);
}
.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {
color: var(--bs-nav-tabs-link-active-color);
background-color: var(--bs-nav-tabs-link-active-bg);
border-color: var(--bs-nav-tabs-link-active-border-color);
border-bottom-color: var(--bs-nav-tabs-link-active-bg);
}
.nav-tabs .menu {
margin-top: calc(-1 * var(--bs-nav-tabs-border-width));
border-start-start-radius: 0;
border-start-end-radius: 0;
}
.nav-pills {
--bs-nav-pills-link-active-color: var(--bs-primary-contrast);
--bs-nav-pills-link-active-bg: var(--bs-primary-bg);
}
.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
color: var(--bs-nav-pills-link-active-color);
background-color: var(--bs-nav-pills-link-active-bg);
}
.nav-underline {
--bs-nav-gap: 1rem;
--bs-nav-link-active-bg: transparent;
--bs-nav-underline-border-width: 0.125rem;
--bs-nav-underline-link-active-color: var(--bs-fg-color);
}
.nav-underline .nav-link {
padding-inline: 0;
border: 0;
border-block-end: var(--bs-nav-underline-border-width) solid transparent;
border-radius: 0;
}
.nav-underline .nav-link:hover, .nav-underline .nav-link:focus {
border-block-end-color: currentcolor;
}
.nav-underline .nav-link.active,
.nav-underline .show > .nav-link {
font-weight: 700;
color: var(--bs-nav-underline-link-active-color);
border-block-end-color: currentcolor;
}
.nav-fill > .nav-link,
.nav-fill .nav-item {
flex: 1 1 auto;
text-align: center;
}
.nav-justified > .nav-link,
.nav-justified .nav-item {
flex-grow: 1;
flex-basis: 0;
text-align: center;
}
.nav-fill .nav-item .nav-link,
.nav-justified .nav-item .nav-link {
width: 100%;
}
.tab-content > .tab-pane {
display: none;
}
.tab-content > .active {
display: block;
}
}
@layer components {
.nav-overflow {
flex-wrap: nowrap;
min-width: 0;
}
.nav-overflow-item {
flex-shrink: 0;
margin-inline-start: auto;
}
.nav-overflow [data-bs-nav-overflow=true] {
display: none;
}
.nav-overflow-keep {
flex-shrink: 0;
}
}
@layer components {
.navbar {
--bs-navbar-padding-x: 0;
--bs-navbar-padding-y: 0.5rem;
--bs-navbar-color: var(--bs-fg-2);
--bs-navbar-hover-color: var(--bs-fg-1);
--bs-navbar-disabled-color: var(--bs-fg-3);
--bs-navbar-active-color: var(--bs-fg-body);
--bs-navbar-brand-padding-y: 0.75rem;
--bs-navbar-brand-margin-end: 1rem;
--bs-navbar-brand-font-size: var(--bs-font-size-md);
--bs-navbar-brand-font-weight: var(--bs-font-weight-medium);
--bs-navbar-brand-color: var(--bs-fg-body);
--bs-navbar-brand-hover-color: var(--bs-fg-body);
--bs-navbar-nav-link-padding-x: 0.75rem;
--bs-navbar-toggler-width: 2rem;
--bs-navbar-toggler-padding-y: 0.25rem;
--bs-navbar-toggler-padding-x: 0.75rem;
--bs-navbar-toggler-font-size: var(--bs-font-size-lg);
--bs-navbar-toggler-border-color: color-mix(in oklch, var(--bs-fg-body) 15%, transparent);
--bs-navbar-toggler-border-radius: var(--bs-border-radius);
--bs-navbar-toggler-transition: box-shadow 0.15s ease-in-out;
position: relative;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
padding: var(--bs-navbar-padding-y) var(--bs-navbar-padding-x);
container-type: inline-size;
color: var(--bs-navbar-color, var(--bs-fg-body));
background-color: var(--bs-navbar-bg, var(--bs-bg-body));
}
.navbar > .\32 xl\:container, .navbar > .xl\:container, .navbar > .lg\:container, .navbar > .md\:container, .navbar > .sm\:container, .navbar > .container,
.navbar > .container-fluid {
display: flex;
flex-wrap: inherit;
align-items: center;
justify-content: space-between;
}
.navbar-brand {
padding-top: var(--bs-navbar-brand-padding-y);
padding-bottom: var(--bs-navbar-brand-padding-y);
margin-inline-end: var(--bs-navbar-brand-margin-end);
font-size: var(--bs-navbar-brand-font-size);
font-weight: var(--bs-navbar-brand-font-weight);
color: var(--bs-navbar-brand-color);
text-decoration: none;
white-space: nowrap;
}
.navbar-brand:hover, .navbar-brand:focus {
color: var(--bs-navbar-brand-hover-color);
}
.navbar-nav {
--bs-nav-gap: 0.25rem;
--bs-nav-link-gap: 0.5rem;
--bs-nav-link-padding-x: 0.5rem;
--bs-nav-link-padding-y: 0.375rem;
--bs-nav-link-color: var(--bs-navbar-color);
--bs-nav-link-border-width: var(--bs-border-width);
--bs-nav-link-hover-color: var(--bs-navbar-hover-color);
--bs-nav-link-hover-bg: transparent;
--bs-nav-link-active-color: var(--bs-navbar-active-color);
--bs-nav-link-active-bg: transparent;
--bs-nav-link-disabled-color: var(--bs-navbar-disabled-color);
display: flex;
flex-direction: column;
gap: var(--bs-nav-gap);
padding-inline-start: 0;
margin-bottom: 0;
list-style: none;
}
.navbar-nav .nav-link.active, .navbar-nav .nav-link.show {
color: var(--bs-navbar-active-color);
border: var(--bs-nav-link-border-width) solid var(--bs-nav-link-border-color, transparent);
}
.navbar-text {
padding-top: var(--bs-navbar-brand-padding-y);
padding-bottom: var(--bs-navbar-brand-padding-y);
color: var(--bs-navbar-color);
}
.navbar-text a,
.navbar-text a:hover,
.navbar-text a:focus {
color: var(--bs-navbar-active-color);
}
.navbar-toggler {
--bs-btn-bg: transparent;
--bs-btn-hover-bg: var(--bs-bg-2);
}
.navbar-expand > .container,
.navbar-expand > .container-fluid {
flex-wrap: nowrap;
justify-content: flex-start;
}
.navbar-expand .navbar-nav {
--bs-nav-link-padding-x: var(--bs-navbar-nav-link-padding-x);
flex-direction: row;
}
.navbar-expand .navbar-toggler {
display: none !important;
}
.navbar-expand .offcanvas {
position: static;
z-index: auto;
flex-grow: 1;
width: auto !important;
height: auto !important;
visibility: visible !important;
background-color: transparent !important;
border: 0 !important;
transform: none !important;
box-shadow: none;
transition: none;
}
.navbar-expand .offcanvas .offcanvas-header {
display: none;
}
.navbar-expand .offcanvas .offcanvas-body {
display: flex;
flex-grow: 0;
flex-direction: row;
align-items: center;
padding: 0;
overflow-y: visible;
}
.navbar-expand {
flex-wrap: nowrap;
justify-content: flex-start;
}
@container (width >= 576px) {
.sm\:navbar-expand > .container,
.sm\:navbar-expand > .container-fluid {
flex-wrap: nowrap;
justify-content: flex-start;
}
.sm\:navbar-expand .navbar-nav {
--bs-nav-link-padding-x: var(--bs-navbar-nav-link-padding-x);
flex-direction: row;
}
.sm\:navbar-expand .navbar-toggler {
display: none !important;
}
.sm\:navbar-expand .offcanvas {
position: static;
z-index: auto;
flex-grow: 1;
width: auto !important;
height: auto !important;
visibility: visible !important;
background-color: transparent !important;
border: 0 !important;
transform: none !important;
box-shadow: none;
transition: none;
}
.sm\:navbar-expand .offcanvas .offcanvas-header {
display: none;
}
.sm\:navbar-expand .offcanvas .offcanvas-body {
display: flex;
flex-grow: 0;
flex-direction: row;
align-items: center;
padding: 0;
overflow-y: visible;
}
}
@container (width >= 768px) {
.md\:navbar-expand > .container,
.md\:navbar-expand > .container-fluid {
flex-wrap: nowrap;
justify-content: flex-start;
}
.md\:navbar-expand .navbar-nav {
--bs-nav-link-padding-x: var(--bs-navbar-nav-link-padding-x);
flex-direction: row;
}
.md\:navbar-expand .navbar-toggler {
display: none !important;
}
.md\:navbar-expand .offcanvas {
position: static;
z-index: auto;
flex-grow: 1;
width: auto !important;
height: auto !important;
visibility: visible !important;
background-color: transparent !important;
border: 0 !important;
transform: none !important;
box-shadow: none;
transition: none;
}
.md\:navbar-expand .offcanvas .offcanvas-header {
display: none;
}
.md\:navbar-expand .offcanvas .offcanvas-body {
display: flex;
flex-grow: 0;
flex-direction: row;
align-items: center;
padding: 0;
overflow-y: visible;
}
}
@container (width >= 1024px) {
.lg\:navbar-expand > .container,
.lg\:navbar-expand > .container-fluid {
flex-wrap: nowrap;
justify-content: flex-start;
}
.lg\:navbar-expand .navbar-nav {
--bs-nav-link-padding-x: var(--bs-navbar-nav-link-padding-x);
flex-direction: row;
}
.lg\:navbar-expand .navbar-toggler {
display: none !important;
}
.lg\:navbar-expand .offcanvas {
position: static;
z-index: auto;
flex-grow: 1;
width: auto !important;
height: auto !important;
visibility: visible !important;
background-color: transparent !important;
border: 0 !important;
transform: none !important;
box-shadow: none;
transition: none;
}
.lg\:navbar-expand .offcanvas .offcanvas-header {
display: none;
}
.lg\:navbar-expand .offcanvas .offcanvas-body {
display: flex;
flex-grow: 0;
flex-direction: row;
align-items: center;
padding: 0;
overflow-y: visible;
}
}
@container (width >= 1280px) {
.xl\:navbar-expand > .container,
.xl\:navbar-expand > .container-fluid {
flex-wrap: nowrap;
justify-content: flex-start;
}
.xl\:navbar-expand .navbar-nav {
--bs-nav-link-padding-x: var(--bs-navbar-nav-link-padding-x);
flex-direction: row;
}
.xl\:navbar-expand .navbar-toggler {
display: none !important;
}
.xl\:navbar-expand .offcanvas {
position: static;
z-index: auto;
flex-grow: 1;
width: auto !important;
height: auto !important;
visibility: visible !important;
background-color: transparent !important;
border: 0 !important;
transform: none !important;
box-shadow: none;
transition: none;
}
.xl\:navbar-expand .offcanvas .offcanvas-header {
display: none;
}
.xl\:navbar-expand .offcanvas .offcanvas-body {
display: flex;
flex-grow: 0;
flex-direction: row;
align-items: center;
padding: 0;
overflow-y: visible;
}
}
@container (width >= 1536px) {
.\32 xl\:navbar-expand > .container,
.\32 xl\:navbar-expand > .container-fluid {
flex-wrap: nowrap;
justify-content: flex-start;
}
.\32 xl\:navbar-expand .navbar-nav {
--bs-nav-link-padding-x: var(--bs-navbar-nav-link-padding-x);
flex-direction: row;
}
.\32 xl\:navbar-expand .navbar-toggler {
display: none !important;
}
.\32 xl\:navbar-expand .offcanvas {
position: static;
z-index: auto;
flex-grow: 1;
width: auto !important;
height: auto !important;
visibility: visible !important;
background-color: transparent !important;
border: 0 !important;
transform: none !important;
box-shadow: none;
transition: none;
}
.\32 xl\:navbar-expand .offcanvas .offcanvas-header {
display: none;
}
.\32 xl\:navbar-expand .offcanvas .offcanvas-body {
display: flex;
flex-grow: 0;
flex-direction: row;
align-items: center;
padding: 0;
overflow-y: visible;
}
}
.navbar-translucent {
position: relative;
background-color: transparent;
}
.navbar-translucent::before {
position: absolute;
inset: 0;
z-index: -1;
content: "";
background-color: color-mix(in oklch, var(--bs-navbar-bg, var(--bs-bg-body)) 80%, transparent);
background-image: none;
-webkit-backdrop-filter: blur(5px) saturate(180%);
backdrop-filter: blur(5px) saturate(180%);
}
.navbar[data-bs-theme=dark] {
--bs-navbar-color: color-mix(in oklch, var(--bs-white) 0.55, transparent);
--bs-navbar-hover-color: color-mix(in oklch, var(--bs-white) 0.75, transparent);
--bs-navbar-disabled-color: color-mix(in oklch, var(--bs-white) 0.25, transparent);
--bs-navbar-active-color: var(--bs-white);
--bs-navbar-brand-color: var(--bs-white);
--bs-navbar-brand-hover-color: var(--bs-white);
--bs-navbar-toggler-border-color: color-mix(in oklch, var(--bs-white) 0.1, transparent);
}
}
.offcanvas, .\32 xl\:offcanvas, .xl\:offcanvas, .lg\:offcanvas, .md\:offcanvas, .sm\:offcanvas {
--bs-offcanvas-inset: var(--bs-spacer);
--bs-offcanvas-zindex: 1045;
--bs-offcanvas-width: 400px;
--bs-offcanvas-height: 30vh;
--bs-offcanvas-padding-x: var(--bs-spacer);
--bs-offcanvas-padding-y: var(--bs-spacer);
--bs-offcanvas-color: var(--bs-fg-body);
--bs-offcanvas-bg: var(--bs-bg-body);
--bs-offcanvas-border-width: var(--bs-border-width);
--bs-offcanvas-border-color: var(--bs-border-color-translucent);
--bs-offcanvas-border-radius: var(--bs-border-radius-lg);
--bs-offcanvas-box-shadow: var(--bs-box-shadow-lg);
--bs-offcanvas-transition: transform 0.3s ease-in-out;
--bs-offcanvas-title-line-height: 1.5;
}
@layer components {
@media (width < 576px) {
.sm\:offcanvas {
position: fixed;
z-index: var(--bs-offcanvas-zindex);
display: flex;
flex-direction: column;
max-width: calc(100% - var(--bs-offcanvas-inset) * 2);
max-height: calc(100% - var(--bs-offcanvas-inset) * 2);
color: var(--bs-offcanvas-color);
visibility: hidden;
background-color: var(--bs-offcanvas-bg);
background-clip: padding-box;
border: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
border-radius: var(--bs-offcanvas-border-radius);
outline: 0;
box-shadow: var(--bs-offcanvas-box-shadow);
transition: var(--bs-offcanvas-transition);
}
}
@media (width < 576px) and (prefers-reduced-motion: reduce) {
.sm\:offcanvas {
transition: none;
}
}
@media (width < 576px) {
.sm\:offcanvas:where(.offcanvas-start) {
inset-block: var(--bs-offcanvas-inset);
inset-inline-start: var(--bs-offcanvas-inset);
width: var(--bs-offcanvas-width);
transform: translateX(-100%);
}
:root:dir(rtl) .sm\:offcanvas:where(.offcanvas-start) {
transform: translateX(100%);
}
.sm\:offcanvas:where(.offcanvas-end) {
inset-block: var(--bs-offcanvas-inset);
inset-inline-end: var(--bs-offcanvas-inset);
width: var(--bs-offcanvas-width);
transform: translateX(100%);
}
:root:dir(rtl) .sm\:offcanvas:where(.offcanvas-end) {
transform: translateX(-100%);
}
.sm\:offcanvas:where(.offcanvas-top) {
inset: var(--bs-offcanvas-inset) var(--bs-offcanvas-inset) auto;
height: var(--bs-offcanvas-height);
transform: translateY(-100%);
}
.sm\:offcanvas:where(.offcanvas-bottom) {
inset: auto var(--bs-offcanvas-inset) var(--bs-offcanvas-inset);
height: var(--bs-offcanvas-height);
transform: translateY(100%);
}
.sm\:offcanvas:where(.offcanvas-fullscreen) {
inset: var(--bs-offcanvas-inset);
width: auto;
max-width: none;
height: auto;
max-height: none;
transform: translateY(100%);
}
.sm\:offcanvas.showing, .sm\:offcanvas.show:not(.hiding) {
transform: none;
}
.sm\:offcanvas.showing, .sm\:offcanvas.hiding, .sm\:offcanvas.show {
visibility: visible;
}
}
@media (width >= 576px) {
.sm\:offcanvas {
--bs-offcanvas-height: auto;
--bs-offcanvas-border-width: 0;
background-color: transparent !important;
}
.sm\:offcanvas .offcanvas-header {
display: none;
}
.sm\:offcanvas .offcanvas-body {
flex-grow: 0;
flex-direction: row;
padding: 0;
overflow-y: visible;
background-color: transparent !important;
}
}
@media (width < 768px) {
.md\:offcanvas {
position: fixed;
z-index: var(--bs-offcanvas-zindex);
display: flex;
flex-direction: column;
max-width: calc(100% - var(--bs-offcanvas-inset) * 2);
max-height: calc(100% - var(--bs-offcanvas-inset) * 2);
color: var(--bs-offcanvas-color);
visibility: hidden;
background-color: var(--bs-offcanvas-bg);
background-clip: padding-box;
border: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
border-radius: var(--bs-offcanvas-border-radius);
outline: 0;
box-shadow: var(--bs-offcanvas-box-shadow);
transition: var(--bs-offcanvas-transition);
}
}
@media (width < 768px) and (prefers-reduced-motion: reduce) {
.md\:offcanvas {
transition: none;
}
}
@media (width < 768px) {
.md\:offcanvas:where(.offcanvas-start) {
inset-block: var(--bs-offcanvas-inset);
inset-inline-start: var(--bs-offcanvas-inset);
width: var(--bs-offcanvas-width);
transform: translateX(-100%);
}
:root:dir(rtl) .md\:offcanvas:where(.offcanvas-start) {
transform: translateX(100%);
}
.md\:offcanvas:where(.offcanvas-end) {
inset-block: var(--bs-offcanvas-inset);
inset-inline-end: var(--bs-offcanvas-inset);
width: var(--bs-offcanvas-width);
transform: translateX(100%);
}
:root:dir(rtl) .md\:offcanvas:where(.offcanvas-end) {
transform: translateX(-100%);
}
.md\:offcanvas:where(.offcanvas-top) {
inset: var(--bs-offcanvas-inset) var(--bs-offcanvas-inset) auto;
height: var(--bs-offcanvas-height);
transform: translateY(-100%);
}
.md\:offcanvas:where(.offcanvas-bottom) {
inset: auto var(--bs-offcanvas-inset) var(--bs-offcanvas-inset);
height: var(--bs-offcanvas-height);
transform: translateY(100%);
}
.md\:offcanvas:where(.offcanvas-fullscreen) {
inset: var(--bs-offcanvas-inset);
width: auto;
max-width: none;
height: auto;
max-height: none;
transform: translateY(100%);
}
.md\:offcanvas.showing, .md\:offcanvas.show:not(.hiding) {
transform: none;
}
.md\:offcanvas.showing, .md\:offcanvas.hiding, .md\:offcanvas.show {
visibility: visible;
}
}
@media (width >= 768px) {
.md\:offcanvas {
--bs-offcanvas-height: auto;
--bs-offcanvas-border-width: 0;
background-color: transparent !important;
}
.md\:offcanvas .offcanvas-header {
display: none;
}
.md\:offcanvas .offcanvas-body {
flex-grow: 0;
flex-direction: row;
padding: 0;
overflow-y: visible;
background-color: transparent !important;
}
}
@media (width < 1024px) {
.lg\:offcanvas {
position: fixed;
z-index: var(--bs-offcanvas-zindex);
display: flex;
flex-direction: column;
max-width: calc(100% - var(--bs-offcanvas-inset) * 2);
max-height: calc(100% - var(--bs-offcanvas-inset) * 2);
color: var(--bs-offcanvas-color);
visibility: hidden;
background-color: var(--bs-offcanvas-bg);
background-clip: padding-box;
border: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
border-radius: var(--bs-offcanvas-border-radius);
outline: 0;
box-shadow: var(--bs-offcanvas-box-shadow);
transition: var(--bs-offcanvas-transition);
}
}
@media (width < 1024px) and (prefers-reduced-motion: reduce) {
.lg\:offcanvas {
transition: none;
}
}
@media (width < 1024px) {
.lg\:offcanvas:where(.offcanvas-start) {
inset-block: var(--bs-offcanvas-inset);
inset-inline-start: var(--bs-offcanvas-inset);
width: var(--bs-offcanvas-width);
transform: translateX(-100%);
}
:root:dir(rtl) .lg\:offcanvas:where(.offcanvas-start) {
transform: translateX(100%);
}
.lg\:offcanvas:where(.offcanvas-end) {
inset-block: var(--bs-offcanvas-inset);
inset-inline-end: var(--bs-offcanvas-inset);
width: var(--bs-offcanvas-width);
transform: translateX(100%);
}
:root:dir(rtl) .lg\:offcanvas:where(.offcanvas-end) {
transform: translateX(-100%);
}
.lg\:offcanvas:where(.offcanvas-top) {
inset: var(--bs-offcanvas-inset) var(--bs-offcanvas-inset) auto;
height: var(--bs-offcanvas-height);
transform: translateY(-100%);
}
.lg\:offcanvas:where(.offcanvas-bottom) {
inset: auto var(--bs-offcanvas-inset) var(--bs-offcanvas-inset);
height: var(--bs-offcanvas-height);
transform: translateY(100%);
}
.lg\:offcanvas:where(.offcanvas-fullscreen) {
inset: var(--bs-offcanvas-inset);
width: auto;
max-width: none;
height: auto;
max-height: none;
transform: translateY(100%);
}
.lg\:offcanvas.showing, .lg\:offcanvas.show:not(.hiding) {
transform: none;
}
.lg\:offcanvas.showing, .lg\:offcanvas.hiding, .lg\:offcanvas.show {
visibility: visible;
}
}
@media (width >= 1024px) {
.lg\:offcanvas {
--bs-offcanvas-height: auto;
--bs-offcanvas-border-width: 0;
background-color: transparent !important;
}
.lg\:offcanvas .offcanvas-header {
display: none;
}
.lg\:offcanvas .offcanvas-body {
flex-grow: 0;
flex-direction: row;
padding: 0;
overflow-y: visible;
background-color: transparent !important;
}
}
@media (width < 1280px) {
.xl\:offcanvas {
position: fixed;
z-index: var(--bs-offcanvas-zindex);
display: flex;
flex-direction: column;
max-width: calc(100% - var(--bs-offcanvas-inset) * 2);
max-height: calc(100% - var(--bs-offcanvas-inset) * 2);
color: var(--bs-offcanvas-color);
visibility: hidden;
background-color: var(--bs-offcanvas-bg);
background-clip: padding-box;
border: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
border-radius: var(--bs-offcanvas-border-radius);
outline: 0;
box-shadow: var(--bs-offcanvas-box-shadow);
transition: var(--bs-offcanvas-transition);
}
}
@media (width < 1280px) and (prefers-reduced-motion: reduce) {
.xl\:offcanvas {
transition: none;
}
}
@media (width < 1280px) {
.xl\:offcanvas:where(.offcanvas-start) {
inset-block: var(--bs-offcanvas-inset);
inset-inline-start: var(--bs-offcanvas-inset);
width: var(--bs-offcanvas-width);
transform: translateX(-100%);
}
:root:dir(rtl) .xl\:offcanvas:where(.offcanvas-start) {
transform: translateX(100%);
}
.xl\:offcanvas:where(.offcanvas-end) {
inset-block: var(--bs-offcanvas-inset);
inset-inline-end: var(--bs-offcanvas-inset);
width: var(--bs-offcanvas-width);
transform: translateX(100%);
}
:root:dir(rtl) .xl\:offcanvas:where(.offcanvas-end) {
transform: translateX(-100%);
}
.xl\:offcanvas:where(.offcanvas-top) {
inset: var(--bs-offcanvas-inset) var(--bs-offcanvas-inset) auto;
height: var(--bs-offcanvas-height);
transform: translateY(-100%);
}
.xl\:offcanvas:where(.offcanvas-bottom) {
inset: auto var(--bs-offcanvas-inset) var(--bs-offcanvas-inset);
height: var(--bs-offcanvas-height);
transform: translateY(100%);
}
.xl\:offcanvas:where(.offcanvas-fullscreen) {
inset: var(--bs-offcanvas-inset);
width: auto;
max-width: none;
height: auto;
max-height: none;
transform: translateY(100%);
}
.xl\:offcanvas.showing, .xl\:offcanvas.show:not(.hiding) {
transform: none;
}
.xl\:offcanvas.showing, .xl\:offcanvas.hiding, .xl\:offcanvas.show {
visibility: visible;
}
}
@media (width >= 1280px) {
.xl\:offcanvas {
--bs-offcanvas-height: auto;
--bs-offcanvas-border-width: 0;
background-color: transparent !important;
}
.xl\:offcanvas .offcanvas-header {
display: none;
}
.xl\:offcanvas .offcanvas-body {
flex-grow: 0;
flex-direction: row;
padding: 0;
overflow-y: visible;
background-color: transparent !important;
}
}
@media (width < 1536px) {
.\32 xl\:offcanvas {
position: fixed;
z-index: var(--bs-offcanvas-zindex);
display: flex;
flex-direction: column;
max-width: calc(100% - var(--bs-offcanvas-inset) * 2);
max-height: calc(100% - var(--bs-offcanvas-inset) * 2);
color: var(--bs-offcanvas-color);
visibility: hidden;
background-color: var(--bs-offcanvas-bg);
background-clip: padding-box;
border: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
border-radius: var(--bs-offcanvas-border-radius);
outline: 0;
box-shadow: var(--bs-offcanvas-box-shadow);
transition: var(--bs-offcanvas-transition);
}
}
@media (width < 1536px) and (prefers-reduced-motion: reduce) {
.\32 xl\:offcanvas {
transition: none;
}
}
@media (width < 1536px) {
.\32 xl\:offcanvas:where(.offcanvas-start) {
inset-block: var(--bs-offcanvas-inset);
inset-inline-start: var(--bs-offcanvas-inset);
width: var(--bs-offcanvas-width);
transform: translateX(-100%);
}
:root:dir(rtl) .\32 xl\:offcanvas:where(.offcanvas-start) {
transform: translateX(100%);
}
.\32 xl\:offcanvas:where(.offcanvas-end) {
inset-block: var(--bs-offcanvas-inset);
inset-inline-end: var(--bs-offcanvas-inset);
width: var(--bs-offcanvas-width);
transform: translateX(100%);
}
:root:dir(rtl) .\32 xl\:offcanvas:where(.offcanvas-end) {
transform: translateX(-100%);
}
.\32 xl\:offcanvas:where(.offcanvas-top) {
inset: var(--bs-offcanvas-inset) var(--bs-offcanvas-inset) auto;
height: var(--bs-offcanvas-height);
transform: translateY(-100%);
}
.\32 xl\:offcanvas:where(.offcanvas-bottom) {
inset: auto var(--bs-offcanvas-inset) var(--bs-offcanvas-inset);
height: var(--bs-offcanvas-height);
transform: translateY(100%);
}
.\32 xl\:offcanvas:where(.offcanvas-fullscreen) {
inset: var(--bs-offcanvas-inset);
width: auto;
max-width: none;
height: auto;
max-height: none;
transform: translateY(100%);
}
.\32 xl\:offcanvas.showing, .\32 xl\:offcanvas.show:not(.hiding) {
transform: none;
}
.\32 xl\:offcanvas.showing, .\32 xl\:offcanvas.hiding, .\32 xl\:offcanvas.show {
visibility: visible;
}
}
@media (width >= 1536px) {
.\32 xl\:offcanvas {
--bs-offcanvas-height: auto;
--bs-offcanvas-border-width: 0;
background-color: transparent !important;
}
.\32 xl\:offcanvas .offcanvas-header {
display: none;
}
.\32 xl\:offcanvas .offcanvas-body {
flex-grow: 0;
flex-direction: row;
padding: 0;
overflow-y: visible;
background-color: transparent !important;
}
}
.offcanvas {
position: fixed;
z-index: var(--bs-offcanvas-zindex);
display: flex;
flex-direction: column;
max-width: calc(100% - var(--bs-offcanvas-inset) * 2);
max-height: calc(100% - var(--bs-offcanvas-inset) * 2);
color: var(--bs-offcanvas-color);
visibility: hidden;
background-color: var(--bs-offcanvas-bg);
background-clip: padding-box;
border: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
border-radius: var(--bs-offcanvas-border-radius);
outline: 0;
box-shadow: var(--bs-offcanvas-box-shadow);
transition: var(--bs-offcanvas-transition);
}
@media (prefers-reduced-motion: reduce) {
.offcanvas {
transition: none;
}
}
.offcanvas:where(.offcanvas-start) {
inset-block: var(--bs-offcanvas-inset);
inset-inline-start: var(--bs-offcanvas-inset);
width: var(--bs-offcanvas-width);
transform: translateX(-100%);
}
:root:dir(rtl) .offcanvas:where(.offcanvas-start) {
transform: translateX(100%);
}
.offcanvas:where(.offcanvas-end) {
inset-block: var(--bs-offcanvas-inset);
inset-inline-end: var(--bs-offcanvas-inset);
width: var(--bs-offcanvas-width);
transform: translateX(100%);
}
:root:dir(rtl) .offcanvas:where(.offcanvas-end) {
transform: translateX(-100%);
}
.offcanvas:where(.offcanvas-top) {
inset: var(--bs-offcanvas-inset) var(--bs-offcanvas-inset) auto;
height: var(--bs-offcanvas-height);
transform: translateY(-100%);
}
.offcanvas:where(.offcanvas-bottom) {
inset: auto var(--bs-offcanvas-inset) var(--bs-offcanvas-inset);
height: var(--bs-offcanvas-height);
transform: translateY(100%);
}
.offcanvas:where(.offcanvas-fullscreen) {
inset: var(--bs-offcanvas-inset);
width: auto;
max-width: none;
height: auto;
max-height: none;
transform: translateY(100%);
}
.offcanvas.showing, .offcanvas.show:not(.hiding) {
transform: none;
}
.offcanvas.showing, .offcanvas.hiding, .offcanvas.show {
visibility: visible;
}
.offcanvas-backdrop {
--bs-offcanvas-backdrop-bg: var(--bs-bg-body);
--bs-offcanvas-backdrop-opacity: 25%;
--bs-offcanvas-backdrop-blur: 8px;
position: fixed;
inset: 0;
z-index: 1040;
background-color: color-mix(in oklch, var(--bs-offcanvas-backdrop-bg) var(--bs-offcanvas-backdrop-opacity), transparent);
-webkit-backdrop-filter: blur(var(--bs-offcanvas-backdrop-blur));
backdrop-filter: blur(var(--bs-offcanvas-backdrop-blur));
}
.offcanvas-backdrop.fade {
opacity: 0;
}
.offcanvas-backdrop.show {
opacity: 1;
}
.offcanvas-translucent {
background-color: color-mix(in oklch, var(--bs-offcanvas-bg) 80%, transparent);
-webkit-backdrop-filter: blur(5px) saturate(180%);
backdrop-filter: blur(5px) saturate(180%);
}
.offcanvas-header {
display: flex;
align-items: center;
padding: var(--bs-offcanvas-padding-y) var(--bs-offcanvas-padding-x);
}
.offcanvas-header .btn-close {
padding: calc(var(--bs-offcanvas-padding-y) * 0.5) calc(var(--bs-offcanvas-padding-x) * 0.5);
margin-inline-start: auto;
margin-inline-end: calc(-0.5 * var(--bs-offcanvas-padding-x));
margin-top: calc(-0.5 * var(--bs-offcanvas-padding-y));
margin-bottom: calc(-0.5 * var(--bs-offcanvas-padding-y));
}
.offcanvas-title {
margin-bottom: 0;
line-height: var(--bs-offcanvas-title-line-height);
}
.offcanvas-body {
display: flex;
flex-grow: 1;
flex-direction: column;
gap: var(--bs-offcanvas-padding-y);
padding: var(--bs-offcanvas-padding-y) var(--bs-offcanvas-padding-x);
overflow-y: auto;
}
.offcanvas-footer {
display: flex;
flex-shrink: 0;
flex-wrap: wrap;
gap: 0.5rem;
align-items: center;
justify-content: flex-end;
padding: var(--bs-offcanvas-padding-y) var(--bs-offcanvas-padding-x);
border-block-start: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
}
.offcanvas-fit-content {
inset-block-end: auto;
}
}
@layer components {
.pagination {
--bs-pagination-min-height: var(--bs-btn-input-min-height);
--bs-pagination-padding-x: var(--bs-btn-input-padding-x);
--bs-pagination-padding-y: var(--bs-btn-input-padding-y);
--bs-pagination-font-size: var(--bs-btn-input-font-size);
--bs-pagination-color: var(--bs-link-color);
--bs-pagination-bg: var(--bs-bg-body);
--bs-pagination-border-width: var(--bs-border-width);
--bs-pagination-border-color: var(--bs-border-color);
--bs-pagination-border-radius: var(--bs-btn-input-border-radius);
--bs-pagination-hover-color: var(--bs-link-hover-color);
--bs-pagination-hover-bg: var(--bs-bg-1);
--bs-pagination-hover-border-color: var(--bs-border-color);
--bs-pagination-focus-color: var(--bs-link-hover-color);
--bs-pagination-focus-bg: var(--bs-bg-2);
--bs-pagination-active-color: var(--bs-primary-contrast);
--bs-pagination-active-bg: var(--bs-primary-bg);
--bs-pagination-active-border-color: var(--bs-primary-bg);
--bs-pagination-disabled-color: var(--bs-fg-3);
--bs-pagination-disabled-bg: var(--bs-bg-2);
--bs-pagination-disabled-border-color: var(--bs-border-color);
display: flex;
padding-inline-start: 0;
list-style: none;
}
.page-link {
position: relative;
display: flex;
align-items: center;
justify-content: center;
min-height: var(--bs-pagination-min-height);
padding: var(--bs-pagination-padding-y) var(--bs-pagination-padding-x);
font-size: var(--bs-pagination-font-size);
color: var(--bs-pagination-color);
text-decoration: none;
background-color: var(--bs-pagination-bg);
border: var(--bs-pagination-border-width) solid var(--bs-pagination-border-color);
transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
@media (prefers-reduced-motion: reduce) {
.page-link {
transition: none;
}
}
.page-link:hover {
z-index: 2;
color: var(--bs-pagination-hover-color);
background-color: var(--bs-pagination-hover-bg);
border-color: var(--bs-pagination-hover-border-color);
}
.page-link:focus-visible {
z-index: 3;
color: var(--bs-pagination-focus-color);
background-color: var(--bs-pagination-focus-bg);
outline: var(--bs-focus-ring);
outline-offset: var(--bs-focus-ring-offset);
}
.page-link.active, .active > .page-link {
z-index: 3;
color: var(--bs-pagination-active-color);
background-color: var(--bs-pagination-active-bg);
border-color: var(--bs-pagination-active-border-color);
}
.page-link.disabled, .disabled > .page-link {
color: var(--bs-pagination-disabled-color);
pointer-events: none;
background-color: var(--bs-pagination-disabled-bg);
border-color: var(--bs-pagination-disabled-border-color);
}
.page-item:not(:first-child) .page-link {
margin-inline-start: calc(-1 * var(--bs-pagination-border-width));
}
.page-item:first-child .page-link {
border-start-start-radius: var(--bs-pagination-border-radius);
border-end-start-radius: var(--bs-pagination-border-radius);
}
.page-item:last-child .page-link {
border-start-end-radius: var(--bs-pagination-border-radius);
border-end-end-radius: var(--bs-pagination-border-radius);
}
.pagination-sm {
--bs-pagination-min-height: var(--bs-btn-input-sm-min-height);
--bs-pagination-padding-y: var(--bs-btn-input-sm-padding-y);
--bs-pagination-padding-x: var(--bs-btn-input-sm-padding-x);
--bs-pagination-font-size: var(--bs-btn-input-sm-font-size);
--bs-pagination-border-radius: var(--bs-btn-input-sm-border-radius);
}
.pagination-lg {
--bs-pagination-min-height: var(--bs-btn-input-lg-min-height);
--bs-pagination-padding-y: var(--bs-btn-input-lg-padding-y);
--bs-pagination-padding-x: var(--bs-btn-input-lg-padding-x);
--bs-pagination-font-size: var(--bs-btn-input-lg-font-size);
--bs-pagination-border-radius: var(--bs-btn-input-lg-border-radius);
}
}
@layer components {
.placeholder {
--bs-placeholder-opacity-max: 0.5;
--bs-placeholder-opacity-min: 0.2;
display: inline-block;
min-height: 1em;
vertical-align: middle;
cursor: wait;
background-color: currentcolor;
opacity: var(--bs-placeholder-opacity-max);
}
.placeholder.btn::before {
display: inline-block;
content: "";
}
.placeholder-xs {
min-height: 0.6em;
}
.placeholder-sm {
min-height: 0.8em;
}
.placeholder-lg {
min-height: 1.2em;
}
.placeholder-glow .placeholder {
animation: placeholder-glow 2s ease-in-out infinite;
}
@keyframes placeholder-glow {
50% {
opacity: var(--bs-placeholder-opacity-min);
}
}
.placeholder-wave {
-webkit-mask-image: linear-gradient(130deg, #000 55%, rgba(0, 0, 0, calc(1 - var(--bs-placeholder-opacity-min))) 75%, #000 95%);
mask-image: linear-gradient(130deg, #000 55%, rgba(0, 0, 0, calc(1 - var(--bs-placeholder-opacity-min))) 75%, #000 95%);
-webkit-mask-size: 200% 100%;
mask-size: 200% 100%;
animation: placeholder-wave 2s linear infinite;
}
@keyframes placeholder-wave {
100% {
-webkit-mask-position: -200% 0%;
mask-position: -200% 0%;
}
}
}
@layer components {
.popover {
--bs-popover-zindex: 1070;
--bs-popover-max-width: 280px;
--bs-popover-font-size: var(--bs-font-size-sm);
--bs-popover-bg: var(--bs-bg-body);
--bs-popover-border-width: var(--bs-border-width);
--bs-popover-border-color: var(--bs-border-color-translucent);
--bs-popover-border-radius: var(--bs-border-radius-lg);
--bs-popover-inner-border-radius: calc(var(--bs-border-radius-lg) - var(--bs-border-width));
--bs-popover-box-shadow: var(--bs-box-shadow);
--bs-popover-header-padding-x: 1rem;
--bs-popover-header-padding-y: 0.75rem;
--bs-popover-header-font-size: var(--bs-font-size-sm);
--bs-popover-header-color: inherit;
--bs-popover-header-bg: var(--bs-bg-1);
--bs-popover-body-padding-x: 1rem;
--bs-popover-body-padding-y: 0.75rem;
--bs-popover-body-color: var(--bs-fg-body);
--bs-popover-arrow-width: 1rem;
--bs-popover-arrow-height: 0.5rem;
--bs-popover-arrow-border: var(--bs-popover-border-color);
z-index: var(--bs-popover-zindex);
display: block;
max-width: var(--bs-popover-max-width);
font-family: var(--bs-body-font-family);
font-style: normal;
font-weight: var(--bs-body-font-weight);
line-height: var(--bs-body-line-height);
text-align: start;
text-decoration: none;
text-shadow: none;
text-transform: none;
letter-spacing: normal;
word-break: normal;
white-space: normal;
word-spacing: normal;
line-break: auto;
font-size: var(--bs-popover-font-size);
word-wrap: break-word;
background-color: var(--bs-popover-bg);
background-clip: padding-box;
border: var(--bs-popover-border-width) solid var(--bs-popover-border-color);
border-radius: var(--bs-popover-border-radius);
box-shadow: var(--bs-popover-box-shadow);
}
.popover .popover-arrow {
display: block;
width: var(--bs-popover-arrow-width);
height: var(--bs-popover-arrow-height);
}
.popover .popover-arrow::before, .popover .popover-arrow::after {
position: absolute;
display: block;
content: "";
border-color: transparent;
border-style: solid;
border-width: 0;
}
.bs-popover-top > .popover-arrow, .bs-popover-auto[data-bs-placement^=top] > .popover-arrow {
bottom: calc(-1 * (var(--bs-popover-arrow-height)) - var(--bs-popover-border-width));
}
.bs-popover-top > .popover-arrow::before, .bs-popover-auto[data-bs-placement^=top] > .popover-arrow::before, .bs-popover-top > .popover-arrow::after, .bs-popover-auto[data-bs-placement^=top] > .popover-arrow::after {
border-width: var(--bs-popover-arrow-height) calc(var(--bs-popover-arrow-width) * 0.5) 0;
}
.bs-popover-top > .popover-arrow::before, .bs-popover-auto[data-bs-placement^=top] > .popover-arrow::before {
bottom: 0;
border-block-start-color: var(--bs-popover-arrow-border);
}
.bs-popover-top > .popover-arrow::after, .bs-popover-auto[data-bs-placement^=top] > .popover-arrow::after {
bottom: var(--bs-popover-border-width);
border-block-start-color: var(--bs-popover-bg);
}
.bs-popover-end > .popover-arrow, .bs-popover-auto[data-bs-placement^=right] > .popover-arrow {
left: calc(-1 * (var(--bs-popover-arrow-height)) - var(--bs-popover-border-width));
width: var(--bs-popover-arrow-height);
height: var(--bs-popover-arrow-width);
}
.bs-popover-end > .popover-arrow::before, .bs-popover-auto[data-bs-placement^=right] > .popover-arrow::before, .bs-popover-end > .popover-arrow::after, .bs-popover-auto[data-bs-placement^=right] > .popover-arrow::after {
border-width: calc(var(--bs-popover-arrow-width) * 0.5) var(--bs-popover-arrow-height) calc(var(--bs-popover-arrow-width) * 0.5) 0;
}
.bs-popover-end > .popover-arrow::before, .bs-popover-auto[data-bs-placement^=right] > .popover-arrow::before {
left: 0;
border-inline-end-color: var(--bs-popover-arrow-border);
}
.bs-popover-end > .popover-arrow::after, .bs-popover-auto[data-bs-placement^=right] > .popover-arrow::after {
left: var(--bs-popover-border-width);
border-inline-end-color: var(--bs-popover-bg);
}
.bs-popover-bottom > .popover-arrow, .bs-popover-auto[data-bs-placement^=bottom] > .popover-arrow {
top: calc(-1 * (var(--bs-popover-arrow-height)) - var(--bs-popover-border-width));
}
.bs-popover-bottom > .popover-arrow::before, .bs-popover-auto[data-bs-placement^=bottom] > .popover-arrow::before, .bs-popover-bottom > .popover-arrow::after, .bs-popover-auto[data-bs-placement^=bottom] > .popover-arrow::after {
border-width: 0 calc(var(--bs-popover-arrow-width) * 0.5) var(--bs-popover-arrow-height);
}
.bs-popover-bottom > .popover-arrow::before, .bs-popover-auto[data-bs-placement^=bottom] > .popover-arrow::before {
top: 0;
border-block-end-color: var(--bs-popover-arrow-border);
}
.bs-popover-bottom > .popover-arrow::after, .bs-popover-auto[data-bs-placement^=bottom] > .popover-arrow::after {
top: var(--bs-popover-border-width);
border-block-end-color: var(--bs-popover-bg);
}
.bs-popover-bottom .popover-header::before, .bs-popover-auto[data-bs-placement^=bottom] .popover-header::before {
position: absolute;
top: 0;
left: 50%;
display: block;
width: var(--bs-popover-arrow-width);
margin-inline-start: calc(-0.5 * var(--bs-popover-arrow-width));
content: "";
border-block-end: var(--bs-popover-border-width) solid var(--bs-popover-header-bg);
}
.bs-popover-start > .popover-arrow, .bs-popover-auto[data-bs-placement^=left] > .popover-arrow {
right: calc(-1 * (var(--bs-popover-arrow-height)) - var(--bs-popover-border-width));
width: var(--bs-popover-arrow-height);
height: var(--bs-popover-arrow-width);
}
.bs-popover-start > .popover-arrow::before, .bs-popover-auto[data-bs-placement^=left] > .popover-arrow::before, .bs-popover-start > .popover-arrow::after, .bs-popover-auto[data-bs-placement^=left] > .popover-arrow::after {
border-width: calc(var(--bs-popover-arrow-width) * 0.5) 0 calc(var(--bs-popover-arrow-width) * 0.5) var(--bs-popover-arrow-height);
}
.bs-popover-start > .popover-arrow::before, .bs-popover-auto[data-bs-placement^=left] > .popover-arrow::before {
right: 0;
border-inline-start-color: var(--bs-popover-arrow-border);
}
.bs-popover-start > .popover-arrow::after, .bs-popover-auto[data-bs-placement^=left] > .popover-arrow::after {
right: var(--bs-popover-border-width);
border-inline-start-color: var(--bs-popover-bg);
}
.popover-header {
padding: var(--bs-popover-header-padding-y) var(--bs-popover-header-padding-x);
margin-bottom: 0;
font-size: var(--bs-popover-header-font-size);
color: var(--bs-popover-header-color);
background-color: var(--bs-popover-header-bg);
border-block-end: var(--bs-popover-border-width) solid var(--bs-popover-border-color);
border-start-start-radius: var(--bs-popover-inner-border-radius);
border-start-end-radius: var(--bs-popover-inner-border-radius);
}
.popover-header:empty {
display: none;
}
.popover-body {
padding: var(--bs-popover-body-padding-y) var(--bs-popover-body-padding-x);
color: var(--bs-popover-body-color);
}
}
@layer components {
@keyframes progress-bar-stripes {
0% {
background-position-x: var(--bs-progress-height);
}
}
.progress,
.progress-stacked {
--bs-progress-height: 1rem;
--bs-progress-font-size: var(--bs-font-size-sm);
--bs-progress-bg: var(--bs-bg-2);
--bs-progress-border-radius: var(--bs-border-radius);
--bs-progress-box-shadow: var(--bs-box-shadow-inset);
--bs-progress-bar-color: var(--bs-white);
--bs-progress-bar-bg: var(--bs-primary-bg);
--bs-progress-bar-transition: width 0.6s ease;
--bs-progress-bar-animation: progress-bar-stripes 1s linear infinite;
display: flex;
height: var(--bs-progress-height);
overflow: hidden;
font-size: var(--bs-progress-font-size);
background-color: var(--bs-progress-bg);
border-radius: var(--bs-progress-border-radius);
box-shadow: var(--bs-progress-box-shadow);
}
.progress-bar {
display: flex;
flex-direction: column;
justify-content: center;
overflow: hidden;
color: var(--bs-theme-contrast, var(--bs-progress-bar-color));
text-align: center;
white-space: nowrap;
background-color: var(--bs-theme-bg, var(--bs-progress-bar-bg));
transition: var(--bs-progress-bar-transition);
}
@media (prefers-reduced-motion: reduce) {
.progress-bar {
transition: none;
}
}
.progress-bar-striped {
background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
background-size: var(--bs-progress-height) var(--bs-progress-height);
}
.progress-stacked > .progress {
overflow: visible;
}
.progress-stacked > .progress > .progress-bar {
width: 100%;
}
.progress-bar-animated {
animation: var(--bs-progress-bar-animation);
}
@media (prefers-reduced-motion: reduce) {
.progress-bar-animated {
animation: none;
}
}
}
@layer components {
.spinner-grow,
.spinner-border {
display: inline-block;
flex-shrink: 0;
width: var(--bs-spinner-width);
height: var(--bs-spinner-height);
vertical-align: var(--bs-spinner-vertical-align);
border-radius: 50%;
animation: var(--bs-spinner-animation-speed) linear infinite var(--bs-spinner-animation-name);
}
@keyframes spinner-border {
to {
transform: rotate(360deg);
}
}
.spinner-border {
--bs-spinner-width: 2rem;
--bs-spinner-height: 2rem;
--bs-spinner-vertical-align: -0.125em;
--bs-spinner-border-width: 0.25em;
--bs-spinner-animation-speed: 0.75s;
--bs-spinner-animation-name: spinner-border;
border: var(--bs-spinner-border-width) solid currentcolor;
border-inline-end-color: transparent;
}
.spinner-border-sm {
--bs-spinner-width: 1rem;
--bs-spinner-height: 1rem;
--bs-spinner-border-width: .2em;
}
@keyframes spinner-grow {
0% {
transform: scale(0);
}
50% {
opacity: 1;
transform: none;
}
}
.spinner-grow {
--bs-spinner-width: 2rem;
--bs-spinner-height: 2rem;
--bs-spinner-vertical-align: -0.125em;
--bs-spinner-animation-speed: 0.75s;
--bs-spinner-animation-name: spinner-grow;
background-color: currentcolor;
opacity: 0;
}
.spinner-grow-sm {
--bs-spinner-width: 1rem;
--bs-spinner-height: 1rem;
}
@media (prefers-reduced-motion: reduce) {
.spinner-border,
.spinner-grow {
--bs-spinner-animation-speed: 1.5s;
}
}
}
@layer components {
.stepper {
--bs-stepper-size: 2rem;
--bs-stepper-gap: 1rem;
--bs-stepper-font-size: var(--bs-font-size-sm);
--bs-stepper-text-gap: 0.5rem;
--bs-stepper-track-size: 0.125rem;
--bs-stepper-bg: var(--bs-bg-2);
--bs-stepper-active-color: var(--bs-primary-contrast);
--bs-stepper-active-bg: var(--bs-primary-bg);
display: grid;
grid-auto-rows: 1fr;
grid-auto-flow: row;
gap: var(--bs-stepper-gap);
padding-inline-start: 0;
list-style: none;
counter-reset: stepper;
}
.stepper-item {
position: relative;
display: grid;
grid-template-rows: auto;
grid-template-columns: var(--bs-stepper-size) auto;
gap: var(--bs-stepper-text-gap);
align-items: var(--bs-stepper-align-items, center);
text-decoration: none;
}
.stepper-item::before {
position: relative;
z-index: 1;
display: flex;
flex-shrink: 0;
align-items: center;
justify-content: center;
width: var(--bs-stepper-size);
height: var(--bs-stepper-size);
padding: 0.5rem;
font-size: var(--bs-stepper-font-size);
font-weight: 600;
line-height: 1;
text-align: center;
content: counter(stepper);
counter-increment: stepper;
background-color: var(--bs-stepper-bg);
border-radius: 50%;
}
.stepper-item::after {
position: absolute;
inset-block-start: 50%;
inset-block-end: 100%;
inset-inline-start: calc(var(--bs-stepper-size) * 0.5 - var(--bs-stepper-track-size) * 0.5);
width: var(--bs-stepper-track-size);
height: calc(100% + var(--bs-stepper-gap));
content: "";
background-color: var(--bs-stepper-bg);
}
.stepper-item:last-child::after {
display: none;
}
.stepper-item.active::before, .stepper-item.active::after {
color: var(--bs-theme-contrast, var(--bs-stepper-active-color));
background-color: var(--bs-theme-bg, var(--bs-stepper-active-bg));
}
.stepper-item.active:not(:has(+ .stepper-item.active))::after {
background-color: var(--bs-stepper-bg);
}
.stepper-horizontal {
display: inline-grid;
grid-auto-columns: 1fr;
grid-auto-flow: column;
}
.stepper-horizontal .stepper-item {
grid-template-rows: var(--bs-stepper-size) auto;
grid-template-columns: auto;
align-items: start;
justify-items: center;
text-align: center;
}
.stepper-horizontal .stepper-item::after {
inset-block-start: calc(var(--bs-stepper-size) * 0.5 - var(--bs-stepper-track-size) * 0.5);
inset-block-end: auto;
inset-inline-start: 50%;
inset-inline-end: 100%;
width: calc(100% + var(--bs-stepper-gap));
height: var(--bs-stepper-track-size);
}
.stepper-horizontal .stepper-item:last-child::after {
right: 100%;
}
@container (width >= 576px) {
.sm\:stepper-horizontal {
display: inline-grid;
grid-auto-columns: 1fr;
grid-auto-flow: column;
}
.sm\:stepper-horizontal .stepper-item {
grid-template-rows: var(--bs-stepper-size) auto;
grid-template-columns: auto;
align-items: start;
justify-items: center;
text-align: center;
}
.sm\:stepper-horizontal .stepper-item::after {
inset-block-start: calc(var(--bs-stepper-size) * 0.5 - var(--bs-stepper-track-size) * 0.5);
inset-block-end: auto;
inset-inline-start: 50%;
inset-inline-end: 100%;
width: calc(100% + var(--bs-stepper-gap));
height: var(--bs-stepper-track-size);
}
.sm\:stepper-horizontal .stepper-item:last-child::after {
right: 100%;
}
}
@container (width >= 768px) {
.md\:stepper-horizontal {
display: inline-grid;
grid-auto-columns: 1fr;
grid-auto-flow: column;
}
.md\:stepper-horizontal .stepper-item {
grid-template-rows: var(--bs-stepper-size) auto;
grid-template-columns: auto;
align-items: start;
justify-items: center;
text-align: center;
}
.md\:stepper-horizontal .stepper-item::after {
inset-block-start: calc(var(--bs-stepper-size) * 0.5 - var(--bs-stepper-track-size) * 0.5);
inset-block-end: auto;
inset-inline-start: 50%;
inset-inline-end: 100%;
width: calc(100% + var(--bs-stepper-gap));
height: var(--bs-stepper-track-size);
}
.md\:stepper-horizontal .stepper-item:last-child::after {
right: 100%;
}
}
@container (width >= 1024px) {
.lg\:stepper-horizontal {
display: inline-grid;
grid-auto-columns: 1fr;
grid-auto-flow: column;
}
.lg\:stepper-horizontal .stepper-item {
grid-template-rows: var(--bs-stepper-size) auto;
grid-template-columns: auto;
align-items: start;
justify-items: center;
text-align: center;
}
.lg\:stepper-horizontal .stepper-item::after {
inset-block-start: calc(var(--bs-stepper-size) * 0.5 - var(--bs-stepper-track-size) * 0.5);
inset-block-end: auto;
inset-inline-start: 50%;
inset-inline-end: 100%;
width: calc(100% + var(--bs-stepper-gap));
height: var(--bs-stepper-track-size);
}
.lg\:stepper-horizontal .stepper-item:last-child::after {
right: 100%;
}
}
@container (width >= 1280px) {
.xl\:stepper-horizontal {
display: inline-grid;
grid-auto-columns: 1fr;
grid-auto-flow: column;
}
.xl\:stepper-horizontal .stepper-item {
grid-template-rows: var(--bs-stepper-size) auto;
grid-template-columns: auto;
align-items: start;
justify-items: center;
text-align: center;
}
.xl\:stepper-horizontal .stepper-item::after {
inset-block-start: calc(var(--bs-stepper-size) * 0.5 - var(--bs-stepper-track-size) * 0.5);
inset-block-end: auto;
inset-inline-start: 50%;
inset-inline-end: 100%;
width: calc(100% + var(--bs-stepper-gap));
height: var(--bs-stepper-track-size);
}
.xl\:stepper-horizontal .stepper-item:last-child::after {
right: 100%;
}
}
@container (width >= 1536px) {
.\32 xl\:stepper-horizontal {
display: inline-grid;
grid-auto-columns: 1fr;
grid-auto-flow: column;
}
.\32 xl\:stepper-horizontal .stepper-item {
grid-template-rows: var(--bs-stepper-size) auto;
grid-template-columns: auto;
align-items: start;
justify-items: center;
text-align: center;
}
.\32 xl\:stepper-horizontal .stepper-item::after {
inset-block-start: calc(var(--bs-stepper-size) * 0.5 - var(--bs-stepper-track-size) * 0.5);
inset-block-end: auto;
inset-inline-start: 50%;
inset-inline-end: 100%;
width: calc(100% + var(--bs-stepper-gap));
height: var(--bs-stepper-track-size);
}
.\32 xl\:stepper-horizontal .stepper-item:last-child::after {
right: 100%;
}
}
.stepper-overflow {
container-type: inline-size;
overflow-x: auto;
overscroll-behavior-x: contain;
-webkit-overflow-scrolling: touch;
}
.stepper-overflow > .stepper {
width: max-content;
min-width: 100%;
}
}
@layer components {
.toast {
--bs-toast-zindex: 1090;
--bs-toast-padding-x: 0.75rem;
--bs-toast-padding-y: 0.5rem;
--bs-toast-spacing: 1.5rem;
--bs-toast-max-width: 350px;
--bs-toast-font-size: 0.875rem;
--bs-toast-bg: rgba(var(--bs-body-bg-rgb), 0.85);
--bs-toast-border-width: var(--bs-border-width);
--bs-toast-border-color: var(--bs-border-color-translucent);
--bs-toast-border-radius: var(--bs-border-radius);
--bs-toast-box-shadow: var(--bs-box-shadow);
--bs-toast-header-color: var(--bs-fg-3);
--bs-toast-header-bg: rgba(var(--bs-body-bg-rgb), 0.85);
--bs-toast-header-border-color: var(--bs-border-color-translucent);
width: var(--bs-toast-max-width);
max-width: 100%;
font-size: var(--bs-toast-font-size);
color: var(--bs-toast-color);
pointer-events: auto;
background-color: var(--bs-toast-bg);
background-clip: padding-box;
border: var(--bs-toast-border-width) solid var(--bs-toast-border-color);
box-shadow: var(--bs-toast-box-shadow);
border-radius: var(--bs-toast-border-radius);
}
.toast.showing {
opacity: 0;
}
.toast:not(.show) {
display: none;
}
.toast-container {
--bs-toast-zindex: 1090;
position: absolute;
z-index: var(--bs-toast-zindex);
width: max-content;
max-width: 100%;
pointer-events: none;
}
.toast-container > :not(:last-child) {
margin-bottom: var(--bs-toast-spacing);
}
.toast-header {
display: flex;
align-items: center;
padding: var(--bs-toast-padding-y) var(--bs-toast-padding-x);
color: var(--bs-toast-header-color);
background-color: var(--bs-toast-header-bg);
background-clip: padding-box;
border-block-end: var(--bs-toast-border-width) solid var(--bs-toast-header-border-color);
border-start-start-radius: calc(var(--bs-toast-border-radius) - var(--bs-toast-border-width));
border-start-end-radius: calc(var(--bs-toast-border-radius) - var(--bs-toast-border-width));
}
.toast-header .btn-close {
margin-inline-start: var(--bs-toast-padding-x);
margin-inline-end: calc(-0.5 * var(--bs-toast-padding-x));
}
.toast-translucent {
-webkit-backdrop-filter: blur(5px) saturate(180%);
backdrop-filter: blur(5px) saturate(180%);
}
.toast-body {
padding: var(--bs-toast-padding-x);
word-wrap: break-word;
}
}
.fade {
transition: opacity 0.15s linear;
}
@media (prefers-reduced-motion: reduce) {
.fade {
transition: none;
}
}
.fade:not(.show) {
opacity: 0;
}
.collapse:not(.show) {
display: none;
}
.collapsing {
height: 0;
overflow: hidden;
transition: height 0.35s ease;
}
@media (prefers-reduced-motion: reduce) {
.collapsing {
transition: none;
}
}
.collapsing.collapse-horizontal {
width: 0;
height: auto;
transition: width 0.35s ease;
}
@media (prefers-reduced-motion: reduce) {
.collapsing.collapse-horizontal {
transition: none;
}
}
@layer helpers {
.focus-ring:focus-visible {
outline: var(--bs-focus-ring);
}
}
@layer helpers {
.icon-link {
display: inline-flex;
gap: 0.375rem;
align-items: center;
text-decoration-color: rgba(var(--bs-link-color-rgb), var(--bs-link-opacity, 0.5));
text-underline-offset: 0.25em;
backface-visibility: hidden;
}
.icon-link > .bi {
flex-shrink: 0;
width: 1em;
height: 1em;
fill: currentcolor;
transition: 0.2s ease-in-out transform;
}
@media (prefers-reduced-motion: reduce) {
.icon-link > .bi {
transition: none;
}
}
.icon-link-hover:hover > .bi, .icon-link-hover:focus-visible > .bi {
transform: var(--bs-icon-link-transform, translate3d(0.25em, 0, 0));
}
}
@layer helpers {
.fixed-top {
position: fixed;
inset: 0 0 auto;
z-index: 1030;
}
.fixed-bottom {
position: fixed;
inset: auto 0 0;
z-index: 1030;
}
.sticky-top {
position: sticky;
top: 0;
z-index: 1020;
}
.sticky-bottom {
position: sticky;
bottom: 0;
z-index: 1020;
}
@media (width >= 576px) {
.sm\:sticky-top {
position: sticky;
top: 0;
z-index: 1020;
}
.sm\:sticky-bottom {
position: sticky;
bottom: 0;
z-index: 1020;
}
}
@media (width >= 768px) {
.md\:sticky-top {
position: sticky;
top: 0;
z-index: 1020;
}
.md\:sticky-bottom {
position: sticky;
bottom: 0;
z-index: 1020;
}
}
@media (width >= 1024px) {
.lg\:sticky-top {
position: sticky;
top: 0;
z-index: 1020;
}
.lg\:sticky-bottom {
position: sticky;
bottom: 0;
z-index: 1020;
}
}
@media (width >= 1280px) {
.xl\:sticky-top {
position: sticky;
top: 0;
z-index: 1020;
}
.xl\:sticky-bottom {
position: sticky;
bottom: 0;
z-index: 1020;
}
}
@media (width >= 1536px) {
.\32 xl\:sticky-top {
position: sticky;
top: 0;
z-index: 1020;
}
.\32 xl\:sticky-bottom {
position: sticky;
bottom: 0;
z-index: 1020;
}
}
}
@layer helpers {
.stack-container {
container-type: inline-size;
}
[class*=hstack],
[class*=vstack] {
display: flex;
flex: var(--bs-stack-flex, 1 1 auto);
flex-direction: var(--bs-stack-direction, row);
align-items: var(--bs-stack-align-items, center);
align-self: var(--bs-stack-align-self, stretch);
}
.vstack {
--bs-stack-direction: column;
--bs-stack-align-items: stretch;
}
.hstack {
--bs-stack-direction: row;
--bs-stack-align-items: flex-start;
}
@container (width >= 576px) {
.sm\:vstack {
--bs-stack-direction: column;
--bs-stack-align-items: stretch;
}
}
@container (width >= 576px) {
.sm\:hstack {
--bs-stack-direction: row;
--bs-stack-align-items: flex-start;
}
}
@container (width >= 768px) {
.md\:vstack {
--bs-stack-direction: column;
--bs-stack-align-items: stretch;
}
}
@container (width >= 768px) {
.md\:hstack {
--bs-stack-direction: row;
--bs-stack-align-items: flex-start;
}
}
@container (width >= 1024px) {
.lg\:vstack {
--bs-stack-direction: column;
--bs-stack-align-items: stretch;
}
}
@container (width >= 1024px) {
.lg\:hstack {
--bs-stack-direction: row;
--bs-stack-align-items: flex-start;
}
}
@container (width >= 1280px) {
.xl\:vstack {
--bs-stack-direction: column;
--bs-stack-align-items: stretch;
}
}
@container (width >= 1280px) {
.xl\:hstack {
--bs-stack-direction: row;
--bs-stack-align-items: flex-start;
}
}
@container (width >= 1536px) {
.\32 xl\:vstack {
--bs-stack-direction: column;
--bs-stack-align-items: stretch;
}
}
@container (width >= 1536px) {
.\32 xl\:hstack {
--bs-stack-direction: row;
--bs-stack-align-items: flex-start;
}
}
}
@layer helpers {
.theme-primary {
--bs-theme-base: var(--bs-primary-base);
--bs-theme-text: var(--bs-primary-text);
--bs-theme-text-emphasis: var(--bs-primary-text-emphasis);
--bs-theme-bg: var(--bs-primary-bg);
--bs-theme-bg-subtle: var(--bs-primary-bg-subtle);
--bs-theme-bg-muted: var(--bs-primary-bg-muted);
--bs-theme-border: var(--bs-primary-border);
--bs-theme-focus-ring: var(--bs-primary-focus-ring);
--bs-theme-contrast: var(--bs-primary-contrast);
}
.theme-accent {
--bs-theme-base: var(--bs-accent-base);
--bs-theme-text: var(--bs-accent-text);
--bs-theme-text-emphasis: var(--bs-accent-text-emphasis);
--bs-theme-bg: var(--bs-accent-bg);
--bs-theme-bg-subtle: var(--bs-accent-bg-subtle);
--bs-theme-bg-muted: var(--bs-accent-bg-muted);
--bs-theme-border: var(--bs-accent-border);
--bs-theme-focus-ring: var(--bs-accent-focus-ring);
--bs-theme-contrast: var(--bs-accent-contrast);
}
.theme-success {
--bs-theme-base: var(--bs-success-base);
--bs-theme-text: var(--bs-success-text);
--bs-theme-text-emphasis: var(--bs-success-text-emphasis);
--bs-theme-bg: var(--bs-success-bg);
--bs-theme-bg-subtle: var(--bs-success-bg-subtle);
--bs-theme-bg-muted: var(--bs-success-bg-muted);
--bs-theme-border: var(--bs-success-border);
--bs-theme-focus-ring: var(--bs-success-focus-ring);
--bs-theme-contrast: var(--bs-success-contrast);
}
.theme-danger {
--bs-theme-base: var(--bs-danger-base);
--bs-theme-text: var(--bs-danger-text);
--bs-theme-text-emphasis: var(--bs-danger-text-emphasis);
--bs-theme-bg: var(--bs-danger-bg);
--bs-theme-bg-subtle: var(--bs-danger-bg-subtle);
--bs-theme-bg-muted: var(--bs-danger-bg-muted);
--bs-theme-border: var(--bs-danger-border);
--bs-theme-focus-ring: var(--bs-danger-focus-ring);
--bs-theme-contrast: var(--bs-danger-contrast);
}
.theme-warning {
--bs-theme-base: var(--bs-warning-base);
--bs-theme-text: var(--bs-warning-text);
--bs-theme-text-emphasis: var(--bs-warning-text-emphasis);
--bs-theme-bg: var(--bs-warning-bg);
--bs-theme-bg-subtle: var(--bs-warning-bg-subtle);
--bs-theme-bg-muted: var(--bs-warning-bg-muted);
--bs-theme-border: var(--bs-warning-border);
--bs-theme-focus-ring: var(--bs-warning-focus-ring);
--bs-theme-contrast: var(--bs-warning-contrast);
}
.theme-info {
--bs-theme-base: var(--bs-info-base);
--bs-theme-text: var(--bs-info-text);
--bs-theme-text-emphasis: var(--bs-info-text-emphasis);
--bs-theme-bg: var(--bs-info-bg);
--bs-theme-bg-subtle: var(--bs-info-bg-subtle);
--bs-theme-bg-muted: var(--bs-info-bg-muted);
--bs-theme-border: var(--bs-info-border);
--bs-theme-focus-ring: var(--bs-info-focus-ring);
--bs-theme-contrast: var(--bs-info-contrast);
}
.theme-inverse {
--bs-theme-base: var(--bs-inverse-base);
--bs-theme-text: var(--bs-inverse-text);
--bs-theme-text-emphasis: var(--bs-inverse-text-emphasis);
--bs-theme-bg: var(--bs-inverse-bg);
--bs-theme-bg-subtle: var(--bs-inverse-bg-subtle);
--bs-theme-bg-muted: var(--bs-inverse-bg-muted);
--bs-theme-border: var(--bs-inverse-border);
--bs-theme-focus-ring: var(--bs-inverse-focus-ring);
--bs-theme-contrast: var(--bs-inverse-contrast);
}
.theme-secondary {
--bs-theme-base: var(--bs-secondary-base);
--bs-theme-text: var(--bs-secondary-text);
--bs-theme-text-emphasis: var(--bs-secondary-text-emphasis);
--bs-theme-bg: var(--bs-secondary-bg);
--bs-theme-bg-subtle: var(--bs-secondary-bg-subtle);
--bs-theme-bg-muted: var(--bs-secondary-bg-muted);
--bs-theme-border: var(--bs-secondary-border);
--bs-theme-focus-ring: var(--bs-secondary-focus-ring);
--bs-theme-contrast: var(--bs-secondary-contrast);
}
}
@layer helpers {
.visually-hidden,
.visually-hidden-focusable:not(:focus):not(:focus-within) {
width: 1px !important;
height: 1px !important;
padding: 0 !important;
margin: -1px !important;
overflow: hidden !important;
clip: rect(0, 0, 0, 0) !important;
white-space: nowrap !important;
border: 0 !important;
}
.visually-hidden:not(caption),
.visually-hidden-focusable:not(:focus):not(:focus-within):not(caption) {
position: absolute !important;
}
.visually-hidden *,
.visually-hidden-focusable:not(:focus):not(:focus-within) * {
overflow: hidden !important;
}
}
@layer helpers {
.stretched-link::after {
position: absolute;
inset: 0;
z-index: 1;
content: "";
}
}
@layer helpers {
.text-truncate {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}
@layer helpers {
.vr {
display: inline-block;
align-self: stretch;
width: var(--bs-vr-border-width, var(--bs-border-width));
min-height: 1em;
background-color: var(--bs-border-color);
}
}
@layer utilities {
.align-baseline {
vertical-align: baseline;
}
.align-top {
vertical-align: top;
}
.align-middle {
vertical-align: middle;
}
.align-bottom {
vertical-align: bottom;
}
.align-text-bottom {
vertical-align: text-bottom;
}
.align-text-top {
vertical-align: text-top;
}
[class*=ratio-] {
aspect-ratio: var(--bs-ratio);
}
.ratio-auto {
--bs-ratio: auto;
}
.ratio-1x1 {
--bs-ratio: 1 / 1;
}
.ratio-4x3 {
--bs-ratio: 4 / 3;
}
.ratio-16x9 {
--bs-ratio: 16 / 9;
}
.ratio-21x9 {
--bs-ratio: 21 / 9;
}
.float-start {
float: inline-start;
}
.float-end {
float: inline-end;
}
.float-none {
float: none;
}
.object-fit-contain {
-o-object-fit: contain;
object-fit: contain;
}
.object-fit-cover {
-o-object-fit: cover;
object-fit: cover;
}
.object-fit-fill {
-o-object-fit: fill;
object-fit: fill;
}
.object-fit-scale {
-o-object-fit: scale-down;
object-fit: scale-down;
}
.object-fit-none {
-o-object-fit: none;
object-fit: none;
}
.opacity-0 {
opacity: 0;
}
.opacity-25 {
opacity: 0.25;
}
.opacity-50 {
opacity: 0.5;
}
.opacity-75 {
opacity: 0.75;
}
.opacity-100 {
opacity: 1;
}
.overflow-auto {
overflow: auto;
}
.overflow-hidden {
overflow: hidden;
}
.overflow-visible {
overflow: visible;
}
.overflow-scroll {
overflow: scroll;
}
.overflow-x-auto {
overflow-x: auto;
}
.overflow-x-hidden {
overflow-x: hidden;
}
.overflow-x-visible {
overflow-x: visible;
}
.overflow-x-scroll {
overflow-x: scroll;
}
.overflow-y-auto {
overflow-y: auto;
}
.overflow-y-hidden {
overflow-y: hidden;
}
.overflow-y-visible {
overflow-y: visible;
}
.overflow-y-scroll {
overflow-y: scroll;
}
.contains-inline {
container-type: inline-size;
}
.contains-size {
container-type: size;
}
.d-inline {
display: inline;
}
.d-inline-block {
display: inline-block;
}
.d-block {
display: block;
}
.d-grid {
display: grid;
}
.d-inline-grid {
display: inline-grid;
}
.d-table {
display: table;
}
.d-table-row {
display: table-row;
}
.d-table-cell {
display: table-cell;
}
.d-flex {
display: flex;
}
.d-inline-flex {
display: inline-flex;
}
.d-contents {
display: contents;
}
.d-flow-root {
display: flow-root;
}
.d-none {
display: none;
}
.shadow {
box-shadow: var(--bs-box-shadow);
}
.shadow-sm {
box-shadow: var(--bs-box-shadow-sm);
}
.shadow-lg {
box-shadow: var(--bs-box-shadow-lg);
}
.shadow-none {
box-shadow: none;
}
.focus-ring-primary {
--bs-focus-ring-color: light-dark(color-mix(in oklch, var(--bs-blue-500) 50%, var(--bs-bg-body)), color-mix(in oklch, var(--bs-blue-500) 75%, var(--bs-bg-body)));
}
.focus-ring-accent {
--bs-focus-ring-color: light-dark(color-mix(in oklch, var(--bs-indigo-500) 50%, var(--bs-bg-body)), color-mix(in oklch, var(--bs-indigo-500) 75%, var(--bs-bg-body)));
}
.focus-ring-success {
--bs-focus-ring-color: light-dark(color-mix(in oklch, var(--bs-green-500) 50%, var(--bs-bg-body)), color-mix(in oklch, var(--bs-green-500) 75%, var(--bs-bg-body)));
}
.focus-ring-danger {
--bs-focus-ring-color: light-dark(color-mix(in oklch, var(--bs-red-500) 50%, var(--bs-bg-body)), color-mix(in oklch, var(--bs-red-500) 75%, var(--bs-bg-body)));
}
.focus-ring-warning {
--bs-focus-ring-color: light-dark(color-mix(in oklch, var(--bs-yellow-500) 50%, var(--bs-bg-body)), color-mix(in oklch, var(--bs-yellow-400) 85%, var(--bs-bg-body)));
}
.focus-ring-info {
--bs-focus-ring-color: light-dark(color-mix(in oklch, var(--bs-cyan-500) 50%, var(--bs-bg-body)), color-mix(in oklch, var(--bs-cyan-500) 75%, var(--bs-bg-body)));
}
.focus-ring-inverse {
--bs-focus-ring-color: color-mix(in oklch, light-dark(var(--bs-gray-900), var(--bs-gray-100)) 50%, var(--bs-bg-body));
}
.focus-ring-secondary {
--bs-focus-ring-color: color-mix(in oklch, light-dark(var(--bs-gray-500), var(--bs-gray-300)) 50%, var(--bs-bg-body));
}
.position-static {
position: static;
}
.position-relative {
position: relative;
}
.position-absolute {
position: absolute;
}
.position-fixed {
position: fixed;
}
.position-sticky {
position: sticky;
}
.top-0 {
top: 0;
}
.top-50 {
top: 50%;
}
.top-100 {
top: 100%;
}
.bottom-0 {
bottom: 0;
}
.bottom-50 {
bottom: 50%;
}
.bottom-100 {
bottom: 100%;
}
.start-0 {
left: 0;
}
.start-50 {
left: 50%;
}
.start-100 {
left: 100%;
}
.end-0 {
right: 0;
}
.end-50 {
right: 50%;
}
.end-100 {
right: 100%;
}
.translate-middle {
transform: translate(-50%, -50%);
}
.translate-middle-x {
transform: translateX(-50%);
}
.translate-middle-y {
transform: translateY(-50%);
}
.border {
border: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color);
}
.border-0 {
border: 0;
}
.border-top {
border-block-start: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color);
}
.border-top-0 {
border-block-start: 0;
}
.border-end {
border-inline-end: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color);
}
.border-end-0 {
border-inline-end: 0;
}
.border-bottom {
border-block-end: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color);
}
.border-bottom-0 {
border-block-end: 0;
}
.border-start {
border-inline-start: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color);
}
.border-start-0 {
border-inline-start: 0;
}
.border-block {
border-block: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color);
}
.border-block-0 {
border-block: 0;
}
.border-inline {
border-inline: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color);
}
.border-inline-0 {
border-inline: 0;
}
.border-primary {
--bs-border-color: var(--bs-blue-500);
border-color: var(--bs-border-color);
}
.border-accent {
--bs-border-color: var(--bs-indigo-500);
border-color: var(--bs-border-color);
}
.border-success {
--bs-border-color: var(--bs-green-500);
border-color: var(--bs-border-color);
}
.border-danger {
--bs-border-color: var(--bs-red-500);
border-color: var(--bs-border-color);
}
.border-warning {
--bs-border-color: var(--bs-yellow-500);
border-color: var(--bs-border-color);
}
.border-info {
--bs-border-color: var(--bs-cyan-500);
border-color: var(--bs-border-color);
}
.border-inverse {
--bs-border-color: light-dark(var(--bs-gray-900), var(--bs-gray-025));
border-color: var(--bs-border-color);
}
.border-secondary {
--bs-border-color: light-dark(var(--bs-gray-100), var(--bs-gray-600));
border-color: var(--bs-border-color);
}
.border-bg {
--bs-border-color: var(--bs-bg-body);
border-color: var(--bs-border-color);
}
.border-body {
--bs-border-color: light-dark(var(--bs-gray-300), var(--bs-gray-800));
border-color: var(--bs-border-color);
}
.border-muted {
--bs-border-color: light-dark(var(--bs-gray-200), var(--bs-gray-800));
border-color: var(--bs-border-color);
}
.border-subtle {
--bs-border-color: light-dark(var(--bs-gray-100), var(--bs-gray-900));
border-color: var(--bs-border-color);
}
.border-emphasized {
--bs-border-color: light-dark(var(--bs-gray-400), var(--bs-gray-600));
border-color: var(--bs-border-color);
}
.border-white {
--bs-border-color: var(--bs-white);
border-color: var(--bs-border-color);
}
.border-black {
--bs-border-color: var(--bs-black);
border-color: var(--bs-border-color);
}
.border-subtle-primary {
--bs-border-color: light-dark(var(--bs-blue-300), var(--bs-blue-600));
border-color: var(--bs-border-color);
}
.border-subtle-accent {
--bs-border-color: light-dark(var(--bs-indigo-300), var(--bs-indigo-600));
border-color: var(--bs-border-color);
}
.border-subtle-success {
--bs-border-color: light-dark(var(--bs-green-300), var(--bs-green-600));
border-color: var(--bs-border-color);
}
.border-subtle-danger {
--bs-border-color: light-dark(var(--bs-red-300), var(--bs-red-600));
border-color: var(--bs-border-color);
}
.border-subtle-warning {
--bs-border-color: light-dark(var(--bs-yellow-300), var(--bs-yellow-600));
border-color: var(--bs-border-color);
}
.border-subtle-info {
--bs-border-color: light-dark(var(--bs-cyan-300), var(--bs-cyan-600));
border-color: var(--bs-border-color);
}
.border-subtle-inverse {
--bs-border-color: light-dark(var(--bs-gray-400), var(--bs-gray-100));
border-color: var(--bs-border-color);
}
.border-subtle-secondary {
--bs-border-color: light-dark(var(--bs-gray-300), var(--bs-gray-600));
border-color: var(--bs-border-color);
}
.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;
}
.border-10 {
border-color: color-mix(in oklch, var(--bs-border-color) 10%, transparent);
}
.border-20 {
border-color: color-mix(in oklch, var(--bs-border-color) 20%, transparent);
}
.border-30 {
border-color: color-mix(in oklch, var(--bs-border-color) 30%, transparent);
}
.border-40 {
border-color: color-mix(in oklch, var(--bs-border-color) 40%, transparent);
}
.border-50 {
border-color: color-mix(in oklch, var(--bs-border-color) 50%, transparent);
}
.border-60 {
border-color: color-mix(in oklch, var(--bs-border-color) 60%, transparent);
}
.border-70 {
border-color: color-mix(in oklch, var(--bs-border-color) 70%, transparent);
}
.border-80 {
border-color: color-mix(in oklch, var(--bs-border-color) 80%, transparent);
}
.border-90 {
border-color: color-mix(in oklch, var(--bs-border-color) 90%, transparent);
}
.border-100 {
border-color: var(--bs-border-color);
}
.w-1 {
width: 1rem;
}
.w-2 {
width: 2rem;
}
.w-3 {
width: 3rem;
}
.w-4 {
width: 4rem;
}
.w-5 {
width: 5rem;
}
.w-6 {
width: 6rem;
}
.w-7 {
width: 7rem;
}
.w-8 {
width: 8rem;
}
.w-9 {
width: 9rem;
}
.w-10 {
width: 10rem;
}
.w-11 {
width: 11rem;
}
.w-12 {
width: 12rem;
}
.w-25 {
width: 25%;
}
.w-50 {
width: 50%;
}
.w-75 {
width: 75%;
}
.w-100 {
width: 100%;
}
.w-auto {
width: auto;
}
.w-min {
width: min-content;
}
.w-max {
width: max-content;
}
.w-fit {
width: -moz-fit-content;
width: fit-content;
}
.max-w-100 {
max-width: 100%;
}
.min-w-0 {
min-width: 0;
}
.min-w-100 {
min-width: 100%;
}
.vw-100 {
width: 100vw;
}
.min-vw-100 {
min-width: 100vw;
}
.h-25 {
height: 25%;
}
.h-50 {
height: 50%;
}
.h-75 {
height: 75%;
}
.h-100 {
height: 100%;
}
.h-auto {
height: auto;
}
.h-min {
height: min-content;
}
.h-max {
height: max-content;
}
.h-fit {
height: -moz-fit-content;
height: fit-content;
}
.max-h-100 {
max-height: 100%;
}
.min-h-0 {
min-height: 0;
}
.min-h-100 {
min-height: 100%;
}
.vh-100 {
height: 100vh;
}
.min-vh-100 {
min-height: 100vh;
}
.flex-fill {
flex: 1 1 auto;
}
.flex-row {
flex-direction: row;
}
.flex-column {
flex-direction: column;
}
.flex-row-reverse {
flex-direction: row-reverse;
}
.flex-column-reverse {
flex-direction: column-reverse;
}
.flex-grow-0 {
flex-grow: 0;
}
.flex-grow-1 {
flex-grow: 1;
}
.flex-shrink-0 {
flex-shrink: 0;
}
.flex-shrink-1 {
flex-shrink: 1;
}
.flex-wrap {
flex-wrap: wrap;
}
.flex-nowrap {
flex-wrap: nowrap;
}
.flex-wrap-reverse {
flex-wrap: wrap-reverse;
}
.justify-content-start {
justify-content: flex-start;
}
.justify-content-end {
justify-content: flex-end;
}
.justify-content-center {
justify-content: center;
}
.justify-content-between {
justify-content: space-between;
}
.justify-content-around {
justify-content: space-around;
}
.justify-content-evenly {
justify-content: space-evenly;
}
.justify-items-start {
justify-items: start;
}
.justify-items-end {
justify-items: end;
}
.justify-items-center {
justify-items: center;
}
.justify-items-stretch {
justify-items: stretch;
}
.justify-self-start {
justify-self: flex-start;
}
.justify-self-end {
justify-self: flex-end;
}
.justify-self-center {
justify-self: center;
}
.align-items-start {
align-items: flex-start;
}
.align-items-end {
align-items: flex-end;
}
.align-items-center {
align-items: center;
}
.align-items-baseline {
align-items: baseline;
}
.align-items-stretch {
align-items: stretch;
}
.align-content-start {
align-content: flex-start;
}
.align-content-end {
align-content: flex-end;
}
.align-content-center {
align-content: center;
}
.align-content-between {
align-content: space-between;
}
.align-content-around {
align-content: space-around;
}
.align-content-stretch {
align-content: stretch;
}
.align-self-auto {
align-self: auto;
}
.align-self-start {
align-self: flex-start;
}
.align-self-end {
align-self: flex-end;
}
.align-self-center {
align-self: center;
}
.align-self-baseline {
align-self: baseline;
}
.align-self-stretch {
align-self: stretch;
}
.place-items-start {
place-items: start;
}
.place-items-end {
place-items: end;
}
.place-items-center {
place-items: center;
}
.place-items-stretch {
place-items: stretch;
}
.grid-cols-2 {
grid-template-columns: repeat(2, 1fr);
}
.grid-cols-3 {
grid-template-columns: repeat(3, 1fr);
}
.grid-cols-4 {
grid-template-columns: repeat(4, 1fr);
}
.grid-cols-6 {
grid-template-columns: repeat(6, 1fr);
}
.grid-cols-fill {
grid-column: 1 / -1;
}
.grid-auto-flow-row {
grid-auto-flow: row;
}
.grid-auto-flow-column {
grid-auto-flow: column;
}
.grid-auto-flow-dense {
grid-auto-flow: dense;
}
.order-first {
order: -1;
}
.order-0 {
order: 0;
}
.order-1 {
order: 1;
}
.order-2 {
order: 2;
}
.order-3 {
order: 3;
}
.order-4 {
order: 4;
}
.order-5 {
order: 5;
}
.order-last {
order: 6;
}
.m-0 {
margin: 0;
}
.m-1 {
margin: 0.25rem;
}
.m-2 {
margin: 0.5rem;
}
.m-3 {
margin: 1rem;
}
.m-4 {
margin: 1.5rem;
}
.m-5 {
margin: 3rem;
}
.m-auto {
margin: auto;
}
.mx-0 {
margin-inline: 0;
}
.mx-1 {
margin-inline: 0.25rem;
}
.mx-2 {
margin-inline: 0.5rem;
}
.mx-3 {
margin-inline: 1rem;
}
.mx-4 {
margin-inline: 1.5rem;
}
.mx-5 {
margin-inline: 3rem;
}
.mx-auto {
margin-inline: auto;
}
.my-0 {
margin-block: 0;
}
.my-1 {
margin-block: 0.25rem;
}
.my-2 {
margin-block: 0.5rem;
}
.my-3 {
margin-block: 1rem;
}
.my-4 {
margin-block: 1.5rem;
}
.my-5 {
margin-block: 3rem;
}
.my-auto {
margin-block: auto;
}
.mt-0 {
margin-block-start: 0;
}
.mt-1 {
margin-block-start: 0.25rem;
}
.mt-2 {
margin-block-start: 0.5rem;
}
.mt-3 {
margin-block-start: 1rem;
}
.mt-4 {
margin-block-start: 1.5rem;
}
.mt-5 {
margin-block-start: 3rem;
}
.mt-auto {
margin-block-start: auto;
}
.me-0 {
margin-inline-end: 0;
}
.me-1 {
margin-inline-end: 0.25rem;
}
.me-2 {
margin-inline-end: 0.5rem;
}
.me-3 {
margin-inline-end: 1rem;
}
.me-4 {
margin-inline-end: 1.5rem;
}
.me-5 {
margin-inline-end: 3rem;
}
.me-auto {
margin-inline-end: auto;
}
.mb-0 {
margin-block-end: 0;
}
.mb-1 {
margin-block-end: 0.25rem;
}
.mb-2 {
margin-block-end: 0.5rem;
}
.mb-3 {
margin-block-end: 1rem;
}
.mb-4 {
margin-block-end: 1.5rem;
}
.mb-5 {
margin-block-end: 3rem;
}
.mb-auto {
margin-block-end: auto;
}
.ms-0 {
margin-inline-start: 0;
}
.ms-1 {
margin-inline-start: 0.25rem;
}
.ms-2 {
margin-inline-start: 0.5rem;
}
.ms-3 {
margin-inline-start: 1rem;
}
.ms-4 {
margin-inline-start: 1.5rem;
}
.ms-5 {
margin-inline-start: 3rem;
}
.ms--1 {
margin-inline-start: -0.25rem;
}
.ms--2 {
margin-inline-start: -0.5rem;
}
.ms-auto {
margin-inline-start: auto;
}
.p-0 {
padding: 0;
}
.p-1 {
padding: 0.25rem;
}
.p-2 {
padding: 0.5rem;
}
.p-3 {
padding: 1rem;
}
.p-4 {
padding: 1.5rem;
}
.p-5 {
padding: 3rem;
}
.px-0 {
padding-inline: 0;
}
.px-1 {
padding-inline: 0.25rem;
}
.px-2 {
padding-inline: 0.5rem;
}
.px-3 {
padding-inline: 1rem;
}
.px-4 {
padding-inline: 1.5rem;
}
.px-5 {
padding-inline: 3rem;
}
.py-0 {
padding-block: 0;
}
.py-1 {
padding-block: 0.25rem;
}
.py-2 {
padding-block: 0.5rem;
}
.py-3 {
padding-block: 1rem;
}
.py-4 {
padding-block: 1.5rem;
}
.py-5 {
padding-block: 3rem;
}
.pt-0 {
padding-block-start: 0;
}
.pt-1 {
padding-block-start: 0.25rem;
}
.pt-2 {
padding-block-start: 0.5rem;
}
.pt-3 {
padding-block-start: 1rem;
}
.pt-4 {
padding-block-start: 1.5rem;
}
.pt-5 {
padding-block-start: 3rem;
}
.pe-0 {
padding-inline-end: 0;
}
.pe-1 {
padding-inline-end: 0.25rem;
}
.pe-2 {
padding-inline-end: 0.5rem;
}
.pe-3 {
padding-inline-end: 1rem;
}
.pe-4 {
padding-inline-end: 1.5rem;
}
.pe-5 {
padding-inline-end: 3rem;
}
.pb-0 {
padding-block-end: 0;
}
.pb-1 {
padding-block-end: 0.25rem;
}
.pb-2 {
padding-block-end: 0.5rem;
}
.pb-3 {
padding-block-end: 1rem;
}
.pb-4 {
padding-block-end: 1.5rem;
}
.pb-5 {
padding-block-end: 3rem;
}
.ps-0 {
padding-inline-start: 0;
}
.ps-1 {
padding-inline-start: 0.25rem;
}
.ps-2 {
padding-inline-start: 0.5rem;
}
.ps-3 {
padding-inline-start: 1rem;
}
.ps-4 {
padding-inline-start: 1.5rem;
}
.ps-5 {
padding-inline-start: 3rem;
}
.gap-0 {
gap: 0;
}
.gap-1 {
gap: 0.25rem;
}
.gap-2 {
gap: 0.5rem;
}
.gap-3 {
gap: 1rem;
}
.gap-4 {
gap: 1.5rem;
}
.gap-5 {
gap: 3rem;
}
.row-gap-0 {
row-gap: 0;
}
.row-gap-1 {
row-gap: 0.25rem;
}
.row-gap-2 {
row-gap: 0.5rem;
}
.row-gap-3 {
row-gap: 1rem;
}
.row-gap-4 {
row-gap: 1.5rem;
}
.row-gap-5 {
row-gap: 3rem;
}
.column-gap-0 {
-moz-column-gap: 0;
column-gap: 0;
}
.column-gap-1 {
-moz-column-gap: 0.25rem;
column-gap: 0.25rem;
}
.column-gap-2 {
-moz-column-gap: 0.5rem;
column-gap: 0.5rem;
}
.column-gap-3 {
-moz-column-gap: 1rem;
column-gap: 1rem;
}
.column-gap-4 {
-moz-column-gap: 1.5rem;
column-gap: 1.5rem;
}
.column-gap-5 {
-moz-column-gap: 3rem;
column-gap: 3rem;
}
.font-monospace {
font-family: var(--bs-font-mono);
}
.font-body {
font-family: var(--bs-body-font-family);
}
.fs-xs {
font-size: 0.75rem;
}
.fs-sm {
font-size: 0.875rem;
}
.fs-md {
font-size: 1rem;
}
.fs-lg {
font-size: clamp(1.25rem, 1rem + 0.625vw, 1.5rem);
}
.fs-xl {
font-size: clamp(1.5rem, 1.1rem + 0.75vw, 1.75rem);
}
.fs-2xl {
font-size: clamp(1.75rem, 1.3rem + 1vw, 2rem);
}
.fs-3xl {
font-size: clamp(2rem, 1.5rem + 1.875vw, 2.5rem);
}
.fs-4xl {
font-size: clamp(2.25rem, 1.75rem + 2.5vw, 3rem);
}
.fs-5xl {
font-size: clamp(3rem, 2rem + 5vw, 4rem);
}
.fs-6xl {
font-size: clamp(3.75rem, 2.5rem + 6.25vw, 5rem);
}
.text-xs {
font-size: 0.75rem;
line-height: 1.25;
}
.text-sm {
font-size: 0.875rem;
line-height: 1.5;
}
.text-md {
font-size: 1rem;
line-height: 1.5;
}
.text-lg {
font-size: clamp(1.25rem, 1rem + 0.625vw, 1.5rem);
line-height: 1.5;
}
.text-xl {
font-size: clamp(1.5rem, 1.1rem + 0.75vw, 1.75rem);
line-height: 1.4285714286;
}
.text-2xl {
font-size: clamp(1.75rem, 1.3rem + 1vw, 2rem);
line-height: 1.3333333333;
}
.text-3xl {
font-size: clamp(2rem, 1.5rem + 1.875vw, 2.5rem);
line-height: 1.2;
}
.text-4xl {
font-size: clamp(2.25rem, 1.75rem + 2.5vw, 3rem);
line-height: 1.1;
}
.text-5xl {
font-size: clamp(3rem, 2rem + 5vw, 4rem);
line-height: 1.1;
}
.text-6xl {
font-size: clamp(3.75rem, 2.5rem + 6.25vw, 5rem);
line-height: 1;
}
.fst-italic {
font-style: italic;
}
.fst-normal {
font-style: normal;
}
.fw-lighter {
font-weight: lighter;
}
.fw-light {
font-weight: 300;
}
.fw-normal {
font-weight: 400;
}
.fw-medium {
font-weight: 500;
}
.fw-semibold {
font-weight: 600;
}
.fw-bold {
font-weight: 700;
}
.fw-bolder {
font-weight: bolder;
}
.lh-1 {
line-height: 1;
}
.lh-sm {
line-height: 1.25;
}
.lh-base {
line-height: 1.5;
}
.lh-lg {
line-height: 2;
}
.text-start {
text-align: start;
}
.text-end {
text-align: end;
}
.text-center {
text-align: center;
}
.text-decoration-none {
text-decoration: none;
}
.text-decoration-underline {
text-decoration: underline;
}
.text-decoration-line-through {
text-decoration: line-through;
}
.text-lowercase {
text-transform: lowercase;
}
.text-uppercase {
text-transform: uppercase;
}
.text-capitalize {
text-transform: capitalize;
}
.text-wrap {
white-space: wrap;
}
.text-nowrap {
white-space: nowrap;
}
.text-balance {
white-space: balance;
}
.text-pretty {
white-space: pretty;
}
.text-break {
word-wrap: break-word;
word-break: break-word;
}
.fg-primary {
--bs-fg: light-dark(var(--bs-blue-600), var(--bs-blue-400));
color: var(--bs-fg);
}
.fg-accent {
--bs-fg: light-dark(var(--bs-indigo-600), color-mix(in oklch, var(--bs-indigo-400), var(--bs-indigo-300)));
color: var(--bs-fg);
}
.fg-success {
--bs-fg: light-dark(var(--bs-green-600), var(--bs-green-400));
color: var(--bs-fg);
}
.fg-danger {
--bs-fg: light-dark(var(--bs-red-600), var(--bs-red-400));
color: var(--bs-fg);
}
.fg-warning {
--bs-fg: light-dark(var(--bs-yellow-700), var(--bs-yellow-400));
color: var(--bs-fg);
}
.fg-info {
--bs-fg: light-dark(var(--bs-cyan-600), var(--bs-cyan-400));
color: var(--bs-fg);
}
.fg-inverse {
--bs-fg: light-dark(var(--bs-gray-900), var(--bs-gray-200));
color: var(--bs-fg);
}
.fg-secondary {
--bs-fg: light-dark(var(--bs-gray-600), var(--bs-gray-400));
color: var(--bs-fg);
}
.fg-body {
--bs-fg: light-dark(var(--bs-gray-900), var(--bs-gray-050));
color: var(--bs-fg);
}
.fg-1 {
--bs-fg: light-dark(var(--bs-gray-800), var(--bs-gray-200));
color: var(--bs-fg);
}
.fg-2 {
--bs-fg: light-dark(var(--bs-gray-700), var(--bs-gray-300));
color: var(--bs-fg);
}
.fg-3 {
--bs-fg: light-dark(var(--bs-gray-600), var(--bs-gray-500));
color: var(--bs-fg);
}
.fg-4 {
--bs-fg: light-dark(var(--bs-gray-500), var(--bs-gray-600));
color: var(--bs-fg);
}
.fg-white {
--bs-fg: var(--bs-white);
color: var(--bs-fg);
}
.fg-black {
--bs-fg: var(--bs-black);
color: var(--bs-fg);
}
.fg-inherit {
--bs-fg: inherit;
color: var(--bs-fg);
}
.fg-emphasis-primary {
--bs-fg: light-dark(var(--bs-blue-800), var(--bs-blue-200));
color: var(--bs-fg);
}
.fg-emphasis-accent {
--bs-fg: light-dark(var(--bs-indigo-800), var(--bs-indigo-300));
color: var(--bs-fg);
}
.fg-emphasis-success {
--bs-fg: light-dark(var(--bs-green-800), var(--bs-green-300));
color: var(--bs-fg);
}
.fg-emphasis-danger {
--bs-fg: light-dark(var(--bs-red-800), var(--bs-red-300));
color: var(--bs-fg);
}
.fg-emphasis-warning {
--bs-fg: light-dark(var(--bs-yellow-800), var(--bs-yellow-300));
color: var(--bs-fg);
}
.fg-emphasis-info {
--bs-fg: light-dark(var(--bs-cyan-800), var(--bs-cyan-300));
color: var(--bs-fg);
}
.fg-emphasis-inverse {
--bs-fg: light-dark(var(--bs-gray-975), var(--bs-white));
color: var(--bs-fg);
}
.fg-emphasis-secondary {
--bs-fg: light-dark(var(--bs-gray-800), var(--bs-gray-200));
color: var(--bs-fg);
}
.fg-contrast-primary {
--bs-fg: var(--bs-white);
color: var(--bs-fg);
}
.fg-contrast-accent {
--bs-fg: var(--bs-white);
color: var(--bs-fg);
}
.fg-contrast-success {
--bs-fg: var(--bs-white);
color: var(--bs-fg);
}
.fg-contrast-danger {
--bs-fg: var(--bs-white);
color: var(--bs-fg);
}
.fg-contrast-warning {
--bs-fg: var(--bs-gray-900);
color: var(--bs-fg);
}
.fg-contrast-info {
--bs-fg: var(--bs-gray-900);
color: var(--bs-fg);
}
.fg-contrast-inverse {
--bs-fg: light-dark(var(--bs-white), var(--bs-gray-900));
color: var(--bs-fg);
}
.fg-contrast-secondary {
--bs-fg: light-dark(var(--bs-gray-900), var(--bs-white));
color: var(--bs-fg);
}
.fg-10 {
color: color-mix(in oklch, var(--bs-fg) 10%, transparent);
}
.fg-20 {
color: color-mix(in oklch, var(--bs-fg) 20%, transparent);
}
.fg-30 {
color: color-mix(in oklch, var(--bs-fg) 30%, transparent);
}
.fg-40 {
color: color-mix(in oklch, var(--bs-fg) 40%, transparent);
}
.fg-50 {
color: color-mix(in oklch, var(--bs-fg) 50%, transparent);
}
.fg-60 {
color: color-mix(in oklch, var(--bs-fg) 60%, transparent);
}
.fg-70 {
color: color-mix(in oklch, var(--bs-fg) 70%, transparent);
}
.fg-80 {
color: color-mix(in oklch, var(--bs-fg) 80%, transparent);
}
.fg-90 {
color: color-mix(in oklch, var(--bs-fg) 90%, transparent);
}
.fg-100 {
color: var(--bs-fg);
}
.link-10 {
color: color-mix(in oklch, var(--bs-link-color) 10%, transparent);
}
.link-10-hover:hover {
color: color-mix(in oklch, var(--bs-link-color) 10%, transparent);
}
.link-20 {
color: color-mix(in oklch, var(--bs-link-color) 20%, transparent);
}
.link-20-hover:hover {
color: color-mix(in oklch, var(--bs-link-color) 20%, transparent);
}
.link-30 {
color: color-mix(in oklch, var(--bs-link-color) 30%, transparent);
}
.link-30-hover:hover {
color: color-mix(in oklch, var(--bs-link-color) 30%, transparent);
}
.link-40 {
color: color-mix(in oklch, var(--bs-link-color) 40%, transparent);
}
.link-40-hover:hover {
color: color-mix(in oklch, var(--bs-link-color) 40%, transparent);
}
.link-50 {
color: color-mix(in oklch, var(--bs-link-color) 50%, transparent);
}
.link-50-hover:hover {
color: color-mix(in oklch, var(--bs-link-color) 50%, transparent);
}
.link-60 {
color: color-mix(in oklch, var(--bs-link-color) 60%, transparent);
}
.link-60-hover:hover {
color: color-mix(in oklch, var(--bs-link-color) 60%, transparent);
}
.link-70 {
color: color-mix(in oklch, var(--bs-link-color) 70%, transparent);
}
.link-70-hover:hover {
color: color-mix(in oklch, var(--bs-link-color) 70%, transparent);
}
.link-80 {
color: color-mix(in oklch, var(--bs-link-color) 80%, transparent);
}
.link-80-hover:hover {
color: color-mix(in oklch, var(--bs-link-color) 80%, transparent);
}
.link-90 {
color: color-mix(in oklch, var(--bs-link-color) 90%, transparent);
}
.link-90-hover:hover {
color: color-mix(in oklch, var(--bs-link-color) 90%, transparent);
}
.link-100 {
color: var(--bs-link-color);
}
.link-100-hover:hover {
color: var(--bs-link-color);
}
.underline-offset-1 {
text-underline-offset: 0.125em;
}
.underline-offset-1-hover:hover {
text-underline-offset: 0.125em;
}
.underline-offset-2 {
text-underline-offset: 0.25em;
}
.underline-offset-2-hover:hover {
text-underline-offset: 0.25em;
}
.underline-offset-3 {
text-underline-offset: 0.375em;
}
.underline-offset-3-hover:hover {
text-underline-offset: 0.375em;
}
.underline-primary {
text-decoration-color: light-dark(var(--bs-blue-600), var(--bs-blue-400));
}
.underline-accent {
text-decoration-color: light-dark(var(--bs-indigo-600), color-mix(in oklch, var(--bs-indigo-400), var(--bs-indigo-300)));
}
.underline-success {
text-decoration-color: light-dark(var(--bs-green-600), var(--bs-green-400));
}
.underline-danger {
text-decoration-color: light-dark(var(--bs-red-600), var(--bs-red-400));
}
.underline-warning {
text-decoration-color: light-dark(var(--bs-yellow-700), var(--bs-yellow-400));
}
.underline-info {
text-decoration-color: light-dark(var(--bs-cyan-600), var(--bs-cyan-400));
}
.underline-inverse {
text-decoration-color: light-dark(var(--bs-gray-900), var(--bs-gray-200));
}
.underline-secondary {
text-decoration-color: light-dark(var(--bs-gray-600), var(--bs-gray-400));
}
.underline-10 {
text-decoration-color: color-mix(in oklch, var(--bs-link-color) 10%, transparent);
}
.underline-10-hover:hover {
text-decoration-color: color-mix(in oklch, var(--bs-link-color) 10%, transparent);
}
.underline-20 {
text-decoration-color: color-mix(in oklch, var(--bs-link-color) 20%, transparent);
}
.underline-20-hover:hover {
text-decoration-color: color-mix(in oklch, var(--bs-link-color) 20%, transparent);
}
.underline-30 {
text-decoration-color: color-mix(in oklch, var(--bs-link-color) 30%, transparent);
}
.underline-30-hover:hover {
text-decoration-color: color-mix(in oklch, var(--bs-link-color) 30%, transparent);
}
.underline-40 {
text-decoration-color: color-mix(in oklch, var(--bs-link-color) 40%, transparent);
}
.underline-40-hover:hover {
text-decoration-color: color-mix(in oklch, var(--bs-link-color) 40%, transparent);
}
.underline-50 {
text-decoration-color: color-mix(in oklch, var(--bs-link-color) 50%, transparent);
}
.underline-50-hover:hover {
text-decoration-color: color-mix(in oklch, var(--bs-link-color) 50%, transparent);
}
.underline-60 {
text-decoration-color: color-mix(in oklch, var(--bs-link-color) 60%, transparent);
}
.underline-60-hover:hover {
text-decoration-color: color-mix(in oklch, var(--bs-link-color) 60%, transparent);
}
.underline-70 {
text-decoration-color: color-mix(in oklch, var(--bs-link-color) 70%, transparent);
}
.underline-70-hover:hover {
text-decoration-color: color-mix(in oklch, var(--bs-link-color) 70%, transparent);
}
.underline-80 {
text-decoration-color: color-mix(in oklch, var(--bs-link-color) 80%, transparent);
}
.underline-80-hover:hover {
text-decoration-color: color-mix(in oklch, var(--bs-link-color) 80%, transparent);
}
.underline-90 {
text-decoration-color: color-mix(in oklch, var(--bs-link-color) 90%, transparent);
}
.underline-90-hover:hover {
text-decoration-color: color-mix(in oklch, var(--bs-link-color) 90%, transparent);
}
.underline-100 {
text-decoration-color: var(--bs-link-color);
}
.underline-100-hover:hover {
text-decoration-color: var(--bs-link-color);
}
.underline-thickness-1 {
text-decoration-thickness: 1px;
}
.underline-thickness-1-hover:hover {
text-decoration-thickness: 1px;
}
.underline-thickness-2 {
text-decoration-thickness: 2px;
}
.underline-thickness-2-hover:hover {
text-decoration-thickness: 2px;
}
.underline-thickness-3 {
text-decoration-thickness: 3px;
}
.underline-thickness-3-hover:hover {
text-decoration-thickness: 3px;
}
.underline-thickness-4 {
text-decoration-thickness: 4px;
}
.underline-thickness-4-hover:hover {
text-decoration-thickness: 4px;
}
.underline-thickness-5 {
text-decoration-thickness: 5px;
}
.underline-thickness-5-hover:hover {
text-decoration-thickness: 5px;
}
.bg-primary {
--bs-bg: var(--bs-blue-500);
background-color: var(--bs-bg);
}
.bg-accent {
--bs-bg: var(--bs-indigo-500);
background-color: var(--bs-bg);
}
.bg-success {
--bs-bg: var(--bs-green-500);
background-color: var(--bs-bg);
}
.bg-danger {
--bs-bg: var(--bs-red-500);
background-color: var(--bs-bg);
}
.bg-warning {
--bs-bg: var(--bs-yellow-500);
background-color: var(--bs-bg);
}
.bg-info {
--bs-bg: var(--bs-cyan-500);
background-color: var(--bs-bg);
}
.bg-inverse {
--bs-bg: light-dark(var(--bs-gray-900), var(--bs-gray-025));
background-color: var(--bs-bg);
}
.bg-secondary {
--bs-bg: light-dark(var(--bs-gray-100), var(--bs-gray-600));
background-color: var(--bs-bg);
}
.bg-body {
--bs-bg: light-dark(var(--bs-white), var(--bs-gray-975));
background-color: var(--bs-bg);
}
.bg-1 {
--bs-bg: light-dark(var(--bs-gray-025), var(--bs-gray-950));
background-color: var(--bs-bg);
}
.bg-2 {
--bs-bg: light-dark(var(--bs-gray-050), var(--bs-gray-900));
background-color: var(--bs-bg);
}
.bg-3 {
--bs-bg: light-dark(var(--bs-gray-100), var(--bs-gray-800));
background-color: var(--bs-bg);
}
.bg-4 {
--bs-bg: light-dark(var(--bs-gray-200), var(--bs-gray-700));
background-color: var(--bs-bg);
}
.bg-white {
--bs-bg: var(--bs-white);
background-color: var(--bs-bg);
}
.bg-black {
--bs-bg: var(--bs-black);
background-color: var(--bs-bg);
}
.bg-transparent {
--bs-bg: transparent;
background-color: var(--bs-bg);
}
.bg-inherit {
--bs-bg: inherit;
background-color: var(--bs-bg);
}
.bg-subtle-primary {
--bs-bg: light-dark(var(--bs-blue-100), var(--bs-blue-900));
background-color: var(--bs-bg);
}
.bg-subtle-accent {
--bs-bg: light-dark(var(--bs-indigo-100), var(--bs-indigo-900));
background-color: var(--bs-bg);
}
.bg-subtle-success {
--bs-bg: light-dark(var(--bs-green-100), var(--bs-green-900));
background-color: var(--bs-bg);
}
.bg-subtle-danger {
--bs-bg: light-dark(var(--bs-red-100), var(--bs-red-900));
background-color: var(--bs-bg);
}
.bg-subtle-warning {
--bs-bg: light-dark(var(--bs-yellow-100), var(--bs-yellow-900));
background-color: var(--bs-bg);
}
.bg-subtle-info {
--bs-bg: light-dark(var(--bs-cyan-100), var(--bs-cyan-900));
background-color: var(--bs-bg);
}
.bg-subtle-inverse {
--bs-bg: light-dark(var(--bs-gray-100), var(--bs-gray-900));
background-color: var(--bs-bg);
}
.bg-subtle-secondary {
--bs-bg: light-dark(var(--bs-gray-050), var(--bs-gray-800));
background-color: var(--bs-bg);
}
.bg-muted-primary {
--bs-bg: light-dark(var(--bs-blue-200), var(--bs-blue-800));
background-color: var(--bs-bg);
}
.bg-muted-accent {
--bs-bg: light-dark(var(--bs-indigo-200), var(--bs-indigo-800));
background-color: var(--bs-bg);
}
.bg-muted-success {
--bs-bg: light-dark(var(--bs-green-200), var(--bs-green-800));
background-color: var(--bs-bg);
}
.bg-muted-danger {
--bs-bg: light-dark(var(--bs-red-200), var(--bs-red-800));
background-color: var(--bs-bg);
}
.bg-muted-warning {
--bs-bg: light-dark(var(--bs-yellow-200), var(--bs-yellow-800));
background-color: var(--bs-bg);
}
.bg-muted-info {
--bs-bg: light-dark(var(--bs-cyan-200), var(--bs-cyan-800));
background-color: var(--bs-bg);
}
.bg-muted-inverse {
--bs-bg: light-dark(var(--bs-gray-200), var(--bs-gray-300));
background-color: var(--bs-bg);
}
.bg-muted-secondary {
--bs-bg: light-dark(var(--bs-gray-100), var(--bs-gray-700));
background-color: var(--bs-bg);
}
.bg-10 {
background-color: color-mix(in oklch, var(--bs-bg) 10%, transparent);
}
.bg-20 {
background-color: color-mix(in oklch, var(--bs-bg) 20%, transparent);
}
.bg-30 {
background-color: color-mix(in oklch, var(--bs-bg) 30%, transparent);
}
.bg-40 {
background-color: color-mix(in oklch, var(--bs-bg) 40%, transparent);
}
.bg-50 {
background-color: color-mix(in oklch, var(--bs-bg) 50%, transparent);
}
.bg-60 {
background-color: color-mix(in oklch, var(--bs-bg) 60%, transparent);
}
.bg-70 {
background-color: color-mix(in oklch, var(--bs-bg) 70%, transparent);
}
.bg-80 {
background-color: color-mix(in oklch, var(--bs-bg) 80%, transparent);
}
.bg-90 {
background-color: color-mix(in oklch, var(--bs-bg) 90%, transparent);
}
.bg-100 {
background-color: var(--bs-bg);
}
.theme-contrast {
background-color: var(--bs-theme-bg);
color: var(--bs-theme-contrast);
}
.theme-subtle {
background-color: var(--bs-theme-bg-subtle);
color: var(--bs-theme-text);
}
.theme-muted {
background-color: var(--bs-theme-bg-muted);
color: var(--bs-theme-text-emphasis);
}
.theme-border {
border: var(--bs-border-width) solid var(--bs-theme-border);
}
.bg-gradient {
background-image: var(--bs-gradient);
}
.user-select-all {
-webkit-user-select: all;
user-select: all;
}
.user-select-auto {
-webkit-user-select: auto;
user-select: auto;
}
.user-select-text {
-webkit-user-select: text;
user-select: text;
}
.user-select-none {
-webkit-user-select: none;
user-select: none;
}
.pe-none {
pointer-events: none;
}
.pe-auto {
pointer-events: auto;
}
.rounded {
border-radius: var(--bs-border-radius);
}
.rounded-0 {
border-radius: 0;
}
.rounded-1 {
border-radius: var(--bs-border-radius-sm);
}
.rounded-2 {
border-radius: var(--bs-border-radius);
}
.rounded-3 {
border-radius: var(--bs-border-radius-lg);
}
.rounded-4 {
border-radius: var(--bs-border-radius-xl);
}
.rounded-5 {
border-radius: var(--bs-border-radius-2xl);
}
.rounded-circle {
border-radius: 50%;
}
.rounded-pill {
border-radius: var(--bs-border-radius-pill);
}
.rounded-top {
border-start-start-radius: var(--bs-border-radius);
border-start-end-radius: var(--bs-border-radius);
}
.rounded-top-0 {
border-start-start-radius: 0;
border-start-end-radius: 0;
}
.rounded-top-1 {
border-start-start-radius: var(--bs-border-radius-sm);
border-start-end-radius: var(--bs-border-radius-sm);
}
.rounded-top-2 {
border-start-start-radius: var(--bs-border-radius);
border-start-end-radius: var(--bs-border-radius);
}
.rounded-top-3 {
border-start-start-radius: var(--bs-border-radius-lg);
border-start-end-radius: var(--bs-border-radius-lg);
}
.rounded-top-4 {
border-start-start-radius: var(--bs-border-radius-xl);
border-start-end-radius: var(--bs-border-radius-xl);
}
.rounded-top-5 {
border-start-start-radius: var(--bs-border-radius-2xl);
border-start-end-radius: var(--bs-border-radius-2xl);
}
.rounded-top-circle {
border-start-start-radius: 50%;
border-start-end-radius: 50%;
}
.rounded-top-pill {
border-start-start-radius: var(--bs-border-radius-pill);
border-start-end-radius: var(--bs-border-radius-pill);
}
.rounded-end {
border-end-end-radius: var(--bs-border-radius);
border-end-start-radius: var(--bs-border-radius);
}
.rounded-end-0 {
border-end-end-radius: 0;
border-end-start-radius: 0;
}
.rounded-end-1 {
border-end-end-radius: var(--bs-border-radius-sm);
border-end-start-radius: var(--bs-border-radius-sm);
}
.rounded-end-2 {
border-end-end-radius: var(--bs-border-radius);
border-end-start-radius: var(--bs-border-radius);
}
.rounded-end-3 {
border-end-end-radius: var(--bs-border-radius-lg);
border-end-start-radius: var(--bs-border-radius-lg);
}
.rounded-end-4 {
border-end-end-radius: var(--bs-border-radius-xl);
border-end-start-radius: var(--bs-border-radius-xl);
}
.rounded-end-5 {
border-end-end-radius: var(--bs-border-radius-2xl);
border-end-start-radius: var(--bs-border-radius-2xl);
}
.rounded-end-circle {
border-end-end-radius: 50%;
border-end-start-radius: 50%;
}
.rounded-end-pill {
border-end-end-radius: var(--bs-border-radius-pill);
border-end-start-radius: var(--bs-border-radius-pill);
}
.rounded-bottom {
border-end-end-radius: var(--bs-border-radius);
border-end-start-radius: var(--bs-border-radius);
}
.rounded-bottom-0 {
border-end-end-radius: 0;
border-end-start-radius: 0;
}
.rounded-bottom-1 {
border-end-end-radius: var(--bs-border-radius-sm);
border-end-start-radius: var(--bs-border-radius-sm);
}
.rounded-bottom-2 {
border-end-end-radius: var(--bs-border-radius);
border-end-start-radius: var(--bs-border-radius);
}
.rounded-bottom-3 {
border-end-end-radius: var(--bs-border-radius-lg);
border-end-start-radius: var(--bs-border-radius-lg);
}
.rounded-bottom-4 {
border-end-end-radius: var(--bs-border-radius-xl);
border-end-start-radius: var(--bs-border-radius-xl);
}
.rounded-bottom-5 {
border-end-end-radius: var(--bs-border-radius-2xl);
border-end-start-radius: var(--bs-border-radius-2xl);
}
.rounded-bottom-circle {
border-end-end-radius: 50%;
border-end-start-radius: 50%;
}
.rounded-bottom-pill {
border-end-end-radius: var(--bs-border-radius-pill);
border-end-start-radius: var(--bs-border-radius-pill);
}
.rounded-start {
border-start-start-radius: var(--bs-border-radius);
border-start-end-radius: var(--bs-border-radius);
}
.rounded-start-0 {
border-start-start-radius: 0;
border-start-end-radius: 0;
}
.rounded-start-1 {
border-start-start-radius: var(--bs-border-radius-sm);
border-start-end-radius: var(--bs-border-radius-sm);
}
.rounded-start-2 {
border-start-start-radius: var(--bs-border-radius);
border-start-end-radius: var(--bs-border-radius);
}
.rounded-start-3 {
border-start-start-radius: var(--bs-border-radius-lg);
border-start-end-radius: var(--bs-border-radius-lg);
}
.rounded-start-4 {
border-start-start-radius: var(--bs-border-radius-xl);
border-start-end-radius: var(--bs-border-radius-xl);
}
.rounded-start-5 {
border-start-start-radius: var(--bs-border-radius-2xl);
border-start-end-radius: var(--bs-border-radius-2xl);
}
.rounded-start-circle {
border-start-start-radius: 50%;
border-start-end-radius: 50%;
}
.rounded-start-pill {
border-start-start-radius: var(--bs-border-radius-pill);
border-start-end-radius: var(--bs-border-radius-pill);
}
.visible {
visibility: visible;
}
.invisible {
visibility: hidden;
}
.z-n1 {
z-index: -1;
}
.z-0 {
z-index: 0;
}
.z-1 {
z-index: 1;
}
.z-2 {
z-index: 2;
}
.z-3 {
z-index: 3;
}
@media (width >= 576px) {
.sm\:float-start {
float: inline-start;
}
.sm\:float-end {
float: inline-end;
}
.sm\:float-none {
float: none;
}
.sm\:object-fit-contain {
-o-object-fit: contain;
object-fit: contain;
}
.sm\:object-fit-cover {
-o-object-fit: cover;
object-fit: cover;
}
.sm\:object-fit-fill {
-o-object-fit: fill;
object-fit: fill;
}
.sm\:object-fit-scale {
-o-object-fit: scale-down;
object-fit: scale-down;
}
.sm\:object-fit-none {
-o-object-fit: none;
object-fit: none;
}
.sm\:d-inline {
display: inline;
}
.sm\:d-inline-block {
display: inline-block;
}
.sm\:d-block {
display: block;
}
.sm\:d-grid {
display: grid;
}
.sm\:d-inline-grid {
display: inline-grid;
}
.sm\:d-table {
display: table;
}
.sm\:d-table-row {
display: table-row;
}
.sm\:d-table-cell {
display: table-cell;
}
.sm\:d-flex {
display: flex;
}
.sm\:d-inline-flex {
display: inline-flex;
}
.sm\:d-contents {
display: contents;
}
.sm\:d-flow-root {
display: flow-root;
}
.sm\:d-none {
display: none;
}
.sm\:flex-fill {
flex: 1 1 auto;
}
.sm\:flex-row {
flex-direction: row;
}
.sm\:flex-column {
flex-direction: column;
}
.sm\:flex-row-reverse {
flex-direction: row-reverse;
}
.sm\:flex-column-reverse {
flex-direction: column-reverse;
}
.sm\:flex-grow-0 {
flex-grow: 0;
}
.sm\:flex-grow-1 {
flex-grow: 1;
}
.sm\:flex-shrink-0 {
flex-shrink: 0;
}
.sm\:flex-shrink-1 {
flex-shrink: 1;
}
.sm\:flex-wrap {
flex-wrap: wrap;
}
.sm\:flex-nowrap {
flex-wrap: nowrap;
}
.sm\:flex-wrap-reverse {
flex-wrap: wrap-reverse;
}
.sm\:justify-content-start {
justify-content: flex-start;
}
.sm\:justify-content-end {
justify-content: flex-end;
}
.sm\:justify-content-center {
justify-content: center;
}
.sm\:justify-content-between {
justify-content: space-between;
}
.sm\:justify-content-around {
justify-content: space-around;
}
.sm\:justify-content-evenly {
justify-content: space-evenly;
}
.sm\:justify-items-start {
justify-items: start;
}
.sm\:justify-items-end {
justify-items: end;
}
.sm\:justify-items-center {
justify-items: center;
}
.sm\:justify-items-stretch {
justify-items: stretch;
}
.sm\:justify-self-start {
justify-self: flex-start;
}
.sm\:justify-self-end {
justify-self: flex-end;
}
.sm\:justify-self-center {
justify-self: center;
}
.sm\:align-items-start {
align-items: flex-start;
}
.sm\:align-items-end {
align-items: flex-end;
}
.sm\:align-items-center {
align-items: center;
}
.sm\:align-items-baseline {
align-items: baseline;
}
.sm\:align-items-stretch {
align-items: stretch;
}
.sm\:align-content-start {
align-content: flex-start;
}
.sm\:align-content-end {
align-content: flex-end;
}
.sm\:align-content-center {
align-content: center;
}
.sm\:align-content-between {
align-content: space-between;
}
.sm\:align-content-around {
align-content: space-around;
}
.sm\:align-content-stretch {
align-content: stretch;
}
.sm\:align-self-auto {
align-self: auto;
}
.sm\:align-self-start {
align-self: flex-start;
}
.sm\:align-self-end {
align-self: flex-end;
}
.sm\:align-self-center {
align-self: center;
}
.sm\:align-self-baseline {
align-self: baseline;
}
.sm\:align-self-stretch {
align-self: stretch;
}
.sm\:place-items-start {
place-items: start;
}
.sm\:place-items-end {
place-items: end;
}
.sm\:place-items-center {
place-items: center;
}
.sm\:place-items-stretch {
place-items: stretch;
}
.sm\:grid-cols-2 {
grid-template-columns: repeat(2, 1fr);
}
.sm\:grid-cols-3 {
grid-template-columns: repeat(3, 1fr);
}
.sm\:grid-cols-4 {
grid-template-columns: repeat(4, 1fr);
}
.sm\:grid-cols-6 {
grid-template-columns: repeat(6, 1fr);
}
.sm\:grid-cols-fill {
grid-column: 1 / -1;
}
.sm\:grid-auto-flow-row {
grid-auto-flow: row;
}
.sm\:grid-auto-flow-column {
grid-auto-flow: column;
}
.sm\:grid-auto-flow-dense {
grid-auto-flow: dense;
}
.sm\:order-first {
order: -1;
}
.sm\:order-0 {
order: 0;
}
.sm\:order-1 {
order: 1;
}
.sm\:order-2 {
order: 2;
}
.sm\:order-3 {
order: 3;
}
.sm\:order-4 {
order: 4;
}
.sm\:order-5 {
order: 5;
}
.sm\:order-last {
order: 6;
}
.sm\:m-0 {
margin: 0;
}
.sm\:m-1 {
margin: 0.25rem;
}
.sm\:m-2 {
margin: 0.5rem;
}
.sm\:m-3 {
margin: 1rem;
}
.sm\:m-4 {
margin: 1.5rem;
}
.sm\:m-5 {
margin: 3rem;
}
.sm\:m-auto {
margin: auto;
}
.sm\:mx-0 {
margin-inline: 0;
}
.sm\:mx-1 {
margin-inline: 0.25rem;
}
.sm\:mx-2 {
margin-inline: 0.5rem;
}
.sm\:mx-3 {
margin-inline: 1rem;
}
.sm\:mx-4 {
margin-inline: 1.5rem;
}
.sm\:mx-5 {
margin-inline: 3rem;
}
.sm\:mx-auto {
margin-inline: auto;
}
.sm\:my-0 {
margin-block: 0;
}
.sm\:my-1 {
margin-block: 0.25rem;
}
.sm\:my-2 {
margin-block: 0.5rem;
}
.sm\:my-3 {
margin-block: 1rem;
}
.sm\:my-4 {
margin-block: 1.5rem;
}
.sm\:my-5 {
margin-block: 3rem;
}
.sm\:my-auto {
margin-block: auto;
}
.sm\:mt-0 {
margin-block-start: 0;
}
.sm\:mt-1 {
margin-block-start: 0.25rem;
}
.sm\:mt-2 {
margin-block-start: 0.5rem;
}
.sm\:mt-3 {
margin-block-start: 1rem;
}
.sm\:mt-4 {
margin-block-start: 1.5rem;
}
.sm\:mt-5 {
margin-block-start: 3rem;
}
.sm\:mt-auto {
margin-block-start: auto;
}
.sm\:me-0 {
margin-inline-end: 0;
}
.sm\:me-1 {
margin-inline-end: 0.25rem;
}
.sm\:me-2 {
margin-inline-end: 0.5rem;
}
.sm\:me-3 {
margin-inline-end: 1rem;
}
.sm\:me-4 {
margin-inline-end: 1.5rem;
}
.sm\:me-5 {
margin-inline-end: 3rem;
}
.sm\:me-auto {
margin-inline-end: auto;
}
.sm\:mb-0 {
margin-block-end: 0;
}
.sm\:mb-1 {
margin-block-end: 0.25rem;
}
.sm\:mb-2 {
margin-block-end: 0.5rem;
}
.sm\:mb-3 {
margin-block-end: 1rem;
}
.sm\:mb-4 {
margin-block-end: 1.5rem;
}
.sm\:mb-5 {
margin-block-end: 3rem;
}
.sm\:mb-auto {
margin-block-end: auto;
}
.sm\:ms-0 {
margin-inline-start: 0;
}
.sm\:ms-1 {
margin-inline-start: 0.25rem;
}
.sm\:ms-2 {
margin-inline-start: 0.5rem;
}
.sm\:ms-3 {
margin-inline-start: 1rem;
}
.sm\:ms-4 {
margin-inline-start: 1.5rem;
}
.sm\:ms-5 {
margin-inline-start: 3rem;
}
.sm\:ms--1 {
margin-inline-start: -0.25rem;
}
.sm\:ms--2 {
margin-inline-start: -0.5rem;
}
.sm\:ms-auto {
margin-inline-start: auto;
}
.sm\:p-0 {
padding: 0;
}
.sm\:p-1 {
padding: 0.25rem;
}
.sm\:p-2 {
padding: 0.5rem;
}
.sm\:p-3 {
padding: 1rem;
}
.sm\:p-4 {
padding: 1.5rem;
}
.sm\:p-5 {
padding: 3rem;
}
.sm\:px-0 {
padding-inline: 0;
}
.sm\:px-1 {
padding-inline: 0.25rem;
}
.sm\:px-2 {
padding-inline: 0.5rem;
}
.sm\:px-3 {
padding-inline: 1rem;
}
.sm\:px-4 {
padding-inline: 1.5rem;
}
.sm\:px-5 {
padding-inline: 3rem;
}
.sm\:py-0 {
padding-block: 0;
}
.sm\:py-1 {
padding-block: 0.25rem;
}
.sm\:py-2 {
padding-block: 0.5rem;
}
.sm\:py-3 {
padding-block: 1rem;
}
.sm\:py-4 {
padding-block: 1.5rem;
}
.sm\:py-5 {
padding-block: 3rem;
}
.sm\:pt-0 {
padding-block-start: 0;
}
.sm\:pt-1 {
padding-block-start: 0.25rem;
}
.sm\:pt-2 {
padding-block-start: 0.5rem;
}
.sm\:pt-3 {
padding-block-start: 1rem;
}
.sm\:pt-4 {
padding-block-start: 1.5rem;
}
.sm\:pt-5 {
padding-block-start: 3rem;
}
.sm\:pe-0 {
padding-inline-end: 0;
}
.sm\:pe-1 {
padding-inline-end: 0.25rem;
}
.sm\:pe-2 {
padding-inline-end: 0.5rem;
}
.sm\:pe-3 {
padding-inline-end: 1rem;
}
.sm\:pe-4 {
padding-inline-end: 1.5rem;
}
.sm\:pe-5 {
padding-inline-end: 3rem;
}
.sm\:pb-0 {
padding-block-end: 0;
}
.sm\:pb-1 {
padding-block-end: 0.25rem;
}
.sm\:pb-2 {
padding-block-end: 0.5rem;
}
.sm\:pb-3 {
padding-block-end: 1rem;
}
.sm\:pb-4 {
padding-block-end: 1.5rem;
}
.sm\:pb-5 {
padding-block-end: 3rem;
}
.sm\:ps-0 {
padding-inline-start: 0;
}
.sm\:ps-1 {
padding-inline-start: 0.25rem;
}
.sm\:ps-2 {
padding-inline-start: 0.5rem;
}
.sm\:ps-3 {
padding-inline-start: 1rem;
}
.sm\:ps-4 {
padding-inline-start: 1.5rem;
}
.sm\:ps-5 {
padding-inline-start: 3rem;
}
.sm\:gap-0 {
gap: 0;
}
.sm\:gap-1 {
gap: 0.25rem;
}
.sm\:gap-2 {
gap: 0.5rem;
}
.sm\:gap-3 {
gap: 1rem;
}
.sm\:gap-4 {
gap: 1.5rem;
}
.sm\:gap-5 {
gap: 3rem;
}
.sm\:row-gap-0 {
row-gap: 0;
}
.sm\:row-gap-1 {
row-gap: 0.25rem;
}
.sm\:row-gap-2 {
row-gap: 0.5rem;
}
.sm\:row-gap-3 {
row-gap: 1rem;
}
.sm\:row-gap-4 {
row-gap: 1.5rem;
}
.sm\:row-gap-5 {
row-gap: 3rem;
}
.sm\:column-gap-0 {
-moz-column-gap: 0;
column-gap: 0;
}
.sm\:column-gap-1 {
-moz-column-gap: 0.25rem;
column-gap: 0.25rem;
}
.sm\:column-gap-2 {
-moz-column-gap: 0.5rem;
column-gap: 0.5rem;
}
.sm\:column-gap-3 {
-moz-column-gap: 1rem;
column-gap: 1rem;
}
.sm\:column-gap-4 {
-moz-column-gap: 1.5rem;
column-gap: 1.5rem;
}
.sm\:column-gap-5 {
-moz-column-gap: 3rem;
column-gap: 3rem;
}
.sm\:text-start {
text-align: start;
}
.sm\:text-end {
text-align: end;
}
.sm\:text-center {
text-align: center;
}
}
@media (width >= 768px) {
.md\:float-start {
float: inline-start;
}
.md\:float-end {
float: inline-end;
}
.md\:float-none {
float: none;
}
.md\:object-fit-contain {
-o-object-fit: contain;
object-fit: contain;
}
.md\:object-fit-cover {
-o-object-fit: cover;
object-fit: cover;
}
.md\:object-fit-fill {
-o-object-fit: fill;
object-fit: fill;
}
.md\:object-fit-scale {
-o-object-fit: scale-down;
object-fit: scale-down;
}
.md\:object-fit-none {
-o-object-fit: none;
object-fit: none;
}
.md\:d-inline {
display: inline;
}
.md\:d-inline-block {
display: inline-block;
}
.md\:d-block {
display: block;
}
.md\:d-grid {
display: grid;
}
.md\:d-inline-grid {
display: inline-grid;
}
.md\:d-table {
display: table;
}
.md\:d-table-row {
display: table-row;
}
.md\:d-table-cell {
display: table-cell;
}
.md\:d-flex {
display: flex;
}
.md\:d-inline-flex {
display: inline-flex;
}
.md\:d-contents {
display: contents;
}
.md\:d-flow-root {
display: flow-root;
}
.md\:d-none {
display: none;
}
.md\:flex-fill {
flex: 1 1 auto;
}
.md\:flex-row {
flex-direction: row;
}
.md\:flex-column {
flex-direction: column;
}
.md\:flex-row-reverse {
flex-direction: row-reverse;
}
.md\:flex-column-reverse {
flex-direction: column-reverse;
}
.md\:flex-grow-0 {
flex-grow: 0;
}
.md\:flex-grow-1 {
flex-grow: 1;
}
.md\:flex-shrink-0 {
flex-shrink: 0;
}
.md\:flex-shrink-1 {
flex-shrink: 1;
}
.md\:flex-wrap {
flex-wrap: wrap;
}
.md\:flex-nowrap {
flex-wrap: nowrap;
}
.md\:flex-wrap-reverse {
flex-wrap: wrap-reverse;
}
.md\:justify-content-start {
justify-content: flex-start;
}
.md\:justify-content-end {
justify-content: flex-end;
}
.md\:justify-content-center {
justify-content: center;
}
.md\:justify-content-between {
justify-content: space-between;
}
.md\:justify-content-around {
justify-content: space-around;
}
.md\:justify-content-evenly {
justify-content: space-evenly;
}
.md\:justify-items-start {
justify-items: start;
}
.md\:justify-items-end {
justify-items: end;
}
.md\:justify-items-center {
justify-items: center;
}
.md\:justify-items-stretch {
justify-items: stretch;
}
.md\:justify-self-start {
justify-self: flex-start;
}
.md\:justify-self-end {
justify-self: flex-end;
}
.md\:justify-self-center {
justify-self: center;
}
.md\:align-items-start {
align-items: flex-start;
}
.md\:align-items-end {
align-items: flex-end;
}
.md\:align-items-center {
align-items: center;
}
.md\:align-items-baseline {
align-items: baseline;
}
.md\:align-items-stretch {
align-items: stretch;
}
.md\:align-content-start {
align-content: flex-start;
}
.md\:align-content-end {
align-content: flex-end;
}
.md\:align-content-center {
align-content: center;
}
.md\:align-content-between {
align-content: space-between;
}
.md\:align-content-around {
align-content: space-around;
}
.md\:align-content-stretch {
align-content: stretch;
}
.md\:align-self-auto {
align-self: auto;
}
.md\:align-self-start {
align-self: flex-start;
}
.md\:align-self-end {
align-self: flex-end;
}
.md\:align-self-center {
align-self: center;
}
.md\:align-self-baseline {
align-self: baseline;
}
.md\:align-self-stretch {
align-self: stretch;
}
.md\:place-items-start {
place-items: start;
}
.md\:place-items-end {
place-items: end;
}
.md\:place-items-center {
place-items: center;
}
.md\:place-items-stretch {
place-items: stretch;
}
.md\:grid-cols-2 {
grid-template-columns: repeat(2, 1fr);
}
.md\:grid-cols-3 {
grid-template-columns: repeat(3, 1fr);
}
.md\:grid-cols-4 {
grid-template-columns: repeat(4, 1fr);
}
.md\:grid-cols-6 {
grid-template-columns: repeat(6, 1fr);
}
.md\:grid-cols-fill {
grid-column: 1 / -1;
}
.md\:grid-auto-flow-row {
grid-auto-flow: row;
}
.md\:grid-auto-flow-column {
grid-auto-flow: column;
}
.md\:grid-auto-flow-dense {
grid-auto-flow: dense;
}
.md\:order-first {
order: -1;
}
.md\:order-0 {
order: 0;
}
.md\:order-1 {
order: 1;
}
.md\:order-2 {
order: 2;
}
.md\:order-3 {
order: 3;
}
.md\:order-4 {
order: 4;
}
.md\:order-5 {
order: 5;
}
.md\:order-last {
order: 6;
}
.md\:m-0 {
margin: 0;
}
.md\:m-1 {
margin: 0.25rem;
}
.md\:m-2 {
margin: 0.5rem;
}
.md\:m-3 {
margin: 1rem;
}
.md\:m-4 {
margin: 1.5rem;
}
.md\:m-5 {
margin: 3rem;
}
.md\:m-auto {
margin: auto;
}
.md\:mx-0 {
margin-inline: 0;
}
.md\:mx-1 {
margin-inline: 0.25rem;
}
.md\:mx-2 {
margin-inline: 0.5rem;
}
.md\:mx-3 {
margin-inline: 1rem;
}
.md\:mx-4 {
margin-inline: 1.5rem;
}
.md\:mx-5 {
margin-inline: 3rem;
}
.md\:mx-auto {
margin-inline: auto;
}
.md\:my-0 {
margin-block: 0;
}
.md\:my-1 {
margin-block: 0.25rem;
}
.md\:my-2 {
margin-block: 0.5rem;
}
.md\:my-3 {
margin-block: 1rem;
}
.md\:my-4 {
margin-block: 1.5rem;
}
.md\:my-5 {
margin-block: 3rem;
}
.md\:my-auto {
margin-block: auto;
}
.md\:mt-0 {
margin-block-start: 0;
}
.md\:mt-1 {
margin-block-start: 0.25rem;
}
.md\:mt-2 {
margin-block-start: 0.5rem;
}
.md\:mt-3 {
margin-block-start: 1rem;
}
.md\:mt-4 {
margin-block-start: 1.5rem;
}
.md\:mt-5 {
margin-block-start: 3rem;
}
.md\:mt-auto {
margin-block-start: auto;
}
.md\:me-0 {
margin-inline-end: 0;
}
.md\:me-1 {
margin-inline-end: 0.25rem;
}
.md\:me-2 {
margin-inline-end: 0.5rem;
}
.md\:me-3 {
margin-inline-end: 1rem;
}
.md\:me-4 {
margin-inline-end: 1.5rem;
}
.md\:me-5 {
margin-inline-end: 3rem;
}
.md\:me-auto {
margin-inline-end: auto;
}
.md\:mb-0 {
margin-block-end: 0;
}
.md\:mb-1 {
margin-block-end: 0.25rem;
}
.md\:mb-2 {
margin-block-end: 0.5rem;
}
.md\:mb-3 {
margin-block-end: 1rem;
}
.md\:mb-4 {
margin-block-end: 1.5rem;
}
.md\:mb-5 {
margin-block-end: 3rem;
}
.md\:mb-auto {
margin-block-end: auto;
}
.md\:ms-0 {
margin-inline-start: 0;
}
.md\:ms-1 {
margin-inline-start: 0.25rem;
}
.md\:ms-2 {
margin-inline-start: 0.5rem;
}
.md\:ms-3 {
margin-inline-start: 1rem;
}
.md\:ms-4 {
margin-inline-start: 1.5rem;
}
.md\:ms-5 {
margin-inline-start: 3rem;
}
.md\:ms--1 {
margin-inline-start: -0.25rem;
}
.md\:ms--2 {
margin-inline-start: -0.5rem;
}
.md\:ms-auto {
margin-inline-start: auto;
}
.md\:p-0 {
padding: 0;
}
.md\:p-1 {
padding: 0.25rem;
}
.md\:p-2 {
padding: 0.5rem;
}
.md\:p-3 {
padding: 1rem;
}
.md\:p-4 {
padding: 1.5rem;
}
.md\:p-5 {
padding: 3rem;
}
.md\:px-0 {
padding-inline: 0;
}
.md\:px-1 {
padding-inline: 0.25rem;
}
.md\:px-2 {
padding-inline: 0.5rem;
}
.md\:px-3 {
padding-inline: 1rem;
}
.md\:px-4 {
padding-inline: 1.5rem;
}
.md\:px-5 {
padding-inline: 3rem;
}
.md\:py-0 {
padding-block: 0;
}
.md\:py-1 {
padding-block: 0.25rem;
}
.md\:py-2 {
padding-block: 0.5rem;
}
.md\:py-3 {
padding-block: 1rem;
}
.md\:py-4 {
padding-block: 1.5rem;
}
.md\:py-5 {
padding-block: 3rem;
}
.md\:pt-0 {
padding-block-start: 0;
}
.md\:pt-1 {
padding-block-start: 0.25rem;
}
.md\:pt-2 {
padding-block-start: 0.5rem;
}
.md\:pt-3 {
padding-block-start: 1rem;
}
.md\:pt-4 {
padding-block-start: 1.5rem;
}
.md\:pt-5 {
padding-block-start: 3rem;
}
.md\:pe-0 {
padding-inline-end: 0;
}
.md\:pe-1 {
padding-inline-end: 0.25rem;
}
.md\:pe-2 {
padding-inline-end: 0.5rem;
}
.md\:pe-3 {
padding-inline-end: 1rem;
}
.md\:pe-4 {
padding-inline-end: 1.5rem;
}
.md\:pe-5 {
padding-inline-end: 3rem;
}
.md\:pb-0 {
padding-block-end: 0;
}
.md\:pb-1 {
padding-block-end: 0.25rem;
}
.md\:pb-2 {
padding-block-end: 0.5rem;
}
.md\:pb-3 {
padding-block-end: 1rem;
}
.md\:pb-4 {
padding-block-end: 1.5rem;
}
.md\:pb-5 {
padding-block-end: 3rem;
}
.md\:ps-0 {
padding-inline-start: 0;
}
.md\:ps-1 {
padding-inline-start: 0.25rem;
}
.md\:ps-2 {
padding-inline-start: 0.5rem;
}
.md\:ps-3 {
padding-inline-start: 1rem;
}
.md\:ps-4 {
padding-inline-start: 1.5rem;
}
.md\:ps-5 {
padding-inline-start: 3rem;
}
.md\:gap-0 {
gap: 0;
}
.md\:gap-1 {
gap: 0.25rem;
}
.md\:gap-2 {
gap: 0.5rem;
}
.md\:gap-3 {
gap: 1rem;
}
.md\:gap-4 {
gap: 1.5rem;
}
.md\:gap-5 {
gap: 3rem;
}
.md\:row-gap-0 {
row-gap: 0;
}
.md\:row-gap-1 {
row-gap: 0.25rem;
}
.md\:row-gap-2 {
row-gap: 0.5rem;
}
.md\:row-gap-3 {
row-gap: 1rem;
}
.md\:row-gap-4 {
row-gap: 1.5rem;
}
.md\:row-gap-5 {
row-gap: 3rem;
}
.md\:column-gap-0 {
-moz-column-gap: 0;
column-gap: 0;
}
.md\:column-gap-1 {
-moz-column-gap: 0.25rem;
column-gap: 0.25rem;
}
.md\:column-gap-2 {
-moz-column-gap: 0.5rem;
column-gap: 0.5rem;
}
.md\:column-gap-3 {
-moz-column-gap: 1rem;
column-gap: 1rem;
}
.md\:column-gap-4 {
-moz-column-gap: 1.5rem;
column-gap: 1.5rem;
}
.md\:column-gap-5 {
-moz-column-gap: 3rem;
column-gap: 3rem;
}
.md\:text-start {
text-align: start;
}
.md\:text-end {
text-align: end;
}
.md\:text-center {
text-align: center;
}
}
@media (width >= 1024px) {
.lg\:float-start {
float: inline-start;
}
.lg\:float-end {
float: inline-end;
}
.lg\:float-none {
float: none;
}
.lg\:object-fit-contain {
-o-object-fit: contain;
object-fit: contain;
}
.lg\:object-fit-cover {
-o-object-fit: cover;
object-fit: cover;
}
.lg\:object-fit-fill {
-o-object-fit: fill;
object-fit: fill;
}
.lg\:object-fit-scale {
-o-object-fit: scale-down;
object-fit: scale-down;
}
.lg\:object-fit-none {
-o-object-fit: none;
object-fit: none;
}
.lg\:d-inline {
display: inline;
}
.lg\:d-inline-block {
display: inline-block;
}
.lg\:d-block {
display: block;
}
.lg\:d-grid {
display: grid;
}
.lg\:d-inline-grid {
display: inline-grid;
}
.lg\:d-table {
display: table;
}
.lg\:d-table-row {
display: table-row;
}
.lg\:d-table-cell {
display: table-cell;
}
.lg\:d-flex {
display: flex;
}
.lg\:d-inline-flex {
display: inline-flex;
}
.lg\:d-contents {
display: contents;
}
.lg\:d-flow-root {
display: flow-root;
}
.lg\:d-none {
display: none;
}
.lg\:flex-fill {
flex: 1 1 auto;
}
.lg\:flex-row {
flex-direction: row;
}
.lg\:flex-column {
flex-direction: column;
}
.lg\:flex-row-reverse {
flex-direction: row-reverse;
}
.lg\:flex-column-reverse {
flex-direction: column-reverse;
}
.lg\:flex-grow-0 {
flex-grow: 0;
}
.lg\:flex-grow-1 {
flex-grow: 1;
}
.lg\:flex-shrink-0 {
flex-shrink: 0;
}
.lg\:flex-shrink-1 {
flex-shrink: 1;
}
.lg\:flex-wrap {
flex-wrap: wrap;
}
.lg\:flex-nowrap {
flex-wrap: nowrap;
}
.lg\:flex-wrap-reverse {
flex-wrap: wrap-reverse;
}
.lg\:justify-content-start {
justify-content: flex-start;
}
.lg\:justify-content-end {
justify-content: flex-end;
}
.lg\:justify-content-center {
justify-content: center;
}
.lg\:justify-content-between {
justify-content: space-between;
}
.lg\:justify-content-around {
justify-content: space-around;
}
.lg\:justify-content-evenly {
justify-content: space-evenly;
}
.lg\:justify-items-start {
justify-items: start;
}
.lg\:justify-items-end {
justify-items: end;
}
.lg\:justify-items-center {
justify-items: center;
}
.lg\:justify-items-stretch {
justify-items: stretch;
}
.lg\:justify-self-start {
justify-self: flex-start;
}
.lg\:justify-self-end {
justify-self: flex-end;
}
.lg\:justify-self-center {
justify-self: center;
}
.lg\:align-items-start {
align-items: flex-start;
}
.lg\:align-items-end {
align-items: flex-end;
}
.lg\:align-items-center {
align-items: center;
}
.lg\:align-items-baseline {
align-items: baseline;
}
.lg\:align-items-stretch {
align-items: stretch;
}
.lg\:align-content-start {
align-content: flex-start;
}
.lg\:align-content-end {
align-content: flex-end;
}
.lg\:align-content-center {
align-content: center;
}
.lg\:align-content-between {
align-content: space-between;
}
.lg\:align-content-around {
align-content: space-around;
}
.lg\:align-content-stretch {
align-content: stretch;
}
.lg\:align-self-auto {
align-self: auto;
}
.lg\:align-self-start {
align-self: flex-start;
}
.lg\:align-self-end {
align-self: flex-end;
}
.lg\:align-self-center {
align-self: center;
}
.lg\:align-self-baseline {
align-self: baseline;
}
.lg\:align-self-stretch {
align-self: stretch;
}
.lg\:place-items-start {
place-items: start;
}
.lg\:place-items-end {
place-items: end;
}
.lg\:place-items-center {
place-items: center;
}
.lg\:place-items-stretch {
place-items: stretch;
}
.lg\:grid-cols-2 {
grid-template-columns: repeat(2, 1fr);
}
.lg\:grid-cols-3 {
grid-template-columns: repeat(3, 1fr);
}
.lg\:grid-cols-4 {
grid-template-columns: repeat(4, 1fr);
}
.lg\:grid-cols-6 {
grid-template-columns: repeat(6, 1fr);
}
.lg\:grid-cols-fill {
grid-column: 1 / -1;
}
.lg\:grid-auto-flow-row {
grid-auto-flow: row;
}
.lg\:grid-auto-flow-column {
grid-auto-flow: column;
}
.lg\:grid-auto-flow-dense {
grid-auto-flow: dense;
}
.lg\:order-first {
order: -1;
}
.lg\:order-0 {
order: 0;
}
.lg\:order-1 {
order: 1;
}
.lg\:order-2 {
order: 2;
}
.lg\:order-3 {
order: 3;
}
.lg\:order-4 {
order: 4;
}
.lg\:order-5 {
order: 5;
}
.lg\:order-last {
order: 6;
}
.lg\:m-0 {
margin: 0;
}
.lg\:m-1 {
margin: 0.25rem;
}
.lg\:m-2 {
margin: 0.5rem;
}
.lg\:m-3 {
margin: 1rem;
}
.lg\:m-4 {
margin: 1.5rem;
}
.lg\:m-5 {
margin: 3rem;
}
.lg\:m-auto {
margin: auto;
}
.lg\:mx-0 {
margin-inline: 0;
}
.lg\:mx-1 {
margin-inline: 0.25rem;
}
.lg\:mx-2 {
margin-inline: 0.5rem;
}
.lg\:mx-3 {
margin-inline: 1rem;
}
.lg\:mx-4 {
margin-inline: 1.5rem;
}
.lg\:mx-5 {
margin-inline: 3rem;
}
.lg\:mx-auto {
margin-inline: auto;
}
.lg\:my-0 {
margin-block: 0;
}
.lg\:my-1 {
margin-block: 0.25rem;
}
.lg\:my-2 {
margin-block: 0.5rem;
}
.lg\:my-3 {
margin-block: 1rem;
}
.lg\:my-4 {
margin-block: 1.5rem;
}
.lg\:my-5 {
margin-block: 3rem;
}
.lg\:my-auto {
margin-block: auto;
}
.lg\:mt-0 {
margin-block-start: 0;
}
.lg\:mt-1 {
margin-block-start: 0.25rem;
}
.lg\:mt-2 {
margin-block-start: 0.5rem;
}
.lg\:mt-3 {
margin-block-start: 1rem;
}
.lg\:mt-4 {
margin-block-start: 1.5rem;
}
.lg\:mt-5 {
margin-block-start: 3rem;
}
.lg\:mt-auto {
margin-block-start: auto;
}
.lg\:me-0 {
margin-inline-end: 0;
}
.lg\:me-1 {
margin-inline-end: 0.25rem;
}
.lg\:me-2 {
margin-inline-end: 0.5rem;
}
.lg\:me-3 {
margin-inline-end: 1rem;
}
.lg\:me-4 {
margin-inline-end: 1.5rem;
}
.lg\:me-5 {
margin-inline-end: 3rem;
}
.lg\:me-auto {
margin-inline-end: auto;
}
.lg\:mb-0 {
margin-block-end: 0;
}
.lg\:mb-1 {
margin-block-end: 0.25rem;
}
.lg\:mb-2 {
margin-block-end: 0.5rem;
}
.lg\:mb-3 {
margin-block-end: 1rem;
}
.lg\:mb-4 {
margin-block-end: 1.5rem;
}
.lg\:mb-5 {
margin-block-end: 3rem;
}
.lg\:mb-auto {
margin-block-end: auto;
}
.lg\:ms-0 {
margin-inline-start: 0;
}
.lg\:ms-1 {
margin-inline-start: 0.25rem;
}
.lg\:ms-2 {
margin-inline-start: 0.5rem;
}
.lg\:ms-3 {
margin-inline-start: 1rem;
}
.lg\:ms-4 {
margin-inline-start: 1.5rem;
}
.lg\:ms-5 {
margin-inline-start: 3rem;
}
.lg\:ms--1 {
margin-inline-start: -0.25rem;
}
.lg\:ms--2 {
margin-inline-start: -0.5rem;
}
.lg\:ms-auto {
margin-inline-start: auto;
}
.lg\:p-0 {
padding: 0;
}
.lg\:p-1 {
padding: 0.25rem;
}
.lg\:p-2 {
padding: 0.5rem;
}
.lg\:p-3 {
padding: 1rem;
}
.lg\:p-4 {
padding: 1.5rem;
}
.lg\:p-5 {
padding: 3rem;
}
.lg\:px-0 {
padding-inline: 0;
}
.lg\:px-1 {
padding-inline: 0.25rem;
}
.lg\:px-2 {
padding-inline: 0.5rem;
}
.lg\:px-3 {
padding-inline: 1rem;
}
.lg\:px-4 {
padding-inline: 1.5rem;
}
.lg\:px-5 {
padding-inline: 3rem;
}
.lg\:py-0 {
padding-block: 0;
}
.lg\:py-1 {
padding-block: 0.25rem;
}
.lg\:py-2 {
padding-block: 0.5rem;
}
.lg\:py-3 {
padding-block: 1rem;
}
.lg\:py-4 {
padding-block: 1.5rem;
}
.lg\:py-5 {
padding-block: 3rem;
}
.lg\:pt-0 {
padding-block-start: 0;
}
.lg\:pt-1 {
padding-block-start: 0.25rem;
}
.lg\:pt-2 {
padding-block-start: 0.5rem;
}
.lg\:pt-3 {
padding-block-start: 1rem;
}
.lg\:pt-4 {
padding-block-start: 1.5rem;
}
.lg\:pt-5 {
padding-block-start: 3rem;
}
.lg\:pe-0 {
padding-inline-end: 0;
}
.lg\:pe-1 {
padding-inline-end: 0.25rem;
}
.lg\:pe-2 {
padding-inline-end: 0.5rem;
}
.lg\:pe-3 {
padding-inline-end: 1rem;
}
.lg\:pe-4 {
padding-inline-end: 1.5rem;
}
.lg\:pe-5 {
padding-inline-end: 3rem;
}
.lg\:pb-0 {
padding-block-end: 0;
}
.lg\:pb-1 {
padding-block-end: 0.25rem;
}
.lg\:pb-2 {
padding-block-end: 0.5rem;
}
.lg\:pb-3 {
padding-block-end: 1rem;
}
.lg\:pb-4 {
padding-block-end: 1.5rem;
}
.lg\:pb-5 {
padding-block-end: 3rem;
}
.lg\:ps-0 {
padding-inline-start: 0;
}
.lg\:ps-1 {
padding-inline-start: 0.25rem;
}
.lg\:ps-2 {
padding-inline-start: 0.5rem;
}
.lg\:ps-3 {
padding-inline-start: 1rem;
}
.lg\:ps-4 {
padding-inline-start: 1.5rem;
}
.lg\:ps-5 {
padding-inline-start: 3rem;
}
.lg\:gap-0 {
gap: 0;
}
.lg\:gap-1 {
gap: 0.25rem;
}
.lg\:gap-2 {
gap: 0.5rem;
}
.lg\:gap-3 {
gap: 1rem;
}
.lg\:gap-4 {
gap: 1.5rem;
}
.lg\:gap-5 {
gap: 3rem;
}
.lg\:row-gap-0 {
row-gap: 0;
}
.lg\:row-gap-1 {
row-gap: 0.25rem;
}
.lg\:row-gap-2 {
row-gap: 0.5rem;
}
.lg\:row-gap-3 {
row-gap: 1rem;
}
.lg\:row-gap-4 {
row-gap: 1.5rem;
}
.lg\:row-gap-5 {
row-gap: 3rem;
}
.lg\:column-gap-0 {
-moz-column-gap: 0;
column-gap: 0;
}
.lg\:column-gap-1 {
-moz-column-gap: 0.25rem;
column-gap: 0.25rem;
}
.lg\:column-gap-2 {
-moz-column-gap: 0.5rem;
column-gap: 0.5rem;
}
.lg\:column-gap-3 {
-moz-column-gap: 1rem;
column-gap: 1rem;
}
.lg\:column-gap-4 {
-moz-column-gap: 1.5rem;
column-gap: 1.5rem;
}
.lg\:column-gap-5 {
-moz-column-gap: 3rem;
column-gap: 3rem;
}
.lg\:text-start {
text-align: start;
}
.lg\:text-end {
text-align: end;
}
.lg\:text-center {
text-align: center;
}
}
@media (width >= 1280px) {
.xl\:float-start {
float: inline-start;
}
.xl\:float-end {
float: inline-end;
}
.xl\:float-none {
float: none;
}
.xl\:object-fit-contain {
-o-object-fit: contain;
object-fit: contain;
}
.xl\:object-fit-cover {
-o-object-fit: cover;
object-fit: cover;
}
.xl\:object-fit-fill {
-o-object-fit: fill;
object-fit: fill;
}
.xl\:object-fit-scale {
-o-object-fit: scale-down;
object-fit: scale-down;
}
.xl\:object-fit-none {
-o-object-fit: none;
object-fit: none;
}
.xl\:d-inline {
display: inline;
}
.xl\:d-inline-block {
display: inline-block;
}
.xl\:d-block {
display: block;
}
.xl\:d-grid {
display: grid;
}
.xl\:d-inline-grid {
display: inline-grid;
}
.xl\:d-table {
display: table;
}
.xl\:d-table-row {
display: table-row;
}
.xl\:d-table-cell {
display: table-cell;
}
.xl\:d-flex {
display: flex;
}
.xl\:d-inline-flex {
display: inline-flex;
}
.xl\:d-contents {
display: contents;
}
.xl\:d-flow-root {
display: flow-root;
}
.xl\:d-none {
display: none;
}
.xl\:flex-fill {
flex: 1 1 auto;
}
.xl\:flex-row {
flex-direction: row;
}
.xl\:flex-column {
flex-direction: column;
}
.xl\:flex-row-reverse {
flex-direction: row-reverse;
}
.xl\:flex-column-reverse {
flex-direction: column-reverse;
}
.xl\:flex-grow-0 {
flex-grow: 0;
}
.xl\:flex-grow-1 {
flex-grow: 1;
}
.xl\:flex-shrink-0 {
flex-shrink: 0;
}
.xl\:flex-shrink-1 {
flex-shrink: 1;
}
.xl\:flex-wrap {
flex-wrap: wrap;
}
.xl\:flex-nowrap {
flex-wrap: nowrap;
}
.xl\:flex-wrap-reverse {
flex-wrap: wrap-reverse;
}
.xl\:justify-content-start {
justify-content: flex-start;
}
.xl\:justify-content-end {
justify-content: flex-end;
}
.xl\:justify-content-center {
justify-content: center;
}
.xl\:justify-content-between {
justify-content: space-between;
}
.xl\:justify-content-around {
justify-content: space-around;
}
.xl\:justify-content-evenly {
justify-content: space-evenly;
}
.xl\:justify-items-start {
justify-items: start;
}
.xl\:justify-items-end {
justify-items: end;
}
.xl\:justify-items-center {
justify-items: center;
}
.xl\:justify-items-stretch {
justify-items: stretch;
}
.xl\:justify-self-start {
justify-self: flex-start;
}
.xl\:justify-self-end {
justify-self: flex-end;
}
.xl\:justify-self-center {
justify-self: center;
}
.xl\:align-items-start {
align-items: flex-start;
}
.xl\:align-items-end {
align-items: flex-end;
}
.xl\:align-items-center {
align-items: center;
}
.xl\:align-items-baseline {
align-items: baseline;
}
.xl\:align-items-stretch {
align-items: stretch;
}
.xl\:align-content-start {
align-content: flex-start;
}
.xl\:align-content-end {
align-content: flex-end;
}
.xl\:align-content-center {
align-content: center;
}
.xl\:align-content-between {
align-content: space-between;
}
.xl\:align-content-around {
align-content: space-around;
}
.xl\:align-content-stretch {
align-content: stretch;
}
.xl\:align-self-auto {
align-self: auto;
}
.xl\:align-self-start {
align-self: flex-start;
}
.xl\:align-self-end {
align-self: flex-end;
}
.xl\:align-self-center {
align-self: center;
}
.xl\:align-self-baseline {
align-self: baseline;
}
.xl\:align-self-stretch {
align-self: stretch;
}
.xl\:place-items-start {
place-items: start;
}
.xl\:place-items-end {
place-items: end;
}
.xl\:place-items-center {
place-items: center;
}
.xl\:place-items-stretch {
place-items: stretch;
}
.xl\:grid-cols-2 {
grid-template-columns: repeat(2, 1fr);
}
.xl\:grid-cols-3 {
grid-template-columns: repeat(3, 1fr);
}
.xl\:grid-cols-4 {
grid-template-columns: repeat(4, 1fr);
}
.xl\:grid-cols-6 {
grid-template-columns: repeat(6, 1fr);
}
.xl\:grid-cols-fill {
grid-column: 1 / -1;
}
.xl\:grid-auto-flow-row {
grid-auto-flow: row;
}
.xl\:grid-auto-flow-column {
grid-auto-flow: column;
}
.xl\:grid-auto-flow-dense {
grid-auto-flow: dense;
}
.xl\:order-first {
order: -1;
}
.xl\:order-0 {
order: 0;
}
.xl\:order-1 {
order: 1;
}
.xl\:order-2 {
order: 2;
}
.xl\:order-3 {
order: 3;
}
.xl\:order-4 {
order: 4;
}
.xl\:order-5 {
order: 5;
}
.xl\:order-last {
order: 6;
}
.xl\:m-0 {
margin: 0;
}
.xl\:m-1 {
margin: 0.25rem;
}
.xl\:m-2 {
margin: 0.5rem;
}
.xl\:m-3 {
margin: 1rem;
}
.xl\:m-4 {
margin: 1.5rem;
}
.xl\:m-5 {
margin: 3rem;
}
.xl\:m-auto {
margin: auto;
}
.xl\:mx-0 {
margin-inline: 0;
}
.xl\:mx-1 {
margin-inline: 0.25rem;
}
.xl\:mx-2 {
margin-inline: 0.5rem;
}
.xl\:mx-3 {
margin-inline: 1rem;
}
.xl\:mx-4 {
margin-inline: 1.5rem;
}
.xl\:mx-5 {
margin-inline: 3rem;
}
.xl\:mx-auto {
margin-inline: auto;
}
.xl\:my-0 {
margin-block: 0;
}
.xl\:my-1 {
margin-block: 0.25rem;
}
.xl\:my-2 {
margin-block: 0.5rem;
}
.xl\:my-3 {
margin-block: 1rem;
}
.xl\:my-4 {
margin-block: 1.5rem;
}
.xl\:my-5 {
margin-block: 3rem;
}
.xl\:my-auto {
margin-block: auto;
}
.xl\:mt-0 {
margin-block-start: 0;
}
.xl\:mt-1 {
margin-block-start: 0.25rem;
}
.xl\:mt-2 {
margin-block-start: 0.5rem;
}
.xl\:mt-3 {
margin-block-start: 1rem;
}
.xl\:mt-4 {
margin-block-start: 1.5rem;
}
.xl\:mt-5 {
margin-block-start: 3rem;
}
.xl\:mt-auto {
margin-block-start: auto;
}
.xl\:me-0 {
margin-inline-end: 0;
}
.xl\:me-1 {
margin-inline-end: 0.25rem;
}
.xl\:me-2 {
margin-inline-end: 0.5rem;
}
.xl\:me-3 {
margin-inline-end: 1rem;
}
.xl\:me-4 {
margin-inline-end: 1.5rem;
}
.xl\:me-5 {
margin-inline-end: 3rem;
}
.xl\:me-auto {
margin-inline-end: auto;
}
.xl\:mb-0 {
margin-block-end: 0;
}
.xl\:mb-1 {
margin-block-end: 0.25rem;
}
.xl\:mb-2 {
margin-block-end: 0.5rem;
}
.xl\:mb-3 {
margin-block-end: 1rem;
}
.xl\:mb-4 {
margin-block-end: 1.5rem;
}
.xl\:mb-5 {
margin-block-end: 3rem;
}
.xl\:mb-auto {
margin-block-end: auto;
}
.xl\:ms-0 {
margin-inline-start: 0;
}
.xl\:ms-1 {
margin-inline-start: 0.25rem;
}
.xl\:ms-2 {
margin-inline-start: 0.5rem;
}
.xl\:ms-3 {
margin-inline-start: 1rem;
}
.xl\:ms-4 {
margin-inline-start: 1.5rem;
}
.xl\:ms-5 {
margin-inline-start: 3rem;
}
.xl\:ms--1 {
margin-inline-start: -0.25rem;
}
.xl\:ms--2 {
margin-inline-start: -0.5rem;
}
.xl\:ms-auto {
margin-inline-start: auto;
}
.xl\:p-0 {
padding: 0;
}
.xl\:p-1 {
padding: 0.25rem;
}
.xl\:p-2 {
padding: 0.5rem;
}
.xl\:p-3 {
padding: 1rem;
}
.xl\:p-4 {
padding: 1.5rem;
}
.xl\:p-5 {
padding: 3rem;
}
.xl\:px-0 {
padding-inline: 0;
}
.xl\:px-1 {
padding-inline: 0.25rem;
}
.xl\:px-2 {
padding-inline: 0.5rem;
}
.xl\:px-3 {
padding-inline: 1rem;
}
.xl\:px-4 {
padding-inline: 1.5rem;
}
.xl\:px-5 {
padding-inline: 3rem;
}
.xl\:py-0 {
padding-block: 0;
}
.xl\:py-1 {
padding-block: 0.25rem;
}
.xl\:py-2 {
padding-block: 0.5rem;
}
.xl\:py-3 {
padding-block: 1rem;
}
.xl\:py-4 {
padding-block: 1.5rem;
}
.xl\:py-5 {
padding-block: 3rem;
}
.xl\:pt-0 {
padding-block-start: 0;
}
.xl\:pt-1 {
padding-block-start: 0.25rem;
}
.xl\:pt-2 {
padding-block-start: 0.5rem;
}
.xl\:pt-3 {
padding-block-start: 1rem;
}
.xl\:pt-4 {
padding-block-start: 1.5rem;
}
.xl\:pt-5 {
padding-block-start: 3rem;
}
.xl\:pe-0 {
padding-inline-end: 0;
}
.xl\:pe-1 {
padding-inline-end: 0.25rem;
}
.xl\:pe-2 {
padding-inline-end: 0.5rem;
}
.xl\:pe-3 {
padding-inline-end: 1rem;
}
.xl\:pe-4 {
padding-inline-end: 1.5rem;
}
.xl\:pe-5 {
padding-inline-end: 3rem;
}
.xl\:pb-0 {
padding-block-end: 0;
}
.xl\:pb-1 {
padding-block-end: 0.25rem;
}
.xl\:pb-2 {
padding-block-end: 0.5rem;
}
.xl\:pb-3 {
padding-block-end: 1rem;
}
.xl\:pb-4 {
padding-block-end: 1.5rem;
}
.xl\:pb-5 {
padding-block-end: 3rem;
}
.xl\:ps-0 {
padding-inline-start: 0;
}
.xl\:ps-1 {
padding-inline-start: 0.25rem;
}
.xl\:ps-2 {
padding-inline-start: 0.5rem;
}
.xl\:ps-3 {
padding-inline-start: 1rem;
}
.xl\:ps-4 {
padding-inline-start: 1.5rem;
}
.xl\:ps-5 {
padding-inline-start: 3rem;
}
.xl\:gap-0 {
gap: 0;
}
.xl\:gap-1 {
gap: 0.25rem;
}
.xl\:gap-2 {
gap: 0.5rem;
}
.xl\:gap-3 {
gap: 1rem;
}
.xl\:gap-4 {
gap: 1.5rem;
}
.xl\:gap-5 {
gap: 3rem;
}
.xl\:row-gap-0 {
row-gap: 0;
}
.xl\:row-gap-1 {
row-gap: 0.25rem;
}
.xl\:row-gap-2 {
row-gap: 0.5rem;
}
.xl\:row-gap-3 {
row-gap: 1rem;
}
.xl\:row-gap-4 {
row-gap: 1.5rem;
}
.xl\:row-gap-5 {
row-gap: 3rem;
}
.xl\:column-gap-0 {
-moz-column-gap: 0;
column-gap: 0;
}
.xl\:column-gap-1 {
-moz-column-gap: 0.25rem;
column-gap: 0.25rem;
}
.xl\:column-gap-2 {
-moz-column-gap: 0.5rem;
column-gap: 0.5rem;
}
.xl\:column-gap-3 {
-moz-column-gap: 1rem;
column-gap: 1rem;
}
.xl\:column-gap-4 {
-moz-column-gap: 1.5rem;
column-gap: 1.5rem;
}
.xl\:column-gap-5 {
-moz-column-gap: 3rem;
column-gap: 3rem;
}
.xl\:text-start {
text-align: start;
}
.xl\:text-end {
text-align: end;
}
.xl\:text-center {
text-align: center;
}
}
@media (width >= 1536px) {
.\32 xl\:float-start {
float: inline-start;
}
.\32 xl\:float-end {
float: inline-end;
}
.\32 xl\:float-none {
float: none;
}
.\32 xl\:object-fit-contain {
-o-object-fit: contain;
object-fit: contain;
}
.\32 xl\:object-fit-cover {
-o-object-fit: cover;
object-fit: cover;
}
.\32 xl\:object-fit-fill {
-o-object-fit: fill;
object-fit: fill;
}
.\32 xl\:object-fit-scale {
-o-object-fit: scale-down;
object-fit: scale-down;
}
.\32 xl\:object-fit-none {
-o-object-fit: none;
object-fit: none;
}
.\32 xl\:d-inline {
display: inline;
}
.\32 xl\:d-inline-block {
display: inline-block;
}
.\32 xl\:d-block {
display: block;
}
.\32 xl\:d-grid {
display: grid;
}
.\32 xl\:d-inline-grid {
display: inline-grid;
}
.\32 xl\:d-table {
display: table;
}
.\32 xl\:d-table-row {
display: table-row;
}
.\32 xl\:d-table-cell {
display: table-cell;
}
.\32 xl\:d-flex {
display: flex;
}
.\32 xl\:d-inline-flex {
display: inline-flex;
}
.\32 xl\:d-contents {
display: contents;
}
.\32 xl\:d-flow-root {
display: flow-root;
}
.\32 xl\:d-none {
display: none;
}
.\32 xl\:flex-fill {
flex: 1 1 auto;
}
.\32 xl\:flex-row {
flex-direction: row;
}
.\32 xl\:flex-column {
flex-direction: column;
}
.\32 xl\:flex-row-reverse {
flex-direction: row-reverse;
}
.\32 xl\:flex-column-reverse {
flex-direction: column-reverse;
}
.\32 xl\:flex-grow-0 {
flex-grow: 0;
}
.\32 xl\:flex-grow-1 {
flex-grow: 1;
}
.\32 xl\:flex-shrink-0 {
flex-shrink: 0;
}
.\32 xl\:flex-shrink-1 {
flex-shrink: 1;
}
.\32 xl\:flex-wrap {
flex-wrap: wrap;
}
.\32 xl\:flex-nowrap {
flex-wrap: nowrap;
}
.\32 xl\:flex-wrap-reverse {
flex-wrap: wrap-reverse;
}
.\32 xl\:justify-content-start {
justify-content: flex-start;
}
.\32 xl\:justify-content-end {
justify-content: flex-end;
}
.\32 xl\:justify-content-center {
justify-content: center;
}
.\32 xl\:justify-content-between {
justify-content: space-between;
}
.\32 xl\:justify-content-around {
justify-content: space-around;
}
.\32 xl\:justify-content-evenly {
justify-content: space-evenly;
}
.\32 xl\:justify-items-start {
justify-items: start;
}
.\32 xl\:justify-items-end {
justify-items: end;
}
.\32 xl\:justify-items-center {
justify-items: center;
}
.\32 xl\:justify-items-stretch {
justify-items: stretch;
}
.\32 xl\:justify-self-start {
justify-self: flex-start;
}
.\32 xl\:justify-self-end {
justify-self: flex-end;
}
.\32 xl\:justify-self-center {
justify-self: center;
}
.\32 xl\:align-items-start {
align-items: flex-start;
}
.\32 xl\:align-items-end {
align-items: flex-end;
}
.\32 xl\:align-items-center {
align-items: center;
}
.\32 xl\:align-items-baseline {
align-items: baseline;
}
.\32 xl\:align-items-stretch {
align-items: stretch;
}
.\32 xl\:align-content-start {
align-content: flex-start;
}
.\32 xl\:align-content-end {
align-content: flex-end;
}
.\32 xl\:align-content-center {
align-content: center;
}
.\32 xl\:align-content-between {
align-content: space-between;
}
.\32 xl\:align-content-around {
align-content: space-around;
}
.\32 xl\:align-content-stretch {
align-content: stretch;
}
.\32 xl\:align-self-auto {
align-self: auto;
}
.\32 xl\:align-self-start {
align-self: flex-start;
}
.\32 xl\:align-self-end {
align-self: flex-end;
}
.\32 xl\:align-self-center {
align-self: center;
}
.\32 xl\:align-self-baseline {
align-self: baseline;
}
.\32 xl\:align-self-stretch {
align-self: stretch;
}
.\32 xl\:place-items-start {
place-items: start;
}
.\32 xl\:place-items-end {
place-items: end;
}
.\32 xl\:place-items-center {
place-items: center;
}
.\32 xl\:place-items-stretch {
place-items: stretch;
}
.\32 xl\:grid-cols-2 {
grid-template-columns: repeat(2, 1fr);
}
.\32 xl\:grid-cols-3 {
grid-template-columns: repeat(3, 1fr);
}
.\32 xl\:grid-cols-4 {
grid-template-columns: repeat(4, 1fr);
}
.\32 xl\:grid-cols-6 {
grid-template-columns: repeat(6, 1fr);
}
.\32 xl\:grid-cols-fill {
grid-column: 1 / -1;
}
.\32 xl\:grid-auto-flow-row {
grid-auto-flow: row;
}
.\32 xl\:grid-auto-flow-column {
grid-auto-flow: column;
}
.\32 xl\:grid-auto-flow-dense {
grid-auto-flow: dense;
}
.\32 xl\:order-first {
order: -1;
}
.\32 xl\:order-0 {
order: 0;
}
.\32 xl\:order-1 {
order: 1;
}
.\32 xl\:order-2 {
order: 2;
}
.\32 xl\:order-3 {
order: 3;
}
.\32 xl\:order-4 {
order: 4;
}
.\32 xl\:order-5 {
order: 5;
}
.\32 xl\:order-last {
order: 6;
}
.\32 xl\:m-0 {
margin: 0;
}
.\32 xl\:m-1 {
margin: 0.25rem;
}
.\32 xl\:m-2 {
margin: 0.5rem;
}
.\32 xl\:m-3 {
margin: 1rem;
}
.\32 xl\:m-4 {
margin: 1.5rem;
}
.\32 xl\:m-5 {
margin: 3rem;
}
.\32 xl\:m-auto {
margin: auto;
}
.\32 xl\:mx-0 {
margin-inline: 0;
}
.\32 xl\:mx-1 {
margin-inline: 0.25rem;
}
.\32 xl\:mx-2 {
margin-inline: 0.5rem;
}
.\32 xl\:mx-3 {
margin-inline: 1rem;
}
.\32 xl\:mx-4 {
margin-inline: 1.5rem;
}
.\32 xl\:mx-5 {
margin-inline: 3rem;
}
.\32 xl\:mx-auto {
margin-inline: auto;
}
.\32 xl\:my-0 {
margin-block: 0;
}
.\32 xl\:my-1 {
margin-block: 0.25rem;
}
.\32 xl\:my-2 {
margin-block: 0.5rem;
}
.\32 xl\:my-3 {
margin-block: 1rem;
}
.\32 xl\:my-4 {
margin-block: 1.5rem;
}
.\32 xl\:my-5 {
margin-block: 3rem;
}
.\32 xl\:my-auto {
margin-block: auto;
}
.\32 xl\:mt-0 {
margin-block-start: 0;
}
.\32 xl\:mt-1 {
margin-block-start: 0.25rem;
}
.\32 xl\:mt-2 {
margin-block-start: 0.5rem;
}
.\32 xl\:mt-3 {
margin-block-start: 1rem;
}
.\32 xl\:mt-4 {
margin-block-start: 1.5rem;
}
.\32 xl\:mt-5 {
margin-block-start: 3rem;
}
.\32 xl\:mt-auto {
margin-block-start: auto;
}
.\32 xl\:me-0 {
margin-inline-end: 0;
}
.\32 xl\:me-1 {
margin-inline-end: 0.25rem;
}
.\32 xl\:me-2 {
margin-inline-end: 0.5rem;
}
.\32 xl\:me-3 {
margin-inline-end: 1rem;
}
.\32 xl\:me-4 {
margin-inline-end: 1.5rem;
}
.\32 xl\:me-5 {
margin-inline-end: 3rem;
}
.\32 xl\:me-auto {
margin-inline-end: auto;
}
.\32 xl\:mb-0 {
margin-block-end: 0;
}
.\32 xl\:mb-1 {
margin-block-end: 0.25rem;
}
.\32 xl\:mb-2 {
margin-block-end: 0.5rem;
}
.\32 xl\:mb-3 {
margin-block-end: 1rem;
}
.\32 xl\:mb-4 {
margin-block-end: 1.5rem;
}
.\32 xl\:mb-5 {
margin-block-end: 3rem;
}
.\32 xl\:mb-auto {
margin-block-end: auto;
}
.\32 xl\:ms-0 {
margin-inline-start: 0;
}
.\32 xl\:ms-1 {
margin-inline-start: 0.25rem;
}
.\32 xl\:ms-2 {
margin-inline-start: 0.5rem;
}
.\32 xl\:ms-3 {
margin-inline-start: 1rem;
}
.\32 xl\:ms-4 {
margin-inline-start: 1.5rem;
}
.\32 xl\:ms-5 {
margin-inline-start: 3rem;
}
.\32 xl\:ms--1 {
margin-inline-start: -0.25rem;
}
.\32 xl\:ms--2 {
margin-inline-start: -0.5rem;
}
.\32 xl\:ms-auto {
margin-inline-start: auto;
}
.\32 xl\:p-0 {
padding: 0;
}
.\32 xl\:p-1 {
padding: 0.25rem;
}
.\32 xl\:p-2 {
padding: 0.5rem;
}
.\32 xl\:p-3 {
padding: 1rem;
}
.\32 xl\:p-4 {
padding: 1.5rem;
}
.\32 xl\:p-5 {
padding: 3rem;
}
.\32 xl\:px-0 {
padding-inline: 0;
}
.\32 xl\:px-1 {
padding-inline: 0.25rem;
}
.\32 xl\:px-2 {
padding-inline: 0.5rem;
}
.\32 xl\:px-3 {
padding-inline: 1rem;
}
.\32 xl\:px-4 {
padding-inline: 1.5rem;
}
.\32 xl\:px-5 {
padding-inline: 3rem;
}
.\32 xl\:py-0 {
padding-block: 0;
}
.\32 xl\:py-1 {
padding-block: 0.25rem;
}
.\32 xl\:py-2 {
padding-block: 0.5rem;
}
.\32 xl\:py-3 {
padding-block: 1rem;
}
.\32 xl\:py-4 {
padding-block: 1.5rem;
}
.\32 xl\:py-5 {
padding-block: 3rem;
}
.\32 xl\:pt-0 {
padding-block-start: 0;
}
.\32 xl\:pt-1 {
padding-block-start: 0.25rem;
}
.\32 xl\:pt-2 {
padding-block-start: 0.5rem;
}
.\32 xl\:pt-3 {
padding-block-start: 1rem;
}
.\32 xl\:pt-4 {
padding-block-start: 1.5rem;
}
.\32 xl\:pt-5 {
padding-block-start: 3rem;
}
.\32 xl\:pe-0 {
padding-inline-end: 0;
}
.\32 xl\:pe-1 {
padding-inline-end: 0.25rem;
}
.\32 xl\:pe-2 {
padding-inline-end: 0.5rem;
}
.\32 xl\:pe-3 {
padding-inline-end: 1rem;
}
.\32 xl\:pe-4 {
padding-inline-end: 1.5rem;
}
.\32 xl\:pe-5 {
padding-inline-end: 3rem;
}
.\32 xl\:pb-0 {
padding-block-end: 0;
}
.\32 xl\:pb-1 {
padding-block-end: 0.25rem;
}
.\32 xl\:pb-2 {
padding-block-end: 0.5rem;
}
.\32 xl\:pb-3 {
padding-block-end: 1rem;
}
.\32 xl\:pb-4 {
padding-block-end: 1.5rem;
}
.\32 xl\:pb-5 {
padding-block-end: 3rem;
}
.\32 xl\:ps-0 {
padding-inline-start: 0;
}
.\32 xl\:ps-1 {
padding-inline-start: 0.25rem;
}
.\32 xl\:ps-2 {
padding-inline-start: 0.5rem;
}
.\32 xl\:ps-3 {
padding-inline-start: 1rem;
}
.\32 xl\:ps-4 {
padding-inline-start: 1.5rem;
}
.\32 xl\:ps-5 {
padding-inline-start: 3rem;
}
.\32 xl\:gap-0 {
gap: 0;
}
.\32 xl\:gap-1 {
gap: 0.25rem;
}
.\32 xl\:gap-2 {
gap: 0.5rem;
}
.\32 xl\:gap-3 {
gap: 1rem;
}
.\32 xl\:gap-4 {
gap: 1.5rem;
}
.\32 xl\:gap-5 {
gap: 3rem;
}
.\32 xl\:row-gap-0 {
row-gap: 0;
}
.\32 xl\:row-gap-1 {
row-gap: 0.25rem;
}
.\32 xl\:row-gap-2 {
row-gap: 0.5rem;
}
.\32 xl\:row-gap-3 {
row-gap: 1rem;
}
.\32 xl\:row-gap-4 {
row-gap: 1.5rem;
}
.\32 xl\:row-gap-5 {
row-gap: 3rem;
}
.\32 xl\:column-gap-0 {
-moz-column-gap: 0;
column-gap: 0;
}
.\32 xl\:column-gap-1 {
-moz-column-gap: 0.25rem;
column-gap: 0.25rem;
}
.\32 xl\:column-gap-2 {
-moz-column-gap: 0.5rem;
column-gap: 0.5rem;
}
.\32 xl\:column-gap-3 {
-moz-column-gap: 1rem;
column-gap: 1rem;
}
.\32 xl\:column-gap-4 {
-moz-column-gap: 1.5rem;
column-gap: 1.5rem;
}
.\32 xl\:column-gap-5 {
-moz-column-gap: 3rem;
column-gap: 3rem;
}
.\32 xl\:text-start {
text-align: start;
}
.\32 xl\:text-end {
text-align: end;
}
.\32 xl\:text-center {
text-align: center;
}
}
}
/*# sourceMappingURL=bootstrap.css.map */