/* Primitive palette. Components should consume semantic tokens from themes.css. */
:root {
  --vx-white: #ffffff;
  --vx-black: #000000;
  --vx-neutral-50: #fafafa;
  --vx-neutral-100: #f5f5f5;
  --vx-neutral-200: #e5e5e5;
  --vx-neutral-400: #a3a3a3;
  --vx-neutral-500: #737373;
  --vx-neutral-600: #525252;
  --vx-neutral-900: #171717;
  --vx-red-400: #f87171;
  --vx-red-500: #ff3333;
  --vx-red-700: #b91c1c;
  --vx-slate-50: #f8fafc;
  --vx-slate-100: #f1f5f9;
  --vx-slate-200: #e2e8f0;
  --vx-slate-400: #94a3b8;
  --vx-slate-500: #64748b;
  --vx-slate-600: #475569;
  --vx-slate-800: #1e293b;
  --vx-slate-900: #0f172a;
  --vx-blue-300: #93c5fd;
  --vx-blue-700: #1d4ed8;
  --vx-green-300: #86efac;
  --vx-green-800: #166534;
  --vx-amber-300: #fcd34d;
  --vx-amber-900: #78350f;
  --vx-red-300: #fca5a5;
  --vx-red-800: #991b1b;
}

:root {
  --vx-space-0: 0;
  --vx-space-1: 0.25rem;
  --vx-space-2: 0.5rem;
  --vx-space-3: 0.75rem;
  --vx-space-4: 1rem;
  --vx-space-5: 1.25rem;
  --vx-space-6: 1.5rem;
  --vx-space-8: 2rem;
  --vx-space-10: 2.5rem;
  --vx-space-12: 3rem;
  --vx-space-16: 4rem;
}

:root {
  --vx-font-sans: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --vx-font-mono: ui-monospace, SFMono-Regular, Consolas, monospace;
  --vx-text-xs: 0.75rem;
  --vx-text-sm: 0.875rem;
  --vx-text-md: 1rem;
  --vx-text-lg: 1.125rem;
  --vx-text-xl: 1.25rem;
  --vx-text-2xl: 1.5rem;
  --vx-text-3xl: 2rem;
  --vx-text-4xl: 2.5rem;
  --vx-font-normal: 400;
  --vx-font-medium: 500;
  --vx-font-semibold: 600;
  --vx-font-bold: 700;
  --vx-leading-tight: 1.25;
  --vx-leading-normal: 1.5;
  --vx-leading-relaxed: 1.75;
}

:root {
  --vx-border-width: 1px;
  --vx-border-width-thick: 2px;
  --vx-radius-none: 0;
  --vx-radius-sm: 0;
  --vx-radius-md: 0;
  --vx-radius-lg: 0;
  --vx-radius-pill: 0;
  --vx-focus-width: 3px;
  --vx-focus-offset: 3px;
}

:root {
  --vx-shadow-none: none;
  --vx-shadow-sm: 0 1px 3px rgb(0 0 0 / 0.12);
  --vx-shadow-md: 0 4px 12px rgb(0 0 0 / 0.16);
  --vx-shadow-lg: 0 12px 32px rgb(0 0 0 / 0.2);
}

/* Light is the default. An explicit theme can also scope a subtree. */
:root, [data-vx-theme="light"] {
  color-scheme: light;
  --vx-color-bg: var(--vx-white);
  --vx-color-surface: var(--vx-white);
  --vx-color-surface-muted: var(--vx-neutral-100);
  --vx-color-text: var(--vx-black);
  --vx-color-text-muted: var(--vx-neutral-600);
  --vx-color-border: var(--vx-neutral-500);
  --vx-color-primary: var(--vx-red-700);
  --vx-color-on-primary: var(--vx-white);
  --vx-color-success: var(--vx-green-800);
  --vx-color-on-success: var(--vx-white);
  --vx-color-warning: var(--vx-amber-900);
  --vx-color-on-warning: var(--vx-white);
  --vx-color-danger: var(--vx-red-800);
  --vx-color-on-danger: var(--vx-white);
  --vx-color-focus: var(--vx-red-700);
}

[data-vx-theme="dark"] {
  color-scheme: dark;
  --vx-color-bg: var(--vx-black);
  --vx-color-surface: var(--vx-neutral-900);
  --vx-color-surface-muted: var(--vx-black);
  --vx-color-text: var(--vx-white);
  --vx-color-text-muted: var(--vx-neutral-200);
  --vx-color-border: var(--vx-neutral-400);
  --vx-color-primary: var(--vx-red-500);
  --vx-color-on-primary: var(--vx-black);
  --vx-color-success: var(--vx-green-300);
  --vx-color-on-success: var(--vx-black);
  --vx-color-warning: var(--vx-amber-300);
  --vx-color-on-warning: var(--vx-black);
  --vx-color-danger: var(--vx-red-300);
  --vx-color-on-danger: var(--vx-black);
  --vx-color-focus: var(--vx-red-500);
}

*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; }
button, input, textarea, select { font: inherit; }
button, select { text-transform: none; }
img, svg, video { vertical-align: middle; max-width: 100%; }
img, video { height: auto; }
[hidden] { display: none !important; }

html { -webkit-text-size-adjust: 100%; }
body { background: var(--vx-color-bg); color: var(--vx-color-text); font: var(--vx-text-md)/var(--vx-leading-normal) var(--vx-font-sans); }
h1, h2, h3, h4, h5, h6 { line-height: var(--vx-leading-tight); margin-block: 0 var(--vx-space-4); }
p, ul, ol, dl, figure, blockquote { margin-block: 0 var(--vx-space-4); }
ul, ol { padding-inline-start: var(--vx-space-6); }
a { color: var(--vx-color-primary); text-underline-offset: .2em; }
pre, code, kbd, samp { font-family: var(--vx-font-mono); }
pre { overflow: auto; }
button:not(:disabled), summary { cursor: pointer; }
:focus-visible { outline: var(--vx-focus-width) solid var(--vx-color-focus); outline-offset: var(--vx-focus-offset); }
:target { scroll-margin-top: var(--vx-space-8); }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; } }

.vx-container, .vx-container-fluid { width: 100%; padding-inline: var(--vx-space-4); margin-inline: auto; }
@media (min-width: 576px) { .vx-container { max-width: 540px; } }
@media (min-width: 768px) { .vx-container { max-width: 720px; } }
@media (min-width: 992px) { .vx-container { max-width: 960px; } }
@media (min-width: 1200px) { .vx-container { max-width: 1140px; } }
@media (min-width: 1400px) { .vx-container { max-width: 1320px; } }

.vx-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--vx-space-4); }
.vx-grid > * { min-width: 0; }
.vx-grid-cols-12 { grid-template-columns: repeat(12, minmax(0, 1fr)); }
.vx-col-1 { grid-column: span 1; }
.vx-col-2 { grid-column: span 2; }
.vx-col-3 { grid-column: span 3; }
.vx-col-4 { grid-column: span 4; }
.vx-col-5 { grid-column: span 5; }
.vx-col-6 { grid-column: span 6; }
.vx-col-7 { grid-column: span 7; }
.vx-col-8 { grid-column: span 8; }
.vx-col-9 { grid-column: span 9; }
.vx-col-10 { grid-column: span 10; }
.vx-col-11 { grid-column: span 11; }
.vx-col-12 { grid-column: span 12; }
@media (min-width: 576px) {
.vx-col-sm-1 { grid-column: span 1; }
.vx-col-sm-2 { grid-column: span 2; }
.vx-col-sm-3 { grid-column: span 3; }
.vx-col-sm-4 { grid-column: span 4; }
.vx-col-sm-5 { grid-column: span 5; }
.vx-col-sm-6 { grid-column: span 6; }
.vx-col-sm-7 { grid-column: span 7; }
.vx-col-sm-8 { grid-column: span 8; }
.vx-col-sm-9 { grid-column: span 9; }
.vx-col-sm-10 { grid-column: span 10; }
.vx-col-sm-11 { grid-column: span 11; }
.vx-col-sm-12 { grid-column: span 12; }
}
@media (min-width: 768px) {
.vx-col-md-1 { grid-column: span 1; }
.vx-col-md-2 { grid-column: span 2; }
.vx-col-md-3 { grid-column: span 3; }
.vx-col-md-4 { grid-column: span 4; }
.vx-col-md-5 { grid-column: span 5; }
.vx-col-md-6 { grid-column: span 6; }
.vx-col-md-7 { grid-column: span 7; }
.vx-col-md-8 { grid-column: span 8; }
.vx-col-md-9 { grid-column: span 9; }
.vx-col-md-10 { grid-column: span 10; }
.vx-col-md-11 { grid-column: span 11; }
.vx-col-md-12 { grid-column: span 12; }
}
@media (min-width: 992px) {
.vx-col-lg-1 { grid-column: span 1; }
.vx-col-lg-2 { grid-column: span 2; }
.vx-col-lg-3 { grid-column: span 3; }
.vx-col-lg-4 { grid-column: span 4; }
.vx-col-lg-5 { grid-column: span 5; }
.vx-col-lg-6 { grid-column: span 6; }
.vx-col-lg-7 { grid-column: span 7; }
.vx-col-lg-8 { grid-column: span 8; }
.vx-col-lg-9 { grid-column: span 9; }
.vx-col-lg-10 { grid-column: span 10; }
.vx-col-lg-11 { grid-column: span 11; }
.vx-col-lg-12 { grid-column: span 12; }
}
@media (min-width: 1200px) {
.vx-col-xl-1 { grid-column: span 1; }
.vx-col-xl-2 { grid-column: span 2; }
.vx-col-xl-3 { grid-column: span 3; }
.vx-col-xl-4 { grid-column: span 4; }
.vx-col-xl-5 { grid-column: span 5; }
.vx-col-xl-6 { grid-column: span 6; }
.vx-col-xl-7 { grid-column: span 7; }
.vx-col-xl-8 { grid-column: span 8; }
.vx-col-xl-9 { grid-column: span 9; }
.vx-col-xl-10 { grid-column: span 10; }
.vx-col-xl-11 { grid-column: span 11; }
.vx-col-xl-12 { grid-column: span 12; }
}
@media (min-width: 1400px) {
.vx-col-xxl-1 { grid-column: span 1; }
.vx-col-xxl-2 { grid-column: span 2; }
.vx-col-xxl-3 { grid-column: span 3; }
.vx-col-xxl-4 { grid-column: span 4; }
.vx-col-xxl-5 { grid-column: span 5; }
.vx-col-xxl-6 { grid-column: span 6; }
.vx-col-xxl-7 { grid-column: span 7; }
.vx-col-xxl-8 { grid-column: span 8; }
.vx-col-xxl-9 { grid-column: span 9; }
.vx-col-xxl-10 { grid-column: span 10; }
.vx-col-xxl-11 { grid-column: span 11; }
.vx-col-xxl-12 { grid-column: span 12; }
}

.vx-flex { display: flex; }
.vx-flex-row { flex-direction: row; }
.vx-flex-col { flex-direction: column; }
.vx-flex-wrap { flex-wrap: wrap; }
.vx-flex-nowrap { flex-wrap: nowrap; }
.vx-flex-1 { flex: 1 1 0%; min-width: 0; }
.vx-flex-none { flex: none; }
.vx-justify-start { justify-content: flex-start; }
.vx-justify-end { justify-content: flex-end; }
.vx-justify-center { justify-content: center; }
.vx-justify-between { justify-content: space-between; }
.vx-justify-around { justify-content: space-around; }
.vx-items-start { align-items: flex-start; }
.vx-items-end { align-items: flex-end; }
.vx-items-center { align-items: center; }
.vx-items-stretch { align-items: stretch; }
.vx-self-center { align-self: center; }

.vx-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--vx-space-2);
  box-sizing: border-box; min-height: 2.75rem; padding: var(--vx-space-2) var(--vx-space-4);
  border: var(--vx-border-width) solid transparent; border-radius: var(--vx-radius-md);
  font: var(--vx-font-semibold) var(--vx-text-md)/var(--vx-leading-normal) var(--vx-font-sans);
  background: var(--vx-color-primary); color: var(--vx-color-on-primary); text-decoration: none; cursor: pointer;
}
.vx-btn-primary { background: var(--vx-color-primary); color: var(--vx-color-on-primary); }
.vx-btn-secondary { background: var(--vx-color-surface-muted); color: var(--vx-color-text); border-color: var(--vx-color-border); }
.vx-btn-success { background: var(--vx-color-success); color: var(--vx-color-on-success); }
.vx-btn-danger { background: var(--vx-color-danger); color: var(--vx-color-on-danger); }
.vx-btn-outline { background: transparent; color: var(--vx-color-primary); border-color: currentColor; }
.vx-btn-ghost { background: transparent; color: var(--vx-color-primary); }
.vx-btn-sm { min-height: 2rem; padding: var(--vx-space-1) var(--vx-space-3); font-size: var(--vx-text-sm); }
.vx-btn-lg { min-height: 3.25rem; padding: var(--vx-space-3) var(--vx-space-6); font-size: var(--vx-text-lg); }
.vx-btn:where(:hover:not(:disabled):not([aria-disabled="true"])) { text-decoration: underline; text-underline-offset: .2em; }
.vx-btn:where(:active:not(:disabled):not([aria-disabled="true"])) { transform: translateY(1px); }
.vx-btn:focus-visible { outline: var(--vx-focus-width) solid var(--vx-color-focus); outline-offset: var(--vx-focus-offset); }
.vx-btn:disabled, .vx-btn[aria-disabled="true"] { opacity: .6; cursor: not-allowed; }
.vx-btn[aria-busy="true"]::before { content: ""; width: 1em; height: 1em; border: 2px solid currentColor; border-right-color: transparent; border-radius: var(--vx-radius-pill); animation: vx-spin .8s linear infinite; }
@keyframes vx-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .vx-btn[aria-busy="true"]::before { animation: none; } }
.vx-btn { transition: transform .12s ease; }

.vx-badge { display: inline-block; padding: var(--vx-space-1) var(--vx-space-2); border-radius: var(--vx-radius-pill); background: var(--vx-color-surface-muted); color: var(--vx-color-text); font: var(--vx-font-semibold) var(--vx-text-xs)/var(--vx-leading-normal) var(--vx-font-sans); }
.vx-badge-primary { background: var(--vx-color-primary); color: var(--vx-color-on-primary); }
.vx-badge-success { background: var(--vx-color-success); color: var(--vx-color-on-success); }
.vx-badge-warning { background: var(--vx-color-warning); color: var(--vx-color-on-warning); }
.vx-badge-danger { background: var(--vx-color-danger); color: var(--vx-color-on-danger); }
.vx-badge-lg { padding: var(--vx-space-2) var(--vx-space-3); font-size: var(--vx-text-sm); }

.vx-card { min-width: 0; background: var(--vx-color-surface); color: var(--vx-color-text); border: var(--vx-border-width) solid var(--vx-color-border); border-radius: var(--vx-radius-lg); }
.vx-card-header, .vx-card-body, .vx-card-footer { padding: var(--vx-space-6); }
.vx-card-header { border-bottom: var(--vx-border-width) solid var(--vx-color-border); }
.vx-card-footer { border-top: var(--vx-border-width) solid var(--vx-color-border); }
.vx-card-header > :first-child, .vx-card-body > :first-child, .vx-card-footer > :first-child { margin-top: 0; }
.vx-card-header > :last-child, .vx-card-body > :last-child, .vx-card-footer > :last-child { margin-bottom: 0; }
.vx-card-elevated { box-shadow: var(--vx-shadow-md); }
.vx-card-borderless { border-color: transparent; }
.vx-card-outlined { border-width: var(--vx-border-width-thick); }

.vx-alert { padding: var(--vx-space-4); border: var(--vx-border-width) solid currentColor; border-radius: var(--vx-radius-md); background: var(--vx-color-primary); color: var(--vx-color-on-primary); font: var(--vx-text-md)/var(--vx-leading-normal) var(--vx-font-sans); }
.vx-alert-info { background: var(--vx-color-primary); color: var(--vx-color-on-primary); }
.vx-alert-success { background: var(--vx-color-success); color: var(--vx-color-on-success); }
.vx-alert-warning { background: var(--vx-color-warning); color: var(--vx-color-on-warning); }
.vx-alert-danger { background: var(--vx-color-danger); color: var(--vx-color-on-danger); }
.vx-alert > :first-child { margin-top: 0; }
.vx-alert > :last-child { margin-bottom: 0; }

.vx-field { display: grid; gap: var(--vx-space-2); margin-bottom: var(--vx-space-4); }
.vx-label { display: block; font-weight: var(--vx-font-semibold); }
.vx-input, .vx-textarea, .vx-select { width: 100%; min-height: 2.75rem; padding: var(--vx-space-2) var(--vx-space-3); border: var(--vx-border-width) solid var(--vx-color-border); border-radius: var(--vx-radius-none); background: var(--vx-color-surface); color: var(--vx-color-text); }
.vx-input::placeholder, .vx-textarea::placeholder { color: var(--vx-color-text-muted); opacity: 1; }
.vx-textarea { min-height: 7rem; resize: vertical; }
.vx-input:hover, .vx-textarea:hover, .vx-select:hover { border-color: var(--vx-color-text); }
.vx-input:disabled, .vx-textarea:disabled, .vx-select:disabled { opacity: .6; cursor: not-allowed; }
.vx-input:read-only, .vx-textarea:read-only { background: var(--vx-color-surface-muted); }
.vx-input:user-invalid, .vx-textarea:user-invalid, .vx-select:user-invalid, .vx-input.is-invalid, .vx-textarea.is-invalid, .vx-select.is-invalid, [aria-invalid="true"].vx-input, .vx-validated :invalid { border-color: var(--vx-color-danger); border-width: var(--vx-border-width-thick); }
.vx-help { color: var(--vx-color-text-muted); font-size: var(--vx-text-sm); }
.vx-error { color: var(--vx-color-danger); font-size: var(--vx-text-sm); }
.vx-check { display: flex; align-items: center; gap: var(--vx-space-2); min-height: 2rem; }
.vx-checkbox, .vx-radio { width: 1.25rem; height: 1.25rem; margin: 0; accent-color: var(--vx-color-primary); }
.vx-switch { appearance: none; width: 2.75rem; height: 1.5rem; margin: 0; padding: 2px; border: 1px solid var(--vx-color-border); background: var(--vx-color-surface-muted); cursor: pointer; }
.vx-switch::before { content: ""; display: block; width: 1.1rem; height: 1.1rem; background: var(--vx-color-text-muted); transition: transform .15s; }
.vx-switch:checked { background: var(--vx-color-primary); border-color: var(--vx-color-primary); }
.vx-switch:checked::before { background: var(--vx-color-on-primary); transform: translateX(1.2rem); }
.vx-switch:disabled, .vx-checkbox:disabled, .vx-radio:disabled { opacity: .6; cursor: not-allowed; }
/* Square native-control skins retain input semantics and keyboard behavior. */
.vx-checkbox, .vx-radio { appearance: none; border: 1px solid var(--vx-color-border); border-radius: var(--vx-radius-none); background: var(--vx-color-surface); flex: none; }
.vx-checkbox:checked, .vx-radio:checked { background: var(--vx-color-primary); border-color: var(--vx-color-primary); box-shadow: inset 0 0 0 3px var(--vx-color-surface); }
@media (forced-colors: active) { .vx-checkbox, .vx-radio { appearance: auto; } }

.vx-table-responsive { width: 100%; overflow-x: auto; }
.vx-table { width: 100%; border-collapse: collapse; color: var(--vx-color-text); background: var(--vx-color-surface); text-align: start; }
.vx-table th, .vx-table td { padding: var(--vx-space-3) var(--vx-space-4); border-bottom: 1px solid var(--vx-color-border); text-align: inherit; }
.vx-table caption { text-align: start; padding: var(--vx-space-3); color: var(--vx-color-text-muted); }
.vx-table thead, .vx-table tfoot { background: var(--vx-color-surface-muted); }
.vx-table-striped tbody tr:nth-child(odd), .vx-table-hover tbody tr:hover { background: var(--vx-color-surface-muted); }
.vx-table-bordered th, .vx-table-bordered td { border: 1px solid var(--vx-color-border); }
.vx-table-compact th, .vx-table-compact td { padding: var(--vx-space-2); }
.vx-table [data-vx-sort] { color: inherit; background: transparent; border: 0; padding: var(--vx-space-1); font-weight: var(--vx-font-semibold); }

.vx-navbar { display: flex; flex-wrap: wrap; align-items: center; gap: var(--vx-space-4); padding: var(--vx-space-4); background: var(--vx-color-surface); border-bottom: 1px solid var(--vx-color-border); }
.vx-navbar-brand { color: var(--vx-color-text); font-weight: var(--vx-font-bold); text-decoration: none; }
.vx-navbar-links { display: flex; flex-wrap: wrap; gap: var(--vx-space-4); align-items: center; }
.vx-sidebar { min-width: 0; padding: var(--vx-space-4); background: var(--vx-color-surface); border-inline-end: 1px solid var(--vx-color-border); }
.vx-sidebar nav { display: grid; gap: var(--vx-space-2); }
.vx-sidebar a { padding: var(--vx-space-2) var(--vx-space-3); color: var(--vx-color-text); text-decoration: none; }
.vx-sidebar a:hover, .vx-sidebar a[aria-current] { background: var(--vx-color-primary); color: var(--vx-color-on-primary); }
.vx-sidebar-heading { margin-block: var(--vx-space-4) var(--vx-space-2); font-size: var(--vx-text-sm); color: var(--vx-color-text-muted); }
.vx-app-shell { display: grid; grid-template: auto minmax(0, 1fr) / 15rem minmax(0, 1fr); height: 100dvh; }
.vx-app-shell > .vx-navbar { grid-column: 1 / -1; }
.vx-app-shell > .vx-sidebar, .vx-app-main { overflow: auto; }
.vx-app-main { min-width: 0; padding: var(--vx-space-6); }
.vx-app-shell[data-vx-sidebar="closed"] { grid-template-columns: 0 minmax(0, 1fr); }
.vx-app-shell[data-vx-sidebar="closed"] > .vx-sidebar { display: none; }
.vx-breadcrumb, .vx-pagination { display: flex; flex-wrap: wrap; align-items: center; gap: var(--vx-space-2); list-style: none; padding: 0; }
.vx-breadcrumb { --vx-breadcrumb-separator: "/"; }
.vx-breadcrumb li + li::before { content: var(--vx-breadcrumb-separator); margin-inline-end: var(--vx-space-2); color: var(--vx-color-text-muted); }
.vx-pagination a, .vx-pagination button, .vx-pagination span { display: inline-flex; min-width: 2.5rem; min-height: 2.5rem; align-items: center; justify-content: center; padding: var(--vx-space-2); border: 1px solid var(--vx-color-border); color: var(--vx-color-text); background: var(--vx-color-surface); text-decoration: none; }
.vx-pagination [aria-current="page"], .vx-pagination .is-active { background: var(--vx-color-primary); color: var(--vx-color-on-primary); }
.vx-pagination [aria-disabled="true"], .vx-pagination :disabled { opacity: .6; cursor: not-allowed; }
@media (max-width: 767px) { .vx-app-shell { height: auto; min-height: 100dvh; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto auto 1fr; } .vx-app-shell > .vx-sidebar { border-inline-end: 0; border-bottom: 1px solid var(--vx-color-border); } .vx-app-shell[data-vx-sidebar="closed"] { grid-template-columns: minmax(0, 1fr); } }
.vx-app-shell > .vx-app-main { grid-column: 2; }
@media (max-width: 767px) { .vx-app-shell > .vx-app-main { grid-column: 1; } }

.vx-modal { max-width: min(36rem, calc(100% - 2rem)); max-height: calc(100dvh - 2rem); padding: 0; border: 1px solid var(--vx-color-border); border-radius: var(--vx-radius-none); background: var(--vx-color-surface); color: var(--vx-color-text); }
.vx-modal::backdrop { background: rgb(0 0 0 / .7); }
.vx-modal-header, .vx-modal-body, .vx-modal-footer { padding: var(--vx-space-6); }
.vx-modal-header { border-bottom: 1px solid var(--vx-color-border); }
.vx-modal-footer { display: flex; justify-content: flex-end; gap: var(--vx-space-3); border-top: 1px solid var(--vx-color-border); }

.vx-toast-region { position: fixed; inset-block-end: var(--vx-space-4); inset-inline-end: var(--vx-space-4); z-index: 100; display: grid; gap: var(--vx-space-3); width: min(24rem, calc(100% - 2rem)); }
.vx-toast { display: flex; align-items: start; gap: var(--vx-space-3); padding: var(--vx-space-4); border: 1px solid var(--vx-color-border); background: var(--vx-color-surface); color: var(--vx-color-text); box-shadow: var(--vx-shadow-lg); }
.vx-toast > span { flex: 1; }

.vx-dropdown { position: relative; display: inline-block; }
.vx-dropdown-menu { position: absolute; inset-block-start: 100%; inset-inline-start: 0; z-index: 10; min-width: 12rem; max-width: calc(100vw - 2rem); padding: var(--vx-space-2); border: 1px solid var(--vx-color-border); background: var(--vx-color-surface); color: var(--vx-color-text); box-shadow: var(--vx-shadow-md); }
.vx-dropdown-menu a, .vx-dropdown-menu button { display: block; width: 100%; padding: var(--vx-space-2); background: transparent; border: 0; color: var(--vx-color-text); text-align: start; text-decoration: none; }
.vx-dropdown-menu a:hover, .vx-dropdown-menu button:hover { background: var(--vx-color-surface-muted); }

.vx-tabs { display: flex; flex-wrap: wrap; gap: var(--vx-space-2); border-bottom: 1px solid var(--vx-color-border); list-style: none; padding: 0; }
.vx-tab-link { display: block; padding: var(--vx-space-3) var(--vx-space-4); border: 0; border-bottom: 3px solid transparent; background: transparent; color: var(--vx-color-text); text-decoration: none; }
.vx-tab-link.is-active, .vx-tab-link[aria-selected="true"] { border-bottom-color: var(--vx-color-primary); color: var(--vx-color-primary); }
.vx-tab-panel { padding-block: var(--vx-space-4); }

.vx-collapse { display: grid; grid-template-rows: 0fr; visibility: hidden; transition: grid-template-rows .2s ease, visibility .2s; }
.vx-collapse.is-open { grid-template-rows: 1fr; visibility: visible; }
.vx-collapse > .vx-collapse-inner { min-height: 0; overflow: hidden; }
.vx-accordion { border: 1px solid var(--vx-color-border); }
.vx-accordion-heading { margin: 0; }
.vx-accordion-heading > button { width: 100%; text-align: start; justify-content: space-between; }

.vx-tooltip-wrap { position: relative; display: inline-block; }
.vx-tooltip { position: absolute; inset-block-end: calc(100% + .5rem); inset-inline-start: 0; z-index: 20; width: max-content; max-width: min(18rem, 80vw); padding: var(--vx-space-2) var(--vx-space-3); background: var(--vx-color-text); color: var(--vx-color-bg); font-size: var(--vx-text-sm); box-shadow: var(--vx-shadow-sm); }
.vx-popover { position: absolute; inset: auto; max-width: min(24rem, calc(100vw - 2rem)); padding: var(--vx-space-4); background: var(--vx-color-surface); color: var(--vx-color-text); border: 1px solid var(--vx-color-border); box-shadow: var(--vx-shadow-md); }
.vx-combobox { position: relative; }
.vx-combobox-list { position: absolute; top: 100%; left: 0; right: 0; z-index: 10; max-height: 14rem; overflow: auto; list-style: none; margin: 0; padding: var(--vx-space-1); background: var(--vx-color-surface); border: 1px solid var(--vx-color-border); }
.vx-combobox-list [role="option"] { padding: var(--vx-space-2); cursor: pointer; }
.vx-combobox-list [aria-selected="true"] { background: var(--vx-color-primary); color: var(--vx-color-on-primary); }
.vx-range { width: 100%; accent-color: var(--vx-color-primary); }
.vx-range { appearance: none; background: transparent; height: 2rem; }
.vx-range::-webkit-slider-runnable-track { height: .5rem; background: var(--vx-color-surface-muted); border: 1px solid var(--vx-color-border); border-radius: var(--vx-radius-none); }
.vx-range::-webkit-slider-thumb { appearance: none; width: 1.5rem; height: 1.5rem; margin-top: -.55rem; background: var(--vx-color-primary); border: 1px solid var(--vx-color-border); border-radius: var(--vx-radius-none); cursor: pointer; }
.vx-range::-moz-range-track { height: .5rem; background: var(--vx-color-surface-muted); border: 1px solid var(--vx-color-border); border-radius: var(--vx-radius-none); }
.vx-range::-moz-range-thumb { width: 1.5rem; height: 1.5rem; background: var(--vx-color-primary); border: 1px solid var(--vx-color-border); border-radius: var(--vx-radius-none); cursor: pointer; }
@media (forced-colors: active) { .vx-range { appearance: auto; } }

.vx-d-none { display: none !important; }
.vx-d-block { display: block !important; }
.vx-d-inline { display: inline !important; }
.vx-d-inline-block { display: inline-block !important; }
.vx-d-flex { display: flex !important; }
.vx-d-grid { display: grid !important; }
.vx-invisible { visibility: hidden; }
.vx-visible { visibility: visible; }
.vx-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.vx-text-start { text-align: start; }
.vx-text-center { text-align: center; }
.vx-text-end { text-align: end; }
.vx-text-muted { color: var(--vx-color-text-muted); }
.vx-w-full { width: 100%; }

.vx-m-0 { margin: var(--vx-space-0); }
.vx-p-0 { padding: var(--vx-space-0); }
.vx-gap-0 { gap: var(--vx-space-0); }
.vx-mx-0 { margin-inline: var(--vx-space-0); }
.vx-my-0 { margin-block: var(--vx-space-0); }
.vx-px-0 { padding-inline: var(--vx-space-0); }
.vx-py-0 { padding-block: var(--vx-space-0); }
.vx-mt-0 { margin-top: var(--vx-space-0); }
.vx-mb-0 { margin-bottom: var(--vx-space-0); }
.vx-ms-0 { margin-inline-start: var(--vx-space-0); }
.vx-me-0 { margin-inline-end: var(--vx-space-0); }
.vx-pt-0 { padding-top: var(--vx-space-0); }
.vx-pb-0 { padding-bottom: var(--vx-space-0); }
.vx-m-1 { margin: var(--vx-space-1); }
.vx-p-1 { padding: var(--vx-space-1); }
.vx-gap-1 { gap: var(--vx-space-1); }
.vx-mx-1 { margin-inline: var(--vx-space-1); }
.vx-my-1 { margin-block: var(--vx-space-1); }
.vx-px-1 { padding-inline: var(--vx-space-1); }
.vx-py-1 { padding-block: var(--vx-space-1); }
.vx-mt-1 { margin-top: var(--vx-space-1); }
.vx-mb-1 { margin-bottom: var(--vx-space-1); }
.vx-ms-1 { margin-inline-start: var(--vx-space-1); }
.vx-me-1 { margin-inline-end: var(--vx-space-1); }
.vx-pt-1 { padding-top: var(--vx-space-1); }
.vx-pb-1 { padding-bottom: var(--vx-space-1); }
.vx-m-2 { margin: var(--vx-space-2); }
.vx-p-2 { padding: var(--vx-space-2); }
.vx-gap-2 { gap: var(--vx-space-2); }
.vx-mx-2 { margin-inline: var(--vx-space-2); }
.vx-my-2 { margin-block: var(--vx-space-2); }
.vx-px-2 { padding-inline: var(--vx-space-2); }
.vx-py-2 { padding-block: var(--vx-space-2); }
.vx-mt-2 { margin-top: var(--vx-space-2); }
.vx-mb-2 { margin-bottom: var(--vx-space-2); }
.vx-ms-2 { margin-inline-start: var(--vx-space-2); }
.vx-me-2 { margin-inline-end: var(--vx-space-2); }
.vx-pt-2 { padding-top: var(--vx-space-2); }
.vx-pb-2 { padding-bottom: var(--vx-space-2); }
.vx-m-3 { margin: var(--vx-space-3); }
.vx-p-3 { padding: var(--vx-space-3); }
.vx-gap-3 { gap: var(--vx-space-3); }
.vx-mx-3 { margin-inline: var(--vx-space-3); }
.vx-my-3 { margin-block: var(--vx-space-3); }
.vx-px-3 { padding-inline: var(--vx-space-3); }
.vx-py-3 { padding-block: var(--vx-space-3); }
.vx-mt-3 { margin-top: var(--vx-space-3); }
.vx-mb-3 { margin-bottom: var(--vx-space-3); }
.vx-ms-3 { margin-inline-start: var(--vx-space-3); }
.vx-me-3 { margin-inline-end: var(--vx-space-3); }
.vx-pt-3 { padding-top: var(--vx-space-3); }
.vx-pb-3 { padding-bottom: var(--vx-space-3); }
.vx-m-4 { margin: var(--vx-space-4); }
.vx-p-4 { padding: var(--vx-space-4); }
.vx-gap-4 { gap: var(--vx-space-4); }
.vx-mx-4 { margin-inline: var(--vx-space-4); }
.vx-my-4 { margin-block: var(--vx-space-4); }
.vx-px-4 { padding-inline: var(--vx-space-4); }
.vx-py-4 { padding-block: var(--vx-space-4); }
.vx-mt-4 { margin-top: var(--vx-space-4); }
.vx-mb-4 { margin-bottom: var(--vx-space-4); }
.vx-ms-4 { margin-inline-start: var(--vx-space-4); }
.vx-me-4 { margin-inline-end: var(--vx-space-4); }
.vx-pt-4 { padding-top: var(--vx-space-4); }
.vx-pb-4 { padding-bottom: var(--vx-space-4); }
.vx-m-5 { margin: var(--vx-space-5); }
.vx-p-5 { padding: var(--vx-space-5); }
.vx-gap-5 { gap: var(--vx-space-5); }
.vx-mx-5 { margin-inline: var(--vx-space-5); }
.vx-my-5 { margin-block: var(--vx-space-5); }
.vx-px-5 { padding-inline: var(--vx-space-5); }
.vx-py-5 { padding-block: var(--vx-space-5); }
.vx-mt-5 { margin-top: var(--vx-space-5); }
.vx-mb-5 { margin-bottom: var(--vx-space-5); }
.vx-ms-5 { margin-inline-start: var(--vx-space-5); }
.vx-me-5 { margin-inline-end: var(--vx-space-5); }
.vx-pt-5 { padding-top: var(--vx-space-5); }
.vx-pb-5 { padding-bottom: var(--vx-space-5); }
.vx-m-6 { margin: var(--vx-space-6); }
.vx-p-6 { padding: var(--vx-space-6); }
.vx-gap-6 { gap: var(--vx-space-6); }
.vx-mx-6 { margin-inline: var(--vx-space-6); }
.vx-my-6 { margin-block: var(--vx-space-6); }
.vx-px-6 { padding-inline: var(--vx-space-6); }
.vx-py-6 { padding-block: var(--vx-space-6); }
.vx-mt-6 { margin-top: var(--vx-space-6); }
.vx-mb-6 { margin-bottom: var(--vx-space-6); }
.vx-ms-6 { margin-inline-start: var(--vx-space-6); }
.vx-me-6 { margin-inline-end: var(--vx-space-6); }
.vx-pt-6 { padding-top: var(--vx-space-6); }
.vx-pb-6 { padding-bottom: var(--vx-space-6); }
.vx-m-8 { margin: var(--vx-space-8); }
.vx-p-8 { padding: var(--vx-space-8); }
.vx-gap-8 { gap: var(--vx-space-8); }
.vx-mx-8 { margin-inline: var(--vx-space-8); }
.vx-my-8 { margin-block: var(--vx-space-8); }
.vx-px-8 { padding-inline: var(--vx-space-8); }
.vx-py-8 { padding-block: var(--vx-space-8); }
.vx-mt-8 { margin-top: var(--vx-space-8); }
.vx-mb-8 { margin-bottom: var(--vx-space-8); }
.vx-ms-8 { margin-inline-start: var(--vx-space-8); }
.vx-me-8 { margin-inline-end: var(--vx-space-8); }
.vx-pt-8 { padding-top: var(--vx-space-8); }
.vx-pb-8 { padding-bottom: var(--vx-space-8); }
.vx-m-10 { margin: var(--vx-space-10); }
.vx-p-10 { padding: var(--vx-space-10); }
.vx-gap-10 { gap: var(--vx-space-10); }
.vx-mx-10 { margin-inline: var(--vx-space-10); }
.vx-my-10 { margin-block: var(--vx-space-10); }
.vx-px-10 { padding-inline: var(--vx-space-10); }
.vx-py-10 { padding-block: var(--vx-space-10); }
.vx-mt-10 { margin-top: var(--vx-space-10); }
.vx-mb-10 { margin-bottom: var(--vx-space-10); }
.vx-ms-10 { margin-inline-start: var(--vx-space-10); }
.vx-me-10 { margin-inline-end: var(--vx-space-10); }
.vx-pt-10 { padding-top: var(--vx-space-10); }
.vx-pb-10 { padding-bottom: var(--vx-space-10); }
.vx-m-12 { margin: var(--vx-space-12); }
.vx-p-12 { padding: var(--vx-space-12); }
.vx-gap-12 { gap: var(--vx-space-12); }
.vx-mx-12 { margin-inline: var(--vx-space-12); }
.vx-my-12 { margin-block: var(--vx-space-12); }
.vx-px-12 { padding-inline: var(--vx-space-12); }
.vx-py-12 { padding-block: var(--vx-space-12); }
.vx-mt-12 { margin-top: var(--vx-space-12); }
.vx-mb-12 { margin-bottom: var(--vx-space-12); }
.vx-ms-12 { margin-inline-start: var(--vx-space-12); }
.vx-me-12 { margin-inline-end: var(--vx-space-12); }
.vx-pt-12 { padding-top: var(--vx-space-12); }
.vx-pb-12 { padding-bottom: var(--vx-space-12); }
.vx-m-16 { margin: var(--vx-space-16); }
.vx-p-16 { padding: var(--vx-space-16); }
.vx-gap-16 { gap: var(--vx-space-16); }
.vx-mx-16 { margin-inline: var(--vx-space-16); }
.vx-my-16 { margin-block: var(--vx-space-16); }
.vx-px-16 { padding-inline: var(--vx-space-16); }
.vx-py-16 { padding-block: var(--vx-space-16); }
.vx-mt-16 { margin-top: var(--vx-space-16); }
.vx-mb-16 { margin-bottom: var(--vx-space-16); }
.vx-ms-16 { margin-inline-start: var(--vx-space-16); }
.vx-me-16 { margin-inline-end: var(--vx-space-16); }
.vx-pt-16 { padding-top: var(--vx-space-16); }
.vx-pb-16 { padding-bottom: var(--vx-space-16); }
.vx-m-auto { margin: auto; }
.vx-mx-auto { margin-inline: auto; }
.vx-ms-auto { margin-inline-start: auto; }

@media (min-width: 576px) {
.vx-d-sm-none { display: none !important; }
.vx-d-sm-block { display: block !important; }
.vx-d-sm-inline { display: inline !important; }
.vx-d-sm-inline-block { display: inline-block !important; }
.vx-d-sm-flex { display: flex !important; }
.vx-d-sm-grid { display: grid !important; }
.vx-p-sm-0 { padding: var(--vx-space-0); }
.vx-m-sm-0 { margin: var(--vx-space-0); }
.vx-gap-sm-0 { gap: var(--vx-space-0); }
.vx-p-sm-1 { padding: var(--vx-space-1); }
.vx-m-sm-1 { margin: var(--vx-space-1); }
.vx-gap-sm-1 { gap: var(--vx-space-1); }
.vx-p-sm-2 { padding: var(--vx-space-2); }
.vx-m-sm-2 { margin: var(--vx-space-2); }
.vx-gap-sm-2 { gap: var(--vx-space-2); }
.vx-p-sm-3 { padding: var(--vx-space-3); }
.vx-m-sm-3 { margin: var(--vx-space-3); }
.vx-gap-sm-3 { gap: var(--vx-space-3); }
.vx-p-sm-4 { padding: var(--vx-space-4); }
.vx-m-sm-4 { margin: var(--vx-space-4); }
.vx-gap-sm-4 { gap: var(--vx-space-4); }
.vx-p-sm-5 { padding: var(--vx-space-5); }
.vx-m-sm-5 { margin: var(--vx-space-5); }
.vx-gap-sm-5 { gap: var(--vx-space-5); }
.vx-p-sm-6 { padding: var(--vx-space-6); }
.vx-m-sm-6 { margin: var(--vx-space-6); }
.vx-gap-sm-6 { gap: var(--vx-space-6); }
.vx-p-sm-8 { padding: var(--vx-space-8); }
.vx-m-sm-8 { margin: var(--vx-space-8); }
.vx-gap-sm-8 { gap: var(--vx-space-8); }
.vx-p-sm-10 { padding: var(--vx-space-10); }
.vx-m-sm-10 { margin: var(--vx-space-10); }
.vx-gap-sm-10 { gap: var(--vx-space-10); }
.vx-p-sm-12 { padding: var(--vx-space-12); }
.vx-m-sm-12 { margin: var(--vx-space-12); }
.vx-gap-sm-12 { gap: var(--vx-space-12); }
.vx-p-sm-16 { padding: var(--vx-space-16); }
.vx-m-sm-16 { margin: var(--vx-space-16); }
.vx-gap-sm-16 { gap: var(--vx-space-16); }
.vx-flex-sm-row { flex-direction: row; }
.vx-flex-sm-col { flex-direction: column; }
}
@media (min-width: 768px) {
.vx-d-md-none { display: none !important; }
.vx-d-md-block { display: block !important; }
.vx-d-md-inline { display: inline !important; }
.vx-d-md-inline-block { display: inline-block !important; }
.vx-d-md-flex { display: flex !important; }
.vx-d-md-grid { display: grid !important; }
.vx-p-md-0 { padding: var(--vx-space-0); }
.vx-m-md-0 { margin: var(--vx-space-0); }
.vx-gap-md-0 { gap: var(--vx-space-0); }
.vx-p-md-1 { padding: var(--vx-space-1); }
.vx-m-md-1 { margin: var(--vx-space-1); }
.vx-gap-md-1 { gap: var(--vx-space-1); }
.vx-p-md-2 { padding: var(--vx-space-2); }
.vx-m-md-2 { margin: var(--vx-space-2); }
.vx-gap-md-2 { gap: var(--vx-space-2); }
.vx-p-md-3 { padding: var(--vx-space-3); }
.vx-m-md-3 { margin: var(--vx-space-3); }
.vx-gap-md-3 { gap: var(--vx-space-3); }
.vx-p-md-4 { padding: var(--vx-space-4); }
.vx-m-md-4 { margin: var(--vx-space-4); }
.vx-gap-md-4 { gap: var(--vx-space-4); }
.vx-p-md-5 { padding: var(--vx-space-5); }
.vx-m-md-5 { margin: var(--vx-space-5); }
.vx-gap-md-5 { gap: var(--vx-space-5); }
.vx-p-md-6 { padding: var(--vx-space-6); }
.vx-m-md-6 { margin: var(--vx-space-6); }
.vx-gap-md-6 { gap: var(--vx-space-6); }
.vx-p-md-8 { padding: var(--vx-space-8); }
.vx-m-md-8 { margin: var(--vx-space-8); }
.vx-gap-md-8 { gap: var(--vx-space-8); }
.vx-p-md-10 { padding: var(--vx-space-10); }
.vx-m-md-10 { margin: var(--vx-space-10); }
.vx-gap-md-10 { gap: var(--vx-space-10); }
.vx-p-md-12 { padding: var(--vx-space-12); }
.vx-m-md-12 { margin: var(--vx-space-12); }
.vx-gap-md-12 { gap: var(--vx-space-12); }
.vx-p-md-16 { padding: var(--vx-space-16); }
.vx-m-md-16 { margin: var(--vx-space-16); }
.vx-gap-md-16 { gap: var(--vx-space-16); }
.vx-flex-md-row { flex-direction: row; }
.vx-flex-md-col { flex-direction: column; }
}
@media (min-width: 992px) {
.vx-d-lg-none { display: none !important; }
.vx-d-lg-block { display: block !important; }
.vx-d-lg-inline { display: inline !important; }
.vx-d-lg-inline-block { display: inline-block !important; }
.vx-d-lg-flex { display: flex !important; }
.vx-d-lg-grid { display: grid !important; }
.vx-p-lg-0 { padding: var(--vx-space-0); }
.vx-m-lg-0 { margin: var(--vx-space-0); }
.vx-gap-lg-0 { gap: var(--vx-space-0); }
.vx-p-lg-1 { padding: var(--vx-space-1); }
.vx-m-lg-1 { margin: var(--vx-space-1); }
.vx-gap-lg-1 { gap: var(--vx-space-1); }
.vx-p-lg-2 { padding: var(--vx-space-2); }
.vx-m-lg-2 { margin: var(--vx-space-2); }
.vx-gap-lg-2 { gap: var(--vx-space-2); }
.vx-p-lg-3 { padding: var(--vx-space-3); }
.vx-m-lg-3 { margin: var(--vx-space-3); }
.vx-gap-lg-3 { gap: var(--vx-space-3); }
.vx-p-lg-4 { padding: var(--vx-space-4); }
.vx-m-lg-4 { margin: var(--vx-space-4); }
.vx-gap-lg-4 { gap: var(--vx-space-4); }
.vx-p-lg-5 { padding: var(--vx-space-5); }
.vx-m-lg-5 { margin: var(--vx-space-5); }
.vx-gap-lg-5 { gap: var(--vx-space-5); }
.vx-p-lg-6 { padding: var(--vx-space-6); }
.vx-m-lg-6 { margin: var(--vx-space-6); }
.vx-gap-lg-6 { gap: var(--vx-space-6); }
.vx-p-lg-8 { padding: var(--vx-space-8); }
.vx-m-lg-8 { margin: var(--vx-space-8); }
.vx-gap-lg-8 { gap: var(--vx-space-8); }
.vx-p-lg-10 { padding: var(--vx-space-10); }
.vx-m-lg-10 { margin: var(--vx-space-10); }
.vx-gap-lg-10 { gap: var(--vx-space-10); }
.vx-p-lg-12 { padding: var(--vx-space-12); }
.vx-m-lg-12 { margin: var(--vx-space-12); }
.vx-gap-lg-12 { gap: var(--vx-space-12); }
.vx-p-lg-16 { padding: var(--vx-space-16); }
.vx-m-lg-16 { margin: var(--vx-space-16); }
.vx-gap-lg-16 { gap: var(--vx-space-16); }
.vx-flex-lg-row { flex-direction: row; }
.vx-flex-lg-col { flex-direction: column; }
}
@media (min-width: 1200px) {
.vx-d-xl-none { display: none !important; }
.vx-d-xl-block { display: block !important; }
.vx-d-xl-inline { display: inline !important; }
.vx-d-xl-inline-block { display: inline-block !important; }
.vx-d-xl-flex { display: flex !important; }
.vx-d-xl-grid { display: grid !important; }
.vx-p-xl-0 { padding: var(--vx-space-0); }
.vx-m-xl-0 { margin: var(--vx-space-0); }
.vx-gap-xl-0 { gap: var(--vx-space-0); }
.vx-p-xl-1 { padding: var(--vx-space-1); }
.vx-m-xl-1 { margin: var(--vx-space-1); }
.vx-gap-xl-1 { gap: var(--vx-space-1); }
.vx-p-xl-2 { padding: var(--vx-space-2); }
.vx-m-xl-2 { margin: var(--vx-space-2); }
.vx-gap-xl-2 { gap: var(--vx-space-2); }
.vx-p-xl-3 { padding: var(--vx-space-3); }
.vx-m-xl-3 { margin: var(--vx-space-3); }
.vx-gap-xl-3 { gap: var(--vx-space-3); }
.vx-p-xl-4 { padding: var(--vx-space-4); }
.vx-m-xl-4 { margin: var(--vx-space-4); }
.vx-gap-xl-4 { gap: var(--vx-space-4); }
.vx-p-xl-5 { padding: var(--vx-space-5); }
.vx-m-xl-5 { margin: var(--vx-space-5); }
.vx-gap-xl-5 { gap: var(--vx-space-5); }
.vx-p-xl-6 { padding: var(--vx-space-6); }
.vx-m-xl-6 { margin: var(--vx-space-6); }
.vx-gap-xl-6 { gap: var(--vx-space-6); }
.vx-p-xl-8 { padding: var(--vx-space-8); }
.vx-m-xl-8 { margin: var(--vx-space-8); }
.vx-gap-xl-8 { gap: var(--vx-space-8); }
.vx-p-xl-10 { padding: var(--vx-space-10); }
.vx-m-xl-10 { margin: var(--vx-space-10); }
.vx-gap-xl-10 { gap: var(--vx-space-10); }
.vx-p-xl-12 { padding: var(--vx-space-12); }
.vx-m-xl-12 { margin: var(--vx-space-12); }
.vx-gap-xl-12 { gap: var(--vx-space-12); }
.vx-p-xl-16 { padding: var(--vx-space-16); }
.vx-m-xl-16 { margin: var(--vx-space-16); }
.vx-gap-xl-16 { gap: var(--vx-space-16); }
.vx-flex-xl-row { flex-direction: row; }
.vx-flex-xl-col { flex-direction: column; }
}
@media (min-width: 1400px) {
.vx-d-xxl-none { display: none !important; }
.vx-d-xxl-block { display: block !important; }
.vx-d-xxl-inline { display: inline !important; }
.vx-d-xxl-inline-block { display: inline-block !important; }
.vx-d-xxl-flex { display: flex !important; }
.vx-d-xxl-grid { display: grid !important; }
.vx-p-xxl-0 { padding: var(--vx-space-0); }
.vx-m-xxl-0 { margin: var(--vx-space-0); }
.vx-gap-xxl-0 { gap: var(--vx-space-0); }
.vx-p-xxl-1 { padding: var(--vx-space-1); }
.vx-m-xxl-1 { margin: var(--vx-space-1); }
.vx-gap-xxl-1 { gap: var(--vx-space-1); }
.vx-p-xxl-2 { padding: var(--vx-space-2); }
.vx-m-xxl-2 { margin: var(--vx-space-2); }
.vx-gap-xxl-2 { gap: var(--vx-space-2); }
.vx-p-xxl-3 { padding: var(--vx-space-3); }
.vx-m-xxl-3 { margin: var(--vx-space-3); }
.vx-gap-xxl-3 { gap: var(--vx-space-3); }
.vx-p-xxl-4 { padding: var(--vx-space-4); }
.vx-m-xxl-4 { margin: var(--vx-space-4); }
.vx-gap-xxl-4 { gap: var(--vx-space-4); }
.vx-p-xxl-5 { padding: var(--vx-space-5); }
.vx-m-xxl-5 { margin: var(--vx-space-5); }
.vx-gap-xxl-5 { gap: var(--vx-space-5); }
.vx-p-xxl-6 { padding: var(--vx-space-6); }
.vx-m-xxl-6 { margin: var(--vx-space-6); }
.vx-gap-xxl-6 { gap: var(--vx-space-6); }
.vx-p-xxl-8 { padding: var(--vx-space-8); }
.vx-m-xxl-8 { margin: var(--vx-space-8); }
.vx-gap-xxl-8 { gap: var(--vx-space-8); }
.vx-p-xxl-10 { padding: var(--vx-space-10); }
.vx-m-xxl-10 { margin: var(--vx-space-10); }
.vx-gap-xxl-10 { gap: var(--vx-space-10); }
.vx-p-xxl-12 { padding: var(--vx-space-12); }
.vx-m-xxl-12 { margin: var(--vx-space-12); }
.vx-gap-xxl-12 { gap: var(--vx-space-12); }
.vx-p-xxl-16 { padding: var(--vx-space-16); }
.vx-m-xxl-16 { margin: var(--vx-space-16); }
.vx-gap-xxl-16 { gap: var(--vx-space-16); }
.vx-flex-xxl-row { flex-direction: row; }
.vx-flex-xxl-col { flex-direction: column; }
}

