superdesk-ui-framework 4.0.24 → 4.0.25

package/dist/superdesk-ui.bundle.css

@@ -772,6 +772,301 @@
     content: "\e926";
 }
 .tippy-box[data-animation=fade][data-state=hidden]{opacity:0}[data-tippy-root]{max-width:calc(100vw - 10px)}.tippy-box{position:relative;background-color:#333;color:#fff;border-radius:4px;font-size:14px;line-height:1.4;white-space:normal;outline:0;transition-property:transform,visibility,opacity}.tippy-box[data-placement^=top]>.tippy-arrow{bottom:0}.tippy-box[data-placement^=top]>.tippy-arrow:before{bottom:-7px;left:0;border-width:8px 8px 0;border-top-color:initial;transform-origin:center top}.tippy-box[data-placement^=bottom]>.tippy-arrow{top:0}.tippy-box[data-placement^=bottom]>.tippy-arrow:before{top:-7px;left:0;border-width:0 8px 8px;border-bottom-color:initial;transform-origin:center bottom}.tippy-box[data-placement^=left]>.tippy-arrow{right:0}.tippy-box[data-placement^=left]>.tippy-arrow:before{border-width:8px 0 8px 8px;border-left-color:initial;right:-7px;transform-origin:center left}.tippy-box[data-placement^=right]>.tippy-arrow{left:0}.tippy-box[data-placement^=right]>.tippy-arrow:before{left:-7px;border-width:8px 8px 8px 0;border-right-color:initial;transform-origin:center right}.tippy-box[data-inertia][data-state=visible]{transition-timing-function:cubic-bezier(.54,1.5,.38,1.11)}.tippy-arrow{width:16px;height:16px;color:#333}.tippy-arrow:before{content:"";position:absolute;border-color:transparent;border-style:solid}.tippy-content{position:relative;padding:5px 9px;z-index:1}@charset "UTF-8";
+:root {
+  --l-base: 35%;
+  --l-100-add: 55;
+  --l-200-add: 34;
+  --l-300-add: 20;
+  --l-400-add: 8;
+  --l-600-remove: 10;
+  --l-700-remove: 20;
+  --l-800-remove: 35;
+  --c-base: 75;
+  --c-100-remove: 60;
+  --c-200-remove: 45;
+  --c-300-remove: 30;
+  --c-400-remove: 10;
+  --c-600-add: 0;
+  --c-700-add: 0;
+  --c-800-add: 0;
+  --morocco-red-500: lch(var(--l-base) var(--c-base) 28);
+  --morocco-red-100: lch(from var(--morocco-red-500) calc(l + var(--l-100-add)) calc(c - var(--c-100-remove)) h);
+  --morocco-red-200: lch(from var(--morocco-red-500) calc(l + var(--l-200-add)) calc(c - var(--c-200-remove)) h);
+  --morocco-red-300: lch(from var(--morocco-red-500) calc(l + var(--l-300-add)) calc(c - var(--c-300-remove)) h);
+  --morocco-red-400: lch(from var(--morocco-red-500) calc(l + var(--l-400-add)) calc(c - var(--c-400-remove)) h);
+  --morocco-red-600: lch(from var(--morocco-red-500) calc(l - var(--l-600-remove)) calc(c + var(--c-600-add)) h);
+  --morocco-red-700: lch(from var(--morocco-red-500) calc(l - var(--l-700-remove)) calc(c + var(--c-700-add)) h);
+  --morocco-red-800: lch(from var(--morocco-red-500) calc(l - var(--l-800-remove)) calc(c + var(--c-800-add)) h);
+  --morocco-red-500-a32: lch(from var(--morocco-red-500) l c h / .32);
+  --morocco-red-500-a24: lch(from var(--morocco-red-500) l c h / .24);
+  --morocco-red-500-a16: lch(from var(--morocco-red-500) l c h / .16);
+  --morocco-red-500-a12: lch(from var(--morocco-red-500) l c h / .12);
+  --syrah-soil-500: lch(var(--l-base) var(--c-base) 74);
+  --syrah-soil-100: lch(from var(--syrah-soil-500) calc(l + var(--l-100-add)) calc(c - var(--c-100-remove)) h);
+  --syrah-soil-200: lch(from var(--syrah-soil-500) calc(l + var(--l-200-add)) calc(c - var(--c-200-remove)) h);
+  --syrah-soil-300: lch(from var(--syrah-soil-500) calc(l + var(--l-300-add)) calc(c - var(--c-300-remove)) h);
+  --syrah-soil-400: lch(from var(--syrah-soil-500) calc(l + var(--l-400-add)) calc(c - var(--c-400-remove)) h);
+  --syrah-soil-600: lch(from var(--syrah-soil-500) calc(l - var(--l-600-remove)) calc(c + var(--c-600-add)) h);
+  --syrah-soil-700: lch(from var(--syrah-soil-500) calc(l - var(--l-700-remove)) calc(c + var(--c-700-add)) h);
+  --syrah-soil-800: lch(from var(--syrah-soil-500) calc(l - var(--l-800-remove)) calc(c + var(--c-800-add)) h);
+  --syrah-soil-500-a32: hsl(from var(--syrah-soil-500) h s l / .32);
+  --syrah-soil-500-a24: hsl(from var(--syrah-soil-500) h s l / .24);
+  --syrah-soil-500-a16: hsl(from var(--syrah-soil-500) h s l / .16);
+  --syrah-soil-500-a12: hsl(from var(--syrah-soil-500) h s l / .12);
+  --green-brier-500: lch(var(--l-base) var(--c-base) 126);
+  --green-brier-100: lch(from var(--green-brier-500) calc(l + var(--l-100-add)) calc(c - var(--c-100-remove)) h);
+  --green-brier-200: lch(from var(--green-brier-500) calc(l + var(--l-200-add)) calc(c - var(--c-200-remove)) h);
+  --green-brier-300: lch(from var(--green-brier-500) calc(l + var(--l-300-add)) calc(c - var(--c-300-remove)) h);
+  --green-brier-400: lch(from var(--green-brier-500) calc(l + var(--l-400-add)) calc(c - var(--c-400-remove)) h);
+  --green-brier-600: lch(from var(--green-brier-500) calc(l - var(--l-600-remove)) calc(c + var(--c-600-add)) h);
+  --green-brier-700: lch(from var(--green-brier-500) calc(l - var(--l-700-remove)) calc(c + var(--c-700-add)) h);
+  --green-brier-800: lch(from var(--green-brier-500) calc(l - var(--l-800-remove)) calc(c + var(--c-800-add)) h);
+  --green-brier-400-a32: hsl(from var(--green-brier-400) h s l / .32);
+  --green-brier-400-a24: hsl(from var(--green-brier-400) h s l / .24);
+  --green-brier-400-a16: hsl(from var(--green-brier-400) h s l / .16);
+  --green-brier-400-a12: hsl(from var(--green-brier-400) h s l / .12);
+  --green-brier-500-a32: hsl(from var(--green-brier-500) h s l / .32);
+  --green-brier-500-a24: hsl(from var(--green-brier-500) h s l / .24);
+  --green-brier-500-a16: hsl(from var(--green-brier-500) h s l / .16);
+  --green-brier-500-a12: hsl(from var(--green-brier-500) h s l / .12);
+  --sorcerer-blue-500: lch(var(--l-base) var(--c-base) 202);
+  --sorcerer-blue-100: lch(from var(--sorcerer-blue-500) calc(l + var(--l-100-add)) calc(c - var(--c-100-remove)) h);
+  --sorcerer-blue-200: lch(from var(--sorcerer-blue-500) calc(l + var(--l-200-add)) calc(c - var(--c-200-remove)) h);
+  --sorcerer-blue-300: lch(from var(--sorcerer-blue-500) calc(l + var(--l-300-add)) calc(c - var(--c-300-remove)) h);
+  --sorcerer-blue-400: lch(from var(--sorcerer-blue-500) calc(l + var(--l-400-add)) calc(c - var(--c-400-remove)) h);
+  --sorcerer-blue-600: lch(from var(--sorcerer-blue-500) calc(l - var(--l-600-remove)) calc(c + var(--c-600-add)) h);
+  --sorcerer-blue-700: lch(from var(--sorcerer-blue-500) calc(l - var(--l-700-remove)) calc(c + var(--c-700-add)) h);
+  --sorcerer-blue-800: lch(from var(--sorcerer-blue-500) calc(l - var(--l-800-remove)) calc(c + var(--c-800-add)) h);
+  --sorcerer-blue-500-a32: hsl(from var(--sorcerer-blue-500) h s l / .32);
+  --sorcerer-blue-500-a24: hsl(from var(--sorcerer-blue-500) h s l / .24);
+  --sorcerer-blue-500-a16: hsl(from var(--sorcerer-blue-500) h s l / .16);
+  --sorcerer-blue-500-a12: hsl(from var(--sorcerer-blue-500) h s l / .12);
+  --palatinate-blue-500: lch(var(--l-base) var(--c-base) 280);
+  --palatinate-blue-100: lch(from var(--palatinate-blue-500) calc(l + var(--l-100-add)) calc(c - var(--c-100-remove)) h);
+  --palatinate-blue-200: lch(from var(--palatinate-blue-500) calc(l + var(--l-200-add)) calc(c - var(--c-200-remove)) h);
+  --palatinate-blue-300: lch(from var(--palatinate-blue-500) calc(l + var(--l-300-add)) calc(c - var(--c-300-remove)) h);
+  --palatinate-blue-400: lch(from var(--palatinate-blue-500) calc(l + var(--l-400-add)) calc(c - var(--c-400-remove)) h);
+  --palatinate-blue-600: lch(from var(--palatinate-blue-500) calc(l - var(--l-600-remove)) calc(c + var(--c-600-add)) h);
+  --palatinate-blue-700: lch(from var(--palatinate-blue-500) calc(l - var(--l-700-remove)) calc(c + var(--c-700-add)) h);
+  --palatinate-blue-800: lch(from var(--palatinate-blue-500) calc(l - var(--l-800-remove)) calc(c + var(--c-800-add)) h);
+  --palatinate-blue-500-a32: hsl(from var(--palatinate-blue-500) h s l / .32);
+  --palatinate-blue-500-a24: hsl(from var(--palatinate-blue-500) h s l / .24);
+  --palatinate-blue-500-a16: hsl(from var(--palatinate-blue-500) h s l / .16);
+  --palatinate-blue-500-a12: hsl(from var(--palatinate-blue-500) h s l / .12);
+  --purple-spot-500: lch(var(--l-base) var(--c-base) 307);
+  --purple-spot-100: lch(from var(--purple-spot-500) calc(l + var(--l-100-add)) calc(c - var(--c-100-remove)) h);
+  --purple-spot-200: lch(from var(--purple-spot-500) calc(l + var(--l-200-add)) calc(c - var(--c-200-remove)) h);
+  --purple-spot-300: lch(from var(--purple-spot-500) calc(l + var(--l-300-add)) calc(c - var(--c-300-remove)) h);
+  --purple-spot-400: lch(from var(--purple-spot-500) calc(l + var(--l-400-add)) calc(c - var(--c-400-remove)) h);
+  --purple-spot-600: lch(from var(--purple-spot-500) calc(l - var(--l-600-remove)) calc(c + var(--c-600-add)) h);
+  --purple-spot-700: lch(from var(--purple-spot-500) calc(l - var(--l-700-remove)) calc(c + var(--c-700-add)) h);
+  --purple-spot-800: lch(from var(--purple-spot-500) calc(l - var(--l-800-remove)) calc(c + var(--c-800-add)) h);
+  --purple-spot-500-a32: hsl(from var(--purple-spot-500) h s l / .32);
+  --purple-spot-500-a24: hsl(from var(--purple-spot-500) h s l / .24);
+  --purple-spot-500-a16: hsl(from var(--purple-spot-500) h s l / .16);
+  --purple-spot-500-a12: hsl(from var(--purple-spot-500) h s l / .12);
+  --blissful-berry-500: lch(var(--l-base) var(--c-base) 338);
+  --blissful-berry-100: lch(from var(--blissful-berry-500) calc(l + var(--l-100-add)) calc(c - var(--c-100-remove)) h);
+  --blissful-berry-200: lch(from var(--blissful-berry-500) calc(l + var(--l-200-add)) calc(c - var(--c-200-remove)) h);
+  --blissful-berry-300: lch(from var(--blissful-berry-500) calc(l + var(--l-300-add)) calc(c - var(--c-300-remove)) h);
+  --blissful-berry-400: lch(from var(--blissful-berry-500) calc(l + var(--l-400-add)) calc(c - var(--c-400-remove)) h);
+  --blissful-berry-600: lch(from var(--blissful-berry-500) calc(l - var(--l-600-remove)) calc(c + var(--c-600-add)) h);
+  --blissful-berry-700: lch(from var(--blissful-berry-500) calc(l - var(--l-700-remove)) calc(c + var(--c-700-add)) h);
+  --blissful-berry-800: lch(from var(--blissful-berry-500) calc(l - var(--l-800-remove)) calc(c + var(--c-800-add)) h);
+  --blissful-berry-500-a32: hsl(from var(--blissful-berry-500) h s l / .32);
+  --blissful-berry-500-a24: hsl(from var(--blissful-berry-500) h s l / .24);
+  --blissful-berry-500-a16: hsl(from var(--blissful-berry-500) h s l / .16);
+  --blissful-berry-500-a12: hsl(from var(--blissful-berry-500) h s l / .12);
+  --buoyant-grey-500: lch(46% 11 260);
+  --buoyant-grey-000: lch(from var(--buoyant-grey-500) calc(l + 54) calc(c - 12) h);
+  --buoyant-grey-050: lch(from var(--buoyant-grey-500) calc(l + 50.8) calc(c - 9) h);
+  --buoyant-grey-100: lch(from var(--buoyant-grey-500) calc(l + 48.2) calc(c - 9) h);
+  --buoyant-grey-125: lch(from var(--buoyant-grey-500) calc(l + 45.5) calc(c - 8) h);
+  --buoyant-grey-150: lch(from var(--buoyant-grey-500) calc(l + 39) calc(c - 6) h);
+  --buoyant-grey-200: lch(from var(--buoyant-grey-500) calc(l + 30) calc(c - 4) h);
+  --buoyant-grey-300: lch(from var(--buoyant-grey-500) calc(l + 20) calc(c - 2) h);
+  --buoyant-grey-400: lch(from var(--buoyant-grey-500) calc(l + 10) calc(c - 0) h);
+  --buoyant-grey-600: lch(from var(--buoyant-grey-500) calc(l - 8) calc(c + 0) h);
+  --buoyant-grey-700: lch(from var(--buoyant-grey-500) calc(l - 16) calc(c + 0) h);
+  --buoyant-grey-800: lch(from var(--buoyant-grey-500) calc(l - 22) calc(c + 0) h);
+  --buoyant-grey-825: lch(from var(--buoyant-grey-500) calc(l - 26) calc(c + 0) h);
+  --buoyant-grey-850: lch(from var(--buoyant-grey-500) calc(l - 31) calc(c + 1) h);
+  --buoyant-grey-900: lch(from var(--buoyant-grey-500) calc(l - 36) calc(c + 2) h);
+  --buoyant-grey-950: lch(from var(--buoyant-grey-500) calc(l - 42) calc(c + 2) h);
+  --buoyant-grey-999: lch(from var(--buoyant-grey-500) calc(l - 46) calc(c - 11) h);
+  --buoyant-grey-200-a40: hsl(from var(--buoyant-grey-200) h s l / .40);
+  --buoyant-grey-200-a32: hsl(from var(--buoyant-grey-200) h s l / .32);
+  --buoyant-grey-200-a24: hsl(from var(--buoyant-grey-200) h s l / .24);
+  --buoyant-grey-200-a16: hsl(from var(--buoyant-grey-200) h s l / .16);
+  --buoyant-grey-200-a12: hsl(from var(--buoyant-grey-200) h s l / .12);
+  --buoyant-grey-300-a40: hsl(from var(--buoyant-grey-300) h s l / .40);
+  --buoyant-grey-300-a32: hsl(from var(--buoyant-grey-300) h s l / .32);
+  --buoyant-grey-300-a24: hsl(from var(--buoyant-grey-300) h s l / .24);
+  --buoyant-grey-300-a16: hsl(from var(--buoyant-grey-300) h s l / .16);
+  --buoyant-grey-300-a12: hsl(from var(--buoyant-grey-300) h s l / .12);
+  --buoyant-grey-400-a40: hsl(from var(--buoyant-grey-400) h s l / .40);
+  --buoyant-grey-400-a32: hsl(from var(--buoyant-grey-400) h s l / .32);
+  --buoyant-grey-400-a24: hsl(from var(--buoyant-grey-400) h s l / .24);
+  --buoyant-grey-400-a16: hsl(from var(--buoyant-grey-400) h s l / .16);
+  --buoyant-grey-400-a12: hsl(from var(--buoyant-grey-400) h s l / .12);
+  --buoyant-grey-500-a40: hsl(from var(--buoyant-grey-500) h s l / .40);
+  --buoyant-grey-500-a32: hsl(from var(--buoyant-grey-500) h s l / .32);
+  --buoyant-grey-500-a24: hsl(from var(--buoyant-grey-500) h s l / .24);
+  --buoyant-grey-500-a16: hsl(from var(--buoyant-grey-500) h s l / .16);
+  --buoyant-grey-500-a12: hsl(from var(--buoyant-grey-500) h s l / .12);
+  --buoyant-grey-600-a40: hsl(from var(--buoyant-grey-600) h s l / .40);
+  --buoyant-grey-600-a32: hsl(from var(--buoyant-grey-600) h s l / .32);
+  --buoyant-grey-600-a24: hsl(from var(--buoyant-grey-600) h s l / .24);
+  --buoyant-grey-600-a16: hsl(from var(--buoyant-grey-600) h s l / .16);
+  --buoyant-grey-600-a12: hsl(from var(--buoyant-grey-600) h s l / .12); }
+
+:root {
+  --brand-primary-l-base: 60%;
+  --brand-primary-c-base: 40;
+  --brand-secondary-l-base: 60%;
+  --brand-secondary-c-base: 40  ;
+  --brand-primary: lch(var(--brand-primary-l-base) var(--brand-primary-c-base) 237);
+  --brand-primary-100: lch(from var(--brand-primary) calc(l + 36) calc(c - 34) h);
+  --brand-primary-200: lch(from var(--brand-primary) calc(l + var(--l-200-add)) calc(c - 32) h);
+  --brand-primary-300: lch(from var(--brand-primary) calc(l + var(--l-300-add)) calc(c - 22) h);
+  --brand-primary-400: lch(from var(--brand-primary) calc(l + var(--l-400-add)) calc(c - 10) h);
+  --brand-primary-600: lch(from var(--brand-primary) calc(l - var(--l-600-remove)) calc(c + 0) h);
+  --brand-primary-700: lch(from var(--brand-primary) calc(l - var(--l-700-remove)) calc(c + 0) h);
+  --brand-primary-800: lch(from var(--brand-primary) calc(l - 28) calc(c + 0) h);
+  --brand-primary-950: lch(from var(--brand-primary) calc(l - 50) calc(c - 10) h);
+  --brand-primary-a32: hsl(from var(--brand-primary) h s l / .32);
+  --brand-primary-a24: hsl(from var(--brand-primary) h s l / .24);
+  --brand-primary-a16: hsl(from var(--brand-primary) h s l / .16);
+  --brand-primary-a12: hsl(from var(--brand-primary) h s l / .12);
+  --brand-secondary: lch(var(--brand-secondary-l-base) var(--brand-secondary-c-base) 166);
+  --brand-secondary-200: lch(from var(--brand-secondary) calc(l + var(--l-200-add)) calc(c - 36) h);
+  --brand-secondary-300: lch(from var(--brand-secondary) calc(l + var(--l-300-add)) calc(c - 20) h);
+  --brand-secondary-400: lch(from var(--brand-secondary) calc(l + var(--l-400-add)) calc(c - 8) h);
+  --brand-secondary-600: lch(from var(--brand-secondary) calc(l - var(--l-600-remove)) calc(c + 0) h);
+  --brand-secondary-700: lch(from var(--brand-secondary) calc(l - var(--l-700-remove)) calc(c + 0) h);
+  --brand-secondary-800: lch(from var(--brand-secondary) calc(l - 28) calc(c + 0) h);
+  --brand-secondary-950: lch(from var(--brand-secondary) calc(l - 40) calc(c + 10) h); }
+
+:root {
+  --color-surface-base: var(--buoyant-grey-000);
+  --color-surface-muted: var(--buoyant-grey-050);
+  --color-surface-subdued: var(--buoyant-grey-100);
+  --color-surface-faded: var(--buoyant-grey-125);
+  --color-surface-base-translucent: var(--buoyant-grey-200-a16);
+  --color-surface-muted-translucent: var(--buoyant-grey-200-a16);
+  --color-surface-subdued-translucent: var(--buoyant-grey-200-a32);
+  --color-surface-faded-translucent: var(--buoyant-grey-200-a32);
+  --color-text-default: var(--buoyant-grey-900);
+  --color-text-muted: var(--buoyant-grey-600);
+  --color-text-subdued: var(--buoyant-grey-500);
+  --color-text-inverse: var(--buoyant-grey-050);
+  --color-text-ondark: var(--buoyant-grey-000);
+  --color-text-onlight: var(--buoyant-grey-900);
+  --color-line-x-light: var(--buoyant-grey-500-a16);
+  --color-line-light: var(--buoyant-grey-500-a24);
+  --color-line-medium: var(--buoyant-grey-500-a32);
+  --color-line-strong: var(--buoyant-grey-500-a40);
+  --color-primary-default: var(--brand-primary-700);
+  --color-primary-highlight: var(--brand-primary);
+  --color-primary-text: var(--brand-primary-800);
+  --color-primary-translucent: var(--brand-primary-a16);
+  --color-primary-translucent-strong: var(--brand-primary-a32);
+  --color-success-default: var(--green-brier-400);
+  --color-success-highlight: var(--green-brier-300);
+  --color-success-text: var(--green-brier-600);
+  --color-success-translucent: var(--green-brier-400-a12);
+  --color-warning-default: var(--syrah-soil-300);
+  --color-warning-highlight: var(--syrah-soil-200);
+  --color-warning-text: var(--syrah-soil-400);
+  --color-warning-translucent: var(--syrah-soil-500-a12);
+  --color-alert-default: var(--morocco-red-500);
+  --color-alert-highlight: var(--morocco-red-400);
+  --color-alert-text: var(--morocco-red-600);
+  --color-alert-translucent: var(--morocco-red-500-a16);
+  --color-highlight-default: var(--blissful-berry-400);
+  --color-highlight-highlight: var(--blissful-berry-300);
+  --color-highlight-text: var(--blissful-berry-600);
+  --color-highlight-translucent: var(--blissful-berry-500-a12);
+  --color-info-default: var(--sorcerer-blue-500);
+  --color-info-highlight: var(--sorcerer-blue-300);
+  --color-info-text: var(--sorcerer-blue-700);
+  --color-info-translucent: var(--sorcerer-blue-500-a12);
+  --color-neutral-light-default: var(--buoyant-grey-300-a24);
+  --color-neutral-light-text: var(--buoyant-grey-700);
+  --color-neutral-medium-default: var(--buoyant-grey-200);
+  --color-neutral-strong-default: var(--buoyant-grey-600);
+  --color-neutral-strong-text: var(--buoyant-grey-100);
+  --color-interactive-default: var(--brand-primary-700);
+  --color-interactive-highlight: var(--brand-primary);
+  --color-interactive-text: var(--brand-primary-800);
+  --color-interactive-translucent: var(--brand-primary-a16);
+  --color-interactive-translucent-strong: var(--brand-primary-a32);
+  --color-interactive-surface-selected: var(--brand-primary-100);
+  --color-interactive-shadow-focus: var(--brand-primary-a32);
+  --color-item-bg-normal: var(--color-surface-base);
+  --color-item-bg-hover: var(--color-surface-muted);
+  --color-item-bg-active: var(--color-interactive-surface-selected);
+  --color-item-border-active: var(--color-interactive-translucent-strong);
+  --color-item-overlay-actioning: hsl(from var(--color-surface-base) h s l / .70); }
+
+[data-theme="dark-ui"] {
+  --color-surface-base: var(--buoyant-grey-900);
+  --color-surface-muted: var(--buoyant-grey-850);
+  --color-surface-subdued: var(--buoyant-grey-825);
+  --color-surface-faded: var(--buoyant-grey-800);
+  --color-surface-muted-translucent: var(--buoyant-grey-600-a16);
+  --color-surface-subdued-translucent: var(--buoyant-grey-600-a32);
+  --color-surface-faded-translucent: var(--buoyant-grey-600-a32);
+  --color-text-default: var(--buoyant-grey-050);
+  --color-text-muted: var(--buoyant-grey-200);
+  --color-text-subdued: var(--buoyant-grey-300);
+  --color-text-inverse: var(--buoyant-grey-900);
+  --color-text-ondark: var(--buoyant-grey-000);
+  --color-text-onlight: var(--buoyant-grey-900);
+  --color-line-x-light: var(--buoyant-grey-300-a16);
+  --color-line-light: var(--buoyant-grey-300-a24);
+  --color-line-medium: var(--buoyant-grey-300-a32);
+  --color-line-strong: var(--buoyant-grey-300-a40);
+  --color-primary-default: var(--brand-primary-700);
+  --color-primary-highlight: var(--brand-primary-600);
+  --color-primary-text: var(--brand-primary-400);
+  --color-primary-translucent: var(--brand-primary-a16);
+  --color-primary-highlight-translucent: var(--brand-primary-600-a16);
+  --color-success-default: var(--green-brier-500);
+  --color-success-highlight: var(--green-brier-400);
+  --color-success-text: var(--green-brier-300);
+  --color-success-translucent: var(--green-brier-400-a16);
+  --color-warning-default: var(--syrah-soil-400);
+  --color-warning-highlight: var(--syrah-soil-300);
+  --color-warning-text: var(--syrah-soil-300);
+  --color-warning-translucent: var(--syrah-soil-500-a16);
+  --color-alert-default: var(--morocco-red-600);
+  --color-alert-text: var(--morocco-red-400);
+  --color-alert-translucent: var(--morocco-red-500-a16);
+  --color-highlight-default: var(--blissful-berry-500);
+  --color-highlight-text: var(--blissful-berry-300);
+  --color-highlight-translucent: var(--blissful-berry-500-a16);
+  --color-info-default: var(--sorcerer-blue-600);
+  --color-info-text: var(--sorcerer-blue-300);
+  --color-info-translucent: var(--sorcerer-blue-500-a16);
+  --color-neutral-light-default: var(--buoyant-grey-500-a24);
+  --color-neutral-light-text: var(--buoyant-grey-200);
+  --color-neutral-medium-default: var(--buoyant-grey-300);
+  --color-neutral-strong-default: var(--buoyant-grey-600);
+  --color-neutral-strong-text: var(--buoyant-grey-100);
+  --color-interactive-default: var(--brand-primary-700);
+  --color-interactive-highlight: var(--brand-primary);
+  --color-interactive-text: var(--brand-primary-400);
+  --color-interactive-translucent: var(--brand-primary-a16);
+  --color-interactive-translucent-strong: var(--brand-primary-a32);
+  --color-interactive-surface-selected: var(--brand-primary-950);
+  --color-interactive-shadow-focus: var(--brand-primary-a32);
+  --color-item-bg-normal: var(--color-surface-base);
+  --color-item-bg-hover: var(--color-surface-muted);
+  --color-item-bg-active: var(--color-interactive-surface-selected);
+  --color-item-border-active: var(--color-interactive-translucent-strong);
+  --color-item-overlay-actioning: hsl(from var(--color-surface-base) h s l / .70); }
+
 :root {
   --base-increment: 0.8rem;
   --space--0: 0;
@@ -993,11 +1288,17 @@
   --sd-colour-interactive:                hsla(var(--sd-colour-interactive-l--50), 1);
   --sd-colour-interactive--hover:         hsla(var(--sd-colour-interactive-l--60), 1);
   --sd-colour-interactive--active:        hsla(var(--sd-colour-interactive-l--40), 1);
+  --sd-colour-interactive--text:          hsla(var(--sd-colour-interactive-l--30), 1);
   --sd-colour-interactive-btn-border:     hsla(var(--sd-colour-interactive-l--50), 0.5);
+  --sd-colour-interactive-translucent-10: hsla(var(--sd-colour-interactive-l--50), 0.1);
+  --sd-colour-interactive-translucent-25: hsla(var(--sd-colour-interactive-l--50), 0.25);
   --sd-colour-primary:                    hsla(var(--sd-colour-primary-l--50), 1);
   --sd-colour-primary--hover:             hsla(var(--sd-colour-primary-l--60), 1);
   --sd-colour-primary--active:            hsla(var(--sd-colour-primary-l--40), 1);
+  --sd-colour-primary--text:              hsla(var(--sd-colour-primary-l--30), 1);
   --sd-colour-primary-btn-border:         hsla(var(--sd-colour-primary-l--50), 0.5);
+  --sd-colour-primary-translucent-10:     hsla(var(--sd-colour-primary-l--50), 0.1);
+  --sd-colour-primary-translucent-25:     hsla(var(--sd-colour-primary-l--50), 0.25);
   --sd-colour-secondary:                  hsla(var(--sd-colour-secondary-l--50), 1);
   --sd-colour-secondary--hover:           hsla(var(--sd-colour-secondary-l--60), 1);
   --sd-colour-secondary--active:          hsla(var(--sd-colour-secondary-l--40), 1);
@@ -1005,19 +1306,31 @@
   --sd-colour-success:                    hsla(var(--sd-colour-success-l--50), 1);
   --sd-colour-success--hover:             hsla(var(--sd-colour-success-l--60), 1);
   --sd-colour-success--active:            hsla(var(--sd-colour-success-l--40), 1);
+  --sd-colour-success--text:              hsla(var(--sd-colour-success-l--30), 1);
   --sd-colour-success-btn-border:         hsla(var(--sd-colour-success-l--50), 0.5);
+  --sd-colour-success-translucent-10:     hsla(var(--sd-colour-success-l--50), 0.08);
+  --sd-colour-success-translucent-25:     hsla(var(--sd-colour-success-l--50), 0.29);
   --sd-colour-alert:                      hsla(var(--sd-colour-alert-l--50), 1);
   --sd-colour-alert--hover:               hsla(var(--sd-colour-alert-l--60), 1);
   --sd-colour-alert--active:              hsla(var(--sd-colour-alert-l--40), 1);
+  --sd-colour-alert--text:                hsla(var(--sd-colour-alert-l--30), 1);
   --sd-colour-alert-btn-border:           hsla(var(--sd-colour-alert-l--50), 0.5);
+  --sd-colour-alert-translucent-10:       hsla(var(--sd-colour-alert-l--50), 0.08);
+  --sd-colour-alert-translucent-25:       hsla(var(--sd-colour-alert-l--50), 0.20);
   --sd-colour-warning:                    hsla(var(--sd-colour-warning-l--50), 1);
   --sd-colour-warning--hover:             hsla(var(--sd-colour-warning-l--60), 1);
   --sd-colour-warning--active:            hsla(var(--sd-colour-warning-l--40), 1);
+  --sd-colour-warning--text:              hsla(var(--sd-colour-warning-l--30), 1);
   --sd-colour-warning-btn-border:         hsla(var(--sd-colour-warning-l--50), 0.5);
+  --sd-colour-warning-translucent-10:     hsla(var(--sd-colour-warning-l--50), 0.08);
+  --sd-colour-warning-translucent-25:     hsla(var(--sd-colour-warning-l--50), 0.25);
   --sd-colour-highlight:                  hsla(var(--sd-colour-highlight-l--50), 1);
   --sd-colour-highlight--hover:           hsla(var(--sd-colour-highlight-l--60), 1);
   --sd-colour-highlight--active:          hsla(var(--sd-colour-highlight-l--40), 1);
+  --sd-colour-highlight--text:            hsla(var(--sd-colour-highlight-l--30), 1);
   --sd-colour-highlight-btn-border:       hsla(var(--sd-colour-highlight-l--50), 0.5);
+  --sd-colour-highlight-translucent-10:   hsla(var(--sd-colour-highlight-l--50), 0.1);
+  --sd-colour-highlight-translucent-25:   hsla(var(--sd-colour-highlight-l--50), 0.25);
   --sd-colour-superdesk:                  hsla(var(--sd-colour-superdesk-l--40), 1);
   --sd-colour-superdesk--hover:           hsla(var(--sd-colour-superdesk-l--50), 1);
   --sd-colour-superdesk--active:          hsla(var(--sd-colour-superdesk-l--30), 1);
@@ -8561,8 +8874,10 @@ h6 {
   white-space: nowrap;
   border: 1px solid transparent;
   font-weight: 500;
-  background: var(--sd-colour-bg--08);
-  color: var(--color-text--inverse); }
+  color: var(--sd-lbl-fg);
+  background-color: var(--sd-lbl-bg);
+  --sd-lbl-bg: var(--buoyant-grey-600);
+  --sd-lbl-fg: var(--color-text-ondark); }
   .label--large {
     padding-block-start: 0.5rem;
     padding-block-end: 0.5rem;
@@ -8570,163 +8885,62 @@ h6 {
     font-size: 1.2rem;
     height: 2.4rem;
     line-height: 2.4rem; }
-  .label.label--default {
-    background: #2c323a; }
-  .label.label--primary {
-    background: #5fa9c8; }
   .label.label--success {
-    background: #46a446; }
+    --sd-lbl-bg: var(--color-success-default); }
   .label.label--warning {
-    background: #db8000; }
+    --sd-lbl-bg: var(--color-warning-default); }
   .label.label--alert {
-    background: #e41b21; }
+    --sd-lbl-bg: var(--color-alert-default); }
   .label.label--highlight {
-    background: #9b27b0; }
-  .label.label--success2 {
-    background: #557f2e; }
-  .label.label--yellow2 {
-    background: #d1a700; }
-  .label.label--orange2 {
-    background: #db7100; }
-  .label.label--red2 {
-    background: #bd1600; }
-  .label.label--highlight2 {
-    background: #e60086; }
-  .label.label--highlight3 {
-    background: #8a008a; }
-  .label.label--highlight4 {
-    background: #7400ad; }
-  .label.label--darkBlue2 {
-    background: navy; }
-  .label.label--sd-green {
-    background: #1eae6b; }
+    --sd-lbl-bg: var(--color-highlight-default); }
+  .label.label--primary {
+    --sd-lbl-bg: var(--color-primary-default); }
+  .label.label--info {
+    --sd-lbl-bg: var(--color-info-default); }
   .label.label--hollow {
-    border: 1px solid var(--sd-colour-btn-txt-neutral);
+    --sd-lbl-border: var(--color-text-subdued);
+    border: 1px solid var(--sd-lbl-border);
     background-color: transparent !important;
-    color: var(--sd-colour-btn-txt-neutral); }
-    .label.label--hollow.label--default {
-      border: 1px solid #2c323a;
-      background-color: transparent !important;
-      color: #2c323a; }
-    .label.label--hollow.label--primary {
-      border: 1px solid #5fa9c8;
-      background-color: transparent !important;
-      color: #5fa9c8; }
+    --sd-lbl-fg: var(--color-text-muted); }
     .label.label--hollow.label--success {
-      border: 1px solid #46a446;
-      background-color: transparent !important;
-      color: #46a446; }
+      --sd-lbl-fg: var(--color-success-text);
+      --sd-lbl-border: var(--color-success-default); }
     .label.label--hollow.label--warning {
-      border: 1px solid #db8000;
-      background-color: transparent !important;
-      color: #db8000; }
+      --sd-lbl-fg: var(--color-warning-text);
+      --sd-lbl-border: var(--color-warning-default); }
     .label.label--hollow.label--alert {
-      border: 1px solid #e41b21;
-      background-color: transparent !important;
-      color: #e41b21; }
+      --sd-lbl-fg: var(--color-alert-text);
+      --sd-lbl-border: var(--color-alert-default); }
     .label.label--hollow.label--highlight {
-      border: 1px solid #9b27b0;
-      background-color: transparent !important;
-      color: #9b27b0; }
-    .label.label--hollow.label--success2 {
-      border: 1px solid #557f2e;
-      background-color: transparent !important;
-      color: #557f2e; }
-    .label.label--hollow.label--yellow2 {
-      border: 1px solid #d1a700;
-      background-color: transparent !important;
-      color: #d1a700; }
-    .label.label--hollow.label--orange2 {
-      border: 1px solid #db7100;
-      background-color: transparent !important;
-      color: #db7100; }
-    .label.label--hollow.label--red2 {
-      border: 1px solid #bd1600;
-      background-color: transparent !important;
-      color: #bd1600; }
-    .label.label--hollow.label--highlight2 {
-      border: 1px solid #e60086;
-      background-color: transparent !important;
-      color: #e60086; }
-    .label.label--hollow.label--highlight3 {
-      border: 1px solid #8a008a;
-      background-color: transparent !important;
-      color: #8a008a; }
-    .label.label--hollow.label--highlight4 {
-      border: 1px solid #7400ad;
-      background-color: transparent !important;
-      color: #7400ad; }
-    .label.label--hollow.label--darkBlue2 {
-      border: 1px solid navy;
-      background-color: transparent !important;
-      color: navy; }
-    .label.label--hollow.label--sd-green {
-      border: 1px solid #1eae6b;
-      background-color: transparent !important;
-      color: #1eae6b; }
+      --sd-lbl-fg: var(--color-highlight-text);
+      --sd-lbl-border: var(--color-highlight-default); }
+    .label.label--hollow.label--primary {
+      --sd-lbl-fg: var(--color-primary-text);
+      --sd-lbl-border: var(--color-primary-default); }
+    .label.label--hollow.label--info {
+      --sd-lbl-fg: var(--color-info-text);
+      --sd-lbl-border: var(--color-info-default); }
   .label.label--translucent {
-    background-color: var(--sd-colour-bg-translucent--08);
-    color: var(--sd-colour-btn-txt-neutral); }
-    .label.label--translucent.label--default {
-      background-color: var(--sd-colour-bg-translucent--08);
-      color: #2c323a;
-      background-color: rgba(44, 50, 58, 0.2); }
-    .label.label--translucent.label--primary {
-      background-color: var(--sd-colour-bg-translucent--08);
-      color: #5fa9c8;
-      background-color: rgba(95, 169, 200, 0.2); }
+    --sd-lbl-bg: var(--buoyant-grey-400-a24);
+    --sd-lbl-fg: var(--color-text-muted); }
     .label.label--translucent.label--success {
-      background-color: var(--sd-colour-bg-translucent--08);
-      color: #46a446;
-      background-color: rgba(70, 164, 70, 0.2); }
+      --sd-lbl-fg: var(--color-success-text);
+      --sd-lbl-bg: var(--color-success-translucent); }
     .label.label--translucent.label--warning {
-      background-color: var(--sd-colour-bg-translucent--08);
-      color: #db8000;
-      background-color: rgba(219, 128, 0, 0.2); }
+      --sd-lbl-fg: var(--color-warning-text);
+      --sd-lbl-bg: var(--color-warning-translucent); }
     .label.label--translucent.label--alert {
-      background-color: var(--sd-colour-bg-translucent--08);
-      color: #e41b21;
-      background-color: rgba(228, 27, 33, 0.2); }
+      --sd-lbl-fg: var(--color-alert-text);
+      --sd-lbl-bg: var(--color-alert-translucent); }
     .label.label--translucent.label--highlight {
-      background-color: var(--sd-colour-bg-translucent--08);
-      color: #9b27b0;
-      background-color: rgba(155, 39, 176, 0.2); }
-    .label.label--translucent.label--success2 {
-      background-color: var(--sd-colour-bg-translucent--08);
-      color: #557f2e;
-      background-color: rgba(85, 127, 46, 0.2); }
-    .label.label--translucent.label--yellow2 {
-      background-color: var(--sd-colour-bg-translucent--08);
-      color: #d1a700;
-      background-color: rgba(209, 167, 0, 0.2); }
-    .label.label--translucent.label--orange2 {
-      background-color: var(--sd-colour-bg-translucent--08);
-      color: #db7100;
-      background-color: rgba(219, 113, 0, 0.2); }
-    .label.label--translucent.label--red2 {
-      background-color: var(--sd-colour-bg-translucent--08);
-      color: #bd1600;
-      background-color: rgba(189, 22, 0, 0.2); }
-    .label.label--translucent.label--highlight2 {
-      background-color: var(--sd-colour-bg-translucent--08);
-      color: #e60086;
-      background-color: rgba(230, 0, 134, 0.2); }
-    .label.label--translucent.label--highlight3 {
-      background-color: var(--sd-colour-bg-translucent--08);
-      color: #8a008a;
-      background-color: rgba(138, 0, 138, 0.2); }
-    .label.label--translucent.label--highlight4 {
-      background-color: var(--sd-colour-bg-translucent--08);
-      color: #7400ad;
-      background-color: rgba(116, 0, 173, 0.2); }
-    .label.label--translucent.label--darkBlue2 {
-      background-color: var(--sd-colour-bg-translucent--08);
-      color: navy;
-      background-color: rgba(0, 0, 128, 0.2); }
-    .label.label--translucent.label--sd-green {
-      background-color: var(--sd-colour-bg-translucent--08);
-      color: #1eae6b;
-      background-color: rgba(30, 174, 107, 0.2); }
+      --sd-lbl-fg: var(--color-highlight-text);
+      --sd-lbl-bg: var(--color-highlight-translucent); }
+    .label.label--translucent.label--primary {
+      --sd-lbl-fg: var(--color-primary-text);
+      --sd-lbl-bg: var(--color-primary-translucent); }
+    .label.label--translucent.label--info {
+      --sd-lbl-fg: var(--color-info-text);
+      --sd-lbl-bg: var(--color-info-translucent); }
 
 .label--annotation {
   background-color: #a2df58;
@@ -8747,7 +8961,10 @@ a.label {
   padding-block-start: 0;
   padding-block-end: 0;
   padding-inline-start: 0.8rem;
-  padding-inline-end: 1.8rem; }
+  padding-inline-end: 1.8rem;
+  outline-color: transparent;
+  outline-offset: 1px;
+  transition: outline 0.12s ease; }
   a.label::before {
     display: inline-block;
     font-family: 'sd_icons';
@@ -8764,7 +8981,8 @@ a.label {
     font-variant: normal;
     text-transform: none; }
   a.label:hover, a.label:focus {
-    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.3); }
+    outline-offset: 1px;
+    outline: 1px solid var(--color-primary-default); }
 
 .label.label--hollow.label--darkBlue2 {
   border: 1px solid var(--sd-navy-color);
@@ -26105,96 +26323,51 @@ tags-input,
   display: flex;
   flex-direction: column;
   align-self: stretch;
-  gap: 0.8rem;
-  margin-block-end: 1.6rem; }
+  gap: var(--space--1);
+  margin-block-end: var(--space--2); }
 
 .boxed-list--compact {
-  gap: 0.8rem; }
+  gap: var(--space--1); }
 
 .boxed-list--comfortable {
-  gap: 1.2rem; }
+  gap: var(--space--1-5); }
 
 .boxed-list__item {
+  --item-bg-color: var(--sd-item__main-Bg);
+  --item-border-color: transparent;
+  --item-radius: var(--b-radius--small);
   display: grid;
   grid-template-rows: [mainRow] 1fr [footerRow] auto;
   grid-template-columns: [mediaCol] auto [contentCol] 1fr [actionsVisible] auto [actionsHidden] auto;
   position: relative;
   flex-direction: row;
-  border-radius: var(--b-radius--small);
-  background-color: var(--sd-item__main-Bg);
-  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.16), 0 0 1px rgba(0, 0, 0, 0.1);
+  border-radius: var(--item-radius);
+  background-color: var(--item-bg-color);
+  box-shadow: var(--sd-shadow--z1);
   transition: all 0.2s ease-in-out;
   flex-shrink: 0; }
-  .boxed-list__item.boxed-list__item--default::before {
-    content: "";
-    width: 4px;
-    height: 100%;
-    position: absolute;
-    inset-block-start: 0px;
-    inset-inline-start: 0px;
-    background-color: #8c97a6;
-    z-index: 1;
-    border-radius: 3px 0 0 3px; }
-  .boxed-list__item.boxed-list__item--primary::before {
-    content: "";
-    width: 4px;
-    height: 100%;
-    position: absolute;
-    inset-block-start: 0px;
-    inset-inline-start: 0px;
-    background-color: #5fa9c8;
-    z-index: 1;
-    border-radius: 3px 0 0 3px; }
-  .boxed-list__item.boxed-list__item--success::before {
-    content: "";
-    width: 4px;
-    height: 100%;
-    position: absolute;
-    inset-block-start: 0px;
-    inset-inline-start: 0px;
-    background-color: #46a446;
-    z-index: 1;
-    border-radius: 3px 0 0 3px; }
-  .boxed-list__item.boxed-list__item--warning::before {
-    content: "";
-    width: 4px;
-    height: 100%;
-    position: absolute;
-    inset-block-start: 0px;
-    inset-inline-start: 0px;
-    background-color: #db8000;
-    z-index: 1;
-    border-radius: 3px 0 0 3px; }
-  .boxed-list__item.boxed-list__item--alert::before {
-    content: "";
-    width: 4px;
-    height: 100%;
-    position: absolute;
-    inset-block-start: 0px;
-    inset-inline-start: 0px;
-    background-color: #e41b21;
-    z-index: 1;
-    border-radius: 3px 0 0 3px; }
-  .boxed-list__item.boxed-list__item--highlight::before {
+  .boxed-list__item::before {
     content: "";
     width: 4px;
     height: 100%;
     position: absolute;
     inset-block-start: 0px;
     inset-inline-start: 0px;
-    background-color: #9b27b0;
+    background-color: var(--item-border-color);
     z-index: 1;
-    border-radius: 3px 0 0 3px; }
-  .boxed-list__item.boxed-list__item--sd-green::before {
-    content: "";
-    width: 4px;
-    height: 100%;
-    position: absolute;
-    inset-block-start: 0px;
-    inset-inline-start: 0px;
-    background-color: #1eae6b;
-    z-index: 1;
-    border-radius: 3px 0 0 3px; }
+    border-radius: var(--item-radius) 0 0 var(--item-radius); }
+  .boxed-list__item.boxed-list__item--default {
+    --item-border-color: var(--color-neutral-medium-default); }
+  .boxed-list__item.boxed-list__item--primary {
+    --item-border-color: var(--color-primary-highlight); }
+  .boxed-list__item.boxed-list__item--success {
+    --item-border-color: var(--color-success-highlight); }
+  .boxed-list__item.boxed-list__item--alert {
+    --item-border-color: var(--color-alert-highlight); }
+  .boxed-list__item.boxed-list__item--warning {
+    --item-border-color: var(--color-warning-highlight); }
+  .boxed-list__item.boxed-list__item--highlight {
+    --item-border-color: var(--color-highlight-highlight); }
   .boxed-list__item.boxed-list__item--selected.boxed-list__item--clickable:hover {
     box-shadow: var(--sd-shadow__item--selected);
     background-color: var(--color-selected-bg--hover) !important; }
@@ -26222,6 +26395,21 @@ tags-input,
       .boxed-list__item:hover .boxed-list__actions--slide-in .p-carousel-prev:hover,
       .boxed-list__item:hover .boxed-list__actions--slide-in .p-carousel-next:hover {
         opacity: 1; }
+  .boxed-list__item.boxed-list__item--colored-bg.boxed-list__item--primary {
+    background-color: var(--color-primary-translucent);
+    outline: 1px solid var(--color-primary-translucent); }
+  .boxed-list__item.boxed-list__item--colored-bg.boxed-list__item--success {
+    background-color: var(--color-success-translucent);
+    outline: 1px solid var(--color-success-translucent); }
+  .boxed-list__item.boxed-list__item--colored-bg.boxed-list__item--alert {
+    background-color: var(--color-alert-translucent);
+    outline: 1px solid var(--color-alert-translucent); }
+  .boxed-list__item.boxed-list__item--colored-bg.boxed-list__item--warning {
+    background-color: var(--color-warning-translucent);
+    outline: 1px solid var(--color-warning-translucent); }
+  .boxed-list__item.boxed-list__item--colored-bg.boxed-list__item--highlight {
+    background-color: var(--color-highlight-translucent);
+    outline: 1px solid var(--color-highlight-translucent); }
 
 .boxed-list__item--selected {
   box-shadow: var(--sd-shadow__item--selected); }
@@ -38321,6 +38509,88 @@ textarea.sd-media-carousel__media-title {
 .sd-pagination__item--more {
   pointer-events: none; }
 
+.calendar-week-day__item {
+  --item-bg-color: var(--sd-item__main-Bg);
+  --item-border-color: transparent;
+  --item-radius: var(--b-radius--small);
+  display: flex;
+  flex-direction: column;
+  position: relative;
+  border-radius: var(--item-radius);
+  background-color: var(--item-bg-color);
+  transition: all 0.2s ease-in-out;
+  flex-shrink: 0;
+  min-height: 3.2rem;
+  padding: var(--space--1-5); }
+  .calendar-week-day__item::before {
+    content: "";
+    width: 4px;
+    height: 100%;
+    position: absolute;
+    inset-block-start: 0px;
+    inset-inline-start: 0px;
+    background-color: var(--item-border-color);
+    z-index: 1;
+    border-radius: var(--item-radius) 0 0 var(--item-radius); }
+  .calendar-week-day__item.calendar-week-day__item--colored-bg {
+    outline-offset: -1px;
+    --item-bg-color: var(--color-surface-faded);
+    color: var(--item-fg-color); }
+    .calendar-week-day__item.calendar-week-day__item--colored-bg.boxed-list__item--default {
+      --item-border-color: var(--color-neutral-medium-default); }
+    .calendar-week-day__item.calendar-week-day__item--colored-bg.calendar-week-day__item--primary {
+      --item-bg-color: var(--color-primary-translucent);
+      --item-fg-color: var(--color-primary-text);
+      --item-border-color: var(--color-primary-highlight); }
+    .calendar-week-day__item.calendar-week-day__item--colored-bg.calendar-week-day__item--success {
+      --item-bg-color: var(--color-success-translucent);
+      --item-fg-color: var(--color-success-text);
+      --item-border-color: var(--color-success-highlight); }
+    .calendar-week-day__item.calendar-week-day__item--colored-bg.calendar-week-day__item--alert {
+      --item-bg-color: var(--color-alert-translucent);
+      --item-fg-color: var(--color-alert-text);
+      --item-border-color: var(--color-alert-highlight); }
+    .calendar-week-day__item.calendar-week-day__item--colored-bg.calendar-week-day__item--warning {
+      --item-bg-color: var(--color-warning-translucent);
+      --item-fg-color: var(--color-warning-text);
+      --item-border-color: var(--color-warning-highlight); }
+    .calendar-week-day__item.calendar-week-day__item--colored-bg.calendar-week-day__item--highlight {
+      --item-bg-color: var(--color-highlight-translucent);
+      --item-fg-color: var(--color-highlight-text);
+      --item-border-color: var(--color-highlight-highlight); }
+
+.calendar-week-day__item--selected {
+  box-shadow: var(--sd-shadow__item--selected); }
+
+.calendar-week-day__item--clickable:hover {
+  cursor: pointer;
+  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.16), 0 2px 6px rgba(0, 0, 0, 0.12), 0 0 1px rgba(0, 0, 0, 0.1); }
+
+.calendar-week-day__item--clickable:active {
+  box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.12); }
+
+.calendar-week-day__item--disabled {
+  pointer-events: none;
+  opacity: 0.7; }
+
+.calendar-week-day__item--hidden {
+  pointer-events: none;
+  opacity: 0 !important; }
+
+.calendar-week-day__container {
+  display: grid;
+  grid-template-columns: 1fr;
+  grid-template-rows: 1fr;
+  gap: var(--gap-0-5); }
+  .calendar-week-day__container .calendar-week-day__item {
+    flex-grow: 1; }
+
+.calendar-user-week-row {
+  display: grid;
+  grid-template-columns: repeat(8, 1fr);
+  grid-template-rows: 1fr;
+  gap: var(--gap-1); }
+
 .dropdown {
   position: relative;
   display: inline-block;
@@ -40798,14 +41068,26 @@ textarea.sd-media-carousel__media-title {
     flex-wrap: nowrap; }
 
 .sd-check-button__group--left, .sd-check-button__group--start {
-  margin-inline-end: auto; }
+  margin-inline-end: auto;
+  justify-content: flex-start; }
 
 .sd-check-button__group--right, .sd-check-button__group--end {
-  margin-inline-start: auto; }
+  margin-inline-start: auto;
+  justify-content: flex-end; }
+
+.sd-check-button__group--vertical {
+  flex-direction: column;
+  align-items: flex-start; }
+  .sd-check-button__group--vertical .sd-check-button.sd-check-button--native {
+    align-self: stretch; }
+    .sd-check-button__group--vertical .sd-check-button.sd-check-button--native .sd-check-button__text-label {
+      text-align: left;
+      justify-content: flex-start; }
 
 .sd-check-button__group--center {
   margin-inline-start: auto;
-  margin-inline-end: auto; }
+  margin-inline-end: auto;
+  justify-content: center; }
 
 .sd-check-button__group--inline {
   margin-inline-start: 0;
@@ -53860,14 +54142,26 @@ i.sd-sidetab-menu__helper-icon {
     flex-wrap: nowrap; }
 
 .sd-check-button__group--left, .sd-check-button__group--start {
-  margin-inline-end: auto; }
+  margin-inline-end: auto;
+  justify-content: flex-start; }
 
 .sd-check-button__group--right, .sd-check-button__group--end {
-  margin-inline-start: auto; }
+  margin-inline-start: auto;
+  justify-content: flex-end; }
+
+.sd-check-button__group--vertical {
+  flex-direction: column;
+  align-items: flex-start; }
+  .sd-check-button__group--vertical .sd-check-button.sd-check-button--native {
+    align-self: stretch; }
+    .sd-check-button__group--vertical .sd-check-button.sd-check-button--native .sd-check-button__text-label {
+      text-align: left;
+      justify-content: flex-start; }
 
 .sd-check-button__group--center {
   margin-inline-start: auto;
-  margin-inline-end: auto; }
+  margin-inline-end: auto;
+  justify-content: center; }
 
 .sd-check-button__group--inline {
   margin-inline-start: 0;