@odx/foundation 1.0.0-beta.183 → 1.0.0-beta.184

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/dist/css.css +1 -1
  2. package/dist/main.js +2 -2
  3. package/dist/styles.css +1 -1
  4. package/package.json +3 -3
package/dist/css.css CHANGED
@@ -1 +1 @@
1
- @layer reset,base,variant,state,theme,utils;@layer reset{:where(*){scrollbar-width:thin}:where(*,:before,:after){box-sizing:border-box}:where(body,div,span,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,code,img,svg,small,strike,strong,sub,sup,b,u,i,ol,ul,li,form,label,table,caption,tbody,tfoot,thead,tr,th,td,main,article,aside,canvas,footer,header,nav,section,time,button,video,textarea,input){appearance:none;box-sizing:border-box;margin:0;border:0;padding:0}:where(img,picture,video,canvas){display:block;max-inline-size:100%}:where(input,button,textarea,select){appearance:none;font-family:inherit;font-feature-settings:inherit;font-size:inherit}:where(a){text-decoration:underline;color:var(--odx-color-foreground-accent-rest)}:where(p,h1,h2,h3,h4,h5,h6){overflow-wrap:break-word}:where(p){text-wrap:pretty}:where(h1,h2,h3,h4,h5,h6){text-wrap:balance}:where([popover]){outline:none;border:none}@media (prefers-reduced-motion: reduce){:where(*,:before,:after){transition-duration:0s!important;animation-duration:0s!important;animation-iteration-count:1!important;scroll-behavior:auto!important}}}@layer base{:root{--odx-transition-default: all var(--odx-motion-duration-default) var(--odx-motion-easing-default);--odx-transition-slow: all var(--odx-motion-duration-slow) var(--odx-motion-easing-default);--odx-transition-reduced: all var(--odx-motion-duration-fast) var(--odx-motion-easing-reduced);--odx-focus-ring-outer: var(--odx-size-12) solid var(--odx-color-stroke-focus-outer);--odx-focus-ring-inner: 0 0 0 calc(-1 * var(--odx-focus-ring-offset)) var(--odx-color-stroke-focus-inner) inset;--odx-focus-ring-offset: var(--odx-spacing-negative-12);--odx-focus-ring-offset-sm: var(--odx-spacing-negative-px);--odx-z-level-background: -1;--odx-z-level-base: 0;--odx-z-level-foreground: 1;--odx-z-level-interactive: 2;--odx-z-level-sticky: 10;--odx-z-level-overlay: 100;--odx-z-level-topmost: 9999;--odx-size-interactive-sm: var(--odx-size-200);--odx-size-interactive-md: var(--odx-size-225);--odx-size-interactive-lg: var(--odx-size-300);--odx-spacing-layout-sm: var(--odx-spacing-37);--odx-spacing-layout-md: var(--odx-spacing-75);--odx-spacing-layout-lg: var(--odx-spacing-100);--odx-spacing-interactive-x-sm: var(--odx-spacing-50);--odx-spacing-interactive-x-md: var(--odx-spacing-75);--odx-spacing-interactive-x-lg: var(--odx-spacing-100);--odx-spacing-interactive-y-sm: var(--odx-spacing-25);--odx-spacing-interactive-y-md: var(--odx-spacing-37);--odx-spacing-interactive-y-lg: var(--odx-spacing-50);--odx-font-size-text-xs: var(--odx-typography-font-size-1);--odx-line-height-text-xs: var(--odx-typography-line-height-1);--odx-font-size-text-sm: var(--odx-typography-font-size-2);--odx-line-height-text-sm: var(--odx-typography-line-height-2);--odx-font-size-text-md: var(--odx-breakpoint-font-size-p-base);--odx-line-height-text-md: var(--odx-breakpoint-line-height-p-base);--odx-font-size-text-lg: var(--odx-breakpoint-font-size-p-lg);--odx-line-height-text-lg: var(--odx-breakpoint-line-height-p-lg);--odx-font-size-heading-xs: var(--odx-breakpoint-font-size-heading-6);--odx-line-height-heading-xs: var(--odx-breakpoint-line-height-heading-6);--odx-font-size-heading-sm: var(--odx-breakpoint-font-size-heading-5);--odx-line-height-heading-sm: var(--odx-breakpoint-line-height-heading-5);--odx-font-size-heading-md: var(--odx-breakpoint-font-size-heading-4);--odx-line-height-heading-md: var(--odx-breakpoint-line-height-heading-4);--odx-font-size-heading-lg: var(--odx-breakpoint-font-size-heading-3);--odx-line-height-heading-lg: var(--odx-breakpoint-line-height-heading-3);--odx-font-size-heading-xl: var(--odx-breakpoint-font-size-heading-2);--odx-line-height-heading-xl: var(--odx-breakpoint-line-height-heading-2);--odx-font-size-heading-xxl: var(--odx-breakpoint-font-size-heading-1);--odx-line-height-heading-xxl: var(--odx-breakpoint-line-height-heading-1)}}@layer base{[class*=odx-title-],:where(h1,h2,h3,h4,h5,h6){display:block;font-family:var(--odx-typography-font-family-brand);font-weight:var(--odx-typography-font-weight-semibold)}[class*=odx-title-display-]{font-weight:var(--odx-typography-font-weight-medium)}.odx-title-xs,:where(h6){line-height:var(--odx-line-height-heading-xs);font-size:var(--odx-font-size-heading-xs)}.odx-title-sm,:where(h5){line-height:var(--odx-line-height-heading-sm);font-size:var(--odx-font-size-heading-sm)}.odx-title-md,:where(h4){line-height:var(--odx-line-height-heading-md);font-size:var(--odx-font-size-heading-md)}.odx-title-lg,:where(h3){line-height:var(--odx-line-height-heading-lg);font-size:var(--odx-font-size-heading-lg)}.odx-title-xl,:where(h2){line-height:var(--odx-line-height-heading-xl);font-size:var(--odx-font-size-heading-xl)}.odx-title-xxl,:where(h1){line-height:var(--odx-line-height-heading-xxl);font-size:var(--odx-font-size-heading-xxl)}.odx-title-display-sm{line-height:var(--odx-breakpoint-line-height-display-sm);font-size:var(--odx-breakpoint-font-size-display-sm)}.odx-title-display-md{line-height:var(--odx-breakpoint-line-height-display-md);font-size:var(--odx-breakpoint-font-size-display-md)}.odx-title-display-lg{line-height:var(--odx-breakpoint-line-height-display-lg);font-size:var(--odx-breakpoint-font-size-display-lg)}.odx-title-display-xl{line-height:var(--odx-breakpoint-line-height-display-xl);font-size:var(--odx-breakpoint-font-size-display-xl)}.odx-text-xs{line-height:var(--odx-line-height-text-xs);font-size:var(--odx-font-size-text-xs)}.odx-text-sm{line-height:var(--odx-line-height-text-sm);font-size:var(--odx-font-size-text-sm)}.odx-text-md,:where(p){line-height:var(--odx-line-height-text-md);font-size:var(--odx-font-size-text-md)}.odx-text-lg{line-height:var(--odx-line-height-text-lg);font-size:var(--odx-font-size-text-lg)}}@layer base{odx-content-box,.odx-content-box,.odx-content{>h1,>h2,>h3,>h4,>h5,>h6,>p:not(:last-child){margin-block:0 var(--odx-spacing-layout-md)}ol,ul{margin-block:var(--odx-spacing-layout-md);padding-inline-start:var(--odx-spacing-200)}}odx-content-box,:where(.odx-content-box){background-color:var(--odx-color-background-level-1);padding:var(--odx-spacing-layout-lg)}}@layer base{.odx-cluster,.odx-flank,.odx-stack{display:flex;flex-direction:column;gap:var(--odx-spacing-layout-md);align-items:center;justify-content:flex-start;max-inline-size:100%;text-align:inherit}.odx-cluster{flex-flow:row wrap;align-items:center}.odx-flank{flex-direction:row}.odx-stack{align-items:stretch}.odx-flank:not(.odx-justify-end)>:not(:first-child),.odx-flank.odx-justify-end>:not(:last-child){flex:1}.odx-fill{flex:1}.odx-align-baseline,.odx-align-start{align-items:flex-start}.odx-align-center{align-items:center}.odx-align-end{align-items:end}.odx-justify-start{justify-content:flex-start}.odx-justify-end{justify-content:flex-end}.odx-justify-center{justify-content:center}.odx-justify-space-between{justify-content:space-between}.odx-justify-space-around{justify-content:space-around}.odx-justify-space-evenly{justify-content:space-evenly}.odx-nowrap{flex-wrap:nowrap}}@layer utils{.odx-g-auto{gap:auto}.odx-gx-auto{column-gap:auto}.odx-gy-auto{row-gap:auto}.odx-m-auto{margin:auto}.odx-mx-auto{margin-inline:auto}.odx-ml-auto{margin-inline-start:auto}.odx-mr-auto{margin-inline-end:auto}.odx-my-auto{margin-block:auto}.odx-mt-auto{margin-block-start:auto}.odx-mb-auto{margin-block-end:auto}.odx-p-auto{padding:auto}.odx-px-auto{padding-inline:auto}.odx-pl-auto{padding-inline-start:auto}.odx-pr-auto{padding-inline-end:auto}.odx-py-auto{padding-block:auto}.odx-pt-auto{padding-block-start:auto}.odx-ps-auto{padding-block-end:auto}.odx-g-0{gap:0}.odx-gx-0{column-gap:0}.odx-gy-0{row-gap:0}.odx-m-0{margin:0}.odx-mx-0{margin-inline:0}.odx-ml-0{margin-inline-start:0}.odx-mr-0{margin-inline-end:0}.odx-my-0{margin-block:0}.odx-mt-0{margin-block-start:0}.odx-mb-0{margin-block-end:0}.odx-p-0{padding:0}.odx-px-0{padding-inline:0}.odx-pl-0{padding-inline-start:0}.odx-pr-0{padding-inline-end:0}.odx-py-0{padding-block:0}.odx-pt-0{padding-block-start:0}.odx-ps-0{padding-block-end:0}.odx-g-1{gap:var(--odx-spacing-px)}.odx-gx-1{column-gap:var(--odx-spacing-px)}.odx-gy-1{row-gap:var(--odx-spacing-px)}.odx-m-1{margin:var(--odx-spacing-px)}.odx-mx-1{margin-inline:var(--odx-spacing-px)}.odx-ml-1{margin-inline-start:var(--odx-spacing-px)}.odx-mr-1{margin-inline-end:var(--odx-spacing-px)}.odx-my-1{margin-block:var(--odx-spacing-px)}.odx-mt-1{margin-block-start:var(--odx-spacing-px)}.odx-mb-1{margin-block-end:var(--odx-spacing-px)}.odx-p-1{padding:var(--odx-spacing-px)}.odx-px-1{padding-inline:var(--odx-spacing-px)}.odx-pl-1{padding-inline-start:var(--odx-spacing-px)}.odx-pr-1{padding-inline-end:var(--odx-spacing-px)}.odx-py-1{padding-block:var(--odx-spacing-px)}.odx-pt-1{padding-block-start:var(--odx-spacing-px)}.odx-ps-1{padding-block-end:var(--odx-spacing-px)}.odx-g-12{gap:var(--odx-spacing-12)}.odx-gx-12{column-gap:var(--odx-spacing-12)}.odx-gy-12{row-gap:var(--odx-spacing-12)}.odx-m-12{margin:var(--odx-spacing-12)}.odx-mx-12{margin-inline:var(--odx-spacing-12)}.odx-ml-12{margin-inline-start:var(--odx-spacing-12)}.odx-mr-12{margin-inline-end:var(--odx-spacing-12)}.odx-my-12{margin-block:var(--odx-spacing-12)}.odx-mt-12{margin-block-start:var(--odx-spacing-12)}.odx-mb-12{margin-block-end:var(--odx-spacing-12)}.odx-p-12{padding:var(--odx-spacing-12)}.odx-px-12{padding-inline:var(--odx-spacing-12)}.odx-pl-12{padding-inline-start:var(--odx-spacing-12)}.odx-pr-12{padding-inline-end:var(--odx-spacing-12)}.odx-py-12{padding-block:var(--odx-spacing-12)}.odx-pt-12{padding-block-start:var(--odx-spacing-12)}.odx-ps-12{padding-block-end:var(--odx-spacing-12)}.odx-g-25{gap:var(--odx-spacing-25)}.odx-gx-25{column-gap:var(--odx-spacing-25)}.odx-gy-25{row-gap:var(--odx-spacing-25)}.odx-m-25{margin:var(--odx-spacing-25)}.odx-mx-25{margin-inline:var(--odx-spacing-25)}.odx-ml-25{margin-inline-start:var(--odx-spacing-25)}.odx-mr-25{margin-inline-end:var(--odx-spacing-25)}.odx-my-25{margin-block:var(--odx-spacing-25)}.odx-mt-25{margin-block-start:var(--odx-spacing-25)}.odx-mb-25{margin-block-end:var(--odx-spacing-25)}.odx-p-25{padding:var(--odx-spacing-25)}.odx-px-25{padding-inline:var(--odx-spacing-25)}.odx-pl-25{padding-inline-start:var(--odx-spacing-25)}.odx-pr-25{padding-inline-end:var(--odx-spacing-25)}.odx-py-25{padding-block:var(--odx-spacing-25)}.odx-pt-25{padding-block-start:var(--odx-spacing-25)}.odx-ps-25{padding-block-end:var(--odx-spacing-25)}.odx-g-37{gap:var(--odx-spacing-37)}.odx-gx-37{column-gap:var(--odx-spacing-37)}.odx-gy-37{row-gap:var(--odx-spacing-37)}.odx-m-37{margin:var(--odx-spacing-37)}.odx-mx-37{margin-inline:var(--odx-spacing-37)}.odx-ml-37{margin-inline-start:var(--odx-spacing-37)}.odx-mr-37{margin-inline-end:var(--odx-spacing-37)}.odx-my-37{margin-block:var(--odx-spacing-37)}.odx-mt-37{margin-block-start:var(--odx-spacing-37)}.odx-mb-37{margin-block-end:var(--odx-spacing-37)}.odx-p-37{padding:var(--odx-spacing-37)}.odx-px-37{padding-inline:var(--odx-spacing-37)}.odx-pl-37{padding-inline-start:var(--odx-spacing-37)}.odx-pr-37{padding-inline-end:var(--odx-spacing-37)}.odx-py-37{padding-block:var(--odx-spacing-37)}.odx-pt-37{padding-block-start:var(--odx-spacing-37)}.odx-ps-37{padding-block-end:var(--odx-spacing-37)}.odx-g-50{gap:var(--odx-spacing-50)}.odx-gx-50{column-gap:var(--odx-spacing-50)}.odx-gy-50{row-gap:var(--odx-spacing-50)}.odx-m-50{margin:var(--odx-spacing-50)}.odx-mx-50{margin-inline:var(--odx-spacing-50)}.odx-ml-50{margin-inline-start:var(--odx-spacing-50)}.odx-mr-50{margin-inline-end:var(--odx-spacing-50)}.odx-my-50{margin-block:var(--odx-spacing-50)}.odx-mt-50{margin-block-start:var(--odx-spacing-50)}.odx-mb-50{margin-block-end:var(--odx-spacing-50)}.odx-p-50{padding:var(--odx-spacing-50)}.odx-px-50{padding-inline:var(--odx-spacing-50)}.odx-pl-50{padding-inline-start:var(--odx-spacing-50)}.odx-pr-50{padding-inline-end:var(--odx-spacing-50)}.odx-py-50{padding-block:var(--odx-spacing-50)}.odx-pt-50{padding-block-start:var(--odx-spacing-50)}.odx-ps-50{padding-block-end:var(--odx-spacing-50)}.odx-g-75{gap:var(--odx-spacing-75)}.odx-gx-75{column-gap:var(--odx-spacing-75)}.odx-gy-75{row-gap:var(--odx-spacing-75)}.odx-m-75{margin:var(--odx-spacing-75)}.odx-mx-75{margin-inline:var(--odx-spacing-75)}.odx-ml-75{margin-inline-start:var(--odx-spacing-75)}.odx-mr-75{margin-inline-end:var(--odx-spacing-75)}.odx-my-75{margin-block:var(--odx-spacing-75)}.odx-mt-75{margin-block-start:var(--odx-spacing-75)}.odx-mb-75{margin-block-end:var(--odx-spacing-75)}.odx-p-75{padding:var(--odx-spacing-75)}.odx-px-75{padding-inline:var(--odx-spacing-75)}.odx-pl-75{padding-inline-start:var(--odx-spacing-75)}.odx-pr-75{padding-inline-end:var(--odx-spacing-75)}.odx-py-75{padding-block:var(--odx-spacing-75)}.odx-pt-75{padding-block-start:var(--odx-spacing-75)}.odx-ps-75{padding-block-end:var(--odx-spacing-75)}.odx-g-100{gap:var(--odx-spacing-100)}.odx-gx-100{column-gap:var(--odx-spacing-100)}.odx-gy-100{row-gap:var(--odx-spacing-100)}.odx-m-100{margin:var(--odx-spacing-100)}.odx-mx-100{margin-inline:var(--odx-spacing-100)}.odx-ml-100{margin-inline-start:var(--odx-spacing-100)}.odx-mr-100{margin-inline-end:var(--odx-spacing-100)}.odx-my-100{margin-block:var(--odx-spacing-100)}.odx-mt-100{margin-block-start:var(--odx-spacing-100)}.odx-mb-100{margin-block-end:var(--odx-spacing-100)}.odx-p-100{padding:var(--odx-spacing-100)}.odx-px-100{padding-inline:var(--odx-spacing-100)}.odx-pl-100{padding-inline-start:var(--odx-spacing-100)}.odx-pr-100{padding-inline-end:var(--odx-spacing-100)}.odx-py-100{padding-block:var(--odx-spacing-100)}.odx-pt-100{padding-block-start:var(--odx-spacing-100)}.odx-ps-100{padding-block-end:var(--odx-spacing-100)}.odx-g-150{gap:var(--odx-spacing-150)}.odx-gx-150{column-gap:var(--odx-spacing-150)}.odx-gy-150{row-gap:var(--odx-spacing-150)}.odx-m-150{margin:var(--odx-spacing-150)}.odx-mx-150{margin-inline:var(--odx-spacing-150)}.odx-ml-150{margin-inline-start:var(--odx-spacing-150)}.odx-mr-150{margin-inline-end:var(--odx-spacing-150)}.odx-my-150{margin-block:var(--odx-spacing-150)}.odx-mt-150{margin-block-start:var(--odx-spacing-150)}.odx-mb-150{margin-block-end:var(--odx-spacing-150)}.odx-p-150{padding:var(--odx-spacing-150)}.odx-px-150{padding-inline:var(--odx-spacing-150)}.odx-pl-150{padding-inline-start:var(--odx-spacing-150)}.odx-pr-150{padding-inline-end:var(--odx-spacing-150)}.odx-py-150{padding-block:var(--odx-spacing-150)}.odx-pt-150{padding-block-start:var(--odx-spacing-150)}.odx-ps-150{padding-block-end:var(--odx-spacing-150)}.odx-g-200{gap:var(--odx-spacing-200)}.odx-gx-200{column-gap:var(--odx-spacing-200)}.odx-gy-200{row-gap:var(--odx-spacing-200)}.odx-m-200{margin:var(--odx-spacing-200)}.odx-mx-200{margin-inline:var(--odx-spacing-200)}.odx-ml-200{margin-inline-start:var(--odx-spacing-200)}.odx-mr-200{margin-inline-end:var(--odx-spacing-200)}.odx-my-200{margin-block:var(--odx-spacing-200)}.odx-mt-200{margin-block-start:var(--odx-spacing-200)}.odx-mb-200{margin-block-end:var(--odx-spacing-200)}.odx-p-200{padding:var(--odx-spacing-200)}.odx-px-200{padding-inline:var(--odx-spacing-200)}.odx-pl-200{padding-inline-start:var(--odx-spacing-200)}.odx-pr-200{padding-inline-end:var(--odx-spacing-200)}.odx-py-200{padding-block:var(--odx-spacing-200)}.odx-pt-200{padding-block-start:var(--odx-spacing-200)}.odx-ps-200{padding-block-end:var(--odx-spacing-200)}.odx-g-250{gap:var(--odx-spacing-250)}.odx-gx-250{column-gap:var(--odx-spacing-250)}.odx-gy-250{row-gap:var(--odx-spacing-250)}.odx-m-250{margin:var(--odx-spacing-250)}.odx-mx-250{margin-inline:var(--odx-spacing-250)}.odx-ml-250{margin-inline-start:var(--odx-spacing-250)}.odx-mr-250{margin-inline-end:var(--odx-spacing-250)}.odx-my-250{margin-block:var(--odx-spacing-250)}.odx-mt-250{margin-block-start:var(--odx-spacing-250)}.odx-mb-250{margin-block-end:var(--odx-spacing-250)}.odx-p-250{padding:var(--odx-spacing-250)}.odx-px-250{padding-inline:var(--odx-spacing-250)}.odx-pl-250{padding-inline-start:var(--odx-spacing-250)}.odx-pr-250{padding-inline-end:var(--odx-spacing-250)}.odx-py-250{padding-block:var(--odx-spacing-250)}.odx-pt-250{padding-block-start:var(--odx-spacing-250)}.odx-ps-250{padding-block-end:var(--odx-spacing-250)}.odx-g-layout-sm{gap:var(--odx-spacing-layout-sm)}.odx-gx-layout-sm{column-gap:var(--odx-spacing-layout-sm)}.odx-gy-layout-sm{row-gap:var(--odx-spacing-layout-sm)}.odx-m-layout-sm{margin:var(--odx-spacing-layout-sm)}.odx-mx-layout-sm{margin-inline:var(--odx-spacing-layout-sm)}.odx-ml-layout-sm{margin-inline-start:var(--odx-spacing-layout-sm)}.odx-mr-layout-sm{margin-inline-end:var(--odx-spacing-layout-sm)}.odx-my-layout-sm{margin-block:var(--odx-spacing-layout-sm)}.odx-mt-layout-sm{margin-block-start:var(--odx-spacing-layout-sm)}.odx-mb-layout-sm{margin-block-end:var(--odx-spacing-layout-sm)}.odx-p-layout-sm{padding:var(--odx-spacing-layout-sm)}.odx-px-layout-sm{padding-inline:var(--odx-spacing-layout-sm)}.odx-pl-layout-sm{padding-inline-start:var(--odx-spacing-layout-sm)}.odx-pr-layout-sm{padding-inline-end:var(--odx-spacing-layout-sm)}.odx-py-layout-sm{padding-block:var(--odx-spacing-layout-sm)}.odx-pt-layout-sm{padding-block-start:var(--odx-spacing-layout-sm)}.odx-ps-layout-sm{padding-block-end:var(--odx-spacing-layout-sm)}.odx-g-layout-md{gap:var(--odx-spacing-layout-md)}.odx-gx-layout-md{column-gap:var(--odx-spacing-layout-md)}.odx-gy-layout-md{row-gap:var(--odx-spacing-layout-md)}.odx-m-layout-md{margin:var(--odx-spacing-layout-md)}.odx-mx-layout-md{margin-inline:var(--odx-spacing-layout-md)}.odx-ml-layout-md{margin-inline-start:var(--odx-spacing-layout-md)}.odx-mr-layout-md{margin-inline-end:var(--odx-spacing-layout-md)}.odx-my-layout-md{margin-block:var(--odx-spacing-layout-md)}.odx-mt-layout-md{margin-block-start:var(--odx-spacing-layout-md)}.odx-mb-layout-md{margin-block-end:var(--odx-spacing-layout-md)}.odx-p-layout-md{padding:var(--odx-spacing-layout-md)}.odx-px-layout-md{padding-inline:var(--odx-spacing-layout-md)}.odx-pl-layout-md{padding-inline-start:var(--odx-spacing-layout-md)}.odx-pr-layout-md{padding-inline-end:var(--odx-spacing-layout-md)}.odx-py-layout-md{padding-block:var(--odx-spacing-layout-md)}.odx-pt-layout-md{padding-block-start:var(--odx-spacing-layout-md)}.odx-ps-layout-md{padding-block-end:var(--odx-spacing-layout-md)}.odx-g-layout-lg{gap:var(--odx-spacing-layout-lg)}.odx-gx-layout-lg{column-gap:var(--odx-spacing-layout-lg)}.odx-gy-layout-lg{row-gap:var(--odx-spacing-layout-lg)}.odx-m-layout-lg{margin:var(--odx-spacing-layout-lg)}.odx-mx-layout-lg{margin-inline:var(--odx-spacing-layout-lg)}.odx-ml-layout-lg{margin-inline-start:var(--odx-spacing-layout-lg)}.odx-mr-layout-lg{margin-inline-end:var(--odx-spacing-layout-lg)}.odx-my-layout-lg{margin-block:var(--odx-spacing-layout-lg)}.odx-mt-layout-lg{margin-block-start:var(--odx-spacing-layout-lg)}.odx-mb-layout-lg{margin-block-end:var(--odx-spacing-layout-lg)}.odx-p-layout-lg{padding:var(--odx-spacing-layout-lg)}.odx-px-layout-lg{padding-inline:var(--odx-spacing-layout-lg)}.odx-pl-layout-lg{padding-inline-start:var(--odx-spacing-layout-lg)}.odx-pr-layout-lg{padding-inline-end:var(--odx-spacing-layout-lg)}.odx-py-layout-lg{padding-block:var(--odx-spacing-layout-lg)}.odx-pt-layout-lg{padding-block-start:var(--odx-spacing-layout-lg)}.odx-ps-layout-lg{padding-block-end:var(--odx-spacing-layout-lg)}.odx-no-overflow{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.odx-visually-hidden:not(:focus-within),.odx-visually-hidden-force{position:absolute!important;border:none!important;padding:0!important;width:1px!important;height:1px!important;overflow:hidden!important;white-space:nowrap!important;clip-path:rect(0 0 0 0)!important}}@layer base{:root{scrollbar-color:var(--odx-color-background-brand) transparent}.odx-dark-mode{color-scheme:dark}.odx-light-mode{color-scheme:light}html{scroll-behavior:smooth}body{background-color:var(--odx-color-background-base);line-height:var(--odx-typography-line-height-base);color:var(--odx-color-foreground-rest);font-family:var(--odx-typography-font-family-base),"Noto Sans",Kanit,sans-serif;font-size:var(--odx-typography-font-size-base)}}
1
+ @layer reset,base,variant,state,theme,utils;:root{--odx-transition-default: all var(--odx-motion-duration-default) var(--odx-motion-easing-default);--odx-transition-slow: all var(--odx-motion-duration-slow) var(--odx-motion-easing-default);--odx-transition-reduced: all var(--odx-motion-duration-fast) var(--odx-motion-easing-reduced);--odx-focus-ring-outer: var(--odx-size-12) solid var(--odx-color-stroke-focus-outer);--odx-focus-ring-inner: 0 0 0 calc(-1 * var(--odx-focus-ring-offset)) var(--odx-color-stroke-focus-inner) inset;--odx-focus-ring-offset: var(--odx-spacing-negative-12);--odx-focus-ring-offset-sm: var(--odx-spacing-negative-px);--odx-z-level-background: -1;--odx-z-level-base: 0;--odx-z-level-foreground: 1;--odx-z-level-interactive: 2;--odx-z-level-sticky: 10;--odx-z-level-overlay: 100;--odx-z-level-topmost: 9999;--odx-size-interactive-sm: var(--odx-size-200);--odx-size-interactive-md: var(--odx-size-225);--odx-size-interactive-lg: var(--odx-size-300);--odx-spacing-layout-sm: var(--odx-spacing-37);--odx-spacing-layout-md: var(--odx-spacing-75);--odx-spacing-layout-lg: var(--odx-spacing-100);--odx-spacing-interactive-x-sm: var(--odx-spacing-50);--odx-spacing-interactive-x-md: var(--odx-spacing-75);--odx-spacing-interactive-x-lg: var(--odx-spacing-100);--odx-spacing-interactive-y-sm: var(--odx-spacing-25);--odx-spacing-interactive-y-md: var(--odx-spacing-37);--odx-spacing-interactive-y-lg: var(--odx-spacing-50);--odx-font-size-text-xs: var(--odx-typography-font-size-1);--odx-line-height-text-xs: var(--odx-typography-line-height-1);--odx-font-size-text-sm: var(--odx-typography-font-size-2);--odx-line-height-text-sm: var(--odx-typography-line-height-2);--odx-font-size-text-md: var(--odx-breakpoint-font-size-p-base);--odx-line-height-text-md: var(--odx-breakpoint-line-height-p-base);--odx-font-size-text-lg: var(--odx-breakpoint-font-size-p-lg);--odx-line-height-text-lg: var(--odx-breakpoint-line-height-p-lg);--odx-font-size-heading-xs: var(--odx-breakpoint-font-size-heading-6);--odx-line-height-heading-xs: var(--odx-breakpoint-line-height-heading-6);--odx-font-size-heading-sm: var(--odx-breakpoint-font-size-heading-5);--odx-line-height-heading-sm: var(--odx-breakpoint-line-height-heading-5);--odx-font-size-heading-md: var(--odx-breakpoint-font-size-heading-4);--odx-line-height-heading-md: var(--odx-breakpoint-line-height-heading-4);--odx-font-size-heading-lg: var(--odx-breakpoint-font-size-heading-3);--odx-line-height-heading-lg: var(--odx-breakpoint-line-height-heading-3);--odx-font-size-heading-xl: var(--odx-breakpoint-font-size-heading-2);--odx-line-height-heading-xl: var(--odx-breakpoint-line-height-heading-2);--odx-font-size-heading-xxl: var(--odx-breakpoint-font-size-heading-1);--odx-line-height-heading-xxl: var(--odx-breakpoint-line-height-heading-1)}@layer reset{:where(*){scrollbar-width:thin}:where(*,:before,:after){box-sizing:border-box}:where(body,div,span,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,code,img,svg,small,strike,strong,sub,sup,b,u,i,ol,ul,li,form,label,table,caption,tbody,tfoot,thead,tr,th,td,main,article,aside,canvas,footer,header,nav,section,time,button,video,textarea,input){appearance:none;box-sizing:border-box;margin:0;border:0;padding:0}:where(img,picture,video,canvas){display:block;max-inline-size:100%}:where(input,button,textarea,select){appearance:none;font-family:inherit;font-feature-settings:inherit;font-size:inherit}:where(a){text-decoration:underline;color:var(--odx-color-foreground-accent-rest)}:where(p,h1,h2,h3,h4,h5,h6){overflow-wrap:break-word}:where(p){text-wrap:pretty}:where(h1,h2,h3,h4,h5,h6){text-wrap:balance}:where([popover]){outline:none;border:none}@media (prefers-reduced-motion: reduce){:where(*,:before,:after){transition-duration:0s!important;animation-duration:0s!important;animation-iteration-count:1!important;scroll-behavior:auto!important}}}@layer base{[class*=odx-title-],:where(h1,h2,h3,h4,h5,h6){display:block;font-family:var(--odx-typography-font-family-brand);font-weight:var(--odx-typography-font-weight-semibold)}[class*=odx-title-display-]{font-weight:var(--odx-typography-font-weight-medium)}.odx-title-xs,:where(h6){line-height:var(--odx-line-height-heading-xs);font-size:var(--odx-font-size-heading-xs)}.odx-title-sm,:where(h5){line-height:var(--odx-line-height-heading-sm);font-size:var(--odx-font-size-heading-sm)}.odx-title-md,:where(h4){line-height:var(--odx-line-height-heading-md);font-size:var(--odx-font-size-heading-md)}.odx-title-lg,:where(h3){line-height:var(--odx-line-height-heading-lg);font-size:var(--odx-font-size-heading-lg)}.odx-title-xl,:where(h2){line-height:var(--odx-line-height-heading-xl);font-size:var(--odx-font-size-heading-xl)}.odx-title-xxl,:where(h1){line-height:var(--odx-line-height-heading-xxl);font-size:var(--odx-font-size-heading-xxl)}.odx-title-display-sm{line-height:var(--odx-breakpoint-line-height-display-sm);font-size:var(--odx-breakpoint-font-size-display-sm)}.odx-title-display-md{line-height:var(--odx-breakpoint-line-height-display-md);font-size:var(--odx-breakpoint-font-size-display-md)}.odx-title-display-lg{line-height:var(--odx-breakpoint-line-height-display-lg);font-size:var(--odx-breakpoint-font-size-display-lg)}.odx-title-display-xl{line-height:var(--odx-breakpoint-line-height-display-xl);font-size:var(--odx-breakpoint-font-size-display-xl)}.odx-text-xs{line-height:var(--odx-line-height-text-xs);font-size:var(--odx-font-size-text-xs)}.odx-text-sm{line-height:var(--odx-line-height-text-sm);font-size:var(--odx-font-size-text-sm)}.odx-text-md,:where(p){line-height:var(--odx-line-height-text-md);font-size:var(--odx-font-size-text-md)}.odx-text-lg{line-height:var(--odx-line-height-text-lg);font-size:var(--odx-font-size-text-lg)}}@layer base{odx-content-box,.odx-content-box,.odx-content{>h1,>h2,>h3,>h4,>h5,>h6,>p:not(:last-child){margin-block:0 var(--odx-spacing-layout-md)}ol,ul{margin-block:var(--odx-spacing-layout-md);padding-inline-start:var(--odx-spacing-200)}}odx-content-box,:where(.odx-content-box){background-color:var(--odx-color-background-level-1);padding:var(--odx-spacing-layout-lg)}}@layer base{.odx-cluster,.odx-flank,.odx-stack{display:flex;flex-direction:column;gap:var(--odx-spacing-layout-md);align-items:center;justify-content:flex-start;max-inline-size:100%;text-align:inherit}.odx-cluster{flex-flow:row wrap;align-items:center}.odx-flank{flex-direction:row}.odx-stack{align-items:stretch}.odx-flank:not(.odx-justify-end)>:not(:first-child),.odx-flank.odx-justify-end>:not(:last-child){flex:1}.odx-fill{flex:1}.odx-align-baseline,.odx-align-start{align-items:flex-start}.odx-align-center{align-items:center}.odx-align-end{align-items:end}.odx-justify-start{justify-content:flex-start}.odx-justify-end{justify-content:flex-end}.odx-justify-center{justify-content:center}.odx-justify-space-between{justify-content:space-between}.odx-justify-space-around{justify-content:space-around}.odx-justify-space-evenly{justify-content:space-evenly}.odx-nowrap{flex-wrap:nowrap}}@layer utils{.odx-g-auto{gap:auto}.odx-gx-auto{column-gap:auto}.odx-gy-auto{row-gap:auto}.odx-m-auto{margin:auto}.odx-mx-auto{margin-inline:auto}.odx-ml-auto{margin-inline-start:auto}.odx-mr-auto{margin-inline-end:auto}.odx-my-auto{margin-block:auto}.odx-mt-auto{margin-block-start:auto}.odx-mb-auto{margin-block-end:auto}.odx-p-auto{padding:auto}.odx-px-auto{padding-inline:auto}.odx-pl-auto{padding-inline-start:auto}.odx-pr-auto{padding-inline-end:auto}.odx-py-auto{padding-block:auto}.odx-pt-auto{padding-block-start:auto}.odx-pb-auto{padding-block-end:auto}.odx-g-0{gap:0}.odx-gx-0{column-gap:0}.odx-gy-0{row-gap:0}.odx-m-0{margin:0}.odx-mx-0{margin-inline:0}.odx-ml-0{margin-inline-start:0}.odx-mr-0{margin-inline-end:0}.odx-my-0{margin-block:0}.odx-mt-0{margin-block-start:0}.odx-mb-0{margin-block-end:0}.odx-p-0{padding:0}.odx-px-0{padding-inline:0}.odx-pl-0{padding-inline-start:0}.odx-pr-0{padding-inline-end:0}.odx-py-0{padding-block:0}.odx-pt-0{padding-block-start:0}.odx-pb-0{padding-block-end:0}.odx-g-1{gap:var(--odx-spacing-px)}.odx-gx-1{column-gap:var(--odx-spacing-px)}.odx-gy-1{row-gap:var(--odx-spacing-px)}.odx-m-1{margin:var(--odx-spacing-px)}.odx-mx-1{margin-inline:var(--odx-spacing-px)}.odx-ml-1{margin-inline-start:var(--odx-spacing-px)}.odx-mr-1{margin-inline-end:var(--odx-spacing-px)}.odx-my-1{margin-block:var(--odx-spacing-px)}.odx-mt-1{margin-block-start:var(--odx-spacing-px)}.odx-mb-1{margin-block-end:var(--odx-spacing-px)}.odx-p-1{padding:var(--odx-spacing-px)}.odx-px-1{padding-inline:var(--odx-spacing-px)}.odx-pl-1{padding-inline-start:var(--odx-spacing-px)}.odx-pr-1{padding-inline-end:var(--odx-spacing-px)}.odx-py-1{padding-block:var(--odx-spacing-px)}.odx-pt-1{padding-block-start:var(--odx-spacing-px)}.odx-pb-1{padding-block-end:var(--odx-spacing-px)}.odx-g-12{gap:var(--odx-spacing-12)}.odx-gx-12{column-gap:var(--odx-spacing-12)}.odx-gy-12{row-gap:var(--odx-spacing-12)}.odx-m-12{margin:var(--odx-spacing-12)}.odx-mx-12{margin-inline:var(--odx-spacing-12)}.odx-ml-12{margin-inline-start:var(--odx-spacing-12)}.odx-mr-12{margin-inline-end:var(--odx-spacing-12)}.odx-my-12{margin-block:var(--odx-spacing-12)}.odx-mt-12{margin-block-start:var(--odx-spacing-12)}.odx-mb-12{margin-block-end:var(--odx-spacing-12)}.odx-p-12{padding:var(--odx-spacing-12)}.odx-px-12{padding-inline:var(--odx-spacing-12)}.odx-pl-12{padding-inline-start:var(--odx-spacing-12)}.odx-pr-12{padding-inline-end:var(--odx-spacing-12)}.odx-py-12{padding-block:var(--odx-spacing-12)}.odx-pt-12{padding-block-start:var(--odx-spacing-12)}.odx-pb-12{padding-block-end:var(--odx-spacing-12)}.odx-g-25{gap:var(--odx-spacing-25)}.odx-gx-25{column-gap:var(--odx-spacing-25)}.odx-gy-25{row-gap:var(--odx-spacing-25)}.odx-m-25{margin:var(--odx-spacing-25)}.odx-mx-25{margin-inline:var(--odx-spacing-25)}.odx-ml-25{margin-inline-start:var(--odx-spacing-25)}.odx-mr-25{margin-inline-end:var(--odx-spacing-25)}.odx-my-25{margin-block:var(--odx-spacing-25)}.odx-mt-25{margin-block-start:var(--odx-spacing-25)}.odx-mb-25{margin-block-end:var(--odx-spacing-25)}.odx-p-25{padding:var(--odx-spacing-25)}.odx-px-25{padding-inline:var(--odx-spacing-25)}.odx-pl-25{padding-inline-start:var(--odx-spacing-25)}.odx-pr-25{padding-inline-end:var(--odx-spacing-25)}.odx-py-25{padding-block:var(--odx-spacing-25)}.odx-pt-25{padding-block-start:var(--odx-spacing-25)}.odx-pb-25{padding-block-end:var(--odx-spacing-25)}.odx-g-37{gap:var(--odx-spacing-37)}.odx-gx-37{column-gap:var(--odx-spacing-37)}.odx-gy-37{row-gap:var(--odx-spacing-37)}.odx-m-37{margin:var(--odx-spacing-37)}.odx-mx-37{margin-inline:var(--odx-spacing-37)}.odx-ml-37{margin-inline-start:var(--odx-spacing-37)}.odx-mr-37{margin-inline-end:var(--odx-spacing-37)}.odx-my-37{margin-block:var(--odx-spacing-37)}.odx-mt-37{margin-block-start:var(--odx-spacing-37)}.odx-mb-37{margin-block-end:var(--odx-spacing-37)}.odx-p-37{padding:var(--odx-spacing-37)}.odx-px-37{padding-inline:var(--odx-spacing-37)}.odx-pl-37{padding-inline-start:var(--odx-spacing-37)}.odx-pr-37{padding-inline-end:var(--odx-spacing-37)}.odx-py-37{padding-block:var(--odx-spacing-37)}.odx-pt-37{padding-block-start:var(--odx-spacing-37)}.odx-pb-37{padding-block-end:var(--odx-spacing-37)}.odx-g-50{gap:var(--odx-spacing-50)}.odx-gx-50{column-gap:var(--odx-spacing-50)}.odx-gy-50{row-gap:var(--odx-spacing-50)}.odx-m-50{margin:var(--odx-spacing-50)}.odx-mx-50{margin-inline:var(--odx-spacing-50)}.odx-ml-50{margin-inline-start:var(--odx-spacing-50)}.odx-mr-50{margin-inline-end:var(--odx-spacing-50)}.odx-my-50{margin-block:var(--odx-spacing-50)}.odx-mt-50{margin-block-start:var(--odx-spacing-50)}.odx-mb-50{margin-block-end:var(--odx-spacing-50)}.odx-p-50{padding:var(--odx-spacing-50)}.odx-px-50{padding-inline:var(--odx-spacing-50)}.odx-pl-50{padding-inline-start:var(--odx-spacing-50)}.odx-pr-50{padding-inline-end:var(--odx-spacing-50)}.odx-py-50{padding-block:var(--odx-spacing-50)}.odx-pt-50{padding-block-start:var(--odx-spacing-50)}.odx-pb-50{padding-block-end:var(--odx-spacing-50)}.odx-g-75{gap:var(--odx-spacing-75)}.odx-gx-75{column-gap:var(--odx-spacing-75)}.odx-gy-75{row-gap:var(--odx-spacing-75)}.odx-m-75{margin:var(--odx-spacing-75)}.odx-mx-75{margin-inline:var(--odx-spacing-75)}.odx-ml-75{margin-inline-start:var(--odx-spacing-75)}.odx-mr-75{margin-inline-end:var(--odx-spacing-75)}.odx-my-75{margin-block:var(--odx-spacing-75)}.odx-mt-75{margin-block-start:var(--odx-spacing-75)}.odx-mb-75{margin-block-end:var(--odx-spacing-75)}.odx-p-75{padding:var(--odx-spacing-75)}.odx-px-75{padding-inline:var(--odx-spacing-75)}.odx-pl-75{padding-inline-start:var(--odx-spacing-75)}.odx-pr-75{padding-inline-end:var(--odx-spacing-75)}.odx-py-75{padding-block:var(--odx-spacing-75)}.odx-pt-75{padding-block-start:var(--odx-spacing-75)}.odx-pb-75{padding-block-end:var(--odx-spacing-75)}.odx-g-100{gap:var(--odx-spacing-100)}.odx-gx-100{column-gap:var(--odx-spacing-100)}.odx-gy-100{row-gap:var(--odx-spacing-100)}.odx-m-100{margin:var(--odx-spacing-100)}.odx-mx-100{margin-inline:var(--odx-spacing-100)}.odx-ml-100{margin-inline-start:var(--odx-spacing-100)}.odx-mr-100{margin-inline-end:var(--odx-spacing-100)}.odx-my-100{margin-block:var(--odx-spacing-100)}.odx-mt-100{margin-block-start:var(--odx-spacing-100)}.odx-mb-100{margin-block-end:var(--odx-spacing-100)}.odx-p-100{padding:var(--odx-spacing-100)}.odx-px-100{padding-inline:var(--odx-spacing-100)}.odx-pl-100{padding-inline-start:var(--odx-spacing-100)}.odx-pr-100{padding-inline-end:var(--odx-spacing-100)}.odx-py-100{padding-block:var(--odx-spacing-100)}.odx-pt-100{padding-block-start:var(--odx-spacing-100)}.odx-pb-100{padding-block-end:var(--odx-spacing-100)}.odx-g-150{gap:var(--odx-spacing-150)}.odx-gx-150{column-gap:var(--odx-spacing-150)}.odx-gy-150{row-gap:var(--odx-spacing-150)}.odx-m-150{margin:var(--odx-spacing-150)}.odx-mx-150{margin-inline:var(--odx-spacing-150)}.odx-ml-150{margin-inline-start:var(--odx-spacing-150)}.odx-mr-150{margin-inline-end:var(--odx-spacing-150)}.odx-my-150{margin-block:var(--odx-spacing-150)}.odx-mt-150{margin-block-start:var(--odx-spacing-150)}.odx-mb-150{margin-block-end:var(--odx-spacing-150)}.odx-p-150{padding:var(--odx-spacing-150)}.odx-px-150{padding-inline:var(--odx-spacing-150)}.odx-pl-150{padding-inline-start:var(--odx-spacing-150)}.odx-pr-150{padding-inline-end:var(--odx-spacing-150)}.odx-py-150{padding-block:var(--odx-spacing-150)}.odx-pt-150{padding-block-start:var(--odx-spacing-150)}.odx-pb-150{padding-block-end:var(--odx-spacing-150)}.odx-g-200{gap:var(--odx-spacing-200)}.odx-gx-200{column-gap:var(--odx-spacing-200)}.odx-gy-200{row-gap:var(--odx-spacing-200)}.odx-m-200{margin:var(--odx-spacing-200)}.odx-mx-200{margin-inline:var(--odx-spacing-200)}.odx-ml-200{margin-inline-start:var(--odx-spacing-200)}.odx-mr-200{margin-inline-end:var(--odx-spacing-200)}.odx-my-200{margin-block:var(--odx-spacing-200)}.odx-mt-200{margin-block-start:var(--odx-spacing-200)}.odx-mb-200{margin-block-end:var(--odx-spacing-200)}.odx-p-200{padding:var(--odx-spacing-200)}.odx-px-200{padding-inline:var(--odx-spacing-200)}.odx-pl-200{padding-inline-start:var(--odx-spacing-200)}.odx-pr-200{padding-inline-end:var(--odx-spacing-200)}.odx-py-200{padding-block:var(--odx-spacing-200)}.odx-pt-200{padding-block-start:var(--odx-spacing-200)}.odx-pb-200{padding-block-end:var(--odx-spacing-200)}.odx-g-250{gap:var(--odx-spacing-250)}.odx-gx-250{column-gap:var(--odx-spacing-250)}.odx-gy-250{row-gap:var(--odx-spacing-250)}.odx-m-250{margin:var(--odx-spacing-250)}.odx-mx-250{margin-inline:var(--odx-spacing-250)}.odx-ml-250{margin-inline-start:var(--odx-spacing-250)}.odx-mr-250{margin-inline-end:var(--odx-spacing-250)}.odx-my-250{margin-block:var(--odx-spacing-250)}.odx-mt-250{margin-block-start:var(--odx-spacing-250)}.odx-mb-250{margin-block-end:var(--odx-spacing-250)}.odx-p-250{padding:var(--odx-spacing-250)}.odx-px-250{padding-inline:var(--odx-spacing-250)}.odx-pl-250{padding-inline-start:var(--odx-spacing-250)}.odx-pr-250{padding-inline-end:var(--odx-spacing-250)}.odx-py-250{padding-block:var(--odx-spacing-250)}.odx-pt-250{padding-block-start:var(--odx-spacing-250)}.odx-pb-250{padding-block-end:var(--odx-spacing-250)}.odx-g-layout-sm{gap:var(--odx-spacing-layout-sm)}.odx-gx-layout-sm{column-gap:var(--odx-spacing-layout-sm)}.odx-gy-layout-sm{row-gap:var(--odx-spacing-layout-sm)}.odx-m-layout-sm{margin:var(--odx-spacing-layout-sm)}.odx-mx-layout-sm{margin-inline:var(--odx-spacing-layout-sm)}.odx-ml-layout-sm{margin-inline-start:var(--odx-spacing-layout-sm)}.odx-mr-layout-sm{margin-inline-end:var(--odx-spacing-layout-sm)}.odx-my-layout-sm{margin-block:var(--odx-spacing-layout-sm)}.odx-mt-layout-sm{margin-block-start:var(--odx-spacing-layout-sm)}.odx-mb-layout-sm{margin-block-end:var(--odx-spacing-layout-sm)}.odx-p-layout-sm{padding:var(--odx-spacing-layout-sm)}.odx-px-layout-sm{padding-inline:var(--odx-spacing-layout-sm)}.odx-pl-layout-sm{padding-inline-start:var(--odx-spacing-layout-sm)}.odx-pr-layout-sm{padding-inline-end:var(--odx-spacing-layout-sm)}.odx-py-layout-sm{padding-block:var(--odx-spacing-layout-sm)}.odx-pt-layout-sm{padding-block-start:var(--odx-spacing-layout-sm)}.odx-pb-layout-sm{padding-block-end:var(--odx-spacing-layout-sm)}.odx-g-layout-md{gap:var(--odx-spacing-layout-md)}.odx-gx-layout-md{column-gap:var(--odx-spacing-layout-md)}.odx-gy-layout-md{row-gap:var(--odx-spacing-layout-md)}.odx-m-layout-md{margin:var(--odx-spacing-layout-md)}.odx-mx-layout-md{margin-inline:var(--odx-spacing-layout-md)}.odx-ml-layout-md{margin-inline-start:var(--odx-spacing-layout-md)}.odx-mr-layout-md{margin-inline-end:var(--odx-spacing-layout-md)}.odx-my-layout-md{margin-block:var(--odx-spacing-layout-md)}.odx-mt-layout-md{margin-block-start:var(--odx-spacing-layout-md)}.odx-mb-layout-md{margin-block-end:var(--odx-spacing-layout-md)}.odx-p-layout-md{padding:var(--odx-spacing-layout-md)}.odx-px-layout-md{padding-inline:var(--odx-spacing-layout-md)}.odx-pl-layout-md{padding-inline-start:var(--odx-spacing-layout-md)}.odx-pr-layout-md{padding-inline-end:var(--odx-spacing-layout-md)}.odx-py-layout-md{padding-block:var(--odx-spacing-layout-md)}.odx-pt-layout-md{padding-block-start:var(--odx-spacing-layout-md)}.odx-pb-layout-md{padding-block-end:var(--odx-spacing-layout-md)}.odx-g-layout-lg{gap:var(--odx-spacing-layout-lg)}.odx-gx-layout-lg{column-gap:var(--odx-spacing-layout-lg)}.odx-gy-layout-lg{row-gap:var(--odx-spacing-layout-lg)}.odx-m-layout-lg{margin:var(--odx-spacing-layout-lg)}.odx-mx-layout-lg{margin-inline:var(--odx-spacing-layout-lg)}.odx-ml-layout-lg{margin-inline-start:var(--odx-spacing-layout-lg)}.odx-mr-layout-lg{margin-inline-end:var(--odx-spacing-layout-lg)}.odx-my-layout-lg{margin-block:var(--odx-spacing-layout-lg)}.odx-mt-layout-lg{margin-block-start:var(--odx-spacing-layout-lg)}.odx-mb-layout-lg{margin-block-end:var(--odx-spacing-layout-lg)}.odx-p-layout-lg{padding:var(--odx-spacing-layout-lg)}.odx-px-layout-lg{padding-inline:var(--odx-spacing-layout-lg)}.odx-pl-layout-lg{padding-inline-start:var(--odx-spacing-layout-lg)}.odx-pr-layout-lg{padding-inline-end:var(--odx-spacing-layout-lg)}.odx-py-layout-lg{padding-block:var(--odx-spacing-layout-lg)}.odx-pt-layout-lg{padding-block-start:var(--odx-spacing-layout-lg)}.odx-pb-layout-lg{padding-block-end:var(--odx-spacing-layout-lg)}.odx-no-interaction{user-select:none;pointer-events:none}.odx-no-overflow{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.odx-visually-hidden:not(:focus-within),.odx-visually-hidden-force{position:absolute!important;border:none!important;padding:0!important;width:1px!important;height:1px!important;overflow:hidden!important;white-space:nowrap!important;clip-path:rect(0 0 0 0)!important}}@layer base{:root{scrollbar-color:var(--odx-color-background-brand) transparent}.odx-dark-mode{color-scheme:dark}.odx-light-mode{color-scheme:light}html{scroll-behavior:smooth}body{background-color:var(--odx-color-background-base);line-height:var(--odx-typography-line-height-base);color:var(--odx-color-foreground-rest);font-family:var(--odx-typography-font-family-base),"Noto Sans",Kanit,sans-serif;font-size:var(--odx-typography-font-size-base)}}
package/dist/main.js CHANGED
@@ -6,7 +6,7 @@ import { getAssignedElements as getAssignedElements$1, activeDirective as active
6
6
 
7
7
  const name = "@odx/foundation";
8
8
  const displayName = "ODX Design System Foundation";
9
- const version = "1.0.0-beta.183";
9
+ const version = "1.0.0-beta.184";
10
10
  const pkg = {
11
11
  name,
12
12
  displayName,
@@ -112,7 +112,7 @@ function insertChildrenBetween(elements, newChild, shouldInsert) {
112
112
  }
113
113
  }
114
114
 
115
- const customElementStyles = "@layer reset,base,variant,state,theme,utils;@layer reset{:where(*){scrollbar-width:thin}:where(*,:before,:after){box-sizing:border-box}:where(body,div,span,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,code,img,svg,small,strike,strong,sub,sup,b,u,i,ol,ul,li,form,label,table,caption,tbody,tfoot,thead,tr,th,td,main,article,aside,canvas,footer,header,nav,section,time,button,video,textarea,input){appearance:none;box-sizing:border-box;margin:0;border:0;padding:0}:where(img,picture,video,canvas){display:block;max-inline-size:100%}:where(input,button,textarea,select){appearance:none;font-family:inherit;font-feature-settings:inherit;font-size:inherit}:where(a){text-decoration:underline;color:var(--odx-color-foreground-accent-rest)}:where(p,h1,h2,h3,h4,h5,h6){overflow-wrap:break-word}:where(p){text-wrap:pretty}:where(h1,h2,h3,h4,h5,h6){text-wrap:balance}:where([popover]){outline:none;border:none}@media (prefers-reduced-motion: reduce){:where(*,:before,:after){transition-duration:0s!important;animation-duration:0s!important;animation-iteration-count:1!important;scroll-behavior:auto!important}}}@layer base{:root{--odx-transition-default: all var(--odx-motion-duration-default) var(--odx-motion-easing-default);--odx-transition-slow: all var(--odx-motion-duration-slow) var(--odx-motion-easing-default);--odx-transition-reduced: all var(--odx-motion-duration-fast) var(--odx-motion-easing-reduced);--odx-focus-ring-outer: var(--odx-size-12) solid var(--odx-color-stroke-focus-outer);--odx-focus-ring-inner: 0 0 0 calc(-1 * var(--odx-focus-ring-offset)) var(--odx-color-stroke-focus-inner) inset;--odx-focus-ring-offset: var(--odx-spacing-negative-12);--odx-focus-ring-offset-sm: var(--odx-spacing-negative-px);--odx-z-level-background: -1;--odx-z-level-base: 0;--odx-z-level-foreground: 1;--odx-z-level-interactive: 2;--odx-z-level-sticky: 10;--odx-z-level-overlay: 100;--odx-z-level-topmost: 9999;--odx-size-interactive-sm: var(--odx-size-200);--odx-size-interactive-md: var(--odx-size-225);--odx-size-interactive-lg: var(--odx-size-300);--odx-spacing-layout-sm: var(--odx-spacing-37);--odx-spacing-layout-md: var(--odx-spacing-75);--odx-spacing-layout-lg: var(--odx-spacing-100);--odx-spacing-interactive-x-sm: var(--odx-spacing-50);--odx-spacing-interactive-x-md: var(--odx-spacing-75);--odx-spacing-interactive-x-lg: var(--odx-spacing-100);--odx-spacing-interactive-y-sm: var(--odx-spacing-25);--odx-spacing-interactive-y-md: var(--odx-spacing-37);--odx-spacing-interactive-y-lg: var(--odx-spacing-50);--odx-font-size-text-xs: var(--odx-typography-font-size-1);--odx-line-height-text-xs: var(--odx-typography-line-height-1);--odx-font-size-text-sm: var(--odx-typography-font-size-2);--odx-line-height-text-sm: var(--odx-typography-line-height-2);--odx-font-size-text-md: var(--odx-breakpoint-font-size-p-base);--odx-line-height-text-md: var(--odx-breakpoint-line-height-p-base);--odx-font-size-text-lg: var(--odx-breakpoint-font-size-p-lg);--odx-line-height-text-lg: var(--odx-breakpoint-line-height-p-lg);--odx-font-size-heading-xs: var(--odx-breakpoint-font-size-heading-6);--odx-line-height-heading-xs: var(--odx-breakpoint-line-height-heading-6);--odx-font-size-heading-sm: var(--odx-breakpoint-font-size-heading-5);--odx-line-height-heading-sm: var(--odx-breakpoint-line-height-heading-5);--odx-font-size-heading-md: var(--odx-breakpoint-font-size-heading-4);--odx-line-height-heading-md: var(--odx-breakpoint-line-height-heading-4);--odx-font-size-heading-lg: var(--odx-breakpoint-font-size-heading-3);--odx-line-height-heading-lg: var(--odx-breakpoint-line-height-heading-3);--odx-font-size-heading-xl: var(--odx-breakpoint-font-size-heading-2);--odx-line-height-heading-xl: var(--odx-breakpoint-line-height-heading-2);--odx-font-size-heading-xxl: var(--odx-breakpoint-font-size-heading-1);--odx-line-height-heading-xxl: var(--odx-breakpoint-line-height-heading-1)}}@layer base{[class*=odx-title-],:where(h1,h2,h3,h4,h5,h6){display:block;font-family:var(--odx-typography-font-family-brand);font-weight:var(--odx-typography-font-weight-semibold)}[class*=odx-title-display-]{font-weight:var(--odx-typography-font-weight-medium)}.odx-title-xs,:where(h6){line-height:var(--odx-line-height-heading-xs);font-size:var(--odx-font-size-heading-xs)}.odx-title-sm,:where(h5){line-height:var(--odx-line-height-heading-sm);font-size:var(--odx-font-size-heading-sm)}.odx-title-md,:where(h4){line-height:var(--odx-line-height-heading-md);font-size:var(--odx-font-size-heading-md)}.odx-title-lg,:where(h3){line-height:var(--odx-line-height-heading-lg);font-size:var(--odx-font-size-heading-lg)}.odx-title-xl,:where(h2){line-height:var(--odx-line-height-heading-xl);font-size:var(--odx-font-size-heading-xl)}.odx-title-xxl,:where(h1){line-height:var(--odx-line-height-heading-xxl);font-size:var(--odx-font-size-heading-xxl)}.odx-title-display-sm{line-height:var(--odx-breakpoint-line-height-display-sm);font-size:var(--odx-breakpoint-font-size-display-sm)}.odx-title-display-md{line-height:var(--odx-breakpoint-line-height-display-md);font-size:var(--odx-breakpoint-font-size-display-md)}.odx-title-display-lg{line-height:var(--odx-breakpoint-line-height-display-lg);font-size:var(--odx-breakpoint-font-size-display-lg)}.odx-title-display-xl{line-height:var(--odx-breakpoint-line-height-display-xl);font-size:var(--odx-breakpoint-font-size-display-xl)}.odx-text-xs{line-height:var(--odx-line-height-text-xs);font-size:var(--odx-font-size-text-xs)}.odx-text-sm{line-height:var(--odx-line-height-text-sm);font-size:var(--odx-font-size-text-sm)}.odx-text-md,:where(p){line-height:var(--odx-line-height-text-md);font-size:var(--odx-font-size-text-md)}.odx-text-lg{line-height:var(--odx-line-height-text-lg);font-size:var(--odx-font-size-text-lg)}}@layer base{odx-content-box,.odx-content-box,.odx-content{>h1,>h2,>h3,>h4,>h5,>h6,>p:not(:last-child){margin-block:0 var(--odx-spacing-layout-md)}ol,ul{margin-block:var(--odx-spacing-layout-md);padding-inline-start:var(--odx-spacing-200)}}odx-content-box,:where(.odx-content-box){background-color:var(--odx-color-background-level-1);padding:var(--odx-spacing-layout-lg)}}@layer base{.odx-cluster,.odx-flank,.odx-stack{display:flex;flex-direction:column;gap:var(--odx-spacing-layout-md);align-items:center;justify-content:flex-start;max-inline-size:100%;text-align:inherit}.odx-cluster{flex-flow:row wrap;align-items:center}.odx-flank{flex-direction:row}.odx-stack{align-items:stretch}.odx-flank:not(.odx-justify-end)>:not(:first-child),.odx-flank.odx-justify-end>:not(:last-child){flex:1}.odx-fill{flex:1}.odx-align-baseline,.odx-align-start{align-items:flex-start}.odx-align-center{align-items:center}.odx-align-end{align-items:end}.odx-justify-start{justify-content:flex-start}.odx-justify-end{justify-content:flex-end}.odx-justify-center{justify-content:center}.odx-justify-space-between{justify-content:space-between}.odx-justify-space-around{justify-content:space-around}.odx-justify-space-evenly{justify-content:space-evenly}.odx-nowrap{flex-wrap:nowrap}}@layer utils{.odx-g-auto{gap:auto}.odx-gx-auto{column-gap:auto}.odx-gy-auto{row-gap:auto}.odx-m-auto{margin:auto}.odx-mx-auto{margin-inline:auto}.odx-ml-auto{margin-inline-start:auto}.odx-mr-auto{margin-inline-end:auto}.odx-my-auto{margin-block:auto}.odx-mt-auto{margin-block-start:auto}.odx-mb-auto{margin-block-end:auto}.odx-p-auto{padding:auto}.odx-px-auto{padding-inline:auto}.odx-pl-auto{padding-inline-start:auto}.odx-pr-auto{padding-inline-end:auto}.odx-py-auto{padding-block:auto}.odx-pt-auto{padding-block-start:auto}.odx-ps-auto{padding-block-end:auto}.odx-g-0{gap:0}.odx-gx-0{column-gap:0}.odx-gy-0{row-gap:0}.odx-m-0{margin:0}.odx-mx-0{margin-inline:0}.odx-ml-0{margin-inline-start:0}.odx-mr-0{margin-inline-end:0}.odx-my-0{margin-block:0}.odx-mt-0{margin-block-start:0}.odx-mb-0{margin-block-end:0}.odx-p-0{padding:0}.odx-px-0{padding-inline:0}.odx-pl-0{padding-inline-start:0}.odx-pr-0{padding-inline-end:0}.odx-py-0{padding-block:0}.odx-pt-0{padding-block-start:0}.odx-ps-0{padding-block-end:0}.odx-g-1{gap:var(--odx-spacing-px)}.odx-gx-1{column-gap:var(--odx-spacing-px)}.odx-gy-1{row-gap:var(--odx-spacing-px)}.odx-m-1{margin:var(--odx-spacing-px)}.odx-mx-1{margin-inline:var(--odx-spacing-px)}.odx-ml-1{margin-inline-start:var(--odx-spacing-px)}.odx-mr-1{margin-inline-end:var(--odx-spacing-px)}.odx-my-1{margin-block:var(--odx-spacing-px)}.odx-mt-1{margin-block-start:var(--odx-spacing-px)}.odx-mb-1{margin-block-end:var(--odx-spacing-px)}.odx-p-1{padding:var(--odx-spacing-px)}.odx-px-1{padding-inline:var(--odx-spacing-px)}.odx-pl-1{padding-inline-start:var(--odx-spacing-px)}.odx-pr-1{padding-inline-end:var(--odx-spacing-px)}.odx-py-1{padding-block:var(--odx-spacing-px)}.odx-pt-1{padding-block-start:var(--odx-spacing-px)}.odx-ps-1{padding-block-end:var(--odx-spacing-px)}.odx-g-12{gap:var(--odx-spacing-12)}.odx-gx-12{column-gap:var(--odx-spacing-12)}.odx-gy-12{row-gap:var(--odx-spacing-12)}.odx-m-12{margin:var(--odx-spacing-12)}.odx-mx-12{margin-inline:var(--odx-spacing-12)}.odx-ml-12{margin-inline-start:var(--odx-spacing-12)}.odx-mr-12{margin-inline-end:var(--odx-spacing-12)}.odx-my-12{margin-block:var(--odx-spacing-12)}.odx-mt-12{margin-block-start:var(--odx-spacing-12)}.odx-mb-12{margin-block-end:var(--odx-spacing-12)}.odx-p-12{padding:var(--odx-spacing-12)}.odx-px-12{padding-inline:var(--odx-spacing-12)}.odx-pl-12{padding-inline-start:var(--odx-spacing-12)}.odx-pr-12{padding-inline-end:var(--odx-spacing-12)}.odx-py-12{padding-block:var(--odx-spacing-12)}.odx-pt-12{padding-block-start:var(--odx-spacing-12)}.odx-ps-12{padding-block-end:var(--odx-spacing-12)}.odx-g-25{gap:var(--odx-spacing-25)}.odx-gx-25{column-gap:var(--odx-spacing-25)}.odx-gy-25{row-gap:var(--odx-spacing-25)}.odx-m-25{margin:var(--odx-spacing-25)}.odx-mx-25{margin-inline:var(--odx-spacing-25)}.odx-ml-25{margin-inline-start:var(--odx-spacing-25)}.odx-mr-25{margin-inline-end:var(--odx-spacing-25)}.odx-my-25{margin-block:var(--odx-spacing-25)}.odx-mt-25{margin-block-start:var(--odx-spacing-25)}.odx-mb-25{margin-block-end:var(--odx-spacing-25)}.odx-p-25{padding:var(--odx-spacing-25)}.odx-px-25{padding-inline:var(--odx-spacing-25)}.odx-pl-25{padding-inline-start:var(--odx-spacing-25)}.odx-pr-25{padding-inline-end:var(--odx-spacing-25)}.odx-py-25{padding-block:var(--odx-spacing-25)}.odx-pt-25{padding-block-start:var(--odx-spacing-25)}.odx-ps-25{padding-block-end:var(--odx-spacing-25)}.odx-g-37{gap:var(--odx-spacing-37)}.odx-gx-37{column-gap:var(--odx-spacing-37)}.odx-gy-37{row-gap:var(--odx-spacing-37)}.odx-m-37{margin:var(--odx-spacing-37)}.odx-mx-37{margin-inline:var(--odx-spacing-37)}.odx-ml-37{margin-inline-start:var(--odx-spacing-37)}.odx-mr-37{margin-inline-end:var(--odx-spacing-37)}.odx-my-37{margin-block:var(--odx-spacing-37)}.odx-mt-37{margin-block-start:var(--odx-spacing-37)}.odx-mb-37{margin-block-end:var(--odx-spacing-37)}.odx-p-37{padding:var(--odx-spacing-37)}.odx-px-37{padding-inline:var(--odx-spacing-37)}.odx-pl-37{padding-inline-start:var(--odx-spacing-37)}.odx-pr-37{padding-inline-end:var(--odx-spacing-37)}.odx-py-37{padding-block:var(--odx-spacing-37)}.odx-pt-37{padding-block-start:var(--odx-spacing-37)}.odx-ps-37{padding-block-end:var(--odx-spacing-37)}.odx-g-50{gap:var(--odx-spacing-50)}.odx-gx-50{column-gap:var(--odx-spacing-50)}.odx-gy-50{row-gap:var(--odx-spacing-50)}.odx-m-50{margin:var(--odx-spacing-50)}.odx-mx-50{margin-inline:var(--odx-spacing-50)}.odx-ml-50{margin-inline-start:var(--odx-spacing-50)}.odx-mr-50{margin-inline-end:var(--odx-spacing-50)}.odx-my-50{margin-block:var(--odx-spacing-50)}.odx-mt-50{margin-block-start:var(--odx-spacing-50)}.odx-mb-50{margin-block-end:var(--odx-spacing-50)}.odx-p-50{padding:var(--odx-spacing-50)}.odx-px-50{padding-inline:var(--odx-spacing-50)}.odx-pl-50{padding-inline-start:var(--odx-spacing-50)}.odx-pr-50{padding-inline-end:var(--odx-spacing-50)}.odx-py-50{padding-block:var(--odx-spacing-50)}.odx-pt-50{padding-block-start:var(--odx-spacing-50)}.odx-ps-50{padding-block-end:var(--odx-spacing-50)}.odx-g-75{gap:var(--odx-spacing-75)}.odx-gx-75{column-gap:var(--odx-spacing-75)}.odx-gy-75{row-gap:var(--odx-spacing-75)}.odx-m-75{margin:var(--odx-spacing-75)}.odx-mx-75{margin-inline:var(--odx-spacing-75)}.odx-ml-75{margin-inline-start:var(--odx-spacing-75)}.odx-mr-75{margin-inline-end:var(--odx-spacing-75)}.odx-my-75{margin-block:var(--odx-spacing-75)}.odx-mt-75{margin-block-start:var(--odx-spacing-75)}.odx-mb-75{margin-block-end:var(--odx-spacing-75)}.odx-p-75{padding:var(--odx-spacing-75)}.odx-px-75{padding-inline:var(--odx-spacing-75)}.odx-pl-75{padding-inline-start:var(--odx-spacing-75)}.odx-pr-75{padding-inline-end:var(--odx-spacing-75)}.odx-py-75{padding-block:var(--odx-spacing-75)}.odx-pt-75{padding-block-start:var(--odx-spacing-75)}.odx-ps-75{padding-block-end:var(--odx-spacing-75)}.odx-g-100{gap:var(--odx-spacing-100)}.odx-gx-100{column-gap:var(--odx-spacing-100)}.odx-gy-100{row-gap:var(--odx-spacing-100)}.odx-m-100{margin:var(--odx-spacing-100)}.odx-mx-100{margin-inline:var(--odx-spacing-100)}.odx-ml-100{margin-inline-start:var(--odx-spacing-100)}.odx-mr-100{margin-inline-end:var(--odx-spacing-100)}.odx-my-100{margin-block:var(--odx-spacing-100)}.odx-mt-100{margin-block-start:var(--odx-spacing-100)}.odx-mb-100{margin-block-end:var(--odx-spacing-100)}.odx-p-100{padding:var(--odx-spacing-100)}.odx-px-100{padding-inline:var(--odx-spacing-100)}.odx-pl-100{padding-inline-start:var(--odx-spacing-100)}.odx-pr-100{padding-inline-end:var(--odx-spacing-100)}.odx-py-100{padding-block:var(--odx-spacing-100)}.odx-pt-100{padding-block-start:var(--odx-spacing-100)}.odx-ps-100{padding-block-end:var(--odx-spacing-100)}.odx-g-150{gap:var(--odx-spacing-150)}.odx-gx-150{column-gap:var(--odx-spacing-150)}.odx-gy-150{row-gap:var(--odx-spacing-150)}.odx-m-150{margin:var(--odx-spacing-150)}.odx-mx-150{margin-inline:var(--odx-spacing-150)}.odx-ml-150{margin-inline-start:var(--odx-spacing-150)}.odx-mr-150{margin-inline-end:var(--odx-spacing-150)}.odx-my-150{margin-block:var(--odx-spacing-150)}.odx-mt-150{margin-block-start:var(--odx-spacing-150)}.odx-mb-150{margin-block-end:var(--odx-spacing-150)}.odx-p-150{padding:var(--odx-spacing-150)}.odx-px-150{padding-inline:var(--odx-spacing-150)}.odx-pl-150{padding-inline-start:var(--odx-spacing-150)}.odx-pr-150{padding-inline-end:var(--odx-spacing-150)}.odx-py-150{padding-block:var(--odx-spacing-150)}.odx-pt-150{padding-block-start:var(--odx-spacing-150)}.odx-ps-150{padding-block-end:var(--odx-spacing-150)}.odx-g-200{gap:var(--odx-spacing-200)}.odx-gx-200{column-gap:var(--odx-spacing-200)}.odx-gy-200{row-gap:var(--odx-spacing-200)}.odx-m-200{margin:var(--odx-spacing-200)}.odx-mx-200{margin-inline:var(--odx-spacing-200)}.odx-ml-200{margin-inline-start:var(--odx-spacing-200)}.odx-mr-200{margin-inline-end:var(--odx-spacing-200)}.odx-my-200{margin-block:var(--odx-spacing-200)}.odx-mt-200{margin-block-start:var(--odx-spacing-200)}.odx-mb-200{margin-block-end:var(--odx-spacing-200)}.odx-p-200{padding:var(--odx-spacing-200)}.odx-px-200{padding-inline:var(--odx-spacing-200)}.odx-pl-200{padding-inline-start:var(--odx-spacing-200)}.odx-pr-200{padding-inline-end:var(--odx-spacing-200)}.odx-py-200{padding-block:var(--odx-spacing-200)}.odx-pt-200{padding-block-start:var(--odx-spacing-200)}.odx-ps-200{padding-block-end:var(--odx-spacing-200)}.odx-g-250{gap:var(--odx-spacing-250)}.odx-gx-250{column-gap:var(--odx-spacing-250)}.odx-gy-250{row-gap:var(--odx-spacing-250)}.odx-m-250{margin:var(--odx-spacing-250)}.odx-mx-250{margin-inline:var(--odx-spacing-250)}.odx-ml-250{margin-inline-start:var(--odx-spacing-250)}.odx-mr-250{margin-inline-end:var(--odx-spacing-250)}.odx-my-250{margin-block:var(--odx-spacing-250)}.odx-mt-250{margin-block-start:var(--odx-spacing-250)}.odx-mb-250{margin-block-end:var(--odx-spacing-250)}.odx-p-250{padding:var(--odx-spacing-250)}.odx-px-250{padding-inline:var(--odx-spacing-250)}.odx-pl-250{padding-inline-start:var(--odx-spacing-250)}.odx-pr-250{padding-inline-end:var(--odx-spacing-250)}.odx-py-250{padding-block:var(--odx-spacing-250)}.odx-pt-250{padding-block-start:var(--odx-spacing-250)}.odx-ps-250{padding-block-end:var(--odx-spacing-250)}.odx-g-layout-sm{gap:var(--odx-spacing-layout-sm)}.odx-gx-layout-sm{column-gap:var(--odx-spacing-layout-sm)}.odx-gy-layout-sm{row-gap:var(--odx-spacing-layout-sm)}.odx-m-layout-sm{margin:var(--odx-spacing-layout-sm)}.odx-mx-layout-sm{margin-inline:var(--odx-spacing-layout-sm)}.odx-ml-layout-sm{margin-inline-start:var(--odx-spacing-layout-sm)}.odx-mr-layout-sm{margin-inline-end:var(--odx-spacing-layout-sm)}.odx-my-layout-sm{margin-block:var(--odx-spacing-layout-sm)}.odx-mt-layout-sm{margin-block-start:var(--odx-spacing-layout-sm)}.odx-mb-layout-sm{margin-block-end:var(--odx-spacing-layout-sm)}.odx-p-layout-sm{padding:var(--odx-spacing-layout-sm)}.odx-px-layout-sm{padding-inline:var(--odx-spacing-layout-sm)}.odx-pl-layout-sm{padding-inline-start:var(--odx-spacing-layout-sm)}.odx-pr-layout-sm{padding-inline-end:var(--odx-spacing-layout-sm)}.odx-py-layout-sm{padding-block:var(--odx-spacing-layout-sm)}.odx-pt-layout-sm{padding-block-start:var(--odx-spacing-layout-sm)}.odx-ps-layout-sm{padding-block-end:var(--odx-spacing-layout-sm)}.odx-g-layout-md{gap:var(--odx-spacing-layout-md)}.odx-gx-layout-md{column-gap:var(--odx-spacing-layout-md)}.odx-gy-layout-md{row-gap:var(--odx-spacing-layout-md)}.odx-m-layout-md{margin:var(--odx-spacing-layout-md)}.odx-mx-layout-md{margin-inline:var(--odx-spacing-layout-md)}.odx-ml-layout-md{margin-inline-start:var(--odx-spacing-layout-md)}.odx-mr-layout-md{margin-inline-end:var(--odx-spacing-layout-md)}.odx-my-layout-md{margin-block:var(--odx-spacing-layout-md)}.odx-mt-layout-md{margin-block-start:var(--odx-spacing-layout-md)}.odx-mb-layout-md{margin-block-end:var(--odx-spacing-layout-md)}.odx-p-layout-md{padding:var(--odx-spacing-layout-md)}.odx-px-layout-md{padding-inline:var(--odx-spacing-layout-md)}.odx-pl-layout-md{padding-inline-start:var(--odx-spacing-layout-md)}.odx-pr-layout-md{padding-inline-end:var(--odx-spacing-layout-md)}.odx-py-layout-md{padding-block:var(--odx-spacing-layout-md)}.odx-pt-layout-md{padding-block-start:var(--odx-spacing-layout-md)}.odx-ps-layout-md{padding-block-end:var(--odx-spacing-layout-md)}.odx-g-layout-lg{gap:var(--odx-spacing-layout-lg)}.odx-gx-layout-lg{column-gap:var(--odx-spacing-layout-lg)}.odx-gy-layout-lg{row-gap:var(--odx-spacing-layout-lg)}.odx-m-layout-lg{margin:var(--odx-spacing-layout-lg)}.odx-mx-layout-lg{margin-inline:var(--odx-spacing-layout-lg)}.odx-ml-layout-lg{margin-inline-start:var(--odx-spacing-layout-lg)}.odx-mr-layout-lg{margin-inline-end:var(--odx-spacing-layout-lg)}.odx-my-layout-lg{margin-block:var(--odx-spacing-layout-lg)}.odx-mt-layout-lg{margin-block-start:var(--odx-spacing-layout-lg)}.odx-mb-layout-lg{margin-block-end:var(--odx-spacing-layout-lg)}.odx-p-layout-lg{padding:var(--odx-spacing-layout-lg)}.odx-px-layout-lg{padding-inline:var(--odx-spacing-layout-lg)}.odx-pl-layout-lg{padding-inline-start:var(--odx-spacing-layout-lg)}.odx-pr-layout-lg{padding-inline-end:var(--odx-spacing-layout-lg)}.odx-py-layout-lg{padding-block:var(--odx-spacing-layout-lg)}.odx-pt-layout-lg{padding-block-start:var(--odx-spacing-layout-lg)}.odx-ps-layout-lg{padding-block-end:var(--odx-spacing-layout-lg)}.odx-no-overflow{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.odx-visually-hidden:not(:focus-within),.odx-visually-hidden-force{position:absolute!important;border:none!important;padding:0!important;width:1px!important;height:1px!important;overflow:hidden!important;white-space:nowrap!important;clip-path:rect(0 0 0 0)!important}}@layer base{:root{scrollbar-color:var(--odx-color-background-brand) transparent}.odx-dark-mode{color-scheme:dark}.odx-light-mode{color-scheme:light}html{scroll-behavior:smooth}body{background-color:var(--odx-color-background-base);line-height:var(--odx-typography-line-height-base);color:var(--odx-color-foreground-rest);font-family:var(--odx-typography-font-family-base),\"Noto Sans\",Kanit,sans-serif;font-size:var(--odx-typography-font-size-base)}}@layer reset{:where(*):not(:defined){display:none}}@layer base{:where(.odx-content),.odx-content-box{>odx-area-header{margin-block-start:calc(-1 * var(--odx-spacing-layout-lg))}>odx-title{margin-block:0 var(--odx-spacing-layout-sm)}>odx-text{margin-block:0 var(--odx-spacing-layout-md)}}odx-icon{transition:var(--odx-transition-default);transition-property:transform,color,opacity}input[type=time]::-webkit-calendar-picker-indicator{display:none}odx-list-item:has(:is([odx-button],odx-list-item::part(control)):not([disabled]):active){--_color-background-pressed: var(--_color-background-hover)}[odx-button]:has(odx-icon:only-child){--_min-inline-size: 0}odx-input{&:has([slot=prefix])::part(input){padding-inline-start:0}&:has([slot=suffix])::part(input){padding-inline-end:0}}odx-rail-navigation :is(odx-navigation-item,odx-navigation-item-group)::part(label){transition:var(--odx-transition-reduced);transition-delay:var(--odx-motion-duration-fast);transition-property:opacity}odx-rail-navigation[collapsed] :is(odx-navigation-item,odx-navigation-item-group)::part(label){opacity:0;white-space:nowrap}}@layer reset{:host{outline:none;border:none;border-color:transparent}}";
115
+ const customElementStyles = "@layer reset,base,variant,state,theme,utils;:root{--odx-transition-default: all var(--odx-motion-duration-default) var(--odx-motion-easing-default);--odx-transition-slow: all var(--odx-motion-duration-slow) var(--odx-motion-easing-default);--odx-transition-reduced: all var(--odx-motion-duration-fast) var(--odx-motion-easing-reduced);--odx-focus-ring-outer: var(--odx-size-12) solid var(--odx-color-stroke-focus-outer);--odx-focus-ring-inner: 0 0 0 calc(-1 * var(--odx-focus-ring-offset)) var(--odx-color-stroke-focus-inner) inset;--odx-focus-ring-offset: var(--odx-spacing-negative-12);--odx-focus-ring-offset-sm: var(--odx-spacing-negative-px);--odx-z-level-background: -1;--odx-z-level-base: 0;--odx-z-level-foreground: 1;--odx-z-level-interactive: 2;--odx-z-level-sticky: 10;--odx-z-level-overlay: 100;--odx-z-level-topmost: 9999;--odx-size-interactive-sm: var(--odx-size-200);--odx-size-interactive-md: var(--odx-size-225);--odx-size-interactive-lg: var(--odx-size-300);--odx-spacing-layout-sm: var(--odx-spacing-37);--odx-spacing-layout-md: var(--odx-spacing-75);--odx-spacing-layout-lg: var(--odx-spacing-100);--odx-spacing-interactive-x-sm: var(--odx-spacing-50);--odx-spacing-interactive-x-md: var(--odx-spacing-75);--odx-spacing-interactive-x-lg: var(--odx-spacing-100);--odx-spacing-interactive-y-sm: var(--odx-spacing-25);--odx-spacing-interactive-y-md: var(--odx-spacing-37);--odx-spacing-interactive-y-lg: var(--odx-spacing-50);--odx-font-size-text-xs: var(--odx-typography-font-size-1);--odx-line-height-text-xs: var(--odx-typography-line-height-1);--odx-font-size-text-sm: var(--odx-typography-font-size-2);--odx-line-height-text-sm: var(--odx-typography-line-height-2);--odx-font-size-text-md: var(--odx-breakpoint-font-size-p-base);--odx-line-height-text-md: var(--odx-breakpoint-line-height-p-base);--odx-font-size-text-lg: var(--odx-breakpoint-font-size-p-lg);--odx-line-height-text-lg: var(--odx-breakpoint-line-height-p-lg);--odx-font-size-heading-xs: var(--odx-breakpoint-font-size-heading-6);--odx-line-height-heading-xs: var(--odx-breakpoint-line-height-heading-6);--odx-font-size-heading-sm: var(--odx-breakpoint-font-size-heading-5);--odx-line-height-heading-sm: var(--odx-breakpoint-line-height-heading-5);--odx-font-size-heading-md: var(--odx-breakpoint-font-size-heading-4);--odx-line-height-heading-md: var(--odx-breakpoint-line-height-heading-4);--odx-font-size-heading-lg: var(--odx-breakpoint-font-size-heading-3);--odx-line-height-heading-lg: var(--odx-breakpoint-line-height-heading-3);--odx-font-size-heading-xl: var(--odx-breakpoint-font-size-heading-2);--odx-line-height-heading-xl: var(--odx-breakpoint-line-height-heading-2);--odx-font-size-heading-xxl: var(--odx-breakpoint-font-size-heading-1);--odx-line-height-heading-xxl: var(--odx-breakpoint-line-height-heading-1)}@layer reset{:where(*){scrollbar-width:thin}:where(*,:before,:after){box-sizing:border-box}:where(body,div,span,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,code,img,svg,small,strike,strong,sub,sup,b,u,i,ol,ul,li,form,label,table,caption,tbody,tfoot,thead,tr,th,td,main,article,aside,canvas,footer,header,nav,section,time,button,video,textarea,input){appearance:none;box-sizing:border-box;margin:0;border:0;padding:0}:where(img,picture,video,canvas){display:block;max-inline-size:100%}:where(input,button,textarea,select){appearance:none;font-family:inherit;font-feature-settings:inherit;font-size:inherit}:where(a){text-decoration:underline;color:var(--odx-color-foreground-accent-rest)}:where(p,h1,h2,h3,h4,h5,h6){overflow-wrap:break-word}:where(p){text-wrap:pretty}:where(h1,h2,h3,h4,h5,h6){text-wrap:balance}:where([popover]){outline:none;border:none}@media (prefers-reduced-motion: reduce){:where(*,:before,:after){transition-duration:0s!important;animation-duration:0s!important;animation-iteration-count:1!important;scroll-behavior:auto!important}}}@layer base{[class*=odx-title-],:where(h1,h2,h3,h4,h5,h6){display:block;font-family:var(--odx-typography-font-family-brand);font-weight:var(--odx-typography-font-weight-semibold)}[class*=odx-title-display-]{font-weight:var(--odx-typography-font-weight-medium)}.odx-title-xs,:where(h6){line-height:var(--odx-line-height-heading-xs);font-size:var(--odx-font-size-heading-xs)}.odx-title-sm,:where(h5){line-height:var(--odx-line-height-heading-sm);font-size:var(--odx-font-size-heading-sm)}.odx-title-md,:where(h4){line-height:var(--odx-line-height-heading-md);font-size:var(--odx-font-size-heading-md)}.odx-title-lg,:where(h3){line-height:var(--odx-line-height-heading-lg);font-size:var(--odx-font-size-heading-lg)}.odx-title-xl,:where(h2){line-height:var(--odx-line-height-heading-xl);font-size:var(--odx-font-size-heading-xl)}.odx-title-xxl,:where(h1){line-height:var(--odx-line-height-heading-xxl);font-size:var(--odx-font-size-heading-xxl)}.odx-title-display-sm{line-height:var(--odx-breakpoint-line-height-display-sm);font-size:var(--odx-breakpoint-font-size-display-sm)}.odx-title-display-md{line-height:var(--odx-breakpoint-line-height-display-md);font-size:var(--odx-breakpoint-font-size-display-md)}.odx-title-display-lg{line-height:var(--odx-breakpoint-line-height-display-lg);font-size:var(--odx-breakpoint-font-size-display-lg)}.odx-title-display-xl{line-height:var(--odx-breakpoint-line-height-display-xl);font-size:var(--odx-breakpoint-font-size-display-xl)}.odx-text-xs{line-height:var(--odx-line-height-text-xs);font-size:var(--odx-font-size-text-xs)}.odx-text-sm{line-height:var(--odx-line-height-text-sm);font-size:var(--odx-font-size-text-sm)}.odx-text-md,:where(p){line-height:var(--odx-line-height-text-md);font-size:var(--odx-font-size-text-md)}.odx-text-lg{line-height:var(--odx-line-height-text-lg);font-size:var(--odx-font-size-text-lg)}}@layer base{odx-content-box,.odx-content-box,.odx-content{>h1,>h2,>h3,>h4,>h5,>h6,>p:not(:last-child){margin-block:0 var(--odx-spacing-layout-md)}ol,ul{margin-block:var(--odx-spacing-layout-md);padding-inline-start:var(--odx-spacing-200)}}odx-content-box,:where(.odx-content-box){background-color:var(--odx-color-background-level-1);padding:var(--odx-spacing-layout-lg)}}@layer base{.odx-cluster,.odx-flank,.odx-stack{display:flex;flex-direction:column;gap:var(--odx-spacing-layout-md);align-items:center;justify-content:flex-start;max-inline-size:100%;text-align:inherit}.odx-cluster{flex-flow:row wrap;align-items:center}.odx-flank{flex-direction:row}.odx-stack{align-items:stretch}.odx-flank:not(.odx-justify-end)>:not(:first-child),.odx-flank.odx-justify-end>:not(:last-child){flex:1}.odx-fill{flex:1}.odx-align-baseline,.odx-align-start{align-items:flex-start}.odx-align-center{align-items:center}.odx-align-end{align-items:end}.odx-justify-start{justify-content:flex-start}.odx-justify-end{justify-content:flex-end}.odx-justify-center{justify-content:center}.odx-justify-space-between{justify-content:space-between}.odx-justify-space-around{justify-content:space-around}.odx-justify-space-evenly{justify-content:space-evenly}.odx-nowrap{flex-wrap:nowrap}}@layer utils{.odx-g-auto{gap:auto}.odx-gx-auto{column-gap:auto}.odx-gy-auto{row-gap:auto}.odx-m-auto{margin:auto}.odx-mx-auto{margin-inline:auto}.odx-ml-auto{margin-inline-start:auto}.odx-mr-auto{margin-inline-end:auto}.odx-my-auto{margin-block:auto}.odx-mt-auto{margin-block-start:auto}.odx-mb-auto{margin-block-end:auto}.odx-p-auto{padding:auto}.odx-px-auto{padding-inline:auto}.odx-pl-auto{padding-inline-start:auto}.odx-pr-auto{padding-inline-end:auto}.odx-py-auto{padding-block:auto}.odx-pt-auto{padding-block-start:auto}.odx-pb-auto{padding-block-end:auto}.odx-g-0{gap:0}.odx-gx-0{column-gap:0}.odx-gy-0{row-gap:0}.odx-m-0{margin:0}.odx-mx-0{margin-inline:0}.odx-ml-0{margin-inline-start:0}.odx-mr-0{margin-inline-end:0}.odx-my-0{margin-block:0}.odx-mt-0{margin-block-start:0}.odx-mb-0{margin-block-end:0}.odx-p-0{padding:0}.odx-px-0{padding-inline:0}.odx-pl-0{padding-inline-start:0}.odx-pr-0{padding-inline-end:0}.odx-py-0{padding-block:0}.odx-pt-0{padding-block-start:0}.odx-pb-0{padding-block-end:0}.odx-g-1{gap:var(--odx-spacing-px)}.odx-gx-1{column-gap:var(--odx-spacing-px)}.odx-gy-1{row-gap:var(--odx-spacing-px)}.odx-m-1{margin:var(--odx-spacing-px)}.odx-mx-1{margin-inline:var(--odx-spacing-px)}.odx-ml-1{margin-inline-start:var(--odx-spacing-px)}.odx-mr-1{margin-inline-end:var(--odx-spacing-px)}.odx-my-1{margin-block:var(--odx-spacing-px)}.odx-mt-1{margin-block-start:var(--odx-spacing-px)}.odx-mb-1{margin-block-end:var(--odx-spacing-px)}.odx-p-1{padding:var(--odx-spacing-px)}.odx-px-1{padding-inline:var(--odx-spacing-px)}.odx-pl-1{padding-inline-start:var(--odx-spacing-px)}.odx-pr-1{padding-inline-end:var(--odx-spacing-px)}.odx-py-1{padding-block:var(--odx-spacing-px)}.odx-pt-1{padding-block-start:var(--odx-spacing-px)}.odx-pb-1{padding-block-end:var(--odx-spacing-px)}.odx-g-12{gap:var(--odx-spacing-12)}.odx-gx-12{column-gap:var(--odx-spacing-12)}.odx-gy-12{row-gap:var(--odx-spacing-12)}.odx-m-12{margin:var(--odx-spacing-12)}.odx-mx-12{margin-inline:var(--odx-spacing-12)}.odx-ml-12{margin-inline-start:var(--odx-spacing-12)}.odx-mr-12{margin-inline-end:var(--odx-spacing-12)}.odx-my-12{margin-block:var(--odx-spacing-12)}.odx-mt-12{margin-block-start:var(--odx-spacing-12)}.odx-mb-12{margin-block-end:var(--odx-spacing-12)}.odx-p-12{padding:var(--odx-spacing-12)}.odx-px-12{padding-inline:var(--odx-spacing-12)}.odx-pl-12{padding-inline-start:var(--odx-spacing-12)}.odx-pr-12{padding-inline-end:var(--odx-spacing-12)}.odx-py-12{padding-block:var(--odx-spacing-12)}.odx-pt-12{padding-block-start:var(--odx-spacing-12)}.odx-pb-12{padding-block-end:var(--odx-spacing-12)}.odx-g-25{gap:var(--odx-spacing-25)}.odx-gx-25{column-gap:var(--odx-spacing-25)}.odx-gy-25{row-gap:var(--odx-spacing-25)}.odx-m-25{margin:var(--odx-spacing-25)}.odx-mx-25{margin-inline:var(--odx-spacing-25)}.odx-ml-25{margin-inline-start:var(--odx-spacing-25)}.odx-mr-25{margin-inline-end:var(--odx-spacing-25)}.odx-my-25{margin-block:var(--odx-spacing-25)}.odx-mt-25{margin-block-start:var(--odx-spacing-25)}.odx-mb-25{margin-block-end:var(--odx-spacing-25)}.odx-p-25{padding:var(--odx-spacing-25)}.odx-px-25{padding-inline:var(--odx-spacing-25)}.odx-pl-25{padding-inline-start:var(--odx-spacing-25)}.odx-pr-25{padding-inline-end:var(--odx-spacing-25)}.odx-py-25{padding-block:var(--odx-spacing-25)}.odx-pt-25{padding-block-start:var(--odx-spacing-25)}.odx-pb-25{padding-block-end:var(--odx-spacing-25)}.odx-g-37{gap:var(--odx-spacing-37)}.odx-gx-37{column-gap:var(--odx-spacing-37)}.odx-gy-37{row-gap:var(--odx-spacing-37)}.odx-m-37{margin:var(--odx-spacing-37)}.odx-mx-37{margin-inline:var(--odx-spacing-37)}.odx-ml-37{margin-inline-start:var(--odx-spacing-37)}.odx-mr-37{margin-inline-end:var(--odx-spacing-37)}.odx-my-37{margin-block:var(--odx-spacing-37)}.odx-mt-37{margin-block-start:var(--odx-spacing-37)}.odx-mb-37{margin-block-end:var(--odx-spacing-37)}.odx-p-37{padding:var(--odx-spacing-37)}.odx-px-37{padding-inline:var(--odx-spacing-37)}.odx-pl-37{padding-inline-start:var(--odx-spacing-37)}.odx-pr-37{padding-inline-end:var(--odx-spacing-37)}.odx-py-37{padding-block:var(--odx-spacing-37)}.odx-pt-37{padding-block-start:var(--odx-spacing-37)}.odx-pb-37{padding-block-end:var(--odx-spacing-37)}.odx-g-50{gap:var(--odx-spacing-50)}.odx-gx-50{column-gap:var(--odx-spacing-50)}.odx-gy-50{row-gap:var(--odx-spacing-50)}.odx-m-50{margin:var(--odx-spacing-50)}.odx-mx-50{margin-inline:var(--odx-spacing-50)}.odx-ml-50{margin-inline-start:var(--odx-spacing-50)}.odx-mr-50{margin-inline-end:var(--odx-spacing-50)}.odx-my-50{margin-block:var(--odx-spacing-50)}.odx-mt-50{margin-block-start:var(--odx-spacing-50)}.odx-mb-50{margin-block-end:var(--odx-spacing-50)}.odx-p-50{padding:var(--odx-spacing-50)}.odx-px-50{padding-inline:var(--odx-spacing-50)}.odx-pl-50{padding-inline-start:var(--odx-spacing-50)}.odx-pr-50{padding-inline-end:var(--odx-spacing-50)}.odx-py-50{padding-block:var(--odx-spacing-50)}.odx-pt-50{padding-block-start:var(--odx-spacing-50)}.odx-pb-50{padding-block-end:var(--odx-spacing-50)}.odx-g-75{gap:var(--odx-spacing-75)}.odx-gx-75{column-gap:var(--odx-spacing-75)}.odx-gy-75{row-gap:var(--odx-spacing-75)}.odx-m-75{margin:var(--odx-spacing-75)}.odx-mx-75{margin-inline:var(--odx-spacing-75)}.odx-ml-75{margin-inline-start:var(--odx-spacing-75)}.odx-mr-75{margin-inline-end:var(--odx-spacing-75)}.odx-my-75{margin-block:var(--odx-spacing-75)}.odx-mt-75{margin-block-start:var(--odx-spacing-75)}.odx-mb-75{margin-block-end:var(--odx-spacing-75)}.odx-p-75{padding:var(--odx-spacing-75)}.odx-px-75{padding-inline:var(--odx-spacing-75)}.odx-pl-75{padding-inline-start:var(--odx-spacing-75)}.odx-pr-75{padding-inline-end:var(--odx-spacing-75)}.odx-py-75{padding-block:var(--odx-spacing-75)}.odx-pt-75{padding-block-start:var(--odx-spacing-75)}.odx-pb-75{padding-block-end:var(--odx-spacing-75)}.odx-g-100{gap:var(--odx-spacing-100)}.odx-gx-100{column-gap:var(--odx-spacing-100)}.odx-gy-100{row-gap:var(--odx-spacing-100)}.odx-m-100{margin:var(--odx-spacing-100)}.odx-mx-100{margin-inline:var(--odx-spacing-100)}.odx-ml-100{margin-inline-start:var(--odx-spacing-100)}.odx-mr-100{margin-inline-end:var(--odx-spacing-100)}.odx-my-100{margin-block:var(--odx-spacing-100)}.odx-mt-100{margin-block-start:var(--odx-spacing-100)}.odx-mb-100{margin-block-end:var(--odx-spacing-100)}.odx-p-100{padding:var(--odx-spacing-100)}.odx-px-100{padding-inline:var(--odx-spacing-100)}.odx-pl-100{padding-inline-start:var(--odx-spacing-100)}.odx-pr-100{padding-inline-end:var(--odx-spacing-100)}.odx-py-100{padding-block:var(--odx-spacing-100)}.odx-pt-100{padding-block-start:var(--odx-spacing-100)}.odx-pb-100{padding-block-end:var(--odx-spacing-100)}.odx-g-150{gap:var(--odx-spacing-150)}.odx-gx-150{column-gap:var(--odx-spacing-150)}.odx-gy-150{row-gap:var(--odx-spacing-150)}.odx-m-150{margin:var(--odx-spacing-150)}.odx-mx-150{margin-inline:var(--odx-spacing-150)}.odx-ml-150{margin-inline-start:var(--odx-spacing-150)}.odx-mr-150{margin-inline-end:var(--odx-spacing-150)}.odx-my-150{margin-block:var(--odx-spacing-150)}.odx-mt-150{margin-block-start:var(--odx-spacing-150)}.odx-mb-150{margin-block-end:var(--odx-spacing-150)}.odx-p-150{padding:var(--odx-spacing-150)}.odx-px-150{padding-inline:var(--odx-spacing-150)}.odx-pl-150{padding-inline-start:var(--odx-spacing-150)}.odx-pr-150{padding-inline-end:var(--odx-spacing-150)}.odx-py-150{padding-block:var(--odx-spacing-150)}.odx-pt-150{padding-block-start:var(--odx-spacing-150)}.odx-pb-150{padding-block-end:var(--odx-spacing-150)}.odx-g-200{gap:var(--odx-spacing-200)}.odx-gx-200{column-gap:var(--odx-spacing-200)}.odx-gy-200{row-gap:var(--odx-spacing-200)}.odx-m-200{margin:var(--odx-spacing-200)}.odx-mx-200{margin-inline:var(--odx-spacing-200)}.odx-ml-200{margin-inline-start:var(--odx-spacing-200)}.odx-mr-200{margin-inline-end:var(--odx-spacing-200)}.odx-my-200{margin-block:var(--odx-spacing-200)}.odx-mt-200{margin-block-start:var(--odx-spacing-200)}.odx-mb-200{margin-block-end:var(--odx-spacing-200)}.odx-p-200{padding:var(--odx-spacing-200)}.odx-px-200{padding-inline:var(--odx-spacing-200)}.odx-pl-200{padding-inline-start:var(--odx-spacing-200)}.odx-pr-200{padding-inline-end:var(--odx-spacing-200)}.odx-py-200{padding-block:var(--odx-spacing-200)}.odx-pt-200{padding-block-start:var(--odx-spacing-200)}.odx-pb-200{padding-block-end:var(--odx-spacing-200)}.odx-g-250{gap:var(--odx-spacing-250)}.odx-gx-250{column-gap:var(--odx-spacing-250)}.odx-gy-250{row-gap:var(--odx-spacing-250)}.odx-m-250{margin:var(--odx-spacing-250)}.odx-mx-250{margin-inline:var(--odx-spacing-250)}.odx-ml-250{margin-inline-start:var(--odx-spacing-250)}.odx-mr-250{margin-inline-end:var(--odx-spacing-250)}.odx-my-250{margin-block:var(--odx-spacing-250)}.odx-mt-250{margin-block-start:var(--odx-spacing-250)}.odx-mb-250{margin-block-end:var(--odx-spacing-250)}.odx-p-250{padding:var(--odx-spacing-250)}.odx-px-250{padding-inline:var(--odx-spacing-250)}.odx-pl-250{padding-inline-start:var(--odx-spacing-250)}.odx-pr-250{padding-inline-end:var(--odx-spacing-250)}.odx-py-250{padding-block:var(--odx-spacing-250)}.odx-pt-250{padding-block-start:var(--odx-spacing-250)}.odx-pb-250{padding-block-end:var(--odx-spacing-250)}.odx-g-layout-sm{gap:var(--odx-spacing-layout-sm)}.odx-gx-layout-sm{column-gap:var(--odx-spacing-layout-sm)}.odx-gy-layout-sm{row-gap:var(--odx-spacing-layout-sm)}.odx-m-layout-sm{margin:var(--odx-spacing-layout-sm)}.odx-mx-layout-sm{margin-inline:var(--odx-spacing-layout-sm)}.odx-ml-layout-sm{margin-inline-start:var(--odx-spacing-layout-sm)}.odx-mr-layout-sm{margin-inline-end:var(--odx-spacing-layout-sm)}.odx-my-layout-sm{margin-block:var(--odx-spacing-layout-sm)}.odx-mt-layout-sm{margin-block-start:var(--odx-spacing-layout-sm)}.odx-mb-layout-sm{margin-block-end:var(--odx-spacing-layout-sm)}.odx-p-layout-sm{padding:var(--odx-spacing-layout-sm)}.odx-px-layout-sm{padding-inline:var(--odx-spacing-layout-sm)}.odx-pl-layout-sm{padding-inline-start:var(--odx-spacing-layout-sm)}.odx-pr-layout-sm{padding-inline-end:var(--odx-spacing-layout-sm)}.odx-py-layout-sm{padding-block:var(--odx-spacing-layout-sm)}.odx-pt-layout-sm{padding-block-start:var(--odx-spacing-layout-sm)}.odx-pb-layout-sm{padding-block-end:var(--odx-spacing-layout-sm)}.odx-g-layout-md{gap:var(--odx-spacing-layout-md)}.odx-gx-layout-md{column-gap:var(--odx-spacing-layout-md)}.odx-gy-layout-md{row-gap:var(--odx-spacing-layout-md)}.odx-m-layout-md{margin:var(--odx-spacing-layout-md)}.odx-mx-layout-md{margin-inline:var(--odx-spacing-layout-md)}.odx-ml-layout-md{margin-inline-start:var(--odx-spacing-layout-md)}.odx-mr-layout-md{margin-inline-end:var(--odx-spacing-layout-md)}.odx-my-layout-md{margin-block:var(--odx-spacing-layout-md)}.odx-mt-layout-md{margin-block-start:var(--odx-spacing-layout-md)}.odx-mb-layout-md{margin-block-end:var(--odx-spacing-layout-md)}.odx-p-layout-md{padding:var(--odx-spacing-layout-md)}.odx-px-layout-md{padding-inline:var(--odx-spacing-layout-md)}.odx-pl-layout-md{padding-inline-start:var(--odx-spacing-layout-md)}.odx-pr-layout-md{padding-inline-end:var(--odx-spacing-layout-md)}.odx-py-layout-md{padding-block:var(--odx-spacing-layout-md)}.odx-pt-layout-md{padding-block-start:var(--odx-spacing-layout-md)}.odx-pb-layout-md{padding-block-end:var(--odx-spacing-layout-md)}.odx-g-layout-lg{gap:var(--odx-spacing-layout-lg)}.odx-gx-layout-lg{column-gap:var(--odx-spacing-layout-lg)}.odx-gy-layout-lg{row-gap:var(--odx-spacing-layout-lg)}.odx-m-layout-lg{margin:var(--odx-spacing-layout-lg)}.odx-mx-layout-lg{margin-inline:var(--odx-spacing-layout-lg)}.odx-ml-layout-lg{margin-inline-start:var(--odx-spacing-layout-lg)}.odx-mr-layout-lg{margin-inline-end:var(--odx-spacing-layout-lg)}.odx-my-layout-lg{margin-block:var(--odx-spacing-layout-lg)}.odx-mt-layout-lg{margin-block-start:var(--odx-spacing-layout-lg)}.odx-mb-layout-lg{margin-block-end:var(--odx-spacing-layout-lg)}.odx-p-layout-lg{padding:var(--odx-spacing-layout-lg)}.odx-px-layout-lg{padding-inline:var(--odx-spacing-layout-lg)}.odx-pl-layout-lg{padding-inline-start:var(--odx-spacing-layout-lg)}.odx-pr-layout-lg{padding-inline-end:var(--odx-spacing-layout-lg)}.odx-py-layout-lg{padding-block:var(--odx-spacing-layout-lg)}.odx-pt-layout-lg{padding-block-start:var(--odx-spacing-layout-lg)}.odx-pb-layout-lg{padding-block-end:var(--odx-spacing-layout-lg)}.odx-no-interaction{user-select:none;pointer-events:none}.odx-no-overflow{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.odx-visually-hidden:not(:focus-within),.odx-visually-hidden-force{position:absolute!important;border:none!important;padding:0!important;width:1px!important;height:1px!important;overflow:hidden!important;white-space:nowrap!important;clip-path:rect(0 0 0 0)!important}}@layer base{:root{scrollbar-color:var(--odx-color-background-brand) transparent}.odx-dark-mode{color-scheme:dark}.odx-light-mode{color-scheme:light}html{scroll-behavior:smooth}body{background-color:var(--odx-color-background-base);line-height:var(--odx-typography-line-height-base);color:var(--odx-color-foreground-rest);font-family:var(--odx-typography-font-family-base),\"Noto Sans\",Kanit,sans-serif;font-size:var(--odx-typography-font-size-base)}}@layer reset{:where(*):not(:defined){display:none}}@layer base{:where(.odx-content),.odx-content-box{>odx-area-header{margin-block-start:calc(-1 * var(--odx-spacing-layout-lg))}>odx-title{margin-block:0 var(--odx-spacing-layout-sm)}>odx-text{margin-block:0 var(--odx-spacing-layout-md)}>odx-list{margin-block:var(--odx-spacing-layout-md)}}odx-icon{transition:var(--odx-transition-default);transition-property:transform,color,opacity}input[type=time]::-webkit-calendar-picker-indicator{display:none}odx-list-item:has(:is([odx-button],odx-list-item::part(control)):not([disabled]):active){--_color-background-pressed: var(--_color-background-hover)}[odx-button]:has(odx-icon:only-child){--_min-inline-size: 0}odx-input{&:has([slot=prefix])::part(input){padding-inline-start:0}&:has([slot=suffix])::part(input){padding-inline-end:0}}odx-rail-navigation :is(odx-navigation-item,odx-navigation-item-group)::part(label){transition:var(--odx-transition-reduced);transition-delay:var(--odx-motion-duration-fast);transition-property:opacity}odx-rail-navigation[collapsed] :is(odx-navigation-item,odx-navigation-item-group)::part(label){opacity:0;white-space:nowrap}}@layer reset{:host{outline:none;border:none;border-color:transparent}}";
116
116
 
117
117
  async function loadCustomElements(loader) {
118
118
  const entries = await loader();
package/dist/styles.css CHANGED
@@ -1 +1 @@
1
- @layer reset,base,variant,state,theme,utils;@layer reset{:where(*){scrollbar-width:thin}:where(*,:before,:after){box-sizing:border-box}:where(body,div,span,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,code,img,svg,small,strike,strong,sub,sup,b,u,i,ol,ul,li,form,label,table,caption,tbody,tfoot,thead,tr,th,td,main,article,aside,canvas,footer,header,nav,section,time,button,video,textarea,input){appearance:none;box-sizing:border-box;margin:0;border:0;padding:0}:where(img,picture,video,canvas){display:block;max-inline-size:100%}:where(input,button,textarea,select){appearance:none;font-family:inherit;font-feature-settings:inherit;font-size:inherit}:where(a){text-decoration:underline;color:var(--odx-color-foreground-accent-rest)}:where(p,h1,h2,h3,h4,h5,h6){overflow-wrap:break-word}:where(p){text-wrap:pretty}:where(h1,h2,h3,h4,h5,h6){text-wrap:balance}:where([popover]){outline:none;border:none}@media (prefers-reduced-motion: reduce){:where(*,:before,:after){transition-duration:0s!important;animation-duration:0s!important;animation-iteration-count:1!important;scroll-behavior:auto!important}}}@layer base{:root{--odx-transition-default: all var(--odx-motion-duration-default) var(--odx-motion-easing-default);--odx-transition-slow: all var(--odx-motion-duration-slow) var(--odx-motion-easing-default);--odx-transition-reduced: all var(--odx-motion-duration-fast) var(--odx-motion-easing-reduced);--odx-focus-ring-outer: var(--odx-size-12) solid var(--odx-color-stroke-focus-outer);--odx-focus-ring-inner: 0 0 0 calc(-1 * var(--odx-focus-ring-offset)) var(--odx-color-stroke-focus-inner) inset;--odx-focus-ring-offset: var(--odx-spacing-negative-12);--odx-focus-ring-offset-sm: var(--odx-spacing-negative-px);--odx-z-level-background: -1;--odx-z-level-base: 0;--odx-z-level-foreground: 1;--odx-z-level-interactive: 2;--odx-z-level-sticky: 10;--odx-z-level-overlay: 100;--odx-z-level-topmost: 9999;--odx-size-interactive-sm: var(--odx-size-200);--odx-size-interactive-md: var(--odx-size-225);--odx-size-interactive-lg: var(--odx-size-300);--odx-spacing-layout-sm: var(--odx-spacing-37);--odx-spacing-layout-md: var(--odx-spacing-75);--odx-spacing-layout-lg: var(--odx-spacing-100);--odx-spacing-interactive-x-sm: var(--odx-spacing-50);--odx-spacing-interactive-x-md: var(--odx-spacing-75);--odx-spacing-interactive-x-lg: var(--odx-spacing-100);--odx-spacing-interactive-y-sm: var(--odx-spacing-25);--odx-spacing-interactive-y-md: var(--odx-spacing-37);--odx-spacing-interactive-y-lg: var(--odx-spacing-50);--odx-font-size-text-xs: var(--odx-typography-font-size-1);--odx-line-height-text-xs: var(--odx-typography-line-height-1);--odx-font-size-text-sm: var(--odx-typography-font-size-2);--odx-line-height-text-sm: var(--odx-typography-line-height-2);--odx-font-size-text-md: var(--odx-breakpoint-font-size-p-base);--odx-line-height-text-md: var(--odx-breakpoint-line-height-p-base);--odx-font-size-text-lg: var(--odx-breakpoint-font-size-p-lg);--odx-line-height-text-lg: var(--odx-breakpoint-line-height-p-lg);--odx-font-size-heading-xs: var(--odx-breakpoint-font-size-heading-6);--odx-line-height-heading-xs: var(--odx-breakpoint-line-height-heading-6);--odx-font-size-heading-sm: var(--odx-breakpoint-font-size-heading-5);--odx-line-height-heading-sm: var(--odx-breakpoint-line-height-heading-5);--odx-font-size-heading-md: var(--odx-breakpoint-font-size-heading-4);--odx-line-height-heading-md: var(--odx-breakpoint-line-height-heading-4);--odx-font-size-heading-lg: var(--odx-breakpoint-font-size-heading-3);--odx-line-height-heading-lg: var(--odx-breakpoint-line-height-heading-3);--odx-font-size-heading-xl: var(--odx-breakpoint-font-size-heading-2);--odx-line-height-heading-xl: var(--odx-breakpoint-line-height-heading-2);--odx-font-size-heading-xxl: var(--odx-breakpoint-font-size-heading-1);--odx-line-height-heading-xxl: var(--odx-breakpoint-line-height-heading-1)}}@layer base{[class*=odx-title-],:where(h1,h2,h3,h4,h5,h6){display:block;font-family:var(--odx-typography-font-family-brand);font-weight:var(--odx-typography-font-weight-semibold)}[class*=odx-title-display-]{font-weight:var(--odx-typography-font-weight-medium)}.odx-title-xs,:where(h6){line-height:var(--odx-line-height-heading-xs);font-size:var(--odx-font-size-heading-xs)}.odx-title-sm,:where(h5){line-height:var(--odx-line-height-heading-sm);font-size:var(--odx-font-size-heading-sm)}.odx-title-md,:where(h4){line-height:var(--odx-line-height-heading-md);font-size:var(--odx-font-size-heading-md)}.odx-title-lg,:where(h3){line-height:var(--odx-line-height-heading-lg);font-size:var(--odx-font-size-heading-lg)}.odx-title-xl,:where(h2){line-height:var(--odx-line-height-heading-xl);font-size:var(--odx-font-size-heading-xl)}.odx-title-xxl,:where(h1){line-height:var(--odx-line-height-heading-xxl);font-size:var(--odx-font-size-heading-xxl)}.odx-title-display-sm{line-height:var(--odx-breakpoint-line-height-display-sm);font-size:var(--odx-breakpoint-font-size-display-sm)}.odx-title-display-md{line-height:var(--odx-breakpoint-line-height-display-md);font-size:var(--odx-breakpoint-font-size-display-md)}.odx-title-display-lg{line-height:var(--odx-breakpoint-line-height-display-lg);font-size:var(--odx-breakpoint-font-size-display-lg)}.odx-title-display-xl{line-height:var(--odx-breakpoint-line-height-display-xl);font-size:var(--odx-breakpoint-font-size-display-xl)}.odx-text-xs{line-height:var(--odx-line-height-text-xs);font-size:var(--odx-font-size-text-xs)}.odx-text-sm{line-height:var(--odx-line-height-text-sm);font-size:var(--odx-font-size-text-sm)}.odx-text-md,:where(p){line-height:var(--odx-line-height-text-md);font-size:var(--odx-font-size-text-md)}.odx-text-lg{line-height:var(--odx-line-height-text-lg);font-size:var(--odx-font-size-text-lg)}}@layer base{odx-content-box,.odx-content-box,.odx-content{>h1,>h2,>h3,>h4,>h5,>h6,>p:not(:last-child){margin-block:0 var(--odx-spacing-layout-md)}ol,ul{margin-block:var(--odx-spacing-layout-md);padding-inline-start:var(--odx-spacing-200)}}odx-content-box,:where(.odx-content-box){background-color:var(--odx-color-background-level-1);padding:var(--odx-spacing-layout-lg)}}@layer base{.odx-cluster,.odx-flank,.odx-stack{display:flex;flex-direction:column;gap:var(--odx-spacing-layout-md);align-items:center;justify-content:flex-start;max-inline-size:100%;text-align:inherit}.odx-cluster{flex-flow:row wrap;align-items:center}.odx-flank{flex-direction:row}.odx-stack{align-items:stretch}.odx-flank:not(.odx-justify-end)>:not(:first-child),.odx-flank.odx-justify-end>:not(:last-child){flex:1}.odx-fill{flex:1}.odx-align-baseline,.odx-align-start{align-items:flex-start}.odx-align-center{align-items:center}.odx-align-end{align-items:end}.odx-justify-start{justify-content:flex-start}.odx-justify-end{justify-content:flex-end}.odx-justify-center{justify-content:center}.odx-justify-space-between{justify-content:space-between}.odx-justify-space-around{justify-content:space-around}.odx-justify-space-evenly{justify-content:space-evenly}.odx-nowrap{flex-wrap:nowrap}}@layer utils{.odx-g-auto{gap:auto}.odx-gx-auto{column-gap:auto}.odx-gy-auto{row-gap:auto}.odx-m-auto{margin:auto}.odx-mx-auto{margin-inline:auto}.odx-ml-auto{margin-inline-start:auto}.odx-mr-auto{margin-inline-end:auto}.odx-my-auto{margin-block:auto}.odx-mt-auto{margin-block-start:auto}.odx-mb-auto{margin-block-end:auto}.odx-p-auto{padding:auto}.odx-px-auto{padding-inline:auto}.odx-pl-auto{padding-inline-start:auto}.odx-pr-auto{padding-inline-end:auto}.odx-py-auto{padding-block:auto}.odx-pt-auto{padding-block-start:auto}.odx-ps-auto{padding-block-end:auto}.odx-g-0{gap:0}.odx-gx-0{column-gap:0}.odx-gy-0{row-gap:0}.odx-m-0{margin:0}.odx-mx-0{margin-inline:0}.odx-ml-0{margin-inline-start:0}.odx-mr-0{margin-inline-end:0}.odx-my-0{margin-block:0}.odx-mt-0{margin-block-start:0}.odx-mb-0{margin-block-end:0}.odx-p-0{padding:0}.odx-px-0{padding-inline:0}.odx-pl-0{padding-inline-start:0}.odx-pr-0{padding-inline-end:0}.odx-py-0{padding-block:0}.odx-pt-0{padding-block-start:0}.odx-ps-0{padding-block-end:0}.odx-g-1{gap:var(--odx-spacing-px)}.odx-gx-1{column-gap:var(--odx-spacing-px)}.odx-gy-1{row-gap:var(--odx-spacing-px)}.odx-m-1{margin:var(--odx-spacing-px)}.odx-mx-1{margin-inline:var(--odx-spacing-px)}.odx-ml-1{margin-inline-start:var(--odx-spacing-px)}.odx-mr-1{margin-inline-end:var(--odx-spacing-px)}.odx-my-1{margin-block:var(--odx-spacing-px)}.odx-mt-1{margin-block-start:var(--odx-spacing-px)}.odx-mb-1{margin-block-end:var(--odx-spacing-px)}.odx-p-1{padding:var(--odx-spacing-px)}.odx-px-1{padding-inline:var(--odx-spacing-px)}.odx-pl-1{padding-inline-start:var(--odx-spacing-px)}.odx-pr-1{padding-inline-end:var(--odx-spacing-px)}.odx-py-1{padding-block:var(--odx-spacing-px)}.odx-pt-1{padding-block-start:var(--odx-spacing-px)}.odx-ps-1{padding-block-end:var(--odx-spacing-px)}.odx-g-12{gap:var(--odx-spacing-12)}.odx-gx-12{column-gap:var(--odx-spacing-12)}.odx-gy-12{row-gap:var(--odx-spacing-12)}.odx-m-12{margin:var(--odx-spacing-12)}.odx-mx-12{margin-inline:var(--odx-spacing-12)}.odx-ml-12{margin-inline-start:var(--odx-spacing-12)}.odx-mr-12{margin-inline-end:var(--odx-spacing-12)}.odx-my-12{margin-block:var(--odx-spacing-12)}.odx-mt-12{margin-block-start:var(--odx-spacing-12)}.odx-mb-12{margin-block-end:var(--odx-spacing-12)}.odx-p-12{padding:var(--odx-spacing-12)}.odx-px-12{padding-inline:var(--odx-spacing-12)}.odx-pl-12{padding-inline-start:var(--odx-spacing-12)}.odx-pr-12{padding-inline-end:var(--odx-spacing-12)}.odx-py-12{padding-block:var(--odx-spacing-12)}.odx-pt-12{padding-block-start:var(--odx-spacing-12)}.odx-ps-12{padding-block-end:var(--odx-spacing-12)}.odx-g-25{gap:var(--odx-spacing-25)}.odx-gx-25{column-gap:var(--odx-spacing-25)}.odx-gy-25{row-gap:var(--odx-spacing-25)}.odx-m-25{margin:var(--odx-spacing-25)}.odx-mx-25{margin-inline:var(--odx-spacing-25)}.odx-ml-25{margin-inline-start:var(--odx-spacing-25)}.odx-mr-25{margin-inline-end:var(--odx-spacing-25)}.odx-my-25{margin-block:var(--odx-spacing-25)}.odx-mt-25{margin-block-start:var(--odx-spacing-25)}.odx-mb-25{margin-block-end:var(--odx-spacing-25)}.odx-p-25{padding:var(--odx-spacing-25)}.odx-px-25{padding-inline:var(--odx-spacing-25)}.odx-pl-25{padding-inline-start:var(--odx-spacing-25)}.odx-pr-25{padding-inline-end:var(--odx-spacing-25)}.odx-py-25{padding-block:var(--odx-spacing-25)}.odx-pt-25{padding-block-start:var(--odx-spacing-25)}.odx-ps-25{padding-block-end:var(--odx-spacing-25)}.odx-g-37{gap:var(--odx-spacing-37)}.odx-gx-37{column-gap:var(--odx-spacing-37)}.odx-gy-37{row-gap:var(--odx-spacing-37)}.odx-m-37{margin:var(--odx-spacing-37)}.odx-mx-37{margin-inline:var(--odx-spacing-37)}.odx-ml-37{margin-inline-start:var(--odx-spacing-37)}.odx-mr-37{margin-inline-end:var(--odx-spacing-37)}.odx-my-37{margin-block:var(--odx-spacing-37)}.odx-mt-37{margin-block-start:var(--odx-spacing-37)}.odx-mb-37{margin-block-end:var(--odx-spacing-37)}.odx-p-37{padding:var(--odx-spacing-37)}.odx-px-37{padding-inline:var(--odx-spacing-37)}.odx-pl-37{padding-inline-start:var(--odx-spacing-37)}.odx-pr-37{padding-inline-end:var(--odx-spacing-37)}.odx-py-37{padding-block:var(--odx-spacing-37)}.odx-pt-37{padding-block-start:var(--odx-spacing-37)}.odx-ps-37{padding-block-end:var(--odx-spacing-37)}.odx-g-50{gap:var(--odx-spacing-50)}.odx-gx-50{column-gap:var(--odx-spacing-50)}.odx-gy-50{row-gap:var(--odx-spacing-50)}.odx-m-50{margin:var(--odx-spacing-50)}.odx-mx-50{margin-inline:var(--odx-spacing-50)}.odx-ml-50{margin-inline-start:var(--odx-spacing-50)}.odx-mr-50{margin-inline-end:var(--odx-spacing-50)}.odx-my-50{margin-block:var(--odx-spacing-50)}.odx-mt-50{margin-block-start:var(--odx-spacing-50)}.odx-mb-50{margin-block-end:var(--odx-spacing-50)}.odx-p-50{padding:var(--odx-spacing-50)}.odx-px-50{padding-inline:var(--odx-spacing-50)}.odx-pl-50{padding-inline-start:var(--odx-spacing-50)}.odx-pr-50{padding-inline-end:var(--odx-spacing-50)}.odx-py-50{padding-block:var(--odx-spacing-50)}.odx-pt-50{padding-block-start:var(--odx-spacing-50)}.odx-ps-50{padding-block-end:var(--odx-spacing-50)}.odx-g-75{gap:var(--odx-spacing-75)}.odx-gx-75{column-gap:var(--odx-spacing-75)}.odx-gy-75{row-gap:var(--odx-spacing-75)}.odx-m-75{margin:var(--odx-spacing-75)}.odx-mx-75{margin-inline:var(--odx-spacing-75)}.odx-ml-75{margin-inline-start:var(--odx-spacing-75)}.odx-mr-75{margin-inline-end:var(--odx-spacing-75)}.odx-my-75{margin-block:var(--odx-spacing-75)}.odx-mt-75{margin-block-start:var(--odx-spacing-75)}.odx-mb-75{margin-block-end:var(--odx-spacing-75)}.odx-p-75{padding:var(--odx-spacing-75)}.odx-px-75{padding-inline:var(--odx-spacing-75)}.odx-pl-75{padding-inline-start:var(--odx-spacing-75)}.odx-pr-75{padding-inline-end:var(--odx-spacing-75)}.odx-py-75{padding-block:var(--odx-spacing-75)}.odx-pt-75{padding-block-start:var(--odx-spacing-75)}.odx-ps-75{padding-block-end:var(--odx-spacing-75)}.odx-g-100{gap:var(--odx-spacing-100)}.odx-gx-100{column-gap:var(--odx-spacing-100)}.odx-gy-100{row-gap:var(--odx-spacing-100)}.odx-m-100{margin:var(--odx-spacing-100)}.odx-mx-100{margin-inline:var(--odx-spacing-100)}.odx-ml-100{margin-inline-start:var(--odx-spacing-100)}.odx-mr-100{margin-inline-end:var(--odx-spacing-100)}.odx-my-100{margin-block:var(--odx-spacing-100)}.odx-mt-100{margin-block-start:var(--odx-spacing-100)}.odx-mb-100{margin-block-end:var(--odx-spacing-100)}.odx-p-100{padding:var(--odx-spacing-100)}.odx-px-100{padding-inline:var(--odx-spacing-100)}.odx-pl-100{padding-inline-start:var(--odx-spacing-100)}.odx-pr-100{padding-inline-end:var(--odx-spacing-100)}.odx-py-100{padding-block:var(--odx-spacing-100)}.odx-pt-100{padding-block-start:var(--odx-spacing-100)}.odx-ps-100{padding-block-end:var(--odx-spacing-100)}.odx-g-150{gap:var(--odx-spacing-150)}.odx-gx-150{column-gap:var(--odx-spacing-150)}.odx-gy-150{row-gap:var(--odx-spacing-150)}.odx-m-150{margin:var(--odx-spacing-150)}.odx-mx-150{margin-inline:var(--odx-spacing-150)}.odx-ml-150{margin-inline-start:var(--odx-spacing-150)}.odx-mr-150{margin-inline-end:var(--odx-spacing-150)}.odx-my-150{margin-block:var(--odx-spacing-150)}.odx-mt-150{margin-block-start:var(--odx-spacing-150)}.odx-mb-150{margin-block-end:var(--odx-spacing-150)}.odx-p-150{padding:var(--odx-spacing-150)}.odx-px-150{padding-inline:var(--odx-spacing-150)}.odx-pl-150{padding-inline-start:var(--odx-spacing-150)}.odx-pr-150{padding-inline-end:var(--odx-spacing-150)}.odx-py-150{padding-block:var(--odx-spacing-150)}.odx-pt-150{padding-block-start:var(--odx-spacing-150)}.odx-ps-150{padding-block-end:var(--odx-spacing-150)}.odx-g-200{gap:var(--odx-spacing-200)}.odx-gx-200{column-gap:var(--odx-spacing-200)}.odx-gy-200{row-gap:var(--odx-spacing-200)}.odx-m-200{margin:var(--odx-spacing-200)}.odx-mx-200{margin-inline:var(--odx-spacing-200)}.odx-ml-200{margin-inline-start:var(--odx-spacing-200)}.odx-mr-200{margin-inline-end:var(--odx-spacing-200)}.odx-my-200{margin-block:var(--odx-spacing-200)}.odx-mt-200{margin-block-start:var(--odx-spacing-200)}.odx-mb-200{margin-block-end:var(--odx-spacing-200)}.odx-p-200{padding:var(--odx-spacing-200)}.odx-px-200{padding-inline:var(--odx-spacing-200)}.odx-pl-200{padding-inline-start:var(--odx-spacing-200)}.odx-pr-200{padding-inline-end:var(--odx-spacing-200)}.odx-py-200{padding-block:var(--odx-spacing-200)}.odx-pt-200{padding-block-start:var(--odx-spacing-200)}.odx-ps-200{padding-block-end:var(--odx-spacing-200)}.odx-g-250{gap:var(--odx-spacing-250)}.odx-gx-250{column-gap:var(--odx-spacing-250)}.odx-gy-250{row-gap:var(--odx-spacing-250)}.odx-m-250{margin:var(--odx-spacing-250)}.odx-mx-250{margin-inline:var(--odx-spacing-250)}.odx-ml-250{margin-inline-start:var(--odx-spacing-250)}.odx-mr-250{margin-inline-end:var(--odx-spacing-250)}.odx-my-250{margin-block:var(--odx-spacing-250)}.odx-mt-250{margin-block-start:var(--odx-spacing-250)}.odx-mb-250{margin-block-end:var(--odx-spacing-250)}.odx-p-250{padding:var(--odx-spacing-250)}.odx-px-250{padding-inline:var(--odx-spacing-250)}.odx-pl-250{padding-inline-start:var(--odx-spacing-250)}.odx-pr-250{padding-inline-end:var(--odx-spacing-250)}.odx-py-250{padding-block:var(--odx-spacing-250)}.odx-pt-250{padding-block-start:var(--odx-spacing-250)}.odx-ps-250{padding-block-end:var(--odx-spacing-250)}.odx-g-layout-sm{gap:var(--odx-spacing-layout-sm)}.odx-gx-layout-sm{column-gap:var(--odx-spacing-layout-sm)}.odx-gy-layout-sm{row-gap:var(--odx-spacing-layout-sm)}.odx-m-layout-sm{margin:var(--odx-spacing-layout-sm)}.odx-mx-layout-sm{margin-inline:var(--odx-spacing-layout-sm)}.odx-ml-layout-sm{margin-inline-start:var(--odx-spacing-layout-sm)}.odx-mr-layout-sm{margin-inline-end:var(--odx-spacing-layout-sm)}.odx-my-layout-sm{margin-block:var(--odx-spacing-layout-sm)}.odx-mt-layout-sm{margin-block-start:var(--odx-spacing-layout-sm)}.odx-mb-layout-sm{margin-block-end:var(--odx-spacing-layout-sm)}.odx-p-layout-sm{padding:var(--odx-spacing-layout-sm)}.odx-px-layout-sm{padding-inline:var(--odx-spacing-layout-sm)}.odx-pl-layout-sm{padding-inline-start:var(--odx-spacing-layout-sm)}.odx-pr-layout-sm{padding-inline-end:var(--odx-spacing-layout-sm)}.odx-py-layout-sm{padding-block:var(--odx-spacing-layout-sm)}.odx-pt-layout-sm{padding-block-start:var(--odx-spacing-layout-sm)}.odx-ps-layout-sm{padding-block-end:var(--odx-spacing-layout-sm)}.odx-g-layout-md{gap:var(--odx-spacing-layout-md)}.odx-gx-layout-md{column-gap:var(--odx-spacing-layout-md)}.odx-gy-layout-md{row-gap:var(--odx-spacing-layout-md)}.odx-m-layout-md{margin:var(--odx-spacing-layout-md)}.odx-mx-layout-md{margin-inline:var(--odx-spacing-layout-md)}.odx-ml-layout-md{margin-inline-start:var(--odx-spacing-layout-md)}.odx-mr-layout-md{margin-inline-end:var(--odx-spacing-layout-md)}.odx-my-layout-md{margin-block:var(--odx-spacing-layout-md)}.odx-mt-layout-md{margin-block-start:var(--odx-spacing-layout-md)}.odx-mb-layout-md{margin-block-end:var(--odx-spacing-layout-md)}.odx-p-layout-md{padding:var(--odx-spacing-layout-md)}.odx-px-layout-md{padding-inline:var(--odx-spacing-layout-md)}.odx-pl-layout-md{padding-inline-start:var(--odx-spacing-layout-md)}.odx-pr-layout-md{padding-inline-end:var(--odx-spacing-layout-md)}.odx-py-layout-md{padding-block:var(--odx-spacing-layout-md)}.odx-pt-layout-md{padding-block-start:var(--odx-spacing-layout-md)}.odx-ps-layout-md{padding-block-end:var(--odx-spacing-layout-md)}.odx-g-layout-lg{gap:var(--odx-spacing-layout-lg)}.odx-gx-layout-lg{column-gap:var(--odx-spacing-layout-lg)}.odx-gy-layout-lg{row-gap:var(--odx-spacing-layout-lg)}.odx-m-layout-lg{margin:var(--odx-spacing-layout-lg)}.odx-mx-layout-lg{margin-inline:var(--odx-spacing-layout-lg)}.odx-ml-layout-lg{margin-inline-start:var(--odx-spacing-layout-lg)}.odx-mr-layout-lg{margin-inline-end:var(--odx-spacing-layout-lg)}.odx-my-layout-lg{margin-block:var(--odx-spacing-layout-lg)}.odx-mt-layout-lg{margin-block-start:var(--odx-spacing-layout-lg)}.odx-mb-layout-lg{margin-block-end:var(--odx-spacing-layout-lg)}.odx-p-layout-lg{padding:var(--odx-spacing-layout-lg)}.odx-px-layout-lg{padding-inline:var(--odx-spacing-layout-lg)}.odx-pl-layout-lg{padding-inline-start:var(--odx-spacing-layout-lg)}.odx-pr-layout-lg{padding-inline-end:var(--odx-spacing-layout-lg)}.odx-py-layout-lg{padding-block:var(--odx-spacing-layout-lg)}.odx-pt-layout-lg{padding-block-start:var(--odx-spacing-layout-lg)}.odx-ps-layout-lg{padding-block-end:var(--odx-spacing-layout-lg)}.odx-no-overflow{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.odx-visually-hidden:not(:focus-within),.odx-visually-hidden-force{position:absolute!important;border:none!important;padding:0!important;width:1px!important;height:1px!important;overflow:hidden!important;white-space:nowrap!important;clip-path:rect(0 0 0 0)!important}}@layer base{:root{scrollbar-color:var(--odx-color-background-brand) transparent}.odx-dark-mode{color-scheme:dark}.odx-light-mode{color-scheme:light}html{scroll-behavior:smooth}body{background-color:var(--odx-color-background-base);line-height:var(--odx-typography-line-height-base);color:var(--odx-color-foreground-rest);font-family:var(--odx-typography-font-family-base),"Noto Sans",Kanit,sans-serif;font-size:var(--odx-typography-font-size-base)}}@layer reset{:where(*):not(:defined){display:none}}@layer base{:where(.odx-content),.odx-content-box{>odx-area-header{margin-block-start:calc(-1 * var(--odx-spacing-layout-lg))}>odx-title{margin-block:0 var(--odx-spacing-layout-sm)}>odx-text{margin-block:0 var(--odx-spacing-layout-md)}}odx-icon{transition:var(--odx-transition-default);transition-property:transform,color,opacity}input[type=time]::-webkit-calendar-picker-indicator{display:none}odx-list-item:has(:is([odx-button],odx-list-item::part(control)):not([disabled]):active){--_color-background-pressed: var(--_color-background-hover)}[odx-button]:has(odx-icon:only-child){--_min-inline-size: 0}odx-input{&:has([slot=prefix])::part(input){padding-inline-start:0}&:has([slot=suffix])::part(input){padding-inline-end:0}}odx-rail-navigation :is(odx-navigation-item,odx-navigation-item-group)::part(label){transition:var(--odx-transition-reduced);transition-delay:var(--odx-motion-duration-fast);transition-property:opacity}odx-rail-navigation[collapsed] :is(odx-navigation-item,odx-navigation-item-group)::part(label){opacity:0;white-space:nowrap}}
1
+ @layer reset,base,variant,state,theme,utils;:root{--odx-transition-default: all var(--odx-motion-duration-default) var(--odx-motion-easing-default);--odx-transition-slow: all var(--odx-motion-duration-slow) var(--odx-motion-easing-default);--odx-transition-reduced: all var(--odx-motion-duration-fast) var(--odx-motion-easing-reduced);--odx-focus-ring-outer: var(--odx-size-12) solid var(--odx-color-stroke-focus-outer);--odx-focus-ring-inner: 0 0 0 calc(-1 * var(--odx-focus-ring-offset)) var(--odx-color-stroke-focus-inner) inset;--odx-focus-ring-offset: var(--odx-spacing-negative-12);--odx-focus-ring-offset-sm: var(--odx-spacing-negative-px);--odx-z-level-background: -1;--odx-z-level-base: 0;--odx-z-level-foreground: 1;--odx-z-level-interactive: 2;--odx-z-level-sticky: 10;--odx-z-level-overlay: 100;--odx-z-level-topmost: 9999;--odx-size-interactive-sm: var(--odx-size-200);--odx-size-interactive-md: var(--odx-size-225);--odx-size-interactive-lg: var(--odx-size-300);--odx-spacing-layout-sm: var(--odx-spacing-37);--odx-spacing-layout-md: var(--odx-spacing-75);--odx-spacing-layout-lg: var(--odx-spacing-100);--odx-spacing-interactive-x-sm: var(--odx-spacing-50);--odx-spacing-interactive-x-md: var(--odx-spacing-75);--odx-spacing-interactive-x-lg: var(--odx-spacing-100);--odx-spacing-interactive-y-sm: var(--odx-spacing-25);--odx-spacing-interactive-y-md: var(--odx-spacing-37);--odx-spacing-interactive-y-lg: var(--odx-spacing-50);--odx-font-size-text-xs: var(--odx-typography-font-size-1);--odx-line-height-text-xs: var(--odx-typography-line-height-1);--odx-font-size-text-sm: var(--odx-typography-font-size-2);--odx-line-height-text-sm: var(--odx-typography-line-height-2);--odx-font-size-text-md: var(--odx-breakpoint-font-size-p-base);--odx-line-height-text-md: var(--odx-breakpoint-line-height-p-base);--odx-font-size-text-lg: var(--odx-breakpoint-font-size-p-lg);--odx-line-height-text-lg: var(--odx-breakpoint-line-height-p-lg);--odx-font-size-heading-xs: var(--odx-breakpoint-font-size-heading-6);--odx-line-height-heading-xs: var(--odx-breakpoint-line-height-heading-6);--odx-font-size-heading-sm: var(--odx-breakpoint-font-size-heading-5);--odx-line-height-heading-sm: var(--odx-breakpoint-line-height-heading-5);--odx-font-size-heading-md: var(--odx-breakpoint-font-size-heading-4);--odx-line-height-heading-md: var(--odx-breakpoint-line-height-heading-4);--odx-font-size-heading-lg: var(--odx-breakpoint-font-size-heading-3);--odx-line-height-heading-lg: var(--odx-breakpoint-line-height-heading-3);--odx-font-size-heading-xl: var(--odx-breakpoint-font-size-heading-2);--odx-line-height-heading-xl: var(--odx-breakpoint-line-height-heading-2);--odx-font-size-heading-xxl: var(--odx-breakpoint-font-size-heading-1);--odx-line-height-heading-xxl: var(--odx-breakpoint-line-height-heading-1)}@layer reset{:where(*){scrollbar-width:thin}:where(*,:before,:after){box-sizing:border-box}:where(body,div,span,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,code,img,svg,small,strike,strong,sub,sup,b,u,i,ol,ul,li,form,label,table,caption,tbody,tfoot,thead,tr,th,td,main,article,aside,canvas,footer,header,nav,section,time,button,video,textarea,input){appearance:none;box-sizing:border-box;margin:0;border:0;padding:0}:where(img,picture,video,canvas){display:block;max-inline-size:100%}:where(input,button,textarea,select){appearance:none;font-family:inherit;font-feature-settings:inherit;font-size:inherit}:where(a){text-decoration:underline;color:var(--odx-color-foreground-accent-rest)}:where(p,h1,h2,h3,h4,h5,h6){overflow-wrap:break-word}:where(p){text-wrap:pretty}:where(h1,h2,h3,h4,h5,h6){text-wrap:balance}:where([popover]){outline:none;border:none}@media (prefers-reduced-motion: reduce){:where(*,:before,:after){transition-duration:0s!important;animation-duration:0s!important;animation-iteration-count:1!important;scroll-behavior:auto!important}}}@layer base{[class*=odx-title-],:where(h1,h2,h3,h4,h5,h6){display:block;font-family:var(--odx-typography-font-family-brand);font-weight:var(--odx-typography-font-weight-semibold)}[class*=odx-title-display-]{font-weight:var(--odx-typography-font-weight-medium)}.odx-title-xs,:where(h6){line-height:var(--odx-line-height-heading-xs);font-size:var(--odx-font-size-heading-xs)}.odx-title-sm,:where(h5){line-height:var(--odx-line-height-heading-sm);font-size:var(--odx-font-size-heading-sm)}.odx-title-md,:where(h4){line-height:var(--odx-line-height-heading-md);font-size:var(--odx-font-size-heading-md)}.odx-title-lg,:where(h3){line-height:var(--odx-line-height-heading-lg);font-size:var(--odx-font-size-heading-lg)}.odx-title-xl,:where(h2){line-height:var(--odx-line-height-heading-xl);font-size:var(--odx-font-size-heading-xl)}.odx-title-xxl,:where(h1){line-height:var(--odx-line-height-heading-xxl);font-size:var(--odx-font-size-heading-xxl)}.odx-title-display-sm{line-height:var(--odx-breakpoint-line-height-display-sm);font-size:var(--odx-breakpoint-font-size-display-sm)}.odx-title-display-md{line-height:var(--odx-breakpoint-line-height-display-md);font-size:var(--odx-breakpoint-font-size-display-md)}.odx-title-display-lg{line-height:var(--odx-breakpoint-line-height-display-lg);font-size:var(--odx-breakpoint-font-size-display-lg)}.odx-title-display-xl{line-height:var(--odx-breakpoint-line-height-display-xl);font-size:var(--odx-breakpoint-font-size-display-xl)}.odx-text-xs{line-height:var(--odx-line-height-text-xs);font-size:var(--odx-font-size-text-xs)}.odx-text-sm{line-height:var(--odx-line-height-text-sm);font-size:var(--odx-font-size-text-sm)}.odx-text-md,:where(p){line-height:var(--odx-line-height-text-md);font-size:var(--odx-font-size-text-md)}.odx-text-lg{line-height:var(--odx-line-height-text-lg);font-size:var(--odx-font-size-text-lg)}}@layer base{odx-content-box,.odx-content-box,.odx-content{>h1,>h2,>h3,>h4,>h5,>h6,>p:not(:last-child){margin-block:0 var(--odx-spacing-layout-md)}ol,ul{margin-block:var(--odx-spacing-layout-md);padding-inline-start:var(--odx-spacing-200)}}odx-content-box,:where(.odx-content-box){background-color:var(--odx-color-background-level-1);padding:var(--odx-spacing-layout-lg)}}@layer base{.odx-cluster,.odx-flank,.odx-stack{display:flex;flex-direction:column;gap:var(--odx-spacing-layout-md);align-items:center;justify-content:flex-start;max-inline-size:100%;text-align:inherit}.odx-cluster{flex-flow:row wrap;align-items:center}.odx-flank{flex-direction:row}.odx-stack{align-items:stretch}.odx-flank:not(.odx-justify-end)>:not(:first-child),.odx-flank.odx-justify-end>:not(:last-child){flex:1}.odx-fill{flex:1}.odx-align-baseline,.odx-align-start{align-items:flex-start}.odx-align-center{align-items:center}.odx-align-end{align-items:end}.odx-justify-start{justify-content:flex-start}.odx-justify-end{justify-content:flex-end}.odx-justify-center{justify-content:center}.odx-justify-space-between{justify-content:space-between}.odx-justify-space-around{justify-content:space-around}.odx-justify-space-evenly{justify-content:space-evenly}.odx-nowrap{flex-wrap:nowrap}}@layer utils{.odx-g-auto{gap:auto}.odx-gx-auto{column-gap:auto}.odx-gy-auto{row-gap:auto}.odx-m-auto{margin:auto}.odx-mx-auto{margin-inline:auto}.odx-ml-auto{margin-inline-start:auto}.odx-mr-auto{margin-inline-end:auto}.odx-my-auto{margin-block:auto}.odx-mt-auto{margin-block-start:auto}.odx-mb-auto{margin-block-end:auto}.odx-p-auto{padding:auto}.odx-px-auto{padding-inline:auto}.odx-pl-auto{padding-inline-start:auto}.odx-pr-auto{padding-inline-end:auto}.odx-py-auto{padding-block:auto}.odx-pt-auto{padding-block-start:auto}.odx-pb-auto{padding-block-end:auto}.odx-g-0{gap:0}.odx-gx-0{column-gap:0}.odx-gy-0{row-gap:0}.odx-m-0{margin:0}.odx-mx-0{margin-inline:0}.odx-ml-0{margin-inline-start:0}.odx-mr-0{margin-inline-end:0}.odx-my-0{margin-block:0}.odx-mt-0{margin-block-start:0}.odx-mb-0{margin-block-end:0}.odx-p-0{padding:0}.odx-px-0{padding-inline:0}.odx-pl-0{padding-inline-start:0}.odx-pr-0{padding-inline-end:0}.odx-py-0{padding-block:0}.odx-pt-0{padding-block-start:0}.odx-pb-0{padding-block-end:0}.odx-g-1{gap:var(--odx-spacing-px)}.odx-gx-1{column-gap:var(--odx-spacing-px)}.odx-gy-1{row-gap:var(--odx-spacing-px)}.odx-m-1{margin:var(--odx-spacing-px)}.odx-mx-1{margin-inline:var(--odx-spacing-px)}.odx-ml-1{margin-inline-start:var(--odx-spacing-px)}.odx-mr-1{margin-inline-end:var(--odx-spacing-px)}.odx-my-1{margin-block:var(--odx-spacing-px)}.odx-mt-1{margin-block-start:var(--odx-spacing-px)}.odx-mb-1{margin-block-end:var(--odx-spacing-px)}.odx-p-1{padding:var(--odx-spacing-px)}.odx-px-1{padding-inline:var(--odx-spacing-px)}.odx-pl-1{padding-inline-start:var(--odx-spacing-px)}.odx-pr-1{padding-inline-end:var(--odx-spacing-px)}.odx-py-1{padding-block:var(--odx-spacing-px)}.odx-pt-1{padding-block-start:var(--odx-spacing-px)}.odx-pb-1{padding-block-end:var(--odx-spacing-px)}.odx-g-12{gap:var(--odx-spacing-12)}.odx-gx-12{column-gap:var(--odx-spacing-12)}.odx-gy-12{row-gap:var(--odx-spacing-12)}.odx-m-12{margin:var(--odx-spacing-12)}.odx-mx-12{margin-inline:var(--odx-spacing-12)}.odx-ml-12{margin-inline-start:var(--odx-spacing-12)}.odx-mr-12{margin-inline-end:var(--odx-spacing-12)}.odx-my-12{margin-block:var(--odx-spacing-12)}.odx-mt-12{margin-block-start:var(--odx-spacing-12)}.odx-mb-12{margin-block-end:var(--odx-spacing-12)}.odx-p-12{padding:var(--odx-spacing-12)}.odx-px-12{padding-inline:var(--odx-spacing-12)}.odx-pl-12{padding-inline-start:var(--odx-spacing-12)}.odx-pr-12{padding-inline-end:var(--odx-spacing-12)}.odx-py-12{padding-block:var(--odx-spacing-12)}.odx-pt-12{padding-block-start:var(--odx-spacing-12)}.odx-pb-12{padding-block-end:var(--odx-spacing-12)}.odx-g-25{gap:var(--odx-spacing-25)}.odx-gx-25{column-gap:var(--odx-spacing-25)}.odx-gy-25{row-gap:var(--odx-spacing-25)}.odx-m-25{margin:var(--odx-spacing-25)}.odx-mx-25{margin-inline:var(--odx-spacing-25)}.odx-ml-25{margin-inline-start:var(--odx-spacing-25)}.odx-mr-25{margin-inline-end:var(--odx-spacing-25)}.odx-my-25{margin-block:var(--odx-spacing-25)}.odx-mt-25{margin-block-start:var(--odx-spacing-25)}.odx-mb-25{margin-block-end:var(--odx-spacing-25)}.odx-p-25{padding:var(--odx-spacing-25)}.odx-px-25{padding-inline:var(--odx-spacing-25)}.odx-pl-25{padding-inline-start:var(--odx-spacing-25)}.odx-pr-25{padding-inline-end:var(--odx-spacing-25)}.odx-py-25{padding-block:var(--odx-spacing-25)}.odx-pt-25{padding-block-start:var(--odx-spacing-25)}.odx-pb-25{padding-block-end:var(--odx-spacing-25)}.odx-g-37{gap:var(--odx-spacing-37)}.odx-gx-37{column-gap:var(--odx-spacing-37)}.odx-gy-37{row-gap:var(--odx-spacing-37)}.odx-m-37{margin:var(--odx-spacing-37)}.odx-mx-37{margin-inline:var(--odx-spacing-37)}.odx-ml-37{margin-inline-start:var(--odx-spacing-37)}.odx-mr-37{margin-inline-end:var(--odx-spacing-37)}.odx-my-37{margin-block:var(--odx-spacing-37)}.odx-mt-37{margin-block-start:var(--odx-spacing-37)}.odx-mb-37{margin-block-end:var(--odx-spacing-37)}.odx-p-37{padding:var(--odx-spacing-37)}.odx-px-37{padding-inline:var(--odx-spacing-37)}.odx-pl-37{padding-inline-start:var(--odx-spacing-37)}.odx-pr-37{padding-inline-end:var(--odx-spacing-37)}.odx-py-37{padding-block:var(--odx-spacing-37)}.odx-pt-37{padding-block-start:var(--odx-spacing-37)}.odx-pb-37{padding-block-end:var(--odx-spacing-37)}.odx-g-50{gap:var(--odx-spacing-50)}.odx-gx-50{column-gap:var(--odx-spacing-50)}.odx-gy-50{row-gap:var(--odx-spacing-50)}.odx-m-50{margin:var(--odx-spacing-50)}.odx-mx-50{margin-inline:var(--odx-spacing-50)}.odx-ml-50{margin-inline-start:var(--odx-spacing-50)}.odx-mr-50{margin-inline-end:var(--odx-spacing-50)}.odx-my-50{margin-block:var(--odx-spacing-50)}.odx-mt-50{margin-block-start:var(--odx-spacing-50)}.odx-mb-50{margin-block-end:var(--odx-spacing-50)}.odx-p-50{padding:var(--odx-spacing-50)}.odx-px-50{padding-inline:var(--odx-spacing-50)}.odx-pl-50{padding-inline-start:var(--odx-spacing-50)}.odx-pr-50{padding-inline-end:var(--odx-spacing-50)}.odx-py-50{padding-block:var(--odx-spacing-50)}.odx-pt-50{padding-block-start:var(--odx-spacing-50)}.odx-pb-50{padding-block-end:var(--odx-spacing-50)}.odx-g-75{gap:var(--odx-spacing-75)}.odx-gx-75{column-gap:var(--odx-spacing-75)}.odx-gy-75{row-gap:var(--odx-spacing-75)}.odx-m-75{margin:var(--odx-spacing-75)}.odx-mx-75{margin-inline:var(--odx-spacing-75)}.odx-ml-75{margin-inline-start:var(--odx-spacing-75)}.odx-mr-75{margin-inline-end:var(--odx-spacing-75)}.odx-my-75{margin-block:var(--odx-spacing-75)}.odx-mt-75{margin-block-start:var(--odx-spacing-75)}.odx-mb-75{margin-block-end:var(--odx-spacing-75)}.odx-p-75{padding:var(--odx-spacing-75)}.odx-px-75{padding-inline:var(--odx-spacing-75)}.odx-pl-75{padding-inline-start:var(--odx-spacing-75)}.odx-pr-75{padding-inline-end:var(--odx-spacing-75)}.odx-py-75{padding-block:var(--odx-spacing-75)}.odx-pt-75{padding-block-start:var(--odx-spacing-75)}.odx-pb-75{padding-block-end:var(--odx-spacing-75)}.odx-g-100{gap:var(--odx-spacing-100)}.odx-gx-100{column-gap:var(--odx-spacing-100)}.odx-gy-100{row-gap:var(--odx-spacing-100)}.odx-m-100{margin:var(--odx-spacing-100)}.odx-mx-100{margin-inline:var(--odx-spacing-100)}.odx-ml-100{margin-inline-start:var(--odx-spacing-100)}.odx-mr-100{margin-inline-end:var(--odx-spacing-100)}.odx-my-100{margin-block:var(--odx-spacing-100)}.odx-mt-100{margin-block-start:var(--odx-spacing-100)}.odx-mb-100{margin-block-end:var(--odx-spacing-100)}.odx-p-100{padding:var(--odx-spacing-100)}.odx-px-100{padding-inline:var(--odx-spacing-100)}.odx-pl-100{padding-inline-start:var(--odx-spacing-100)}.odx-pr-100{padding-inline-end:var(--odx-spacing-100)}.odx-py-100{padding-block:var(--odx-spacing-100)}.odx-pt-100{padding-block-start:var(--odx-spacing-100)}.odx-pb-100{padding-block-end:var(--odx-spacing-100)}.odx-g-150{gap:var(--odx-spacing-150)}.odx-gx-150{column-gap:var(--odx-spacing-150)}.odx-gy-150{row-gap:var(--odx-spacing-150)}.odx-m-150{margin:var(--odx-spacing-150)}.odx-mx-150{margin-inline:var(--odx-spacing-150)}.odx-ml-150{margin-inline-start:var(--odx-spacing-150)}.odx-mr-150{margin-inline-end:var(--odx-spacing-150)}.odx-my-150{margin-block:var(--odx-spacing-150)}.odx-mt-150{margin-block-start:var(--odx-spacing-150)}.odx-mb-150{margin-block-end:var(--odx-spacing-150)}.odx-p-150{padding:var(--odx-spacing-150)}.odx-px-150{padding-inline:var(--odx-spacing-150)}.odx-pl-150{padding-inline-start:var(--odx-spacing-150)}.odx-pr-150{padding-inline-end:var(--odx-spacing-150)}.odx-py-150{padding-block:var(--odx-spacing-150)}.odx-pt-150{padding-block-start:var(--odx-spacing-150)}.odx-pb-150{padding-block-end:var(--odx-spacing-150)}.odx-g-200{gap:var(--odx-spacing-200)}.odx-gx-200{column-gap:var(--odx-spacing-200)}.odx-gy-200{row-gap:var(--odx-spacing-200)}.odx-m-200{margin:var(--odx-spacing-200)}.odx-mx-200{margin-inline:var(--odx-spacing-200)}.odx-ml-200{margin-inline-start:var(--odx-spacing-200)}.odx-mr-200{margin-inline-end:var(--odx-spacing-200)}.odx-my-200{margin-block:var(--odx-spacing-200)}.odx-mt-200{margin-block-start:var(--odx-spacing-200)}.odx-mb-200{margin-block-end:var(--odx-spacing-200)}.odx-p-200{padding:var(--odx-spacing-200)}.odx-px-200{padding-inline:var(--odx-spacing-200)}.odx-pl-200{padding-inline-start:var(--odx-spacing-200)}.odx-pr-200{padding-inline-end:var(--odx-spacing-200)}.odx-py-200{padding-block:var(--odx-spacing-200)}.odx-pt-200{padding-block-start:var(--odx-spacing-200)}.odx-pb-200{padding-block-end:var(--odx-spacing-200)}.odx-g-250{gap:var(--odx-spacing-250)}.odx-gx-250{column-gap:var(--odx-spacing-250)}.odx-gy-250{row-gap:var(--odx-spacing-250)}.odx-m-250{margin:var(--odx-spacing-250)}.odx-mx-250{margin-inline:var(--odx-spacing-250)}.odx-ml-250{margin-inline-start:var(--odx-spacing-250)}.odx-mr-250{margin-inline-end:var(--odx-spacing-250)}.odx-my-250{margin-block:var(--odx-spacing-250)}.odx-mt-250{margin-block-start:var(--odx-spacing-250)}.odx-mb-250{margin-block-end:var(--odx-spacing-250)}.odx-p-250{padding:var(--odx-spacing-250)}.odx-px-250{padding-inline:var(--odx-spacing-250)}.odx-pl-250{padding-inline-start:var(--odx-spacing-250)}.odx-pr-250{padding-inline-end:var(--odx-spacing-250)}.odx-py-250{padding-block:var(--odx-spacing-250)}.odx-pt-250{padding-block-start:var(--odx-spacing-250)}.odx-pb-250{padding-block-end:var(--odx-spacing-250)}.odx-g-layout-sm{gap:var(--odx-spacing-layout-sm)}.odx-gx-layout-sm{column-gap:var(--odx-spacing-layout-sm)}.odx-gy-layout-sm{row-gap:var(--odx-spacing-layout-sm)}.odx-m-layout-sm{margin:var(--odx-spacing-layout-sm)}.odx-mx-layout-sm{margin-inline:var(--odx-spacing-layout-sm)}.odx-ml-layout-sm{margin-inline-start:var(--odx-spacing-layout-sm)}.odx-mr-layout-sm{margin-inline-end:var(--odx-spacing-layout-sm)}.odx-my-layout-sm{margin-block:var(--odx-spacing-layout-sm)}.odx-mt-layout-sm{margin-block-start:var(--odx-spacing-layout-sm)}.odx-mb-layout-sm{margin-block-end:var(--odx-spacing-layout-sm)}.odx-p-layout-sm{padding:var(--odx-spacing-layout-sm)}.odx-px-layout-sm{padding-inline:var(--odx-spacing-layout-sm)}.odx-pl-layout-sm{padding-inline-start:var(--odx-spacing-layout-sm)}.odx-pr-layout-sm{padding-inline-end:var(--odx-spacing-layout-sm)}.odx-py-layout-sm{padding-block:var(--odx-spacing-layout-sm)}.odx-pt-layout-sm{padding-block-start:var(--odx-spacing-layout-sm)}.odx-pb-layout-sm{padding-block-end:var(--odx-spacing-layout-sm)}.odx-g-layout-md{gap:var(--odx-spacing-layout-md)}.odx-gx-layout-md{column-gap:var(--odx-spacing-layout-md)}.odx-gy-layout-md{row-gap:var(--odx-spacing-layout-md)}.odx-m-layout-md{margin:var(--odx-spacing-layout-md)}.odx-mx-layout-md{margin-inline:var(--odx-spacing-layout-md)}.odx-ml-layout-md{margin-inline-start:var(--odx-spacing-layout-md)}.odx-mr-layout-md{margin-inline-end:var(--odx-spacing-layout-md)}.odx-my-layout-md{margin-block:var(--odx-spacing-layout-md)}.odx-mt-layout-md{margin-block-start:var(--odx-spacing-layout-md)}.odx-mb-layout-md{margin-block-end:var(--odx-spacing-layout-md)}.odx-p-layout-md{padding:var(--odx-spacing-layout-md)}.odx-px-layout-md{padding-inline:var(--odx-spacing-layout-md)}.odx-pl-layout-md{padding-inline-start:var(--odx-spacing-layout-md)}.odx-pr-layout-md{padding-inline-end:var(--odx-spacing-layout-md)}.odx-py-layout-md{padding-block:var(--odx-spacing-layout-md)}.odx-pt-layout-md{padding-block-start:var(--odx-spacing-layout-md)}.odx-pb-layout-md{padding-block-end:var(--odx-spacing-layout-md)}.odx-g-layout-lg{gap:var(--odx-spacing-layout-lg)}.odx-gx-layout-lg{column-gap:var(--odx-spacing-layout-lg)}.odx-gy-layout-lg{row-gap:var(--odx-spacing-layout-lg)}.odx-m-layout-lg{margin:var(--odx-spacing-layout-lg)}.odx-mx-layout-lg{margin-inline:var(--odx-spacing-layout-lg)}.odx-ml-layout-lg{margin-inline-start:var(--odx-spacing-layout-lg)}.odx-mr-layout-lg{margin-inline-end:var(--odx-spacing-layout-lg)}.odx-my-layout-lg{margin-block:var(--odx-spacing-layout-lg)}.odx-mt-layout-lg{margin-block-start:var(--odx-spacing-layout-lg)}.odx-mb-layout-lg{margin-block-end:var(--odx-spacing-layout-lg)}.odx-p-layout-lg{padding:var(--odx-spacing-layout-lg)}.odx-px-layout-lg{padding-inline:var(--odx-spacing-layout-lg)}.odx-pl-layout-lg{padding-inline-start:var(--odx-spacing-layout-lg)}.odx-pr-layout-lg{padding-inline-end:var(--odx-spacing-layout-lg)}.odx-py-layout-lg{padding-block:var(--odx-spacing-layout-lg)}.odx-pt-layout-lg{padding-block-start:var(--odx-spacing-layout-lg)}.odx-pb-layout-lg{padding-block-end:var(--odx-spacing-layout-lg)}.odx-no-interaction{user-select:none;pointer-events:none}.odx-no-overflow{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.odx-visually-hidden:not(:focus-within),.odx-visually-hidden-force{position:absolute!important;border:none!important;padding:0!important;width:1px!important;height:1px!important;overflow:hidden!important;white-space:nowrap!important;clip-path:rect(0 0 0 0)!important}}@layer base{:root{scrollbar-color:var(--odx-color-background-brand) transparent}.odx-dark-mode{color-scheme:dark}.odx-light-mode{color-scheme:light}html{scroll-behavior:smooth}body{background-color:var(--odx-color-background-base);line-height:var(--odx-typography-line-height-base);color:var(--odx-color-foreground-rest);font-family:var(--odx-typography-font-family-base),"Noto Sans",Kanit,sans-serif;font-size:var(--odx-typography-font-size-base)}}@layer reset{:where(*):not(:defined){display:none}}@layer base{:where(.odx-content),.odx-content-box{>odx-area-header{margin-block-start:calc(-1 * var(--odx-spacing-layout-lg))}>odx-title{margin-block:0 var(--odx-spacing-layout-sm)}>odx-text{margin-block:0 var(--odx-spacing-layout-md)}>odx-list{margin-block:var(--odx-spacing-layout-md)}}odx-icon{transition:var(--odx-transition-default);transition-property:transform,color,opacity}input[type=time]::-webkit-calendar-picker-indicator{display:none}odx-list-item:has(:is([odx-button],odx-list-item::part(control)):not([disabled]):active){--_color-background-pressed: var(--_color-background-hover)}[odx-button]:has(odx-icon:only-child){--_min-inline-size: 0}odx-input{&:has([slot=prefix])::part(input){padding-inline-start:0}&:has([slot=suffix])::part(input){padding-inline-end:0}}odx-rail-navigation :is(odx-navigation-item,odx-navigation-item-group)::part(label){transition:var(--odx-transition-reduced);transition-delay:var(--odx-motion-duration-fast);transition-property:opacity}odx-rail-navigation[collapsed] :is(odx-navigation-item,odx-navigation-item-group)::part(label){opacity:0;white-space:nowrap}}
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "@odx/foundation",
3
3
  "displayName": "ODX Design System Foundation",
4
4
  "description": "A library of Web Component building blocks for ODX",
5
- "version": "1.0.0-beta.183",
5
+ "version": "1.0.0-beta.184",
6
6
  "author": "Drägerwerk AG & Co.KGaA",
7
7
  "license": "SEE LICENSE IN LICENSE",
8
8
  "homepage": "https://odx.draeger.com",
@@ -35,9 +35,9 @@
35
35
  "stylelint-config-concentric-order": "5.2.1",
36
36
  "stylelint-config-standard": "39.0.0",
37
37
  "@odx/design-tokens": "1.1.0-rc.6",
38
- "@odx/storybook-utils": "0.0.0",
39
38
  "@odx/typescript-config": "0.0.0",
40
- "@odx/vite-config": "0.0.0"
39
+ "@odx/vite-config": "0.0.0",
40
+ "@odx/storybook-utils": "0.0.0"
41
41
  },
42
42
  "sideEffects": [
43
43
  "dist/i18n.js",