refactor(ui): localize component styles

packages/ui/components/switch.wrn

@@ -39,4 +39,48 @@ component Switch {
       {#if helperText}<small class="wire-next__field-help">{helperText}</small>{/if}<small class="wire-next__field-error" data-error="{name}">{error}</small>
     </div>
   }
+
+  style {
+    .wire-next--switch input {
+      appearance: none;
+      position: relative;
+      width: 2.5rem;
+      height: 1.4rem;
+      border: 1px solid var(--wire-color-border);
+      border-radius: 999px;
+      background: var(--wire-color-surface-2);
+      transition: background var(--wire-motion-fast) var(--wire-ease-standard);
+    }
+
+    .wire-next--switch {
+      min-height: 2.65rem;
+      justify-content: flex-start;
+    }
+
+    .wire-next--switch > span:last-child {
+      line-height: 1.35;
+    }
+
+    .wire-next--switch input::after {
+      position: absolute;
+      top: 0.15rem;
+      left: 0.15rem;
+      width: 1rem;
+      height: 1rem;
+      border-radius: 999px;
+      background: var(--wire-color-text);
+      content: "";
+      transition: transform var(--wire-motion-fast) var(--wire-ease-standard);
+    }
+
+    .wire-next--switch input:checked {
+      border-color: var(--wire-field-color);
+      background: var(--wire-field-color);
+    }
+
+    .wire-next--switch input:checked::after {
+      background: var(--wire-color-primary-contrast, #fff);
+      transform: translateX(1.1rem);
+    }
+  }
 }