/* Layer order: Tailwind base/utilities first, then PrimeVue so component styles win */
@layer theme, base, components, library-utilities, utilities, primevue;
@import '@bcc-code/design-tokens/css';

@import 'tailwindcss';
@import '@bcc-code/design-tokens/tailwind';


/* === ./styles/theme.css === */
@theme {
	/* spacing variables */
	--spacing-inset-top: env(safe-area-inset-top, var(--safe-area-inset-top, 0px));
	--spacing-inset-top-1: max(0.25rem, env(safe-area-inset-top, var(--safe-area-inset-top, 0px)));
	--spacing-inset-top-2: max(0.5rem, env(safe-area-inset-top, var(--safe-area-inset-top, 0px)));
	--spacing-inset-top-4: max(1rem, env(safe-area-inset-top, var(--safe-area-inset-top, 0px)));
	--spacing-inset-bottom: env(safe-area-inset-bottom, var(--safe-area-inset-bottom, 0px));
	--spacing-inset-bottom-1: max(0.25rem, env(safe-area-inset-bottom, var(--safe-area-inset-bottom, 0px)));
	--spacing-inset-bottom-2: max(0.5rem, env(safe-area-inset-bottom, var(--safe-area-inset-bottom, 0px)));
	--spacing-inset-bottom-4: max(1rem, env(safe-area-inset-bottom, var(--safe-area-inset-bottom, 0px)));
	--spacing-inset-left: env(safe-area-inset-left, var(--safe-area-inset-left, 0px));
	--spacing-inset-right: env(safe-area-inset-right, var(--safe-area-inset-right, 0px));

	--spacing-18: 4.5rem;
}

/*
 * Force-emit ctx-* utilities that components construct dynamically (e.g.
 * `:class="\`ctx-${context}\`"` in BccBadge, BccStepIndicator, BccCapacityIndicator).
 * Tailwind cannot see those class names by scanning source, so without this list
 * they would never be emitted into the utilities layer.
 *
 * Source of truth: the @utility ctx-* definitions in ./contexts.css (auto-generated
 * by `pnpm run generate:context-css`). Keep this list in sync with that file.
 */
@source inline("ctx-default ctx-{blue,brown,gray,green,magenta,orange,purple,red,teal,yellow}-{bolder,subtle,subtler,subtlest} ctx-{danger,info,success,warning}-{bolder,subtlest} ctx-brand-{bold,bolder,boldest,default,subtle,subtler,subtlest} ctx-neutral-{bold,bolder,boldest,subtle,subtler,subtlest}");

/*
 * Aliases for semantic context names. Plain @apply wrappers are kept because
 * `.ctx-success` etc. are aliases (point at -subtlest variants), not standalone
 * @utility definitions. Wrapped in @layer utilities so they participate in the
 * cascade alongside other utilities.
 */
@layer utilities {
	.ctx-success {
		@apply ctx-success-subtlest;
	}
	.ctx-danger {
		@apply ctx-danger-subtlest;
	}
	.ctx-warning {
		@apply ctx-warning-subtlest;
	}
	.ctx-info {
		@apply ctx-info-subtlest;
	}
}



/* === ./styles/semantic.css === */
/* Auto-generated from bcc_scheme tokens. Do not edit. Run: pnpm run generate:semantic-css */
/* Light mode from light.tokens.json; dark mode from dark.tokens.json */

:root {
  --color-default-bcc-100: #F0FCFA;
  --color-default-bcc-1000: #012320;
  --color-default-bcc-200: #D2EEEB;
  --color-default-bcc-300: #A0CEC8;
  --color-default-bcc-400: #6FB5AD;
  --color-default-bcc-500: #3E9F97;
  --color-default-bcc-600: #1D7F78;
  --color-default-bcc-700: #0C625C;
  --color-default-bcc-800: #014D49;
  --color-default-bcc-900: #0B3633;
  --color-default-blue-100: #F6FBFF;
  --color-default-blue-1000: #091E47;
  --color-default-blue-200: #D9ECFF;
  --color-default-blue-300: #A6CDFD;
  --color-default-blue-400: #7CABF9;
  --color-default-blue-500: #608EF6;
  --color-default-blue-600: #446ADD;
  --color-default-blue-700: #274EB5;
  --color-default-blue-800: #273C8F;
  --color-default-blue-900: #212C64;
  --color-default-brown-100: #F9FAF4;
  --color-default-brown-1000: #2E1B0F;
  --color-default-brown-200: #ECE8DC;
  --color-default-brown-300: #D1C5B0;
  --color-default-brown-400: #BEA889;
  --color-default-brown-500: #A98C66;
  --color-default-brown-600: #8B6D45;
  --color-default-brown-700: #6E5232;
  --color-default-brown-800: #553D28;
  --color-default-brown-900: #3F2C1E;
  --color-default-green-100: #EFFFED;
  --color-default-green-1000: #032429;
  --color-default-green-200: #CBF3C9;
  --color-default-green-300: #83D895;
  --color-default-green-400: #32C180;
  --color-default-green-500: #1CA673;
  --color-default-green-600: #09825D;
  --color-default-green-700: #0C6241;
  --color-default-green-800: #094C3B;
  --color-default-green-900: #073734;
  --color-default-magenta-100: #FFF8FF;
  --color-default-magenta-1000: #3F0534;
  --color-default-magenta-200: #FCE0F8;
  --color-default-magenta-300: #F3B4E2;
  --color-default-magenta-400: #EB8ACF;
  --color-default-magenta-500: #DE66B0;
  --color-default-magenta-600: #BE428F;
  --color-default-magenta-700: #952E70;
  --color-default-magenta-800: #751F57;
  --color-default-magenta-900: #5B1043;
  --color-default-neutral-alpha-100A: #171717;
  --color-default-neutral-alpha-200A: #051524;
  --color-default-neutral-alpha-300A: #0B120E;
  --color-default-neutral-alpha-400A: #080F21;
  --color-default-neutral-alpha-500A: #050C1F;
  --color-default-neutral-0: #FFFFFF;
  --color-default-neutral-100: #F8F8F8;
  --color-default-neutral-1000: #292A2E;
  --color-default-neutral-1100: #1E1F21;
  --color-default-neutral-200: #F0F1F2;
  --color-default-neutral-300: #DDDEE1;
  --color-default-neutral-400: #B7B9BE;
  --color-default-neutral-500: #8C8F97;
  --color-default-neutral-600: #7D818A;
  --color-default-neutral-700: #6B6E76;
  --color-default-neutral-800: #505258;
  --color-default-neutral-900: #3B3D42;
  --color-default-orange-100: #FFFAED;
  --color-default-orange-1000: #420E0D;
  --color-default-orange-200: #FEE3C1;
  --color-default-orange-300: #F6B981;
  --color-default-orange-400: #F19457;
  --color-default-orange-500: #DA772E;
  --color-default-orange-600: #B55919;
  --color-default-orange-700: #943A14;
  --color-default-orange-800: #782612;
  --color-default-orange-900: #5D1712;
  --color-default-purple-100: #F6F9FF;
  --color-default-purple-1000: #1D154D;
  --color-default-purple-200: #E3E3FE;
  --color-default-purple-300: #C9C3EC;
  --color-default-purple-400: #AFA0E0;
  --color-default-purple-500: #9A82DA;
  --color-default-purple-600: #8360C3;
  --color-default-purple-700: #61479C;
  --color-default-purple-800: #493481;
  --color-default-purple-900: #352465;
  --color-default-red-100: #FFF8F3;
  --color-default-red-1000: #440223;
  --color-default-red-200: #FEE2DD;
  --color-default-red-300: #FAB6AD;
  --color-default-red-400: #FA877E;
  --color-default-red-500: #ED6362;
  --color-default-red-600: #CA414E;
  --color-default-red-700: #A42237;
  --color-default-red-800: #811436;
  --color-default-red-900: #630D2E;
  --color-default-teal-100: #F6FBFF;
  --color-default-teal-1000: #0C2132;
  --color-default-teal-200: #C3F2F8;
  --color-default-teal-300: #82D3E3;
  --color-default-teal-400: #51B9CF;
  --color-default-teal-500: #1A9EB7;
  --color-default-teal-600: #0B7DA1;
  --color-default-teal-700: #005B81;
  --color-default-teal-800: #09486B;
  --color-default-teal-900: #0D324D;
  --color-default-transparent: #000000;
  --color-default-yellow-100: #FDF8E9;
  --color-default-yellow-1000: #2D1F00;
  --color-default-yellow-200: #F8E6A0;
  --color-default-yellow-300: #E9C348;
  --color-default-yellow-400: #D5A406;
  --color-default-yellow-500: #BC870D;
  --color-default-yellow-600: #A4670B;
  --color-default-yellow-700: #854901;
  --color-default-yellow-800: #653805;
  --color-default-yellow-900: #4B2C04;
  --color-secondary-bcc-100: #F0FCFA;
  --color-secondary-bcc-1000: #012320;
  --color-secondary-bcc-200: #D2EEEB;
  --color-secondary-bcc-300: #A0CEC8;
  --color-secondary-bcc-400: #6FB5AD;
  --color-secondary-bcc-500: #3E9F97;
  --color-secondary-bcc-600: #1D7F78;
  --color-secondary-bcc-700: #0C625C;
  --color-secondary-bcc-800: #014D49;
  --color-secondary-bcc-900: #0B3633;
  --color-secondary-blue-100: #F6FBFF;
  --color-secondary-blue-1000: #091E47;
  --color-secondary-blue-200: #D9ECFF;
  --color-secondary-blue-300: #A6CDFD;
  --color-secondary-blue-400: #7CABF9;
  --color-secondary-blue-500: #608EF6;
  --color-secondary-blue-600: #446ADD;
  --color-secondary-blue-700: #274EB5;
  --color-secondary-blue-800: #273C8F;
  --color-secondary-blue-900: #212C64;
  --color-secondary-brown-100: #F9FAF4;
  --color-secondary-brown-1000: #2E1B0F;
  --color-secondary-brown-200: #ECE8DC;
  --color-secondary-brown-300: #D1C5B0;
  --color-secondary-brown-400: #BEA889;
  --color-secondary-brown-500: #A98C66;
  --color-secondary-brown-600: #8B6D45;
  --color-secondary-brown-700: #6E5232;
  --color-secondary-brown-800: #553D28;
  --color-secondary-brown-900: #3F2C1E;
  --color-secondary-green-100: #EFFFED;
  --color-secondary-green-1000: #032429;
  --color-secondary-green-200: #CBF3C9;
  --color-secondary-green-300: #83D895;
  --color-secondary-green-400: #32C180;
  --color-secondary-green-500: #1CA673;
  --color-secondary-green-600: #09825D;
  --color-secondary-green-700: #0C6241;
  --color-secondary-green-800: #094C3B;
  --color-secondary-green-900: #073734;
  --color-secondary-magenta-100: #FFF8FF;
  --color-secondary-magenta-1000: #3F0534;
  --color-secondary-magenta-200: #FCE0F8;
  --color-secondary-magenta-300: #F3B4E2;
  --color-secondary-magenta-400: #EB8ACF;
  --color-secondary-magenta-500: #DE66B0;
  --color-secondary-magenta-600: #BE428F;
  --color-secondary-magenta-700: #952E70;
  --color-secondary-magenta-800: #751F57;
  --color-secondary-magenta-900: #5B1043;
  --color-secondary-neutral-0: #FFFFFF;
  --color-secondary-neutral-100: #F8F8F8;
  --color-secondary-neutral-1000: #292A2E;
  --color-secondary-neutral-1100: #1E1F21;
  --color-secondary-neutral-200: #F0F1F2;
  --color-secondary-neutral-300: #DDDEE1;
  --color-secondary-neutral-400: #B7B9BE;
  --color-secondary-neutral-500: #8C8F97;
  --color-secondary-neutral-600: #7D818A;
  --color-secondary-neutral-700: #6B6E76;
  --color-secondary-neutral-800: #505258;
  --color-secondary-neutral-900: #3B3D42;
  --color-secondary-orange-100: #FFFAED;
  --color-secondary-orange-1000: #420E0D;
  --color-secondary-orange-200: #FEE3C1;
  --color-secondary-orange-300: #F6B981;
  --color-secondary-orange-400: #F19457;
  --color-secondary-orange-500: #DA772E;
  --color-secondary-orange-600: #B55919;
  --color-secondary-orange-700: #943A14;
  --color-secondary-orange-800: #782612;
  --color-secondary-orange-900: #5D1712;
  --color-secondary-purple-100: #F6F9FF;
  --color-secondary-purple-1000: #1D154D;
  --color-secondary-purple-200: #E3E3FE;
  --color-secondary-purple-300: #C9C3EC;
  --color-secondary-purple-400: #AFA0E0;
  --color-secondary-purple-500: #9A82DA;
  --color-secondary-purple-600: #8360C3;
  --color-secondary-purple-700: #61479C;
  --color-secondary-purple-800: #493481;
  --color-secondary-purple-900: #352465;
  --color-secondary-red-100: #FFF8F3;
  --color-secondary-red-1000: #440223;
  --color-secondary-red-200: #FEE2DD;
  --color-secondary-red-300: #FAB6AD;
  --color-secondary-red-400: #FA877E;
  --color-secondary-red-500: #ED6362;
  --color-secondary-red-600: #CA414E;
  --color-secondary-red-700: #A42237;
  --color-secondary-red-800: #811436;
  --color-secondary-red-900: #630D2E;
  --color-secondary-teal-100: #F6FBFF;
  --color-secondary-teal-1000: #0C2132;
  --color-secondary-teal-200: #C3F2F8;
  --color-secondary-teal-300: #82D3E3;
  --color-secondary-teal-400: #51B9CF;
  --color-secondary-teal-500: #1A9EB7;
  --color-secondary-teal-600: #0B7DA1;
  --color-secondary-teal-700: #005B81;
  --color-secondary-teal-800: #09486B;
  --color-secondary-teal-900: #0D324D;
  --color-secondary-yellow-100: #FDF8E9;
  --color-secondary-yellow-1000: #2D1F00;
  --color-secondary-yellow-200: #F8E6A0;
  --color-secondary-yellow-300: #E9C348;
  --color-secondary-yellow-400: #D5A406;
  --color-secondary-yellow-500: #BC870D;
  --color-secondary-yellow-600: #A4670B;
  --color-secondary-yellow-700: #854901;
  --color-secondary-yellow-800: #653805;
  --color-secondary-yellow-900: #4B2C04;
  --color-tertiary-neutral-0: #FFFFFF;
  --color-tertiary-neutral-100: #F8F8F8;
  --color-tertiary-neutral-200: #F0F1F2;
  --color-tertiary-neutral-300: #DDDEE1;
  --color-tertiary-neutral-400: #B7B9BE;
  --color-tertiary-neutral-500: #8C8F97;
  --color-tertiary-neutral-600: #7D818A;
  --color-tertiary-neutral-700: #6B6E76;
  --color-tertiary-neutral-800: #505258;
  --color-tertiary-neutral-900: #3B3D42;
}

.dark {
  --color-default-bcc-100: #012320;
  --color-default-bcc-1000: #F0FCFA;
  --color-default-bcc-200: #0B3633;
  --color-default-bcc-300: #014D49;
  --color-default-bcc-400: #0C625C;
  --color-default-bcc-500: #1D7F78;
  --color-default-bcc-600: #3E9F97;
  --color-default-bcc-700: #6FB5AD;
  --color-default-bcc-800: #A0CEC8;
  --color-default-bcc-900: #D2EEEB;
  --color-default-blue-100: #091E47;
  --color-default-blue-1000: #F6FBFF;
  --color-default-blue-200: #212C64;
  --color-default-blue-300: #273C8F;
  --color-default-blue-400: #274EB5;
  --color-default-blue-500: #446ADD;
  --color-default-blue-600: #608EF6;
  --color-default-blue-700: #7CABF9;
  --color-default-blue-800: #A6CDFD;
  --color-default-blue-900: #D9ECFF;
  --color-default-brown-100: #2E1B0F;
  --color-default-brown-1000: #F9FAF4;
  --color-default-brown-200: #3F2C1E;
  --color-default-brown-300: #553D28;
  --color-default-brown-400: #6E5232;
  --color-default-brown-500: #8B6D45;
  --color-default-brown-600: #A98C66;
  --color-default-brown-700: #BEA889;
  --color-default-brown-800: #D1C5B0;
  --color-default-brown-900: #ECE8DC;
  --color-default-green-100: #032429;
  --color-default-green-1000: #EFFFED;
  --color-default-green-200: #073734;
  --color-default-green-300: #094C3B;
  --color-default-green-400: #0C6241;
  --color-default-green-500: #09825D;
  --color-default-green-600: #1CA673;
  --color-default-green-700: #32C180;
  --color-default-green-800: #83D895;
  --color-default-green-900: #CBF3C9;
  --color-default-magenta-100: #3F0534;
  --color-default-magenta-1000: #FFF8FF;
  --color-default-magenta-200: #5B1043;
  --color-default-magenta-300: #751F57;
  --color-default-magenta-400: #952E70;
  --color-default-magenta-500: #BE428F;
  --color-default-magenta-600: #DE66B0;
  --color-default-magenta-700: #EB8ACF;
  --color-default-magenta-800: #F3B4E2;
  --color-default-magenta-900: #FCE0F8;
  --color-default-neutral-alpha-100A: #BDBDBD;
  --color-default-neutral-alpha-200A: #CECED9;
  --color-default-neutral-alpha-300A: #E3E4F2;
  --color-default-neutral-alpha-400A: #E5E9F6;
  --color-default-neutral-alpha-500A: #E9F0FB;
  --color-default-neutral-0: #18191A;
  --color-default-neutral-100: #1F1F21;
  --color-default-neutral-1000: #CECFD2;
  --color-default-neutral-1100: #E2E3E4;
  --color-default-neutral-200: #242528;
  --color-default-neutral-300: #303134;
  --color-default-neutral-400: #4B4D51;
  --color-default-neutral-500: #63666B;
  --color-default-neutral-600: #7E8188;
  --color-default-neutral-700: #96999E;
  --color-default-neutral-800: #A9ABAF;
  --color-default-neutral-900: #BFC1C4;
  --color-default-orange-100: #420E0D;
  --color-default-orange-1000: #FFFAED;
  --color-default-orange-200: #5D1712;
  --color-default-orange-300: #782612;
  --color-default-orange-400: #943A14;
  --color-default-orange-500: #B55919;
  --color-default-orange-600: #DA772E;
  --color-default-orange-700: #F19457;
  --color-default-orange-800: #F6B981;
  --color-default-orange-900: #FEE3C1;
  --color-default-purple-100: #1D154D;
  --color-default-purple-1000: #F6F9FF;
  --color-default-purple-200: #352465;
  --color-default-purple-300: #493481;
  --color-default-purple-400: #61479C;
  --color-default-purple-500: #8360C3;
  --color-default-purple-600: #9A82DA;
  --color-default-purple-700: #AFA0E0;
  --color-default-purple-800: #C9C3EC;
  --color-default-purple-900: #E3E3FE;
  --color-default-red-100: #440223;
  --color-default-red-1000: #FFF8F3;
  --color-default-red-200: #630D2E;
  --color-default-red-300: #811436;
  --color-default-red-400: #A42237;
  --color-default-red-500: #CA414E;
  --color-default-red-600: #ED6362;
  --color-default-red-700: #FA877E;
  --color-default-red-800: #FAB6AD;
  --color-default-red-900: #FEE2DD;
  --color-default-teal-100: #0C2132;
  --color-default-teal-1000: #F6FBFF;
  --color-default-teal-200: #0D324D;
  --color-default-teal-300: #09486B;
  --color-default-teal-400: #005B81;
  --color-default-teal-500: #0B7DA1;
  --color-default-teal-600: #1A9EB7;
  --color-default-teal-700: #51B9CF;
  --color-default-teal-800: #82D3E3;
  --color-default-teal-900: #C3F2F8;
  --color-default-transparent: #000000;
  --color-default-yellow-100: #2D1F00;
  --color-default-yellow-1000: #FDF8E9;
  --color-default-yellow-200: #4B2C04;
  --color-default-yellow-300: #653805;
  --color-default-yellow-400: #854901;
  --color-default-yellow-500: #A4670B;
  --color-default-yellow-600: #BC870D;
  --color-default-yellow-700: #D5A406;
  --color-default-yellow-800: #E9C348;
  --color-default-yellow-900: #F8E6A0;
  --color-secondary-bcc-100: #012320;
  --color-secondary-bcc-1000: #D2EEEB;
  --color-secondary-bcc-200: #012320;
  --color-secondary-bcc-300: #0B3633;
  --color-secondary-bcc-400: #014D49;
  --color-secondary-bcc-500: #0C625C;
  --color-secondary-bcc-600: #1D7F78;
  --color-secondary-bcc-700: #3E9F97;
  --color-secondary-bcc-800: #6FB5AD;
  --color-secondary-bcc-900: #A0CEC8;
  --color-secondary-blue-100: #091E47;
  --color-secondary-blue-1000: #A6CDFD;
  --color-secondary-blue-200: #091E47;
  --color-secondary-blue-300: #091E47;
  --color-secondary-blue-400: #212C64;
  --color-secondary-blue-500: #273C8F;
  --color-secondary-blue-600: #274EB5;
  --color-secondary-blue-700: #446ADD;
  --color-secondary-blue-800: #608EF6;
  --color-secondary-blue-900: #7CABF9;
  --color-secondary-brown-100: #2E1B0F;
  --color-secondary-brown-1000: #D1C5B0;
  --color-secondary-brown-200: #2E1B0F;
  --color-secondary-brown-300: #2E1B0F;
  --color-secondary-brown-400: #3F2C1E;
  --color-secondary-brown-500: #553D28;
  --color-secondary-brown-600: #6E5232;
  --color-secondary-brown-700: #8B6D45;
  --color-secondary-brown-800: #A98C66;
  --color-secondary-brown-900: #BEA889;
  --color-secondary-green-100: #032429;
  --color-secondary-green-1000: #83D895;
  --color-secondary-green-200: #032429;
  --color-secondary-green-300: #032429;
  --color-secondary-green-400: #073734;
  --color-secondary-green-500: #094C3B;
  --color-secondary-green-600: #0C6241;
  --color-secondary-green-700: #09825D;
  --color-secondary-green-800: #1CA673;
  --color-secondary-green-900: #32C180;
  --color-secondary-magenta-100: #3F0534;
  --color-secondary-magenta-1000: #F3B4E2;
  --color-secondary-magenta-200: #3F0534;
  --color-secondary-magenta-300: #3F0534;
  --color-secondary-magenta-400: #5B1043;
  --color-secondary-magenta-500: #751F57;
  --color-secondary-magenta-600: #952E70;
  --color-secondary-magenta-700: #BE428F;
  --color-secondary-magenta-800: #DE66B0;
  --color-secondary-magenta-900: #EB8ACF;
  --color-secondary-neutral-0: #1F1F21;
  --color-secondary-neutral-100: #242528;
  --color-secondary-neutral-1000: #E2E3E4;
  --color-secondary-neutral-1100: #E2E3E4;
  --color-secondary-neutral-200: #303134;
  --color-secondary-neutral-300: #4B4D51;
  --color-secondary-neutral-400: #63666B;
  --color-secondary-neutral-500: #7E8188;
  --color-secondary-neutral-600: #96999E;
  --color-secondary-neutral-700: #A9ABAF;
  --color-secondary-neutral-800: #BFC1C4;
  --color-secondary-neutral-900: #CECFD2;
  --color-secondary-orange-100: #420E0D;
  --color-secondary-orange-1000: #F6B981;
  --color-secondary-orange-200: #420E0D;
  --color-secondary-orange-300: #420E0D;
  --color-secondary-orange-400: #5D1712;
  --color-secondary-orange-500: #782612;
  --color-secondary-orange-600: #943A14;
  --color-secondary-orange-700: #B55919;
  --color-secondary-orange-800: #DA772E;
  --color-secondary-orange-900: #F19457;
  --color-secondary-purple-100: #1D154D;
  --color-secondary-purple-1000: #C9C3EC;
  --color-secondary-purple-200: #1D154D;
  --color-secondary-purple-300: #1D154D;
  --color-secondary-purple-400: #352465;
  --color-secondary-purple-500: #493481;
  --color-secondary-purple-600: #61479C;
  --color-secondary-purple-700: #8360C3;
  --color-secondary-purple-800: #9A82DA;
  --color-secondary-purple-900: #AFA0E0;
  --color-secondary-red-100: #440223;
  --color-secondary-red-1000: #FAB6AD;
  --color-secondary-red-200: #440223;
  --color-secondary-red-300: #440223;
  --color-secondary-red-400: #630D2E;
  --color-secondary-red-500: #811436;
  --color-secondary-red-600: #A42237;
  --color-secondary-red-700: #CA414E;
  --color-secondary-red-800: #ED6362;
  --color-secondary-red-900: #FA877E;
  --color-secondary-teal-100: #0C2132;
  --color-secondary-teal-1000: #82D3E3;
  --color-secondary-teal-200: #0C2132;
  --color-secondary-teal-300: #0C2132;
  --color-secondary-teal-400: #0D324D;
  --color-secondary-teal-500: #09486B;
  --color-secondary-teal-600: #005B81;
  --color-secondary-teal-700: #0B7DA1;
  --color-secondary-teal-800: #1A9EB7;
  --color-secondary-teal-900: #51B9CF;
  --color-secondary-yellow-100: #2D1F00;
  --color-secondary-yellow-1000: #E9C348;
  --color-secondary-yellow-200: #2D1F00;
  --color-secondary-yellow-300: #2D1F00;
  --color-secondary-yellow-400: #4B2C04;
  --color-secondary-yellow-500: #653805;
  --color-secondary-yellow-600: #854901;
  --color-secondary-yellow-700: #A4670B;
  --color-secondary-yellow-800: #BC870D;
  --color-secondary-yellow-900: #D5A406;
  --color-tertiary-neutral-0: #242528;
  --color-tertiary-neutral-100: #303134;
  --color-tertiary-neutral-200: #4B4D51;
  --color-tertiary-neutral-300: #63666B;
  --color-tertiary-neutral-400: #7E8188;
  --color-tertiary-neutral-500: #96999E;
  --color-tertiary-neutral-600: #A9ABAF;
  --color-tertiary-neutral-700: #BFC1C4;
  --color-tertiary-neutral-800: #CECFD2;
  --color-tertiary-neutral-900: #E2E3E4;
}



/* === ./styles/utilities.css === */
@utility center {
	@apply flex items-center justify-center;

	&.top {
		@apply items-start;
	}

	&.bottom {
		@apply items-end;
	}

	&.left {
		@apply justify-start;
	}

	&.right {
		@apply justify-end;
	}

	&.stretch {
		@apply items-stretch;
	}
}

@utility col {
	@apply flex flex-col items-center justify-center;

	&.left {
		@apply items-start;
	}

	&.right {
		@apply items-end;
	}

	&.top {
		@apply justify-start;
	}

	&.bottom {
		@apply justify-end;
	}
}

@utility between {
	@apply justify-between;
}

@utility hide-scrollbar {
	-ms-overflow-style: none; /* for Internet Explorer, Edge */
	scrollbar-width: none; /* for Firefox */
	overflow-y: scroll;

	&::-webkit-scrollbar {
		display: none; /* for Chrome, Safari, and Opera */
	}
}

/* Capitalize first letter */
@utility capital {
	@apply inline-block;

	&::first-letter {
		text-transform: uppercase;
	}

	&.bcc-badge {
		@apply inline-flex;
	}
}

/* Inset 0 */
@utility inset-0 {
	@apply top-0 right-0 bottom-0 left-0;
}



/* === ./styles/contexts.css === */
/* Auto-generated from src/figma-modes. Do not edit by hand. */
/* Run: pnpm run generate:context-css */

@utility ctx-default {
  --ctx-text: var(--color-default-neutral-1000);
  --ctx-text-bold: var(--color-default-neutral-1100);
  --ctx-background: var(--color-default-neutral-0);
  --ctx-gradient: var(--color-default-neutral-100);
  --ctx-border: var(--color-default-neutral-300);
  --ctx-border-bold: var(--color-default-neutral-800);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-neutral-1000);
  --ctx-background-hover: var(--color-default-neutral-100);
  --ctx-border-hover: var(--color-default-neutral-300);
}

@utility ctx-blue-bolder {
  --ctx-text: var(--color-default-blue-200);
  --ctx-text-bold: var(--color-default-blue-100);
  --ctx-background: var(--color-default-blue-700);
  --ctx-gradient: var(--color-default-blue-800);
  --ctx-border: var(--color-default-blue-800);
  --ctx-border-bold: var(--color-default-blue-600);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-blue-200);
  --ctx-background-hover: var(--color-default-blue-800);
  --ctx-border-hover: var(--color-default-blue-800);
}

@utility ctx-blue-subtle {
  --ctx-text: var(--color-default-blue-900);
  --ctx-text-bold: var(--color-default-blue-1000);
  --ctx-background: var(--color-default-blue-400);
  --ctx-gradient: var(--color-default-blue-300);
  --ctx-border: var(--color-default-blue-500);
  --ctx-border-bold: var(--color-default-blue-700);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-blue-900);
  --ctx-background-hover: var(--color-default-blue-300);
  --ctx-border-hover: var(--color-default-blue-500);
}

@utility ctx-blue-subtler {
  --ctx-text: var(--color-default-blue-800);
  --ctx-text-bold: var(--color-default-blue-900);
  --ctx-background: var(--color-default-blue-200);
  --ctx-gradient: var(--color-default-blue-300);
  --ctx-border: var(--color-default-blue-300);
  --ctx-border-bold: var(--color-default-blue-500);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-blue-800);
  --ctx-background-hover: var(--color-default-blue-300);
  --ctx-border-hover: var(--color-default-blue-300);
}

@utility ctx-blue-subtlest {
  --ctx-text: var(--color-default-blue-800);
  --ctx-text-bold: var(--color-default-blue-900);
  --ctx-background: var(--color-default-blue-100);
  --ctx-gradient: var(--color-default-blue-200);
  --ctx-border: var(--color-default-blue-200);
  --ctx-border-bold: var(--color-default-blue-400);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-blue-800);
  --ctx-background-hover: var(--color-default-blue-200);
  --ctx-border-hover: var(--color-default-blue-200);
}

@utility ctx-brand-bold {
  --ctx-text: var(--color-default-bcc-200);
  --ctx-text-bold: var(--color-default-neutral-100);
  --ctx-background: var(--color-default-bcc-600);
  --ctx-gradient: var(--color-default-bcc-700);
  --ctx-border: var(--color-default-bcc-700);
  --ctx-border-bold: var(--color-default-bcc-500);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-bcc-200);
  --ctx-background-hover: var(--color-default-bcc-700);
  --ctx-border-hover: var(--color-default-bcc-700);
}

@utility ctx-brand-bolder {
  --ctx-text: var(--color-default-neutral-0);
  --ctx-text-bold: var(--color-default-neutral-0);
  --ctx-background: var(--color-default-bcc-800);
  --ctx-gradient: var(--color-default-bcc-900);
  --ctx-border: var(--color-default-bcc-900);
  --ctx-border-bold: var(--color-default-bcc-700);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-neutral-0);
  --ctx-background-hover: var(--color-default-bcc-900);
  --ctx-border-hover: var(--color-default-bcc-900);
}

@utility ctx-brand-boldest {
  --ctx-text: var(--color-default-neutral-0);
  --ctx-text-bold: var(--color-default-neutral-0);
  --ctx-background: var(--color-default-bcc-1000);
  --ctx-gradient: var(--color-default-bcc-900);
  --ctx-border: var(--color-default-bcc-800);
  --ctx-border-bold: var(--color-default-bcc-600);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-neutral-0);
  --ctx-background-hover: var(--color-default-bcc-900);
  --ctx-border-hover: var(--color-default-bcc-800);
}

@utility ctx-brand-default {
  --ctx-text: var(--color-default-neutral-1000);
  --ctx-text-bold: var(--color-default-neutral-1100);
  --ctx-background: var(--color-default-neutral-0);
  --ctx-gradient: var(--color-default-neutral-0);
  --ctx-border: var(--color-default-neutral-700);
  --ctx-border-bold: var(--color-default-neutral-800);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-neutral-1000);
  --ctx-background-hover: var(--color-default-neutral-0);
  --ctx-border-hover: var(--color-default-neutral-700);
}

@utility ctx-brand-subtle {
  --ctx-text: var(--color-default-bcc-1000);
  --ctx-text-bold: var(--color-default-bcc-900);
  --ctx-background: var(--color-default-bcc-400);
  --ctx-gradient: var(--color-default-bcc-300);
  --ctx-border: var(--color-default-bcc-500);
  --ctx-border-bold: var(--color-default-bcc-700);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-bcc-1000);
  --ctx-background-hover: var(--color-default-bcc-300);
  --ctx-border-hover: var(--color-default-bcc-500);
}

@utility ctx-brand-subtler {
  --ctx-text: var(--color-default-bcc-900);
  --ctx-text-bold: var(--color-default-bcc-800);
  --ctx-background: var(--color-default-bcc-200);
  --ctx-gradient: var(--color-default-bcc-300);
  --ctx-border: var(--color-default-bcc-300);
  --ctx-border-bold: var(--color-default-bcc-500);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-bcc-900);
  --ctx-background-hover: var(--color-default-bcc-300);
  --ctx-border-hover: var(--color-default-bcc-300);
}

@utility ctx-brand-subtlest {
  --ctx-text: var(--color-default-bcc-800);
  --ctx-text-bold: var(--color-default-bcc-700);
  --ctx-background: var(--color-default-bcc-100);
  --ctx-gradient: var(--color-default-bcc-200);
  --ctx-border: var(--color-default-bcc-200);
  --ctx-border-bold: var(--color-default-bcc-400);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-bcc-800);
  --ctx-background-hover: var(--color-default-bcc-200);
  --ctx-border-hover: var(--color-default-bcc-200);
}

@utility ctx-brown-bolder {
  --ctx-text: var(--color-default-brown-200);
  --ctx-text-bold: var(--color-default-brown-100);
  --ctx-background: var(--color-default-brown-700);
  --ctx-gradient: var(--color-default-brown-800);
  --ctx-border: var(--color-default-brown-800);
  --ctx-border-bold: var(--color-default-brown-600);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-brown-200);
  --ctx-background-hover: var(--color-default-brown-800);
  --ctx-border-hover: var(--color-default-brown-800);
}

@utility ctx-brown-subtle {
  --ctx-text: var(--color-default-brown-900);
  --ctx-text-bold: var(--color-default-brown-1000);
  --ctx-background: var(--color-default-brown-400);
  --ctx-gradient: var(--color-default-brown-300);
  --ctx-border: var(--color-default-brown-500);
  --ctx-border-bold: var(--color-default-brown-700);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-brown-900);
  --ctx-background-hover: var(--color-default-brown-300);
  --ctx-border-hover: var(--color-default-brown-500);
}

@utility ctx-brown-subtler {
  --ctx-text: var(--color-default-brown-800);
  --ctx-text-bold: var(--color-default-brown-900);
  --ctx-background: var(--color-default-brown-200);
  --ctx-gradient: var(--color-default-brown-300);
  --ctx-border: var(--color-default-brown-300);
  --ctx-border-bold: var(--color-default-brown-500);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-brown-800);
  --ctx-background-hover: var(--color-default-brown-300);
  --ctx-border-hover: var(--color-default-brown-300);
}

@utility ctx-brown-subtlest {
  --ctx-text: var(--color-default-brown-800);
  --ctx-text-bold: var(--color-default-brown-900);
  --ctx-background: var(--color-default-brown-100);
  --ctx-gradient: var(--color-default-brown-200);
  --ctx-border: var(--color-default-brown-200);
  --ctx-border-bold: var(--color-default-brown-400);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-brown-800);
  --ctx-background-hover: var(--color-default-brown-200);
  --ctx-border-hover: var(--color-default-brown-200);
}

@utility ctx-danger-bolder {
  --ctx-text: var(--color-default-red-200);
  --ctx-text-bold: var(--color-default-red-100);
  --ctx-background: var(--color-default-red-700);
  --ctx-gradient: var(--color-default-red-800);
  --ctx-border: var(--color-default-red-700);
  --ctx-border-bold: var(--color-default-red-400);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-red-200);
  --ctx-background-hover: var(--color-default-red-800);
  --ctx-border-hover: var(--color-default-red-700);
}

@utility ctx-danger-subtlest {
  --ctx-text: var(--color-default-red-800);
  --ctx-text-bold: var(--color-default-red-900);
  --ctx-background: var(--color-default-red-100);
  --ctx-gradient: var(--color-default-red-200);
  --ctx-border: var(--color-default-red-300);
  --ctx-border-bold: var(--color-default-red-800);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-red-800);
  --ctx-background-hover: var(--color-default-red-200);
  --ctx-border-hover: var(--color-default-red-300);
}

@utility ctx-gray-bolder {
  --ctx-text: var(--color-default-neutral-200);
  --ctx-text-bold: var(--color-default-neutral-100);
  --ctx-background: var(--color-default-neutral-700);
  --ctx-gradient: var(--color-default-neutral-800);
  --ctx-border: var(--color-default-neutral-800);
  --ctx-border-bold: var(--color-default-neutral-600);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-neutral-200);
  --ctx-background-hover: var(--color-default-neutral-800);
  --ctx-border-hover: var(--color-default-neutral-800);
}

@utility ctx-gray-subtle {
  --ctx-text: var(--color-default-neutral-900);
  --ctx-text-bold: var(--color-default-neutral-1000);
  --ctx-background: var(--color-default-neutral-400);
  --ctx-gradient: var(--color-default-neutral-300);
  --ctx-border: var(--color-default-neutral-500);
  --ctx-border-bold: var(--color-default-neutral-700);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-neutral-900);
  --ctx-background-hover: var(--color-default-neutral-300);
  --ctx-border-hover: var(--color-default-neutral-500);
}

@utility ctx-gray-subtler {
  --ctx-text: var(--color-default-neutral-800);
  --ctx-text-bold: var(--color-default-neutral-900);
  --ctx-background: var(--color-default-neutral-200);
  --ctx-gradient: var(--color-default-neutral-300);
  --ctx-border: var(--color-default-neutral-300);
  --ctx-border-bold: var(--color-default-neutral-500);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-neutral-800);
  --ctx-background-hover: var(--color-default-neutral-300);
  --ctx-border-hover: var(--color-default-neutral-300);
}

@utility ctx-gray-subtlest {
  --ctx-text: var(--color-default-neutral-800);
  --ctx-text-bold: var(--color-default-neutral-900);
  --ctx-background: var(--color-default-neutral-100);
  --ctx-gradient: var(--color-default-neutral-200);
  --ctx-border: var(--color-default-neutral-200);
  --ctx-border-bold: var(--color-default-neutral-400);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-neutral-800);
  --ctx-background-hover: var(--color-default-neutral-200);
  --ctx-border-hover: var(--color-default-neutral-200);
}

@utility ctx-green-bolder {
  --ctx-text: var(--color-default-green-200);
  --ctx-text-bold: var(--color-default-green-100);
  --ctx-background: var(--color-default-green-700);
  --ctx-gradient: var(--color-default-green-800);
  --ctx-border: var(--color-default-green-800);
  --ctx-border-bold: var(--color-default-green-600);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-green-200);
  --ctx-background-hover: var(--color-default-green-800);
  --ctx-border-hover: var(--color-default-green-800);
}

@utility ctx-green-subtle {
  --ctx-text: var(--color-default-green-900);
  --ctx-text-bold: var(--color-default-green-1000);
  --ctx-background: var(--color-default-green-400);
  --ctx-gradient: var(--color-default-green-300);
  --ctx-border: var(--color-default-green-500);
  --ctx-border-bold: var(--color-default-green-700);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-green-900);
  --ctx-background-hover: var(--color-default-green-300);
  --ctx-border-hover: var(--color-default-green-500);
}

@utility ctx-green-subtler {
  --ctx-text: var(--color-default-green-800);
  --ctx-text-bold: var(--color-default-green-900);
  --ctx-background: var(--color-default-green-200);
  --ctx-gradient: var(--color-default-green-300);
  --ctx-border: var(--color-default-green-300);
  --ctx-border-bold: var(--color-default-green-500);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-green-800);
  --ctx-background-hover: var(--color-default-green-300);
  --ctx-border-hover: var(--color-default-green-300);
}

@utility ctx-green-subtlest {
  --ctx-text: var(--color-default-green-800);
  --ctx-text-bold: var(--color-default-green-900);
  --ctx-background: var(--color-default-green-100);
  --ctx-gradient: var(--color-default-green-200);
  --ctx-border: var(--color-default-green-200);
  --ctx-border-bold: var(--color-default-green-400);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-green-800);
  --ctx-background-hover: var(--color-default-green-200);
  --ctx-border-hover: var(--color-default-green-200);
}

@utility ctx-info-bolder {
  --ctx-text: var(--color-default-blue-200);
  --ctx-text-bold: var(--color-default-blue-100);
  --ctx-background: var(--color-default-blue-700);
  --ctx-gradient: var(--color-default-blue-800);
  --ctx-border: var(--color-default-blue-700);
  --ctx-border-bold: var(--color-default-blue-400);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-blue-200);
  --ctx-background-hover: var(--color-default-blue-800);
  --ctx-border-hover: var(--color-default-blue-700);
}

@utility ctx-info-subtlest {
  --ctx-text: var(--color-default-blue-800);
  --ctx-text-bold: var(--color-default-blue-900);
  --ctx-background: var(--color-default-blue-100);
  --ctx-gradient: var(--color-default-blue-200);
  --ctx-border: var(--color-default-blue-300);
  --ctx-border-bold: var(--color-default-blue-800);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-blue-800);
  --ctx-background-hover: var(--color-default-blue-200);
  --ctx-border-hover: var(--color-default-blue-300);
}

@utility ctx-magenta-bolder {
  --ctx-text: var(--color-default-magenta-200);
  --ctx-text-bold: var(--color-default-magenta-100);
  --ctx-background: var(--color-default-magenta-700);
  --ctx-gradient: var(--color-default-magenta-800);
  --ctx-border: var(--color-default-magenta-800);
  --ctx-border-bold: var(--color-default-magenta-600);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-magenta-200);
  --ctx-background-hover: var(--color-default-magenta-800);
  --ctx-border-hover: var(--color-default-magenta-800);
}

@utility ctx-magenta-subtle {
  --ctx-text: var(--color-default-magenta-900);
  --ctx-text-bold: var(--color-default-magenta-1000);
  --ctx-background: var(--color-default-magenta-400);
  --ctx-gradient: var(--color-default-magenta-300);
  --ctx-border: var(--color-default-magenta-500);
  --ctx-border-bold: var(--color-default-magenta-700);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-magenta-900);
  --ctx-background-hover: var(--color-default-magenta-300);
  --ctx-border-hover: var(--color-default-magenta-500);
}

@utility ctx-magenta-subtler {
  --ctx-text: var(--color-default-magenta-800);
  --ctx-text-bold: var(--color-default-magenta-900);
  --ctx-background: var(--color-default-magenta-200);
  --ctx-gradient: var(--color-default-magenta-300);
  --ctx-border: var(--color-default-magenta-300);
  --ctx-border-bold: var(--color-default-magenta-500);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-magenta-800);
  --ctx-background-hover: var(--color-default-magenta-300);
  --ctx-border-hover: var(--color-default-magenta-300);
}

@utility ctx-magenta-subtlest {
  --ctx-text: var(--color-default-magenta-800);
  --ctx-text-bold: var(--color-default-magenta-900);
  --ctx-background: var(--color-default-magenta-100);
  --ctx-gradient: var(--color-default-magenta-200);
  --ctx-border: var(--color-default-magenta-200);
  --ctx-border-bold: var(--color-default-magenta-400);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-magenta-800);
  --ctx-background-hover: var(--color-default-magenta-200);
  --ctx-border-hover: var(--color-default-magenta-200);
}

@utility ctx-neutral-bold {
  --ctx-text: var(--color-default-neutral-300);
  --ctx-text-bold: var(--color-default-neutral-200);
  --ctx-background: var(--color-default-neutral-900);
  --ctx-gradient: var(--color-default-neutral-800);
  --ctx-border: var(--color-default-neutral-600);
  --ctx-border-bold: var(--color-default-neutral-500);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-neutral-300);
  --ctx-background-hover: var(--color-default-neutral-800);
  --ctx-border-hover: var(--color-default-neutral-600);
}

@utility ctx-neutral-bolder {
  --ctx-text: var(--color-default-neutral-200);
  --ctx-text-bold: var(--color-default-neutral-100);
  --ctx-background: var(--color-default-neutral-1000);
  --ctx-gradient: var(--color-default-neutral-900);
  --ctx-border: var(--color-default-neutral-700);
  --ctx-border-bold: var(--color-default-neutral-400);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-neutral-200);
  --ctx-background-hover: var(--color-default-neutral-900);
  --ctx-border-hover: var(--color-default-neutral-700);
}

@utility ctx-neutral-boldest {
  --ctx-text: var(--color-default-neutral-100);
  --ctx-text-bold: var(--color-default-neutral-0);
  --ctx-background: var(--color-default-neutral-1100);
  --ctx-gradient: var(--color-default-neutral-1000);
  --ctx-border: var(--color-default-neutral-800);
  --ctx-border-bold: var(--color-default-neutral-300);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-neutral-100);
  --ctx-background-hover: var(--color-default-neutral-1000);
  --ctx-border-hover: var(--color-default-neutral-800);
}

@utility ctx-neutral-subtle {
  --ctx-text: var(--color-default-neutral-800);
  --ctx-text-bold: var(--color-default-neutral-900);
  --ctx-background: var(--color-default-neutral-200);
  --ctx-gradient: var(--color-default-neutral-300);
  --ctx-border: var(--color-default-neutral-500);
  --ctx-border-bold: var(--color-default-neutral-600);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-neutral-800);
  --ctx-background-hover: var(--color-default-neutral-300);
  --ctx-border-hover: var(--color-default-neutral-500);
}

@utility ctx-neutral-subtler {
  --ctx-text: var(--color-default-neutral-900);
  --ctx-text-bold: var(--color-default-neutral-1000);
  --ctx-background: var(--color-default-neutral-100);
  --ctx-gradient: var(--color-default-neutral-200);
  --ctx-border: var(--color-default-neutral-400);
  --ctx-border-bold: var(--color-default-neutral-700);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-neutral-900);
  --ctx-background-hover: var(--color-default-neutral-200);
  --ctx-border-hover: var(--color-default-neutral-400);
}

@utility ctx-neutral-subtlest {
  --ctx-text: var(--color-default-neutral-1000);
  --ctx-text-bold: var(--color-default-neutral-1100);
  --ctx-background: var(--color-default-neutral-0);
  --ctx-gradient: var(--color-default-neutral-100);
  --ctx-border: var(--color-default-neutral-300);
  --ctx-border-bold: var(--color-default-neutral-800);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-neutral-1000);
  --ctx-background-hover: var(--color-default-neutral-100);
  --ctx-border-hover: var(--color-default-neutral-300);
}

@utility ctx-orange-bolder {
  --ctx-text: var(--color-default-orange-200);
  --ctx-text-bold: var(--color-default-orange-100);
  --ctx-background: var(--color-default-orange-700);
  --ctx-gradient: var(--color-default-orange-800);
  --ctx-border: var(--color-default-orange-800);
  --ctx-border-bold: var(--color-default-orange-600);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-orange-200);
  --ctx-background-hover: var(--color-default-orange-800);
  --ctx-border-hover: var(--color-default-orange-800);
}

@utility ctx-orange-subtle {
  --ctx-text: var(--color-default-orange-900);
  --ctx-text-bold: var(--color-default-orange-1000);
  --ctx-background: var(--color-default-orange-400);
  --ctx-gradient: var(--color-default-orange-300);
  --ctx-border: var(--color-default-orange-500);
  --ctx-border-bold: var(--color-default-orange-700);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-orange-900);
  --ctx-background-hover: var(--color-default-orange-300);
  --ctx-border-hover: var(--color-default-orange-500);
}

@utility ctx-orange-subtler {
  --ctx-text: var(--color-default-orange-800);
  --ctx-text-bold: var(--color-default-orange-900);
  --ctx-background: var(--color-default-orange-200);
  --ctx-gradient: var(--color-default-orange-300);
  --ctx-border: var(--color-default-orange-300);
  --ctx-border-bold: var(--color-default-orange-500);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-orange-800);
  --ctx-background-hover: var(--color-default-orange-300);
  --ctx-border-hover: var(--color-default-orange-300);
}

@utility ctx-orange-subtlest {
  --ctx-text: var(--color-default-orange-800);
  --ctx-text-bold: var(--color-default-orange-900);
  --ctx-background: var(--color-default-orange-100);
  --ctx-gradient: var(--color-default-orange-200);
  --ctx-border: var(--color-default-orange-200);
  --ctx-border-bold: var(--color-default-orange-400);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-orange-800);
  --ctx-background-hover: var(--color-default-orange-200);
  --ctx-border-hover: var(--color-default-orange-200);
}

@utility ctx-purple-bolder {
  --ctx-text: var(--color-default-purple-200);
  --ctx-text-bold: var(--color-default-purple-100);
  --ctx-background: var(--color-default-purple-700);
  --ctx-gradient: var(--color-default-purple-800);
  --ctx-border: var(--color-default-purple-800);
  --ctx-border-bold: var(--color-default-purple-600);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-purple-200);
  --ctx-background-hover: var(--color-default-purple-800);
  --ctx-border-hover: var(--color-default-purple-800);
}

@utility ctx-purple-subtle {
  --ctx-text: var(--color-default-purple-900);
  --ctx-text-bold: var(--color-default-purple-1000);
  --ctx-background: var(--color-default-purple-400);
  --ctx-gradient: var(--color-default-purple-300);
  --ctx-border: var(--color-default-purple-500);
  --ctx-border-bold: var(--color-default-purple-700);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-purple-900);
  --ctx-background-hover: var(--color-default-purple-300);
  --ctx-border-hover: var(--color-default-purple-500);
}

@utility ctx-purple-subtler {
  --ctx-text: var(--color-default-purple-800);
  --ctx-text-bold: var(--color-default-purple-900);
  --ctx-background: var(--color-default-purple-200);
  --ctx-gradient: var(--color-default-purple-300);
  --ctx-border: var(--color-default-purple-300);
  --ctx-border-bold: var(--color-default-purple-500);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-purple-800);
  --ctx-background-hover: var(--color-default-purple-300);
  --ctx-border-hover: var(--color-default-purple-300);
}

@utility ctx-purple-subtlest {
  --ctx-text: var(--color-default-purple-800);
  --ctx-text-bold: var(--color-default-purple-900);
  --ctx-background: var(--color-default-purple-100);
  --ctx-gradient: var(--color-default-purple-200);
  --ctx-border: var(--color-default-purple-200);
  --ctx-border-bold: var(--color-default-purple-400);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-purple-800);
  --ctx-background-hover: var(--color-default-purple-200);
  --ctx-border-hover: var(--color-default-purple-200);
}

@utility ctx-red-bolder {
  --ctx-text: var(--color-default-red-200);
  --ctx-text-bold: var(--color-default-red-100);
  --ctx-background: var(--color-default-red-700);
  --ctx-gradient: var(--color-default-red-800);
  --ctx-border: var(--color-default-red-800);
  --ctx-border-bold: var(--color-default-red-600);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-red-200);
  --ctx-background-hover: var(--color-default-red-800);
  --ctx-border-hover: var(--color-default-red-800);
}

@utility ctx-red-subtle {
  --ctx-text: var(--color-default-red-900);
  --ctx-text-bold: var(--color-default-red-1000);
  --ctx-background: var(--color-default-red-400);
  --ctx-gradient: var(--color-default-red-300);
  --ctx-border: var(--color-default-red-500);
  --ctx-border-bold: var(--color-default-red-700);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-red-900);
  --ctx-background-hover: var(--color-default-red-300);
  --ctx-border-hover: var(--color-default-red-500);
}

@utility ctx-red-subtler {
  --ctx-text: var(--color-default-red-800);
  --ctx-text-bold: var(--color-default-red-900);
  --ctx-background: var(--color-default-red-200);
  --ctx-gradient: var(--color-default-red-300);
  --ctx-border: var(--color-default-red-300);
  --ctx-border-bold: var(--color-default-red-500);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-red-800);
  --ctx-background-hover: var(--color-default-red-300);
  --ctx-border-hover: var(--color-default-red-300);
}

@utility ctx-red-subtlest {
  --ctx-text: var(--color-default-red-800);
  --ctx-text-bold: var(--color-default-red-900);
  --ctx-background: var(--color-default-red-100);
  --ctx-gradient: var(--color-default-red-200);
  --ctx-border: var(--color-default-red-200);
  --ctx-border-bold: var(--color-default-red-400);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-red-800);
  --ctx-background-hover: var(--color-default-red-200);
  --ctx-border-hover: var(--color-default-red-200);
}

@utility ctx-success-bolder {
  --ctx-text: var(--color-default-green-200);
  --ctx-text-bold: var(--color-default-green-100);
  --ctx-background: var(--color-default-green-700);
  --ctx-gradient: var(--color-default-green-800);
  --ctx-border: var(--color-default-green-700);
  --ctx-border-bold: var(--color-default-green-400);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-green-200);
  --ctx-background-hover: var(--color-default-green-800);
  --ctx-border-hover: var(--color-default-green-700);
}

@utility ctx-success-subtlest {
  --ctx-text: var(--color-default-green-800);
  --ctx-text-bold: var(--color-default-green-900);
  --ctx-background: var(--color-default-green-100);
  --ctx-gradient: var(--color-default-green-200);
  --ctx-border: var(--color-default-green-300);
  --ctx-border-bold: var(--color-default-green-800);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-green-800);
  --ctx-background-hover: var(--color-default-green-200);
  --ctx-border-hover: var(--color-default-green-300);
}

@utility ctx-teal-bolder {
  --ctx-text: var(--color-default-teal-200);
  --ctx-text-bold: var(--color-default-teal-100);
  --ctx-background: var(--color-default-teal-700);
  --ctx-gradient: var(--color-default-teal-800);
  --ctx-border: var(--color-default-teal-800);
  --ctx-border-bold: var(--color-default-teal-600);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-teal-200);
  --ctx-background-hover: var(--color-default-teal-800);
  --ctx-border-hover: var(--color-default-teal-800);
}

@utility ctx-teal-subtle {
  --ctx-text: var(--color-default-teal-900);
  --ctx-text-bold: var(--color-default-teal-1000);
  --ctx-background: var(--color-default-teal-400);
  --ctx-gradient: var(--color-default-teal-300);
  --ctx-border: var(--color-default-teal-500);
  --ctx-border-bold: var(--color-default-teal-700);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-teal-900);
  --ctx-background-hover: var(--color-default-teal-300);
  --ctx-border-hover: var(--color-default-teal-500);
}

@utility ctx-teal-subtler {
  --ctx-text: var(--color-default-teal-800);
  --ctx-text-bold: var(--color-default-teal-900);
  --ctx-background: var(--color-default-teal-200);
  --ctx-gradient: var(--color-default-teal-300);
  --ctx-border: var(--color-default-teal-300);
  --ctx-border-bold: var(--color-default-teal-500);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-teal-800);
  --ctx-background-hover: var(--color-default-teal-300);
  --ctx-border-hover: var(--color-default-teal-300);
}

@utility ctx-teal-subtlest {
  --ctx-text: var(--color-default-teal-800);
  --ctx-text-bold: var(--color-default-teal-900);
  --ctx-background: var(--color-default-teal-100);
  --ctx-gradient: var(--color-default-teal-200);
  --ctx-border: var(--color-default-teal-200);
  --ctx-border-bold: var(--color-default-teal-400);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-teal-800);
  --ctx-background-hover: var(--color-default-teal-200);
  --ctx-border-hover: var(--color-default-teal-200);
}

@utility ctx-warning-bolder {
  --ctx-text: var(--color-default-yellow-200);
  --ctx-text-bold: var(--color-default-yellow-100);
  --ctx-background: var(--color-default-yellow-700);
  --ctx-gradient: var(--color-default-yellow-800);
  --ctx-border: var(--color-default-yellow-700);
  --ctx-border-bold: var(--color-default-yellow-400);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-yellow-200);
  --ctx-background-hover: var(--color-default-yellow-800);
  --ctx-border-hover: var(--color-default-yellow-700);
}

@utility ctx-warning-subtlest {
  --ctx-text: var(--color-default-yellow-800);
  --ctx-text-bold: var(--color-default-yellow-900);
  --ctx-background: var(--color-default-yellow-100);
  --ctx-gradient: var(--color-default-yellow-200);
  --ctx-border: var(--color-default-yellow-300);
  --ctx-border-bold: var(--color-default-yellow-800);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-yellow-800);
  --ctx-background-hover: var(--color-default-yellow-200);
  --ctx-border-hover: var(--color-default-yellow-300);
}

@utility ctx-yellow-bolder {
  --ctx-text: var(--color-default-yellow-200);
  --ctx-text-bold: var(--color-default-yellow-100);
  --ctx-background: var(--color-default-yellow-700);
  --ctx-gradient: var(--color-default-yellow-800);
  --ctx-border: var(--color-default-yellow-800);
  --ctx-border-bold: var(--color-default-yellow-600);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-yellow-200);
  --ctx-background-hover: var(--color-default-yellow-800);
  --ctx-border-hover: var(--color-default-yellow-800);
}

@utility ctx-yellow-subtle {
  --ctx-text: var(--color-default-yellow-900);
  --ctx-text-bold: var(--color-default-yellow-1000);
  --ctx-background: var(--color-default-yellow-400);
  --ctx-gradient: var(--color-default-yellow-300);
  --ctx-border: var(--color-default-yellow-500);
  --ctx-border-bold: var(--color-default-yellow-700);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-yellow-900);
  --ctx-background-hover: var(--color-default-yellow-300);
  --ctx-border-hover: var(--color-default-yellow-500);
}

@utility ctx-yellow-subtler {
  --ctx-text: var(--color-default-yellow-800);
  --ctx-text-bold: var(--color-default-yellow-900);
  --ctx-background: var(--color-default-yellow-200);
  --ctx-gradient: var(--color-default-yellow-300);
  --ctx-border: var(--color-default-yellow-300);
  --ctx-border-bold: var(--color-default-yellow-500);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-yellow-800);
  --ctx-background-hover: var(--color-default-yellow-300);
  --ctx-border-hover: var(--color-default-yellow-300);
}

@utility ctx-yellow-subtlest {
  --ctx-text: var(--color-default-yellow-800);
  --ctx-text-bold: var(--color-default-yellow-900);
  --ctx-background: var(--color-default-yellow-100);
  --ctx-gradient: var(--color-default-yellow-200);
  --ctx-border: var(--color-default-yellow-200);
  --ctx-border-bold: var(--color-default-yellow-400);
  --ctx-shadow: var(--color-neutral-alpha-500A);
  --ctx-text-hover: var(--color-default-yellow-800);
  --ctx-background-hover: var(--color-default-yellow-200);
  --ctx-border-hover: var(--color-default-yellow-200);
}



/* === ./styles/context.css === */
@theme {
	--color-brand-100: var(--color-bcc-100);
	--color-brand-200: var(--color-bcc-200);
	--color-brand-300: var(--color-bcc-300);
	--color-brand-400: var(--color-bcc-400);
	--color-brand-500: var(--color-bcc-500);
	--color-brand-600: var(--color-bcc-600);
	--color-brand-700: var(--color-bcc-700);
	--color-brand-800: var(--color-bcc-800);
	--color-brand-900: var(--color-bcc-900);
	--color-brand-1000: var(--color-bcc-1000);
}

/** DEFAULT CONTEXTS */
@utility ctx-default {
	@apply ctx-neutral-subtlest;
}
@utility ctx-success {
	@apply ctx-success-subtlest;
}
@utility ctx-danger {
	@apply ctx-danger-subtlest;
}
@utility ctx-warning {
	@apply ctx-warning-subtlest;
}
@utility ctx-info {
	@apply ctx-info-subtlest;
}

@utility text-ctx {
	color: var(--ctx-text);
}

@utility text-ctx-bold {
	color: var(--ctx-text-bold);
}

@utility bg-ctx {
	background-color: var(--ctx-background);
}

@utility border-ctx {
	border-color: var(--ctx-border);
}

@utility shadow-ctx {
	--tw-shadow-color: var(--ctx-shadow);
}

@utility ctx {
	background-color: var(--ctx-background);
	color: var(--ctx-text);
	border-color: var(--ctx-border);
}

@utility ctx-gradient {
	background: linear-gradient(225deg, var(--ctx-background) 0%, var(--ctx-gradient) 100%);

	@variant dark {
		background: linear-gradient(225deg, var(--ctx-gradient) 0%, var(--ctx-background) 100%);
	}
}

@utility ctx-raised {
	box-shadow:
		0 1px 1px 0 var(--ctx-shadow),
		0 0 1px 0 var(--ctx-shadow);
}

@utility ctx-flat {
	--ctx-background: transparent;

	@variant hover {
		--ctx-background: var(--ctx-background-hover);
	}
}

@utility clickable {
	cursor: pointer;
}

@media (hover: hover) and (pointer: fine) {
	.clickable:hover {
		--ctx-background: var(--ctx-background-hover);
		--ctx-text: var(--ctx-text-hover);
		--ctx-border: var(--ctx-border-hover);
	}

	.clickable:active {
		--ctx-background: var(--ctx-background-pressed);
		--ctx-text: var(--ctx-text-pressed);
		--ctx-border: var(--ctx-border-pressed);
	}
}



/* === ./styles/component-overrides.css === */
/** Custom styles to fix primevue components that are not custom or wrapped. */

:root {
	--p-toast-width: min(85vw, calc(var(--spacing) * 100));
	--p-tooltip-max-width: min(85vw, calc(var(--spacing) * 100));
}

.p-overlay-mask:has(.p-dialog) {
	padding: 1rem;
}

/**
* GUTTER FIX
* Primevue's dropwdown components are all missing the gap between input and dropdown
**/
.p-autocomplete-overlay,
.p-menu-overlay,
.p-multiselect-overlay,
.p-select-overlay,
.p-datepicker-panel,
.p-treeselect-overlay {
	margin: var(--p-anchor-gutter) 0;
}

/* This fix is to ensure overlay badge is contained within the size of the component it wraps */
.p-overlaybadge {
	display: inline-block;
}

/**
* BccAutocomplete
**/

/** Our icons are a bit smaller that Primevue's default */
.p-autocomplete .p-icon {
	--p-icon-size: var(--icon-size-sm);
	--p-form-field-sm-font-size: var(--icon-size-sm);
	--p-form-field-lg-font-size: var(--icon-size-md);
}

.p-autocomplete .p-autocomplete-clear-icon {
	/** middle-align the icon */
	top: calc(50% - var(--icon-size-sm) / 2);
	margin-top: 0;
}

.p-autocomplete-clearable .p-inputtext {
	flex-grow: 1;
}

.p-autocomplete-chip.p-chip {
	padding-block-start: calc(var(--p-autocomplete-padding-y) / 2);
	padding-block-end: calc(var(--p-autocomplete-padding-y) / 2);
	border-radius: var(--p-autocomplete-chip-border-radius);
}

/**
* BccSelect
**/
.p-select {
	--p-icon-size: var(--icon-size-sm);
}

.p-select.inline-select {
	@apply mx-auto inline-flex w-auto items-center border-0 bg-transparent shadow-none;
	--p-icon-size: 1.25em;
	--p-select-dropdown-width: 1.5em;
	--p-select-min-height: auto;
}

.p-select.inline-select .p-select-label {
	@apply inline-block font-semibold;
	font-size: inherit;
	padding: 0 0 0 0.25em;
}

.p-select.inline-select.inverse {
	--p-select-color: var(--color-neutral-0);
	--p-select-dropdown-color: var(--color-neutral-0);
	--p-select-placeholder-color: var(--color-dark-neutral-1000);
}

/** 
* Fix issue with icons inside Input within an InputGroup being hidden when Input is in focus
**/
.p-inputicon {
	z-index: 2;
}

.p-dialog-close-button {
	--p-icon-size: var(--icon-size-sm);
}
.p-dialog .p-button-icon:empty {
	display: none;
}

.p-togglebutton {
	font-size: var(--text-sm);
	border: 0;
}

.p-togglebutton-sm {
	font-size: var(--text-sm);
	min-height: var(--p-togglebutton-sm-min-height);
}

.p-togglebutton-lg {
	font-size: var(--text-md);
	min-height: var(--p-togglebutton-lg-min-height);
}

/* primevue-overrides.css - CSS-level component overrides */
@layer custom {
	.p-accordionheader {
		gap: var(--p-accordion-header-gap);
	}

	.p-autocomplete-input-multiple {
		min-height: var(--p-autocomplete-input-multiple-min-height);
		gap: var(--p-autocomplete-input-multiple-gap);
	}

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

	.p-button {
		min-height: var(--p-button-min-height);
	}

	.p-button-sm {
		min-height: var(--p-button-sm-min-height);
	}

	.p-button-lg {
		min-height: var(--p-button-lg-min-height);
	}

	.p-button.p-button-icon-only {
		min-width: var(--p-button-icon-only-width);
	}

	.p-button-sm.p-button-icon-only {
		min-width: var(--p-button-sm-icon-only-width);
	}

	.p-button-lg.p-button-icon-only {
		min-width: var(--p-button-lg-icon-only-width);
	}

	.p-divider {
		gap: var(--p-divider-content-gap);
	}

	.p-inputgroupaddon {
		min-height: var(--p-inputgroup-addon-min-height);
	}

	.p-inputtext {
		min-height: var(--p-inputtext-min-height);
	}

	.p-inputtext-sm {
		min-height: var(--p-inputtext-sm-min-height);
	}

	.p-inputtext-lg {
		min-height: var(--p-inputtext-lg-min-height);
	}

	.p-message-text {
		line-height: 1;
		flex: 1 1 0;
	}

	.p-multiselect {
		min-height: var(--p-multiselect-min-height);
	}

	.p-multiselect-sm {
		min-height: var(--p-multiselect-sm-min-height);
	}

	.p-multiselect-lg {
		min-height: var(--p-multiselect-lg-min-height);
	}

	.p-multiselect-label-container {
		display: flex;
		align-items: center;
	}

	.p-radiobutton {
		gap: var(--p-radiobutton-gap);
		border-radius: var(--p-radiobutton-border-radius);
	}

	.p-radiobutton-icon {
		border-radius: var(--p-radiobutton-icon-border-radius);
	}

	.p-radiobutton-icon-sm {
		border-radius: var(--p-radiobutton-icon-sm-border-radius);
	}

	.p-radiobutton-icon-lg {
		border-radius: var(--p-radiobutton-icon-lg-border-radius);
	}

	.p-select {
		min-height: var(--p-select-min-height);
	}

	.p-select-sm {
		min-height: var(--p-select-sm-min-height);
	}

	.p-select-lg {
		min-height: var(--p-select-lg-min-height);
	}

	.p-select-label {
		display: flex;
		align-items: center;
	}

	.p-select-option {
		gap: var(--p-select-option-gap);
	}

	.p-textarea {
		min-height: var(--p-textarea-min-height);
	}

	.p-togglebutton {
		min-height: var(--p-togglebutton-min-height);
	}

	.p-togglebutton .p-togglebutton-sm {
		min-height: var(--p-togglebutton-sm-min-height);
		border-radius: var(--p-togglebutton-sm-border-radius);
	}

	.p-togglebutton-lg {
		min-height: var(--p-togglebutton-lg-min-height);
	}

	.p-togglebutton .p-togglebutton-content {
		min-height: var(--p-togglebutton-content-min-height);
	}

	.p-togglebutton-sm .p-togglebutton-content {
		min-height: var(--p-togglebutton-content-sm-min-height);
		border-radius: var(--p-togglebutton-content-sm-border-radius);
	}

	.p-togglebutton-lg .p-togglebutton-content {
		min-height: var(--p-togglebutton-content-lg-min-height);
	}
}




/* === ./components/custom/styles.css === */

/* from ./BccAppNavigation/BccAppNavigation.css */
@layer components {
	.bcc-app-nav {
		@apply bg-elevation-surface-default dark:border-brand-800 sticky inset-x-0 bottom-0 z-20 overflow-visible shadow-md select-none sm:rounded-t-xl dark:border-t;
	}
	.bcc-app-nav-container {
		@apply center pb-inset-bottom-1 mx-auto max-w-lg pt-1;
	}

	.bcc-app-nav-item {
		@apply relative flex h-12 flex-1 flex-col items-center justify-center gap-1 transition-colors focus:ring-0 focus:outline-none;
	}

	.bcc-nav-item-icon {
		@apply icon-subtlest size-6;
	}

	.bcc-nav-item-badge {
		@apply absolute top-0 right-1;
	}

	.bcc-nav-item-title {
		@apply heading-xs text-subtlest text-center opacity-75;
	}

	.bcc-app-nav-item--active .bcc-nav-item-title {
		@apply text-selected opacity-100;
	}

	.bcc-app-nav-item--active .bcc-nav-item-icon {
		@apply text-selected;
	}
}



/* from ./BccBadge/BccBadge.css */
@layer components {
	.bcc-badge {
		@apply inline-flex shrink-0 items-center justify-center gap-1 rounded-full leading-none font-medium! whitespace-nowrap;

		@apply bg-ctx text-ctx;
	}
	.bcc-badge span:empty {
		display: none;
	}
	.bcc-badge.gradient {
		@apply ctx-gradient;
	}
	.bcc-badge.sm {
		@apply heading-xs h-4 w-4;
	}
	.bcc-badge.md {
		@apply heading-sm h-5 w-5;
	}
	.bcc-badge.lg {
		@apply heading-md h-6 w-6;
	}
	.bcc-badge.xl {
		@apply heading-md h-8 w-8;
	}

	.bcc-badge .bcc-badge-icon {
		@apply size-4;
	}
	.bcc-badge.lg .bcc-badge-icon {
		@apply size-5;
	}
	.bcc-badge.xl .bcc-badge-icon {
		@apply size-6;
	}

	.bcc-badge.bcc-badge-text {
		@apply w-auto px-2;
	}
	.bcc-badge-text.lg,
	.bcc-badge-text.xl {
		@apply px-3;
	}
	.bcc-badge-text.border.lg,
	.bcc-badge-text.border.xl {
		@apply px-2;
	}
	.bcc-badge-text.bordered.lg,
	.bcc-badge-text.bordered.xl {
		@apply px-1;
	}

	.bcc-badge.border {
		@apply border-1;
		border-color: var(--ctx-background-pressed);
	}

	.bcc-badge.bordered {
		@apply border-2;
		border-color: var(--ctx-background-pressed);
	}

	.bcc-badge.squared {
		@apply rounded-sm;
	}
}



/* from ./BccCapacityIndicator/BccCapacityIndicator.css */
@layer components {
	.bcc-capacity-indicator {
		@apply text-base;
	}

	.bcc-capacity-indicator.xs {
		@apply text-xs;
	}

	.bcc-capacity-indicator.sm {
		@apply text-sm;
	}

	.bcc-capacity-indicator.lg {
		@apply text-xl;
	}

	.bcc-capacity-indicator {
		--bcc-capacity-indicator-background: transparent;
		--bcc-capacity-indicator-text: var(--ctx-text);
		--bcc-capacity-indicator-circle: var(--ctx-border);
		--bcc-capacity-indicator-circle-used: var(--ctx-border-bold);
		background: var(--bcc-capacity-indicator-background);
		@apply ctx-gray-subtler;
	}

	.bcc-capacity-indicator.colored {
		--bcc-capacity-indicator-background: var(--ctx-background);
		@apply ctx-blue-subtlest;
	}

	.bcc-capacity-indicator .text {
		color: var(--bcc-capacity-indicator-text);
	}
	.bcc-capacity-indicator .circle {
		stroke: var(--bcc-capacity-indicator-circle);
	}
	.bcc-capacity-indicator .circle-used {
		stroke: var(--bcc-capacity-indicator-circle-used);
	}

	.bcc-capacity-indicator.is-warning {
		@apply ctx-yellow-subtlest;
	}

	.bcc-capacity-indicator.is-full {
		@apply ctx-red-subtlest;
		--bcc-capacity-indicator-background: var(--ctx-background);
	}
}



/* from ./BccDialKnob/BccDialKnob.css */
@layer components {
	.bcc-knob {
		@apply relative mx-auto inline-flex touch-none items-center justify-center p-2 select-none;

		--bcc-knob-arc-bg: var(--color-background-accent-gray-default);
		--bcc-knob-head: var(--color-background-brand-bolder-default);
		--bcc-knob-tail: var(--color-background-brand-subtle-default);

		--bcc-knob-left-head: var(--color-background-accent-red-bolder-default);
		--bcc-knob-left-tail: var(--color-background-accent-red-subtle-default);

		--bcc-knob-right-head: var(--color-background-accent-green-bolder-default);
		--bcc-knob-right-tail: var(--color-background-accent-green-subtle-default);
	}

	.bcc-knob-label {
		@apply pointer-events-none absolute inset-0 flex flex-col items-center justify-center select-none;
	}

	.bcc-knob-top-left {
		@apply absolute top-0 left-0 text-left;
	}

	.bcc-knob-top-right {
		@apply absolute top-0 right-0 text-right;
	}
}



/* from ./BccFrame/BccFrame.css */
@layer components {
	.bcc-frame {
		@apply ctx ctx-default w-full border border-transparent;
	}

	.bcc-frame.bcc-frame--shadow {
		@apply shadow-ctx shadow;
	}

	.bcc-frame--raised {
		--ctx-background: var(--color-elevation-surface-raised-default);
	}
	.bcc-frame--rounded {
		@apply rounded-md;
	}
	.bcc-frame--raised.bcc-frame--shadow {
		@apply shadow-raised dark:border-default;
	}

	.bcc-frame--overlay {
		--ctx-background: var(--color-elevation-surface-overlay-default);
		@apply border;
	}
	.bcc-frame--overlay.bcc-frame--shadow {
		@apply shadow-overlay dark:border-default;
	}

	.bcc-frame--sunken {
		--ctx-background: var(--color-elevation-surface-sunken-default);
		@apply border;
	}
	.bcc-frame--sunken.bcc-frame--shadow {
		@apply dark:border-default shadow-inner;
	}
}



/* from ./BccGraphic/BccGraphic.css */
@layer components {
	.bcc-graphic .corner,
	.bcc-graphic .center-slot {
		@apply absolute z-10;
	}
	.bcc-graphic .corner.top-left {
		@apply top-4 left-4;
	}
	.bcc-graphic .corner.top-right {
		@apply top-4 right-4;
	}
	.bcc-graphic .corner.bottom-right {
		@apply right-4 bottom-4;
	}
	.bcc-graphic .corner.bottom-left {
		@apply bottom-4 left-4;
	}
	.bcc-graphic .center-slot {
		@apply inset-1/4 flex h-1/2 w-1/2 items-center justify-center;
	}

	.bcc-graphic {
		@apply from-background-brand-bolder-default to-background-brand-subtle-default relative flex max-h-full w-full bg-linear-to-tr;
	}

	.bcc-graphic-banner {
		@apply absolute inset-0 h-full w-full object-cover object-center;
	}
	.bcc-graphic-banner--loading {
		@apply from-background-brand-bolder-default to-background-brand-subtle-default animate-pulse bg-linear-to-tr;
	}

	.bcc-graphic-logo {
		@apply absolute inset-1/4 h-1/2 w-1/2 object-contain object-center;
	}
	.bcc-graphic-logo--loading {
		@apply animate-pulse bg-black opacity-10 blur-sm;
	}

	.bcc-graphic.bcc-gb-grayscale .bcc-graphic-banner,
	.bcc-graphic.bcc-gb-grayscale .bcc-graphic-logo {
		@apply brightness-75 grayscale;
	}
	.bcc-graphic.bcc-gb-highlight .bcc-graphic-banner,
	.bcc-graphic.bcc-gb-highlight .bcc-graphic-logo {
		@apply brightness-150;
	}
}



/* from ./BccImage/BccImage.css */
@layer components {
	.bcc-image {
		@apply relative inline-block overflow-hidden leading-none;
	}

	.bcc-image__img {
		@apply block max-w-full align-middle;
	}

	.bcc-image--preview {
		@apply cursor-zoom-in;
	}

	.bcc-image__preview-mask {
		@apply absolute inset-0 m-0 flex cursor-pointer items-center justify-center border-0 bg-black/40 p-0 opacity-0 transition-opacity;
	}

	.bcc-image--preview:hover .bcc-image__preview-mask,
	.bcc-image--preview:focus-within .bcc-image__preview-mask {
		@apply opacity-100;
	}

	.bcc-image__preview-icon {
		@apply size-6 text-white;
	}
}



/* from ./BccLightbox/BccLightbox.css */
@layer components {
	.bcc-lightbox {
		@apply fixed inset-0 z-9999 flex touch-none items-center justify-center;
	}

	.bcc-lightbox__backdrop {
		@apply absolute inset-0 bg-black/75;
	}

	.bcc-lightbox__header {
		@apply top-inset-top pointer-events-none absolute inset-x-0 z-20 flex items-center gap-3 p-3;
	}

	.bcc-lightbox__counter {
		@apply body-sm pointer-events-none rounded-md bg-black/50 px-2.5 py-1 text-white;
	}

	.bcc-lightbox__control {
		@apply pointer-events-auto flex cursor-pointer items-center justify-center rounded-md border-0 bg-black/50 p-2 text-white transition-colors hover:bg-black/65;
	}

	.bcc-lightbox__icon {
		@apply size-6 shrink-0;
	}

	.bcc-lightbox__nav {
		@apply absolute top-1/2 z-20 -translate-y-1/2;
	}

	.bcc-lightbox__nav--prev {
		@apply left-1 sm:left-3;
	}

	.bcc-lightbox__nav--next {
		@apply right-1 sm:right-3;
	}

	.bcc-lightbox__stage {
		@apply relative z-10 box-border flex h-full w-full max-w-6xl items-center justify-center px-2 py-14 sm:px-12;
	}

	.bcc-lightbox__toolbar {
		@apply center bottom-inset-bottom-4 pointer-events-none absolute z-20 flex gap-1 rounded-md bg-black/50 p-1;
	}

	.bcc-lightbox__toolbar-btn {
		@apply pointer-events-auto flex cursor-pointer items-center justify-center rounded-sm border-0 bg-transparent px-3 py-2 text-white transition-colors hover:bg-white/12;
	}

	.bcc-lightbox__media {
		@apply flex max-h-[calc(100vh-7rem)] w-full touch-none flex-col items-center justify-center;
	}

	.bcc-lightbox__media--zoomable {
		@apply cursor-grab active:cursor-grabbing;
	}

	.bcc-lightbox__transform {
		@apply flex origin-center items-center justify-center will-change-transform;
	}

	.bcc-lightbox__image,
	.bcc-lightbox__video {
		@apply block h-auto max-h-[calc(100vh-8rem)] w-auto max-w-[min(92vw,68rem)] object-contain select-none;
	}

	.bcc-lightbox__video {
		@apply bg-black;
	}

	.bcc-lightbox__caption {
		@apply body-sm mt-3 max-w-[min(92vw,40rem)] text-center text-white;
	}
}



/* from ./BccNpsResult/BccNpsResult.css */
@layer components {
  .bcc-nps-result {
    @apply relative w-full;
  }

  .bcc-nps-result.xs {
    @apply w-24;
  }
  .bcc-nps-result.sm {
    @apply w-36;
  }
  .bcc-nps-result.md {
    @apply w-48;
  }
  .bcc-nps-result.lg {
    @apply w-60;
  }
  .bcc-nps-result.xl {
    @apply w-72;
  }

  .bcc-nps-result .bcc-nps-result-gauge-dial {
    transform-origin: center;
  }

  .bcc-nps-result.animated .bcc-nps-result-gauge-dial {
    transition-delay: 0.3s;
    transition: all .7s cubic-bezier(0, 0, 0.3, 1.5);    
  }

  .bcc-nps-result-labels {
    @apply absolute text-base bottom-1/4 translate-y-1/2  flex w-full flex-col items-center justify-center;
  }

  .bcc-nps-result-labels--heading {
    @apply text-[1.25em] font-semibold leading-none;
  }
  .bcc-nps-result-labels--label {
    @apply text-[0.75em] text-subtlest;
  }

  .bcc-nps-result.md .bcc-nps-result-labels {
    @apply text-lg;
  }
  .bcc-nps-result.lg .bcc-nps-result-labels {
    @apply text-xl;
  }
  .bcc-nps-result.xl .bcc-nps-result-labels {
    @apply text-2xl;
  }
  .bcc-nps-result.full .bcc-nps-result-labels {
    @apply text-lg;
  }
}



/* from ./BccNpsScore/BccNpsScore.css */
@layer components {
	.bcc-nps-score {
		@apply body-sm flex min-w-70 flex-col gap-y-2 p-4 select-none;
	}

	.bcc-nps-score--heading {
		@apply flex items-center justify-between;
	}

	.bcc-nps-score--label {
		@apply flex-1 truncate;
	}

	.bcc-nps-score--bar {
		@apply pointer-events-none flex justify-evenly rounded-xl text-white;
		@apply bg-linear-to-r from-red-600 via-yellow-400 via-75% to-green-400;
	}

	.bcc-nps-score--bar.reverse {
		@apply bg-linear-to-l;
	}

	.bcc-nps-score--bar.disabled .bcc-nps-score--number.inactive {
		@apply bg-ctx ctx-gray-subtlest text-disabled;
	}

	.bcc-nps-score--number {
		@apply border-inverse;
		@apply flex h-8 flex-1 items-center justify-center border-r-2 text-sm leading-none font-bold;
		@apply pointer-events-auto cursor-pointer transition-all duration-200 hover:bg-transparent;
	}

	.bcc-nps-score--number:disabled {
		@apply cursor-not-allowed;
	}

	.bcc-nps-score--number.active {
		@apply pointer-events-none;
		text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
	}

	.bcc-nps-score--number:has(~ .bcc-nps-score--number.active) {
		text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
	}

	.bcc-nps-score--number.inactive {
		@apply bg-ctx text-ctx ctx-gray-subtler;
	}

	.bcc-nps-score--number:first-child {
		@apply rounded-l-xl pl-0.5;
	}
	.bcc-nps-score--number:last-child {
		@apply rounded-r-xl border-r-0 pr-0.5;
	}
}



/* from ./BccReact/BccReact.css */
@layer components {
	.bcc-react {
		@apply relative flex w-full items-center overflow-visible;
	}
	.bcc-react-toggle {
		@apply flex shrink-0 cursor-pointer items-center justify-center rounded-full transition;
	}
	.bcc-react-list {
		@apply hide-scrollbar ml-2 flex h-8 flex-1 items-center gap-1.5 rounded-full;
	}
	.bcc-react-list--limited {
		@apply min-w-0 overflow-x-auto;
		max-width: calc(
			var(--bcc-react-max-visible) * 3.25rem + (var(--bcc-react-max-visible) - 1) * 0.375rem
		);
	}
	.bcc-react-empty {
		@apply heading-xs flex items-center;
	}

	.bcc-react-selector-container {
		@apply absolute z-50 h-9;
		@apply top-11 origin-top-left;
	}

	.bcc-react-selector-container--top {
		@apply -top-10 origin-bottom-left;
	}

	.bcc-react-selector {
		@apply flex h-9 flex-col overflow-hidden bg-neutral-100 px-0 shadow-md;
		border-radius: 18px;
	}

	.bcc-react-selector-emojis-container {
		@apply flex items-center bg-neutral-100 px-1;
	}

	.bcc-react-selector-more {
		@apply flex w-9 items-center justify-center;
	}
	.bcc-react-selector-more-btn {
		@apply flex h-7 w-7 items-center justify-center rounded-full bg-slate-200;
	}

	.bcc-react-dropdown-container {
		@apply top-0 left-0 -z-10 w-full max-w-full;
		width: 296px;
	}
	.bcc-react-dropdown-container--top {
		@apply top-auto bottom-0 pb-0;
	}

	.bcc-react-dropdown {
		@apply -z-10 flex w-full flex-wrap overflow-hidden px-1;
	}

	.bcc-react-arrow-down-icon {
		@apply h-6 w-6 text-slate-600;
		transition: transform 0.3s ease;
	}
	.bcc-react-arrow-down-icon.open {
		transform: rotate(-180deg);
	}

	.bcc-react-selector-item {
		@apply relative h-9 w-9 p-2 text-xl leading-none transition-transform duration-200 ease-out;
	}

	.bcc-react-selector-item--clicked {
		animation: scaleFadeOut 300ms forwards;
	}

	@keyframes scaleFadeOut {
		0% {
			transform: scale(1);
			opacity: 1;
		}
		100% {
			transform: scale(1.4);
			opacity: 0;
		}
	}

	.bcc-react-emoji-list-item {
		@apply clickable center my-1 flex h-8 min-w-7 shrink-0 gap-1 rounded-full px-2 py-1 drop-shadow transition-all hover:scale-105;
		/* Default --not-selected */
		@apply bg-accent-gray-subtler-default text-default;
	}
	.bcc-react-emoji-list-item .bcc-react-count {
		@apply text-xs leading-none font-medium;
	}
	.bcc-react-emoji-list-item .bcc-react-emoji {
		@apply text-lg leading-none;
	}
	.bcc-react-emoji-list-item.selected {
		@apply bg-accent-gray-boldest-default text-inverse;
	}
}



/* from ./BccTag/BccTag.css */
@layer components {
	.bcc-tag.bcc-badge {
		@apply w-auto;
	}
	.bcc-tag.bcc-badge.md {
		@apply body-md h-6 py-0.5;
	}
	.bcc-tag.bcc-badge.sm {
		@apply body-sm h-5 py-0.5;
	}
	.bcc-tag.bcc-badge.lg {
		@apply body-md h-8 py-1;
	}
	.bcc-tag.bcc-badge.xl {
		@apply body-lg h-10 py-1;
	}
}





/* === ./components/wrapped/styles.css === */

/* from ./BccAvatar/BccAvatar.css */
@layer components {
	.bcc-avatar {
		--p-avatar-background: var(--ctx-background);
		--p-avatar-color: var(--ctx-text);
		--bcc-avatar-border: var(--ctx-border);
		--p-icon-size: var(--icon-size-sm);
		@apply ctx-gray-subtler shrink-0 overflow-hidden text-sm;
	}

	.bcc-avatar.male,
	.bcc-avatar.M {
		@apply ctx-blue-subtler;
	}
	.bcc-avatar.female,
	.bcc-avatar.F {
		@apply ctx-purple-subtler;
	}
	.bcc-avatar.male.child,
	.bcc-avatar.M.child {
		@apply ctx-teal-subtler;
	}
	.bcc-avatar.female.child,
	.bcc-avatar.F.child {
		@apply ctx-magenta-subtler;
	}
	.bcc-avatar.bordered {
		@apply border-ctx border-2;
	}
	.bcc-avatar.xs {
		@apply size-5 text-xs;
		--p-icon-size: var(--icon-size-xs);
		--p-avatar-group-offset: -8px;
	}
	.bcc-avatar.sm {
		@apply size-6 text-xs;
		--p-icon-size: var(--icon-size-xs);
		--p-avatar-group-offset: -8px;
	}
	/* .bcc-avatar.md {
        same as default 
    }*/
	.bcc-avatar.lg {
		@apply text-md size-10;
		--p-icon-size: var(--icon-size-md);
	}
	.bcc-avatar.xl {
		@apply size-12 text-xl;
		--p-icon-size: var(--icon-size-lg);
	}
	.bcc-avatar.xxl {
		@apply size-20 text-3xl;
		--p-icon-size: var(--icon-size-xl);
	}
	.bcc-avatar.xxxl {
		@apply size-24 text-4xl;
		--p-icon-size: var(--icon-size-xl);
	}

	.p-overlaybadge .bcc-avatar.p-avatar-circle.lg ~ .p-badge,
	.p-overlaybadge .bcc-avatar.p-avatar-circle.xl ~ .p-badge {
		transform: translate(40%, -40%);
	}

	.p-overlaybadge .bcc-avatar.p-avatar-circle.xxxl ~ .p-badge,
	.p-overlaybadge .bcc-avatar.p-avatar-circle.xxl ~ .p-badge {
		transform: translate(20%, -20%);
	}
}



/* from ./BccTabs/BccTabs.css */
@layer components {
    .bcc-tabs-fill.p-tabs {
        height: 100%;
        overflow: hidden;
    }
    .bcc-tabs-fill.p-tabs > .p-tablist {
        flex-shrink: 0;
    }
    .bcc-tabs-fill.p-tabs > .p-tabpanels {
        height: 100%;
        overflow: hidden;
        padding: 0;
    }
    .bcc-tabs-fill.p-tabs > .p-tabpanels > .p-tabpanel {
        height: 100%;
        overflow: auto;
    }
    .bcc-tabs-fluid.p-tabs {
        width: 100%;
    }
    .p-tabs .p-tab {
        @apply heading-sm;
    }
}


/* from ./BccToggle/BccToggle.css */
@layer components {
    .p-toggleswitch.useCtx {
        --p-toggleswitch-background: var(--ctx-background);
        --p-toggleswitch-hover-background: var(--ctx-background-hover);
        --p-toggleswitch-checked-background: var(--ctx-background);
        --p-toggleswitch-checked-hover-background: var(--ctx-background-hover);
    }
    .p-toggleswitch.loading {
        @apply pointer-events-none;
    }
    .p-toggleswitch.toggled:not(.p-toggleswitch-checked) {
        --p-toggleswitch-background: var(--color-background-danger-bolder-default);
        --p-toggleswitch-hover-background: var(--color-background-danger-bolder-hover);
    }
}



:root,
:host {
	--font-sans: 'Archivo', system-ui, sans-serif;
	@apply m-0 p-0 font-sans antialiased;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	line-height: 1.2;
	font-kerning: normal;
}

@layer base {
	hr {
		border-color: var(--color-border-default);
	}

	b,
	strong,
	.bold {
		font-weight: bold;
		--ctx-text: var(--ctx-text-bold);
	}

	/* Disable state */
	:disabled,
	.disabled {
		cursor: not-allowed;
		pointer-events: none;
	}
}


/* SFC <style> blocks extracted all .vue components */
@import './sfc-styles.css';

/* Library utility classes, compiled from the library's own components.
   Contains only the utility class rules used inside the library — no preflight,
   no @theme variables, no design tokens, since theme.css already provides those. */
@import './library-utilities.css';
