From d11808b4714e72a14c9516be3a7da9c0c383e97f Mon Sep 17 00:00:00 2001 From: MichalC <103170279+wSBMichalee@users.noreply.github.com> Date: Sun, 2 Aug 2026 21:10:24 +0200 Subject: [PATCH] =?UTF-8?q?fix:=20standaryzacja=20i=20bezpiecze=C5=84stwo?= =?UTF-8?q?=20formularzy?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Ujednolicono kontakt/actions.ts (rate limit, escapeHtml, getMailClient, usunięto bezpośrednie Resend) - Usunięto nieużywany plik lib/recaptcha.ts - Naprawiono brak obsługi błędów API (Resend error) w zgloszenie-awarii, zamowienie i zapytanie-multisplit - Dodano logowanie błędów w catch dla tych formularzy - Posprzątano stare skrypty robocze z roota --- analyze_products.ts | 10 - app/kontakt/actions.ts | 35 +- app/zamowienie/actions.ts | 11 +- app/zapytanie-multisplit/actions.ts | 7 +- app/zgloszenie-awarii/actions.ts | 11 +- audit_headings.js | 110 - find_buttons.py | 43 - lib/recaptcha.ts | 9 - out.css | 6426 --------------------------- parse_transcript.py | 20 - parse_transcript2.py | 14 - 11 files changed, 46 insertions(+), 6650 deletions(-) delete mode 100644 analyze_products.ts delete mode 100644 audit_headings.js delete mode 100644 find_buttons.py delete mode 100644 lib/recaptcha.ts delete mode 100644 out.css delete mode 100644 parse_transcript.py delete mode 100644 parse_transcript2.py diff --git a/analyze_products.ts b/analyze_products.ts deleted file mode 100644 index a84dbed..0000000 --- a/analyze_products.ts +++ /dev/null @@ -1,10 +0,0 @@ -import { products } from './content/products'; - -const values = new Set(); -products.filter(p => p.category === 'multisplit').forEach(p => { - if (p.specs && p.specs['Liczba jednostek wewn.']) { - values.add(parseFloat(p.specs['Liczba jednostek wewn.'])); - } -}); -const sorted = Array.from(values).sort((a, b) => a - b); -console.log('Unique unit counts:', sorted); diff --git a/app/kontakt/actions.ts b/app/kontakt/actions.ts index ab67578..14b70f5 100644 --- a/app/kontakt/actions.ts +++ b/app/kontakt/actions.ts @@ -1,10 +1,9 @@ "use server"; import { z } from "zod"; -import { Resend } from "resend"; -import { verifyRecaptcha } from "@/lib/recaptcha"; - -const resend = new Resend(process.env.RESEND_API_KEY); +import { escapeHtml, rateLimit, verifyRecaptcha } from "@/lib/security"; +import { getMailClient } from "@/lib/mail"; +import { headers } from "next/headers"; const contactFormSchema = z.object({ name: z.string().min(2, "Imię musi mieć min. 2 znaki"), @@ -18,12 +17,16 @@ const contactFormSchema = z.object({ export async function submitContactForm(prevState: unknown, formData: FormData) { try { + const ip = (await headers()).get('x-forwarded-for') || 'unknown'; + if (!rateLimit(ip)) { + return { success: false, message: 'Wysłano zbyt wiele zapytań. Spróbuj ponownie później.' }; + } if (process.env.NEXT_PUBLIC_RECAPTCHA_SITE_KEY && process.env.RECAPTCHA_SECRET_KEY) { const token = formData.get('recaptchaToken') as string; if (!token) { return { success: false, message: "Weryfikacja bezpieczeństwa nie powiodła się. Odśwież stronę i spróbuj ponownie." }; } - const { success } = await verifyRecaptcha(token); + const success = await verifyRecaptcha(token); if (!success) { return { success: false, message: "Weryfikacja bezpieczeństwa nie powiodła się. Odśwież stronę i spróbuj ponownie." }; } @@ -42,8 +45,16 @@ export async function submitContactForm(prevState: unknown, formData: FormData) const validatedData = contactFormSchema.parse(rawData); + const mailClient = getMailClient(); + if (!mailClient) { + return { + success: false, + message: "Funkcja wysyłania wiadomości jest tymczasowo niedostępna.", + }; + } + // 2. Wysłanie e-maila przez Resend - const { data, error } = await resend.emails.send({ + const { data, error } = await mailClient.resend.emails.send({ from: process.env.RESEND_FROM_EMAIL || "noreply@thermcool.pl", to: process.env.RESEND_TO_EMAIL || "biuro@thermcool.pl", // Docelowy e-mail (odbiorca) replyTo: validatedData.email, @@ -59,29 +70,29 @@ export async function submitContactForm(prevState: unknown, formData: FormData) - + - + - + - + - +
Imię:${validatedData.name}${escapeHtml(validatedData.name)}
Telefon:${validatedData.phone}${escapeHtml(validatedData.phone)}
E-mail:${validatedData.email}${escapeHtml(validatedData.email || '')}
Miasto:${validatedData.city}${escapeHtml(validatedData.city)}
Temat:${validatedData.subject}${escapeHtml(validatedData.subject || '')}

Treść wiadomości:

- ${validatedData.message} + ${escapeHtml(validatedData.message || '')}

diff --git a/app/zamowienie/actions.ts b/app/zamowienie/actions.ts index ef37662..428c2dd 100644 --- a/app/zamowienie/actions.ts +++ b/app/zamowienie/actions.ts @@ -85,7 +85,7 @@ export async function submitOrderForm(prevState: unknown, formData: FormData) { `${escapeHtml(p.name)}${p.quantity}${(p.price * p.quantity).toLocaleString('pl-PL')} zł` ).join(''); - await mailClient.resend.emails.send({ + const { data: emailData, error } = await mailClient.resend.emails.send({ from: mailClient.fromEmail, to: mailClient.toEmail, replyTo: data.email, @@ -120,9 +120,16 @@ export async function submitOrderForm(prevState: unknown, formData: FormData) { `, }); + + if (error) { + console.error("Resend Error:", error); + return { success: false, message: "Nie udało się wysłać wiadomości ze względu na błąd serwera pocztowego." }; + } + console.log("Wysłano e-mail (ID):", emailData?.id); return { success: true, message: 'Dziękujemy! Skontaktujemy się z Tobą w ciągu 24 godzin, aby potwierdzić zamówienie i ustalić termin montażu.' }; - } catch { + } catch (error) { + console.error("Błąd formularza:", error); return { success: false, message: 'Wystąpił błąd podczas wysyłania zamówienia. Spróbuj ponownie.' }; } } diff --git a/app/zapytanie-multisplit/actions.ts b/app/zapytanie-multisplit/actions.ts index 2134662..6b8acb8 100644 --- a/app/zapytanie-multisplit/actions.ts +++ b/app/zapytanie-multisplit/actions.ts @@ -44,7 +44,7 @@ export async function submitMultisplitForm(data: Record) { const validatedData = multisplitFormSchema.parse(processData); - const { error } = await mailClient.resend.emails.send({ + const { data: emailData, error } = await mailClient.resend.emails.send({ from: mailClient.fromEmail, to: mailClient.toEmail, replyTo: validatedData.email || undefined, @@ -92,11 +92,14 @@ export async function submitMultisplitForm(data: Record) { }); if (error) { - return { success: false, message: "Wystąpił problem z wysłaniem. Spróbuj ponownie." }; + console.error("Resend Error:", error); + return { success: false, message: "Nie udało się wysłać wiadomości ze względu na błąd serwera pocztowego." }; } + console.log("Wysłano e-mail (ID):", emailData?.id); return { success: true, message: "Dziękujemy za zapytanie! Skontaktujemy się z Tobą najszybciej jak to możliwe." }; } catch (error) { + console.error("Błąd formularza:", error); return { success: false, message: "Błąd walidacji lub błąd serwera. Spróbuj ponownie później." }; } } diff --git a/app/zgloszenie-awarii/actions.ts b/app/zgloszenie-awarii/actions.ts index 6370a68..1c1b3b8 100644 --- a/app/zgloszenie-awarii/actions.ts +++ b/app/zgloszenie-awarii/actions.ts @@ -48,7 +48,7 @@ export async function submitAwariaForm(data: Record) { email: data.email || 'brak@email.pl', }); - await mailClient.resend.emails.send({ + const { data: emailData, error } = await mailClient.resend.emails.send({ from: mailClient.fromEmail, to: mailClient.toEmail, subject: `${parsedData.isUrgent ? '🚨 PILNE — ' : ''}Zgłoszenie serwisowe: ${escapeHtml(parsedData.brand)} — ${escapeHtml(parsedData.city)}`, @@ -80,8 +80,15 @@ export async function submitAwariaForm(data: Record) { `, }); + + if (error) { + console.error("Resend Error:", error); + return { success: false, message: "Nie udało się wysłać wiadomości ze względu na błąd serwera pocztowego." }; + } + console.log("Wysłano e-mail (ID):", emailData?.id); return { success: true }; - } catch { + } catch (error) { + console.error("Błąd formularza:", error); return { success: false, message: 'Wystąpił błąd podczas wysyłania.' }; } } diff --git a/audit_headings.js b/audit_headings.js deleted file mode 100644 index 3ff69ed..0000000 --- a/audit_headings.js +++ /dev/null @@ -1,110 +0,0 @@ -/* eslint-disable */ -const fs = require('fs'); -const path = require('path'); - -function walkDir(dir, callback) { - if (!fs.existsSync(dir)) return; - fs.readdirSync(dir).forEach(f => { - const dirPath = path.join(dir, f); - const isDirectory = fs.statSync(dirPath).isDirectory(); - if (isDirectory) { - walkDir(dirPath, callback); - } else if (dirPath.endsWith('.tsx')) { - callback(dirPath); - } - }); -} - -const appFiles = []; -const componentsFiles = []; - -walkDir('app', f => appFiles.push(f)); -walkDir('components', f => componentsFiles.push(f)); - -const allFiles = [...appFiles, ...componentsFiles]; -const results = {}; - -allFiles.forEach(file => { - const content = fs.readFileSync(file, 'utf8'); - const lines = content.split('\n'); - const headings = []; - - lines.forEach((line, index) => { - const regex = /]/g; - let match; - while ((match = regex.exec(line)) !== null) { - headings.push({ level: parseInt(match[1]), line: index + 1, content: line.trim() }); - } - }); - - if (headings.length > 0 || file.endsWith('page.tsx')) { - results[file] = headings; - } -}); - -// Analysis -console.log("=== HEADINGS AUDIT ==="); - -// 1. Pages with >1 H1 -console.log("\n1. Strony z więcej niż jednym

:"); -let foundMultipleH1 = false; -for (const [file, headings] of Object.entries(results)) { - if (file.includes('page.tsx')) { - const h1s = headings.filter(h => h.level === 1); - if (h1s.length > 1) { - console.log(`- ${file} (Liczba

: ${h1s.length})`); - foundMultipleH1 = true; - } - } -} -if (!foundMultipleH1) console.log("Brak."); - -// 2. Pages with 0 H1 -console.log("\n2. Strony (page.tsx) bez

:"); -let foundZeroH1 = false; -for (const [file, headings] of Object.entries(results)) { - if (file.includes('page.tsx') && !file.includes('api/')) { // ignoring api if any - const h1s = headings.filter(h => h.level === 1); - if (h1s.length === 0) { - console.log(`- ${file}`); - foundZeroH1 = true; - } - } -} -if (!foundZeroH1) console.log("Brak."); - -// 3. Components rendering H1 -console.log("\n3. Komponenty współdzielone (w components/) z

:"); -let foundComponentH1 = false; -for (const [file, headings] of Object.entries(results)) { - if (file.startsWith('components/')) { - const h1s = headings.filter(h => h.level === 1); - if (h1s.length > 0) { - console.log(`- ${file} (${h1s.length} wystąpień

)`); - foundComponentH1 = true; - } - } -} -if (!foundComponentH1) console.log("Brak."); - -// 4. Heading Skips -console.log("\n4. Skoki poziomów nagłówków w plikach:"); -let foundSkips = false; -for (const [file, headings] of Object.entries(results)) { - if (headings.length === 0) continue; - - let currentLevel = null; - - for (const h of headings) { - if (currentLevel !== null) { - // A skip happens if the new level is strictly greater than currentLevel + 1 - if (h.level > currentLevel + 1) { - console.log(`- ${file}: Skok z na w linii ${h.line}`); - foundSkips = true; - } - } - currentLevel = h.level; - } -} -if (!foundSkips) console.log("Brak oczywistych skoków."); - diff --git a/find_buttons.py b/find_buttons.py deleted file mode 100644 index 317ee5a..0000000 --- a/find_buttons.py +++ /dev/null @@ -1,43 +0,0 @@ -import os -import re -from collections import Counter - -dirs_to_search = ['app', 'components'] -button_classes = [] - -class_regex = re.compile(r'className=["\']([^"\']+)["\']') -dynamic_class_regex = re.compile(r'className=\{`([^`]+)`\}') - -for d in dirs_to_search: - for root, _, files in os.walk(d): - for file in files: - if file.endswith(('.tsx', '.jsx', '.ts', '.js')): - filepath = os.path.join(root, file) - with open(filepath, 'r', encoding='utf-8') as f: - content = f.read() - - # Find all classNames - matches = class_regex.findall(content) + dynamic_class_regex.findall(content) - - for m in matches: - # Check if it looks like a button - if 'btn' in m or ('px-' in m and 'py-' in m and 'rounded' in m): - # Normalize spacing - normalized = ' '.join(m.split()) - button_classes.append((normalized, filepath)) - -# Count frequencies -counts = Counter([c[0] for c in button_classes]) -most_common = counts.most_common(10) - -print("Top variants:") -for variant, count in most_common: - print(f"\nVariant ({count} times): {variant}") - # Find up to 3 files where it appears - files_seen = set() - for c, fpath in button_classes: - if c == variant and fpath not in files_seen: - files_seen.add(fpath) - print(f" - {fpath}") - if len(files_seen) >= 3: - break diff --git a/lib/recaptcha.ts b/lib/recaptcha.ts deleted file mode 100644 index ea7214e..0000000 --- a/lib/recaptcha.ts +++ /dev/null @@ -1,9 +0,0 @@ -export async function verifyRecaptcha(token: string): Promise<{ success: boolean; score?: number }> { - const res = await fetch('https://www.google.com/recaptcha/api/siteverify', { - method: 'POST', - headers: { 'Content-Type': 'application/x-www-form-urlencoded' }, - body: `secret=${process.env.RECAPTCHA_SECRET_KEY}&response=${token}`, - }); - const data = await res.json(); - return { success: data.success && (data.score === undefined || data.score >= 0.5), score: data.score }; -} diff --git a/out.css b/out.css deleted file mode 100644 index 015425b..0000000 --- a/out.css +++ /dev/null @@ -1,6426 +0,0 @@ -/*! tailwindcss v4.3.1 | MIT License | https://tailwindcss.com */ -@layer properties; -@layer theme, base, components, utilities; -@layer theme { - :root, :host { - --font-sans: var(--font-sans); - --color-red-50: oklch(97.1% 0.013 17.38); - --color-red-200: oklch(88.5% 0.062 18.334); - --color-red-500: oklch(63.7% 0.237 25.331); - --color-red-800: oklch(44.4% 0.177 26.899); - --color-orange-500: oklch(70.5% 0.213 47.604); - --color-yellow-400: oklch(85.2% 0.199 91.936); - --color-yellow-500: oklch(79.5% 0.184 86.047); - --color-green-50: oklch(98.2% 0.018 155.826); - --color-green-100: oklch(96.2% 0.044 156.743); - --color-green-200: oklch(92.5% 0.084 155.995); - --color-green-500: oklch(72.3% 0.219 149.579); - --color-green-600: oklch(62.7% 0.194 149.214); - --color-green-700: oklch(52.7% 0.154 150.069); - --color-green-800: oklch(44.8% 0.119 151.328); - --color-slate-50: oklch(98.4% 0.003 247.858); - --color-slate-100: oklch(96.8% 0.007 247.896); - --color-slate-200: oklch(92.9% 0.013 255.508); - --color-slate-300: oklch(86.9% 0.022 252.894); - --color-slate-400: oklch(70.4% 0.04 256.788); - --color-slate-500: oklch(55.4% 0.046 257.417); - --color-slate-700: oklch(37.2% 0.044 257.287); - --color-slate-800: oklch(27.9% 0.041 260.031); - --color-slate-950: oklch(12.9% 0.042 264.695); - --color-gray-50: oklch(98.5% 0.002 247.839); - --color-gray-100: oklch(96.7% 0.003 264.542); - --color-gray-200: oklch(92.8% 0.006 264.531); - --color-gray-300: oklch(87.2% 0.01 258.338); - --color-gray-400: oklch(70.7% 0.022 261.325); - --color-gray-500: oklch(55.1% 0.027 264.364); - --color-gray-600: oklch(44.6% 0.03 256.802); - --color-gray-700: oklch(37.3% 0.034 259.733); - --color-gray-800: oklch(27.8% 0.033 256.848); - --color-gray-900: oklch(21% 0.034 264.665); - --color-black: #000; - --color-white: #fff; - --spacing: 0.25rem; - --container-xs: 20rem; - --container-sm: 24rem; - --container-md: 28rem; - --container-xl: 36rem; - --container-2xl: 42rem; - --container-3xl: 48rem; - --container-4xl: 56rem; - --container-5xl: 64rem; - --container-6xl: 72rem; - --container-7xl: 80rem; - --text-xs: 0.75rem; - --text-xs--line-height: calc(1 / 0.75); - --text-sm: 0.875rem; - --text-sm--line-height: calc(1.25 / 0.875); - --text-base: 1rem; - --text-base--line-height: calc(1.5 / 1); - --text-lg: 1.125rem; - --text-lg--line-height: calc(1.75 / 1.125); - --text-xl: 1.25rem; - --text-xl--line-height: calc(1.75 / 1.25); - --text-2xl: 1.5rem; - --text-2xl--line-height: calc(2 / 1.5); - --text-3xl: 1.875rem; - --text-3xl--line-height: calc(2.25 / 1.875); - --text-4xl: 2.25rem; - --text-4xl--line-height: calc(2.5 / 2.25); - --text-5xl: 3rem; - --text-5xl--line-height: 1; - --text-6xl: 3.75rem; - --text-6xl--line-height: 1; - --font-weight-normal: 400; - --font-weight-medium: 500; - --font-weight-semibold: 600; - --font-weight-bold: 700; - --font-weight-extrabold: 800; - --font-weight-black: 900; - --tracking-tight: -0.025em; - --tracking-wider: 0.05em; - --tracking-widest: 0.1em; - --leading-tight: 1.25; - --leading-snug: 1.375; - --leading-normal: 1.5; - --leading-relaxed: 1.625; - --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1); - --animate-spin: spin 1s linear infinite; - --blur-sm: 8px; - --blur-xl: 24px; - --blur-3xl: 64px; - --aspect-video: 16 / 9; - --default-transition-duration: 150ms; - --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); - --default-font-family: var(--font-sans); - --default-mono-font-family: var(--font-geist-mono); - --font-heading: var(--font-heading); - --color-accent: var(--accent); - --color-success: var(--success); - --color-secondary: var(--secondary); - --color-primary: var(--primary); - } -} -@layer base { - *, ::after, ::before, ::backdrop, ::file-selector-button { - box-sizing: border-box; - margin: 0; - padding: 0; - border: 0 solid; - } - html, :host { - line-height: 1.5; - -webkit-text-size-adjust: 100%; - tab-size: 4; - font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"); - font-feature-settings: var(--default-font-feature-settings, normal); - font-variation-settings: var(--default-font-variation-settings, normal); - -webkit-tap-highlight-color: transparent; - } - hr { - height: 0; - color: inherit; - border-top-width: 1px; - } - abbr:where([title]) { - -webkit-text-decoration: underline dotted; - text-decoration: underline dotted; - } - h1, h2, h3, h4, h5, h6 { - font-size: inherit; - font-weight: inherit; - } - a { - color: inherit; - -webkit-text-decoration: inherit; - text-decoration: inherit; - } - b, strong { - font-weight: bolder; - } - code, kbd, samp, pre { - font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace); - font-feature-settings: var(--default-mono-font-feature-settings, normal); - font-variation-settings: var(--default-mono-font-variation-settings, normal); - font-size: 1em; - } - small { - font-size: 80%; - } - sub, sup { - font-size: 75%; - line-height: 0; - position: relative; - vertical-align: baseline; - } - sub { - bottom: -0.25em; - } - sup { - top: -0.5em; - } - table { - text-indent: 0; - border-color: inherit; - border-collapse: collapse; - } - :-moz-focusring { - outline: auto; - } - progress { - vertical-align: baseline; - } - summary { - display: list-item; - } - ol, ul, menu { - list-style: none; - } - img, svg, video, canvas, audio, iframe, embed, object { - display: block; - vertical-align: middle; - } - img, video { - max-width: 100%; - height: auto; - } - button, input, select, optgroup, textarea, ::file-selector-button { - font: inherit; - font-feature-settings: inherit; - font-variation-settings: inherit; - letter-spacing: inherit; - color: inherit; - border-radius: 0; - background-color: transparent; - opacity: 1; - } - :where(select:is([multiple], [size])) optgroup { - font-weight: bolder; - } - :where(select:is([multiple], [size])) optgroup option { - padding-inline-start: 20px; - } - ::file-selector-button { - margin-inline-end: 4px; - } - ::placeholder { - opacity: 1; - } - @supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px) { - ::placeholder { - color: currentcolor; - @supports (color: color-mix(in lab, red, red)) { - color: color-mix(in oklab, currentcolor 50%, transparent); - } - } - } - textarea { - resize: vertical; - } - ::-webkit-search-decoration { - -webkit-appearance: none; - } - ::-webkit-date-and-time-value { - min-height: 1lh; - text-align: inherit; - } - ::-webkit-datetime-edit { - display: inline-flex; - } - ::-webkit-datetime-edit-fields-wrapper { - padding: 0; - } - ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field { - padding-block: 0; - } - ::-webkit-calendar-picker-indicator { - line-height: 1; - } - :-moz-ui-invalid { - box-shadow: none; - } - button, input:where([type="button"], [type="reset"], [type="submit"]), ::file-selector-button { - appearance: button; - } - ::-webkit-inner-spin-button, ::-webkit-outer-spin-button { - height: auto; - } - [hidden]:where(:not([hidden="until-found"])) { - display: none !important; - } -} -@layer utilities { - .modal { - @layer daisyui.l1.l2.l3 { - pointer-events: none; - visibility: hidden; - position: fixed; - inset: calc(0.25rem * 0); - margin: calc(0.25rem * 0); - display: grid; - height: 100%; - max-height: none; - width: 100%; - max-width: none; - align-items: center; - justify-items: center; - background-color: transparent; - padding: calc(0.25rem * 0); - color: inherit; - transition: visibility 0.3s allow-discrete, background-color 0.3s ease-out, opacity 0.1s ease-out; - overflow: clip; - overscroll-behavior: contain; - z-index: 999; - scrollbar-gutter: auto; - &::backdrop { - display: none; - } - } - @layer daisyui.l1.l2 { - &.modal-open, &[open], &:target, .modal-toggle:checked + & { - pointer-events: auto; - visibility: visible; - opacity: 100%; - transition: visibility 0s allow-discrete, background-color 0.3s ease-out, opacity 0.1s ease-out; - background-color: oklch(0% 0 0/ 0.4); - .modal-box { - translate: 0 0; - scale: 1; - opacity: 1; - } - :root:has(&) { - --page-has-backdrop: 1; - --page-overflow: hidden; - --page-scroll-bg: var(--page-scroll-bg-on); - --page-scroll-gutter: stable; - --page-scroll-transition: var(--page-scroll-transition-on); - animation: set-page-has-scroll forwards; - animation-timeline: scroll(); - } - } - @starting-style { - &.modal-open, &[open], &:target, .modal-toggle:checked + & { - opacity: 0%; - } - } - } - } - .tab { - @layer daisyui.l1.l2.l3 { - position: relative; - display: inline-flex; - cursor: pointer; - appearance: none; - flex-wrap: wrap; - align-items: center; - justify-content: center; - text-align: center; - webkit-user-select: none; - user-select: none; - &:hover { - @media (hover: hover) { - color: var(--color-base-content); - } - } - --tab-p: 0.75rem; - --tab-bg: var(--color-base-100); - --tab-border-color: var(--color-base-300); - --tab-radius-ss: 0; - --tab-radius-se: 0; - --tab-radius-es: 0; - --tab-radius-ee: 0; - --tab-order: 0; - --tab-radius-min: calc(0.75rem - var(--border)); - --tab-radius-limit: min(var(--radius-field), var(--tab-radius-min)); - --tab-radius-grad: #0000 calc(69% - var(--border)), - var(--tab-border-color) calc(calc(69% - var(--border)) + 0.25px), - var(--tab-border-color) calc(calc(69% - var(--border)) + var(--border)), - var(--tab-bg) calc(calc(69% - var(--border)) + var(--border) + 0.25px); - border-color: #0000; - order: var(--tab-order); - height: var(--tab-height); - font-size: 0.875rem; - padding-inline-start: var(--tab-p); - padding-inline-end: var(--tab-p); - &:is(input[type="radio"]) { - min-width: fit-content; - &:after { - --tw-content: attr(aria-label); - content: var(--tw-content); - } - } - &:is(label) { - position: relative; - input { - position: absolute; - inset: calc(0.25rem * 0); - cursor: pointer; - appearance: none; - opacity: 0%; - } - } - &:checked, &:is(label:has(:checked)), &:is(.tab-active, [aria-selected="true"], [aria-current="true"], [aria-current="page"]) { - & + .tab-content { - display: block; - } - } - &:not(:checked, label:has(:checked), :hover, .tab-active, [aria-selected="true"], [aria-current="true"], [aria-current="page"] ) { - color: var(--color-base-content); - @supports (color: color-mix(in lab, red, red)) { - color: color-mix(in oklab, var(--color-base-content) 50%, transparent); - } - } - &:not(input):empty { - flex-grow: 1; - cursor: default; - } - &:focus { - --tw-outline-style: none; - outline-style: none; - @media (forced-colors: active) { - outline: 2px solid transparent; - outline-offset: 2px; - } - } - &:focus-visible, &:is(label:has(:checked:focus-visible)) { - outline: 2px solid currentColor; - outline-offset: -5px; - } - &[disabled] { - pointer-events: none; - opacity: 40%; - } - } - } - .menu { - @layer daisyui.l1.l2.l3 { - display: flex; - width: fit-content; - flex-direction: column; - flex-wrap: wrap; - padding: calc(0.25rem * 2); - --menu-active-fg: var(--color-neutral-content); - --menu-active-bg: var(--color-neutral); - font-size: 0.875rem; - :where(li ul) { - position: relative; - margin-inline-start: calc(0.25rem * 4); - padding-inline-start: calc(0.25rem * 2); - white-space: nowrap; - &:before { - position: absolute; - inset-inline-start: calc(0.25rem * 0); - top: calc(0.25rem * 3); - bottom: calc(0.25rem * 3); - background-color: var(--color-base-content); - opacity: 10%; - width: var(--border); - content: ""; - } - } - :where(li > .menu-dropdown:not(.menu-dropdown-show)) { - display: none; - } - :where(li:not(.menu-title) > *:not(ul, details, .menu-title, .btn)), :where(li:not(.menu-title) > details > summary:not(.menu-title)) { - display: grid; - grid-auto-flow: column; - align-content: flex-start; - align-items: center; - gap: calc(0.25rem * 2); - border-radius: var(--radius-field); - padding-inline: calc(0.25rem * 3); - padding-block: calc(0.25rem * 1.5); - text-align: start; - transition-property: color, background-color, box-shadow; - transition-duration: 0.2s; - transition-timing-function: cubic-bezier(0, 0, 0.2, 1); - grid-auto-columns: minmax(auto, max-content) auto max-content; - text-wrap: balance; - user-select: none; - } - :where(li > details > summary) { - --tw-outline-style: none; - outline-style: none; - @media (forced-colors: active) { - outline: 2px solid transparent; - outline-offset: 2px; - } - &::-webkit-details-marker { - display: none; - } - } - :where(li > details > summary), :where(li > .menu-dropdown-toggle) { - &:after { - justify-self: flex-end; - display: block; - height: 0.375rem; - width: 0.375rem; - rotate: -135deg; - translate: 0 -1px; - transition-property: rotate, translate; - transition-duration: 0.2s; - content: ""; - transform-origin: 50% 50%; - box-shadow: 2px 2px inset; - pointer-events: none; - } - } - details { - overflow: hidden; - interpolate-size: allow-keywords; - } - details::details-content { - block-size: 0; - @media (prefers-reduced-motion: no-preference) { - transition-behavior: allow-discrete; - transition-property: block-size, content-visibility; - transition-duration: 0.2s; - transition-timing-function: cubic-bezier(0, 0, 0.2, 1); - } - } - details[open]::details-content { - block-size: auto; - } - :where(li > details[open] > summary):after, :where(li > .menu-dropdown-toggle.menu-dropdown-show):after { - rotate: 45deg; - translate: 0 1px; - } - :where(li:not(.menu-title, .disabled) > *:not(ul, details, .menu-title), li:not(.menu-title, .disabled) > details > summary:not(.menu-title) ):not(.menu-active, :active, .btn) { - &.menu-focus, &:focus-visible { - cursor: pointer; - background-color: var(--color-base-content); - @supports (color: color-mix(in lab, red, red)) { - background-color: color-mix(in oklab, var(--color-base-content) 10%, transparent); - } - color: var(--color-base-content); - --tw-outline-style: none; - outline-style: none; - @media (forced-colors: active) { - outline: 2px solid transparent; - outline-offset: 2px; - } - } - } - :where(li:not(.menu-title, .disabled) > *:not(ul, details, .menu-title):not(.menu-active, :active, .btn):hover, li:not(.menu-title, .disabled) > details > summary:not(.menu-title):not(.menu-active, :active, .btn):hover ) { - cursor: pointer; - background-color: var(--color-base-content); - @supports (color: color-mix(in lab, red, red)) { - background-color: color-mix(in oklab, var(--color-base-content) 10%, transparent); - } - --tw-outline-style: none; - outline-style: none; - @media (forced-colors: active) { - outline: 2px solid transparent; - outline-offset: 2px; - } - box-shadow: 0 1px oklch(0% 0 0 / 0.01) inset, 0 -1px oklch(100% 0 0 / 0.01) inset; - } - :where(li:empty) { - background-color: var(--color-base-content); - opacity: 10%; - margin: 0.5rem 1rem; - height: 1px; - } - :where(li) { - position: relative; - display: flex; - flex-shrink: 0; - flex-direction: column; - flex-wrap: wrap; - align-items: stretch; - .badge { - justify-self: flex-end; - } - & > *:not(ul, .menu-title, details, .btn):active, & > *:not(ul, .menu-title, details, .btn).menu-active, & > details > summary:active { - --tw-outline-style: none; - outline-style: none; - @media (forced-colors: active) { - outline: 2px solid transparent; - outline-offset: 2px; - } - color: var(--menu-active-fg); - background-color: var(--menu-active-bg); - background-size: auto, calc(var(--noise) * 100%); - background-image: none, var(--fx-noise); - &:not(&:active) { - box-shadow: 0 2px calc(var(--depth) * 3px) -2px var(--menu-active-bg); - } - } - &.menu-disabled { - pointer-events: none; - color: var(--color-base-content); - @supports (color: color-mix(in lab, red, red)) { - color: color-mix(in oklab, var(--color-base-content) 20%, transparent); - } - } - } - .dropdown:focus-within { - .menu-dropdown-toggle:after { - rotate: 45deg; - translate: 0 1px; - } - } - .dropdown-content { - margin-top: calc(0.25rem * 2); - padding: calc(0.25rem * 2); - &:before { - display: none; - } - } - } - } - .collapse-arrow { - @layer daisyui.l1.l2 { - > .collapse-title:after { - position: absolute; - display: block; - height: 0.5rem; - width: 0.5rem; - transform: translateY(-100%) rotate(45deg); - @media (prefers-reduced-motion: no-preference) { - transition-property: all; - transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); - transition-duration: 0.2s; - } - top: 50%; - inset-inline-end: 1.4rem; - content: ""; - transform-origin: 75% 75%; - box-shadow: 2px 2px; - pointer-events: none; - } - } - } - .btn { - :where(&) { - @layer daisyui.l1.l2.l3 { - width: unset; - } - } - @layer daisyui.l1.l2.l3 { - display: inline-flex; - flex-shrink: 0; - cursor: pointer; - flex-wrap: nowrap; - align-items: center; - justify-content: center; - gap: calc(0.25rem * 1.5); - text-align: center; - vertical-align: middle; - outline-offset: 2px; - webkit-user-select: none; - user-select: none; - padding-inline: var(--btn-p); - color: var(--btn-fg); - --tw-prose-links: var(--btn-fg); - height: var(--size); - font-size: var(--fontsize, 0.875rem); - font-weight: 600; - outline-color: var(--btn-color, var(--color-base-content)); - transition-property: color, background-color, border-color, box-shadow; - transition-timing-function: cubic-bezier(0, 0, 0.2, 1); - transition-duration: 0.2s; - border-start-start-radius: var(--join-ss, var(--radius-field)); - border-start-end-radius: var(--join-se, var(--radius-field)); - border-end-start-radius: var(--join-es, var(--radius-field)); - border-end-end-radius: var(--join-ee, var(--radius-field)); - background-color: var(--btn-bg); - background-size: auto, calc(var(--noise) * 100%); - background-image: none, var(--btn-noise); - border-width: var(--border); - border-style: solid; - border-color: var(--btn-border); - text-shadow: 0 0.5px oklch(100% 0 0 / calc(var(--depth) * 0.15)); - touch-action: manipulation; - box-shadow: 0 0.5px 0 0.5px oklch(100% 0 0 / calc(var(--depth) * 6%)) inset, var(--btn-shadow); - --size: calc(var(--size-field, 0.25rem) * 10); - --btn-bg: var(--btn-color, var(--color-base-200)); - --btn-fg: var(--color-base-content); - --btn-p: 1rem; - --btn-border: var(--btn-bg); - @supports (color: color-mix(in lab, red, red)) { - --btn-border: color-mix(in oklab, var(--btn-bg), #000 calc(var(--depth) * 5%)); - } - --btn-shadow: 0 3px 2px -2px var(--btn-bg), - 0 4px 3px -2px var(--btn-bg); - @supports (color: color-mix(in lab, red, red)) { - --btn-shadow: 0 3px 2px -2px color-mix(in oklab, var(--btn-bg) calc(var(--depth) * 30%), #0000), - 0 4px 3px -2px color-mix(in oklab, var(--btn-bg) calc(var(--depth) * 30%), #0000); - } - --btn-noise: var(--fx-noise); - @media (hover: hover) { - &:hover { - --btn-bg: var(--btn-color, var(--color-base-200)); - @supports (color: color-mix(in lab, red, red)) { - --btn-bg: color-mix(in oklab, var(--btn-color, var(--color-base-200)), #000 7%); - } - } - } - &:focus-visible, &:has(:focus-visible) { - outline-width: 2px; - outline-style: solid; - isolation: isolate; - } - &:active:not(.btn-active) { - translate: 0 0.5px; - --btn-bg: var(--btn-color, var(--color-base-200)); - @supports (color: color-mix(in lab, red, red)) { - --btn-bg: color-mix(in oklab, var(--btn-color, var(--color-base-200)), #000 5%); - } - --btn-border: var(--btn-color, var(--color-base-200)); - @supports (color: color-mix(in lab, red, red)) { - --btn-border: color-mix(in oklab, var(--btn-color, var(--color-base-200)), #000 7%); - } - --btn-shadow: 0 0 0 0 oklch(0% 0 0/0), 0 0 0 0 oklch(0% 0 0/0); - } - &:is(input[type="checkbox"], input[type="radio"]) { - appearance: none; - &::after { - --tw-content: attr(aria-label); - content: var(--tw-content); - } - } - &:where(input:checked:not(.filter .btn)) { - --btn-color: var(--color-primary); - --btn-fg: var(--color-primary-content); - isolation: isolate; - } - } - &:disabled { - @layer daisyui.l1.l2 { - &:not(.btn-link, .btn-ghost) { - background-color: var(--color-base-content); - @supports (color: color-mix(in lab, red, red)) { - background-color: color-mix(in oklab, var(--color-base-content) 10%, transparent); - } - box-shadow: none; - } - pointer-events: none; - --btn-border: #0000; - --btn-noise: none; - --btn-fg: var(--color-base-content); - @supports (color: color-mix(in lab, red, red)) { - --btn-fg: color-mix(in oklch, var(--color-base-content) 20%, #0000); - } - } - } - &[disabled] { - @layer daisyui.l1.l2 { - &:not(.btn-link, .btn-ghost) { - background-color: var(--color-base-content); - @supports (color: color-mix(in lab, red, red)) { - background-color: color-mix(in oklab, var(--color-base-content) 10%, transparent); - } - box-shadow: none; - } - pointer-events: none; - --btn-border: #0000; - --btn-noise: none; - --btn-fg: var(--color-base-content); - @supports (color: color-mix(in lab, red, red)) { - --btn-fg: color-mix(in oklch, var(--color-base-content) 20%, #0000); - } - } - } - } - .loading { - @layer daisyui.l1.l2.l3 { - pointer-events: none; - display: inline-block; - aspect-ratio: 1 / 1; - background-color: currentcolor; - vertical-align: middle; - width: calc(var(--size-selector, 0.25rem) * 6); - mask-size: 100%; - mask-repeat: no-repeat; - mask-position: center; - mask-image: url("data:image/svg+xml,%3Csvg width='24' height='24' stroke='black' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg transform-origin='center'%3E%3Ccircle cx='12' cy='12' r='9.5' fill='none' stroke-width='3' stroke-linecap='round'%3E%3CanimateTransform attributeName='transform' type='rotate' from='0 12 12' to='360 12 12' dur='2s' repeatCount='indefinite'/%3E%3Canimate attributeName='stroke-dasharray' values='0,150;42,150;42,150' keyTimes='0;0.475;1' dur='1.5s' repeatCount='indefinite'/%3E%3Canimate attributeName='stroke-dashoffset' values='0;-16;-59' keyTimes='0;0.475;1' dur='1.5s' repeatCount='indefinite'/%3E%3C/circle%3E%3C/g%3E%3C/svg%3E"); - } - } - .pointer-events-auto { - pointer-events: auto; - } - .pointer-events-none { - pointer-events: none; - } - .collapse { - &:not(td, tr, colgroup) { - visibility: revert-layer; - } - @layer daisyui.l1.l2.l3 { - display: grid; - position: relative; - overflow: hidden; - border-radius: var(--radius-box, 1rem); - width: 100%; - grid-template-rows: max-content 0fr; - grid-template-columns: minmax(0, 1fr); - isolation: isolate; - @media (prefers-reduced-motion: no-preference) { - transition: grid-template-rows 0.2s; - } - > input:is([type="checkbox"], [type="radio"]) { - grid-column-start: 1; - grid-row-start: 1; - appearance: none; - opacity: 0; - z-index: 1; - width: 100%; - padding: 1rem; - padding-inline-end: 3rem; - min-height: 1lh; - transition: background-color 0.2s ease-out; - } - &:is([open], [tabindex]:focus:not(.collapse-close), [tabindex]:focus-within:not(.collapse-close) ), &:not(.collapse-close):has( > input:is([type="checkbox"], [type="radio"]):checked) { - grid-template-rows: max-content 1fr; - } - &:is([open], [tabindex]:focus:not(.collapse-close), [tabindex]:focus-within:not(.collapse-close) ) > .collapse-content, &:not(.collapse-close) > :where(input:is([type="checkbox"], [type="radio"]):checked ~ .collapse-content) { - content-visibility: visible; - min-height: fit-content; - @supports not (content-visibility: visible) { - visibility: visible; - } - } - &:focus-visible, &:has( > input:is([type="checkbox"], [type="radio"]):focus-visible), &:has(summary:focus-visible) { - outline-color: var(--color-base-content); - outline-style: solid; - outline-width: 2px; - outline-offset: 2px; - } - &:not(.collapse-close) { - > input[type="checkbox"], > input[type="radio"]:not(:checked), > .collapse-title { - cursor: pointer; - } - } - &[tabindex]:focus:not(.collapse-close, .collapse[open]), &[tabindex]:focus-within:not(.collapse-close, .collapse[open]) { - > .collapse-title { - cursor: unset; - } - } - &:is([open], [tabindex]:focus:not(.collapse-close), [tabindex]:focus-within:not(.collapse-close) ) > :where(.collapse-content), &:not(.collapse-close) > :where(input:is([type="checkbox"], [type="radio"]):checked ~ .collapse-content) { - padding-bottom: 1rem; - } - } - @layer daisyui.l1.l2 { - &:is([open]) { - &.collapse-arrow { - > .collapse-title:after { - @media (prefers-reduced-motion: no-preference) { - transform: translateY(-50%) rotate(225deg); - } - } - } - } - &.collapse-open { - &.collapse-arrow { - > .collapse-title:after { - @media (prefers-reduced-motion: no-preference) { - transform: translateY(-50%) rotate(225deg); - } - } - } - &.collapse-plus { - > .collapse-title:after { - --tw-content: "−"; - content: var(--tw-content); - } - } - } - &[tabindex].collapse-arrow:focus:not(.collapse-close), &.collapse-arrow[tabindex]:focus-within:not(.collapse-close) { - > .collapse-title:after { - transform: translateY(-50%) rotate(225deg); - } - } - &.collapse-arrow:not(.collapse-close) { - > input:is([type="checkbox"], [type="radio"]):checked ~ .collapse-title:after { - transform: translateY(-50%) rotate(225deg); - } - } - &[open] { - &.collapse-plus { - > .collapse-title:after { - --tw-content: "−"; - content: var(--tw-content); - } - } - } - &[tabindex].collapse-plus:focus:not(.collapse-close) { - > .collapse-title:after { - --tw-content: "−"; - content: var(--tw-content); - } - } - &.collapse-plus:not(.collapse-close) { - > input:is([type="checkbox"], [type="radio"]):checked ~ .collapse-title:after { - --tw-content: "−"; - content: var(--tw-content); - } - } - } - &:is(details) { - @layer daisyui.l1.l2.l3 { - width: 100%; - @media (prefers-reduced-motion: no-preference) { - &::details-content { - transition: content-visibility 0.2s allow-discrete, visibility 0.2s allow-discrete, padding 0.2s ease-out, background-color 0.2s ease-out, height 0.2s; - height: 0; - interpolate-size: allow-keywords; - } - &:where([open])::details-content { - height: auto; - } - } - & summary { - position: relative; - display: block; - &::-webkit-details-marker { - display: none; - } - } - & > .collapse-content { - content-visibility: visible; - } - } - } - &:is(details) summary { - @layer daisyui.l1.l2.l3 { - outline: none; - } - } - } - .collapse-content { - @layer daisyui.l1.l2.l3 { - grid-column-start: 1; - grid-row-start: 1; - } - @layer daisyui.l1.l2.l3 { - content-visibility: hidden; - grid-column-start: 1; - grid-row-start: 2; - min-height: 0; - padding-left: 1rem; - padding-right: 1rem; - cursor: unset; - @supports not (content-visibility: hidden) { - visibility: hidden; - } - @media (prefers-reduced-motion: no-preference) { - transition: content-visibility 0.2s allow-discrete, visibility 0.2s allow-discrete, padding 0.2s ease-out, background-color 0.2s ease-out; - } - } - } - .collapse { - visibility: collapse; - } - .list { - @layer daisyui.l1.l2.l3 { - display: flex; - flex-direction: column; - font-size: 0.875rem; - .list-row { - --list-grid-cols: minmax(0, auto) 1fr; - position: relative; - display: grid; - grid-auto-flow: column; - gap: calc(0.25rem * 4); - border-radius: var(--radius-box); - padding: calc(0.25rem * 4); - word-break: break-word; - grid-template-columns: var(--list-grid-cols); - } - & > :not(:last-child) { - &.list-row, .list-row { - &:after { - content: ""; - border-bottom: var(--border) solid; - inset-inline: var(--radius-box); - position: absolute; - bottom: calc(0.25rem * 0); - border-color: var(--color-base-content); - @supports (color: color-mix(in lab, red, red)) { - border-color: color-mix(in oklab, var(--color-base-content) 5%, transparent); - } - } - } - } - } - @layer daisyui.l1.l2 { - .list-row { - &:has(.list-col-grow:nth-child(1)) { - --list-grid-cols: 1fr; - } - &:has(.list-col-grow:nth-child(2)) { - --list-grid-cols: minmax(0, auto) 1fr; - } - &:has(.list-col-grow:nth-child(3)) { - --list-grid-cols: minmax(0, auto) minmax(0, auto) 1fr; - } - &:has(.list-col-grow:nth-child(4)) { - --list-grid-cols: minmax(0, auto) minmax(0, auto) minmax(0, auto) 1fr; - } - &:has(.list-col-grow:nth-child(5)) { - --list-grid-cols: minmax(0, auto) minmax(0, auto) minmax(0, auto) minmax(0, auto) 1fr; - } - &:has(.list-col-grow:nth-child(6)) { - --list-grid-cols: minmax(0, auto) minmax(0, auto) minmax(0, auto) minmax(0, auto) - minmax(0, auto) 1fr; - } - > :not(.list-col-wrap) { - grid-row-start: 1; - } - } - } - } - .steps { - @layer daisyui.l1.l2.l3 { - display: inline-grid; - grid-auto-flow: column; - overflow: hidden; - overflow-x: auto; - counter-reset: step; - grid-auto-columns: 1fr; - .step { - display: grid; - grid-template-columns: repeat(1, minmax(0, 1fr)); - grid-template-columns: auto; - grid-template-rows: repeat(2, minmax(0, 1fr)); - grid-template-rows: 40px 1fr; - place-items: center; - text-align: center; - min-width: 4rem; - --step-bg: var(--color-base-300); - --step-fg: var(--color-base-content); - &:before { - top: calc(0.25rem * 0); - grid-column-start: 1; - grid-row-start: 1; - height: calc(0.25rem * 2); - width: 100%; - border: 1px solid; - color: var(--step-bg); - background-color: var(--step-bg); - content: ""; - margin-inline-start: -100%; - } - > .step-icon, &:not(:has(.step-icon)):after { - --tw-content: counter(step); - content: var(--tw-content); - counter-increment: step; - z-index: 1; - color: var(--step-fg); - background-color: var(--step-bg); - border: 1px solid var(--step-bg); - position: relative; - grid-column-start: 1; - grid-row-start: 1; - display: grid; - height: calc(0.25rem * 8); - width: calc(0.25rem * 8); - place-items: center; - place-self: center; - border-radius: calc(infinity * 1px); - } - &:first-child:before { - --tw-content: none; - content: var(--tw-content); - } - &[data-content]:after { - --tw-content: attr(data-content); - content: var(--tw-content); - } - } - } - @layer daisyui.l1.l2 { - .step-neutral { - + .step-neutral:before, &:after, > .step-icon { - --step-bg: var(--color-neutral); - --step-fg: var(--color-neutral-content); - } - } - .step-primary { - + .step-primary:before, &:after, > .step-icon { - --step-bg: var(--color-primary); - --step-fg: var(--color-primary-content); - } - } - .step-secondary { - + .step-secondary:before, &:after, > .step-icon { - --step-bg: var(--color-secondary); - --step-fg: var(--color-secondary-content); - } - } - .step-accent { - + .step-accent:before, &:after, > .step-icon { - --step-bg: var(--color-accent); - --step-fg: var(--color-accent-content); - } - } - .step-info { - + .step-info:before, &:after, > .step-icon { - --step-bg: var(--color-info); - --step-fg: var(--color-info-content); - } - } - .step-success { - + .step-success:before, &:after, > .step-icon { - --step-bg: var(--color-success); - --step-fg: var(--color-success-content); - } - } - .step-warning { - + .step-warning:before, &:after, > .step-icon { - --step-bg: var(--color-warning); - --step-fg: var(--color-warning-content); - } - } - .step-error { - + .step-error:before, &:after, > .step-icon { - --step-bg: var(--color-error); - --step-fg: var(--color-error-content); - } - } - } - } - .range { - @layer daisyui.l1.l2.l3 { - appearance: none; - webkit-appearance: none; - --range-thumb: var(--color-base-100); - --range-thumb-size: calc(var(--size-selector, 0.25rem) * 6); - --range-progress: currentColor; - --range-fill: 1; - --range-p: 0.25rem; - --range-bg: currentColor; - @supports (color: color-mix(in lab, red, red)) { - --range-bg: color-mix(in oklab, currentColor 10%, #0000); - } - cursor: pointer; - overflow: hidden; - background-color: transparent; - vertical-align: middle; - width: clamp(3rem, 20rem, 100%); - --radius-selector-max: calc( - var(--radius-selector) + var(--radius-selector) + var(--radius-selector) - ); - border-radius: calc(var(--radius-selector) + min(var(--range-p), var(--radius-selector-max))); - border: none; - height: var(--range-thumb-size); - [dir="rtl"] & { - --range-dir: -1; - } - &:focus { - outline: none; - } - &:focus-visible { - outline: 2px solid; - outline-offset: 2px; - } - &::-webkit-slider-runnable-track { - width: 100%; - background-color: var(--range-bg); - border-radius: var(--radius-selector); - height: calc(var(--range-thumb-size) * 0.5); - } - @media (forced-colors: active) { - &::-webkit-slider-runnable-track { - border: 1px solid; - } - } - @media (forced-colors: active) { - &::-moz-range-track { - border: 1px solid; - } - } - &::-webkit-slider-thumb { - position: relative; - box-sizing: border-box; - border-radius: calc(var(--radius-selector) + min(var(--range-p), var(--radius-selector-max))); - background-color: var(--range-thumb); - height: var(--range-thumb-size); - width: var(--range-thumb-size); - border: var(--range-p) solid; - appearance: none; - webkit-appearance: none; - top: 50%; - color: var(--range-progress); - transform: translateY(-50%); - box-shadow: 0 -1px oklch(0% 0 0 / calc(var(--depth) * 0.1)) inset, 0 8px 0 -4px oklch(100% 0 0 / calc(var(--depth) * 0.1)) inset, 0 1px currentColor, 0 0 0 2rem var(--range-thumb) inset, calc((var(--range-dir, 1) * -100rem) - (var(--range-dir, 1) * var(--range-thumb-size) / 2)) 0 0 calc(100rem * var(--range-fill)); - @supports (color: color-mix(in lab, red, red)) { - box-shadow: 0 -1px oklch(0% 0 0 / calc(var(--depth) * 0.1)) inset, 0 8px 0 -4px oklch(100% 0 0 / calc(var(--depth) * 0.1)) inset, 0 1px color-mix(in oklab, currentColor calc(var(--depth) * 10%), #0000), 0 0 0 2rem var(--range-thumb) inset, calc((var(--range-dir, 1) * -100rem) - (var(--range-dir, 1) * var(--range-thumb-size) / 2)) 0 0 calc(100rem * var(--range-fill)); - } - } - &::-moz-range-track { - width: 100%; - background-color: var(--range-bg); - border-radius: var(--radius-selector); - height: calc(var(--range-thumb-size) * 0.5); - } - &::-moz-range-thumb { - position: relative; - box-sizing: border-box; - border-radius: calc(var(--radius-selector) + min(var(--range-p), var(--radius-selector-max))); - background-color: currentColor; - height: var(--range-thumb-size); - width: var(--range-thumb-size); - border: var(--range-p) solid; - top: 50%; - color: var(--range-progress); - box-shadow: 0 -1px oklch(0% 0 0 / calc(var(--depth) * 0.1)) inset, 0 8px 0 -4px oklch(100% 0 0 / calc(var(--depth) * 0.1)) inset, 0 1px currentColor, 0 0 0 2rem var(--range-thumb) inset, calc((var(--range-dir, 1) * -100rem) - (var(--range-dir, 1) * var(--range-thumb-size) / 2)) 0 0 calc(100rem * var(--range-fill)); - @supports (color: color-mix(in lab, red, red)) { - box-shadow: 0 -1px oklch(0% 0 0 / calc(var(--depth) * 0.1)) inset, 0 8px 0 -4px oklch(100% 0 0 / calc(var(--depth) * 0.1)) inset, 0 1px color-mix(in oklab, currentColor calc(var(--depth) * 10%), #0000), 0 0 0 2rem var(--range-thumb) inset, calc((var(--range-dir, 1) * -100rem) - (var(--range-dir, 1) * var(--range-thumb-size) / 2)) 0 0 calc(100rem * var(--range-fill)); - } - } - &:disabled { - cursor: not-allowed; - opacity: 30%; - } - } - } - .select { - @layer daisyui.l1.l2.l3 { - border: var(--border) solid #0000; - position: relative; - display: inline-flex; - flex-shrink: 1; - appearance: none; - align-items: center; - gap: calc(0.25rem * 1.5); - background-color: var(--color-base-100); - padding-inline-start: calc(0.25rem * 3); - padding-inline-end: calc(0.25rem * 7); - vertical-align: middle; - width: clamp(3rem, 20rem, 100%); - height: var(--size); - font-size: 0.875rem; - touch-action: manipulation; - border-start-start-radius: var(--join-ss, var(--radius-field)); - border-start-end-radius: var(--join-se, var(--radius-field)); - border-end-start-radius: var(--join-es, var(--radius-field)); - border-end-end-radius: var(--join-ee, var(--radius-field)); - background-image: linear-gradient(45deg, #0000 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, #0000 50%); - background-position: calc(100% - 20px) calc(1px + 50%), calc(100% - 16.1px) calc(1px + 50%); - background-size: 4px 4px, 4px 4px; - background-repeat: no-repeat; - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - box-shadow: 0 1px var(--input-color) inset, 0 -1px oklch(100% 0 0 / calc(var(--depth) * 0.1)) inset; - @supports (color: color-mix(in lab, red, red)) { - box-shadow: 0 1px color-mix(in oklab, var(--input-color) calc(var(--depth) * 10%), #0000) inset, 0 -1px oklch(100% 0 0 / calc(var(--depth) * 0.1)) inset; - } - border-color: var(--input-color); - --input-color: var(--color-base-content); - @supports (color: color-mix(in lab, red, red)) { - --input-color: color-mix(in oklab, var(--color-base-content) 20%, #0000); - } - --size: calc(var(--size-field, 0.25rem) * 10); - [dir="rtl"] & { - background-position: calc(0% + 12px) calc(1px + 50%), calc(0% + 16px) calc(1px + 50%); - &::picker(select), select::picker(select) { - translate: 0.5rem 0; - } - } - &[multiple] { - height: auto; - overflow: auto; - padding-block: calc(0.25rem * 3); - padding-inline-end: calc(0.25rem * 3); - background-image: none; - } - select { - margin-inline-start: calc(0.25rem * -3); - margin-inline-end: calc(0.25rem * -7); - width: calc(100% + 2.75rem); - appearance: none; - padding-inline-start: calc(0.25rem * 3); - padding-inline-end: calc(0.25rem * 7); - height: calc(100% - calc(var(--border) * 2)); - align-items: center; - background: inherit; - border-radius: inherit; - border-style: none; - &:focus, &:focus-within { - --tw-outline-style: none; - outline-style: none; - @media (forced-colors: active) { - outline: 2px solid transparent; - outline-offset: 2px; - } - } - &:not(:last-child) { - margin-inline-end: calc(0.25rem * -5.5); - background-image: none; - } - } - &:focus, &:focus-within { - --input-color: var(--color-base-content); - box-shadow: 0 1px var(--input-color); - @supports (color: color-mix(in lab, red, red)) { - box-shadow: 0 1px color-mix(in oklab, var(--input-color) calc(var(--depth) * 10%), #0000); - } - outline: 2px solid var(--input-color); - outline-offset: 2px; - isolation: isolate; - z-index: 1; - } - &:has( > select[disabled]), &:is(:disabled, [disabled]), fieldset:disabled & { - cursor: not-allowed; - border-color: var(--color-base-200); - background-color: var(--color-base-200); - color: var(--color-base-content); - @supports (color: color-mix(in lab, red, red)) { - color: color-mix(in oklab, var(--color-base-content) 40%, transparent); - } - &::placeholder { - color: var(--color-base-content); - @supports (color: color-mix(in lab, red, red)) { - color: color-mix(in oklab, var(--color-base-content) 20%, transparent); - } - } - } - &:has( > select[disabled]) > select[disabled] { - cursor: not-allowed; - } - &, & select { - @supports (appearance: base-select) { - appearance: base-select; - } - @supports (appearance: base-select) { - &::picker(select) { - appearance: base-select; - } - } - &::picker(select) { - color: inherit; - max-height: min(24rem, 70dvh); - margin-inline: 0.5rem; - translate: -0.5rem 0; - border: var(--border) solid var(--color-base-200); - margin-block: calc(0.25rem * 2); - border-radius: var(--radius-box); - padding: calc(0.25rem * 2); - background-color: inherit; - box-shadow: 0 2px calc(var(--depth) * 3px) -2px oklch(0% 0 0/0.2); - box-shadow: 0 20px 25px -5px rgb(0 0 0 / calc(var(--depth) * 0.1)), 0 8px 10px -6px rgb(0 0 0 / calc(var(--depth) * 0.1)); - } - &::picker-icon { - display: none; - } - optgroup { - padding-top: 0.5em; - option { - &:nth-child(1) { - margin-top: 0.5em; - } - } - } - option { - border-radius: var(--radius-field); - padding-inline: calc(0.25rem * 3); - padding-block: calc(0.25rem * 1.5); - transition-property: color, background-color; - transition-duration: 0.2s; - transition-timing-function: cubic-bezier(0, 0, 0.2, 1); - white-space: normal; - &:not(:disabled) { - &:hover, &:focus-visible { - cursor: pointer; - background-color: var(--color-base-content); - @supports (color: color-mix(in lab, red, red)) { - background-color: color-mix(in oklab, var(--color-base-content) 10%, transparent); - } - --tw-outline-style: none; - outline-style: none; - @media (forced-colors: active) { - outline: 2px solid transparent; - outline-offset: 2px; - } - } - &:active { - background-color: var(--color-neutral); - color: var(--color-neutral-content); - box-shadow: 0 2px calc(var(--depth) * 3px) -2px var(--color-neutral); - } - } - } - } - } - } - .collapse-title { - @layer daisyui.l1.l2.l3 { - grid-column-start: 1; - grid-row-start: 1; - } - @layer daisyui.l1.l2.l3 { - position: relative; - width: 100%; - padding: 1rem; - padding-inline-end: 3rem; - min-height: 1lh; - transition: background-color 0.2s ease-out; - } - } - .checkbox { - @layer daisyui.l1.l2.l3 { - border: var(--border) solid var(--input-color, var(--color-base-content)); - @supports (color: color-mix(in lab, red, red)) { - border: var(--border) solid var(--input-color, color-mix(in oklab, var(--color-base-content) 20%, #0000)); - } - position: relative; - display: inline-block; - flex-shrink: 0; - cursor: pointer; - appearance: none; - border-radius: var(--radius-selector); - padding: calc(0.25rem * 1); - vertical-align: middle; - color: var(--color-base-content); - box-shadow: 0 1px oklch(0% 0 0 / calc(var(--depth) * 0.1)) inset, 0 0 #0000 inset, 0 0 #0000; - transition: background-color 0.2s, box-shadow 0.2s; - --size: calc(var(--size-selector, 0.25rem) * 6); - width: var(--size); - height: var(--size); - background-size: auto, calc(var(--noise) * 100%); - background-image: none, var(--fx-noise); - &:before { - --tw-content: ""; - content: var(--tw-content); - display: block; - width: 100%; - height: 100%; - rotate: 45deg; - background-color: currentcolor; - opacity: 0%; - transition: clip-path 0.3s, opacity 0.1s, rotate 0.3s, translate 0.3s; - transition-delay: 0.1s; - clip-path: polygon(20% 100%, 20% 80%, 50% 80%, 50% 80%, 70% 80%, 70% 100%); - box-shadow: 0px 3px 0 0px oklch(100% 0 0 / calc(var(--depth) * 0.1)) inset; - font-size: 1rem; - line-height: 0.75; - } - &:focus-visible { - outline: 2px solid var(--input-color, currentColor); - outline-offset: 2px; - } - &:checked, &[aria-checked="true"] { - background-color: var(--input-color, #0000); - box-shadow: 0 0 #0000 inset, 0 8px 0 -4px oklch(100% 0 0 / calc(var(--depth) * 0.1)) inset, 0 1px oklch(0% 0 0 / calc(var(--depth) * 0.1)); - &:before { - clip-path: polygon(20% 100%, 20% 80%, 50% 80%, 50% 0%, 70% 0%, 70% 100%); - opacity: 100%; - } - @media (forced-colors: active) { - &:before { - rotate: 0deg; - background-color: transparent; - --tw-content: "✔︎"; - clip-path: none; - } - } - @media print { - &:before { - rotate: 0deg; - background-color: transparent; - --tw-content: "✔︎"; - clip-path: none; - } - } - } - &:indeterminate { - background-color: var( --input-color, var(--color-base-content) ); - @supports (color: color-mix(in lab, red, red)) { - background-color: var( --input-color, color-mix(in oklab, var(--color-base-content) 20%, #0000) ); - } - &:before { - rotate: 0deg; - opacity: 100%; - translate: 0 -35%; - clip-path: polygon(20% 100%, 20% 80%, 50% 80%, 50% 80%, 80% 80%, 80% 100%); - } - } - } - &:disabled { - @layer daisyui.l1.l2 { - cursor: not-allowed; - opacity: 20%; - } - } - } - .rating { - @layer daisyui.l1.l2.l3 { - position: relative; - display: inline-flex; - vertical-align: middle; - & input { - border: none; - appearance: none; - } - :where(*) { - height: calc(0.25rem * 6); - width: calc(0.25rem * 6); - border-radius: 0; - background-color: var(--color-base-content); - opacity: 20%; - @media (prefers-reduced-motion: no-preference) { - animation: rating 0.25s ease-out; - } - &:is(input) { - cursor: pointer; - } - } - & .rating-hidden { - width: calc(0.25rem * 2); - background-color: transparent; - } - input[type="radio"]:checked { - background-image: none; - } - * { - &:checked, &[aria-checked="true"], &[aria-current="true"], &:has( ~ *:checked, ~ *[aria-checked="true"], ~ *[aria-current="true"]) { - opacity: 100%; - } - &:focus-visible { - scale: 1.1; - @media (prefers-reduced-motion: no-preference) { - transition: scale 0.2s ease-out; - } - } - } - & *:active:focus { - animation: none; - scale: 1.1; - } - } - @layer daisyui.l1.l2 { - &.rating-xs :where(*:not(.rating-hidden)) { - width: calc(0.25rem * 4); - height: calc(0.25rem * 4); - } - &.rating-sm :where(*:not(.rating-hidden)) { - width: calc(0.25rem * 5); - height: calc(0.25rem * 5); - } - &.rating-md :where(*:not(.rating-hidden)) { - width: calc(0.25rem * 6); - height: calc(0.25rem * 6); - } - &.rating-lg :where(*:not(.rating-hidden)) { - width: calc(0.25rem * 7); - height: calc(0.25rem * 7); - } - &.rating-xl :where(*:not(.rating-hidden)) { - width: calc(0.25rem * 8); - height: calc(0.25rem * 8); - } - } - } - .card { - @layer daisyui.l1.l2.l3 { - position: relative; - display: flex; - flex-direction: column; - border-radius: var(--radius-box); - outline-width: 2px; - transition: outline 0.2s ease-in-out; - outline: 0 solid #0000; - outline-offset: 2px; - &:focus { - --tw-outline-style: none; - outline-style: none; - @media (forced-colors: active) { - outline: 2px solid transparent; - outline-offset: 2px; - } - } - &:focus-visible { - outline-color: currentColor; - } - :where(figure:first-child) { - overflow: hidden; - border-start-start-radius: inherit; - border-start-end-radius: inherit; - border-end-start-radius: unset; - border-end-end-radius: unset; - } - :where(figure:last-child) { - overflow: hidden; - border-start-start-radius: unset; - border-start-end-radius: unset; - border-end-start-radius: inherit; - border-end-end-radius: inherit; - } - figure { - display: flex; - align-items: center; - justify-content: center; - } - &:has( > input:is(input[type="checkbox"], input[type="radio"])) { - cursor: pointer; - user-select: none; - } - &:has( > :checked) { - outline: 2px solid currentColor; - } - } - } - .stats { - @layer daisyui.l1.l2.l3 { - position: relative; - display: inline-grid; - grid-auto-flow: column; - overflow-x: auto; - border-radius: var(--radius-box); - } - } - .absolute { - position: absolute; - } - .fixed { - position: fixed; - } - .relative { - position: relative; - } - .sticky { - position: sticky; - } - .inset-0 { - inset: 0; - } - .-top-1\.5 { - top: calc(var(--spacing) * -1.5); - } - .-top-6 { - top: calc(var(--spacing) * -6); - } - .top-0 { - top: 0; - } - .top-1\/2 { - top: calc(1 / 2 * 100%); - } - .top-4 { - top: calc(var(--spacing) * 4); - } - .top-6 { - top: calc(var(--spacing) * 6); - } - .top-10 { - top: calc(var(--spacing) * 10); - } - .top-24 { - top: calc(var(--spacing) * 24); - } - .top-full { - top: 100%; - } - .-right-1\.5 { - right: calc(var(--spacing) * -1.5); - } - .-right-6 { - right: calc(var(--spacing) * -6); - } - .-right-8 { - right: calc(var(--spacing) * -8); - } - .right-0 { - right: 0; - } - .right-4 { - right: calc(var(--spacing) * 4); - } - .right-6 { - right: calc(var(--spacing) * 6); - } - .right-\[12\%\] { - right: 12%; - } - .-bottom-8 { - bottom: calc(var(--spacing) * -8); - } - .-bottom-24 { - bottom: calc(var(--spacing) * -24); - } - .bottom-0 { - bottom: 0; - } - .-left-8 { - left: calc(var(--spacing) * -8); - } - .-left-24 { - left: calc(var(--spacing) * -24); - } - .left-0 { - left: 0; - } - .left-1\/2 { - left: calc(1 / 2 * 100%); - } - .left-3 { - left: calc(var(--spacing) * 3); - } - .left-4 { - left: calc(var(--spacing) * 4); - } - .left-\[12\%\] { - left: 12%; - } - .modal-backdrop { - @layer daisyui.l1.l2.l3 { - grid-column-start: 1; - grid-row-start: 1; - display: grid; - align-self: stretch; - justify-self: stretch; - color: transparent; - z-index: -1; - button { - cursor: pointer; - } - } - } - .-z-0 { - z-index: calc(0 * -1); - } - .-z-10 { - z-index: calc(10 * -1); - } - .z-0 { - z-index: 0; - } - .z-10 { - z-index: 10; - } - .z-40 { - z-index: 40; - } - .z-50 { - z-index: 50; - } - .hero { - @layer daisyui.l1.l2.l3 { - display: grid; - width: 100%; - place-items: center; - background-size: cover; - background-position: center; - & > * { - grid-column-start: 1; - grid-row-start: 1; - } - } - } - .modal-box { - @layer daisyui.l1.l2.l3 { - grid-column-start: 1; - grid-row-start: 1; - max-height: 100vh; - width: calc(11/12 * 100%); - max-width: 32rem; - background-color: var(--color-base-100); - padding: calc(0.25rem * 6); - transition: translate 0.3s ease-out, scale 0.3s ease-out, opacity 0.2s ease-out 0.05s, box-shadow 0.3s ease-out; - border-top-left-radius: var(--modal-tl, var(--radius-box)); - border-top-right-radius: var(--modal-tr, var(--radius-box)); - border-bottom-left-radius: var(--modal-bl, var(--radius-box)); - border-bottom-right-radius: var(--modal-br, var(--radius-box)); - scale: 95%; - opacity: 0; - box-shadow: oklch(0% 0 0/ 0.25) 0px 25px 50px -12px; - overflow-y: auto; - overscroll-behavior: contain; - } - } - .container { - width: 100%; - @media (width >= 40rem) { - max-width: 40rem; - } - @media (width >= 48rem) { - max-width: 48rem; - } - @media (width >= 64rem) { - max-width: 64rem; - } - @media (width >= 80rem) { - max-width: 80rem; - } - @media (width >= 96rem) { - max-width: 96rem; - } - } - .m-0 { - margin: 0; - } - .filter { - @layer daisyui.l1.l2.l3 { - display: flex; - flex-wrap: wrap; - input[type="radio"] { - width: auto; - } - input { - overflow: hidden; - opacity: 100%; - scale: 1; - transition: margin 0.1s, opacity 0.3s, padding 0.3s, border-width 0.1s; - &:not(:last-child) { - margin-inline-end: calc(0.25rem * 1); - } - &.filter-reset { - aspect-ratio: 1 / 1; - &::after { - --tw-content: "×"; - content: var(--tw-content); - } - } - } - &:not(:has(input:checked:not(.filter-reset))) { - .filter-reset, input[type="reset"] { - scale: 0; - border-width: 0; - margin-inline: calc(0.25rem * 0); - width: calc(0.25rem * 0); - padding-inline: calc(0.25rem * 0); - opacity: 0%; - } - } - &:has(input:checked:not(.filter-reset)) { - input:not(:checked, .filter-reset, input[type="reset"]) { - scale: 0; - border-width: 0; - margin-inline: calc(0.25rem * 0); - width: calc(0.25rem * 0); - padding-inline: calc(0.25rem * 0); - opacity: 0%; - } - } - } - } - .-mx-2 { - margin-inline: calc(var(--spacing) * -2); - } - .mx-4 { - margin-inline: calc(var(--spacing) * 4); - } - .mx-auto { - margin-inline: auto; - } - .my-8 { - margin-block: calc(var(--spacing) * 8); - } - .label { - @layer daisyui.l1.l2.l3 { - display: inline-flex; - align-items: center; - gap: calc(0.25rem * 1.5); - white-space: nowrap; - color: currentcolor; - @supports (color: color-mix(in lab, red, red)) { - color: color-mix(in oklab, currentcolor 60%, transparent); - } - &:has(input) { - cursor: pointer; - } - &:is(.input > *, .select > *) { - display: flex; - height: calc(100% - 0.5rem); - align-items: center; - padding-inline: calc(0.25rem * 3); - white-space: nowrap; - font-size: inherit; - &:first-child { - margin-inline-start: calc(0.25rem * -3); - margin-inline-end: calc(0.25rem * 3); - border-inline-end: var(--border) solid currentColor; - @supports (color: color-mix(in lab, red, red)) { - border-inline-end: var(--border) solid color-mix(in oklab, currentColor 10%, #0000); - } - } - &:last-child { - margin-inline-start: calc(0.25rem * 3); - margin-inline-end: calc(0.25rem * -3); - border-inline-start: var(--border) solid currentColor; - @supports (color: color-mix(in lab, red, red)) { - border-inline-start: var(--border) solid color-mix(in oklab, currentColor 10%, #0000); - } - } - } - } - } - .prose { - color: var(--tw-prose-body); - max-width: 65ch; - :where(p):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 1.25em; - margin-bottom: 1.25em; - } - :where([class~="lead"]):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - color: var(--tw-prose-lead); - font-size: 1.25em; - line-height: 1.6; - margin-top: 1.2em; - margin-bottom: 1.2em; - } - :where(a):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - color: var(--tw-prose-links); - text-decoration: underline; - font-weight: 500; - } - :where(strong):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - color: var(--tw-prose-bold); - font-weight: 600; - } - :where(a strong):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - color: inherit; - } - :where(blockquote strong):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - color: inherit; - } - :where(thead th strong):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - color: inherit; - } - :where(ol):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - list-style-type: decimal; - margin-top: 1.25em; - margin-bottom: 1.25em; - padding-inline-start: 1.625em; - } - :where(ol[type="A"]):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - list-style-type: upper-alpha; - } - :where(ol[type="a"]):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - list-style-type: lower-alpha; - } - :where(ol[type="A" s]):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - list-style-type: upper-alpha; - } - :where(ol[type="a" s]):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - list-style-type: lower-alpha; - } - :where(ol[type="I"]):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - list-style-type: upper-roman; - } - :where(ol[type="i"]):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - list-style-type: lower-roman; - } - :where(ol[type="I" s]):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - list-style-type: upper-roman; - } - :where(ol[type="i" s]):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - list-style-type: lower-roman; - } - :where(ol[type="1"]):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - list-style-type: decimal; - } - :where(ul):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - list-style-type: disc; - margin-top: 1.25em; - margin-bottom: 1.25em; - padding-inline-start: 1.625em; - } - :where(ol > li):not(:where([class~="not-prose"], [class~="not-prose"] *))::marker { - font-weight: 400; - color: var(--tw-prose-counters); - } - :where(ul > li):not(:where([class~="not-prose"], [class~="not-prose"] *))::marker { - color: var(--tw-prose-bullets); - } - :where(dt):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - color: var(--tw-prose-headings); - font-weight: 600; - margin-top: 1.25em; - } - :where(hr):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - border-color: var(--tw-prose-hr); - border-top-width: 1px; - margin-top: 3em; - margin-bottom: 3em; - } - :where(blockquote):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - font-weight: 500; - font-style: italic; - color: var(--tw-prose-quotes); - border-inline-start-width: 0.25rem; - border-inline-start-color: var(--tw-prose-quote-borders); - quotes: "\201C""\201D""\2018""\2019"; - margin-top: 1.6em; - margin-bottom: 1.6em; - padding-inline-start: 1em; - } - :where(blockquote p:first-of-type):not(:where([class~="not-prose"], [class~="not-prose"] *))::before { - content: open-quote; - } - :where(blockquote p:last-of-type):not(:where([class~="not-prose"], [class~="not-prose"] *))::after { - content: close-quote; - } - :where(h1):not(:where([class~="not-prose"], [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; - } - :where(h1 strong):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - font-weight: 900; - color: inherit; - } - :where(h2):not(:where([class~="not-prose"], [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; - } - :where(h2 strong):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - font-weight: 800; - color: inherit; - } - :where(h3):not(:where([class~="not-prose"], [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; - } - :where(h3 strong):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - font-weight: 700; - color: inherit; - } - :where(h4):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - color: var(--tw-prose-headings); - font-weight: 600; - margin-top: 1.5em; - margin-bottom: 0.5em; - line-height: 1.5; - } - :where(h4 strong):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - font-weight: 700; - color: inherit; - } - :where(img):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 2em; - margin-bottom: 2em; - } - :where(picture):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - display: block; - margin-top: 2em; - margin-bottom: 2em; - } - :where(video):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 2em; - margin-bottom: 2em; - } - :where(kbd):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - font-weight: 500; - font-family: inherit; - color: var(--tw-prose-kbd); - box-shadow: 0 0 0 1px var(--tw-prose-kbd-shadows), 0 3px 0 var(--tw-prose-kbd-shadows); - font-size: 0.875em; - border-radius: 0.3125rem; - padding-top: 0.1875em; - padding-inline-end: 0.375em; - padding-bottom: 0.1875em; - padding-inline-start: 0.375em; - } - :where(code):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - color: var(--tw-prose-code); - font-weight: 600; - font-size: 0.875em; - } - :where(code):not(:where([class~="not-prose"], [class~="not-prose"] *))::before { - content: "`"; - } - :where(code):not(:where([class~="not-prose"], [class~="not-prose"] *))::after { - content: "`"; - } - :where(a code):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - color: inherit; - } - :where(h1 code):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - color: inherit; - } - :where(h2 code):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - color: inherit; - font-size: 0.875em; - } - :where(h3 code):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - color: inherit; - font-size: 0.9em; - } - :where(h4 code):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - color: inherit; - } - :where(blockquote code):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - color: inherit; - } - :where(thead th code):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - color: inherit; - } - :where(pre):not(:where([class~="not-prose"], [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-inline-end: 1.1428571em; - padding-bottom: 0.8571429em; - padding-inline-start: 1.1428571em; - } - :where(pre code):not(:where([class~="not-prose"], [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; - } - :where(pre code):not(:where([class~="not-prose"], [class~="not-prose"] *))::before { - content: none; - } - :where(pre code):not(:where([class~="not-prose"], [class~="not-prose"] *))::after { - content: none; - } - :where(table):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - width: 100%; - table-layout: auto; - margin-top: 2em; - margin-bottom: 2em; - font-size: 0.875em; - line-height: 1.7142857; - } - :where(thead):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - border-bottom-width: 1px; - border-bottom-color: var(--tw-prose-th-borders); - } - :where(thead th):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - color: var(--tw-prose-headings); - font-weight: 600; - vertical-align: bottom; - padding-inline-end: 0.5714286em; - padding-bottom: 0.5714286em; - padding-inline-start: 0.5714286em; - } - :where(tbody tr):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - border-bottom-width: 1px; - border-bottom-color: var(--tw-prose-td-borders); - } - :where(tbody tr:last-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - border-bottom-width: 0; - } - :where(tbody td):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - vertical-align: baseline; - } - :where(tfoot):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - border-top-width: 1px; - border-top-color: var(--tw-prose-th-borders); - } - :where(tfoot td):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - vertical-align: top; - } - :where(th, td):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - text-align: start; - } - :where(figure > *):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 0; - margin-bottom: 0; - } - :where(figcaption):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - color: var(--tw-prose-captions); - font-size: 0.875em; - line-height: 1.4285714; - margin-top: 0.8571429em; - } - --tw-prose-body: oklch(37.3% 0.034 259.733); - --tw-prose-headings: oklch(21% 0.034 264.665); - --tw-prose-lead: oklch(44.6% 0.03 256.802); - --tw-prose-links: oklch(21% 0.034 264.665); - --tw-prose-bold: oklch(21% 0.034 264.665); - --tw-prose-counters: oklch(55.1% 0.027 264.364); - --tw-prose-bullets: oklch(87.2% 0.01 258.338); - --tw-prose-hr: oklch(92.8% 0.006 264.531); - --tw-prose-quotes: oklch(21% 0.034 264.665); - --tw-prose-quote-borders: oklch(92.8% 0.006 264.531); - --tw-prose-captions: oklch(55.1% 0.027 264.364); - --tw-prose-kbd: oklch(21% 0.034 264.665); - --tw-prose-kbd-shadows: color-mix(in oklab, oklch(21% 0.034 264.665) 10%, transparent); - --tw-prose-code: oklch(21% 0.034 264.665); - --tw-prose-pre-code: oklch(92.8% 0.006 264.531); - --tw-prose-pre-bg: oklch(27.8% 0.033 256.848); - --tw-prose-th-borders: oklch(87.2% 0.01 258.338); - --tw-prose-td-borders: oklch(92.8% 0.006 264.531); - --tw-prose-invert-body: oklch(87.2% 0.01 258.338); - --tw-prose-invert-headings: #fff; - --tw-prose-invert-lead: oklch(70.7% 0.022 261.325); - --tw-prose-invert-links: #fff; - --tw-prose-invert-bold: #fff; - --tw-prose-invert-counters: oklch(70.7% 0.022 261.325); - --tw-prose-invert-bullets: oklch(44.6% 0.03 256.802); - --tw-prose-invert-hr: oklch(37.3% 0.034 259.733); - --tw-prose-invert-quotes: oklch(96.7% 0.003 264.542); - --tw-prose-invert-quote-borders: oklch(37.3% 0.034 259.733); - --tw-prose-invert-captions: oklch(70.7% 0.022 261.325); - --tw-prose-invert-kbd: #fff; - --tw-prose-invert-kbd-shadows: rgb(255 255 255 / 10%); - --tw-prose-invert-code: #fff; - --tw-prose-invert-pre-code: oklch(87.2% 0.01 258.338); - --tw-prose-invert-pre-bg: rgb(0 0 0 / 50%); - --tw-prose-invert-th-borders: oklch(44.6% 0.03 256.802); - --tw-prose-invert-td-borders: oklch(37.3% 0.034 259.733); - font-size: 1rem; - line-height: 1.75; - :where(picture > img):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 0; - margin-bottom: 0; - } - :where(li):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 0.5em; - margin-bottom: 0.5em; - } - :where(ol > li):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - padding-inline-start: 0.375em; - } - :where(ul > li):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - padding-inline-start: 0.375em; - } - :where(.prose > ul > li p):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 0.75em; - margin-bottom: 0.75em; - } - :where(.prose > ul > li > p:first-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 1.25em; - } - :where(.prose > ul > li > p:last-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-bottom: 1.25em; - } - :where(.prose > ol > li > p:first-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 1.25em; - } - :where(.prose > ol > li > p:last-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-bottom: 1.25em; - } - :where(ul ul, ul ol, ol ul, ol ol):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 0.75em; - margin-bottom: 0.75em; - } - :where(dl):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 1.25em; - margin-bottom: 1.25em; - } - :where(dd):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 0.5em; - padding-inline-start: 1.625em; - } - :where(hr + *):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 0; - } - :where(h2 + *):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 0; - } - :where(h3 + *):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 0; - } - :where(h4 + *):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 0; - } - :where(thead th:first-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - padding-inline-start: 0; - } - :where(thead th:last-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - padding-inline-end: 0; - } - :where(tbody td, tfoot td):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - padding-top: 0.5714286em; - padding-inline-end: 0.5714286em; - padding-bottom: 0.5714286em; - padding-inline-start: 0.5714286em; - } - :where(tbody td:first-child, tfoot td:first-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - padding-inline-start: 0; - } - :where(tbody td:last-child, tfoot td:last-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - padding-inline-end: 0; - } - :where(figure):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 2em; - margin-bottom: 2em; - } - :where(.prose > :first-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 0; - } - :where(.prose > :last-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-bottom: 0; - } - } - .prose-lg { - font-size: 1.125rem; - line-height: 1.7777778; - :where(p):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 1.3333333em; - margin-bottom: 1.3333333em; - } - :where([class~="lead"]):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - font-size: 1.2222222em; - line-height: 1.4545455; - margin-top: 1.0909091em; - margin-bottom: 1.0909091em; - } - :where(blockquote):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 1.6666667em; - margin-bottom: 1.6666667em; - padding-inline-start: 1em; - } - :where(h1):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - font-size: 2.6666667em; - margin-top: 0; - margin-bottom: 0.8333333em; - line-height: 1; - } - :where(h2):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - font-size: 1.6666667em; - margin-top: 1.8666667em; - margin-bottom: 1.0666667em; - line-height: 1.3333333; - } - :where(h3):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - font-size: 1.3333333em; - margin-top: 1.6666667em; - margin-bottom: 0.6666667em; - line-height: 1.5; - } - :where(h4):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 1.7777778em; - margin-bottom: 0.4444444em; - line-height: 1.5555556; - } - :where(img):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 1.7777778em; - margin-bottom: 1.7777778em; - } - :where(picture):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 1.7777778em; - margin-bottom: 1.7777778em; - } - :where(picture > img):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 0; - margin-bottom: 0; - } - :where(video):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 1.7777778em; - margin-bottom: 1.7777778em; - } - :where(kbd):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - font-size: 0.8888889em; - border-radius: 0.3125rem; - padding-top: 0.2222222em; - padding-inline-end: 0.4444444em; - padding-bottom: 0.2222222em; - padding-inline-start: 0.4444444em; - } - :where(code):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - font-size: 0.8888889em; - } - :where(h2 code):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - font-size: 0.8666667em; - } - :where(h3 code):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - font-size: 0.875em; - } - :where(pre):not(:where([class~="not-prose"], [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-inline-end: 1.5em; - padding-bottom: 1em; - padding-inline-start: 1.5em; - } - :where(ol):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 1.3333333em; - margin-bottom: 1.3333333em; - padding-inline-start: 1.5555556em; - } - :where(ul):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 1.3333333em; - margin-bottom: 1.3333333em; - padding-inline-start: 1.5555556em; - } - :where(li):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 0.6666667em; - margin-bottom: 0.6666667em; - } - :where(ol > li):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - padding-inline-start: 0.4444444em; - } - :where(ul > li):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - padding-inline-start: 0.4444444em; - } - :where(.prose-lg > ul > li p):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 0.8888889em; - margin-bottom: 0.8888889em; - } - :where(.prose-lg > ul > li > p:first-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 1.3333333em; - } - :where(.prose-lg > ul > li > p:last-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-bottom: 1.3333333em; - } - :where(.prose-lg > ol > li > p:first-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 1.3333333em; - } - :where(.prose-lg > ol > li > p:last-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-bottom: 1.3333333em; - } - :where(ul ul, ul ol, ol ul, ol ol):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 0.8888889em; - margin-bottom: 0.8888889em; - } - :where(dl):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 1.3333333em; - margin-bottom: 1.3333333em; - } - :where(dt):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 1.3333333em; - } - :where(dd):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 0.6666667em; - padding-inline-start: 1.5555556em; - } - :where(hr):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 3.1111111em; - margin-bottom: 3.1111111em; - } - :where(hr + *):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 0; - } - :where(h2 + *):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 0; - } - :where(h3 + *):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 0; - } - :where(h4 + *):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 0; - } - :where(table):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - font-size: 0.8888889em; - line-height: 1.5; - } - :where(thead th):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - padding-inline-end: 0.75em; - padding-bottom: 0.75em; - padding-inline-start: 0.75em; - } - :where(thead th:first-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - padding-inline-start: 0; - } - :where(thead th:last-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - padding-inline-end: 0; - } - :where(tbody td, tfoot td):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - padding-top: 0.75em; - padding-inline-end: 0.75em; - padding-bottom: 0.75em; - padding-inline-start: 0.75em; - } - :where(tbody td:first-child, tfoot td:first-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - padding-inline-start: 0; - } - :where(tbody td:last-child, tfoot td:last-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - padding-inline-end: 0; - } - :where(figure):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 1.7777778em; - margin-bottom: 1.7777778em; - } - :where(figure > *):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 0; - margin-bottom: 0; - } - :where(figcaption):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - font-size: 0.8888889em; - line-height: 1.5; - margin-top: 1em; - } - :where(.prose-lg > :first-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 0; - } - :where(.prose-lg > :last-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-bottom: 0; - } - } - .mt-0\.5 { - margin-top: calc(var(--spacing) * 0.5); - } - .mt-1 { - margin-top: var(--spacing); - } - .mt-1\.5 { - margin-top: calc(var(--spacing) * 1.5); - } - .mt-2 { - margin-top: calc(var(--spacing) * 2); - } - .mt-3 { - margin-top: calc(var(--spacing) * 3); - } - .mt-4 { - margin-top: calc(var(--spacing) * 4); - } - .mt-6 { - margin-top: calc(var(--spacing) * 6); - } - .mt-8 { - margin-top: calc(var(--spacing) * 8); - } - .mt-10 { - margin-top: calc(var(--spacing) * 10); - } - .mt-12 { - margin-top: calc(var(--spacing) * 12); - } - .mt-16 { - margin-top: calc(var(--spacing) * 16); - } - .mt-24 { - margin-top: calc(var(--spacing) * 24); - } - .mt-\[-20vh\] { - margin-top: -20vh; - } - .mt-auto { - margin-top: auto; - } - .mr-2 { - margin-right: calc(var(--spacing) * 2); - } - .mr-3 { - margin-right: calc(var(--spacing) * 3); - } - .mb-0 { - margin-bottom: 0; - } - .mb-1 { - margin-bottom: var(--spacing); - } - .mb-2 { - margin-bottom: calc(var(--spacing) * 2); - } - .mb-3 { - margin-bottom: calc(var(--spacing) * 3); - } - .mb-4 { - margin-bottom: calc(var(--spacing) * 4); - } - .mb-6 { - margin-bottom: calc(var(--spacing) * 6); - } - .mb-8 { - margin-bottom: calc(var(--spacing) * 8); - } - .mb-10 { - margin-bottom: calc(var(--spacing) * 10); - } - .mb-12 { - margin-bottom: calc(var(--spacing) * 12); - } - .mb-16 { - margin-bottom: calc(var(--spacing) * 16); - } - .ml-2 { - margin-left: calc(var(--spacing) * 2); - } - .ml-3\.5 { - margin-left: calc(var(--spacing) * 3.5); - } - .footer { - @layer daisyui.l1.l2.l3 { - display: grid; - width: 100%; - grid-auto-flow: row; - place-items: start; - column-gap: calc(0.25rem * 4); - row-gap: calc(0.25rem * 10); - font-size: 0.875rem; - line-height: 1.25rem; - & > * { - display: grid; - place-items: start; - gap: calc(0.25rem * 2); - } - &.footer-center { - grid-auto-flow: column dense; - place-items: center; - text-align: center; - & > * { - place-items: center; - } - } - } - } - .line-clamp-2 { - overflow: hidden; - display: -webkit-box; - -webkit-box-orient: vertical; - -webkit-line-clamp: 2; - } - .line-clamp-3 { - overflow: hidden; - display: -webkit-box; - -webkit-box-orient: vertical; - -webkit-line-clamp: 3; - } - .prose { - :root & { - --tw-prose-body: var(--color-base-content); - @supports (color: color-mix(in lab, red, red)) { - --tw-prose-body: color-mix(in oklab, var(--color-base-content) 80%, #0000); - } - --tw-prose-headings: var(--color-base-content); - --tw-prose-lead: var(--color-base-content); - --tw-prose-links: var(--color-base-content); - --tw-prose-bold: var(--color-base-content); - --tw-prose-counters: var(--color-base-content); - --tw-prose-bullets: var(--color-base-content); - @supports (color: color-mix(in lab, red, red)) { - --tw-prose-bullets: color-mix(in oklab, var(--color-base-content) 50%, #0000); - } - --tw-prose-hr: var(--color-base-content); - @supports (color: color-mix(in lab, red, red)) { - --tw-prose-hr: color-mix(in oklab, var(--color-base-content) 20%, #0000); - } - --tw-prose-quotes: var(--color-base-content); - --tw-prose-quote-borders: var(--color-base-content); - @supports (color: color-mix(in lab, red, red)) { - --tw-prose-quote-borders: color-mix(in oklab, var(--color-base-content) 20%, #0000); - } - --tw-prose-captions: var(--color-base-content); - @supports (color: color-mix(in lab, red, red)) { - --tw-prose-captions: color-mix(in oklab, var(--color-base-content) 50%, #0000); - } - --tw-prose-code: var(--color-base-content); - --tw-prose-pre-code: var(--color-neutral-content); - --tw-prose-pre-bg: var(--color-neutral); - --tw-prose-th-borders: var(--color-base-content); - @supports (color: color-mix(in lab, red, red)) { - --tw-prose-th-borders: color-mix(in oklab, var(--color-base-content) 50%, #0000); - } - --tw-prose-td-borders: var(--color-base-content); - @supports (color: color-mix(in lab, red, red)) { - --tw-prose-td-borders: color-mix(in oklab, var(--color-base-content) 20%, #0000); - } - --tw-prose-kbd: var(--color-base-content); - @supports (color: color-mix(in lab, red, red)) { - --tw-prose-kbd: color-mix(in oklab, var(--color-base-content) 80%, #0000); - } - :where(code):not(pre > code) { - background-color: var(--color-base-200); - border-radius: var(--radius-selector); - border: var(--border) solid var(--color-base-300); - padding-inline: 0.5em; - padding-block: 0.2em; - font-weight: inherit; - &:before, &:after { - display: none; - } - } - } - } - .block { - display: block; - } - .flex { - display: flex; - } - .grid { - display: grid; - } - .hidden { - display: none; - } - .inline-block { - display: inline-block; - } - .inline-flex { - display: inline-flex; - } - .aspect-\[3\/4\] { - aspect-ratio: 3/4; - } - .aspect-\[4\/3\] { - aspect-ratio: 4/3; - } - .aspect-\[4\/5\] { - aspect-ratio: 4/5; - } - .aspect-\[16\/10\] { - aspect-ratio: 16/10; - } - .aspect-\[21\/9\] { - aspect-ratio: 21/9; - } - .aspect-square { - aspect-ratio: 1 / 1; - } - .aspect-video { - aspect-ratio: var(--aspect-video); - } - .btn-circle { - @layer daisyui.l1.l2 { - border-radius: calc(infinity * 1px); - padding-inline: calc(0.25rem * 0); - width: var(--size); - height: var(--size); - } - } - .size-2 { - width: calc(var(--spacing) * 2); - height: calc(var(--spacing) * 2); - } - .size-3\.5 { - width: calc(var(--spacing) * 3.5); - height: calc(var(--spacing) * 3.5); - } - .size-4 { - width: calc(var(--spacing) * 4); - height: calc(var(--spacing) * 4); - } - .size-5 { - width: calc(var(--spacing) * 5); - height: calc(var(--spacing) * 5); - } - .size-6 { - width: calc(var(--spacing) * 6); - height: calc(var(--spacing) * 6); - } - .size-8 { - width: calc(var(--spacing) * 8); - height: calc(var(--spacing) * 8); - } - .size-10 { - width: calc(var(--spacing) * 10); - height: calc(var(--spacing) * 10); - } - .size-12 { - width: calc(var(--spacing) * 12); - height: calc(var(--spacing) * 12); - } - .size-20 { - width: calc(var(--spacing) * 20); - height: calc(var(--spacing) * 20); - } - .size-48 { - width: calc(var(--spacing) * 48); - height: calc(var(--spacing) * 48); - } - .h-0\.5 { - height: calc(var(--spacing) * 0.5); - } - .h-1\.5 { - height: calc(var(--spacing) * 1.5); - } - .h-2 { - height: calc(var(--spacing) * 2); - } - .h-3 { - height: calc(var(--spacing) * 3); - } - .h-3\.5 { - height: calc(var(--spacing) * 3.5); - } - .h-4 { - height: calc(var(--spacing) * 4); - } - .h-5 { - height: calc(var(--spacing) * 5); - } - .h-6 { - height: calc(var(--spacing) * 6); - } - .h-7 { - height: calc(var(--spacing) * 7); - } - .h-8 { - height: calc(var(--spacing) * 8); - } - .h-10 { - height: calc(var(--spacing) * 10); - } - .h-11 { - height: calc(var(--spacing) * 11); - } - .h-12 { - height: calc(var(--spacing) * 12); - } - .h-14 { - height: calc(var(--spacing) * 14); - } - .h-16 { - height: calc(var(--spacing) * 16); - } - .h-20 { - height: calc(var(--spacing) * 20); - } - .h-24 { - height: calc(var(--spacing) * 24); - } - .h-32 { - height: calc(var(--spacing) * 32); - } - .h-64 { - height: calc(var(--spacing) * 64); - } - .h-\[42px\] { - height: 42px; - } - .h-\[400px\] { - height: 400px; - } - .h-auto { - height: auto; - } - .h-full { - height: 100%; - } - .max-h-0 { - max-height: 0; - } - .max-h-96 { - max-height: calc(var(--spacing) * 96); - } - .max-h-\[60vh\] { - max-height: 60vh; - } - .min-h-0 { - min-height: 0; - } - .min-h-\[300px\] { - min-height: 300px; - } - .min-h-\[480px\] { - min-height: 480px; - } - .min-h-full { - min-height: 100%; - } - .min-h-screen { - min-height: 100vh; - } - .w-1 { - width: var(--spacing); - } - .w-1\.5 { - width: calc(var(--spacing) * 1.5); - } - .w-1\/2 { - width: calc(1 / 2 * 100%); - } - .w-3 { - width: calc(var(--spacing) * 3); - } - .w-3\.5 { - width: calc(var(--spacing) * 3.5); - } - .w-4 { - width: calc(var(--spacing) * 4); - } - .w-5 { - width: calc(var(--spacing) * 5); - } - .w-6 { - width: calc(var(--spacing) * 6); - } - .w-7 { - width: calc(var(--spacing) * 7); - } - .w-8 { - width: calc(var(--spacing) * 8); - } - .w-10 { - width: calc(var(--spacing) * 10); - } - .w-12 { - width: calc(var(--spacing) * 12); - } - .w-14 { - width: calc(var(--spacing) * 14); - } - .w-16 { - width: calc(var(--spacing) * 16); - } - .w-20 { - width: calc(var(--spacing) * 20); - } - .w-24 { - width: calc(var(--spacing) * 24); - } - .w-32 { - width: calc(var(--spacing) * 32); - } - .w-64 { - width: calc(var(--spacing) * 64); - } - .w-\[100vw\] { - width: 100vw; - } - .w-\[480px\] { - width: 480px; - } - .w-\[calc\(100\%-4rem\)\] { - width: calc(100% - 4rem); - } - .w-fit { - width: fit-content; - } - .w-full { - width: 100%; - } - .max-w-2xl { - max-width: var(--container-2xl); - } - .max-w-3xl { - max-width: var(--container-3xl); - } - .max-w-4xl { - max-width: var(--container-4xl); - } - .max-w-5xl { - max-width: var(--container-5xl); - } - .max-w-6xl { - max-width: var(--container-6xl); - } - .max-w-7xl { - max-width: var(--container-7xl); - } - .max-w-\[240px\] { - max-width: 240px; - } - .max-w-md { - max-width: var(--container-md); - } - .max-w-none { - max-width: none; - } - .max-w-sm { - max-width: var(--container-sm); - } - .max-w-xl { - max-width: var(--container-xl); - } - .max-w-xs { - max-width: var(--container-xs); - } - .min-w-\[600px\] { - min-width: 600px; - } - .min-w-full { - min-width: 100%; - } - .flex-1 { - flex: 1; - } - .flex-shrink-0 { - flex-shrink: 0; - } - .shrink-0 { - flex-shrink: 0; - } - .flex-grow { - flex-grow: 1; - } - .border-collapse { - border-collapse: collapse; - } - .origin-top { - transform-origin: top; - } - .-translate-x-1\/2 { - --tw-translate-x: calc(calc(1 / 2 * 100%) * -1); - translate: var(--tw-translate-x) var(--tw-translate-y); - } - .translate-x-0 { - --tw-translate-x: 0; - translate: var(--tw-translate-x) var(--tw-translate-y); - } - .translate-x-0\.5 { - --tw-translate-x: calc(var(--spacing) * 0.5); - translate: var(--tw-translate-x) var(--tw-translate-y); - } - .translate-x-4 { - --tw-translate-x: calc(var(--spacing) * 4); - translate: var(--tw-translate-x) var(--tw-translate-y); - } - .translate-x-full { - --tw-translate-x: 100%; - translate: var(--tw-translate-x) var(--tw-translate-y); - } - .-translate-y-0\.5 { - --tw-translate-y: calc(var(--spacing) * -0.5); - translate: var(--tw-translate-x) var(--tw-translate-y); - } - .-translate-y-1\/2 { - --tw-translate-y: calc(calc(1 / 2 * 100%) * -1); - translate: var(--tw-translate-x) var(--tw-translate-y); - } - .-translate-y-2 { - --tw-translate-y: calc(var(--spacing) * -2); - translate: var(--tw-translate-x) var(--tw-translate-y); - } - .translate-y-0 { - --tw-translate-y: 0; - translate: var(--tw-translate-x) var(--tw-translate-y); - } - .translate-y-4 { - --tw-translate-y: calc(var(--spacing) * 4); - translate: var(--tw-translate-x) var(--tw-translate-y); - } - .scale-95 { - --tw-scale-x: 95%; - --tw-scale-y: 95%; - --tw-scale-z: 95%; - scale: var(--tw-scale-x) var(--tw-scale-y); - } - .scale-100 { - --tw-scale-x: 100%; - --tw-scale-y: 100%; - --tw-scale-z: 100%; - scale: var(--tw-scale-x) var(--tw-scale-y); - } - .-rotate-3 { - rotate: calc(3deg * -1); - } - .rotate-180 { - rotate: 180deg; - } - .transform { - transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,); - } - .skeleton { - @layer daisyui.l1.l2.l3 { - border-radius: var(--radius-box); - background-color: var(--color-base-300); - @media (prefers-reduced-motion: reduce) { - transition-duration: 15s; - } - will-change: background-position; - background-image: linear-gradient( 105deg, #0000 0% 40%, var(--color-base-100) 50%, #0000 60% 100% ); - background-size: 200% auto; - background-position-x: -50%; - @media (prefers-reduced-motion: no-preference) { - animation: skeleton 1.8s ease-in-out infinite; - } - } - } - .animate-in { - animation: enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none); - } - .animate-spin { - animation: var(--animate-spin); - } - .link { - @layer daisyui.l1.l2.l3 { - cursor: pointer; - text-decoration-line: underline; - &:focus { - --tw-outline-style: none; - outline-style: none; - @media (forced-colors: active) { - outline: 2px solid transparent; - outline-offset: 2px; - } - } - &:focus-visible { - outline: 2px solid currentColor; - outline-offset: 2px; - } - } - } - .cursor-ew-resize { - cursor: ew-resize; - } - .cursor-pointer { - cursor: pointer; - } - .resize-y { - resize: vertical; - } - .list-inside { - list-style-position: inside; - } - .list-disc { - list-style-type: disc; - } - .appearance-none { - appearance: none; - } - .grid-cols-1 { - grid-template-columns: repeat(1, minmax(0, 1fr)); - } - .grid-cols-2 { - grid-template-columns: repeat(2, minmax(0, 1fr)); - } - .flex-col { - flex-direction: column; - } - .flex-wrap { - flex-wrap: wrap; - } - .items-baseline { - align-items: baseline; - } - .items-center { - align-items: center; - } - .items-end { - align-items: flex-end; - } - .items-start { - align-items: flex-start; - } - .justify-between { - justify-content: space-between; - } - .justify-center { - justify-content: center; - } - .justify-end { - justify-content: flex-end; - } - .gap-0\.5 { - gap: calc(var(--spacing) * 0.5); - } - .gap-1 { - gap: var(--spacing); - } - .gap-1\.5 { - gap: calc(var(--spacing) * 1.5); - } - .gap-2 { - gap: calc(var(--spacing) * 2); - } - .gap-2\.5 { - gap: calc(var(--spacing) * 2.5); - } - .gap-3 { - gap: calc(var(--spacing) * 3); - } - .gap-4 { - gap: calc(var(--spacing) * 4); - } - .gap-6 { - gap: calc(var(--spacing) * 6); - } - .gap-8 { - gap: calc(var(--spacing) * 8); - } - .gap-10 { - gap: calc(var(--spacing) * 10); - } - .gap-12 { - gap: calc(var(--spacing) * 12); - } - .gap-16 { - gap: calc(var(--spacing) * 16); - } - .space-y-2 { - :where(& > :not(:last-child)) { - --tw-space-y-reverse: 0; - margin-block-start: calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse)); - margin-block-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse))); - } - } - .space-y-2\.5 { - :where(& > :not(:last-child)) { - --tw-space-y-reverse: 0; - margin-block-start: calc(calc(var(--spacing) * 2.5) * var(--tw-space-y-reverse)); - margin-block-end: calc(calc(var(--spacing) * 2.5) * calc(1 - var(--tw-space-y-reverse))); - } - } - .space-y-3 { - :where(& > :not(:last-child)) { - --tw-space-y-reverse: 0; - margin-block-start: calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse)); - margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse))); - } - } - .space-y-4 { - :where(& > :not(:last-child)) { - --tw-space-y-reverse: 0; - margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse)); - margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse))); - } - } - .space-y-6 { - :where(& > :not(:last-child)) { - --tw-space-y-reverse: 0; - margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse)); - margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse))); - } - } - .space-y-8 { - :where(& > :not(:last-child)) { - --tw-space-y-reverse: 0; - margin-block-start: calc(calc(var(--spacing) * 8) * var(--tw-space-y-reverse)); - margin-block-end: calc(calc(var(--spacing) * 8) * calc(1 - var(--tw-space-y-reverse))); - } - } - .space-y-10 { - :where(& > :not(:last-child)) { - --tw-space-y-reverse: 0; - margin-block-start: calc(calc(var(--spacing) * 10) * var(--tw-space-y-reverse)); - margin-block-end: calc(calc(var(--spacing) * 10) * calc(1 - var(--tw-space-y-reverse))); - } - } - .gap-x-8 { - column-gap: calc(var(--spacing) * 8); - } - .gap-y-12 { - row-gap: calc(var(--spacing) * 12); - } - .divide-x { - :where(& > :not(:last-child)) { - --tw-divide-x-reverse: 0; - border-inline-style: var(--tw-border-style); - border-inline-start-width: calc(1px * var(--tw-divide-x-reverse)); - border-inline-end-width: calc(1px * calc(1 - var(--tw-divide-x-reverse))); - } - } - .divide-y { - :where(& > :not(:last-child)) { - --tw-divide-y-reverse: 0; - border-bottom-style: var(--tw-border-style); - border-top-style: var(--tw-border-style); - border-top-width: calc(1px * var(--tw-divide-y-reverse)); - border-bottom-width: calc(1px * calc(1 - var(--tw-divide-y-reverse))); - } - } - .divide-border { - :where(& > :not(:last-child)) { - border-color: var(--border); - } - } - .divide-white\/10 { - :where(& > :not(:last-child)) { - border-color: color-mix(in srgb, #fff 10%, transparent); - @supports (color: color-mix(in lab, red, red)) { - border-color: color-mix(in oklab, var(--color-white) 10%, transparent); - } - } - } - .overflow-hidden { - overflow: hidden; - } - .overflow-x-auto { - overflow-x: auto; - } - .overflow-y-auto { - overflow-y: auto; - } - .rounded { - border-radius: 0.25rem; - } - .rounded-2xl { - border-radius: calc(var(--radius) * 1.8); - } - .rounded-3xl { - border-radius: calc(var(--radius) * 2.2); - } - .rounded-\[2\.5rem\] { - border-radius: 2.5rem; - } - .rounded-full { - border-radius: calc(infinity * 1px); - } - .rounded-lg { - border-radius: var(--radius); - } - .rounded-md { - border-radius: calc(var(--radius) * 0.8); - } - .rounded-none { - border-radius: 0; - } - .rounded-xl { - border-radius: calc(var(--radius) * 1.4); - } - .rounded-r-lg { - border-top-right-radius: var(--radius); - border-bottom-right-radius: var(--radius); - } - .border { - border-style: var(--tw-border-style); - border-width: 1px; - } - .border-2 { - border-style: var(--tw-border-style); - border-width: 2px; - } - .border-4 { - border-style: var(--tw-border-style); - border-width: 4px; - } - .border-y { - border-block-style: var(--tw-border-style); - border-block-width: 1px; - } - .border-t { - border-top-style: var(--tw-border-style); - border-top-width: 1px; - } - .border-b { - border-bottom-style: var(--tw-border-style); - border-bottom-width: 1px; - } - .border-b-2 { - border-bottom-style: var(--tw-border-style); - border-bottom-width: 2px; - } - .border-l { - border-left-style: var(--tw-border-style); - border-left-width: 1px; - } - .border-l-4 { - border-left-style: var(--tw-border-style); - border-left-width: 4px; - } - .border-dashed { - --tw-border-style: dashed; - border-style: dashed; - } - .border-none { - --tw-border-style: none; - border-style: none; - } - .border-accent { - border-color: var(--accent); - } - .border-accent\/30 { - border-color: var(--accent); - @supports (color: color-mix(in lab, red, red)) { - border-color: color-mix(in oklab, var(--accent) 30%, transparent); - } - } - .border-accent\/40 { - border-color: var(--accent); - @supports (color: color-mix(in lab, red, red)) { - border-color: color-mix(in oklab, var(--accent) 40%, transparent); - } - } - .border-border { - border-color: var(--border); - } - .border-border\/10 { - border-color: var(--border); - @supports (color: color-mix(in lab, red, red)) { - border-color: color-mix(in oklab, var(--border) 10%, transparent); - } - } - .border-border\/50 { - border-color: var(--border); - @supports (color: color-mix(in lab, red, red)) { - border-color: color-mix(in oklab, var(--border) 50%, transparent); - } - } - .border-gray-100 { - border-color: var(--color-gray-100); - } - .border-gray-200 { - border-color: var(--color-gray-200); - } - .border-green-100 { - border-color: var(--color-green-100); - } - .border-green-200 { - border-color: var(--color-green-200); - } - .border-primary { - border-color: var(--primary); - } - .border-primary\/20 { - border-color: var(--primary); - @supports (color: color-mix(in lab, red, red)) { - border-color: color-mix(in oklab, var(--primary) 20%, transparent); - } - } - .border-red-200 { - border-color: var(--color-red-200); - } - .border-red-500 { - border-color: var(--color-red-500); - } - .border-slate-100 { - border-color: var(--color-slate-100); - } - .border-slate-200 { - border-color: var(--color-slate-200); - } - .border-slate-800 { - border-color: var(--color-slate-800); - } - .border-transparent { - border-color: transparent; - } - .border-white { - border-color: var(--color-white); - } - .border-white\/20 { - border-color: color-mix(in srgb, #fff 20%, transparent); - @supports (color: color-mix(in lab, red, red)) { - border-color: color-mix(in oklab, var(--color-white) 20%, transparent); - } - } - .border-white\/30 { - border-color: color-mix(in srgb, #fff 30%, transparent); - @supports (color: color-mix(in lab, red, red)) { - border-color: color-mix(in oklab, var(--color-white) 30%, transparent); - } - } - .border-white\/50 { - border-color: color-mix(in srgb, #fff 50%, transparent); - @supports (color: color-mix(in lab, red, red)) { - border-color: color-mix(in oklab, var(--color-white) 50%, transparent); - } - } - .bg-\[\#0F2A47\] { - background-color: #0F2A47; - } - .bg-accent { - background-color: var(--accent); - } - .bg-accent-light { - background-color: var(--accent-light); - } - .bg-accent\/5 { - background-color: var(--accent); - @supports (color: color-mix(in lab, red, red)) { - background-color: color-mix(in oklab, var(--accent) 5%, transparent); - } - } - .bg-accent\/10 { - background-color: var(--accent); - @supports (color: color-mix(in lab, red, red)) { - background-color: color-mix(in oklab, var(--accent) 10%, transparent); - } - } - .bg-accent\/20 { - background-color: var(--accent); - @supports (color: color-mix(in lab, red, red)) { - background-color: color-mix(in oklab, var(--accent) 20%, transparent); - } - } - .bg-background { - background-color: var(--background); - } - .bg-black\/10 { - background-color: color-mix(in srgb, #000 10%, transparent); - @supports (color: color-mix(in lab, red, red)) { - background-color: color-mix(in oklab, var(--color-black) 10%, transparent); - } - } - .bg-black\/50 { - background-color: color-mix(in srgb, #000 50%, transparent); - @supports (color: color-mix(in lab, red, red)) { - background-color: color-mix(in oklab, var(--color-black) 50%, transparent); - } - } - .bg-black\/60 { - background-color: color-mix(in srgb, #000 60%, transparent); - @supports (color: color-mix(in lab, red, red)) { - background-color: color-mix(in oklab, var(--color-black) 60%, transparent); - } - } - .bg-cta { - background-color: var(--cta); - } - .bg-cta\/5 { - background-color: var(--cta); - @supports (color: color-mix(in lab, red, red)) { - background-color: color-mix(in oklab, var(--cta) 5%, transparent); - } - } - .bg-cta\/10 { - background-color: var(--cta); - @supports (color: color-mix(in lab, red, red)) { - background-color: color-mix(in oklab, var(--cta) 10%, transparent); - } - } - .bg-gray-50 { - background-color: var(--color-gray-50); - } - .bg-gray-50\/50 { - background-color: color-mix(in srgb, oklch(98.5% 0.002 247.839) 50%, transparent); - @supports (color: color-mix(in lab, red, red)) { - background-color: color-mix(in oklab, var(--color-gray-50) 50%, transparent); - } - } - .bg-gray-50\/80 { - background-color: color-mix(in srgb, oklch(98.5% 0.002 247.839) 80%, transparent); - @supports (color: color-mix(in lab, red, red)) { - background-color: color-mix(in oklab, var(--color-gray-50) 80%, transparent); - } - } - .bg-gray-100 { - background-color: var(--color-gray-100); - } - .bg-green-50 { - background-color: var(--color-green-50); - } - .bg-green-500 { - background-color: var(--color-green-500); - } - .bg-green-600 { - background-color: var(--color-green-600); - } - .bg-muted { - background-color: var(--muted); - } - .bg-primary { - background-color: var(--primary); - } - .bg-primary-light\/10 { - background-color: var(--primary-light); - @supports (color: color-mix(in lab, red, red)) { - background-color: color-mix(in oklab, var(--primary-light) 10%, transparent); - } - } - .bg-primary\/5 { - background-color: var(--primary); - @supports (color: color-mix(in lab, red, red)) { - background-color: color-mix(in oklab, var(--primary) 5%, transparent); - } - } - .bg-red-50 { - background-color: var(--color-red-50); - } - .bg-slate-50 { - background-color: var(--color-slate-50); - } - .bg-slate-100 { - background-color: var(--color-slate-100); - } - .bg-slate-200 { - background-color: var(--color-slate-200); - } - .bg-slate-950\/40 { - background-color: color-mix(in srgb, oklch(12.9% 0.042 264.695) 40%, transparent); - @supports (color: color-mix(in lab, red, red)) { - background-color: color-mix(in oklab, var(--color-slate-950) 40%, transparent); - } - } - .bg-transparent { - background-color: transparent; - } - .bg-white { - background-color: var(--color-white); - } - .bg-white\/10 { - background-color: color-mix(in srgb, #fff 10%, transparent); - @supports (color: color-mix(in lab, red, red)) { - background-color: color-mix(in oklab, var(--color-white) 10%, transparent); - } - } - .bg-white\/20 { - background-color: color-mix(in srgb, #fff 20%, transparent); - @supports (color: color-mix(in lab, red, red)) { - background-color: color-mix(in oklab, var(--color-white) 20%, transparent); - } - } - .bg-white\/40 { - background-color: color-mix(in srgb, #fff 40%, transparent); - @supports (color: color-mix(in lab, red, red)) { - background-color: color-mix(in oklab, var(--color-white) 40%, transparent); - } - } - .bg-white\/50 { - background-color: color-mix(in srgb, #fff 50%, transparent); - @supports (color: color-mix(in lab, red, red)) { - background-color: color-mix(in oklab, var(--color-white) 50%, transparent); - } - } - .bg-white\/80 { - background-color: color-mix(in srgb, #fff 80%, transparent); - @supports (color: color-mix(in lab, red, red)) { - background-color: color-mix(in oklab, var(--color-white) 80%, transparent); - } - } - .bg-white\/90 { - background-color: color-mix(in srgb, #fff 90%, transparent); - @supports (color: color-mix(in lab, red, red)) { - background-color: color-mix(in oklab, var(--color-white) 90%, transparent); - } - } - .bg-gradient-to-l { - --tw-gradient-position: to left in oklab; - background-image: linear-gradient(var(--tw-gradient-stops)); - } - .bg-gradient-to-t { - --tw-gradient-position: to top in oklab; - background-image: linear-gradient(var(--tw-gradient-stops)); - } - .bg-\[radial-gradient\(circle_at_bottom_left\,rgba\(43\,168\,224\,0\.12\)\,transparent_40\%\)\] { - background-image: radial-gradient(circle at bottom left,rgba(43,168,224,0.12),transparent 40%); - } - .from-accent\/20 { - --tw-gradient-from: var(--accent); - @supports (color: color-mix(in lab, red, red)) { - --tw-gradient-from: color-mix(in oklab, var(--accent) 20%, transparent); - } - --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); - } - .from-primary\/90 { - --tw-gradient-from: var(--primary); - @supports (color: color-mix(in lab, red, red)) { - --tw-gradient-from: color-mix(in oklab, var(--primary) 90%, transparent); - } - --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); - } - .from-white\/10 { - --tw-gradient-from: color-mix(in srgb, #fff 10%, transparent); - @supports (color: color-mix(in lab, red, red)) { - --tw-gradient-from: color-mix(in oklab, var(--color-white) 10%, transparent); - } - --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); - } - .via-primary\/40 { - --tw-gradient-via: var(--primary); - @supports (color: color-mix(in lab, red, red)) { - --tw-gradient-via: color-mix(in oklab, var(--primary) 40%, transparent); - } - --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position); - --tw-gradient-stops: var(--tw-gradient-via-stops); - } - .to-transparent { - --tw-gradient-to: transparent; - --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); - } - .fill-accent { - fill: var(--accent); - } - .fill-cta { - fill: var(--cta); - } - .fill-current { - fill: currentcolor; - } - .object-contain { - object-fit: contain; - } - .object-cover { - object-fit: cover; - } - .p-0 { - padding: 0; - } - .p-1 { - padding: var(--spacing); - } - .p-2 { - padding: calc(var(--spacing) * 2); - } - .p-3 { - padding: calc(var(--spacing) * 3); - } - .p-4 { - padding: calc(var(--spacing) * 4); - } - .p-6 { - padding: calc(var(--spacing) * 6); - } - .p-8 { - padding: calc(var(--spacing) * 8); - } - .p-12 { - padding: calc(var(--spacing) * 12); - } - .px-0 { - padding-inline: 0; - } - .px-2 { - padding-inline: calc(var(--spacing) * 2); - } - .px-2\.5 { - padding-inline: calc(var(--spacing) * 2.5); - } - .px-3 { - padding-inline: calc(var(--spacing) * 3); - } - .px-3\.5 { - padding-inline: calc(var(--spacing) * 3.5); - } - .px-4 { - padding-inline: calc(var(--spacing) * 4); - } - .px-5 { - padding-inline: calc(var(--spacing) * 5); - } - .px-6 { - padding-inline: calc(var(--spacing) * 6); - } - .px-8 { - padding-inline: calc(var(--spacing) * 8); - } - .py-1 { - padding-block: var(--spacing); - } - .py-1\.5 { - padding-block: calc(var(--spacing) * 1.5); - } - .py-2 { - padding-block: calc(var(--spacing) * 2); - } - .py-2\.5 { - padding-block: calc(var(--spacing) * 2.5); - } - .py-3 { - padding-block: calc(var(--spacing) * 3); - } - .py-4 { - padding-block: calc(var(--spacing) * 4); - } - .py-6 { - padding-block: calc(var(--spacing) * 6); - } - .py-8 { - padding-block: calc(var(--spacing) * 8); - } - .py-12 { - padding-block: calc(var(--spacing) * 12); - } - .py-16 { - padding-block: calc(var(--spacing) * 16); - } - .py-20 { - padding-block: calc(var(--spacing) * 20); - } - .py-24 { - padding-block: calc(var(--spacing) * 24); - } - .pt-0 { - padding-top: 0; - } - .pt-1 { - padding-top: var(--spacing); - } - .pt-2 { - padding-top: calc(var(--spacing) * 2); - } - .pt-4 { - padding-top: calc(var(--spacing) * 4); - } - .pt-8 { - padding-top: calc(var(--spacing) * 8); - } - .pt-24 { - padding-top: calc(var(--spacing) * 24); - } - .pr-4 { - padding-right: calc(var(--spacing) * 4); - } - .pr-10 { - padding-right: calc(var(--spacing) * 10); - } - .pb-0 { - padding-bottom: 0; - } - .pb-2 { - padding-bottom: calc(var(--spacing) * 2); - } - .pb-4 { - padding-bottom: calc(var(--spacing) * 4); - } - .pb-5 { - padding-bottom: calc(var(--spacing) * 5); - } - .pb-6 { - padding-bottom: calc(var(--spacing) * 6); - } - .pb-16 { - padding-bottom: calc(var(--spacing) * 16); - } - .pl-3 { - padding-left: calc(var(--spacing) * 3); - } - .pl-4 { - padding-left: calc(var(--spacing) * 4); - } - .pl-6 { - padding-left: calc(var(--spacing) * 6); - } - .pl-9 { - padding-left: calc(var(--spacing) * 9); - } - .text-center { - text-align: center; - } - .text-left { - text-align: left; - } - .text-right { - text-align: right; - } - .font-heading { - font-family: var(--font-heading); - } - .text-2xl { - font-size: var(--text-2xl); - line-height: var(--tw-leading, var(--text-2xl--line-height)); - } - .text-3xl { - font-size: var(--text-3xl); - line-height: var(--tw-leading, var(--text-3xl--line-height)); - } - .text-4xl { - font-size: var(--text-4xl); - line-height: var(--tw-leading, var(--text-4xl--line-height)); - } - .text-base { - font-size: var(--text-base); - line-height: var(--tw-leading, var(--text-base--line-height)); - } - .text-lg { - font-size: var(--text-lg); - line-height: var(--tw-leading, var(--text-lg--line-height)); - } - .text-sm { - font-size: var(--text-sm); - line-height: var(--tw-leading, var(--text-sm--line-height)); - } - .text-xl { - font-size: var(--text-xl); - line-height: var(--tw-leading, var(--text-xl--line-height)); - } - .text-xs { - font-size: var(--text-xs); - line-height: var(--tw-leading, var(--text-xs--line-height)); - } - .text-\[10px\] { - font-size: 10px; - } - .leading-\[1\.1\] { - --tw-leading: 1.1; - line-height: 1.1; - } - .leading-none { - --tw-leading: 1; - line-height: 1; - } - .leading-normal { - --tw-leading: var(--leading-normal); - line-height: var(--leading-normal); - } - .leading-relaxed { - --tw-leading: var(--leading-relaxed); - line-height: var(--leading-relaxed); - } - .leading-snug { - --tw-leading: var(--leading-snug); - line-height: var(--leading-snug); - } - .leading-tight { - --tw-leading: var(--leading-tight); - line-height: var(--leading-tight); - } - .font-black { - --tw-font-weight: var(--font-weight-black); - font-weight: var(--font-weight-black); - } - .font-bold { - --tw-font-weight: var(--font-weight-bold); - font-weight: var(--font-weight-bold); - } - .font-extrabold { - --tw-font-weight: var(--font-weight-extrabold); - font-weight: var(--font-weight-extrabold); - } - .font-medium { - --tw-font-weight: var(--font-weight-medium); - font-weight: var(--font-weight-medium); - } - .font-normal { - --tw-font-weight: var(--font-weight-normal); - font-weight: var(--font-weight-normal); - } - .font-semibold { - --tw-font-weight: var(--font-weight-semibold); - font-weight: var(--font-weight-semibold); - } - .tracking-tight { - --tw-tracking: var(--tracking-tight); - letter-spacing: var(--tracking-tight); - } - .tracking-wider { - --tw-tracking: var(--tracking-wider); - letter-spacing: var(--tracking-wider); - } - .tracking-widest { - --tw-tracking: var(--tracking-widest); - letter-spacing: var(--tracking-widest); - } - .whitespace-nowrap { - white-space: nowrap; - } - .text-accent { - color: var(--accent); - } - .text-accent-light { - color: var(--accent-light); - } - .text-cta { - color: var(--cta); - } - .text-foreground { - color: var(--foreground); - } - .text-gray-200 { - color: var(--color-gray-200); - } - .text-gray-300 { - color: var(--color-gray-300); - } - .text-gray-400 { - color: var(--color-gray-400); - } - .text-gray-500 { - color: var(--color-gray-500); - } - .text-gray-600 { - color: var(--color-gray-600); - } - .text-gray-700 { - color: var(--color-gray-700); - } - .text-gray-800 { - color: var(--color-gray-800); - } - .text-gray-900 { - color: var(--color-gray-900); - } - .text-green-500 { - color: var(--color-green-500); - } - .text-green-600 { - color: var(--color-green-600); - } - .text-green-700 { - color: var(--color-green-700); - } - .text-green-800 { - color: var(--color-green-800); - } - .text-muted { - color: var(--muted); - } - .text-muted-foreground { - color: var(--muted-foreground); - } - .text-orange-500 { - color: var(--color-orange-500); - } - .text-primary { - color: var(--primary); - } - .text-primary-foreground { - color: var(--primary-foreground); - } - .text-primary\/40 { - color: var(--primary); - @supports (color: color-mix(in lab, red, red)) { - color: color-mix(in oklab, var(--primary) 40%, transparent); - } - } - .text-primary\/50 { - color: var(--primary); - @supports (color: color-mix(in lab, red, red)) { - color: color-mix(in oklab, var(--primary) 50%, transparent); - } - } - .text-primary\/60 { - color: var(--primary); - @supports (color: color-mix(in lab, red, red)) { - color: color-mix(in oklab, var(--primary) 60%, transparent); - } - } - .text-primary\/70 { - color: var(--primary); - @supports (color: color-mix(in lab, red, red)) { - color: color-mix(in oklab, var(--primary) 70%, transparent); - } - } - .text-primary\/80 { - color: var(--primary); - @supports (color: color-mix(in lab, red, red)) { - color: color-mix(in oklab, var(--primary) 80%, transparent); - } - } - .text-red-500 { - color: var(--color-red-500); - } - .text-red-800 { - color: var(--color-red-800); - } - .text-slate-100 { - color: var(--color-slate-100); - } - .text-slate-300 { - color: var(--color-slate-300); - } - .text-slate-400 { - color: var(--color-slate-400); - } - .text-text-muted { - color: var(--muted-foreground); - } - .text-text-muted\/50 { - color: var(--muted-foreground); - @supports (color: color-mix(in lab, red, red)) { - color: color-mix(in oklab, var(--muted-foreground) 50%, transparent); - } - } - .text-white { - color: var(--color-white); - } - .text-white\/80 { - color: color-mix(in srgb, #fff 80%, transparent); - @supports (color: color-mix(in lab, red, red)) { - color: color-mix(in oklab, var(--color-white) 80%, transparent); - } - } - .text-white\/90 { - color: color-mix(in srgb, #fff 90%, transparent); - @supports (color: color-mix(in lab, red, red)) { - color: color-mix(in oklab, var(--color-white) 90%, transparent); - } - } - .text-yellow-400 { - color: var(--color-yellow-400); - } - .text-yellow-500 { - color: var(--color-yellow-500); - } - .uppercase { - text-transform: uppercase; - } - .italic { - font-style: italic; - } - .prose { - & :where(.btn-link):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - text-decoration-line: none; - } - } - .underline { - text-decoration-line: underline; - } - .antialiased { - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; - } - .accent-accent { - accent-color: var(--accent); - } - .opacity-0 { - opacity: 0%; - } - .opacity-20 { - opacity: 20%; - } - .opacity-60 { - opacity: 60%; - } - .opacity-70 { - opacity: 70%; - } - .opacity-80 { - opacity: 80%; - } - .opacity-100 { - opacity: 100%; - } - .mix-blend-multiply { - mix-blend-mode: multiply; - } - .shadow { - --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); - box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); - } - .shadow-2xl { - --tw-shadow: 0 25px 50px -12px var(--tw-shadow-color, rgb(0 0 0 / 0.25)); - box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); - } - .shadow-\[0_0_10px_rgba\(0\,0\,0\,0\.3\)\] { - --tw-shadow: 0 0 10px var(--tw-shadow-color, rgba(0,0,0,0.3)); - box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); - } - .shadow-lg { - --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); - box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); - } - .shadow-md { - --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); - box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); - } - .shadow-sm { - --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); - box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); - } - .shadow-xl { - --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); - box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); - } - .ring { - --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor); - box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); - } - .shadow-green-200 { - --tw-shadow-color: oklch(92.5% 0.084 155.995); - @supports (color: color-mix(in lab, red, red)) { - --tw-shadow-color: color-mix(in oklab, var(--color-green-200) var(--tw-shadow-alpha), transparent); - } - } - .shadow-primary\/5 { - --tw-shadow-color: var(--primary); - @supports (color: color-mix(in lab, red, red)) { - --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--primary) 5%, transparent) var(--tw-shadow-alpha), transparent); - } - } - .outline { - outline-style: var(--tw-outline-style); - outline-width: 1px; - } - .btn-ghost { - @layer daisyui.l1 { - &:not(.btn-active, :hover, :active:focus, :focus-visible, input:checked:not(.filter .btn)) { - --btn-shadow: ""; - --btn-bg: #0000; - --btn-border: #0000; - --btn-noise: none; - &:not(:disabled, [disabled], .btn-disabled) { - outline-color: currentcolor; - --btn-fg: var(--btn-color, currentColor); - } - } - @media (hover: none) { - &:not(.btn-active, :active, :focus-visible, input:checked:not(.filter .btn)):hover { - outline-color: currentcolor; - --btn-shadow: ""; - --btn-bg: #0000; - --btn-fg: var(--btn-color, currentColor); - --btn-border: #0000; - --btn-noise: none; - } - } - } - } - .blur-3xl { - --tw-blur: blur(var(--blur-3xl)); - filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,); - } - .blur-\[100px\] { - --tw-blur: blur(100px); - filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,); - } - .blur-\[120px\] { - --tw-blur: blur(120px); - filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,); - } - .blur-sm { - --tw-blur: blur(var(--blur-sm)); - filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,); - } - .blur-xl { - --tw-blur: blur(var(--blur-xl)); - filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,); - } - .grayscale { - --tw-grayscale: grayscale(100%); - filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,); - } - .filter { - filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,); - } - .backdrop-blur { - --tw-backdrop-blur: blur(8px); - -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,); - backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,); - } - .backdrop-blur-sm { - --tw-backdrop-blur: blur(var(--blur-sm)); - -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,); - backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,); - } - .transition { - transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events; - transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); - transition-duration: var(--tw-duration, var(--default-transition-duration)); - } - .transition-all { - transition-property: all; - transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); - transition-duration: var(--tw-duration, var(--default-transition-duration)); - } - .transition-colors { - transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to; - transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); - transition-duration: var(--tw-duration, var(--default-transition-duration)); - } - .transition-opacity { - transition-property: opacity; - transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); - transition-duration: var(--tw-duration, var(--default-transition-duration)); - } - .transition-shadow { - transition-property: box-shadow; - transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); - transition-duration: var(--tw-duration, var(--default-transition-duration)); - } - .transition-transform { - transition-property: transform, translate, scale, rotate; - transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); - transition-duration: var(--tw-duration, var(--default-transition-duration)); - } - .delay-100 { - transition-delay: 100ms; - } - .duration-200 { - --tw-duration: 200ms; - transition-duration: 200ms; - } - .duration-250 { - --tw-duration: 250ms; - transition-duration: 250ms; - } - .duration-300 { - --tw-duration: 300ms; - transition-duration: 300ms; - } - .duration-500 { - --tw-duration: 500ms; - transition-duration: 500ms; - } - .duration-700 { - --tw-duration: 700ms; - transition-duration: 700ms; - } - .ease-in-out { - --tw-ease: var(--ease-in-out); - transition-timing-function: var(--ease-in-out); - } - .prose-slate { - --tw-prose-body: oklch(37.2% 0.044 257.287); - --tw-prose-headings: oklch(20.8% 0.042 265.755); - --tw-prose-lead: oklch(44.6% 0.043 257.281); - --tw-prose-links: oklch(20.8% 0.042 265.755); - --tw-prose-bold: oklch(20.8% 0.042 265.755); - --tw-prose-counters: oklch(55.4% 0.046 257.417); - --tw-prose-bullets: oklch(86.9% 0.022 252.894); - --tw-prose-hr: oklch(92.9% 0.013 255.508); - --tw-prose-quotes: oklch(20.8% 0.042 265.755); - --tw-prose-quote-borders: oklch(92.9% 0.013 255.508); - --tw-prose-captions: oklch(55.4% 0.046 257.417); - --tw-prose-kbd: oklch(20.8% 0.042 265.755); - --tw-prose-kbd-shadows: color-mix(in oklab, oklch(20.8% 0.042 265.755) 10%, transparent); - --tw-prose-code: oklch(20.8% 0.042 265.755); - --tw-prose-pre-code: oklch(92.9% 0.013 255.508); - --tw-prose-pre-bg: oklch(27.9% 0.041 260.031); - --tw-prose-th-borders: oklch(86.9% 0.022 252.894); - --tw-prose-td-borders: oklch(92.9% 0.013 255.508); - --tw-prose-invert-body: oklch(86.9% 0.022 252.894); - --tw-prose-invert-headings: #fff; - --tw-prose-invert-lead: oklch(70.4% 0.04 256.788); - --tw-prose-invert-links: #fff; - --tw-prose-invert-bold: #fff; - --tw-prose-invert-counters: oklch(70.4% 0.04 256.788); - --tw-prose-invert-bullets: oklch(44.6% 0.043 257.281); - --tw-prose-invert-hr: oklch(37.2% 0.044 257.287); - --tw-prose-invert-quotes: oklch(96.8% 0.007 247.896); - --tw-prose-invert-quote-borders: oklch(37.2% 0.044 257.287); - --tw-prose-invert-captions: oklch(70.4% 0.04 256.788); - --tw-prose-invert-kbd: #fff; - --tw-prose-invert-kbd-shadows: rgb(255 255 255 / 10%); - --tw-prose-invert-code: #fff; - --tw-prose-invert-pre-code: oklch(86.9% 0.022 252.894); - --tw-prose-invert-pre-bg: rgb(0 0 0 / 50%); - --tw-prose-invert-th-borders: oklch(44.6% 0.043 257.281); - --tw-prose-invert-td-borders: oklch(37.2% 0.044 257.287); - } - .btn-outline { - @layer daisyui.l1 { - &:not(.btn-active, :hover, :active:focus, :focus-visible, input:checked:not(.filter .btn), :disabled, [disabled], .btn-disabled ) { - --btn-shadow: ""; - --btn-bg: #0000; - --btn-fg: var(--btn-color); - --btn-border: var(--btn-color); - --btn-noise: none; - } - @media (hover: none) { - &:not(.btn-active, :active, :focus-visible, input:checked:not(.filter .btn)):hover { - --btn-shadow: ""; - --btn-bg: #0000; - --btn-fg: var(--btn-color); - --btn-border: var(--btn-color); - --btn-noise: none; - } - } - } - } - .delay-100 { - animation-delay: calc(100*1ms); - animation-delay: .1s; - --tw-animation-delay: calc(100*1ms); - --tw-animation-delay: .1s; - } - .btn-sm { - @layer daisyui.l1.l2 { - --fontsize: 0.75rem; - --btn-p: 0.75rem; - --size: calc(var(--size-field, 0.25rem) * 8); - } - } - .btn-accent { - @layer daisyui.l1.l2 { - --btn-color: var(--color-accent); - --btn-fg: var(--color-accent-content); - } - } - .btn-primary { - @layer daisyui.l1.l2 { - --btn-color: var(--color-primary); - --btn-fg: var(--color-primary-content); - } - } - .btn-success { - @layer daisyui.l1.l2 { - --btn-color: var(--color-success); - --btn-fg: var(--color-success-content); - } - } - .outline-none { - --tw-outline-style: none; - outline-style: none; - } - .select-none { - -webkit-user-select: none; - user-select: none; - } - .fade-in { - --tw-enter-opacity: 0; - } - .slide-in-from-top-2 { - --tw-enter-translate-y: calc(2*var(--spacing)*-1); - } - .group-hover\:translate-x-1 { - &:is(:where(.group):hover *) { - @media (hover: hover) { - --tw-translate-x: var(--spacing); - translate: var(--tw-translate-x) var(--tw-translate-y); - } - } - } - .group-hover\:-translate-y-1 { - &:is(:where(.group):hover *) { - @media (hover: hover) { - --tw-translate-y: calc(var(--spacing) * -1); - translate: var(--tw-translate-x) var(--tw-translate-y); - } - } - } - .group-hover\:translate-y-0 { - &:is(:where(.group):hover *) { - @media (hover: hover) { - --tw-translate-y: 0; - translate: var(--tw-translate-x) var(--tw-translate-y); - } - } - } - .group-hover\:scale-105 { - &:is(:where(.group):hover *) { - @media (hover: hover) { - --tw-scale-x: 105%; - --tw-scale-y: 105%; - --tw-scale-z: 105%; - scale: var(--tw-scale-x) var(--tw-scale-y); - } - } - } - .group-hover\:scale-110 { - &:is(:where(.group):hover *) { - @media (hover: hover) { - --tw-scale-x: 110%; - --tw-scale-y: 110%; - --tw-scale-z: 110%; - scale: var(--tw-scale-x) var(--tw-scale-y); - } - } - } - .group-hover\:rotate-180 { - &:is(:where(.group):hover *) { - @media (hover: hover) { - rotate: 180deg; - } - } - } - .group-hover\:border-accent { - &:is(:where(.group):hover *) { - @media (hover: hover) { - border-color: var(--accent); - } - } - } - .group-hover\:border-accent\/20 { - &:is(:where(.group):hover *) { - @media (hover: hover) { - border-color: var(--accent); - @supports (color: color-mix(in lab, red, red)) { - border-color: color-mix(in oklab, var(--accent) 20%, transparent); - } - } - } - } - .group-hover\:bg-accent { - &:is(:where(.group):hover *) { - @media (hover: hover) { - background-color: var(--accent); - } - } - } - .group-hover\:bg-accent-light { - &:is(:where(.group):hover *) { - @media (hover: hover) { - background-color: var(--accent-light); - } - } - } - .group-hover\:bg-white\/20 { - &:is(:where(.group):hover *) { - @media (hover: hover) { - background-color: color-mix(in srgb, #fff 20%, transparent); - @supports (color: color-mix(in lab, red, red)) { - background-color: color-mix(in oklab, var(--color-white) 20%, transparent); - } - } - } - } - .group-hover\:text-accent { - &:is(:where(.group):hover *) { - @media (hover: hover) { - color: var(--accent); - } - } - } - .group-hover\:text-primary { - &:is(:where(.group):hover *) { - @media (hover: hover) { - color: var(--primary); - } - } - } - .group-hover\:text-white { - &:is(:where(.group):hover *) { - @media (hover: hover) { - color: var(--color-white); - } - } - } - .group-hover\:opacity-90 { - &:is(:where(.group):hover *) { - @media (hover: hover) { - opacity: 90%; - } - } - } - .group-hover\:opacity-100 { - &:is(:where(.group):hover *) { - @media (hover: hover) { - opacity: 100%; - } - } - } - .group-hover\:shadow-md { - &:is(:where(.group):hover *) { - @media (hover: hover) { - --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); - box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); - } - } - } - .group-hover\/item\:text-accent { - &:is(:where(.group\/item):hover *) { - @media (hover: hover) { - color: var(--accent); - } - } - } - .marker\:text-accent { - & *::marker { - color: var(--accent); - } - &::marker { - color: var(--accent); - } - & *::-webkit-details-marker { - color: var(--accent); - } - &::-webkit-details-marker { - color: var(--accent); - } - } - .placeholder\:text-text-muted\/50 { - &::placeholder { - color: var(--muted-foreground); - @supports (color: color-mix(in lab, red, red)) { - color: color-mix(in oklab, var(--muted-foreground) 50%, transparent); - } - } - } - .before\:absolute { - &::before { - content: var(--tw-content); - position: absolute; - } - } - .before\:inset-0 { - &::before { - content: var(--tw-content); - inset: 0; - } - } - .before\:ml-6 { - &::before { - content: var(--tw-content); - margin-left: calc(var(--spacing) * 6); - } - } - .before\:h-full { - &::before { - content: var(--tw-content); - height: 100%; - } - } - .before\:w-0\.5 { - &::before { - content: var(--tw-content); - width: calc(var(--spacing) * 0.5); - } - } - .before\:-translate-x-px { - &::before { - content: var(--tw-content); - --tw-translate-x: -1px; - translate: var(--tw-translate-x) var(--tw-translate-y); - } - } - .before\:bg-gradient-to-b { - &::before { - content: var(--tw-content); - --tw-gradient-position: to bottom in oklab; - background-image: linear-gradient(var(--tw-gradient-stops)); - } - } - .before\:from-transparent { - &::before { - content: var(--tw-content); - --tw-gradient-from: transparent; - --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); - } - } - .before\:via-white\/30 { - &::before { - content: var(--tw-content); - --tw-gradient-via: color-mix(in srgb, #fff 30%, transparent); - @supports (color: color-mix(in lab, red, red)) { - --tw-gradient-via: color-mix(in oklab, var(--color-white) 30%, transparent); - } - --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position); - --tw-gradient-stops: var(--tw-gradient-via-stops); - } - } - .before\:to-transparent { - &::before { - content: var(--tw-content); - --tw-gradient-to: transparent; - --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); - } - } - .last\:border-0 { - &:last-child { - border-style: var(--tw-border-style); - border-width: 0px; - } - } - .focus-within\:text-accent { - &:focus-within { - color: var(--accent); - } - } - .hover\:translate-y-\[-2px\] { - &:hover { - @media (hover: hover) { - --tw-translate-y: -2px; - translate: var(--tw-translate-x) var(--tw-translate-y); - } - } - } - .hover\:scale-110 { - &:hover { - @media (hover: hover) { - --tw-scale-x: 110%; - --tw-scale-y: 110%; - --tw-scale-z: 110%; - scale: var(--tw-scale-x) var(--tw-scale-y); - } - } - } - .hover\:rotate-0 { - &:hover { - @media (hover: hover) { - rotate: 0deg; - } - } - } - .hover\:border-accent { - &:hover { - @media (hover: hover) { - border-color: var(--accent); - } - } - } - .hover\:border-accent\/30 { - &:hover { - @media (hover: hover) { - border-color: var(--accent); - @supports (color: color-mix(in lab, red, red)) { - border-color: color-mix(in oklab, var(--accent) 30%, transparent); - } - } - } - } - .hover\:border-accent\/50 { - &:hover { - @media (hover: hover) { - border-color: var(--accent); - @supports (color: color-mix(in lab, red, red)) { - border-color: color-mix(in oklab, var(--accent) 50%, transparent); - } - } - } - } - .hover\:border-border { - &:hover { - @media (hover: hover) { - border-color: var(--border); - } - } - } - .hover\:border-cta { - &:hover { - @media (hover: hover) { - border-color: var(--cta); - } - } - } - .hover\:border-gray-300 { - &:hover { - @media (hover: hover) { - border-color: var(--color-gray-300); - } - } - } - .hover\:border-primary\/30 { - &:hover { - @media (hover: hover) { - border-color: var(--primary); - @supports (color: color-mix(in lab, red, red)) { - border-color: color-mix(in oklab, var(--primary) 30%, transparent); - } - } - } - } - .hover\:border-primary\/50 { - &:hover { - @media (hover: hover) { - border-color: var(--primary); - @supports (color: color-mix(in lab, red, red)) { - border-color: color-mix(in oklab, var(--primary) 50%, transparent); - } - } - } - } - .hover\:bg-background { - &:hover { - @media (hover: hover) { - background-color: var(--background); - } - } - } - .hover\:bg-cta-hover { - &:hover { - @media (hover: hover) { - background-color: var(--cta-hover); - } - } - } - .hover\:bg-gray-50 { - &:hover { - @media (hover: hover) { - background-color: var(--color-gray-50); - } - } - } - .hover\:bg-gray-50\/50 { - &:hover { - @media (hover: hover) { - background-color: color-mix(in srgb, oklch(98.5% 0.002 247.839) 50%, transparent); - @supports (color: color-mix(in lab, red, red)) { - background-color: color-mix(in oklab, var(--color-gray-50) 50%, transparent); - } - } - } - } - .hover\:bg-gray-100 { - &:hover { - @media (hover: hover) { - background-color: var(--color-gray-100); - } - } - } - .hover\:bg-green-700 { - &:hover { - @media (hover: hover) { - background-color: var(--color-green-700); - } - } - } - .hover\:bg-muted { - &:hover { - @media (hover: hover) { - background-color: var(--muted); - } - } - } - .hover\:bg-primary { - &:hover { - @media (hover: hover) { - background-color: var(--primary); - } - } - } - .hover\:bg-primary\/10 { - &:hover { - @media (hover: hover) { - background-color: var(--primary); - @supports (color: color-mix(in lab, red, red)) { - background-color: color-mix(in oklab, var(--primary) 10%, transparent); - } - } - } - } - .hover\:bg-red-50 { - &:hover { - @media (hover: hover) { - background-color: var(--color-red-50); - } - } - } - .hover\:bg-slate-50 { - &:hover { - @media (hover: hover) { - background-color: var(--color-slate-50); - } - } - } - .hover\:bg-white { - &:hover { - @media (hover: hover) { - background-color: var(--color-white); - } - } - } - .hover\:bg-white\/20 { - &:hover { - @media (hover: hover) { - background-color: color-mix(in srgb, #fff 20%, transparent); - @supports (color: color-mix(in lab, red, red)) { - background-color: color-mix(in oklab, var(--color-white) 20%, transparent); - } - } - } - } - .hover\:text-accent { - &:hover { - @media (hover: hover) { - color: var(--accent); - } - } - } - .hover\:text-green-800 { - &:hover { - @media (hover: hover) { - color: var(--color-green-800); - } - } - } - .hover\:text-primary { - &:hover { - @media (hover: hover) { - color: var(--primary); - } - } - } - .hover\:text-red-500 { - &:hover { - @media (hover: hover) { - color: var(--color-red-500); - } - } - } - .hover\:text-white { - &:hover { - @media (hover: hover) { - color: var(--color-white); - } - } - } - .hover\:underline { - &:hover { - @media (hover: hover) { - text-decoration-line: underline; - } - } - } - .hover\:shadow-lg { - &:hover { - @media (hover: hover) { - --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); - box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); - } - } - } - .hover\:shadow-md { - &:hover { - @media (hover: hover) { - --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); - box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); - } - } - } - .hover\:shadow-xl { - &:hover { - @media (hover: hover) { - --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); - box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); - } - } - } - .hover\:grayscale-0 { - &:hover { - @media (hover: hover) { - --tw-grayscale: grayscale(0%); - filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,); - } - } - } - .focus\:border-primary { - &:focus { - border-color: var(--primary); - } - } - .focus\:ring-1 { - &:focus { - --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor); - box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); - } - } - .focus\:ring-2 { - &:focus { - --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor); - box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); - } - } - .focus\:ring-accent { - &:focus { - --tw-ring-color: var(--accent); - } - } - .focus\:ring-green-600 { - &:focus { - --tw-ring-color: var(--color-green-600); - } - } - .focus\:ring-primary { - &:focus { - --tw-ring-color: var(--primary); - } - } - .focus\:ring-primary\/20 { - &:focus { - --tw-ring-color: var(--primary); - @supports (color: color-mix(in lab, red, red)) { - --tw-ring-color: color-mix(in oklab, var(--primary) 20%, transparent); - } - } - } - .focus\:ring-red-500 { - &:focus { - --tw-ring-color: var(--color-red-500); - } - } - .focus\:ring-offset-0 { - &:focus { - --tw-ring-offset-width: 0px; - --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); - } - } - .focus\:outline-none { - &:focus { - --tw-outline-style: none; - outline-style: none; - } - } - .disabled\:cursor-not-allowed { - &:disabled { - cursor: not-allowed; - } - } - .disabled\:opacity-50 { - &:disabled { - opacity: 50%; - } - } - .disabled\:opacity-70 { - &:disabled { - opacity: 70%; - } - } - .sm\:block { - @media (width >= 40rem) { - display: block; - } - } - .sm\:inline { - @media (width >= 40rem) { - display: inline; - } - } - .sm\:table-cell { - @media (width >= 40rem) { - display: table-cell; - } - } - .sm\:h-32 { - @media (width >= 40rem) { - height: calc(var(--spacing) * 32); - } - } - .sm\:w-32 { - @media (width >= 40rem) { - width: calc(var(--spacing) * 32); - } - } - .sm\:w-auto { - @media (width >= 40rem) { - width: auto; - } - } - .sm\:grid-cols-2 { - @media (width >= 40rem) { - grid-template-columns: repeat(2, minmax(0, 1fr)); - } - } - .sm\:grid-cols-3 { - @media (width >= 40rem) { - grid-template-columns: repeat(3, minmax(0, 1fr)); - } - } - .sm\:grid-cols-4 { - @media (width >= 40rem) { - grid-template-columns: repeat(4, minmax(0, 1fr)); - } - } - .sm\:flex-row { - @media (width >= 40rem) { - flex-direction: row; - } - } - .sm\:items-center { - @media (width >= 40rem) { - align-items: center; - } - } - .sm\:items-end { - @media (width >= 40rem) { - align-items: flex-end; - } - } - .sm\:px-6 { - @media (width >= 40rem) { - padding-inline: calc(var(--spacing) * 6); - } - } - .sm\:text-left { - @media (width >= 40rem) { - text-align: left; - } - } - .sm\:text-3xl { - @media (width >= 40rem) { - font-size: var(--text-3xl); - line-height: var(--tw-leading, var(--text-3xl--line-height)); - } - } - .sm\:text-base { - @media (width >= 40rem) { - font-size: var(--text-base); - line-height: var(--tw-leading, var(--text-base--line-height)); - } - } - .md\:order-1 { - @media (width >= 48rem) { - order: 1; - } - } - .md\:mx-0 { - @media (width >= 48rem) { - margin-inline: 0; - } - } - .md\:prose-xl { - @media (width >= 48rem) { - font-size: 1.25rem; - line-height: 1.8; - :where(p):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 1.2em; - margin-bottom: 1.2em; - } - :where([class~="lead"]):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - font-size: 1.2em; - line-height: 1.5; - margin-top: 1em; - margin-bottom: 1em; - } - :where(blockquote):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 1.6em; - margin-bottom: 1.6em; - padding-inline-start: 1.0666667em; - } - :where(h1):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - font-size: 2.8em; - margin-top: 0; - margin-bottom: 0.8571429em; - line-height: 1; - } - :where(h2):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - font-size: 1.8em; - margin-top: 1.5555556em; - margin-bottom: 0.8888889em; - line-height: 1.1111111; - } - :where(h3):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - font-size: 1.5em; - margin-top: 1.6em; - margin-bottom: 0.6666667em; - line-height: 1.3333333; - } - :where(h4):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 1.8em; - margin-bottom: 0.6em; - line-height: 1.6; - } - :where(img):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 2em; - margin-bottom: 2em; - } - :where(picture):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 2em; - margin-bottom: 2em; - } - :where(picture > img):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 0; - margin-bottom: 0; - } - :where(video):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 2em; - margin-bottom: 2em; - } - :where(kbd):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - font-size: 0.9em; - border-radius: 0.3125rem; - padding-top: 0.25em; - padding-inline-end: 0.4em; - padding-bottom: 0.25em; - padding-inline-start: 0.4em; - } - :where(code):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - font-size: 0.9em; - } - :where(h2 code):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - font-size: 0.8611111em; - } - :where(h3 code):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - font-size: 0.9em; - } - :where(pre):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - font-size: 0.9em; - line-height: 1.7777778; - margin-top: 2em; - margin-bottom: 2em; - border-radius: 0.5rem; - padding-top: 1.1111111em; - padding-inline-end: 1.3333333em; - padding-bottom: 1.1111111em; - padding-inline-start: 1.3333333em; - } - :where(ol):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 1.2em; - margin-bottom: 1.2em; - padding-inline-start: 1.6em; - } - :where(ul):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 1.2em; - margin-bottom: 1.2em; - padding-inline-start: 1.6em; - } - :where(li):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 0.6em; - margin-bottom: 0.6em; - } - :where(ol > li):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - padding-inline-start: 0.4em; - } - :where(ul > li):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - padding-inline-start: 0.4em; - } - :where(.md\:prose-xl > ul > li p):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 0.8em; - margin-bottom: 0.8em; - } - :where(.md\:prose-xl > ul > li > p:first-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 1.2em; - } - :where(.md\:prose-xl > ul > li > p:last-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-bottom: 1.2em; - } - :where(.md\:prose-xl > ol > li > p:first-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 1.2em; - } - :where(.md\:prose-xl > ol > li > p:last-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-bottom: 1.2em; - } - :where(ul ul, ul ol, ol ul, ol ol):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 0.8em; - margin-bottom: 0.8em; - } - :where(dl):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 1.2em; - margin-bottom: 1.2em; - } - :where(dt):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 1.2em; - } - :where(dd):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 0.6em; - padding-inline-start: 1.6em; - } - :where(hr):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 2.8em; - margin-bottom: 2.8em; - } - :where(hr + *):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 0; - } - :where(h2 + *):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 0; - } - :where(h3 + *):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 0; - } - :where(h4 + *):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 0; - } - :where(table):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - font-size: 0.9em; - line-height: 1.5555556; - } - :where(thead th):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - padding-inline-end: 0.6666667em; - padding-bottom: 0.8888889em; - padding-inline-start: 0.6666667em; - } - :where(thead th:first-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - padding-inline-start: 0; - } - :where(thead th:last-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - padding-inline-end: 0; - } - :where(tbody td, tfoot td):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - padding-top: 0.8888889em; - padding-inline-end: 0.6666667em; - padding-bottom: 0.8888889em; - padding-inline-start: 0.6666667em; - } - :where(tbody td:first-child, tfoot td:first-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - padding-inline-start: 0; - } - :where(tbody td:last-child, tfoot td:last-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - padding-inline-end: 0; - } - :where(figure):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 2em; - margin-bottom: 2em; - } - :where(figure > *):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 0; - margin-bottom: 0; - } - :where(figcaption):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - font-size: 0.9em; - line-height: 1.5555556; - margin-top: 1em; - } - :where(.md\:prose-xl > :first-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-top: 0; - } - :where(.md\:prose-xl > :last-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { - margin-bottom: 0; - } - } - } - .md\:mt-24 { - @media (width >= 48rem) { - margin-top: calc(var(--spacing) * 24); - } - } - .md\:mb-14 { - @media (width >= 48rem) { - margin-bottom: calc(var(--spacing) * 14); - } - } - .md\:block { - @media (width >= 48rem) { - display: block; - } - } - .md\:flex { - @media (width >= 48rem) { - display: flex; - } - } - .md\:hidden { - @media (width >= 48rem) { - display: none; - } - } - .md\:aspect-\[16\/9\] { - @media (width >= 48rem) { - aspect-ratio: 16/9; - } - } - .md\:aspect-auto { - @media (width >= 48rem) { - aspect-ratio: auto; - } - } - .md\:h-\[500px\] { - @media (width >= 48rem) { - height: 500px; - } - } - .md\:min-h-\[400px\] { - @media (width >= 48rem) { - min-height: 400px; - } - } - .md\:min-h-\[600px\] { - @media (width >= 48rem) { - min-height: 600px; - } - } - .md\:w-2\/5 { - @media (width >= 48rem) { - width: calc(2 / 5 * 100%); - } - } - .md\:w-3\/5 { - @media (width >= 48rem) { - width: calc(3 / 5 * 100%); - } - } - .md\:w-64 { - @media (width >= 48rem) { - width: calc(var(--spacing) * 64); - } - } - .md\:w-\[calc\(50\%-3rem\)\] { - @media (width >= 48rem) { - width: calc(50% - 3rem); - } - } - .md\:w-auto { - @media (width >= 48rem) { - width: auto; - } - } - .md\:grid-cols-2 { - @media (width >= 48rem) { - grid-template-columns: repeat(2, minmax(0, 1fr)); - } - } - .md\:grid-cols-3 { - @media (width >= 48rem) { - grid-template-columns: repeat(3, minmax(0, 1fr)); - } - } - .md\:grid-cols-4 { - @media (width >= 48rem) { - grid-template-columns: repeat(4, minmax(0, 1fr)); - } - } - .md\:flex-row { - @media (width >= 48rem) { - flex-direction: row; - } - } - .md\:justify-normal { - @media (width >= 48rem) { - justify-content: normal; - } - } - .md\:justify-start { - @media (width >= 48rem) { - justify-content: flex-start; - } - } - .md\:gap-4 { - @media (width >= 48rem) { - gap: calc(var(--spacing) * 4); - } - } - .md\:gap-6 { - @media (width >= 48rem) { - gap: calc(var(--spacing) * 6); - } - } - .md\:gap-8 { - @media (width >= 48rem) { - gap: calc(var(--spacing) * 8); - } - } - .md\:gap-10 { - @media (width >= 48rem) { - gap: calc(var(--spacing) * 10); - } - } - .md\:p-8 { - @media (width >= 48rem) { - padding: calc(var(--spacing) * 8); - } - } - .md\:p-12 { - @media (width >= 48rem) { - padding: calc(var(--spacing) * 12); - } - } - .md\:p-16 { - @media (width >= 48rem) { - padding: calc(var(--spacing) * 16); - } - } - .md\:px-8 { - @media (width >= 48rem) { - padding-inline: calc(var(--spacing) * 8); - } - } - .md\:py-16 { - @media (width >= 48rem) { - padding-block: calc(var(--spacing) * 16); - } - } - .md\:py-20 { - @media (width >= 48rem) { - padding-block: calc(var(--spacing) * 20); - } - } - .md\:py-24 { - @media (width >= 48rem) { - padding-block: calc(var(--spacing) * 24); - } - } - .md\:py-32 { - @media (width >= 48rem) { - padding-block: calc(var(--spacing) * 32); - } - } - .md\:text-left { - @media (width >= 48rem) { - text-align: left; - } - } - .md\:text-3xl { - @media (width >= 48rem) { - font-size: var(--text-3xl); - line-height: var(--tw-leading, var(--text-3xl--line-height)); - } - } - .md\:text-4xl { - @media (width >= 48rem) { - font-size: var(--text-4xl); - line-height: var(--tw-leading, var(--text-4xl--line-height)); - } - } - .md\:text-5xl { - @media (width >= 48rem) { - font-size: var(--text-5xl); - line-height: var(--tw-leading, var(--text-5xl--line-height)); - } - } - .md\:text-base { - @media (width >= 48rem) { - font-size: var(--text-base); - line-height: var(--tw-leading, var(--text-base--line-height)); - } - } - .md\:text-lg { - @media (width >= 48rem) { - font-size: var(--text-lg); - line-height: var(--tw-leading, var(--text-lg--line-height)); - } - } - .md\:text-sm { - @media (width >= 48rem) { - font-size: var(--text-sm); - line-height: var(--tw-leading, var(--text-sm--line-height)); - } - } - .md\:text-xl { - @media (width >= 48rem) { - font-size: var(--text-xl); - line-height: var(--tw-leading, var(--text-xl--line-height)); - } - } - .md\:group-odd\:-translate-x-1\/2 { - @media (width >= 48rem) { - &:is(:where(.group):nth-child(odd) *) { - --tw-translate-x: calc(calc(1 / 2 * 100%) * -1); - translate: var(--tw-translate-x) var(--tw-translate-y); - } - } - } - .md\:group-even\:translate-x-1\/2 { - @media (width >= 48rem) { - &:is(:where(.group):nth-child(even) *) { - --tw-translate-x: calc(1 / 2 * 100%); - translate: var(--tw-translate-x) var(--tw-translate-y); - } - } - } - .md\:before\:mx-auto { - @media (width >= 48rem) { - &::before { - content: var(--tw-content); - margin-inline: auto; - } - } - } - .md\:before\:translate-x-0 { - @media (width >= 48rem) { - &::before { - content: var(--tw-content); - --tw-translate-x: 0; - translate: var(--tw-translate-x) var(--tw-translate-y); - } - } - } - .md\:odd\:flex-row-reverse { - @media (width >= 48rem) { - &:nth-child(odd) { - flex-direction: row-reverse; - } - } - } - .lg\:col-span-1 { - @media (width >= 64rem) { - grid-column: span 1 / span 1; - } - } - .lg\:col-span-2 { - @media (width >= 64rem) { - grid-column: span 2 / span 2; - } - } - .lg\:col-span-5 { - @media (width >= 64rem) { - grid-column: span 5 / span 5; - } - } - .lg\:col-span-7 { - @media (width >= 64rem) { - grid-column: span 7 / span 7; - } - } - .lg\:mb-0 { - @media (width >= 64rem) { - margin-bottom: 0; - } - } - .lg\:block { - @media (width >= 64rem) { - display: block; - } - } - .lg\:flex { - @media (width >= 64rem) { - display: flex; - } - } - .lg\:hidden { - @media (width >= 64rem) { - display: none; - } - } - .lg\:grid-cols-2 { - @media (width >= 64rem) { - grid-template-columns: repeat(2, minmax(0, 1fr)); - } - } - .lg\:grid-cols-3 { - @media (width >= 64rem) { - grid-template-columns: repeat(3, minmax(0, 1fr)); - } - } - .lg\:grid-cols-4 { - @media (width >= 64rem) { - grid-template-columns: repeat(4, minmax(0, 1fr)); - } - } - .lg\:grid-cols-5 { - @media (width >= 64rem) { - grid-template-columns: repeat(5, minmax(0, 1fr)); - } - } - .lg\:grid-cols-8 { - @media (width >= 64rem) { - grid-template-columns: repeat(8, minmax(0, 1fr)); - } - } - .lg\:grid-cols-12 { - @media (width >= 64rem) { - grid-template-columns: repeat(12, minmax(0, 1fr)); - } - } - .lg\:flex-row { - @media (width >= 64rem) { - flex-direction: row; - } - } - .lg\:items-start { - @media (width >= 64rem) { - align-items: flex-start; - } - } - .lg\:gap-16 { - @media (width >= 64rem) { - gap: calc(var(--spacing) * 16); - } - } - .lg\:gap-20 { - @media (width >= 64rem) { - gap: calc(var(--spacing) * 20); - } - } - .lg\:gap-24 { - @media (width >= 64rem) { - gap: calc(var(--spacing) * 24); - } - } - .lg\:px-8 { - @media (width >= 64rem) { - padding-inline: calc(var(--spacing) * 8); - } - } - .lg\:text-left { - @media (width >= 64rem) { - text-align: left; - } - } - .lg\:text-6xl { - @media (width >= 64rem) { - font-size: var(--text-6xl); - line-height: var(--tw-leading, var(--text-6xl--line-height)); - } - } - .lg\:text-xl { - @media (width >= 64rem) { - font-size: var(--text-xl); - line-height: var(--tw-leading, var(--text-xl--line-height)); - } - } - .dark\:border-slate-700 { - &:is(.dark *) { - border-color: var(--color-slate-700); - } - } - .dark\:bg-slate-800 { - &:is(.dark *) { - background-color: var(--color-slate-800); - } - } - .dark\:text-slate-500 { - &:is(.dark *) { - color: var(--color-slate-500); - } - } - .prose-headings\:font-heading { - & :is(:where(h1, h2, h3, h4, h5, h6, th):not(:where([class~="not-prose"],[class~="not-prose"] *))) { - font-family: var(--font-heading); - } - } - .prose-headings\:font-bold { - & :is(:where(h1, h2, h3, h4, h5, h6, th):not(:where([class~="not-prose"],[class~="not-prose"] *))) { - --tw-font-weight: var(--font-weight-bold); - font-weight: var(--font-weight-bold); - } - } - .prose-headings\:text-primary { - & :is(:where(h1, h2, h3, h4, h5, h6, th):not(:where([class~="not-prose"],[class~="not-prose"] *))) { - color: var(--primary); - } - } - .prose-a\:font-semibold { - & :is(:where(a):not(:where([class~="not-prose"],[class~="not-prose"] *))) { - --tw-font-weight: var(--font-weight-semibold); - font-weight: var(--font-weight-semibold); - } - } - .prose-a\:text-accent { - & :is(:where(a):not(:where([class~="not-prose"],[class~="not-prose"] *))) { - color: var(--accent); - } - } - .prose-img\:rounded-xl { - & :is(:where(img):not(:where([class~="not-prose"],[class~="not-prose"] *))) { - border-radius: calc(var(--radius) * 1.4); - } - } - .prose-img\:shadow-md { - & :is(:where(img):not(:where([class~="not-prose"],[class~="not-prose"] *))) { - --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); - box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); - } - } -} -@property --tw-animation-delay { - syntax: "*"; - inherits: false; - initial-value: 0s; -} -@property --tw-animation-direction { - syntax: "*"; - inherits: false; - initial-value: normal; -} -@property --tw-animation-duration { - syntax: "*"; - inherits: false; -} -@property --tw-animation-fill-mode { - syntax: "*"; - inherits: false; - initial-value: none; -} -@property --tw-animation-iteration-count { - syntax: "*"; - inherits: false; - initial-value: 1; -} -@property --tw-enter-blur { - syntax: "*"; - inherits: false; - initial-value: 0; -} -@property --tw-enter-opacity { - syntax: "*"; - inherits: false; - initial-value: 1; -} -@property --tw-enter-rotate { - syntax: "*"; - inherits: false; - initial-value: 0; -} -@property --tw-enter-scale { - syntax: "*"; - inherits: false; - initial-value: 1; -} -@property --tw-enter-translate-x { - syntax: "*"; - inherits: false; - initial-value: 0; -} -@property --tw-enter-translate-y { - syntax: "*"; - inherits: false; - initial-value: 0; -} -@property --tw-exit-blur { - syntax: "*"; - inherits: false; - initial-value: 0; -} -@property --tw-exit-opacity { - syntax: "*"; - inherits: false; - initial-value: 1; -} -@property --tw-exit-rotate { - syntax: "*"; - inherits: false; - initial-value: 0; -} -@property --tw-exit-scale { - syntax: "*"; - inherits: false; - initial-value: 1; -} -@property --tw-exit-translate-x { - syntax: "*"; - inherits: false; - initial-value: 0; -} -@property --tw-exit-translate-y { - syntax: "*"; - inherits: false; - initial-value: 0; -} -:root { - --background: #ffffff; - --foreground: #1a2230; - --card: #ffffff; - --card-foreground: #1a2230; - --popover: #ffffff; - --popover-foreground: #1a2230; - --primary: #0f2a47; - --primary-foreground: #ffffff; - --primary-light: #1b3d63; - --secondary: #f5f7fa; - --secondary-foreground: #0f2a47; - --muted: #f5f7fa; - --muted-foreground: #5a6678; - --accent: #2ba8e0; - --accent-foreground: #ffffff; - --accent-light: #e3f4fc; - --cta: #1e293b; - --cta-foreground: #ffffff; - --cta-hover: #0f172a; - --destructive: oklch(0.577 0.245 27.325); - --border: #e2e8f0; - --input: #e2e8f0; - --ring: #2ba8e0; - --success: #16a34a; - --chart-1: oklch(0.87 0 0); - --chart-2: oklch(0.556 0 0); - --chart-3: oklch(0.439 0 0); - --chart-4: oklch(0.371 0 0); - --chart-5: oklch(0.269 0 0); - --radius: 0.75rem; - --sidebar: #ffffff; - --sidebar-foreground: #1a2230; - --sidebar-primary: #0f2a47; - --sidebar-primary-foreground: #ffffff; - --sidebar-accent: #f5f7fa; - --sidebar-accent-foreground: #0f2a47; - --sidebar-border: #e2e8f0; - --sidebar-ring: #2ba8e0; -} -.dark { - --background: #0f2a47; - --foreground: #f5f7fa; - --card: #1b3d63; - --card-foreground: #f5f7fa; - --popover: #1b3d63; - --popover-foreground: #f5f7fa; - --primary: #2ba8e0; - --primary-foreground: #0f2a47; - --secondary: #1b3d63; - --secondary-foreground: #f5f7fa; - --muted: #1b3d63; - --muted-foreground: #e3f4fc; - --accent: #2ba8e0; - --accent-foreground: #0f2a47; - --destructive: oklch(0.704 0.191 22.216); - --border: rgba(226, 232, 240, 0.1); - --input: rgba(226, 232, 240, 0.15); - --ring: #2ba8e0; -} -@layer base { - * { - border-color: var(--border); - outline-color: var(--ring); - @supports (color: color-mix(in lab, red, red)) { - outline-color: color-mix(in oklab, var(--ring) 50%, transparent); - } - } - body { - background-color: var(--background); - color: var(--foreground); - } - html { - font-family: var(--font-sans); - } - h1, h2, h3, h4, h5, h6 { - font-family: var(--font-heading); - } -} -@layer base { - :where(:root),:root:has(input.theme-controller[value=light]:checked),[data-theme=light] { - color-scheme: light; - --color-base-100: oklch(100% 0 0); - --color-base-200: oklch(98% 0 0); - --color-base-300: oklch(95% 0 0); - --color-base-content: oklch(21% 0.006 285.885); - --color-primary: oklch(45% 0.24 277.023); - --color-primary-content: oklch(93% 0.034 272.788); - --color-secondary: oklch(65% 0.241 354.308); - --color-secondary-content: oklch(94% 0.028 342.258); - --color-accent: oklch(77% 0.152 181.912); - --color-accent-content: oklch(38% 0.063 188.416); - --color-neutral: oklch(14% 0.005 285.823); - --color-neutral-content: oklch(92% 0.004 286.32); - --color-info: oklch(74% 0.16 232.661); - --color-info-content: oklch(29% 0.066 243.157); - --color-success: oklch(76% 0.177 163.223); - --color-success-content: oklch(37% 0.077 168.94); - --color-warning: oklch(82% 0.189 84.429); - --color-warning-content: oklch(41% 0.112 45.904); - --color-error: oklch(71% 0.194 13.428); - --color-error-content: oklch(27% 0.105 12.094); - --radius-selector: 0.5rem; - --radius-field: 0.25rem; - --radius-box: 0.5rem; - --size-selector: 0.25rem; - --size-field: 0.25rem; - --border: 1px; - --depth: 1; - --noise: 0; - } -} -@layer base { - @media (prefers-color-scheme: dark) { - :root:not([data-theme]) { - color-scheme: dark; - --color-base-100: oklch(25.33% 0.016 252.42); - --color-base-200: oklch(23.26% 0.014 253.1); - --color-base-300: oklch(21.15% 0.012 254.09); - --color-base-content: oklch(97.807% 0.029 256.847); - --color-primary: oklch(58% 0.233 277.117); - --color-primary-content: oklch(96% 0.018 272.314); - --color-secondary: oklch(65% 0.241 354.308); - --color-secondary-content: oklch(94% 0.028 342.258); - --color-accent: oklch(77% 0.152 181.912); - --color-accent-content: oklch(38% 0.063 188.416); - --color-neutral: oklch(14% 0.005 285.823); - --color-neutral-content: oklch(92% 0.004 286.32); - --color-info: oklch(74% 0.16 232.661); - --color-info-content: oklch(29% 0.066 243.157); - --color-success: oklch(76% 0.177 163.223); - --color-success-content: oklch(37% 0.077 168.94); - --color-warning: oklch(82% 0.189 84.429); - --color-warning-content: oklch(41% 0.112 45.904); - --color-error: oklch(71% 0.194 13.428); - --color-error-content: oklch(27% 0.105 12.094); - --radius-selector: 0.5rem; - --radius-field: 0.25rem; - --radius-box: 0.5rem; - --size-selector: 0.25rem; - --size-field: 0.25rem; - --border: 1px; - --depth: 1; - --noise: 0; - } - } -} -@layer base { - :root:has(input.theme-controller[value=light]:checked),[data-theme=light] { - color-scheme: light; - --color-base-100: oklch(100% 0 0); - --color-base-200: oklch(98% 0 0); - --color-base-300: oklch(95% 0 0); - --color-base-content: oklch(21% 0.006 285.885); - --color-primary: oklch(45% 0.24 277.023); - --color-primary-content: oklch(93% 0.034 272.788); - --color-secondary: oklch(65% 0.241 354.308); - --color-secondary-content: oklch(94% 0.028 342.258); - --color-accent: oklch(77% 0.152 181.912); - --color-accent-content: oklch(38% 0.063 188.416); - --color-neutral: oklch(14% 0.005 285.823); - --color-neutral-content: oklch(92% 0.004 286.32); - --color-info: oklch(74% 0.16 232.661); - --color-info-content: oklch(29% 0.066 243.157); - --color-success: oklch(76% 0.177 163.223); - --color-success-content: oklch(37% 0.077 168.94); - --color-warning: oklch(82% 0.189 84.429); - --color-warning-content: oklch(41% 0.112 45.904); - --color-error: oklch(71% 0.194 13.428); - --color-error-content: oklch(27% 0.105 12.094); - --radius-selector: 0.5rem; - --radius-field: 0.25rem; - --radius-box: 0.5rem; - --size-selector: 0.25rem; - --size-field: 0.25rem; - --border: 1px; - --depth: 1; - --noise: 0; - } -} -@layer base { - :root:has(input.theme-controller[value=dark]:checked),[data-theme=dark] { - color-scheme: dark; - --color-base-100: oklch(25.33% 0.016 252.42); - --color-base-200: oklch(23.26% 0.014 253.1); - --color-base-300: oklch(21.15% 0.012 254.09); - --color-base-content: oklch(97.807% 0.029 256.847); - --color-primary: oklch(58% 0.233 277.117); - --color-primary-content: oklch(96% 0.018 272.314); - --color-secondary: oklch(65% 0.241 354.308); - --color-secondary-content: oklch(94% 0.028 342.258); - --color-accent: oklch(77% 0.152 181.912); - --color-accent-content: oklch(38% 0.063 188.416); - --color-neutral: oklch(14% 0.005 285.823); - --color-neutral-content: oklch(92% 0.004 286.32); - --color-info: oklch(74% 0.16 232.661); - --color-info-content: oklch(29% 0.066 243.157); - --color-success: oklch(76% 0.177 163.223); - --color-success-content: oklch(37% 0.077 168.94); - --color-warning: oklch(82% 0.189 84.429); - --color-warning-content: oklch(41% 0.112 45.904); - --color-error: oklch(71% 0.194 13.428); - --color-error-content: oklch(27% 0.105 12.094); - --radius-selector: 0.5rem; - --radius-field: 0.25rem; - --radius-box: 0.5rem; - --size-selector: 0.25rem; - --size-field: 0.25rem; - --border: 1px; - --depth: 1; - --noise: 0; - } -} -@layer base { - :root { - --fx-noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200'%3E%3Cfilter id='a'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.34' numOctaves='4' stitchTiles='stitch'%3E%3C/feTurbulence%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23a)' opacity='0.2'%3E%3C/rect%3E%3C/svg%3E"); - } -} -@layer base { - :root, [data-theme] { - background-color: var(--root-bg, var(--color-base-100)); - color: var(--color-base-content); - } - :where(:root, [data-theme]) { - --root-bg: var(--color-base-100); - } -} -@layer base { - :root { - --page-scroll-bg-on: linear-gradient(var(--root-bg), var(--root-bg)) - var(--root-bg); - @supports (color: color-mix(in lab, red, red)) { - --page-scroll-bg-on: linear-gradient(var(--root-bg), var(--root-bg)) - color-mix(in srgb, var(--root-bg), oklch(0% 0 0) calc(var(--page-has-backdrop, 0) * 40%)); - } - --page-scroll-transition-on: background-color 0.3s ease-out; - transition: var(--page-scroll-transition); - scrollbar-gutter: var(--page-scroll-gutter, unset); - scrollbar-gutter: if(style(--page-has-scroll: 1): var(--page-scroll-gutter, unset) ; else: unset); - } - :root:root { - background: var(--page-scroll-bg, var(--root-bg, var(--color-base-100))); - } - @keyframes set-page-has-scroll { - 0%, to { - --page-has-scroll: 1; - } - } -} -@layer base { - @property --radialprogress { - syntax: ""; - inherits: true; - initial-value: 0%; - } -} -@layer base { - :root:not(span) { - overflow: var(--page-overflow); - } -} -@layer base { - :root { - scrollbar-color: currentColor #0000; - @supports (color: color-mix(in lab, red, red)) { - scrollbar-color: color-mix(in oklch, currentColor 35%, #0000) #0000; - } - } -} -@keyframes dropdown { - 0% { - opacity: 0; - } -} -@keyframes rating { - 0%, 40% { - scale: 1.1; - filter: brightness(1.05) contrast(1.05); - } -} -@keyframes radio { - 0% { - padding: 5px; - } - 50% { - padding: 3px; - } -} -@keyframes progress { - 50% { - background-position-x: -115%; - } -} -@keyframes skeleton { - 0% { - background-position: 150%; - } - 100% { - background-position: -50%; - } -} -@keyframes toast { - 0% { - scale: 0.9; - opacity: 0; - } - 100% { - scale: 1; - opacity: 1; - } -} -@keyframes rotator { - 89.9999%, 100% { - --first-item-position: 0 0%; - } - 90%, 99.9999% { - --first-item-position: 0 calc(var(--items) * 100%); - } - 100% { - translate: 0 -100%; - } -} -@property --tw-translate-x { - syntax: "*"; - inherits: false; - initial-value: 0; -} -@property --tw-translate-y { - syntax: "*"; - inherits: false; - initial-value: 0; -} -@property --tw-translate-z { - syntax: "*"; - inherits: false; - initial-value: 0; -} -@property --tw-scale-x { - syntax: "*"; - inherits: false; - initial-value: 1; -} -@property --tw-scale-y { - syntax: "*"; - inherits: false; - initial-value: 1; -} -@property --tw-scale-z { - syntax: "*"; - inherits: false; - initial-value: 1; -} -@property --tw-rotate-x { - syntax: "*"; - inherits: false; -} -@property --tw-rotate-y { - syntax: "*"; - inherits: false; -} -@property --tw-rotate-z { - syntax: "*"; - inherits: false; -} -@property --tw-skew-x { - syntax: "*"; - inherits: false; -} -@property --tw-skew-y { - syntax: "*"; - inherits: false; -} -@property --tw-space-y-reverse { - syntax: "*"; - inherits: false; - initial-value: 0; -} -@property --tw-divide-x-reverse { - syntax: "*"; - inherits: false; - initial-value: 0; -} -@property --tw-border-style { - syntax: "*"; - inherits: false; - initial-value: solid; -} -@property --tw-divide-y-reverse { - syntax: "*"; - inherits: false; - initial-value: 0; -} -@property --tw-gradient-position { - syntax: "*"; - inherits: false; -} -@property --tw-gradient-from { - syntax: ""; - inherits: false; - initial-value: #0000; -} -@property --tw-gradient-via { - syntax: ""; - inherits: false; - initial-value: #0000; -} -@property --tw-gradient-to { - syntax: ""; - inherits: false; - initial-value: #0000; -} -@property --tw-gradient-stops { - syntax: "*"; - inherits: false; -} -@property --tw-gradient-via-stops { - syntax: "*"; - inherits: false; -} -@property --tw-gradient-from-position { - syntax: ""; - inherits: false; - initial-value: 0%; -} -@property --tw-gradient-via-position { - syntax: ""; - inherits: false; - initial-value: 50%; -} -@property --tw-gradient-to-position { - syntax: ""; - inherits: false; - initial-value: 100%; -} -@property --tw-leading { - syntax: "*"; - inherits: false; -} -@property --tw-font-weight { - syntax: "*"; - inherits: false; -} -@property --tw-tracking { - syntax: "*"; - inherits: false; -} -@property --tw-shadow { - syntax: "*"; - inherits: false; - initial-value: 0 0 #0000; -} -@property --tw-shadow-color { - syntax: "*"; - inherits: false; -} -@property --tw-shadow-alpha { - syntax: ""; - inherits: false; - initial-value: 100%; -} -@property --tw-inset-shadow { - syntax: "*"; - inherits: false; - initial-value: 0 0 #0000; -} -@property --tw-inset-shadow-color { - syntax: "*"; - inherits: false; -} -@property --tw-inset-shadow-alpha { - syntax: ""; - inherits: false; - initial-value: 100%; -} -@property --tw-ring-color { - syntax: "*"; - inherits: false; -} -@property --tw-ring-shadow { - syntax: "*"; - inherits: false; - initial-value: 0 0 #0000; -} -@property --tw-inset-ring-color { - syntax: "*"; - inherits: false; -} -@property --tw-inset-ring-shadow { - syntax: "*"; - inherits: false; - initial-value: 0 0 #0000; -} -@property --tw-ring-inset { - syntax: "*"; - inherits: false; -} -@property --tw-ring-offset-width { - syntax: ""; - inherits: false; - initial-value: 0px; -} -@property --tw-ring-offset-color { - syntax: "*"; - inherits: false; - initial-value: #fff; -} -@property --tw-ring-offset-shadow { - syntax: "*"; - inherits: false; - initial-value: 0 0 #0000; -} -@property --tw-outline-style { - syntax: "*"; - inherits: false; - initial-value: solid; -} -@property --tw-blur { - syntax: "*"; - inherits: false; -} -@property --tw-brightness { - syntax: "*"; - inherits: false; -} -@property --tw-contrast { - syntax: "*"; - inherits: false; -} -@property --tw-grayscale { - syntax: "*"; - inherits: false; -} -@property --tw-hue-rotate { - syntax: "*"; - inherits: false; -} -@property --tw-invert { - syntax: "*"; - inherits: false; -} -@property --tw-opacity { - syntax: "*"; - inherits: false; -} -@property --tw-saturate { - syntax: "*"; - inherits: false; -} -@property --tw-sepia { - syntax: "*"; - inherits: false; -} -@property --tw-drop-shadow { - syntax: "*"; - inherits: false; -} -@property --tw-drop-shadow-color { - syntax: "*"; - inherits: false; -} -@property --tw-drop-shadow-alpha { - syntax: ""; - inherits: false; - initial-value: 100%; -} -@property --tw-drop-shadow-size { - syntax: "*"; - inherits: false; -} -@property --tw-backdrop-blur { - syntax: "*"; - inherits: false; -} -@property --tw-backdrop-brightness { - syntax: "*"; - inherits: false; -} -@property --tw-backdrop-contrast { - syntax: "*"; - inherits: false; -} -@property --tw-backdrop-grayscale { - syntax: "*"; - inherits: false; -} -@property --tw-backdrop-hue-rotate { - syntax: "*"; - inherits: false; -} -@property --tw-backdrop-invert { - syntax: "*"; - inherits: false; -} -@property --tw-backdrop-opacity { - syntax: "*"; - inherits: false; -} -@property --tw-backdrop-saturate { - syntax: "*"; - inherits: false; -} -@property --tw-backdrop-sepia { - syntax: "*"; - inherits: false; -} -@property --tw-duration { - syntax: "*"; - inherits: false; -} -@property --tw-ease { - syntax: "*"; - inherits: false; -} -@property --tw-content { - syntax: "*"; - initial-value: ""; - inherits: false; -} -@keyframes spin { - to { - transform: rotate(360deg); - } -} -@keyframes enter { - from { - opacity: var(--tw-enter-opacity,1); - transform: translate3d(var(--tw-enter-translate-x,0),var(--tw-enter-translate-y,0),0)scale3d(var(--tw-enter-scale,1),var(--tw-enter-scale,1),var(--tw-enter-scale,1))rotate(var(--tw-enter-rotate,0)); - filter: blur(var(--tw-enter-blur,0)); - } -} -@layer properties { - @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) { - *, ::before, ::after, ::backdrop { - --tw-translate-x: 0; - --tw-translate-y: 0; - --tw-translate-z: 0; - --tw-scale-x: 1; - --tw-scale-y: 1; - --tw-scale-z: 1; - --tw-rotate-x: initial; - --tw-rotate-y: initial; - --tw-rotate-z: initial; - --tw-skew-x: initial; - --tw-skew-y: initial; - --tw-space-y-reverse: 0; - --tw-divide-x-reverse: 0; - --tw-border-style: solid; - --tw-divide-y-reverse: 0; - --tw-gradient-position: initial; - --tw-gradient-from: #0000; - --tw-gradient-via: #0000; - --tw-gradient-to: #0000; - --tw-gradient-stops: initial; - --tw-gradient-via-stops: initial; - --tw-gradient-from-position: 0%; - --tw-gradient-via-position: 50%; - --tw-gradient-to-position: 100%; - --tw-leading: initial; - --tw-font-weight: initial; - --tw-tracking: initial; - --tw-shadow: 0 0 #0000; - --tw-shadow-color: initial; - --tw-shadow-alpha: 100%; - --tw-inset-shadow: 0 0 #0000; - --tw-inset-shadow-color: initial; - --tw-inset-shadow-alpha: 100%; - --tw-ring-color: initial; - --tw-ring-shadow: 0 0 #0000; - --tw-inset-ring-color: initial; - --tw-inset-ring-shadow: 0 0 #0000; - --tw-ring-inset: initial; - --tw-ring-offset-width: 0px; - --tw-ring-offset-color: #fff; - --tw-ring-offset-shadow: 0 0 #0000; - --tw-outline-style: solid; - --tw-blur: initial; - --tw-brightness: initial; - --tw-contrast: initial; - --tw-grayscale: initial; - --tw-hue-rotate: initial; - --tw-invert: initial; - --tw-opacity: initial; - --tw-saturate: initial; - --tw-sepia: initial; - --tw-drop-shadow: initial; - --tw-drop-shadow-color: initial; - --tw-drop-shadow-alpha: 100%; - --tw-drop-shadow-size: initial; - --tw-backdrop-blur: initial; - --tw-backdrop-brightness: initial; - --tw-backdrop-contrast: initial; - --tw-backdrop-grayscale: initial; - --tw-backdrop-hue-rotate: initial; - --tw-backdrop-invert: initial; - --tw-backdrop-opacity: initial; - --tw-backdrop-saturate: initial; - --tw-backdrop-sepia: initial; - --tw-duration: initial; - --tw-ease: initial; - --tw-content: ""; - --tw-animation-delay: 0s; - --tw-animation-direction: normal; - --tw-animation-duration: initial; - --tw-animation-fill-mode: none; - --tw-animation-iteration-count: 1; - --tw-enter-blur: 0; - --tw-enter-opacity: 1; - --tw-enter-rotate: 0; - --tw-enter-scale: 1; - --tw-enter-translate-x: 0; - --tw-enter-translate-y: 0; - --tw-exit-blur: 0; - --tw-exit-opacity: 1; - --tw-exit-rotate: 0; - --tw-exit-scale: 1; - --tw-exit-translate-x: 0; - --tw-exit-translate-y: 0; - } - } -} diff --git a/parse_transcript.py b/parse_transcript.py deleted file mode 100644 index 5ae6201..0000000 --- a/parse_transcript.py +++ /dev/null @@ -1,20 +0,0 @@ -import json - -transcript_path = '/Users/michalcukrowski/.gemini/antigravity-ide/brain/1d7cf0f7-087b-4c82-94a5-07c51084a559/.system_generated/logs/transcript_full.jsonl' - -with open(transcript_path, 'r', encoding='utf-8') as f: - for line in f: - data = json.loads(line) - if data.get('type') == 'USER_INPUT': - content = data.get('content', '') - if 'export interface Product {' in content and len(content) > 100000: - print(f"Found large user input of length {len(content)}") - # Extract the file content. It probably starts with "export interface Product {" - # or there is some text before it. - idx = content.find('export interface Product {') - if idx != -1: - file_content = content[idx:] - with open('content/products.ts', 'w', encoding='utf-8') as out: - out.write(file_content) - print("Wrote to content/products.ts successfully!") - break diff --git a/parse_transcript2.py b/parse_transcript2.py deleted file mode 100644 index 7bc5d13..0000000 --- a/parse_transcript2.py +++ /dev/null @@ -1,14 +0,0 @@ -import json - -transcript_path = '/Users/michalcukrowski/.gemini/antigravity-ide/brain/1d7cf0f7-087b-4c82-94a5-07c51084a559/.system_generated/logs/transcript_full.jsonl' - -with open(transcript_path, 'r', encoding='utf-8') as f: - for line in f: - data = json.loads(line) - if data.get('type') == 'USER_INPUT': - content = data.get('content', '') - print(f"USER_INPUT len: {len(content)}") - if len(content) > 50000: - with open('large_input.txt', 'w', encoding='utf-8') as out: - out.write(content) - print("Saved large input to large_input.txt")