@duetds/components 10.2.4 → 10.3.0

package/lib/collection/components/duet-table/duet-table-styles.js

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { colorGrayDarker, colorGrayDarkerTurva, colorGrayDarkTurva, colorGrayLight, colorGrayLightest, colorGrayLightTurva, colorPrimary, colorSecondary, colorSecondaryTurva, fontFamilyText, fontFamilyTextTurva, fontSizeMedium, fontWeightSemiBold, lineHeightSmall, mediaQueryXSmall, spaceLarge, spaceMedium, spaceSmall, spaceXxSmall, } from "@duetds/tokens";
+import { colorGrayDarkTurva, colorGrayDarker, colorGrayDarkerTurva, colorGrayLight, colorGrayLightest, colorGrayLightTurva, colorPrimary, colorSecondary, colorSecondaryTurva, colorTurvaGray900, fontFamilyText, fontFamilyTextTurva, fontSizeMedium, fontWeightSemiBold, lineHeightSmall, mediaQueryXSmall, spaceLarge, spaceMedium, spaceSmall, spaceXxSmall, } from "@duetds/tokens";
 const rgbable = (value) => {
     return value.replace("rgb(", "").replace(")", "");
 };
@@ -63,20 +63,12 @@ duet-table {
     }
   }
 
-  &.duet-theme-turva table {
-    font-family: ${fontFamilyTextTurva};
-  }
-
   td {
     -webkit-hyphens: auto;
     hyphens: auto;
     color: ${colorSecondary};
   }
 
-  &.duet-theme-turva td {
-    color: ${colorSecondaryTurva};
-  }
-
   th {
     font-weight: ${fontWeightSemiBold};
     line-height: ${lineHeightSmall};
@@ -84,19 +76,11 @@ duet-table {
     text-align: left;
   }
 
-  &.duet-theme-turva th {
-    color: ${colorGrayDarkTurva};
-  }
-
   tbody th {
     font-weight: ${fontWeightSemiBold};
     color: ${colorSecondary};
   }
 
-  &.duet-theme-turva tbody th {
-    color: ${colorSecondaryTurva};
-  }
-
   & .duet-table-action-row {
     & td:last-child {
       justify-self: end;
@@ -148,10 +132,6 @@ duet-table {
     }
   }
 
-  &.duet-theme-turva td span.duet-table-cell-heading {
-    color: ${colorSecondaryTurva};
-  }
-
   tbody td,
   tbody th,
   tfoot td {
@@ -191,10 +171,6 @@ duet-table {
     thead th {
       border-bottom: 1px solid ${colorGrayLight};
     }
-
-    &.duet-theme-turva thead th {
-      border-bottom-color: ${colorGrayLightTurva};
-    }
   }
 
   tbody:not(:first-of-type) th {
@@ -205,26 +181,14 @@ duet-table {
     background: rgba(4, 81, 128, 0.04);
   }
 
-  &.duet-theme-turva tbody:only-of-type tr:nth-of-type(odd) {
-    background: rgba(${rgbable(colorSecondaryTurva)}, 0.04);
-  }
-
   tbody:not(:only-of-type) tr:nth-of-type(even) {
     background: rgba(4, 81, 128, 0.04);
   }
 
-  &.duet-theme-turva tbody:not(:only-of-type) tr:nth-of-type(even) {
-    background: rgba(${rgbable(colorSecondaryTurva)}, 0.04);
-  }
-
   tfoot td {
     border-top: 1px solid ${colorGrayLight};
   }
 
-  &.duet-theme-turva tfoot td {
-    border-top-color: ${colorGrayLightTurva};
-  }
-
   &.duet-table-flattened {
     tbody:not(:first-of-type) th {
       padding-top: ${spaceLarge} !important;
@@ -243,10 +207,6 @@ duet-table {
         border-top: 1px solid ${colorGrayLight};
       }
     }
-
-    &.duet-theme-turva tfoot tr {
-      border-top-color: ${colorGrayLightTurva};
-    }
   }
 }
 
@@ -264,19 +224,13 @@ duet-table {
     }
   }
 
-  &.duet-theme-turva th {
-    border-bottom-color: ${colorGrayDarkerTurva};
-  }
+  
 
   tbody th {
     padding-top: calc(${spaceLarge} * 2) !important;
     border-bottom-color: ${colorGrayLight};
   }
 
-  &.duet-theme-turva tbody th {
-    border-bottom-color: ${colorGrayLightTurva};
-  }
-
   td {
     padding: ${spaceMedium} !important;
 
@@ -293,10 +247,6 @@ duet-table {
     border-bottom: 1px solid ${colorGrayLight};
   }
 
-  &.duet-theme-turva tbody td {
-    border-bottom-color: ${colorGrayLightTurva};
-  }
-
   &.duet-table-flattened {
     tbody:first-of-type th {
       padding-top: 0 !important;
@@ -331,10 +281,6 @@ duet-table {
     tbody tr {
       border-bottom: 1px solid ${colorGrayLight};
     }
-
-    &.duet-theme-turva tbody tr {
-      border-bottom-color: ${colorGrayLightTurva};
-    }
   }
 }
 
@@ -364,10 +310,6 @@ duet-table {
     tfoot {
       border-top: 1px solid ${colorGrayLight};
     }
-
-    &.duet-theme-turva tfoot {
-      border-top-color: ${colorGrayLightTurva};
-    }
   }
 }
 
@@ -398,10 +340,6 @@ duet-table {
     tfoot {
       border-top: 1px solid ${colorGrayLight};
     }
-
-    &.duet-theme-turva tfoot {
-      border-top-color: ${colorGrayLightTurva};
-    }
   }
 }
 .duet-table-scrollable {
@@ -416,10 +354,6 @@ duet-table {
 
 .duet-table-selected-column {
   background: rgba(${rgbable(colorPrimary)}, 0.08);
-
-  .duet-theme-turva & {
-    background: rgba(${rgbable(colorGrayDarkerTurva)}, 0.08);
-  }
 }
 
 .duet-table-sortable {
@@ -432,10 +366,6 @@ duet-table {
     tfoot {
       border-top: 1px solid ${colorGrayLight};
     }
-
-    &.duet-theme-turva tfoot {
-      border-top-color: ${colorGrayLightTurva};
-    }
   }
 }
 
@@ -479,66 +409,92 @@ duet-table {
       grid-column: 2;
     }
   }
+}
+  
+duet-table.duet-theme-turva table {
+  font-family: ${fontFamilyTextTurva};
+}
 
-  duet-table.duet-theme-turva2 {
-    &.duet-theme-turva td {
-      color: $color-turva2-gray-900;
-    }
+duet-table.duet-theme-turva td {
+  color: ${colorTurvaGray900};
+}
 
-    &.duet-theme-turva tbody th {
-      color: $color-turva2-gray-900;
-    }
+duet-table.duet-theme-turva th {
+  color: ${colorGrayDarkTurva};
+}
 
-    &.duet-table-striped.duet-theme-turva.duet-table-sticky thead {
-      th,
-      td {
-        border-bottom-color: $color-turva-nude-100;
-      }
-    }
+duet-table.duet-theme-turva tbody th {
+  color: ${colorTurvaGray900};
+}
 
-    &.duet-table-striped.duet-theme-turva tbody:only-of-type tr:nth-of-type(odd) {
-      background: rgba($color-turva2-gray-900, 0.04);
-    }
+duet-table.duet-theme-turva td span.duet-table-cell-heading {
+  color: ${colorSecondaryTurva};
+}
 
-    &.duet-table-striped.duet-theme-turva tbody:not(:only-of-type) tr:nth-of-type(even) {
-      background: rgba($color-turva2-gray-900, 0.04);
-    }
+duet-table.duet-table-striped.duet-theme-turva.duet-table-sticky thead {
+  th,
+  td {
+    border-bottom-color: ${colorGrayLightTurva};
+  }
+}
 
-    &.duet-table-striped.duet-theme-turva tfoot td {
-      border-top-color: $color-turva-nude-100;
-    }
+duet-table.duet-table-striped.duet-theme-turva tbody:only-of-type tr:nth-of-type(odd) {
+  background: rgba(${rgbable(colorTurvaGray900)}, 0.04);
+}
 
-    &.duet-table-striped.duet-table-flattened.duet-theme-turva tfoot tr {
-      border-top-color: $color-turva-nude-100;
-    }
+duet-table.duet-table-striped.duet-theme-turva tbody:not(:only-of-type) tr:nth-of-type(even) {
+  background: rgba(${rgbable(colorTurvaGray900)}, 0.04);
+}
 
-    &.duet-table-plain.duet-theme-turva tbody {
-      th,
-      td {
-        border-bottom-color: $color-turva-nude-100;
-      }
-    }
+duet-table.duet-table-striped.duet-theme-turva tfoot td {
+  border-top-color: ${colorGrayLightTurva};
+}
 
-    &.duet-table-plain.duet-theme-turva tbody td {
-      border-bottom-color: $color-turva-nude-100;
-    }
+duet-table.duet-table-striped.duet-table-flattened.duet-theme-turva tfoot tr {
+  border-top-color: ${colorGrayLightTurva};
+}
 
-    &.duet-table-plain.duet-table-flattened.duet-theme-turva tbody tr {
-      border-bottom-color: $color-turva-nude-100;
-    }
+duet-table.duet-table-plain.duet-theme-turva tbody {
+  th,
+  td {
+    border-bottom-color: ${colorGrayLightTurva};
+  }
+}
 
-    &.duet-table-minimal.duet-table-flattened.duet-theme-turva tfoot {
-      border-top-color: $color-turva-nude-100;
-    }
+duet-table.duet-table-plain.duet-theme-turva tbody td {
+  border-bottom-color: ${colorGrayLightTurva};
+}
 
-    &.duet-table-fixed.duet-theme-turva:not(.duet-table-flattened) tfoot {
-      border-top-color: $color-turva-nude-100;
-    }
+duet-theme-turva.duet-table-plain th, duet-theme-turva.duet-table-fixed th, duet-theme-turva.duet-table-minimal th {
+  border-bottom-color: ${colorGrayDarkerTurva};
+}
 
-    &.duet-table-sortable.duet-theme-turva:not(.duet-table-flattened) tfoot {
-      border-top-color: $color-turva-nude-100;
-    }
-  }
+duet-theme-turva.duet-table-plain tbody th, duet-theme-turva.duet-table-fixed tbody th, duet-theme-turva.duet-table-minimal tbody th {
+  border-bottom-color: ${colorGrayLightTurva};
+}
+
+.duet-table-flattened.duet-table-plain.duet-theme-turva tbody tr {
+  border-bottom-color: ${colorGrayLightTurva};
+}
+
+.duet-theme-turva .duet-table-selected-column {
+  background: rgba(${rgbable(colorGrayDarkerTurva)}, 0.08);
+}
+
+duet-table.duet-table-plain.duet-table-flattened.duet-theme-turva tbody tr {
+  border-bottom-color: ${colorGrayLightTurva};
+}
+
+duet-table.duet-table-minimal.duet-table-flattened.duet-theme-turva tfoot {
+  border-top-color: ${colorGrayLightTurva};
+}
+
+duet-table.duet-table-fixed.duet-theme-turva:not(.duet-table-flattened) tfoot {
+  border-top-color: ${colorGrayLightTurva};
+}
+
+duet-table.duet-table-sortable.duet-theme-turva:not(.duet-table-flattened) tfoot {
+  border-top-color: ${colorGrayLightTurva};
 }
 `.replace(/[\n\r\t]/gm, "");
 export function createStyles(element) {

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

@@ -185,22 +185,14 @@ duet-tooltip,
   outline-offset: 0;
   outline-color: rgba(0, 119, 179, 0.8);
 }
-.duet-theme-turva .duet-textarea:focus, .duet-textarea:focus.duet-theme-turva, .duet-theme-turva2 .duet-textarea:focus, .duet-textarea:focus.duet-theme-turva2 {
+.duet-theme-turva .duet-textarea:focus, .duet-textarea:focus.duet-theme-turva, .duet-theme-turva .duet-textarea:focus, .duet-textarea:focus.duet-theme-turva {
   outline: 2px solid;
   outline-offset: 0;
   outline-color: rgba(53, 79, 101, 0.8);
 }
-.duet-theme-turva .duet-textarea {
-  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);
-}
 .has-error .duet-textarea {
   border-color: rgb(214, 28, 82) !important;
 }
-.duet-theme-turva.has-error .duet-textarea {
-  border-color: rgb(214, 28, 82) !important;
-}
 .duet-textarea[rows] {
   min-height: auto;
 }
@@ -209,78 +201,46 @@ duet-tooltip,
   opacity: 1 !important;
   transition: color 300ms ease;
 }
-.duet-theme-turva .duet-textarea::-webkit-input-placeholder {
-  color: rgb(120, 145, 164);
-}
 .duet-textarea:focus::-webkit-input-placeholder {
   color: rgb(181, 198, 208);
 }
-.duet-theme-turva .duet-textarea:focus::-webkit-input-placeholder {
-  color: rgb(178, 194, 205);
-}
 .duet-textarea::-moz-placeholder {
   color: rgb(98, 121, 138);
   opacity: 1 !important;
 }
-.duet-theme-turva .duet-textarea::-moz-placeholder {
-  color: rgb(120, 145, 164);
-}
 .duet-textarea:focus::-moz-placeholder {
   color: rgb(181, 198, 208);
 }
-.duet-theme-turva .duet-textarea:focus::-moz-placeholder {
-  color: rgb(178, 194, 205);
-}
 .duet-textarea:-ms-input-placeholder {
   color: rgb(98, 121, 138);
 }
-.duet-theme-turva .duet-textarea:-ms-input-placeholder {
-  color: rgb(120, 145, 164);
-}
 .duet-textarea:focus:-ms-input-placeholder {
   color: rgb(181, 198, 208);
 }
-.duet-theme-turva .duet-textarea:focus:-ms-input-placeholder {
-  color: rgb(178, 194, 205);
-}
 .duet-textarea[disabled] {
   color: rgb(98, 121, 138) !important;
   cursor: not-allowed !important;
   background: rgb(245, 248, 250) !important;
   border-color: rgb(245, 248, 250) !important;
 }
-.duet-theme-turva .duet-textarea[disabled] {
-  color: rgb(120, 145, 164) !important;
-  background: rgb(245, 246, 247) !important;
-  border-color: rgb(245, 246, 247) !important;
-}
 .duet-textarea[disabled]::-webkit-input-placeholder {
   color: rgb(8, 42, 77);
   opacity: 1 !important;
   transition: color 300ms ease;
 }
-.duet-theme-turva .duet-textarea[disabled]::-webkit-input-placeholder {
-  color: rgb(23, 42, 59);
-}
 .duet-textarea[disabled]::-moz-placeholder {
   color: rgb(8, 42, 77);
   opacity: 1 !important;
 }
-.duet-theme-turva .duet-textarea[disabled]::-moz-placeholder {
-  color: rgb(23, 42, 59);
-}
 .duet-textarea[disabled]:-ms-input-placeholder {
   color: rgb(8, 42, 77);
 }
-.duet-theme-turva .duet-textarea[disabled]:-ms-input-placeholder {
-  color: rgb(23, 42, 59);
-}
 .duet-textarea:hover:not(:disabled) {
   outline: 2px solid;
   outline-color: rgb(98, 121, 138);
   outline-offset: -1px;
 }
-.duet-theme-turva .duet-textarea:hover:not(:disabled), .duet-textarea:hover:not(:disabled).duet-theme-turva, .duet-theme-turva2 .duet-textarea:hover:not(:disabled), .duet-textarea:hover:not(:disabled).duet-theme-turva2 {
+.duet-theme-turva .duet-textarea:hover:not(:disabled), .duet-textarea:hover:not(:disabled).duet-theme-turva, .duet-theme-turva .duet-textarea:hover:not(:disabled), .duet-textarea:hover:not(:disabled).duet-theme-turva {
   outline-color: rgb(120, 145, 164);
 }
 .has-error .duet-textarea:hover:not(:disabled) {
@@ -292,9 +252,6 @@ duet-tooltip,
   border-color: rgb(0, 119, 179);
   transition: none;
 }
-.duet-theme-turva .duet-textarea:focus {
-  border-color: rgb(23, 42, 59);
-}
 .has-error .duet-textarea:focus {
   outline: 1px solid;
   outline-color: rgb(214, 28, 82);
@@ -313,16 +270,9 @@ duet-tooltip,
   display: block;
   margin-top: 8px;
 }
-.duet-theme-turva .duet-textarea-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-textarea-help {
   color: rgb(214, 28, 82);
 }
-.duet-theme-turva.has-error .duet-textarea-help {
-  color: rgb(214, 28, 82);
-}
 
 .duet-label-hidden .duet-internal-label {
   position: absolute;
@@ -340,34 +290,63 @@ duet-tooltip,
   margin: 8px 0 0 auto;
 }
 
-:host(.duet-theme-turva2) .duet-theme-turva .duet-textarea {
+.duet-theme-turva .duet-textarea {
+  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-theme-turva.has-error .duet-textarea {
+  border-color: rgb(214, 28, 82) !important;
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-textarea:focus {
+
+.duet-theme-turva .duet-textarea:focus {
   border-color: rgb(23, 42, 59);
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-textarea[disabled] {
+
+.duet-theme-turva .duet-textarea[disabled] {
+  color: rgb(120, 145, 164) !important;
   background: rgb(245, 246, 247) !important;
   border-color: rgb(245, 246, 247) !important;
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-textarea:-webkit-input-placeholder {
+
+.duet-theme-turva .duet-textarea:-webkit-input-placeholder {
   color: rgb(120, 145, 164);
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-textarea:focus::-webkit-input-placeholder {
+
+.duet-theme-turva .duet-textarea:focus {
+  border-color: rgb(23, 42, 59);
+}
+
+.duet-theme-turva .duet-textarea:focus::-webkit-input-placeholder {
   color: rgb(178, 194, 205);
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-textarea:focus::-moz-placeholder {
+
+.duet-theme-turva .duet-textarea:focus::-moz-placeholder {
   color: rgb(178, 194, 205);
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-textarea:focus:-ms-input-placeholder {
+
+.duet-theme-turva .duet-textarea:focus:-ms-input-placeholder {
   color: rgb(178, 194, 205);
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-textarea[disabled]::-webkit-input-placeholder {
+
+.duet-theme-turva .duet-textarea[disabled]::-webkit-input-placeholder {
   color: rgb(23, 42, 59);
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-textarea[disabled]::-moz-placeholder {
+
+.duet-theme-turva .duet-textarea[disabled]::-moz-placeholder {
   color: rgb(23, 42, 59);
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-textarea[disabled]:-ms-input-placeholder {
+
+.duet-theme-turva .duet-textarea[disabled]:-ms-input-placeholder {
   color: rgb(23, 42, 59);
+}
+
+.duet-theme-turva.has-error .duet-textarea-help {
+  color: rgb(214, 28, 82);
+}
+
+.duet-theme-turva .duet-textarea-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);
 }

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

@@ -147,24 +147,14 @@
   background-color: rgb(0, 119, 179);
   box-shadow: none;
 }
-.duet-theme-turva .duet-switch input:checked + .duet-slider {
-  background-color: rgb(230, 23, 64);
-}
 .duet-switch input:checked + .duet-slider::before {
   background-color: rgb(255, 255, 255);
   box-shadow: -1px 0 2px #004467;
   transform: translateX(20px);
 }
-.duet-theme-turva .duet-switch input:checked + .duet-slider::before {
-  background-color: rgb(255, 255, 255);
-  box-shadow: -1px 0 2px #890e26;
-}
 .duet-switch input:disabled + .duet-slider::before {
   box-shadow: none;
 }
-.duet-theme-turva .duet-switch input:disabled + .duet-slider::before {
-  box-shadow: none;
-}
 .duet-switch input:disabled:not(:checked) + .duet-slider {
   background: #bfcbd2;
 }
@@ -172,24 +162,15 @@
   background: rgb(255, 255, 255);
   box-shadow: none;
 }
-.duet-theme-turva .duet-switch input:disabled:not(:checked) + .duet-slider {
-  background: #bcc8d2;
-}
-.duet-theme-turva .duet-switch input:disabled:not(:checked) + .duet-slider::before {
-  background: rgb(255, 255, 255);
-}
 .duet-switch input:disabled:checked + .duet-slider {
   background: #80bbd9;
 }
-.duet-theme-turva .duet-switch input:disabled:checked + .duet-slider {
-  background: #f38ba0;
-}
 :host(.user-is-tabbing) .duet-switch input:focus + .duet-slider {
   outline: 2px solid;
   outline-offset: 2px;
   outline-color: rgba(0, 119, 179, 0.8);
 }
-.duet-theme-turva :host(.user-is-tabbing) .duet-switch input:focus + .duet-slider, :host(.user-is-tabbing) .duet-switch input:focus + .duet-slider.duet-theme-turva, .duet-theme-turva2 :host(.user-is-tabbing) .duet-switch input:focus + .duet-slider, :host(.user-is-tabbing) .duet-switch input:focus + .duet-slider.duet-theme-turva2 {
+.duet-theme-turva :host(.user-is-tabbing) .duet-switch input:focus + .duet-slider, :host(.user-is-tabbing) .duet-switch input:focus + .duet-slider.duet-theme-turva, .duet-theme-turva :host(.user-is-tabbing) .duet-switch input:focus + .duet-slider, :host(.user-is-tabbing) .duet-switch input:focus + .duet-slider.duet-theme-turva {
   outline-color: rgba(53, 79, 101, 0.8);
 }
 
@@ -225,13 +206,6 @@
 .duet-toggle-is-disabled .duet-slider {
   cursor: not-allowed;
 }
-.duet-theme-turva .duet-slider {
-  background-color: rgb(120, 145, 164);
-}
-.duet-theme-turva .duet-slider::before {
-  background-color: rgb(255, 255, 255);
-  box-shadow: 1px 0 2px 0 #00334d;
-}
 
 duet-spinner {
   margin: 2px;
@@ -250,13 +224,32 @@ duet-spinner {
   clip: rect(1px, 1px, 1px, 1px) !important;
 }
 
-:host(.duet-theme-turva2) .duet-switch input:checked + .duet-slider {
+.duet-theme-turva .duet-switch input:checked + .duet-slider {
   background-color: rgb(230, 23, 64);
 }
-:host(.duet-theme-turva2) .duet-switch input:checked + .duet-slider::before {
+.duet-theme-turva .duet-switch input:checked + .duet-slider::before {
   box-shadow: -1px 0 2px #890e26;
   transform: translateX(20px);
 }
-:host(.duet-theme-turva2) .duet-switch input:disabled:checked + .duet-slider {
+.duet-theme-turva .duet-switch input:disabled:checked + .duet-slider {
+  background: #f38ba0;
+}
+.duet-theme-turva .duet-switch input:disabled + .duet-slider::before {
+  box-shadow: none;
+}
+.duet-theme-turva .duet-switch input:disabled:not(:checked) + .duet-slider {
+  background: #bcc8d2;
+}
+.duet-theme-turva .duet-switch input:disabled:not(:checked) + .duet-slider::before {
+  background: rgb(255, 255, 255);
+}
+.duet-theme-turva .duet-switch input:disabled:checked + .duet-slider {
   background: #f38ba0;
+}
+.duet-theme-turva .duet-slider {
+  background-color: rgb(120, 145, 164);
+}
+.duet-theme-turva .duet-slider::before {
+  background-color: rgb(255, 255, 255);
+  box-shadow: 1px 0 2px 0 #00334d;
 }

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

@@ -130,7 +130,7 @@ export class DuetToggle {
                 "duet-label-hidden": this.labelHidden,
                 "duet-toggle-is-disabled": this.disabled,
                 "duet-toggle-is-loading": this.loading,
-            } }, h(DuetInternalLabel, { key: '9332567db03213ffaa47ff809c83df430d5b1241', theme: this.theme, color: this.labelColor, weight: this.labelWeight, for: identifier, margin: this.labelPosition === "top" ? "auto" : "none" }, this.label), h("label", { key: '2889a221df7d22b8186a4e2a292df66ea9796628', class: "duet-switch" }, h("input", { key: 'ca4bbc240033d01dd7add7cb672b01bd3f0270fa', type: "checkbox", value: this.value, "aria-controls": this.accessibleControls, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": this.accessibleDescribedBy, "aria-labelledby": this.accessibleLabelledBy, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, id: identifier, role: this.role, name: this.name, checked: this.checked, required: this.required, disabled: this.disabled || this.loading, ref: input => (this.nativeInput = input) }), h("div", { key: '2b8e0241c308d29fbe2221339330435d9de10005', class: "duet-slider" }), this.loading && h("duet-spinner", { key: 'eac8158c7199fba2c9e0d889a123d17602287078', color: "primary" }))), this.loading && (h("duet-visually-hidden", { key: 'f17522d306a05c84cad96f4e578023e2474d0e75', "aria-live": "polite" }, this.accessibleLabelLoading || DuetStringsLoadingDefaults[getLanguage()])), this.loadingComplete && (h("duet-visually-hidden", { key: '78095e04eab17679c9ef68ba25d84b027a4e89a8', "aria-live": "polite" }, this.accessibleLabelComplete || DuetStringsCompleteDefaults[getLanguage()]))));
+            } }, h(DuetInternalLabel, { key: '9332567db03213ffaa47ff809c83df430d5b1241', theme: this.theme, color: this.labelColor, weight: this.labelWeight, for: identifier, margin: this.labelPosition === "top" ? "auto" : "none" }, this.label), h("div", { key: '33454fd79ca7bd7b3a4299168670314b405f7714', class: "duet-switch" }, h("input", { key: '9348a34ee41b6a0d0f87b195b18017027060458c', type: "checkbox", value: this.value, "aria-controls": this.accessibleControls, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": this.accessibleDescribedBy, "aria-labelledby": this.accessibleLabelledBy, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, id: identifier, role: this.role, name: this.name, checked: this.checked, required: this.required, disabled: this.disabled || this.loading, ref: input => (this.nativeInput = input) }), h("div", { key: '13e7568ae9a6908846376af469bc49eeb628d1d9', class: "duet-slider" }), this.loading && h("duet-spinner", { key: '7792ecc0f2cb3088d610d056a832f8014a58cd7a', color: "primary" }))), this.loading && (h("duet-visually-hidden", { key: 'c85ca8652e522b36dd5f41cf68e3737e653797d5', "aria-live": "polite" }, this.accessibleLabelLoading || DuetStringsLoadingDefaults[getLanguage()])), this.loadingComplete && (h("duet-visually-hidden", { key: '56b6fd4c32315ca57250176bb996a86b06e1b3f0', "aria-live": "polite" }, this.accessibleLabelComplete || DuetStringsCompleteDefaults[getLanguage()]))));
     }
     static get is() { return "duet-toggle"; }
     static get encapsulation() { return "shadow"; }

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

@@ -67,22 +67,18 @@
 .duet-toolbar.secondary .container {
   border-bottom: 0;
 }
+
 .duet-toolbar.duet-theme-turva {
   background: rgb(255, 255, 255);
 }
+
 .duet-toolbar.duet-theme-turva .container {
-  border-bottom: 1px solid rgb(212, 221, 226);
+  border-bottom: 1px solid rgb(251, 225, 209);
 }
+
 .duet-toolbar.duet-theme-turva.primary {
   background: rgb(230, 23, 64);
 }
 .duet-toolbar.duet-theme-turva.primary .container {
   border-bottom: 0;
-}
-
-:host(.duet-theme-turva2) .duet-toolbar.duet-theme-turva .container {
-  border-bottom-color: rgb(251, 225, 209);
-}
-:host(.duet-theme-turva2) .duet-toolbar.duet-theme-turva.primary {
-  background: rgb(230, 23, 64);
 }