Showing preview only (811K chars total). Download the full file or copy to clipboard to get everything.
Repository: MiscellaneousStuff/meta-sam-demo
Branch: main
Commit: 89c3c1b61b78
Files: 66
Total size: 782.0 KB
Directory structure:
gitextract_jaanbdff/
├── .eslintignore
├── .eslintrc
├── .gitignore
├── README.md
├── package.json
├── public/
│ ├── assets/
│ │ └── manifest.json
│ ├── index.html
│ ├── interactive_module_quantized_592547_2023_03_19_sam6_long_uncertain.onnx
│ ├── interactive_module_quantized_592547_2023_03_20_sam6_long_all_masks_extra_data_with_ious.onnx
│ ├── manifest.json
│ ├── ort-wasm-simd-threaded.wasm
│ ├── ort-wasm-simd.wasm
│ ├── ort-wasm-threaded.wasm
│ ├── ort-wasm.wasm
│ └── robots.txt
├── src/
│ ├── App.css
│ ├── App.test.tsx
│ ├── App.tsx
│ ├── assets/
│ │ ├── manifest.json
│ │ └── scss/
│ │ └── App.scss
│ ├── components/
│ │ ├── Canvas.tsx
│ │ ├── Content.tsx
│ │ ├── ErrorPage.tsx
│ │ ├── FAQ.tsx
│ │ ├── FeatureSummary.tsx
│ │ ├── FeedbackModal.tsx
│ │ ├── Footer.tsx
│ │ ├── Gallery.tsx
│ │ ├── Hero.tsx
│ │ ├── HomePage.tsx
│ │ ├── ImagePicker.tsx
│ │ ├── LegalText.tsx
│ │ ├── LoadingModal.tsx
│ │ ├── MobileOptionNavBar.tsx
│ │ ├── MobileSegmentDrawer.tsx
│ │ ├── Navbar.tsx
│ │ ├── PointsModal.tsx
│ │ ├── SegmentDrawer.tsx
│ │ ├── SegmentOptions.tsx
│ │ ├── Sparkle.tsx
│ │ ├── Stage.tsx
│ │ ├── SvgMask.tsx
│ │ ├── ToolTip.tsx
│ │ ├── Video.tsx
│ │ ├── helpers/
│ │ │ ├── CanvasHelper.tsx
│ │ │ ├── ImageHelper.tsx
│ │ │ ├── Interface.tsx
│ │ │ ├── colors.tsx
│ │ │ ├── custom_tracer.tsx
│ │ │ ├── getFile.tsx
│ │ │ ├── mask_utils.tsx
│ │ │ ├── metaTheme.tsx
│ │ │ ├── modelAPI.tsx
│ │ │ └── photos.tsx
│ │ └── hooks/
│ │ ├── Animation.tsx
│ │ ├── context.tsx
│ │ └── createContext.tsx
│ ├── index.css
│ ├── index.tsx
│ ├── interactive_module_quantized_592547_2023_03_19_sam6_long_uncertain.onnx
│ ├── interactive_module_quantized_592547_2023_03_20_sam6_long_all_masks_extra_data_with_ious.onnx
│ ├── react-app-env.d.ts
│ ├── reportWebVitals.ts
│ └── setupTests.ts
├── tsconfig.json
└── webpack.config.js
================================================
FILE CONTENTS
================================================
================================================
FILE: .eslintignore
================================================
src/components/Canvas.tsx
src/components/ImagePicker.tsx
src/components/Stage.tsx
*.tsx
================================================
FILE: .eslintrc
================================================
{
"extends": [
"react-app",
"eslint-config-react-app/base"
]
}
================================================
FILE: .gitignore
================================================
# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
lerna-debug.log*
# Diagnostic reports (https://nodejs.org/api/report.html)
report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
# Runtime data
pids
*.pid
*.seed
*.pid.lock
# Directory for instrumented libs generated by jscoverage/JSCover
lib-cov
# Coverage directory used by tools like istanbul
coverage
*.lcov
# nyc test coverage
.nyc_output
# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
.grunt
# Bower dependency directory (https://bower.io/)
bower_components
# node-waf configuration
.lock-wscript
# Compiled binary addons (https://nodejs.org/api/addons.html)
build/Release
# Dependency directories
node_modules/
jspm_packages/
# TypeScript v1 declaration files
typings/
# TypeScript cache
*.tsbuildinfo
# Optional npm cache directory
.npm
# Optional eslint cache
.eslintcache
# Microbundle cache
.rpt2_cache/
.rts2_cache_cjs/
.rts2_cache_es/
.rts2_cache_umd/
# Optional REPL history
.node_repl_history
# Output of 'npm pack'
*.tgz
# Yarn Integrity file
.yarn-integrity
# dotenv environment variables file
.env
.env.test
# parcel-bundler cache (https://parceljs.org/)
.cache
# Next.js build output
.next
# Nuxt.js build / generate output
.nuxt
dist
# Gatsby files
.cache/
# Comment in the public line in if your project uses Gatsby and *not* Next.js
# https://nextjs.org/blog/next-9-1#public-directory-support
# public
# vuepress build output
.vuepress/dist
# Serverless directories
.serverless/
# FuseBox cache
.fusebox/
# DynamoDB Local files
.dynamodb/
# TernJS port file
.tern-port
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
# dependencies
/node_modules
/.pnp
.pnp.js
# testing
/coverage
# production
/build
# misc
.DS_Store
.env.local
.env.development.local
.env.test.local
.env.production.local
npm-debug.log*
yarn-debug.log*
yarn-error.log*
================================================
FILE: README.md
================================================
# Meta's Segment Anything Model (SAM) Demo Site
## About
<!--Image / Video annotation based on Meta's Segment Anything Model (SAM). \-->
This repository is based on their demo website,
[segment-anything.com](https://segment-anything.com).
## Usage
To use this repository, clone it and install the required packages
by doing:
```bash
git clone https://github.com/MiscellaneousStuff/meta-sam-demo
cd meta-sam-demo
npm i
```
Then run it like a regular react app:
```bash
npm run start
```
To actually use the site when it is deployed, navigate to:
`http://localhost:3000/`. By default, the site re-directs to the
demo page, however, all of the original pages are included and you
can uncomment out whatever you want to run.
<!--
## Overview
The demo website uses two quantized models
- Prompt Encoder: `interactive_module_quantized_592547_2023_03_19_sam6_long_uncertain.onnx`
- Mask Decoder: `interactive_module_quantized_592547_2023_03_20_sam6_long_all_masks_extra_data_with_ious.onnx`
-->
# Getting Started with Create React App
This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).
## Available Scripts
In the project directory, you can run:
### `npm start`
Runs the app in the development mode.\
Open [http://localhost:3000](http://localhost:3000) to view it in the browser.
The page will reload if you make edits.\
You will also see any lint errors in the console.
### `npm test`
Launches the test runner in the interactive watch mode.\
See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information.
### `npm run build`
Builds the app for production to the `build` folder.\
It correctly bundles React in production mode and optimizes the build for the best performance.
The build is minified and the filenames include the hashes.\
Your app is ready to be deployed!
See the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information.
### `npm run eject`
**Note: this is a one-way operation. Once you `eject`, you can’t go back!**
If you aren’t satisfied with the build tool and configuration choices, you can `eject` at any time. This command will remove the single build dependency from your project.
Instead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you’re on your own.
You don’t have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn’t feel obligated to use this feature. However we understand that this tool wouldn’t be useful if you couldn’t customize it when you are ready for it.
## Learn More
You can learn more in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started).
To learn React, check out the [React documentation](https://reactjs.org/).
================================================
FILE: package.json
================================================
{
"name": "meta-sam-rip",
"version": "0.1.0",
"private": true,
"dependencies": {
"@remix-run/router": "^1.5.0",
"@testing-library/jest-dom": "^5.16.5",
"@testing-library/react": "^13.4.0",
"@testing-library/user-event": "^13.5.0",
"@types/jest": "^27.5.2",
"@types/node": "^16.18.23",
"@types/react": "^18.0.33",
"@types/react-dom": "^18.0.11",
"attr-accept": "^2.2.2",
"copy-webpack-plugin": "^11.0.0",
"css-loader": "^6.7.3",
"file-selector": "^0.6.0",
"its-fine": "^1.1.0",
"konva": "^8.4.3",
"lz-string": "^1.5.0",
"node-sass": "^8.0.0",
"onnxruntime-common": "^1.14.0",
"onnxruntime-web": "^1.14.0",
"process": "^0.11.10",
"react": "^18.2.0",
"react-cookie": "^4.1.1",
"react-cookie-consent": "^8.0.1",
"react-daisyui": "^3.1.2",
"react-dom": "^18.2.0",
"react-dropzone": "^14.2.3",
"react-ga4": "^2.1.0",
"react-icons": "^4.8.0",
"react-konva": "^18.2.5",
"react-photo-album": "^2.0.3",
"react-reconciler": "^0.29.0",
"react-router-dom": "^6.10.0",
"react-scripts": "5.0.1",
"react-swipeable": "^7.0.0",
"sass": "^1.61.0",
"scheduler": "^0.23.0",
"style-loader": "^3.3.2",
"swipeable": "^1.0.5",
"tslib": "^2.5.0",
"typescript": "^4.9.5",
"underscore": "^1.13.6",
"web-vitals": "^2.1.4"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"@types/underscore": "^1.11.4",
"webpack-cli": "^5.0.1"
}
}
================================================
FILE: public/assets/manifest.json
================================================
{
"icons": [
{
"src": "M_Favicon_16x16.png",
"type": "image/png",
"sizes": "16x16"
},
{
"src": "M_Favicon_32x32.png",
"type": "image/png",
"sizes": "32x32"
},
{
"src": "M_Favicon_192x192.png",
"type": "image/png",
"sizes": "192x192"
},
{
"src": "M_Favicon_512x512.png",
"type": "image/png",
"sizes": "512x512"
}
],
"start_url": ".",
"display": "standalone",
"theme_color": "#000000",
"background_color": "#ffffff"
}
================================================
FILE: public/index.html
================================================
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" />
<meta
name="description"
content="Web site created using create-react-app"
/>
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
<!--
manifest.json provides metadata used when your web app is installed on a
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
-->
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
<!--
Notice the use of %PUBLIC_URL% in the tags above.
It will be replaced with the URL of the `public` folder during the build.
Only files inside the `public` folder can be referenced from the HTML.
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
work correctly both with client-side routing and a non-root public URL.
Learn how to configure a non-root public URL by running `npm run build`.
-->
<title>React App</title>
<style>/*
! tailwindcss v3.2.3 | 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: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; /* 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]) {
text-decoration: underline;
-webkit-text-decoration: underline dotted currentColor;
text-decoration: underline dotted currentColor;
}
/*
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: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", 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: hsla(var(--b1) / 1);
background-color: hsla(var(--b1) / var(--tw-bg-opacity, 1));
color: hsla(var(--bc) / 1);
color: hsla(var(--bc) / var(--tw-text-opacity, 1));
}
html {
-webkit-tap-highlight-color: transparent;
}
:root {
color-scheme: light;
--pf: 213.21 100% 35.137%;
--sf: 200.87 29.114% 12.392%;
--af: 254.48 61.702% 43.137%;
--nf: 219 14.085% 22.275%;
--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: 213.21 100% 43.922%;
--pc: 0 0% 100%;
--s: 200.87 29.114% 15.49%;
--sc: 0 0% 100%;
--a: 254.48 61.702% 53.922%;
--ac: 0 0% 100%;
--n: 219 14.085% 27.843%;
--nc: 0 0% 100%;
--b1: 0 0% 100%;
--b2: 0 0% 94.902%;
--b3: 180 1.9608% 90%;
--bc: 215 27.907% 16.863%;
--in: 180 100% 30.392%;
--inc: 0 0% 100%;
--su: 122.14 82.353% 33.333%;
--suc: 0 0% 100%;
--wa: 29.333 95.745% 53.922%;
--wac: 0 0% 100%;
--er: 350.53 90.476% 41.176%;
--erc: 0 0% 100%;
}
@font-face {
font-family: "Optimistic Display";
src: url(https://segment-anything.com/00b3d823558b881dce9a.woff2) format("woff2"),
url(https://segment-anything.com/6c81699829fbd7f43942.woff) format("woff");
font-weight: 500;
}
@font-face {
font-family: "Optimistic Display";
src: url(https://segment-anything.com/bf66944526569a1510c4.woff2) format("woff2"),
url(https://segment-anything.com/91e9d0e7fe8aee0cbb04.woff) format("woff");
font-weight: 600;
}
@font-face {
font-family: "Optimistic Display";
src: url(https://segment-anything.com/51a4a9e272be3172ab61.woff2) format("woff2"),
url(https://segment-anything.com/312386eaac0e264fd6fd.woff) format("woff");
font-weight: 700;
}
@font-face {
font-family: "Optimistic Text";
src: url(https://segment-anything.com/2ff26b7f6d7161df3519.woff2) format("woff2"),
url(https://segment-anything.com/63786953f4ea2cf026e3.woff) format("woff");
font-weight: 400;
}
@font-face {
font-family: "Optimistic Text";
src: url(https://segment-anything.com/ccba622cc2abfbee2cab.woff2) format("woff2"),
url(https://segment-anything.com/9c43f344e5aa9b87a998.woff) format("woff");
font-weight: 500;
}
@font-face {
font-family: "Optimistic Text";
src: url(https://segment-anything.com/d8de14329f4431eb4efe.woff2) format("woff2"),
url(https://segment-anything.com/717fd895acaeee1281f2.woff) format("woff");
font-weight: 700;
}
@font-face {
font-family: "Optimistic Text";
src: url(https://segment-anything.com/5c7c0c1c43def3c09c8f.woff2) format("woff2"),
url(https://segment-anything.com/cc0ac0e99162ed97dd4c.woff) format("woff");
font-weight: 800;
}
*, ::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: rgba(59, 130, 246, 0.5);
--tw-ring-offset-shadow: 0 0 rgba(0,0,0,0);
--tw-ring-shadow: 0 0 rgba(0,0,0,0);
--tw-shadow: 0 0 rgba(0,0,0,0);
--tw-shadow-colored: 0 0 rgba(0,0,0,0);
--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: rgba(59, 130, 246, 0.5);
--tw-ring-offset-shadow: 0 0 rgba(0,0,0,0);
--tw-ring-shadow: 0 0 rgba(0,0,0,0);
--tw-shadow: 0 0 rgba(0,0,0,0);
--tw-shadow-colored: 0 0 rgba(0,0,0,0);
--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%;
}
@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;
}
}
.prose {
color: var(--tw-prose-body);
max-width: 100%;
}
.prose :where([class~="lead"]):not(:where([class~="not-prose"] *)) {
color: var(--tw-prose-lead);
font-size: 1.25em;
line-height: 1.6;
margin-top: 1.2em;
margin-bottom: 1.2em;
}
.prose :where(a):not(:where([class~="not-prose"] *)) {
color: var(--tw-prose-links);
text-decoration: none;
font-weight: 500;
}
.prose :where(strong):not(:where([class~="not-prose"] *)) {
color: var(--tw-prose-bold);
font-weight: 600;
}
.prose :where(a strong):not(:where([class~="not-prose"] *)) {
color: inherit;
}
.prose :where(blockquote strong):not(:where([class~="not-prose"] *)) {
color: inherit;
}
.prose :where(thead th strong):not(:where([class~="not-prose"] *)) {
color: inherit;
}
.prose :where(ol):not(:where([class~="not-prose"] *)) {
list-style-type: decimal;
margin-top: 1.25em;
margin-bottom: 1.25em;
padding-left: 1.625em;
}
.prose :where(ol[type="A"]):not(:where([class~="not-prose"] *)) {
list-style-type: upper-alpha;
}
.prose :where(ol[type="a"]):not(:where([class~="not-prose"] *)) {
list-style-type: lower-alpha;
}
.prose :where(ol[type="A" s]):not(:where([class~="not-prose"] *)) {
list-style-type: upper-alpha;
}
.prose :where(ol[type="a" s]):not(:where([class~="not-prose"] *)) {
list-style-type: lower-alpha;
}
.prose :where(ol[type="I"]):not(:where([class~="not-prose"] *)) {
list-style-type: upper-roman;
}
.prose :where(ol[type="i"]):not(:where([class~="not-prose"] *)) {
list-style-type: lower-roman;
}
.prose :where(ol[type="I" s]):not(:where([class~="not-prose"] *)) {
list-style-type: upper-roman;
}
.prose :where(ol[type="i" s]):not(:where([class~="not-prose"] *)) {
list-style-type: lower-roman;
}
.prose :where(ol[type="1"]):not(:where([class~="not-prose"] *)) {
list-style-type: decimal;
}
.prose :where(ul):not(:where([class~="not-prose"] *)) {
list-style-type: disc;
margin-top: 1.25em;
margin-bottom: 1.25em;
padding-left: 1.625em;
}
.prose :where(ol > li):not(:where([class~="not-prose"] *))::marker {
font-weight: 400;
color: var(--tw-prose-counters);
}
.prose :where(ul > li):not(:where([class~="not-prose"] *))::marker {
color: var(--tw-prose-bullets);
}
.prose :where(hr):not(:where([class~="not-prose"] *)) {
border-color: var(--tw-prose-hr);
border-top-width: 1px;
margin-top: 3em;
margin-bottom: 3em;
}
.prose :where(blockquote):not(:where([class~="not-prose"] *)) {
font-weight: 500;
font-style: italic;
color: var(--tw-prose-quotes);
border-left-width: 0.25rem;
border-left-color: var(--tw-prose-quote-borders);
quotes: "\201C""\201D""\2018""\2019";
margin-top: 1.6em;
margin-bottom: 1.6em;
padding-left: 1em;
}
.prose :where(blockquote p:first-of-type):not(:where([class~="not-prose"] *))::before {
content: open-quote;
}
.prose :where(blockquote p:last-of-type):not(:where([class~="not-prose"] *))::after {
content: close-quote;
}
.prose :where(h1):not(:where([class~="not-prose"] *)) {
color: var(--tw-prose-headings);
font-weight: 800;
font-size: 2.25em;
margin-top: 0;
margin-bottom: 0.8888889em;
line-height: 1.1111111;
}
.prose :where(h1 strong):not(:where([class~="not-prose"] *)) {
font-weight: 900;
color: inherit;
}
.prose :where(h2):not(:where([class~="not-prose"] *)) {
color: var(--tw-prose-headings);
font-weight: 700;
font-size: 1.5em;
margin-top: 2em;
margin-bottom: 1em;
line-height: 1.3333333;
}
.prose :where(h2 strong):not(:where([class~="not-prose"] *)) {
font-weight: 800;
color: inherit;
}
.prose :where(h3):not(:where([class~="not-prose"] *)) {
color: var(--tw-prose-headings);
font-weight: 600;
font-size: 1.25em;
margin-top: 1.6em;
margin-bottom: 0.6em;
line-height: 1.6;
}
.prose :where(h3 strong):not(:where([class~="not-prose"] *)) {
font-weight: 700;
color: inherit;
}
.prose :where(h4):not(:where([class~="not-prose"] *)) {
color: var(--tw-prose-headings);
font-weight: 600;
margin-top: 1.5em;
margin-bottom: 0.5em;
line-height: 1.5;
}
.prose :where(h4 strong):not(:where([class~="not-prose"] *)) {
font-weight: 700;
color: inherit;
}
.prose :where(img):not(:where([class~="not-prose"] *)) {
margin-top: 2em;
margin-bottom: 2em;
}
.prose :where(figure > *):not(:where([class~="not-prose"] *)) {
margin-top: 0;
margin-bottom: 0;
}
.prose :where(figcaption):not(:where([class~="not-prose"] *)) {
color: var(--tw-prose-captions);
font-size: 0.875em;
line-height: 1.4285714;
margin-top: 0.8571429em;
}
.prose :where(code):not(:where([class~="not-prose"] *)) {
color: var(--tw-prose-code);
font-weight: 600;
font-size: 0.875em;
}
.prose :where(code):not(:where([class~="not-prose"] *))::before {
content: "`";
}
.prose :where(code):not(:where([class~="not-prose"] *))::after {
content: "`";
}
.prose :where(a code):not(:where([class~="not-prose"] *)) {
color: inherit;
}
.prose :where(h1 code):not(:where([class~="not-prose"] *)) {
color: inherit;
}
.prose :where(h2 code):not(:where([class~="not-prose"] *)) {
color: inherit;
font-size: 0.875em;
}
.prose :where(h3 code):not(:where([class~="not-prose"] *)) {
color: inherit;
font-size: 0.9em;
}
.prose :where(h4 code):not(:where([class~="not-prose"] *)) {
color: inherit;
}
.prose :where(blockquote code):not(:where([class~="not-prose"] *)) {
color: inherit;
}
.prose :where(thead th code):not(:where([class~="not-prose"] *)) {
color: inherit;
}
.prose :where(pre):not(:where([class~="not-prose"] *)) {
color: var(--tw-prose-pre-code);
background-color: var(--tw-prose-pre-bg);
overflow-x: auto;
font-weight: 400;
font-size: 0.875em;
line-height: 1.7142857;
margin-top: 1.7142857em;
margin-bottom: 1.7142857em;
border-radius: 0.375rem;
padding-top: 0.8571429em;
padding-right: 1.1428571em;
padding-bottom: 0.8571429em;
padding-left: 1.1428571em;
}
.prose :where(pre code):not(:where([class~="not-prose"] *)) {
background-color: transparent;
border-width: 0;
border-radius: 0;
padding: 0;
font-weight: inherit;
color: inherit;
font-size: inherit;
font-family: inherit;
line-height: inherit;
}
.prose :where(pre code):not(:where([class~="not-prose"] *))::before {
content: none;
}
.prose :where(pre code):not(:where([class~="not-prose"] *))::after {
content: none;
}
.prose :where(table):not(:where([class~="not-prose"] *)) {
width: 100%;
table-layout: auto;
text-align: left;
margin-top: 2em;
margin-bottom: 2em;
font-size: 0.875em;
line-height: 1.7142857;
}
.prose :where(thead):not(:where([class~="not-prose"] *)) {
border-bottom-width: 1px;
border-bottom-color: var(--tw-prose-th-borders);
}
.prose :where(thead th):not(:where([class~="not-prose"] *)) {
color: var(--tw-prose-headings);
font-weight: 600;
vertical-align: bottom;
padding-right: 0.5714286em;
padding-bottom: 0.5714286em;
padding-left: 0.5714286em;
}
.prose :where(tbody tr):not(:where([class~="not-prose"] *)) {
border-bottom-width: 1px;
border-bottom-color: var(--tw-prose-td-borders);
}
.prose :where(tbody tr:last-child):not(:where([class~="not-prose"] *)) {
border-bottom-width: 0;
}
.prose :where(tbody td):not(:where([class~="not-prose"] *)) {
vertical-align: baseline;
}
.prose :where(tfoot):not(:where([class~="not-prose"] *)) {
border-top-width: 1px;
border-top-color: var(--tw-prose-th-borders);
}
.prose :where(tfoot td):not(:where([class~="not-prose"] *)) {
vertical-align: top;
}
.prose {
--tw-prose-body: #374151;
--tw-prose-headings: #111827;
--tw-prose-lead: #4b5563;
--tw-prose-links: #111827;
--tw-prose-bold: #111827;
--tw-prose-counters: #6b7280;
--tw-prose-bullets: #d1d5db;
--tw-prose-hr: #e5e7eb;
--tw-prose-quotes: #111827;
--tw-prose-quote-borders: #e5e7eb;
--tw-prose-captions: #6b7280;
--tw-prose-code: #111827;
--tw-prose-pre-code: #e5e7eb;
--tw-prose-pre-bg: #1f2937;
--tw-prose-th-borders: #d1d5db;
--tw-prose-td-borders: #e5e7eb;
--tw-prose-invert-body: #d1d5db;
--tw-prose-invert-headings: #fff;
--tw-prose-invert-lead: #9ca3af;
--tw-prose-invert-links: #fff;
--tw-prose-invert-bold: #fff;
--tw-prose-invert-counters: #9ca3af;
--tw-prose-invert-bullets: #4b5563;
--tw-prose-invert-hr: #374151;
--tw-prose-invert-quotes: #f3f4f6;
--tw-prose-invert-quote-borders: #374151;
--tw-prose-invert-captions: #9ca3af;
--tw-prose-invert-code: #fff;
--tw-prose-invert-pre-code: #d1d5db;
--tw-prose-invert-pre-bg: rgba(0, 0, 0, 0.5);
--tw-prose-invert-th-borders: #4b5563;
--tw-prose-invert-td-borders: #374151;
font-size: 1rem;
line-height: 1.75;
}
.prose :where(p):not(:where([class~="not-prose"] *)) {
margin-top: 1.25em;
margin-bottom: 1.25em;
}
.prose :where(video):not(:where([class~="not-prose"] *)) {
margin-top: 2em;
margin-bottom: 2em;
}
.prose :where(figure):not(:where([class~="not-prose"] *)) {
margin-top: 2em;
margin-bottom: 2em;
}
.prose :where(li):not(:where([class~="not-prose"] *)) {
margin-top: 0.5em;
margin-bottom: 0.5em;
}
.prose :where(ol > li):not(:where([class~="not-prose"] *)) {
padding-left: 0.375em;
}
.prose :where(ul > li):not(:where([class~="not-prose"] *)) {
padding-left: 0.375em;
}
.prose :where(.prose > ul > li p):not(:where([class~="not-prose"] *)) {
margin-top: 0.75em;
margin-bottom: 0.75em;
}
.prose :where(.prose > ul > li > *:first-child):not(:where([class~="not-prose"] *)) {
margin-top: 1.25em;
}
.prose :where(.prose > ul > li > *:last-child):not(:where([class~="not-prose"] *)) {
margin-bottom: 1.25em;
}
.prose :where(.prose > ol > li > *:first-child):not(:where([class~="not-prose"] *)) {
margin-top: 1.25em;
}
.prose :where(.prose > ol > li > *:last-child):not(:where([class~="not-prose"] *)) {
margin-bottom: 1.25em;
}
.prose :where(ul ul, ul ol, ol ul, ol ol):not(:where([class~="not-prose"] *)) {
margin-top: 0.75em;
margin-bottom: 0.75em;
}
.prose :where(hr + *):not(:where([class~="not-prose"] *)) {
margin-top: 0;
}
.prose :where(h2 + *):not(:where([class~="not-prose"] *)) {
margin-top: 0;
}
.prose :where(h3 + *):not(:where([class~="not-prose"] *)) {
margin-top: 0;
}
.prose :where(h4 + *):not(:where([class~="not-prose"] *)) {
margin-top: 0;
}
.prose :where(thead th:first-child):not(:where([class~="not-prose"] *)) {
padding-left: 0;
}
.prose :where(thead th:last-child):not(:where([class~="not-prose"] *)) {
padding-right: 0;
}
.prose :where(tbody td, tfoot td):not(:where([class~="not-prose"] *)) {
padding-top: 0.5714286em;
padding-right: 0.5714286em;
padding-bottom: 0.5714286em;
padding-left: 0.5714286em;
}
.prose :where(tbody td:first-child, tfoot td:first-child):not(:where([class~="not-prose"] *)) {
padding-left: 0;
}
.prose :where(tbody td:last-child, tfoot td:last-child):not(:where([class~="not-prose"] *)) {
padding-right: 0;
}
.prose :where(.prose > :first-child):not(:where([class~="not-prose"] *)) {
margin-top: 0;
}
.prose :where(.prose > :last-child):not(:where([class~="not-prose"] *)) {
margin-bottom: 0;
}
.prose-sm {
font-size: 0.875rem;
line-height: 1.7142857;
}
.prose-sm :where(p):not(:where([class~="not-prose"] *)) {
margin-top: 1.1428571em;
margin-bottom: 1.1428571em;
}
.prose-sm :where([class~="lead"]):not(:where([class~="not-prose"] *)) {
font-size: 1.2857143em;
line-height: 1.5555556;
margin-top: 0.8888889em;
margin-bottom: 0.8888889em;
}
.prose-sm :where(blockquote):not(:where([class~="not-prose"] *)) {
margin-top: 1.3333333em;
margin-bottom: 1.3333333em;
padding-left: 1.1111111em;
}
.prose-sm :where(h1):not(:where([class~="not-prose"] *)) {
font-size: 2.1428571em;
margin-top: 0;
margin-bottom: 0.8em;
line-height: 1.2;
}
.prose-sm :where(h2):not(:where([class~="not-prose"] *)) {
font-size: 1.4285714em;
margin-top: 1.6em;
margin-bottom: 0.8em;
line-height: 1.4;
}
.prose-sm :where(h3):not(:where([class~="not-prose"] *)) {
font-size: 1.2857143em;
margin-top: 1.5555556em;
margin-bottom: 0.4444444em;
line-height: 1.5555556;
}
.prose-sm :where(h4):not(:where([class~="not-prose"] *)) {
margin-top: 1.4285714em;
margin-bottom: 0.5714286em;
line-height: 1.4285714;
}
.prose-sm :where(img):not(:where([class~="not-prose"] *)) {
margin-top: 1.7142857em;
margin-bottom: 1.7142857em;
}
.prose-sm :where(video):not(:where([class~="not-prose"] *)) {
margin-top: 1.7142857em;
margin-bottom: 1.7142857em;
}
.prose-sm :where(figure):not(:where([class~="not-prose"] *)) {
margin-top: 1.7142857em;
margin-bottom: 1.7142857em;
}
.prose-sm :where(figure > *):not(:where([class~="not-prose"] *)) {
margin-top: 0;
margin-bottom: 0;
}
.prose-sm :where(figcaption):not(:where([class~="not-prose"] *)) {
font-size: 0.8571429em;
line-height: 1.3333333;
margin-top: 0.6666667em;
}
.prose-sm :where(code):not(:where([class~="not-prose"] *)) {
font-size: 0.8571429em;
}
.prose-sm :where(h2 code):not(:where([class~="not-prose"] *)) {
font-size: 0.9em;
}
.prose-sm :where(h3 code):not(:where([class~="not-prose"] *)) {
font-size: 0.8888889em;
}
.prose-sm :where(pre):not(:where([class~="not-prose"] *)) {
font-size: 0.8571429em;
line-height: 1.6666667;
margin-top: 1.6666667em;
margin-bottom: 1.6666667em;
border-radius: 0.25rem;
padding-top: 0.6666667em;
padding-right: 1em;
padding-bottom: 0.6666667em;
padding-left: 1em;
}
.prose-sm :where(ol):not(:where([class~="not-prose"] *)) {
margin-top: 1.1428571em;
margin-bottom: 1.1428571em;
padding-left: 1.5714286em;
}
.prose-sm :where(ul):not(:where([class~="not-prose"] *)) {
margin-top: 1.1428571em;
margin-bottom: 1.1428571em;
padding-left: 1.5714286em;
}
.prose-sm :where(li):not(:where([class~="not-prose"] *)) {
margin-top: 0.2857143em;
margin-bottom: 0.2857143em;
}
.prose-sm :where(ol > li):not(:where([class~="not-prose"] *)) {
padding-left: 0.4285714em;
}
.prose-sm :where(ul > li):not(:where([class~="not-prose"] *)) {
padding-left: 0.4285714em;
}
.prose-sm :where(.prose-sm > ul > li p):not(:where([class~="not-prose"] *)) {
margin-top: 0.5714286em;
margin-bottom: 0.5714286em;
}
.prose-sm :where(.prose-sm > ul > li > *:first-child):not(:where([class~="not-prose"] *)) {
margin-top: 1.1428571em;
}
.prose-sm :where(.prose-sm > ul > li > *:last-child):not(:where([class~="not-prose"] *)) {
margin-bottom: 1.1428571em;
}
.prose-sm :where(.prose-sm > ol > li > *:first-child):not(:where([class~="not-prose"] *)) {
margin-top: 1.1428571em;
}
.prose-sm :where(.prose-sm > ol > li > *:last-child):not(:where([class~="not-prose"] *)) {
margin-bottom: 1.1428571em;
}
.prose-sm :where(ul ul, ul ol, ol ul, ol ol):not(:where([class~="not-prose"] *)) {
margin-top: 0.5714286em;
margin-bottom: 0.5714286em;
}
.prose-sm :where(hr):not(:where([class~="not-prose"] *)) {
margin-top: 2.8571429em;
margin-bottom: 2.8571429em;
}
.prose-sm :where(hr + *):not(:where([class~="not-prose"] *)) {
margin-top: 0;
}
.prose-sm :where(h2 + *):not(:where([class~="not-prose"] *)) {
margin-top: 0;
}
.prose-sm :where(h3 + *):not(:where([class~="not-prose"] *)) {
margin-top: 0;
}
.prose-sm :where(h4 + *):not(:where([class~="not-prose"] *)) {
margin-top: 0;
}
.prose-sm :where(table):not(:where([class~="not-prose"] *)) {
font-size: 0.8571429em;
line-height: 1.5;
}
.prose-sm :where(thead th):not(:where([class~="not-prose"] *)) {
padding-right: 1em;
padding-bottom: 0.6666667em;
padding-left: 1em;
}
.prose-sm :where(thead th:first-child):not(:where([class~="not-prose"] *)) {
padding-left: 0;
}
.prose-sm :where(thead th:last-child):not(:where([class~="not-prose"] *)) {
padding-right: 0;
}
.prose-sm :where(tbody td, tfoot td):not(:where([class~="not-prose"] *)) {
padding-top: 0.6666667em;
padding-right: 1em;
padding-bottom: 0.6666667em;
padding-left: 1em;
}
.prose-sm :where(tbody td:first-child, tfoot td:first-child):not(:where([class~="not-prose"] *)) {
padding-left: 0;
}
.prose-sm :where(tbody td:last-child, tfoot td:last-child):not(:where([class~="not-prose"] *)) {
padding-right: 0;
}
.prose-sm :where(.prose-sm > :first-child):not(:where([class~="not-prose"] *)) {
margin-top: 0;
}
.prose-sm :where(.prose-sm > :last-child):not(:where([class~="not-prose"] *)) {
margin-bottom: 0;
}
.prose-lg {
font-size: 1.125rem;
line-height: 1.7777778;
}
.prose-lg :where(p):not(:where([class~="not-prose"] *)) {
margin-top: 1.3333333em;
margin-bottom: 1.3333333em;
}
.prose-lg :where([class~="lead"]):not(:where([class~="not-prose"] *)) {
font-size: 1.2222222em;
line-height: 1.4545455;
margin-top: 1.0909091em;
margin-bottom: 1.0909091em;
}
.prose-lg :where(blockquote):not(:where([class~="not-prose"] *)) {
margin-top: 1.6666667em;
margin-bottom: 1.6666667em;
padding-left: 1em;
}
.prose-lg :where(h1):not(:where([class~="not-prose"] *)) {
font-size: 2.6666667em;
margin-top: 0;
margin-bottom: 0.8333333em;
line-height: 1;
}
.prose-lg :where(h2):not(:where([class~="not-prose"] *)) {
font-size: 1.6666667em;
margin-top: 1.8666667em;
margin-bottom: 1.0666667em;
line-height: 1.3333333;
}
.prose-lg :where(h3):not(:where([class~="not-prose"] *)) {
font-size: 1.3333333em;
margin-top: 1.6666667em;
margin-bottom: 0.6666667em;
line-height: 1.5;
}
.prose-lg :where(h4):not(:where([class~="not-prose"] *)) {
margin-top: 1.7777778em;
margin-bottom: 0.4444444em;
line-height: 1.5555556;
}
.prose-lg :where(img):not(:where([class~="not-prose"] *)) {
margin-top: 1.7777778em;
margin-bottom: 1.7777778em;
}
.prose-lg :where(video):not(:where([class~="not-prose"] *)) {
margin-top: 1.7777778em;
margin-bottom: 1.7777778em;
}
.prose-lg :where(figure):not(:where([class~="not-prose"] *)) {
margin-top: 1.7777778em;
margin-bottom: 1.7777778em;
}
.prose-lg :where(figure > *):not(:where([class~="not-prose"] *)) {
margin-top: 0;
margin-bottom: 0;
}
.prose-lg :where(figcaption):not(:where([class~="not-prose"] *)) {
font-size: 0.8888889em;
line-height: 1.5;
margin-top: 1em;
}
.prose-lg :where(code):not(:where([class~="not-prose"] *)) {
font-size: 0.8888889em;
}
.prose-lg :where(h2 code):not(:where([class~="not-prose"] *)) {
font-size: 0.8666667em;
}
.prose-lg :where(h3 code):not(:where([class~="not-prose"] *)) {
font-size: 0.875em;
}
.prose-lg :where(pre):not(:where([class~="not-prose"] *)) {
font-size: 0.8888889em;
line-height: 1.75;
margin-top: 2em;
margin-bottom: 2em;
border-radius: 0.375rem;
padding-top: 1em;
padding-right: 1.5em;
padding-bottom: 1em;
padding-left: 1.5em;
}
.prose-lg :where(ol):not(:where([class~="not-prose"] *)) {
margin-top: 1.3333333em;
margin-bottom: 1.3333333em;
padding-left: 1.5555556em;
}
.prose-lg :where(ul):not(:where([class~="not-prose"] *)) {
margin-top: 1.3333333em;
margin-bottom: 1.3333333em;
padding-left: 1.5555556em;
}
.prose-lg :where(li):not(:where([class~="not-prose"] *)) {
margin-top: 0.6666667em;
margin-bottom: 0.6666667em;
}
.prose-lg :where(ol > li):not(:where([class~="not-prose"] *)) {
padding-left: 0.4444444em;
}
.prose-lg :where(ul > li):not(:where([class~="not-prose"] *)) {
padding-left: 0.4444444em;
}
.prose-lg :where(.prose-lg > ul > li p):not(:where([class~="not-prose"] *)) {
margin-top: 0.8888889em;
margin-bottom: 0.8888889em;
}
.prose-lg :where(.prose-lg > ul > li > *:first-child):not(:where([class~="not-prose"] *)) {
margin-top: 1.3333333em;
}
.prose-lg :where(.prose-lg > ul > li > *:last-child):not(:where([class~="not-prose"] *)) {
margin-bottom: 1.3333333em;
}
.prose-lg :where(.prose-lg > ol > li > *:first-child):not(:where([class~="not-prose"] *)) {
margin-top: 1.3333333em;
}
.prose-lg :where(.prose-lg > ol > li > *:last-child):not(:where([class~="not-prose"] *)) {
margin-bottom: 1.3333333em;
}
.prose-lg :where(ul ul, ul ol, ol ul, ol ol):not(:where([class~="not-prose"] *)) {
margin-top: 0.8888889em;
margin-bottom: 0.8888889em;
}
.prose-lg :where(hr):not(:where([class~="not-prose"] *)) {
margin-top: 3.1111111em;
margin-bottom: 3.1111111em;
}
.prose-lg :where(hr + *):not(:where([class~="not-prose"] *)) {
margin-top: 0;
}
.prose-lg :where(h2 + *):not(:where([class~="not-prose"] *)) {
margin-top: 0;
}
.prose-lg :where(h3 + *):not(:where([class~="not-prose"] *)) {
margin-top: 0;
}
.prose-lg :where(h4 + *):not(:where([class~="not-prose"] *)) {
margin-top: 0;
}
.prose-lg :where(table):not(:where([class~="not-prose"] *)) {
font-size: 0.8888889em;
line-height: 1.5;
}
.prose-lg :where(thead th):not(:where([class~="not-prose"] *)) {
padding-right: 0.75em;
padding-bottom: 0.75em;
padding-left: 0.75em;
}
.prose-lg :where(thead th:first-child):not(:where([class~="not-prose"] *)) {
padding-left: 0;
}
.prose-lg :where(thead th:last-child):not(:where([class~="not-prose"] *)) {
padding-right: 0;
}
.prose-lg :where(tbody td, tfoot td):not(:where([class~="not-prose"] *)) {
padding-top: 0.75em;
padding-right: 0.75em;
padding-bottom: 0.75em;
padding-left: 0.75em;
}
.prose-lg :where(tbody td:first-child, tfoot td:first-child):not(:where([class~="not-prose"] *)) {
padding-left: 0;
}
.prose-lg :where(tbody td:last-child, tfoot td:last-child):not(:where([class~="not-prose"] *)) {
padding-right: 0;
}
.prose-lg :where(.prose-lg > :first-child):not(:where([class~="not-prose"] *)) {
margin-top: 0;
}
.prose-lg :where(.prose-lg > :last-child):not(:where([class~="not-prose"] *)) {
margin-bottom: 0;
}
.alert {
display: flex;
width: 100%;
flex-direction: column;
align-items: center;
justify-content: space-between;
gap: 1rem;
--tw-bg-opacity: 1;
background-color: hsl(var(--b1) / var(--tw-bg-opacity));
background-color: hsl(var(--b2, var(--b1)) / var(--tw-bg-opacity));
padding: 1rem;
border-radius: 1rem;
border-radius: var(--rounded-box, 1rem);
}
.alert > :not([hidden]) ~ :not([hidden]) {
--tw-space-y-reverse: 0;
margin-top: calc(0.5rem * (1 - var(--tw-space-y-reverse)));
margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
}
@media (min-width: 768px) {
.alert {
flex-direction: row;
}
.alert > :not([hidden]) ~ :not([hidden]) {
--tw-space-y-reverse: 0;
margin-top: calc(0px * (1 - var(--tw-space-y-reverse)));
margin-top: calc(0px * calc(1 - var(--tw-space-y-reverse)));
margin-bottom: calc(0px * var(--tw-space-y-reverse));
}
}
.alert > :where(*) {
display: flex;
align-items: center;
gap: 0.5rem;
}
.artboard {
width: 100%;
}
.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;
}
.badge {
display: inline-flex;
align-items: center;
justify-content: 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-duration: 200ms;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
height: 1.25rem;
font-size: 0.875rem;
line-height: 1.25rem;
width: -moz-fit-content;
width: fit-content;
padding-left: 0.563rem;
padding-right: 0.563rem;
border-width: 1px;
--tw-border-opacity: 1;
border-color: hsl(var(--n) / var(--tw-border-opacity));
--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));
border-radius: 1.9rem;
border-radius: var(--rounded-badge, 1.9rem);
}
.btm-nav {
position: fixed;
bottom: 0px;
left: 0px;
right: 0px;
display: flex;
width: 100%;
flex-direction: row;
align-items: center;
justify-content: space-around;
padding-bottom: env(safe-area-inset-bottom);
height: 4rem;
--tw-bg-opacity: 1;
background-color: hsl(var(--b1) / var(--tw-bg-opacity));
color: currentColor;
}
.btm-nav>* {
position: relative;
display: flex;
height: 100%;
flex-basis: 100%;
cursor: pointer;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 0.25rem;
border-color: currentColor;
}
.breadcrumbs {
max-width: 100%;
overflow-x: auto;
padding-top: 0.5rem;
padding-bottom: 0.5rem;
}
.breadcrumbs > ul,.breadcrumbs > ol {
display: flex;
align-items: center;
white-space: nowrap;
min-height: -moz-min-content;
min-height: min-content;
}
.breadcrumbs > ul > li, .breadcrumbs > ol > li {
display: flex;
align-items: center;
}
.breadcrumbs > ul > li > a, .breadcrumbs > ol > li > a {
display: flex;
cursor: pointer;
align-items: center;
}
.breadcrumbs > ul > li > a:hover, .breadcrumbs > ol > li > a:hover {
text-decoration-line: underline;
}
.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(--n) / 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-duration: 200ms;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
border-radius: 0.5rem;
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;
font-weight: 600;
text-transform: uppercase;
text-transform: var(--btn-text-case, uppercase);
text-decoration-line: none;
border-width: 1px;
border-width: var(--border-btn, 1px);
animation: button-pop 0.25s ease-out;
animation: button-pop var(--animation-btn, 0.25s) ease-out;
--tw-border-opacity: 1;
--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));
}
.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.loading,
.btn.loading:hover {
pointer-events: none;
}
.btn.\!loading,
.btn.\!loading:hover {
pointer-events: none !important;
}
.btn.loading:before {
margin-right: 0.5rem;
height: 1rem;
width: 1rem;
border-radius: 9999px;
border-width: 2px;
animation: spin 2s linear infinite;
content: "";
border-top-color: transparent;
border-left-color: transparent;
border-bottom-color: currentColor;
border-right-color: currentColor;
}
.btn.\!loading:before {
margin-right: 0.5rem !important;
height: 1rem !important;
width: 1rem !important;
border-radius: 9999px !important;
border-width: 2px !important;
animation: spin 2s linear infinite !important;
content: "" !important;
border-top-color: transparent !important;
border-left-color: transparent !important;
border-bottom-color: currentColor !important;
border-right-color: currentColor !important;
}
@media (prefers-reduced-motion: reduce) {
.btn.loading:before {
animation: spin 10s linear infinite;
}
.btn.\!loading:before {
animation: spin 10s linear infinite !important;
}
}
@keyframes spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
.btn-group {
display: inline-flex;
}
.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);
}
.card {
position: relative;
display: flex;
flex-direction: column;
border-radius: 1rem;
border-radius: var(--rounded-box, 1rem);
}
.card:focus {
outline: 2px solid transparent;
outline-offset: 2px;
}
.card-body {
display: flex;
flex: 1 1 auto;
flex-direction: column;
padding: 2rem;
padding: var(--padding-card, 2rem);
gap: 0.5rem;
}
.card-body :where(p) {
flex-grow: 1;
}
.card-actions {
display: flex;
flex-wrap: wrap;
align-items: flex-start;
gap: 0.5rem;
}
.card figure {
display: flex;
align-items: center;
justify-content: center;
}
.card.image-full {
display: grid;
}
.card.image-full:before {
position: relative;
content: "";
z-index: 10;
--tw-bg-opacity: 1;
background-color: hsl(var(--n) / var(--tw-bg-opacity));
opacity: 0.75;
border-radius: 1rem;
border-radius: var(--rounded-box, 1rem);
}
.card.image-full:before,
.card.image-full > * {
grid-column-start: 1;
grid-row-start: 1;
}
.card.image-full > figure img {
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.card.image-full > .card-body {
position: relative;
z-index: 20;
--tw-text-opacity: 1;
color: hsl(var(--nc) / var(--tw-text-opacity));
}
.carousel {
display: flex;
overflow-x: scroll;
scroll-snap-type: x mandatory;
scroll-behavior: smooth;
-ms-overflow-style: none;
scrollbar-width: none;
}
.carousel-vertical {
flex-direction: column;
overflow-y: scroll;
scroll-snap-type: y mandatory;
}
.carousel-item {
box-sizing: content-box;
display: flex;
flex: none;
scroll-snap-align: start;
}
.carousel-center .carousel-item {
scroll-snap-align: center;
}
.carousel-end .carousel-item {
scroll-snap-align: end;
}
.chat {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
grid-column-gap: 0.75rem;
-moz-column-gap: 0.75rem;
column-gap: 0.75rem;
padding-top: 0.25rem;
padding-bottom: 0.25rem;
}
.chat-image {
grid-row: span 2 / span 2;
align-self: flex-end;
}
.chat-header {
grid-row-start: 1;
font-size: 0.875rem;
line-height: 1.25rem;
}
.chat-footer {
grid-row-start: 3;
font-size: 0.875rem;
line-height: 1.25rem;
}
.chat-bubble {
position: relative;
display: block;
width: -moz-fit-content;
width: fit-content;
padding-left: 1rem;
padding-right: 1rem;
padding-top: 0.5rem;
padding-bottom: 0.5rem;
max-width: 90%;
border-radius: 1rem;
border-radius: var(--rounded-box, 1rem);
min-height: 2.75rem;
min-width: 2.75rem;
--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));
}
.chat-bubble:before {
position: absolute;
bottom: 0px;
height: 0.75rem;
width: 0.75rem;
background-color: inherit;
content: "";
-webkit-mask-size: contain;
mask-size: contain;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position: center;
mask-position: center;
}
.chat-start {
align-items: start;
justify-items: start;
place-items: start;
grid-template-columns: auto 1fr;
}
.chat-start .chat-header {
grid-column-start: 2;
}
.chat-start .chat-footer {
grid-column-start: 2;
}
.chat-start .chat-image {
grid-column-start: 1;
}
.chat-start .chat-bubble {
grid-column-start: 2;
border-bottom-left-radius: 0px;
}
.chat-start .chat-bubble:before {
-webkit-mask-image: url("data:image/svg+xml,%3csvg width=%273%27 height=%273%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath fill=%27black%27 d=%27m 0 3 L 3 3 L 3 0 C 3 1 1 3 0 3%27/%3e%3c/svg%3e");
mask-image: url("data:image/svg+xml,%3csvg width=%273%27 height=%273%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath fill=%27black%27 d=%27m 0 3 L 3 3 L 3 0 C 3 1 1 3 0 3%27/%3e%3c/svg%3e");
left: -0.75rem;
}
[dir="rtl"] .chat-start .chat-bubble:before {
-webkit-mask-image: url("data:image/svg+xml,%3csvg width=%273%27 height=%273%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath fill=%27black%27 d=%27m 0 3 L 1 3 L 3 3 C 2 3 0 1 0 0%27/%3e%3c/svg%3e");
mask-image: url("data:image/svg+xml,%3csvg width=%273%27 height=%273%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath fill=%27black%27 d=%27m 0 3 L 1 3 L 3 3 C 2 3 0 1 0 0%27/%3e%3c/svg%3e");
}
.chat-end {
align-items: end;
justify-items: end;
place-items: end;
grid-template-columns: 1fr auto;
}
.chat-end .chat-header {
grid-column-start: 1;
}
.chat-end .chat-footer {
grid-column-start: 1;
}
.chat-end .chat-image {
grid-column-start: 2;
}
.chat-end .chat-bubble {
grid-column-start: 1;
border-bottom-right-radius: 0px;
}
.chat-end .chat-bubble:before {
-webkit-mask-image: url("data:image/svg+xml,%3csvg width=%273%27 height=%273%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath fill=%27black%27 d=%27m 0 3 L 1 3 L 3 3 C 2 3 0 1 0 0%27/%3e%3c/svg%3e");
mask-image: url("data:image/svg+xml,%3csvg width=%273%27 height=%273%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath fill=%27black%27 d=%27m 0 3 L 1 3 L 3 3 C 2 3 0 1 0 0%27/%3e%3c/svg%3e");
left: 100%;
}
[dir="rtl"] .chat-end .chat-bubble:before {
-webkit-mask-image: url("data:image/svg+xml,%3csvg width=%273%27 height=%273%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath fill=%27black%27 d=%27m 0 3 L 3 3 L 3 0 C 3 1 1 3 0 3%27/%3e%3c/svg%3e");
mask-image: url("data:image/svg+xml,%3csvg width=%273%27 height=%273%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath fill=%27black%27 d=%27m 0 3 L 3 3 L 3 0 C 3 1 1 3 0 3%27/%3e%3c/svg%3e");
}
.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: 0.5rem;
border-radius: var(--rounded-btn, 0.5rem);
}
.\!checkbox {
flex-shrink: 0 !important;
--chkbg: var(--bc) !important;
--chkfg: var(--b1) !important;
height: 1.5rem !important;
width: 1.5rem !important;
cursor: pointer !important;
-webkit-appearance: none !important;
-moz-appearance: none !important;
appearance: none !important;
border-width: 1px !important;
border-color: hsl(var(--bc) / var(--tw-border-opacity)) !important;
--tw-border-opacity: 0.2 !important;
border-radius: 0.5rem !important;
border-radius: var(--rounded-btn, 0.5rem) !important;
}
.collapse.collapse {
visibility: visible;
}
.collapse {
position: relative;
display: grid;
overflow: hidden;
grid-template-rows: 1fr auto;
}
.collapse-title,
.collapse > input[type="checkbox"],
.collapse-content {
grid-column-start: 1;
grid-row-start: 1;
}
.collapse > input[type="checkbox"] {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
opacity: 0;
}
.collapse-content {
grid-row-start: 2;
overflow: hidden;
max-height: 0px;
padding-left: 1rem;
padding-right: 1rem;
cursor: inherit;
transition: padding 0.2s ease-in-out, background-color 0.2s ease-in-out;
}
.collapse-open .collapse-content,
.collapse:focus:not(.collapse-close) .collapse-content,
.collapse:not(.collapse-close)
input[type="checkbox"]:checked
~ .collapse-content {
max-height: none;
}
: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%;
}
.drawer {
display: grid;
width: 100%;
overflow: hidden;
height: 100vh;
height: 100dvh;
}
.drawer.drawer-end {
direction: rtl;
}
.drawer.drawer-end > * {
direction: ltr;
}
.drawer.drawer-end > .drawer-toggle ~ .drawer-side > .drawer-overlay + * {
--tw-translate-x: 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));
justify-self: end;
}
.drawer.drawer-end > .drawer-toggle:checked ~ .drawer-side > .drawer-overlay + * {
--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));
}
:where(.drawer-toggle ~ .drawer-content) {
height: inherit;
}
.drawer-toggle {
position: absolute;
height: 0px;
width: 0px;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
opacity: 0;
}
.drawer-toggle ~ .drawer-content {
z-index: 0;
grid-column-start: 1;
grid-row-start: 1;
overflow-y: auto;
transition-property: all;
transition-duration: 300ms;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}
.drawer-toggle ~ .drawer-side {
grid-column-start: 1;
grid-row-start: 1;
display: grid;
max-height: 100vh;
overflow-x: hidden;
}
.drawer-toggle ~ .drawer-side > .drawer-overlay {
visibility: hidden;
grid-column-start: 1;
grid-row-start: 1;
opacity: 0;
cursor: pointer;
--tw-bg-opacity: 1;
background-color: hsl(var(--n) / var(--tw-bg-opacity));
background-color: hsl(var(--nf, var(--n)) / var(--tw-bg-opacity));
transition-property: all;
transition-duration: 300ms;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}
.drawer-toggle ~ .drawer-side > .drawer-overlay + * {
z-index: 10;
grid-column-start: 1;
grid-row-start: 1;
--tw-translate-x: -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));
transition-property: all;
transition-duration: 300ms;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}
.drawer-toggle:checked ~ .drawer-side {
isolation: isolate;
overflow-y: auto;
overflow-x: hidden;
}
.drawer-toggle:checked ~ .drawer-side > .drawer-overlay {
visibility: visible;
opacity: 0.999999;
--tw-bg-opacity: 0.4;
}
.drawer-toggle:checked ~ .drawer-side > .drawer-overlay + * {
--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));
}
[dir="rtl"] .drawer-toggle ~ .drawer-side > .drawer-overlay + * {
--tw-translate-x: 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));
}
[dir="rtl"] .drawer-toggle:checked ~ .drawer-side > .drawer-overlay + * {
--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));
}
[dir="rtl"] .drawer.drawer-end > .drawer-toggle ~ .drawer-side > .drawer-overlay + * {
--tw-translate-x: -100%;
}
[dir="rtl"] .drawer.drawer-end > .drawer-toggle:checked ~ .drawer-side > .drawer-overlay + * {
--tw-translate-x: 0px;
}
[dir="rtl"] .drawer.drawer-end > .drawer-toggle:checked ~ .drawer-content {
--tw-translate-x: 0.5rem;
}
@media (min-width: 1024px) {
.drawer-mobile {
grid-auto-columns: max-content auto;
}
.drawer-mobile > .drawer-toggle ~ .drawer-content {
height: auto;
}
@media (min-width: 1024px) {
.drawer-mobile > .drawer-toggle ~ .drawer-content {
grid-column-start: 2;
}
.drawer-mobile > .drawer-toggle ~ .drawer-side > .drawer-overlay {
visibility: visible;
}
.drawer-mobile > .drawer-toggle ~ .drawer-side > .drawer-overlay + * {
--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));
}
.drawer-mobile.drawer-end > .drawer-toggle ~ .drawer-content {
grid-column-start: 1;
}
.drawer-mobile.drawer-end > .drawer-toggle ~ .drawer-side {
grid-column-start: 2;
}
.drawer-mobile.drawer-end > .drawer-toggle ~ .drawer-side > .drawer-overlay {
visibility: visible;
}
.drawer-mobile.drawer-end > .drawer-toggle ~ .drawer-side > .drawer-overlay + * {
--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));
}
}
.drawer-mobile > .drawer-toggle ~ .drawer-side {
overflow-y: auto;
}
.drawer-mobile.drawer-end {
grid-auto-columns: auto max-content;
direction: ltr;
}
.drawer-mobile.drawer-end > .drawer-toggle ~ .drawer-content {
height: auto;
}
.drawer-mobile.drawer-end > .drawer-toggle ~ .drawer-side {
overflow-y: auto;
}
.drawer-mobile > .drawer-toggle:checked ~ .drawer-content {
--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));
}
}
.dropdown {
position: relative;
display: inline-block;
}
.dropdown > *:focus {
outline: 2px solid transparent;
outline-offset: 2px;
}
.dropdown .dropdown-content {
visibility: hidden;
position: absolute;
z-index: 50;
opacity: 0;
transform-origin: top;
--tw-scale-x: .95;
--tw-scale-y: .95;
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));
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-duration: 200ms;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}
.dropdown-end .dropdown-content {
right: 0px;
}
.dropdown-left .dropdown-content {
top: 0px;
right: 100%;
bottom: auto;
transform-origin: right;
}
.dropdown-right .dropdown-content {
left: 100%;
top: 0px;
bottom: auto;
transform-origin: left;
}
.dropdown-bottom .dropdown-content {
bottom: auto;
top: 100%;
transform-origin: top;
}
.dropdown-top .dropdown-content {
bottom: 100%;
top: auto;
transform-origin: bottom;
}
.dropdown-end.dropdown-right .dropdown-content {
bottom: 0px;
top: auto;
}
.dropdown-end.dropdown-left .dropdown-content {
bottom: 0px;
top: auto;
}
.dropdown.dropdown-open .dropdown-content,
.dropdown.dropdown-hover:hover .dropdown-content,
.dropdown:not(.dropdown-hover):focus .dropdown-content,
.dropdown:not(.dropdown-hover)[focus-within] .dropdown-content {
visibility: visible;
opacity: 1;
}
.dropdown.dropdown-open .dropdown-content,
.dropdown.dropdown-hover:hover .dropdown-content,
.dropdown:not(.dropdown-hover):focus .dropdown-content,
.dropdown:not(.dropdown-hover):focus-within .dropdown-content {
visibility: visible;
opacity: 1;
}
.file-input {
height: 3rem;
flex-shrink: 1;
padding-right: 1rem;
font-size: 1rem;
line-height: 2;
line-height: 1.5rem;
overflow: hidden;
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: 0.5rem;
border-radius: var(--rounded-btn, 0.5rem);
}
.file-input::file-selector-button {
margin-right: 1rem;
display: inline-flex;
height: 2.875rem;
min-height: 2.875rem;
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(--n) / var(--tw-border-opacity));
padding-left: 1rem;
padding-right: 1rem;
text-align: center;
font-size: 0.875rem;
line-height: 1.25rem;
line-height: 1em;
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-duration: 200ms;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
--tw-border-opacity: 1;
--tw-bg-opacity: 1;
background-color: hsl(var(--n) / var(--tw-bg-opacity));
font-weight: 600;
text-transform: uppercase;
text-transform: var(--btn-text-case, uppercase);
--tw-text-opacity: 1;
color: hsl(var(--nc) / var(--tw-text-opacity));
text-decoration-line: none;
border-width: 1px;
border-width: var(--border-btn, 1px);
animation: button-pop 0.25s ease-out;
animation: button-pop var(--animation-btn, 0.25s) ease-out;
}
.footer {
display: grid;
width: 100%;
grid-auto-flow: row;
align-items: start;
justify-items: start;
place-items: start;
grid-row-gap: 2.5rem;
row-gap: 2.5rem;
grid-column-gap: 1rem;
-moz-column-gap: 1rem;
column-gap: 1rem;
font-size: 0.875rem;
line-height: 1.25rem;
}
.footer > * {
display: grid;
align-items: start;
justify-items: start;
place-items: start;
grid-gap: 0.5rem;
gap: 0.5rem;
}
.footer-center {
align-items: center;
justify-items: center;
place-items: center;
text-align: center;
}
.footer-center > * {
align-items: center;
justify-items: center;
place-items: center;
}
@media (min-width: 48rem) {
.footer {
grid-auto-flow: column;
}
.footer-center {
grid-auto-flow: row dense;
}
}
.form-control {
display: flex;
flex-direction: column;
}
.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;
}
.hero {
display: grid;
width: 100%;
align-items: center;
justify-items: center;
place-items: center;
background-size: cover;
background-position: center;
}
.hero > * {
grid-column-start: 1;
grid-row-start: 1;
}
.hero-overlay {
grid-column-start: 1;
grid-row-start: 1;
height: 100%;
width: 100%;
background-color: hsl(var(--n) / var(--tw-bg-opacity));
--tw-bg-opacity: 0.5;
}
.hero-content {
z-index: 0;
display: flex;
align-items: center;
justify-content: center;
max-width: 80rem;
gap: 1rem;
padding: 1rem;
}
.indicator {
position: relative;
display: inline-flex;
width: -moz-max-content;
width: max-content;
}
.indicator :where(.indicator-item) {
z-index: 1;
position: absolute;
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));
white-space: nowrap;
}
.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: 0.5rem;
border-radius: var(--rounded-btn, 0.5rem);
}
.input-group {
display: flex;
width: 100%;
align-items: stretch;
}
.input-group > .input {
isolation: isolate;
}
.input-group > *,
.input-group > .input,
.input-group > .textarea,
.input-group > .select {
border-radius: 0px;
}
.input-group-md {
font-size: 0.875rem;
line-height: 1.25rem;
line-height: 2;
}
.input-group-lg {
font-size: 1.125rem;
line-height: 1.75rem;
line-height: 2;
}
.input-group-sm {
font-size: 0.875rem;
line-height: 2rem;
}
.input-group-xs {
font-size: 0.75rem;
line-height: 1rem;
line-height: 1.625;
}
.input-group :where(span) {
display: flex;
align-items: center;
--tw-bg-opacity: 1;
background-color: hsl(var(--b2) / var(--tw-bg-opacity));
background-color: hsl(var(--b3, var(--b2)) / var(--tw-bg-opacity));
padding-left: 1rem;
padding-right: 1rem;
}
.input-group > :first-child {
border-top-left-radius: 0.5rem;
border-top-left-radius: var(--rounded-btn, 0.5rem);
border-top-right-radius: 0;
border-bottom-left-radius: 0.5rem;
border-bottom-left-radius: var(--rounded-btn, 0.5rem);
border-bottom-right-radius: 0;
}
.input-group > :last-child {
border-top-left-radius: 0;
border-top-right-radius: 0.5rem;
border-top-right-radius: var(--rounded-btn, 0.5rem);
border-bottom-left-radius: 0;
border-bottom-right-radius: 0.5rem;
border-bottom-right-radius: var(--rounded-btn, 0.5rem);
}
.input-group-vertical {
flex-direction: column;
}
.input-group-vertical :first-child {
border-top-left-radius: 0.5rem;
border-top-left-radius: var(--rounded-btn, 0.5rem);
border-top-right-radius: 0.5rem;
border-top-right-radius: var(--rounded-btn, 0.5rem);
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
}
.input-group-vertical :last-child {
border-top-left-radius: 0;
border-top-right-radius: 0;
border-bottom-left-radius: 0.5rem;
border-bottom-left-radius: var(--rounded-btn, 0.5rem);
border-bottom-right-radius: 0.5rem;
border-bottom-right-radius: var(--rounded-btn, 0.5rem);
}
.kbd {
display: inline-flex;
align-items: center;
justify-content: center;
border-width: 1px;
border-color: hsl(var(--bc) / var(--tw-border-opacity));
--tw-border-opacity: 0.2;
--tw-bg-opacity: 1;
background-color: hsl(var(--b1) / var(--tw-bg-opacity));
background-color: hsl(var(--b2, var(--b1)) / var(--tw-bg-opacity));
padding-left: 0.5rem;
padding-right: 0.5rem;
border-radius: 0.5rem;
border-radius: var(--rounded-btn, 0.5rem);
border-bottom-width: 2px;
min-height: 2.2em;
min-width: 2.2em;
}
.link {
cursor: pointer;
text-decoration-line: underline;
}
.link-hover {
text-decoration-line: none;
}
.link-hover:hover {
text-decoration-line: underline;
}
.mask {
-webkit-mask-size: contain;
mask-size: contain;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position: center;
mask-position: center;
}
.mask-half-1 {
-webkit-mask-size: 200%;
mask-size: 200%;
-webkit-mask-position: left;
mask-position: left;
}
.mask-half-2 {
-webkit-mask-size: 200%;
mask-size: 200%;
-webkit-mask-position: right;
mask-position: right;
}
.menu {
display: flex;
flex-direction: column;
flex-wrap: wrap;
}
.menu.horizontal {
display: inline-flex;
flex-direction: row;
}
.menu.horizontal :where(li) {
flex-direction: row;
}
:where(.menu li) {
position: relative;
display: flex;
flex-shrink: 0;
flex-direction: column;
flex-wrap: wrap;
align-items: stretch;
}
.menu :where(li:not(.menu-title)) > :where(*:not(ul)) {
display: flex;
}
.menu :where(li:not(.disabled):not(.menu-title)) > :where(*:not(ul)) {
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
align-items: center;
outline: 2px solid transparent;
outline-offset: 2px;
}
.menu > :where(li > *:not(ul):focus) {
outline: 2px solid transparent;
outline-offset: 2px;
}
.menu > :where(li.disabled > *:not(ul):focus) {
cursor: auto;
}
.menu > :where(li) :where(ul) {
display: flex;
flex-direction: column;
align-items: stretch;
}
.menu > :where(li) > :where(ul) {
position: absolute;
display: none;
top: auto;
top: initial;
left: 100%;
border-top-left-radius: inherit;
border-top-right-radius: inherit;
border-bottom-right-radius: inherit;
border-bottom-left-radius: inherit;
}
.menu > :where(li:hover) > :where(ul) {
display: flex;
}
.menu > :where(li:focus) > :where(ul) {
display: flex;
}
.mockup-code {
position: relative;
overflow: hidden;
overflow-x: auto;
min-width: 18rem;
--tw-bg-opacity: 1;
background-color: hsl(var(--n) / var(--tw-bg-opacity));
padding-top: 1.25rem;
padding-bottom: 1.25rem;
--tw-text-opacity: 1;
color: hsl(var(--nc) / var(--tw-text-opacity));
border-radius: 1rem;
border-radius: var(--rounded-box, 1rem);
}
.mockup-code pre[data-prefix]:before {
content: attr(data-prefix);
display: inline-block;
text-align: right;
width: 2rem;
opacity: 0.5;
}
.mockup-window {
position: relative;
overflow: hidden;
overflow-x: auto;
padding-top: 1.25rem;
border-radius: 1rem;
border-radius: var(--rounded-box, 1rem);
}
.mockup-window pre[data-prefix]:before {
content: attr(data-prefix);
display: inline-block;
text-align: right;
}
.modal {
pointer-events: none;
visibility: hidden;
position: fixed;
top: 0px;
right: 0px;
bottom: 0px;
left: 0px;
display: flex;
justify-content: center;
opacity: 0;
z-index: 999;
background-color: hsl(var(--n) / var(--tw-bg-opacity));
background-color: hsl(var(--nf, var(--n)) / var(--tw-bg-opacity));
--tw-bg-opacity: 0.4;
transition-duration: 200ms;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
transition-property: transform, opacity, visibility;
overflow-y: hidden;
overscroll-behavior: contain;
}
:where(.modal) {
align-items: center;
}
.modal-box {
max-height: calc(100vh - 5em);
--tw-bg-opacity: 1;
background-color: hsl(var(--b1) / var(--tw-bg-opacity));
padding: 1.5rem;
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-duration: 200ms;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
width: 91.666667%;
max-width: 32rem;
--tw-scale-x: .9;
--tw-scale-y: .9;
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-top-left-radius: 1rem;
border-top-left-radius: var(--rounded-box, 1rem);
border-top-right-radius: 1rem;
border-top-right-radius: var(--rounded-box, 1rem);
border-bottom-left-radius: 1rem;
border-bottom-left-radius: var(--rounded-box, 1rem);
border-bottom-right-radius: 1rem;
border-bottom-right-radius: var(--rounded-box, 1rem);
box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
overflow-y: auto;
overscroll-behavior: contain;
}
.modal-open,
.modal:target,
.modal-toggle:checked + .modal {
pointer-events: auto;
visibility: visible;
opacity: 1;
}
.modal-action {
display: flex;
margin-top: 1.5rem;
justify-content: flex-end;
}
.modal-toggle {
position: fixed;
height: 0px;
width: 0px;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
opacity: 0;
}
.navbar {
display: flex;
align-items: center;
padding: 0.5rem;
padding: var(--navbar-padding, 0.5rem);
min-height: 4rem;
width: 100%;
}
:where(.navbar > *) {
display: inline-flex;
align-items: center;
}
.navbar-start {
width: 50%;
justify-content: flex-start;
}
.navbar-center {
flex-shrink: 0;
}
.navbar-end {
width: 50%;
justify-content: flex-end;
}
.progress {
position: relative;
width: 100%;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
overflow: hidden;
height: 0.5rem;
border-radius: 1rem;
border-radius: var(--rounded-box, 1rem);
}
.radial-progress {
position: relative;
display: inline-grid;
height: var(--size);
width: var(--size);
align-content: center;
justify-content: center;
place-content: center;
border-radius: 9999px;
background-color: transparent;
vertical-align: middle;
box-sizing: content-box;
--value: 0;
--size: 5rem;
--thickness: calc(var(--size) / 10);
}
.radial-progress::-moz-progress-bar {
-moz-appearance: none;
appearance: none;
background-color: transparent;
}
.radial-progress::-webkit-progress-value {
-webkit-appearance: none;
appearance: none;
background-color: transparent;
}
.radial-progress::-webkit-progress-bar {
-webkit-appearance: none;
appearance: none;
background-color: transparent;
}
.radial-progress:before,
.radial-progress:after {
position: absolute;
border-radius: 9999px;
content: "";
}
.radial-progress:before {
top: 0px;
right: 0px;
bottom: 0px;
left: 0px;
background: radial-gradient(farthest-side, currentColor 98%, rgba(0,0,0,0)) top/var(--thickness) var(--thickness) no-repeat, conic-gradient(currentColor calc(var(--value) * 1%), rgba(0,0,0,0) 0);
-webkit-mask: radial-gradient(farthest-side, rgba(0,0,0,0) calc(99% - var(--thickness)), #000 calc(100% - var(--thickness)));
mask: radial-gradient(farthest-side, rgba(0,0,0,0) calc(99% - var(--thickness)), #000 calc(100% - var(--thickness)));
}
.radial-progress:after {
top: calc(50% - var(--thickness) / 2);
right: calc(50% - var(--thickness) / 2);
bottom: calc(50% - var(--thickness) / 2);
left: calc(50% - var(--thickness) / 2);
transform: rotate(calc(var(--value) * 3.6deg - 90deg)) translate(calc(var(--size) / 2 - 50%));
background-color: currentColor;
}
.radio {
flex-shrink: 0;
--chkbg: var(--bc);
height: 1.5rem;
width: 1.5rem;
cursor: pointer;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
border-radius: 9999px;
border-width: 1px;
border-color: hsl(var(--bc) / var(--tw-border-opacity));
--tw-border-opacity: 0.2;
transition: background, box-shadow 0.2s ease-in-out;
transition: background, box-shadow var(--animation-input, 0.2s) ease-in-out;
}
.range {
height: 1.5rem;
width: 100%;
cursor: pointer;
-moz-appearance: none;
appearance: none;
-webkit-appearance: none;
--range-shdw: var(--bc);
overflow: hidden;
background-color: transparent;
border-radius: 1rem;
border-radius: var(--rounded-box, 1rem);
}
.\!range {
height: 1.5rem !important;
width: 100% !important;
cursor: pointer !important;
-moz-appearance: none !important;
appearance: none !important;
-webkit-appearance: none !important;
--range-shdw: var(--bc) !important;
overflow: hidden !important;
background-color: transparent !important;
border-radius: 1rem !important;
border-radius: var(--rounded-box, 1rem) !important;
}
.range:focus {
outline: none;
}
.\!range:focus {
outline: none !important;
}
.rating {
position: relative;
display: inline-flex;
}
.rating :where(input) {
cursor: pointer;
border-radius: 0px;
animation: rating-pop 0.25s ease-out;
animation: rating-pop var(--animation-input, 0.25s) ease-out;
height: 1.5rem;
width: 1.5rem;
background-color: hsl(var(--bc) / var(--tw-bg-opacity));
--tw-bg-opacity: 1;
}
.select {
display: inline-flex;
flex-shrink: 0;
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: 0.5rem;
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;
}
.stack {
display: inline-grid;
align-items: center;
justify-items: center;
place-items: center;
align-items: flex-end;
}
.stack > * {
grid-column-start: 1;
grid-row-start: 1;
transform: translateY(10%) scale(0.9);
z-index: 1;
width: 100%;
opacity: 0.6;
}
.stack > *:nth-child(2) {
transform: translateY(5%) scale(0.95);
z-index: 2;
opacity: 0.8;
}
.stack > *:nth-child(1) {
transform: translateY(0) scale(1);
z-index: 3;
opacity: 1;
}
.stats {
display: inline-grid;
--tw-bg-opacity: 1;
background-color: hsl(var(--b1) / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: hsl(var(--bc) / var(--tw-text-opacity));
border-radius: 1rem;
border-radius: var(--rounded-box, 1rem);
}
:where(.stats) {
grid-auto-flow: column;
overflow-x: auto;
}
.stat {
display: inline-grid;
width: 100%;
grid-template-columns: repeat(1, 1fr);
-moz-column-gap: 1rem;
column-gap: 1rem;
border-color: hsl(var(--bc) / var(--tw-border-opacity));
--tw-border-opacity: 0.1;
padding-left: 1.5rem;
padding-right: 1.5rem;
padding-top: 1rem;
padding-bottom: 1rem;
}
.stat-figure {
grid-column-start: 2;
grid-row: span 3 / span 3;
grid-row-start: 1;
align-self: center;
justify-self: center;
place-self: center;
justify-self: end;
}
.stat-title {
grid-column-start: 1;
white-space: nowrap;
color: hsl(var(--bc) / 0.6);
}
.stat-value {
grid-column-start: 1;
white-space: nowrap;
font-size: 2.25rem;
line-height: 2.5rem;
font-weight: 800;
}
.stat-desc {
grid-column-start: 1;
white-space: nowrap;
font-size: 0.75rem;
line-height: 1rem;
color: hsl(var(--bc) / 0.6);
}
.stat-actions {
grid-column-start: 1;
white-space: nowrap;
margin-top: 1rem;
}
.steps {
display: inline-grid;
grid-auto-flow: column;
overflow: hidden;
overflow-x: auto;
counter-reset: step;
grid-auto-columns: 1fr;
}
.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;
align-items: center;
justify-items: center;
place-items: center;
text-align: center;
min-width: 4rem;
}
.swap {
position: relative;
display: inline-grid;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
align-content: center;
justify-content: center;
place-content: center;
cursor: pointer;
}
.swap > * {
grid-column-start: 1;
grid-row-start: 1;
transition-duration: 300ms;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
transition-property: transform, opacity;
}
.swap input {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}
.swap .swap-on,
.swap .swap-indeterminate,
.swap input:indeterminate ~ .swap-on {
opacity: 0;
}
.swap input:checked ~ .swap-off,
.swap.swap-active .swap-off,
.swap input:indeterminate ~ .swap-off {
opacity: 0;
}
.swap input:checked ~ .swap-on,
.swap-active .swap-on,
.swap input:indeterminate ~ .swap-indeterminate {
opacity: 1;
}
.tabs {
display: flex;
flex-wrap: wrap;
align-items: flex-end;
}
.tab {
position: relative;
display: inline-flex;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
flex-wrap: wrap;
align-items: center;
justify-content: center;
text-align: center;
height: 2rem;
font-size: 0.875rem;
line-height: 1.25rem;
line-height: 2;
--tab-padding: 1rem;
--tw-text-opacity: 0.5;
--tab-color: hsla(var(--bc) / var(--tw-text-opacity, 1));
--tab-bg: hsla(var(--b1) / var(--tw-bg-opacity, 1));
--tab-border-color: hsla(var(--b3) / var(--tw-bg-opacity, 1));
color: var(--tab-color);
padding-left: 1rem;
padding-left: var(--tab-padding, 1rem);
padding-right: 1rem;
padding-right: var(--tab-padding, 1rem);
}
.table {
position: relative;
text-align: left;
}
.table th:first-child {
position: sticky;
position: -webkit-sticky;
left: 0px;
z-index: 11;
}
.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: 0.5rem;
border-radius: var(--rounded-btn, 0.5rem);
}
.toast {
position: fixed;
display: flex;
min-width: -moz-fit-content;
min-width: fit-content;
flex-direction: column;
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;
transition-duration: 300ms;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
border-radius: 1.9rem;
border-radius: var(--rounded-badge, 1.9rem);
transition: background, box-shadow 0.2s ease-in-out;
transition: background, box-shadow var(--animation-input, 0.2s) ease-in-out;
box-shadow: var(--handleoffsetcalculator) 0 0 2px var(--tglbg) inset, 0 0 0 2px var(--tglbg) inset, var(--togglehandleborder);
}
.tooltip {
position: relative;
display: inline-block;
--tooltip-offset: calc(100% + 1px + var(--tooltip-tail, 0px));
text-align: center;
--tooltip-tail: 3px;
--tooltip-color: hsl(var(--n));
--tooltip-text-color: hsl(var(--nc));
--tooltip-tail-offset: calc(100% + 1px - var(--tooltip-tail));
}
.tooltip:before {
position: absolute;
pointer-events: none;
z-index: 1;
content: var(--tw-content);
--tw-content: attr(data-tip);
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: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;
}
.tooltip-left:before {
transform: translateY(-50%);
top: 50%;
left: auto;
right: var(--tooltip-offset);
bottom: auto;
}
.tooltip-right:before {
transform: translateY(-50%);
top: 50%;
left: var(--tooltip-offset);
right: auto;
bottom: auto;
}
.alert-info {
--tw-bg-opacity: 1;
background-color: hsl(var(--in) / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: hsl(var(--nc) / var(--tw-text-opacity));
color: hsl(var(--inc, var(--nc)) / var(--tw-text-opacity));
}
.alert-success {
--tw-bg-opacity: 1;
background-color: hsl(var(--su) / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: hsl(var(--nc) / var(--tw-text-opacity));
color: hsl(var(--suc, var(--nc)) / var(--tw-text-opacity));
}
.alert-warning {
--tw-bg-opacity: 1;
background-color: hsl(var(--wa) / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: hsl(var(--nc) / var(--tw-text-opacity));
color: hsl(var(--wac, var(--nc)) / var(--tw-text-opacity));
}
.alert-error {
--tw-bg-opacity: 1;
background-color: hsl(var(--er) / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: hsl(var(--nc) / var(--tw-text-opacity));
color: hsl(var(--erc, var(--nc)) / var(--tw-text-opacity));
}
.avatar-group {
display: flex;
overflow: hidden;
}
.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));
}
.badge-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));
}
.badge-secondary {
--tw-border-opacity: 1;
border-color: hsl(var(--s) / var(--tw-border-opacity));
--tw-bg-opacity: 1;
background-color: hsl(var(--s) / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: hsl(var(--sc) / var(--tw-text-opacity));
}
.badge-accent {
--tw-border-opacity: 1;
border-color: hsl(var(--a) / var(--tw-border-opacity));
--tw-bg-opacity: 1;
background-color: hsl(var(--a) / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: hsl(var(--ac) / var(--tw-text-opacity));
}
.badge-info {
border-color: transparent;
--tw-bg-opacity: 1;
background-color: hsl(var(--in) / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: hsl(var(--nc) / var(--tw-text-opacity));
color: hsl(var(--inc, var(--nc)) / var(--tw-text-opacity));
}
.badge-success {
border-color: transparent;
--tw-bg-opacity: 1;
background-color: hsl(var(--su) / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: hsl(var(--nc) / var(--tw-text-opacity));
color: hsl(var(--suc, var(--nc)) / var(--tw-text-opacity));
}
.badge-warning {
border-color: transparent;
--tw-bg-opacity: 1;
background-color: hsl(var(--wa) / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: hsl(var(--nc) / var(--tw-text-opacity));
color: hsl(var(--wac, var(--nc)) / var(--tw-text-opacity));
}
.badge-error {
border-color: transparent;
--tw-bg-opacity: 1;
background-color: hsl(var(--er) / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: hsl(var(--nc) / var(--tw-text-opacity));
color: hsl(var(--erc, var(--nc)) / var(--tw-text-opacity));
}
.badge-ghost {
--tw-border-opacity: 1;
border-color: hsl(var(--b1) / var(--tw-border-opacity));
border-color: hsl(var(--b2, var(--b1)) / var(--tw-border-opacity));
--tw-bg-opacity: 1;
background-color: hsl(var(--b1) / var(--tw-bg-opacity));
background-color: hsl(var(--b2, var(--b1)) / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: hsl(var(--bc) / var(--tw-text-opacity));
}
.badge-outline {
border-color: currentColor;
--tw-border-opacity: 0.5;
background-color: transparent;
color: currentColor;
}
.badge-outline.badge-primary {
--tw-text-opacity: 1;
color: hsl(var(--p) / var(--tw-text-opacity));
}
.badge-outline.badge-secondary {
--tw-text-opacity: 1;
color: hsl(var(--s) / var(--tw-text-opacity));
}
.badge-outline.badge-accent {
--tw-text-opacity: 1;
color: hsl(var(--a) / var(--tw-text-opacity));
}
.badge-outline.badge-info {
--tw-text-opacity: 1;
color: hsl(var(--in) / var(--tw-text-opacity));
}
.badge-outline.badge-success {
--tw-text-opacity: 1;
color: hsl(var(--su) / var(--tw-text-opacity));
}
.badge-outline.badge-warning {
--tw-text-opacity: 1;
color: hsl(var(--wa) / var(--tw-text-opacity));
}
.badge-outline.badge-error {
--tw-text-opacity: 1;
color: hsl(var(--er) / var(--tw-text-opacity));
}
.btn-outline .badge {
--tw-border-opacity: 1;
border-color: hsl(var(--n) / var(--tw-border-opacity));
border-color: hsl(var(--nf, var(--n)) / var(--tw-border-opacity));
--tw-text-opacity: 1;
color: hsl(var(--nc) / var(--tw-text-opacity));
}
.btn-outline.btn-primary .badge {
--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-outline.btn-secondary .badge {
--tw-border-opacity: 1;
border-color: hsl(var(--s) / var(--tw-border-opacity));
--tw-bg-opacity: 1;
background-color: hsl(var(--s) / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: hsl(var(--sc) / var(--tw-text-opacity));
}
.btn-outline.btn-accent .badge {
--tw-border-opacity: 1;
border-color: hsl(var(--a) / var(--tw-border-opacity));
--tw-bg-opacity: 1;
background-color: hsl(var(--a) / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: hsl(var(--ac) / var(--tw-text-opacity));
}
.btn-outline .badge.outline {
--tw-border-opacity: 1;
border-color: hsl(var(--n) / var(--tw-border-opacity));
border-color: hsl(var(--nf, var(--n)) / var(--tw-border-opacity));
background-color: transparent;
}
.btn-outline.btn-primary .badge-outline {
--tw-border-opacity: 1;
border-color: hsl(var(--p) / var(--tw-border-opacity));
background-color: transparent;
--tw-text-opacity: 1;
color: hsl(var(--p) / var(--tw-text-opacity));
}
.btn-outline.btn-secondary .badge-outline {
--tw-border-opacity: 1;
border-color: hsl(var(--s) / var(--tw-border-opacity));
background-color: transparent;
--tw-text-opacity: 1;
color: hsl(var(--s) / var(--tw-text-opacity));
}
.btn-outline.btn-accent .badge-outline {
--tw-border-opacity: 1;
border-color: hsl(var(--a) / var(--tw-border-opacity));
background-color: transparent;
--tw-text-opacity: 1;
color: hsl(var(--a) / var(--tw-text-opacity));
}
.btn-outline.btn-info .badge-outline {
--tw-border-opacity: 1;
border-color: hsl(var(--in) / var(--tw-border-opacity));
background-color: transparent;
--tw-text-opacity: 1;
color: hsl(var(--in) / var(--tw-text-opacity));
}
.btn-outline.btn-success .badge-outline {
--tw-border-opacity: 1;
border-color: hsl(var(--su) / var(--tw-border-opacity));
background-color: transparent;
--tw-text-opacity: 1;
color: hsl(var(--su) / var(--tw-text-opacity));
}
.btn-outline.btn-warning .badge-outline {
--tw-border-opacity: 1;
border-color: hsl(var(--wa) / var(--tw-border-opacity));
background-color: transparent;
--tw-text-opacity: 1;
color: hsl(var(--wa) / var(--tw-text-opacity));
}
.btn-outline.btn-error .badge-outline {
--tw-border-opacity: 1;
border-color: hsl(var(--er) / var(--tw-border-opacity));
background-color: transparent;
--tw-text-opacity: 1;
color: hsl(var(--er) / var(--tw-text-opacity));
}
.btn-outline:hover .badge {
--tw-border-opacity: 1;
border-color: hsl(var(--b1) / var(--tw-border-opacity));
border-color: hsl(var(--b2, var(--b1)) / var(--tw-border-opacity));
--tw-bg-opacity: 1;
background-color: hsl(var(--b1) / var(--tw-bg-opacity));
background-color: hsl(var(--b2, var(--b1)) / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: hsl(var(--bc) / var(--tw-text-opacity));
}
.btn-outline:hover .badge.outline {
--tw-border-opacity: 1;
border-color: hsl(var(--b1) / var(--tw-border-opacity));
border-color: hsl(var(--b2, var(--b1)) / var(--tw-border-opacity));
--tw-text-opacity: 1;
color: hsl(var(--nc) / var(--tw-text-opacity));
}
.btn-outline.btn-primary:hover .badge {
--tw-border-opacity: 1;
border-color: hsl(var(--pc) / var(--tw-border-opacity));
--tw-bg-opacity: 1;
background-color: hsl(var(--pc) / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: hsl(var(--p) / var(--tw-text-opacity));
}
.btn-outline.btn-primary:hover .badge.outline {
--tw-border-opacity: 1;
border-color: hsl(var(--pc) / var(--tw-border-opacity));
--tw-bg-opacity: 1;
background-color: hsl(var(--p) / var(--tw-bg-opacity));
background-color: hsl(var(--pf, var(--p)) / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: hsl(var(--pc) / var(--tw-text-opacity));
}
.btn-outline.btn-secondary:hover .badge {
--tw-border-opacity: 1;
border-color: hsl(var(--sc) / var(--tw-border-opacity));
--tw-bg-opacity: 1;
background-color: hsl(var(--sc) / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: hsl(var(--s) / var(--tw-text-opacity));
}
.btn-outline.btn-secondary:hover .badge.outline {
--tw-border-opacity: 1;
border-color: hsl(var(--sc) / var(--tw-border-opacity));
--tw-bg-opacity: 1;
background-color: hsl(var(--s) / var(--tw-bg-opacity));
background-color: hsl(var(--sf, var(--s)) / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: hsl(var(--sc) / var(--tw-text-opacity));
}
.btn-outline.btn-accent:hover .badge {
--tw-border-opacity: 1;
border-color: hsl(var(--ac) / var(--tw-border-opacity));
--tw-bg-opacity: 1;
background-color: hsl(var(--ac) / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: hsl(var(--a) / var(--tw-text-opacity));
}
.btn-outline.btn-accent:hover .badge.outline {
--tw-border-opacity: 1;
border-color: hsl(var(--ac) / var(--tw-border-opacity));
--tw-bg-opacity: 1;
background-color: hsl(var(--a) / var(--tw-bg-opacity));
background-color: hsl(var(--af, var(--a)) / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: hsl(var(--ac) / var(--tw-text-opacity));
}
.btm-nav>*:not(.active) {
padding-top: 0.125rem;
}
.btm-nav>*:where(.active) {
border-top-width: 2px;
--tw-bg-opacity: 1;
background-color: hsl(var(--b1) / var(--tw-bg-opacity));
}
.btm-nav>*.disabled,
.btm-nav>*.disabled:hover,
.btm-nav>*[disabled],
.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;
}
.btm-nav>* .label {
font-size: 1rem;
line-height: 1.5rem;
}
.breadcrumbs > ul > li > a:focus, .breadcrumbs > ol > li > a:focus {
outline: 2px solid transparent;
outline-offset: 2px;
}
.breadcrumbs > ul > li > a.focus-visible, .breadcrumbs > ol > li > a.focus-visible {
outline: 2px solid currentColor;
outline-offset: 2px;
}
.breadcrumbs > ul > li > a:focus-visible, .breadcrumbs > ol > li > a:focus-visible {
outline: 2px solid currentColor;
outline-offset: 2px;
}
.breadcrumbs > ul > li + *:before, .breadcrumbs > ol > li + *:before {
content: "";
margin-left: 0.5rem;
margin-right: 0.75rem;
display: block;
height: 0.375rem;
width: 0.375rem;
--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));
opacity: 0.4;
border-top: 1px solid;
border-right: 1px solid;
background-color: transparent;
}
[dir="rtl"] .breadcrumbs > ul > li + *:before,
[dir="rtl"] .breadcrumbs > ol > li + *:before {
--tw-rotate: -135deg;
}
.btn:active:hover,
.btn:active:focus {
animation: none;
transform: scale(0.95);
transform: scale(var(--btn-focus-scale, 0.95));
}
.btn:hover,
.btn-active {
--tw-border-opacity: 1;
border-color: hsl(var(--n) / var(--tw-border-opacity));
border-color: hsl(var(--nf, var(--n)) / var(--tw-border-opacity));
--tw-bg-opacity: 1;
background-color: hsl(var(--n) / var(--tw-bg-opacity));
background-color: hsl(var(--nf, var(--n)) / var(--tw-bg-opacity));
}
.btn.focus-visible {
outline: 2px solid hsl(var(--nf));
outline-offset: 2px;
}
.btn:focus-visible {
outline: 2px solid hsl(var(--nf));
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));
}
.btn-primary:hover,
.btn-primary.btn-active {
--tw-border-opacity: 1;
border-color: hsl(var(--p) / var(--tw-border-opacity));
border-color: hsl(var(--pf, var(--p)) / var(--tw-border-opacity));
--tw-bg-opacity: 1;
background-color: hsl(var(--p) / var(--tw-bg-opacity));
background-color: hsl(var(--pf, var(--p)) / var(--tw-bg-opacity));
}
.btn-primary.focus-visible {
outline: 2px solid hsl(var(--p));
}
.btn-primary:focus-visible {
outline: 2px solid hsl(var(--p));
}
.btn-secondary {
--tw-border-opacity: 1;
border-color: hsl(var(--s) / var(--tw-border-opacity));
--tw-bg-opacity: 1;
background-color: hsl(var(--s) / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: hsl(var(--sc) / var(--tw-text-opacity));
}
.btn-secondary:hover,
.btn-secondary.btn-active {
--tw-border-opacity: 1;
border-color: hsl(var(--s) / var(--tw-border-opacity));
border-color: hsl(var(--sf, var(--s)) / var(--tw-border-opacity));
--tw-bg-opacity: 1;
background-color: hsl(var(--s) / var(--tw-bg-opacity));
background-color: hsl(var(--sf, var(--s)) / var(--tw-bg-opacity));
}
.btn-secondary.focus-visible {
outline: 2px solid hsl(var(--s));
}
.btn-secondary:focus-visible {
outline: 2px solid hsl(var(--s));
}
.btn-accent {
--tw-border-opacity: 1;
border-color: hsl(var(--a) / var(--tw-border-opacity));
--tw-bg-opacity: 1;
background-color: hsl(var(--a) / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: hsl(var(--ac) / var(--tw-text-opacity));
}
.btn-accent:hover,
.btn-accent.btn-active {
--tw-border-opacity: 1;
border-color: hsl(var(--a) / var(--tw-border-opacity));
border-color: hsl(var(--af, var(--a)) / var(--tw-border-opacity));
--tw-bg-opacity: 1;
background-color: hsl(var(--a) / var(--tw-bg-opacity));
background-color: hsl(var(--af, var(--a)) / var(--tw-bg-opacity));
}
.btn-accent.focus-visible {
outline: 2px solid hsl(var(--a));
}
.btn-accent:focus-visible {
outline: 2px solid hsl(var(--a));
}
.btn-info {
--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(--nc) / var(--tw-text-opacity));
color: hsl(var(--inc, var(--nc)) / var(--tw-text-opacity));
}
.btn-info:hover,
.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));
}
.btn-info.focus-visible {
outline: 2px solid hsl(var(--in));
}
.btn-info:focus-visible {
outline: 2px solid hsl(var(--in));
}
.btn-success {
--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(--nc) / var(--tw-text-opacity));
color: hsl(var(--suc, var(--nc)) / var(--tw-text-opacity));
}
.btn-success:hover,
.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));
}
.btn-success.focus-visible {
outline: 2px solid hsl(var(--su));
}
.btn-success:focus-visible {
outline: 2px solid hsl(var(--su));
}
.btn-warning {
--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(--nc) / var(--tw-text-opacity));
color: hsl(var(--wac, var(--nc)) / var(--tw-text-opacity));
}
.btn-warning:hover,
.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));
}
.btn-warning.focus-visible {
outline: 2px solid hsl(var(--wa));
}
.btn-warning:focus-visible {
outline: 2px solid hsl(var(--wa));
}
.btn-error {
--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(--nc) / var(--tw-text-opacity));
color: hsl(var(--erc, var(--nc)) / var(--tw-text-opacity));
}
.btn-error:hover,
.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));
}
.btn-error.focus-visible {
outline: 2px solid hsl(var(--er));
}
.btn-error:focus-visible {
outline: 2px solid hsl(var(--er));
}
.btn.glass:hover,
.btn.glass.btn-active {
--glass-opacity: 25%;
--glass-border-opacity: 15%;
}
.btn.glass.focus-visible {
outline: 2px solid currentColor;
}
.btn.glass:focus-visible {
outline: 2px solid currentColor;
}
.btn-ghost {
border-width: 1px;
border-color: transparent;
background-color: transparent;
color: currentColor;
}
.btn-ghost:hover,
.btn-ghost.btn-active {
--tw-border-opacity: 0;
background-color: hsl(var(--bc) / var(--tw-bg-opacity));
--tw-bg-opacity: 0.2;
}
.btn-ghost.focus-visible {
outline: 2px solid currentColor;
}
.btn-ghost:focus-visible {
outline: 2px solid currentColor;
}
.btn-link {
border-color: transparent;
background-color: transparent;
--tw-text-opacity: 1;
color: hsl(var(--p) / var(--tw-text-opacity));
text-decoration-line: underline;
}
.btn-link:hover,
.btn-link.btn-active {
border-color: transparent;
background-color: transparent;
text-decoration-line: underline;
}
.btn-link.focus-visible {
outline: 2px solid currentColor;
}
.btn-link:focus-visible {
outline: 2px solid currentColor;
}
.btn-outline {
border-color: currentColor;
background-color: transparent;
--tw-text-opacity: 1;
color: hsl(var(--bc) / var(--tw-text-opacity));
}
.btn-outline:hover,
.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:hover,
.btn-outline.btn-primary.btn-active {
--tw-border-opacity: 1;
border-color: hsl(var(--p) / var(--tw-border-opacity));
border-color: hsl(var(--pf, var(--p)) / var(--tw-border-opacity));
--tw-bg-opacity: 1;
background-color: hsl(var(--p) / var(--tw-bg-opacity));
background-color: hsl(var(--pf, var(--p)) / 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:hover,
.btn-outline.btn-secondary.btn-active {
--tw-border-opacity: 1;
border-color: hsl(var(--s) / var(--tw-border-opacity));
border-color: hsl(var(--sf, var(--s)) / var(--tw-border-opacity));
--tw-bg-opacity: 1;
background-color: hsl(var(--s) / var(--tw-bg-opacity));
background-color: hsl(var(--sf, var(--s)) / 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:hover,
.btn-outline.btn-accent.btn-active {
--tw-border-opacity: 1;
border-color: hsl(var(--a) / var(--tw-border-opacity));
border-color: hsl(var(--af, var(--a)) / var(--tw-border-opacity));
--tw-bg-opacity: 1;
background-color: hsl(var(--a) / var(--tw-bg-opacity));
background-color: hsl(var(--af, var(--a)) / 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:hover,
.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(--nc) / var(--tw-text-opacity));
color: hsl(var(--suc, var(--nc)) / var(--tw-text-opacity));
}
.btn-outline.btn-info {
--tw-text-opacity: 1;
color: hsl(var(--in) / var(--tw-text-opacity));
}
.btn-outline.btn-info:hover,
.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(--nc) / var(--tw-text-opacity));
color: hsl(var(--inc, var(--nc)) / var(--tw-text-opacity));
}
.btn-outline.btn-warning {
--tw-text-opacity: 1;
color: hsl(var(--wa) / var(--tw-text-opacity));
}
.btn-outline.btn-warning:hover,
.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(--nc) / var(--tw-text-opacity));
color: hsl(var(--wac, var(--nc)) / var(--tw-text-opacity));
}
.btn-outline.btn-error {
--tw-text-opacity: 1;
color: hsl(var(--er) / var(--tw-text-opacity));
}
.btn-outline.btn-error:hover,
.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(--nc) / var(--tw-text-opacity));
color: hsl(var(--erc, var(--nc)) / var(--tw-text-opacity));
}
.btn-disabled,
.btn-disabled:hover,
.btn[disabled],
.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.loading.btn-square:before,
.btn.loading.btn-circle:before {
margin-right: 0px;
}
.btn.\!loading.btn-square:before,
.btn.\!loading.btn-circle:before {
margin-right: 0px !important;
}
.btn.loading.btn-xl:before,
.btn.loading.btn-lg:before {
height: 1.25rem;
width: 1.25rem;
}
.btn.\!loading.btn-xl:before,
.btn.\!loading.btn-lg:before {
height: 1.25rem !important;
width: 1.25rem !important;
}
.btn.loading.btn-sm:before,
.btn.loading.btn-xs:before {
height: 0.75rem;
width: 0.75rem;
}
.btn.\!loading.btn-sm:before,
.btn.\!loading.btn-xs:before {
height: 0.75rem !important;
width: 0.75rem !important;
}
.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: 2px solid hsl(var(--p));
}
.btn-group > input[type="radio"]:checked.btn:focus-visible, .btn-group > .btn-active:focus-visible {
outline: 2px solid hsl(var(--p));
}
@keyframes button-pop {
0% {
transform: scale(0.95);
transform: scale(var(--btn-focus-scale, 0.95));
}
40% {
transform: scale(1.02);
}
100% {
transform: scale(1);
}
}
[dir="ltr"] .card :where(figure:first-child) {
border-top-left-radius: inherit;
}
[dir="rtl"] .card :where(figure:first-child) {
border-top-right-radius: inherit;
}
[dir="ltr"] .card :where(figure:first-child) {
border-top-right-radius: inherit;
}
[dir="rtl"] .card :where(figure:first-child) {
border-top-left-radius: inherit;
}
[dir="ltr"] .card :where(figure:first-child) {
border-bottom-left-radius: 0;
border-bottom-left-radius: initial;
}
[dir="rtl"] .card :where(figure:first-child) {
border-bottom-right-radius: 0;
border-bottom-right-radius: initial;
}
[dir="ltr"] .card :where(figure:first-child) {
border-bottom-right-radius: 0;
border-bottom-right-radius: initial;
}
[dir="rtl"] .card :where(figure:first-child) {
border-bottom-left-radius: 0;
border-bottom-left-radius: initial;
}
.card :where(figure:first-child) {
overflow: hidden;
}
[dir="ltr"] .card :where(figure:last-child) {
border-top-left-radius: 0;
border-top-left-radius: initial;
}
[dir="rtl"] .card :where(figure:last-child) {
border-top-right-radius: 0;
border-top-right-radius: initial;
}
[dir="ltr"] .card :where(figure:last-child) {
border-top-right-radius: 0;
border-top-right-radius: initial;
}
[dir="rtl"] .card :where(figure:last-child) {
border-top-left-radius: 0;
border-top-left-radius: initial;
}
[dir="ltr"] .card :where(figure:last-child) {
border-bottom-left-radius: inherit;
}
[dir="rtl"] .card :where(figure:last-child) {
border-bottom-right-radius: inherit;
}
[dir="ltr"] .card :where(figure:last-child) {
border-bottom-right-radius: inherit;
}
[dir="rtl"] .card :where(figure:last-child) {
border-bottom-left-radius: inherit;
}
.card :where(figure:last-child) {
overflow: hidden;
}
.card.focus-visible {
outline: 2px solid currentColor;
outline-offset: 2px;
}
.card:focus-visible {
outline: 2px solid currentColor;
outline-offset: 2px;
}
.card.bordered {
border-width: 1px;
--tw-border-opacity: 1;
border-color: hsl(var(--b1) / var(--tw-border-opacity));
border-color: hsl(var(--b2, var(--b1)) / var(--tw-border-opacity));
}
.card-bordered {
border-width: 1px;
--tw-border-opacity: 1;
border-color: hsl(var(--b1) / var(--tw-border-opacity));
border-color: hsl(var(--b2, var(--b1)) / var(--tw-border-opacity));
}
.card.compact .card-body {
padding: 1rem;
font-size: 0.875rem;
line-height: 1.25rem;
}
.card-title {
display: flex;
align-items: center;
gap: 0.5rem;
font-size: 1.25rem;
line-height: 1.75rem;
font-weight: 600;
}
.card.image-full :where(figure) {
overflow: hidden;
border-radius: inherit;
}
.carousel::-webkit-scrollbar {
display: none;
}
.chat-bubble-primary {
--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));
}
.chat-bubble-secondary {
--tw-bg-opacity: 1;
background-color: hsl(var(--s) / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: hsl(var(--sc) / var(--tw-text-opacity));
}
.chat-bubble-accent {
--tw-bg-opacity: 1;
background-color: hsl(var(--a) / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: hsl(var(--ac) / var(--tw-text-opacity));
}
.chat-bubble-info {
--tw-bg-opacity: 1;
background-color: hsl(var(--in) / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: hsl(var(--nc) / var(--tw-text-opacity));
color: hsl(var(--inc, var(--nc)) / var(--tw-text-opacity));
}
.chat-bubble-success {
--tw-bg-opacity: 1;
background-color: hsl(var(--su) / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: hsl(var(--nc) / var(--tw-text-opacity));
color: hsl(var(--suc, var(--nc)) / var(--tw-text-opacity));
}
.chat-bubble-warning {
--tw-bg-opacity: 1;
background-color: hsl(var(--wa) / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: hsl(var(--nc) / var(--tw-text-opacity));
color: hsl(var(--wac, var(--nc)) / var(--tw-text-opacity));
}
.chat-bubble-error {
--tw-bg-opacity: 1;
background-color: hsl(var(--er) / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: hsl(var(--nc) / var(--tw-text-opacity));
color: hsl(var(--erc, var(--nc)) / var(--tw-text-opacity));
}
.checkbox.focus-visible {
outline: 2px solid hsl(var(--bc));
outline-offset: 2px;
}
.checkbox:focus-visible {
outline: 2px solid hsl(var(--bc));
outline-offset: 2px;
}
.\!checkbox.focus-visible {
outline: 2px solid hsl(var(--bc)) !important;
outline-offset: 2px !important;
}
.\!checkbox:focus-visible {
outline: 2px solid hsl(var(--bc)) !important;
outline-offset: 2px !important;
}
.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 0.2s ease-in-out;
animation: checkmark var(--animation-input, 0.2s) ease-in-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:checked,
.\!checkbox[checked="true"],
.\!checkbox[aria-checked="true"] {
--tw-bg-opacity: 1 !important;
background-color: hsl(var(--bc) / var(--tw-bg-opacity)) !important;
background-repeat: no-repeat !important;
animation: checkmark 0.2s ease-in-out !important;
animation: checkmark var(--animation-input, 0.2s) ease-in-out !important;
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%) !important;
}
.checkbox:indeterminate {
--tw-bg-opacity: 1;
background-color: hsl(var(--bc) / var(--tw-bg-opacity));
background-repeat: no-repeat;
animation: checkmark 0.2s ease-in-out;
animation: checkmark var(--animation-input, 0.2s) ease-in-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:indeterminate {
--tw-bg-opacity: 1 !important;
background-color: hsl(var(--bc) / var(--tw-bg-opacity)) !important;
background-repeat: no-repeat !important;
animation: checkmark 0.2s ease-in-out !important;
animation: checkmark var(--animation-input, 0.2s) ease-in-out !important;
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%) !important;
}
.checkbox-primary {
--chkbg: var(--p);
--chkfg: var(--pc);
--tw-border-opacity: 1;
border-color: hsl(var(--p) / var(--tw-border-opacity));
}
.checkbox-primary:hover {
--tw-border-opacity: 1;
border-color: hsl(var(--p) / var(--tw-border-opacity));
}
.checkbox-primary.focus-visible {
outline: 2px solid hsl(var(--p));
}
.checkbox-primary:focus-visible {
outline: 2px solid hsl(var(--p));
}
.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-secondary {
--chkbg: var(--s);
--chkfg: var(--sc);
--tw-border-opacity: 1;
border-color: hsl(var(--s) / var(--tw-border-opacity));
}
.checkbox-secondary:hover {
--tw-border-opacity: 1;
border-color: hsl(var(--s) / var(--tw-border-opacity));
}
.checkbox-secondary.focus-visible {
outline: 2px solid hsl(var(--s));
}
.checkbox-secondary:focus-visible {
outline: 2px solid hsl(var(--s));
}
.checkbox-secondary:checked,
.checkbox-secondary[checked="true"],
.checkbox-secondary[aria-checked="true"] {
--tw-border-opacity: 1;
border-color: hsl(var(--s) / var(--tw-border-opacity));
--tw-bg-opacity: 1;
background-color: hsl(var(--s) / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: hsl(var(--sc) / var(--tw-text-opacity));
}
.checkbox-accent {
--chkbg: var(--a);
--chkfg: var(--ac);
--tw-border-opacity: 1;
border-color: hsl(var(--a) / var(--tw-border-opacity));
}
.checkbox-accent:hover {
--tw-border-opacity: 1;
border-color: hsl(var(--a) / var(--tw-border-opacity));
}
.checkbox-accent.focus-visible {
outline: 2px solid hsl(var(--a));
}
.checkbox-accent:focus-visible {
outline: 2px solid hsl(var(--a));
}
.checkbox-accent:checked,
.checkbox-accent[checked="true"],
.checkbox-accent[aria-checked="true"] {
--tw-border-opacity: 1;
border-color: hsl(var(--a) / var(--tw-border-opacity));
--tw-bg-opacity: 1;
background-color: hsl(var(--a) / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: hsl(var(--ac) / var(--tw-text-opacity));
}
.checkbox-success {
--chkbg: var(--su);
--chkfg: var(--suc);
--tw-border-opacity: 1;
border-color: hsl(var(--su) / var(--tw-border-opacity));
}
.checkbox-success:hover {
--tw-border-opacity: 1;
border-color: hsl(var(--su) / var(--tw-border-opacity));
}
.checkbox-success.focus-visible {
outline: 2px solid hsl(var(--su));
}
.checkbox-success:focus-visible {
outline: 2px solid hsl(var(--su));
}
.checkbox-success:checked,
.checkbox-success[checked="true"],
.checkbox-success[aria-checked=true] {
--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(--nc) / var(--tw-text-opacity));
color: hsl(var(--suc, var(--nc)) / var(--tw-text-opacity));
}
.checkbox-warning {
--chkbg: var(--wa);
--chkfg: var(--wac);
--tw-border-opacity: 1;
border-color: hsl(var(--wa) / var(--tw-border-opacity));
}
.checkbox-warning:hover {
--tw-border-opacity: 1;
border-color: hsl(var(--wa) / var(--tw-border-opacity));
}
.checkbox-warning.focus-visible {
outline: 2px solid hsl(var(--wa));
}
.checkbox-warning:focus-visible {
outline: 2px solid hsl(var(--wa));
}
.checkbox-warning:checked,
.checkbox-warning[checked="true"],
.checkbox-warning[aria-checked=true] {
--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(--nc) / var(--tw-text-opacity));
color: hsl(var(--wac, var(--nc)) / var(--tw-text-opacity));
}
.checkbox-info {
--chkbg: var(--in);
--chkfg: var(--inc);
--tw-border-opacity: 1;
border-color: hsl(var(--in) / var(--tw-border-opacity));
}
.checkbox-info:hover {
--tw-border-opacity: 1;
border-color: hsl(var(--in) / var(--tw-border-opacity));
}
.checkbox-info.focus-visible {
outline: 2px solid hsl(var(--in));
}
.checkbox-info:focus-visible {
outline: 2px solid hsl(var(--in));
}
.checkbox-info:checked,
.checkbox-info[checked="true"],
.checkbox-info[aria-checked=true] {
--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(--nc) / var(--tw-text-opacity));
color: hsl(var(--inc, var(--nc)) / var(--tw-text-opacity));
}
.checkbox-error {
--chkbg: var(--er);
--chkfg: var(--erc);
--tw-border-opacity: 1;
border-color: hsl(var(--er) / var(--tw-border-opacity));
}
.checkbox-error:hover {
--tw-border-opacity: 1;
border-color: hsl(var(--er) / var(--tw-border-opacity));
}
.checkbox-error.focus-visible {
outline: 2px solid hsl(var(--er));
}
.checkbox-error:focus-visible {
outline: 2px solid hsl(var(--er));
}
.checkbox-error:checked,
.checkbox-error[checked="true"],
.checkbox-error[aria-checked=true] {
--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(--nc) / var(--tw-text-opacity));
color: hsl(var(--erc, var(--nc)) / 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;
}
.\!checkbox:disabled {
cursor: not-allowed !important;
border-color: transparent !important;
--tw-bg-opacity: 1 !important;
background-color: hsl(var(--bc) / var(--tw-bg-opacity)) !important;
opacity: 0.2 !important;
}
@keyframes checkmark {
0% {
background-position-y: 5px;
}
50% {
background-position-y: -2px;
}
100% {
background-position-y: 0;
}
}
.checkbox-mark {
display: none;
}
[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%);
}
[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%) !important;
}
.collapse.focus-visible {
outline: 2px solid hsl(var(--nf));
outline-offset: 2px;
}
.collapse:focus-visible {
outline: 2px solid hsl(var(--nf));
outline-offset: 2px;
}
.collapse-arrow .collapse-title:after {
position: absolute;
display: block;
height: 0.5rem;
width: 0.5rem;
--tw-translate-y: -100%;
--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));
transition-property: all;
transition-duration: 150ms;
transition-duration: 0.2s;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
top: 50%;
right: 1.4rem;
content: "";
transform-origin: 75% 75%;
box-shadow: 2px 2px;
pointer-events: none;
}
[dir="rtl"] .collapse-arrow .collapse-title:after {
--tw-rotate: -45deg;
}
.collapse-plus .collapse-title:after {
position: absolute;
display: block;
height: 0.5rem;
width: 0.5rem;
transition-property: all;
transition-duration: 300ms;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
top: 0.9rem;
right: 1.4rem;
content: "+";
pointer-events: none;
}
.collapse:not(.collapse-open):not(.collapse-close) input[type="checkbox"],
.collapse:not(.collapse-open):not(.collapse-close) .collapse-title {
cursor: pointer;
}
.collapse:focus:not(.collapse-open):not(.collapse-close) .collapse-title {
cursor: inherit;
}
.collapse-title {
position: relative;
}
:where(.collapse > input[type="checkbox"]) {
z-index: 1;
}
.collapse-title,
:where(.collapse > input[type="checkbox"]) {
width: 100%;
padding: 1rem;
padding-right: 3rem;
min-height: 3.75rem;
transition: background-color 0.2s ease-in-out;
}
.collapse-open :where(.collapse-content),
.collapse:focus:not(.collapse-close) :where(.collapse-content),
.collapse:not(.collapse-close) :where(input[type="checkbox"]:checked ~ .collapse-content) {
padding-bottom: 1rem;
transition: padding 0.2s ease-in-out, background-color 0.2s ease-in-out;
}
.collapse-open.collapse-arrow .collapse-title:after,
.collapse-arrow:focus:not(.collapse-close) .collapse-title:after,
.collapse-arrow:not(.collapse-close) input[type="checkbox"]:checked ~ .collapse-title:after {
--tw-translate-y: -50%;
--tw-rotate: 225deg;
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));
}
[dir="rtl"] .collapse-open.collapse-arrow .collapse-title:after,
[dir="rtl"] .collapse-arrow:focus:not(.collapse-close) .collapse-title:after,
[dir="rtl"] .collapse-arrow:not(.collapse-close) input[type="checkbox"]:checked ~ .collapse-title:after {
--tw-rotate: 135deg;
}
.collapse-open.collapse-plus .collapse-title:after,
.collapse-plus:focus:not(.collapse-close) .collapse-title:after,
.collapse-plus:not(.collapse-close) input[type="checkbox"]:checked ~ .collapse-title:after {
content: "−";
}
.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;
}
.drawer.drawer-end > .drawer-toggle:checked ~ .drawer-content {
--tw-translate-x: -0.5rem;
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));
}
.drawer-toggle:checked ~ .drawer-content {
--tw-translate-x: 0.5rem;
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));
}
.drawer-toggle.focus-visible ~ .drawer-content .drawer-button {
outline: 2px solid hsl(var(--nf));
outline-offset: 2px;
}
.drawer-toggle:focus-visible ~ .drawer-content .drawer-button {
outline: 2px solid hsl(var(--nf));
outline-offset: 2px;
}
.drawer-toggle.focus-visible ~ .drawer-content .drawer-button.btn-primary {
outline: 2px solid hsl(var(--p));
}
.drawer-toggle:focus-visible ~ .drawer-content .drawer-button.btn-primary {
outline: 2px solid hsl(var(--p));
}
.drawer-toggle.focus-visible ~ .drawer-content .drawer-button.btn-secondary {
outline: 2px solid hsl(var(--s));
}
.drawer-toggle:focus-visible ~ .drawer-content .drawer-button.btn-secondary {
outline: 2px solid hsl(var(--s));
}
.drawer-toggle.focus-visible ~ .drawer-content .drawer-button.btn-accent {
outline: 2px solid hsl(var(--a));
}
.drawer-toggle:focus-visible ~ .drawer-content .drawer-button.btn-accent {
outline: 2px solid hsl(var(--a));
}
.drawer-toggle.focus-visible ~ .drawer-content .drawer-button.btn-info {
outline: 2px solid hsl(var(--in));
}
.drawer-toggle:focus-visible ~ .drawer-content .drawer-button.btn-info {
outline: 2px solid hsl(var(--in));
}
.drawer-toggle.focus-visible ~ .drawer-content .drawer-button.btn-success {
outline: 2px solid hsl(var(--su));
}
.drawer-toggle:focus-visible ~ .drawer-content .drawer-button.btn-success {
outline: 2px solid hsl(var(--su));
}
.drawer-toggle.focus-visible ~ .drawer-content .drawer-button.btn-warning {
outline: 2px solid hsl(var(--wa));
}
.drawer-toggle:focus-visible ~ .drawer-content .drawer-button.btn-warning {
outline: 2px solid hsl(var(--wa));
}
.drawer-toggle.focus-visible ~ .drawer-content .drawer-button.btn-error {
outline: 2px solid hsl(var(--er));
}
.drawer-toggle:focus-visible ~ .drawer-content .drawer-button.btn-error {
outline: 2px solid hsl(var(--er));
}
.drawer-toggle.focus-visible ~ .drawer-content .drawer-button.glass {
outline: 2px solid currentColor;
}
.drawer-toggle:focus-visible ~ .drawer-content .drawer-button.glass {
outline: 2px solid currentColor;
}
.drawer-toggle.focus-visible ~ .drawer-content .drawer-button.btn-ghost {
outline: 2px solid currentColor;
}
.drawer-toggle:focus-visible ~ .drawer-content .drawer-button.btn-ghost {
outline: 2px solid currentColor;
}
.drawer-toggle.focus-visible ~ .drawer-content .drawer-button.btn-link {
outline: 2px solid currentColor;
}
.drawer-toggle:focus-visible ~ .drawer-content .drawer-button.btn-link {
outline: 2px solid currentColor;
}
.dropdown.dropdown-open .dropdown-content,
.dropdown.dropdown-hover:hover .dropdown-content,
.dropdown:focus .dropdown-content,
.dropdown[focus-within] .dropdown-content {
--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));
}
.dropdown.dropdown-open .dropdown-content,
.dropdown.dropdown-hover:hover .dropdown-content,
.dropdown:focus .dropdown-content,
.dropdown:focus-within .dropdown-content {
--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));
}
.file-input-bordered {
--tw-border-opacity: 0.2;
}
.file-input:focus {
outline: 2px solid hsla(var(--bc) / 0.2);
outline-offset: 2px;
}
.file-input-ghost {
--tw-bg-opacity: 0.05;
}
.file-input-ghost:focus {
--tw-bg-opacity: 1;
--tw-text-opacity: 1;
color: hsl(var(--bc) / var(--tw-text-opacity));
box-shadow: none;
}
.file-input-ghost::file-selector-button {
border-width: 1px;
border-color: transparent;
background-color: transparent;
color: currentColor;
}
.file-input-primary {
--tw-border-opacity: 1;
border-color: hsl(var(--p) / var(--tw-border-opacity));
}
.file-input-primary:focus {
outline: 2px solid hsl(var(--p));
}
.file-input-primary::file-selector-button {
--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));
}
.file-input-secondary {
--tw-border-opacity: 1;
border-color: hsl(var(--s) / var(--tw-border-opacity));
}
.file-input-secondary:focus {
outline: 2px solid hsl(var(--s));
}
.file-input-secondary::file-selector-button {
--tw-border-opacity: 1;
border-color: hsl(var(--s) / var(--tw-border-opacity));
--tw-bg-opacity: 1;
background-color: hsl(var(--s) / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: hsl(var(--sc) / var(--tw-text-opacity));
}
.file-input-accent {
--tw-border-opacity: 1;
border-color: hsl(var(--a) / var(--tw-border-opacity));
}
.file-input-accent:focus {
outline: 2px solid hsl(var(--a));
}
.file-input-accent::file-selector-button {
--tw-border-opacity: 1;
border-color: hsl(var(--a) / var(--tw-border-opacity));
--tw-bg-opacity: 1;
background-color: hsl(var(--a) / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: hsl(var(--ac) / var(--tw-text-opacity));
}
.file-input-info {
--tw-border-opacity: 1;
border-color: hsl(var(--in) / var(--tw-border-opacity));
}
.file-input-info:focus {
outline: 2px solid hsl(var(--in));
}
.file-input-info::file-selector-button {
--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(--nc) / var(--tw-text-opacity));
color: hsl(var(--inc, var(--nc)) / var(--tw-text-opacity));
}
.file-input-success {
--tw-border-opacity: 1;
border-color: hsl(var(--su) / var(--tw-border-opacity));
}
.file-input-success:focus {
outline: 2px solid hsl(var(--su));
}
.file-input-success::file-selector-button {
--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(--nc) / var(--tw-text-opacity));
color: hsl(var(--suc, var(--nc)) / var(--tw-text-opacity));
}
.file-input-warning {
--tw-border-opacity: 1;
border-color: hsl(var(--wa) / var(--tw-border-opacity));
}
.file-input-warning:focus {
outline: 2px solid hsl(var(--wa));
}
.file-input-warning::file-selector-button {
--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(--nc) / var(--tw-text-opacity));
color: hsl(var(--wac, var(--nc)) / var(--tw-text-opacity));
}
.file-input-error {
--tw-border-opacity: 1;
border-color: hsl(var(--er) / var(--tw-border-opacity));
}
.file-input-error:focus {
outline: 2px solid hsl(var(--er));
}
.file-input-error::file-selector-button {
--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(--nc) / var(--tw-text-opacity));
color: hsl(var(--erc, var(--nc)) / var(--tw-text-opacity));
}
.file-input-disabled,
.file-input[disabled] {
cursor: not-allowed;
--tw-border-opacity: 1;
border-color: hsl(var(--b1) / var(--tw-border-opacity));
border-color: hsl(var(--b2, var(--b1)) / var(--tw-border-opacity));
--tw-bg-opacity: 1;
background-color: hsl(var(--b1) / var(--tw-bg-opacity));
background-color: hsl(var(--b2, var(--b1)) / var(--tw-bg-opacity));
--tw-text-opacity: 0.2;
}
.file-input-disabled::-moz-placeholder, .file-input[disabled]::-moz-placeholder {
color: hsl(var(--bc) / var(--tw-placeholder-opacity));
--tw-placeholder-opacity: 0.2;
}
.file-input-disabled::placeholder,
.file-input[disabled]::placeholder {
color: hsl(var(--bc) / var(--tw-placeholder-opacity));
--tw-placeholder-opacity: 0.2;
}
.file-input-disabled::file-selector-button, .file-input[disabled]::file-selector-button {
--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;
}
.footer-title {
margin-bottom: 0.5rem;
font-weight: 700;
text-transform: uppercase;
opacity: 0.5;
}
.label-text {
font-size: 0.875rem;
line-height: 1.25rem;
--tw-text-opacity: 1;
color: hsl(var(--bc) / var(--tw-text-opacity));
}
.label-text-alt {
font-size: 0.75rem;
line-height: 1rem;
--tw-text-opacity: 1;
color: hsl(var(--bc) / var(--tw-text-opacity));
}
.label a:hover {
--tw-text-opacity: 1;
color: hsl(var(--bc) / var(--tw-text-opacity));
}
.input[list]::-webkit-calendar-picker-indicator {
line-height: 1em;
}
.input-bordered {
--tw-border-opacity: 0.2;
}
.input:focus {
outline: 2px solid hsla(var(--bc) / 0.2);
outline-offset: 2px;
}
.input-ghost {
--tw-bg-opacity: 0.05;
}
.input-ghost:focus {
--tw-bg-opacity: 1;
--tw-text-opacity: 1;
color: hsl(var(--bc) / var(--tw-text-opacity));
box-shadow: none;
}
.input-primary {
--tw-border-opacity: 1;
border-color: hsl(var(--p) / var(--tw-border-opacity));
}
.input-primary:focus {
outline: 2px solid hsl(var(--p));
}
.input-secondary {
--tw-border-opacity: 1;
border-color: hsl(var(--s) / var(--tw-border-opacity));
}
.input-secondary:focus {
outline: 2px solid hsl(var(--s));
}
.input-accent {
--tw-border-opacity: 1;
border-color: hsl(var(--a) / var(--tw-border-opacity));
}
.input-accent:focus {
outline: 2px solid hsl(var(--a));
}
.input-info {
--tw-border-opacity: 1;
border-color: hsl(var(--in) / var(--tw-border-opacity));
}
.input-info:focus {
outline: 2px solid hsl(var(--in));
}
.input-success {
--tw-border-opacity: 1;
border-color: hsl(var(--su) / var(--tw-border-opacity));
}
.input-success:focus {
outline: 2px solid hsl(var(--su));
}
.input-warning {
--tw-border-opacity: 1;
border-color: hsl(var(--wa) / var(--tw-border-opacity));
}
.input-warning:focus {
outline: 2px solid hsl(var(--wa));
}
.input-error {
--tw-border-opacity: 1;
border-color: hsl(var(--er) / var(--tw-border-opacity));
}
.input-error:focus {
outline: 2px solid hsl(var(--er));
}
.input-disabled,
.input[disabled] {
cursor: not-allowed;
--tw-border-opacity: 1;
border-color: hsl(var(--b1) / var(--tw-border-opacity));
border-color: hsl(var(--b2, var(--b1)) / var(--tw-border-opacity));
--tw-bg-opacity: 1;
background-color: hsl(var(--b1) / var(--tw-bg-opacity));
background-color: hsl(var(--b2, var(--b1)) / var(--tw-bg-opacity));
--tw-text-opacity: 0.2;
}
.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 {
color: hsl(var(--bc) / var(--tw-placeholder-opacity));
--tw-placeholder-opacity: 0.2;
}
.link-primary {
--tw-text-opacity: 1;
color: hsl(var(--p) / var(--tw-text-opacity));
}
.link-primary:hover {
--tw-text-opacity: 1;
color: hsl(var(--p) / var(--tw-text-opacity));
color: hsl(var(--pf, var(--p)) / var(--tw-text-opacity));
}
.link-secondary {
--tw-text-opacity: 1;
color: hsl(var(--s) / var(--tw-text-opacity));
}
.link-secondary:hover {
--tw-text-opacity: 1;
color: hsl(var(--s) / var(--tw-text-opacity));
color: hsl(var(--sf, var(--s)) / var(--tw-text-opacity));
}
.link-accent {
--tw-text-opacity: 1;
color: hsl(var(--a) / var(--tw-text-opacity));
}
.link-accent:hover {
--tw-text-opacity: 1;
color: hsl(var(--a) / var(--tw-text-opacity));
color: hsl(var(--af, var(--a)) / var(--tw-text-opacity));
}
.link-neutral {
--tw-text-opacity: 1;
color: hsl(var(--n) / var(--tw-text-opacity));
}
.link-neutral:hover {
--tw-text-opacity: 1;
color: hsl(var(--n) / var(--tw-text-opacity));
color: hsl(var(--nf, var(--n)) / var(--tw-text-opacity));
}
.link-success {
--tw-text-opacity: 1;
color: hsl(var(--su) / var(--tw-text-opacity));
}
.link-success:hover {
--tw-text-opacity: 1;
color: hsl(var(--su) / var(--tw-text-opacity));
}
.link-info {
--tw-text-opacity: 1;
color: hsl(var(--in) / var(--tw-text-opacity));
}
.link-info:hover {
--tw-text-opacity: 1;
color: hsl(var(--in) / var(--tw-text-opacity));
}
.link-warning {
--tw-text-opacity: 1;
color: hsl(var(--wa) / var(--tw-text-opacity));
}
.link-warning:hover {
--tw-text-opacity: 1;
color: hsl(var(--wa) / var(--tw-text-opacity));
}
.link-error {
--tw-text-opacity: 1;
color: hsl(var(--er) / var(--tw-text-opacity));
}
.link-error:hover {
--tw-text-opacity: 1;
color: hsl(var(--er) / var(--tw-text-opacity));
}
.link:focus {
outline: 2px solid transparent;
outline-offset: 2px;
}
.link.focus-visible {
outline: 2px solid currentColor;
outline-offset: 2px;
}
.link:focus-visible {
outline: 2px solid currentColor;
outline-offset: 2px;
}
.mask-squircle {
-webkit-mask-image: url("data:image/svg+xml,%3csvg width=%27200%27 height=%27200%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath d=%27M100 0C20 0 0 20 0 100s20 100 100 100 100-20 100-100S180 0 100 0Z%27/%3e%3c/svg%3e");
mask-image: url("data:image/svg+xml,%3csvg width=%27200%27 height=%27200%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath d=%27M100 0C20 0 0 20 0 100s20 100 100 100 100-20 100-100S180 0 100 0Z%27/%3e%3c/svg%3e");
}
.mask-decagon {
-webkit-mask-image: url("data:image/svg+xml,%3csvg width=%27192%27 height=%27200%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath fill=%27black%27 d=%27m96 0 58.779 19.098 36.327 50v61.804l-36.327 50L96 200l-58.779-19.098-36.327-50V69.098l36.327-50z%27 fill-rule=%27evenodd%27/%3e%3c/svg%3e");
mask-image: url("data:image/svg+xml,%3csvg width=%27192%27 height=%27200%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath fill=%27black%27 d=%27m96 0 58.779 19.098 36.327 50v61.804l-36.327 50L96 200l-58.779-19.098-36.327-50V69.098l36.327-50z%27 fill-rule=%27evenodd%27/%3e%3c/svg%3e");
}
.mask-diamond {
-webkit-mask-image: url("data:image/svg+xml,%3csvg width=%27200%27 height=%27200%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath fill=%27black%27 d=%27m100 0 100 100-100 100L0 100z%27 fill-rule=%27evenodd%27/%3e%3c/svg%3e");
mask-image: url("data:image/svg+xml,%3csvg width=%27200%27 height=%27200%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath fill=%27black%27 d=%27m100 0 100 100-100 100L0 100z%27 fill-rule=%27evenodd%27/%3e%3c/svg%3e");
}
.mask-heart {
-webkit-mask-image: url("data:image/svg+xml,%3csvg width=%27200%27 height=%27185%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath d=%27M100 184.606a15.384 15.384 0 0 1-8.653-2.678C53.565 156.28 37.205 138.695 28.182 127.7 8.952 104.264-.254 80.202.005 54.146.308 24.287 24.264 0 53.406 0c21.192 0 35.869 11.937 44.416 21.879a2.884 2.884 0 0 0 4.356 0C110.725 11.927 125.402 0 146.594 0c29.142 0 53.098 24.287 53.4 54.151.26 26.061-8.956 50.122-28.176 73.554-9.023 10.994-25.383 28.58-63.165 54.228a15.384 15.384 0 0 1-8.653 2.673Z%27 fill=%27black%27 fill-rule=%27nonzero%27/%3e%3c/svg%3e");
mask-image: url("data:image/svg+xml,%3csvg width=%27200%27 height=%27185%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath d=%27M100 184.606a15.384 15.384 0 0 1-8.653-2.678C53.565 156.28 37.205 138.695 28.182 127.7 8.952 104.264-.254 80.202.005 54.146.308 24.287 24.264 0 53.406 0c21.192 0 35.869 11.937 44.416 21.879a2.884 2.884 0 0 0 4.356 0C110.725 11.927 125.402 0 146.594 0c29.142 0 53.098 24.287 53.4 54.151.26 26.061-8.956 50.122-28.176 73.554-9.023 10.994-25.383 28.58-63.165 54.228a15.384 15.384 0 0 1-8.653 2.673Z%27 fill=%27black%27 fill-rule=%27nonzero%27/%3e%3c/svg%3e");
}
.mask-hexagon {
-webkit-mask-image: url("data:image/svg+xml,%3csvg width=%27182%27 height=%27201%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath d=%27M.3 65.486c0-9.196 6.687-20.063 14.211-25.078l61.86-35.946c8.36-5.016 20.899-5.016 29.258 0l61.86 35.946c8.36 5.015 14.211 15.882 14.211 25.078v71.055c0 9.196-6.687 20.063-14.211 25.079l-61.86 35.945c-8.36 4.18-20.899 4.18-29.258 0L14.51 161.62C6.151 157.44.3 145.737.3 136.54V65.486Z%27 fill=%27black%27 fill-rule=%27nonzero%27/%3e%3c/svg%3e");
mask-image: url("data:image/svg+xml,%3csvg width=%27182%27 height=%27201%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath d=%27M.3 65.486c0-9.196 6.687-20.063 14.211-25.078l61.86-35.946c8.36-5.016 20.899-5.016 29.258 0l61.86 35.946c8.36 5.015 14.211 15.882 14.211 25.078v71.055c0 9.196-6.687 20.063-14.211 25.079l-61.86 35.945c-8.36 4.18-20.899 4.18-29.258 0L14.51 161.62C6.151 157.44.3 145.737.3 136.54V65.486Z%27 fill=%27black%27 fill-rule=%27nonzero%27/%3e%3c/svg%3e");
}
.mask-hexagon-2 {
-webkit-mask-image: url("data:image/svg+xml,%3csvg width=%27200%27 height=%27182%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath d=%27M64.786 181.4c-9.196 0-20.063-6.687-25.079-14.21L3.762 105.33c-5.016-8.36-5.016-20.9 0-29.259l35.945-61.86C44.723 5.851 55.59 0 64.786 0h71.055c9.196 0 20.063 6.688 25.079 14.211l35.945 61.86c4.18 8.36 4.18 20.899 0 29.258l-35.945 61.86c-4.18 8.36-15.883 14.211-25.079 14.211H64.786Z%27 fill=%27black%27 fill-rule=%27nonzero%27/%3e%3c/svg%3e");
mask-image: url("data:image/svg+xml,%3csvg width=%27200%27 height=%27182%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath d=%27M64.786 181.4c-9.196 0-20.063-6.687-25.079-14.21L3.762 105.33c-5.016-8.36-5.016-20.9 0-29.259l35.945-61.86C44.723 5.851 55.59 0 64.786 0h71.055c9.196 0 20.063 6.688 25.079 14.211l35.945 61.86c4.18 8.36 4.18 20.899 0 29.258l-35.945 61.86c-4.18 8.36-15.883 14.211-25.079 14.211H64.786Z%27 fill=%27black%27 fill-rule=%27nonzero%27/%3e%3c/svg%3e");
}
.mask-circle {
-webkit-mask-image: url("data:image/svg+xml,%3csvg width=%27200%27 height=%27200%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3ccircle fill=%27black%27 cx=%27100%27 cy=%27100%27 r=%27100%27 fill-rule=%27evenodd%27/%3e%3c/svg%3e");
mask-image: url("data:image/svg+xml,%3csvg width=%27200%27 height=%27200%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3ccircle fill=%27black%27 cx=%27100%27 cy=%27100%27 r=%27100%27 fill-rule=%27evenodd%27/%3e%3c/svg%3e");
}
.mask-parallelogram {
-webkit-mask-image: url("data:image/svg+xml,%3csvg width=%27200%27 height=%27154%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath fill=%27black%27 d=%27M46.154 0H200l-46.154 153.846H0z%27 fill-rule=%27evenodd%27/%3e%3c/svg%3e");
mask-image: url("data:image/svg+xml,%3csvg width=%27200%27 height=%27154%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath fill=%27black%27 d=%27M46.154 0H200l-46.154 153.846H0z%27 fill-rule=%27evenodd%27/%3e%3c/svg%3e");
}
.mask-parallelogram-2 {
-webkit-mask-image: url("data:image/svg+xml,%3csvg width=%27200%27 height=%27154%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath fill=%27black%27 d=%27M153.846 0H0l46.154 153.846H200z%27 fill-rule=%27evenodd%27/%3e%3c/svg%3e");
mask-image: url("data:image/svg+xml,%3csvg width=%27200%27 height=%27154%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath fill=%27black%27 d=%27M153.846 0H0l46.154 153.846H200z%27 fill-rule=%27evenodd%27/%3e%3c/svg%3e");
}
.mask-parallelogram-3 {
-webkit-mask-image: url("data:image/svg+xml,%3csvg width=%27154%27 height=%27201%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath fill=%27black%27 d=%27M.077 47.077v153.846l153.846-46.154V.923z%27 fill-rule=%27evenodd%27/%3e%3c/svg%3e");
mask-image: url("data:image/svg+xml,%3csvg width=%27154%27 height=%27201%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath fill=%27black%27 d=%27M.077 47.077v153.846l153.846-46.154V.923z%27 fill-rule=%27evenodd%27/%3e%3c/svg%3e");
}
.mask-parallelogram-4 {
-webkit-mask-image: url("data:image/svg+xml,%3csvg width=%27154%27 height=%27201%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath fill=%27black%27 d=%27M153.923 47.077v153.846L.077 154.77V.923z%27 fill-rule=%27evenodd%27/%3e%3c/svg%3e");
mask-image: url("data:image/svg+xml,%3csvg width=%27154%27 height=%27201%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath fill=%27black%27 d=%27M153.923 47.077v153.846L.077 154.77V.923z%27 fill-rule=%27evenodd%27/%3e%3c/svg%3e");
}
.mask-pentagon {
-webkit-mask-image: url("data:image/svg+xml,%3csvg width=%27192%27 height=%27181%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath fill=%27black%27 d=%27m96 0 95.106 69.098-36.327 111.804H37.22L.894 69.098z%27 fill-rule=%27evenodd%27/%3e%3c/svg%3e");
mask-image: url("data:image/svg+xml,%3csvg width=%27192%27 height=%27181%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath fill=%27black%27 d=%27m96 0 95.106 69.098-36.327 111.804H37.22L.894 69.098z%27 fill-rule=%27evenodd%27/%3e%3c/svg%3e");
}
.mask-square {
-webkit-mask-image: url("data:image/svg+xml,%3csvg width=%27200%27 height=%27200%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath fill=%27black%27 d=%27M0 0h200v200H0z%27 fill-rule=%27evenodd%27/%3e%3c/svg%3e");
mask-image: url("data:image/svg+xml,%3csvg width=%27200%27 height=%27200%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath fill=%27black%27 d=%27M0 0h200v200H0z%27 fill-rule=%27evenodd%27/%3e%3c/svg%3e");
}
.mask-star {
-webkit-mask-image: url("data:image/svg+xml,%3csvg width=%27192%27 height=%27180%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath fill=%27black%27 d=%27m96 137.263-58.779 42.024 22.163-68.389L.894 68.481l72.476-.243L96 0l22.63 68.238 72.476.243-58.49 42.417 22.163 68.389z%27 fill-rule=%27evenodd%27/%3e%3c/svg%3e");
mask-image: url("data:image/svg+xml,%3csvg width=%27192%27 height=%27180%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath fill=%27black%27 d=%27m96 137.263-58.779 42.024 22.163-68.389L.894 68.481l72.476-.243L96 0l22.63 68.238 72.476.243-58.49 42.417 22.163 68.389z%27 fill-rule=%27evenodd%27/%3e%3c/svg%3e");
}
.mask-star-2 {
-webkit-mask-image: url("data:image/svg+xml,%3csvg width=%27192%27 height=%27180%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath fill=%27black%27 d=%27m96 153.044-58.779 26.243 7.02-63.513L.894 68.481l63.117-13.01L96 0l31.989 55.472 63.117 13.01-43.347 47.292 7.02 63.513z%27 fill-rule=%27evenodd%27/%3e%3c/svg%3e");
mask-image: url("data:image/svg+xml,%3csvg width=%27192%27 height=%27180%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath fill=%27black%27 d=%27m96 153.044-58.779 26.243 7.02-63.513L.894 68.481l63.117-13.01L96 0l31.989 55.472 63.117 13.01-43.347 47.292 7.02 63.513z%27 fill-rule=%27evenodd%27/%3e%3c/svg%3e");
}
.mask-triangle {
-webkit-mask-image: url("data:image/svg+xml,%3csvg width=%27174%27 height=%27149%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath fill=%27black%27 d=%27m87 148.476-86.603.185L43.86 74.423 87 0l43.14 74.423 43.463 74.238z%27 fill-rule=%27evenodd%27/%3e%3c/svg%3e");
mask-image: url("data:image/svg+xml,%3csvg width=%27174%27 height=%27149%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath fill=%27black%27 d=%27m87 148.476-86.603.185L43.86 74.423 87 0l43.14 74.423 43.463 74.238z%27 fill-rule=%27evenodd%27/%3e%3c/svg%3e");
}
.mask-triangle-2 {
-webkit-mask-image: url("data:image/svg+xml,%3csvg width=%27174%27 height=%27150%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath fill=%27black%27 d=%27m87 .738 86.603-.184-43.463 74.238L87 149.214 43.86 74.792.397.554z%27 fill-rule=%27evenodd%27/%3e%3c/svg%3e");
mask-image: url("data:image/svg+xml,%3csvg width=%27174%27 height=%27150%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath fill=%27black%27 d=%27m87 .738 86.603-.184-43.463 74.238L87 149.214 43.86 74.792.397.554z%27 fill-rule=%27evenodd%27/%3e%3c/svg%3e");
}
.mask-triangle-3 {
-webkit-mask-image: url("data:image/svg+xml,%3csvg width=%27150%27 height=%27174%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath fill=%27black%27 d=%27m149.369 87.107.185 86.603-74.239-43.463L.893 87.107l74.422-43.14L149.554.505z%27 fill-rule=%27evenodd%27/%3e%3c/svg%3e");
mask-image: url("data:image/svg+xml,%3csvg width=%27150%27 height=%27174%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath fill=%27black%27 d=%27m149.369 87.107.185 86.603-74.239-43.463L.893 87.107l74.422-43.14L149.554.505z%27 fill-rule=%27evenodd%27/%3e%3c/svg%3e");
}
.mask-triangle-4 {
-webkit-mask-image: url("data:image/svg+xml,%3csvg width=%27150%27 height=%27174%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath fill=%27black%27 d=%27M.631 87.107.446.505l74.239 43.462 74.422 43.14-74.422 43.14L.446 173.71z%27 fill-rule=%27evenodd%27/%3e%3c/svg%3e");
mask-image: url("data:image/svg+xml,%3csvg width=%27150%27 height=%27174%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath fill=%27black%27 d=%27M.631 87.107.446.505l74.239 43.462 74.422 43.14-74.422 43.14L.446 173.71z%27 fill-rule=%27evenodd%27/%3e%3c/svg%3e");
}
.menu.horizontal > li.bordered > a,
.menu.horizontal > li.bordered > button,
.menu.horizontal > li.bordered > span {
border-left-width: 0px;
border-bottom-width: 4px;
--tw-border-opacity: 1;
border-color: hsl(var(--p) / var(--tw-border-opacity));
}
.menu[class*=" px-"]:not(.menu[class*=" px-0"]) li > *,
.menu[class^="px-"]:not(.menu[class^="px-0"]) li > *,
.menu[class*=" p-"]:not(.menu[class*=" p-0"]) li > *,
.menu[class^="p-"]:not(.menu[class^="p-0"]) li > * {
border-radius: 0.5rem;
border-radius: var(--rounded-btn, 0.5rem);
}
.menu :where(li.bordered > *) {
border-left-width: 4px;
--tw-border-opacity: 1;
border-color: hsl(var(--p) / var(--tw-border-opacity));
}
.menu :where(li) > :where(*:not(ul)) {
gap: 0.75rem;
padding-left: 1rem;
padding-right: 1rem;
padding-top: 0.75rem;
padding-bottom: 0.75rem;
color: currentColor;
}
.menu :where(li:not(.menu-title):not(:empty)) > :where(*:not(ul):focus),
.menu :where(li:not(.menu-title):not(:empty)) > :where(*:not(ul):hover) {
background-color: hsl(var(--bc) / var(--tw-bg-opacity));
--tw-bg-opacity: 0.1;
}
.menu :where(li:not(.menu-title):not(:empty)) > :where(:not(ul).active),
.menu :where(li:not(.menu-title):not(:empty)) > :where(*:not(ul):active) {
--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));
}
.menu :where(li:empty) {
margin-left: 1rem;
margin-right: 1rem;
margin-top: 0.5rem;
margin-bottom: 0.5rem;
height: 1px;
background-color: hsl(var(--bc) / var(--tw-bg-opacity));
--tw-bg-opacity: 0.1;
}
.menu li.disabled > * {
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
color: hsl(var(--bc) / var(--tw-text-opacity));
--tw-text-opacity: 0.2;
}
.menu li.disabled > *:hover {
background-color: transparent;
}
.menu li.hover-bordered a {
border-left-width: 4px;
border-color: transparent;
}
.menu li.hover-bordered a:hover {
--tw-border-opacity: 1;
border-color: hsl(var(--p) / var(--tw-border-opacity));
}
.menu.compact li > a,
.menu.compact li > span {
padding-top: 0.5rem;
padding-bottom: 0.5rem;
font-size: 0.875rem;
line-height: 1.25rem;
}
.menu .menu-title {
font-size: 0.75rem;
line-height: 1rem;
font-weight: 700;
opacity: 0.4;
}
.menu .menu-title > * {
padding-top: 0.25rem;
padding-bottom: 0.25rem;
}
.menu :where(li:not(.disabled)) > :where(*:not(ul)) {
outline: 2px solid transparent;
outline-offset: 2px;
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-duration: 200ms;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}
.menu > :where(li:first-child) {
border-top-left-radius: inherit;
border-top-right-radius: inherit;
border-bottom-right-radius: 0;
border-bottom-right-radius: initial;
border-bottom-left-radius: 0;
border-bottom-left-radius: initial;
}
.menu > :where(li:first-child) > :where(:not(ul)) {
border-top-left-radius: inherit;
border-top-right-radius: inherit;
border-bottom-right-radius: 0;
border-bottom-right-radius: initial;
border-bottom-left-radius: 0;
border-bottom-left-radius: initial;
}
.menu > :where(li:last-child) {
border-top-left-radius: 0;
border-top-left-radius: initial;
border-top-right-radius: 0;
border-top-right-radius: initial;
border-bottom-right-radius: inherit;
border-bottom-left-radius: inherit;
}
.menu > :where(li:last-child) > :where(:not(ul)) {
border-top-left-radius: 0;
border-top-left-radius: initial;
border-top-right-radius: 0;
border-top-right-radius: initial;
border-bottom-right-radius: inherit;
border-bottom-left-radius: inherit;
}
.menu > :where(li) > :where(ul) :where(li) {
width: 100%;
white-space: nowrap;
}
.menu > :where(li) > :where(ul) :where(li) :where(ul) {
padding-left: 1rem;
}
.menu > :where(li) > :where(ul) :where(li) > :where(:not(ul)) {
width: 100%;
white-space: nowrap;
}
.menu > :where(li) > :where(ul) > :where(li:first-child) {
border-top-left-radius: inherit;
border-top-right-radius: inherit;
border-bottom-right-radius: 0;
border-bottom-right-radius: initial;
border-bottom-left-radius: 0;
border-bottom-left-radius: initial;
}
.menu > :where(li) > :where(ul) > :where(li:first-child) > :where(:not(ul)) {
border-top-left-radius: inherit;
border-top-right-radius: inherit;
border-bottom-right-radius: 0;
border-bottom-right-radius: initial;
border-bottom-left-radius: 0;
border-bottom-left-radius: initial;
}
.menu > :where(li) > :where(ul) > :where(li:last-child) {
border-top-left-radius: 0;
border-top-left-radius: initial;
border-top-right-radius: 0;
border-top-right-radius: initial;
border-bottom-right-radius: inherit;
border-bottom-left-radius: inherit;
}
.menu > :where(li) > :where(ul) > :where(li:last-child) > :where(:not(ul)) {
border-top-left-radius: 0;
border-top-left-radius: initial;
border-top-right-radius: 0;
border-top-right-radius: initial;
border-bottom-right-radius: inherit;
border-bottom-left-radius: inherit;
}
.mockup-code:before {
content: "";
margin-bottom: 1rem;
display: block;
height: 0.75rem;
width: 0.75rem;
border-radius: 9999px;
opacity: 0.3;
box-shadow: 1.4em 0, 2.8em 0, 4.2em 0;
}
.mockup-code pre {
padding-right: 1.25rem;
}
.mockup-code pre:before {
content: "";
margin-right: 2ch;
}
.mockup-window:before {
content: "";
margin-bottom: 1rem;
display: block;
height: 0.75rem;
width: 0.75rem;
border-radius: 9999px;
opacity: 0.3;
box-shadow: 1.4em 0, 2.8em 0, 4.2em 0;
}
.mockup-phone {
display: inline-block;
border: 4px solid #444;
border-radius: 50px;
background-color: #000;
padding: 10px;
margin: 0 auto;
overflow: hidden;
}
.mockup-phone .camera {
position: relative;
top: 0px;
left: 0px;
background: #000;
height:
gitextract_jaanbdff/ ├── .eslintignore ├── .eslintrc ├── .gitignore ├── README.md ├── package.json ├── public/ │ ├── assets/ │ │ └── manifest.json │ ├── index.html │ ├── interactive_module_quantized_592547_2023_03_19_sam6_long_uncertain.onnx │ ├── interactive_module_quantized_592547_2023_03_20_sam6_long_all_masks_extra_data_with_ious.onnx │ ├── manifest.json │ ├── ort-wasm-simd-threaded.wasm │ ├── ort-wasm-simd.wasm │ ├── ort-wasm-threaded.wasm │ ├── ort-wasm.wasm │ └── robots.txt ├── src/ │ ├── App.css │ ├── App.test.tsx │ ├── App.tsx │ ├── assets/ │ │ ├── manifest.json │ │ └── scss/ │ │ └── App.scss │ ├── components/ │ │ ├── Canvas.tsx │ │ ├── Content.tsx │ │ ├── ErrorPage.tsx │ │ ├── FAQ.tsx │ │ ├── FeatureSummary.tsx │ │ ├── FeedbackModal.tsx │ │ ├── Footer.tsx │ │ ├── Gallery.tsx │ │ ├── Hero.tsx │ │ ├── HomePage.tsx │ │ ├── ImagePicker.tsx │ │ ├── LegalText.tsx │ │ ├── LoadingModal.tsx │ │ ├── MobileOptionNavBar.tsx │ │ ├── MobileSegmentDrawer.tsx │ │ ├── Navbar.tsx │ │ ├── PointsModal.tsx │ │ ├── SegmentDrawer.tsx │ │ ├── SegmentOptions.tsx │ │ ├── Sparkle.tsx │ │ ├── Stage.tsx │ │ ├── SvgMask.tsx │ │ ├── ToolTip.tsx │ │ ├── Video.tsx │ │ ├── helpers/ │ │ │ ├── CanvasHelper.tsx │ │ │ ├── ImageHelper.tsx │ │ │ ├── Interface.tsx │ │ │ ├── colors.tsx │ │ │ ├── custom_tracer.tsx │ │ │ ├── getFile.tsx │ │ │ ├── mask_utils.tsx │ │ │ ├── metaTheme.tsx │ │ │ ├── modelAPI.tsx │ │ │ └── photos.tsx │ │ └── hooks/ │ │ ├── Animation.tsx │ │ ├── context.tsx │ │ └── createContext.tsx │ ├── index.css │ ├── index.tsx │ ├── interactive_module_quantized_592547_2023_03_19_sam6_long_uncertain.onnx │ ├── interactive_module_quantized_592547_2023_03_20_sam6_long_all_masks_extra_data_with_ious.onnx │ ├── react-app-env.d.ts │ ├── reportWebVitals.ts │ └── setupTests.ts ├── tsconfig.json └── webpack.config.js
SYMBOL INDEX (63 symbols across 27 files)
FILE: src/components/Canvas.tsx
type CanvasProps (line 28) | interface CanvasProps {
FILE: src/components/Content.tsx
type ContentProps (line 4) | type ContentProps = {
function Content (line 41) | function Content({
FILE: src/components/FAQ.tsx
type FAQProps (line 3) | type FAQProps = {
function FAQ (line 9) | function FAQ({
FILE: src/components/FeatureSummary.tsx
type Action (line 5) | interface Action {
type FeatureSummaryProps (line 9) | type FeatureSummaryProps = {
function FeatureSummary (line 22) | function FeatureSummary({
FILE: src/components/FeedbackModal.tsx
constant SPACE (line 3) | const SPACE = "%20";
constant NEW_LINE (line 4) | const NEW_LINE = "%0D%0A";
constant EMAIL (line 5) | const EMAIL = "segment-anything@meta.com";
constant SUBJECT (line 6) | const SUBJECT = "Segment Anything Demo Feedback";
constant BODY (line 7) | const BODY = `Hello Segment Anything team,${NEW_LINE}${NEW_LINE}I'd like...
FILE: src/components/Gallery.tsx
type GalleryProps (line 3) | type GalleryProps = {
function chunkArray (line 18) | function chunkArray(arr: any, n: number) {
function zipArray (line 26) | function zipArray(arrays: any) {
function Gallery (line 38) | function Gallery({
FILE: src/components/Hero.tsx
type HeroLayout (line 5) | type HeroLayout = "default" | "vertical";
type HeroProps (line 7) | type HeroProps = {
function Hero (line 20) | function Hero({
FILE: src/components/ImagePicker.tsx
type ImagePickerProps (line 8) | interface ImagePickerProps {
FILE: src/components/LegalText.tsx
function LegalText (line 2) | function LegalText() {
FILE: src/components/LoadingModal.tsx
type LoadingModalProps (line 4) | interface LoadingModalProps {
FILE: src/components/MobileOptionNavBar.tsx
type MobileOptionNavBarProps (line 4) | interface MobileOptionNavBarProps {
FILE: src/components/MobileSegmentDrawer.tsx
type MobileSegmentDrawerProps (line 7) | interface MobileSegmentDrawerProps {
FILE: src/components/Navbar.tsx
type NavBarProps (line 5) | interface NavBarProps {
FILE: src/components/SegmentDrawer.tsx
type SegmentDrawerProps (line 10) | interface SegmentDrawerProps {
FILE: src/components/SegmentOptions.tsx
type SegmentOptionsProps (line 4) | interface SegmentOptionsProps {
FILE: src/components/Stage.tsx
type Points (line 26) | type Points = { sx: number; sy: number; x: number; y: number };
FILE: src/components/SvgMask.tsx
type SvgMaskProps (line 4) | interface SvgMaskProps {
FILE: src/components/ToolTip.tsx
type ToolTipProps (line 6) | interface ToolTipProps {
FILE: src/components/Video.tsx
type VideoProps (line 3) | type VideoProps = {
function Video (line 18) | function Video({
FILE: src/components/helpers/CanvasHelper.tsx
type canvasScaleInitializerProps (line 3) | interface canvasScaleInitializerProps {
type canvasScaleResizerProps (line 10) | interface canvasScaleResizerProps {
FILE: src/components/helpers/Interface.tsx
type AnnotationProps (line 3) | interface AnnotationProps {
type modelInputProps (line 11) | interface modelInputProps {
type clickType (line 19) | enum clickType {
type modelScaleProps (line 26) | interface modelScaleProps {
type setParmsandQueryModelProps (line 36) | interface setParmsandQueryModelProps {
type setParmsandQueryEraseModelProps (line 61) | interface setParmsandQueryEraseModelProps {
type queryEraseModelProps (line 81) | interface queryEraseModelProps {
type queryModelReturnTensorsProps (line 98) | interface queryModelReturnTensorsProps {
type modeDataProps (line 121) | interface modeDataProps {
type StageProps (line 131) | interface StageProps {
FILE: src/components/helpers/colors.tsx
constant DETECTRON2_COLORS (line 3) | const DETECTRON2_COLORS = [
FILE: src/components/helpers/mask_utils.tsx
function maskDataToFortranArrayToRle (line 21) | function maskDataToFortranArrayToRle(
function areaUnderLine (line 111) | function areaUnderLine(x0: number, y0: number, x1: number, y1: number) {
function svgCoordToInt (line 123) | function svgCoordToInt(input: string) {
function areaOfSVGPolygon (line 130) | function areaOfSVGPolygon(input: string) {
function filterSmallSVGRegions (line 157) | function filterSmallSVGRegions(
function toImageData (line 243) | function toImageData(input: any, width: number, height: number) {
function imageDataToImage (line 257) | function imageDataToImage(imageData: ImageData) {
function imageDataToCanvas (line 264) | function imageDataToCanvas(imageData: ImageData) {
function rleToImage (line 273) | function rleToImage(input: any, width: number, height: number) {
function rleToCanvas (line 277) | function rleToCanvas(input: any, width: number, height: number) {
function keepArrayForMultiMask (line 284) | function keepArrayForMultiMask(
FILE: src/components/helpers/metaTheme.tsx
function getTextColors (line 4) | function getTextColors(darkMode: boolean): {
FILE: src/components/helpers/modelAPI.tsx
constant API_ENDPOINT (line 13) | const API_ENDPOINT = "https://model-zoo.metademolab.com/predict...
constant ALL_MASK_API_ENDPOINT (line 14) | const ALL_MASK_API_ENDPOINT = "https://model-zoo.metademolab.com/predict...
constant ERASE_API_ENDPOINT (line 17) | const ERASE_API_ENDPOINT = process.env.ERASE_API_ENDPOINT;
FILE: src/components/hooks/Animation.tsx
function useDelayUnmount (line 3) | function useDelayUnmount(isMounted: boolean, delayTime: number) {
FILE: src/components/hooks/createContext.tsx
type contextProps (line 5) | interface contextProps {
Condensed preview — 66 files, each showing path, character count, and a content snippet. Download the .json file or copy for the full structured content (848K chars).
[
{
"path": ".eslintignore",
"chars": 90,
"preview": "src/components/Canvas.tsx\r\nsrc/components/ImagePicker.tsx\r\nsrc/components/Stage.tsx\r\n*.tsx"
},
{
"path": ".eslintrc",
"chars": 84,
"preview": "{\n \"extends\": [\n \"react-app\",\n \"eslint-config-react-app/base\"\n ]\n }"
},
{
"path": ".gitignore",
"chars": 2047,
"preview": "# Logs\r\nlogs\r\n*.log\r\nnpm-debug.log*\r\nyarn-debug.log*\r\nyarn-error.log*\r\nlerna-debug.log*\r\n\r\n# Diagnostic reports (https:/"
},
{
"path": "README.md",
"chars": 3184,
"preview": "# Meta's Segment Anything Model (SAM) Demo Site\r\n\r\n## About\r\n\r\n<!--Image / Video annotation based on Meta's Segment Anyt"
},
{
"path": "package.json",
"chars": 2019,
"preview": "{\r\n \"name\": \"meta-sam-rip\",\r\n \"version\": \"0.1.0\",\r\n \"private\": true,\r\n \"dependencies\": {\r\n \"@remix-run/router\": \""
},
{
"path": "public/assets/manifest.json",
"chars": 531,
"preview": "{\n \"icons\": [\n {\n \"src\": \"M_Favicon_16x16.png\",\n \"type\": \"image/png\",\n \"sizes\": \"16x16\"\n },\n {\n"
},
{
"path": "public/index.html",
"chars": 511208,
"preview": "<!DOCTYPE html>\r\n<html lang=\"en\">\r\n <head>\r\n <meta charset=\"utf-8\" />\r\n <link rel=\"icon\" href=\"%PUBLIC_URL%/favic"
},
{
"path": "public/manifest.json",
"chars": 517,
"preview": "{\r\n \"short_name\": \"React App\",\r\n \"name\": \"Create React App Sample\",\r\n \"icons\": [\r\n {\r\n \"src\": \"favicon.ico\",\r"
},
{
"path": "public/robots.txt",
"chars": 70,
"preview": "# https://www.robotstxt.org/robotstxt.html\r\nUser-agent: *\r\nDisallow:\r\n"
},
{
"path": "src/App.css",
"chars": 602,
"preview": ".App {\r\n text-align: center;\r\n}\r\n\r\n.App-logo {\r\n height: 40vmin;\r\n pointer-events: none;\r\n}\r\n\r\n@media (prefers-reduce"
},
{
"path": "src/App.test.tsx",
"chars": 282,
"preview": "import React from 'react';\r\nimport { render, screen } from '@testing-library/react';\r\nimport App from './App';\r\n\r\ntest('"
},
{
"path": "src/App.tsx",
"chars": 18891,
"preview": "import LZString from \"lz-string\";\r\nimport { InferenceSession, Tensor } from \"onnxruntime-web\";\r\nimport * as ort from 'on"
},
{
"path": "src/assets/manifest.json",
"chars": 0,
"preview": ""
},
{
"path": "src/assets/scss/App.scss",
"chars": 14654,
"preview": "@tailwind base;\r\n@tailwind components;\r\n@tailwind utilities;\r\n\r\n@layer base {\r\n @font-face {\r\n font-family: \"Optimis"
},
{
"path": "src/components/Canvas.tsx",
"chars": 23591,
"preview": "import Konva from \"konva\";\r\nimport { KonvaEventObject } from \"konva/lib/Node\";\r\nimport React, {\r\n RefObject,\r\n useCont"
},
{
"path": "src/components/Content.tsx",
"chars": 4180,
"preview": "import React, { useState } from \"react\";\r\nimport Video from \"./Video\";\r\n\r\nexport type ContentProps = {\r\n color?:\r\n |"
},
{
"path": "src/components/ErrorPage.tsx",
"chars": 414,
"preview": "import React from \"react\";\r\nimport { useRouteError } from \"react-router-dom\";\r\n\r\nconst ErrorPage = () => {\r\n const erro"
},
{
"path": "src/components/FAQ.tsx",
"chars": 954,
"preview": "import React, { PropsWithChildren, useState } from \"react\";\r\n\r\nexport type FAQProps = {\r\n question?: string;\r\n classNa"
},
{
"path": "src/components/FeatureSummary.tsx",
"chars": 3313,
"preview": "import React from \"react\";\r\nimport { NavLink } from \"react-router-dom\";\r\nimport { getTextColors } from \"./helpers/metaTh"
},
{
"path": "src/components/FeedbackModal.tsx",
"chars": 1160,
"preview": "import React from \"react\";\r\n\r\nconst SPACE = \"%20\";\r\nconst NEW_LINE = \"%0D%0A\";\r\nconst EMAIL = \"segment-anything@meta.com"
},
{
"path": "src/components/Footer.tsx",
"chars": 1245,
"preview": "import React from \"react\";\r\nimport { NavLink, useLocation } from \"react-router-dom\";\r\nimport FeedbackModal from \"./Feedb"
},
{
"path": "src/components/Gallery.tsx",
"chars": 3269,
"preview": "import React, { PropsWithChildren } from \"react\";\r\nimport { bgColorToClass } from \"./Content\";\r\nexport type GalleryProps"
},
{
"path": "src/components/Hero.tsx",
"chars": 3831,
"preview": "import React from \"react\";\r\n\r\nimport Video from \"./Video\";\r\n\r\nexport type HeroLayout = \"default\" | \"vertical\";\r\n\r\nexport"
},
{
"path": "src/components/HomePage.tsx",
"chars": 16197,
"preview": "import React from \"react\";\r\nimport { Button } from \"react-daisyui\";\r\nimport Content from \"./Content\";\r\nimport FAQ from \""
},
{
"path": "src/components/ImagePicker.tsx",
"chars": 6668,
"preview": "import React, { useContext, useEffect, useLayoutEffect, useState } from \"react\";\r\nimport { Button, Checkbox } from \"reac"
},
{
"path": "src/components/LegalText.tsx",
"chars": 25414,
"preview": "import React from \"react\";\r\nfunction LegalText() {\r\n return (\r\n <div className=\"prose\">\r\n <h1>Segment Anything "
},
{
"path": "src/components/LoadingModal.tsx",
"chars": 1784,
"preview": "import React, { useContext } from \"react\";\r\nimport AppContext from \"./hooks/createContext\";\r\n\r\ninterface LoadingModalPro"
},
{
"path": "src/components/MobileOptionNavBar.tsx",
"chars": 3482,
"preview": "import React, { useContext, useState } from \"react\";\r\nimport AppContext from \"./hooks/createContext\";\r\n\r\ninterface Mobil"
},
{
"path": "src/components/MobileSegmentDrawer.tsx",
"chars": 11332,
"preview": "import React, { useContext, useEffect, useState } from \"react\";\r\nimport { Button } from \"react-daisyui\";\r\nimport { useSw"
},
{
"path": "src/components/Navbar.tsx",
"chars": 7233,
"preview": "import React from \"react\";\r\nimport { MdClose } from \"react-icons/md\";\r\nimport { NavLink, useLocation } from \"react-route"
},
{
"path": "src/components/PointsModal.tsx",
"chars": 1271,
"preview": "import React from \"react\";\r\nimport { useCookies } from \"react-cookie\";\r\n\r\nconst PointsModal = () => {\r\n const [toggle, "
},
{
"path": "src/components/SegmentDrawer.tsx",
"chars": 26379,
"preview": "import React, { useContext, useState } from \"react\";\r\nimport { getCookieConsentValue } from \"react-cookie-consent\";\r\nimp"
},
{
"path": "src/components/SegmentOptions.tsx",
"chars": 5986,
"preview": "import React, { useContext } from \"react\";\r\nimport AppContext from \"./hooks/createContext\";\r\n\r\ninterface SegmentOptionsP"
},
{
"path": "src/components/Sparkle.tsx",
"chars": 3428,
"preview": "import React, { useContext, useEffect, useState } from \"react\";\r\nimport AppContext from \"./hooks/createContext\";\r\n\r\ncons"
},
{
"path": "src/components/Stage.tsx",
"chars": 25090,
"preview": "import Konva from \"konva\";\r\nimport React, {\r\n Profiler,\r\n useContext,\r\n useEffect,\r\n useRef,\r\n useState,\r\n} from \"r"
},
{
"path": "src/components/SvgMask.tsx",
"chars": 4277,
"preview": "import React, { useContext, useEffect, useState, useRef } from \"react\";\r\nimport AppContext from \"./hooks/createContext\";"
},
{
"path": "src/components/ToolTip.tsx",
"chars": 2911,
"preview": "import React, { useContext } from \"react\";\r\nimport { AnnotationProps } from \"./helpers/Interface\";\r\n// import useTimeout"
},
{
"path": "src/components/Video.tsx",
"chars": 2080,
"preview": "import React from \"react\";\r\n\r\nexport type VideoProps = {\r\n url?: string;\r\n youtubeId?: string;\r\n aspectRatio?: \"wide\""
},
{
"path": "src/components/helpers/CanvasHelper.tsx",
"chars": 1734,
"preview": "import { RefObject } from \"react\";\r\n\r\ninterface canvasScaleInitializerProps {\r\n width: number;\r\n height: number;\r\n co"
},
{
"path": "src/components/helpers/ImageHelper.tsx",
"chars": 649,
"preview": "const handleImageScale = (data: HTMLImageElement) => {\r\n const IMAGE_SIZE = 500;\r\n const UPLOAD_IMAGE_SIZE = 1024;"
},
{
"path": "src/components/helpers/Interface.tsx",
"chars": 3293,
"preview": "import { InferenceSession, Tensor } from \"onnxruntime-web\";\r\n\r\nexport interface AnnotationProps {\r\n x: number;\r\n y: nu"
},
{
"path": "src/components/helpers/colors.tsx",
"chars": 2191,
"preview": "// Colormap options copied from detectron2\r\n\r\nconst DETECTRON2_COLORS = [\r\n [0.0, 0.447, 0.741],\r\n [0.85, 0.325, 0"
},
{
"path": "src/components/helpers/custom_tracer.tsx",
"chars": 14990,
"preview": "/**\r\n * Custom mask tracing algorithm\r\n * 1. Find the \"breakpoints\" (endpoints of every filled block) of every line in "
},
{
"path": "src/components/helpers/getFile.tsx",
"chars": 205,
"preview": "const getFile = async (data: URL) => {\r\n const response = await fetch(data);\r\n const blob = await response.blob();"
},
{
"path": "src/components/helpers/mask_utils.tsx",
"chars": 9075,
"preview": "/**\r\n * Functions for handling and tracing masks.\r\n */\r\n\r\nimport { Tensor } from \"onnxruntime-web\";\r\n\r\nconst {\r\n gene"
},
{
"path": "src/components/helpers/metaTheme.tsx",
"chars": 376,
"preview": "/**\r\n * Returns tailwind color classes for text contents, based on the darkMode boolean\r\n */\r\nexport function getTextCol"
},
{
"path": "src/components/helpers/modelAPI.tsx",
"chars": 10472,
"preview": "import { Tensor } from \"onnxruntime-web\";\r\n\r\nimport {\r\n clickType,\r\n modeDataProps,\r\n modelInputProps,\r\n queryEraseM"
},
{
"path": "src/components/helpers/photos.tsx",
"chars": 3788,
"preview": "const photos = [\r\n {\r\n src: \"/assets/gallery/18135.jpg\",\r\n width: 2000,\r\n height: 1538,\r\n },\r\n {"
},
{
"path": "src/components/hooks/Animation.tsx",
"chars": 1505,
"preview": "import React, { useEffect, useState } from \"react\";\r\n\r\nfunction useDelayUnmount(isMounted: boolean, delayTime: number) {"
},
{
"path": "src/components/hooks/context.tsx",
"chars": 4885,
"preview": "import { Tensor } from \"onnxruntime-web\";\r\nimport React, { useState } from \"react\";\r\nimport { modelInputProps } from \".."
},
{
"path": "src/components/hooks/createContext.tsx",
"chars": 4268,
"preview": "import { Tensor } from \"onnxruntime-web\";\r\nimport { createContext } from \"react\";\r\nimport { modelInputProps } from \"../h"
},
{
"path": "src/index.css",
"chars": 379,
"preview": "body {\r\n margin: 0;\r\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',\r\n 'Ubuntu', '"
},
{
"path": "src/index.tsx",
"chars": 1202,
"preview": "import * as React from \"react\";\r\nimport { createRoot } from \"react-dom/client\";\r\nimport { createBrowserRouter, RouterPro"
},
{
"path": "src/react-app-env.d.ts",
"chars": 41,
"preview": "/// <reference types=\"react-scripts\" />\r\n"
},
{
"path": "src/reportWebVitals.ts",
"chars": 440,
"preview": "import { ReportHandler } from 'web-vitals';\r\n\r\nconst reportWebVitals = (onPerfEntry?: ReportHandler) => {\r\n if (onPerfE"
},
{
"path": "src/setupTests.ts",
"chars": 246,
"preview": "// jest-dom adds custom jest matchers for asserting on DOM nodes.\r\n// allows you to do things like:\r\n// expect(element)."
},
{
"path": "tsconfig.json",
"chars": 595,
"preview": "{\r\n \"compilerOptions\": {\r\n \"target\": \"es2015\",\r\n \"downlevelIteration\": true,\r\n \"lib\": [\r\n \"dom\",\r\n \""
},
{
"path": "webpack.config.js",
"chars": 728,
"preview": "// Copyright (c) Microsoft Corporation.\r\n// Licensed under the MIT license.\r\n\r\nconst path = require('path');\r\nconst Copy"
}
]
// ... and 8 more files (download for full content)
About this extraction
This page contains the full source code of the MiscellaneousStuff/meta-sam-demo GitHub repository, extracted and formatted as plain text for AI agents and large language models (LLMs). The extraction includes 66 files (782.0 KB), approximately 269.2k tokens, and a symbol index with 63 extracted functions, classes, methods, constants, and types. Use this with OpenClaw, Claude, ChatGPT, Cursor, Windsurf, or any other AI tool that accepts text input. You can copy the full output to your clipboard or download it as a .txt file.
Extracted by GitExtract — free GitHub repo to text converter for AI. Built by Nikandr Surkov.