@prokodo/ui 1.0.4 → 1.0.5

package/dist/components/snackbar/Snackbar.css

@@ -124,6 +124,42 @@
  * This mixin specifies basic text-styles for components that render a richtext
  * content.
  */
+.prokodo-SnackbarProvider {
+  position: fixed;
+  z-index: 1400;
+  display: flex;
+  flex-direction: column;
+  gap: var(--pk-space-sm);
+  width: -moz-max-content;
+  width: max-content;
+  max-width: min(480px, 100vw - var(--pk-space-xl) * 2);
+  pointer-events: none;
+}
+.prokodo-SnackbarProvider > * {
+  pointer-events: auto;
+}
+.prokodo-SnackbarProvider--is-top {
+  top: var(--pk-space-lg);
+  bottom: auto;
+}
+.prokodo-SnackbarProvider--is-bottom {
+  bottom: var(--pk-space-lg);
+  top: auto;
+}
+.prokodo-SnackbarProvider--is-left {
+  left: var(--pk-space-lg);
+  right: auto;
+}
+.prokodo-SnackbarProvider--is-right {
+  right: var(--pk-space-lg);
+  left: auto;
+}
+.prokodo-SnackbarProvider--is-center {
+  left: 50%;
+  right: auto;
+  transform: translateX(-50%);
+}
+
 @keyframes Snackbar_slideIn {
   from {
     opacity: 0;

package/dist/components/snackbar/Snackbar.module.css

@@ -124,6 +124,42 @@
  * This mixin specifies basic text-styles for components that render a richtext
  * content.
  */
+.prokodo-SnackbarProvider {
+  position: fixed;
+  z-index: 1400;
+  display: flex;
+  flex-direction: column;
+  gap: var(--pk-space-sm);
+  width: -moz-max-content;
+  width: max-content;
+  max-width: min(480px, 100vw - var(--pk-space-xl) * 2);
+  pointer-events: none;
+}
+.prokodo-SnackbarProvider > * {
+  pointer-events: auto;
+}
+.prokodo-SnackbarProvider--is-top {
+  top: var(--pk-space-lg);
+  bottom: auto;
+}
+.prokodo-SnackbarProvider--is-bottom {
+  bottom: var(--pk-space-lg);
+  top: auto;
+}
+.prokodo-SnackbarProvider--is-left {
+  left: var(--pk-space-lg);
+  right: auto;
+}
+.prokodo-SnackbarProvider--is-right {
+  right: var(--pk-space-lg);
+  left: auto;
+}
+.prokodo-SnackbarProvider--is-center {
+  left: 50%;
+  right: auto;
+  transform: translateX(-50%);
+}
+
 @keyframes Snackbar_slideIn {
   from {
     opacity: 0;

package/dist/components/snackbar/Snackbar.module.scss.js

@@ -1,6 +1,12 @@
 const Snackbar_slideIn = "Snackbar_slideIn";
 const Snackbar_slideOut = "Snackbar_slideOut";
 const styles = {
+  "prokodo-SnackbarProvider": "prokodo-SnackbarProvider",
+  "prokodo-SnackbarProvider--is-top": "prokodo-SnackbarProvider--is-top",
+  "prokodo-SnackbarProvider--is-bottom": "prokodo-SnackbarProvider--is-bottom",
+  "prokodo-SnackbarProvider--is-left": "prokodo-SnackbarProvider--is-left",
+  "prokodo-SnackbarProvider--is-right": "prokodo-SnackbarProvider--is-right",
+  "prokodo-SnackbarProvider--is-center": "prokodo-SnackbarProvider--is-center",
   "prokodo-Snackbar": "prokodo-Snackbar",
   Snackbar_slideIn,
   "prokodo-Snackbar--info": "prokodo-Snackbar--info",

package/dist/components/stepper/Stepper.css

@@ -127,15 +127,9 @@
 .prokodo-Stepper {
   display: flex;
   justify-content: space-between;
-  flex-direction: column;
+  flex-direction: row;
   padding: 0;
-  height: 100%;
-}
-@media screen and (min-width: 480px) {
-  .prokodo-Stepper {
-    width: 100%;
-    flex-direction: row;
-  }
+  width: 100%;
 }
 .prokodo-Stepper--primary {
   --gradient-border-1: linear-gradient(180deg, var(--pk-color-brand) 0%, var(--pk-color-accent) 100%);
@@ -174,35 +168,22 @@
 }
 .prokodo-Stepper__step {
   position: relative;
-  height: 100%;
+  width: 100%;
   list-style-type: none;
   cursor: pointer;
 }
 .prokodo-Stepper__step::after {
   content: "";
-  position: relative;
-  display: block;
-  margin: -10rem 0 1.25rem 1.25rem;
-  height: calc(100% - 150px);
-  width: 3px;
+  position: absolute;
+  top: 1.25rem;
+  margin: 0;
+  left: auto;
+  height: 3px;
+  width: calc(100% - 80px);
   background: var(--gradient-border-7);
-  transform: translateY(-50%);
+  transform: translateX(-50%);
   opacity: 0.5;
 }
-@media screen and (min-width: 480px) {
-  .prokodo-Stepper__step {
-    width: 100%;
-  }
-  .prokodo-Stepper__step::after {
-    position: absolute;
-    top: 1.25rem;
-    margin: 0;
-    left: auto;
-    height: 3px;
-    width: calc(100% - 80px);
-    transform: translateX(-50%);
-  }
-}
 .prokodo-Stepper__step:first-child::after {
   display: none;
 }
@@ -312,7 +293,7 @@
 }
 .prokodo-Stepper__label {
   text-align: center;
-  align-items: flex-start;
+  align-items: center;
   display: flex !important;
   flex-direction: column;
   justify-content: center;
@@ -368,7 +349,6 @@
 }
 @media screen and (min-width: 480px) {
   .prokodo-Stepper__label {
-    align-items: center;
     font-weight: 400;
     font-size: 1rem;
     font-family: var(--font-primary), -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

package/dist/components/stepper/Stepper.module.css

@@ -127,15 +127,9 @@
 .prokodo-Stepper {
   display: flex;
   justify-content: space-between;
-  flex-direction: column;
+  flex-direction: row;
   padding: 0;
-  height: 100%;
-}
-@media screen and (min-width: 480px) {
-  .prokodo-Stepper {
-    width: 100%;
-    flex-direction: row;
-  }
+  width: 100%;
 }
 .prokodo-Stepper--primary {
   --gradient-border-1: linear-gradient(180deg, var(--pk-color-brand) 0%, var(--pk-color-accent) 100%);
@@ -174,35 +168,22 @@
 }
 .prokodo-Stepper__step {
   position: relative;
-  height: 100%;
+  width: 100%;
   list-style-type: none;
   cursor: pointer;
 }
 .prokodo-Stepper__step::after {
   content: "";
-  position: relative;
-  display: block;
-  margin: -10rem 0 1.25rem 1.25rem;
-  height: calc(100% - 150px);
-  width: 3px;
+  position: absolute;
+  top: 1.25rem;
+  margin: 0;
+  left: auto;
+  height: 3px;
+  width: calc(100% - 80px);
   background: var(--gradient-border-7);
-  transform: translateY(-50%);
+  transform: translateX(-50%);
   opacity: 0.5;
 }
-@media screen and (min-width: 480px) {
-  .prokodo-Stepper__step {
-    width: 100%;
-  }
-  .prokodo-Stepper__step::after {
-    position: absolute;
-    top: 1.25rem;
-    margin: 0;
-    left: auto;
-    height: 3px;
-    width: calc(100% - 80px);
-    transform: translateX(-50%);
-  }
-}
 .prokodo-Stepper__step:first-child::after {
   display: none;
 }
@@ -312,7 +293,7 @@
 }
 .prokodo-Stepper__label {
   text-align: center;
-  align-items: flex-start;
+  align-items: center;
   display: flex !important;
   flex-direction: column;
   justify-content: center;
@@ -368,7 +349,6 @@
 }
 @media screen and (min-width: 480px) {
   .prokodo-Stepper__label {
-    align-items: center;
     font-weight: 400;
     font-size: 1rem;
     font-family: var(--font-primary), -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

package/dist/components/table/Table.css

@@ -159,9 +159,14 @@
 .prokodo-Table__head__row {
   border-bottom: var(--pk-border-width) solid var(--pk-table-border-color);
 }
+.prokodo-Table__head__row--double {
+  border-bottom-width: 3px;
+  border-bottom-style: double;
+}
 .prokodo-Table__head__cell {
   padding: var(--pk-table-padding-y) var(--pk-table-padding-x);
   font-weight: 500;
+  color: var(--pk-table-cell-fg);
   font-weight: 400;
   font-size: 1.125rem;
   font-family: var(--font-primary), -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
@@ -182,6 +187,10 @@
 .prokodo-Table__body__row {
   border-bottom: var(--pk-border-width) solid var(--pk-table-border-color);
 }
+.prokodo-Table__body__row--double {
+  border-bottom-width: 3px;
+  border-bottom-style: double;
+}
 .prokodo-Table__body__row--has-link:hover {
   background: var(--pk-table-row-hover-bg);
 }

package/dist/components/table/Table.js

@@ -38,7 +38,7 @@ const Table = /* @__PURE__ */ __name(({
     ) }),
     isString(content) && /* @__PURE__ */ jsx(Animated, { className: bem("content"), delay: 500, children: /* @__PURE__ */ jsx(RichText, { children: content }) }),
     /* @__PURE__ */ jsx("div", { className: bem("table__wrapper"), children: /* @__PURE__ */ jsxs("table", { "aria-label": ariaLabel, className: bem("table"), ...props, children: [
-      /* @__PURE__ */ jsx("thead", { className: bem("head"), children: /* @__PURE__ */ jsx("tr", { className: bem("head__row"), children: header.map((cell, i) => /* @__PURE__ */ jsx(
+      /* @__PURE__ */ jsx("thead", { className: bem("head"), children: /* @__PURE__ */ jsx("tr", { className: bem("head__row", { [type]: true }), children: header.map((cell, i) => /* @__PURE__ */ jsx(
         "th",
         {
           className: bem("head__cell", void 0, cell == null ? void 0 : cell.className),
@@ -52,6 +52,7 @@ const Table = /* @__PURE__ */ __name(({
           "tr",
           {
             className: bem("body__row", {
+              [type]: true,
               /* istanbul ignore next */
               "has-link": isString((_a = row == null ? void 0 : row.redirect) == null ? void 0 : _a.href)
             }),

package/dist/components/table/Table.module.css

@@ -159,9 +159,14 @@
 .prokodo-Table__head__row {
   border-bottom: var(--pk-border-width) solid var(--pk-table-border-color);
 }
+.prokodo-Table__head__row--double {
+  border-bottom-width: 3px;
+  border-bottom-style: double;
+}
 .prokodo-Table__head__cell {
   padding: var(--pk-table-padding-y) var(--pk-table-padding-x);
   font-weight: 500;
+  color: var(--pk-table-cell-fg);
   font-weight: 400;
   font-size: 1.125rem;
   font-family: var(--font-primary), -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
@@ -182,6 +187,10 @@
 .prokodo-Table__body__row {
   border-bottom: var(--pk-border-width) solid var(--pk-table-border-color);
 }
+.prokodo-Table__body__row--double {
+  border-bottom-width: 3px;
+  border-bottom-style: double;
+}
 .prokodo-Table__body__row--has-link:hover {
   background: var(--pk-table-row-hover-bg);
 }

package/dist/components/table/Table.module.scss.js

@@ -6,8 +6,10 @@ const styles = {
   "prokodo-Table__table": "prokodo-Table__table",
   "prokodo-Table__table__wrapper": "prokodo-Table__table__wrapper",
   "prokodo-Table__head__row": "prokodo-Table__head__row",
+  "prokodo-Table__head__row--double": "prokodo-Table__head__row--double",
   "prokodo-Table__head__cell": "prokodo-Table__head__cell",
   "prokodo-Table__body__row": "prokodo-Table__body__row",
+  "prokodo-Table__body__row--double": "prokodo-Table__body__row--double",
   "prokodo-Table__body__row--has-link": "prokodo-Table__body__row--has-link",
   "prokodo-Table__caption": "prokodo-Table__caption",
   "prokodo-TableCell": "prokodo-TableCell",

package/dist/components/tooltip/Tooltip.client.js

@@ -2,7 +2,7 @@
 var __defProp = Object.defineProperty;
 var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
 import { jsxs, Fragment, jsx } from "react/jsx-runtime";
-import { memo, useState, useRef, useCallback, useMemo, useLayoutEffect } from "react";
+import { memo, useState, useRef, useEffect, useCallback, useMemo, useLayoutEffect } from "react";
 import { createPortal } from "react-dom";
 import { create } from "../../helpers/bem.js";
 import styles from "./Tooltip.module.scss.js";
@@ -169,6 +169,10 @@ function TooltipClient(props) {
     void 0
   );
   const [effectivePlacement, setEffectivePlacement] = useState(placement);
+  const [isMounted, setIsMounted] = useState(false);
+  useEffect(() => {
+    setIsMounted(true);
+  }, []);
   const openTimer = useRef(null);
   const closeTimer = useRef(null);
   const clearTimers = useCallback(() => {
@@ -372,7 +376,7 @@ function TooltipClient(props) {
     },
     [portal, open, compute]
   );
-  const overlayRoot = typeof document !== "undefined" && portal ? getOverlayRoot(overlayRootId, zIndex) : null;
+  const overlayRoot = isMounted && portal ? getOverlayRoot(overlayRootId, zIndex) : null;
   const portalOpen = open && Boolean(bubbleStyle);
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsx(

package/dist/constants/project.js

@@ -1,4 +1,4 @@
-const PROKODO_UI_VERSION = "1.0.4";
+const PROKODO_UI_VERSION = "1.0.5";
 export {
   PROKODO_UI_VERSION
 };

package/dist/theme.css

@@ -158,7 +158,7 @@
   --pk-color-surface: var(--pk-palette-white);
   --pk-color-surface-raised: var(--pk-palette-grey-50);
   --pk-color-border: var(--pk-palette-grey-200);
-  --pk-color-muted: var(--pk-palette-grey-300);
+  --pk-color-muted: var(--pk-palette-grey-500);
   --pk-color-overlay-alpha: 0.5;
   --pk-color-brand: var(--pk-palette-primary-500);
   --pk-color-brand-hover: var(--pk-palette-primary-400);
@@ -195,6 +195,7 @@
   --pk-z-dropdown: 998;
   --pk-z-modal-backdrop: 1300;
   --pk-z-modal: 1301;
+  --pk-z-popover: 1400;
   --pk-button-bg: var(--pk-color-surface-raised);
   --pk-button-fg: var(--pk-color-fg);
   --pk-button-radius: var(--pk-radius-pill);
@@ -350,7 +351,7 @@
   --pk-slider-fill-to: var(--pk-color-accent);
   --pk-slider-label-fg: var(--pk-color-fg);
   --pk-slider-mark-bg: var(--pk-palette-grey-400);
-  --pk-slider-mark-label-fg: var(--pk-palette-grey-500);
+  --pk-slider-mark-label-fg: var(--pk-input-helper-fg);
   --pk-slider-thumb-size: 24px;
   --pk-slider-thumb-border: var(--pk-color-surface);
   --pk-slider-thumb-glow-rgb: var(--pk-palette-primary-500-rgb);
@@ -2622,7 +2623,7 @@ html[data-theme=dark] .prokodo-DatePicker--info, [data-theme=dark] .prokodo-Date
   position: absolute;
   top: calc(100% + var(--pk-space-xs));
   left: 0;
-  z-index: 200;
+  z-index: var(--pk-z-popover, 1400);
   min-width: var(--pk-dp-dialog-min-width);
   width: -moz-max-content;
   width: max-content;
@@ -2682,7 +2683,7 @@ html[data-theme=dark] .prokodo-DatePicker__dialog, [data-theme=dark] .prokodo-Da
     display: block;
     position: fixed;
     inset: 0;
-    z-index: 199;
+    z-index: var(--pk-z-popover, 1400);
     background: rgba(0, 0, 0, 0.5);
     backdrop-filter: blur(4px);
     -webkit-backdrop-filter: blur(4px);
@@ -3307,6 +3308,9 @@ html[data-theme=dark] .prokodo-DatePicker__dialog, [data-theme=dark] .prokodo-Da
   align-items: center;
   z-index: var(--pk-z-modal);
 }
+.prokodo-Dialog--is-visible {
+  display: flex;
+}
 .prokodo-Dialog__backdrop {
   display: none;
   position: fixed;
@@ -3315,16 +3319,11 @@ html[data-theme=dark] .prokodo-DatePicker__dialog, [data-theme=dark] .prokodo-Da
   align-items: center;
   z-index: var(--pk-z-modal);
   background-color: rgb(var(--pk-color-overlay-rgb)/var(--pk-color-overlay-alpha));
-}
-.prokodo-Dialog__backdrop {
   animation: Dialog_backdropFadeIn var(--pk-timing-normal) ease;
 }
 .prokodo-Dialog__backdrop--is-visible {
   display: flex;
 }
-.prokodo-Dialog--is-visible {
-  display: flex;
-}
 .prokodo-Dialog__backdrop .prokodo-Dialog, .prokodo-Dialog__backdrop .prokodo-Dialog--is-visible {
   position: static;
   inset: auto;
@@ -4664,7 +4663,7 @@ html[data-theme=dark] .prokodo-Input--info, [data-theme=dark] .prokodo-Input--in
 }
 .prokodo-Input__counter {
   padding-top: var(--pk-space-md);
-  color: var(--pk-palette-grey-600);
+  color: var(--pk-input-helper-fg);
   font-weight: 400;
   font-size: 1rem;
   font-family: var(--font-secondary), -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
@@ -5093,9 +5092,6 @@ html[data-theme=dark] .prokodo-Label__highlighted, [data-theme=dark] .prokodo-La
   border-radius: 1000rem;
   background-color: var(--pk-color-surface-raised);
 }
-html[data-theme=dark] .prokodo-List__item__icon {
-  background-color: var(--pk-palette-grey-400);
-}
 .prokodo-List__item__icon__wrapper {
   display: flex;
   align-items: center;
@@ -7343,7 +7339,7 @@ html[data-theme=dark] .prokodo-Select__listbox, [data-theme=dark] .prokodo-Selec
 .prokodo-Select__sheet__backdrop {
   position: fixed;
   inset: 0;
-  z-index: 199;
+  z-index: var(--pk-z-popover, 1400);
   background: rgba(0, 0, 0, 0.5);
   backdrop-filter: blur(4px);
   -webkit-backdrop-filter: blur(4px);
@@ -7354,7 +7350,7 @@ html[data-theme=dark] .prokodo-Select__listbox, [data-theme=dark] .prokodo-Selec
   bottom: 0;
   left: 0;
   right: 0;
-  z-index: 200;
+  z-index: calc(var(--pk-z-popover, 1400) + 1);
   box-sizing: border-box;
   display: flex;
   flex-direction: column;
@@ -7546,35 +7542,18 @@ html[data-theme=dark] .prokodo-Select__sheet, [data-theme=dark] .prokodo-Select_
 }
 .prokodo-Select__sheet__done {
   width: 100%;
-  padding: 0.75rem;
-  border-radius: var(--pk-select-radius, 8px);
+  height: 3rem;
+  padding: var(--pk-space-xs, 0.25rem) var(--pk-space-sm, 0.5rem);
+  border-radius: var(--pk-radius-lg, 12px);
   border: none;
   cursor: pointer;
-  font-weight: 700;
-  background: linear-gradient(90deg, var(--pk-select-gradient-from), var(--pk-select-gradient-to));
+  font-size: 0.9375rem;
+  font-weight: 600;
+  text-align: center;
+  background: linear-gradient(135deg, var(--pk-select-gradient-from), var(--pk-select-gradient-to));
   color: #fff;
+  box-shadow: 0 4px 16px color-mix(in srgb, var(--pk-select-gradient-from) 30%, transparent);
   transition: opacity var(--pk-timing-fast) ease;
-  font-weight: 700;
-  font-size: 1.75rem;
-  font-family: var(--font-secondary), -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
-  font-style: normal;
-  line-height: 1.6;
-  letter-spacing: 0.03em;
-  text-transform: none;
-  text-align: left;
-  text-decoration: none;
-}
-@media screen and (min-width: 480px) {
-  .prokodo-Select__sheet__done {
-    font-size: 1.5rem;
-    line-height: 1.55;
-  }
-}
-@media screen and (min-width: 960px) {
-  .prokodo-Select__sheet__done {
-    font-size: 1.5rem;
-    line-height: 1.55;
-  }
 }
 .prokodo-Select__sheet__done:hover {
   opacity: 0.9;
@@ -8138,6 +8117,42 @@ html[data-theme=dark] .prokodo-Skeleton::after {
   transform: translate(-50%, -50%) scale(1.12);
 }
 
+.prokodo-SnackbarProvider {
+  position: fixed;
+  z-index: 1400;
+  display: flex;
+  flex-direction: column;
+  gap: var(--pk-space-sm);
+  width: -moz-max-content;
+  width: max-content;
+  max-width: min(480px, 100vw - var(--pk-space-xl) * 2);
+  pointer-events: none;
+}
+.prokodo-SnackbarProvider > * {
+  pointer-events: auto;
+}
+.prokodo-SnackbarProvider--is-top {
+  top: var(--pk-space-lg);
+  bottom: auto;
+}
+.prokodo-SnackbarProvider--is-bottom {
+  bottom: var(--pk-space-lg);
+  top: auto;
+}
+.prokodo-SnackbarProvider--is-left {
+  left: var(--pk-space-lg);
+  right: auto;
+}
+.prokodo-SnackbarProvider--is-right {
+  right: var(--pk-space-lg);
+  left: auto;
+}
+.prokodo-SnackbarProvider--is-center {
+  left: 50%;
+  right: auto;
+  transform: translateX(-50%);
+}
+
 @keyframes Snackbar_slideIn {
   from {
     opacity: 0;
@@ -8295,15 +8310,9 @@ html[data-theme=dark] .prokodo-Skeleton::after {
 .prokodo-Stepper {
   display: flex;
   justify-content: space-between;
-  flex-direction: column;
+  flex-direction: row;
   padding: 0;
-  height: 100%;
-}
-@media screen and (min-width: 480px) {
-  .prokodo-Stepper {
-    width: 100%;
-    flex-direction: row;
-  }
+  width: 100%;
 }
 .prokodo-Stepper--primary {
   --gradient-border-1: linear-gradient(180deg, var(--pk-color-brand) 0%, var(--pk-color-accent) 100%);
@@ -8342,35 +8351,22 @@ html[data-theme=dark] .prokodo-Skeleton::after {
 }
 .prokodo-Stepper__step {
   position: relative;
-  height: 100%;
+  width: 100%;
   list-style-type: none;
   cursor: pointer;
 }
 .prokodo-Stepper__step::after {
   content: "";
-  position: relative;
-  display: block;
-  margin: -10rem 0 1.25rem 1.25rem;
-  height: calc(100% - 150px);
-  width: 3px;
+  position: absolute;
+  top: 1.25rem;
+  margin: 0;
+  left: auto;
+  height: 3px;
+  width: calc(100% - 80px);
   background: var(--gradient-border-7);
-  transform: translateY(-50%);
+  transform: translateX(-50%);
   opacity: 0.5;
 }
-@media screen and (min-width: 480px) {
-  .prokodo-Stepper__step {
-    width: 100%;
-  }
-  .prokodo-Stepper__step::after {
-    position: absolute;
-    top: 1.25rem;
-    margin: 0;
-    left: auto;
-    height: 3px;
-    width: calc(100% - 80px);
-    transform: translateX(-50%);
-  }
-}
 .prokodo-Stepper__step:first-child::after {
   display: none;
 }
@@ -8480,7 +8476,7 @@ html[data-theme=dark] .prokodo-Skeleton::after {
 }
 .prokodo-Stepper__label {
   text-align: center;
-  align-items: flex-start;
+  align-items: center;
   display: flex !important;
   flex-direction: column;
   justify-content: center;
@@ -8536,7 +8532,6 @@ html[data-theme=dark] .prokodo-Skeleton::after {
 }
 @media screen and (min-width: 480px) {
   .prokodo-Stepper__label {
-    align-items: center;
     font-weight: 400;
     font-size: 1rem;
     font-family: var(--font-primary), -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
@@ -8738,9 +8733,14 @@ html[data-theme=dark] .prokodo-Skeleton::after {
 .prokodo-Table__head__row {
   border-bottom: var(--pk-border-width) solid var(--pk-table-border-color);
 }
+.prokodo-Table__head__row--double {
+  border-bottom-width: 3px;
+  border-bottom-style: double;
+}
 .prokodo-Table__head__cell {
   padding: var(--pk-table-padding-y) var(--pk-table-padding-x);
   font-weight: 500;
+  color: var(--pk-table-cell-fg);
   font-weight: 400;
   font-size: 1.125rem;
   font-family: var(--font-primary), -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
@@ -8761,6 +8761,10 @@ html[data-theme=dark] .prokodo-Skeleton::after {
 .prokodo-Table__body__row {
   border-bottom: var(--pk-border-width) solid var(--pk-table-border-color);
 }
+.prokodo-Table__body__row--double {
+  border-bottom-width: 3px;
+  border-bottom-style: double;
+}
 .prokodo-Table__body__row--has-link:hover {
   background: var(--pk-table-row-hover-bg);
 }