vrembem 4.0.0-next.12 → 4.0.0-next.14

package/dev/{components.css → base.css}

@@ -671,72 +671,6 @@ input::-moz-placeholder {
   --vb-button-line-height: var(--vb-line-height-lg);
 }
 
-:root {
-  --vb-button-size: var(--vb-form-control-size);
-  --vb-button-padding: calc(0.5em - 1px) 1em;
-  --vb-button-gap: 0.5rem;
-  --vb-button-border-width: 1px;
-  --vb-button-border-radius: var(--vb-border-radius);
-  --vb-button-font-size: 1em;
-  --vb-button-font-weight: inherit;
-  --vb-button-line-height: 1.6;
-  --vb-button-disabled-opacity: 0.6;
-  --vb-button-transition-property: background, color, border-color, box-shadow;
-  --vb-button-transition-duration: var(--vb-transition-duration);
-  --vb-button-transition-timing-function: var(--vb-transition-timing-function);
-  --vb-button-loading-size: 1em;
-  --vb-button-loading-border: 2px solid;
-  --vb-button-loading-animation-duration: 0.6s;
-  --vb-button-loading-animation-timing-function: linear;
-}
-
-:root, .vb-theme-root, .vb-theme-light {
-  --vb-button-background: transparent;
-  --vb-button-background-hover: transparent;
-  --vb-button-background-focus: transparent;
-  --vb-button-foreground: var(--vb-foreground);
-  --vb-button-foreground-hover: var(--vb-foreground);
-  --vb-button-foreground-focus: var(--vb-foreground);
-  --vb-button-border-color: var(--vb-border-color-dark);
-  --vb-button-border-color-hover: var(--vb-border-color-darker);
-  --vb-button-border-color-focus: var(--vb-border-color-darker);
-  --vb-button-loading-border-color: var(--vb-foreground);
-  --vb-button-box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
-  --vb-button-box-shadow-focus: 0 0 0 0.2rem rgba(0, 0, 0, 0.15);
-}
-
-@media (prefers-color-scheme: dark) {
-  :root, .vb-theme-root {
-    --vb-button-background: transparent;
-    --vb-button-background-hover: transparent;
-    --vb-button-background-focus: transparent;
-    --vb-button-foreground: var(--vb-foreground);
-    --vb-button-foreground-hover: var(--vb-foreground);
-    --vb-button-foreground-focus: var(--vb-foreground);
-    --vb-button-border-color: var(--vb-border-color-dark);
-    --vb-button-border-color-hover: var(--vb-border-color-darker);
-    --vb-button-border-color-focus: var(--vb-border-color-darker);
-    --vb-button-loading-border-color: var(--vb-foreground);
-    --vb-button-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
-    --vb-button-box-shadow-focus: 0 0 0 0.2rem rgba(255, 255, 255, 0.15);
-  }
-}
-
-.vb-theme-dark {
-  --vb-button-background: transparent;
-  --vb-button-background-hover: transparent;
-  --vb-button-background-focus: transparent;
-  --vb-button-foreground: var(--vb-foreground);
-  --vb-button-foreground-hover: var(--vb-foreground);
-  --vb-button-foreground-focus: var(--vb-foreground);
-  --vb-button-border-color: var(--vb-border-color-dark);
-  --vb-button-border-color-hover: var(--vb-border-color-darker);
-  --vb-button-border-color-focus: var(--vb-border-color-darker);
-  --vb-button-loading-border-color: var(--vb-foreground);
-  --vb-button-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
-  --vb-button-box-shadow-focus: 0 0 0 0.2rem rgba(255, 255, 255, 0.15);
-}
-
 .card {
   position: relative;
   display: flex;
@@ -842,53 +776,6 @@ a.card:hover, a.card:focus, a.card:focus-within {
   opacity: var(--vb-card-screen-opacity);
 }
 
-:root {
-  --vb-card-padding: 1.25em;
-  --vb-card-border-radius: var(--vb-border-radius);
-  --vb-card-box-shadow: var(--vb-box-shadow-1);
-  --vb-card-link-box-shadow: var(--vb-box-shadow-2);
-  --vb-card-link-box-shadow-hover: var(--vb-box-shadow-3);
-  --vb-card-link-offset: -0.25em;
-  --vb-card-title-font-size: var(--vb-font-size-lg);
-  --vb-card-title-line-height: var(--vb-line-height-lg);
-  --vb-card-title-font-weight: var(--vb-font-weight-semi-bold);
-  --vb-card-transition-property: background-color, border-color, box-shadow, transform;
-  --vb-card-transition-duration: var(--vb-transition-duration);
-  --vb-card-transition-timing-function: var(--vb-transition-timing-function);
-}
-
-:root, .vb-theme-root, .vb-theme-light {
-  --vb-card-background: var(--vb-background);
-  --vb-card-foreground: var(--vb-foreground-light);
-  --vb-card-border: 1px solid var(--vb-border-color);
-  --vb-card-sep-border: 1px solid var(--vb-border-color);
-  --vb-card-title-color: var(--vb-foreground);
-  --vb-card-screen-background: var(--vb-background);
-  --vb-card-screen-opacity: 0.9;
-}
-
-@media (prefers-color-scheme: dark) {
-  :root, .vb-theme-root {
-    --vb-card-background: var(--vb-background-darker);
-    --vb-card-foreground: var(--vb-foreground-light);
-    --vb-card-border: 1px solid var(--vb-border-color);
-    --vb-card-sep-border: 1px solid var(--vb-border-color);
-    --vb-card-title-color: var(--vb-foreground);
-    --vb-card-screen-background: var(--vb-background-darker);
-    --vb-card-screen-opacity: 0.8;
-  }
-}
-
-.vb-theme-dark {
-  --vb-card-background: var(--vb-background-darker);
-  --vb-card-foreground: var(--vb-foreground-light);
-  --vb-card-border: 1px solid var(--vb-border-color);
-  --vb-card-sep-border: 1px solid var(--vb-border-color);
-  --vb-card-title-color: var(--vb-foreground);
-  --vb-card-screen-background: var(--vb-background-darker);
-  --vb-card-screen-opacity: 0.8;
-}
-
 .checkbox {
   position: relative;
   display: inline-flex;
@@ -907,7 +794,7 @@ a.card:hover, a.card:focus, a.card:focus-within {
   align-items: center;
   justify-content: center;
   border-radius: var(--vb-checkbox-background-border-radius);
-  background-color: hsl(from var(--vb-checkbox-color) h s l/var(--vb-checkbox-background-opacity));
+  background-color: hsl(from var(--vb-checkbox-background-color) h s l/var(--vb-checkbox-background-opacity));
 }
 
 .checkbox__box {
@@ -944,21 +831,21 @@ a.card:hover, a.card:focus, a.card:focus-within {
   cursor: pointer;
 }
 .checkbox__native:hover + .checkbox__background {
-  background-color: hsl(from var(--vb-checkbox-color) h s l/var(--vb-checkbox-background-opacity-hover));
+  background-color: hsl(from var(--vb-checkbox-background-color) h s l/var(--vb-checkbox-background-opacity-hover));
 }
 .checkbox__native:hover + .checkbox__background .checkbox__box {
   border-color: var(--vb-checkbox-color);
   background-color: var(--vb-checkbox-fill);
 }
 .checkbox__native:focus + .checkbox__background {
-  background-color: hsl(from var(--vb-checkbox-color) h s l/var(--vb-checkbox-background-opacity-focus));
+  background-color: hsl(from var(--vb-checkbox-background-color) h s l/var(--vb-checkbox-background-opacity-focus));
 }
 .checkbox__native:focus + .checkbox__background .checkbox__box {
   border-color: var(--vb-checkbox-color);
   background-color: var(--vb-checkbox-fill);
 }
 .checkbox__native:focus-visible + .checkbox__background, .checkbox__native:active + .checkbox__background {
-  background-color: hsl(from var(--vb-checkbox-color) h s l/var(--vb-checkbox-background-opacity-active));
+  background-color: hsl(from var(--vb-checkbox-background-color) h s l/var(--vb-checkbox-background-opacity-active));
 }
 .checkbox__native:focus-visible + .checkbox__background .checkbox__box, .checkbox__native:active + .checkbox__background .checkbox__box {
   border-color: var(--vb-checkbox-color);
@@ -1017,43 +904,6 @@ a.card:hover, a.card:focus, a.card:focus-within {
   mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12px" height="12px" fill="none" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="2" y1="6" x2="10" y2="6" /></svg>');
 }
 
-:root {
-  --vb-checkbox-size: var(--vb-form-control-size);
-  --vb-checkbox-box-size: 18px;
-  --vb-checkbox-icon-size: 12px;
-  --vb-checkbox-icon-stroke: 2.5;
-  --vb-checkbox-color: var(--vb-primary-50);
-  --vb-checkbox-border-width: 2px;
-  --vb-checkbox-border-radius: var(--vb-border-radius);
-  --vb-checkbox-background-border-radius: var(--vb-border-radius-circle);
-  --vb-checkbox-background-opacity: 0%;
-  --vb-checkbox-background-opacity-hover: 20%;
-  --vb-checkbox-background-opacity-focus: 20%;
-  --vb-checkbox-background-opacity-active: 30%;
-  --vb-checkbox-transition-duration: var(--vb-transition-duration-short);
-  --vb-checkbox-transition-timing-function: var(--vb-transition-timing-function);
-}
-
-:root, .vb-theme-root, .vb-theme-light {
-  --vb-checkbox-fill: white;
-  --vb-checkbox-border-color: var(--vb-neutral-50);
-  --vb-checkbox-icon-color: white;
-}
-
-@media (prefers-color-scheme: dark) {
-  :root, .vb-theme-root {
-    --vb-checkbox-fill: var(--vb-neutral-10);
-    --vb-checkbox-border-color: var(--vb-neutral-80);
-    --vb-checkbox-icon-color: var(--vb-neutral-10);
-  }
-}
-
-.vb-theme-dark {
-  --vb-checkbox-fill: var(--vb-neutral-10);
-  --vb-checkbox-border-color: var(--vb-neutral-80);
-  --vb-checkbox-icon-color: var(--vb-neutral-10);
-}
-
 .dialog {
   position: relative;
   display: flex;
@@ -1110,39 +960,6 @@ a.card:hover, a.card:focus, a.card:focus-within {
   line-height: var(--vb-dialog-title-line-height);
 }
 
-:root {
-  --vb-dialog-padding: 1em;
-  --vb-dialog-gap: 0.5em;
-  --vb-dialog-border-radius: var(--vb-border-radius);
-  --vb-dialog-box-shadow: var(--vb-box-shadow-4);
-  --vb-dialog-title-font-size: var(--vb-font-size-lg);
-  --vb-dialog-title-line-height: var(--vb-line-height-lg);
-  --vb-dialog-title-font-weight: var(--vb-font-weight-semi-bold);
-}
-
-:root, .vb-theme-root, .vb-theme-light {
-  --vb-dialog-foreground: var(--vb-foreground);
-  --vb-dialog-background: var(--vb-background);
-  --vb-dialog-border: 1px solid var(--vb-border-color);
-  --vb-dialog-sep-border: 1px solid var(--vb-border-color);
-}
-
-@media (prefers-color-scheme: dark) {
-  :root, .vb-theme-root {
-    --vb-dialog-foreground: var(--vb-foreground);
-    --vb-dialog-background: var(--vb-background);
-    --vb-dialog-border: 1px solid var(--vb-border-color);
-    --vb-dialog-sep-border: 1px solid var(--vb-border-color);
-  }
-}
-
-.vb-theme-dark {
-  --vb-dialog-foreground: var(--vb-foreground);
-  --vb-dialog-background: var(--vb-background);
-  --vb-dialog-border: 1px solid var(--vb-border-color);
-  --vb-dialog-sep-border: 1px solid var(--vb-border-color);
-}
-
 /**
  * Required structure styles
  */
@@ -1373,11 +1190,6 @@ a.card:hover, a.card:focus, a.card:focus-within {
   transform: translateX(100%);
 }
 
-:root {
-  --vb-drawer-transition-duration: var(--vb-transition-duration);
-  --vb-drawer-transition-timing-function: var(--vb-transition-timing-function);
-}
-
 .flex {
   display: flex;
   gap: var(--vb-flex-gap-y, var(--vb-flex-gap)) var(--vb-flex-gap-x, var(--vb-flex-gap));
@@ -2180,11 +1992,6 @@ a.card:hover, a.card:focus, a.card:focus-within {
   flex-basis: 100%;
 }
 
-:root {
-  --vb-flex-gap: 1em;
-  --vb-flex-wrap: wrap;
-}
-
 .grid {
   display: grid;
   grid-auto-flow: var(--vb-grid-flow);
@@ -3673,13 +3480,6 @@ a.card:hover, a.card:focus, a.card:focus-within {
     grid-row-end: 7;
   }
 }
-:root {
-  --vb-grid-cols: 1;
-  --vb-grid-rows: 1;
-  --vb-grid-flow: dense;
-  --vb-grid-gap: 2em;
-}
-
 .icon {
   stroke: var(--vb-icon-color);
   stroke-width: var(--vb-icon-stroke-width);
@@ -3731,12 +3531,6 @@ a.card:hover, a.card:focus, a.card:focus-within {
   fill: var(--vb-icon-color);
 }
 
-:root {
-  --vb-icon-size: 1.5em;
-  --vb-icon-stroke-width: 2;
-  --vb-icon-color: currentcolor;
-}
-
 .input {
   position: relative;
   display: block;
@@ -3845,57 +3639,6 @@ a.card:hover, a.card:focus, a.card:focus-within {
   min-height: var(--vb-input-size);
 }
 
-:root {
-  --vb-input-size: var(--vb-form-control-size);
-  --vb-input-padding: calc(0.5em - 1px);
-  --vb-input-background-readonly: var(--vb-background-dark);
-  --vb-input-background-disabled: var(--vb-background-darker);
-  --vb-input-border-width: 1px;
-  --vb-input-border-radius: var(--vb-border-radius);
-  --vb-input-box-shadow: hsl(var(--vb-primary-hs) 50% / 0%);
-  --vb-input-box-shadow-focus: hsl(var(--vb-primary-hs) 50% / 50%);
-  --vb-input-box-shadow-inset: rgba(0, 0, 0, 0.1);
-  --vb-input-box-shadow-inset-focus: rgba(0, 0, 0, 0);
-  --vb-input-font-size: var(--vb-font-size);
-  --vb-input-line-height: var(--vb-line-height);
-  --vb-input-outline: none;
-  --vb-input-transition-property: box-shadow, outline, outline-offset;
-  --vb-input-transition-duration: 0.15s;
-  --vb-input-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
-}
-
-:root, .vb-theme-root, .vb-theme-light {
-  --vb-input-background: var(--vb-background);
-  --vb-input-foreground: var(--vb-foreground);
-  --vb-input-foreground-placeholder: var(--vb-foreground-lighter);
-  --vb-input-border-color: var(--vb-border-color-dark);
-  --vb-input-border-color-hover: var(--vb-border-color-darker);
-  --vb-input-border-color-focus: var(--vb-primary-50);
-  --vb-input-select-icon: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="22" height="12" fill="black"><polyline points="0 8 3.5 12 7 8"></polyline><polyline points="0 4 3.5 0 7 4"></polyline></svg>');
-}
-
-@media (prefers-color-scheme: dark) {
-  :root, .vb-theme-root {
-    --vb-input-background: var(--vb-background);
-    --vb-input-foreground: var(--vb-foreground);
-    --vb-input-foreground-placeholder: var(--vb-foreground-lighter);
-    --vb-input-border-color: var(--vb-border-color-dark);
-    --vb-input-border-color-hover: var(--vb-border-color-darker);
-    --vb-input-border-color-focus: var(--vb-primary-60);
-    --vb-input-select-icon: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="22" height="12" fill="white"><polyline points="0 8 3.5 12 7 8"></polyline><polyline points="0 4 3.5 0 7 4"></polyline></svg>');
-  }
-}
-
-.vb-theme-dark {
-  --vb-input-background: var(--vb-background);
-  --vb-input-foreground: var(--vb-foreground);
-  --vb-input-foreground-placeholder: var(--vb-foreground-lighter);
-  --vb-input-border-color: var(--vb-border-color-dark);
-  --vb-input-border-color-hover: var(--vb-border-color-darker);
-  --vb-input-border-color-focus: var(--vb-primary-60);
-  --vb-input-select-icon: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="22" height="12" fill="white"><polyline points="0 8 3.5 12 7 8"></polyline><polyline points="0 4 3.5 0 7 4"></polyline></svg>');
-}
-
 .menu {
   display: flex;
   gap: var(--vb-menu-gap);
@@ -3995,49 +3738,6 @@ a.card:hover, a.card:focus, a.card:focus-within {
   --vb-menu-line-height: var(--vb-line-height-lg);
 }
 
-:root {
-  --vb-menu-size: var(--vb-form-control-size);
-  --vb-menu-padding: var(--vb-form-control-padding);
-  --vb-menu-padding-x: 0.5em;
-  --vb-menu-gap: 1px;
-  --vb-menu-border-width: 1px;
-  --vb-menu-border-radius: var(--vb-border-radius);
-  --vb-menu-outline-focus: 2px solid var(--vb-focus-visible);
-  --vb-menu-font-size: var(--vb-font-size);
-  --vb-menu-line-height: var(--vb-line-height);
-  --vb-menu-action-gap: 0.5em;
-  --vb-menu-sep-size: 1px;
-  --vb-menu-sep-gap: 0.5em;
-  --vb-menu-sep-background: var(--vb-border-color);
-  --vb-menu-active-background: none;
-  --vb-menu-active-foreground: var(--vb-primary-50);
-  --vb-menu-disabled-background: none;
-  --vb-menu-disabled-foreground: var(--vb-foreground-lighter);
-}
-
-:root, .vb-theme-root, .vb-theme-light {
-  --vb-menu-background: none;
-  --vb-menu-background-hover: var(--vb-background-hover);
-  --vb-menu-background-active: var(--vb-background-active);
-  --vb-menu-foreground: var(--vb-foreground);
-}
-
-@media (prefers-color-scheme: dark) {
-  :root, .vb-theme-root {
-    --vb-menu-background: none;
-    --vb-menu-background-hover: var(--vb-background-hover);
-    --vb-menu-background-active: var(--vb-background-active);
-    --vb-menu-foreground: var(--vb-foreground);
-  }
-}
-
-.vb-theme-dark {
-  --vb-menu-background: none;
-  --vb-menu-background-hover: var(--vb-background-hover);
-  --vb-menu-background-active: var(--vb-background-active);
-  --vb-menu-foreground: var(--vb-foreground);
-}
-
 .modal {
   position: fixed;
   z-index: 1000;
@@ -4194,11 +3894,6 @@ a.card:hover, a.card:focus, a.card:focus-within {
   width: 60em;
 }
 
-:root {
-  --vb-modal-transition-duration: var(--vb-transition-duration);
-  --vb-modal-transition-timing-function: var(--vb-transition-timing-function);
-}
-
 .notice {
   padding: var(--vb-notice-padding);
   border: var(--vb-notice-border);
@@ -4237,32 +3932,6 @@ a.card:hover, a.card:focus, a.card:focus-within {
   --vb-notice-foreground: var(--vb-important-30);
 }
 
-:root {
-  --vb-notice-gap: 0.5em;
-  --vb-notice-padding: 1em;
-  --vb-notice-border-radius: var(--vb-border-radius);
-  --vb-notice-title-font-size: var(--vb-font-size-lg);
-  --vb-notice-title-line-height: var(--vb-line-height-lg);
-  --vb-notice-title-font-weight: var(--vb-font-weight-semi-bold);
-}
-
-:root, .vb-theme-root, .vb-theme-light {
-  --vb-notice-background: var(--vb-neutral-95);
-  --vb-notice-foreground: var(--vb-neutral-20);
-}
-
-@media (prefers-color-scheme: dark) {
-  :root, .vb-theme-root {
-    --vb-notice-background: var(--vb-neutral-20);
-    --vb-notice-foreground: var(--vb-neutral-95);
-  }
-}
-
-.vb-theme-dark {
-  --vb-notice-background: var(--vb-neutral-20);
-  --vb-notice-foreground: var(--vb-neutral-95);
-}
-
 .popover {
   position: absolute;
   z-index: 10;
@@ -4403,13 +4072,6 @@ a.card:hover, a.card:focus, a.card:focus-within {
   color: var(--vb-background);
 }
 
-:root {
-  --vb-popover-offset: 8;
-  --vb-popover-overflow-padding: 10;
-  --vb-popover-flip-padding: 10;
-  --vb-popover-arrow-padding: 10;
-}
-
 .radio {
   position: relative;
   display: inline-flex;
@@ -4428,7 +4090,7 @@ a.card:hover, a.card:focus, a.card:focus-within {
   align-items: center;
   justify-content: center;
   border-radius: var(--vb-radio-background-border-radius);
-  background-color: hsl(from var(--vb-radio-color) h s l/var(--vb-radio-background-opacity));
+  background-color: hsl(from var(--vb-radio-background-color) h s l/var(--vb-radio-background-opacity));
 }
 
 .radio__circle {
@@ -4462,21 +4124,21 @@ a.card:hover, a.card:focus, a.card:focus-within {
   cursor: pointer;
 }
 .radio__native:hover + .radio__background {
-  background-color: hsl(from var(--vb-radio-color) h s l/var(--vb-radio-background-opacity-hover));
+  background-color: hsl(from var(--vb-radio-background-color) h s l/var(--vb-radio-background-opacity-hover));
 }
 .radio__native:hover + .radio__background .radio__circle {
   border-color: var(--vb-radio-color);
   background-color: var(--vb-radio-fill);
 }
 .radio__native:focus + .radio__background {
-  background-color: hsl(from var(--vb-radio-color) h s l/var(--vb-radio-background-opacity-focus));
+  background-color: hsl(from var(--vb-radio-background-color) h s l/var(--vb-radio-background-opacity-focus));
 }
 .radio__native:focus + .radio__background .radio__circle {
   border-color: var(--vb-radio-color);
   background-color: var(--vb-radio-fill);
 }
 .radio__native:focus-visible + .radio__background, .radio__native:active + .radio__background {
-  background-color: hsl(from var(--vb-radio-color) h s l/var(--vb-radio-background-opacity-active));
+  background-color: hsl(from var(--vb-radio-background-color) h s l/var(--vb-radio-background-opacity-active));
 }
 .radio__native:focus-visible + .radio__background .radio__circle, .radio__native:active + .radio__background .radio__circle {
   border-color: var(--vb-radio-color);
@@ -4510,41 +4172,6 @@ a.card:hover, a.card:focus, a.card:focus-within {
   --vb-radio-dot-size: 10px;
 }
 
-:root {
-  --vb-radio-size: var(--vb-form-control-size);
-  --vb-radio-circle-size: 20px;
-  --vb-radio-dot-size: 8px;
-  --vb-radio-color: var(--vb-primary-50);
-  --vb-radio-border-width: 2px;
-  --vb-radio-background-border-radius: var(--vb-border-radius-circle);
-  --vb-radio-background-opacity: 0%;
-  --vb-radio-background-opacity-hover: 20%;
-  --vb-radio-background-opacity-focus: 20%;
-  --vb-radio-background-opacity-active: 30%;
-  --vb-radio-transition-duration: var(--vb-transition-duration-short);
-  --vb-radio-transition-timing-function: var(--vb-transition-timing-function);
-}
-
-:root, .vb-theme-root, .vb-theme-light {
-  --vb-radio-fill: white;
-  --vb-radio-border-color: var(--vb-neutral-50);
-  --vb-radio-dot-color: white;
-}
-
-@media (prefers-color-scheme: dark) {
-  :root, .vb-theme-root {
-    --vb-radio-fill: var(--vb-neutral-10);
-    --vb-radio-border-color: var(--vb-neutral-80);
-    --vb-radio-dot-color: var(--vb-neutral-10);
-  }
-}
-
-.vb-theme-dark {
-  --vb-radio-fill: var(--vb-neutral-10);
-  --vb-radio-border-color: var(--vb-neutral-80);
-  --vb-radio-dot-color: var(--vb-neutral-10);
-}
-
 .section {
   position: relative;
   display: flex;
@@ -4633,45 +4260,6 @@ a.card:hover, a.card:focus, a.card:focus-within {
   }
 }
 
-:root {
-  --vb-section-max-width: 70rem;
-  --vb-section-image-opacity: 1;
-  --vb-section-padding: 1.5em;
-}
-@media (min-width: 760px) {
-  :root {
-    --vb-section-padding: 2em 1.5em;
-  }
-}
-@media (min-width: 990px) {
-  :root {
-    --vb-section-padding: 3em 1.5em;
-  }
-}
-
-:root, .vb-theme-root, .vb-theme-light {
-  --vb-section-background: transparent;
-  --vb-section-foreground: var(--vb-foreground);
-  --vb-section-screen-background: var(--vb-background);
-  --vb-section-screen-opacity: 0.8;
-}
-
-@media (prefers-color-scheme: dark) {
-  :root, .vb-theme-root {
-    --vb-section-background: transparent;
-    --vb-section-foreground: var(--vb-foreground);
-    --vb-section-screen-background: var(--vb-background);
-    --vb-section-screen-opacity: 0.7;
-  }
-}
-
-.vb-theme-dark {
-  --vb-section-background: transparent;
-  --vb-section-foreground: var(--vb-foreground);
-  --vb-section-screen-background: var(--vb-background);
-  --vb-section-screen-opacity: 0.7;
-}
-
 .switch {
   position: relative;
   display: inline-flex;
@@ -4701,7 +4289,7 @@ a.card:hover, a.card:focus, a.card:focus-within {
   left: calc(var(--vb-switch-size) * 0.25 * -1);
   transition: left var(--vb-switch-transition-duration) var(--vb-switch-transition-timing-function);
   border-radius: var(--vb-switch-background-border-radius);
-  background-color: hsl(from var(--vb-switch-color) h s l/var(--vb-switch-background-opacity));
+  background-color: hsl(from var(--vb-switch-background-color) h s l/var(--vb-switch-background-opacity));
 }
 
 .switch__track {
@@ -4739,7 +4327,7 @@ a.card:hover, a.card:focus, a.card:focus-within {
   cursor: pointer;
 }
 .switch__native:hover + .switch__background::after {
-  background-color: hsl(from var(--vb-switch-color) h s l/var(--vb-switch-background-opacity-hover));
+  background-color: hsl(from var(--vb-switch-background-color) h s l/var(--vb-switch-background-opacity-hover));
 }
 .switch__native:hover + .switch__background .switch__track {
   border-color: var(--vb-switch-border-color);
@@ -4749,7 +4337,7 @@ a.card:hover, a.card:focus, a.card:focus-within {
   box-shadow: 0 0 0 var(--vb-switch-border-width) var(--vb-switch-color);
 }
 .switch__native:focus + .switch__background::after {
-  background-color: hsl(from var(--vb-switch-color) h s l/var(--vb-switch-background-opacity-focus));
+  background-color: hsl(from var(--vb-switch-background-color) h s l/var(--vb-switch-background-opacity-focus));
 }
 .switch__native:focus + .switch__background .switch__track {
   border-color: var(--vb-switch-border-color);
@@ -4759,7 +4347,7 @@ a.card:hover, a.card:focus, a.card:focus-within {
   box-shadow: 0 0 0 var(--vb-switch-border-width) var(--vb-switch-color);
 }
 .switch__native:focus-visible + .switch__background::after, .switch__native:active + .switch__background::after {
-  background-color: hsl(from var(--vb-switch-color) h s l/var(--vb-switch-background-opacity-active));
+  background-color: hsl(from var(--vb-switch-background-color) h s l/var(--vb-switch-background-opacity-active));
 }
 .switch__native:focus-visible + .switch__background .switch__track, .switch__native:active + .switch__background .switch__track {
   border-color: var(--vb-switch-border-color);
@@ -4792,41 +4380,6 @@ a.card:hover, a.card:focus, a.card:focus-within {
   --vb-switch-track-size: 26px;
 }
 
-:root {
-  --vb-switch-size: var(--vb-form-control-size);
-  --vb-switch-track-size: 20px;
-  --vb-switch-color: var(--vb-primary-50);
-  --vb-switch-border-width: 2px;
-  --vb-switch-border-radius: var(--vb-border-radius-circle);
-  --vb-switch-background-border-radius: var(--vb-border-radius-circle);
-  --vb-switch-background-opacity: 0%;
-  --vb-switch-background-opacity-hover: 20%;
-  --vb-switch-background-opacity-focus: 20%;
-  --vb-switch-background-opacity-active: 30%;
-  --vb-switch-transition-duration: var(--vb-transition-duration-short);
-  --vb-switch-transition-timing-function: var(--vb-transition-timing-function);
-}
-
-:root, .vb-theme-root, .vb-theme-light {
-  --vb-switch-thumb-fill: white;
-  --vb-switch-track-fill: hsl(var(--vb-neutral-hs) 50% / 20%);
-  --vb-switch-border-color: var(--vb-neutral-50);
-}
-
-@media (prefers-color-scheme: dark) {
-  :root, .vb-theme-root {
-    --vb-switch-thumb-fill: var(--vb-neutral-10);
-    --vb-switch-track-fill: hsl(var(--vb-neutral-hs) 50% / 20%);
-    --vb-switch-border-color: var(--vb-neutral-80);
-  }
-}
-
-.vb-theme-dark {
-  --vb-switch-thumb-fill: var(--vb-neutral-10);
-  --vb-switch-track-fill: hsl(var(--vb-neutral-hs) 50% / 20%);
-  --vb-switch-border-color: var(--vb-neutral-80);
-}
-
 .table {
   width: 100%;
   background-color: var(--vb-table-background);
@@ -5222,41 +4775,6 @@ a.card:hover, a.card:focus, a.card:focus-within {
   background-color: var(--vb-table-background-zebra);
 }
 
-:root {
-  --vb-table-padding: 0.5em 0.75em;
-  --vb-table-mobile-label-width: 8em;
-  --vb-table-mobile-label-spacing: 0.75em;
-}
-
-:root, .vb-theme-root, .vb-theme-light {
-  --vb-table-background: var(--vb-background);
-  --vb-table-background-zebra: hsl(var(--vb-neutral-hs) 50% / 6%);
-  --vb-table-background-hover: hsl(var(--vb-primary-hs) 50% / 20%);
-  --vb-table-border: 1px solid var(--vb-border-color);
-  --vb-table-border-alt: 1px dotted var(--vb-border-color);
-  --vb-table-foreground: var(--vb-foreground);
-}
-
-@media (prefers-color-scheme: dark) {
-  :root, .vb-theme-root {
-    --vb-table-background: var(--vb-background);
-    --vb-table-background-zebra: hsl(var(--vb-neutral-hs) 50% / 10%);
-    --vb-table-background-hover: hsl(var(--vb-primary-hs) 50% / 20%);
-    --vb-table-border: 1px solid var(--vb-border-color-dark);
-    --vb-table-border-alt: 1px dotted var(--vb-border-color-dark);
-    --vb-table-foreground: var(--vb-foreground);
-  }
-}
-
-.vb-theme-dark {
-  --vb-table-background: var(--vb-background);
-  --vb-table-background-zebra: hsl(var(--vb-neutral-hs) 50% / 10%);
-  --vb-table-background-hover: hsl(var(--vb-primary-hs) 50% / 20%);
-  --vb-table-border: 1px solid var(--vb-border-color-dark);
-  --vb-table-border-alt: 1px dotted var(--vb-border-color-dark);
-  --vb-table-foreground: var(--vb-foreground);
-}
-
 .background-clip-border {
   background-clip: border-box !important;
 }
@@ -7566,4 +7084,4 @@ a.card:hover, a.card:focus, a.card:focus-within {
   white-space: nowrap !important;
 }
 
-/*# sourceMappingURL=components.css.map */
+/*# sourceMappingURL=base.css.map */