@dev-dga/css 0.12.1 → 0.13.0

package/CHANGELOG.md

@@ -1,5 +1,22 @@
 # @dev-dga/css
 
+## 0.13.0
+
+### Minor Changes
+
+- **Chip: `.ddga-chip--on-color` modifier.** White-ramp background + ink text for chips on a colored/dark surface (uses the `--ddga-alpha-white-*` ramp; 0 new tokens). Dark-theme chip rules now exclude on-color so the treatment is theme-independent.
+
+### Patch Changes
+
+- **Slider thumb: SDGA `border-success` ring.** The thumb gains a 1px `--ddga-success-700` (#067647) border around its brand-green fill, matching the official Platforms Code "Control".
+- **Field underline: smoother transition.** The focus/pressed underline on all six field controls (`text-input`, `textarea`, `number-input`, `dropdown`, `date-picker`, `date-range-picker`) now eases in over `400ms ease-out` (was `150ms ease`) — a slower, smoother grow-from-center. Still `scaleX`-driven (GPU-composited) and `prefers-reduced-motion`-guarded.
+
+## 0.12.2
+
+### Patch Changes
+
+- No changes. Version bumped in lockstep with `@dev-dga/react` (see its changelog for the DatePicker weekday-header fix).
+
 ## 0.12.1
 
 ### Patch Changes

package/dist/components/chip.css

@@ -1,2 +1,2 @@
-@layer ddga-components{.ddga-chip{justify-content:center;align-items:center;gap:var(--ddga-space-1);box-sizing:border-box;border-radius:var(--ddga-radius-sm);font-family:inherit;font-weight:var(--ddga-font-weight-medium);white-space:nowrap;cursor:pointer;background-color:var(--ddga-chip-bg);color:var(--ddga-chip-fg);border:0;transition:background-color .15s,color .15s;display:inline-flex}.ddga-chip--rounded{border-radius:var(--ddga-radius-full)}.ddga-chip--sm{block-size:20px;padding-inline:var(--ddga-space-3);font-size:var(--ddga-font-size-2xs);font-weight:var(--ddga-font-weight-semibold);line-height:1.4}.ddga-chip--md{block-size:24px;padding-inline:var(--ddga-space-3);font-size:var(--ddga-font-size-xs);line-height:1.5}.ddga-chip--lg{block-size:32px;padding-inline:var(--ddga-space-3);font-size:var(--ddga-font-size-base);line-height:1.5}.ddga-chip__icon{flex-shrink:0;display:inline-flex}.ddga-chip__icon>svg{block-size:14px;inline-size:14px}.ddga-chip--lg .ddga-chip__icon>svg{block-size:16px;inline-size:16px}.ddga-chip--primary{--ddga-chip-bg:var(--ddga-sa-50);--ddga-chip-fg:var(--ddga-sa-800)}.ddga-chip--primary:hover:not(:disabled):not([aria-pressed=true]){--ddga-chip-bg:var(--ddga-sa-200)}.ddga-chip--primary:active:not(:disabled):not([aria-pressed=true]){--ddga-chip-bg:var(--ddga-sa-400);--ddga-chip-fg:var(--ddga-sa-900)}.ddga-chip--primary[aria-pressed=true]{--ddga-chip-bg:var(--ddga-sa-600);--ddga-chip-fg:#fff}.ddga-chip--primary[aria-pressed=true]:hover:not(:disabled){--ddga-chip-bg:var(--ddga-sa-700)}.ddga-chip--primary[aria-pressed=true]:active:not(:disabled){--ddga-chip-bg:var(--ddga-sa-900)}.ddga-chip--neutral{--ddga-chip-bg:var(--ddga-gray-100);--ddga-chip-fg:var(--ddga-text-primary)}.ddga-chip--neutral:hover:not(:disabled):not([aria-pressed=true]){--ddga-chip-bg:var(--ddga-gray-200)}.ddga-chip--neutral:active:not(:disabled):not([aria-pressed=true]){--ddga-chip-bg:var(--ddga-gray-300)}.ddga-chip--neutral[aria-pressed=true]{--ddga-chip-bg:var(--ddga-gray-700);--ddga-chip-fg:#fff}.ddga-chip--neutral[aria-pressed=true]:hover:not(:disabled){--ddga-chip-bg:var(--ddga-gray-800)}.ddga-chip--neutral[aria-pressed=true]:active:not(:disabled){--ddga-chip-bg:var(--ddga-gray-950)}.ddga-chip:focus-visible{outline:2px solid var(--ddga-color-focus-ring);outline-offset:2px}.ddga-chip:disabled,.ddga-chip[aria-disabled=true]{cursor:not-allowed;pointer-events:none;--ddga-chip-bg:var(--ddga-gray-200);--ddga-chip-fg:var(--ddga-gray-400)}[data-theme=dark] .ddga-chip--neutral{--ddga-chip-bg:var(--ddga-gray-800);--ddga-chip-fg:var(--ddga-text-primary)}[data-theme=dark] .ddga-chip--neutral:hover:not(:disabled):not([aria-pressed=true]){--ddga-chip-bg:var(--ddga-gray-700)}[data-theme=dark] .ddga-chip--neutral:active:not(:disabled):not([aria-pressed=true]){--ddga-chip-bg:var(--ddga-gray-600)}[data-theme=dark] .ddga-chip--primary:not([aria-pressed=true]){--ddga-chip-bg:color-mix(in srgb, var(--ddga-sa-600) 20%, transparent);--ddga-chip-fg:var(--ddga-sa-200)}[data-theme=dark] .ddga-chip--primary:hover:not(:disabled):not([aria-pressed=true]){--ddga-chip-bg:color-mix(in srgb, var(--ddga-sa-600) 30%, transparent)}[data-theme=dark] .ddga-chip--primary:active:not(:disabled):not([aria-pressed=true]){--ddga-chip-bg:color-mix(in srgb, var(--ddga-sa-600) 40%, transparent);--ddga-chip-fg:var(--ddga-sa-200)}[data-theme=dark] .ddga-chip:disabled,[data-theme=dark] .ddga-chip[aria-disabled=true]{--ddga-chip-bg:var(--ddga-gray-800);--ddga-chip-fg:var(--ddga-gray-500)}@media (forced-colors:active){.ddga-chip{border:1px solid buttontext}.ddga-chip[aria-pressed=true]{border-color:highlight}.ddga-chip:disabled,.ddga-chip[aria-disabled=true]{color:graytext;border-color:graytext}.ddga-chip:focus-visible{outline:2px solid highlight}}}
+@layer ddga-components{.ddga-chip{justify-content:center;align-items:center;gap:var(--ddga-space-1);box-sizing:border-box;border-radius:var(--ddga-radius-sm);font-family:inherit;font-weight:var(--ddga-font-weight-medium);white-space:nowrap;cursor:pointer;background-color:var(--ddga-chip-bg);color:var(--ddga-chip-fg);border:0;transition:background-color .15s,color .15s;display:inline-flex}.ddga-chip--rounded{border-radius:var(--ddga-radius-full)}.ddga-chip--sm{block-size:20px;padding-inline:var(--ddga-space-3);font-size:var(--ddga-font-size-2xs);font-weight:var(--ddga-font-weight-semibold);line-height:1.4}.ddga-chip--md{block-size:24px;padding-inline:var(--ddga-space-3);font-size:var(--ddga-font-size-xs);line-height:1.5}.ddga-chip--lg{block-size:32px;padding-inline:var(--ddga-space-3);font-size:var(--ddga-font-size-base);line-height:1.5}.ddga-chip__icon{flex-shrink:0;display:inline-flex}.ddga-chip__icon>svg{block-size:14px;inline-size:14px}.ddga-chip--lg .ddga-chip__icon>svg{block-size:16px;inline-size:16px}.ddga-chip--primary{--ddga-chip-bg:var(--ddga-sa-50);--ddga-chip-fg:var(--ddga-sa-800)}.ddga-chip--primary:hover:not(:disabled):not([aria-pressed=true]){--ddga-chip-bg:var(--ddga-sa-200)}.ddga-chip--primary:active:not(:disabled):not([aria-pressed=true]){--ddga-chip-bg:var(--ddga-sa-400);--ddga-chip-fg:var(--ddga-sa-900)}.ddga-chip--primary[aria-pressed=true]{--ddga-chip-bg:var(--ddga-sa-600);--ddga-chip-fg:#fff}.ddga-chip--primary[aria-pressed=true]:hover:not(:disabled){--ddga-chip-bg:var(--ddga-sa-700)}.ddga-chip--primary[aria-pressed=true]:active:not(:disabled){--ddga-chip-bg:var(--ddga-sa-900)}.ddga-chip--neutral{--ddga-chip-bg:var(--ddga-gray-100);--ddga-chip-fg:var(--ddga-text-primary)}.ddga-chip--neutral:hover:not(:disabled):not([aria-pressed=true]){--ddga-chip-bg:var(--ddga-gray-200)}.ddga-chip--neutral:active:not(:disabled):not([aria-pressed=true]){--ddga-chip-bg:var(--ddga-gray-300)}.ddga-chip--neutral[aria-pressed=true]{--ddga-chip-bg:var(--ddga-gray-700);--ddga-chip-fg:#fff}.ddga-chip--neutral[aria-pressed=true]:hover:not(:disabled){--ddga-chip-bg:var(--ddga-gray-800)}.ddga-chip--neutral[aria-pressed=true]:active:not(:disabled){--ddga-chip-bg:var(--ddga-gray-950)}.ddga-chip:focus-visible{outline:2px solid var(--ddga-color-focus-ring);outline-offset:2px}.ddga-chip:disabled,.ddga-chip[aria-disabled=true]{cursor:not-allowed;pointer-events:none;--ddga-chip-bg:var(--ddga-gray-200);--ddga-chip-fg:var(--ddga-gray-400)}.ddga-chip--on-color{--ddga-chip-bg:#fff;--ddga-chip-fg:var(--ddga-text-primary)}.ddga-chip--on-color:hover:not(:disabled):not([aria-pressed=true]){--ddga-chip-bg:var(--ddga-alpha-white-80)}.ddga-chip--on-color:active:not(:disabled):not([aria-pressed=true]){--ddga-chip-bg:var(--ddga-alpha-white-60);--ddga-chip-fg:var(--ddga-text-primary)}.ddga-chip--on-color[aria-pressed=true]{--ddga-chip-bg:var(--ddga-alpha-white-70);--ddga-chip-fg:var(--ddga-text-primary)}.ddga-chip--on-color[aria-pressed=true]:hover:not(:disabled){--ddga-chip-bg:var(--ddga-alpha-white-80)}.ddga-chip--on-color[aria-pressed=true]:active:not(:disabled){--ddga-chip-bg:var(--ddga-alpha-white-60)}.ddga-chip--on-color:disabled,.ddga-chip--on-color[aria-disabled=true]{--ddga-chip-bg:var(--ddga-alpha-white-20);--ddga-chip-fg:var(--ddga-alpha-white-40)}[data-theme=dark] .ddga-chip--neutral:not(.ddga-chip--on-color){--ddga-chip-bg:var(--ddga-gray-800);--ddga-chip-fg:var(--ddga-text-primary)}[data-theme=dark] .ddga-chip--neutral:not(.ddga-chip--on-color):hover:not(:disabled):not([aria-pressed=true]){--ddga-chip-bg:var(--ddga-gray-700)}[data-theme=dark] .ddga-chip--neutral:not(.ddga-chip--on-color):active:not(:disabled):not([aria-pressed=true]){--ddga-chip-bg:var(--ddga-gray-600)}[data-theme=dark] .ddga-chip--primary:not(.ddga-chip--on-color):not([aria-pressed=true]){--ddga-chip-bg:color-mix(in srgb, var(--ddga-sa-600) 20%, transparent);--ddga-chip-fg:var(--ddga-sa-200)}[data-theme=dark] .ddga-chip--primary:not(.ddga-chip--on-color):hover:not(:disabled):not([aria-pressed=true]){--ddga-chip-bg:color-mix(in srgb, var(--ddga-sa-600) 30%, transparent)}[data-theme=dark] .ddga-chip--primary:not(.ddga-chip--on-color):active:not(:disabled):not([aria-pressed=true]){--ddga-chip-bg:color-mix(in srgb, var(--ddga-sa-600) 40%, transparent);--ddga-chip-fg:var(--ddga-sa-200)}[data-theme=dark] .ddga-chip:not(.ddga-chip--on-color):disabled,[data-theme=dark] .ddga-chip:not(.ddga-chip--on-color)[aria-disabled=true]{--ddga-chip-bg:var(--ddga-gray-800);--ddga-chip-fg:var(--ddga-gray-500)}@media (forced-colors:active){.ddga-chip{border:1px solid buttontext}.ddga-chip[aria-pressed=true]{border-color:highlight}.ddga-chip:disabled,.ddga-chip[aria-disabled=true]{color:graytext;border-color:graytext}.ddga-chip:focus-visible{outline:2px solid highlight}}}
 /*# sourceMappingURL=chip.css.map */

package/dist/components/chip.css.map

@@ -1 +1 @@
-{"version":3,"mappings":"AAAA,uBACE,gXAkBA,0DAKA,mKAOA,qHAMA,uHAOA,mDAIA,sDAIA,qEAMA,uFAIA,oGAGA,uIAIA,6FAIA,8FAGA,+FAKA,gGAIA,sGAGA,uGAGA,+FAIA,gGAGA,iGAKA,2FAOA,kKASA,kHAIA,wHAGA,yHAGA,wKAIA,2JAGA,8LAIA,+JAMA,8BACE,uCAGA,qDAGA,wFAKA","sources":["src/components/chip.css"],"sourcesContent":["@layer ddga-components {\n  .ddga-chip {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    gap: var(--ddga-space-1);\n    box-sizing: border-box;\n    border: 0;\n    border-radius: var(--ddga-radius-sm);\n    font-family: inherit;\n    font-weight: var(--ddga-font-weight-medium);\n    white-space: nowrap;\n    cursor: pointer;\n    background-color: var(--ddga-chip-bg);\n    color: var(--ddga-chip-fg);\n    transition:\n      background-color 150ms ease,\n      color 150ms ease;\n  }\n  .ddga-chip--rounded {\n    border-radius: var(--ddga-radius-full);\n  }\n\n  /* Sizes: 20 / 24 / 32 (SDGA). Inline pad 12px all sizes; x-Small 10/600/14, Medium 12/500/18, Large 16/500/24. */\n  .ddga-chip--sm {\n    block-size: 20px;\n    padding-inline: var(--ddga-space-3);\n    font-size: var(--ddga-font-size-2xs);\n    font-weight: var(--ddga-font-weight-semibold);\n    line-height: 1.4;\n  }\n  .ddga-chip--md {\n    block-size: 24px;\n    padding-inline: var(--ddga-space-3);\n    font-size: var(--ddga-font-size-xs);\n    line-height: 1.5;\n  }\n  .ddga-chip--lg {\n    block-size: 32px;\n    padding-inline: var(--ddga-space-3);\n    font-size: var(--ddga-font-size-base);\n    line-height: 1.5;\n  }\n\n  .ddga-chip__icon {\n    display: inline-flex;\n    flex-shrink: 0;\n  }\n  .ddga-chip__icon > svg {\n    inline-size: 14px;\n    block-size: 14px;\n  }\n  .ddga-chip--lg .ddga-chip__icon > svg {\n    inline-size: 16px;\n    block-size: 16px;\n  }\n\n  /* ── Primary (subtle SA-green → fills SA-600 when selected) ── */\n  .ddga-chip--primary {\n    --ddga-chip-bg: var(--ddga-sa-50);\n    --ddga-chip-fg: var(--ddga-sa-800);\n  }\n  .ddga-chip--primary:hover:not(:disabled):not([aria-pressed='true']) {\n    --ddga-chip-bg: var(--ddga-sa-200);\n  }\n  .ddga-chip--primary:active:not(:disabled):not([aria-pressed='true']) {\n    --ddga-chip-bg: var(--ddga-sa-400);\n    --ddga-chip-fg: var(--ddga-sa-900);\n  }\n  .ddga-chip--primary[aria-pressed='true'] {\n    --ddga-chip-bg: var(--ddga-sa-600);\n    --ddga-chip-fg: #ffffff;\n  }\n  .ddga-chip--primary[aria-pressed='true']:hover:not(:disabled) {\n    --ddga-chip-bg: var(--ddga-sa-700);\n  }\n  .ddga-chip--primary[aria-pressed='true']:active:not(:disabled) {\n    --ddga-chip-bg: var(--ddga-sa-900);\n  }\n\n  /* ── Neutral (gray → fills gray-700 when selected) ── */\n  .ddga-chip--neutral {\n    --ddga-chip-bg: var(--ddga-gray-100);\n    --ddga-chip-fg: var(--ddga-text-primary);\n  }\n  .ddga-chip--neutral:hover:not(:disabled):not([aria-pressed='true']) {\n    --ddga-chip-bg: var(--ddga-gray-200);\n  }\n  .ddga-chip--neutral:active:not(:disabled):not([aria-pressed='true']) {\n    --ddga-chip-bg: var(--ddga-gray-300);\n  }\n  .ddga-chip--neutral[aria-pressed='true'] {\n    --ddga-chip-bg: var(--ddga-gray-700);\n    --ddga-chip-fg: #ffffff;\n  }\n  .ddga-chip--neutral[aria-pressed='true']:hover:not(:disabled) {\n    --ddga-chip-bg: var(--ddga-gray-800);\n  }\n  .ddga-chip--neutral[aria-pressed='true']:active:not(:disabled) {\n    --ddga-chip-bg: var(--ddga-gray-950);\n  }\n\n  /* Focus: 2px SDGA ink ring. */\n  .ddga-chip:focus-visible {\n    outline: 2px solid var(--ddga-color-focus-ring);\n    outline-offset: 2px;\n  }\n\n  /* Disabled: recolour (no opacity), SDGA. `[aria-disabled]` covers asChild mode;\n     pointer-events:none stops hover/active from firing on it. */\n  .ddga-chip:disabled,\n  .ddga-chip[aria-disabled='true'] {\n    cursor: not-allowed;\n    pointer-events: none;\n    --ddga-chip-bg: var(--ddga-gray-200);\n    --ddga-chip-fg: var(--ddga-gray-400);\n  }\n\n  /* Dark: neutral + subtle-primary surfaces flip (selected brand-green fill stays). */\n  [data-theme='dark'] .ddga-chip--neutral {\n    --ddga-chip-bg: var(--ddga-gray-800);\n    --ddga-chip-fg: var(--ddga-text-primary);\n  }\n  [data-theme='dark'] .ddga-chip--neutral:hover:not(:disabled):not([aria-pressed='true']) {\n    --ddga-chip-bg: var(--ddga-gray-700);\n  }\n  [data-theme='dark'] .ddga-chip--neutral:active:not(:disabled):not([aria-pressed='true']) {\n    --ddga-chip-bg: var(--ddga-gray-600);\n  }\n  [data-theme='dark'] .ddga-chip--primary:not([aria-pressed='true']) {\n    --ddga-chip-bg: color-mix(in srgb, var(--ddga-sa-600) 20%, transparent);\n    --ddga-chip-fg: var(--ddga-sa-200);\n  }\n  [data-theme='dark'] .ddga-chip--primary:hover:not(:disabled):not([aria-pressed='true']) {\n    --ddga-chip-bg: color-mix(in srgb, var(--ddga-sa-600) 30%, transparent);\n  }\n  [data-theme='dark'] .ddga-chip--primary:active:not(:disabled):not([aria-pressed='true']) {\n    --ddga-chip-bg: color-mix(in srgb, var(--ddga-sa-600) 40%, transparent);\n    --ddga-chip-fg: var(--ddga-sa-200);\n  }\n  [data-theme='dark'] .ddga-chip:disabled,\n  [data-theme='dark'] .ddga-chip[aria-disabled='true'] {\n    --ddga-chip-bg: var(--ddga-gray-800);\n    --ddga-chip-fg: var(--ddga-gray-500);\n  }\n\n  @media (forced-colors: active) {\n    .ddga-chip {\n      border: 1px solid ButtonText;\n    }\n    .ddga-chip[aria-pressed='true'] {\n      border-color: Highlight;\n    }\n    .ddga-chip:disabled,\n    .ddga-chip[aria-disabled='true'] {\n      color: GrayText;\n      border-color: GrayText;\n    }\n    .ddga-chip:focus-visible {\n      outline: 2px solid Highlight;\n    }\n  }\n}\n"],"names":[]}
+{"version":3,"mappings":"AAAA,uBACE,gXAkBA,0DAKA,mKAOA,qHAMA,uHAOA,mDAIA,sDAIA,qEAMA,uFAIA,oGAGA,uIAIA,6FAIA,8FAGA,+FAKA,gGAIA,sGAGA,uGAGA,+FAIA,gGAGA,iGAKA,2FAOA,kKAYA,iFAIA,6GAGA,sJAIA,0HAIA,uGAGA,wGAGA,2JAQA,4IAIA,kJAIA,mJAIA,kMAIA,qLAIA,wNAKA,mNAMA,8BACE,uCAGA,qDAGA,wFAKA","sources":["src/components/chip.css"],"sourcesContent":["@layer ddga-components {\n  .ddga-chip {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    gap: var(--ddga-space-1);\n    box-sizing: border-box;\n    border: 0;\n    border-radius: var(--ddga-radius-sm);\n    font-family: inherit;\n    font-weight: var(--ddga-font-weight-medium);\n    white-space: nowrap;\n    cursor: pointer;\n    background-color: var(--ddga-chip-bg);\n    color: var(--ddga-chip-fg);\n    transition:\n      background-color 150ms ease,\n      color 150ms ease;\n  }\n  .ddga-chip--rounded {\n    border-radius: var(--ddga-radius-full);\n  }\n\n  /* Sizes: 20 / 24 / 32 (SDGA). Inline pad 12px all sizes; x-Small 10/600/14, Medium 12/500/18, Large 16/500/24. */\n  .ddga-chip--sm {\n    block-size: 20px;\n    padding-inline: var(--ddga-space-3);\n    font-size: var(--ddga-font-size-2xs);\n    font-weight: var(--ddga-font-weight-semibold);\n    line-height: 1.4;\n  }\n  .ddga-chip--md {\n    block-size: 24px;\n    padding-inline: var(--ddga-space-3);\n    font-size: var(--ddga-font-size-xs);\n    line-height: 1.5;\n  }\n  .ddga-chip--lg {\n    block-size: 32px;\n    padding-inline: var(--ddga-space-3);\n    font-size: var(--ddga-font-size-base);\n    line-height: 1.5;\n  }\n\n  .ddga-chip__icon {\n    display: inline-flex;\n    flex-shrink: 0;\n  }\n  .ddga-chip__icon > svg {\n    inline-size: 14px;\n    block-size: 14px;\n  }\n  .ddga-chip--lg .ddga-chip__icon > svg {\n    inline-size: 16px;\n    block-size: 16px;\n  }\n\n  /* ── Primary (subtle SA-green → fills SA-600 when selected) ── */\n  .ddga-chip--primary {\n    --ddga-chip-bg: var(--ddga-sa-50);\n    --ddga-chip-fg: var(--ddga-sa-800);\n  }\n  .ddga-chip--primary:hover:not(:disabled):not([aria-pressed='true']) {\n    --ddga-chip-bg: var(--ddga-sa-200);\n  }\n  .ddga-chip--primary:active:not(:disabled):not([aria-pressed='true']) {\n    --ddga-chip-bg: var(--ddga-sa-400);\n    --ddga-chip-fg: var(--ddga-sa-900);\n  }\n  .ddga-chip--primary[aria-pressed='true'] {\n    --ddga-chip-bg: var(--ddga-sa-600);\n    --ddga-chip-fg: #ffffff;\n  }\n  .ddga-chip--primary[aria-pressed='true']:hover:not(:disabled) {\n    --ddga-chip-bg: var(--ddga-sa-700);\n  }\n  .ddga-chip--primary[aria-pressed='true']:active:not(:disabled) {\n    --ddga-chip-bg: var(--ddga-sa-900);\n  }\n\n  /* ── Neutral (gray → fills gray-700 when selected) ── */\n  .ddga-chip--neutral {\n    --ddga-chip-bg: var(--ddga-gray-100);\n    --ddga-chip-fg: var(--ddga-text-primary);\n  }\n  .ddga-chip--neutral:hover:not(:disabled):not([aria-pressed='true']) {\n    --ddga-chip-bg: var(--ddga-gray-200);\n  }\n  .ddga-chip--neutral:active:not(:disabled):not([aria-pressed='true']) {\n    --ddga-chip-bg: var(--ddga-gray-300);\n  }\n  .ddga-chip--neutral[aria-pressed='true'] {\n    --ddga-chip-bg: var(--ddga-gray-700);\n    --ddga-chip-fg: #ffffff;\n  }\n  .ddga-chip--neutral[aria-pressed='true']:hover:not(:disabled) {\n    --ddga-chip-bg: var(--ddga-gray-800);\n  }\n  .ddga-chip--neutral[aria-pressed='true']:active:not(:disabled) {\n    --ddga-chip-bg: var(--ddga-gray-950);\n  }\n\n  /* Focus: 2px SDGA ink ring. */\n  .ddga-chip:focus-visible {\n    outline: 2px solid var(--ddga-color-focus-ring);\n    outline-offset: 2px;\n  }\n\n  /* Disabled: recolour (no opacity), SDGA. `[aria-disabled]` covers asChild mode;\n     pointer-events:none stops hover/active from firing on it. */\n  .ddga-chip:disabled,\n  .ddga-chip[aria-disabled='true'] {\n    cursor: not-allowed;\n    pointer-events: none;\n    --ddga-chip-bg: var(--ddga-gray-200);\n    --ddga-chip-fg: var(--ddga-gray-400);\n  }\n\n  /* ── On-color: chip on a colored/dark surface. Style-agnostic — SDGA renders Primary and\n     Neutral identically here: a white-ramp pill with ink text (`chip-background-on-color-*`).\n     Placed after the base states so it wins by source order; theme-independent (dark rules below\n     exclude it), since a colored surface looks the same in either theme. ── */\n  .ddga-chip--on-color {\n    --ddga-chip-bg: #ffffff;\n    --ddga-chip-fg: var(--ddga-text-primary);\n  }\n  .ddga-chip--on-color:hover:not(:disabled):not([aria-pressed='true']) {\n    --ddga-chip-bg: var(--ddga-alpha-white-80);\n  }\n  .ddga-chip--on-color:active:not(:disabled):not([aria-pressed='true']) {\n    --ddga-chip-bg: var(--ddga-alpha-white-60);\n    --ddga-chip-fg: var(--ddga-text-primary);\n  }\n  .ddga-chip--on-color[aria-pressed='true'] {\n    --ddga-chip-bg: var(--ddga-alpha-white-70);\n    --ddga-chip-fg: var(--ddga-text-primary);\n  }\n  .ddga-chip--on-color[aria-pressed='true']:hover:not(:disabled) {\n    --ddga-chip-bg: var(--ddga-alpha-white-80);\n  }\n  .ddga-chip--on-color[aria-pressed='true']:active:not(:disabled) {\n    --ddga-chip-bg: var(--ddga-alpha-white-60);\n  }\n  .ddga-chip--on-color:disabled,\n  .ddga-chip--on-color[aria-disabled='true'] {\n    --ddga-chip-bg: var(--ddga-alpha-white-20);\n    --ddga-chip-fg: var(--ddga-alpha-white-40);\n  }\n\n  /* Dark: neutral + subtle-primary surfaces flip (selected brand-green fill stays).\n     Exclude on-color — it owns its full white-ramp treatment in both themes. */\n  [data-theme='dark'] .ddga-chip--neutral:not(.ddga-chip--on-color) {\n    --ddga-chip-bg: var(--ddga-gray-800);\n    --ddga-chip-fg: var(--ddga-text-primary);\n  }\n  [data-theme='dark']\n    .ddga-chip--neutral:not(.ddga-chip--on-color):hover:not(:disabled):not([aria-pressed='true']) {\n    --ddga-chip-bg: var(--ddga-gray-700);\n  }\n  [data-theme='dark']\n    .ddga-chip--neutral:not(.ddga-chip--on-color):active:not(:disabled):not([aria-pressed='true']) {\n    --ddga-chip-bg: var(--ddga-gray-600);\n  }\n  [data-theme='dark'] .ddga-chip--primary:not(.ddga-chip--on-color):not([aria-pressed='true']) {\n    --ddga-chip-bg: color-mix(in srgb, var(--ddga-sa-600) 20%, transparent);\n    --ddga-chip-fg: var(--ddga-sa-200);\n  }\n  [data-theme='dark']\n    .ddga-chip--primary:not(.ddga-chip--on-color):hover:not(:disabled):not([aria-pressed='true']) {\n    --ddga-chip-bg: color-mix(in srgb, var(--ddga-sa-600) 30%, transparent);\n  }\n  [data-theme='dark']\n    .ddga-chip--primary:not(.ddga-chip--on-color):active:not(:disabled):not([aria-pressed='true']) {\n    --ddga-chip-bg: color-mix(in srgb, var(--ddga-sa-600) 40%, transparent);\n    --ddga-chip-fg: var(--ddga-sa-200);\n  }\n  [data-theme='dark'] .ddga-chip:not(.ddga-chip--on-color):disabled,\n  [data-theme='dark'] .ddga-chip:not(.ddga-chip--on-color)[aria-disabled='true'] {\n    --ddga-chip-bg: var(--ddga-gray-800);\n    --ddga-chip-fg: var(--ddga-gray-500);\n  }\n\n  @media (forced-colors: active) {\n    .ddga-chip {\n      border: 1px solid ButtonText;\n    }\n    .ddga-chip[aria-pressed='true'] {\n      border-color: Highlight;\n    }\n    .ddga-chip:disabled,\n    .ddga-chip[aria-disabled='true'] {\n      color: GrayText;\n      border-color: GrayText;\n    }\n    .ddga-chip:focus-visible {\n      outline: 2px solid Highlight;\n    }\n  }\n}\n"],"names":[]}

package/dist/components/date-picker.css

@@ -1,2 +1,2 @@
-@layer ddga-components{.ddga-field[data-slot=date-picker-field]{gap:var(--ddga-space-2)}.ddga-date-picker__label{align-items:center;gap:var(--ddga-space-1);color:var(--ddga-text-primary);font-weight:var(--ddga-font-weight-regular);font-size:var(--ddga-font-size-sm);line-height:1.4286;display:inline-flex}.ddga-date-picker__required{color:var(--ddga-error-700)}.ddga-date-picker-trigger{align-items:center;gap:var(--ddga-space-2);inline-size:100%;padding-inline:var(--ddga-space-2);border:1px solid var(--ddga-gray-400);border-radius:var(--ddga-radius-sm);background-color:var(--ddga-color-background);color:var(--ddga-gray-700);text-align:start;transition:border-color .15s,box-shadow .15s,background-color .15s;display:flex;position:relative}.ddga-date-picker-trigger--md{block-size:32px;font-size:var(--ddga-font-size-sm)}.ddga-date-picker-trigger--lg{block-size:40px;font-size:var(--ddga-font-size-base)}.ddga-date-picker-trigger--filled-lighter{background-color:var(--ddga-gray-25);border-color:#0000}.ddga-date-picker-trigger--filled-darker{background-color:var(--ddga-gray-100);border-color:#0000}.ddga-date-picker__input{font-variant-numeric:tabular-nums;direction:ltr;flex:0 auto;align-items:center;min-inline-size:0;display:inline-flex}[dir=rtl] .ddga-date-picker__input{direction:rtl}.ddga-date-picker__segment{border-radius:var(--ddga-radius-sm);color:var(--ddga-gray-700);font-variant-numeric:tabular-nums;-webkit-tap-highlight-color:transparent;outline:none;padding-block:1px;padding-inline:1px}.ddga-date-picker__segment[data-placeholder]{color:var(--ddga-gray-500)}.ddga-date-picker__segment[data-focused]{background-color:var(--ddga-color-primary);color:var(--ddga-color-primary-foreground)}.ddga-date-picker__segment[data-type=literal]{color:var(--ddga-gray-700);padding-inline:0}.ddga-date-picker__segment[data-type=literal][data-focused]{color:var(--ddga-gray-700);background-color:#0000}.ddga-date-picker__open{min-inline-size:var(--ddga-space-4);cursor:pointer;background:0 0;border:0;outline:none;flex:auto;align-self:stretch;padding:0}.ddga-date-picker-trigger[data-disabled] .ddga-date-picker__open{cursor:not-allowed}.ddga-date-picker-trigger--default[data-hovered]:not([data-focus-within]){border-color:var(--ddga-gray-700)}.ddga-date-picker-trigger[data-focus-within]{box-shadow:var(--ddga-shadow-md)}.ddga-date-picker-trigger:after{content:"";inset-inline:0;background-color:var(--ddga-gray-950);transform-origin:50%;pointer-events:none;block-size:2px;transition:transform .15s;position:absolute;bottom:-1px;transform:scaleX(0)}.ddga-date-picker-trigger[data-focus-within]:not([data-pressed]):after{transform:scaleX(1)}.ddga-date-picker-trigger[data-pressed]:not([data-disabled]):not([data-readonly]),.ddga-date-picker-trigger--pressed{background-color:var(--ddga-gray-100)}.ddga-date-picker-trigger[data-pressed]:not([data-disabled]):not([data-readonly]):after,.ddga-date-picker-trigger--pressed:after{transform:scaleX(.5)}.ddga-date-picker-trigger--error,.ddga-date-picker-trigger--error[data-hovered],.ddga-date-picker-trigger--error[data-focus-within]{border-color:var(--ddga-error-700)}.ddga-date-picker-trigger[data-readonly],.ddga-date-picker-trigger[data-disabled]{border-color:var(--ddga-gray-300);background-color:#0000}.ddga-date-picker-trigger[data-disabled]{cursor:not-allowed}.ddga-date-picker-trigger[data-disabled] .ddga-date-picker__segment,.ddga-date-picker-trigger[data-disabled] .ddga-date-picker__segment[data-placeholder],:is(.ddga-field:has(.ddga-date-picker-trigger[data-disabled]) .ddga-date-picker__label,.ddga-field:has(.ddga-date-picker-trigger[data-disabled]) .ddga-date-picker__required){color:var(--ddga-gray-400)}.ddga-field:has(.ddga-date-picker-trigger) .ddga-field__message{padding-block:var(--ddga-space-1)}[data-theme=dark] .ddga-date-picker-trigger{border-color:var(--ddga-color-input);color:var(--ddga-text-primary)}[data-theme=dark] .ddga-date-picker__segment{color:var(--ddga-text-primary)}[data-theme=dark] .ddga-date-picker__segment[data-placeholder]{color:var(--ddga-text-placeholder)}[data-theme=dark] .ddga-date-picker-trigger--filled-lighter,[data-theme=dark] .ddga-date-picker-trigger--filled-darker{background-color:var(--ddga-color-muted)}[data-theme=dark] .ddga-date-picker-trigger--default[data-hovered]:not([data-focus-within]){border-color:var(--ddga-gray-500)}[data-theme=dark] .ddga-date-picker-trigger:after{background-color:var(--ddga-text-primary)}[data-theme=dark] .ddga-date-picker-trigger[data-pressed]:not([data-disabled]):not([data-readonly]),[data-theme=dark] .ddga-date-picker-trigger--pressed{background-color:var(--ddga-color-muted)}[data-theme=dark] .ddga-date-picker-trigger[data-readonly],[data-theme=dark] .ddga-date-picker-trigger[data-disabled]{border-color:var(--ddga-color-border)}[data-theme=dark] .ddga-date-picker-trigger[data-disabled] .ddga-date-picker__segment,[data-theme=dark] .ddga-date-picker-trigger[data-disabled] .ddga-date-picker__segment[data-placeholder]{color:var(--ddga-text-tertiary)}@media (prefers-reduced-motion:reduce){.ddga-date-picker-trigger,.ddga-date-picker-trigger:after{transition:none}}@media (forced-colors:active){.ddga-date-picker-trigger{border:1px solid canvastext}.ddga-date-picker-trigger[data-focus-within]{outline-offset:1px;outline:2px solid highlight}.ddga-date-picker-trigger[data-disabled]{border-color:graytext}.ddga-date-picker-trigger[data-disabled] .ddga-date-picker__segment{color:graytext}}}
+@layer ddga-components{.ddga-field[data-slot=date-picker-field]{gap:var(--ddga-space-2)}.ddga-date-picker__label{align-items:center;gap:var(--ddga-space-1);color:var(--ddga-text-primary);font-weight:var(--ddga-font-weight-regular);font-size:var(--ddga-font-size-sm);line-height:1.4286;display:inline-flex}.ddga-date-picker__required{color:var(--ddga-error-700)}.ddga-date-picker-trigger{align-items:center;gap:var(--ddga-space-2);inline-size:100%;padding-inline:var(--ddga-space-2);border:1px solid var(--ddga-gray-400);border-radius:var(--ddga-radius-sm);background-color:var(--ddga-color-background);color:var(--ddga-gray-700);text-align:start;transition:border-color .15s,box-shadow .15s,background-color .15s;display:flex;position:relative}.ddga-date-picker-trigger--md{block-size:32px;font-size:var(--ddga-font-size-sm)}.ddga-date-picker-trigger--lg{block-size:40px;font-size:var(--ddga-font-size-base)}.ddga-date-picker-trigger--filled-lighter{background-color:var(--ddga-gray-25);border-color:#0000}.ddga-date-picker-trigger--filled-darker{background-color:var(--ddga-gray-100);border-color:#0000}.ddga-date-picker__input{font-variant-numeric:tabular-nums;direction:ltr;flex:0 auto;align-items:center;min-inline-size:0;display:inline-flex}[dir=rtl] .ddga-date-picker__input{direction:rtl}.ddga-date-picker__segment{border-radius:var(--ddga-radius-sm);color:var(--ddga-gray-700);font-variant-numeric:tabular-nums;-webkit-tap-highlight-color:transparent;outline:none;padding-block:1px;padding-inline:1px}.ddga-date-picker__segment[data-placeholder]{color:var(--ddga-gray-500)}.ddga-date-picker__segment[data-focused]{background-color:var(--ddga-color-primary);color:var(--ddga-color-primary-foreground)}.ddga-date-picker__segment[data-type=literal]{color:var(--ddga-gray-700);padding-inline:0}.ddga-date-picker__segment[data-type=literal][data-focused]{color:var(--ddga-gray-700);background-color:#0000}.ddga-date-picker__open{min-inline-size:var(--ddga-space-4);cursor:pointer;background:0 0;border:0;outline:none;flex:auto;align-self:stretch;padding:0}.ddga-date-picker-trigger[data-disabled] .ddga-date-picker__open{cursor:not-allowed}.ddga-date-picker-trigger--default[data-hovered]:not([data-focus-within]){border-color:var(--ddga-gray-700)}.ddga-date-picker-trigger[data-focus-within]{box-shadow:var(--ddga-shadow-md)}.ddga-date-picker-trigger:after{content:"";inset-inline:0;background-color:var(--ddga-gray-950);transform-origin:50%;pointer-events:none;block-size:2px;transition:transform .4s ease-out;position:absolute;bottom:-1px;transform:scaleX(0)}.ddga-date-picker-trigger[data-focus-within]:not([data-pressed]):after{transform:scaleX(1)}.ddga-date-picker-trigger[data-pressed]:not([data-disabled]):not([data-readonly]),.ddga-date-picker-trigger--pressed{background-color:var(--ddga-gray-100)}.ddga-date-picker-trigger[data-pressed]:not([data-disabled]):not([data-readonly]):after,.ddga-date-picker-trigger--pressed:after{transform:scaleX(.5)}.ddga-date-picker-trigger--error,.ddga-date-picker-trigger--error[data-hovered],.ddga-date-picker-trigger--error[data-focus-within]{border-color:var(--ddga-error-700)}.ddga-date-picker-trigger[data-readonly],.ddga-date-picker-trigger[data-disabled]{border-color:var(--ddga-gray-300);background-color:#0000}.ddga-date-picker-trigger[data-disabled]{cursor:not-allowed}.ddga-date-picker-trigger[data-disabled] .ddga-date-picker__segment,.ddga-date-picker-trigger[data-disabled] .ddga-date-picker__segment[data-placeholder],:is(.ddga-field:has(.ddga-date-picker-trigger[data-disabled]) .ddga-date-picker__label,.ddga-field:has(.ddga-date-picker-trigger[data-disabled]) .ddga-date-picker__required){color:var(--ddga-gray-400)}.ddga-field:has(.ddga-date-picker-trigger) .ddga-field__message{padding-block:var(--ddga-space-1)}[data-theme=dark] .ddga-date-picker-trigger{border-color:var(--ddga-color-input);color:var(--ddga-text-primary)}[data-theme=dark] .ddga-date-picker__segment{color:var(--ddga-text-primary)}[data-theme=dark] .ddga-date-picker__segment[data-placeholder]{color:var(--ddga-text-placeholder)}[data-theme=dark] .ddga-date-picker-trigger--filled-lighter,[data-theme=dark] .ddga-date-picker-trigger--filled-darker{background-color:var(--ddga-color-muted)}[data-theme=dark] .ddga-date-picker-trigger--default[data-hovered]:not([data-focus-within]){border-color:var(--ddga-gray-500)}[data-theme=dark] .ddga-date-picker-trigger:after{background-color:var(--ddga-text-primary)}[data-theme=dark] .ddga-date-picker-trigger[data-pressed]:not([data-disabled]):not([data-readonly]),[data-theme=dark] .ddga-date-picker-trigger--pressed{background-color:var(--ddga-color-muted)}[data-theme=dark] .ddga-date-picker-trigger[data-readonly],[data-theme=dark] .ddga-date-picker-trigger[data-disabled]{border-color:var(--ddga-color-border)}[data-theme=dark] .ddga-date-picker-trigger[data-disabled] .ddga-date-picker__segment,[data-theme=dark] .ddga-date-picker-trigger[data-disabled] .ddga-date-picker__segment[data-placeholder]{color:var(--ddga-text-tertiary)}@media (prefers-reduced-motion:reduce){.ddga-date-picker-trigger,.ddga-date-picker-trigger:after{transition:none}}@media (forced-colors:active){.ddga-date-picker-trigger{border:1px solid canvastext}.ddga-date-picker-trigger[data-focus-within]{outline-offset:1px;outline:2px solid highlight}.ddga-date-picker-trigger[data-disabled]{border-color:graytext}.ddga-date-picker-trigger[data-disabled] .ddga-date-picker__segment{color:graytext}}}
 /*# sourceMappingURL=date-picker.css.map */

package/dist/components/date-picker.css.map

@@ -1 +1 @@
-{"version":3,"mappings":"AAAA,uBAQE,iEAIA,yNASA,wDAMA,+XAmBA,iFAIA,mFAMA,kGAIA,kGAOA,8IAQA,iDAIA,sNASA,wEAGA,+HAIA,0FAIA,8GAQA,uJAUA,oFAMA,4GAMA,8EAIA,oOAYA,2FASA,2JAIA,sJAOA,uKAQA,2IAKA,4DAGA,mWAWA,kGAMA,gHAIA,4EAGA,kGAGA,gKAIA,8HAGA,4FAGA,kMAKA,4JAIA,8NASA,uCACE,2EAQF,8BACE,sDAGA,4FAIA,+DAGA","sources":["src/components/date-picker.css"],"sourcesContent":["@layer ddga-components {\n  /* DatePicker field/trigger chrome — mirrors the SDGA Text Input field model\n     (see text-input.css): the official Date field IS the Text input field (no\n     calendar icon). The calendar dropdown (popover, toggle, month grid) is\n     shared with DateRangePicker — see calendar.css. Wrapper (.ddga-field) +\n     helper/error (.ddga-field__message) are shared — see field.css. */\n\n  /* SDGA field label↔control↔helper gap is 8px (TextInput parity); .ddga-field defaults to 4px. */\n  .ddga-field[data-slot='date-picker-field'] {\n    gap: var(--ddga-space-2);\n  }\n\n  .ddga-date-picker__label {\n    display: inline-flex;\n    align-items: center;\n    gap: var(--ddga-space-1);\n    color: var(--ddga-text-primary);\n    font-weight: var(--ddga-font-weight-regular);\n    font-size: var(--ddga-font-size-sm);\n    line-height: 1.4286;\n  }\n  .ddga-date-picker__required {\n    color: var(--ddga-error-700);\n  }\n\n  /* ─── Trigger (the SDGA date field; owns border/focus/size/style/state) ─── */\n\n  .ddga-date-picker-trigger {\n    position: relative;\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-2);\n    inline-size: 100%;\n    padding-inline: var(--ddga-space-2);\n    border: 1px solid var(--ddga-gray-400);\n    border-radius: var(--ddga-radius-sm);\n    background-color: var(--ddga-color-background);\n    color: var(--ddga-gray-700);\n    text-align: start;\n    transition:\n      border-color 150ms ease,\n      box-shadow 150ms ease,\n      background-color 150ms ease;\n  }\n\n  /* SDGA Medium 32 / Large 40 (Large is the official date-field size). */\n  .ddga-date-picker-trigger--md {\n    block-size: 32px;\n    font-size: var(--ddga-font-size-sm);\n  }\n  .ddga-date-picker-trigger--lg {\n    block-size: 40px;\n    font-size: var(--ddga-font-size-base);\n  }\n\n  /* SDGA Style axis. */\n  .ddga-date-picker-trigger--filled-lighter {\n    border-color: transparent;\n    background-color: var(--ddga-gray-25);\n  }\n  .ddga-date-picker-trigger--filled-darker {\n    border-color: transparent;\n    background-color: var(--ddga-gray-100);\n  }\n\n  /* ─── DateInput + segments ─── */\n\n  .ddga-date-picker__input {\n    display: inline-flex;\n    align-items: center;\n    flex: 0 1 auto;\n    min-inline-size: 0;\n    direction: ltr;\n    font-variant-numeric: tabular-nums;\n  }\n  [dir='rtl'] .ddga-date-picker__input {\n    direction: rtl;\n  }\n\n  .ddga-date-picker__segment {\n    padding-block: 1px;\n    padding-inline: 1px;\n    border-radius: var(--ddga-radius-sm);\n    color: var(--ddga-gray-700);\n    font-variant-numeric: tabular-nums;\n    outline: none;\n    -webkit-tap-highlight-color: transparent;\n  }\n  .ddga-date-picker__segment[data-placeholder] {\n    color: var(--ddga-gray-500);\n  }\n  .ddga-date-picker__segment[data-focused] {\n    background-color: var(--ddga-color-primary);\n    color: var(--ddga-color-primary-foreground);\n  }\n  .ddga-date-picker__segment[data-type='literal'] {\n    padding-inline: 0;\n    color: var(--ddga-gray-700);\n  }\n  .ddga-date-picker__segment[data-type='literal'][data-focused] {\n    background-color: transparent;\n    color: var(--ddga-gray-700);\n  }\n\n  /* ─── Open surface (iconless): fills the field's trailing space so a click\n         anywhere but the segments opens the calendar. ─── */\n\n  .ddga-date-picker__open {\n    flex: 1 1 auto;\n    align-self: stretch;\n    min-inline-size: var(--ddga-space-4);\n    padding: 0;\n    border: 0;\n    background: transparent;\n    cursor: pointer;\n    outline: none;\n  }\n  .ddga-date-picker-trigger[data-disabled] .ddga-date-picker__open {\n    cursor: not-allowed;\n  }\n\n  /* ─── Hover (outlined style only: border darkens to gray-700) ─── */\n\n  .ddga-date-picker-trigger--default[data-hovered]:not([data-focus-within]) {\n    border-color: var(--ddga-gray-700);\n  }\n\n  /* ─── Focus (shadow-md + full-width 2px dark underline, NOT a ring) ─── */\n\n  .ddga-date-picker-trigger[data-focus-within] {\n    box-shadow: var(--ddga-shadow-md);\n  }\n  /* Underline bar — hidden by default; states scale it in from center so pressed→focus tweens, no snap. */\n  .ddga-date-picker-trigger::after {\n    content: '';\n    position: absolute;\n    inset-inline: 0;\n    bottom: -1px;\n    block-size: 2px;\n    background-color: var(--ddga-gray-950);\n    transform: scaleX(0);\n    transform-origin: center;\n    transition: transform 150ms ease;\n    pointer-events: none;\n  }\n  .ddga-date-picker-trigger[data-focus-within]:not([data-pressed])::after {\n    transform: scaleX(1);\n  }\n\n  /* ─── Pressed (JS-driven [data-pressed] — `:active` is unreliable on the\n         react-aria Group; see usePressedState — plus a static --pressed hook for\n         stories): gray-100 fill + a centered ~50% underline (focus suppresses its\n         full-width underline while pressed). ─── */\n\n  .ddga-date-picker-trigger[data-pressed]:not([data-disabled]):not([data-readonly]),\n  .ddga-date-picker-trigger--pressed {\n    background-color: var(--ddga-gray-100);\n  }\n  .ddga-date-picker-trigger[data-pressed]:not([data-disabled]):not([data-readonly])::after,\n  .ddga-date-picker-trigger--pressed::after {\n    transform: scaleX(0.5);\n  }\n\n  /* ─── Error (error-700 border) ─── */\n\n  .ddga-date-picker-trigger--error,\n  .ddga-date-picker-trigger--error[data-hovered],\n  .ddga-date-picker-trigger--error[data-focus-within] {\n    border-color: var(--ddga-error-700);\n  }\n\n  /* ─── Read-only / Disabled (gray-300 border, transparent fill, no opacity) ─── */\n\n  .ddga-date-picker-trigger[data-readonly],\n  .ddga-date-picker-trigger[data-disabled] {\n    border-color: var(--ddga-gray-300);\n    background-color: transparent;\n  }\n  .ddga-date-picker-trigger[data-disabled] {\n    cursor: not-allowed;\n  }\n  .ddga-date-picker-trigger[data-disabled] .ddga-date-picker__segment,\n  .ddga-date-picker-trigger[data-disabled] .ddga-date-picker__segment[data-placeholder] {\n    color: var(--ddga-gray-400);\n  }\n  .ddga-field:has(.ddga-date-picker-trigger[data-disabled]) .ddga-date-picker__label,\n  .ddga-field:has(.ddga-date-picker-trigger[data-disabled]) .ddga-date-picker__required {\n    color: var(--ddga-gray-400);\n  }\n\n  /* ─── Helper / error line ─── */\n\n  .ddga-field:has(.ddga-date-picker-trigger) .ddga-field__message {\n    padding-block: var(--ddga-space-1);\n  }\n\n  /* ─── Dark mode (SDGA gray steps don't flip — remap to semantic tokens) ─── */\n\n  [data-theme='dark'] .ddga-date-picker-trigger {\n    border-color: var(--ddga-color-input);\n    color: var(--ddga-text-primary);\n  }\n  [data-theme='dark'] .ddga-date-picker__segment {\n    color: var(--ddga-text-primary);\n  }\n  [data-theme='dark'] .ddga-date-picker__segment[data-placeholder] {\n    color: var(--ddga-text-placeholder);\n  }\n  [data-theme='dark'] .ddga-date-picker-trigger--filled-lighter,\n  [data-theme='dark'] .ddga-date-picker-trigger--filled-darker {\n    background-color: var(--ddga-color-muted);\n  }\n  [data-theme='dark'] .ddga-date-picker-trigger--default[data-hovered]:not([data-focus-within]) {\n    border-color: var(--ddga-gray-500);\n  }\n  [data-theme='dark'] .ddga-date-picker-trigger::after {\n    background-color: var(--ddga-text-primary);\n  }\n  [data-theme='dark']\n    .ddga-date-picker-trigger[data-pressed]:not([data-disabled]):not([data-readonly]),\n  [data-theme='dark'] .ddga-date-picker-trigger--pressed {\n    background-color: var(--ddga-color-muted);\n  }\n  [data-theme='dark'] .ddga-date-picker-trigger[data-readonly],\n  [data-theme='dark'] .ddga-date-picker-trigger[data-disabled] {\n    border-color: var(--ddga-color-border);\n  }\n  [data-theme='dark'] .ddga-date-picker-trigger[data-disabled] .ddga-date-picker__segment,\n  [data-theme='dark']\n    .ddga-date-picker-trigger[data-disabled]\n    .ddga-date-picker__segment[data-placeholder] {\n    color: var(--ddga-text-tertiary);\n  }\n\n  /* ─── Reduced motion ─── */\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-date-picker-trigger,\n    .ddga-date-picker-trigger::after {\n      transition: none;\n    }\n  }\n\n  /* ─── Forced colors (the focus underline is invisible; restore an outline) ─── */\n\n  @media (forced-colors: active) {\n    .ddga-date-picker-trigger {\n      border: 1px solid CanvasText;\n    }\n    .ddga-date-picker-trigger[data-focus-within] {\n      outline: 2px solid Highlight;\n      outline-offset: 1px;\n    }\n    .ddga-date-picker-trigger[data-disabled] {\n      border-color: GrayText;\n    }\n    .ddga-date-picker-trigger[data-disabled] .ddga-date-picker__segment {\n      color: GrayText;\n    }\n  }\n}\n"],"names":[]}
+{"version":3,"mappings":"AAAA,uBAQE,iEAIA,yNASA,wDAMA,+XAmBA,iFAIA,mFAMA,kGAIA,kGAOA,8IAQA,iDAIA,sNASA,wEAGA,+HAIA,0FAIA,8GAQA,uJAUA,oFAMA,4GAMA,8EAIA,4OAYA,2FASA,2JAIA,sJAOA,uKAQA,2IAKA,4DAGA,mWAWA,kGAMA,gHAIA,4EAGA,kGAGA,gKAIA,8HAGA,4FAGA,kMAKA,4JAIA,8NASA,uCACE,2EAQF,8BACE,sDAGA,4FAIA,+DAGA","sources":["src/components/date-picker.css"],"sourcesContent":["@layer ddga-components {\n  /* DatePicker field/trigger chrome — mirrors the SDGA Text Input field model\n     (see text-input.css): the official Date field IS the Text input field (no\n     calendar icon). The calendar dropdown (popover, toggle, month grid) is\n     shared with DateRangePicker — see calendar.css. Wrapper (.ddga-field) +\n     helper/error (.ddga-field__message) are shared — see field.css. */\n\n  /* SDGA field label↔control↔helper gap is 8px (TextInput parity); .ddga-field defaults to 4px. */\n  .ddga-field[data-slot='date-picker-field'] {\n    gap: var(--ddga-space-2);\n  }\n\n  .ddga-date-picker__label {\n    display: inline-flex;\n    align-items: center;\n    gap: var(--ddga-space-1);\n    color: var(--ddga-text-primary);\n    font-weight: var(--ddga-font-weight-regular);\n    font-size: var(--ddga-font-size-sm);\n    line-height: 1.4286;\n  }\n  .ddga-date-picker__required {\n    color: var(--ddga-error-700);\n  }\n\n  /* ─── Trigger (the SDGA date field; owns border/focus/size/style/state) ─── */\n\n  .ddga-date-picker-trigger {\n    position: relative;\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-2);\n    inline-size: 100%;\n    padding-inline: var(--ddga-space-2);\n    border: 1px solid var(--ddga-gray-400);\n    border-radius: var(--ddga-radius-sm);\n    background-color: var(--ddga-color-background);\n    color: var(--ddga-gray-700);\n    text-align: start;\n    transition:\n      border-color 150ms ease,\n      box-shadow 150ms ease,\n      background-color 150ms ease;\n  }\n\n  /* SDGA Medium 32 / Large 40 (Large is the official date-field size). */\n  .ddga-date-picker-trigger--md {\n    block-size: 32px;\n    font-size: var(--ddga-font-size-sm);\n  }\n  .ddga-date-picker-trigger--lg {\n    block-size: 40px;\n    font-size: var(--ddga-font-size-base);\n  }\n\n  /* SDGA Style axis. */\n  .ddga-date-picker-trigger--filled-lighter {\n    border-color: transparent;\n    background-color: var(--ddga-gray-25);\n  }\n  .ddga-date-picker-trigger--filled-darker {\n    border-color: transparent;\n    background-color: var(--ddga-gray-100);\n  }\n\n  /* ─── DateInput + segments ─── */\n\n  .ddga-date-picker__input {\n    display: inline-flex;\n    align-items: center;\n    flex: 0 1 auto;\n    min-inline-size: 0;\n    direction: ltr;\n    font-variant-numeric: tabular-nums;\n  }\n  [dir='rtl'] .ddga-date-picker__input {\n    direction: rtl;\n  }\n\n  .ddga-date-picker__segment {\n    padding-block: 1px;\n    padding-inline: 1px;\n    border-radius: var(--ddga-radius-sm);\n    color: var(--ddga-gray-700);\n    font-variant-numeric: tabular-nums;\n    outline: none;\n    -webkit-tap-highlight-color: transparent;\n  }\n  .ddga-date-picker__segment[data-placeholder] {\n    color: var(--ddga-gray-500);\n  }\n  .ddga-date-picker__segment[data-focused] {\n    background-color: var(--ddga-color-primary);\n    color: var(--ddga-color-primary-foreground);\n  }\n  .ddga-date-picker__segment[data-type='literal'] {\n    padding-inline: 0;\n    color: var(--ddga-gray-700);\n  }\n  .ddga-date-picker__segment[data-type='literal'][data-focused] {\n    background-color: transparent;\n    color: var(--ddga-gray-700);\n  }\n\n  /* ─── Open surface (iconless): fills the field's trailing space so a click\n         anywhere but the segments opens the calendar. ─── */\n\n  .ddga-date-picker__open {\n    flex: 1 1 auto;\n    align-self: stretch;\n    min-inline-size: var(--ddga-space-4);\n    padding: 0;\n    border: 0;\n    background: transparent;\n    cursor: pointer;\n    outline: none;\n  }\n  .ddga-date-picker-trigger[data-disabled] .ddga-date-picker__open {\n    cursor: not-allowed;\n  }\n\n  /* ─── Hover (outlined style only: border darkens to gray-700) ─── */\n\n  .ddga-date-picker-trigger--default[data-hovered]:not([data-focus-within]) {\n    border-color: var(--ddga-gray-700);\n  }\n\n  /* ─── Focus (shadow-md + full-width 2px dark underline, NOT a ring) ─── */\n\n  .ddga-date-picker-trigger[data-focus-within] {\n    box-shadow: var(--ddga-shadow-md);\n  }\n  /* Underline bar — hidden by default; states scale it in from center so pressed→focus tweens, no snap. */\n  .ddga-date-picker-trigger::after {\n    content: '';\n    position: absolute;\n    inset-inline: 0;\n    bottom: -1px;\n    block-size: 2px;\n    background-color: var(--ddga-gray-950);\n    transform: scaleX(0);\n    transform-origin: center;\n    transition: transform 400ms ease-out;\n    pointer-events: none;\n  }\n  .ddga-date-picker-trigger[data-focus-within]:not([data-pressed])::after {\n    transform: scaleX(1);\n  }\n\n  /* ─── Pressed (JS-driven [data-pressed] — `:active` is unreliable on the\n         react-aria Group; see usePressedState — plus a static --pressed hook for\n         stories): gray-100 fill + a centered ~50% underline (focus suppresses its\n         full-width underline while pressed). ─── */\n\n  .ddga-date-picker-trigger[data-pressed]:not([data-disabled]):not([data-readonly]),\n  .ddga-date-picker-trigger--pressed {\n    background-color: var(--ddga-gray-100);\n  }\n  .ddga-date-picker-trigger[data-pressed]:not([data-disabled]):not([data-readonly])::after,\n  .ddga-date-picker-trigger--pressed::after {\n    transform: scaleX(0.5);\n  }\n\n  /* ─── Error (error-700 border) ─── */\n\n  .ddga-date-picker-trigger--error,\n  .ddga-date-picker-trigger--error[data-hovered],\n  .ddga-date-picker-trigger--error[data-focus-within] {\n    border-color: var(--ddga-error-700);\n  }\n\n  /* ─── Read-only / Disabled (gray-300 border, transparent fill, no opacity) ─── */\n\n  .ddga-date-picker-trigger[data-readonly],\n  .ddga-date-picker-trigger[data-disabled] {\n    border-color: var(--ddga-gray-300);\n    background-color: transparent;\n  }\n  .ddga-date-picker-trigger[data-disabled] {\n    cursor: not-allowed;\n  }\n  .ddga-date-picker-trigger[data-disabled] .ddga-date-picker__segment,\n  .ddga-date-picker-trigger[data-disabled] .ddga-date-picker__segment[data-placeholder] {\n    color: var(--ddga-gray-400);\n  }\n  .ddga-field:has(.ddga-date-picker-trigger[data-disabled]) .ddga-date-picker__label,\n  .ddga-field:has(.ddga-date-picker-trigger[data-disabled]) .ddga-date-picker__required {\n    color: var(--ddga-gray-400);\n  }\n\n  /* ─── Helper / error line ─── */\n\n  .ddga-field:has(.ddga-date-picker-trigger) .ddga-field__message {\n    padding-block: var(--ddga-space-1);\n  }\n\n  /* ─── Dark mode (SDGA gray steps don't flip — remap to semantic tokens) ─── */\n\n  [data-theme='dark'] .ddga-date-picker-trigger {\n    border-color: var(--ddga-color-input);\n    color: var(--ddga-text-primary);\n  }\n  [data-theme='dark'] .ddga-date-picker__segment {\n    color: var(--ddga-text-primary);\n  }\n  [data-theme='dark'] .ddga-date-picker__segment[data-placeholder] {\n    color: var(--ddga-text-placeholder);\n  }\n  [data-theme='dark'] .ddga-date-picker-trigger--filled-lighter,\n  [data-theme='dark'] .ddga-date-picker-trigger--filled-darker {\n    background-color: var(--ddga-color-muted);\n  }\n  [data-theme='dark'] .ddga-date-picker-trigger--default[data-hovered]:not([data-focus-within]) {\n    border-color: var(--ddga-gray-500);\n  }\n  [data-theme='dark'] .ddga-date-picker-trigger::after {\n    background-color: var(--ddga-text-primary);\n  }\n  [data-theme='dark']\n    .ddga-date-picker-trigger[data-pressed]:not([data-disabled]):not([data-readonly]),\n  [data-theme='dark'] .ddga-date-picker-trigger--pressed {\n    background-color: var(--ddga-color-muted);\n  }\n  [data-theme='dark'] .ddga-date-picker-trigger[data-readonly],\n  [data-theme='dark'] .ddga-date-picker-trigger[data-disabled] {\n    border-color: var(--ddga-color-border);\n  }\n  [data-theme='dark'] .ddga-date-picker-trigger[data-disabled] .ddga-date-picker__segment,\n  [data-theme='dark']\n    .ddga-date-picker-trigger[data-disabled]\n    .ddga-date-picker__segment[data-placeholder] {\n    color: var(--ddga-text-tertiary);\n  }\n\n  /* ─── Reduced motion ─── */\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-date-picker-trigger,\n    .ddga-date-picker-trigger::after {\n      transition: none;\n    }\n  }\n\n  /* ─── Forced colors (the focus underline is invisible; restore an outline) ─── */\n\n  @media (forced-colors: active) {\n    .ddga-date-picker-trigger {\n      border: 1px solid CanvasText;\n    }\n    .ddga-date-picker-trigger[data-focus-within] {\n      outline: 2px solid Highlight;\n      outline-offset: 1px;\n    }\n    .ddga-date-picker-trigger[data-disabled] {\n      border-color: GrayText;\n    }\n    .ddga-date-picker-trigger[data-disabled] .ddga-date-picker__segment {\n      color: GrayText;\n    }\n  }\n}\n"],"names":[]}

package/dist/components/date-range-picker.css

@@ -1,2 +1,2 @@
-@layer ddga-components{.ddga-field[data-slot=date-range-picker-field]{gap:var(--ddga-space-2)}.ddga-date-range-picker__label{align-items:center;gap:var(--ddga-space-1);color:var(--ddga-text-primary);font-weight:var(--ddga-font-weight-regular);font-size:var(--ddga-font-size-sm);line-height:1.4286;display:inline-flex}.ddga-date-range-picker__required{color:var(--ddga-error-700)}.ddga-date-range-picker-trigger{align-items:center;gap:var(--ddga-space-1);inline-size:100%;padding-inline:var(--ddga-space-2);border:1px solid var(--ddga-gray-400);border-radius:var(--ddga-radius-sm);background-color:var(--ddga-color-background);color:var(--ddga-gray-700);text-align:start;transition:border-color .15s,box-shadow .15s,background-color .15s;display:flex;position:relative}.ddga-date-range-picker-trigger--md{block-size:32px;font-size:var(--ddga-font-size-sm)}.ddga-date-range-picker-trigger--lg{block-size:40px;font-size:var(--ddga-font-size-base)}.ddga-date-range-picker-trigger--filled-lighter{background-color:var(--ddga-gray-25);border-color:#0000}.ddga-date-range-picker-trigger--filled-darker{background-color:var(--ddga-gray-100);border-color:#0000}.ddga-date-range-picker__input{font-variant-numeric:tabular-nums;direction:ltr;flex:0 auto;align-items:center;min-inline-size:0;display:inline-flex}[dir=rtl] .ddga-date-range-picker__input{direction:rtl}.ddga-date-range-picker__segment{border-radius:var(--ddga-radius-sm);color:var(--ddga-gray-700);font-variant-numeric:tabular-nums;-webkit-tap-highlight-color:transparent;outline:none;padding-block:1px;padding-inline:1px}.ddga-date-range-picker__segment[data-placeholder]{color:var(--ddga-gray-500)}.ddga-date-range-picker__segment[data-focused]{background-color:var(--ddga-color-primary);color:var(--ddga-color-primary-foreground)}.ddga-date-range-picker__segment[data-type=literal]{color:var(--ddga-gray-700);padding-inline:0}.ddga-date-range-picker__segment[data-type=literal][data-focused]{color:var(--ddga-gray-700);background-color:#0000}.ddga-date-range-picker__separator{padding-inline:var(--ddga-space-1);color:var(--ddga-gray-500);flex:none}.ddga-date-range-picker__open{min-inline-size:var(--ddga-space-4);cursor:pointer;background:0 0;border:0;outline:none;flex:auto;align-self:stretch;padding:0}.ddga-date-range-picker-trigger[data-disabled] .ddga-date-range-picker__open{cursor:not-allowed}.ddga-date-range-picker-trigger--default[data-hovered]:not([data-focus-within]){border-color:var(--ddga-gray-700)}.ddga-date-range-picker-trigger[data-focus-within]{box-shadow:var(--ddga-shadow-md)}.ddga-date-range-picker-trigger:after{content:"";inset-inline:0;background-color:var(--ddga-gray-950);transform-origin:50%;pointer-events:none;block-size:2px;transition:transform .15s;position:absolute;bottom:-1px;transform:scaleX(0)}.ddga-date-range-picker-trigger[data-focus-within]:not([data-pressed]):after{transform:scaleX(1)}.ddga-date-range-picker-trigger[data-pressed]:not([data-disabled]):not([data-readonly]),.ddga-date-range-picker-trigger--pressed{background-color:var(--ddga-gray-100)}.ddga-date-range-picker-trigger[data-pressed]:not([data-disabled]):not([data-readonly]):after,.ddga-date-range-picker-trigger--pressed:after{transform:scaleX(.5)}.ddga-date-range-picker-trigger--error,.ddga-date-range-picker-trigger--error[data-hovered],.ddga-date-range-picker-trigger--error[data-focus-within]{border-color:var(--ddga-error-700)}.ddga-date-range-picker-trigger[data-readonly],.ddga-date-range-picker-trigger[data-disabled]{border-color:var(--ddga-gray-300);background-color:#0000}.ddga-date-range-picker-trigger[data-disabled]{cursor:not-allowed}.ddga-date-range-picker-trigger[data-disabled] .ddga-date-range-picker__segment,.ddga-date-range-picker-trigger[data-disabled] .ddga-date-range-picker__segment[data-placeholder],.ddga-date-range-picker-trigger[data-disabled] .ddga-date-range-picker__separator,:is(.ddga-field:has(.ddga-date-range-picker-trigger[data-disabled]) .ddga-date-range-picker__label,.ddga-field:has(.ddga-date-range-picker-trigger[data-disabled]) .ddga-date-range-picker__required){color:var(--ddga-gray-400)}.ddga-field:has(.ddga-date-range-picker-trigger) .ddga-field__message{padding-block:var(--ddga-space-1)}.ddga-calendar--range td:has([data-selected]){background-color:var(--ddga-sa-100)}.ddga-calendar--range td:has([data-selection-start]){border-start-start-radius:var(--ddga-radius-full);border-end-start-radius:var(--ddga-radius-full)}.ddga-calendar--range td:has([data-selection-end]){border-start-end-radius:var(--ddga-radius-full);border-end-end-radius:var(--ddga-radius-full)}.ddga-calendar--range .ddga-calendar__cell[data-selected]:not([data-selection-start]):not([data-selection-end]){color:var(--ddga-color-foreground);background-color:#0000}[data-theme=dark] .ddga-date-range-picker-trigger{border-color:var(--ddga-color-input);color:var(--ddga-text-primary)}[data-theme=dark] .ddga-date-range-picker__segment{color:var(--ddga-text-primary)}[data-theme=dark] .ddga-date-range-picker__segment[data-placeholder]{color:var(--ddga-text-placeholder)}[data-theme=dark] .ddga-date-range-picker-trigger--filled-lighter,[data-theme=dark] .ddga-date-range-picker-trigger--filled-darker{background-color:var(--ddga-color-muted)}[data-theme=dark] .ddga-date-range-picker-trigger--default[data-hovered]:not([data-focus-within]){border-color:var(--ddga-gray-500)}[data-theme=dark] .ddga-date-range-picker-trigger:after{background-color:var(--ddga-text-primary)}[data-theme=dark] .ddga-date-range-picker-trigger[data-pressed]:not([data-disabled]):not([data-readonly]),[data-theme=dark] .ddga-date-range-picker-trigger--pressed{background-color:var(--ddga-color-muted)}[data-theme=dark] .ddga-date-range-picker-trigger[data-readonly],[data-theme=dark] .ddga-date-range-picker-trigger[data-disabled]{border-color:var(--ddga-color-border)}[data-theme=dark] .ddga-date-range-picker-trigger[data-disabled] .ddga-date-range-picker__segment{color:var(--ddga-text-tertiary)}@media (prefers-reduced-motion:reduce){.ddga-date-range-picker-trigger,.ddga-date-range-picker-trigger:after{transition:none}}@media (forced-colors:active){.ddga-date-range-picker-trigger{border:1px solid canvastext}.ddga-date-range-picker-trigger[data-focus-within]{outline-offset:1px;outline:2px solid highlight}.ddga-date-range-picker-trigger[data-disabled]{border-color:graytext}.ddga-calendar--range td:has([data-selected]){background-color:highlight}.ddga-calendar--range .ddga-calendar__cell[data-selected]{color:highlighttext}}}
+@layer ddga-components{.ddga-field[data-slot=date-range-picker-field]{gap:var(--ddga-space-2)}.ddga-date-range-picker__label{align-items:center;gap:var(--ddga-space-1);color:var(--ddga-text-primary);font-weight:var(--ddga-font-weight-regular);font-size:var(--ddga-font-size-sm);line-height:1.4286;display:inline-flex}.ddga-date-range-picker__required{color:var(--ddga-error-700)}.ddga-date-range-picker-trigger{align-items:center;gap:var(--ddga-space-1);inline-size:100%;padding-inline:var(--ddga-space-2);border:1px solid var(--ddga-gray-400);border-radius:var(--ddga-radius-sm);background-color:var(--ddga-color-background);color:var(--ddga-gray-700);text-align:start;transition:border-color .15s,box-shadow .15s,background-color .15s;display:flex;position:relative}.ddga-date-range-picker-trigger--md{block-size:32px;font-size:var(--ddga-font-size-sm)}.ddga-date-range-picker-trigger--lg{block-size:40px;font-size:var(--ddga-font-size-base)}.ddga-date-range-picker-trigger--filled-lighter{background-color:var(--ddga-gray-25);border-color:#0000}.ddga-date-range-picker-trigger--filled-darker{background-color:var(--ddga-gray-100);border-color:#0000}.ddga-date-range-picker__input{font-variant-numeric:tabular-nums;direction:ltr;flex:0 auto;align-items:center;min-inline-size:0;display:inline-flex}[dir=rtl] .ddga-date-range-picker__input{direction:rtl}.ddga-date-range-picker__segment{border-radius:var(--ddga-radius-sm);color:var(--ddga-gray-700);font-variant-numeric:tabular-nums;-webkit-tap-highlight-color:transparent;outline:none;padding-block:1px;padding-inline:1px}.ddga-date-range-picker__segment[data-placeholder]{color:var(--ddga-gray-500)}.ddga-date-range-picker__segment[data-focused]{background-color:var(--ddga-color-primary);color:var(--ddga-color-primary-foreground)}.ddga-date-range-picker__segment[data-type=literal]{color:var(--ddga-gray-700);padding-inline:0}.ddga-date-range-picker__segment[data-type=literal][data-focused]{color:var(--ddga-gray-700);background-color:#0000}.ddga-date-range-picker__separator{padding-inline:var(--ddga-space-1);color:var(--ddga-gray-500);flex:none}.ddga-date-range-picker__open{min-inline-size:var(--ddga-space-4);cursor:pointer;background:0 0;border:0;outline:none;flex:auto;align-self:stretch;padding:0}.ddga-date-range-picker-trigger[data-disabled] .ddga-date-range-picker__open{cursor:not-allowed}.ddga-date-range-picker-trigger--default[data-hovered]:not([data-focus-within]){border-color:var(--ddga-gray-700)}.ddga-date-range-picker-trigger[data-focus-within]{box-shadow:var(--ddga-shadow-md)}.ddga-date-range-picker-trigger:after{content:"";inset-inline:0;background-color:var(--ddga-gray-950);transform-origin:50%;pointer-events:none;block-size:2px;transition:transform .4s ease-out;position:absolute;bottom:-1px;transform:scaleX(0)}.ddga-date-range-picker-trigger[data-focus-within]:not([data-pressed]):after{transform:scaleX(1)}.ddga-date-range-picker-trigger[data-pressed]:not([data-disabled]):not([data-readonly]),.ddga-date-range-picker-trigger--pressed{background-color:var(--ddga-gray-100)}.ddga-date-range-picker-trigger[data-pressed]:not([data-disabled]):not([data-readonly]):after,.ddga-date-range-picker-trigger--pressed:after{transform:scaleX(.5)}.ddga-date-range-picker-trigger--error,.ddga-date-range-picker-trigger--error[data-hovered],.ddga-date-range-picker-trigger--error[data-focus-within]{border-color:var(--ddga-error-700)}.ddga-date-range-picker-trigger[data-readonly],.ddga-date-range-picker-trigger[data-disabled]{border-color:var(--ddga-gray-300);background-color:#0000}.ddga-date-range-picker-trigger[data-disabled]{cursor:not-allowed}.ddga-date-range-picker-trigger[data-disabled] .ddga-date-range-picker__segment,.ddga-date-range-picker-trigger[data-disabled] .ddga-date-range-picker__segment[data-placeholder],.ddga-date-range-picker-trigger[data-disabled] .ddga-date-range-picker__separator,:is(.ddga-field:has(.ddga-date-range-picker-trigger[data-disabled]) .ddga-date-range-picker__label,.ddga-field:has(.ddga-date-range-picker-trigger[data-disabled]) .ddga-date-range-picker__required){color:var(--ddga-gray-400)}.ddga-field:has(.ddga-date-range-picker-trigger) .ddga-field__message{padding-block:var(--ddga-space-1)}.ddga-calendar--range td:has([data-selected]){background-color:var(--ddga-sa-100)}.ddga-calendar--range td:has([data-selection-start]){border-start-start-radius:var(--ddga-radius-full);border-end-start-radius:var(--ddga-radius-full)}.ddga-calendar--range td:has([data-selection-end]){border-start-end-radius:var(--ddga-radius-full);border-end-end-radius:var(--ddga-radius-full)}.ddga-calendar--range .ddga-calendar__cell[data-selected]:not([data-selection-start]):not([data-selection-end]){color:var(--ddga-color-foreground);background-color:#0000}[data-theme=dark] .ddga-date-range-picker-trigger{border-color:var(--ddga-color-input);color:var(--ddga-text-primary)}[data-theme=dark] .ddga-date-range-picker__segment{color:var(--ddga-text-primary)}[data-theme=dark] .ddga-date-range-picker__segment[data-placeholder]{color:var(--ddga-text-placeholder)}[data-theme=dark] .ddga-date-range-picker-trigger--filled-lighter,[data-theme=dark] .ddga-date-range-picker-trigger--filled-darker{background-color:var(--ddga-color-muted)}[data-theme=dark] .ddga-date-range-picker-trigger--default[data-hovered]:not([data-focus-within]){border-color:var(--ddga-gray-500)}[data-theme=dark] .ddga-date-range-picker-trigger:after{background-color:var(--ddga-text-primary)}[data-theme=dark] .ddga-date-range-picker-trigger[data-pressed]:not([data-disabled]):not([data-readonly]),[data-theme=dark] .ddga-date-range-picker-trigger--pressed{background-color:var(--ddga-color-muted)}[data-theme=dark] .ddga-date-range-picker-trigger[data-readonly],[data-theme=dark] .ddga-date-range-picker-trigger[data-disabled]{border-color:var(--ddga-color-border)}[data-theme=dark] .ddga-date-range-picker-trigger[data-disabled] .ddga-date-range-picker__segment{color:var(--ddga-text-tertiary)}@media (prefers-reduced-motion:reduce){.ddga-date-range-picker-trigger,.ddga-date-range-picker-trigger:after{transition:none}}@media (forced-colors:active){.ddga-date-range-picker-trigger{border:1px solid canvastext}.ddga-date-range-picker-trigger[data-focus-within]{outline-offset:1px;outline:2px solid highlight}.ddga-date-range-picker-trigger[data-disabled]{border-color:graytext}.ddga-calendar--range td:has([data-selected]){background-color:highlight}.ddga-calendar--range .ddga-calendar__cell[data-selected]{color:highlighttext}}}
 /*# sourceMappingURL=date-range-picker.css.map */

package/dist/components/date-range-picker.css.map

@@ -1 +1 @@
-{"version":3,"mappings":"AAAA,uBAQE,uEAIA,+NASA,8DAMA,qYAkBA,uFAIA,yFAKA,wGAIA,wGAOA,oJAQA,uDAIA,4NASA,8EAGA,qIAIA,gGAIA,oHAKA,2GAQA,6JAUA,gGAMA,kHAGA,oFAIA,0OAYA,iGAGA,uKAIA,kKAOA,yLAKA,uJAKA,kEAGA,qeAUA,wGAWA,kFAGA,uJAIA,iJAKA,0KAQA,sHAIA,kFAGA,wGAGA,4KAIA,oIAIA,kGAGA,8MAKA,wKAIA,kIAQA,uCACE,uFAQF,8BACE,4DAGA,kGAIA,qEAIA,yEAGA","sources":["src/components/date-range-picker.css"],"sourcesContent":["@layer ddga-components {\n  /* DateRangePicker field/trigger chrome + range-fill cell styling. The trigger\n     mirrors the SDGA Text Input field model (see text-input.css) — no calendar\n     icon. The calendar dropdown (popover, toggle, month grid, day cells) is\n     shared with DatePicker — see calendar.css. Wrapper (.ddga-field) +\n     helper/error (.ddga-field__message) are shared — see field.css. */\n\n  /* SDGA field label↔control↔helper gap is 8px (TextInput parity); .ddga-field defaults to 4px. */\n  .ddga-field[data-slot='date-range-picker-field'] {\n    gap: var(--ddga-space-2);\n  }\n\n  .ddga-date-range-picker__label {\n    display: inline-flex;\n    align-items: center;\n    gap: var(--ddga-space-1);\n    color: var(--ddga-text-primary);\n    font-weight: var(--ddga-font-weight-regular);\n    font-size: var(--ddga-font-size-sm);\n    line-height: 1.4286;\n  }\n  .ddga-date-range-picker__required {\n    color: var(--ddga-error-700);\n  }\n\n  /* ─── Trigger (the SDGA date field, holding two inputs + a separator) ─── */\n\n  .ddga-date-range-picker-trigger {\n    position: relative;\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-1);\n    inline-size: 100%;\n    padding-inline: var(--ddga-space-2);\n    border: 1px solid var(--ddga-gray-400);\n    border-radius: var(--ddga-radius-sm);\n    background-color: var(--ddga-color-background);\n    color: var(--ddga-gray-700);\n    text-align: start;\n    transition:\n      border-color 150ms ease,\n      box-shadow 150ms ease,\n      background-color 150ms ease;\n  }\n\n  .ddga-date-range-picker-trigger--md {\n    block-size: 32px;\n    font-size: var(--ddga-font-size-sm);\n  }\n  .ddga-date-range-picker-trigger--lg {\n    block-size: 40px;\n    font-size: var(--ddga-font-size-base);\n  }\n\n  .ddga-date-range-picker-trigger--filled-lighter {\n    border-color: transparent;\n    background-color: var(--ddga-gray-25);\n  }\n  .ddga-date-range-picker-trigger--filled-darker {\n    border-color: transparent;\n    background-color: var(--ddga-gray-100);\n  }\n\n  /* ─── DateInputs + segments + separator ─── */\n\n  .ddga-date-range-picker__input {\n    display: inline-flex;\n    align-items: center;\n    flex: 0 1 auto;\n    min-inline-size: 0;\n    direction: ltr;\n    font-variant-numeric: tabular-nums;\n  }\n  [dir='rtl'] .ddga-date-range-picker__input {\n    direction: rtl;\n  }\n\n  .ddga-date-range-picker__segment {\n    padding-block: 1px;\n    padding-inline: 1px;\n    border-radius: var(--ddga-radius-sm);\n    color: var(--ddga-gray-700);\n    font-variant-numeric: tabular-nums;\n    outline: none;\n    -webkit-tap-highlight-color: transparent;\n  }\n  .ddga-date-range-picker__segment[data-placeholder] {\n    color: var(--ddga-gray-500);\n  }\n  .ddga-date-range-picker__segment[data-focused] {\n    background-color: var(--ddga-color-primary);\n    color: var(--ddga-color-primary-foreground);\n  }\n  .ddga-date-range-picker__segment[data-type='literal'] {\n    padding-inline: 0;\n    color: var(--ddga-gray-700);\n  }\n  .ddga-date-range-picker__segment[data-type='literal'][data-focused] {\n    background-color: transparent;\n    color: var(--ddga-gray-700);\n  }\n\n  .ddga-date-range-picker__separator {\n    flex: 0 0 auto;\n    padding-inline: var(--ddga-space-1);\n    color: var(--ddga-gray-500);\n  }\n\n  /* ─── Open surface (iconless): fills trailing space; click opens the calendar ─── */\n\n  .ddga-date-range-picker__open {\n    flex: 1 1 auto;\n    align-self: stretch;\n    min-inline-size: var(--ddga-space-4);\n    padding: 0;\n    border: 0;\n    background: transparent;\n    cursor: pointer;\n    outline: none;\n  }\n  .ddga-date-range-picker-trigger[data-disabled] .ddga-date-range-picker__open {\n    cursor: not-allowed;\n  }\n\n  /* ─── Hover / Focus / Pressed (SDGA field state model) ─── */\n\n  .ddga-date-range-picker-trigger--default[data-hovered]:not([data-focus-within]) {\n    border-color: var(--ddga-gray-700);\n  }\n  .ddga-date-range-picker-trigger[data-focus-within] {\n    box-shadow: var(--ddga-shadow-md);\n  }\n  /* Underline bar — hidden by default; states scale it in from center so pressed→focus tweens, no snap. */\n  .ddga-date-range-picker-trigger::after {\n    content: '';\n    position: absolute;\n    inset-inline: 0;\n    bottom: -1px;\n    block-size: 2px;\n    background-color: var(--ddga-gray-950);\n    transform: scaleX(0);\n    transform-origin: center;\n    transition: transform 150ms ease;\n    pointer-events: none;\n  }\n  .ddga-date-range-picker-trigger[data-focus-within]:not([data-pressed])::after {\n    transform: scaleX(1);\n  }\n  .ddga-date-range-picker-trigger[data-pressed]:not([data-disabled]):not([data-readonly]),\n  .ddga-date-range-picker-trigger--pressed {\n    background-color: var(--ddga-gray-100);\n  }\n  .ddga-date-range-picker-trigger[data-pressed]:not([data-disabled]):not([data-readonly])::after,\n  .ddga-date-range-picker-trigger--pressed::after {\n    transform: scaleX(0.5);\n  }\n\n  /* ─── Error / Read-only / Disabled ─── */\n\n  .ddga-date-range-picker-trigger--error,\n  .ddga-date-range-picker-trigger--error[data-hovered],\n  .ddga-date-range-picker-trigger--error[data-focus-within] {\n    border-color: var(--ddga-error-700);\n  }\n  .ddga-date-range-picker-trigger[data-readonly],\n  .ddga-date-range-picker-trigger[data-disabled] {\n    border-color: var(--ddga-gray-300);\n    background-color: transparent;\n  }\n  .ddga-date-range-picker-trigger[data-disabled] {\n    cursor: not-allowed;\n  }\n  .ddga-date-range-picker-trigger[data-disabled] .ddga-date-range-picker__segment,\n  .ddga-date-range-picker-trigger[data-disabled] .ddga-date-range-picker__segment[data-placeholder],\n  .ddga-date-range-picker-trigger[data-disabled] .ddga-date-range-picker__separator {\n    color: var(--ddga-gray-400);\n  }\n  .ddga-field:has(.ddga-date-range-picker-trigger[data-disabled]) .ddga-date-range-picker__label,\n  .ddga-field:has(.ddga-date-range-picker-trigger[data-disabled])\n    .ddga-date-range-picker__required {\n    color: var(--ddga-gray-400);\n  }\n  .ddga-field:has(.ddga-date-range-picker-trigger) .ddga-field__message {\n    padding-block: var(--ddga-space-1);\n  }\n\n  /* ─── Range fill (scoped to RangeCalendar via .ddga-calendar--range) ─── */\n\n  /* react-aria emits data-selected on EVERY in-range cell, plus\n     data-selection-start / data-selection-end on the two endpoints. SDGA range =\n     a continuous SA-100 band on the td (spans the full column), pill-rounded at\n     the endpoints, with the SA-600 endpoint circles painted on top by the base\n     .ddga-calendar__cell[data-selected] rule. */\n  .ddga-calendar--range td:has([data-selected]) {\n    background-color: var(--ddga-sa-100);\n  }\n  .ddga-calendar--range td:has([data-selection-start]) {\n    border-start-start-radius: var(--ddga-radius-full);\n    border-end-start-radius: var(--ddga-radius-full);\n  }\n  .ddga-calendar--range td:has([data-selection-end]) {\n    border-start-end-radius: var(--ddga-radius-full);\n    border-end-end-radius: var(--ddga-radius-full);\n  }\n  /* In-between days: let the td band show through; keep text legible. */\n  .ddga-calendar--range\n    .ddga-calendar__cell[data-selected]:not([data-selection-start]):not([data-selection-end]) {\n    background-color: transparent;\n    color: var(--ddga-color-foreground);\n  }\n\n  /* ─── Dark mode (SDGA gray steps don't flip — remap to semantic tokens) ─── */\n\n  [data-theme='dark'] .ddga-date-range-picker-trigger {\n    border-color: var(--ddga-color-input);\n    color: var(--ddga-text-primary);\n  }\n  [data-theme='dark'] .ddga-date-range-picker__segment {\n    color: var(--ddga-text-primary);\n  }\n  [data-theme='dark'] .ddga-date-range-picker__segment[data-placeholder] {\n    color: var(--ddga-text-placeholder);\n  }\n  [data-theme='dark'] .ddga-date-range-picker-trigger--filled-lighter,\n  [data-theme='dark'] .ddga-date-range-picker-trigger--filled-darker {\n    background-color: var(--ddga-color-muted);\n  }\n  [data-theme='dark']\n    .ddga-date-range-picker-trigger--default[data-hovered]:not([data-focus-within]) {\n    border-color: var(--ddga-gray-500);\n  }\n  [data-theme='dark'] .ddga-date-range-picker-trigger::after {\n    background-color: var(--ddga-text-primary);\n  }\n  [data-theme='dark']\n    .ddga-date-range-picker-trigger[data-pressed]:not([data-disabled]):not([data-readonly]),\n  [data-theme='dark'] .ddga-date-range-picker-trigger--pressed {\n    background-color: var(--ddga-color-muted);\n  }\n  [data-theme='dark'] .ddga-date-range-picker-trigger[data-readonly],\n  [data-theme='dark'] .ddga-date-range-picker-trigger[data-disabled] {\n    border-color: var(--ddga-color-border);\n  }\n  [data-theme='dark']\n    .ddga-date-range-picker-trigger[data-disabled]\n    .ddga-date-range-picker__segment {\n    color: var(--ddga-text-tertiary);\n  }\n\n  /* ─── Reduced motion ─── */\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-date-range-picker-trigger,\n    .ddga-date-range-picker-trigger::after {\n      transition: none;\n    }\n  }\n\n  /* ─── Forced colors (Windows High Contrast) ─── */\n\n  @media (forced-colors: active) {\n    .ddga-date-range-picker-trigger {\n      border: 1px solid CanvasText;\n    }\n    .ddga-date-range-picker-trigger[data-focus-within] {\n      outline: 2px solid Highlight;\n      outline-offset: 1px;\n    }\n    .ddga-date-range-picker-trigger[data-disabled] {\n      border-color: GrayText;\n    }\n    /* color bands disappear in forced-colors — restore a visible range. */\n    .ddga-calendar--range td:has([data-selected]) {\n      background-color: Highlight;\n    }\n    .ddga-calendar--range .ddga-calendar__cell[data-selected] {\n      color: HighlightText;\n    }\n  }\n}\n"],"names":[]}
+{"version":3,"mappings":"AAAA,uBAQE,uEAIA,+NASA,8DAMA,qYAkBA,uFAIA,yFAKA,wGAIA,wGAOA,oJAQA,uDAIA,4NASA,8EAGA,qIAIA,gGAIA,oHAKA,2GAQA,6JAUA,gGAMA,kHAGA,oFAIA,kPAYA,iGAGA,uKAIA,kKAOA,yLAKA,uJAKA,kEAGA,qeAUA,wGAWA,kFAGA,uJAIA,iJAKA,0KAQA,sHAIA,kFAGA,wGAGA,4KAIA,oIAIA,kGAGA,8MAKA,wKAIA,kIAQA,uCACE,uFAQF,8BACE,4DAGA,kGAIA,qEAIA,yEAGA","sources":["src/components/date-range-picker.css"],"sourcesContent":["@layer ddga-components {\n  /* DateRangePicker field/trigger chrome + range-fill cell styling. The trigger\n     mirrors the SDGA Text Input field model (see text-input.css) — no calendar\n     icon. The calendar dropdown (popover, toggle, month grid, day cells) is\n     shared with DatePicker — see calendar.css. Wrapper (.ddga-field) +\n     helper/error (.ddga-field__message) are shared — see field.css. */\n\n  /* SDGA field label↔control↔helper gap is 8px (TextInput parity); .ddga-field defaults to 4px. */\n  .ddga-field[data-slot='date-range-picker-field'] {\n    gap: var(--ddga-space-2);\n  }\n\n  .ddga-date-range-picker__label {\n    display: inline-flex;\n    align-items: center;\n    gap: var(--ddga-space-1);\n    color: var(--ddga-text-primary);\n    font-weight: var(--ddga-font-weight-regular);\n    font-size: var(--ddga-font-size-sm);\n    line-height: 1.4286;\n  }\n  .ddga-date-range-picker__required {\n    color: var(--ddga-error-700);\n  }\n\n  /* ─── Trigger (the SDGA date field, holding two inputs + a separator) ─── */\n\n  .ddga-date-range-picker-trigger {\n    position: relative;\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-1);\n    inline-size: 100%;\n    padding-inline: var(--ddga-space-2);\n    border: 1px solid var(--ddga-gray-400);\n    border-radius: var(--ddga-radius-sm);\n    background-color: var(--ddga-color-background);\n    color: var(--ddga-gray-700);\n    text-align: start;\n    transition:\n      border-color 150ms ease,\n      box-shadow 150ms ease,\n      background-color 150ms ease;\n  }\n\n  .ddga-date-range-picker-trigger--md {\n    block-size: 32px;\n    font-size: var(--ddga-font-size-sm);\n  }\n  .ddga-date-range-picker-trigger--lg {\n    block-size: 40px;\n    font-size: var(--ddga-font-size-base);\n  }\n\n  .ddga-date-range-picker-trigger--filled-lighter {\n    border-color: transparent;\n    background-color: var(--ddga-gray-25);\n  }\n  .ddga-date-range-picker-trigger--filled-darker {\n    border-color: transparent;\n    background-color: var(--ddga-gray-100);\n  }\n\n  /* ─── DateInputs + segments + separator ─── */\n\n  .ddga-date-range-picker__input {\n    display: inline-flex;\n    align-items: center;\n    flex: 0 1 auto;\n    min-inline-size: 0;\n    direction: ltr;\n    font-variant-numeric: tabular-nums;\n  }\n  [dir='rtl'] .ddga-date-range-picker__input {\n    direction: rtl;\n  }\n\n  .ddga-date-range-picker__segment {\n    padding-block: 1px;\n    padding-inline: 1px;\n    border-radius: var(--ddga-radius-sm);\n    color: var(--ddga-gray-700);\n    font-variant-numeric: tabular-nums;\n    outline: none;\n    -webkit-tap-highlight-color: transparent;\n  }\n  .ddga-date-range-picker__segment[data-placeholder] {\n    color: var(--ddga-gray-500);\n  }\n  .ddga-date-range-picker__segment[data-focused] {\n    background-color: var(--ddga-color-primary);\n    color: var(--ddga-color-primary-foreground);\n  }\n  .ddga-date-range-picker__segment[data-type='literal'] {\n    padding-inline: 0;\n    color: var(--ddga-gray-700);\n  }\n  .ddga-date-range-picker__segment[data-type='literal'][data-focused] {\n    background-color: transparent;\n    color: var(--ddga-gray-700);\n  }\n\n  .ddga-date-range-picker__separator {\n    flex: 0 0 auto;\n    padding-inline: var(--ddga-space-1);\n    color: var(--ddga-gray-500);\n  }\n\n  /* ─── Open surface (iconless): fills trailing space; click opens the calendar ─── */\n\n  .ddga-date-range-picker__open {\n    flex: 1 1 auto;\n    align-self: stretch;\n    min-inline-size: var(--ddga-space-4);\n    padding: 0;\n    border: 0;\n    background: transparent;\n    cursor: pointer;\n    outline: none;\n  }\n  .ddga-date-range-picker-trigger[data-disabled] .ddga-date-range-picker__open {\n    cursor: not-allowed;\n  }\n\n  /* ─── Hover / Focus / Pressed (SDGA field state model) ─── */\n\n  .ddga-date-range-picker-trigger--default[data-hovered]:not([data-focus-within]) {\n    border-color: var(--ddga-gray-700);\n  }\n  .ddga-date-range-picker-trigger[data-focus-within] {\n    box-shadow: var(--ddga-shadow-md);\n  }\n  /* Underline bar — hidden by default; states scale it in from center so pressed→focus tweens, no snap. */\n  .ddga-date-range-picker-trigger::after {\n    content: '';\n    position: absolute;\n    inset-inline: 0;\n    bottom: -1px;\n    block-size: 2px;\n    background-color: var(--ddga-gray-950);\n    transform: scaleX(0);\n    transform-origin: center;\n    transition: transform 400ms ease-out;\n    pointer-events: none;\n  }\n  .ddga-date-range-picker-trigger[data-focus-within]:not([data-pressed])::after {\n    transform: scaleX(1);\n  }\n  .ddga-date-range-picker-trigger[data-pressed]:not([data-disabled]):not([data-readonly]),\n  .ddga-date-range-picker-trigger--pressed {\n    background-color: var(--ddga-gray-100);\n  }\n  .ddga-date-range-picker-trigger[data-pressed]:not([data-disabled]):not([data-readonly])::after,\n  .ddga-date-range-picker-trigger--pressed::after {\n    transform: scaleX(0.5);\n  }\n\n  /* ─── Error / Read-only / Disabled ─── */\n\n  .ddga-date-range-picker-trigger--error,\n  .ddga-date-range-picker-trigger--error[data-hovered],\n  .ddga-date-range-picker-trigger--error[data-focus-within] {\n    border-color: var(--ddga-error-700);\n  }\n  .ddga-date-range-picker-trigger[data-readonly],\n  .ddga-date-range-picker-trigger[data-disabled] {\n    border-color: var(--ddga-gray-300);\n    background-color: transparent;\n  }\n  .ddga-date-range-picker-trigger[data-disabled] {\n    cursor: not-allowed;\n  }\n  .ddga-date-range-picker-trigger[data-disabled] .ddga-date-range-picker__segment,\n  .ddga-date-range-picker-trigger[data-disabled] .ddga-date-range-picker__segment[data-placeholder],\n  .ddga-date-range-picker-trigger[data-disabled] .ddga-date-range-picker__separator {\n    color: var(--ddga-gray-400);\n  }\n  .ddga-field:has(.ddga-date-range-picker-trigger[data-disabled]) .ddga-date-range-picker__label,\n  .ddga-field:has(.ddga-date-range-picker-trigger[data-disabled])\n    .ddga-date-range-picker__required {\n    color: var(--ddga-gray-400);\n  }\n  .ddga-field:has(.ddga-date-range-picker-trigger) .ddga-field__message {\n    padding-block: var(--ddga-space-1);\n  }\n\n  /* ─── Range fill (scoped to RangeCalendar via .ddga-calendar--range) ─── */\n\n  /* react-aria emits data-selected on EVERY in-range cell, plus\n     data-selection-start / data-selection-end on the two endpoints. SDGA range =\n     a continuous SA-100 band on the td (spans the full column), pill-rounded at\n     the endpoints, with the SA-600 endpoint circles painted on top by the base\n     .ddga-calendar__cell[data-selected] rule. */\n  .ddga-calendar--range td:has([data-selected]) {\n    background-color: var(--ddga-sa-100);\n  }\n  .ddga-calendar--range td:has([data-selection-start]) {\n    border-start-start-radius: var(--ddga-radius-full);\n    border-end-start-radius: var(--ddga-radius-full);\n  }\n  .ddga-calendar--range td:has([data-selection-end]) {\n    border-start-end-radius: var(--ddga-radius-full);\n    border-end-end-radius: var(--ddga-radius-full);\n  }\n  /* In-between days: let the td band show through; keep text legible. */\n  .ddga-calendar--range\n    .ddga-calendar__cell[data-selected]:not([data-selection-start]):not([data-selection-end]) {\n    background-color: transparent;\n    color: var(--ddga-color-foreground);\n  }\n\n  /* ─── Dark mode (SDGA gray steps don't flip — remap to semantic tokens) ─── */\n\n  [data-theme='dark'] .ddga-date-range-picker-trigger {\n    border-color: var(--ddga-color-input);\n    color: var(--ddga-text-primary);\n  }\n  [data-theme='dark'] .ddga-date-range-picker__segment {\n    color: var(--ddga-text-primary);\n  }\n  [data-theme='dark'] .ddga-date-range-picker__segment[data-placeholder] {\n    color: var(--ddga-text-placeholder);\n  }\n  [data-theme='dark'] .ddga-date-range-picker-trigger--filled-lighter,\n  [data-theme='dark'] .ddga-date-range-picker-trigger--filled-darker {\n    background-color: var(--ddga-color-muted);\n  }\n  [data-theme='dark']\n    .ddga-date-range-picker-trigger--default[data-hovered]:not([data-focus-within]) {\n    border-color: var(--ddga-gray-500);\n  }\n  [data-theme='dark'] .ddga-date-range-picker-trigger::after {\n    background-color: var(--ddga-text-primary);\n  }\n  [data-theme='dark']\n    .ddga-date-range-picker-trigger[data-pressed]:not([data-disabled]):not([data-readonly]),\n  [data-theme='dark'] .ddga-date-range-picker-trigger--pressed {\n    background-color: var(--ddga-color-muted);\n  }\n  [data-theme='dark'] .ddga-date-range-picker-trigger[data-readonly],\n  [data-theme='dark'] .ddga-date-range-picker-trigger[data-disabled] {\n    border-color: var(--ddga-color-border);\n  }\n  [data-theme='dark']\n    .ddga-date-range-picker-trigger[data-disabled]\n    .ddga-date-range-picker__segment {\n    color: var(--ddga-text-tertiary);\n  }\n\n  /* ─── Reduced motion ─── */\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-date-range-picker-trigger,\n    .ddga-date-range-picker-trigger::after {\n      transition: none;\n    }\n  }\n\n  /* ─── Forced colors (Windows High Contrast) ─── */\n\n  @media (forced-colors: active) {\n    .ddga-date-range-picker-trigger {\n      border: 1px solid CanvasText;\n    }\n    .ddga-date-range-picker-trigger[data-focus-within] {\n      outline: 2px solid Highlight;\n      outline-offset: 1px;\n    }\n    .ddga-date-range-picker-trigger[data-disabled] {\n      border-color: GrayText;\n    }\n    /* color bands disappear in forced-colors — restore a visible range. */\n    .ddga-calendar--range td:has([data-selected]) {\n      background-color: Highlight;\n    }\n    .ddga-calendar--range .ddga-calendar__cell[data-selected] {\n      color: HighlightText;\n    }\n  }\n}\n"],"names":[]}

package/dist/components/dropdown.css

@@ -1,2 +1,2 @@
-@layer ddga-components{.ddga-dropdown__label{align-items:center;gap:var(--ddga-space-1);font-size:var(--ddga-font-size-sm);font-weight:var(--ddga-font-weight-regular);color:var(--ddga-text-primary);margin-block-end:var(--ddga-space-2);display:inline-flex}.ddga-dropdown__required{color:var(--ddga-error-700)}.ddga-dropdown-trigger{align-items:center;gap:var(--ddga-space-1);inline-size:100%;padding-inline:var(--ddga-space-4);border:1px solid var(--ddga-gray-400);border-radius:var(--ddga-radius-sm);background-color:var(--ddga-color-background);color:var(--ddga-gray-700);text-align:start;cursor:pointer;font-family:inherit;transition:border-color .15s,box-shadow .15s,background-color .15s;display:flex;position:relative}.ddga-dropdown-trigger--md{block-size:32px;font-size:var(--ddga-font-size-sm)}.ddga-dropdown-trigger--lg{block-size:40px;font-size:var(--ddga-font-size-base)}.ddga-dropdown-trigger--filled-lighter{background-color:var(--ddga-gray-25);border-color:#0000}.ddga-dropdown-trigger--filled-darker{background-color:var(--ddga-gray-100);border-color:#0000}.ddga-dropdown__value{text-overflow:ellipsis;white-space:nowrap;flex:auto;min-inline-size:0;overflow:hidden}.ddga-dropdown__placeholder{color:var(--ddga-gray-500)}.ddga-dropdown__icon{block-size:20px;inline-size:20px;color:var(--ddga-text-primary);flex-shrink:0}.ddga-dropdown-trigger--default:hover:not(:focus-visible):not(:disabled){border-color:var(--ddga-gray-700)}.ddga-dropdown-trigger:focus-visible{box-shadow:var(--ddga-shadow-md);outline:none}.ddga-dropdown-trigger--default:focus-visible{border-color:var(--ddga-gray-400)}.ddga-dropdown-trigger:after{content:"";inset-inline:0;background-color:var(--ddga-gray-950);transform-origin:50%;pointer-events:none;block-size:2px;transition:transform .15s;position:absolute;bottom:-1px;transform:scaleX(0)}.ddga-dropdown-trigger:focus-visible:after{transform:scaleX(1)}.ddga-dropdown-trigger:active:not(:disabled){background-color:var(--ddga-gray-100)}.ddga-dropdown-trigger:active:not(:disabled):after{transform:scaleX(.5)}.ddga-dropdown-trigger--error,.ddga-dropdown-trigger--error:hover:not(:focus-visible),.ddga-dropdown-trigger--error:focus-visible{border-color:var(--ddga-error-700)}.ddga-dropdown-trigger[aria-readonly=true]{border-color:var(--ddga-gray-300);cursor:default;background-color:#0000}.ddga-dropdown-trigger:disabled{border-color:var(--ddga-gray-300);cursor:not-allowed;color:var(--ddga-gray-400);background-color:#0000}.ddga-dropdown-trigger:disabled .ddga-dropdown__placeholder,.ddga-dropdown-trigger:disabled .ddga-dropdown__icon,:is(.ddga-field[data-slot=dropdown-field]:has(.ddga-dropdown-trigger:disabled) .ddga-dropdown__label,.ddga-field[data-slot=dropdown-field]:has(.ddga-dropdown-trigger:disabled) .ddga-dropdown__required){color:var(--ddga-gray-400)}.ddga-dropdown-content{background-color:var(--ddga-color-background);color:var(--ddga-text-primary);border:1px solid var(--ddga-color-input);border-radius:var(--ddga-radius-md);box-shadow:var(--ddga-shadow-2xl);z-index:50;min-inline-size:200px;overflow:hidden}.ddga-dropdown-content[data-state=open]{animation:.12s cubic-bezier(.16,1,.3,1) ddga-dropdown-in}.ddga-dropdown-content[data-state=closed]{animation:80ms ease-in ddga-dropdown-out}@keyframes ddga-dropdown-in{0%{opacity:0;transform:translateY(-2px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes ddga-dropdown-out{0%{opacity:1}to{opacity:0}}.ddga-dropdown-command{flex-direction:column;max-block-size:min(340px,60vh);display:flex}.ddga-dropdown-input{inline-size:100%;padding-block:var(--ddga-space-2);padding-inline:var(--ddga-space-3);border:0;border-block-end:1px solid var(--ddga-color-input);color:inherit;font:inherit;background-color:#0000;outline:none}.ddga-dropdown-input::placeholder{color:var(--ddga-gray-500)}.ddga-dropdown-input--hidden{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;block-size:1px;inline-size:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.ddga-dropdown-list{min-block-size:0;padding:var(--ddga-space-1);flex:auto;overflow-y:auto}.ddga-dropdown-empty{padding-block:var(--ddga-space-3);padding-inline:var(--ddga-space-3);font-size:var(--ddga-font-size-sm);color:var(--ddga-text-tertiary);text-align:center}.ddga-dropdown-item{align-items:center;gap:var(--ddga-space-2);padding:var(--ddga-space-2);border-radius:var(--ddga-radius-sm);font-size:var(--ddga-font-size-sm);color:var(--ddga-text-primary);cursor:default;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;outline:none;line-height:1.4286;display:flex}.ddga-dropdown-item[data-selected=true]{background-color:var(--ddga-gray-100)}.ddga-dropdown-item:active{background-color:var(--ddga-gray-200)}.ddga-dropdown-item[data-disabled=true]{color:var(--ddga-gray-400);pointer-events:none}.ddga-dropdown-item__label{text-overflow:ellipsis;white-space:nowrap;flex:auto;min-inline-size:0;overflow:hidden}.ddga-dropdown-item__check{block-size:20px;inline-size:20px;color:var(--ddga-text-primary);flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.ddga-dropdown-item__check>svg{block-size:100%;inline-size:100%}.ddga-dropdown-item__checkbox{border:1px solid var(--ddga-gray-500);border-radius:var(--ddga-radius-xs);color:#fff;flex-shrink:0;justify-content:center;align-items:center;block-size:16px;inline-size:16px;display:inline-flex}.ddga-dropdown-item__checkbox[data-checked]{background-color:var(--ddga-gray-950);border-color:var(--ddga-gray-950)}.ddga-dropdown-item__checkbox>svg{block-size:12px;inline-size:12px}.ddga-dropdown-group [cmdk-group-heading]{padding-block-start:var(--ddga-space-2);padding-block-end:var(--ddga-space-1);padding-inline:var(--ddga-space-2);font-size:var(--ddga-font-size-sm);font-weight:var(--ddga-font-weight-semibold);color:var(--ddga-gray-700)}.ddga-dropdown-separator{block-size:1px;margin-block:var(--ddga-space-1);margin-inline:calc(var(--ddga-space-1) * -1);background-color:var(--ddga-color-input)}[data-theme=dark] .ddga-dropdown-trigger{border-color:var(--ddga-color-input);color:var(--ddga-text-primary)}[data-theme=dark] .ddga-dropdown__placeholder,[data-theme=dark] .ddga-dropdown-input::placeholder{color:var(--ddga-text-placeholder)}[data-theme=dark] .ddga-dropdown-trigger--filled-lighter,[data-theme=dark] .ddga-dropdown-trigger--filled-darker{background-color:var(--ddga-color-muted)}[data-theme=dark] .ddga-dropdown-trigger--default:hover:not(:focus-visible):not(:disabled){border-color:var(--ddga-gray-500)}[data-theme=dark] .ddga-dropdown-trigger:after{background-color:var(--ddga-text-primary)}[data-theme=dark] .ddga-dropdown-trigger:active:not(:disabled){background-color:var(--ddga-color-muted)}[data-theme=dark] .ddga-dropdown-trigger[aria-readonly=true],[data-theme=dark] .ddga-dropdown-trigger:disabled{border-color:var(--ddga-color-border)}[data-theme=dark] .ddga-dropdown-item[data-selected=true]{background-color:var(--ddga-color-muted)}[data-theme=dark] .ddga-dropdown-item:active{background-color:var(--ddga-color-border)}[data-theme=dark] .ddga-dropdown-item__checkbox[data-checked]{background-color:var(--ddga-text-primary);border-color:var(--ddga-text-primary);color:var(--ddga-color-background)}[data-theme=dark] .ddga-dropdown-group [cmdk-group-heading]{color:var(--ddga-text-secondary)}@media (prefers-reduced-motion:reduce){.ddga-dropdown-trigger:after{transition:none}.ddga-dropdown-content[data-state=open],.ddga-dropdown-content[data-state=closed]{animation:none}}@media (forced-colors:active){.ddga-dropdown-trigger,.ddga-dropdown-content{border:1px solid canvastext}.ddga-dropdown-trigger:focus-visible{outline-offset:1px;outline:2px solid highlight}.ddga-dropdown-item[data-selected=true]{color:highlighttext;background-color:highlight}.ddga-dropdown-item__checkbox[data-checked]{background-color:highlight}}}
+@layer ddga-components{.ddga-dropdown__label{align-items:center;gap:var(--ddga-space-1);font-size:var(--ddga-font-size-sm);font-weight:var(--ddga-font-weight-regular);color:var(--ddga-text-primary);margin-block-end:var(--ddga-space-2);display:inline-flex}.ddga-dropdown__required{color:var(--ddga-error-700)}.ddga-dropdown-trigger{align-items:center;gap:var(--ddga-space-1);inline-size:100%;padding-inline:var(--ddga-space-4);border:1px solid var(--ddga-gray-400);border-radius:var(--ddga-radius-sm);background-color:var(--ddga-color-background);color:var(--ddga-gray-700);text-align:start;cursor:pointer;font-family:inherit;transition:border-color .15s,box-shadow .15s,background-color .15s;display:flex;position:relative}.ddga-dropdown-trigger--md{block-size:32px;font-size:var(--ddga-font-size-sm)}.ddga-dropdown-trigger--lg{block-size:40px;font-size:var(--ddga-font-size-base)}.ddga-dropdown-trigger--filled-lighter{background-color:var(--ddga-gray-25);border-color:#0000}.ddga-dropdown-trigger--filled-darker{background-color:var(--ddga-gray-100);border-color:#0000}.ddga-dropdown__value{text-overflow:ellipsis;white-space:nowrap;flex:auto;min-inline-size:0;overflow:hidden}.ddga-dropdown__placeholder{color:var(--ddga-gray-500)}.ddga-dropdown__icon{block-size:20px;inline-size:20px;color:var(--ddga-text-primary);flex-shrink:0}.ddga-dropdown-trigger--default:hover:not(:focus-visible):not(:disabled){border-color:var(--ddga-gray-700)}.ddga-dropdown-trigger:focus-visible{box-shadow:var(--ddga-shadow-md);outline:none}.ddga-dropdown-trigger--default:focus-visible{border-color:var(--ddga-gray-400)}.ddga-dropdown-trigger:after{content:"";inset-inline:0;background-color:var(--ddga-gray-950);transform-origin:50%;pointer-events:none;block-size:2px;transition:transform .4s ease-out;position:absolute;bottom:-1px;transform:scaleX(0)}.ddga-dropdown-trigger:focus-visible:after{transform:scaleX(1)}.ddga-dropdown-trigger:active:not(:disabled){background-color:var(--ddga-gray-100)}.ddga-dropdown-trigger:active:not(:disabled):after{transform:scaleX(.5)}.ddga-dropdown-trigger--error,.ddga-dropdown-trigger--error:hover:not(:focus-visible),.ddga-dropdown-trigger--error:focus-visible{border-color:var(--ddga-error-700)}.ddga-dropdown-trigger[aria-readonly=true]{border-color:var(--ddga-gray-300);cursor:default;background-color:#0000}.ddga-dropdown-trigger:disabled{border-color:var(--ddga-gray-300);cursor:not-allowed;color:var(--ddga-gray-400);background-color:#0000}.ddga-dropdown-trigger:disabled .ddga-dropdown__placeholder,.ddga-dropdown-trigger:disabled .ddga-dropdown__icon,:is(.ddga-field[data-slot=dropdown-field]:has(.ddga-dropdown-trigger:disabled) .ddga-dropdown__label,.ddga-field[data-slot=dropdown-field]:has(.ddga-dropdown-trigger:disabled) .ddga-dropdown__required){color:var(--ddga-gray-400)}.ddga-dropdown-content{background-color:var(--ddga-color-background);color:var(--ddga-text-primary);border:1px solid var(--ddga-color-input);border-radius:var(--ddga-radius-md);box-shadow:var(--ddga-shadow-2xl);z-index:50;min-inline-size:200px;overflow:hidden}.ddga-dropdown-content[data-state=open]{animation:.12s cubic-bezier(.16,1,.3,1) ddga-dropdown-in}.ddga-dropdown-content[data-state=closed]{animation:80ms ease-in ddga-dropdown-out}@keyframes ddga-dropdown-in{0%{opacity:0;transform:translateY(-2px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes ddga-dropdown-out{0%{opacity:1}to{opacity:0}}.ddga-dropdown-command{flex-direction:column;max-block-size:min(340px,60vh);display:flex}.ddga-dropdown-input{inline-size:100%;padding-block:var(--ddga-space-2);padding-inline:var(--ddga-space-3);border:0;border-block-end:1px solid var(--ddga-color-input);color:inherit;font:inherit;background-color:#0000;outline:none}.ddga-dropdown-input::placeholder{color:var(--ddga-gray-500)}.ddga-dropdown-input--hidden{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;block-size:1px;inline-size:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.ddga-dropdown-list{min-block-size:0;padding:var(--ddga-space-1);flex:auto;overflow-y:auto}.ddga-dropdown-empty{padding-block:var(--ddga-space-3);padding-inline:var(--ddga-space-3);font-size:var(--ddga-font-size-sm);color:var(--ddga-text-tertiary);text-align:center}.ddga-dropdown-item{align-items:center;gap:var(--ddga-space-2);padding:var(--ddga-space-2);border-radius:var(--ddga-radius-sm);font-size:var(--ddga-font-size-sm);color:var(--ddga-text-primary);cursor:default;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;outline:none;line-height:1.4286;display:flex}.ddga-dropdown-item[data-selected=true]{background-color:var(--ddga-gray-100)}.ddga-dropdown-item:active{background-color:var(--ddga-gray-200)}.ddga-dropdown-item[data-disabled=true]{color:var(--ddga-gray-400);pointer-events:none}.ddga-dropdown-item__label{text-overflow:ellipsis;white-space:nowrap;flex:auto;min-inline-size:0;overflow:hidden}.ddga-dropdown-item__check{block-size:20px;inline-size:20px;color:var(--ddga-text-primary);flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.ddga-dropdown-item__check>svg{block-size:100%;inline-size:100%}.ddga-dropdown-item__checkbox{border:1px solid var(--ddga-gray-500);border-radius:var(--ddga-radius-xs);color:#fff;flex-shrink:0;justify-content:center;align-items:center;block-size:16px;inline-size:16px;display:inline-flex}.ddga-dropdown-item__checkbox[data-checked]{background-color:var(--ddga-gray-950);border-color:var(--ddga-gray-950)}.ddga-dropdown-item__checkbox>svg{block-size:12px;inline-size:12px}.ddga-dropdown-group [cmdk-group-heading]{padding-block-start:var(--ddga-space-2);padding-block-end:var(--ddga-space-1);padding-inline:var(--ddga-space-2);font-size:var(--ddga-font-size-sm);font-weight:var(--ddga-font-weight-semibold);color:var(--ddga-gray-700)}.ddga-dropdown-separator{block-size:1px;margin-block:var(--ddga-space-1);margin-inline:calc(var(--ddga-space-1) * -1);background-color:var(--ddga-color-input)}[data-theme=dark] .ddga-dropdown-trigger{border-color:var(--ddga-color-input);color:var(--ddga-text-primary)}[data-theme=dark] .ddga-dropdown__placeholder,[data-theme=dark] .ddga-dropdown-input::placeholder{color:var(--ddga-text-placeholder)}[data-theme=dark] .ddga-dropdown-trigger--filled-lighter,[data-theme=dark] .ddga-dropdown-trigger--filled-darker{background-color:var(--ddga-color-muted)}[data-theme=dark] .ddga-dropdown-trigger--default:hover:not(:focus-visible):not(:disabled){border-color:var(--ddga-gray-500)}[data-theme=dark] .ddga-dropdown-trigger:after{background-color:var(--ddga-text-primary)}[data-theme=dark] .ddga-dropdown-trigger:active:not(:disabled){background-color:var(--ddga-color-muted)}[data-theme=dark] .ddga-dropdown-trigger[aria-readonly=true],[data-theme=dark] .ddga-dropdown-trigger:disabled{border-color:var(--ddga-color-border)}[data-theme=dark] .ddga-dropdown-item[data-selected=true]{background-color:var(--ddga-color-muted)}[data-theme=dark] .ddga-dropdown-item:active{background-color:var(--ddga-color-border)}[data-theme=dark] .ddga-dropdown-item__checkbox[data-checked]{background-color:var(--ddga-text-primary);border-color:var(--ddga-text-primary);color:var(--ddga-color-background)}[data-theme=dark] .ddga-dropdown-group [cmdk-group-heading]{color:var(--ddga-text-secondary)}@media (prefers-reduced-motion:reduce){.ddga-dropdown-trigger:after{transition:none}.ddga-dropdown-content[data-state=open],.ddga-dropdown-content[data-state=closed]{animation:none}}@media (forced-colors:active){.ddga-dropdown-trigger,.ddga-dropdown-content{border:1px solid canvastext}.ddga-dropdown-trigger:focus-visible{outline-offset:1px;outline:2px solid highlight}.ddga-dropdown-item[data-selected=true]{color:highlighttext;background-color:highlight}.ddga-dropdown-item__checkbox[data-checked]{background-color:highlight}}}
 /*# sourceMappingURL=dropdown.css.map */

package/dist/components/dropdown.css.map

@@ -1 +1 @@
-{"version":3,"mappings":"AAAA,uBAGE,wOASA,qDAOA,+ZAoBA,8EAIA,gFAKA,+FAIA,+FAKA,4GAOA,uDAKA,mGAQA,2GAKA,mFAIA,gFAIA,iOAYA,+DAKA,mFAGA,wEAKA,qKAOA,mHAOA,uIAMA,sVAaA,oQAUA,iGAGA,mFAGA,4HAUA,wDASA,yFAMA,sOAWA,6DAIA,sKAYA,2FAMA,+KAUA,+UAeA,8EAGA,iEAGA,uFAKA,iHASA,uKASA,gEAMA,gOAWA,oHAIA,mEAOA,sQAQA,+JAWA,6GAIA,qIAIA,0JAIA,6HAGA,yFAGA,wGAGA,qJAIA,mGAGA,uFAGA,iLAKA,6FAMA,uCACE,6CAGA,kGAKF,8BACE,0EAIA,oFAIA,uFAIA","sources":["src/components/dropdown.css"],"sourcesContent":["@layer ddga-components {\n  /* ─── Label (SDGA: Text sm Regular, ink #161616, leading required *) ─── */\n\n  .ddga-dropdown__label {\n    display: inline-flex;\n    align-items: center;\n    gap: var(--ddga-space-1);\n    font-size: var(--ddga-font-size-sm);\n    font-weight: var(--ddga-font-weight-regular);\n    color: var(--ddga-text-primary);\n    margin-block-end: var(--ddga-space-2);\n  }\n  .ddga-dropdown__required {\n    color: var(--ddga-error-700);\n  }\n\n  /* ─── Trigger (the field; SDGA Dropdown Input = the Text Input field + a\n         trailing chevron). Sizes md 32 / lg 40, fill styles, gray-400 border. ─── */\n\n  .ddga-dropdown-trigger {\n    position: relative;\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-1);\n    inline-size: 100%;\n    padding-inline: var(--ddga-space-4);\n    border: 1px solid var(--ddga-gray-400);\n    border-radius: var(--ddga-radius-sm);\n    background-color: var(--ddga-color-background);\n    color: var(--ddga-gray-700);\n    font-family: inherit;\n    text-align: start;\n    cursor: pointer;\n    transition:\n      border-color 150ms ease,\n      box-shadow 150ms ease,\n      background-color 150ms ease;\n  }\n\n  .ddga-dropdown-trigger--md {\n    block-size: 32px;\n    font-size: var(--ddga-font-size-sm);\n  }\n  .ddga-dropdown-trigger--lg {\n    block-size: 40px;\n    font-size: var(--ddga-font-size-base);\n  }\n\n  .ddga-dropdown-trigger--filled-lighter {\n    border-color: transparent;\n    background-color: var(--ddga-gray-25);\n  }\n  .ddga-dropdown-trigger--filled-darker {\n    border-color: transparent;\n    background-color: var(--ddga-gray-100);\n  }\n\n  .ddga-dropdown__value {\n    flex: 1 1 auto;\n    min-inline-size: 0;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n  .ddga-dropdown__placeholder {\n    color: var(--ddga-gray-500);\n  }\n\n  /* SDGA chevron = arrow-down-01, ink #161616, 20px. */\n  .ddga-dropdown__icon {\n    flex-shrink: 0;\n    inline-size: 20px;\n    block-size: 20px;\n    color: var(--ddga-text-primary);\n  }\n\n  /* Hover (outlined only): border → gray-700. */\n  .ddga-dropdown-trigger--default:hover:not(:focus-visible):not(:disabled) {\n    border-color: var(--ddga-gray-700);\n  }\n\n  /* Focus: shadow-md + full-width 2px dark underline, NO ring. */\n  .ddga-dropdown-trigger:focus-visible {\n    outline: none;\n    box-shadow: var(--ddga-shadow-md);\n  }\n  .ddga-dropdown-trigger--default:focus-visible {\n    border-color: var(--ddga-gray-400);\n  }\n  /* Underline bar — hidden by default; states scale it in from center so pressed→focus tweens, no snap. */\n  .ddga-dropdown-trigger::after {\n    content: '';\n    position: absolute;\n    inset-inline: 0;\n    bottom: -1px;\n    block-size: 2px;\n    background-color: var(--ddga-gray-950);\n    transform: scaleX(0);\n    transform-origin: center;\n    transition: transform 150ms ease;\n    pointer-events: none;\n  }\n  .ddga-dropdown-trigger:focus-visible::after {\n    transform: scaleX(1);\n  }\n\n  /* Pressed: gray-100 fill + short centered underline. */\n  .ddga-dropdown-trigger:active:not(:disabled) {\n    background-color: var(--ddga-gray-100);\n  }\n  .ddga-dropdown-trigger:active:not(:disabled)::after {\n    transform: scaleX(0.5);\n  }\n\n  /* Error: error-700 border. */\n  .ddga-dropdown-trigger--error,\n  .ddga-dropdown-trigger--error:hover:not(:focus-visible),\n  .ddga-dropdown-trigger--error:focus-visible {\n    border-color: var(--ddga-error-700);\n  }\n\n  /* Read-only: gray-300 border, transparent fill. */\n  .ddga-dropdown-trigger[aria-readonly='true'] {\n    border-color: var(--ddga-gray-300);\n    background-color: transparent;\n    cursor: default;\n  }\n\n  /* Disabled: gray-300 border, transparent, gray-400 text — no opacity. */\n  .ddga-dropdown-trigger:disabled {\n    border-color: var(--ddga-gray-300);\n    background-color: transparent;\n    cursor: not-allowed;\n    color: var(--ddga-gray-400);\n  }\n  .ddga-dropdown-trigger:disabled .ddga-dropdown__placeholder,\n  .ddga-dropdown-trigger:disabled .ddga-dropdown__icon {\n    color: var(--ddga-gray-400);\n  }\n  .ddga-field[data-slot='dropdown-field']:has(.ddga-dropdown-trigger:disabled)\n    .ddga-dropdown__label,\n  .ddga-field[data-slot='dropdown-field']:has(.ddga-dropdown-trigger:disabled)\n    .ddga-dropdown__required {\n    color: var(--ddga-gray-400);\n  }\n\n  /* ─── Panel ─── */\n\n  .ddga-dropdown-content {\n    background-color: var(--ddga-color-background);\n    color: var(--ddga-text-primary);\n    border: 1px solid var(--ddga-color-input);\n    border-radius: var(--ddga-radius-md);\n    box-shadow: var(--ddga-shadow-2xl); /* matches measured SDGA Menu panel */\n    overflow: hidden;\n    z-index: 50;\n    min-inline-size: 200px;\n  }\n  .ddga-dropdown-content[data-state='open'] {\n    animation: ddga-dropdown-in 120ms cubic-bezier(0.16, 1, 0.3, 1);\n  }\n  .ddga-dropdown-content[data-state='closed'] {\n    animation: ddga-dropdown-out 80ms ease-in;\n  }\n  @keyframes ddga-dropdown-in {\n    from {\n      opacity: 0;\n      transform: translateY(-2px) scale(0.98);\n    }\n    to {\n      opacity: 1;\n      transform: translateY(0) scale(1);\n    }\n  }\n  @keyframes ddga-dropdown-out {\n    from {\n      opacity: 1;\n    }\n    to {\n      opacity: 0;\n    }\n  }\n\n  .ddga-dropdown-command {\n    display: flex;\n    flex-direction: column;\n    max-block-size: min(340px, 60vh);\n  }\n\n  .ddga-dropdown-input {\n    inline-size: 100%;\n    padding-block: var(--ddga-space-2);\n    padding-inline: var(--ddga-space-3);\n    border: 0;\n    border-block-end: 1px solid var(--ddga-color-input);\n    background-color: transparent;\n    color: inherit;\n    font: inherit;\n    outline: none;\n  }\n  .ddga-dropdown-input::placeholder {\n    color: var(--ddga-gray-500);\n  }\n  /* Non-searchable mode keeps a focusable input (cmdk keyboard) but hides it. */\n  .ddga-dropdown-input--hidden {\n    position: absolute;\n    inline-size: 1px;\n    block-size: 1px;\n    padding: 0;\n    margin: -1px;\n    overflow: hidden;\n    clip: rect(0, 0, 0, 0);\n    white-space: nowrap;\n    border: 0;\n  }\n\n  .ddga-dropdown-list {\n    flex: 1 1 auto;\n    min-block-size: 0;\n    overflow-y: auto;\n    padding: var(--ddga-space-1);\n  }\n  .ddga-dropdown-empty {\n    padding-block: var(--ddga-space-3);\n    padding-inline: var(--ddga-space-3);\n    font-size: var(--ddga-font-size-sm);\n    color: var(--ddga-text-tertiary);\n    text-align: center;\n  }\n\n  /* ─── List item (SDGA Dropdown List Item: p-8, gap-8, Text sm 14/20 #161616) ─── */\n\n  .ddga-dropdown-item {\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-2);\n    padding: var(--ddga-space-2);\n    border-radius: var(--ddga-radius-sm);\n    font-size: var(--ddga-font-size-sm);\n    line-height: 1.4286;\n    color: var(--ddga-text-primary);\n    cursor: default;\n    user-select: none;\n    outline: none;\n    -webkit-tap-highlight-color: transparent;\n  }\n  /* cmdk highlight (hover + keyboard) → SDGA Hovered gray-100. */\n  .ddga-dropdown-item[data-selected='true'] {\n    background-color: var(--ddga-gray-100);\n  }\n  .ddga-dropdown-item:active {\n    background-color: var(--ddga-gray-200);\n  }\n  .ddga-dropdown-item[data-disabled='true'] {\n    color: var(--ddga-gray-400);\n    pointer-events: none;\n  }\n\n  .ddga-dropdown-item__label {\n    flex: 1 1 auto;\n    min-inline-size: 0;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n\n  /* Single-select: trailing tick-02 check (20px ink) when chosen. */\n  .ddga-dropdown-item__check {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    inline-size: 20px;\n    block-size: 20px;\n    color: var(--ddga-text-primary);\n  }\n  .ddga-dropdown-item__check > svg {\n    inline-size: 100%;\n    block-size: 100%;\n  }\n\n  /* Multi-select: leading 16px checkbox (gray-500 outline → gray-950 fill). */\n  .ddga-dropdown-item__checkbox {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    inline-size: 16px;\n    block-size: 16px;\n    border: 1px solid var(--ddga-gray-500);\n    border-radius: var(--ddga-radius-xs);\n    color: #ffffff;\n  }\n  .ddga-dropdown-item__checkbox[data-checked] {\n    background-color: var(--ddga-gray-950);\n    border-color: var(--ddga-gray-950);\n  }\n  .ddga-dropdown-item__checkbox > svg {\n    inline-size: 12px;\n    block-size: 12px;\n  }\n\n  /* ─── Group label (SDGA: Text sm Semibold, gray-700) + Separator ─── */\n\n  .ddga-dropdown-group [cmdk-group-heading] {\n    padding-block-start: var(--ddga-space-2);\n    padding-block-end: var(--ddga-space-1);\n    padding-inline: var(--ddga-space-2);\n    font-size: var(--ddga-font-size-sm);\n    font-weight: var(--ddga-font-weight-semibold);\n    color: var(--ddga-gray-700);\n  }\n  .ddga-dropdown-separator {\n    block-size: 1px;\n    margin-block: var(--ddga-space-1);\n    margin-inline: calc(var(--ddga-space-1) * -1);\n    background-color: var(--ddga-color-input);\n  }\n\n  /* ─── Dark mode ─── */\n  /* SDGA light values are fixed ramp steps; remap to flipping tokens so the\n     field + panel stay readable. text-primary/foreground already flip. */\n\n  [data-theme='dark'] .ddga-dropdown-trigger {\n    border-color: var(--ddga-color-input);\n    color: var(--ddga-text-primary);\n  }\n  [data-theme='dark'] .ddga-dropdown__placeholder,\n  [data-theme='dark'] .ddga-dropdown-input::placeholder {\n    color: var(--ddga-text-placeholder);\n  }\n  [data-theme='dark'] .ddga-dropdown-trigger--filled-lighter,\n  [data-theme='dark'] .ddga-dropdown-trigger--filled-darker {\n    background-color: var(--ddga-color-muted);\n  }\n  [data-theme='dark'] .ddga-dropdown-trigger--default:hover:not(:focus-visible):not(:disabled) {\n    border-color: var(--ddga-gray-500);\n  }\n  [data-theme='dark'] .ddga-dropdown-trigger::after {\n    background-color: var(--ddga-text-primary);\n  }\n  [data-theme='dark'] .ddga-dropdown-trigger:active:not(:disabled) {\n    background-color: var(--ddga-color-muted);\n  }\n  [data-theme='dark'] .ddga-dropdown-trigger[aria-readonly='true'],\n  [data-theme='dark'] .ddga-dropdown-trigger:disabled {\n    border-color: var(--ddga-color-border);\n  }\n  [data-theme='dark'] .ddga-dropdown-item[data-selected='true'] {\n    background-color: var(--ddga-color-muted);\n  }\n  [data-theme='dark'] .ddga-dropdown-item:active {\n    background-color: var(--ddga-color-border);\n  }\n  [data-theme='dark'] .ddga-dropdown-item__checkbox[data-checked] {\n    background-color: var(--ddga-text-primary);\n    border-color: var(--ddga-text-primary);\n    color: var(--ddga-color-background);\n  }\n  [data-theme='dark'] .ddga-dropdown-group [cmdk-group-heading] {\n    color: var(--ddga-text-secondary);\n  }\n\n  /* ─── Reduced motion + Forced colors ─── */\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-dropdown-trigger::after {\n      transition: none;\n    }\n    .ddga-dropdown-content[data-state='open'],\n    .ddga-dropdown-content[data-state='closed'] {\n      animation: none;\n    }\n  }\n  @media (forced-colors: active) {\n    .ddga-dropdown-trigger,\n    .ddga-dropdown-content {\n      border: 1px solid CanvasText;\n    }\n    .ddga-dropdown-trigger:focus-visible {\n      outline: 2px solid Highlight;\n      outline-offset: 1px;\n    }\n    .ddga-dropdown-item[data-selected='true'] {\n      background-color: Highlight;\n      color: HighlightText;\n    }\n    .ddga-dropdown-item__checkbox[data-checked] {\n      background-color: Highlight;\n    }\n  }\n}\n"],"names":[]}
+{"version":3,"mappings":"AAAA,uBAGE,wOASA,qDAOA,+ZAoBA,8EAIA,gFAKA,+FAIA,+FAKA,4GAOA,uDAKA,mGAQA,2GAKA,mFAIA,gFAIA,yOAYA,+DAKA,mFAGA,wEAKA,qKAOA,mHAOA,uIAMA,sVAaA,oQAUA,iGAGA,mFAGA,4HAUA,wDASA,yFAMA,sOAWA,6DAIA,sKAYA,2FAMA,+KAUA,+UAeA,8EAGA,iEAGA,uFAKA,iHASA,uKASA,gEAMA,gOAWA,oHAIA,mEAOA,sQAQA,+JAWA,6GAIA,qIAIA,0JAIA,6HAGA,yFAGA,wGAGA,qJAIA,mGAGA,uFAGA,iLAKA,6FAMA,uCACE,6CAGA,kGAKF,8BACE,0EAIA,oFAIA,uFAIA","sources":["src/components/dropdown.css"],"sourcesContent":["@layer ddga-components {\n  /* ─── Label (SDGA: Text sm Regular, ink #161616, leading required *) ─── */\n\n  .ddga-dropdown__label {\n    display: inline-flex;\n    align-items: center;\n    gap: var(--ddga-space-1);\n    font-size: var(--ddga-font-size-sm);\n    font-weight: var(--ddga-font-weight-regular);\n    color: var(--ddga-text-primary);\n    margin-block-end: var(--ddga-space-2);\n  }\n  .ddga-dropdown__required {\n    color: var(--ddga-error-700);\n  }\n\n  /* ─── Trigger (the field; SDGA Dropdown Input = the Text Input field + a\n         trailing chevron). Sizes md 32 / lg 40, fill styles, gray-400 border. ─── */\n\n  .ddga-dropdown-trigger {\n    position: relative;\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-1);\n    inline-size: 100%;\n    padding-inline: var(--ddga-space-4);\n    border: 1px solid var(--ddga-gray-400);\n    border-radius: var(--ddga-radius-sm);\n    background-color: var(--ddga-color-background);\n    color: var(--ddga-gray-700);\n    font-family: inherit;\n    text-align: start;\n    cursor: pointer;\n    transition:\n      border-color 150ms ease,\n      box-shadow 150ms ease,\n      background-color 150ms ease;\n  }\n\n  .ddga-dropdown-trigger--md {\n    block-size: 32px;\n    font-size: var(--ddga-font-size-sm);\n  }\n  .ddga-dropdown-trigger--lg {\n    block-size: 40px;\n    font-size: var(--ddga-font-size-base);\n  }\n\n  .ddga-dropdown-trigger--filled-lighter {\n    border-color: transparent;\n    background-color: var(--ddga-gray-25);\n  }\n  .ddga-dropdown-trigger--filled-darker {\n    border-color: transparent;\n    background-color: var(--ddga-gray-100);\n  }\n\n  .ddga-dropdown__value {\n    flex: 1 1 auto;\n    min-inline-size: 0;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n  .ddga-dropdown__placeholder {\n    color: var(--ddga-gray-500);\n  }\n\n  /* SDGA chevron = arrow-down-01, ink #161616, 20px. */\n  .ddga-dropdown__icon {\n    flex-shrink: 0;\n    inline-size: 20px;\n    block-size: 20px;\n    color: var(--ddga-text-primary);\n  }\n\n  /* Hover (outlined only): border → gray-700. */\n  .ddga-dropdown-trigger--default:hover:not(:focus-visible):not(:disabled) {\n    border-color: var(--ddga-gray-700);\n  }\n\n  /* Focus: shadow-md + full-width 2px dark underline, NO ring. */\n  .ddga-dropdown-trigger:focus-visible {\n    outline: none;\n    box-shadow: var(--ddga-shadow-md);\n  }\n  .ddga-dropdown-trigger--default:focus-visible {\n    border-color: var(--ddga-gray-400);\n  }\n  /* Underline bar — hidden by default; states scale it in from center so pressed→focus tweens, no snap. */\n  .ddga-dropdown-trigger::after {\n    content: '';\n    position: absolute;\n    inset-inline: 0;\n    bottom: -1px;\n    block-size: 2px;\n    background-color: var(--ddga-gray-950);\n    transform: scaleX(0);\n    transform-origin: center;\n    transition: transform 400ms ease-out;\n    pointer-events: none;\n  }\n  .ddga-dropdown-trigger:focus-visible::after {\n    transform: scaleX(1);\n  }\n\n  /* Pressed: gray-100 fill + short centered underline. */\n  .ddga-dropdown-trigger:active:not(:disabled) {\n    background-color: var(--ddga-gray-100);\n  }\n  .ddga-dropdown-trigger:active:not(:disabled)::after {\n    transform: scaleX(0.5);\n  }\n\n  /* Error: error-700 border. */\n  .ddga-dropdown-trigger--error,\n  .ddga-dropdown-trigger--error:hover:not(:focus-visible),\n  .ddga-dropdown-trigger--error:focus-visible {\n    border-color: var(--ddga-error-700);\n  }\n\n  /* Read-only: gray-300 border, transparent fill. */\n  .ddga-dropdown-trigger[aria-readonly='true'] {\n    border-color: var(--ddga-gray-300);\n    background-color: transparent;\n    cursor: default;\n  }\n\n  /* Disabled: gray-300 border, transparent, gray-400 text — no opacity. */\n  .ddga-dropdown-trigger:disabled {\n    border-color: var(--ddga-gray-300);\n    background-color: transparent;\n    cursor: not-allowed;\n    color: var(--ddga-gray-400);\n  }\n  .ddga-dropdown-trigger:disabled .ddga-dropdown__placeholder,\n  .ddga-dropdown-trigger:disabled .ddga-dropdown__icon {\n    color: var(--ddga-gray-400);\n  }\n  .ddga-field[data-slot='dropdown-field']:has(.ddga-dropdown-trigger:disabled)\n    .ddga-dropdown__label,\n  .ddga-field[data-slot='dropdown-field']:has(.ddga-dropdown-trigger:disabled)\n    .ddga-dropdown__required {\n    color: var(--ddga-gray-400);\n  }\n\n  /* ─── Panel ─── */\n\n  .ddga-dropdown-content {\n    background-color: var(--ddga-color-background);\n    color: var(--ddga-text-primary);\n    border: 1px solid var(--ddga-color-input);\n    border-radius: var(--ddga-radius-md);\n    box-shadow: var(--ddga-shadow-2xl); /* matches measured SDGA Menu panel */\n    overflow: hidden;\n    z-index: 50;\n    min-inline-size: 200px;\n  }\n  .ddga-dropdown-content[data-state='open'] {\n    animation: ddga-dropdown-in 120ms cubic-bezier(0.16, 1, 0.3, 1);\n  }\n  .ddga-dropdown-content[data-state='closed'] {\n    animation: ddga-dropdown-out 80ms ease-in;\n  }\n  @keyframes ddga-dropdown-in {\n    from {\n      opacity: 0;\n      transform: translateY(-2px) scale(0.98);\n    }\n    to {\n      opacity: 1;\n      transform: translateY(0) scale(1);\n    }\n  }\n  @keyframes ddga-dropdown-out {\n    from {\n      opacity: 1;\n    }\n    to {\n      opacity: 0;\n    }\n  }\n\n  .ddga-dropdown-command {\n    display: flex;\n    flex-direction: column;\n    max-block-size: min(340px, 60vh);\n  }\n\n  .ddga-dropdown-input {\n    inline-size: 100%;\n    padding-block: var(--ddga-space-2);\n    padding-inline: var(--ddga-space-3);\n    border: 0;\n    border-block-end: 1px solid var(--ddga-color-input);\n    background-color: transparent;\n    color: inherit;\n    font: inherit;\n    outline: none;\n  }\n  .ddga-dropdown-input::placeholder {\n    color: var(--ddga-gray-500);\n  }\n  /* Non-searchable mode keeps a focusable input (cmdk keyboard) but hides it. */\n  .ddga-dropdown-input--hidden {\n    position: absolute;\n    inline-size: 1px;\n    block-size: 1px;\n    padding: 0;\n    margin: -1px;\n    overflow: hidden;\n    clip: rect(0, 0, 0, 0);\n    white-space: nowrap;\n    border: 0;\n  }\n\n  .ddga-dropdown-list {\n    flex: 1 1 auto;\n    min-block-size: 0;\n    overflow-y: auto;\n    padding: var(--ddga-space-1);\n  }\n  .ddga-dropdown-empty {\n    padding-block: var(--ddga-space-3);\n    padding-inline: var(--ddga-space-3);\n    font-size: var(--ddga-font-size-sm);\n    color: var(--ddga-text-tertiary);\n    text-align: center;\n  }\n\n  /* ─── List item (SDGA Dropdown List Item: p-8, gap-8, Text sm 14/20 #161616) ─── */\n\n  .ddga-dropdown-item {\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-2);\n    padding: var(--ddga-space-2);\n    border-radius: var(--ddga-radius-sm);\n    font-size: var(--ddga-font-size-sm);\n    line-height: 1.4286;\n    color: var(--ddga-text-primary);\n    cursor: default;\n    user-select: none;\n    outline: none;\n    -webkit-tap-highlight-color: transparent;\n  }\n  /* cmdk highlight (hover + keyboard) → SDGA Hovered gray-100. */\n  .ddga-dropdown-item[data-selected='true'] {\n    background-color: var(--ddga-gray-100);\n  }\n  .ddga-dropdown-item:active {\n    background-color: var(--ddga-gray-200);\n  }\n  .ddga-dropdown-item[data-disabled='true'] {\n    color: var(--ddga-gray-400);\n    pointer-events: none;\n  }\n\n  .ddga-dropdown-item__label {\n    flex: 1 1 auto;\n    min-inline-size: 0;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n\n  /* Single-select: trailing tick-02 check (20px ink) when chosen. */\n  .ddga-dropdown-item__check {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    inline-size: 20px;\n    block-size: 20px;\n    color: var(--ddga-text-primary);\n  }\n  .ddga-dropdown-item__check > svg {\n    inline-size: 100%;\n    block-size: 100%;\n  }\n\n  /* Multi-select: leading 16px checkbox (gray-500 outline → gray-950 fill). */\n  .ddga-dropdown-item__checkbox {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    inline-size: 16px;\n    block-size: 16px;\n    border: 1px solid var(--ddga-gray-500);\n    border-radius: var(--ddga-radius-xs);\n    color: #ffffff;\n  }\n  .ddga-dropdown-item__checkbox[data-checked] {\n    background-color: var(--ddga-gray-950);\n    border-color: var(--ddga-gray-950);\n  }\n  .ddga-dropdown-item__checkbox > svg {\n    inline-size: 12px;\n    block-size: 12px;\n  }\n\n  /* ─── Group label (SDGA: Text sm Semibold, gray-700) + Separator ─── */\n\n  .ddga-dropdown-group [cmdk-group-heading] {\n    padding-block-start: var(--ddga-space-2);\n    padding-block-end: var(--ddga-space-1);\n    padding-inline: var(--ddga-space-2);\n    font-size: var(--ddga-font-size-sm);\n    font-weight: var(--ddga-font-weight-semibold);\n    color: var(--ddga-gray-700);\n  }\n  .ddga-dropdown-separator {\n    block-size: 1px;\n    margin-block: var(--ddga-space-1);\n    margin-inline: calc(var(--ddga-space-1) * -1);\n    background-color: var(--ddga-color-input);\n  }\n\n  /* ─── Dark mode ─── */\n  /* SDGA light values are fixed ramp steps; remap to flipping tokens so the\n     field + panel stay readable. text-primary/foreground already flip. */\n\n  [data-theme='dark'] .ddga-dropdown-trigger {\n    border-color: var(--ddga-color-input);\n    color: var(--ddga-text-primary);\n  }\n  [data-theme='dark'] .ddga-dropdown__placeholder,\n  [data-theme='dark'] .ddga-dropdown-input::placeholder {\n    color: var(--ddga-text-placeholder);\n  }\n  [data-theme='dark'] .ddga-dropdown-trigger--filled-lighter,\n  [data-theme='dark'] .ddga-dropdown-trigger--filled-darker {\n    background-color: var(--ddga-color-muted);\n  }\n  [data-theme='dark'] .ddga-dropdown-trigger--default:hover:not(:focus-visible):not(:disabled) {\n    border-color: var(--ddga-gray-500);\n  }\n  [data-theme='dark'] .ddga-dropdown-trigger::after {\n    background-color: var(--ddga-text-primary);\n  }\n  [data-theme='dark'] .ddga-dropdown-trigger:active:not(:disabled) {\n    background-color: var(--ddga-color-muted);\n  }\n  [data-theme='dark'] .ddga-dropdown-trigger[aria-readonly='true'],\n  [data-theme='dark'] .ddga-dropdown-trigger:disabled {\n    border-color: var(--ddga-color-border);\n  }\n  [data-theme='dark'] .ddga-dropdown-item[data-selected='true'] {\n    background-color: var(--ddga-color-muted);\n  }\n  [data-theme='dark'] .ddga-dropdown-item:active {\n    background-color: var(--ddga-color-border);\n  }\n  [data-theme='dark'] .ddga-dropdown-item__checkbox[data-checked] {\n    background-color: var(--ddga-text-primary);\n    border-color: var(--ddga-text-primary);\n    color: var(--ddga-color-background);\n  }\n  [data-theme='dark'] .ddga-dropdown-group [cmdk-group-heading] {\n    color: var(--ddga-text-secondary);\n  }\n\n  /* ─── Reduced motion + Forced colors ─── */\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-dropdown-trigger::after {\n      transition: none;\n    }\n    .ddga-dropdown-content[data-state='open'],\n    .ddga-dropdown-content[data-state='closed'] {\n      animation: none;\n    }\n  }\n  @media (forced-colors: active) {\n    .ddga-dropdown-trigger,\n    .ddga-dropdown-content {\n      border: 1px solid CanvasText;\n    }\n    .ddga-dropdown-trigger:focus-visible {\n      outline: 2px solid Highlight;\n      outline-offset: 1px;\n    }\n    .ddga-dropdown-item[data-selected='true'] {\n      background-color: Highlight;\n      color: HighlightText;\n    }\n    .ddga-dropdown-item__checkbox[data-checked] {\n      background-color: Highlight;\n    }\n  }\n}\n"],"names":[]}

package/dist/components/number-input.css

@@ -1,2 +1,2 @@
-@layer ddga-components{.ddga-field[data-slot=number-input-field]{gap:var(--ddga-space-2)}.ddga-number-input__label{align-items:center;gap:var(--ddga-space-1);color:var(--ddga-text-primary);font-weight:var(--ddga-font-weight-regular);font-size:var(--ddga-font-size-sm);line-height:1.4286;display:inline-flex}.ddga-number-input__required{color:var(--ddga-error-700)}.ddga-number-input{border:1px solid var(--ddga-gray-400);border-radius:var(--ddga-radius-sm);background-color:var(--ddga-color-background);inline-size:100%;color:var(--ddga-gray-700);align-items:stretch;transition:border-color .15s,box-shadow .15s,background-color .15s;display:flex;position:relative}.ddga-number-input--md{block-size:32px;font-size:var(--ddga-font-size-sm)}.ddga-number-input--lg{block-size:40px;font-size:var(--ddga-font-size-base)}.ddga-number-input--filled-lighter{background-color:var(--ddga-gray-25);border-color:#0000}.ddga-number-input--filled-darker{background-color:var(--ddga-gray-100);border-color:#0000}.ddga-number-input__field{block-size:100%;min-inline-size:0;padding-inline:var(--ddga-space-2);color:inherit;font:inherit;text-align:start;caret-color:var(--ddga-gray-950);direction:ltr;unicode-bidi:plaintext;background:0 0;border:0;outline:none;flex:auto;padding-block:0}.ddga-number-input__field::placeholder{color:var(--ddga-gray-500)}.ddga-number-input__field:-webkit-autofill{-webkit-text-fill-color:var(--ddga-gray-700);-webkit-box-shadow:0 0 0 100vmax var(--ddga-color-background) inset;box-shadow:0 0 0 100vmax var(--ddga-color-background) inset;caret-color:var(--ddga-gray-950)}.ddga-number-input__field:-webkit-autofill:hover{-webkit-text-fill-color:var(--ddga-gray-700);-webkit-box-shadow:0 0 0 100vmax var(--ddga-color-background) inset;box-shadow:0 0 0 100vmax var(--ddga-color-background) inset;caret-color:var(--ddga-gray-950)}.ddga-number-input__field:-webkit-autofill:focus{-webkit-text-fill-color:var(--ddga-gray-700);-webkit-box-shadow:0 0 0 100vmax var(--ddga-color-background) inset;box-shadow:0 0 0 100vmax var(--ddga-color-background) inset;caret-color:var(--ddga-gray-950)}.ddga-number-input__step{padding-inline:var(--ddga-space-4);background-color:var(--ddga-gray-100);color:var(--ddga-text-primary);cursor:pointer;border:0;flex:none;justify-content:center;align-self:stretch;align-items:center;padding-block:0;transition:background-color .15s;display:inline-flex}.ddga-number-input--md .ddga-number-input__step{padding-inline:var(--ddga-space-3)}.ddga-number-input__step svg{block-size:24px;inline-size:24px}.ddga-number-input--md .ddga-number-input__step svg{block-size:20px;inline-size:20px}.ddga-number-input__step--increment{border-start-start-radius:var(--ddga-radius-sm);border-end-start-radius:var(--ddga-radius-sm)}.ddga-number-input__step--decrement{border-start-end-radius:var(--ddga-radius-sm);border-end-end-radius:var(--ddga-radius-sm)}.ddga-number-input__step:hover:not(:disabled){background-color:var(--ddga-gray-200)}.ddga-number-input__step:active:not(:disabled){background-color:var(--ddga-gray-300)}.ddga-number-input__step:focus-visible{box-shadow:inset 0 0 0 2px var(--ddga-text-primary);outline:none}.ddga-number-input__step:disabled{background-color:var(--ddga-gray-200);color:var(--ddga-gray-400);cursor:not-allowed}.ddga-number-input--steppers-subtle .ddga-number-input__step{background-color:#0000}.ddga-number-input--steppers-subtle .ddga-number-input__step:hover:not(:disabled){background-color:var(--ddga-gray-100)}.ddga-number-input--steppers-subtle .ddga-number-input__step:active:not(:disabled){background-color:var(--ddga-gray-200)}.ddga-number-input--steppers-subtle .ddga-number-input__step:disabled{background-color:#0000}.ddga-number-input--default:hover:not(:focus-within){border-color:var(--ddga-gray-700)}.ddga-number-input:focus-within{box-shadow:var(--ddga-shadow-md)}.ddga-number-input--default:focus-within{border-color:var(--ddga-gray-400)}.ddga-number-input:after{content:"";inset-inline:0;background-color:var(--ddga-gray-950);transform-origin:50%;pointer-events:none;block-size:2px;transition:transform .15s;position:absolute;bottom:-1px;transform:scaleX(0)}.ddga-number-input:focus-within:after{transform:scaleX(1)}:is(.ddga-number-input:has(.ddga-number-input__field:active):not(:has(.ddga-number-input__field:disabled)),.ddga-number-input--pressed){background-color:var(--ddga-gray-100)}.ddga-number-input--pressed:after{transform:scaleX(.5)}.ddga-number-input:has(.ddga-number-input__field:active):after{transform:scaleX(.5)}.ddga-number-input--error,.ddga-number-input--error:hover:not(:focus-within),.ddga-number-input--error:focus-within{border-color:var(--ddga-error-700)}.ddga-number-input:has(.ddga-number-input__field:read-only:not(:disabled)){border-color:var(--ddga-gray-300);background-color:#0000}.ddga-number-input:has(.ddga-number-input__field:disabled){border-color:var(--ddga-gray-300);background-color:#0000}.ddga-number-input:has(.ddga-number-input__field:disabled) .ddga-number-input__field{color:var(--ddga-gray-400);cursor:not-allowed}.ddga-number-input:has(.ddga-number-input__field:disabled) .ddga-number-input__field::placeholder{color:var(--ddga-gray-400)}:is(.ddga-field[data-slot=number-input-field]:has(.ddga-number-input__field:disabled) .ddga-number-input__label,.ddga-field[data-slot=number-input-field]:has(.ddga-number-input__field:disabled) .ddga-number-input__required){color:var(--ddga-gray-400)}.ddga-field[data-slot=number-input-field] .ddga-field__message{padding-block:var(--ddga-space-1)}.ddga-field[data-slot=number-input-field] .ddga-field__message--helper{color:var(--ddga-gray-700)}.ddga-field[data-slot=number-input-field] .ddga-field__message--error{color:var(--ddga-error-700)}[data-theme=dark] .ddga-number-input{border-color:var(--ddga-color-input);color:var(--ddga-text-primary)}[data-theme=dark] .ddga-number-input__field{caret-color:var(--ddga-text-primary)}[data-theme=dark] .ddga-number-input__field::placeholder{color:var(--ddga-text-placeholder)}[data-theme=dark] .ddga-number-input--filled-lighter,[data-theme=dark] .ddga-number-input--filled-darker{background-color:var(--ddga-color-muted)}[data-theme=dark] .ddga-number-input__step{background-color:var(--ddga-color-muted);color:var(--ddga-text-primary)}[data-theme=dark] .ddga-number-input__step:hover:not(:disabled){background-color:var(--ddga-color-border)}[data-theme=dark] .ddga-number-input--steppers-subtle .ddga-number-input__step{background-color:#0000}[data-theme=dark] .ddga-number-input--steppers-subtle .ddga-number-input__step:hover:not(:disabled){background-color:var(--ddga-color-muted)}[data-theme=dark] .ddga-number-input__step:disabled{color:var(--ddga-text-tertiary)}[data-theme=dark] .ddga-number-input--default:hover:not(:focus-within){border-color:var(--ddga-gray-500)}[data-theme=dark] .ddga-number-input:after{background-color:var(--ddga-text-primary)}:is([data-theme=dark] .ddga-number-input:has(.ddga-number-input__field:active):not(:has(.ddga-number-input__field:disabled)),[data-theme=dark] .ddga-number-input--pressed){background-color:var(--ddga-color-muted)}:is([data-theme=dark] .ddga-number-input:has(.ddga-number-input__field:read-only:not(:disabled)),[data-theme=dark] .ddga-number-input:has(.ddga-number-input__field:disabled)){border-color:var(--ddga-color-border)}[data-theme=dark] .ddga-number-input:has(.ddga-number-input__field:disabled) .ddga-number-input__field{color:var(--ddga-text-tertiary)}[data-theme=dark] .ddga-number-input:has(.ddga-number-input__field:disabled) .ddga-number-input__field::placeholder{color:var(--ddga-text-tertiary)}:is([data-theme=dark] .ddga-field[data-slot=number-input-field]:has(.ddga-number-input__field:disabled) .ddga-number-input__label,[data-theme=dark] .ddga-field[data-slot=number-input-field]:has(.ddga-number-input__field:disabled) .ddga-number-input__required){color:var(--ddga-text-tertiary)}[data-theme=dark] .ddga-field[data-slot=number-input-field] .ddga-field__message--helper{color:var(--ddga-text-secondary)}@media (prefers-reduced-motion:reduce){.ddga-number-input,.ddga-number-input:after,.ddga-number-input__step{transition:none}}@media (forced-colors:active){.ddga-number-input{border:1px solid canvastext}.ddga-number-input__step{color:buttontext;background-color:buttonface}.ddga-number-input:focus-within{outline-offset:1px;outline:2px solid highlight}.ddga-number-input:has(.ddga-number-input__field:disabled){border-color:graytext}.ddga-number-input:has(.ddga-number-input__field:disabled) .ddga-number-input__field{color:graytext}}}
+@layer ddga-components{.ddga-field[data-slot=number-input-field]{gap:var(--ddga-space-2)}.ddga-number-input__label{align-items:center;gap:var(--ddga-space-1);color:var(--ddga-text-primary);font-weight:var(--ddga-font-weight-regular);font-size:var(--ddga-font-size-sm);line-height:1.4286;display:inline-flex}.ddga-number-input__required{color:var(--ddga-error-700)}.ddga-number-input{border:1px solid var(--ddga-gray-400);border-radius:var(--ddga-radius-sm);background-color:var(--ddga-color-background);inline-size:100%;color:var(--ddga-gray-700);align-items:stretch;transition:border-color .15s,box-shadow .15s,background-color .15s;display:flex;position:relative}.ddga-number-input--md{block-size:32px;font-size:var(--ddga-font-size-sm)}.ddga-number-input--lg{block-size:40px;font-size:var(--ddga-font-size-base)}.ddga-number-input--filled-lighter{background-color:var(--ddga-gray-25);border-color:#0000}.ddga-number-input--filled-darker{background-color:var(--ddga-gray-100);border-color:#0000}.ddga-number-input__field{block-size:100%;min-inline-size:0;padding-inline:var(--ddga-space-2);color:inherit;font:inherit;text-align:start;caret-color:var(--ddga-gray-950);direction:ltr;unicode-bidi:plaintext;background:0 0;border:0;outline:none;flex:auto;padding-block:0}.ddga-number-input__field::placeholder{color:var(--ddga-gray-500)}.ddga-number-input__field:-webkit-autofill{-webkit-text-fill-color:var(--ddga-gray-700);-webkit-box-shadow:0 0 0 100vmax var(--ddga-color-background) inset;box-shadow:0 0 0 100vmax var(--ddga-color-background) inset;caret-color:var(--ddga-gray-950)}.ddga-number-input__field:-webkit-autofill:hover{-webkit-text-fill-color:var(--ddga-gray-700);-webkit-box-shadow:0 0 0 100vmax var(--ddga-color-background) inset;box-shadow:0 0 0 100vmax var(--ddga-color-background) inset;caret-color:var(--ddga-gray-950)}.ddga-number-input__field:-webkit-autofill:focus{-webkit-text-fill-color:var(--ddga-gray-700);-webkit-box-shadow:0 0 0 100vmax var(--ddga-color-background) inset;box-shadow:0 0 0 100vmax var(--ddga-color-background) inset;caret-color:var(--ddga-gray-950)}.ddga-number-input__step{padding-inline:var(--ddga-space-4);background-color:var(--ddga-gray-100);color:var(--ddga-text-primary);cursor:pointer;border:0;flex:none;justify-content:center;align-self:stretch;align-items:center;padding-block:0;transition:background-color .15s;display:inline-flex}.ddga-number-input--md .ddga-number-input__step{padding-inline:var(--ddga-space-3)}.ddga-number-input__step svg{block-size:24px;inline-size:24px}.ddga-number-input--md .ddga-number-input__step svg{block-size:20px;inline-size:20px}.ddga-number-input__step--increment{border-start-start-radius:var(--ddga-radius-sm);border-end-start-radius:var(--ddga-radius-sm)}.ddga-number-input__step--decrement{border-start-end-radius:var(--ddga-radius-sm);border-end-end-radius:var(--ddga-radius-sm)}.ddga-number-input__step:hover:not(:disabled){background-color:var(--ddga-gray-200)}.ddga-number-input__step:active:not(:disabled){background-color:var(--ddga-gray-300)}.ddga-number-input__step:focus-visible{box-shadow:inset 0 0 0 2px var(--ddga-text-primary);outline:none}.ddga-number-input__step:disabled{background-color:var(--ddga-gray-200);color:var(--ddga-gray-400);cursor:not-allowed}.ddga-number-input--steppers-subtle .ddga-number-input__step{background-color:#0000}.ddga-number-input--steppers-subtle .ddga-number-input__step:hover:not(:disabled){background-color:var(--ddga-gray-100)}.ddga-number-input--steppers-subtle .ddga-number-input__step:active:not(:disabled){background-color:var(--ddga-gray-200)}.ddga-number-input--steppers-subtle .ddga-number-input__step:disabled{background-color:#0000}.ddga-number-input--default:hover:not(:focus-within){border-color:var(--ddga-gray-700)}.ddga-number-input:focus-within{box-shadow:var(--ddga-shadow-md)}.ddga-number-input--default:focus-within{border-color:var(--ddga-gray-400)}.ddga-number-input:after{content:"";inset-inline:0;background-color:var(--ddga-gray-950);transform-origin:50%;pointer-events:none;block-size:2px;transition:transform .4s ease-out;position:absolute;bottom:-1px;transform:scaleX(0)}.ddga-number-input:focus-within:after{transform:scaleX(1)}:is(.ddga-number-input:has(.ddga-number-input__field:active):not(:has(.ddga-number-input__field:disabled)),.ddga-number-input--pressed){background-color:var(--ddga-gray-100)}.ddga-number-input--pressed:after{transform:scaleX(.5)}.ddga-number-input:has(.ddga-number-input__field:active):after{transform:scaleX(.5)}.ddga-number-input--error,.ddga-number-input--error:hover:not(:focus-within),.ddga-number-input--error:focus-within{border-color:var(--ddga-error-700)}.ddga-number-input:has(.ddga-number-input__field:read-only:not(:disabled)){border-color:var(--ddga-gray-300);background-color:#0000}.ddga-number-input:has(.ddga-number-input__field:disabled){border-color:var(--ddga-gray-300);background-color:#0000}.ddga-number-input:has(.ddga-number-input__field:disabled) .ddga-number-input__field{color:var(--ddga-gray-400);cursor:not-allowed}.ddga-number-input:has(.ddga-number-input__field:disabled) .ddga-number-input__field::placeholder{color:var(--ddga-gray-400)}:is(.ddga-field[data-slot=number-input-field]:has(.ddga-number-input__field:disabled) .ddga-number-input__label,.ddga-field[data-slot=number-input-field]:has(.ddga-number-input__field:disabled) .ddga-number-input__required){color:var(--ddga-gray-400)}.ddga-field[data-slot=number-input-field] .ddga-field__message{padding-block:var(--ddga-space-1)}.ddga-field[data-slot=number-input-field] .ddga-field__message--helper{color:var(--ddga-gray-700)}.ddga-field[data-slot=number-input-field] .ddga-field__message--error{color:var(--ddga-error-700)}[data-theme=dark] .ddga-number-input{border-color:var(--ddga-color-input);color:var(--ddga-text-primary)}[data-theme=dark] .ddga-number-input__field{caret-color:var(--ddga-text-primary)}[data-theme=dark] .ddga-number-input__field::placeholder{color:var(--ddga-text-placeholder)}[data-theme=dark] .ddga-number-input--filled-lighter,[data-theme=dark] .ddga-number-input--filled-darker{background-color:var(--ddga-color-muted)}[data-theme=dark] .ddga-number-input__step{background-color:var(--ddga-color-muted);color:var(--ddga-text-primary)}[data-theme=dark] .ddga-number-input__step:hover:not(:disabled){background-color:var(--ddga-color-border)}[data-theme=dark] .ddga-number-input--steppers-subtle .ddga-number-input__step{background-color:#0000}[data-theme=dark] .ddga-number-input--steppers-subtle .ddga-number-input__step:hover:not(:disabled){background-color:var(--ddga-color-muted)}[data-theme=dark] .ddga-number-input__step:disabled{color:var(--ddga-text-tertiary)}[data-theme=dark] .ddga-number-input--default:hover:not(:focus-within){border-color:var(--ddga-gray-500)}[data-theme=dark] .ddga-number-input:after{background-color:var(--ddga-text-primary)}:is([data-theme=dark] .ddga-number-input:has(.ddga-number-input__field:active):not(:has(.ddga-number-input__field:disabled)),[data-theme=dark] .ddga-number-input--pressed){background-color:var(--ddga-color-muted)}:is([data-theme=dark] .ddga-number-input:has(.ddga-number-input__field:read-only:not(:disabled)),[data-theme=dark] .ddga-number-input:has(.ddga-number-input__field:disabled)){border-color:var(--ddga-color-border)}[data-theme=dark] .ddga-number-input:has(.ddga-number-input__field:disabled) .ddga-number-input__field{color:var(--ddga-text-tertiary)}[data-theme=dark] .ddga-number-input:has(.ddga-number-input__field:disabled) .ddga-number-input__field::placeholder{color:var(--ddga-text-tertiary)}:is([data-theme=dark] .ddga-field[data-slot=number-input-field]:has(.ddga-number-input__field:disabled) .ddga-number-input__label,[data-theme=dark] .ddga-field[data-slot=number-input-field]:has(.ddga-number-input__field:disabled) .ddga-number-input__required){color:var(--ddga-text-tertiary)}[data-theme=dark] .ddga-field[data-slot=number-input-field] .ddga-field__message--helper{color:var(--ddga-text-secondary)}@media (prefers-reduced-motion:reduce){.ddga-number-input,.ddga-number-input:after,.ddga-number-input__step{transition:none}}@media (forced-colors:active){.ddga-number-input{border:1px solid canvastext}.ddga-number-input__step{color:buttontext;background-color:buttonface}.ddga-number-input:focus-within{outline-offset:1px;outline:2px solid highlight}.ddga-number-input:has(.ddga-number-input__field:disabled){border-color:graytext}.ddga-number-input:has(.ddga-number-input__field:disabled) .ddga-number-input__field{color:graytext}}}
 /*# sourceMappingURL=number-input.css.map */

package/dist/components/number-input.css.map

@@ -1 +1 @@
-{"version":3,"mappings":"AAAA,uBAKE,kEAMA,0NAUA,yDAMA,6SAiBA,0EAIA,4EAOA,2FAIA,2FAOA,gRAkBA,kEAIA,yPAAA,+PAAA,+PAYA,qSAcA,mFAKA,8DAIA,qFAMA,kIAIA,8HAOA,oFAGA,qFAGA,wGAIA,sHAOA,oFAGA,wHAGA,yHAGA,6FAMA,uFAOA,iEAGA,2EAIA,6NAYA,0DAQA,8KAMA,uDAAA,oFAOA,uJAQA,oIAQA,oHAIA,mIAIA,6HAIA,2PAUA,iGAGA,kGAGA,kGASA,yGAIA,iFAGA,4FAGA,kJAIA,mHAIA,0GAGA,sGAGA,6IAKA,oFAGA,yGAGA,qFAGA,qNAOA,qNAIA,uIAAA,oJAQA,oSAQA,0HAMA,uCACE,sFAUF,8BACE,+CAGA,sEAIA,+EAIA,iFAGA","sources":["src/components/number-input.css"],"sourcesContent":["@layer ddga-components {\n  /* Field wrapper + helper/error line are shared (field.css). The field model\n     mirrors TextInput (SDGA \"Number Input\" = the Text input field + flanking ±\n     steppers, the SDGA \"Input Prefix-Suffix\" sub-component). */\n\n  .ddga-field[data-slot='number-input-field'] {\n    gap: var(--ddga-space-2);\n  }\n\n  /* ─── Label (SDGA: Text sm Regular, ink #161616, leading required *) ─── */\n\n  .ddga-number-input__label {\n    display: inline-flex;\n    align-items: center;\n    gap: var(--ddga-space-1);\n    color: var(--ddga-text-primary);\n    font-weight: var(--ddga-font-weight-regular);\n    font-size: var(--ddga-font-size-sm);\n    line-height: 1.4286;\n  }\n\n  .ddga-number-input__required {\n    color: var(--ddga-error-700);\n  }\n\n  /* ─── Control (the bordered box; owns border/focus/size/state/style) ─── */\n\n  .ddga-number-input {\n    position: relative;\n    display: flex;\n    align-items: stretch;\n    inline-size: 100%;\n    border: 1px solid var(--ddga-gray-400);\n    border-radius: var(--ddga-radius-sm);\n    background-color: var(--ddga-color-background);\n    color: var(--ddga-gray-700);\n    transition:\n      border-color 150ms ease,\n      box-shadow 150ms ease,\n      background-color 150ms ease;\n  }\n\n  /* ─── Sizes (SDGA Medium 32 / Large 40; type scales with size) ─── */\n\n  .ddga-number-input--md {\n    block-size: 32px;\n    font-size: var(--ddga-font-size-sm);\n  }\n  .ddga-number-input--lg {\n    block-size: 40px;\n    font-size: var(--ddga-font-size-base);\n  }\n\n  /* ─── Fill styles (SDGA Style axis) ─── */\n\n  .ddga-number-input--filled-lighter {\n    border-color: transparent;\n    background-color: var(--ddga-gray-25);\n  }\n  .ddga-number-input--filled-darker {\n    border-color: transparent;\n    background-color: var(--ddga-gray-100);\n  }\n\n  /* ─── Field (the actual <input>: transparent, start-aligned, Latin+LTR) ─── */\n\n  .ddga-number-input__field {\n    flex: 1 1 auto;\n    min-inline-size: 0;\n    block-size: 100%;\n    padding-inline: var(--ddga-space-2);\n    padding-block: 0;\n    border: 0;\n    background: transparent;\n    color: inherit;\n    font: inherit;\n    text-align: start;\n    caret-color: var(--ddga-gray-950);\n    outline: none;\n    /* Keep digits Latin + LTR even inside an RTL form (DGA convention). */\n    direction: ltr;\n    unicode-bidi: plaintext;\n  }\n\n  .ddga-number-input__field::placeholder {\n    color: var(--ddga-gray-500);\n  }\n\n  .ddga-number-input__field:-webkit-autofill,\n  .ddga-number-input__field:-webkit-autofill:hover,\n  .ddga-number-input__field:-webkit-autofill:focus {\n    -webkit-text-fill-color: var(--ddga-gray-700);\n    -webkit-box-shadow: 0 0 0 100vmax var(--ddga-color-background) inset;\n    box-shadow: 0 0 0 100vmax var(--ddga-color-background) inset;\n    caret-color: var(--ddga-gray-950);\n  }\n\n  /* ─── Stepper buttons (SDGA \"Input Prefix-Suffix\": Solid neutral chip, flush,\n         full height; icon #161616; ＋ leads / − trails) ─── */\n\n  .ddga-number-input__step {\n    align-self: stretch;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex: none;\n    padding-inline: var(--ddga-space-4);\n    padding-block: 0;\n    border: 0;\n    background-color: var(--ddga-gray-100);\n    color: var(--ddga-text-primary);\n    cursor: pointer;\n    transition: background-color 150ms ease;\n  }\n  .ddga-number-input--md .ddga-number-input__step {\n    padding-inline: var(--ddga-space-3);\n  }\n\n  /* Icon: Large 24 / Medium 20. */\n  .ddga-number-input__step svg {\n    inline-size: 24px;\n    block-size: 24px;\n  }\n  .ddga-number-input--md .ddga-number-input__step svg {\n    inline-size: 20px;\n    block-size: 20px;\n  }\n\n  /* Hug the field's rounded outer corners (＋ = inline-start, − = inline-end). */\n  .ddga-number-input__step--increment {\n    border-start-start-radius: var(--ddga-radius-sm);\n    border-end-start-radius: var(--ddga-radius-sm);\n  }\n  .ddga-number-input__step--decrement {\n    border-start-end-radius: var(--ddga-radius-sm);\n    border-end-end-radius: var(--ddga-radius-sm);\n  }\n\n  /* Solid state ramp (SDGA neutral-button: rest gray-100 → hover 200 → pressed\n     300, matching TextInputDropdown; SDGA's flattened hover token is a Figma quirk). */\n  .ddga-number-input__step:hover:not(:disabled) {\n    background-color: var(--ddga-gray-200);\n  }\n  .ddga-number-input__step:active:not(:disabled) {\n    background-color: var(--ddga-gray-300);\n  }\n  .ddga-number-input__step:focus-visible {\n    outline: none;\n    box-shadow: inset 0 0 0 2px var(--ddga-text-primary);\n  }\n  .ddga-number-input__step:disabled {\n    background-color: var(--ddga-gray-200);\n    color: var(--ddga-gray-400);\n    cursor: not-allowed;\n  }\n\n  /* Subtle stepper style (SDGA Style=Subtle: transparent → gray-100 → gray-200). */\n  .ddga-number-input--steppers-subtle .ddga-number-input__step {\n    background-color: transparent;\n  }\n  .ddga-number-input--steppers-subtle .ddga-number-input__step:hover:not(:disabled) {\n    background-color: var(--ddga-gray-100);\n  }\n  .ddga-number-input--steppers-subtle .ddga-number-input__step:active:not(:disabled) {\n    background-color: var(--ddga-gray-200);\n  }\n  .ddga-number-input--steppers-subtle .ddga-number-input__step:disabled {\n    background-color: transparent;\n  }\n\n  /* ─── Hover (SDGA: outlined style darkens its border to gray-700) ─── */\n\n  .ddga-number-input--default:hover:not(:focus-within) {\n    border-color: var(--ddga-gray-700);\n  }\n\n  /* ─── Focus (SDGA: shadow-md + full-width 2px dark bottom underline, NOT a\n         ring; outlined border stays gray-400, filled stays borderless) ─── */\n\n  .ddga-number-input:focus-within {\n    box-shadow: var(--ddga-shadow-md);\n  }\n  .ddga-number-input--default:focus-within {\n    border-color: var(--ddga-gray-400);\n  }\n  /* Underline bar — hidden by default; states scale it in from center so pressed→focus tweens, no snap. */\n  .ddga-number-input::after {\n    content: '';\n    position: absolute;\n    inset-inline: 0;\n    bottom: -1px;\n    block-size: 2px;\n    background-color: var(--ddga-gray-950);\n    transform: scaleX(0);\n    transform-origin: center;\n    transition: transform 150ms ease;\n    pointer-events: none;\n  }\n  .ddga-number-input:focus-within::after {\n    transform: scaleX(1);\n  }\n\n  /* ─── Pressed (SDGA: gray-100 fill + a short, CENTERED ~50% 2px underline).\n         Scoped to the field itself so pressing a stepper shows the stepper's\n         own pressed state, not the field's. `--pressed` is a static demo hook. */\n\n  .ddga-number-input:has(.ddga-number-input__field:active):not(\n      :has(.ddga-number-input__field:disabled)\n    ),\n  .ddga-number-input--pressed {\n    background-color: var(--ddga-gray-100);\n  }\n  .ddga-number-input:has(.ddga-number-input__field:active)::after,\n  .ddga-number-input--pressed::after {\n    transform: scaleX(0.5);\n  }\n\n  /* ─── Error (SDGA: error-700 border; bg/text unchanged) ─── */\n\n  .ddga-number-input--error,\n  .ddga-number-input--error:hover:not(:focus-within),\n  .ddga-number-input--error:focus-within {\n    border-color: var(--ddga-error-700);\n  }\n\n  /* ─── Read-only (SDGA: gray-300 border, transparent fill) ─── */\n\n  .ddga-number-input:has(.ddga-number-input__field:read-only:not(:disabled)) {\n    border-color: var(--ddga-gray-300);\n    background-color: transparent;\n  }\n\n  /* ─── Disabled (SDGA: gray-300 border, transparent fill, gray-400 text,\n         no opacity dimming) ─── */\n\n  .ddga-number-input:has(.ddga-number-input__field:disabled) {\n    border-color: var(--ddga-gray-300);\n    background-color: transparent;\n  }\n  .ddga-number-input:has(.ddga-number-input__field:disabled) .ddga-number-input__field {\n    color: var(--ddga-gray-400);\n    cursor: not-allowed;\n  }\n  .ddga-number-input:has(.ddga-number-input__field:disabled)\n    .ddga-number-input__field::placeholder {\n    color: var(--ddga-gray-400);\n  }\n  .ddga-field[data-slot='number-input-field']:has(.ddga-number-input__field:disabled)\n    .ddga-number-input__label,\n  .ddga-field[data-slot='number-input-field']:has(.ddga-number-input__field:disabled)\n    .ddga-number-input__required {\n    color: var(--ddga-gray-400);\n  }\n\n  /* ─── Helper / error line (SDGA: 16px feedback icon + text gray-700,\n         error error-700, 4px block padding) ─── */\n\n  .ddga-field[data-slot='number-input-field'] .ddga-field__message {\n    padding-block: var(--ddga-space-1);\n  }\n  .ddga-field[data-slot='number-input-field'] .ddga-field__message--helper {\n    color: var(--ddga-gray-700);\n  }\n  .ddga-field[data-slot='number-input-field'] .ddga-field__message--error {\n    color: var(--ddga-error-700);\n  }\n\n  /* ─── Dark mode ─── */\n  /* SDGA light values are fixed gray-ramp steps that don't flip; remap to the\n     flipping semantic tokens so text/affordances stay readable. Exact DGA dark\n     palette is deferred (matches TextInput). */\n\n  [data-theme='dark'] .ddga-number-input {\n    border-color: var(--ddga-color-input);\n    color: var(--ddga-text-primary);\n  }\n  [data-theme='dark'] .ddga-number-input__field {\n    caret-color: var(--ddga-text-primary);\n  }\n  [data-theme='dark'] .ddga-number-input__field::placeholder {\n    color: var(--ddga-text-placeholder);\n  }\n  [data-theme='dark'] .ddga-number-input--filled-lighter,\n  [data-theme='dark'] .ddga-number-input--filled-darker {\n    background-color: var(--ddga-color-muted);\n  }\n  [data-theme='dark'] .ddga-number-input__step {\n    background-color: var(--ddga-color-muted);\n    color: var(--ddga-text-primary);\n  }\n  [data-theme='dark'] .ddga-number-input__step:hover:not(:disabled) {\n    background-color: var(--ddga-color-border);\n  }\n  [data-theme='dark'] .ddga-number-input--steppers-subtle .ddga-number-input__step {\n    background-color: transparent;\n  }\n  [data-theme='dark']\n    .ddga-number-input--steppers-subtle\n    .ddga-number-input__step:hover:not(:disabled) {\n    background-color: var(--ddga-color-muted);\n  }\n  [data-theme='dark'] .ddga-number-input__step:disabled {\n    color: var(--ddga-text-tertiary);\n  }\n  [data-theme='dark'] .ddga-number-input--default:hover:not(:focus-within) {\n    border-color: var(--ddga-gray-500);\n  }\n  [data-theme='dark'] .ddga-number-input::after {\n    background-color: var(--ddga-text-primary);\n  }\n  [data-theme='dark']\n    .ddga-number-input:has(.ddga-number-input__field:active):not(\n      :has(.ddga-number-input__field:disabled)\n    ),\n  [data-theme='dark'] .ddga-number-input--pressed {\n    background-color: var(--ddga-color-muted);\n  }\n  [data-theme='dark'] .ddga-number-input:has(.ddga-number-input__field:read-only:not(:disabled)),\n  [data-theme='dark'] .ddga-number-input:has(.ddga-number-input__field:disabled) {\n    border-color: var(--ddga-color-border);\n  }\n  [data-theme='dark']\n    .ddga-number-input:has(.ddga-number-input__field:disabled)\n    .ddga-number-input__field,\n  [data-theme='dark']\n    .ddga-number-input:has(.ddga-number-input__field:disabled)\n    .ddga-number-input__field::placeholder {\n    color: var(--ddga-text-tertiary);\n  }\n  [data-theme='dark']\n    .ddga-field[data-slot='number-input-field']:has(.ddga-number-input__field:disabled)\n    .ddga-number-input__label,\n  [data-theme='dark']\n    .ddga-field[data-slot='number-input-field']:has(.ddga-number-input__field:disabled)\n    .ddga-number-input__required {\n    color: var(--ddga-text-tertiary);\n  }\n  [data-theme='dark'] .ddga-field[data-slot='number-input-field'] .ddga-field__message--helper {\n    color: var(--ddga-text-secondary);\n  }\n\n  /* ─── Reduced motion ─── */\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-number-input,\n    .ddga-number-input::after,\n    .ddga-number-input__step {\n      transition: none;\n    }\n  }\n\n  /* ─── Forced colors (Windows High Contrast): the focus underline is invisible,\n         restore a visible outline ─── */\n\n  @media (forced-colors: active) {\n    .ddga-number-input {\n      border: 1px solid CanvasText;\n    }\n    .ddga-number-input__step {\n      background-color: ButtonFace;\n      color: ButtonText;\n    }\n    .ddga-number-input:focus-within {\n      outline: 2px solid Highlight;\n      outline-offset: 1px;\n    }\n    .ddga-number-input:has(.ddga-number-input__field:disabled) {\n      border-color: GrayText;\n    }\n    .ddga-number-input:has(.ddga-number-input__field:disabled) .ddga-number-input__field {\n      color: GrayText;\n    }\n  }\n}\n"],"names":[]}
+{"version":3,"mappings":"AAAA,uBAKE,kEAMA,0NAUA,yDAMA,6SAiBA,0EAIA,4EAOA,2FAIA,2FAOA,gRAkBA,kEAIA,yPAAA,+PAAA,+PAYA,qSAcA,mFAKA,8DAIA,qFAMA,kIAIA,8HAOA,oFAGA,qFAGA,wGAIA,sHAOA,oFAGA,wHAGA,yHAGA,6FAMA,uFAOA,iEAGA,2EAIA,qOAYA,0DAQA,8KAMA,uDAAA,oFAOA,uJAQA,oIAQA,oHAIA,mIAIA,6HAIA,2PAUA,iGAGA,kGAGA,kGASA,yGAIA,iFAGA,4FAGA,kJAIA,mHAIA,0GAGA,sGAGA,6IAKA,oFAGA,yGAGA,qFAGA,qNAOA,qNAIA,uIAAA,oJAQA,oSAQA,0HAMA,uCACE,sFAUF,8BACE,+CAGA,sEAIA,+EAIA,iFAGA","sources":["src/components/number-input.css"],"sourcesContent":["@layer ddga-components {\n  /* Field wrapper + helper/error line are shared (field.css). The field model\n     mirrors TextInput (SDGA \"Number Input\" = the Text input field + flanking ±\n     steppers, the SDGA \"Input Prefix-Suffix\" sub-component). */\n\n  .ddga-field[data-slot='number-input-field'] {\n    gap: var(--ddga-space-2);\n  }\n\n  /* ─── Label (SDGA: Text sm Regular, ink #161616, leading required *) ─── */\n\n  .ddga-number-input__label {\n    display: inline-flex;\n    align-items: center;\n    gap: var(--ddga-space-1);\n    color: var(--ddga-text-primary);\n    font-weight: var(--ddga-font-weight-regular);\n    font-size: var(--ddga-font-size-sm);\n    line-height: 1.4286;\n  }\n\n  .ddga-number-input__required {\n    color: var(--ddga-error-700);\n  }\n\n  /* ─── Control (the bordered box; owns border/focus/size/state/style) ─── */\n\n  .ddga-number-input {\n    position: relative;\n    display: flex;\n    align-items: stretch;\n    inline-size: 100%;\n    border: 1px solid var(--ddga-gray-400);\n    border-radius: var(--ddga-radius-sm);\n    background-color: var(--ddga-color-background);\n    color: var(--ddga-gray-700);\n    transition:\n      border-color 150ms ease,\n      box-shadow 150ms ease,\n      background-color 150ms ease;\n  }\n\n  /* ─── Sizes (SDGA Medium 32 / Large 40; type scales with size) ─── */\n\n  .ddga-number-input--md {\n    block-size: 32px;\n    font-size: var(--ddga-font-size-sm);\n  }\n  .ddga-number-input--lg {\n    block-size: 40px;\n    font-size: var(--ddga-font-size-base);\n  }\n\n  /* ─── Fill styles (SDGA Style axis) ─── */\n\n  .ddga-number-input--filled-lighter {\n    border-color: transparent;\n    background-color: var(--ddga-gray-25);\n  }\n  .ddga-number-input--filled-darker {\n    border-color: transparent;\n    background-color: var(--ddga-gray-100);\n  }\n\n  /* ─── Field (the actual <input>: transparent, start-aligned, Latin+LTR) ─── */\n\n  .ddga-number-input__field {\n    flex: 1 1 auto;\n    min-inline-size: 0;\n    block-size: 100%;\n    padding-inline: var(--ddga-space-2);\n    padding-block: 0;\n    border: 0;\n    background: transparent;\n    color: inherit;\n    font: inherit;\n    text-align: start;\n    caret-color: var(--ddga-gray-950);\n    outline: none;\n    /* Keep digits Latin + LTR even inside an RTL form (DGA convention). */\n    direction: ltr;\n    unicode-bidi: plaintext;\n  }\n\n  .ddga-number-input__field::placeholder {\n    color: var(--ddga-gray-500);\n  }\n\n  .ddga-number-input__field:-webkit-autofill,\n  .ddga-number-input__field:-webkit-autofill:hover,\n  .ddga-number-input__field:-webkit-autofill:focus {\n    -webkit-text-fill-color: var(--ddga-gray-700);\n    -webkit-box-shadow: 0 0 0 100vmax var(--ddga-color-background) inset;\n    box-shadow: 0 0 0 100vmax var(--ddga-color-background) inset;\n    caret-color: var(--ddga-gray-950);\n  }\n\n  /* ─── Stepper buttons (SDGA \"Input Prefix-Suffix\": Solid neutral chip, flush,\n         full height; icon #161616; ＋ leads / − trails) ─── */\n\n  .ddga-number-input__step {\n    align-self: stretch;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex: none;\n    padding-inline: var(--ddga-space-4);\n    padding-block: 0;\n    border: 0;\n    background-color: var(--ddga-gray-100);\n    color: var(--ddga-text-primary);\n    cursor: pointer;\n    transition: background-color 150ms ease;\n  }\n  .ddga-number-input--md .ddga-number-input__step {\n    padding-inline: var(--ddga-space-3);\n  }\n\n  /* Icon: Large 24 / Medium 20. */\n  .ddga-number-input__step svg {\n    inline-size: 24px;\n    block-size: 24px;\n  }\n  .ddga-number-input--md .ddga-number-input__step svg {\n    inline-size: 20px;\n    block-size: 20px;\n  }\n\n  /* Hug the field's rounded outer corners (＋ = inline-start, − = inline-end). */\n  .ddga-number-input__step--increment {\n    border-start-start-radius: var(--ddga-radius-sm);\n    border-end-start-radius: var(--ddga-radius-sm);\n  }\n  .ddga-number-input__step--decrement {\n    border-start-end-radius: var(--ddga-radius-sm);\n    border-end-end-radius: var(--ddga-radius-sm);\n  }\n\n  /* Solid state ramp (SDGA neutral-button: rest gray-100 → hover 200 → pressed\n     300, matching TextInputDropdown; SDGA's flattened hover token is a Figma quirk). */\n  .ddga-number-input__step:hover:not(:disabled) {\n    background-color: var(--ddga-gray-200);\n  }\n  .ddga-number-input__step:active:not(:disabled) {\n    background-color: var(--ddga-gray-300);\n  }\n  .ddga-number-input__step:focus-visible {\n    outline: none;\n    box-shadow: inset 0 0 0 2px var(--ddga-text-primary);\n  }\n  .ddga-number-input__step:disabled {\n    background-color: var(--ddga-gray-200);\n    color: var(--ddga-gray-400);\n    cursor: not-allowed;\n  }\n\n  /* Subtle stepper style (SDGA Style=Subtle: transparent → gray-100 → gray-200). */\n  .ddga-number-input--steppers-subtle .ddga-number-input__step {\n    background-color: transparent;\n  }\n  .ddga-number-input--steppers-subtle .ddga-number-input__step:hover:not(:disabled) {\n    background-color: var(--ddga-gray-100);\n  }\n  .ddga-number-input--steppers-subtle .ddga-number-input__step:active:not(:disabled) {\n    background-color: var(--ddga-gray-200);\n  }\n  .ddga-number-input--steppers-subtle .ddga-number-input__step:disabled {\n    background-color: transparent;\n  }\n\n  /* ─── Hover (SDGA: outlined style darkens its border to gray-700) ─── */\n\n  .ddga-number-input--default:hover:not(:focus-within) {\n    border-color: var(--ddga-gray-700);\n  }\n\n  /* ─── Focus (SDGA: shadow-md + full-width 2px dark bottom underline, NOT a\n         ring; outlined border stays gray-400, filled stays borderless) ─── */\n\n  .ddga-number-input:focus-within {\n    box-shadow: var(--ddga-shadow-md);\n  }\n  .ddga-number-input--default:focus-within {\n    border-color: var(--ddga-gray-400);\n  }\n  /* Underline bar — hidden by default; states scale it in from center so pressed→focus tweens, no snap. */\n  .ddga-number-input::after {\n    content: '';\n    position: absolute;\n    inset-inline: 0;\n    bottom: -1px;\n    block-size: 2px;\n    background-color: var(--ddga-gray-950);\n    transform: scaleX(0);\n    transform-origin: center;\n    transition: transform 400ms ease-out;\n    pointer-events: none;\n  }\n  .ddga-number-input:focus-within::after {\n    transform: scaleX(1);\n  }\n\n  /* ─── Pressed (SDGA: gray-100 fill + a short, CENTERED ~50% 2px underline).\n         Scoped to the field itself so pressing a stepper shows the stepper's\n         own pressed state, not the field's. `--pressed` is a static demo hook. */\n\n  .ddga-number-input:has(.ddga-number-input__field:active):not(\n      :has(.ddga-number-input__field:disabled)\n    ),\n  .ddga-number-input--pressed {\n    background-color: var(--ddga-gray-100);\n  }\n  .ddga-number-input:has(.ddga-number-input__field:active)::after,\n  .ddga-number-input--pressed::after {\n    transform: scaleX(0.5);\n  }\n\n  /* ─── Error (SDGA: error-700 border; bg/text unchanged) ─── */\n\n  .ddga-number-input--error,\n  .ddga-number-input--error:hover:not(:focus-within),\n  .ddga-number-input--error:focus-within {\n    border-color: var(--ddga-error-700);\n  }\n\n  /* ─── Read-only (SDGA: gray-300 border, transparent fill) ─── */\n\n  .ddga-number-input:has(.ddga-number-input__field:read-only:not(:disabled)) {\n    border-color: var(--ddga-gray-300);\n    background-color: transparent;\n  }\n\n  /* ─── Disabled (SDGA: gray-300 border, transparent fill, gray-400 text,\n         no opacity dimming) ─── */\n\n  .ddga-number-input:has(.ddga-number-input__field:disabled) {\n    border-color: var(--ddga-gray-300);\n    background-color: transparent;\n  }\n  .ddga-number-input:has(.ddga-number-input__field:disabled) .ddga-number-input__field {\n    color: var(--ddga-gray-400);\n    cursor: not-allowed;\n  }\n  .ddga-number-input:has(.ddga-number-input__field:disabled)\n    .ddga-number-input__field::placeholder {\n    color: var(--ddga-gray-400);\n  }\n  .ddga-field[data-slot='number-input-field']:has(.ddga-number-input__field:disabled)\n    .ddga-number-input__label,\n  .ddga-field[data-slot='number-input-field']:has(.ddga-number-input__field:disabled)\n    .ddga-number-input__required {\n    color: var(--ddga-gray-400);\n  }\n\n  /* ─── Helper / error line (SDGA: 16px feedback icon + text gray-700,\n         error error-700, 4px block padding) ─── */\n\n  .ddga-field[data-slot='number-input-field'] .ddga-field__message {\n    padding-block: var(--ddga-space-1);\n  }\n  .ddga-field[data-slot='number-input-field'] .ddga-field__message--helper {\n    color: var(--ddga-gray-700);\n  }\n  .ddga-field[data-slot='number-input-field'] .ddga-field__message--error {\n    color: var(--ddga-error-700);\n  }\n\n  /* ─── Dark mode ─── */\n  /* SDGA light values are fixed gray-ramp steps that don't flip; remap to the\n     flipping semantic tokens so text/affordances stay readable. Exact DGA dark\n     palette is deferred (matches TextInput). */\n\n  [data-theme='dark'] .ddga-number-input {\n    border-color: var(--ddga-color-input);\n    color: var(--ddga-text-primary);\n  }\n  [data-theme='dark'] .ddga-number-input__field {\n    caret-color: var(--ddga-text-primary);\n  }\n  [data-theme='dark'] .ddga-number-input__field::placeholder {\n    color: var(--ddga-text-placeholder);\n  }\n  [data-theme='dark'] .ddga-number-input--filled-lighter,\n  [data-theme='dark'] .ddga-number-input--filled-darker {\n    background-color: var(--ddga-color-muted);\n  }\n  [data-theme='dark'] .ddga-number-input__step {\n    background-color: var(--ddga-color-muted);\n    color: var(--ddga-text-primary);\n  }\n  [data-theme='dark'] .ddga-number-input__step:hover:not(:disabled) {\n    background-color: var(--ddga-color-border);\n  }\n  [data-theme='dark'] .ddga-number-input--steppers-subtle .ddga-number-input__step {\n    background-color: transparent;\n  }\n  [data-theme='dark']\n    .ddga-number-input--steppers-subtle\n    .ddga-number-input__step:hover:not(:disabled) {\n    background-color: var(--ddga-color-muted);\n  }\n  [data-theme='dark'] .ddga-number-input__step:disabled {\n    color: var(--ddga-text-tertiary);\n  }\n  [data-theme='dark'] .ddga-number-input--default:hover:not(:focus-within) {\n    border-color: var(--ddga-gray-500);\n  }\n  [data-theme='dark'] .ddga-number-input::after {\n    background-color: var(--ddga-text-primary);\n  }\n  [data-theme='dark']\n    .ddga-number-input:has(.ddga-number-input__field:active):not(\n      :has(.ddga-number-input__field:disabled)\n    ),\n  [data-theme='dark'] .ddga-number-input--pressed {\n    background-color: var(--ddga-color-muted);\n  }\n  [data-theme='dark'] .ddga-number-input:has(.ddga-number-input__field:read-only:not(:disabled)),\n  [data-theme='dark'] .ddga-number-input:has(.ddga-number-input__field:disabled) {\n    border-color: var(--ddga-color-border);\n  }\n  [data-theme='dark']\n    .ddga-number-input:has(.ddga-number-input__field:disabled)\n    .ddga-number-input__field,\n  [data-theme='dark']\n    .ddga-number-input:has(.ddga-number-input__field:disabled)\n    .ddga-number-input__field::placeholder {\n    color: var(--ddga-text-tertiary);\n  }\n  [data-theme='dark']\n    .ddga-field[data-slot='number-input-field']:has(.ddga-number-input__field:disabled)\n    .ddga-number-input__label,\n  [data-theme='dark']\n    .ddga-field[data-slot='number-input-field']:has(.ddga-number-input__field:disabled)\n    .ddga-number-input__required {\n    color: var(--ddga-text-tertiary);\n  }\n  [data-theme='dark'] .ddga-field[data-slot='number-input-field'] .ddga-field__message--helper {\n    color: var(--ddga-text-secondary);\n  }\n\n  /* ─── Reduced motion ─── */\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-number-input,\n    .ddga-number-input::after,\n    .ddga-number-input__step {\n      transition: none;\n    }\n  }\n\n  /* ─── Forced colors (Windows High Contrast): the focus underline is invisible,\n         restore a visible outline ─── */\n\n  @media (forced-colors: active) {\n    .ddga-number-input {\n      border: 1px solid CanvasText;\n    }\n    .ddga-number-input__step {\n      background-color: ButtonFace;\n      color: ButtonText;\n    }\n    .ddga-number-input:focus-within {\n      outline: 2px solid Highlight;\n      outline-offset: 1px;\n    }\n    .ddga-number-input:has(.ddga-number-input__field:disabled) {\n      border-color: GrayText;\n    }\n    .ddga-number-input:has(.ddga-number-input__field:disabled) .ddga-number-input__field {\n      color: GrayText;\n    }\n  }\n}\n"],"names":[]}

package/dist/components/slider.css

@@ -1,2 +1,2 @@
-@layer ddga-components{.ddga-slider-field--md{--ddga-slider-rail:var(--ddga-space-2);--ddga-slider-thumb:var(--ddga-space-4)}.ddga-slider-field--sm{--ddga-slider-rail:var(--ddga-space-1);--ddga-slider-thumb:var(--ddga-space-3)}.ddga-slider__label{color:var(--ddga-text-primary);font-weight:var(--ddga-font-weight-regular)}.ddga-slider-field--md .ddga-slider__label{font-size:var(--ddga-font-size-base);line-height:1.5}.ddga-slider-field--sm .ddga-slider__label{font-size:var(--ddga-font-size-sm);line-height:1.43}.ddga-slider__control{align-items:center;gap:.375rem;display:flex}.ddga-slider__value{color:var(--ddga-gray-700);font-size:var(--ddga-font-size-xs);font-variant-numeric:tabular-nums;flex-shrink:0;line-height:1.5}.ddga-slider-field--sm .ddga-field__message{font-size:var(--ddga-font-size-xs)}.ddga-slider{min-inline-size:0;block-size:var(--ddga-slider-thumb);touch-action:none;-webkit-user-select:none;user-select:none;flex:auto;align-items:center;display:flex;position:relative}.ddga-slider__track{block-size:var(--ddga-slider-rail);border-radius:var(--ddga-radius-sm);background-color:var(--ddga-color-muted);flex-grow:1;position:relative}.ddga-slider__range{border-radius:var(--ddga-radius-sm);background-color:var(--ddga-color-primary);block-size:100%;position:absolute}.ddga-slider__thumb{inline-size:var(--ddga-slider-thumb);block-size:var(--ddga-slider-thumb);border-radius:var(--ddga-radius-full);background-color:var(--ddga-color-primary);cursor:grab;transition:box-shadow .15s;display:block}.ddga-slider__thumb:active{cursor:grabbing}.ddga-slider__thumb:focus-visible{box-shadow:0 0 0 2px var(--ddga-color-background), 0 0 0 4px var(--ddga-color-ring);outline:none}.ddga-slider--error .ddga-slider__range,.ddga-slider--error .ddga-slider__thumb{background-color:var(--ddga-color-error)}.ddga-slider--error .ddga-slider__thumb:focus-visible{box-shadow:0 0 0 2px var(--ddga-color-background), 0 0 0 4px var(--ddga-color-error)}.ddga-slider[data-disabled]{opacity:.5}.ddga-slider[data-disabled] .ddga-slider__thumb{cursor:not-allowed}@media (prefers-reduced-motion:reduce){.ddga-slider__thumb{transition:none}}@media (forced-colors:active){.ddga-slider__track{background-color:canvas;border:1px solid canvastext}.ddga-slider__range{background-color:highlight}.ddga-slider__thumb{background-color:highlight;border:1px solid canvastext}.ddga-slider__thumb:focus-visible{outline-offset:1px;outline:2px solid highlight}}}
+@layer ddga-components{.ddga-slider-field--md{--ddga-slider-rail:var(--ddga-space-2);--ddga-slider-thumb:var(--ddga-space-4)}.ddga-slider-field--sm{--ddga-slider-rail:var(--ddga-space-1);--ddga-slider-thumb:var(--ddga-space-3)}.ddga-slider__label{color:var(--ddga-text-primary);font-weight:var(--ddga-font-weight-regular)}.ddga-slider-field--md .ddga-slider__label{font-size:var(--ddga-font-size-base);line-height:1.5}.ddga-slider-field--sm .ddga-slider__label{font-size:var(--ddga-font-size-sm);line-height:1.43}.ddga-slider__control{align-items:center;gap:.375rem;display:flex}.ddga-slider__value{color:var(--ddga-gray-700);font-size:var(--ddga-font-size-xs);font-variant-numeric:tabular-nums;flex-shrink:0;line-height:1.5}.ddga-slider-field--sm .ddga-field__message{font-size:var(--ddga-font-size-xs)}.ddga-slider{min-inline-size:0;block-size:var(--ddga-slider-thumb);touch-action:none;-webkit-user-select:none;user-select:none;flex:auto;align-items:center;display:flex;position:relative}.ddga-slider__track{block-size:var(--ddga-slider-rail);border-radius:var(--ddga-radius-sm);background-color:var(--ddga-color-muted);flex-grow:1;position:relative}.ddga-slider__range{border-radius:var(--ddga-radius-sm);background-color:var(--ddga-color-primary);block-size:100%;position:absolute}.ddga-slider__thumb{inline-size:var(--ddga-slider-thumb);block-size:var(--ddga-slider-thumb);border-radius:var(--ddga-radius-full);background-color:var(--ddga-color-primary);border:1px solid var(--ddga-success-700);cursor:grab;transition:box-shadow .15s;display:block}.ddga-slider__thumb:active{cursor:grabbing}.ddga-slider__thumb:focus-visible{box-shadow:0 0 0 2px var(--ddga-color-background), 0 0 0 4px var(--ddga-color-ring);outline:none}.ddga-slider--error .ddga-slider__range,.ddga-slider--error .ddga-slider__thumb{background-color:var(--ddga-color-error);border-color:var(--ddga-color-error)}.ddga-slider--error .ddga-slider__thumb:focus-visible{box-shadow:0 0 0 2px var(--ddga-color-background), 0 0 0 4px var(--ddga-color-error)}.ddga-slider[data-disabled]{opacity:.5}.ddga-slider[data-disabled] .ddga-slider__thumb{cursor:not-allowed}@media (prefers-reduced-motion:reduce){.ddga-slider__thumb{transition:none}}@media (forced-colors:active){.ddga-slider__track{background-color:canvas;border:1px solid canvastext}.ddga-slider__range{background-color:highlight}.ddga-slider__thumb{background-color:highlight;border:1px solid canvastext}.ddga-slider__thumb:focus-visible{outline-offset:1px;outline:2px solid highlight}}}
 /*# sourceMappingURL=slider.css.map */

package/dist/components/slider.css.map

@@ -1 +1 @@
-{"version":3,"mappings":"AAAA,uBAME,sGAIA,sGAOA,+FAIA,gGAIA,+FAOA,kEAMA,kJAOA,+EAMA,2LAaA,kKAQA,qIASA,mOAUA,2CAKA,mIASA,yHAIA,2IAQA,uCAGA,mEAMA,uCACE,qCAOF,8BACE,wEAIA,+CAGA,2EAIA","sources":["src/components/slider.css"],"sourcesContent":["@layer ddga-components {\n  /* Wrapper (.ddga-field) + message (.ddga-field__message) are shared (field.css). Size\n     lives on the field wrapper so it scales the label/helper type as well as rail/thumb. */\n\n  /* ─── Size ─── */\n\n  .ddga-slider-field--md {\n    --ddga-slider-rail: var(--ddga-space-2);\n    --ddga-slider-thumb: var(--ddga-space-4);\n  }\n  .ddga-slider-field--sm {\n    --ddga-slider-rail: var(--ddga-space-1);\n    --ddga-slider-thumb: var(--ddga-space-3);\n  }\n\n  /* ─── Label ─── */\n\n  .ddga-slider__label {\n    color: var(--ddga-text-primary);\n    font-weight: var(--ddga-font-weight-regular);\n  }\n  .ddga-slider-field--md .ddga-slider__label {\n    font-size: var(--ddga-font-size-base);\n    line-height: 1.5;\n  }\n  .ddga-slider-field--sm .ddga-slider__label {\n    font-size: var(--ddga-font-size-sm);\n    line-height: 1.43;\n  }\n\n  /* ─── Control row (track + value) ─── */\n\n  .ddga-slider__control {\n    display: flex;\n    align-items: center;\n    gap: 0.375rem; /* SDGA 6px — no space token */\n  }\n\n  .ddga-slider__value {\n    flex-shrink: 0;\n    color: var(--ddga-gray-700);\n    font-size: var(--ddga-font-size-xs);\n    line-height: 1.5; /* SDGA Text xs 12/18 — else inherits body 1.6 → 19.2px */\n    font-variant-numeric: tabular-nums;\n  }\n  .ddga-slider-field--sm .ddga-field__message {\n    font-size: var(--ddga-font-size-xs);\n  }\n\n  /* ─── Root ─── */\n\n  .ddga-slider {\n    position: relative;\n    display: flex;\n    flex: 1 1 auto;\n    min-inline-size: 0;\n    align-items: center;\n    block-size: var(--ddga-slider-thumb);\n    touch-action: none;\n    user-select: none;\n  }\n\n  /* ─── Track + range ─── */\n\n  .ddga-slider__track {\n    position: relative;\n    flex-grow: 1;\n    block-size: var(--ddga-slider-rail);\n    border-radius: var(--ddga-radius-sm);\n    background-color: var(--ddga-color-muted);\n  }\n\n  .ddga-slider__range {\n    position: absolute;\n    block-size: 100%;\n    border-radius: var(--ddga-radius-sm);\n    background-color: var(--ddga-color-primary);\n  }\n\n  /* ─── Thumb ─── */\n\n  .ddga-slider__thumb {\n    display: block;\n    inline-size: var(--ddga-slider-thumb);\n    block-size: var(--ddga-slider-thumb);\n    border-radius: var(--ddga-radius-full);\n    background-color: var(--ddga-color-primary);\n    cursor: grab;\n    transition: box-shadow 150ms ease;\n  }\n\n  .ddga-slider__thumb:active {\n    cursor: grabbing;\n  }\n\n  /* Two-layer ring so focus stays visible on the same-green thumb. */\n  .ddga-slider__thumb:focus-visible {\n    outline: none;\n    box-shadow:\n      0 0 0 2px var(--ddga-color-background),\n      0 0 0 4px var(--ddga-color-ring);\n  }\n\n  /* ─── Error ─── */\n\n  .ddga-slider--error .ddga-slider__range,\n  .ddga-slider--error .ddga-slider__thumb {\n    background-color: var(--ddga-color-error);\n  }\n  .ddga-slider--error .ddga-slider__thumb:focus-visible {\n    box-shadow:\n      0 0 0 2px var(--ddga-color-background),\n      0 0 0 4px var(--ddga-color-error);\n  }\n\n  /* ─── Disabled ─── */\n\n  .ddga-slider[data-disabled] {\n    opacity: 0.5;\n  }\n  .ddga-slider[data-disabled] .ddga-slider__thumb {\n    cursor: not-allowed;\n  }\n\n  /* ─── Reduced motion ─── */\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-slider__thumb {\n      transition: none;\n    }\n  }\n\n  /* ─── Forced colors ─── */\n\n  @media (forced-colors: active) {\n    .ddga-slider__track {\n      background-color: Canvas;\n      border: 1px solid CanvasText;\n    }\n    .ddga-slider__range {\n      background-color: Highlight;\n    }\n    .ddga-slider__thumb {\n      background-color: Highlight;\n      border: 1px solid CanvasText;\n    }\n    .ddga-slider__thumb:focus-visible {\n      outline: 2px solid Highlight;\n      outline-offset: 1px;\n    }\n  }\n}\n"],"names":[]}
+{"version":3,"mappings":"AAAA,uBAME,sGAIA,sGAOA,+FAIA,gGAIA,+FAOA,kEAMA,kJAOA,+EAMA,2LAaA,kKAQA,qIAUA,4QAWA,2CAKA,mIASA,8JAKA,2IAQA,uCAGA,mEAMA,uCACE,qCAOF,8BACE,wEAIA,+CAGA,2EAIA","sources":["src/components/slider.css"],"sourcesContent":["@layer ddga-components {\n  /* Wrapper (.ddga-field) + message (.ddga-field__message) are shared (field.css). Size\n     lives on the field wrapper so it scales the label/helper type as well as rail/thumb. */\n\n  /* ─── Size ─── */\n\n  .ddga-slider-field--md {\n    --ddga-slider-rail: var(--ddga-space-2);\n    --ddga-slider-thumb: var(--ddga-space-4);\n  }\n  .ddga-slider-field--sm {\n    --ddga-slider-rail: var(--ddga-space-1);\n    --ddga-slider-thumb: var(--ddga-space-3);\n  }\n\n  /* ─── Label ─── */\n\n  .ddga-slider__label {\n    color: var(--ddga-text-primary);\n    font-weight: var(--ddga-font-weight-regular);\n  }\n  .ddga-slider-field--md .ddga-slider__label {\n    font-size: var(--ddga-font-size-base);\n    line-height: 1.5;\n  }\n  .ddga-slider-field--sm .ddga-slider__label {\n    font-size: var(--ddga-font-size-sm);\n    line-height: 1.43;\n  }\n\n  /* ─── Control row (track + value) ─── */\n\n  .ddga-slider__control {\n    display: flex;\n    align-items: center;\n    gap: 0.375rem; /* SDGA 6px — no space token */\n  }\n\n  .ddga-slider__value {\n    flex-shrink: 0;\n    color: var(--ddga-gray-700);\n    font-size: var(--ddga-font-size-xs);\n    line-height: 1.5; /* SDGA Text xs 12/18 — else inherits body 1.6 → 19.2px */\n    font-variant-numeric: tabular-nums;\n  }\n  .ddga-slider-field--sm .ddga-field__message {\n    font-size: var(--ddga-font-size-xs);\n  }\n\n  /* ─── Root ─── */\n\n  .ddga-slider {\n    position: relative;\n    display: flex;\n    flex: 1 1 auto;\n    min-inline-size: 0;\n    align-items: center;\n    block-size: var(--ddga-slider-thumb);\n    touch-action: none;\n    user-select: none;\n  }\n\n  /* ─── Track + range ─── */\n\n  .ddga-slider__track {\n    position: relative;\n    flex-grow: 1;\n    block-size: var(--ddga-slider-rail);\n    border-radius: var(--ddga-radius-sm);\n    background-color: var(--ddga-color-muted);\n  }\n\n  .ddga-slider__range {\n    position: absolute;\n    block-size: 100%;\n    border-radius: var(--ddga-radius-sm);\n    background-color: var(--ddga-color-primary);\n  }\n\n  /* ─── Thumb ─── */\n\n  /* SDGA Control = brand-green fill + `border-success` #067647 ring (success-700, not sa-700). */\n  .ddga-slider__thumb {\n    display: block;\n    inline-size: var(--ddga-slider-thumb);\n    block-size: var(--ddga-slider-thumb);\n    border-radius: var(--ddga-radius-full);\n    background-color: var(--ddga-color-primary);\n    border: 1px solid var(--ddga-success-700);\n    cursor: grab;\n    transition: box-shadow 150ms ease;\n  }\n\n  .ddga-slider__thumb:active {\n    cursor: grabbing;\n  }\n\n  /* Two-layer ring so focus stays visible on the same-green thumb. */\n  .ddga-slider__thumb:focus-visible {\n    outline: none;\n    box-shadow:\n      0 0 0 2px var(--ddga-color-background),\n      0 0 0 4px var(--ddga-color-ring);\n  }\n\n  /* ─── Error ─── */\n\n  .ddga-slider--error .ddga-slider__range,\n  .ddga-slider--error .ddga-slider__thumb {\n    background-color: var(--ddga-color-error);\n    border-color: var(--ddga-color-error);\n  }\n  .ddga-slider--error .ddga-slider__thumb:focus-visible {\n    box-shadow:\n      0 0 0 2px var(--ddga-color-background),\n      0 0 0 4px var(--ddga-color-error);\n  }\n\n  /* ─── Disabled ─── */\n\n  .ddga-slider[data-disabled] {\n    opacity: 0.5;\n  }\n  .ddga-slider[data-disabled] .ddga-slider__thumb {\n    cursor: not-allowed;\n  }\n\n  /* ─── Reduced motion ─── */\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-slider__thumb {\n      transition: none;\n    }\n  }\n\n  /* ─── Forced colors ─── */\n\n  @media (forced-colors: active) {\n    .ddga-slider__track {\n      background-color: Canvas;\n      border: 1px solid CanvasText;\n    }\n    .ddga-slider__range {\n      background-color: Highlight;\n    }\n    .ddga-slider__thumb {\n      background-color: Highlight;\n      border: 1px solid CanvasText;\n    }\n    .ddga-slider__thumb:focus-visible {\n      outline: 2px solid Highlight;\n      outline-offset: 1px;\n    }\n  }\n}\n"],"names":[]}

package/dist/components/text-input.css

@@ -1,2 +1,2 @@
-@layer ddga-components{.ddga-field[data-slot=text-input-field]{gap:var(--ddga-space-2)}.ddga-text-input__label{align-items:center;gap:var(--ddga-space-1);color:var(--ddga-text-primary);font-weight:var(--ddga-font-weight-regular);font-size:var(--ddga-font-size-sm);line-height:1.4286;display:inline-flex}.ddga-text-input__required{color:var(--ddga-error-700)}.ddga-text-input{align-items:center;gap:var(--ddga-space-2);inline-size:100%;border:1px solid var(--ddga-gray-400);border-radius:var(--ddga-radius-sm);background-color:var(--ddga-color-background);color:var(--ddga-gray-700);padding-inline-start:var(--ddga-space-2);padding-inline-end:var(--ddga-space-4);transition:border-color .15s,box-shadow .15s,background-color .15s;display:flex;position:relative}.ddga-text-input--md{block-size:32px;font-size:var(--ddga-font-size-sm)}.ddga-text-input--lg{block-size:40px;font-size:var(--ddga-font-size-base)}.ddga-text-input--filled-lighter{background-color:var(--ddga-gray-25);border-color:#0000}.ddga-text-input--filled-darker{background-color:var(--ddga-gray-100);border-color:#0000}.ddga-text-input__field{block-size:100%;min-inline-size:0;color:inherit;font:inherit;caret-color:var(--ddga-gray-950);background:0 0;border:0;outline:none;flex:auto;padding:0}.ddga-text-input__field::placeholder{color:var(--ddga-gray-500)}.ddga-text-input__field:-webkit-autofill{-webkit-text-fill-color:var(--ddga-gray-700);-webkit-box-shadow:0 0 0 100vmax var(--ddga-color-background) inset;box-shadow:0 0 0 100vmax var(--ddga-color-background) inset;caret-color:var(--ddga-gray-950)}.ddga-text-input__field:-webkit-autofill:hover{-webkit-text-fill-color:var(--ddga-gray-700);-webkit-box-shadow:0 0 0 100vmax var(--ddga-color-background) inset;box-shadow:0 0 0 100vmax var(--ddga-color-background) inset;caret-color:var(--ddga-gray-950)}.ddga-text-input__field:-webkit-autofill:focus{-webkit-text-fill-color:var(--ddga-gray-700);-webkit-box-shadow:0 0 0 100vmax var(--ddga-color-background) inset;box-shadow:0 0 0 100vmax var(--ddga-color-background) inset;caret-color:var(--ddga-gray-950)}.ddga-text-input__adornment{max-block-size:100%;color:var(--ddga-gray-500);flex-shrink:0;align-self:center;align-items:center;display:inline-flex}.ddga-text-input__adornment svg{flex-shrink:0;align-self:center}.ddga-text-input:has(.ddga-text-input__adornment--start){padding-inline-start:var(--ddga-space-2)}.ddga-text-input:has(.ddga-text-input__adornment--end){padding-inline-end:var(--ddga-space-2)}.ddga-text-input__affix{padding-inline:var(--ddga-space-4);background-color:var(--ddga-gray-100);color:var(--ddga-gray-500);white-space:nowrap;align-self:stretch;align-items:center;display:inline-flex}.ddga-text-input--md .ddga-text-input__affix{padding-inline:var(--ddga-space-3)}.ddga-text-input__affix--subtle{background-color:#0000;padding-inline:0}.ddga-text-input__adornment--start:has(.ddga-text-input__affix){align-self:stretch}.ddga-text-input__adornment--end:has(.ddga-text-input__affix){align-self:stretch}.ddga-text-input__adornment--start .ddga-text-input__affix{border-start-start-radius:var(--ddga-radius-sm);border-end-start-radius:var(--ddga-radius-sm)}.ddga-text-input__adornment--end .ddga-text-input__affix{border-start-end-radius:var(--ddga-radius-sm);border-end-end-radius:var(--ddga-radius-sm)}.ddga-text-input:has(.ddga-text-input__adornment--start .ddga-text-input__affix){padding-inline-start:0}.ddga-text-input:has(.ddga-text-input__adornment--end .ddga-text-input__affix){padding-inline-end:0}.ddga-text-input__dropdown{gap:var(--ddga-space-1);color:var(--ddga-text-primary);font:inherit;cursor:pointer;border:0;padding-block:0;transition:background-color .15s}.ddga-text-input__dropdown--subtle{background-color:#0000}.ddga-text-input__dropdown-icon{flex-shrink:0;block-size:24px;inline-size:24px;display:inline-flex}.ddga-text-input__dropdown-icon>svg{block-size:100%;inline-size:100%}.ddga-text-input__dropdown-chevron{flex-shrink:0;block-size:20px;inline-size:20px}.ddga-text-input--md .ddga-text-input__dropdown-icon{block-size:20px;inline-size:20px}.ddga-text-input--md .ddga-text-input__dropdown-chevron{block-size:16px;inline-size:16px}.ddga-text-input__dropdown:hover{background-color:var(--ddga-gray-200)}.ddga-text-input__dropdown:active{background-color:var(--ddga-gray-300)}.ddga-text-input__dropdown--subtle:hover{background-color:var(--ddga-gray-100)}.ddga-text-input__dropdown--subtle:active{background-color:var(--ddga-gray-200)}.ddga-text-input__dropdown--selected,.ddga-text-input__dropdown--selected:hover,.ddga-text-input__dropdown--selected:active{background-color:var(--ddga-gray-700);color:#fff}.ddga-text-input__dropdown:focus-visible{box-shadow:inset 0 0 0 2px var(--ddga-text-primary);outline:none}.ddga-text-input--default:hover:not(:focus-within){border-color:var(--ddga-gray-700)}.ddga-text-input:after{content:"";inset-inline:0;background-color:var(--ddga-gray-950);transform-origin:50%;pointer-events:none;block-size:2px;transition:transform .15s;position:absolute;bottom:-1px;transform:scaleX(0)}.ddga-text-input:focus-within{box-shadow:var(--ddga-shadow-md)}.ddga-text-input--default:focus-within{border-color:var(--ddga-gray-400)}.ddga-text-input:focus-within:after{transform:scaleX(1)}.ddga-text-input--pressed{background-color:var(--ddga-gray-100)}.ddga-text-input:active:not(:has(.ddga-text-input__field:disabled)){background-color:var(--ddga-gray-100)}.ddga-text-input:active:after,.ddga-text-input--pressed:after{transform:scaleX(.5)}.ddga-text-input--error,.ddga-text-input--error:hover:not(:focus-within),.ddga-text-input--error:focus-within{border-color:var(--ddga-error-700)}.ddga-text-input:has(.ddga-text-input__field:read-only:not(:disabled)){border-color:var(--ddga-gray-300);background-color:#0000}.ddga-text-input:has(.ddga-text-input__field:disabled){border-color:var(--ddga-gray-300);cursor:not-allowed;background-color:#0000}.ddga-text-input:has(.ddga-text-input__field:disabled) .ddga-text-input__field{color:var(--ddga-gray-400);cursor:not-allowed}.ddga-text-input:has(.ddga-text-input__field:disabled) .ddga-text-input__field::placeholder{color:var(--ddga-gray-400)}.ddga-text-input:has(.ddga-text-input__field:disabled) .ddga-text-input__adornment{color:var(--ddga-gray-400)}:is(.ddga-field[data-slot=text-input-field]:has(.ddga-text-input__field:disabled) .ddga-text-input__label,.ddga-field[data-slot=text-input-field]:has(.ddga-text-input__field:disabled) .ddga-text-input__required){color:var(--ddga-gray-400)}.ddga-text-input:has(.ddga-text-input__field:disabled) .ddga-text-input__affix{background-color:var(--ddga-gray-200)}.ddga-field[data-slot=text-input-field] .ddga-field__message{padding-block:var(--ddga-space-1)}.ddga-field[data-slot=text-input-field] .ddga-field__message--helper{color:var(--ddga-gray-700)}.ddga-field[data-slot=text-input-field] .ddga-field__message--error{color:var(--ddga-error-700)}[data-theme=dark] .ddga-text-input{border-color:var(--ddga-color-input);color:var(--ddga-text-primary)}[data-theme=dark] .ddga-text-input__field{caret-color:var(--ddga-text-primary)}[data-theme=dark] .ddga-text-input__field::placeholder{color:var(--ddga-text-placeholder)}[data-theme=dark] .ddga-text-input__adornment{color:var(--ddga-text-tertiary)}[data-theme=dark] .ddga-text-input__affix{background-color:var(--ddga-color-muted);color:var(--ddga-text-tertiary)}[data-theme=dark] .ddga-text-input__dropdown{background-color:var(--ddga-color-muted);color:var(--ddga-text-primary)}[data-theme=dark] .ddga-text-input__dropdown--subtle{background-color:#0000}[data-theme=dark] .ddga-text-input__dropdown:hover{background-color:var(--ddga-color-border)}[data-theme=dark] .ddga-text-input__dropdown--subtle:hover{background-color:var(--ddga-color-muted)}[data-theme=dark] .ddga-text-input__dropdown:active,[data-theme=dark] .ddga-text-input__dropdown--subtle:active{background-color:var(--ddga-color-border)}[data-theme=dark] .ddga-text-input__dropdown--selected,[data-theme=dark] .ddga-text-input__dropdown--selected:hover{background-color:var(--ddga-gray-700);color:#fff}[data-theme=dark] .ddga-text-input__dropdown:focus-visible{box-shadow:inset 0 0 0 2px var(--ddga-text-primary)}[data-theme=dark] .ddga-text-input--filled-lighter,[data-theme=dark] .ddga-text-input--filled-darker{background-color:var(--ddga-color-muted)}[data-theme=dark] .ddga-text-input--default:hover:not(:focus-within){border-color:var(--ddga-gray-500)}[data-theme=dark] .ddga-text-input:after{background-color:var(--ddga-text-primary)}[data-theme=dark] .ddga-text-input--pressed{background-color:var(--ddga-color-muted)}[data-theme=dark] .ddga-text-input:active:not(:has(.ddga-text-input__field:disabled)){background-color:var(--ddga-color-muted)}:is([data-theme=dark] .ddga-text-input:has(.ddga-text-input__field:read-only:not(:disabled)),[data-theme=dark] .ddga-text-input:has(.ddga-text-input__field:disabled)){border-color:var(--ddga-color-border)}[data-theme=dark] .ddga-text-input:has(.ddga-text-input__field:disabled) .ddga-text-input__field{color:var(--ddga-text-tertiary)}[data-theme=dark] .ddga-text-input:has(.ddga-text-input__field:disabled) .ddga-text-input__field::placeholder{color:var(--ddga-text-tertiary)}[data-theme=dark] .ddga-text-input:has(.ddga-text-input__field:disabled) .ddga-text-input__adornment{color:var(--ddga-text-tertiary)}:is([data-theme=dark] .ddga-field[data-slot=text-input-field]:has(.ddga-text-input__field:disabled) .ddga-text-input__label,[data-theme=dark] .ddga-field[data-slot=text-input-field]:has(.ddga-text-input__field:disabled) .ddga-text-input__required){color:var(--ddga-text-tertiary)}[data-theme=dark] .ddga-field[data-slot=text-input-field] .ddga-field__message--helper{color:var(--ddga-text-secondary)}@media (prefers-reduced-motion:reduce){.ddga-text-input,.ddga-text-input:after{transition:none}}@media (forced-colors:active){.ddga-text-input{border:1px solid canvastext}.ddga-text-input:focus-within{outline-offset:1px;outline:2px solid highlight}.ddga-text-input:has(.ddga-text-input__field:disabled){border-color:graytext}.ddga-text-input:has(.ddga-text-input__field:disabled) .ddga-text-input__field{color:graytext}}}
+@layer ddga-components{.ddga-field[data-slot=text-input-field]{gap:var(--ddga-space-2)}.ddga-text-input__label{align-items:center;gap:var(--ddga-space-1);color:var(--ddga-text-primary);font-weight:var(--ddga-font-weight-regular);font-size:var(--ddga-font-size-sm);line-height:1.4286;display:inline-flex}.ddga-text-input__required{color:var(--ddga-error-700)}.ddga-text-input{align-items:center;gap:var(--ddga-space-2);inline-size:100%;border:1px solid var(--ddga-gray-400);border-radius:var(--ddga-radius-sm);background-color:var(--ddga-color-background);color:var(--ddga-gray-700);padding-inline-start:var(--ddga-space-2);padding-inline-end:var(--ddga-space-4);transition:border-color .15s,box-shadow .15s,background-color .15s;display:flex;position:relative}.ddga-text-input--md{block-size:32px;font-size:var(--ddga-font-size-sm)}.ddga-text-input--lg{block-size:40px;font-size:var(--ddga-font-size-base)}.ddga-text-input--filled-lighter{background-color:var(--ddga-gray-25);border-color:#0000}.ddga-text-input--filled-darker{background-color:var(--ddga-gray-100);border-color:#0000}.ddga-text-input__field{block-size:100%;min-inline-size:0;color:inherit;font:inherit;caret-color:var(--ddga-gray-950);background:0 0;border:0;outline:none;flex:auto;padding:0}.ddga-text-input__field::placeholder{color:var(--ddga-gray-500)}.ddga-text-input__field:-webkit-autofill{-webkit-text-fill-color:var(--ddga-gray-700);-webkit-box-shadow:0 0 0 100vmax var(--ddga-color-background) inset;box-shadow:0 0 0 100vmax var(--ddga-color-background) inset;caret-color:var(--ddga-gray-950)}.ddga-text-input__field:-webkit-autofill:hover{-webkit-text-fill-color:var(--ddga-gray-700);-webkit-box-shadow:0 0 0 100vmax var(--ddga-color-background) inset;box-shadow:0 0 0 100vmax var(--ddga-color-background) inset;caret-color:var(--ddga-gray-950)}.ddga-text-input__field:-webkit-autofill:focus{-webkit-text-fill-color:var(--ddga-gray-700);-webkit-box-shadow:0 0 0 100vmax var(--ddga-color-background) inset;box-shadow:0 0 0 100vmax var(--ddga-color-background) inset;caret-color:var(--ddga-gray-950)}.ddga-text-input__adornment{max-block-size:100%;color:var(--ddga-gray-500);flex-shrink:0;align-self:center;align-items:center;display:inline-flex}.ddga-text-input__adornment svg{flex-shrink:0;align-self:center}.ddga-text-input:has(.ddga-text-input__adornment--start){padding-inline-start:var(--ddga-space-2)}.ddga-text-input:has(.ddga-text-input__adornment--end){padding-inline-end:var(--ddga-space-2)}.ddga-text-input__affix{padding-inline:var(--ddga-space-4);background-color:var(--ddga-gray-100);color:var(--ddga-gray-500);white-space:nowrap;align-self:stretch;align-items:center;display:inline-flex}.ddga-text-input--md .ddga-text-input__affix{padding-inline:var(--ddga-space-3)}.ddga-text-input__affix--subtle{background-color:#0000;padding-inline:0}.ddga-text-input__adornment--start:has(.ddga-text-input__affix){align-self:stretch}.ddga-text-input__adornment--end:has(.ddga-text-input__affix){align-self:stretch}.ddga-text-input__adornment--start .ddga-text-input__affix{border-start-start-radius:var(--ddga-radius-sm);border-end-start-radius:var(--ddga-radius-sm)}.ddga-text-input__adornment--end .ddga-text-input__affix{border-start-end-radius:var(--ddga-radius-sm);border-end-end-radius:var(--ddga-radius-sm)}.ddga-text-input:has(.ddga-text-input__adornment--start .ddga-text-input__affix){padding-inline-start:0}.ddga-text-input:has(.ddga-text-input__adornment--end .ddga-text-input__affix){padding-inline-end:0}.ddga-text-input__dropdown{gap:var(--ddga-space-1);color:var(--ddga-text-primary);font:inherit;cursor:pointer;border:0;padding-block:0;transition:background-color .15s}.ddga-text-input__dropdown--subtle{background-color:#0000}.ddga-text-input__dropdown-icon{flex-shrink:0;block-size:24px;inline-size:24px;display:inline-flex}.ddga-text-input__dropdown-icon>svg{block-size:100%;inline-size:100%}.ddga-text-input__dropdown-chevron{flex-shrink:0;block-size:20px;inline-size:20px}.ddga-text-input--md .ddga-text-input__dropdown-icon{block-size:20px;inline-size:20px}.ddga-text-input--md .ddga-text-input__dropdown-chevron{block-size:16px;inline-size:16px}.ddga-text-input__dropdown:hover{background-color:var(--ddga-gray-200)}.ddga-text-input__dropdown:active{background-color:var(--ddga-gray-300)}.ddga-text-input__dropdown--subtle:hover{background-color:var(--ddga-gray-100)}.ddga-text-input__dropdown--subtle:active{background-color:var(--ddga-gray-200)}.ddga-text-input__dropdown--selected,.ddga-text-input__dropdown--selected:hover,.ddga-text-input__dropdown--selected:active{background-color:var(--ddga-gray-700);color:#fff}.ddga-text-input__dropdown:focus-visible{box-shadow:inset 0 0 0 2px var(--ddga-text-primary);outline:none}.ddga-text-input--default:hover:not(:focus-within){border-color:var(--ddga-gray-700)}.ddga-text-input:after{content:"";inset-inline:0;background-color:var(--ddga-gray-950);transform-origin:50%;pointer-events:none;block-size:2px;transition:transform .4s ease-out;position:absolute;bottom:-1px;transform:scaleX(0)}.ddga-text-input:focus-within{box-shadow:var(--ddga-shadow-md)}.ddga-text-input--default:focus-within{border-color:var(--ddga-gray-400)}.ddga-text-input:focus-within:after{transform:scaleX(1)}.ddga-text-input--pressed{background-color:var(--ddga-gray-100)}.ddga-text-input:active:not(:has(.ddga-text-input__field:disabled)){background-color:var(--ddga-gray-100)}.ddga-text-input:active:after,.ddga-text-input--pressed:after{transform:scaleX(.5)}.ddga-text-input--error,.ddga-text-input--error:hover:not(:focus-within),.ddga-text-input--error:focus-within{border-color:var(--ddga-error-700)}.ddga-text-input:has(.ddga-text-input__field:read-only:not(:disabled)){border-color:var(--ddga-gray-300);background-color:#0000}.ddga-text-input:has(.ddga-text-input__field:disabled){border-color:var(--ddga-gray-300);cursor:not-allowed;background-color:#0000}.ddga-text-input:has(.ddga-text-input__field:disabled) .ddga-text-input__field{color:var(--ddga-gray-400);cursor:not-allowed}.ddga-text-input:has(.ddga-text-input__field:disabled) .ddga-text-input__field::placeholder{color:var(--ddga-gray-400)}.ddga-text-input:has(.ddga-text-input__field:disabled) .ddga-text-input__adornment{color:var(--ddga-gray-400)}:is(.ddga-field[data-slot=text-input-field]:has(.ddga-text-input__field:disabled) .ddga-text-input__label,.ddga-field[data-slot=text-input-field]:has(.ddga-text-input__field:disabled) .ddga-text-input__required){color:var(--ddga-gray-400)}.ddga-text-input:has(.ddga-text-input__field:disabled) .ddga-text-input__affix{background-color:var(--ddga-gray-200)}.ddga-field[data-slot=text-input-field] .ddga-field__message{padding-block:var(--ddga-space-1)}.ddga-field[data-slot=text-input-field] .ddga-field__message--helper{color:var(--ddga-gray-700)}.ddga-field[data-slot=text-input-field] .ddga-field__message--error{color:var(--ddga-error-700)}[data-theme=dark] .ddga-text-input{border-color:var(--ddga-color-input);color:var(--ddga-text-primary)}[data-theme=dark] .ddga-text-input__field{caret-color:var(--ddga-text-primary)}[data-theme=dark] .ddga-text-input__field::placeholder{color:var(--ddga-text-placeholder)}[data-theme=dark] .ddga-text-input__adornment{color:var(--ddga-text-tertiary)}[data-theme=dark] .ddga-text-input__affix{background-color:var(--ddga-color-muted);color:var(--ddga-text-tertiary)}[data-theme=dark] .ddga-text-input__dropdown{background-color:var(--ddga-color-muted);color:var(--ddga-text-primary)}[data-theme=dark] .ddga-text-input__dropdown--subtle{background-color:#0000}[data-theme=dark] .ddga-text-input__dropdown:hover{background-color:var(--ddga-color-border)}[data-theme=dark] .ddga-text-input__dropdown--subtle:hover{background-color:var(--ddga-color-muted)}[data-theme=dark] .ddga-text-input__dropdown:active,[data-theme=dark] .ddga-text-input__dropdown--subtle:active{background-color:var(--ddga-color-border)}[data-theme=dark] .ddga-text-input__dropdown--selected,[data-theme=dark] .ddga-text-input__dropdown--selected:hover{background-color:var(--ddga-gray-700);color:#fff}[data-theme=dark] .ddga-text-input__dropdown:focus-visible{box-shadow:inset 0 0 0 2px var(--ddga-text-primary)}[data-theme=dark] .ddga-text-input--filled-lighter,[data-theme=dark] .ddga-text-input--filled-darker{background-color:var(--ddga-color-muted)}[data-theme=dark] .ddga-text-input--default:hover:not(:focus-within){border-color:var(--ddga-gray-500)}[data-theme=dark] .ddga-text-input:after{background-color:var(--ddga-text-primary)}[data-theme=dark] .ddga-text-input--pressed{background-color:var(--ddga-color-muted)}[data-theme=dark] .ddga-text-input:active:not(:has(.ddga-text-input__field:disabled)){background-color:var(--ddga-color-muted)}:is([data-theme=dark] .ddga-text-input:has(.ddga-text-input__field:read-only:not(:disabled)),[data-theme=dark] .ddga-text-input:has(.ddga-text-input__field:disabled)){border-color:var(--ddga-color-border)}[data-theme=dark] .ddga-text-input:has(.ddga-text-input__field:disabled) .ddga-text-input__field{color:var(--ddga-text-tertiary)}[data-theme=dark] .ddga-text-input:has(.ddga-text-input__field:disabled) .ddga-text-input__field::placeholder{color:var(--ddga-text-tertiary)}[data-theme=dark] .ddga-text-input:has(.ddga-text-input__field:disabled) .ddga-text-input__adornment{color:var(--ddga-text-tertiary)}:is([data-theme=dark] .ddga-field[data-slot=text-input-field]:has(.ddga-text-input__field:disabled) .ddga-text-input__label,[data-theme=dark] .ddga-field[data-slot=text-input-field]:has(.ddga-text-input__field:disabled) .ddga-text-input__required){color:var(--ddga-text-tertiary)}[data-theme=dark] .ddga-field[data-slot=text-input-field] .ddga-field__message--helper{color:var(--ddga-text-secondary)}@media (prefers-reduced-motion:reduce){.ddga-text-input,.ddga-text-input:after{transition:none}}@media (forced-colors:active){.ddga-text-input{border:1px solid canvastext}.ddga-text-input:focus-within{outline-offset:1px;outline:2px solid highlight}.ddga-text-input:has(.ddga-text-input__field:disabled){border-color:graytext}.ddga-text-input:has(.ddga-text-input__field:disabled) .ddga-text-input__field{color:graytext}}}
 /*# sourceMappingURL=text-input.css.map */