@duetds/components 10.2.4 → 10.3.1

package/lib/collection/components/duet-radio/duet-radio.css

@@ -88,10 +88,6 @@
   cursor: pointer;
   background: transparent;
 }
-.duet-theme-turva .duet-label {
-  font-family: "turva-sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
-  color: rgb(23, 42, 59);
-}
 .duet-label .duet-label-content {
   flex-grow: 1;
   font-size: 1rem;
@@ -124,20 +120,12 @@
   border: 1px solid rgb(8, 42, 77);
   border-radius: 50%;
 }
-.duet-theme-turva .duet-label::before {
-  border-color: rgb(23, 42, 59);
-}
 .duet-label.focus::before {
   outline: 2px solid;
   outline-offset: 2px;
   outline-color: rgba(0, 119, 179, 0.8);
 }
-.duet-theme-turva .duet-label.focus::before, .duet-label.focus::before.duet-theme-turva, .duet-theme-turva2 .duet-label.focus::before, .duet-label.focus::before.duet-theme-turva2 {
-  outline-color: rgba(53, 79, 101, 0.8);
-}
-.duet-theme-turva .duet-label.focus::before {
-  outline: 2px solid;
-  outline-offset: 2px;
+.duet-theme-turva .duet-label.focus::before, .duet-label.focus::before.duet-theme-turva {
   outline-color: rgba(53, 79, 101, 0.8);
 }
 .duet-label.checked::after {
@@ -152,31 +140,18 @@
   background: rgb(0, 119, 179);
   border-radius: 50%;
 }
-.duet-theme-turva .duet-label.checked::after {
-  background: rgb(23, 42, 59);
-}
 .duet-label.disabled {
   color: rgb(98, 121, 138);
 }
-.duet-theme-turva .duet-label.disabled {
-  color: rgb(120, 145, 164);
-}
 .duet-label.disabled::before {
   border-color: rgb(181, 198, 208);
 }
-.duet-theme-turva .duet-label.disabled::before {
-  border-color: rgb(120, 145, 164);
-}
 .duet-label.disabled.checked::before {
   border: 1px solid rgb(127, 150, 165);
 }
 .duet-label.disabled.checked::after {
   background: rgb(127, 150, 165);
 }
-.duet-theme-turva .duet-label.disabled.checked::after {
-  background: rgb(120, 145, 164);
-  border-color: rgb(120, 145, 164);
-}
 
 *::slotted([slot=input]) {
   padding: 14px !important;
@@ -194,22 +169,49 @@
   cursor: default;
 }
 
-:host(.duet-theme-turva2) .duet-theme-turva .duet-label {
+.duet-theme-turva .duet-label {
+  font-family: "turva-sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
   color: rgb(23, 42, 59);
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-radio + label::before {
+
+.duet-theme-turva .duet-radio + label::before {
   border-color: rgb(23, 42, 59);
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-radio:checked + label::after {
+
+.duet-theme-turva .duet-label.focus::before {
+  outline: 2px solid;
+  outline-offset: 2px;
+  outline-color: rgba(53, 79, 101, 0.8);
+}
+
+.duet-theme-turva .duet-label.checked::after {
+  background: rgb(23, 42, 59);
+}
+
+.duet-theme-turva .duet-label.disabled {
+  color: rgb(120, 145, 164);
+}
+.duet-theme-turva .duet-label.disabled::before {
+  border-color: rgb(120, 145, 164);
+}
+.duet-theme-turva .duet-label.disabled.checked::after {
+  background: rgb(120, 145, 164);
+  border-color: rgb(120, 145, 164);
+}
+
+.duet-theme-turva .duet-radio:checked + label::after {
   background: rgb(23, 42, 59);
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-radio[disabled] + label {
+
+.duet-theme-turva .duet-radio[disabled] + label {
   color: rgb(120, 145, 164);
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-radio[disabled] + label::before {
+
+.duet-theme-turva .duet-radio[disabled] + label::before {
   border-color: rgb(120, 145, 164);
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-radio[disabled]:checked + label::after {
+
+.duet-theme-turva .duet-radio[disabled]:checked + label::after {
   background: rgb(120, 145, 164);
   border-color: rgb(120, 145, 164);
 }

package/lib/collection/components/duet-radio/duet-radio.js

@@ -182,17 +182,17 @@ export class DuetRadio {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: '6319832bf6574e9cbcca45ccf509563abc980527', onClick: this.onClick, class: {
+        return (h(Host, { key: '14b930b9947070108e2a4e3a9f1bcc22f06383c8', onClick: this.onClick, class: {
                 vertical: this.groupDirection === "vertical",
                 horizontal: this.groupDirection === "horizontal" && !this.groupResponsive,
                 "horizontal-responsive": this.groupDirection === "horizontal" && this.groupResponsive,
                 "duet-m-0": this.margin === "none",
-            } }, h("div", { key: '63a09ea5033fb6170e0b84145861ef5516af6579', class: { "duet-radio-container": true, "duet-theme-turva": this.theme === "turva" } }, h("slot", { key: 'e9032f840a22530acceb3fd467eeb2fd16ff3293', name: "input" }), h("label", { key: '0b07703e6b12480fbbcad9ba33feb75a8d94848b', inert: true, ref: element => (this.labelElement = element), class: {
+            } }, h("div", { key: 'e51255f8e4a3c72fd4082e255434783ce8163b97', class: { "duet-radio-container": true, "duet-theme-turva": this.theme === "turva" } }, h("slot", { key: 'a60e1e5175ba93732f3e95ecdefb9df7211d9d9d', name: "input" }), h("label", { key: '37a000f2aced8a9aa8355f355d05ba2328e77cc7', inert: true, ref: element => (this.labelElement = element), class: {
                 "duet-label": true,
                 checked: this.checked,
                 focus: this.focus,
                 disabled: this.disabled || this.groupDisabled,
-            } }, h("div", { key: 'a9454ff3922c41c394a758d57be3c23e231122da', class: "duet-label-content" }, this.hasLabel ? h("slot", { name: "label" }) : this.label)))));
+            } }, h("div", { key: '58d87e1f398147f4a03b992cb9a208f2c104d217', class: "duet-label-content" }, this.hasLabel ? h("slot", { name: "label" }) : this.label)))));
     }
     static get is() { return "duet-radio"; }
     static get encapsulation() { return "shadow"; }

package/lib/collection/components/duet-radio-group/duet-radio-group.js

@@ -158,7 +158,7 @@ export class DuetRadioGroup {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: '0a4e9b973fe28ae1e8a9a583fb28df4322600d1a', onDuetChange: this.onSelect, class: { horizontal: this.direction === "horizontal" } }, h("duet-fieldset", { key: 'e362931e7a2570013431301f59116bef1165067e', label: this.label, labelHidden: this.labelHidden, caption: this.caption, error: this.error, margin: this.margin, theme: this.theme, "accessible-live-error": this.accessibleLiveError }, this.tooltip && (h("duet-tooltip", { key: '6c13847fc62ab32eb381e64614b1a99529d61c62', slot: "tooltip", direction: this.tooltipDirection, accessibleInputLabel: this.label }, this.tooltip)), h("slot", { key: '0a29afddf81e1e9509d4dcac854a4796bc890ae0', name: "tooltip" }), h("div", { key: 'f11622cd32c24f83dbfd9be9d28495d78d54aa34', class: { "duet-radio-group": true, "duet-no-stacking": !this.responsive } }, h("slot", { key: '5073cea332c31cc9e80b7b48297926f598b9b87b' })))));
+        return (h(Host, { key: 'f15d2c9272252a6f0c9b3f49adf1e6c7fa608531', onDuetChange: this.onSelect, class: { horizontal: this.direction === "horizontal" } }, h("duet-fieldset", { key: '84ae5b2b3bc30b7612b8acca406af2fb49be5b7c', label: this.label, labelHidden: this.labelHidden, caption: this.caption, error: this.error, margin: this.margin, theme: this.theme, "accessible-live-error": this.accessibleLiveError }, this.tooltip && (h("duet-tooltip", { key: '5c23fba85c54397cf80a52af07fb82c183dd236e', slot: "tooltip", direction: this.tooltipDirection, accessibleInputLabel: this.label }, this.tooltip)), h("slot", { key: 'e7469dd55b94bad35a5efc44b12f905396d70199', name: "tooltip", slot: "tooltip" }), h("div", { key: '08a75f0ab6dbdd7db89ca850e92cac18123ca6d5', class: { "duet-radio-group": true, "duet-no-stacking": !this.responsive } }, h("slot", { key: '2b9cfb92c3098f91bd7464fd6f2cf383a986c5c0' })))));
     }
     static get is() { return "duet-radio-group"; }
     static get encapsulation() { return "shadow"; }

package/lib/collection/components/duet-range-slider/duet-range-slider.css

@@ -133,16 +133,9 @@
   color: rgb(8, 42, 77);
   background: rgb(255, 255, 255);
 }
-.duet-theme-turva .duet-output {
-  font-family: "turva-sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
-  color: rgb(23, 42, 59);
-}
 .duet-range-disabled .duet-output {
   color: rgb(127, 150, 165);
 }
-.duet-range-disabled.duet-theme-turva .duet-output {
-  color: rgb(120, 145, 164);
-}
 
 .duet-range {
   position: relative;
@@ -160,12 +153,9 @@
   outline-offset: 2px;
   outline-color: rgba(0, 119, 179, 0.8);
 }
-.duet-theme-turva :host(.user-is-tabbing) .duet-range:focus, :host(.user-is-tabbing) .duet-range:focus.duet-theme-turva, .duet-theme-turva2 :host(.user-is-tabbing) .duet-range:focus, :host(.user-is-tabbing) .duet-range:focus.duet-theme-turva2 {
+.duet-theme-turva :host(.user-is-tabbing) .duet-range:focus, :host(.user-is-tabbing) .duet-range:focus.duet-theme-turva {
   outline-color: rgba(53, 79, 101, 0.8);
 }
-.duet-theme-turva .duet-range {
-  background: rgb(178, 194, 205);
-}
 .duet-ie .duet-range {
   display: block;
   width: auto;
@@ -200,9 +190,6 @@
   border-radius: 50%;
   transition: box-shadow 300ms ease;
 }
-.duet-theme-turva .duet-range::-webkit-slider-thumb {
-  border-color: rgb(120, 145, 164);
-}
 .duet-range:active::-webkit-slider-thumb {
   cursor: -webkit-grabbing;
 }
@@ -216,9 +203,6 @@
   border: 1px solid rgb(127, 150, 165);
   border-radius: 50%;
 }
-.duet-theme-turva .duet-range::-moz-range-thumb {
-  border-color: rgb(120, 145, 164);
-}
 .duet-range:active::-moz-range-thumb {
   cursor: -moz-grabbing;
 }
@@ -231,56 +215,32 @@
   border: 1px solid rgb(127, 150, 165);
   border-radius: 50%;
 }
-.duet-theme-turva .duet-range::-ms-thumb {
-  border-color: rgb(120, 145, 164);
-}
 .duet-range:disabled {
   background: rgb(181, 198, 208) !important;
 }
-.duet-theme-turva .duet-range:disabled {
-  background: rgb(178, 194, 205) !important;
-}
 .duet-range:disabled::-webkit-slider-thumb {
   cursor: default;
   background: rgb(181, 198, 208);
   border-color: transparent;
 }
-.duet-theme-turva .duet-range:disabled::-webkit-slider-thumb {
-  background: rgb(178, 194, 205);
-  border-color: transparent;
-}
 .duet-range:disabled::-moz-range-thumb {
   cursor: default;
   background: rgb(181, 198, 208);
   border-color: transparent;
 }
-.duet-theme-turva .duet-range:disabled::-moz-range-thumb {
-  background: rgb(178, 194, 205);
-  border-color: transparent;
-}
 .duet-range:disabled::-ms-thumb {
   cursor: default;
   background: rgb(181, 198, 208);
   border-color: transparent;
 }
-.duet-theme-turva .duet-range:disabled::-ms-thumb {
-  background: rgb(178, 194, 205);
-  border-color: transparent;
-}
 .duet-range::-ms-fill-lower {
   height: 4px;
   background: rgb(0, 119, 179);
 }
-.duet-theme-turva .duet-range::-ms-fill-lower {
-  background: rgb(230, 23, 64);
-}
 .duet-range::-ms-fill-upper {
   height: 4px;
   background: rgb(181, 198, 208);
 }
-.duet-theme-turva .duet-range::-ms-fill-upper {
-  background: rgb(178, 194, 205);
-}
 
 .duet-label-hidden .duet-internal-label,
 .duet-label-hidden output {
@@ -294,39 +254,54 @@
   clip: rect(0 0 0 0);
 }
 
-:host(.duet-theme-turva2) .duet-theme-turva .duet-output {
+.duet-theme-turva .duet-output {
+  font-family: "turva-sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
   color: rgb(23, 42, 59);
 }
-:host(.duet-theme-turva2) .duet-range-disabled.duet-theme-turva .duet-output {
+
+.duet-range-disabled.duet-theme-turva .duet-output {
   color: rgb(120, 145, 164);
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-range {
+
+.duet-theme-turva .duet-range {
   background: rgb(178, 194, 205);
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-range::-webkit-slider-thumb {
+
+.duet-theme-turva .duet-range::-webkit-slider-thumb {
   border-color: rgb(120, 145, 164);
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-range::-moz-range-thumb {
+
+.duet-theme-turva .duet-range::-moz-range-thumb {
   border-color: rgb(120, 145, 164);
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-range::-ms-thumb {
+
+.duet-theme-turva .duet-range::-ms-thumb {
   border-color: rgb(120, 145, 164);
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-range:disabled {
+
+.duet-theme-turva .duet-range:disabled {
   background: rgb(178, 194, 205) !important;
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-range:disabled::-webkit-slider-thumb {
+
+.duet-theme-turva .duet-range:disabled::-webkit-slider-thumb {
   background: rgb(178, 194, 205);
+  border-color: transparent;
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-range:disabled::-moz-range-thumb {
+
+.duet-theme-turva .duet-range:disabled::-moz-range-thumb {
   background: rgb(178, 194, 205);
+  border-color: transparent;
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-range:disabled::-ms-thumb {
+
+.duet-theme-turva .duet-range:disabled::-ms-thumb {
   background: rgb(178, 194, 205);
+  border-color: transparent;
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-range::-ms-fill-lower {
+
+.duet-theme-turva .duet-range::-ms-fill-lower {
   background: rgb(230, 23, 64);
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-range::-ms-fill-upper {
+
+.duet-theme-turva .duet-range::-ms-fill-upper {
   background: rgb(178, 194, 205);
 }

package/lib/collection/components/duet-range-slider/duet-range-slider.js

@@ -156,13 +156,13 @@ export class DuetRangeSlider {
         const rangeStyles = {
             background: `-webkit-linear-gradient(left,${active} 0%,${active} ${percentage}%,${inactive} ${percentage}%)`,
         };
-        return (h(Host, { key: '551b6e7bcaec7d8e8603a2c969a2e5a8737d4700', class: { "duet-m-0": this.margin === "none", "duet-expand": this.expand } }, h("div", { key: 'a1c6b7d2b74d4643785d438612a744a645276ff9', class: {
+        return (h(Host, { key: '4081e812cc9da18aa9183b15de5a3197d7542c27', class: { "duet-m-0": this.margin === "none", "duet-expand": this.expand } }, h("div", { key: 'c1943246db143f1991069550aae9fb29814f303f', class: {
                 "duet-range-container": true,
                 "duet-label-hidden": this.labelHidden,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-ie": isInternetExplorer(),
                 "duet-range-disabled": this.disabled,
-            } }, h(DuetInternalLabel, { key: 'ca4fc1236dfddc9c45432b6cf2943eacbb7b5d6f', theme: theme, color: this.labelColor, weight: this.labelWeight, margin: "small", for: identifier }, this.label), h("output", { key: '9f9b4fdede2ee464a1cce6a7ff2f70dc6c4b851d', "aria-hidden": "true", htmlFor: identifier, class: "duet-output" }, this.value.toLocaleString(this.locale), this.unit), h("input", { key: 'c3867b976f6eefe2529e9f70f5f2c3f47ef05f0c', onInput: this.onInput, onChange: this.onChange, ref: input => (this.nativeInput = input), type: "range", min: this.min, max: this.max, step: this.step, value: this.value, style: rangeStyles, "aria-valuemin": this.min, "aria-valuemax": this.max, "aria-valuenow": this.value, "aria-valuetext": `${this.value} ${this.unit}`, "aria-controls": this.accessibleControls, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": this.accessibleDescribedBy, id: identifier, name: this.name, disabled: this.disabled, required: this.required, class: "duet-range" }))));
+            } }, h(DuetInternalLabel, { key: '9ad5374d0f942c064be6015a6797a8544c6dba96', theme: theme, color: this.labelColor, weight: this.labelWeight, margin: "small", for: identifier }, this.label), h("output", { key: '02b62d9bd8d03d9ee52d77ff6ed040f02c848fea', "aria-hidden": "true", htmlFor: identifier, class: "duet-output" }, this.value.toLocaleString(this.locale), this.unit), h("input", { key: '420137f14758cefed168d359c3c70520cc4b3137', onInput: this.onInput, onChange: this.onChange, ref: input => (this.nativeInput = input), type: "range", min: this.min, max: this.max, step: this.step, value: this.value, style: rangeStyles, "aria-valuemin": this.min, "aria-valuemax": this.max, "aria-valuenow": this.value, "aria-valuetext": `${this.value} ${this.unit}`, "aria-controls": this.accessibleControls, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": this.accessibleDescribedBy, id: identifier, name: this.name, disabled: this.disabled, required: this.required, class: "duet-range" }))));
     }
     static get is() { return "duet-range-slider"; }
     static get encapsulation() { return "shadow"; }

package/lib/collection/components/duet-range-stepper/duet-range-stepper.css

@@ -48,6 +48,6 @@
   border: 0;
 }
 
-:host(.duet-theme-turva2) .duet-theme-turva .duet-range-step-counter {
+.duet-theme-turva .duet-range-step-counter {
   color: rgb(23, 42, 59);
 }

package/lib/collection/components/duet-range-stepper/duet-range-stepper.js

@@ -196,10 +196,10 @@ export class DuetRangeStepper {
      * Always the last one in the class.
      */
     render() {
-        return (h("div", { key: 'a52fee857c27100782330372c560cab649bef9da', class: {
+        return (h("div", { key: 'fdd61bd5ec23d7ed03aa172dc1f6d1255c7bae28', class: {
                 "duet-range-stepper": true,
                 "duet-theme-turva": this.theme === "turva",
-            }, onKeyDown: e => this.onKeyboardDown(e), "aria-controls": this.ariaControls }, h("span", { key: '38bb481d87ac4683a737ef36c3e44dac29e53f17', class: "duet-range-step-counter", part: "range-numbers" }, this.generateStepSize()), h("duet-action-button", { key: 'b990414c671f5f557677aef504e3964b45004ac2', disabled: this.disabled || this.buttonLeftDisabled, class: "duet-range-step-button duet-range-step-minus", onClick: e => this.handleClick(e, -1), id: this.leftBn, "accessible-label": `${this.ariaLabels.previous_increment} ${this.generatePreviousIncrementLabel()}`, ref: el => (this.leftBnRef = el), part: "navigation-arrow", iconName: "action-arrow-left-small", title: "" }), h("duet-action-button", { key: '8fc098c8d1bc03b20cc887327638d60bc6f25ca7', disabled: this.disabled || this.buttonRightDisabled, class: "duet-range-step-button duet-range-step-plus", onClick: e => this.handleClick(e, 1), "accessible-label": `${this.ariaLabels.next_increment} ${this.generateNextIncrementLabel()}`, id: this.rightBn, ref: el => (this.rightBnRef = el), part: "navigation-arrow", iconName: "action-arrow-right-small", title: "" })));
+            }, onKeyDown: e => this.onKeyboardDown(e), "aria-controls": this.ariaControls }, h("span", { key: 'fc99dd6ce60fc4217c08bb2e6caee86af03ce0ef', class: "duet-range-step-counter", part: "range-numbers" }, this.generateStepSize()), h("duet-action-button", { key: '26a0071c03bbe09f805729d62eb29f5242e8e3e1', disabled: this.disabled || this.buttonLeftDisabled, class: "duet-range-step-button duet-range-step-minus", onClick: e => this.handleClick(e, -1), id: this.leftBn, "accessible-label": `${this.ariaLabels.previous_increment} ${this.generatePreviousIncrementLabel()}`, ref: el => (this.leftBnRef = el), part: "navigation-arrow", iconName: "action-arrow-left-small", title: "" }), h("duet-action-button", { key: '92a518ce2e805c268afd621a058db60721f27c82', disabled: this.disabled || this.buttonRightDisabled, class: "duet-range-step-button duet-range-step-plus", onClick: e => this.handleClick(e, 1), "accessible-label": `${this.ariaLabels.next_increment} ${this.generateNextIncrementLabel()}`, id: this.rightBn, ref: el => (this.rightBnRef = el), part: "navigation-arrow", iconName: "action-arrow-right-small", title: "" })));
     }
     static get is() { return "duet-range-stepper"; }
     static get encapsulation() { return "shadow"; }

package/lib/collection/components/duet-scrollable/duet-scrollable.css

@@ -99,19 +99,10 @@
 :host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button--absolute:hover {
   border-color: rgb(0, 119, 179);
   border-width: 2px;
-  /* stylelint-disable */
-  /* too deep nesting */
-  /* stylelint-enable */
-}
-.duet-theme-turva :host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button--absolute:hover {
-  border-color: rgb(95, 122, 143);
 }
 :host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button[hidden] {
   display: none !important;
 }
-:host .duet-scrollable-items.duet-theme-turva .duet-scrollable-button-container .duet-scrollable-button--absolute:hover {
-  border-color: rgb(95, 122, 143);
-}
 :host .duet-scrollable-items .duet-scrollable-list {
   display: flex;
   flex-wrap: nowrap;
@@ -210,9 +201,10 @@
   transition: transform 0.2s ease-in-out, -webkit-transform 0.2s ease-in-out;
 }
 
-:host(.duet-theme-turva2) .duet-theme-turva .duet-scrollable-button-container .duet-scrollable-button--absolute:hover {
+.duet-theme-turva .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button--absolute:hover {
   border-color: rgb(120, 145, 164);
 }
-:host(.duet-theme-turva2) .duet-scrollable-items.duet-theme-turva .duet-scrollable-button-container .duet-scrollable-button--absolute:hover {
+
+.duet-scrollable-items.duet-theme-turva .duet-scrollable-button-container .duet-scrollable-button--absolute:hover {
   border-color: rgb(120, 145, 164);
 }

package/lib/collection/components/duet-scrollable/duet-scrollable.js

@@ -284,18 +284,18 @@ export class DuetScrollable {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: 'fd00a29320acf14495b6cc383e0ceac6bb267a0e', class: {
+        return (h(Host, { key: '16f256474e4e15cf219acd7edf26401ca3a99ea6', class: {
                 "duet-theme-turva": this.theme === "turva",
                 "duet-theme-default": this.theme === "default",
-            } }, this.hasCollapseButtonLabelSlot && (h("div", { key: '8a3d00551da83c08794cafd75727e6f682600d19', class: {
+            } }, this.hasCollapseButtonLabelSlot && (h("div", { key: '7fa6f84d8f02d4e8b816eda4631bcad05167223f', class: {
                 collapse: true,
                 hide: !this.needsScrolling && !this.collapsed,
-            } }, h("duet-button", { key: '691a9be72f9c971c8f5e2b9c1a1d6a22a6febb88', variation: "plain", margin: "none", "center-text": true, onClick: () => this.collapsedOnClick() }, h("slot", { key: '68d9e51dc211956f2c10d3734141b322203e2ca7', name: "collapse-button-label" })))), h("div", { key: 'e1768395848d8ea4bf20b2c628cc00aeca6646a2', class: {
+            } }, h("duet-button", { key: 'f8675f4274380f1a463ca4a868151eb76dc721b0', variation: "plain", margin: "none", "center-text": true, onClick: () => this.collapsedOnClick() }, h("slot", { key: 'f259fcf694c93dc3759a4e1dcbf119e7db86e75b', name: "collapse-button-label" })))), h("div", { key: '01b0c8a9e4ba8eda9bacbc00702eda03f01cf683', class: {
                 "duet-scrollable-items": true,
                 buttons: this.buttons,
                 center: this.center,
                 "duet-theme-turva": this.theme === "turva",
-            } }, this.buttons && this.renderButton("left"), h("div", { key: 'a50c86bb57036bb9eab884d9244956e5816e234c', class: {
+            } }, this.buttons && this.renderButton("left"), h("div", { key: 'a6f3a782485f864dad9e40ddc032f982c6c7073b', class: {
                 "duet-scrollable-list": true,
                 [`duet-scrollable-list--${this.buttonPosition}`]: true,
                 [`gap-${this.gap}`]: true,
@@ -303,7 +303,7 @@ export class DuetScrollable {
                 [`duet-overflow-padding--${this.padding}`]: this.padding !== "none",
                 [`duet-scrollable-list--${this.buttonPosition}`]: this.buttonPosition === "absolute",
                 "duet-scrollable-stretch": this.stretch,
-            }, onScroll: () => this.updateScrollButtons(), ref: element => (this.scrollPaneElement = element) }, h("slot", { key: 'b99ed10afd59b8ef4ffea3951ca0d335ed52c310' })), this.buttons && this.renderButton("right"))));
+            }, onScroll: () => this.updateScrollButtons(), ref: element => (this.scrollPaneElement = element) }, h("slot", { key: 'e17345b0845d35318c50ee82b7133b0f81bbac42' })), this.buttons && this.renderButton("right"))));
     }
     static get is() { return "duet-scrollable"; }
     static get encapsulation() { return "shadow"; }

package/lib/collection/components/duet-section-layout/duet-section-layout.js

@@ -24,13 +24,13 @@ export class DuetSectionLayout {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: '9b2ea75aa797ae1badc733580e0f8ad0d3db6010', class: {
+        return (h(Host, { key: '9e09c3c920b112b5c93c5ad6d7fa58c9c72d2bc5', class: {
                 "duet-middle": this.middle,
                 "duet-ie": isInternetExplorer(),
-            } }, h("div", { key: 'bc1417fc0201040e305cc32b699694c69f36087a', class: { "duet-layout-wrapper": true, "duet-m-0": this.margin === "none" } }, h("div", { key: '49cf06846048f0f226bb74554237a6354b5b4ad9', class: {
+            } }, h("div", { key: '1610e2a09eab2ce70922b6ad5c636acc12a8791a', class: { "duet-layout-wrapper": true, "duet-m-0": this.margin === "none" } }, h("div", { key: '8a76c865f526d670f1fb859adcdb84832479d9c6', class: {
                 "duet-layout": true,
                 [`padding-${this.paddingBreakpoint}`]: !!this.paddingBreakpoint,
-            } }, h("section", { key: '1fe3edda6be4885c2f3ce77653be77a93eab99e9', class: "duet-main" }, h("slot", { key: '700992a648447722a971e96771b19cfb85d97802' }))))));
+            } }, h("section", { key: '0f91daf6934b0c2d52ede50277a47885e80ede10', class: "duet-main" }, h("slot", { key: '6998a473041513c5adbf796fe5c2ecaa3e436887' }))))));
     }
     static get is() { return "duet-section-layout"; }
     static get encapsulation() { return "shadow"; }

package/lib/collection/components/duet-select/duet-select.css

@@ -185,9 +185,6 @@ duet-tooltip,
   font-weight: 400;
   line-height: 1.25;
 }
-.duet-theme-turva .duet-select-wrapper {
-  font-family: "turva-sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
-}
 .duet-select-variation-tiny .duet-select-wrapper {
   width: 81px;
   padding: 0 !important;
@@ -214,68 +211,52 @@ duet-tooltip,
   border: 0;
   opacity: 0;
 }
-.duet-theme-turva .duet-select-wrapper select {
-  font-family: "turva-sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
-}
-.duet-select-wrapper select:hover + .duet-select {
+.duet-select-wrapper select:hover:not(:focus) + .duet-select {
   outline: 2px solid;
-  outline-color: rgb(98, 121, 138);
+  outline-color: rgb(127, 150, 165) !important;
   outline-offset: -1px;
-  border-color: rgb(127, 150, 165);
-}
-.duet-theme-turva .duet-select-wrapper select:hover + .duet-select, .duet-select-wrapper select:hover + .duet-select.duet-theme-turva, .duet-theme-turva2 .duet-select-wrapper select:hover + .duet-select, .duet-select-wrapper select:hover + .duet-select.duet-theme-turva2 {
-  outline-color: rgb(120, 145, 164);
 }
-.duet-theme-turva .duet-select-wrapper select:hover + .duet-select {
-  border-color: rgb(120, 145, 164);
+.duet-theme-turva .duet-select-wrapper select:hover:not(:focus) + .duet-select, .duet-select-wrapper select:hover:not(:focus) + .duet-select.duet-theme-turva {
+  outline-color: rgb(120, 145, 164) !important;
 }
-.has-error .duet-select-wrapper select:hover + .duet-select {
-  outline: 1px solid;
-  outline-color: rgb(214, 28, 82);
+.has-error .duet-select-wrapper select:hover:not(:focus) + .duet-select {
   outline-offset: -1px;
+  background-color: rgb(255, 240, 243) !important;
+  border-color: rgb(214, 28, 82) !important;
+  outline-width: 2px;
+  outline-color: rgb(214, 28, 82) !important;
 }
 .duet-select-wrapper select:focus + .duet-select {
   outline: 2px solid;
   outline-offset: 0;
   outline-color: rgba(0, 119, 179, 0.8);
-  border-color: rgb(0, 119, 179);
-  transition: none;
 }
-.duet-theme-turva .duet-select-wrapper select:focus + .duet-select, .duet-select-wrapper select:focus + .duet-select.duet-theme-turva, .duet-theme-turva2 .duet-select-wrapper select:focus + .duet-select, .duet-select-wrapper select:focus + .duet-select.duet-theme-turva2 {
+.duet-theme-turva .duet-select-wrapper select:focus + .duet-select, .duet-select-wrapper select:focus + .duet-select.duet-theme-turva {
   outline-color: rgba(53, 79, 101, 0.8);
 }
-.duet-theme-turva .duet-select-wrapper select:focus + .duet-select {
-  border-color: rgb(23, 42, 59);
-}
-.duet-theme-turva .duet-select-wrapper select:focus + .duet-select .duet-select-icon {
-  color: rgb(23, 42, 59);
-}
 .duet-select-wrapper select:focus + .duet-select .duet-select-icon {
   color: rgb(0, 119, 179);
 }
 .has-error .duet-select-wrapper select:focus + .duet-select {
-  outline: 1px solid;
-  outline-color: rgb(214, 28, 82);
   outline-offset: -1px;
+  background-color: rgb(255, 240, 243) !important;
+  border-color: rgb(214, 28, 82) !important;
+  outline-width: 2px;
+  outline-color: rgb(214, 28, 82) !important;
+  background: rgb(255, 255, 255) !important;
 }
 .duet-select-wrapper select[disabled] {
   cursor: default !important;
 }
 .duet-select-wrapper select[disabled] + .duet-select {
-  color: rgb(8, 42, 77) !important;
-  cursor: default !important;
+  color: rgb(127, 150, 165) !important;
+  cursor: not-allowed !important;
   outline: none !important;
   background: rgb(245, 248, 250) !important;
-  border-color: rgb(245, 248, 250) !important;
+  border-color: rgb(181, 198, 208) !important;
   opacity: 1 !important;
   -webkit-text-fill-color: rgb(8, 42, 77) !important;
 }
-.duet-theme-turva .duet-select-wrapper select[disabled] + .duet-select {
-  color: rgb(23, 42, 59) !important;
-  background: rgb(245, 246, 247) !important;
-  border-color: rgb(245, 246, 247) !important;
-  -webkit-text-fill-color: rgb(23, 42, 59) !important;
-}
 .duet-select-wrapper span.duet-keep-container-height {
   opacity: 0;
 }
@@ -308,25 +289,15 @@ duet-tooltip,
   background: rgb(255, 255, 255);
   border: 1px solid rgb(127, 150, 165);
   border-radius: 4px;
-  transition: 150ms ease;
 }
 .has-error .duet-select {
+  outline-offset: -1px;
+  background-color: rgb(255, 240, 243) !important;
   border-color: rgb(214, 28, 82) !important;
 }
 .has-error .duet-select .duet-select-icon {
   color: rgb(214, 28, 82) !important;
 }
-.duet-theme-turva.has-error .duet-select {
-  border-color: rgb(214, 28, 82) !important;
-}
-.duet-theme-turva.has-error .duet-select .duet-select-icon {
-  color: rgb(214, 28, 82) !important;
-}
-.duet-theme-turva .duet-select {
-  font-family: "turva-sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
-  color: rgb(23, 42, 59);
-  border-color: rgb(120, 145, 164);
-}
 .duet-select svg {
   position: absolute;
   top: 50%;
@@ -338,9 +309,6 @@ duet-tooltip,
   pointer-events: none;
   transform: translateY(-50%);
 }
-.duet-theme-turva .duet-select svg {
-  color: rgb(23, 42, 59);
-}
 .duet-select-variation-tiny .duet-select, .duet-select-variation-compact .duet-select {
   width: 72px;
   min-width: inherit;
@@ -376,16 +344,9 @@ duet-tooltip,
   display: block;
   margin-top: 8px;
 }
-.duet-theme-turva .duet-select-help {
-  font-family: "turva-sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
-  color: rgb(120, 145, 164);
-}
 .has-error .duet-select-help {
   color: rgb(214, 28, 82);
 }
-.duet-theme-turva.has-error .duet-select-help {
-  color: rgb(214, 28, 82);
-}
 
 .duet-label-hidden .duet-internal-label {
   position: absolute;
@@ -398,25 +359,27 @@ duet-tooltip,
   clip: rect(0 0 0 0);
 }
 
-:host(.duet-theme-turva2) .duet-theme-turva .duet-select-wrapper select:hover + .duet-select {
-  border-color: rgb(120, 145, 164);
-}
-:host(.duet-theme-turva2) .duet-theme-turva .duet-select-wrapper select:focus + .duet-select {
-  border-color: rgb(23, 42, 59);
+.duet-theme-turva .duet-select-wrapper {
+  font-family: "turva-sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-select-wrapper select:focus + .duet-select .duet-select-icon {
+.duet-theme-turva .duet-select-wrapper select:focus + .duet-select .duet-select-icon {
   color: rgb(23, 42, 59);
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-select-wrapper select[disabled] + .duet-select {
-  color: rgb(23, 42, 59) !important;
-  background: rgb(245, 246, 247) !important;
-  border-color: rgb(245, 246, 247) !important;
-  -webkit-text-fill-color: rgb(23, 42, 59) !important;
+.duet-theme-turva.has-error .duet-select .duet-select-icon {
+  color: rgb(214, 28, 82) !important;
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-select {
+.duet-theme-turva .duet-select {
+  font-family: "turva-sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
   color: rgb(23, 42, 59);
   border-color: rgb(120, 145, 164);
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-select svg {
+.duet-theme-turva .duet-select svg {
   color: rgb(23, 42, 59);
+}
+.duet-theme-turva .duet-select-help {
+  font-family: "turva-sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  color: rgb(120, 145, 164);
+}
+.duet-theme-turva.has-error .duet-select-help {
+  color: rgb(214, 28, 82);
 }