@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Thai:wght@400;700&display=swap');

:root {
	--color-primary: #2195f2;
	--color-secondary: #9ecaff;
}

/*
! tailwindcss v3.2.4 | MIT License | https://tailwindcss.com
*/

/*
1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
*/

*,
::before,
::after {
  box-sizing: border-box; /* 1 */
  border-width: 0; /* 2 */
  border-style: solid; /* 2 */
  border-color: #e5e7eb; /* 2 */
}

::before,
::after {
  --tw-content: '';
}

/*
1. Use a consistent sensible line-height in all browsers.
2. Prevent adjustments of font size after orientation changes in iOS.
3. Use a more readable tab size.
4. Use the user's configured `sans` font-family by default.
5. Use the user's configured `sans` font-feature-settings by default.
*/

html {
  line-height: 1.5; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
  -moz-tab-size: 4; /* 3 */
  -o-tab-size: 4;
     tab-size: 4; /* 3 */
  font-family: "Noto Sans Thai", "IBM Plex Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; /* 4 */
  font-feature-settings: normal; /* 5 */
}

/*
1. Remove the margin in all browsers.
2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
*/

body {
  margin: 0; /* 1 */
  line-height: inherit; /* 2 */
}

/*
1. Add the correct height in Firefox.
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
3. Ensure horizontal rules are visible by default.
*/

hr {
  height: 0; /* 1 */
  color: inherit; /* 2 */
  border-top-width: 1px; /* 3 */
}

/*
Add the correct text decoration in Chrome, Edge, and Safari.
*/

abbr:where([title]) {
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted;
}

/*
Remove the default font size and weight for headings.
*/

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: inherit;
}

/*
Reset links to optimize for opt-in styling instead of opt-out.
*/

a {
  color: inherit;
  text-decoration: inherit;
}

/*
Add the correct font weight in Edge and Safari.
*/

b,
strong {
  font-weight: bolder;
}

/*
1. Use the user's configured `mono` font family by default.
2. Correct the odd `em` font sizing in all browsers.
*/

code,
kbd,
samp,
pre {
  font-family: "IBM Plex Mono", ui-monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/*
Add the correct font size in all browsers.
*/

small {
  font-size: 80%;
}

/*
Prevent `sub` and `sup` elements from affecting the line height in all browsers.
*/

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/*
1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
3. Remove gaps between table borders by default.
*/

table {
  text-indent: 0; /* 1 */
  border-color: inherit; /* 2 */
  border-collapse: collapse; /* 3 */
}

/*
1. Change the font styles in all browsers.
2. Remove the margin in Firefox and Safari.
3. Remove default padding in all browsers.
*/

button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 1 */
  font-weight: inherit; /* 1 */
  line-height: inherit; /* 1 */
  color: inherit; /* 1 */
  margin: 0; /* 2 */
  padding: 0; /* 3 */
}

/*
Remove the inheritance of text transform in Edge and Firefox.
*/

button,
select {
  text-transform: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Remove default button styles.
*/

button,
[type='button'],
[type='reset'],
[type='submit'] {
  -webkit-appearance: button; /* 1 */
  background-color: transparent; /* 2 */
  background-image: none; /* 2 */
}

/*
Use the modern Firefox focus style for all focusable elements.
*/

:-moz-focusring {
  outline: auto;
}

/*
Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
*/

:-moz-ui-invalid {
  box-shadow: none;
}

/*
Add the correct vertical alignment in Chrome and Firefox.
*/

progress {
  vertical-align: baseline;
}

/*
Correct the cursor style of increment and decrement buttons in Safari.
*/

::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
  height: auto;
}

/*
1. Correct the odd appearance in Chrome and Safari.
2. Correct the outline style in Safari.
*/

[type='search'] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/*
Remove the inner padding in Chrome and Safari on macOS.
*/

::-webkit-search-decoration {
  -webkit-appearance: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Change font properties to `inherit` in Safari.
*/

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/*
Add the correct display in Chrome and Safari.
*/

summary {
  display: list-item;
}

/*
Removes the default spacing and border for appropriate elements.
*/

blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
figure,
p,
pre {
  margin: 0;
}

fieldset {
  margin: 0;
  padding: 0;
}

legend {
  padding: 0;
}

ol,
ul,
menu {
  list-style: none;
  margin: 0;
  padding: 0;
}

/*
Prevent resizing textareas horizontally by default.
*/

textarea {
  resize: vertical;
}

/*
1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
2. Set the default placeholder color to the user's configured gray 400 color.
*/

input::-moz-placeholder, textarea::-moz-placeholder {
  opacity: 1; /* 1 */
  color: #9ca3af; /* 2 */
}

input::placeholder,
textarea::placeholder {
  opacity: 1; /* 1 */
  color: #9ca3af; /* 2 */
}

/*
Set the default cursor for buttons.
*/

button,
[role="button"] {
  cursor: pointer;
}

/*
Make sure disabled buttons don't get the pointer cursor.
*/

:disabled {
  cursor: default;
}

/*
1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
   This can trigger a poorly considered lint error in some tools but is included by design.
*/

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
  display: block; /* 1 */
  vertical-align: middle; /* 2 */
}

/*
Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
*/

img,
video {
  max-width: 100%;
  height: auto;
}

/* Make elements with the HTML hidden attribute stay hidden by default */

[hidden] {
  display: none;
}

:root,
[data-theme]{
	background-color: hsl(var(--b1) / var(--tw-bg-opacity, 1));
	color: hsl(var(--bc) / var(--tw-text-opacity, 1));
}

html{
	-webkit-tap-highlight-color: transparent;
}

:root{
	--p: 207 89% 54%;
	--pf: 207 89% 47%;
	--sf: 215 100% 84%;
	--af: 205 100% 25%;
	--nf: 219 14% 21%;
	--b2: 0 0% 93%;
	--b3: 0 0% 86%;
	--bc: 146 0% 19%;
	--pc: 218 89% 93%;
	--sc: 216 8% 18%;
	--ac: 218 40% 88%;
	--nc: 221 6% 84%;
	--inc: 214 28% 15%;
	--suc: 152 31% 13%;
	--wac: 39 47% 13%;
	--erc: 11 79% 89%;
	--rounded-box: 1rem;
	--rounded-btn: 0.5rem;
	--rounded-badge: 1.9rem;
	--animation-btn: 0.25s;
	--animation-input: .2s;
	--btn-text-case: uppercase;
	--btn-focus-scale: 0.95;
	--border-btn: 1px;
	--tab-border: 1px;
	--tab-radius: 0.5rem;
	--s: 215 100% 91%;
	--a: 205 100% 32%;
	--n: 219 14% 28%;
	--b1: 0 0% 100%;
	--in: 210 100% 69%;
	--su: 158 64% 52%;
	--wa: 43 96% 56%;
	--er: 0 75% 42%;
}

@media (prefers-color-scheme: dark){

	:root{
		color-scheme: dark;
		--pf: 262 80% 43%;
		--sf: 316 70% 43%;
		--af: 175 70% 34%;
		--in: 198 93% 60%;
		--su: 158 64% 52%;
		--wa: 43 96% 56%;
		--er: 0 91% 71%;
		--inc: 198 100% 12%;
		--suc: 158 100% 10%;
		--wac: 43 100% 11%;
		--erc: 0 100% 14%;
		--rounded-box: 1rem;
		--rounded-btn: 0.5rem;
		--rounded-badge: 1.9rem;
		--animation-btn: 0.25s;
		--animation-input: .2s;
		--btn-text-case: uppercase;
		--btn-focus-scale: 0.95;
		--border-btn: 1px;
		--tab-border: 1px;
		--tab-radius: 0.5rem;
		--p: 262 80% 50%;
		--pc: 0 0% 100%;
		--s: 316 70% 50%;
		--sc: 0 0% 100%;
		--a: 175 70% 41%;
		--ac: 0 0% 100%;
		--n: 213 18% 20%;
		--nf: 212 17% 17%;
		--nc: 220 13% 69%;
		--b1: 212 18% 14%;
		--b2: 213 18% 12%;
		--b3: 213 18% 10%;
		--bc: 220 13% 69%;
	}
}

[data-theme=teenaii]{
	--p: 207 89% 54%;
	--pf: 207 89% 47%;
	--sf: 215 100% 84%;
	--af: 205 100% 25%;
	--nf: 219 14% 21%;
	--b2: 0 0% 93%;
	--b3: 0 0% 86%;
	--bc: 146 0% 19%;
	--pc: 218 89% 93%;
	--sc: 216 8% 18%;
	--ac: 218 40% 88%;
	--nc: 221 6% 84%;
	--inc: 214 28% 15%;
	--suc: 152 31% 13%;
	--wac: 39 47% 13%;
	--erc: 11 79% 89%;
	--rounded-box: 1rem;
	--rounded-btn: 0.5rem;
	--rounded-badge: 1.9rem;
	--animation-btn: 0.25s;
	--animation-input: .2s;
	--btn-text-case: uppercase;
	--btn-focus-scale: 0.95;
	--border-btn: 1px;
	--tab-border: 1px;
	--tab-radius: 0.5rem;
	--s: 215 100% 91%;
	--a: 205 100% 32%;
	--n: 219 14% 28%;
	--b1: 0 0% 100%;
	--in: 210 100% 69%;
	--su: 158 64% 52%;
	--wa: 43 96% 56%;
	--er: 0 75% 42%;
}

[data-theme=winter]{
	color-scheme: light;
	--pf: 212 100% 44%;
	--sf: 247 47% 36%;
	--af: 310 49% 45%;
	--nf: 217 92% 3%;
	--pc: 231 100% 93%;
	--sc: 256 40% 88%;
	--ac: 316 56% 91%;
	--nc: 229 10% 80%;
	--inc: 192 18% 16%;
	--suc: 181 16% 14%;
	--wac: 32 9% 16%;
	--erc: 2 19% 15%;
	--rounded-box: 1rem;
	--rounded-btn: 0.5rem;
	--rounded-badge: 1.9rem;
	--animation-btn: 0.25s;
	--animation-input: .2s;
	--btn-text-case: uppercase;
	--btn-focus-scale: 0.95;
	--border-btn: 1px;
	--tab-border: 1px;
	--tab-radius: 0.5rem;
	--p: 212 100% 51%;
	--s: 247 47% 43%;
	--a: 310 49% 52%;
	--n: 217 92% 10%;
	--b1: 0 0% 100%;
	--b2: 217 100% 97%;
	--b3: 219 44% 92%;
	--bc: 214 30% 32%;
	--in: 192 93% 78%;
	--su: 182 47% 66%;
	--wa: 32 62% 84%;
	--er: 0 63% 72%;
}

[data-theme=dark]{
	color-scheme: dark;
	--pf: 262 80% 43%;
	--sf: 316 70% 43%;
	--af: 175 70% 34%;
	--in: 198 93% 60%;
	--su: 158 64% 52%;
	--wa: 43 96% 56%;
	--er: 0 91% 71%;
	--inc: 198 100% 12%;
	--suc: 158 100% 10%;
	--wac: 43 100% 11%;
	--erc: 0 100% 14%;
	--rounded-box: 1rem;
	--rounded-btn: 0.5rem;
	--rounded-badge: 1.9rem;
	--animation-btn: 0.25s;
	--animation-input: .2s;
	--btn-text-case: uppercase;
	--btn-focus-scale: 0.95;
	--border-btn: 1px;
	--tab-border: 1px;
	--tab-radius: 0.5rem;
	--p: 262 80% 50%;
	--pc: 0 0% 100%;
	--s: 316 70% 50%;
	--sc: 0 0% 100%;
	--a: 175 70% 41%;
	--ac: 0 0% 100%;
	--n: 213 18% 20%;
	--nf: 212 17% 17%;
	--nc: 220 13% 69%;
	--b1: 212 18% 14%;
	--b2: 213 18% 12%;
	--b3: 213 18% 10%;
	--bc: 220 13% 69%;
}

[data-theme=cmyk]{
	color-scheme: light;
	--pf: 203 83% 53%;
	--sf: 335 78% 53%;
	--af: 56 100% 53%;
	--nf: 0 0% 3%;
	--b2: 0 0% 93%;
	--b3: 0 0% 86%;
	--bc: 146 0% 19%;
	--pc: 207 32% 14%;
	--sc: 344 100% 93%;
	--ac: 54 41% 14%;
	--nc: 145 0% 80%;
	--inc: 194 26% 12%;
	--suc: 295 30% 87%;
	--wac: 24 46% 13%;
	--erc: 12 100% 91%;
	--rounded-box: 1rem;
	--rounded-btn: 0.5rem;
	--rounded-badge: 1.9rem;
	--animation-btn: 0.25s;
	--animation-input: .2s;
	--btn-text-case: uppercase;
	--btn-focus-scale: 0.95;
	--border-btn: 1px;
	--tab-border: 1px;
	--tab-radius: 0.5rem;
	--p: 203 83% 60%;
	--s: 335 78% 60%;
	--a: 56 100% 60%;
	--n: 0 0% 10%;
	--b1: 0 0% 100%;
	--in: 192 48% 52%;
	--su: 291 48% 38%;
	--wa: 25 85% 57%;
	--er: 4 81% 56%;
}

input[type='number']::-webkit-inner-spin-button,
	input[type='number']::-webkit-outer-spin-button {
		-webkit-appearance: none;
		margin: 0;
	}

*, ::before, ::after{
	--tw-border-spacing-x: 0;
	--tw-border-spacing-y: 0;
	--tw-translate-x: 0;
	--tw-translate-y: 0;
	--tw-rotate: 0;
	--tw-skew-x: 0;
	--tw-skew-y: 0;
	--tw-scale-x: 1;
	--tw-scale-y: 1;
	--tw-pan-x:  ;
	--tw-pan-y:  ;
	--tw-pinch-zoom:  ;
	--tw-scroll-snap-strictness: proximity;
	--tw-ordinal:  ;
	--tw-slashed-zero:  ;
	--tw-numeric-figure:  ;
	--tw-numeric-spacing:  ;
	--tw-numeric-fraction:  ;
	--tw-ring-inset:  ;
	--tw-ring-offset-width: 0px;
	--tw-ring-offset-color: #fff;
	--tw-ring-color: rgb(59 130 246 / 0.5);
	--tw-ring-offset-shadow: 0 0 #0000;
	--tw-ring-shadow: 0 0 #0000;
	--tw-shadow: 0 0 #0000;
	--tw-shadow-colored: 0 0 #0000;
	--tw-blur:  ;
	--tw-brightness:  ;
	--tw-contrast:  ;
	--tw-grayscale:  ;
	--tw-hue-rotate:  ;
	--tw-invert:  ;
	--tw-saturate:  ;
	--tw-sepia:  ;
	--tw-drop-shadow:  ;
	--tw-backdrop-blur:  ;
	--tw-backdrop-brightness:  ;
	--tw-backdrop-contrast:  ;
	--tw-backdrop-grayscale:  ;
	--tw-backdrop-hue-rotate:  ;
	--tw-backdrop-invert:  ;
	--tw-backdrop-opacity:  ;
	--tw-backdrop-saturate:  ;
	--tw-backdrop-sepia:  ;
}

::backdrop{
	--tw-border-spacing-x: 0;
	--tw-border-spacing-y: 0;
	--tw-translate-x: 0;
	--tw-translate-y: 0;
	--tw-rotate: 0;
	--tw-skew-x: 0;
	--tw-skew-y: 0;
	--tw-scale-x: 1;
	--tw-scale-y: 1;
	--tw-pan-x:  ;
	--tw-pan-y:  ;
	--tw-pinch-zoom:  ;
	--tw-scroll-snap-strictness: proximity;
	--tw-ordinal:  ;
	--tw-slashed-zero:  ;
	--tw-numeric-figure:  ;
	--tw-numeric-spacing:  ;
	--tw-numeric-fraction:  ;
	--tw-ring-inset:  ;
	--tw-ring-offset-width: 0px;
	--tw-ring-offset-color: #fff;
	--tw-ring-color: rgb(59 130 246 / 0.5);
	--tw-ring-offset-shadow: 0 0 #0000;
	--tw-ring-shadow: 0 0 #0000;
	--tw-shadow: 0 0 #0000;
	--tw-shadow-colored: 0 0 #0000;
	--tw-blur:  ;
	--tw-brightness:  ;
	--tw-contrast:  ;
	--tw-grayscale:  ;
	--tw-hue-rotate:  ;
	--tw-invert:  ;
	--tw-saturate:  ;
	--tw-sepia:  ;
	--tw-drop-shadow:  ;
	--tw-backdrop-blur:  ;
	--tw-backdrop-brightness:  ;
	--tw-backdrop-contrast:  ;
	--tw-backdrop-grayscale:  ;
	--tw-backdrop-hue-rotate:  ;
	--tw-backdrop-invert:  ;
	--tw-backdrop-opacity:  ;
	--tw-backdrop-saturate:  ;
	--tw-backdrop-sepia:  ;
}

.container{
	width: 100%;
	margin-right: auto;
	margin-left: auto;
}

@media (min-width: 640px){

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

@media (min-width: 768px){

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

@media (min-width: 1024px){

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

@media (min-width: 1280px){

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

@media (min-width: 1536px){

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

.aspect-w-16{
	position: relative;
	padding-bottom: calc(var(--tw-aspect-h) / var(--tw-aspect-w) * 100%);
	--tw-aspect-w: 16;
}

.aspect-w-16 > *{
	position: absolute;
	height: 100%;
	width: 100%;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}

.aspect-h-9{
	--tw-aspect-h: 9;
}

.alert{
	display: grid;
	width: 100%;
	grid-auto-flow: row;
	align-content: flex-start;
	align-items: center;
	justify-items: center;
	gap: 1rem;
	text-align: center;
	border-width: 1px;
	--tw-border-opacity: 1;
	border-color: hsl(var(--b2) / var(--tw-border-opacity));
	padding: 1rem;
	--tw-text-opacity: 1;
	color: hsl(var(--bc) / var(--tw-text-opacity));
	border-radius: var(--rounded-box, 1rem);
	--alert-bg: hsl(var(--b2));
	--alert-bg-mix: hsl(var(--b1));
	background-color: var(--alert-bg);
}

@media (min-width: 640px){

	.alert{
		grid-auto-flow: column;
		grid-template-columns: auto minmax(auto,1fr);
		justify-items: start;
		text-align: left;
	}
}

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

.avatar > div{
	display: block;
	aspect-ratio: 1 / 1;
	overflow: hidden;
}

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

.avatar.placeholder > div{
	display: flex;
	align-items: center;
	justify-content: center;
}

@media (hover:hover){

	.checkbox-primary:hover{
		--tw-border-opacity: 1;
		border-color: hsl(var(--p) / var(--tw-border-opacity));
	}

	.label a:hover{
		--tw-text-opacity: 1;
		color: hsl(var(--bc) / var(--tw-text-opacity));
	}

	.menu li > *:not(ul):not(.menu-title):not(details):active,
.menu li > *:not(ul):not(.menu-title):not(details).active,
.menu li > details > summary:active{
		--tw-bg-opacity: 1;
		background-color: hsl(var(--n) / var(--tw-bg-opacity));
		--tw-text-opacity: 1;
		color: hsl(var(--nc) / var(--tw-text-opacity));
	}

	.\!menu li > *:not(ul):not(.menu-title):not(details):active,
.\!menu li > *:not(ul):not(.menu-title):not(details).active,
.\!menu li > details > summary:active{
		--tw-bg-opacity: 1 !important;
		background-color: hsl(var(--n) / var(--tw-bg-opacity)) !important;
		--tw-text-opacity: 1 !important;
		color: hsl(var(--nc) / var(--tw-text-opacity)) !important;
	}

	.table tr.hover:hover,
  .table tr.hover:nth-child(even):hover{
		--tw-bg-opacity: 1;
		background-color: hsl(var(--b2) / var(--tw-bg-opacity));
	}

	.table-zebra tr.hover:hover,
  .table-zebra tr.hover:nth-child(even):hover{
		--tw-bg-opacity: 1;
		background-color: hsl(var(--b3) / var(--tw-bg-opacity));
	}
}

.btn{
	display: inline-flex;
	flex-shrink: 0;
	cursor: pointer;
	-webkit-user-select: none;
	   -moz-user-select: none;
	        user-select: none;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	border-color: transparent;
	border-color: hsl(var(--b2) / var(--tw-border-opacity));
	text-align: center;
	transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
	transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
	transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
	transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
	transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
	transition-duration: 200ms;
	border-radius: var(--rounded-btn, 0.5rem);
	height: 3rem;
	padding-left: 1rem;
	padding-right: 1rem;
	font-size: 0.875rem;
	line-height: 1.25rem;
	line-height: 1em;
	min-height: 3rem;
	gap: 0.5rem;
	font-weight: 600;
	text-decoration-line: none;
	border-width: var(--border-btn, 1px);
	animation: button-pop var(--animation-btn, 0.25s) ease-out;
	text-transform: var(--btn-text-case, uppercase);
	--tw-border-opacity: 1;
	--tw-bg-opacity: 1;
	background-color: hsl(var(--b2) / var(--tw-bg-opacity));
	--tw-text-opacity: 1;
	color: hsl(var(--bc) / var(--tw-text-opacity));
	outline-color: hsl(var(--bc) / 1);
}

.btn-disabled,
  .btn[disabled],
  .btn:disabled{
	pointer-events: none;
}

.btn-square{
	height: 3rem;
	width: 3rem;
	padding: 0px;
}

.btn-circle{
	height: 3rem;
	width: 3rem;
	border-radius: 9999px;
	padding: 0px;
}

.btn-group > input[type="radio"].btn{
	-webkit-appearance: none;
	   -moz-appearance: none;
	        appearance: none;
}

.btn-group > input[type="radio"].btn:before{
	content: attr(data-title);
}

.btn:is(input[type="checkbox"]),
.btn:is(input[type="radio"]){
	width: auto;
	-webkit-appearance: none;
	   -moz-appearance: none;
	        appearance: none;
}

.btn:is(input[type="checkbox"]):after,
.btn:is(input[type="radio"]):after{
	--tw-content: attr(aria-label);
	content: var(--tw-content);
}

.checkbox{
	flex-shrink: 0;
	--chkbg: var(--bc);
	--chkfg: var(--b1);
	height: 1.5rem;
	width: 1.5rem;
	cursor: pointer;
	-webkit-appearance: none;
	   -moz-appearance: none;
	        appearance: none;
	border-width: 1px;
	border-color: hsl(var(--bc) / var(--tw-border-opacity));
	--tw-border-opacity: 0.2;
	border-radius: var(--rounded-btn, 0.5rem);
}

:root .countdown{
	line-height: 1em;
}

.countdown{
	display: inline-flex;
}

.countdown > *{
	height: 1em;
	display: inline-block;
	overflow-y: hidden;
}

.countdown > *:before{
	position: relative;
	content: "00\A 01\A 02\A 03\A 04\A 05\A 06\A 07\A 08\A 09\A 10\A 11\A 12\A 13\A 14\A 15\A 16\A 17\A 18\A 19\A 20\A 21\A 22\A 23\A 24\A 25\A 26\A 27\A 28\A 29\A 30\A 31\A 32\A 33\A 34\A 35\A 36\A 37\A 38\A 39\A 40\A 41\A 42\A 43\A 44\A 45\A 46\A 47\A 48\A 49\A 50\A 51\A 52\A 53\A 54\A 55\A 56\A 57\A 58\A 59\A 60\A 61\A 62\A 63\A 64\A 65\A 66\A 67\A 68\A 69\A 70\A 71\A 72\A 73\A 74\A 75\A 76\A 77\A 78\A 79\A 80\A 81\A 82\A 83\A 84\A 85\A 86\A 87\A 88\A 89\A 90\A 91\A 92\A 93\A 94\A 95\A 96\A 97\A 98\A 99\A";
	white-space: pre;
	top: calc(var(--value) * -1em);
	text-align: center;
	transition: all 1s cubic-bezier(1, 0, 0, 1);
}

.divider{
	display: flex;
	flex-direction: row;
	align-items: center;
	align-self: stretch;
	margin-top: 1rem;
	margin-bottom: 1rem;
	height: 1rem;
	white-space: nowrap;
}

.divider:before,
  .divider:after{
	content: "";
	flex-grow: 1;
	height: 0.125rem;
	width: 100%;
}

@media (hover: hover){

	.btm-nav > *.disabled:hover,
      .btm-nav > *[disabled]:hover{
		pointer-events: none;
		--tw-border-opacity: 0;
		background-color: hsl(var(--n) / var(--tw-bg-opacity));
		--tw-bg-opacity: 0.1;
		color: hsl(var(--bc) / var(--tw-text-opacity));
		--tw-text-opacity: 0.2;
	}

	.btn:hover{
		--tw-border-opacity: 1;
		border-color: hsl(var(--b3) / var(--tw-border-opacity));
		--tw-bg-opacity: 1;
		background-color: hsl(var(--b3) / var(--tw-bg-opacity));
	}

	.btn-primary:hover{
		--tw-border-opacity: 1;
		border-color: hsl(var(--pf) / var(--tw-border-opacity));
		--tw-bg-opacity: 1;
		background-color: hsl(var(--pf) / var(--tw-bg-opacity));
	}

	.btn.glass:hover{
		--glass-opacity: 25%;
		--glass-border-opacity: 15%;
	}

	.btn-ghost:hover{
		--tw-border-opacity: 0;
		background-color: hsl(var(--bc) / var(--tw-bg-opacity));
		--tw-bg-opacity: 0.2;
	}

	.btn-outline:hover{
		--tw-border-opacity: 1;
		border-color: hsl(var(--bc) / var(--tw-border-opacity));
		--tw-bg-opacity: 1;
		background-color: hsl(var(--bc) / var(--tw-bg-opacity));
		--tw-text-opacity: 1;
		color: hsl(var(--b1) / var(--tw-text-opacity));
	}

	.btn-outline.btn-primary:hover{
		--tw-border-opacity: 1;
		border-color: hsl(var(--pf) / var(--tw-border-opacity));
		--tw-bg-opacity: 1;
		background-color: hsl(var(--pf) / var(--tw-bg-opacity));
		--tw-text-opacity: 1;
		color: hsl(var(--pc) / var(--tw-text-opacity));
	}

	.btn-outline.btn-secondary:hover{
		--tw-border-opacity: 1;
		border-color: hsl(var(--sf) / var(--tw-border-opacity));
		--tw-bg-opacity: 1;
		background-color: hsl(var(--sf) / var(--tw-bg-opacity));
		--tw-text-opacity: 1;
		color: hsl(var(--sc) / var(--tw-text-opacity));
	}

	.btn-outline.btn-accent:hover{
		--tw-border-opacity: 1;
		border-color: hsl(var(--af) / var(--tw-border-opacity));
		--tw-bg-opacity: 1;
		background-color: hsl(var(--af) / var(--tw-bg-opacity));
		--tw-text-opacity: 1;
		color: hsl(var(--ac) / var(--tw-text-opacity));
	}

	.btn-outline.btn-success:hover{
		--tw-border-opacity: 1;
		border-color: hsl(var(--su) / var(--tw-border-opacity));
		--tw-bg-opacity: 1;
		background-color: hsl(var(--su) / var(--tw-bg-opacity));
		--tw-text-opacity: 1;
		color: hsl(var(--suc) / var(--tw-text-opacity));
	}

	.btn-outline.btn-info:hover{
		--tw-border-opacity: 1;
		border-color: hsl(var(--in) / var(--tw-border-opacity));
		--tw-bg-opacity: 1;
		background-color: hsl(var(--in) / var(--tw-bg-opacity));
		--tw-text-opacity: 1;
		color: hsl(var(--inc) / var(--tw-text-opacity));
	}

	.btn-outline.btn-warning:hover{
		--tw-border-opacity: 1;
		border-color: hsl(var(--wa) / var(--tw-border-opacity));
		--tw-bg-opacity: 1;
		background-color: hsl(var(--wa) / var(--tw-bg-opacity));
		--tw-text-opacity: 1;
		color: hsl(var(--wac) / var(--tw-text-opacity));
	}

	.btn-outline.btn-error:hover{
		--tw-border-opacity: 1;
		border-color: hsl(var(--er) / var(--tw-border-opacity));
		--tw-bg-opacity: 1;
		background-color: hsl(var(--er) / var(--tw-bg-opacity));
		--tw-text-opacity: 1;
		color: hsl(var(--erc) / var(--tw-text-opacity));
	}

	.btn-disabled:hover,
    .btn[disabled]:hover,
    .btn:disabled:hover{
		--tw-border-opacity: 0;
		background-color: hsl(var(--n) / var(--tw-bg-opacity));
		--tw-bg-opacity: 0.2;
		color: hsl(var(--bc) / var(--tw-text-opacity));
		--tw-text-opacity: 0.2;
	}

	.btn:is(input[type="checkbox"]:checked):hover, .btn:is(input[type="radio"]:checked):hover{
		--tw-border-opacity: 1;
		border-color: hsl(var(--pf) / var(--tw-border-opacity));
		--tw-bg-opacity: 1;
		background-color: hsl(var(--pf) / var(--tw-bg-opacity));
	}

	:where(.menu li:not(.menu-title):not(.disabled) > *:not(ul):not(details):not(.menu-title)):not(.active):hover, :where(.menu li:not(.menu-title):not(.disabled) > details > summary:not(.menu-title)):not(.active):hover{
		cursor: pointer;
		background-color: hsl(var(--bc) / 0.1);
		--tw-text-opacity: 1;
		color: hsl(var(--bc) / var(--tw-text-opacity));
		outline: 2px solid transparent;
		outline-offset: 2px;
	}

	{
		cursor: pointer !important;
		background-color: hsl(var(--bc) / 0.1) !important;
		--tw-text-opacity: 1 !important;
		color: hsl(var(--bc) / var(--tw-text-opacity)) !important;
		outline: 2px solid transparent !important;
		outline-offset: 2px !important;
	}
}

.label{
	display: flex;
	-webkit-user-select: none;
	   -moz-user-select: none;
	        user-select: none;
	align-items: center;
	justify-content: space-between;
	padding-left: 0.25rem;
	padding-right: 0.25rem;
	padding-top: 0.5rem;
	padding-bottom: 0.5rem;
}

.input{
	flex-shrink: 1;
	height: 3rem;
	padding-left: 1rem;
	padding-right: 1rem;
	font-size: 1rem;
	line-height: 2;
	line-height: 1.5rem;
	border-width: 1px;
	border-color: hsl(var(--bc) / var(--tw-border-opacity));
	--tw-border-opacity: 0;
	--tw-bg-opacity: 1;
	background-color: hsl(var(--b1) / var(--tw-bg-opacity));
	border-radius: var(--rounded-btn, 0.5rem);
}

.input-group > .input{
	isolation: isolate;
}

.input-group > *,
  .input-group > .input,
  .input-group > .textarea,
  .input-group > .select{
	border-radius: 0px;
}

.join{
	display: inline-flex;
	align-items: stretch;
	border-radius: var(--rounded-btn, 0.5rem);
}

.join :where(.join-item){
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
	border-bottom-left-radius: 0;
	border-top-left-radius: 0;
}

.join .join-item:not(:first-child):not(:last-child),
  .join *:not(:first-child):not(:last-child) .join-item{
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
	border-bottom-left-radius: 0;
	border-top-left-radius: 0;
}

.join .join-item:first-child:not(:last-child),
  .join *:first-child:not(:last-child) .join-item{
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}

.join :where(.join-item:first-child:not(:last-child)),
  .join :where(*:first-child:not(:last-child) .join-item){
	border-bottom-left-radius: inherit;
	border-top-left-radius: inherit;
}

.join .join-item:last-child:not(:first-child),
  .join *:last-child:not(:first-child) .join-item{
	border-bottom-left-radius: 0;
	border-top-left-radius: 0;
}

.join :where(.join-item:last-child:not(:first-child)),
  .join :where(*:last-child:not(:first-child) .join-item){
	border-top-right-radius: inherit;
	border-bottom-right-radius: inherit;
}

:where(.join *){
	border-radius: inherit;
}

.link{
	cursor: pointer;
	text-decoration-line: underline;
}

.menu{
	display: flex;
	flex-direction: column;
	flex-wrap: wrap;
	font-size: 0.875rem;
	line-height: 1.25rem;
	padding: 0.5rem;
}

.\!menu{
	display: flex !important;
	flex-direction: column !important;
	flex-wrap: wrap !important;
	font-size: 0.875rem !important;
	line-height: 1.25rem !important;
	padding: 0.5rem !important;
}

.menu :where(li ul){
	position: relative;
	white-space: nowrap;
	margin-left: 1rem;
	padding-left: 0.5rem;
}

.\!menu :where(li ul){
	position: relative !important;
	white-space: nowrap !important;
	margin-left: 1rem !important;
	padding-left: 0.5rem !important;
}

.menu :where(li:not(.menu-title) > *:not(ul):not(details):not(.menu-title)),
  .menu :where(li:not(.menu-title) > details > summary:not(.menu-title)){
	display: grid;
	grid-auto-flow: column;
	align-content: flex-start;
	align-items: center;
	gap: 0.5rem;
	grid-auto-columns: minmax(auto, max-content) auto max-content;
	-webkit-user-select: none;
	   -moz-user-select: none;
	        user-select: none;
}

.\!menu :where(li:not(.menu-title) > *:not(ul):not(details):not(.menu-title)),
  .\!menu :where(li:not(.menu-title) > details > summary:not(.menu-title)){
	display: grid !important;
	grid-auto-flow: column !important;
	align-content: flex-start !important;
	align-items: center !important;
	gap: 0.5rem !important;
	grid-auto-columns: minmax(auto, max-content) auto max-content !important;
	-webkit-user-select: none !important;
	   -moz-user-select: none !important;
	        user-select: none !important;
}

.menu li.disabled{
	cursor: not-allowed;
	-webkit-user-select: none;
	   -moz-user-select: none;
	        user-select: none;
	color: hsl(var(--bc) / 0.3);
}

.\!menu li.disabled{
	cursor: not-allowed !important;
	-webkit-user-select: none !important;
	   -moz-user-select: none !important;
	        user-select: none !important;
	color: hsl(var(--bc) / 0.3) !important;
}

.menu :where(li > .menu-dropdown:not(.menu-dropdown-show)){
	display: none;
}

.\!menu :where(li > .menu-dropdown:not(.menu-dropdown-show)){
	display: none !important;
}

:where(.menu li){
	position: relative;
	display: flex;
	flex-shrink: 0;
	flex-direction: column;
	flex-wrap: wrap;
	align-items: stretch;
}

{
	position: relative !important;
	display: flex !important;
	flex-shrink: 0 !important;
	flex-direction: column !important;
	flex-wrap: wrap !important;
	align-items: stretch !important;
}

:where(.menu li) .badge{
	justify-self: end;
}

{
	justify-self: end !important;
}

.modal{
	pointer-events: none;
	position: fixed;
	inset: 0px;
	margin: 0px;
	display: grid;
	height: 100%;
	max-height: none;
	width: 100%;
	max-width: none;
	justify-items: center;
	padding: 0px;
	opacity: 0;
	overscroll-behavior: contain;
	z-index: 999;
	background-color: transparent;
	color: inherit;
	transition-duration: 200ms;
	transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
	transition-property: transform, opacity, visibility;
	overflow-y: hidden;
}

:where(.modal){
	align-items: center;
}

.modal-open,
.modal:target,
.modal-toggle:checked + .modal,
.modal[open]{
	pointer-events: auto;
	visibility: visible;
	opacity: 1;
}

:root:has(:is(.modal-open, .modal:target, .modal-toggle:checked + .modal, .modal[open])){
	overflow: hidden;
}

.select{
	display: inline-flex;
	cursor: pointer;
	-webkit-user-select: none;
	   -moz-user-select: none;
	        user-select: none;
	-webkit-appearance: none;
	   -moz-appearance: none;
	        appearance: none;
	height: 3rem;
	padding-left: 1rem;
	padding-right: 2.5rem;
	font-size: 0.875rem;
	line-height: 1.25rem;
	line-height: 2;
	min-height: 3rem;
	border-width: 1px;
	border-color: hsl(var(--bc) / var(--tw-border-opacity));
	--tw-border-opacity: 0;
	--tw-bg-opacity: 1;
	background-color: hsl(var(--b1) / var(--tw-bg-opacity));
	font-weight: 600;
	border-radius: var(--rounded-btn, 0.5rem);
	background-image: linear-gradient(45deg, transparent 50%, currentColor 50%),
    linear-gradient(135deg, currentColor 50%, transparent 50%);
	background-position: calc(100% - 20px) calc(1px + 50%), calc(100% - 16px) calc(1px + 50%);
	background-size: 4px 4px, 4px 4px;
	background-repeat: no-repeat;
}

.select[multiple]{
	height: auto;
}

.steps .step{
	display: grid;
	grid-template-columns: repeat(1, minmax(0, 1fr));
	grid-template-columns: auto;
	grid-template-rows: repeat(2, minmax(0, 1fr));
	grid-template-rows: 40px 1fr;
	place-items: center;
	text-align: center;
	min-width: 4rem;
}

.table{
	position: relative;
	width: 100%;
	text-align: left;
	font-size: 0.875rem;
	line-height: 1.25rem;
	border-radius: var(--rounded-box, 1rem);
}

.table :where(.table-pin-rows thead tr){
	position: sticky;
	top: 0px;
	z-index: 1;
	--tw-bg-opacity: 1;
	background-color: hsl(var(--b1) / var(--tw-bg-opacity));
}

.table :where(.table-pin-rows tfoot tr){
	position: sticky;
	bottom: 0px;
	z-index: 1;
	--tw-bg-opacity: 1;
	background-color: hsl(var(--b1) / var(--tw-bg-opacity));
}

.table :where(.table-pin-cols tr th){
	position: sticky;
	left: 0px;
	right: 0px;
	--tw-bg-opacity: 1;
	background-color: hsl(var(--b1) / var(--tw-bg-opacity));
}

.textarea{
	flex-shrink: 1;
	min-height: 3rem;
	padding-top: 0.5rem;
	padding-bottom: 0.5rem;
	padding-left: 1rem;
	padding-right: 1rem;
	font-size: 0.875rem;
	line-height: 1.25rem;
	line-height: 2;
	border-width: 1px;
	border-color: hsl(var(--bc) / var(--tw-border-opacity));
	--tw-border-opacity: 0;
	--tw-bg-opacity: 1;
	background-color: hsl(var(--b1) / var(--tw-bg-opacity));
	border-radius: var(--rounded-btn, 0.5rem);
}

.toast{
	position: fixed;
	display: flex;
	min-width: -moz-fit-content;
	min-width: fit-content;
	flex-direction: column;
	white-space: nowrap;
	gap: 0.5rem;
	padding: 1rem;
}

.toggle{
	flex-shrink: 0;
	--tglbg: hsl(var(--b1));
	--handleoffset: 1.5rem;
	--handleoffsetcalculator: calc(var(--handleoffset) * -1);
	--togglehandleborder: 0 0;
	height: 1.5rem;
	width: 3rem;
	cursor: pointer;
	-webkit-appearance: none;
	   -moz-appearance: none;
	        appearance: none;
	border-width: 1px;
	border-color: hsl(var(--bc) / var(--tw-border-opacity));
	--tw-border-opacity: 0.2;
	background-color: hsl(var(--bc) / var(--tw-bg-opacity));
	--tw-bg-opacity: 0.5;
	border-radius: var(--rounded-badge, 1.9rem);
	transition: background, box-shadow var(--animation-input, 0.2s) ease-out;
	box-shadow: var(--handleoffsetcalculator) 0 0 2px var(--tglbg) inset, 0 0 0 2px var(--tglbg) inset,
    var(--togglehandleborder);
}

.alert-info{
	border-color: hsl(var(--in) / 0.2);
	--tw-text-opacity: 1;
	color: hsl(var(--inc) / var(--tw-text-opacity));
	--alert-bg: hsl(var(--in));
	--alert-bg-mix: hsl(var(--b1));
}

.alert-success{
	border-color: hsl(var(--su) / 0.2);
	--tw-text-opacity: 1;
	color: hsl(var(--suc) / var(--tw-text-opacity));
	--alert-bg: hsl(var(--su));
	--alert-bg-mix: hsl(var(--b1));
}

.alert-warning{
	border-color: hsl(var(--wa) / 0.2);
	--tw-text-opacity: 1;
	color: hsl(var(--wac) / var(--tw-text-opacity));
	--alert-bg: hsl(var(--wa));
	--alert-bg-mix: hsl(var(--b1));
}

.alert-error{
	border-color: hsl(var(--er) / 0.2);
	--tw-text-opacity: 1;
	color: hsl(var(--erc) / var(--tw-text-opacity));
	--alert-bg: hsl(var(--er));
	--alert-bg-mix: hsl(var(--b1));
}

.avatar-group :where(.avatar){
	overflow: hidden;
	border-radius: 9999px;
	border-width: 4px;
	--tw-border-opacity: 1;
	border-color: hsl(var(--b1) / var(--tw-border-opacity));
}

.btm-nav > *.disabled,
    .btm-nav > *[disabled]{
	pointer-events: none;
	--tw-border-opacity: 0;
	background-color: hsl(var(--n) / var(--tw-bg-opacity));
	--tw-bg-opacity: 0.1;
	color: hsl(var(--bc) / var(--tw-text-opacity));
	--tw-text-opacity: 0.2;
}

.btm-nav > * .label{
	font-size: 1rem;
	line-height: 1.5rem;
}

.btn:active:hover,
  .btn:active:focus{
	animation: button-pop 0s ease-out;
	transform: scale(var(--btn-focus-scale, 0.97));
}

.btn:focus-visible{
	outline-style: solid;
	outline-width: 2px;
	outline-offset: 2px;
}

.btn-primary{
	--tw-border-opacity: 1;
	border-color: hsl(var(--p) / var(--tw-border-opacity));
	--tw-bg-opacity: 1;
	background-color: hsl(var(--p) / var(--tw-bg-opacity));
	--tw-text-opacity: 1;
	color: hsl(var(--pc) / var(--tw-text-opacity));
	outline-color: hsl(var(--p) / 1);
}

.btn-primary.btn-active{
	--tw-border-opacity: 1;
	border-color: hsl(var(--pf) / var(--tw-border-opacity));
	--tw-bg-opacity: 1;
	background-color: hsl(var(--pf) / var(--tw-bg-opacity));
}

.btn.glass{
	--tw-shadow: 0 0 #0000;
	--tw-shadow-colored: 0 0 #0000;
	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
	outline-color: currentColor;
}

.btn.glass.btn-active{
	--glass-opacity: 25%;
	--glass-border-opacity: 15%;
}

.btn-ghost{
	border-width: 1px;
	border-color: transparent;
	background-color: transparent;
	color: currentColor;
	--tw-shadow: 0 0 #0000;
	--tw-shadow-colored: 0 0 #0000;
	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
	outline-color: currentColor;
}

.btn-ghost.btn-active{
	--tw-border-opacity: 0;
	background-color: hsl(var(--bc) / var(--tw-bg-opacity));
	--tw-bg-opacity: 0.2;
}

.btn-outline{
	border-color: currentColor;
	background-color: transparent;
	--tw-text-opacity: 1;
	color: hsl(var(--bc) / var(--tw-text-opacity));
	--tw-shadow: 0 0 #0000;
	--tw-shadow-colored: 0 0 #0000;
	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.btn-outline.btn-active{
	--tw-border-opacity: 1;
	border-color: hsl(var(--bc) / var(--tw-border-opacity));
	--tw-bg-opacity: 1;
	background-color: hsl(var(--bc) / var(--tw-bg-opacity));
	--tw-text-opacity: 1;
	color: hsl(var(--b1) / var(--tw-text-opacity));
}

.btn-outline.btn-primary{
	--tw-text-opacity: 1;
	color: hsl(var(--p) / var(--tw-text-opacity));
}

.btn-outline.btn-primary.btn-active{
	--tw-border-opacity: 1;
	border-color: hsl(var(--pf) / var(--tw-border-opacity));
	--tw-bg-opacity: 1;
	background-color: hsl(var(--pf) / var(--tw-bg-opacity));
	--tw-text-opacity: 1;
	color: hsl(var(--pc) / var(--tw-text-opacity));
}

.btn-outline.btn-secondary{
	--tw-text-opacity: 1;
	color: hsl(var(--s) / var(--tw-text-opacity));
}

.btn-outline.btn-secondary.btn-active{
	--tw-border-opacity: 1;
	border-color: hsl(var(--sf) / var(--tw-border-opacity));
	--tw-bg-opacity: 1;
	background-color: hsl(var(--sf) / var(--tw-bg-opacity));
	--tw-text-opacity: 1;
	color: hsl(var(--sc) / var(--tw-text-opacity));
}

.btn-outline.btn-accent{
	--tw-text-opacity: 1;
	color: hsl(var(--a) / var(--tw-text-opacity));
}

.btn-outline.btn-accent.btn-active{
	--tw-border-opacity: 1;
	border-color: hsl(var(--af) / var(--tw-border-opacity));
	--tw-bg-opacity: 1;
	background-color: hsl(var(--af) / var(--tw-bg-opacity));
	--tw-text-opacity: 1;
	color: hsl(var(--ac) / var(--tw-text-opacity));
}

.btn-outline.btn-success{
	--tw-text-opacity: 1;
	color: hsl(var(--su) / var(--tw-text-opacity));
}

.btn-outline.btn-success.btn-active{
	--tw-border-opacity: 1;
	border-color: hsl(var(--su) / var(--tw-border-opacity));
	--tw-bg-opacity: 1;
	background-color: hsl(var(--su) / var(--tw-bg-opacity));
	--tw-text-opacity: 1;
	color: hsl(var(--suc) / var(--tw-text-opacity));
}

.btn-outline.btn-info{
	--tw-text-opacity: 1;
	color: hsl(var(--in) / var(--tw-text-opacity));
}

.btn-outline.btn-info.btn-active{
	--tw-border-opacity: 1;
	border-color: hsl(var(--in) / var(--tw-border-opacity));
	--tw-bg-opacity: 1;
	background-color: hsl(var(--in) / var(--tw-bg-opacity));
	--tw-text-opacity: 1;
	color: hsl(var(--inc) / var(--tw-text-opacity));
}

.btn-outline.btn-warning{
	--tw-text-opacity: 1;
	color: hsl(var(--wa) / var(--tw-text-opacity));
}

.btn-outline.btn-warning.btn-active{
	--tw-border-opacity: 1;
	border-color: hsl(var(--wa) / var(--tw-border-opacity));
	--tw-bg-opacity: 1;
	background-color: hsl(var(--wa) / var(--tw-bg-opacity));
	--tw-text-opacity: 1;
	color: hsl(var(--wac) / var(--tw-text-opacity));
}

.btn-outline.btn-error{
	--tw-text-opacity: 1;
	color: hsl(var(--er) / var(--tw-text-opacity));
}

.btn-outline.btn-error.btn-active{
	--tw-border-opacity: 1;
	border-color: hsl(var(--er) / var(--tw-border-opacity));
	--tw-bg-opacity: 1;
	background-color: hsl(var(--er) / var(--tw-bg-opacity));
	--tw-text-opacity: 1;
	color: hsl(var(--erc) / var(--tw-text-opacity));
}

.btn.btn-disabled,
  .btn[disabled],
  .btn:disabled{
	--tw-border-opacity: 0;
	background-color: hsl(var(--n) / var(--tw-bg-opacity));
	--tw-bg-opacity: 0.2;
	color: hsl(var(--bc) / var(--tw-text-opacity));
	--tw-text-opacity: 0.2;
}

.btn-group > input[type="radio"]:checked.btn,
  .btn-group > .btn-active{
	--tw-border-opacity: 1;
	border-color: hsl(var(--p) / var(--tw-border-opacity));
	--tw-bg-opacity: 1;
	background-color: hsl(var(--p) / var(--tw-bg-opacity));
	--tw-text-opacity: 1;
	color: hsl(var(--pc) / var(--tw-text-opacity));
}

.btn-group > input[type="radio"]:checked.btn:focus-visible, .btn-group > .btn-active:focus-visible{
	outline-style: solid;
	outline-width: 2px;
	outline-color: hsl(var(--p) / 1);
}

.btn:is(input[type="checkbox"]:checked),
.btn:is(input[type="radio"]:checked){
	--tw-border-opacity: 1;
	border-color: hsl(var(--p) / var(--tw-border-opacity));
	--tw-bg-opacity: 1;
	background-color: hsl(var(--p) / var(--tw-bg-opacity));
	--tw-text-opacity: 1;
	color: hsl(var(--pc) / var(--tw-text-opacity));
}

.btn:is(input[type="checkbox"]:checked):focus-visible, .btn:is(input[type="radio"]:checked):focus-visible{
	outline-color: hsl(var(--p) / 1);
}

@keyframes button-pop{

	0%{
		transform: scale(var(--btn-focus-scale, 0.98));
	}

	40%{
		transform: scale(1.02);
	}

	100%{
		transform: scale(1);
	}
}

.checkbox:focus-visible{
	outline-style: solid;
	outline-width: 2px;
	outline-offset: 2px;
	outline-color: hsl(var(--bc) / 1);
}

.checkbox:checked,
  .checkbox[checked="true"],
  .checkbox[aria-checked="true"]{
	--tw-bg-opacity: 1;
	background-color: hsl(var(--bc) / var(--tw-bg-opacity));
	background-repeat: no-repeat;
	animation: checkmark var(--animation-input, 0.2s) ease-out;
	background-image: linear-gradient(-45deg, transparent 65%, hsl(var(--chkbg)) 65.99%),
      linear-gradient(45deg, transparent 75%, hsl(var(--chkbg)) 75.99%),
      linear-gradient(-45deg, hsl(var(--chkbg)) 40%, transparent 40.99%),
      linear-gradient(
        45deg,
        hsl(var(--chkbg)) 30%,
        hsl(var(--chkfg)) 30.99%,
        hsl(var(--chkfg)) 40%,
        transparent 40.99%
      ),
      linear-gradient(-45deg, hsl(var(--chkfg)) 50%, hsl(var(--chkbg)) 50.99%);
}

.checkbox:indeterminate{
	--tw-bg-opacity: 1;
	background-color: hsl(var(--bc) / var(--tw-bg-opacity));
	background-repeat: no-repeat;
	animation: checkmark var(--animation-input, 0.2s) ease-out;
	background-image: linear-gradient(90deg, transparent 80%, hsl(var(--chkbg)) 80%),
      linear-gradient(-90deg, transparent 80%, hsl(var(--chkbg)) 80%),
      linear-gradient(
        0deg,
        hsl(var(--chkbg)) 43%,
        hsl(var(--chkfg)) 43%,
        hsl(var(--chkfg)) 57%,
        hsl(var(--chkbg)) 57%
      );
}

.checkbox-primary{
	--chkbg: var(--p);
	--chkfg: var(--pc);
	--tw-border-opacity: 1;
	border-color: hsl(var(--p) / var(--tw-border-opacity));
}

.checkbox-primary:focus-visible{
	outline-color: hsl(var(--p) / 1);
}

.checkbox-primary:checked,
    .checkbox-primary[checked="true"],
    .checkbox-primary[aria-checked="true"]{
	--tw-border-opacity: 1;
	border-color: hsl(var(--p) / var(--tw-border-opacity));
	--tw-bg-opacity: 1;
	background-color: hsl(var(--p) / var(--tw-bg-opacity));
	--tw-text-opacity: 1;
	color: hsl(var(--pc) / var(--tw-text-opacity));
}

.checkbox:disabled{
	cursor: not-allowed;
	border-color: transparent;
	--tw-bg-opacity: 1;
	background-color: hsl(var(--bc) / var(--tw-bg-opacity));
	opacity: 0.2;
}

@keyframes checkmark{

	0%{
		background-position-y: 5px;
	}

	50%{
		background-position-y: -2px;
	}

	100%{
		background-position-y: 0;
	}
}

[dir="rtl"] .checkbox:checked,
    [dir="rtl"] .checkbox[checked="true"],
    [dir="rtl"] .checkbox[aria-checked="true"]{
	background-image: linear-gradient(45deg, transparent 65%, hsl(var(--chkbg)) 65.99%),
        linear-gradient(-45deg, transparent 75%, hsl(var(--chkbg)) 75.99%),
        linear-gradient(45deg, hsl(var(--chkbg)) 40%, transparent 40.99%),
        linear-gradient(
          -45deg,
          hsl(var(--chkbg)) 30%,
          hsl(var(--chkfg)) 30.99%,
          hsl(var(--chkfg)) 40%,
          transparent 40.99%
        ),
        linear-gradient(45deg, hsl(var(--chkfg)) 50%, hsl(var(--chkbg)) 50.99%);
}

.divider:before{
	background-color: hsl(var(--bc) / var(--tw-bg-opacity));
	--tw-bg-opacity: 0.1;
}

.divider:after{
	background-color: hsl(var(--bc) / var(--tw-bg-opacity));
	--tw-bg-opacity: 0.1;
}

.divider:not(:empty){
	gap: 1rem;
}

.input[list]::-webkit-calendar-picker-indicator{
	line-height: 1em;
}

.input:focus{
	outline-style: solid;
	outline-width: 2px;
	outline-offset: 2px;
	outline-color: hsl(var(--bc) / 0.2);
}

.input-disabled,
  .input:disabled,
  .input[disabled]{
	cursor: not-allowed;
	--tw-border-opacity: 1;
	border-color: hsl(var(--b2) / var(--tw-border-opacity));
	--tw-bg-opacity: 1;
	background-color: hsl(var(--b2) / var(--tw-bg-opacity));
	--tw-text-opacity: 0.2;
}

.input-disabled::-moz-placeholder, .input:disabled::-moz-placeholder, .input[disabled]::-moz-placeholder{
	color: hsl(var(--bc) / var(--tw-placeholder-opacity));
	--tw-placeholder-opacity: 0.2;
}

.input-disabled::placeholder,
  .input:disabled::placeholder,
  .input[disabled]::placeholder{
	color: hsl(var(--bc) / var(--tw-placeholder-opacity));
	--tw-placeholder-opacity: 0.2;
}

.join > :where(*:not(:first-child)){
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: -1px;
}

.link:focus{
	outline: 2px solid transparent;
	outline-offset: 2px;
}

.link:focus-visible{
	outline: 2px solid currentColor;
	outline-offset: 2px;
}

.loading{
	pointer-events: none;
	display: inline-block;
	aspect-ratio: 1 / 1;
	width: 1.5rem;
	background-color: currentColor;
	-webkit-mask-size: 100%;
	        mask-size: 100%;
	-webkit-mask-repeat: no-repeat;
	        mask-repeat: no-repeat;
	-webkit-mask-position: center;
	        mask-position: center;
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg width='24' height='24' stroke='%23000' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cstyle%3E.spinner_V8m1%7Btransform-origin:center;animation:spinner_zKoa 2s linear infinite%7D.spinner_V8m1 circle%7Bstroke-linecap:round;animation:spinner_YpZS 1.5s ease-out infinite%7D%40keyframes spinner_zKoa%7B100%25%7Btransform:rotate(360deg)%7D%7D%40keyframes spinner_YpZS%7B0%25%7Bstroke-dasharray:0 150;stroke-dashoffset:0%7D47.5%25%7Bstroke-dasharray:42 150;stroke-dashoffset:-16%7D95%25%2C100%25%7Bstroke-dasharray:42 150;stroke-dashoffset:-59%7D%7D%3C%2Fstyle%3E%3Cg class='spinner_V8m1'%3E%3Ccircle cx='12' cy='12' r='9.5' fill='none' stroke-width='3'%3E%3C%2Fcircle%3E%3C%2Fg%3E%3C%2Fsvg%3E");
	        mask-image: url("data:image/svg+xml,%3Csvg width='24' height='24' stroke='%23000' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cstyle%3E.spinner_V8m1%7Btransform-origin:center;animation:spinner_zKoa 2s linear infinite%7D.spinner_V8m1 circle%7Bstroke-linecap:round;animation:spinner_YpZS 1.5s ease-out infinite%7D%40keyframes spinner_zKoa%7B100%25%7Btransform:rotate(360deg)%7D%7D%40keyframes spinner_YpZS%7B0%25%7Bstroke-dasharray:0 150;stroke-dashoffset:0%7D47.5%25%7Bstroke-dasharray:42 150;stroke-dashoffset:-16%7D95%25%2C100%25%7Bstroke-dasharray:42 150;stroke-dashoffset:-59%7D%7D%3C%2Fstyle%3E%3Cg class='spinner_V8m1'%3E%3Ccircle cx='12' cy='12' r='9.5' fill='none' stroke-width='3'%3E%3C%2Fcircle%3E%3C%2Fg%3E%3C%2Fsvg%3E");
}

.loading-lg{
	width: 2.5rem;
}

:where(.menu li:empty){
	background-color: hsl(var(--bc) / 0.1);
	margin: 0.5rem 1rem;
	height: 1px;
}

{
	background-color: hsl(var(--bc) / 0.1) !important;
	margin: 0.5rem 1rem !important;
	height: 1px !important;
}

.menu :where(li ul):before{
	position: absolute;
	left: 0px;
	top: 0.75rem;
	bottom: 0.75rem;
	width: 1px;
	background-color: hsl(var(--bc) / 0.1);
	content: "";
}

.\!menu :where(li ul):before{
	position: absolute !important;
	left: 0px !important;
	top: 0.75rem !important;
	bottom: 0.75rem !important;
	width: 1px !important;
	background-color: hsl(var(--bc) / 0.1) !important;
	content: "" !important;
}

.menu :where(li:not(.menu-title) > *:not(ul):not(details):not(.menu-title)),
.menu :where(li:not(.menu-title) > details > summary:not(.menu-title)){
	padding-left: 1rem;
	padding-right: 1rem;
	padding-top: 0.5rem;
	padding-bottom: 0.5rem;
	text-align: left;
	transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
	transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
	transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
	transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
	transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
	transition-duration: 200ms;
	border-radius: var(--rounded-btn, 0.5rem);
	text-wrap: balance;
}

.\!menu :where(li:not(.menu-title) > *:not(ul):not(details):not(.menu-title)),
.\!menu :where(li:not(.menu-title) > details > summary:not(.menu-title)){
	transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !important;
	transition-timing-function: cubic-bezier(0, 0, 0.2, 1) !important;
	padding-left: 1rem !important;
	padding-right: 1rem !important;
	padding-top: 0.5rem !important;
	padding-bottom: 0.5rem !important;
	text-align: left !important;
	transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter !important;
	transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter !important;
	transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter !important;
	transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !important;
	transition-timing-function: cubic-bezier(0, 0, 0.2, 1) !important;
	transition-duration: 200ms !important;
	border-radius: var(--rounded-btn, 0.5rem) !important;
	text-wrap: balance !important;
}

:where(.menu li:not(.menu-title):not(.disabled) > *:not(ul):not(details):not(.menu-title)):not(summary):not(.active).focus,
  :where(.menu li:not(.menu-title):not(.disabled) > *:not(ul):not(details):not(.menu-title)):not(summary):not(.active):focus,
  :where(.menu li:not(.menu-title):not(.disabled) > *:not(ul):not(details):not(.menu-title)):is(summary):not(.active):focus-visible,
  :where(.menu li:not(.menu-title):not(.disabled) > details > summary:not(.menu-title)):not(summary):not(.active).focus,
  :where(.menu li:not(.menu-title):not(.disabled) > details > summary:not(.menu-title)):not(summary):not(.active):focus,
  :where(.menu li:not(.menu-title):not(.disabled) > details > summary:not(.menu-title)):is(summary):not(.active):focus-visible{
	cursor: pointer;
	background-color: hsl(var(--bc) / 0.1);
	--tw-text-opacity: 1;
	color: hsl(var(--bc) / var(--tw-text-opacity));
	outline: 2px solid transparent;
	outline-offset: 2px;
}

{
	cursor: pointer !important;
	background-color: hsl(var(--bc) / 0.1) !important;
	--tw-text-opacity: 1 !important;
	color: hsl(var(--bc) / var(--tw-text-opacity)) !important;
	outline: 2px solid transparent !important;
	outline-offset: 2px !important;
}

.menu li > *:not(ul):not(.menu-title):not(details):active,
.menu li > *:not(ul):not(.menu-title):not(details).active,
.menu li > details > summary:active{
	--tw-bg-opacity: 1;
	background-color: hsl(var(--n) / var(--tw-bg-opacity));
	--tw-text-opacity: 1;
	color: hsl(var(--nc) / var(--tw-text-opacity));
}

.\!menu li > *:not(ul):not(.menu-title):not(details):active,
.\!menu li > *:not(ul):not(.menu-title):not(details).active,
.\!menu li > details > summary:active{
	--tw-bg-opacity: 1 !important;
	background-color: hsl(var(--n) / var(--tw-bg-opacity)) !important;
	--tw-text-opacity: 1 !important;
	color: hsl(var(--nc) / var(--tw-text-opacity)) !important;
}

.menu :where(li > details > summary)::-webkit-details-marker{
	display: none;
}

.\!menu :where(li > details > summary)::-webkit-details-marker{
	display: none !important;
}

.menu :where(li > details > summary):after,
.menu :where(li > .menu-dropdown-toggle):after{
	justify-self: end;
	display: block;
	margin-top: -0.5rem;
	height: 0.5rem;
	width: 0.5rem;
	transform: rotate(45deg);
	transition-property: transform, margin-top;
	transition-duration: 0.3s;
	transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
	content: "";
	transform-origin: 75% 75%;
	box-shadow: 2px 2px;
	pointer-events: none;
}

.\!menu :where(li > details > summary):after,
.\!menu :where(li > .menu-dropdown-toggle):after{
	justify-self: end !important;
	display: block !important;
	margin-top: -0.5rem !important;
	height: 0.5rem !important;
	width: 0.5rem !important;
	transform: rotate(45deg) !important;
	transition-property: transform, margin-top !important;
	transition-duration: 0.3s !important;
	transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !important;
	content: "" !important;
	transform-origin: 75% 75% !important;
	box-shadow: 2px 2px !important;
	pointer-events: none !important;
}

.menu :where(li > details[open] > summary):after,
.menu :where(li > .menu-dropdown-toggle.menu-dropdown-show):after{
	transform: rotate(225deg);
	margin-top: 0;
}

.\!menu :where(li > details[open] > summary):after,
.\!menu :where(li > .menu-dropdown-toggle.menu-dropdown-show):after{
	transform: rotate(225deg) !important;
	margin-top: 0 !important;
}

.mockup-phone .display{
	overflow: hidden;
	border-radius: 40px;
	margin-top: -25px;
}

.mockup-browser .mockup-browser-toolbar .input{
	position: relative;
	margin-left: auto;
	margin-right: auto;
	display: block;
	height: 1.75rem;
	width: 24rem;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	--tw-bg-opacity: 1;
	background-color: hsl(var(--b2) / var(--tw-bg-opacity));
	padding-left: 2rem;
}

.mockup-browser .mockup-browser-toolbar .input:before{
	content: "";
	position: absolute;
	top: 50%;
	left: 0.5rem;
	aspect-ratio: 1 / 1;
	height: 0.75rem;
	--tw-translate-y: -50%;
	transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
	border-radius: 9999px;
	border-width: 2px;
	border-color: currentColor;
	opacity: 0.6;
}

.mockup-browser .mockup-browser-toolbar .input:after{
	content: "";
	position: absolute;
	top: 50%;
	left: 1.25rem;
	height: 0.5rem;
	--tw-translate-y: 25%;
	--tw-rotate: -45deg;
	transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
	border-radius: 9999px;
	border-width: 1px;
	border-color: currentColor;
	opacity: 0.6;
}

.modal:not(dialog:not(.modal-open)),
  .modal::backdrop{
	background-color: rgba(0, 0, 0, 0.3);
	animation: modal-pop 0.2s ease-out;
}

.modal-open .modal-box,
.modal-toggle:checked + .modal .modal-box,
.modal:target .modal-box,
.modal[open] .modal-box{
	--tw-translate-y: 0px;
	--tw-scale-x: 1;
	--tw-scale-y: 1;
	transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

@keyframes modal-pop{

	0%{
		opacity: 0;
	}
}

@keyframes progress-loading{

	50%{
		background-position-x: -115%;
	}
}

@keyframes radiomark{

	0%{
		box-shadow: 0 0 0 12px hsl(var(--b1)) inset, 0 0 0 12px hsl(var(--b1)) inset;
	}

	50%{
		box-shadow: 0 0 0 3px hsl(var(--b1)) inset, 0 0 0 3px hsl(var(--b1)) inset;
	}

	100%{
		box-shadow: 0 0 0 4px hsl(var(--b1)) inset, 0 0 0 4px hsl(var(--b1)) inset;
	}
}

@keyframes rating-pop{

	0%{
		transform: translateY(-0.125em);
	}

	40%{
		transform: translateY(-0.125em);
	}

	100%{
		transform: translateY(0);
	}
}

.select:focus{
	outline-style: solid;
	outline-width: 2px;
	outline-offset: 2px;
	outline-color: hsl(var(--bc) / 0.2);
}

.select-disabled,
  .select:disabled,
  .select[disabled]{
	cursor: not-allowed;
	--tw-border-opacity: 1;
	border-color: hsl(var(--b2) / var(--tw-border-opacity));
	--tw-bg-opacity: 1;
	background-color: hsl(var(--b2) / var(--tw-bg-opacity));
	--tw-text-opacity: 0.2;
}

.select-disabled::-moz-placeholder, .select:disabled::-moz-placeholder, .select[disabled]::-moz-placeholder{
	color: hsl(var(--bc) / var(--tw-placeholder-opacity));
	--tw-placeholder-opacity: 0.2;
}

.select-disabled::placeholder,
  .select:disabled::placeholder,
  .select[disabled]::placeholder{
	color: hsl(var(--bc) / var(--tw-placeholder-opacity));
	--tw-placeholder-opacity: 0.2;
}

.select-multiple,
  .select[multiple],
  .select[size].select:not([size="1"]){
	background-image: none;
	padding-right: 1rem;
}

[dir="rtl"] .select{
	background-position: calc(0% + 12px) calc(1px + 50%), calc(0% + 16px) calc(1px + 50%);
}

.steps .step:before{
	top: 0px;
	grid-column-start: 1;
	grid-row-start: 1;
	height: 0.5rem;
	width: 100%;
	transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
	--tw-bg-opacity: 1;
	background-color: hsl(var(--b3) / var(--tw-bg-opacity));
	--tw-text-opacity: 1;
	color: hsl(var(--bc) / var(--tw-text-opacity));
	content: "";
	margin-left: -100%;
}

.steps .step:after{
	content: counter(step);
	counter-increment: step;
	z-index: 1;
	position: relative;
	grid-column-start: 1;
	grid-row-start: 1;
	display: grid;
	height: 2rem;
	width: 2rem;
	place-items: center;
	place-self: center;
	border-radius: 9999px;
	--tw-bg-opacity: 1;
	background-color: hsl(var(--b3) / var(--tw-bg-opacity));
	--tw-text-opacity: 1;
	color: hsl(var(--bc) / var(--tw-text-opacity));
}

.steps .step:first-child:before{
	content: none;
}

.steps .step[data-content]:after{
	content: attr(data-content);
}

.table :where(th, td){
	padding-left: 1rem;
	padding-right: 1rem;
	padding-top: 0.75rem;
	padding-bottom: 0.75rem;
	vertical-align: middle;
}

.table tr.active,
  .table tr.active:nth-child(even),
  .table-zebra tbody tr:nth-child(even){
	--tw-bg-opacity: 1;
	background-color: hsl(var(--b2) / var(--tw-bg-opacity));
}

.table :where(thead, tbody) :where(tr:not(:last-child)),
    .table :where(thead, tbody) :where(tr:first-child:last-child){
	border-bottom-width: 1px;
	--tw-border-opacity: 1;
	border-bottom-color: hsl(var(--b2) / var(--tw-border-opacity));
}

.table :where(thead, tfoot){
	white-space: nowrap;
	font-size: 0.75rem;
	line-height: 1rem;
	font-weight: 700;
	color: hsl(var(--bc) / 0.6);
}

.textarea:focus{
	outline-style: solid;
	outline-width: 2px;
	outline-offset: 2px;
	outline-color: hsl(var(--bc) / 0.2);
}

.textarea-disabled,
  .textarea:disabled,
  .textarea[disabled]{
	cursor: not-allowed;
	--tw-border-opacity: 1;
	border-color: hsl(var(--b2) / var(--tw-border-opacity));
	--tw-bg-opacity: 1;
	background-color: hsl(var(--b2) / var(--tw-bg-opacity));
	--tw-text-opacity: 0.2;
}

.textarea-disabled::-moz-placeholder, .textarea:disabled::-moz-placeholder, .textarea[disabled]::-moz-placeholder{
	color: hsl(var(--bc) / var(--tw-placeholder-opacity));
	--tw-placeholder-opacity: 0.2;
}

.textarea-disabled::placeholder,
  .textarea:disabled::placeholder,
  .textarea[disabled]::placeholder{
	color: hsl(var(--bc) / var(--tw-placeholder-opacity));
	--tw-placeholder-opacity: 0.2;
}

.toast > *{
	animation: toast-pop 0.25s ease-out;
}

@keyframes toast-pop{

	0%{
		transform: scale(0.9);
		opacity: 0;
	}

	100%{
		transform: scale(1);
		opacity: 1;
	}
}

[dir="rtl"] .toggle{
	--handleoffsetcalculator: calc(var(--handleoffset) * 1);
}

.toggle:focus-visible{
	outline-style: solid;
	outline-width: 2px;
	outline-offset: 2px;
	outline-color: hsl(var(--bc) / 0.2);
}

.toggle:checked,
  .toggle[checked="true"],
  .toggle[aria-checked="true"]{
	--handleoffsetcalculator: var(--handleoffset);
	--tw-border-opacity: 1;
	--tw-bg-opacity: 1;
}

[dir="rtl"] .toggle:checked, [dir="rtl"] .toggle[checked="true"], [dir="rtl"] .toggle[aria-checked="true"]{
	--handleoffsetcalculator: calc(var(--handleoffset) * -1);
}

.toggle:indeterminate{
	--tw-border-opacity: 1;
	--tw-bg-opacity: 1;
	box-shadow: calc(var(--handleoffset) / 2) 0 0 2px var(--tglbg) inset,
      calc(var(--handleoffset) / -2) 0 0 2px var(--tglbg) inset, 0 0 0 2px var(--tglbg) inset;
}

[dir="rtl"] .toggle:indeterminate{
	box-shadow: calc(var(--handleoffset) / 2) 0 0 2px var(--tglbg) inset,
        calc(var(--handleoffset) / -2) 0 0 2px var(--tglbg) inset, 0 0 0 2px var(--tglbg) inset;
}

.toggle-primary:focus-visible{
	outline-color: hsl(var(--p) / 1);
}

.toggle-primary:checked,
    .toggle-primary[checked="true"],
    .toggle-primary[aria-checked="true"]{
	border-color: hsl(var(--p) / var(--tw-border-opacity));
	--tw-border-opacity: 0.1;
	--tw-bg-opacity: 1;
	background-color: hsl(var(--p) / var(--tw-bg-opacity));
	--tw-text-opacity: 1;
	color: hsl(var(--pc) / var(--tw-text-opacity));
}

.toggle:disabled{
	cursor: not-allowed;
	--tw-border-opacity: 1;
	border-color: hsl(var(--bc) / var(--tw-border-opacity));
	background-color: transparent;
	opacity: 0.3;
	--togglehandleborder: 0 0 0 3px hsl(var(--bc)) inset,
      var(--handleoffsetcalculator) 0 0 3px hsl(var(--bc)) inset;
}

.tooltip.tooltip-primary{
	--tooltip-color: hsl(var(--p));
	--tooltip-text-color: hsl(var(--pc));
}

.tooltip.tooltip-secondary{
	--tooltip-color: hsl(var(--s));
	--tooltip-text-color: hsl(var(--sc));
}

.tooltip.tooltip-accent{
	--tooltip-color: hsl(var(--a));
	--tooltip-text-color: hsl(var(--ac));
}

.tooltip.tooltip-info{
	--tooltip-color: hsl(var(--in));
	--tooltip-text-color: hsl(var(--inc));
}

.tooltip.tooltip-success{
	--tooltip-color: hsl(var(--su));
	--tooltip-text-color: hsl(var(--suc));
}

.tooltip.tooltip-warning{
	--tooltip-color: hsl(var(--wa));
	--tooltip-text-color: hsl(var(--wac));
}

.tooltip.tooltip-error{
	--tooltip-color: hsl(var(--er));
	--tooltip-text-color: hsl(var(--erc));
}

.artboard.phone{
	width: 320px;
}

.btn-sm{
	height: 2rem;
	padding-left: 0.75rem;
	padding-right: 0.75rem;
	min-height: 2rem;
	font-size: 0.875rem;
}

.btn-square:where(.btn-xs){
	height: 1.5rem;
	width: 1.5rem;
	padding: 0px;
}

.btn-square:where(.btn-sm){
	height: 2rem;
	width: 2rem;
	padding: 0px;
}

.btn-square:where(.btn-md){
	height: 3rem;
	width: 3rem;
	padding: 0px;
}

.btn-square:where(.btn-lg){
	height: 4rem;
	width: 4rem;
	padding: 0px;
}

.btn-circle:where(.btn-xs){
	height: 1.5rem;
	width: 1.5rem;
	border-radius: 9999px;
	padding: 0px;
}

.btn-circle:where(.btn-sm){
	height: 2rem;
	width: 2rem;
	border-radius: 9999px;
	padding: 0px;
}

.btn-circle:where(.btn-md){
	height: 3rem;
	width: 3rem;
	border-radius: 9999px;
	padding: 0px;
}

.btn-circle:where(.btn-lg){
	height: 4rem;
	width: 4rem;
	border-radius: 9999px;
	padding: 0px;
}

.input-md{
	height: 3rem;
	padding-left: 1rem;
	padding-right: 1rem;
	font-size: 0.875rem;
	line-height: 1.25rem;
	line-height: 2;
}

.join.join-vertical{
	flex-direction: column;
}

.join.join-vertical .join-item:first-child:not(:last-child),
  .join.join-vertical *:first-child:not(:last-child) .join-item{
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
	border-top-left-radius: inherit;
	border-top-right-radius: inherit;
}

.join.join-vertical .join-item:last-child:not(:first-child),
  .join.join-vertical *:last-child:not(:first-child) .join-item{
	border-top-left-radius: 0;
	border-top-right-radius: 0;
	border-bottom-left-radius: inherit;
	border-bottom-right-radius: inherit;
}

.join.join-horizontal{
	flex-direction: row;
}

.join.join-horizontal .join-item:first-child:not(:last-child),
  .join.join-horizontal *:first-child:not(:last-child) .join-item{
	border-bottom-right-radius: 0;
	border-top-right-radius: 0;
	border-bottom-left-radius: inherit;
	border-top-left-radius: inherit;
}

.join.join-horizontal .join-item:last-child:not(:first-child),
  .join.join-horizontal *:last-child:not(:first-child) .join-item{
	border-bottom-left-radius: 0;
	border-top-left-radius: 0;
	border-bottom-right-radius: inherit;
	border-top-right-radius: inherit;
}

.steps-horizontal .step{
	display: grid;
	grid-template-columns: repeat(1, minmax(0, 1fr));
	grid-template-rows: repeat(2, minmax(0, 1fr));
	place-items: center;
	text-align: center;
}

.steps-vertical .step{
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	grid-template-rows: repeat(1, minmax(0, 1fr));
}

:where(.toast){
	right: 0px;
	left: auto;
	top: auto;
	bottom: 0px;
	--tw-translate-x: 0px;
	--tw-translate-y: 0px;
	transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.toast:where(.toast-start){
	right: auto;
	left: 0px;
	--tw-translate-x: 0px;
	transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.toast:where(.toast-center){
	right: 50%;
	left: 50%;
	--tw-translate-x: -50%;
	transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.toast:where(.toast-end){
	right: 0px;
	left: auto;
	--tw-translate-x: 0px;
	transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.toast:where(.toast-bottom){
	top: auto;
	bottom: 0px;
	--tw-translate-y: 0px;
	transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.toast:where(.toast-middle){
	top: 50%;
	bottom: auto;
	--tw-translate-y: -50%;
	transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.toast:where(.toast-top){
	top: 0px;
	bottom: auto;
	--tw-translate-y: 0px;
	transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.tooltip{
	position: relative;
	display: inline-block;
	--tooltip-offset: calc(100% + 1px + var(--tooltip-tail, 0px));
}

.tooltip:before{
	position: absolute;
	pointer-events: none;
	z-index: 1;
	content: var(--tw-content);
	--tw-content: attr(data-tip);
}

.tooltip:before, .tooltip-top:before{
	transform: translateX(-50%);
	top: auto;
	left: 50%;
	right: auto;
	bottom: var(--tooltip-offset);
}

.tooltip-bottom:before{
	transform: translateX(-50%);
	top: var(--tooltip-offset);
	left: 50%;
	right: auto;
	bottom: auto;
}

.avatar.online:before{
	content: "";
	position: absolute;
	z-index: 10;
	display: block;
	border-radius: 9999px;
	--tw-bg-opacity: 1;
	background-color: hsl(var(--su) / var(--tw-bg-opacity));
	outline-style: solid;
	outline-width: 2px;
	outline-color: hsl(var(--b1) / 1);
	width: 15%;
	height: 15%;
	top: 7%;
	right: 7%;
}

.avatar.offline:before{
	content: "";
	position: absolute;
	z-index: 10;
	display: block;
	border-radius: 9999px;
	--tw-bg-opacity: 1;
	background-color: hsl(var(--b3) / var(--tw-bg-opacity));
	outline-style: solid;
	outline-width: 2px;
	outline-color: hsl(var(--b1) / 1);
	width: 15%;
	height: 15%;
	top: 7%;
	right: 7%;
}

.btn-group .btn:not(:first-child):not(:last-child){
	border-top-left-radius: 0;
	border-top-right-radius: 0;
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
}

.btn-group .btn:first-child:not(:last-child){
	margin-top: -0px;
	margin-left: -1px;
	border-top-left-radius: var(--rounded-btn, 0.5rem);
	border-top-right-radius: 0;
	border-bottom-left-radius: var(--rounded-btn, 0.5rem);
	border-bottom-right-radius: 0;
}

.btn-group .btn:last-child:not(:first-child){
	border-top-left-radius: 0;
	border-top-right-radius: var(--rounded-btn, 0.5rem);
	border-bottom-left-radius: 0;
	border-bottom-right-radius: var(--rounded-btn, 0.5rem);
}

.btn-group-horizontal .btn:not(:first-child):not(:last-child){
	border-top-left-radius: 0;
	border-top-right-radius: 0;
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
}

.btn-group-horizontal .btn:first-child:not(:last-child){
	margin-top: -0px;
	margin-left: -1px;
	border-top-left-radius: var(--rounded-btn, 0.5rem);
	border-top-right-radius: 0;
	border-bottom-left-radius: var(--rounded-btn, 0.5rem);
	border-bottom-right-radius: 0;
}

.btn-group-horizontal .btn:last-child:not(:first-child){
	border-top-left-radius: 0;
	border-top-right-radius: var(--rounded-btn, 0.5rem);
	border-bottom-left-radius: 0;
	border-bottom-right-radius: var(--rounded-btn, 0.5rem);
}

.btn-group-vertical .btn:first-child:not(:last-child){
	margin-top: -1px;
	margin-left: -0px;
	border-top-left-radius: var(--rounded-btn, 0.5rem);
	border-top-right-radius: var(--rounded-btn, 0.5rem);
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
}

.btn-group-vertical .btn:last-child:not(:first-child){
	border-top-left-radius: 0;
	border-top-right-radius: 0;
	border-bottom-left-radius: var(--rounded-btn, 0.5rem);
	border-bottom-right-radius: var(--rounded-btn, 0.5rem);
}

.join.join-vertical > :where(*:not(:first-child)){
	margin-left: 0px;
	margin-right: 0px;
	margin-top: -1px;
}

.join.join-horizontal > :where(*:not(:first-child)){
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: -1px;
}

.steps-horizontal .step{
	grid-template-rows: 40px 1fr;
	grid-template-columns: auto;
	min-width: 4rem;
}

.steps-horizontal .step:before{
	height: 0.5rem;
	width: 100%;
	--tw-translate-y: 0px;
	--tw-translate-x: 0px;
	transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
	content: "";
	margin-left: -100%;
}

.steps-vertical .step{
	gap: 0.5rem;
	grid-template-columns: 40px 1fr;
	grid-template-rows: auto;
	min-height: 4rem;
	justify-items: start;
}

.steps-vertical .step:before{
	height: 100%;
	width: 0.5rem;
	--tw-translate-y: -50%;
	--tw-translate-x: -50%;
	transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
	margin-left: 50%;
}

[dir="rtl"] .steps-vertical .step:before{
	margin-right: auto;
}

.tooltip{
	position: relative;
	display: inline-block;
	text-align: center;
	--tooltip-tail: 0.1875rem;
	--tooltip-color: hsl(var(--n));
	--tooltip-text-color: hsl(var(--nc));
	--tooltip-tail-offset: calc(100% + 0.0625rem - var(--tooltip-tail));
}

.tooltip:before,
.tooltip:after{
	opacity: 0;
	transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
	transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
	transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
	transition-delay: 100ms;
	transition-duration: 200ms;
	transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

.tooltip:after{
	position: absolute;
	content: "";
	border-style: solid;
	border-width: var(--tooltip-tail, 0);
	width: 0;
	height: 0;
	display: block;
}

.tooltip:before{
	max-width: 20rem;
	border-radius: 0.25rem;
	padding-left: 0.5rem;
	padding-right: 0.5rem;
	padding-top: 0.25rem;
	padding-bottom: 0.25rem;
	font-size: 0.875rem;
	line-height: 1.25rem;
	background-color: var(--tooltip-color);
	color: var(--tooltip-text-color);
	width: -moz-max-content;
	width: max-content;
}

.tooltip.tooltip-open:before,
.tooltip.tooltip-open:after,
.tooltip:hover:before,
.tooltip:hover:after{
	opacity: 1;
	transition-delay: 75ms;
}

.tooltip:has(:focus-visible):after,
.tooltip:has(:focus-visible):before{
	opacity: 1;
	transition-delay: 75ms;
}

.tooltip:not([data-tip]):hover:before,
.tooltip:not([data-tip]):hover:after{
	visibility: hidden;
	opacity: 0;
}

.tooltip:after, .tooltip-top:after{
	transform: translateX(-50%);
	border-color: var(--tooltip-color) transparent transparent transparent;
	top: auto;
	left: 50%;
	right: auto;
	bottom: var(--tooltip-tail-offset);
}

.tooltip-bottom:after{
	transform: translateX(-50%);
	border-color: transparent transparent var(--tooltip-color) transparent;
	top: var(--tooltip-tail-offset);
	left: 50%;
	right: auto;
	bottom: auto;
}

.visible{
	visibility: visible;
}

.\!visible{
	visibility: visible !important;
}

.invisible{
	visibility: hidden;
}

.\!static{
	position: static !important;
}

.fixed{
	position: fixed;
}

.absolute{
	position: absolute;
}

.relative{
	position: relative;
}

.bottom-0{
	bottom: 0px;
}

.right-0{
	right: 0px;
}

.left-0{
	left: 0px;
}

.top-1\/2{
	top: 50%;
}

.top-0{
	top: 0px;
}

.top-4{
	top: 1rem;
}

.left-4{
	left: 1rem;
}

.right-4{
	right: 1rem;
}

.right-1{
	right: 0.25rem;
}

.top-1{
	top: 0.25rem;
}

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

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

.z-\[9999\]{
	z-index: 9999;
}

.m-1{
	margin: 0.25rem;
}

.my-8{
	margin-top: 2rem;
	margin-bottom: 2rem;
}

.mb-2{
	margin-bottom: 0.5rem;
}

.ml-4{
	margin-left: 1rem;
}

.mt-1{
	margin-top: 0.25rem;
}

.mr-1{
	margin-right: 0.25rem;
}

.mt-16{
	margin-top: 4rem;
}

.mt-24{
	margin-top: 6rem;
}

.mt-4{
	margin-top: 1rem;
}

.mt-2{
	margin-top: 0.5rem;
}

.mr-2{
	margin-right: 0.5rem;
}

.mb-4{
	margin-bottom: 1rem;
}

.mr-3{
	margin-right: 0.75rem;
}

.mb-1{
	margin-bottom: 0.25rem;
}

.block{
	display: block;
}

.flex{
	display: flex;
}

.table{
	display: table;
}

.contents{
	display: contents;
}

.hidden{
	display: none;
}

.h-screen{
	height: 100vh;
}

.h-28{
	height: 7rem;
}

.h-\[58px\]{
	height: 58px;
}

.h-full{
	height: 100%;
}

.h-14{
	height: 3.5rem;
}

.h-16{
	height: 4rem;
}

.h-24{
	height: 6rem;
}

.h-\[44px\]{
	height: 44px;
}

.h-\[8rem\]{
	height: 8rem;
}

.h-4{
	height: 1rem;
}

.h-1{
	height: 0.25rem;
}

.h-5{
	height: 1.25rem;
}

.h-12{
	height: 3rem;
}

.h-6{
	height: 1.5rem;
}

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

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

.w-screen{
	width: 100vw;
}

.w-28{
	width: 7rem;
}

.w-full{
	width: 100%;
}

.w-\[120px\]{
	width: 120px;
}

.w-6\/12{
	width: 50%;
}

.w-36{
	width: 9rem;
}

.\!w-48{
	width: 12rem !important;
}

.w-4{
	width: 1rem;
}

.w-\[150px\]{
	width: 150px;
}

.w-5{
	width: 1.25rem;
}

.w-\[20rem\]{
	width: 20rem;
}

.w-8{
	width: 2rem;
}

.w-12{
	width: 3rem;
}

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

.w-\[25\%\]{
	width: 25%;
}

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

.max-w-md{
	max-width: 28rem;
}

.max-w-xs{
	max-width: 20rem;
}

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

.\!max-w-\[326px\]{
	max-width: 326px !important;
}

.flex-1{
	flex: 1 1 0%;
}

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

.grow{
	flex-grow: 1;
}

.-translate-y-1\/2{
	--tw-translate-y: -50%;
	transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

@keyframes spin{

	to{
		transform: rotate(360deg);
	}
}

.animate-spin{
	animation: spin 1s linear infinite;
}

.cursor-pointer{
	cursor: pointer;
}

.cursor-default{
	cursor: default;
}

.list-inside{
	list-style-position: inside;
}

.list-disc{
	list-style-type: disc;
}

.appearance-none{
	-webkit-appearance: none;
	   -moz-appearance: none;
	        appearance: none;
}

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

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

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

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

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

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

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

.gap-2{
	gap: 0.5rem;
}

.gap-4{
	gap: 1rem;
}

.gap-1{
	gap: 0.25rem;
}

.gap-x-2{
	-moz-column-gap: 0.5rem;
	     column-gap: 0.5rem;
}

.overflow-auto{
	overflow: auto;
}

.\!overflow-hidden{
	overflow: hidden !important;
}

.\!overflow-visible{
	overflow: visible !important;
}

.overscroll-none{
	overscroll-behavior: none;
}

.overflow-ellipsis{
	text-overflow: ellipsis;
}

.rounded-full{
	border-radius: 9999px;
}

.rounded-md{
	border-radius: 0.375rem;
}

.rounded{
	border-radius: 0.25rem;
}

.rounded-lg{
	border-radius: 0.5rem;
}

.\!rounded-lg{
	border-radius: 0.5rem !important;
}

.rounded-xl{
	border-radius: 0.75rem;
}

.\!rounded-none{
	border-radius: 0px !important;
}

.rounded-br-md{
	border-bottom-right-radius: 0.375rem;
}

.rounded-tr-md{
	border-top-right-radius: 0.375rem;
}

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

.border{
	border-width: 1px;
}

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

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

.\!border-t-0{
	border-top-width: 0px !important;
}

.\!border-l-0{
	border-left-width: 0px !important;
}

.\!border-r-0{
	border-right-width: 0px !important;
}

.\!border-b-2{
	border-bottom-width: 2px !important;
}

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

.\!border-none{
	border-style: none !important;
}

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

.border-white{
	--tw-border-opacity: 1;
	border-color: rgb(255 255 255 / var(--tw-border-opacity));
}

.border-surface-container-highest{
	--tw-border-opacity: 1;
	border-color: rgb(226 226 230 / var(--tw-border-opacity));
}

.border-transparent{
	border-color: transparent;
}

.border-primary{
	--tw-border-opacity: 1;
	border-color: rgb(33 150 243 / var(--tw-border-opacity));
}

.border-error{
	--tw-border-opacity: 1;
	border-color: rgb(186 26 26 / var(--tw-border-opacity));
}

.border-outline-variant{
	--tw-border-opacity: 1;
	border-color: rgb(195 199 207 / var(--tw-border-opacity));
}

.border-success-500{
	--tw-border-opacity: 1;
	border-color: rgb(18 183 106 / var(--tw-border-opacity));
}

.\!border-sky-500{
	--tw-border-opacity: 1 !important;
	border-color: rgb(14 165 233 / var(--tw-border-opacity)) !important;
}

.bg-primary{
	--tw-bg-opacity: 1;
	background-color: rgb(33 150 243 / var(--tw-bg-opacity));
}

.bg-outline-variant{
	--tw-bg-opacity: 1;
	background-color: rgb(195 199 207 / var(--tw-bg-opacity));
}

.bg-black\/60{
	background-color: rgb(0 0 0 / 0.60);
}

.bg-white{
	--tw-bg-opacity: 1;
	background-color: rgb(255 255 255 / var(--tw-bg-opacity));
}

.bg-surface-container-lowest{
	--tw-bg-opacity: 1;
	background-color: rgb(255 255 255 / var(--tw-bg-opacity));
}

.bg-surface-container-high{
	--tw-bg-opacity: 1;
	background-color: rgb(232 232 235 / var(--tw-bg-opacity));
}

.bg-surface-container{
	--tw-bg-opacity: 1;
	background-color: rgb(238 237 241 / var(--tw-bg-opacity));
}

.bg-transparent{
	background-color: transparent;
}

.\!bg-surface-container-lowest{
	--tw-bg-opacity: 1 !important;
	background-color: rgb(255 255 255 / var(--tw-bg-opacity)) !important;
}

.bg-surface-bright{
	--tw-bg-opacity: 1;
	background-color: rgb(250 249 252 / var(--tw-bg-opacity));
}

.\!bg-success-500{
	--tw-bg-opacity: 1 !important;
	background-color: rgb(18 183 106 / var(--tw-bg-opacity)) !important;
}

.\!bg-transparent{
	background-color: transparent !important;
}

.\!bg-surface{
	--tw-bg-opacity: 1 !important;
	background-color: rgb(250 249 252 / var(--tw-bg-opacity)) !important;
}

.object-cover{
	-o-object-fit: cover;
	   object-fit: cover;
}

.object-center{
	-o-object-position: center;
	   object-position: center;
}

.p-2{
	padding: 0.5rem;
}

.p-3{
	padding: 0.75rem;
}

.p-4{
	padding: 1rem;
}

.px-6{
	padding-left: 1.5rem;
	padding-right: 1.5rem;
}

.\!py-2{
	padding-top: 0.5rem !important;
	padding-bottom: 0.5rem !important;
}

.py-4{
	padding-top: 1rem;
	padding-bottom: 1rem;
}

.px-3{
	padding-left: 0.75rem;
	padding-right: 0.75rem;
}

.py-8{
	padding-top: 2rem;
	padding-bottom: 2rem;
}

.px-8{
	padding-left: 2rem;
	padding-right: 2rem;
}

.py-2{
	padding-top: 0.5rem;
	padding-bottom: 0.5rem;
}

.px-4{
	padding-left: 1rem;
	padding-right: 1rem;
}

.py-3{
	padding-top: 0.75rem;
	padding-bottom: 0.75rem;
}

.py-5{
	padding-top: 1.25rem;
	padding-bottom: 1.25rem;
}

.px-2{
	padding-left: 0.5rem;
	padding-right: 0.5rem;
}

.px-5{
	padding-left: 1.25rem;
	padding-right: 1.25rem;
}

.\!px-4{
	padding-left: 1rem !important;
	padding-right: 1rem !important;
}

.pl-2{
	padding-left: 0.5rem;
}

.pb-1{
	padding-bottom: 0.25rem;
}

.pt-1{
	padding-top: 0.25rem;
}

.pb-4{
	padding-bottom: 1rem;
}

.pb-3{
	padding-bottom: 0.75rem;
}

.pt-4{
	padding-top: 1rem;
}

.pb-2{
	padding-bottom: 0.5rem;
}

.pl-14{
	padding-left: 3.5rem;
}

.pr-14{
	padding-right: 3.5rem;
}

.pl-4{
	padding-left: 1rem;
}

.pl-\[150px\]{
	padding-left: 150px;
}

.pl-12{
	padding-left: 3rem;
}

.pr-12{
	padding-right: 3rem;
}

.pt-3{
	padding-top: 0.75rem;
}

.pt-8{
	padding-top: 2rem;
}

.pt-2{
	padding-top: 0.5rem;
}

.pt-6{
	padding-top: 1.5rem;
}

.pl-24{
	padding-left: 6rem;
}

.text-left{
	text-align: left;
}

.text-center{
	text-align: center;
}

.text-start{
	text-align: start;
}

.text-end{
	text-align: end;
}

.text-xs{
	font-size: 0.75rem;
	line-height: 1rem;
}

.text-sm{
	font-size: 0.875rem;
	line-height: 1.25rem;
}

.text-base{
	font-size: 1rem;
	line-height: 1.5rem;
}

.text-4xl{
	font-size: 2.25rem;
	line-height: 2.5rem;
}

.\!text-\[34px\]{
	font-size: 34px !important;
}

.\!font-semibold{
	font-weight: 600 !important;
}

.\!font-normal{
	font-weight: 400 !important;
}

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

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

.lowercase{
	text-transform: lowercase;
}

.capitalize{
	text-transform: capitalize;
}

.text-neutral-content{
	--tw-text-opacity: 1;
	color: hsl(var(--nc) / var(--tw-text-opacity));
}

.text-on-surface{
	--tw-text-opacity: 1;
	color: rgb(26 28 30 / var(--tw-text-opacity));
}

.text-surface-container-highest{
	--tw-text-opacity: 1;
	color: rgb(226 226 230 / var(--tw-text-opacity));
}

.text-white{
	--tw-text-opacity: 1;
	color: rgb(255 255 255 / var(--tw-text-opacity));
}

.text-primary{
	--tw-text-opacity: 1;
	color: rgb(33 150 243 / var(--tw-text-opacity));
}

.text-outline{
	--tw-text-opacity: 1;
	color: rgb(115 119 127 / var(--tw-text-opacity));
}

.text-error{
	--tw-text-opacity: 1;
	color: rgb(186 26 26 / var(--tw-text-opacity));
}

.text-dark-low-emp{
	color: #00000099;
}

.text-on-surface-variant{
	--tw-text-opacity: 1;
	color: rgb(67 71 78 / var(--tw-text-opacity));
}

.text-on-primary{
	--tw-text-opacity: 1;
	color: rgb(255 255 255 / var(--tw-text-opacity));
}

.text-black{
	--tw-text-opacity: 1;
	color: rgb(0 0 0 / var(--tw-text-opacity));
}

.text-dark-high-emp{
	color: #000000DE;
}

.text-dark-disable{
	color: #00000061;
}

.text-\[\#405392\]{
	--tw-text-opacity: 1;
	color: rgb(64 83 146 / var(--tw-text-opacity));
}

.text-\[\#43474E\]{
	--tw-text-opacity: 1;
	color: rgb(67 71 78 / var(--tw-text-opacity));
}

.text-success-500{
	--tw-text-opacity: 1;
	color: rgb(18 183 106 / var(--tw-text-opacity));
}

.\!text-primary{
	--tw-text-opacity: 1 !important;
	color: rgb(33 150 243 / var(--tw-text-opacity)) !important;
}

.text-outline-variant{
	--tw-text-opacity: 1;
	color: rgb(195 199 207 / var(--tw-text-opacity));
}

.text-opacity-87{
	--tw-text-opacity: 0.87;
}

.opacity-50{
	opacity: 0.5;
}

.shadow-sm{
	--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
	--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.shadow-md{
	--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
	--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.outline-none{
	outline: 2px solid transparent;
	outline-offset: 2px;
}

.\!outline-none{
	outline: 2px solid transparent !important;
	outline-offset: 2px !important;
}

.outline{
	outline-style: solid;
}

.drop-shadow-md{
	--tw-drop-shadow: drop-shadow(0 4px 3px rgb(0 0 0 / 0.07)) drop-shadow(0 2px 2px rgb(0 0 0 / 0.06));
	filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}

.filter{
	filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}

.transition-all{
	transition-property: all;
	transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
	transition-duration: 150ms;
}

.duration-300{
	transition-duration: 300ms;
}

.line-clamp-1{
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
}

.icon{
	display: flex;
	height: 1.5rem;
	width: 1.5rem;
	align-items: center;
	justify-content: center;
}

.icon-lg{
	display: flex;
	height: 2rem;
	width: 2rem;
	align-items: center;
	justify-content: center;
}

.icon-sm{
	display: flex;
	height: 1rem;
	width: 1rem;
	align-items: center;
	justify-content: center;
}

.text-title{
	font-size: 1rem;
	line-height: 1.5rem;
	font-weight: 600;
	color: rgb(0 0 0 / var(--tw-text-opacity));
	--tw-text-opacity: 0.60;
}

.text-description{
	font-size: 0.875rem;
	line-height: 1.25rem;
	color: rgb(0 0 0 / var(--tw-text-opacity));
	--tw-text-opacity: 0.60;
}

.text-high-emp{
	font-size: 0.875rem;
	line-height: 1.25rem;
	color: rgb(0 0 0 / var(--tw-text-opacity));
	--tw-text-opacity: 0.87;
}

.text-low-emp{
	font-size: 0.875rem;
	line-height: 1.25rem;
	color: rgb(0 0 0 / var(--tw-text-opacity));
	--tw-text-opacity: 0.60;
}

.icon-center{
	display: flex;
	height: 1.5rem;
	width: 1.5rem;
	align-items: center;
	justify-content: center;
}

.high-emp{
	color: rgb(0 0 0 / var(--tw-text-opacity));
	--tw-text-opacity: 0.87;
}

.low-emp{
	color: rgb(0 0 0 / var(--tw-text-opacity));
	--tw-text-opacity: 0.60;
}

.text-title-large{
	font-size: 22px;
}

.text-title-large-prominent{
	font-weight: 700;
	font-size: 22px;
}

.text-title-medium{
	font-size: 20px;
}

.text-title-medium-prominent{
	font-weight: 700;
	font-size: 20px;
}

.text-body-small{
	font-size: 0.875rem;
	line-height: 1.25rem;
}

.text-body-medium{
	font-size: 0.875rem;
	line-height: 1.25rem;
}

.text-body-medium-prominent{
	font-weight: 600;
	font-size: 0.875rem;
	line-height: 1.25rem;
}

.text-body-large{
	font-size: 1rem;
	line-height: 1.5rem;
}

.text-body-large-prominent{
	font-weight: 600;
	font-size: 1rem;
	line-height: 1.5rem;
}

.title{
	color: #00000099;
	font-weight: 600;
	font-size: 1rem;
	line-height: 1.5rem;
}

.default\:\!border-primary:default{
	--tw-border-opacity: 1 !important;
	border-color: rgb(33 150 243 / var(--tw-border-opacity)) !important;
}

.empty\:\!border-outline-variant:empty{
	--tw-border-opacity: 1 !important;
	border-color: rgb(195 199 207 / var(--tw-border-opacity)) !important;
}

.hover\:cursor-pointer:hover{
	cursor: pointer;
}

.hover\:\!border-success-300:hover{
	--tw-border-opacity: 1 !important;
	border-color: rgb(108 233 166 / var(--tw-border-opacity)) !important;
}

.hover\:bg-surface-container-lowest:hover{
	--tw-bg-opacity: 1;
	background-color: rgb(255 255 255 / var(--tw-bg-opacity));
}

.hover\:bg-surface-container-highest:hover{
	--tw-bg-opacity: 1;
	background-color: rgb(226 226 230 / var(--tw-bg-opacity));
}

.hover\:\!bg-success-300:hover{
	--tw-bg-opacity: 1 !important;
	background-color: rgb(108 233 166 / var(--tw-bg-opacity)) !important;
}

.hover\:\!bg-opacity-10:hover{
	--tw-bg-opacity: 0.1 !important;
}

.focus\:\!border-0:focus{
	border-width: 0px !important;
}

.focus\:\!border-primary:focus{
	--tw-border-opacity: 1 !important;
	border-color: rgb(33 150 243 / var(--tw-border-opacity)) !important;
}

.focus\:border-primary:focus{
	--tw-border-opacity: 1;
	border-color: rgb(33 150 243 / var(--tw-border-opacity));
}

.focus\:border-error:focus{
	--tw-border-opacity: 1;
	border-color: rgb(186 26 26 / var(--tw-border-opacity));
}

.focus\:outline-none:focus{
	outline: 2px solid transparent;
	outline-offset: 2px;
}

.focus\:\!ring-0:focus{
	--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important;
	--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color) !important;
	box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000) !important;
}

.focus\:ring-0:focus{
	--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
	--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);
	box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}

.focus\:\!ring-offset-0:focus{
	--tw-ring-offset-width: 0px !important;
}

.disabled\:\!border-surface-container-highest:disabled{
	--tw-border-opacity: 1 !important;
	border-color: rgb(226 226 230 / var(--tw-border-opacity)) !important;
}

.disabled\:\!border-surface-container-high:disabled{
	--tw-border-opacity: 1 !important;
	border-color: rgb(232 232 235 / var(--tw-border-opacity)) !important;
}

.disabled\:\!bg-surface-container-lowest:disabled{
	--tw-bg-opacity: 1 !important;
	background-color: rgb(255 255 255 / var(--tw-bg-opacity)) !important;
}

.disabled\:\!bg-surface-container-high:disabled{
	--tw-bg-opacity: 1 !important;
	background-color: rgb(232 232 235 / var(--tw-bg-opacity)) !important;
}

.disabled\:\!text-surface-container-highest:disabled{
	--tw-text-opacity: 1 !important;
	color: rgb(226 226 230 / var(--tw-text-opacity)) !important;
}

.disabled\:opacity-20:disabled{
	opacity: 0.2;
}

.group:hover .group-hover\:text-gray-400{
	--tw-text-opacity: 1;
	color: rgb(156 163 175 / var(--tw-text-opacity));
}

@media (min-width: 768px){

	.md\:absolute{
		position: absolute;
	}

	.md\:top-0{
		top: 0px;
	}

	.md\:left-auto{
		left: auto;
	}

	.md\:mt-12{
		margin-top: 3rem;
	}

	.md\:mt-48{
		margin-top: 12rem;
	}

	.md\:block{
		display: block;
	}

	.md\:w-36{
		width: 9rem;
	}

	.md\:w-\[30rem\]{
		width: 30rem;
	}

	.md\:-translate-y-0{
		--tw-translate-y: -0px;
		transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
	}

	.md\:px-4{
		padding-left: 1rem;
		padding-right: 1rem;
	}

	.md\:btn-block{
		width: 100%;
	}
}