@bi-digital/css 0.7.0 → 0.8.0

package/dist/components.css

@@ -1445,6 +1445,94 @@ body:has(.bi-dialog:modal) {
   }
 }
 
+.bi-popover {
+  --bic-popover-arrow-size: var(--bi-scale-3x);
+  --bic-popover-background: var(--bi-basic-white);
+  --bic-popover-border-width: var(--bi-stroke-thin);
+  --bic-popover-border-style: solid;
+  --bic-popover-border-color: var(--bi-neutral-15);
+  --bic-popover-color: var(--bi-neutral-90);
+  --bic-popover-border-radius: var(--bi-radius-medium);
+  --bic-popover-max-width: 300px;
+  --bic-popover-padding: var(--bi-scale-1x);
+  --bic-popover-box-shadow: 0px 8px 16px -4px #26333f14, 4px 4px 6px -2px #26333f08,
+    0px 2px 2px -1px #26333f0a;
+}
+
+.bi-popover[data-dark="true"] {
+  --bic-popover-background: var(--bi-neutral-95);
+  --bic-popover-border-color: var(--bi-neutral-70);
+  --bic-popover-color: var(--bi-neutral-5);
+  --bic-popover-box-shadow: 0px 8px 16px -4px #26333f14, 4px 4px 6px -2px #26333f08,
+      0px 2px 2px -1px #26333f0a;
+}
+
+.bi-popover {
+  background: var(--bic-popover-background);
+  border-radius: var(--bic-popover-border-radius);
+  border-width: var(--bic-popover-border-width);
+  border-style: var(--bic-popover-border-style);
+  border-color: var(--bic-popover-border-color);
+  box-shadow: var(--bic-popover-box-shadow);
+  box-sizing: border-box;
+  color: var(--bic-popover-color);
+  max-width: var(--bic-popover-max-width);
+  padding: var(--bic-popover-padding);
+  z-index: 100000;
+  display: none;
+  position: fixed;
+  inset: 0 auto auto 0;
+  overflow: visible;
+}
+
+.bi-popover[aria-hidden="false"] {
+  display: block;
+}
+
+.bi-popover[data-arrow="true"]:before {
+  background: var(--bic-popover-background);
+  border: inherit;
+  box-sizing: border-box;
+  content: "";
+  height: var(--bic-popover-arrow-size);
+  left: var(--bic-popover-arrow-x);
+  top: var(--bic-popover-arrow-y);
+  width: var(--bic-popover-arrow-size);
+  border-top-color: #0000;
+  border-left-color: #0000;
+  position: absolute;
+  translate: -50% -50%;
+}
+
+.bi-popover[data-arrow="true"][data-placement="top"]:before {
+  rotate: 45deg;
+}
+
+.bi-popover[data-arrow="true"][data-placement="left"]:before {
+  rotate: -45deg;
+}
+
+.bi-popover[data-arrow="true"][data-placement="right"]:before {
+  rotate: 135deg;
+}
+
+.bi-popover[data-arrow="true"][data-placement="bottom"]:before {
+  rotate: -135deg;
+}
+
+[data-popover="inline"] {
+  all: unset;
+  cursor: pointer;
+  text-underline-offset: .27em;
+  font-size: inherit;
+  -webkit-text-decoration: underline dotted;
+  text-decoration: underline dotted;
+}
+
+[data-popover="inline"]:not([hidden]) {
+  display: inline;
+}
+
 .bi-dropdown {
   --bic-dropdown-padding: var(--bi-scale-1x);
   --bic-dropdown-item-padding: var(--bi-scale-2x) var(--bi-scale-3x);
@@ -1455,6 +1543,7 @@ body:has(.bi-dialog:modal) {
   --bic-dropdown-border-color: var(--bi-neutral-15);
   --bic-dropdown-box-shadow: 0px 8px 16px -4px #26333f14, 4px 4px 6px -2px #26333f08,
     0px 2px 2px -1px #26333f0a;
+  --bic-dropdown-min-width: var(--bi-scale-64x);
 }
 
 .bi-dropdown[data-dark="true"] {
@@ -1473,33 +1562,270 @@ body:has(.bi-dialog:modal) {
   border-color: var(--bic-dropdown-border-color);
   box-shadow: var(--bic-dropdown-box-shadow);
   box-sizing: border-box;
-  min-width: var(--bi-scale-64x);
+  min-width: max(var(--bic-dropdown-min-width), var(--bic-popover-trigger-width, 0px));
   padding: var(--bic-dropdown-padding);
   list-style: none;
 }
 
-.bi-dropdown ul {
-  gap: var(--bi-scale-1x);
-  flex-direction: column;
-  margin: 0;
-  padding: 0;
-  list-style: none;
-  display: flex;
+.bi-dropdown ul {
+  gap: var(--bi-scale-1x);
+  flex-direction: column;
+  margin: 0;
+  padding: 0;
+  list-style: none;
+  display: flex;
+}
+
+.bi-dropdown :is(a, button, [role="button"]) {
+  padding: var(--bic-dropdown-item-padding);
+  min-height: var(--bic-dropdown-item-size);
+  justify-content: start;
+  width: 100%;
+}
+
+.bi-dropdown :is(a, button, [role="button"]) .bi-button--end-icon {
+  margin-left: auto;
+}
+
+.bi-button[aria-expanded="true"] {
+  box-shadow: 0px 0px 0px 1.5px var(--bi-primary-50) inset;
+}
+
+:where(.bi-input) {
+  margin: 0;
+}
+
+.bi-input {
+  --bic-input-border-color-invalid: var(--bi-alert-50);
+  --bic-input-box-shadow: 0 0 0 var(--bi-stroke-thin) var(--bic-input-border-color);
+  --bic-input-box-shadow-hover: 0 0 0 var(--bi-stroke-thick) var(--bic-input-border-color-hover);
+  --bic-input-caret-color: var(--bi-primary-50);
+  --bic-input-font-size: 1rem;
+  --bic-input-padding: var(--bi-scale-3x);
+  --bic-input-size: var(--bi-scale-11x);
+  --bic-input-toggle-background: var(--bi-primary-50);
+  --bic-input-toggle-color: var(--bi-basic-white);
+  --bic-input-toggle-size: 1.125rem;
+  --bic-input-background: var(--bi-basic-white);
+  --bic-input-background-readonly: var(--bi-neutral-10);
+  --bic-input-border-color: var(--bi-neutral-50);
+  --bic-input-border-color-hover: var(--bi-neutral-50);
+  --bic-input-border-color-readonly: var(--bi-neutral-50);
+  --bic-input-color-readonly: var(--bi-neutral-95);
+  --bic-input-color: var(--bi-neutral-95);
+  --bic-input-disabled-color: var(--bi-neutral-50);
+  --bic-input-placeholder-color: var(--bi-neutral-60);
+  --bic-input-focus-outline-color: var(--bi-primary-50);
+  --bic-input-focus-shadow-color: var(--bi-basic-white);
+  --bic-input-select-chevron: url("data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" fill=\"none\" viewBox=\"0 0 24 24\"><path fill=\"%23222d38\" fill-rule=\"evenodd\" d=\"M5.97 9.47a.75.75 0 0 1 1.06 0L12 14.44l4.97-4.97a.75.75 0 1 1 1.06 1.06l-5.5 5.5a.75.75 0 0 1-1.06 0l-5.5-5.5a.75.75 0 0 1 0-1.06\" clip-rule=\"evenodd\"></path></svg>");
+}
+
+.bi-input[data-dark="true"] {
+  --bic-input-background: var(--bi-neutral-95);
+  --bic-input-background-readonly: var(--bi-neutral-50);
+  --bic-input-border-color-hover: var(--bi-neutral-25);
+  --bic-input-color-readonly: var(--bi-basic-white);
+  --bic-input-color: var(--bi-basic-white);
+  --bic-input-disabled-color: var(--bi-neutral-40);
+  --bic-input-placeholder-color: var(--bi-neutral-30);
+  --bic-input-focus-outline-color: var(--bi-primary-30);
+  --bic-input-focus-shadow-color: var(--bi-neutral-95);
+  --bic-input-select-chevron: url("data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" fill=\"none\" viewBox=\"0 0 24 24\"><path fill=\"white\" fill-rule=\"evenodd\" d=\"M5.97 9.47a.75.75 0 0 1 1.06 0L12 14.44l4.97-4.97a.75.75 0 1 1 1.06 1.06l-5.5 5.5a.75.75 0 0 1-1.06 0l-5.5-5.5a.75.75 0 0 1 0-1.06\" clip-rule=\"evenodd\"></path></svg>");
+}
+
+.bi-input {
+  appearance: none;
+  background: var(--bic-input-background);
+  border-radius: var(--bi-radius-medium);
+  box-shadow: var(--bic-input-box-shadow);
+  box-sizing: border-box;
+  color: var(--bic-input-color);
+  font-family: inherit;
+  font-size: var(--bic-input-font-size);
+  height: var(--bic-input-size);
+  min-width: 0;
+  max-width: 100%;
+  padding: var(--bic-input-padding);
+  vertical-align: middle;
+  caret-color: var(--bic-input-caret-color);
+  border: none;
+  line-height: 1;
+  position: relative;
+}
+
+.bi-input[data-size="large"] {
+  --bic-input-size: var(--bi-scale-14x);
+  --bic-input-font-size: 1.25rem;
+}
+
+.bi-input:where(:not([type="checkbox"], [type="radio"])):hover {
+  box-shadow: var(--_bi--hover, var(--bic-input-box-shadow-hover));
+}
+
+.bi-input:where(:not([type="checkbox"], [type="radio"])):focus-visible {
+  --bic-input-border-color: var(--bic-input-focus-outline-color);
+}
+
+.bi-input:focus-visible {
+  outline: var(--_bi--focus, 3px solid var(--bic-input-focus-outline-color));
+  outline-offset: 0;
+  box-shadow: var(--_bi--focus, 0px 0px 20px var(--bi-scale-1-5x) #0000000d,
+      0px 0px 10px 0px #0000000d);
+}
+
+.bi-input:focus-visible * {
+  --_bi--focus: ;
+}
+
+.bi-input::placeholder {
+  color: var(--bic-input-placeholder-color);
+}
+
+.bi-input:not([size], [cols]) {
+  width: 100%;
+}
+
+.bi-input:disabled, .bi-input[aria-disabled="true"] {
+  cursor: not-allowed;
+}
+
+.bi-input[aria-invalid="true"] {
+  --bic-input-border-color: var(--bic-input-border-color-invalid);
+}
+
+.bi-input[readonly], .bi-input:disabled, .bi-input[aria-disabled="true"] {
+  background: var(--bic-input-background-readonly);
+  --bic-input-border-color: var(--bic-input-border-color-readonly);
+  color: var(--bic-input-color-readonly);
+}
+
+.bi-input:is(textarea) {
+  height: auto;
+  min-height: calc(var(--bic-input-size) * 2);
+  resize: vertical;
+}
+
+.bi-input:is(textarea):not([rows]) {
+  field-sizing: content;
+}
+
+.bi-input:is(select):not([readonly], [aria-disabled="true"], :disabled) {
+  cursor: pointer;
+}
+
+.bi-input:is(select) {
+  background-image: var(--bic-input-select-chevron);
+  background-position: calc(100% - .5em);
+  background-repeat: no-repeat;
+  background-size: 1.5em;
+}
+
+.bi-input[type="checkbox"], .bi-input[type="radio"] {
+  padding: var(--bi-scale-0-50x);
+  line-height: inherit;
+  height: var(--bic-input-toggle-size);
+  width: var(--bic-input-toggle-size);
+  box-shadow: none;
+  border-width: var(--bi-stroke-medium);
+  border-style: solid;
+  border-color: var(--bic-input-border-color);
+  background: none;
+  flex-shrink: 0;
+}
+
+:is(.bi-input[type="checkbox"], .bi-input[type="radio"]):focus-visible {
+  box-shadow: var(--_bi--focus, 0 0 0 4.5px var(--bic-input-focus-shadow-color));
+  outline: var(--_bi--focus, 3px solid var(--bic-input-focus-outline-color));
+  outline-offset: var(--_bi--focus, 3px);
+}
+
+:is(.bi-input[type="checkbox"], .bi-input[type="radio"]):focus-visible * {
+  --_bi--focus: ;
+}
+
+:is(.bi-input[type="checkbox"], .bi-input[type="radio"]):read-only:not([readonly], [aria-disabled="true"], :disabled) {
+  cursor: pointer;
+}
+
+:is(.bi-input[type="checkbox"], .bi-input[type="radio"])[type="radio"] {
+  border-radius: var(--bi-radius-full);
+}
+
+:is(.bi-input[type="checkbox"], .bi-input[type="radio"])[type="radio"]:before {
+  content: "";
+  background-color: var(--bic-input-toggle-background);
+  border-radius: 100%;
+  width: 0;
+  height: 0;
+  transition: width .1s ease-in-out, height .1s ease-in-out;
+  display: block;
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+}
+
+:is(.bi-input[type="checkbox"], .bi-input[type="radio"])[type="radio"]:checked {
+  --bic-input-border-color: var(--bic-input-toggle-background);
+}
+
+:is(.bi-input[type="checkbox"], .bi-input[type="radio"])[type="radio"]:checked:before {
+  width: 12px;
+  height: 12px;
+}
+
+:is(.bi-input[type="checkbox"], .bi-input[type="radio"])[type="checkbox"]:not([role="switch"]) {
+  border-radius: var(--bi-radius-small);
+  place-content: center;
+  display: grid;
+}
+
+:is(.bi-input[type="checkbox"], .bi-input[type="radio"])[type="checkbox"]:not([role="switch"]):before {
+  content: "";
+  width: .7em;
+  height: .7em;
+  box-shadow: inset 1em 1em var(--bic-input-toggle-color);
+  transform-origin: center;
+  clip-path: polygon(9.73% 39.66%, 0% 49.25%, 34.81% 84.58%, 100% 20%, 90.45% 10.31%, 34.81% 65.12%);
+  transition: transform .2s ease-in-out;
+  transform: scale(0);
+}
+
+:is(.bi-input[type="checkbox"], .bi-input[type="radio"])[type="checkbox"]:not([role="switch"]):where(:checked, :indeterminate) {
+  background: var(--bic-input-toggle-background);
+  --bic-input-border-color: var(--bic-input-toggle-background);
+}
+
+:is(.bi-input[type="checkbox"], .bi-input[type="radio"])[type="checkbox"]:not([role="switch"]):where(:checked, :indeterminate):before {
+  transform: scale(1);
 }
 
-.bi-dropdown :is(a, button, [role="button"]) {
-  padding: var(--bic-dropdown-item-padding);
-  min-height: var(--bic-dropdown-item-size);
-  justify-content: start;
-  width: 100%;
+:is(.bi-input[type="checkbox"], .bi-input[type="radio"])[type="checkbox"]:not([role="switch"]):indeterminate:before {
+  clip-path: polygon(0% 42%, 0% 58%, 100% 58%, 100% 42%);
 }
 
-.bi-dropdown :is(a, button, [role="button"]) .bi-button--end-icon {
-  margin-left: auto;
+:is(.bi-input[type="checkbox"], .bi-input[type="radio"])[type="checkbox"][role="switch"] {
+  --_bic-input-circle-position-x: var(--bi-scale-0-50x);
+  background: var(--bi-neutral-50);
 }
 
-.bi-button[aria-expanded="true"] {
-  box-shadow: 0px 0px 0px 1.5px var(--bi-primary-50) inset;
+:is(.bi-input[type="checkbox"], .bi-input[type="radio"])[type="checkbox"][role="switch"]:where(:checked) {
+  --_bic-input-circle-position-x: calc(100% - var(--bi-scale-0-50x));
+  background: var(--bic-input-toggle-background);
+  --bic-input-border-color: var(--bic-input-toggle-background);
+}
+
+:is(.bi-input[type="checkbox"], .bi-input[type="radio"])[type="checkbox"][role="switch"] {
+  background-image: radial-gradient(circle closest-side, var(--bi-basic-white) 95%, transparent 100%);
+  background-origin: content-box;
+  background-position: var(--_bic-input-circle-position-x);
+  background-repeat: no-repeat;
+  background-size: calc(var(--bic-input-toggle-size)) 100%;
+  border-radius: var(--bi-radius-full);
+  width: var(--bi-scale-11x);
+  height: var(--bi-scale-6x);
+  padding-inline: 0;
+  transition: background-position .2s;
 }
 
 .bi-field {
@@ -1972,359 +2298,122 @@ body:has(.bi-dialog:modal) {
 }
 
 .bi-footer .bi-footer--accreditations {
-  justify-content: center;
-  align-items: center;
-  gap: var(--bi-scale-12x);
-  flex-wrap: wrap;
-  min-height: 58px;
-  display: flex;
-}
-
-@media (width < 600px) {
-  .bi-footer .bi-footer--accreditations {
-    gap: var(--bi-scale-2x) var(--bi-scale-1x);
-  }
-}
-
-.bi-footer .bi-footer--accreditations .bi-footer--aacsb, .bi-footer .bi-footer--accreditations .bi-footer--amba, .bi-footer .bi-footer--accreditations .bi-footer--equis {
-  background-position: center;
-  background-repeat: no-repeat;
-  background-size: contain;
-  height: 58px;
-  display: block;
-}
-
-.bi-footer .bi-footer--accreditations .bi-footer--aacsb {
-  background-image: url("./assets/accreditations/aacsb.svg");
-  width: 127px;
-}
-
-.bi-footer .bi-footer--accreditations .bi-footer--aacsb:is([data-dark="true"] .bi-footer--aacsb) {
-  background-image: url("./assets/accreditations/aacsb-neg.svg");
-}
-
-.bi-footer .bi-footer--accreditations .bi-footer--amba {
-  background-image: url("./assets/accreditations/amba.svg");
-  width: 122px;
-}
-
-.bi-footer .bi-footer--accreditations .bi-footer--amba:is([data-dark="true"] .bi-footer--amba) {
-  background-image: url("./assets/accreditations/amba-neg.svg");
-}
-
-.bi-footer .bi-footer--accreditations .bi-footer--equis {
-  background-image: url("./assets/accreditations/equis.svg");
-  width: 104px;
-}
-
-.bi-footer .bi-footer--accreditations .bi-footer--equis:is([data-dark="true"] .bi-footer--equis) {
-  background-image: url("./assets/accreditations/equis-neg.svg");
-}
-
-.bi-footer .bi-footer--socials {
-  justify-content: center;
-  align-items: center;
-  gap: var(--bi-scale-8x);
-  flex-wrap: wrap;
-  display: flex;
-}
-
-@media (width < 600px) {
-  .bi-footer .bi-footer--socials {
-    gap: var(--bi-scale-2x);
-  }
-}
-
-.bi-footer .bi-footer--copyright {
-  text-align: center;
-  margin: 0;
-  font-family: museo-slab, serif;
-  font-size: 1rem;
-  font-weight: 500;
-  line-height: 1.5;
-}
-
-svg {
-  --bic-icon-size: inherit;
-  font-size: var(--bic-icon-size);
-  display: inline-block;
-}
-
-svg[data-size="2xl"] {
-  --bic-icon-size: var(--bi-icon-2xl) !important;
-}
-
-svg[data-size="xl"] {
-  --bic-icon-size: var(--bi-icon-xl) !important;
-}
-
-svg[data-size="large"] {
-  --bic-icon-size: var(--bi-icon-large) !important;
-}
-
-svg[data-size="medium"] {
-  --bic-icon-size: var(--bi-icon-medium) !important;
-}
-
-svg[data-size="small"] {
-  --bic-icon-size: var(--bi-icon-small) !important;
-}
-
-svg[data-color="inherit"] {
-  color: inherit;
-}
-
-svg[data-color="primary"] {
-  color: #01417b;
-}
-
-svg[data-color="gray"] {
-  color: #1c1b1b;
-}
-
-svg[data-color="black"] {
-  color: var(--bi-basic-key);
-}
-
-svg[data-color="white"] {
-  color: var(--bi-basic-white);
-}
-
-:where(.bi-input) {
-  margin: 0;
-}
-
-.bi-input {
-  --bic-input-border-color-invalid: var(--bi-alert-50);
-  --bic-input-box-shadow: 0 0 0 var(--bi-stroke-thin) var(--bic-input-border-color);
-  --bic-input-box-shadow-hover: 0 0 0 var(--bi-stroke-thick) var(--bic-input-border-color-hover);
-  --bic-input-caret-color: var(--bi-primary-50);
-  --bic-input-font-size: 1rem;
-  --bic-input-padding: var(--bi-scale-3x);
-  --bic-input-size: var(--bi-scale-11x);
-  --bic-input-toggle-background: var(--bi-primary-50);
-  --bic-input-toggle-color: var(--bi-basic-white);
-  --bic-input-toggle-size: 1.125rem;
-  --bic-input-background: var(--bi-basic-white);
-  --bic-input-background-readonly: var(--bi-neutral-10);
-  --bic-input-border-color: var(--bi-neutral-50);
-  --bic-input-border-color-hover: var(--bi-neutral-50);
-  --bic-input-border-color-readonly: var(--bi-neutral-50);
-  --bic-input-color-readonly: var(--bi-neutral-95);
-  --bic-input-color: var(--bi-neutral-95);
-  --bic-input-disabled-color: var(--bi-neutral-50);
-  --bic-input-placeholder-color: var(--bi-neutral-60);
-  --bic-input-focus-outline-color: var(--bi-primary-50);
-  --bic-input-focus-shadow-color: var(--bi-basic-white);
-  --bic-input-select-chevron: url("data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" fill=\"none\" viewBox=\"0 0 24 24\"><path fill=\"%23222d38\" fill-rule=\"evenodd\" d=\"M5.97 9.47a.75.75 0 0 1 1.06 0L12 14.44l4.97-4.97a.75.75 0 1 1 1.06 1.06l-5.5 5.5a.75.75 0 0 1-1.06 0l-5.5-5.5a.75.75 0 0 1 0-1.06\" clip-rule=\"evenodd\"></path></svg>");
-}
-
-.bi-input[data-dark="true"] {
-  --bic-input-background: var(--bi-neutral-95);
-  --bic-input-background-readonly: var(--bi-neutral-50);
-  --bic-input-border-color-hover: var(--bi-neutral-25);
-  --bic-input-color-readonly: var(--bi-basic-white);
-  --bic-input-color: var(--bi-basic-white);
-  --bic-input-disabled-color: var(--bi-neutral-40);
-  --bic-input-placeholder-color: var(--bi-neutral-30);
-  --bic-input-focus-outline-color: var(--bi-primary-30);
-  --bic-input-focus-shadow-color: var(--bi-neutral-95);
-  --bic-input-select-chevron: url("data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" fill=\"none\" viewBox=\"0 0 24 24\"><path fill=\"white\" fill-rule=\"evenodd\" d=\"M5.97 9.47a.75.75 0 0 1 1.06 0L12 14.44l4.97-4.97a.75.75 0 1 1 1.06 1.06l-5.5 5.5a.75.75 0 0 1-1.06 0l-5.5-5.5a.75.75 0 0 1 0-1.06\" clip-rule=\"evenodd\"></path></svg>");
-}
-
-.bi-input {
-  appearance: none;
-  background: var(--bic-input-background);
-  border-radius: var(--bi-radius-medium);
-  box-shadow: var(--bic-input-box-shadow);
-  box-sizing: border-box;
-  color: var(--bic-input-color);
-  font-family: inherit;
-  font-size: var(--bic-input-font-size);
-  height: var(--bic-input-size);
-  min-width: 0;
-  max-width: 100%;
-  padding: var(--bic-input-padding);
-  vertical-align: middle;
-  caret-color: var(--bic-input-caret-color);
-  border: none;
-  line-height: 1;
-  position: relative;
-}
-
-.bi-input[data-size="large"] {
-  --bic-input-size: var(--bi-scale-14x);
-  --bic-input-font-size: 1.25rem;
-}
-
-.bi-input:where(:not([type="checkbox"], [type="radio"])):hover {
-  box-shadow: var(--_bi--hover, var(--bic-input-box-shadow-hover));
-}
-
-.bi-input:where(:not([type="checkbox"], [type="radio"])):focus-visible {
-  --bic-input-border-color: var(--bic-input-focus-outline-color);
-}
-
-.bi-input:focus-visible {
-  outline: var(--_bi--focus, 3px solid var(--bic-input-focus-outline-color));
-  outline-offset: 0;
-  box-shadow: var(--_bi--focus, 0px 0px 20px var(--bi-scale-1-5x) #0000000d,
-      0px 0px 10px 0px #0000000d);
-}
-
-.bi-input:focus-visible * {
-  --_bi--focus: ;
-}
-
-.bi-input::placeholder {
-  color: var(--bic-input-placeholder-color);
-}
-
-.bi-input:not([size], [cols]) {
-  width: 100%;
-}
-
-.bi-input:disabled, .bi-input[aria-disabled="true"] {
-  cursor: not-allowed;
+  justify-content: center;
+  align-items: center;
+  gap: var(--bi-scale-12x);
+  flex-wrap: wrap;
+  min-height: 58px;
+  display: flex;
 }
 
-.bi-input[aria-invalid="true"] {
-  --bic-input-border-color: var(--bic-input-border-color-invalid);
+@media (width < 600px) {
+  .bi-footer .bi-footer--accreditations {
+    gap: var(--bi-scale-2x) var(--bi-scale-1x);
+  }
 }
 
-.bi-input[readonly], .bi-input:disabled, .bi-input[aria-disabled="true"] {
-  background: var(--bic-input-background-readonly);
-  --bic-input-border-color: var(--bic-input-border-color-readonly);
-  color: var(--bic-input-color-readonly);
+.bi-footer .bi-footer--accreditations .bi-footer--aacsb, .bi-footer .bi-footer--accreditations .bi-footer--amba, .bi-footer .bi-footer--accreditations .bi-footer--equis {
+  background-position: center;
+  background-repeat: no-repeat;
+  background-size: contain;
+  height: 58px;
+  display: block;
 }
 
-.bi-input:is(textarea) {
-  height: auto;
-  min-height: calc(var(--bic-input-size) * 2);
-  resize: vertical;
+.bi-footer .bi-footer--accreditations .bi-footer--aacsb {
+  background-image: url("./assets/accreditations/aacsb.svg");
+  width: 127px;
 }
 
-.bi-input:is(textarea):not([rows]) {
-  field-sizing: content;
+.bi-footer .bi-footer--accreditations .bi-footer--aacsb:is([data-dark="true"] .bi-footer--aacsb) {
+  background-image: url("./assets/accreditations/aacsb-neg.svg");
 }
 
-.bi-input:is(select):not([readonly], [aria-disabled="true"], :disabled) {
-  cursor: pointer;
+.bi-footer .bi-footer--accreditations .bi-footer--amba {
+  background-image: url("./assets/accreditations/amba.svg");
+  width: 122px;
 }
 
-.bi-input:is(select) {
-  background-image: var(--bic-input-select-chevron);
-  background-position: calc(100% - .5em);
-  background-repeat: no-repeat;
-  background-size: 1.5em;
+.bi-footer .bi-footer--accreditations .bi-footer--amba:is([data-dark="true"] .bi-footer--amba) {
+  background-image: url("./assets/accreditations/amba-neg.svg");
 }
 
-.bi-input[type="checkbox"], .bi-input[type="radio"] {
-  padding: var(--bi-scale-0-50x);
-  line-height: inherit;
-  height: var(--bic-input-toggle-size);
-  width: var(--bic-input-toggle-size);
-  box-shadow: none;
-  border-width: var(--bi-stroke-medium);
-  border-style: solid;
-  border-color: var(--bic-input-border-color);
-  background: none;
-  flex-shrink: 0;
+.bi-footer .bi-footer--accreditations .bi-footer--equis {
+  background-image: url("./assets/accreditations/equis.svg");
+  width: 104px;
 }
 
-:is(.bi-input[type="checkbox"], .bi-input[type="radio"]):focus-visible {
-  box-shadow: var(--_bi--focus, 0 0 0 4.5px var(--bic-input-focus-shadow-color));
-  outline: var(--_bi--focus, 3px solid var(--bic-input-focus-outline-color));
-  outline-offset: var(--_bi--focus, 3px);
+.bi-footer .bi-footer--accreditations .bi-footer--equis:is([data-dark="true"] .bi-footer--equis) {
+  background-image: url("./assets/accreditations/equis-neg.svg");
 }
 
-:is(.bi-input[type="checkbox"], .bi-input[type="radio"]):focus-visible * {
-  --_bi--focus: ;
+.bi-footer .bi-footer--socials {
+  justify-content: center;
+  align-items: center;
+  gap: var(--bi-scale-8x);
+  flex-wrap: wrap;
+  display: flex;
 }
 
-:is(.bi-input[type="checkbox"], .bi-input[type="radio"]):read-only:not([readonly], [aria-disabled="true"], :disabled) {
-  cursor: pointer;
+@media (width < 600px) {
+  .bi-footer .bi-footer--socials {
+    gap: var(--bi-scale-2x);
+  }
 }
 
-:is(.bi-input[type="checkbox"], .bi-input[type="radio"])[type="radio"] {
-  border-radius: var(--bi-radius-full);
+.bi-footer .bi-footer--copyright {
+  text-align: center;
+  margin: 0;
+  font-family: museo-slab, serif;
+  font-size: 1rem;
+  font-weight: 500;
+  line-height: 1.5;
 }
 
-:is(.bi-input[type="checkbox"], .bi-input[type="radio"])[type="radio"]:before {
-  content: "";
-  background-color: var(--bic-input-toggle-background);
-  border-radius: 100%;
-  width: 0;
-  height: 0;
-  transition: width .1s ease-in-out, height .1s ease-in-out;
-  display: block;
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%);
+svg {
+  --bic-icon-size: inherit;
+  font-size: var(--bic-icon-size);
+  display: inline-block;
 }
 
-:is(.bi-input[type="checkbox"], .bi-input[type="radio"])[type="radio"]:checked {
-  --bic-input-border-color: var(--bic-input-toggle-background);
+svg[data-size="2xl"] {
+  --bic-icon-size: var(--bi-icon-2xl) !important;
 }
 
-:is(.bi-input[type="checkbox"], .bi-input[type="radio"])[type="radio"]:checked:before {
-  width: 12px;
-  height: 12px;
+svg[data-size="xl"] {
+  --bic-icon-size: var(--bi-icon-xl) !important;
 }
 
-:is(.bi-input[type="checkbox"], .bi-input[type="radio"])[type="checkbox"]:not([role="switch"]) {
-  border-radius: var(--bi-radius-small);
-  place-content: center;
-  display: grid;
+svg[data-size="large"] {
+  --bic-icon-size: var(--bi-icon-large) !important;
 }
 
-:is(.bi-input[type="checkbox"], .bi-input[type="radio"])[type="checkbox"]:not([role="switch"]):before {
-  content: "";
-  width: .7em;
-  height: .7em;
-  box-shadow: inset 1em 1em var(--bic-input-toggle-color);
-  transform-origin: center;
-  clip-path: polygon(9.73% 39.66%, 0% 49.25%, 34.81% 84.58%, 100% 20%, 90.45% 10.31%, 34.81% 65.12%);
-  transition: transform .2s ease-in-out;
-  transform: scale(0);
+svg[data-size="medium"] {
+  --bic-icon-size: var(--bi-icon-medium) !important;
 }
 
-:is(.bi-input[type="checkbox"], .bi-input[type="radio"])[type="checkbox"]:not([role="switch"]):where(:checked, :indeterminate) {
-  background: var(--bic-input-toggle-background);
-  --bic-input-border-color: var(--bic-input-toggle-background);
+svg[data-size="small"] {
+  --bic-icon-size: var(--bi-icon-small) !important;
 }
 
-:is(.bi-input[type="checkbox"], .bi-input[type="radio"])[type="checkbox"]:not([role="switch"]):where(:checked, :indeterminate):before {
-  transform: scale(1);
+svg[data-color="inherit"] {
+  color: inherit;
 }
 
-:is(.bi-input[type="checkbox"], .bi-input[type="radio"])[type="checkbox"]:not([role="switch"]):indeterminate:before {
-  clip-path: polygon(0% 42%, 0% 58%, 100% 58%, 100% 42%);
+svg[data-color="primary"] {
+  color: #01417b;
 }
 
-:is(.bi-input[type="checkbox"], .bi-input[type="radio"])[type="checkbox"][role="switch"] {
-  --_bic-input-circle-position-x: var(--bi-scale-0-50x);
-  background: var(--bi-neutral-50);
+svg[data-color="gray"] {
+  color: #1c1b1b;
 }
 
-:is(.bi-input[type="checkbox"], .bi-input[type="radio"])[type="checkbox"][role="switch"]:where(:checked) {
-  --_bic-input-circle-position-x: calc(100% - var(--bi-scale-0-50x));
-  background: var(--bic-input-toggle-background);
-  --bic-input-border-color: var(--bic-input-toggle-background);
+svg[data-color="black"] {
+  color: var(--bi-basic-key);
 }
 
-:is(.bi-input[type="checkbox"], .bi-input[type="radio"])[type="checkbox"][role="switch"] {
-  background-image: radial-gradient(circle closest-side, var(--bi-basic-white) 95%, transparent 100%);
-  background-origin: content-box;
-  background-position: var(--_bic-input-circle-position-x);
-  background-repeat: no-repeat;
-  background-size: calc(var(--bic-input-toggle-size)) 100%;
-  border-radius: var(--bi-radius-full);
-  width: var(--bi-scale-11x);
-  height: var(--bi-scale-6x);
-  padding-inline: 0;
-  transition: background-position .2s;
+svg[data-color="white"] {
+  color: var(--bi-basic-white);
 }
 
 .bi-label {
@@ -2624,94 +2713,6 @@ svg[data-color="white"] {
   background-color: var(--bic-pagination-selected-background);
 }
 
-.bi-popover {
-  --bic-popover-arrow-size: var(--bi-scale-3x);
-  --bic-popover-background: var(--bi-basic-white);
-  --bic-popover-border-width: var(--bi-stroke-thin);
-  --bic-popover-border-style: solid;
-  --bic-popover-border-color: var(--bi-neutral-15);
-  --bic-popover-color: var(--bi-neutral-90);
-  --bic-popover-border-radius: var(--bi-radius-medium);
-  --bic-popover-max-width: 300px;
-  --bic-popover-padding: var(--bi-scale-1x);
-  --bic-popover-box-shadow: 0px 8px 16px -4px #26333f14, 4px 4px 6px -2px #26333f08,
-    0px 2px 2px -1px #26333f0a;
-}
-
-.bi-popover[data-dark="true"] {
-  --bic-popover-background: var(--bi-neutral-95);
-  --bic-popover-border-color: var(--bi-neutral-70);
-  --bic-popover-color: var(--bi-neutral-5);
-  --bic-popover-box-shadow: 0px 8px 16px -4px #26333f14, 4px 4px 6px -2px #26333f08,
-      0px 2px 2px -1px #26333f0a;
-}
-
-.bi-popover {
-  background: var(--bic-popover-background);
-  border-radius: var(--bic-popover-border-radius);
-  border-width: var(--bic-popover-border-width);
-  border-style: var(--bic-popover-border-style);
-  border-color: var(--bic-popover-border-color);
-  box-shadow: var(--bic-popover-box-shadow);
-  box-sizing: border-box;
-  color: var(--bic-popover-color);
-  max-width: var(--bic-popover-max-width);
-  padding: var(--bic-popover-padding);
-  z-index: 100000;
-  display: none;
-  position: fixed;
-  inset: 0 auto auto 0;
-  overflow: visible;
-}
-
-.bi-popover[aria-hidden="false"] {
-  display: block;
-}
-
-.bi-popover[data-arrow="true"]:before {
-  background: var(--bic-popover-background);
-  border: inherit;
-  box-sizing: border-box;
-  content: "";
-  height: var(--bic-popover-arrow-size);
-  left: var(--bic-popover-arrow-x);
-  top: var(--bic-popover-arrow-y);
-  width: var(--bic-popover-arrow-size);
-  border-top-color: #0000;
-  border-left-color: #0000;
-  position: absolute;
-  translate: -50% -50%;
-}
-
-.bi-popover[data-arrow="true"][data-placement="top"]:before {
-  rotate: 45deg;
-}
-
-.bi-popover[data-arrow="true"][data-placement="left"]:before {
-  rotate: -45deg;
-}
-
-.bi-popover[data-arrow="true"][data-placement="right"]:before {
-  rotate: 135deg;
-}
-
-.bi-popover[data-arrow="true"][data-placement="bottom"]:before {
-  rotate: -135deg;
-}
-
-[data-popover="inline"] {
-  all: unset;
-  cursor: pointer;
-  text-underline-offset: .27em;
-  font-size: inherit;
-  -webkit-text-decoration: underline dotted;
-  text-decoration: underline dotted;
-}
-
-[data-popover="inline"]:not([hidden]) {
-  display: inline;
-}
-
 .bi-search:has(:focus-visible) .bi-field--affix:first-child {
   color: var(--bi-primary-50);
 }
@@ -2766,6 +2767,7 @@ svg[data-color="white"] {
   width: 1em;
   height: 1em;
   animation: 1s linear infinite bi-spinner;
+  display: inline-block;
   -webkit-mask: radial-gradient(farthest-side, #0000 calc(100% - 4px), #000 0);
   mask: radial-gradient(farthest-side, #0000 calc(100% - 4px), #000 0);
 }