@swisspost/design-system-styles 9.0.0-next.2 → 9.0.0-next.21

package/components/form-input.scss

@@ -0,0 +1,301 @@
+@use './../functions/tokens';
+@use './../tokens/components';
+@use './../tokens/elements';
+
+@use './../mixins/forms' as forms-mx;
+@use './../mixins/utilities';
+@use './../variables/components/forms';
+
+tokens.$default-map: components.$post-text-input;
+
+input.form-control {
+  display: block;
+  width: 100%;
+  font-family: inherit;
+  appearance: none; // Fix appearance for date inputs in Safari
+  background-clip: padding-box;
+  border: tokens.get('input-border-width') tokens.get('input-border-style-default')
+    tokens.get('input-color-enabled-border');
+  position: relative;
+  border-radius: tokens.get('input-border-radius-surface');
+  background-color: tokens.get('input-color-enabled-bg');
+  color: tokens.get('input-color-enabled-fg');
+  padding-inline-start: tokens.get('input-padding-inline-start');
+  padding-inline-end: tokens.get('input-padding-inline-end');
+  padding-block: tokens.get('input-standalone-padding-block');
+  height: tokens.get('input-sizing-height');
+
+  &:focus {
+    border-color: tokens.get('input-color-selected-border');
+    background-color: tokens.get('input-color-selected-bg');
+    color: tokens.get('input-color-selected-fg');
+
+    @include utilities.focus-style;
+
+    @include utilities.high-contrast-mode {
+      border-color: FieldText !important; // On blink browser valid and invalid border colors are converted to Highlight color
+    }
+  }
+
+  &:not(:disabled) {
+    &:hover,
+    &:focus {
+      @include utilities.high-contrast-mode {
+        border-color: FieldText;
+      }
+    }
+
+    &:hover {
+      border-color: tokens.get('input-color-hover-border');
+      background-color: tokens.get('input-color-hover-bg');
+
+      @include utilities.high-contrast-mode {
+        border-color: Highlight;
+      }
+    }
+  }
+
+  &[readonly]:not(:disabled) {
+    border-color: tokens.get('input-color-enabled-border');
+    background-color: tokens.get('input-color-enabled-bg');
+  }
+
+  &[type='file'] {
+    overflow: hidden;
+    position: relative;
+
+    &:disabled {
+      @include utilities.high-contrast-mode {
+        color: GrayText; // Needed for the button on blink browser, even if we define it on .form-control:disabled
+        border-color: GrayText;
+      }
+    }
+    // File input buttons theming
+    &::file-selector-button {
+      padding-block: tokens.get('input-standalone-padding-block');
+      padding-inline-start: tokens.get('input-padding-inline-start');
+      padding-inline-end: tokens.get('input-padding-inline-end');
+      margin-block: calc(#{tokens.get('input-standalone-padding-block')} * -1);
+      color: tokens.get('input-color-enabled-fg');
+      pointer-events: none;
+      border-color: inherit;
+      border-style: solid;
+      border-width: 0;
+      border-inline-end-width: tokens.get('input-border-width');
+      border-radius: 0;
+      display: block;
+      position: absolute;
+      top: 0;
+      bottom: 0;
+      right: 0;
+      margin-inline: 0;
+      height: auto;
+      background-color: inherit;
+      border-right: 0 none;
+      border-left: inherit;
+    }
+
+    // Fix Safari cutoff when change the initial position of the selector button.
+    /* stylelint-disable-next-line */
+    @supports (background: -webkit-named-image(i)) {
+      &::file-selector-button {
+        display: initial;
+        position: initial;
+        margin-inline: 0;
+        padding-inline: 0;
+        width: 0;
+        border: 0 none;
+      }
+
+      &::after {
+        display: flex;
+        align-items: center;
+        content: 'Choose File';
+        position: absolute;
+        top: 0;
+        bottom: 0;
+        right: 0;
+        z-index: 2;
+        padding-inline: tokens.get('input-padding-inline-start');
+        background-color: inherit;
+        border-left: inherit;
+        text-align: center;
+
+        [lang='de'] & {
+          content: 'Datei auswählen';
+        }
+
+        [lang='fr'] & {
+          content: 'Choisir un fichier';
+        }
+
+        [lang='it'] & {
+          content: 'Scegli file';
+        }
+      }
+
+      &[multiple] {
+        &::after {
+          content: 'Choose Files';
+
+          [lang='de'] & {
+            content: 'Dateien auswählen';
+          }
+
+          [lang='fr'] & {
+            content: 'Choisir des fichiers';
+          }
+        }
+      }
+    }
+
+    &:not(:disabled):not([readonly]) {
+      cursor: pointer;
+    }
+  }
+
+  &::placeholder {
+    color: tokens.get('input-color-enabled-fg');
+    opacity: 1;
+  }
+
+  &:disabled {
+    color: tokens.get('input-color-disabled-fg');
+    background-color: tokens.get('input-color-disabled-bg');
+    border-color: tokens.get('input-color-disabled-border');
+    border-style: tokens.get('input-border-style-disabled');
+    opacity: 1;
+
+    &::placeholder {
+      color: tokens.get('input-color-disabled-fg');
+      opacity: 1;
+    }
+  }
+
+  &:hover:not(:disabled):not([readonly])::file-selector-button {
+    background-color: tokens.get('input-color-hover-bg');
+  }
+
+  &.is-valid,
+  &.is-invalid {
+    &:not(:disabled) {
+      background-size: tokens.get('input-sizing-icon');
+      background-position: center right tokens.get('input-validation-icon-position-inline-end');
+      background-repeat: no-repeat;
+      padding-inline-end: calc(
+        #{tokens.get('input-padding-inline-end')} + #{tokens.get(
+            'input-validation-icon-position-inline-end'
+          )} + #{tokens.get('input-sizing-icon')}
+      );
+    }
+  }
+
+  @include forms-mx.validation-icons;
+}
+
+.form-label:has(+ input.form-control[disabled]) {
+  color: tokens.get('input-color-disabled-fg');
+}
+
+.form-floating {
+  position: relative;
+
+  > input.form-control ~ label {
+    position: absolute;
+    z-index: 2;
+    text-align: start;
+    pointer-events: none;
+    display: block;
+    top: tokens.get('input-border-width');
+    left: tokens.get('input-border-width');
+    margin: 0;
+    padding-inline-start: tokens.get('input-label-empty-padding-inline-start');
+    padding-inline-end: tokens.get('input-label-empty-padding-inline-end');
+    padding-block-start: tokens.get('input-label-empty-padding-block-start');
+    border: 0;
+    color: tokens.get('input-color-enabled-fg');
+    width: auto;
+    height: auto;
+    max-width: calc(100% - (#{tokens.get('input-border-width')} * 2));
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    transition:
+      padding-block-start 0.2s ease-in-out,
+      font-size 0.2s ease-in-out;
+    background-color: tokens.get('input-color-enabled-bg');
+  }
+
+  > input.form-control {
+    min-height: tokens.get('input-sizing-height');
+
+    &::placeholder {
+      color: transparent;
+    }
+
+    &:focus,
+    &:not(:placeholder-shown) {
+      padding-block-start: tokens.get('input-padding-block-start');
+      padding-block-end: tokens.get('input-padding-block-end');
+
+      ~ label {
+        color: tokens.get('input-color-selected-fg');
+        font-size: tokens.get('input-label-filled-font-size');
+        padding-block-start: tokens.get('input-label-filled-padding-block-start');
+      }
+
+      &:not(:hover):not(:disabled) {
+        ~ label {
+          color: tokens.get('input-color-selected-fg');
+        }
+      }
+    }
+
+    @include forms-mx.placeholder {
+      opacity: 0;
+    }
+
+    &:focus {
+      @include forms-mx.placeholder {
+        color: tokens.get('input-color-helptext-fg');
+        opacity: 1;
+      }
+    }
+
+    &:disabled ~ label {
+      color: tokens.get('input-color-disabled-fg');
+      background-color: tokens.get('input-color-disabled-bg');
+    }
+
+    &:not(:disabled):hover ~ label {
+      color: tokens.get('input-color-hover-fg');
+      background-color: tokens.get('input-color-hover-bg');
+    }
+
+    &[type='file'] {
+      &:focus,
+      &:not(:placeholder-shown) {
+        padding-block-start: calc(#{tokens.get('input-padding-block-start')} * 1.33);
+      }
+    }
+  }
+
+  > input.form-control:-webkit-autofill {
+    padding-block-start: tokens.get('input-padding-block-start');
+    padding-block-end: tokens.get('input-padding-block-end');
+
+    ~ label {
+      color: tokens.get('input-color-selected-fg');
+      font-size: tokens.get('input-label-filled-font-size');
+      background-color: tokens.get('input-color-selected-bg');
+    }
+  }
+
+  @include utilities.high-contrast-mode() {
+    > input {
+      @include forms-mx.placeholder() {
+        opacity: 0;
+      }
+    }
+  }
+}

package/components/form-range.css

@@ -1 +1 @@
-.form-text{margin-top:.25rem;font-size:0.8125rem;color:var(--post-contrast-color)}.form-control{display:block;width:100%;padding:.875rem 1.125rem;font-size:1rem;font-weight:400;line-height:1.5;color:#000;appearance:none;background-color:#fff;background-clip:padding-box;border:2px solid #333;border-radius:0;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out}@media(prefers-reduced-motion: reduce){.form-control{transition:none}}.form-control[type=file]{overflow:hidden}.form-control[type=file]:not(:disabled):not([readonly]){cursor:pointer}.form-control:focus{color:inherit;background-color:inherit;border-color:inherit;outline:0;box-shadow:none}.form-control::-webkit-date-and-time-value{min-width:85px;height:1.5em;margin:0}.form-control::-webkit-datetime-edit{display:block;padding:0}.form-control::placeholder{color:#666;opacity:1}.form-control:disabled{color:var(--post-gray-60);background-color:rgba(var(--post-contrast-color-inverted-rgb), 0.4);border-color:var(--post-gray-40);opacity:1}.form-control::file-selector-button{padding:.875rem 1.125rem;margin:-0.875rem -1.125rem;margin-inline-end:1.125rem;color:#000;background-color:var(--bs-tertiary-bg);pointer-events:none;border-color:inherit;border-style:solid;border-width:0;border-inline-end-width:2px;border-radius:0;transition:opacity 250ms,border-color 250ms,background-color 250ms,color 250ms}@media(prefers-reduced-motion: reduce){.form-control::file-selector-button{transition:none}}.form-control:hover:not(:disabled):not([readonly])::file-selector-button{background-color:#fff}.form-control-plaintext{display:block;width:100%;padding:.875rem 0;margin-bottom:0;line-height:1.5;color:var(--post-contrast-color);background-color:rgba(0,0,0,0);border:solid rgba(0,0,0,0);border-width:2px 0}.form-control-plaintext:focus{outline:0}.form-control-plaintext.form-control-sm,.form-control-plaintext.form-control-lg{padding-right:0;padding-left:0}.form-control-sm{min-height:1.75rem;padding:.25rem 1rem;font-size:0.875rem;border-radius:0}.form-control-sm::file-selector-button{padding:.25rem 1rem;margin:-0.25rem -1rem;margin-inline-end:1rem}.form-control-lg{min-height:3.125rem;padding:.75rem 1rem;font-size:1.25rem;border-radius:0}.form-control-lg::file-selector-button{padding:.75rem 1rem;margin:-0.75rem -1rem;margin-inline-end:1rem}textarea.form-control{min-height:3.5rem}textarea.form-control-sm{min-height:1.75rem}textarea.form-control-lg{min-height:3.125rem}.form-control-color{width:3rem;height:3.5rem;padding:.875rem}.form-control-color:not(:disabled):not([readonly]){cursor:pointer}.form-control-color::-moz-color-swatch{border:0 !important;border-radius:0}.form-control-color::-webkit-color-swatch{border:0 !important;border-radius:0}.form-control-color.form-control-sm{height:1.75rem}.form-control-color.form-control-lg{height:3.125rem}.form-select{--bs-form-select-bg-img: url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='1' fill='%23000000' d='m23.6 13.2-7.5 7.6-7.6-7.6.9-.9 6.6 6.6 6.6-6.6z'/%3E%3C/svg%3E");display:block;width:100%;padding:.875rem 3.375rem .875rem 1.125rem;font-size:1rem;font-weight:400;line-height:1.5;color:#000;appearance:none;background-color:#fff;background-image:var(--bs-form-select-bg-img),var(--bs-form-select-bg-icon, none);background-repeat:no-repeat;background-position:right 1.125rem center;background-size:16px 12px;border:2px solid #333;border-radius:0;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out}@media(prefers-reduced-motion: reduce){.form-select{transition:none}}.form-select:focus{border-color:inherit;outline:0;box-shadow:0 0 0 .125rem rgba(51,51,51,.25)}.form-select[multiple],.form-select[size]:not([size="1"]){padding-right:1.125rem;background-image:none}.form-select:disabled{color:var(--post-gray-60);background-color:rgba(var(--post-contrast-color-inverted-rgb), 0.4);border-color:#999}.form-select:-moz-focusring{color:rgba(0,0,0,0);text-shadow:0 0 0 #000}.form-select-sm{padding-top:.25rem;padding-bottom:.25rem;padding-left:1rem;font-size:0.875rem;border-radius:0}.form-select-lg{padding-top:.75rem;padding-bottom:.75rem;padding-left:1rem;font-size:1.25rem;border-radius:0}[data-bs-theme=dark] .form-select{--bs-form-select-bg-img: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23dee2e6' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e")}.form-range{width:100%;height:2.4rem;padding:0;appearance:none;background-color:rgba(0,0,0,0)}.form-range:focus{outline:0}.form-range:focus::-webkit-slider-thumb{box-shadow:0 0 0 1px #000,0 0 0 .2rem rgba(51,51,51,.25)}.form-range:focus::-moz-range-thumb{box-shadow:0 0 0 1px #000,0 0 0 .2rem rgba(51,51,51,.25)}.form-range::-moz-focus-outer{border:0}.form-range::-webkit-slider-thumb{width:2rem;height:2rem;margin-top:-0.9rem;appearance:none;background-color:#fff;border:2px solid #000;border-radius:1rem;-webkit-transition:background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;transition:background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}@media(prefers-reduced-motion: reduce){.form-range::-webkit-slider-thumb{-webkit-transition:none;transition:none}}.form-range::-webkit-slider-thumb:active{background-color:#fff}.form-range::-webkit-slider-runnable-track{width:100%;height:.2rem;color:rgba(0,0,0,0);cursor:pointer;background-color:#ccc;border-color:rgba(0,0,0,0);border-radius:1rem}.form-range::-moz-range-thumb{width:2rem;height:2rem;appearance:none;background-color:#fff;border:2px solid #000;border-radius:1rem;-moz-transition:background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;transition:background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}@media(prefers-reduced-motion: reduce){.form-range::-moz-range-thumb{-moz-transition:none;transition:none}}.form-range::-moz-range-thumb:active{background-color:#fff}.form-range::-moz-range-track{width:100%;height:.2rem;color:rgba(0,0,0,0);cursor:pointer;background-color:#ccc;border-color:rgba(0,0,0,0);border-radius:1rem}.form-range:disabled{pointer-events:none}.form-range:disabled::-webkit-slider-thumb{background-color:#fff}.form-range:disabled::-moz-range-thumb{background-color:#fff}.form-floating{position:relative}.form-floating>.form-control,.form-floating>.form-control-plaintext,.form-floating>.form-select{height:4.6875rem;min-height:4.6875rem;line-height:1.5}.form-floating>label{position:absolute;top:0;left:0;z-index:2;height:100%;padding:.75rem 1rem;overflow:hidden;text-align:start;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;border:2px solid rgba(0,0,0,0);transform-origin:0 0;transition:all 250ms cubic-bezier(0.4, 0, 0.2, 1)}@media(prefers-reduced-motion: reduce){.form-floating>label{transition:none}}.form-floating>.form-control,.form-floating>.form-control-plaintext{padding:.75rem 1rem}.form-floating>.form-control::placeholder,.form-floating>.form-control-plaintext::placeholder{color:rgba(0,0,0,0)}.form-floating>.form-control:focus,.form-floating>.form-control:not(:placeholder-shown),.form-floating>.form-control-plaintext:focus,.form-floating>.form-control-plaintext:not(:placeholder-shown){padding-top:1.5rem;padding-bottom:0}.form-floating>.form-control:-webkit-autofill,.form-floating>.form-control-plaintext:-webkit-autofill{padding-top:1.5rem;padding-bottom:0}.form-floating>.form-select{padding-top:1.5rem;padding-bottom:0}.form-floating>.form-control:focus~label,.form-floating>.form-control:not(:placeholder-shown)~label,.form-floating>.form-control-plaintext~label,.form-floating>.form-select~label{color:rgba(var(--bs-body-color-rgb), 1);transform:scale(0.75)}.form-floating>.form-control:focus~label::after,.form-floating>.form-control:not(:placeholder-shown)~label::after,.form-floating>.form-control-plaintext~label::after,.form-floating>.form-select~label::after{position:absolute;inset:.75rem .5rem;z-index:-1;height:4.6875rem;content:"";background-color:#fff;border-radius:0}.form-floating>.form-control:-webkit-autofill~label{color:rgba(var(--bs-body-color-rgb), 1);transform:scale(0.75)}.form-floating>.form-control-plaintext~label{border-width:2px 0}.form-floating>:disabled~label,.form-floating>.form-control:disabled~label{color:#6c757d}.form-floating>:disabled~label::after,.form-floating>.form-control:disabled~label::after{background-color:rgba(var(--post-contrast-color-inverted-rgb), 0.4)}.input-group{position:relative;display:flex;flex-wrap:wrap;align-items:stretch;width:100%}.input-group>.form-control,.input-group>.form-select,.input-group>.form-floating{position:relative;flex:1 1 auto;width:1%;min-width:0}.input-group>.form-control:focus,.input-group>.form-select:focus,.input-group>.form-floating:focus-within{z-index:5}.input-group .btn{position:relative;z-index:2}.input-group .btn:focus{z-index:5}.input-group-text{display:flex;align-items:center;padding:.875rem 1.125rem;font-size:1rem;font-weight:400;line-height:1.5;color:#000;text-align:center;white-space:nowrap;background-color:rgba(var(--post-contrast-color-inverted-rgb), 0.6);border:2px solid #333;border-radius:0}.input-group-lg>.form-control,.input-group-lg>.form-select,.input-group-lg>.input-group-text,.input-group-lg>.btn{padding:.75rem 1rem;font-size:1.25rem;border-radius:0}.input-group-sm>.form-control,.input-group-sm>.form-select,.input-group-sm>.input-group-text,.input-group-sm>.btn{padding:.25rem 1rem;font-size:0.875rem;border-radius:0}.input-group-lg>.form-select,.input-group-sm>.form-select{padding-right:4.5rem}.input-group:not(.has-validation)>:not(:last-child):not(.dropdown-toggle):not(.dropdown-menu):not(.form-floating),.input-group:not(.has-validation)>.dropdown-toggle:nth-last-child(n+3),.input-group:not(.has-validation)>.form-floating:not(:last-child)>.form-control,.input-group:not(.has-validation)>.form-floating:not(:last-child)>.form-select{border-top-right-radius:0;border-bottom-right-radius:0}.input-group.has-validation>:nth-last-child(n+3):not(.dropdown-toggle):not(.dropdown-menu):not(.form-floating),.input-group.has-validation>.dropdown-toggle:nth-last-child(n+4),.input-group.has-validation>.form-floating:nth-last-child(n+3)>.form-control,.input-group.has-validation>.form-floating:nth-last-child(n+3)>.form-select{border-top-right-radius:0;border-bottom-right-radius:0}.input-group>:not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback){margin-left:calc(2px*-1);border-top-left-radius:0;border-bottom-left-radius:0}.input-group>.form-floating:not(:first-child)>.form-control,.input-group>.form-floating:not(:first-child)>.form-select{border-top-left-radius:0;border-bottom-left-radius:0}.form-range-wrapper{outline-style:none !important;outline-offset:2px !important;outline-width:2px !important;outline-color:var(--post-focus-color) !important}.form-range-wrapper:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:solid !important;border-radius:4px}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.form-range-wrapper:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.form-range-wrapper:is(:focus-visible,:focus-within,.pretend-focus){outline-style:solid !important;border-radius:4px}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.form-range-wrapper:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}:not(.form-range-wrapper)>.form-range{outline-style:none !important;outline-offset:2px !important;outline-width:2px !important;outline-color:var(--post-focus-color) !important}:not(.form-range-wrapper)>.form-range:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:solid !important;border-radius:4px}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:not(.form-range-wrapper)>.form-range:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){:not(.form-range-wrapper)>.form-range:is(:focus-visible,:focus-within,.pretend-focus){outline-style:solid !important;border-radius:4px}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:not(.form-range-wrapper)>.form-range:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}.form-range::-webkit-slider-container{overflow-x:clip}.form-range::-moz-range-thumb{border-radius:50%;box-sizing:border-box;cursor:pointer}.form-range::-webkit-slider-runnable-track{height:4px}.form-range::-webkit-slider-thumb{clip-path:polygon(0 calc(50% - 2px), 1px calc(50% - 6px), 1px 0, 32px 0, 32px 32px, 1px 32px, 1px calc(50% + 6px), 0 calc(50% + 2px), -100vw calc(50% + 2px), -100vw calc(50% - 2px))}.form-range::-moz-range-track,.form-range::-moz-range-progress{height:4px}.form-range:not(:disabled,.disabled)::-webkit-slider-runnable-track{background-color:#ccc}.form-range:not(:disabled,.disabled)::-moz-range-progress{background-color:#000}.form-range:not(:disabled,.disabled)::-webkit-slider-thumb{box-shadow:calc(-100vw - 32px) 0 0 100vw #000}.form-range:not(:disabled,.disabled):hover::-webkit-slider-thumb{border-width:3px}.form-range:not(:disabled,.disabled):hover::-moz-range-thumb{border-width:3px}.form-range:not(:disabled,.disabled):focus::-moz-range-thumb{box-shadow:none}.form-range:not(:disabled,.disabled):is(:focus-visible,:has(:focus-visible),.pretend-focus)::-moz-range-thumb{outline:none}@supports not selector(:has(:focus-visible)){.form-range:not(:disabled,.disabled):is(:focus-visible,:focus-within,.pretend-focus)::-moz-range-thumb{outline:none}}.form-range:disabled::-webkit-slider-thumb,.form-range.disabled::-webkit-slider-thumb{border-color:var(--post-gray-40);border-style:dashed;box-shadow:calc(-100vw - 32px) 0 0 100vw #999}.form-range:disabled::-moz-range-thumb,.form-range.disabled::-moz-range-thumb{border-color:var(--post-gray-40);border-style:dashed}.form-range:disabled::-moz-range-progress,.form-range.disabled::-moz-range-progress{background-color:#999}.form-range+.form-text{margin-top:1rem;transform:translateY(-1.2rem)}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.form-range{forced-color-adjust:none}.form-range::-webkit-slider-thumb{box-shadow:calc(-100vw - 32px) 0 0 100vw SelectedItem !important}.form-range::-moz-range-progress{background-color:SelectedItem !important}.form-range:not(:disabled,.disabled)::-webkit-slider-runnable-track{background-color:ButtonBorder}.form-range:not(:disabled,.disabled)::-webkit-slider-thumb{background-color:ButtonFace;border-color:ButtonBorder}.form-range:not(:disabled,.disabled)::-moz-range-track{background-color:ButtonText}.form-range:not(:disabled,.disabled)::-moz-range-thumb{background-color:ButtonFace;border-color:ButtonText}.form-range:not(:disabled,.disabled):hover::-webkit-slider-thumb{border-color:Highlight}.form-range:not(:disabled,.disabled):hover::-moz-range-thumb{border-color:Highlight}.form-range:disabled::-moz-range-progress,.form-range.disabled::-moz-range-progress{background-color:GrayText !important}.form-range:disabled::-webkit-slider-thumb,.form-range.disabled::-webkit-slider-thumb{background-color:ButtonFace;border-color:GrayText;box-shadow:calc(-100vw - 32px) 0 0 100vw GrayText !important}.form-range:disabled::-moz-range-thumb,.form-range.disabled::-moz-range-thumb{background-color:ButtonFace;border-color:GrayText}}
+.form-range{width:100%;height:2.4rem;padding:0;appearance:none;background-color:rgba(0,0,0,0)}.form-range:focus{outline:0}.form-range:focus::-webkit-slider-thumb{box-shadow:0 0 0 1px #000,0 0 0 .2rem rgba(51,51,51,.25)}.form-range:focus::-moz-range-thumb{box-shadow:0 0 0 1px #000,0 0 0 .2rem rgba(51,51,51,.25)}.form-range::-moz-focus-outer{border:0}.form-range::-webkit-slider-thumb{width:2rem;height:2rem;margin-top:-0.9rem;appearance:none;background-color:#fff;border:2px solid #000;border-radius:1rem;-webkit-transition:background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;transition:background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}@media(prefers-reduced-motion: reduce){.form-range::-webkit-slider-thumb{-webkit-transition:none;transition:none}}.form-range::-webkit-slider-thumb:active{background-color:#fff}.form-range::-webkit-slider-runnable-track{width:100%;height:.2rem;color:rgba(0,0,0,0);cursor:pointer;background-color:#ccc;border-color:rgba(0,0,0,0);border-radius:1rem}.form-range::-moz-range-thumb{width:2rem;height:2rem;appearance:none;background-color:#fff;border:2px solid #000;border-radius:1rem;-moz-transition:background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;transition:background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}@media(prefers-reduced-motion: reduce){.form-range::-moz-range-thumb{-moz-transition:none;transition:none}}.form-range::-moz-range-thumb:active{background-color:#fff}.form-range::-moz-range-track{width:100%;height:.2rem;color:rgba(0,0,0,0);cursor:pointer;background-color:#ccc;border-color:rgba(0,0,0,0);border-radius:1rem}.form-range:disabled{pointer-events:none}.form-range:disabled::-webkit-slider-thumb{background-color:#fff}.form-range:disabled::-moz-range-thumb{background-color:#fff}.input-group{position:relative;display:flex;flex-wrap:wrap;align-items:stretch;width:100%}.input-group>.form-control,.input-group>.form-select,.input-group>.form-floating{position:relative;flex:1 1 auto;width:1%;min-width:0}.input-group>.form-control:focus,.input-group>.form-select:focus,.input-group>.form-floating:focus-within{z-index:5}.input-group .btn{position:relative;z-index:2}.input-group .btn:focus{z-index:5}.input-group-text{display:flex;align-items:center;padding:.875rem 1.125rem;font-size:1rem;font-weight:var(--post-core-font-weight-400);line-height:1.5;color:var(--bs-body-color);text-align:center;white-space:nowrap;background-color:var(--bs-tertiary-bg);border:2px solid #333;border-radius:var(--bs-border-radius)}.input-group-lg>.form-control,.input-group-lg>.form-select,.input-group-lg>.input-group-text,.input-group-lg>.btn{padding:.75rem 16px;font-size:1.25rem;border-radius:var(--bs-border-radius-lg)}.input-group-sm>.form-control,.input-group-sm>.form-select,.input-group-sm>.input-group-text,.input-group-sm>.btn{padding:.25rem 16px;font-size:0.875rem;border-radius:var(--bs-border-radius-sm)}.input-group-lg>.form-select,.input-group-sm>.form-select{padding-right:4.5rem}.input-group:not(.has-validation)>:not(:last-child):not(.dropdown-toggle):not(.dropdown-menu):not(.form-floating),.input-group:not(.has-validation)>.dropdown-toggle:nth-last-child(n+3),.input-group:not(.has-validation)>.form-floating:not(:last-child)>.form-control,.input-group:not(.has-validation)>.form-floating:not(:last-child)>.form-select{border-top-right-radius:0;border-bottom-right-radius:0}.input-group.has-validation>:nth-last-child(n+3):not(.dropdown-toggle):not(.dropdown-menu):not(.form-floating),.input-group.has-validation>.dropdown-toggle:nth-last-child(n+4),.input-group.has-validation>.form-floating:nth-last-child(n+3)>.form-control,.input-group.has-validation>.form-floating:nth-last-child(n+3)>.form-select{border-top-right-radius:0;border-bottom-right-radius:0}.input-group>:not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback){margin-left:calc(2px*-1);border-top-left-radius:0;border-bottom-left-radius:0}.input-group>.form-floating:not(:first-child)>.form-control,.input-group>.form-floating:not(:first-child)>.form-select{border-top-left-radius:0;border-bottom-left-radius:0}.form-range-wrapper{outline-offset:var(--post-device-spacing-padding-2) !important;outline:var(--post-scheme-color-interactive-focus-stroke) none var(--post-device-border-width-focus) !important}.form-range-wrapper:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important;border-radius:4px}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.form-range-wrapper:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.form-range-wrapper:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important;border-radius:4px}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.form-range-wrapper:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}:not(.form-range-wrapper)>.form-range{outline-offset:var(--post-device-spacing-padding-2) !important;outline:var(--post-scheme-color-interactive-focus-stroke) none var(--post-device-border-width-focus) !important}:not(.form-range-wrapper)>.form-range:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important;border-radius:4px}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:not(.form-range-wrapper)>.form-range:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){:not(.form-range-wrapper)>.form-range:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important;border-radius:4px}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:not(.form-range-wrapper)>.form-range:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}.form-range::-webkit-slider-container{overflow-x:clip}.form-range::-moz-range-thumb{border-radius:50%;box-sizing:border-box;cursor:pointer}.form-range::-webkit-slider-runnable-track{height:4px}.form-range::-webkit-slider-thumb{clip-path:polygon(0 calc(50% - 2px), 1px calc(50% - 6px), 1px 0, 32px 0, 32px 32px, 1px 32px, 1px calc(50% + 6px), 0 calc(50% + 2px), -100vw calc(50% + 2px), -100vw calc(50% - 2px))}.form-range::-moz-range-track,.form-range::-moz-range-progress{height:4px}.form-range:not(:disabled,.disabled)::-webkit-slider-runnable-track{background-color:#ccc}.form-range:not(:disabled,.disabled)::-moz-range-progress{background-color:#000}.form-range:not(:disabled,.disabled)::-webkit-slider-thumb{box-shadow:calc(-100vw - 32px) 0 0 100vw #000}.form-range:not(:disabled,.disabled):hover::-webkit-slider-thumb{border-width:3px}.form-range:not(:disabled,.disabled):hover::-moz-range-thumb{border-width:3px}.form-range:not(:disabled,.disabled):focus::-moz-range-thumb{box-shadow:none}.form-range:not(:disabled,.disabled):is(:focus-visible,:has(:focus-visible),.pretend-focus)::-moz-range-thumb{outline:none}@supports not selector(:has(:focus-visible)){.form-range:not(:disabled,.disabled):is(:focus-visible,:focus-within,.pretend-focus)::-moz-range-thumb{outline:none}}.form-range:disabled::-webkit-slider-thumb,.form-range.disabled::-webkit-slider-thumb{border-color:#999;border-style:dashed;box-shadow:calc(-100vw - 32px) 0 0 100vw #999}.form-range:disabled::-moz-range-thumb,.form-range.disabled::-moz-range-thumb{border-color:#999;border-style:dashed}.form-range:disabled::-moz-range-progress,.form-range.disabled::-moz-range-progress{background-color:#999}.form-range+.form-hint{margin-top:var(--post-core-dimension-16);transform:translateY(-1.2rem)}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.form-range{forced-color-adjust:none}.form-range::-webkit-slider-thumb{box-shadow:calc(-100vw - 32px) 0 0 100vw SelectedItem !important}.form-range::-moz-range-progress{background-color:SelectedItem !important}.form-range:not(:disabled,.disabled)::-webkit-slider-runnable-track{background-color:ButtonBorder}.form-range:not(:disabled,.disabled)::-webkit-slider-thumb{background-color:ButtonFace;border-color:ButtonBorder}.form-range:not(:disabled,.disabled)::-moz-range-track{background-color:ButtonText}.form-range:not(:disabled,.disabled)::-moz-range-thumb{background-color:ButtonFace;border-color:ButtonText}.form-range:not(:disabled,.disabled):hover::-webkit-slider-thumb{border-color:Highlight}.form-range:not(:disabled,.disabled):hover::-moz-range-thumb{border-color:Highlight}.form-range:disabled::-moz-range-progress,.form-range.disabled::-moz-range-progress{background-color:GrayText !important}.form-range:disabled::-webkit-slider-thumb,.form-range.disabled::-webkit-slider-thumb{background-color:ButtonFace;border-color:GrayText;box-shadow:calc(-100vw - 32px) 0 0 100vw GrayText !important}.form-range:disabled::-moz-range-thumb,.form-range.disabled::-moz-range-thumb{background-color:ButtonFace;border-color:GrayText}}

package/components/form-range.scss

@@ -1,5 +1,3 @@
-@forward './../variables/options';
-
 @use './../themes/bootstrap/core' as *;
 @use './../themes/bootstrap/forms' as bf;
 
@@ -7,21 +5,23 @@
 @use './../variables/color';
 @use './../variables/spacing';
 @use './../variables/components/forms';
-@use './../mixins/utilities';
+@use './../mixins/utilities' as utilities-mx;
+@use '../functions/tokens';
+@use '../tokens/utilities';
 
 $track-height: 4px;
 $webkit-progress-height-adjustment: 2px;
 $webkit-thumb-width: 32px;
 
 .form-range-wrapper {
-  @include utilities.focus-style() {
+  @include utilities-mx.focus-style {
     border-radius: commons.$border-radius;
   }
 }
 
 :not(.form-range-wrapper) > {
   .form-range {
-    @include utilities.focus-style() {
+    @include utilities-mx.focus-style {
       border-radius: commons.$border-radius;
     }
   }
@@ -90,7 +90,7 @@ $webkit-thumb-width: 32px;
       box-shadow: none; // Remove default style
     }
 
-    @include utilities.focus-style-custom('::-moz-range-thumb') {
+    @include utilities-mx.focus-style-custom('::-moz-range-thumb') {
       outline: none;
     }
   }
@@ -113,13 +113,13 @@ $webkit-thumb-width: 32px;
     }
   }
 
-  + .form-text {
-    margin-top: spacing.$size-regular;
+  + .form-hint {
+    margin-top: tokens.get('utility-gap-16', utilities.$post-spacing);
     transform: translateY(#{-0.5 * forms.$form-range-height});
   }
 }
 
-@include utilities.high-contrast-mode() {
+@include utilities-mx.high-contrast-mode() {
   .form-range {
     // linear-gradient is forced to the value of "none" in forced-color mode
     // so, the "forced-color-adjust" property is necessary for "linear-gradient" to continue to work

package/components/form-search-input.css

@@ -0,0 +1 @@
+.search-input{position:relative}.search-input input[type=search]::-webkit-search-decoration,.search-input input[type=search]::-webkit-search-cancel-button,.search-input input[type=search]::-webkit-search-results-button,.search-input input[type=search]::-webkit-search-results-decoration{display:none}.search-input .form-control{padding-right:var(--post-core-dimension-48)}.search-input .form-control:not(:placeholder-shown){padding-right:var(--post-core-dimension-80)}.search-input .form-control:not(:placeholder-shown)~.form-label{padding-right:var(--post-core-dimension-82)}.search-input .form-control:not(:placeholder-shown)~.delete-button{visibility:visible;opacity:1}.search-input .form-control~.form-label{z-index:0;padding-right:var(--post-core-dimension-50)}.search-input:hover .delete-button post-icon,.search-input:hover .search-button post-icon{color:var(--post-scheme-color-interactive-input-hover-fg)}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.search-input:hover .delete-button post-icon,.search-input:hover .search-button post-icon{color:Highlight}}.search-input .delete-button,.search-input .search-button{z-index:1;padding:0;position:absolute;top:50%;transform:translateY(-50%);background:none;border:0;cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:var(--post-device-border-radius-focus);transition:opacity .2s ease,visibility .2s ease,fill .2s ease}.search-input .delete-button post-icon,.search-input .search-button post-icon{width:var(--post-device-sizing-notification-1);height:var(--post-device-sizing-notification-1)}.search-input .search-button{right:var(--post-core-dimension-14)}.search-input .search-button:focus-visible{outline-offset:var(--post-device-spacing-padding-2) !important;outline:var(--post-scheme-color-interactive-focus-stroke) none var(--post-device-border-width-focus) !important}.search-input .search-button:focus-visible:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.search-input .search-button:focus-visible:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.search-input .search-button:focus-visible:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.search-input .search-button:focus-visible:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}.search-input .delete-button{right:calc(var(--post-device-sizing-notification-1) + var(--post-core-dimension-8) + var(--post-core-dimension-14));visibility:hidden;opacity:0}.search-input .delete-button:focus-visible{outline-offset:var(--post-device-spacing-padding-2) !important;outline:var(--post-scheme-color-interactive-focus-stroke) none var(--post-device-border-width-focus) !important}.search-input .delete-button:focus-visible:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.search-input .delete-button:focus-visible:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.search-input .delete-button:focus-visible:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.search-input .delete-button:focus-visible:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}

package/components/form-search-input.scss

@@ -0,0 +1,97 @@
+@use './../functions/tokens';
+@use './../tokens/components';
+@use './../mixins/utilities';
+
+tokens.$default-map: components.$post-search-input;
+
+.search-input {
+  position: relative;
+
+  /* clears the ‘X’ from webkit browsers */
+  input[type='search']::-webkit-search-decoration,
+  input[type='search']::-webkit-search-cancel-button,
+  input[type='search']::-webkit-search-results-button,
+  input[type='search']::-webkit-search-results-decoration {
+    display: none;
+  }
+
+  .form-control {
+    padding-right: tokens.get('input-search-empty-padding-inline-end');
+
+    &:not(:placeholder-shown) {
+      padding-right: tokens.get('input-search-filled-padding-inline-end');
+
+      ~ .form-label {
+        padding-right: tokens.get('input-search-label-filled-padding-inline-end');
+      }
+
+      ~ .delete-button {
+        visibility: visible;
+        opacity: 1;
+      }
+    }
+
+    ~ .form-label {
+      z-index: 0;
+      padding-right: tokens.get('input-search-label-empty-padding-inline-end');
+    }
+  }
+
+  &:hover {
+    .delete-button,
+    .search-button {
+      post-icon {
+        color: tokens.get('input-color-hover-fg', components.$post-text-input);
+        @include utilities.high-contrast-mode() {
+          color: Highlight;
+        }
+      }
+    }
+  }
+
+  .delete-button,
+  .search-button {
+    z-index: 1;
+    padding: 0;
+    position: absolute;
+    top: 50%;
+    transform: translateY(-50%);
+    background: none;
+    border: 0;
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border-radius: tokens.get('input-search-icon-border-radius');
+    transition:
+      opacity 0.2s ease,
+      visibility 0.2s ease,
+      fill 0.2s ease;
+
+    post-icon {
+      width: tokens.get('input-sizing-icon', components.$post-text-input);
+      height: tokens.get('input-sizing-icon', components.$post-text-input);
+    }
+  }
+
+  .search-button {
+    right: tokens.get('search-position-inline-end-icon');
+
+    &:focus-visible {
+      @include utilities.focus-style;
+    }
+  }
+
+  .delete-button {
+    right: calc(
+      tokens.get('input-sizing-icon', components.$post-text-input) +
+        tokens.get('input-search-filled-gap-icon') + tokens.get('search-position-inline-end-icon')
+    );
+    visibility: hidden;
+    opacity: 0;
+
+    &:focus-visible {
+      @include utilities.focus-style;
+    }
+  }
+}

package/components/form-select.css

@@ -1 +1 @@
-.form-select{--bs-form-select-bg-img: url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='1' fill='%23000000' d='m23.6 13.2-7.5 7.6-7.6-7.6.9-.9 6.6 6.6 6.6-6.6z'/%3E%3C/svg%3E");display:block;width:100%;padding:.875rem 3.375rem .875rem 1.125rem;font-size:1rem;font-weight:400;line-height:1.5;color:#000;appearance:none;background-color:#fff;background-image:var(--bs-form-select-bg-img),var(--bs-form-select-bg-icon, none);background-repeat:no-repeat;background-position:right 1.125rem center;background-size:16px 12px;border:2px solid #333;border-radius:0;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out}@media(prefers-reduced-motion: reduce){.form-select{transition:none}}.form-select:focus{border-color:inherit;outline:0;box-shadow:0 0 0 .125rem rgba(51,51,51,.25)}.form-select[multiple],.form-select[size]:not([size="1"]){padding-right:1.125rem;background-image:none}.form-select:disabled{color:var(--post-gray-60);background-color:rgba(var(--post-contrast-color-inverted-rgb), 0.4);border-color:#999}.form-select:-moz-focusring{color:rgba(0,0,0,0);text-shadow:0 0 0 #000}.form-select-sm{padding-top:.25rem;padding-bottom:.25rem;padding-left:1rem;font-size:0.875rem;border-radius:0}.form-select-lg{padding-top:.75rem;padding-bottom:.75rem;padding-left:1rem;font-size:1.25rem;border-radius:0}[data-bs-theme=dark] .form-select{--bs-form-select-bg-img: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23dee2e6' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e")}.form-select-wrapper{outline-style:none !important;outline-offset:2px !important;outline-width:2px !important;outline-color:var(--post-focus-color) !important}.form-select-wrapper:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:solid !important;border-radius:4px}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.form-select-wrapper:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.form-select-wrapper:is(:focus-visible,:focus-within,.pretend-focus){outline-style:solid !important;border-radius:4px}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.form-select-wrapper:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}:not(.form-select-wrapper)>.form-select{outline-style:none !important;outline-offset:2px !important;outline-width:2px !important;outline-color:var(--post-focus-color) !important}:not(.form-select-wrapper)>.form-select:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:solid !important;border-radius:4px}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:not(.form-select-wrapper)>.form-select:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){:not(.form-select-wrapper)>.form-select:is(:focus-visible,:focus-within,.pretend-focus){outline-style:solid !important;border-radius:4px}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:not(.form-select-wrapper)>.form-select:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}.form-select{--form-select-indicator: url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='1' fill='%23000000' d='m23.6 13.2-7.5 7.6-7.6-7.6.9-.9 6.6 6.6 6.6-6.6z'/%3E%3C/svg%3E")}.form-select:focus{box-shadow:none}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.form-select:focus{border-color:FieldText !important}}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.form-select:not(:disabled):hover,.form-select:not(:disabled):focus{border-color:FieldText}}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.form-select:not(:disabled):hover{border-color:Highlight}}.form-select:disabled{pointer-events:none;color:var(--post-gray-60);border-color:var(--post-gray-40);border-style:dashed;background-clip:padding-box;text-decoration:line-through}.form-select:disabled~.form-text{color:var(--post-gray-60)}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.form-select:disabled{color:GrayText;border-color:GrayText}}.form-select:not([multiple]):disabled{background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='1' fill='%23999999' d='m23.6 13.2-7.5 7.6-7.6-7.6.9-.9 6.6 6.6 6.6-6.6z'/%3E%3C/svg%3E"),var(--form-select-indicator),var(--bs-form-select-bg-icon, none)}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.form-select{--form-select-indicator: url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='1' fill='%23ffffff' d='m23.6 13.2-7.5 7.6-7.6-7.6.9-.9 6.6 6.6 6.6-6.6z'/%3E%3C/svg%3E");background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='1' fill='%23ffffff' d='m23.6 13.2-7.5 7.6-7.6-7.6.9-.9 6.6 6.6 6.6-6.6z'/%3E%3C/svg%3E");background-color:Field;border-color:FieldText;color:FieldText}}@media(forced-colors: active)and (prefers-color-scheme: light),(-ms-high-contrast: active)and (prefers-color-scheme: light),(-ms-high-contrast: white-on-black)and (prefers-color-scheme: light){.form-select{--form-select-indicator: url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='1' fill='%23000000' d='m23.6 13.2-7.5 7.6-7.6-7.6.9-.9 6.6 6.6 6.6-6.6z'/%3E%3C/svg%3E");background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='1' fill='%23000000' d='m23.6 13.2-7.5 7.6-7.6-7.6.9-.9 6.6 6.6 6.6-6.6z'/%3E%3C/svg%3E")}}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.form-select:focus-visible{color:FieldText}}.form-select-rg{padding:.625rem .875rem;font-size:1rem;line-height:1.5;background-size:32px}.form-select-sm{font-size:.875rem;line-height:1.5;min-height:1.75rem;padding-block:.25rem;padding-inline:1rem;background-size:24px}.form-select-lg{font-size:1rem !important;line-height:1.5;min-height:3.125rem;background-size:32px}
+.form-select{display:block;width:100%;font-family:inherit;appearance:none;position:relative;min-height:var(--post-device-sizing-interactive-button-height-6);padding-block:var(--post-device-spacing-padding-block-1);padding-inline-start:var(--post-device-spacing-padding-inline-1);padding-inline-end:var(--post-core-dimension-48);background-color:var(--post-scheme-color-interactive-input-enabled-bg);background-repeat:no-repeat;background-size:var(--post-device-sizing-notification-1);background-position:center right var(--post-device-position-2);border-width:var(--post-device-border-width-default);border-color:var(--post-scheme-color-interactive-input-enabled-border);border-radius:var(--post-device-border-radius-1);color:var(--post-scheme-color-interactive-input-enabled-fg);background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='1' fill='%23050400' d='M27.6 10.667 16 22.267l-11.467-11.6-1.067 1.067 12.533 12.4 12.533-12.4z'/%3E%3C/svg%3E")}.form-select:disabled{opacity:1;color:var(--post-scheme-color-interactive-input-disabled-fg);background-color:var(--post-scheme-color-interactive-input-disabled-bg);border-color:var(--post-scheme-color-interactive-input-disabled-border);border-style:var(--post-core-border-style-dash)}.form-select:disabled:not([multiple]){background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='1' fill='%23696864' d='M27.6 10.667 16 22.267l-11.467-11.6-1.067 1.067 12.533 12.4 12.533-12.4z'/%3E%3C/svg%3E")}.form-select:not(:disabled):focus{background-color:var(--post-scheme-color-interactive-input-enabled-bg);color:var(--post-scheme-color-interactive-input-enabled-fg);border-color:var(--post-scheme-color-interactive-input-enabled-border);background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='1' fill='%23050400' d='M27.6 10.667 16 22.267l-11.467-11.6-1.067 1.067 12.533 12.4 12.533-12.4z'/%3E%3C/svg%3E")}.form-select:not(:disabled):focus{outline-offset:var(--post-device-spacing-padding-2) !important;outline:var(--post-scheme-color-interactive-focus-stroke) none var(--post-device-border-width-focus) !important}.form-select:not(:disabled):focus:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.form-select:not(:disabled):focus:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.form-select:not(:disabled):focus:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.form-select:not(:disabled):focus:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.form-select:not(:disabled):focus{border-color:FieldText}}@media(forced-colors: active)and (prefers-color-scheme: dark),(-ms-high-contrast: white-on-black){.form-select:not(:disabled):focus{background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='1' fill='%23ffffff' d='M27.6 10.667 16 22.267l-11.467-11.6-1.067 1.067 12.533 12.4 12.533-12.4z'/%3E%3C/svg%3E")}}.form-select:not(:disabled):hover{background-color:var(--post-scheme-color-interactive-input-hover-bg);color:var(--post-scheme-color-interactive-input-enabled-fg);border-color:var(--post-scheme-color-interactive-input-hover-border)}.form-select:not(:disabled):hover:not([multiple]){background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='1' fill='%23504f4b' d='M27.6 10.667 16 22.267l-11.467-11.6-1.067 1.067 12.533 12.4 12.533-12.4z'/%3E%3C/svg%3E")}@media(forced-colors: active)and (prefers-color-scheme: light),(-ms-high-contrast: black-on-white){.form-select:not(:disabled):hover:not([multiple]){background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='1' fill='%23050400' d='M27.6 10.667 16 22.267l-11.467-11.6-1.067 1.067 12.533 12.4 12.533-12.4z'/%3E%3C/svg%3E")}}@media(forced-colors: active)and (prefers-color-scheme: dark),(-ms-high-contrast: white-on-black){.form-select:not(:disabled):hover:not([multiple]){background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='1' fill='%23ffffff' d='M27.6 10.667 16 22.267l-11.467-11.6-1.067 1.067 12.533 12.4 12.533-12.4z'/%3E%3C/svg%3E")}}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.form-select:not(:disabled):hover{border-color:Highlight}}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.form-select{background-color:Field;border-color:FieldText;color:FieldText}.form-select:focus-visible{color:FieldText}}@media(forced-colors: active)and (prefers-color-scheme: light),(-ms-high-contrast: black-on-white){.form-select{background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='1' fill='%23050400' d='M27.6 10.667 16 22.267l-11.467-11.6-1.067 1.067 12.533 12.4 12.533-12.4z'/%3E%3C/svg%3E")}}@media(forced-colors: active)and (prefers-color-scheme: dark),(-ms-high-contrast: white-on-black){.form-select{background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='1' fill='%23ffffff' d='M27.6 10.667 16 22.267l-11.467-11.6-1.067 1.067 12.533 12.4 12.533-12.4z'/%3E%3C/svg%3E")}}.form-select.is-valid:not(:disabled),.form-select.is-invalid:not(:disabled){padding-inline-end:var(--post-core-dimension-82);background-position:center right var(--post-device-position-2),center right var(--post-device-position-3)}.form-select.is-valid:not(:disabled){background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='1' fill='%23050400' d='M27.6 10.667 16 22.267l-11.467-11.6-1.067 1.067 12.533 12.4 12.533-12.4z'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath opacity='1' fill='%23107800' d='M16 0C7.18 0 0 7.18 0 16C0 24.82 7.18 32 16 32C24.82 32 32 24.82 32 16C32 7.18 24.82 0 16 0ZM23.52 10.18L15.26 23.19L8.21 17.27C7.79 16.92 7.73 16.28 8.09 15.86C8.44 15.44 9.07 15.38 9.5 15.74L14.8 20.19L21.84 9.1C22.14 8.63 22.76 8.49 23.22 8.79C23.69 9.09 23.82 9.7 23.53 10.17L23.52 10.18Z'%3E%3C/path%3E%3C/svg%3E")}.form-select.is-valid:not(:disabled):focus{background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='1' fill='%23050400' d='M27.6 10.667 16 22.267l-11.467-11.6-1.067 1.067 12.533 12.4 12.533-12.4z'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath opacity='1' fill='%23107800' d='M16 0C7.18 0 0 7.18 0 16C0 24.82 7.18 32 16 32C24.82 32 32 24.82 32 16C32 7.18 24.82 0 16 0ZM23.52 10.18L15.26 23.19L8.21 17.27C7.79 16.92 7.73 16.28 8.09 15.86C8.44 15.44 9.07 15.38 9.5 15.74L14.8 20.19L21.84 9.1C22.14 8.63 22.76 8.49 23.22 8.79C23.69 9.09 23.82 9.7 23.53 10.17L23.52 10.18Z'%3E%3C/path%3E%3C/svg%3E")}.form-select.is-valid:not(:disabled):hover:not([multiple]){background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='1' fill='%23504f4b' d='M27.6 10.667 16 22.267l-11.467-11.6-1.067 1.067 12.533 12.4 12.533-12.4z'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath opacity='1' fill='%23107800' d='M16 0C7.18 0 0 7.18 0 16C0 24.82 7.18 32 16 32C24.82 32 32 24.82 32 16C32 7.18 24.82 0 16 0ZM23.52 10.18L15.26 23.19L8.21 17.27C7.79 16.92 7.73 16.28 8.09 15.86C8.44 15.44 9.07 15.38 9.5 15.74L14.8 20.19L21.84 9.1C22.14 8.63 22.76 8.49 23.22 8.79C23.69 9.09 23.82 9.7 23.53 10.17L23.52 10.18Z'%3E%3C/path%3E%3C/svg%3E")}@media(forced-colors: active)and (prefers-color-scheme: dark),(-ms-high-contrast: white-on-black){.form-select.is-valid:not(:disabled),.form-select.is-valid:not(:disabled):hover:not([multiple]),.form-select.is-valid:not(:disabled):focus{background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='1' fill='%23050400' d='M27.6 10.667 16 22.267l-11.467-11.6-1.067 1.067 12.533 12.4 12.533-12.4z'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath opacity='1' fill='%23e0e0e0' d='M16 0C7.18 0 0 7.18 0 16C0 24.82 7.18 32 16 32C24.82 32 32 24.82 32 16C32 7.18 24.82 0 16 0ZM23.52 10.18L15.26 23.19L8.21 17.27C7.79 16.92 7.73 16.28 8.09 15.86C8.44 15.44 9.07 15.38 9.5 15.74L14.8 20.19L21.84 9.1C22.14 8.63 22.76 8.49 23.22 8.79C23.69 9.09 23.82 9.7 23.53 10.17L23.52 10.18Z'%3E%3C/path%3E%3C/svg%3E")}}@media(forced-colors: active)and (prefers-color-scheme: light),(-ms-high-contrast: black-on-white){.form-select.is-valid:not(:disabled),.form-select.is-valid:not(:disabled):hover:not([multiple]),.form-select.is-valid:not(:disabled):focus{background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='1' fill='%23050400' d='M27.6 10.667 16 22.267l-11.467-11.6-1.067 1.067 12.533 12.4 12.533-12.4z'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath opacity='1' fill='%23333333' d='M16 0C7.18 0 0 7.18 0 16C0 24.82 7.18 32 16 32C24.82 32 32 24.82 32 16C32 7.18 24.82 0 16 0ZM23.52 10.18L15.26 23.19L8.21 17.27C7.79 16.92 7.73 16.28 8.09 15.86C8.44 15.44 9.07 15.38 9.5 15.74L14.8 20.19L21.84 9.1C22.14 8.63 22.76 8.49 23.22 8.79C23.69 9.09 23.82 9.7 23.53 10.17L23.52 10.18Z'%3E%3C/path%3E%3C/svg%3E")}}.form-select.is-invalid:not(:disabled){background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='1' fill='%23050400' d='M27.6 10.667 16 22.267l-11.467-11.6-1.067 1.067 12.533 12.4 12.533-12.4z'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath opacity='1' fill='%23b20000' d='M16 0C7.18 0 0 7.18 0 16C0 24.82 7.18 32 16 32C24.82 32 32 24.82 32 16C32 7.18 24.82 0 16 0ZM14.11 6.96H18.25V11.47L17.47 17.49H14.87L14.11 11.47V6.96ZM16.18 23.63C14.73 23.63 13.79 22.62 13.79 21.4C13.79 20.18 14.73 19.19 16.18 19.19C17.63 19.19 18.57 20.23 18.57 21.4C18.57 22.57 17.63 23.63 16.18 23.63Z'%3E%3C/path%3E%3C/svg%3E")}.form-select.is-invalid:not(:disabled):focus{background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='1' fill='%23050400' d='M27.6 10.667 16 22.267l-11.467-11.6-1.067 1.067 12.533 12.4 12.533-12.4z'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath opacity='1' fill='%23b20000' d='M16 0C7.18 0 0 7.18 0 16C0 24.82 7.18 32 16 32C24.82 32 32 24.82 32 16C32 7.18 24.82 0 16 0ZM14.11 6.96H18.25V11.47L17.47 17.49H14.87L14.11 11.47V6.96ZM16.18 23.63C14.73 23.63 13.79 22.62 13.79 21.4C13.79 20.18 14.73 19.19 16.18 19.19C17.63 19.19 18.57 20.23 18.57 21.4C18.57 22.57 17.63 23.63 16.18 23.63Z'%3E%3C/path%3E%3C/svg%3E")}.form-select.is-invalid:not(:disabled):hover:not([multiple]){background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='1' fill='%23504f4b' d='M27.6 10.667 16 22.267l-11.467-11.6-1.067 1.067 12.533 12.4 12.533-12.4z'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath opacity='1' fill='%23b20000' d='M16 0C7.18 0 0 7.18 0 16C0 24.82 7.18 32 16 32C24.82 32 32 24.82 32 16C32 7.18 24.82 0 16 0ZM14.11 6.96H18.25V11.47L17.47 17.49H14.87L14.11 11.47V6.96ZM16.18 23.63C14.73 23.63 13.79 22.62 13.79 21.4C13.79 20.18 14.73 19.19 16.18 19.19C17.63 19.19 18.57 20.23 18.57 21.4C18.57 22.57 17.63 23.63 16.18 23.63Z'%3E%3C/path%3E%3C/svg%3E")}@media(forced-colors: active)and (prefers-color-scheme: dark),(-ms-high-contrast: white-on-black){.form-select.is-invalid:not(:disabled),.form-select.is-invalid:not(:disabled):hover:not([multiple]),.form-select.is-invalid:not(:disabled):focus{background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='1' fill='%23050400' d='M27.6 10.667 16 22.267l-11.467-11.6-1.067 1.067 12.533 12.4 12.533-12.4z'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath opacity='1' fill='%23e0e0e0' d='M16 0C7.18 0 0 7.18 0 16C0 24.82 7.18 32 16 32C24.82 32 32 24.82 32 16C32 7.18 24.82 0 16 0ZM14.11 6.96H18.25V11.47L17.47 17.49H14.87L14.11 11.47V6.96ZM16.18 23.63C14.73 23.63 13.79 22.62 13.79 21.4C13.79 20.18 14.73 19.19 16.18 19.19C17.63 19.19 18.57 20.23 18.57 21.4C18.57 22.57 17.63 23.63 16.18 23.63Z'%3E%3C/path%3E%3C/svg%3E")}}@media(forced-colors: active)and (prefers-color-scheme: light),(-ms-high-contrast: black-on-white){.form-select.is-invalid:not(:disabled),.form-select.is-invalid:not(:disabled):hover:not([multiple]),.form-select.is-invalid:not(:disabled):focus{background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='1' fill='%23050400' d='M27.6 10.667 16 22.267l-11.467-11.6-1.067 1.067 12.533 12.4 12.533-12.4z'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath opacity='1' fill='%23333333' d='M16 0C7.18 0 0 7.18 0 16C0 24.82 7.18 32 16 32C24.82 32 32 24.82 32 16C32 7.18 24.82 0 16 0ZM14.11 6.96H18.25V11.47L17.47 17.49H14.87L14.11 11.47V6.96ZM16.18 23.63C14.73 23.63 13.79 22.62 13.79 21.4C13.79 20.18 14.73 19.19 16.18 19.19C17.63 19.19 18.57 20.23 18.57 21.4C18.57 22.57 17.63 23.63 16.18 23.63Z'%3E%3C/path%3E%3C/svg%3E")}}.form-select[multiple],.form-select[size]:not([size="1"]){background-image:none}.form-select[multiple].is-valid,.form-select[multiple].is-invalid,.form-select[size]:not([size="1"]).is-valid,.form-select[size]:not([size="1"]).is-invalid{background-position:center right var(--post-device-position-3)}.form-select[multiple].is-valid:not(:disabled),.form-select[size]:not([size="1"]).is-valid:not(:disabled){background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath opacity='1' fill='%23107800' d='M16 0C7.18 0 0 7.18 0 16C0 24.82 7.18 32 16 32C24.82 32 32 24.82 32 16C32 7.18 24.82 0 16 0ZM23.52 10.18L15.26 23.19L8.21 17.27C7.79 16.92 7.73 16.28 8.09 15.86C8.44 15.44 9.07 15.38 9.5 15.74L14.8 20.19L21.84 9.1C22.14 8.63 22.76 8.49 23.22 8.79C23.69 9.09 23.82 9.7 23.53 10.17L23.52 10.18Z'%3E%3C/path%3E%3C/svg%3E")}@media(forced-colors: active)and (prefers-color-scheme: dark),(-ms-high-contrast: white-on-black){.form-select[multiple].is-valid:not(:disabled),.form-select[size]:not([size="1"]).is-valid:not(:disabled){background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath opacity='1' fill='%23e0e0e0' d='M16 0C7.18 0 0 7.18 0 16C0 24.82 7.18 32 16 32C24.82 32 32 24.82 32 16C32 7.18 24.82 0 16 0ZM23.52 10.18L15.26 23.19L8.21 17.27C7.79 16.92 7.73 16.28 8.09 15.86C8.44 15.44 9.07 15.38 9.5 15.74L14.8 20.19L21.84 9.1C22.14 8.63 22.76 8.49 23.22 8.79C23.69 9.09 23.82 9.7 23.53 10.17L23.52 10.18Z'%3E%3C/path%3E%3C/svg%3E")}}@media(forced-colors: active)and (prefers-color-scheme: light),(-ms-high-contrast: black-on-white){.form-select[multiple].is-valid:not(:disabled),.form-select[size]:not([size="1"]).is-valid:not(:disabled){background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath opacity='1' fill='%23333333' d='M16 0C7.18 0 0 7.18 0 16C0 24.82 7.18 32 16 32C24.82 32 32 24.82 32 16C32 7.18 24.82 0 16 0ZM23.52 10.18L15.26 23.19L8.21 17.27C7.79 16.92 7.73 16.28 8.09 15.86C8.44 15.44 9.07 15.38 9.5 15.74L14.8 20.19L21.84 9.1C22.14 8.63 22.76 8.49 23.22 8.79C23.69 9.09 23.82 9.7 23.53 10.17L23.52 10.18Z'%3E%3C/path%3E%3C/svg%3E")}}.form-select[multiple].is-invalid:not(:disabled),.form-select[size]:not([size="1"]).is-invalid:not(:disabled){background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath opacity='1' fill='%23b20000' d='M16 0C7.18 0 0 7.18 0 16C0 24.82 7.18 32 16 32C24.82 32 32 24.82 32 16C32 7.18 24.82 0 16 0ZM14.11 6.96H18.25V11.47L17.47 17.49H14.87L14.11 11.47V6.96ZM16.18 23.63C14.73 23.63 13.79 22.62 13.79 21.4C13.79 20.18 14.73 19.19 16.18 19.19C17.63 19.19 18.57 20.23 18.57 21.4C18.57 22.57 17.63 23.63 16.18 23.63Z'%3E%3C/path%3E%3C/svg%3E")}@media(forced-colors: active)and (prefers-color-scheme: dark),(-ms-high-contrast: white-on-black){.form-select[multiple].is-invalid:not(:disabled),.form-select[size]:not([size="1"]).is-invalid:not(:disabled){background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath opacity='1' fill='%23e0e0e0' d='M16 0C7.18 0 0 7.18 0 16C0 24.82 7.18 32 16 32C24.82 32 32 24.82 32 16C32 7.18 24.82 0 16 0ZM14.11 6.96H18.25V11.47L17.47 17.49H14.87L14.11 11.47V6.96ZM16.18 23.63C14.73 23.63 13.79 22.62 13.79 21.4C13.79 20.18 14.73 19.19 16.18 19.19C17.63 19.19 18.57 20.23 18.57 21.4C18.57 22.57 17.63 23.63 16.18 23.63Z'%3E%3C/path%3E%3C/svg%3E")}}@media(forced-colors: active)and (prefers-color-scheme: light),(-ms-high-contrast: black-on-white){.form-select[multiple].is-invalid:not(:disabled),.form-select[size]:not([size="1"]).is-invalid:not(:disabled){background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath opacity='1' fill='%23333333' d='M16 0C7.18 0 0 7.18 0 16C0 24.82 7.18 32 16 32C24.82 32 32 24.82 32 16C32 7.18 24.82 0 16 0ZM14.11 6.96H18.25V11.47L17.47 17.49H14.87L14.11 11.47V6.96ZM16.18 23.63C14.73 23.63 13.79 22.62 13.79 21.4C13.79 20.18 14.73 19.19 16.18 19.19C17.63 19.19 18.57 20.23 18.57 21.4C18.57 22.57 17.63 23.63 16.18 23.63Z'%3E%3C/path%3E%3C/svg%3E")}}.form-floating{position:relative}.form-floating>.form-select{padding-block-start:var(--post-device-spacing-padding-block-29);padding-block-end:var(--post-device-spacing-padding-block-3)}.form-floating>.form-select~label{position:absolute;z-index:2;text-align:start;pointer-events:none;display:block;left:var(--post-device-border-width-default);top:var(--post-device-border-width-default);font-size:var(--post-device-font-size-10);padding-inline-start:calc(var(--post-device-spacing-padding-5) - var(--post-device-border-width-default));padding-inline-end:0;padding-block-start:var(--post-device-spacing-padding-block-30);border-radius:var(--post-device-border-radius-1);color:var(--post-scheme-color-interactive-input-enabled-fg);max-width:calc(100% - var(--post-device-border-width-default)*2 - var(--post-core-dimension-50));background-color:var(--post-scheme-color-interactive-input-enabled-bg);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:font-size .25s ease-in-out,padding-block-start .25s ease-in-out}.form-floating>.form-select:not(:disabled):hover~label{color:var(--post-scheme-color-interactive-input-hover-fg);background-color:var(--post-scheme-color-interactive-input-hover-bg)}.form-floating>.form-select:disabled~label{color:var(--post-scheme-color-interactive-input-disabled-fg);background-color:var(--post-scheme-color-interactive-input-disabled-bg)}.form-floating>.form-select:empty~label,.form-floating>.form-select.form-select-empty~label{padding-block-start:var(--post-device-spacing-padding-block-28);font-size:unset}.form-floating>.form-select[multiple]{padding-block-end:0;height:auto}.form-floating>.form-select[multiple] option{color:var(--post-scheme-color-interactive-input-enabled-fg)}.form-floating>.form-select[multiple]~label{width:calc(100% - var(--post-core-dimension-48)*2)}.form-floating>.form-select[multiple]:disabled option{color:var(--post-scheme-color-interactive-input-disabled-fg)}.form-floating>.form-select[multiple]:empty~label{padding-block:var(--post-device-spacing-padding-block-1);width:calc(100% - var(--post-device-border-width-default)*2 - var(--post-device-spacing-padding-5))}[data-color-scheme=dark] .form-select:not([multiple]){background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='1' fill='%23ffffff' d='M27.6 10.667 16 22.267l-11.467-11.6-1.067 1.067 12.533 12.4 12.533-12.4z'/%3E%3C/svg%3E")}[data-color-scheme=dark] .form-select:not([multiple]):disabled{background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='1' fill='%23ffffff' d='M27.6 10.667 16 22.267l-11.467-11.6-1.067 1.067 12.533 12.4 12.533-12.4z'/%3E%3C/svg%3E")}[data-color-scheme=dark] .form-select:not([multiple]):not(:disabled):focus{background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='1' fill='%23ffffff' d='M27.6 10.667 16 22.267l-11.467-11.6-1.067 1.067 12.533 12.4 12.533-12.4z'/%3E%3C/svg%3E")}[data-color-scheme=dark] .form-select:not([multiple]):not(:disabled):hover{background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='1' fill='%23ffffff' d='M27.6 10.667 16 22.267l-11.467-11.6-1.067 1.067 12.533 12.4 12.533-12.4z'/%3E%3C/svg%3E")}[data-color-scheme=dark] .form-select:not([multiple]).is-valid:not(:disabled){background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='1' fill='%23ffffff' d='M27.6 10.667 16 22.267l-11.467-11.6-1.067 1.067 12.533 12.4 12.533-12.4z'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath opacity='1' fill='%23107800' d='M16 0C7.18 0 0 7.18 0 16C0 24.82 7.18 32 16 32C24.82 32 32 24.82 32 16C32 7.18 24.82 0 16 0ZM23.52 10.18L15.26 23.19L8.21 17.27C7.79 16.92 7.73 16.28 8.09 15.86C8.44 15.44 9.07 15.38 9.5 15.74L14.8 20.19L21.84 9.1C22.14 8.63 22.76 8.49 23.22 8.79C23.69 9.09 23.82 9.7 23.53 10.17L23.52 10.18Z'%3E%3C/path%3E%3C/svg%3E")}[data-color-scheme=dark] .form-select:not([multiple]).is-valid:not(:disabled):focus{background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='1' fill='%23ffffff' d='M27.6 10.667 16 22.267l-11.467-11.6-1.067 1.067 12.533 12.4 12.533-12.4z'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath opacity='1' fill='%23107800' d='M16 0C7.18 0 0 7.18 0 16C0 24.82 7.18 32 16 32C24.82 32 32 24.82 32 16C32 7.18 24.82 0 16 0ZM23.52 10.18L15.26 23.19L8.21 17.27C7.79 16.92 7.73 16.28 8.09 15.86C8.44 15.44 9.07 15.38 9.5 15.74L14.8 20.19L21.84 9.1C22.14 8.63 22.76 8.49 23.22 8.79C23.69 9.09 23.82 9.7 23.53 10.17L23.52 10.18Z'%3E%3C/path%3E%3C/svg%3E")}[data-color-scheme=dark] .form-select:not([multiple]).is-valid:not(:disabled):hover{background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='1' fill='%23ffffff' d='M27.6 10.667 16 22.267l-11.467-11.6-1.067 1.067 12.533 12.4 12.533-12.4z'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath opacity='1' fill='%23107800' d='M16 0C7.18 0 0 7.18 0 16C0 24.82 7.18 32 16 32C24.82 32 32 24.82 32 16C32 7.18 24.82 0 16 0ZM23.52 10.18L15.26 23.19L8.21 17.27C7.79 16.92 7.73 16.28 8.09 15.86C8.44 15.44 9.07 15.38 9.5 15.74L14.8 20.19L21.84 9.1C22.14 8.63 22.76 8.49 23.22 8.79C23.69 9.09 23.82 9.7 23.53 10.17L23.52 10.18Z'%3E%3C/path%3E%3C/svg%3E")}[data-color-scheme=dark] .form-select:not([multiple]).is-invalid:not(:disabled){background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='1' fill='%23ffffff' d='M27.6 10.667 16 22.267l-11.467-11.6-1.067 1.067 12.533 12.4 12.533-12.4z'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath opacity='1' fill='%23b20000' d='M16 0C7.18 0 0 7.18 0 16C0 24.82 7.18 32 16 32C24.82 32 32 24.82 32 16C32 7.18 24.82 0 16 0ZM14.11 6.96H18.25V11.47L17.47 17.49H14.87L14.11 11.47V6.96ZM16.18 23.63C14.73 23.63 13.79 22.62 13.79 21.4C13.79 20.18 14.73 19.19 16.18 19.19C17.63 19.19 18.57 20.23 18.57 21.4C18.57 22.57 17.63 23.63 16.18 23.63Z'%3E%3C/path%3E%3C/svg%3E")}[data-color-scheme=dark] .form-select:not([multiple]).is-invalid:not(:disabled):focus{background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='1' fill='%23ffffff' d='M27.6 10.667 16 22.267l-11.467-11.6-1.067 1.067 12.533 12.4 12.533-12.4z'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath opacity='1' fill='%23b20000' d='M16 0C7.18 0 0 7.18 0 16C0 24.82 7.18 32 16 32C24.82 32 32 24.82 32 16C32 7.18 24.82 0 16 0ZM14.11 6.96H18.25V11.47L17.47 17.49H14.87L14.11 11.47V6.96ZM16.18 23.63C14.73 23.63 13.79 22.62 13.79 21.4C13.79 20.18 14.73 19.19 16.18 19.19C17.63 19.19 18.57 20.23 18.57 21.4C18.57 22.57 17.63 23.63 16.18 23.63Z'%3E%3C/path%3E%3C/svg%3E")}[data-color-scheme=dark] .form-select:not([multiple]).is-invalid:not(:disabled):hover{background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='1' fill='%23ffffff' d='M27.6 10.667 16 22.267l-11.467-11.6-1.067 1.067 12.533 12.4 12.533-12.4z'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath opacity='1' fill='%23b20000' d='M16 0C7.18 0 0 7.18 0 16C0 24.82 7.18 32 16 32C24.82 32 32 24.82 32 16C32 7.18 24.82 0 16 0ZM14.11 6.96H18.25V11.47L17.47 17.49H14.87L14.11 11.47V6.96ZM16.18 23.63C14.73 23.63 13.79 22.62 13.79 21.4C13.79 20.18 14.73 19.19 16.18 19.19C17.63 19.19 18.57 20.23 18.57 21.4C18.57 22.57 17.63 23.63 16.18 23.63Z'%3E%3C/path%3E%3C/svg%3E")}.no-toggle-arrow::after{display:none !important}