1316 lines
31 KiB
CSS
1316 lines
31 KiB
CSS
/*! tailwindcss v4.1.18 | MIT License | https://tailwindcss.com */
|
|
@layer properties;
|
|
@layer theme, base, components, utilities;
|
|
@layer theme {
|
|
:root, :host {
|
|
--font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji",
|
|
"Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
|
|
--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
|
|
"Courier New", monospace;
|
|
--color-black: #000;
|
|
--color-white: #fff;
|
|
--spacing: 0.25rem;
|
|
--text-sm: 0.875rem;
|
|
--text-sm--line-height: calc(1.25 / 0.875);
|
|
--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-3xl: 1.875rem;
|
|
--text-6xl: 3.75rem;
|
|
--font-weight-semibold: 600;
|
|
--font-weight-bold: 700;
|
|
--radius-lg: var(--radius);
|
|
--animate-pulse: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
|
|
--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-mono);
|
|
--font-display: var(--display-family);
|
|
--font-text: var(--text-family);
|
|
}
|
|
}
|
|
@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 {
|
|
.visible {
|
|
visibility: visible;
|
|
}
|
|
.relative {
|
|
position: relative;
|
|
}
|
|
.static {
|
|
position: static;
|
|
}
|
|
.sticky {
|
|
position: sticky;
|
|
}
|
|
.top-0 {
|
|
top: calc(var(--spacing) * 0);
|
|
}
|
|
.bottom-0 {
|
|
bottom: calc(var(--spacing) * 0);
|
|
}
|
|
.grid-table-\[1fr_1fr_1fr_1fr_1fr_1fr\] {
|
|
&:is(table) {
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
|
|
& > :is(thead, tbody, tfoot) {
|
|
grid-column-start: 1;
|
|
grid-column-end: -1;
|
|
display: grid;
|
|
grid-template-columns: subgrid;
|
|
& > tr {
|
|
grid-column-start: 1;
|
|
grid-column-end: -1;
|
|
display: grid;
|
|
grid-template-columns: subgrid;
|
|
& > th, & > td {
|
|
grid-column: span 1;
|
|
align-content: center;
|
|
text-align: center;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.grid-table-\[1fr_1fr_1fr_1fr_1fr_1fr_1fr\] {
|
|
&:is(table) {
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
|
|
& > :is(thead, tbody, tfoot) {
|
|
grid-column-start: 1;
|
|
grid-column-end: -1;
|
|
display: grid;
|
|
grid-template-columns: subgrid;
|
|
& > tr {
|
|
grid-column-start: 1;
|
|
grid-column-end: -1;
|
|
display: grid;
|
|
grid-template-columns: subgrid;
|
|
& > th, & > td {
|
|
grid-column: span 1;
|
|
align-content: center;
|
|
text-align: center;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.col-2 {
|
|
grid-column: 2;
|
|
}
|
|
.col-3 {
|
|
grid-column: 3;
|
|
}
|
|
.col-\[span_2\] {
|
|
grid-column: span 2;
|
|
}
|
|
.col-span-2 {
|
|
grid-column: span 2 / span 2;
|
|
}
|
|
.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\.5em\] {
|
|
margin: 0.5em;
|
|
}
|
|
.m-\[0\.25em\] {
|
|
margin: 0.25em;
|
|
}
|
|
.m-\[1em\] {
|
|
margin: 1em;
|
|
}
|
|
.m-\[1rem\] {
|
|
margin: 1rem;
|
|
}
|
|
.m-\[2em\] {
|
|
margin: 2em;
|
|
}
|
|
.mx-\[1em\] {
|
|
margin-inline: 1em;
|
|
}
|
|
.my-\[0\.5em\] {
|
|
margin-block: 0.5em;
|
|
}
|
|
.my-\[1rem\] {
|
|
margin-block: 1rem;
|
|
}
|
|
.mt-\[0\.25em\] {
|
|
margin-top: 0.25em;
|
|
}
|
|
.mt-\[1\.5em\] {
|
|
margin-top: 1.5em;
|
|
}
|
|
.mt-\[1em\] {
|
|
margin-top: 1em;
|
|
}
|
|
.mt-\[3em\] {
|
|
margin-top: 3em;
|
|
}
|
|
.mb-\[0\.5em\] {
|
|
margin-bottom: 0.5em;
|
|
}
|
|
.mb-\[1\.25rem\] {
|
|
margin-bottom: 1.25rem;
|
|
}
|
|
.mb-\[1em\] {
|
|
margin-bottom: 1em;
|
|
}
|
|
.mb-\[3em\] {
|
|
margin-bottom: 3em;
|
|
}
|
|
.ml-\[1em\] {
|
|
margin-left: 1em;
|
|
}
|
|
.block {
|
|
display: block;
|
|
}
|
|
.contents {
|
|
display: contents;
|
|
}
|
|
.flex {
|
|
display: flex;
|
|
}
|
|
.grid {
|
|
display: grid;
|
|
}
|
|
.hidden {
|
|
display: none;
|
|
}
|
|
.inline-block {
|
|
display: inline-block;
|
|
}
|
|
.table {
|
|
display: table;
|
|
}
|
|
.h-\[2rem\] {
|
|
height: 2rem;
|
|
}
|
|
.h-fit {
|
|
height: fit-content;
|
|
}
|
|
.max-h-\[50vh\] {
|
|
max-height: 50vh;
|
|
}
|
|
.max-h-\[80vh\] {
|
|
max-height: 80vh;
|
|
}
|
|
.max-h-full {
|
|
max-height: 100%;
|
|
}
|
|
.min-h-full {
|
|
min-height: 100%;
|
|
}
|
|
.w-fit {
|
|
width: fit-content;
|
|
}
|
|
.w-full {
|
|
width: 100%;
|
|
}
|
|
.max-w-\[50\%\] {
|
|
max-width: 50%;
|
|
}
|
|
.max-w-\[80vw\] {
|
|
max-width: 80vw;
|
|
}
|
|
.max-w-full {
|
|
max-width: 100%;
|
|
}
|
|
.min-w-fit {
|
|
min-width: fit-content;
|
|
}
|
|
.flex-shrink {
|
|
flex-shrink: 1;
|
|
}
|
|
.flex-grow-\[1\] {
|
|
flex-grow: 1;
|
|
}
|
|
.grow {
|
|
flex-grow: 1;
|
|
}
|
|
.grow-1 {
|
|
flex-grow: 1;
|
|
}
|
|
.basis-\[fit-content\] {
|
|
flex-basis: fit-content;
|
|
}
|
|
.basis-full {
|
|
flex-basis: 100%;
|
|
}
|
|
.animate-pulse {
|
|
animation: var(--animate-pulse);
|
|
}
|
|
.cursor-default {
|
|
cursor: default;
|
|
}
|
|
.cursor-pointer {
|
|
cursor: pointer;
|
|
}
|
|
.resize {
|
|
resize: both;
|
|
}
|
|
.list-none {
|
|
list-style-type: none;
|
|
}
|
|
.grid-cols-\[6rem_10fr_6rem\] {
|
|
grid-template-columns: 6rem 10fr 6rem;
|
|
}
|
|
.grid-cols-\[max-content_1fr\] {
|
|
grid-template-columns: max-content 1fr;
|
|
}
|
|
.grid-cols-\[max-content_max-content\] {
|
|
grid-template-columns: max-content max-content;
|
|
}
|
|
.grid-rows-\[auto_auto_auto\] {
|
|
grid-template-rows: auto auto auto;
|
|
}
|
|
.flex-col {
|
|
flex-direction: column;
|
|
}
|
|
.items-center {
|
|
align-items: center;
|
|
}
|
|
.items-stretch {
|
|
align-items: stretch;
|
|
}
|
|
.justify-center {
|
|
justify-content: center;
|
|
}
|
|
.justify-start {
|
|
justify-content: flex-start;
|
|
}
|
|
.gap-\[0\.5em\] {
|
|
gap: 0.5em;
|
|
}
|
|
.gap-\[0\.25em\] {
|
|
gap: 0.25em;
|
|
}
|
|
.gap-\[1em\] {
|
|
gap: 1em;
|
|
}
|
|
.gap-y-\[2em\] {
|
|
row-gap: 2em;
|
|
}
|
|
.self-center {
|
|
align-self: center;
|
|
}
|
|
.overflow-x-auto {
|
|
overflow-x: auto;
|
|
}
|
|
.overflow-x-hidden {
|
|
overflow-x: hidden;
|
|
}
|
|
.overflow-y-auto {
|
|
overflow-y: auto;
|
|
}
|
|
.overflow-y-hidden {
|
|
overflow-y: hidden;
|
|
}
|
|
.rounded {
|
|
border-radius: 0.25rem;
|
|
}
|
|
.rounded-\[50\%\] {
|
|
border-radius: 50%;
|
|
}
|
|
.rounded-lg {
|
|
border-radius: var(--radius);
|
|
}
|
|
.rounded-md {
|
|
border-radius: calc(var(--radius) - 2px);
|
|
}
|
|
.rounded-sm {
|
|
border-radius: calc(var(--radius) - 4px);
|
|
}
|
|
.border {
|
|
border-style: var(--tw-border-style);
|
|
border-width: 1px;
|
|
}
|
|
.border-\[1px\] {
|
|
border-style: var(--tw-border-style);
|
|
border-width: 1px;
|
|
}
|
|
.border-b-\[2px\] {
|
|
border-bottom-style: var(--tw-border-style);
|
|
border-bottom-width: 2px;
|
|
}
|
|
.border-solid {
|
|
--tw-border-style: solid;
|
|
border-style: solid;
|
|
}
|
|
.border-foreground {
|
|
border-color: var(--foreground);
|
|
}
|
|
.border-input {
|
|
border-color: var(--input);
|
|
}
|
|
.border-sidebar-border {
|
|
border-color: var(--sidebar-border);
|
|
}
|
|
.bg-accent {
|
|
background-color: var(--accent);
|
|
}
|
|
.bg-accent-secondary {
|
|
background-color: var(--accent-secondary);
|
|
}
|
|
.bg-background {
|
|
background-color: var(--background);
|
|
}
|
|
.bg-card {
|
|
background-color: var(--card);
|
|
}
|
|
.p-\[0\.5em\] {
|
|
padding: 0.5em;
|
|
}
|
|
.p-\[0\.25em\] {
|
|
padding: 0.25em;
|
|
}
|
|
.p-\[1em\] {
|
|
padding: 1em;
|
|
}
|
|
.px-\[2em\] {
|
|
padding-inline: 2em;
|
|
}
|
|
.py-\[0\.5em\] {
|
|
padding-block: 0.5em;
|
|
}
|
|
.py-\[1em\] {
|
|
padding-block: 1em;
|
|
}
|
|
.pt-\[1em\] {
|
|
padding-top: 1em;
|
|
}
|
|
.pr-\[2em\] {
|
|
padding-right: 2em;
|
|
}
|
|
.pb-\[0\.5em\] {
|
|
padding-bottom: 0.5em;
|
|
}
|
|
.pb-\[1em\] {
|
|
padding-bottom: 1em;
|
|
}
|
|
.pb-\[1rem\] {
|
|
padding-bottom: 1rem;
|
|
}
|
|
.text-center {
|
|
text-align: center;
|
|
}
|
|
.font-display {
|
|
font-family: var(--display-family);
|
|
}
|
|
.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));
|
|
}
|
|
.font-bold {
|
|
--tw-font-weight: var(--font-weight-bold);
|
|
font-weight: var(--font-weight-bold);
|
|
}
|
|
.font-semibold {
|
|
--tw-font-weight: var(--font-weight-semibold);
|
|
font-weight: var(--font-weight-semibold);
|
|
}
|
|
.text-nowrap {
|
|
text-wrap: nowrap;
|
|
}
|
|
.capitalize {
|
|
text-transform: capitalize;
|
|
}
|
|
.italic {
|
|
font-style: italic;
|
|
}
|
|
.underline {
|
|
text-decoration-line: underline;
|
|
}
|
|
.outline-1 {
|
|
outline-style: var(--tw-outline-style);
|
|
outline-width: 1px;
|
|
}
|
|
.outline-\(--table-tfoot\) {
|
|
outline-color: var(--table-tfoot);
|
|
}
|
|
.filter {
|
|
filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
|
|
}
|
|
.transition {
|
|
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-\[scale\] {
|
|
transition-property: scale;
|
|
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
|
|
transition-duration: var(--tw-duration, var(--default-transition-duration));
|
|
}
|
|
.not-open\:mb-\[1em\] {
|
|
&:not(*:is([open], :popover-open, :open)) {
|
|
margin-bottom: 1em;
|
|
}
|
|
}
|
|
.group-hover\:scale-120 {
|
|
&:is(:where(.group):hover *) {
|
|
@media (hover: hover) {
|
|
--tw-scale-x: 120%;
|
|
--tw-scale-y: 120%;
|
|
--tw-scale-z: 120%;
|
|
scale: var(--tw-scale-x) var(--tw-scale-y);
|
|
}
|
|
}
|
|
}
|
|
.details-content\:flex {
|
|
&::details-content {
|
|
display: flex;
|
|
}
|
|
}
|
|
.details-content\:transform-\[translate\(0px\,-2em\)\] {
|
|
&::details-content {
|
|
transform: translate(0px,-2em);
|
|
}
|
|
}
|
|
.details-content\:flex-col {
|
|
&::details-content {
|
|
flex-direction: column;
|
|
}
|
|
}
|
|
.details-content\:items-center {
|
|
&::details-content {
|
|
align-items: center;
|
|
}
|
|
}
|
|
.details-content\:border-transparent {
|
|
&::details-content {
|
|
border-color: transparent;
|
|
}
|
|
}
|
|
.details-content\:px-\[1em\] {
|
|
&::details-content {
|
|
padding-inline: 1em;
|
|
}
|
|
}
|
|
.details-content\:opacity-\[0\] {
|
|
&::details-content {
|
|
opacity: 0;
|
|
}
|
|
}
|
|
.details-content\:outline-transparent {
|
|
&::details-content {
|
|
outline-color: transparent;
|
|
}
|
|
}
|
|
.details-content\:transition-\[opacity_transform\] {
|
|
&::details-content {
|
|
transition-property: opacity transform;
|
|
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
|
|
transition-duration: var(--tw-duration, var(--default-transition-duration));
|
|
}
|
|
}
|
|
.after\:absolute {
|
|
&::after {
|
|
content: var(--tw-content);
|
|
position: absolute;
|
|
}
|
|
}
|
|
.after\:right-\[0\.5em\] {
|
|
&::after {
|
|
content: var(--tw-content);
|
|
right: 0.5em;
|
|
}
|
|
}
|
|
.after\:text-\[2em\] {
|
|
&::after {
|
|
content: var(--tw-content);
|
|
font-size: 2em;
|
|
}
|
|
}
|
|
.after\:leading-\[1em\] {
|
|
&::after {
|
|
content: var(--tw-content);
|
|
--tw-leading: 1em;
|
|
line-height: 1em;
|
|
}
|
|
}
|
|
.after\:font-bold {
|
|
&::after {
|
|
content: var(--tw-content);
|
|
--tw-font-weight: var(--font-weight-bold);
|
|
font-weight: var(--font-weight-bold);
|
|
}
|
|
}
|
|
.after\:content-\[\'\+\'\] {
|
|
&::after {
|
|
--tw-content: '+';
|
|
content: var(--tw-content);
|
|
}
|
|
}
|
|
.group-open\/sync-group\:after\:content-\[\'-\'\] {
|
|
&:is(:where(.group\/sync-group):is([open], :popover-open, :open) *) {
|
|
&::after {
|
|
--tw-content: '-';
|
|
content: var(--tw-content);
|
|
}
|
|
}
|
|
}
|
|
.open\:grid {
|
|
&:is([open], :popover-open, :open) {
|
|
display: grid;
|
|
}
|
|
}
|
|
.open\:bg-card {
|
|
&:is([open], :popover-open, :open) {
|
|
background-color: var(--card);
|
|
}
|
|
}
|
|
.open\:details-content\:transform-\[translate\(0px\,0px\)\] {
|
|
&:is([open], :popover-open, :open) {
|
|
&::details-content {
|
|
transform: translate(0px,0px);
|
|
}
|
|
}
|
|
}
|
|
.open\:details-content\:border-x-\[0px\] {
|
|
&:is([open], :popover-open, :open) {
|
|
&::details-content {
|
|
border-inline-style: var(--tw-border-style);
|
|
border-inline-width: 0px;
|
|
}
|
|
}
|
|
}
|
|
.open\:details-content\:border-t-\[0\.25rem\] {
|
|
&:is([open], :popover-open, :open) {
|
|
&::details-content {
|
|
border-top-style: var(--tw-border-style);
|
|
border-top-width: 0.25rem;
|
|
}
|
|
}
|
|
}
|
|
.open\:details-content\:border-b-\[0px\] {
|
|
&:is([open], :popover-open, :open) {
|
|
&::details-content {
|
|
border-bottom-style: var(--tw-border-style);
|
|
border-bottom-width: 0px;
|
|
}
|
|
}
|
|
}
|
|
.open\:details-content\:border-dotted {
|
|
&:is([open], :popover-open, :open) {
|
|
&::details-content {
|
|
--tw-border-style: dotted;
|
|
border-style: dotted;
|
|
}
|
|
}
|
|
}
|
|
.open\:details-content\:border-x-transparent {
|
|
&:is([open], :popover-open, :open) {
|
|
&::details-content {
|
|
border-inline-color: transparent;
|
|
}
|
|
}
|
|
}
|
|
.open\:details-content\:border-t-background {
|
|
&:is([open], :popover-open, :open) {
|
|
&::details-content {
|
|
border-top-color: var(--background);
|
|
}
|
|
}
|
|
}
|
|
.open\:details-content\:border-b-transparent {
|
|
&:is([open], :popover-open, :open) {
|
|
&::details-content {
|
|
border-bottom-color: transparent;
|
|
}
|
|
}
|
|
}
|
|
.open\:details-content\:p-\[1em\] {
|
|
&:is([open], :popover-open, :open) {
|
|
&::details-content {
|
|
padding: 1em;
|
|
}
|
|
}
|
|
}
|
|
.open\:details-content\:opacity-\[1\] {
|
|
&:is([open], :popover-open, :open) {
|
|
&::details-content {
|
|
opacity: 1;
|
|
}
|
|
}
|
|
}
|
|
.hover\:bg-accent {
|
|
&:hover {
|
|
@media (hover: hover) {
|
|
background-color: var(--accent);
|
|
}
|
|
}
|
|
}
|
|
.hover\:underline {
|
|
&:hover {
|
|
@media (hover: hover) {
|
|
text-decoration-line: underline;
|
|
}
|
|
}
|
|
}
|
|
.disabled\:cursor-not-allowed {
|
|
&:disabled {
|
|
cursor: not-allowed;
|
|
}
|
|
}
|
|
.disabled\:bg-accent-secondary {
|
|
&:disabled {
|
|
background-color: var(--accent-secondary);
|
|
}
|
|
}
|
|
.disabled\:no-underline {
|
|
&:disabled {
|
|
text-decoration-line: none;
|
|
}
|
|
}
|
|
.min-\[400px\]\:px-\[calc\(10vw-0\.5em\)\] {
|
|
@media (width >= 400px) {
|
|
padding-inline: calc(10vw - 0.5em);
|
|
}
|
|
}
|
|
.min-\[400px\]\:py-\[calc\(8vw-0\.5em\)\] {
|
|
@media (width >= 400px) {
|
|
padding-block: calc(8vw - 0.5em);
|
|
}
|
|
}
|
|
.md\:grid-cols-\[1fr_1fr\] {
|
|
@media (width >= 48rem) {
|
|
grid-template-columns: 1fr 1fr;
|
|
}
|
|
}
|
|
.dark\:invert {
|
|
@media (prefers-color-scheme: dark) {
|
|
--tw-invert: invert(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,);
|
|
}
|
|
}
|
|
}
|
|
@layer base {
|
|
select {
|
|
padding: 0.5em;
|
|
}
|
|
}
|
|
@import url('https://fonts.googleapis.com/css2?family=Geist:wght@600&display=swap');
|
|
@import url('https://fonts.googleapis.com/css2?family=Alexandria:wght@300&display=swap');
|
|
:root {
|
|
--display-family: "Geist", "sans-serif";
|
|
--display-weight: 600;
|
|
--text-family: "Alexandria", "sans-serif";
|
|
--text-weight: 300;
|
|
--base-50: oklch(0.9869 0.0042 280.57);
|
|
--base-100: oklch(0.9703 0.0084 281.74);
|
|
--base-200: oklch(0.9309 0.0168 282.31);
|
|
--base-300: oklch(0.8708 0.0252 283.4);
|
|
--base-400: oklch(0.7052 0.0378 286.14);
|
|
--base-500: oklch(0.5544 0.0504 286.81);
|
|
--base-600: oklch(0.4463 0.0483 286.39);
|
|
--base-700: oklch(0.3722 0.0441 286.47);
|
|
--base-800: oklch(0.2638 0.0399 288.01);
|
|
--base-900: oklch(0.2083 0.0347 289.9);
|
|
--base-950: oklch(0.1292 0.0315 290.68);
|
|
--base-1000: oklch(0.0781 0.0294 290.82);
|
|
--primary-50: oklch(0.9866 0.0288 120.05);
|
|
--primary-100: oklch(0.9676 0.0628 121.5);
|
|
--primary-200: oklch(0.9384 0.1189 123.4);
|
|
--primary-300: oklch(0.8719 0.1829 125.59);
|
|
--primary-400: oklch(0.8416 0.2214 127.63);
|
|
--primary-500: oklch(0.7692 0.2165 129.47);
|
|
--primary-600: oklch(0.6495 0.1859 130.24);
|
|
--primary-700: oklch(0.5331 0.1462 130.1);
|
|
--primary-800: oklch(0.4542 0.1157 129.41);
|
|
--primary-900: oklch(0.406 0.0943 129.43);
|
|
--primary-950: oklch(0.2748 0.0672 130.42);
|
|
--primary-1000: oklch(0.1896 0.0494 131.02);
|
|
--secondary-50: oklch(0.9792 0.0142 56.84);
|
|
--secondary-100: oklch(0.9531 0.0338 55.36);
|
|
--secondary-200: oklch(0.9004 0.0676 53.94);
|
|
--secondary-300: oklch(0.8362 0.114 51.61);
|
|
--secondary-400: oklch(0.7489 0.1635 49.36);
|
|
--secondary-500: oklch(0.7164 0.1906 47.14);
|
|
--secondary-600: oklch(0.6445 0.1986 44.75);
|
|
--secondary-700: oklch(0.5519 0.1744 42.09);
|
|
--secondary-800: oklch(0.4693 0.1405 40.02);
|
|
--secondary-900: oklch(0.4076 0.1102 38.89);
|
|
--secondary-950: oklch(0.2656 0.0708 38);
|
|
--secondary-1000: oklch(0.1738 0.0448 36.79);
|
|
--background: var(--base-50);
|
|
--foreground: var(--base-800);
|
|
--card: var(--color-white);
|
|
--card-foreground: var(--base-800);
|
|
--popover: var(--color-white);
|
|
--popover-foreground: var(--base-800);
|
|
--primary: var(--primary-300);
|
|
--primary-foreground: var(--color-black);
|
|
--secondary: var(--secondary-500);
|
|
--secondary-foreground: var(--color-black);
|
|
--muted: var(--base-100);
|
|
--muted-foreground: var(--base-600);
|
|
--accent: var(--base-100);
|
|
--accent-secondary: var(--base-300);
|
|
--accent-foreground: var(--base-800);
|
|
--destructive: oklch(0.577 0.245 27.325);
|
|
--border: var(--base-200);
|
|
--input: var(--base-300);
|
|
--ring: var(--primary-300);
|
|
--chart-1: var(--primary-300);
|
|
--chart-2: var(--secondary-500);
|
|
--chart-3: var(--primary-400);
|
|
--chart-4: var(--secondary-300);
|
|
--chart-5: var(--primary-300);
|
|
--radius: 0.5rem;
|
|
--sidebar: var(--color-white);
|
|
--sidebar-foreground: var(--base-800);
|
|
--sidebar-primary: var(--primary-300);
|
|
--sidebar-primary-foreground: var(--color-black);
|
|
--sidebar-accent: var(--base-50);
|
|
--sidebar-accent-foreground: var(--base-800);
|
|
--sidebar-border: var(--base-200);
|
|
--sidebar-ring: var(--primary-300);
|
|
--table-thead: var(--base-400);
|
|
--table-tbody: var(--base-200);
|
|
--table-tfoot: var(--base-400);
|
|
--table-border: var(--base-300);
|
|
--table-body-border: var(--base-500);
|
|
--table-inner-border: var(--base-300);
|
|
--display-color: var(--foreground);
|
|
--text-color: var(--foreground);
|
|
@media (prefers-color-scheme: dark) {
|
|
--background: var(--base-950);
|
|
--foreground: var(--base-200);
|
|
--card: var(--base-900);
|
|
--card-foreground: var(--base-200);
|
|
--popover: var(--base-900);
|
|
--popover-foreground: var(--base-200);
|
|
--primary: var(--primary-300);
|
|
--primary-foreground: var(--color-black);
|
|
--secondary: var(--secondary-500);
|
|
--secondary-foreground: var(--color-black);
|
|
--muted: var(--base-800);
|
|
--muted-foreground: var(--base-300);
|
|
--accent: var(--base-800);
|
|
--accent-secondary: var(--base-600);
|
|
--accent-foreground: var(--base-200);
|
|
--destructive: oklch(0.704 0.191 22.216);
|
|
--border: var(--base-800);
|
|
--input: var(--base-700);
|
|
--ring: var(--primary-300);
|
|
--chart-1: var(--primary-300);
|
|
--chart-2: var(--secondary-500);
|
|
--chart-3: var(--primary-400);
|
|
--chart-4: var(--secondary-300);
|
|
--chart-5: var(--primary-300);
|
|
--sidebar: var(--base-900);
|
|
--sidebar-foreground: var(--base-200);
|
|
--sidebar-primary: var(--primary-300);
|
|
--sidebar-primary-foreground: var(--color-black);
|
|
--sidebar-accent: var(--base-800);
|
|
--sidebar-accent-foreground: var(--base-200);
|
|
--sidebar-border: var(--base-800);
|
|
--sidebar-ring: var(--primary-300);
|
|
--table-thead: var(--base-600);
|
|
--table-tbody: var(--base-800);
|
|
--table-tfoot: var(--base-600);
|
|
--table-border: var(--base-700);
|
|
--table-body-border: var(--base-500);
|
|
--table-inner-border: var(--base-700);
|
|
}
|
|
}
|
|
@layer theme {
|
|
* {
|
|
color: var(--foreground);
|
|
}
|
|
}
|
|
.dark {
|
|
--background: var(--base-950);
|
|
--foreground: var(--base-200);
|
|
--card: var(--base-900);
|
|
--card-foreground: var(--base-200);
|
|
--popover: var(--base-900);
|
|
--popover-foreground: var(--base-200);
|
|
--primary: var(--primary-300);
|
|
--primary-foreground: var(--color-black);
|
|
--secondary: var(--secondary-500);
|
|
--secondary-foreground: var(--color-black);
|
|
--muted: var(--base-800);
|
|
--muted-foreground: var(--base-300);
|
|
--accent: var(--base-800);
|
|
--accent-secondary: var(--base-600);
|
|
--accent-foreground: var(--base-200);
|
|
--destructive: oklch(0.704 0.191 22.216);
|
|
--border: var(--base-800);
|
|
--input: var(--base-700);
|
|
--ring: var(--primary-300);
|
|
--chart-1: var(--primary-300);
|
|
--chart-2: var(--secondary-500);
|
|
--chart-3: var(--primary-400);
|
|
--chart-4: var(--secondary-300);
|
|
--chart-5: var(--primary-300);
|
|
--sidebar: var(--base-900);
|
|
--sidebar-foreground: var(--base-200);
|
|
--sidebar-primary: var(--primary-300);
|
|
--sidebar-primary-foreground: var(--color-black);
|
|
--sidebar-accent: var(--base-800);
|
|
--sidebar-accent-foreground: var(--base-200);
|
|
--sidebar-border: var(--base-800);
|
|
--sidebar-ring: var(--primary-300);
|
|
}
|
|
@layer base {
|
|
* {
|
|
font-family: var(--font-text);
|
|
font-weight: var(--text-weight);
|
|
}
|
|
h1, h2, h3, h4, h5, h6, label {
|
|
font-family: var(--font-display);
|
|
font-weight: var(--display-weight);
|
|
}
|
|
h1 {
|
|
font-size: var(--text-6xl);
|
|
}
|
|
h2 {
|
|
font-size: var(--text-3xl);
|
|
}
|
|
h3 {
|
|
font-size: var(--text-xl);
|
|
}
|
|
h4 {
|
|
font-size: var(--text-lg);
|
|
}
|
|
h5 {
|
|
font-size: var(--text-md);
|
|
}
|
|
h6 {
|
|
font-size: var(--text-sm);
|
|
}
|
|
ul, ol {
|
|
list-style: none;
|
|
}
|
|
a:hover {
|
|
text-decoration: underline;
|
|
}
|
|
.font-display {
|
|
font-family: var(--font-display);
|
|
font-weight: var(--display-weight);
|
|
}
|
|
.font-text {
|
|
font-family: var(--font-text);
|
|
font-weight: var(--text-weight);
|
|
}
|
|
}
|
|
@layer component {
|
|
header, footer {
|
|
background-color: var(--sidebar);
|
|
}
|
|
a.selected {
|
|
background-color: var(--sidebar-accent);
|
|
}
|
|
}
|
|
:root {
|
|
--border-thin: 1px;
|
|
--border-medium: 2px;
|
|
}
|
|
@layer base {
|
|
header, footer {
|
|
border-color: var(--sidebar-border);
|
|
}
|
|
header {
|
|
border-bottom-width: 1px;
|
|
}
|
|
footer {
|
|
border-top-width: 1px;
|
|
}
|
|
select {
|
|
border-width: var(--border-medium);
|
|
border-color: var(--border);
|
|
border-radius: var(--radius-lg);
|
|
}
|
|
.border-thin {
|
|
border-width: var(--border-thin);
|
|
}
|
|
.border-medium {
|
|
border-width: var(--border-medium);
|
|
}
|
|
.border-button {
|
|
border-width: var(--border-medium);
|
|
border-radius: var(--radius-lg);
|
|
}
|
|
}
|
|
@layer components {
|
|
table {
|
|
display: block;
|
|
border-collapse: collapse;
|
|
thead {
|
|
border-color: var(--table-border);
|
|
border-width: var(--border-thin) var(--border-thin) 0 var(--border-thin);
|
|
& > tr {
|
|
border-color: var(--table-body-border);
|
|
& > :is(th, td) {
|
|
border-color: var(--table-body-border);
|
|
background-color: var(--table-thead);
|
|
}
|
|
}
|
|
& + tbody {
|
|
border-top-width: var(--border-thin);
|
|
}
|
|
}
|
|
tbody {
|
|
border-color: var(--table-body-border) var(--table-border);
|
|
border-left-width: var(--border-thin);
|
|
border-right-width: var(--border-thin);
|
|
border-bottom-width: 0;
|
|
& > tr {
|
|
border-color: var(--table-border);
|
|
& > :is(th, td) {
|
|
border-color: var(--table-border);
|
|
background-color: var(--table-tbody);
|
|
}
|
|
}
|
|
&:has(+ tfoot) {
|
|
border-bottom-width: var(--border-thin);
|
|
}
|
|
}
|
|
tfoot {
|
|
border-color: var(--table-border);
|
|
border-width: 0 var(--border-thin) var(--border-thin) var(--border-thin);
|
|
& > tr {
|
|
border-color: var(--table-body-border);
|
|
& > :is(th, td) {
|
|
border-color: var(--table-body-border);
|
|
background-color: var(--table-tfoot);
|
|
}
|
|
}
|
|
}
|
|
th, td {
|
|
padding: 0.5em;
|
|
}
|
|
tr {
|
|
border-width: 0 0 var(--border-thin) 0;
|
|
&:last-child {
|
|
border: none;
|
|
}
|
|
}
|
|
th, td {
|
|
border-width: 0 var(--border-thin) 0 0;
|
|
&:last-child {
|
|
border: none;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
@property --tw-border-style {
|
|
syntax: "*";
|
|
inherits: false;
|
|
initial-value: solid;
|
|
}
|
|
@property --tw-font-weight {
|
|
syntax: "*";
|
|
inherits: false;
|
|
}
|
|
@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: "<percentage>";
|
|
inherits: false;
|
|
initial-value: 100%;
|
|
}
|
|
@property --tw-drop-shadow-size {
|
|
syntax: "*";
|
|
inherits: false;
|
|
}
|
|
@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-content {
|
|
syntax: "*";
|
|
initial-value: "";
|
|
inherits: false;
|
|
}
|
|
@property --tw-leading {
|
|
syntax: "*";
|
|
inherits: false;
|
|
}
|
|
@keyframes pulse {
|
|
50% {
|
|
opacity: 0.5;
|
|
}
|
|
}
|
|
@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-border-style: solid;
|
|
--tw-font-weight: initial;
|
|
--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-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-content: "";
|
|
--tw-leading: initial;
|
|
}
|
|
}
|
|
}
|