@wwtdev/bsds-css 1.15.11 → 1.15.13

package/dist/wwt-bsds.css

@@ -863,7 +863,7 @@ h6,
   padding-block-end: var(--bs-space-f-2);
 }
 /* Accordion Group */
-:where(.bs-accordion[data-stacked]) + .bs-accordion:where([data-stacked]) {
+:where(.bs-accordion[data-stacked]:not([data-stacked="false"])) + .bs-accordion:where([data-stacked]:not([data-stacked="false"])) {
   border-block-start-color: transparent;
 }
 .bs-badge {
@@ -933,7 +933,7 @@ h6,
   padding-right: 1.25rem;
   padding-top: 1rem;
 }
-.bs-banner:where([data-dismissed]) {
+.bs-banner:where([data-dismissed]:not([data-dismissed="false"])) {
   display: none;
 }
 .bs-banner :where(.bs-banner-content) {
@@ -1029,21 +1029,21 @@ h6,
   box-shadow: none;
 }
 /* Ghost Buttons */
-.bs-button:where([data-ghost]) {
+.bs-button:where([data-ghost]:not([data-ghost="false"])) {
   --btn-light: var(--bs-blue-10);
   --btn-secondary: var(--bs-blue-10);
   background-color: transparent;
   box-shadow: inset 0 0 0 1px var(--btn-main);
   color: var(--btn-main);
 }
-.bs-button:where([data-ghost])::before {
+.bs-button:where([data-ghost]:not([data-ghost="false"]))::before {
   border-radius: 0.4375rem;
 }
-.bs-button:where([data-ghost]):hover,
-.bs-button:where([data-ghost]):focus {
+.bs-button:where([data-ghost]:not([data-ghost="false"])):hover,
+.bs-button:where([data-ghost]:not([data-ghost="false"])):focus {
   background-color: var(--btn-light);
 }
-.bs-button:where([data-ghost]):active {
+.bs-button:where([data-ghost]:not([data-ghost="false"])):active {
   box-shadow:
     inset 0 0 0 1px var(--btn-main),
     inset 0px 0px 4px 1px var(--btn-highlight);
@@ -1080,7 +1080,7 @@ h6,
   --btn-highlight: var(--bs-red-100);
 }
 /* Text Button */
-.bs-button:where([data-text]) {
+.bs-button:where([data-text]:not([data-text="false"])) {
   --btn-padding: 0 0;
   --btn-focus-pseudo-width: calc(100% + 1.25rem); /* text btns don't have side padding, but we do want focus outline to look padded */
   background-color: transparent;
@@ -1090,41 +1090,41 @@ h6,
   font-weight: 400;
   line-height: 150%;
 }
-.bs-button:where([data-text]):hover {
+.bs-button:where([data-text]:not([data-text="false"])):hover {
   color: var(--bs-blue-base);
   background-color: transparent;
   text-decoration: underline;
 }
-.bs-button:where([data-text]):has(svg):hover {
+.bs-button:where([data-text]:not([data-text="false"])):has(svg):hover {
   text-decoration: none;
 }
-.bs-button:where([data-text]):active {
+.bs-button:where([data-text]:not([data-text="false"])):active {
   box-shadow: none;
 }
 /* Button Size */
 .bs-button:where([data-size^='sm']) {
   font-size: var(--bs-text-sm);
 }
-.bs-button:where([data-text][data-size^='sm']) {
+.bs-button:where([data-size^='sm']):where([data-text]:not([data-text="false"])) {
   font-size: var(--bs-text-base);
 }
 /* Disabled Styling */
 :where(button:disabled),
 .bs-button:where(:disabled),
-.bs-button:where([aria-disabled='true']) /* for links as buttons */ {
+.bs-button:where([aria-disabled="true"]) /* for links as buttons */ {
   pointer-events: none;
 }
 .bs-button:where(:disabled),
-.bs-button:where([aria-disabled='true']) {
+.bs-button:where([aria-disabled="true"]) {
   color: var(--bs-gray-400);
   background-color: var(--bs-gray-200);
 }
-.bs-button:where([data-ghost]):disabled,
-.bs-button:where([data-ghost])[aria-disabled='true'] {
+.bs-button:where([data-ghost]:not([data-ghost="false"])):disabled,
+.bs-button:where([data-ghost]:not([data-ghost="false"]))[aria-disabled="true"] {
   box-shadow: inset 0 0 0 1px var(--bs-gray-400);
 }
-.bs-button:where([data-text]):disabled,
-.bs-button:where([data-text][aria-disabled='true']) {
+.bs-button:where([data-text]:where([data-text])):disabled,
+.bs-button:where([data-text]:where([data-text]))[aria-disabled="true"] {
   background-color: transparent;
 }
 /* Icon Height */
@@ -1207,7 +1207,7 @@ a.bs-circle-button {
   --btn-text-size: var(--bs-text-sm);
 }
 /* Icon Buttons with Text */
-.bs-circle-button:where([data-text]) {
+.bs-circle-button:where([data-text]:not([data-text="false"])) {
   --btn-border-radius: 0.5rem;
 }
 /* Ghost Buttons */
@@ -1310,11 +1310,11 @@ a.bs-circle-button {
   margin-left: -0.75rem;
   width: calc(100% + 1.5rem);
 }
-.bs-dropdown:where([data-search]) :where(.bs-dropdown-options) {
+.bs-dropdown:where([data-search]:not([data-search="false"])) :where(.bs-dropdown-options) {
   --options-height-max: 11.5rem;
 }
 /* data-shown */
-.bs-dropdown:where([data-shown]) {
+.bs-dropdown:where([data-shown]:not([data-shown="false"])) {
   opacity: 1;
   transform: translateY(0);
   z-index: 999;
@@ -1357,18 +1357,18 @@ a.bs-circle-button {
   }
 
   /* data-shown */
-  .bs-dropdown:where([data-shown]) {
+  .bs-dropdown:where([data-shown]:not([data-shown="false"])) {
     opacity: 1;
   }
 
   /* data-top */
-  .bs-dropdown:where([data-top]) {
+  .bs-dropdown:where([data-top]:not([data-top="false"])) {
     --dropdown-wscreen-bottom: calc(100% + 0.5rem);
     --dropdown-wscreen-top: auto;
   }
 
   /* data-justify="center" */
-  .bs-dropdown-parent:where([data-center]) :where(.bs-dropdown) {
+  .bs-dropdown-parent:where([data-center]:not([data-center="false"])) :where(.bs-dropdown) {
     --dropdown-wscreen-left: 50%;
     transform: translateX(-50%);
   }
@@ -1376,7 +1376,7 @@ a.bs-circle-button {
   .bs-dropdown :where(.bs-dropdown-options) {
     --options-height-max: 20rem;
   }
-  .bs-dropdown:where([data-search]) :where(.bs-dropdown-options) {
+  .bs-dropdown:where([data-search]:not([data-search="false"])) :where(.bs-dropdown-options) {
     --options-height-max: 17.25rem;
   }
 }
@@ -1512,18 +1512,24 @@ a.bs-circle-button {
   line-height: var(--bs-leading-base);
   width: 100%;
 }
-:where([data-required]) {
+:where([data-required]:not([data-required="false"])) {
   color: var(--bs-ink-red);
 }
-:where(label[data-disabled], [data-disabled] [data-required], [data-disabled] label) {
+:where(label[data-disabled]:not([data-disabled="false"])) {
+  --label-color: var(--bs-ink-disabled);
+}
+:where([data-disabled]:not([data-disabled="false"]) [data-required]:not([data-required="false"])) {
+  --label-color: var(--bs-ink-disabled);
+}
+:where([data-disabled]:not([data-disabled="false"])) label {
   --label-color: var(--bs-ink-disabled);
 }
 /* Generally applicable (all input types) */
-:where([data-required]) {
+:where([data-required]:not([data-required="false"])) {
   color: var(--bs-ink-red);
   font-weight: var(--bs-font-bold, 600);
 }
-:where([data-disabled], [data-disabled] [data-required]) {
+:where([data-disabled]:not([data-disabled="false"]), [data-disabled]:not([data-disabled="false"]) [data-required]:not([data-required="false"])) {
   color: var(--bs-gray-400);
 }
 :where(.box) :is(input, textarea, select):where(:focus-visible) {
@@ -1533,7 +1539,7 @@ a.bs-circle-button {
   --offset-color: var(--bs-bg-invert-base);
 }
 /* Errors and Messages */
-:is(input, select, textarea):where([data-error]) {
+:is(input, select, textarea):where([data-error]:not([data-error="false"])) {
   --input-border: var(--bs-ink-red);
 }
 /* Fieldset */
@@ -1605,7 +1611,7 @@ textarea {
   color: var(--bs-ink-disabled);
 }
 /* Errors and Messages */
-:is(input, select, textarea):where([data-error]) {
+:is(input, select, textarea):where([data-error]:not([data-error="false"])) {
   --input-border: var(--bs-ink-red);
 }
 /*
@@ -1764,8 +1770,9 @@ and issues with box-sizing
   --focus-border: var(--bs-blue-base);
 }
 .bs-input-addon:where(:not([data-multifocus]):focus-within),
-.bs-input-addon:where([data-multifocus]) :where(input, select):where(:focus, :focus-within, :focus-visible),
-.bs-input-addon:where([data-multifocus]) :is(bs-input, bs-select) :where(input, select):where(:focus, :focus-within, :focus-visible) {
+.bs-input-addon:where([data-multifocus="false"]:focus-within),
+.bs-input-addon:where([data-multifocus]:not([data-multifocus="false"])) :where(input, select):where(:focus, :focus-within, :focus-visible),
+.bs-input-addon:where([data-multifocus]:not([data-multifocus="false"])) :is(bs-input, bs-select) :where(input, select):where(:focus, :focus-within, :focus-visible) {
   --input-border: var(--focus-border);
   position: relative;
   z-index: 1;
@@ -1777,13 +1784,14 @@ and issues with box-sizing
 .bs-input-addon :where(.bs-input-addon:focus-within)::after {
   z-index: 1;
 }
-.bs-input-addon:where([data-multifocus]) > :where(:not(.bs-input-addon)) > :where(input:focus, select:focus),
-.bs-input-addon:where([data-multifocus]) > :is(bs-input, bs-select) :where(input:focus, select:focus),
-.bs-input-addon:where([data-multifocus]) > :where(input:focus, select:focus) {
+.bs-input-addon:where([data-multifocus]:not([data-multifocus="false"])) > :where(:not(.bs-input-addon)) > :where(input:focus, select:focus),
+.bs-input-addon:where([data-multifocus]:not([data-multifocus="false"])) > :is(bs-input, bs-select) :where(input:focus, select:focus),
+.bs-input-addon:where([data-multifocus]:not([data-multifocus="false"])) > :where(input:focus, select:focus) {
   border-radius: .25rem;
   box-shadow: var(--focus-border) 0px 0px 0px 1px inset;
 }
-.bs-input-addon:where(:not([data-multifocus]):focus-within)::after {
+.bs-input-addon:where(:not([data-multifocus]):focus-within)::after,
+.bs-input-addon:where([data-multifocus="false"]:focus-within)::after {
   border-width: 1px;
   border-radius: .25rem;
 }
@@ -1792,7 +1800,7 @@ and issues with box-sizing
   border-color: transparent;
 }
 /* Straight-lined ::before border to fill the gap below the rounded ::after border */
-.bs-input-addon:where([data-multifocus]) :where(:focus-within)::before {
+.bs-input-addon:where([data-multifocus]:not([data-multifocus="false"])) :where(:focus-within)::before {
   border-bottom-width: 1px;
   border-color: var(--bs-violet-300);
   border-radius: 0;
@@ -1810,13 +1818,13 @@ and issues with box-sizing
   pointer-events: none;
 }
 /* -------- Error styles -------- */
-.bs-input-addon:where([data-error]),
-.bs-input-addon:where([data-error]) :where(.bs-input-addon) {
+.bs-input-addon:where([data-error]:not([data-error="false"])),
+.bs-input-addon:where([data-error]:not([data-error="false"])) :where(.bs-input-addon) {
   --focus-border: var(--bs-red-400);
   --input-border: var(--bs-red-400);
 }
-.bs-input-addon:where([data-error],[data-disabled]) > *::before,
-.bs-input-addon:where(.bs-input-addon[data-error] .bs-input-addon, .bs-input-addon[data-disabled] .bs-input-addon) > *::before {
+.bs-input-addon:where([data-error]:not([data-error="false"]),[data-disabled]:not([data-disabled="false"])) > *::before,
+.bs-input-addon:where(.bs-input-addon[data-error]:not([data-error="false"]) .bs-input-addon, .bs-input-addon[data-disabled]:not([data-disabled="false"]) .bs-input-addon) > *::before {
   border-color: var(--input-border);
 }
 /* -------- Label margin -------- */
@@ -2005,7 +2013,7 @@ input:where([type='radio']):checked:disabled::before {
   --radio-fill-color: var(--bs-bg-disabled);
 }
 /* Error state */
-input:where([type='checkbox'], [type='radio'])[data-error] {
+input:where([type='checkbox'], [type='radio'])[data-error]:where(:not([data-error="false"])) {
   --box-shadow: var(--bs-red-base);
   --outline-color: var(--bs-red-base);
 }
@@ -2133,7 +2141,7 @@ input:where([type='checkbox'], [type='radio'])[data-error] {
   --offset-color: var(--bs-bg-invert-base);
 }
 /* Disabled state */
-.bs-switch:where([data-disabled]) {
+.bs-switch:where([data-disabled]:not([data-disabled="false"])) {
   --ball-background: var(--bs-ink-disabled);
   --switch-background: var(--bs-bg-disabled);
 }
@@ -2150,7 +2158,7 @@ input:where([type='checkbox'], [type='radio'])[data-error] {
   list-style: none;
   overflow-wrap: break-word;
 }
-.bs-hint:where([data-error]) {
+.bs-hint:where([data-error]:not([data-error="false"])) {
   --hint-color: var(--bs-ink-red);
 }
 .bs-modal {
@@ -2171,7 +2179,7 @@ input:where([type='checkbox'], [type='radio'])[data-error] {
   transition-timing-function: ease-in-out;
   z-index: 9999;
 }
-.bs-modal:where([data-shown]) {
+.bs-modal:where([data-shown]:not([data-shown="false"])) {
   opacity: 1;
 }
 @media (min-width: 752px) {
@@ -2198,7 +2206,7 @@ input:where([type='checkbox'], [type='radio'])[data-error] {
   transition-timing-function: ease-in-out;
   z-index: 9998;
 }
-.bs-overlay:where([data-shown]) {
+.bs-overlay:where([data-shown]:not([data-shown="false"])) {
   opacity: 1;
 }
 .bs-pagination {
@@ -2234,11 +2242,11 @@ input:where([type='checkbox'], [type='radio'])[data-error] {
 .bs-pagination button:where(:disabled) {
   color: var(--bs-ink-disabled);
 }
-.bs-pagination button:where([data-selected]) {
+.bs-pagination button:where([data-selected]:not([data-selected="false"])) {
   background-color: var(--bs-blue-base);
   color: var(--bs-gray-50);
 }
-.bs-pagination:where([data-fixed]) {
+.bs-pagination:where([data-fixed]:not([data-fixed="false"])) {
   background-color: var(--bs-bg-base-elevated);
   bottom: 0;
   left: 0;
@@ -2403,7 +2411,7 @@ input:where([type='checkbox'], [type='radio'])[data-error] {
   --pill-border: var(--bs-royal-200);
 }
 /* ------------------------------ Background Colors ------------------------------ */
-:where(.box, [class*="bg-"]:not([class~="bg-white"])) .bs-pill:where(:not([data-variant^="live"], [data-active])) {
+:where(.box, [class*="bg-"]:not([class~="bg-white"])) .bs-pill:where(:not([data-variant^="live"], [data-active]:not([data-active="false"]))) {
   --pill-background: var(--bs-bg-base);
 }
 :where(.box[data-invert]) .bs-pill {
@@ -2488,24 +2496,24 @@ input:where([type='checkbox'], [type='radio'])[data-error] {
   content: url("data:image/svg+xml,%3Csvg width='8' height='8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 .703 7.297 0 4 3.297.703 0 0 .703 3.297 4 0 7.297.703 8 4 4.703 7.297 8 8 7.297 4.703 4 8 .703Z' fill='%23F15355'/%3E%3C/svg%3E%0A");
 }
 /* ----- Filter Active Styles ----- */
-.bs-pill:where([data-variant^="filter"][data-active]) {
+.bs-pill:where([data-variant^="filter"][data-active]:not([data-active="false"])) {
   --pill-background: var(--bs-blue-base);
   --pill-border: transparent;
   --pill-text: var(--bs-white);
 }
-.bs-pill:where([data-variant^="filter"][data-active]):is(:hover, :focus)  {
+.bs-pill:where([data-variant^="filter"][data-active]:not([data-active="false"])):is(:hover, :focus)  {
   --pill-border: transparent;
 }
-:is(a, button).bs-pill:where([data-variant^="filter"][data-active]):is(:hover, :focus)  {
+:is(a, button).bs-pill:where([data-variant^="filter"][data-active]:not([data-active="false"])):is(:hover, :focus)  {
   --pill-background: var(--bs-blue-500);
   --pill-border: transparent;
 }
 /* White X */
-.bs-pill:where([data-variant^="filter"][data-active])::after {
+.bs-pill:where([data-variant^="filter"][data-active]:not([data-active="false"]))::after {
   content: url("data:image/svg+xml,%3Csvg width='8' height='8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 .703 7.297 0 4 3.297.703 0 0 .703 3.297 4 0 7.297.703 8 4 4.703 7.297 8 8 7.297 4.703 4 8 .703Z' fill='%23fff'/%3E%3C/svg%3E");
 }
 /* Black X */
-.bs-pill:where([data-variant^="filter"][data-active]):where(:disabled, [aria-disabled="true"])::after {
+.bs-pill:where([data-variant^="filter"][data-active]:not([data-active="false"])):where(:disabled, [aria-disabled="true"])::after {
   content: url("data:image/svg+xml,%3Csvg width='8' height='8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 .703 7.297 0 4 3.297.703 0 0 .703 3.297 4 0 7.297.703 8 4 4.703 7.297 8 8 7.297 4.703 4 8 .703Z' fill='%230A0B19'/%3E%3C/svg%3E%0A");
 }
 /* ------------------------------ Live Now Styles ------------------------------ */
@@ -2532,7 +2540,8 @@ input:where([type='checkbox'], [type='radio'])[data-error] {
   color: var(--bs-ink-disabled);
   background-color: var(--bs-bg-disabled);
 }
-.bs-pill:where([data-variant^="filter"]):not([data-active]):is(:disabled, [aria-disabled="true"]) {
+.bs-pill:where([data-variant^="filter"]):not([data-active]):is(:disabled, [aria-disabled="true"]),
+.bs-pill:where([data-variant^="filter"])[data-active="false"]:is(:disabled, [aria-disabled="true"]) {
   --pill-border: var(--bs-gray-400);
 }
 .bs-profile-img,
@@ -2553,7 +2562,7 @@ input:where([type='checkbox'], [type='radio'])[data-error] {
      object-fit: cover;
   width: 100%;
 }
-.bs-profile-img:where([data-no-img]) img {
+.bs-profile-img:where([data-no-img]:not([data-no-img="false"])) img {
   display: none;
 }
 .bs-profile-img::before,
@@ -2570,11 +2579,11 @@ input:where([type='checkbox'], [type='radio'])[data-error] {
   box-shadow: var(--bs-shadow-profilePhoto);
   content: '';
 }
-.bs-profile-img:where([data-no-img])::before {
+.bs-profile-img:where([data-no-img]:not([data-no-img="false"]))::before {
   display: none;
 }
 /* Initials */
-.bs-profile-img:where([data-no-img])::after {
+.bs-profile-img:where([data-no-img]:not([data-no-img="false"]))::after {
   border: 1px solid currentColor;
   color: var(--bs-blue-500);
   content: attr(data-initials);
@@ -2824,7 +2833,7 @@ table:where([data-sticky^="left"]) :is(td:first-child, th:first-child) {
     width: clamp(17rem, calc(100vw - 3rem), 25rem);
     z-index: 999;
 }
-.bs-toast:where([data-stacked]) {
+.bs-toast:where([data-stacked]:not([data-stacked="false"])) {
     bottom: auto;
     left: auto;
     position: static;
@@ -2832,7 +2841,7 @@ table:where([data-sticky^="left"]) :is(td:first-child, th:first-child) {
     z-index: auto;
 }
 /* Mobile - Toast comes up from bottom */
-.bs-toast:where([data-shown]) {
+.bs-toast:where([data-shown]:not([data-shown="false"])) {
     opacity: 1;
     transform: translate(0, 0);
 }
@@ -2867,7 +2876,7 @@ table:where([data-sticky^="left"]) :is(td:first-child, th:first-child) {
     padding-right: 1rem;
     padding-top: 0.5rem;
 }
-.bs-toast-actions:where([data-stacked]) {
+.bs-toast-actions:where([data-stacked]:not([data-stacked="false"])) {
     flex-direction: column-reverse;
 }
 /* Warning Toast Styles */
@@ -2907,12 +2916,12 @@ table:where([data-sticky^="left"]) :is(td:first-child, th:first-child) {
         transform: translate(calc(100% + 1.5rem), 0);
     }
 
-    .bs-toast:where([data-shown]) {
+    .bs-toast:where([data-shown]:not([data-shown="false"])) {
         opacity: 1;
         transform: translate(0, 0);
     }
 
-    .bs-toast-actions:where([data-stacked]) {
+    .bs-toast-actions:where([data-stacked]:not([data-stacked="false"])) {
         flex-direction: row;
     }
 }
@@ -3061,10 +3070,10 @@ table:where([data-sticky^="left"]) :is(td:first-child, th:first-child) {
 :where(.bs-tooltip[data-position="top-right"]):focus-within :where(.bs-tooltip-text),
 :where(.bs-tooltip[data-position="bottom-left"]):focus-within :where(.bs-tooltip-text),
 :where(.bs-tooltip[data-position="bottom-right"]):focus-within :where(.bs-tooltip-text),
-:where(.bs-tooltip[data-position="top-left"])[data-shown] :where(.bs-tooltip-text),
-:where(.bs-tooltip[data-position="top-right"])[data-shown] :where(.bs-tooltip-text),
-:where(.bs-tooltip[data-position="bottom-left"])[data-shown] :where(.bs-tooltip-text),
-:where(.bs-tooltip[data-position="bottom-right"])[data-shown] :where(.bs-tooltip-text) {
+:where(.bs-tooltip[data-position="top-left"]:not([data-shown="false"]))[data-shown] :where(.bs-tooltip-text),
+:where(.bs-tooltip[data-position="top-right"]:not([data-shown="false"]))[data-shown] :where(.bs-tooltip-text),
+:where(.bs-tooltip[data-position="bottom-left"]:not([data-shown="false"]))[data-shown] :where(.bs-tooltip-text),
+:where(.bs-tooltip[data-position="bottom-right"]:not([data-shown="false"]))[data-shown] :where(.bs-tooltip-text) {
   opacity: 1;
   transform: scale(1);
 }
@@ -3073,8 +3082,13 @@ table:where([data-sticky^="left"]) :is(td:first-child, th:first-child) {
 Don't display unless data-shown is present
 This must go last to properly override the other classes
 */
-:where(.bs-tooltip[data-disabled]:not([data-shown])):hover :where(.bs-tooltip-text),
-:where(.bs-tooltip[data-disabled]:not([data-shown])):focus-within :where(.bs-tooltip-text) {
+:where(.bs-tooltip[data-disabled]:not([data-disabled="false"]):not([data-shown])):hover :where(.bs-tooltip-text),
+:where(.bs-tooltip[data-disabled]:not([data-disabled="false"]):not([data-shown])):focus-within :where(.bs-tooltip-text) {
+  opacity: 0;
+  transform: scale(0);
+}
+:where(.bs-tooltip[data-shown="false"][data-disabled]:not([data-disabled="false"])):hover :where(.bs-tooltip-text),
+:where(.bs-tooltip[data-shown="false"][data-disabled]:not([data-disabled="false"])):focus-within :where(.bs-tooltip-text) {
   opacity: 0;
   transform: scale(0);
 }