@dev-dga/css 0.11.0 → 0.12.0

package/dist/components/checkbox.css.map

@@ -1 +1 @@
-{"version":3,"mappings":"AAAA,uBAME,2EAQA,6VAiBA,mEAKA,mEAQA,8JAQA,sFAOA,2DAGA,wKAKA,iFAMA,sDAIA,yHAOA,yHAOA,2EAKA,qIASA,yHAMA,mFAOA,uCACE,gCAOF,8BACE,2CAGA,wGAIA,uCAGA,4EAIA","sources":["src/components/checkbox.css"],"sourcesContent":["@layer ddga-components {\n  /* Wrapper (.ddga-field) + helper/error (.ddga-field__message) are shared\n     , see field.css. Only Checkbox-specific styles live here. */\n\n  /* ─── Row (box + label, inline) ─── */\n\n  .ddga-checkbox-row {\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-2);\n  }\n\n  /* ─── Box (Radix Root , reset the button, then style) ─── */\n\n  .ddga-checkbox {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    padding: 0;\n    border: 1px solid var(--ddga-color-input);\n    border-radius: var(--ddga-radius-sm);\n    background-color: var(--ddga-color-background);\n    color: var(--ddga-color-primary-foreground);\n    cursor: pointer;\n    transition:\n      background-color 150ms ease,\n      border-color 150ms ease,\n      box-shadow 150ms ease;\n  }\n\n  .ddga-checkbox--md {\n    block-size: 18px;\n    inline-size: 18px;\n    font-size: 14px;\n  }\n  .ddga-checkbox--sm {\n    block-size: 16px;\n    inline-size: 16px;\n    font-size: 12px;\n  }\n\n  /* ─── Checked / indeterminate fill ─── */\n\n  .ddga-checkbox[data-state='checked'],\n  .ddga-checkbox[data-state='indeterminate'] {\n    background-color: var(--ddga-color-primary);\n    border-color: var(--ddga-color-primary);\n  }\n\n  /* ─── Focus (slightly thicker ring , small hit target) ─── */\n\n  .ddga-checkbox:focus-visible {\n    outline: none;\n    box-shadow: 0 0 0 2px var(--ddga-color-ring);\n  }\n\n  /* ─── Error ─── */\n\n  .ddga-checkbox--error {\n    border-color: var(--ddga-color-error);\n  }\n  .ddga-checkbox--error[data-state='checked'],\n  .ddga-checkbox--error[data-state='indeterminate'] {\n    background-color: var(--ddga-color-error);\n    border-color: var(--ddga-color-error);\n  }\n  .ddga-checkbox--error:focus-visible {\n    box-shadow: 0 0 0 2px var(--ddga-color-error);\n  }\n\n  /* ─── Disabled ─── */\n\n  .ddga-checkbox:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n  }\n  .ddga-checkbox-row:has(.ddga-checkbox:disabled) .ddga-checkbox__label {\n    cursor: not-allowed;\n    color: var(--ddga-text-tertiary);\n  }\n\n  /* ─── Indicator + icons (one shows per Root data-state) ─── */\n\n  .ddga-checkbox__indicator {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    inline-size: 100%;\n    block-size: 100%;\n  }\n  .ddga-checkbox__check,\n  .ddga-checkbox__minus {\n    inline-size: 1em;\n    block-size: 1em;\n  }\n  .ddga-checkbox[data-state='checked'] .ddga-checkbox__minus {\n    display: none;\n  }\n  .ddga-checkbox[data-state='indeterminate'] .ddga-checkbox__check {\n    display: none;\n  }\n\n  /* ─── Label ─── */\n\n  .ddga-checkbox__label {\n    color: var(--ddga-text-primary);\n    font-size: var(--ddga-font-size-base);\n    line-height: 1.4;\n    cursor: pointer;\n  }\n  .ddga-checkbox__required {\n    color: var(--ddga-color-error);\n    margin-inline-start: 0.125rem;\n  }\n\n  /* ─── Reduced motion ─── */\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-checkbox {\n      transition: none;\n    }\n  }\n\n  /* ─── Forced colors (Windows High Contrast) ─── */\n\n  @media (forced-colors: active) {\n    .ddga-checkbox {\n      border: 1px solid CanvasText;\n    }\n    .ddga-checkbox[data-state='checked'],\n    .ddga-checkbox[data-state='indeterminate'] {\n      background-color: CanvasText;\n    }\n    .ddga-checkbox__indicator {\n      color: Canvas;\n    }\n    .ddga-checkbox:focus-visible {\n      outline: 2px solid Highlight;\n      outline-offset: 1px;\n    }\n    .ddga-checkbox:disabled {\n      border-color: GrayText;\n      color: GrayText;\n    }\n  }\n}\n"],"names":[]}
+{"version":3,"mappings":"AAAA,uBAKE,2EAQA,qVAkBA,oDAIA,oDAIA,oDAQA,0LAWA,2IAOA,sHAOA,8JAKA,8PAKA,kQAQA,sKAKA,0PAKA,4PAQA,+FAOA,+EAIA,mMAMA,uJAOA,2DAGA,wKAKA,0EAMA,6EAIA,iNAMA,yHAOA,yHAQA,qDAKA,0HAOA,qIASA,yHAMA,mFAQA,8EAGA,0MAKA,2LAOA,uCACE,sDAQF,8BACE,2CAGA,wGAIA,uCAGA,4EAIA","sources":["src/components/checkbox.css"],"sourcesContent":["@layer ddga-components {\n  /* Wrapper + helper/error message are shared , see field.css. */\n\n  /* ─── Row (box + label, inline) ─── */\n\n  .ddga-checkbox-row {\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-2);\n  }\n\n  /* ─── Box (Radix Root) ─── */\n\n  .ddga-checkbox {\n    position: relative;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    padding: 0;\n    border: 1px solid var(--ddga-gray-500);\n    border-radius: var(--ddga-radius-xs);\n    background-color: transparent;\n    color: var(--ddga-color-primary-foreground);\n    cursor: pointer;\n    transition:\n      background-color 150ms ease,\n      border-color 150ms ease,\n      box-shadow 150ms ease;\n  }\n\n  .ddga-checkbox--md {\n    block-size: 24px;\n    inline-size: 24px;\n  }\n  .ddga-checkbox--sm {\n    block-size: 20px;\n    inline-size: 20px;\n  }\n  .ddga-checkbox--xs {\n    block-size: 16px;\n    inline-size: 16px;\n  }\n\n  /* ─── Ripple halo (hover + pressed) ─── */\n  /* z-index -1 keeps the halo behind the box so the border stays on top. */\n\n  .ddga-checkbox::before {\n    content: '';\n    position: absolute;\n    inset: -8px;\n    z-index: -1;\n    border-radius: 9999px;\n    background-color: var(--ddga-gray-100);\n    opacity: 0;\n    pointer-events: none;\n    transition: opacity 150ms ease;\n  }\n  .ddga-checkbox:not(:disabled):not([data-readonly]):hover::before,\n  .ddga-checkbox:not(:disabled):not([data-readonly]):active::before {\n    opacity: 1;\n  }\n\n  /* ─── Unchecked pressed fill ─── */\n\n  .ddga-checkbox[data-state='unchecked']:not(:disabled):not([data-readonly]):active {\n    background-color: var(--ddga-gray-300);\n  }\n\n  /* ─── Checked / indeterminate fill — Primary ─── */\n  /* hover = primary-hover (SA700); SDGA is SA800 — kept token-driven so themes follow. */\n\n  .ddga-checkbox[data-state='checked'],\n  .ddga-checkbox[data-state='indeterminate'] {\n    background-color: var(--ddga-color-primary);\n    border-color: var(--ddga-color-primary);\n  }\n  .ddga-checkbox[data-state='checked']:not(:disabled):not([data-readonly]):hover,\n  .ddga-checkbox[data-state='indeterminate']:not(:disabled):not([data-readonly]):hover {\n    background-color: var(--ddga-color-primary-hover);\n    border-color: var(--ddga-color-primary-hover);\n  }\n  .ddga-checkbox[data-state='checked']:not(:disabled):not([data-readonly]):active,\n  .ddga-checkbox[data-state='indeterminate']:not(:disabled):not([data-readonly]):active {\n    background-color: var(--ddga-color-primary-active);\n    border-color: var(--ddga-color-primary-active);\n  }\n\n  /* ─── Checked / indeterminate fill — Neutral ─── */\n\n  .ddga-checkbox--neutral[data-state='checked'],\n  .ddga-checkbox--neutral[data-state='indeterminate'] {\n    background-color: var(--ddga-gray-950);\n    border-color: var(--ddga-gray-950);\n  }\n  .ddga-checkbox--neutral[data-state='checked']:not(:disabled):not([data-readonly]):hover,\n  .ddga-checkbox--neutral[data-state='indeterminate']:not(:disabled):not([data-readonly]):hover {\n    background-color: var(--ddga-gray-600);\n    border-color: var(--ddga-gray-600);\n  }\n  .ddga-checkbox--neutral[data-state='checked']:not(:disabled):not([data-readonly]):active,\n  .ddga-checkbox--neutral[data-state='indeterminate']:not(:disabled):not([data-readonly]):active {\n    background-color: var(--ddga-gray-500);\n    border-color: var(--ddga-gray-500);\n  }\n\n  /* ─── Focus (2px offset ring; SDGA #161616 ink via the focus-ring token) ─── */\n\n  .ddga-checkbox:focus-visible {\n    outline: 2px solid var(--ddga-color-focus-ring);\n    outline-offset: 2px;\n  }\n\n  /* ─── Read-only (outlined box, icon in the fill color) ─── */\n\n  .ddga-checkbox[data-readonly] {\n    cursor: default;\n    border-color: var(--ddga-gray-400);\n  }\n  .ddga-checkbox[data-readonly][data-state='checked'],\n  .ddga-checkbox[data-readonly][data-state='indeterminate'] {\n    background-color: transparent;\n    border-color: var(--ddga-gray-400);\n    color: var(--ddga-color-primary);\n  }\n  .ddga-checkbox--neutral[data-readonly][data-state='checked'],\n  .ddga-checkbox--neutral[data-readonly][data-state='indeterminate'] {\n    color: var(--ddga-gray-950);\n  }\n\n  /* ─── Error (off-spec; SDGA uses the Label alert slot) ─── */\n\n  .ddga-checkbox--error {\n    border-color: var(--ddga-color-error);\n  }\n  .ddga-checkbox--error[data-state='checked'],\n  .ddga-checkbox--error[data-state='indeterminate'] {\n    background-color: var(--ddga-color-error);\n    border-color: var(--ddga-color-error);\n  }\n  .ddga-checkbox--error:focus-visible {\n    outline-color: var(--ddga-color-error);\n  }\n\n  /* ─── Disabled (SDGA recolors, no opacity) ─── */\n\n  .ddga-checkbox:disabled {\n    cursor: not-allowed;\n    border-color: var(--ddga-gray-400);\n  }\n  .ddga-checkbox:disabled[data-state='checked'],\n  .ddga-checkbox:disabled[data-state='indeterminate'] {\n    background-color: var(--ddga-gray-200);\n    border-color: var(--ddga-gray-200);\n    color: var(--ddga-color-primary-foreground);\n  }\n  .ddga-checkbox-row:has(.ddga-checkbox:disabled) .ddga-checkbox__label {\n    cursor: not-allowed;\n    color: var(--ddga-text-tertiary);\n  }\n\n  /* ─── Indicator + icons (one shows per data-state) ─── */\n\n  .ddga-checkbox__indicator {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    inline-size: 100%;\n    block-size: 100%;\n  }\n  /* 75% so the inset glyph reads ~50% of the box. */\n  .ddga-checkbox__check {\n    inline-size: 75%;\n    block-size: 75%;\n  }\n  /* bar: 50% wide, box/8 tall (SDGA indeterminate). */\n  .ddga-checkbox__minus {\n    inline-size: 50%;\n    block-size: 12.5%;\n    min-block-size: 2px;\n    border-radius: 1px;\n    background-color: currentColor;\n  }\n  .ddga-checkbox[data-state='checked'] .ddga-checkbox__minus {\n    display: none;\n  }\n  .ddga-checkbox[data-state='indeterminate'] .ddga-checkbox__check {\n    display: none;\n  }\n\n  /* ─── Label ─── */\n\n  .ddga-checkbox__label {\n    color: var(--ddga-text-primary);\n    font-size: var(--ddga-font-size-base);\n    line-height: 1.4;\n    cursor: pointer;\n  }\n  .ddga-checkbox__required {\n    color: var(--ddga-color-error);\n    margin-inline-start: 0.125rem;\n  }\n\n  /* ─── Dark mode ─── */\n  /* Neutral flips to a light fill so it stays legible; ink follows primary-foreground. */\n\n  [data-theme='dark'] .ddga-checkbox::before {\n    background-color: var(--ddga-gray-700);\n  }\n  [data-theme='dark'] .ddga-checkbox--neutral[data-state='checked'],\n  [data-theme='dark'] .ddga-checkbox--neutral[data-state='indeterminate'] {\n    background-color: var(--ddga-gray-100);\n    border-color: var(--ddga-gray-100);\n  }\n  [data-theme='dark'] .ddga-checkbox--neutral[data-readonly][data-state='checked'],\n  [data-theme='dark'] .ddga-checkbox--neutral[data-readonly][data-state='indeterminate'] {\n    color: var(--ddga-gray-100);\n  }\n\n  /* ─── Reduced motion ─── */\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-checkbox,\n    .ddga-checkbox::before {\n      transition: none;\n    }\n  }\n\n  /* ─── Forced colors (Windows High Contrast) ─── */\n\n  @media (forced-colors: active) {\n    .ddga-checkbox {\n      border: 1px solid CanvasText;\n    }\n    .ddga-checkbox[data-state='checked'],\n    .ddga-checkbox[data-state='indeterminate'] {\n      background-color: CanvasText;\n    }\n    .ddga-checkbox__indicator {\n      color: Canvas;\n    }\n    .ddga-checkbox:focus-visible {\n      outline: 2px solid Highlight;\n      outline-offset: 1px;\n    }\n    .ddga-checkbox:disabled {\n      border-color: GrayText;\n      color: GrayText;\n    }\n  }\n}\n"],"names":[]}

package/dist/components/chip.css

@@ -0,0 +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}}}
+/*# sourceMappingURL=chip.css.map */

package/dist/components/chip.css.map

@@ -0,0 +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":[]}

package/dist/components/code-snippet.css

@@ -0,0 +1,2 @@
+@layer ddga-components{.ddga-code-snippet{--ddga-code-snippet-line-height:1.5rem;background-color:var(--ddga-color-card);color:var(--ddga-text-primary);border:1px solid var(--ddga-color-border);border-radius:var(--ddga-radius-xl);flex-direction:column;display:flex;overflow:clip}.ddga-code-snippet__tabs{gap:0}.ddga-code-snippet__tab-list{inline-size:100%}.ddga-code-snippet .ddga-tabs__trigger{padding-block:var(--ddga-space-4)}.ddga-code-snippet__tab-content{margin:0;padding:0}.ddga-code-snippet__panel{flex-direction:column;display:flex;position:relative}.ddga-code-snippet__viewport{align-items:stretch;display:flex;overflow:hidden}.ddga-code-snippet__viewport--collapsed{max-block-size:calc(var(--ddga-code-snippet-max-lines) * var(--ddga-code-snippet-line-height) + var(--ddga-space-6))}.ddga-code-snippet__gutter{padding:var(--ddga-space-6);background-color:var(--ddga-gray-50);border-inline-end:1px solid var(--ddga-color-border);font-family:var(--ddga-font-mono);font-size:1rem;font-weight:700;line-height:var(--ddga-code-snippet-line-height);color:var(--ddga-gray-500);text-align:end;-webkit-user-select:none;user-select:none;flex-direction:column;flex-shrink:0;align-items:flex-end;display:flex}.ddga-code-snippet__line-number{display:block}.ddga-code-snippet__scroll{min-inline-size:0;padding-block:var(--ddga-space-6) var(--ddga-space-8);padding-inline:var(--ddga-space-6) calc(var(--ddga-space-6) + 2.5rem);flex:auto;overflow-x:auto}.ddga-code-snippet__code{font-family:var(--ddga-font-mono);font-size:1rem;font-weight:500;line-height:var(--ddga-code-snippet-line-height);color:var(--ddga-text-primary);margin:0}.ddga-code-snippet__code code{font:inherit}.ddga-code-snippet__line{white-space:pre;display:block}.ddga-code-snippet__line:empty:after{content:"​"}.ddga-code-snippet__line--comment{color:var(--ddga-text-placeholder)}.ddga-code-snippet__copy-button{border-radius:var(--ddga-radius-sm);color:var(--ddga-text-primary);cursor:pointer;background-color:#0000;border:0;flex-shrink:0;justify-content:center;align-items:center;transition:background-color .15s;display:inline-flex}.ddga-code-snippet__copy-button:hover{background-color:var(--ddga-color-muted)}.ddga-code-snippet__copy-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ddga-text-primary);outline:none}.ddga-code-snippet__copy-button--md{block-size:2.5rem;inline-size:2.5rem}.ddga-code-snippet__copy-button--md>svg{block-size:1.5rem;inline-size:1.5rem}.ddga-code-snippet__copy-button--sm{block-size:2rem;inline-size:2rem}.ddga-code-snippet__copy-button--sm>svg{block-size:1.25rem;inline-size:1.25rem}.ddga-code-snippet__panel>.ddga-code-snippet__copy-button{z-index:1;position:absolute;inset-block-start:var(--ddga-space-4);inset-inline-end:var(--ddga-space-4)}.ddga-code-snippet__show-more{align-self:flex-end;align-items:center;gap:var(--ddga-space-1);margin-block:var(--ddga-space-2) var(--ddga-space-6);block-size:2rem;padding-inline:var(--ddga-space-3);border-radius:var(--ddga-radius-sm);font-weight:500;font-size:var(--ddga-font-size-sm);color:var(--ddga-text-primary);cursor:pointer;background-color:#0000;border:0;margin-inline-end:var(--ddga-space-6);line-height:1.25rem;display:inline-flex}.ddga-code-snippet__show-more:hover{background-color:var(--ddga-color-muted)}.ddga-code-snippet__show-more:focus-visible{box-shadow:inset 0 0 0 2px var(--ddga-text-primary);outline:none}.ddga-code-snippet__show-more-icon{block-size:1.25rem;inline-size:1.25rem;transition:transform .15s}.ddga-code-snippet__show-more-icon--up{transform:rotate(180deg)}.ddga-code-snippet-inline{align-items:center;gap:var(--ddga-space-6);padding:var(--ddga-space-6);background-color:var(--ddga-color-card);border:1px solid var(--ddga-color-border);border-radius:var(--ddga-radius-xl);display:flex}.ddga-code-snippet-inline__text{align-items:center;gap:var(--ddga-space-3);min-inline-size:0;font-family:var(--ddga-font-mono);white-space:nowrap;flex:auto;font-size:1rem;font-weight:400;line-height:1.5rem;display:flex;overflow-x:auto}.ddga-code-snippet-inline__prefix{color:var(--ddga-gold-600);flex-shrink:0}.ddga-code-snippet-inline__command{color:var(--ddga-color-primary)}[data-theme=dark] .ddga-code-snippet__gutter{background-color:var(--ddga-color-muted)}[data-theme=dark] .ddga-code-snippet__line-number{color:var(--ddga-text-tertiary)}@media (forced-colors:active){.ddga-code-snippet,.ddga-code-snippet-inline{border-color:canvastext}.ddga-code-snippet__gutter{border-inline-end-color:canvastext}}}
+/*# sourceMappingURL=code-snippet.css.map */

package/dist/components/code-snippet.css.map

@@ -0,0 +1 @@
+{"version":3,"mappings":"AAAA,uBAEE,gQAYA,+BAGA,8CAGA,yEAGA,mDAKA,+EAMA,8EAKA,6JAOA,6ZAgBA,8CAIA,mMASA,mLAQA,2CAGA,uDAIA,mDAGA,qEAIA,+PAYA,+EAGA,+GAIA,yEAIA,6EAIA,qEAIA,+EAKA,iKAOA,wbAkBA,6EAGA,6GAIA,oGAKA,gEAIA,oOASA,2OAaA,2EAIA,mEAKA,sFAGA,kFAKA,8BACE,qEAIA","sources":["src/components/code-snippet.css"],"sourcesContent":["@layer ddga-components {\n  /* Always LTR (forced at the root); code + gutter share one line-height so numbers stay aligned. */\n  .ddga-code-snippet {\n    --ddga-code-snippet-line-height: 1.5rem;\n    display: flex;\n    flex-direction: column;\n    background-color: var(--ddga-color-card);\n    color: var(--ddga-text-primary);\n    border: 1px solid var(--ddga-color-border);\n    border-radius: var(--ddga-radius-xl);\n    overflow: clip;\n  }\n\n  /* Tab bar flush against the body (drop the Tabs wrapper gap); rail spans the card. */\n  .ddga-code-snippet__tabs {\n    gap: 0;\n  }\n  .ddga-code-snippet__tab-list {\n    inline-size: 100%;\n  }\n  .ddga-code-snippet .ddga-tabs__trigger {\n    padding-block: var(--ddga-space-4); /* SDGA tab padding 16px (md default 12) */\n  }\n  .ddga-code-snippet__tab-content {\n    margin: 0;\n    padding: 0;\n  }\n\n  .ddga-code-snippet__panel {\n    position: relative;\n    display: flex;\n    flex-direction: column;\n  }\n\n  .ddga-code-snippet__viewport {\n    display: flex;\n    align-items: stretch;\n    overflow: hidden;\n  }\n  .ddga-code-snippet__viewport--collapsed {\n    max-block-size: calc(\n      var(--ddga-code-snippet-max-lines) * var(--ddga-code-snippet-line-height) +\n        var(--ddga-space-6)\n    );\n  }\n\n  .ddga-code-snippet__gutter {\n    flex-shrink: 0;\n    display: flex;\n    flex-direction: column;\n    align-items: flex-end;\n    padding: var(--ddga-space-6);\n    background-color: var(--ddga-gray-50);\n    border-inline-end: 1px solid var(--ddga-color-border);\n    font-family: var(--ddga-font-mono);\n    font-weight: 700;\n    font-size: 1rem;\n    line-height: var(--ddga-code-snippet-line-height);\n    color: var(--ddga-gray-500);\n    text-align: end;\n    user-select: none;\n  }\n  .ddga-code-snippet__line-number {\n    display: block;\n  }\n\n  .ddga-code-snippet__scroll {\n    flex: 1 1 auto;\n    min-inline-size: 0;\n    overflow-x: auto;\n    padding-block: var(--ddga-space-6) var(--ddga-space-8);\n    /* reserve inline-end room so the copy button never overlaps code */\n    padding-inline: var(--ddga-space-6) calc(var(--ddga-space-6) + 2.5rem);\n  }\n\n  .ddga-code-snippet__code {\n    margin: 0;\n    font-family: var(--ddga-font-mono);\n    font-weight: 500;\n    font-size: 1rem;\n    line-height: var(--ddga-code-snippet-line-height);\n    color: var(--ddga-text-primary);\n  }\n  .ddga-code-snippet__code code {\n    font: inherit;\n  }\n  .ddga-code-snippet__line {\n    display: block;\n    white-space: pre;\n  }\n  .ddga-code-snippet__line:empty::after {\n    content: '\\200B';\n  }\n  .ddga-code-snippet__line--comment {\n    color: var(--ddga-text-placeholder);\n  }\n\n  .ddga-code-snippet__copy-button {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    border: 0;\n    background-color: transparent;\n    border-radius: var(--ddga-radius-sm);\n    color: var(--ddga-text-primary);\n    cursor: pointer;\n    transition: background-color 150ms ease;\n  }\n  .ddga-code-snippet__copy-button:hover {\n    background-color: var(--ddga-color-muted);\n  }\n  .ddga-code-snippet__copy-button:focus-visible {\n    outline: none;\n    box-shadow: inset 0 0 0 2px var(--ddga-text-primary);\n  }\n  .ddga-code-snippet__copy-button--md {\n    inline-size: 2.5rem;\n    block-size: 2.5rem;\n  }\n  .ddga-code-snippet__copy-button--md > svg {\n    inline-size: 1.5rem;\n    block-size: 1.5rem;\n  }\n  .ddga-code-snippet__copy-button--sm {\n    inline-size: 2rem;\n    block-size: 2rem;\n  }\n  .ddga-code-snippet__copy-button--sm > svg {\n    inline-size: 1.25rem;\n    block-size: 1.25rem;\n  }\n  /* Block copy floats at the top inline-end of the panel. */\n  .ddga-code-snippet__panel > .ddga-code-snippet__copy-button {\n    position: absolute;\n    inset-block-start: var(--ddga-space-4);\n    inset-inline-end: var(--ddga-space-4);\n    z-index: 1;\n  }\n\n  .ddga-code-snippet__show-more {\n    align-self: flex-end;\n    display: inline-flex;\n    align-items: center;\n    gap: var(--ddga-space-1);\n    margin-block: var(--ddga-space-2) var(--ddga-space-6);\n    margin-inline-end: var(--ddga-space-6);\n    block-size: 2rem;\n    padding-inline: var(--ddga-space-3);\n    border: 0;\n    background-color: transparent;\n    border-radius: var(--ddga-radius-sm);\n    font-weight: 500;\n    font-size: var(--ddga-font-size-sm);\n    line-height: 1.25rem;\n    color: var(--ddga-text-primary);\n    cursor: pointer;\n  }\n  .ddga-code-snippet__show-more:hover {\n    background-color: var(--ddga-color-muted);\n  }\n  .ddga-code-snippet__show-more:focus-visible {\n    outline: none;\n    box-shadow: inset 0 0 0 2px var(--ddga-text-primary);\n  }\n  .ddga-code-snippet__show-more-icon {\n    inline-size: 1.25rem;\n    block-size: 1.25rem;\n    transition: transform 150ms ease;\n  }\n  .ddga-code-snippet__show-more-icon--up {\n    transform: rotate(180deg);\n  }\n\n  .ddga-code-snippet-inline {\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-6);\n    padding: var(--ddga-space-6);\n    background-color: var(--ddga-color-card);\n    border: 1px solid var(--ddga-color-border);\n    border-radius: var(--ddga-radius-xl);\n  }\n  .ddga-code-snippet-inline__text {\n    flex: 1 1 auto;\n    min-inline-size: 0;\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-3);\n    overflow-x: auto;\n    font-family: var(--ddga-font-mono);\n    font-weight: 400;\n    font-size: 1rem;\n    line-height: 1.5rem;\n    white-space: nowrap;\n  }\n  .ddga-code-snippet-inline__prefix {\n    flex-shrink: 0;\n    color: var(--ddga-gold-600);\n  }\n  .ddga-code-snippet-inline__command {\n    color: var(--ddga-color-primary);\n  }\n\n  /* Raw surfaces don't auto-adapt; ink/comments do via tokens. */\n  [data-theme='dark'] .ddga-code-snippet__gutter {\n    background-color: var(--ddga-color-muted);\n  }\n  [data-theme='dark'] .ddga-code-snippet__line-number {\n    color: var(--ddga-text-tertiary);\n  }\n\n  /* High-contrast: keep card/gutter edges visible. */\n  @media (forced-colors: active) {\n    .ddga-code-snippet,\n    .ddga-code-snippet-inline {\n      border-color: CanvasText;\n    }\n    .ddga-code-snippet__gutter {\n      border-inline-end-color: CanvasText;\n    }\n  }\n}\n"],"names":[]}

package/dist/components/content-switcher.css

@@ -0,0 +1,2 @@
+@layer ddga-components{.ddga-content-switcher{align-items:stretch;inline-size:fit-content;display:inline-flex}.ddga-content-switcher__item{border:0 solid var(--ddga-color-input);background-color:var(--ddga-color-secondary);min-inline-size:76px;color:var(--ddga-text-primary);font:inherit;font-weight:var(--ddga-font-weight-regular);white-space:nowrap;cursor:pointer;-webkit-user-select:none;user-select:none;justify-content:center;align-items:center;transition:background-color .15s,color .15s;display:inline-flex}.ddga-content-switcher__item+.ddga-content-switcher__item{border-inline-start-width:.5px}.ddga-content-switcher__item:first-child{border-start-start-radius:var(--ddga-radius-md);border-end-start-radius:var(--ddga-radius-md)}.ddga-content-switcher__item:last-child{border-start-end-radius:var(--ddga-radius-md);border-end-end-radius:var(--ddga-radius-md)}.ddga-content-switcher__item[data-state=on]{background-color:var(--ddga-color-foreground);color:var(--ddga-color-background)}.ddga-content-switcher--sm .ddga-content-switcher__item{block-size:32px;padding-inline:var(--ddga-space-2);font-size:var(--ddga-font-size-base);line-height:24px}.ddga-content-switcher--md .ddga-content-switcher__item{block-size:40px;padding-inline:var(--ddga-space-3);font-size:var(--ddga-font-size-lg);line-height:28px}.ddga-content-switcher--lg .ddga-content-switcher__item{block-size:48px;padding-inline:var(--ddga-space-4);font-size:var(--ddga-font-size-xl);line-height:30px}.ddga-content-switcher--on-color .ddga-content-switcher__item{border-color:var(--ddga-alpha-white-10);background-color:var(--ddga-alpha-white-20);color:#fff}.ddga-content-switcher--on-color .ddga-content-switcher__item[data-state=on]{background-color:var(--ddga-color-primary);color:var(--ddga-color-primary-foreground)}.ddga-content-switcher__item:disabled{cursor:not-allowed;opacity:.5}.ddga-content-switcher__item:focus-visible{z-index:1;outline:2px solid var(--ddga-text-primary);outline-offset:-2px;box-shadow:inset 0 0 0 3px var(--ddga-color-background);position:relative}@media (prefers-reduced-motion:reduce){.ddga-content-switcher__item{transition:none}}@media (forced-colors:active){.ddga-content-switcher__item[data-state=on]{color:highlighttext;background-color:highlight}.ddga-content-switcher__item:focus-visible{outline-color:highlight}}}
+/*# sourceMappingURL=content-switcher.css.map */

package/dist/components/content-switcher.css.map

@@ -0,0 +1 @@
+{"version":3,"mappings":"AAAA,uBAME,uFAMA,oZAmBA,yFAKA,uIAIA,kIAMA,6HAOA,iKAMA,+JAMA,+JASA,6JAKA,mKAOA,oEAOA,8LAQA,uCACE,8CAKF,8BACE,2FAIA","sources":["src/components/content-switcher.css"],"sourcesContent":["@layer ddga-components {\n  /* SDGA Content Switcher — a segmented control. Items butt together into one\n     bar with 0.5px dividers; the container has no surface of its own (outer\n     radius comes from the first/last items). Radix sets [data-state='on'] on\n     the selected item. */\n\n  .ddga-content-switcher {\n    display: inline-flex;\n    align-items: stretch;\n    inline-size: fit-content;\n  }\n\n  .ddga-content-switcher__item {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    min-inline-size: 76px;\n    border: 0 solid var(--ddga-color-input);\n    background-color: var(--ddga-color-secondary);\n    color: var(--ddga-text-primary);\n    font: inherit;\n    font-weight: var(--ddga-font-weight-regular);\n    white-space: nowrap;\n    cursor: pointer;\n    user-select: none;\n    transition:\n      background-color 150ms ease,\n      color 150ms ease;\n  }\n\n  /* 0.5px divider between segments (logical → flips RTL) */\n  .ddga-content-switcher__item + .ddga-content-switcher__item {\n    border-inline-start-width: 0.5px;\n  }\n\n  /* outer rounding only (radius-md 8) */\n  .ddga-content-switcher__item:first-child {\n    border-start-start-radius: var(--ddga-radius-md);\n    border-end-start-radius: var(--ddga-radius-md);\n  }\n  .ddga-content-switcher__item:last-child {\n    border-start-end-radius: var(--ddga-radius-md);\n    border-end-end-radius: var(--ddga-radius-md);\n  }\n\n  /* selected → black fill, adapting on-foreground text */\n  .ddga-content-switcher__item[data-state='on'] {\n    background-color: var(--ddga-color-foreground);\n    color: var(--ddga-color-background);\n  }\n\n  /* ─── Sizes (height / inline padding / font: 32·8·16 / 40·12·18 / 48·16·20) ─── */\n\n  .ddga-content-switcher--sm .ddga-content-switcher__item {\n    block-size: 32px;\n    padding-inline: var(--ddga-space-2);\n    font-size: var(--ddga-font-size-base);\n    line-height: 24px;\n  }\n  .ddga-content-switcher--md .ddga-content-switcher__item {\n    block-size: 40px;\n    padding-inline: var(--ddga-space-3);\n    font-size: var(--ddga-font-size-lg);\n    line-height: 28px;\n  }\n  .ddga-content-switcher--lg .ddga-content-switcher__item {\n    block-size: 48px;\n    padding-inline: var(--ddga-space-4);\n    font-size: var(--ddga-font-size-xl);\n    line-height: 30px;\n  }\n\n  /* ─── On-color (on a dark / brand surface) ─── */\n\n  .ddga-content-switcher--on-color .ddga-content-switcher__item {\n    border-color: var(--ddga-alpha-white-10);\n    background-color: var(--ddga-alpha-white-20);\n    color: #fff;\n  }\n  .ddga-content-switcher--on-color .ddga-content-switcher__item[data-state='on'] {\n    background-color: var(--ddga-color-primary);\n    color: var(--ddga-color-primary-foreground);\n  }\n\n  /* Disabled — not an SDGA state; a minimal safe affordance (Radix passes\n     `disabled` through). */\n  .ddga-content-switcher__item:disabled {\n    cursor: not-allowed;\n    opacity: 0.5;\n  }\n\n  /* ─── Focus: 2px #161616 ink ring + 1px inset white (raised over neighbors) ─── */\n\n  .ddga-content-switcher__item:focus-visible {\n    position: relative;\n    z-index: 1;\n    outline: 2px solid var(--ddga-text-primary);\n    outline-offset: -2px;\n    box-shadow: inset 0 0 0 3px var(--ddga-color-background);\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-content-switcher__item {\n      transition: none;\n    }\n  }\n\n  @media (forced-colors: active) {\n    .ddga-content-switcher__item[data-state='on'] {\n      background-color: Highlight;\n      color: HighlightText;\n    }\n    .ddga-content-switcher__item:focus-visible {\n      outline-color: Highlight;\n    }\n  }\n}\n"],"names":[]}

package/dist/components/date-picker.css

@@ -1,2 +1,2 @@
-@layer ddga-components{.ddga-date-picker__label{align-items:center;gap:var(--ddga-space-1);font-size:var(--ddga-font-size-sm);font-weight:var(--ddga-font-weight-medium);color:var(--ddga-color-foreground);display:inline-flex}.ddga-date-picker__required{color:var(--ddga-color-error);margin-inline-start:.125rem}.ddga-date-picker-trigger{align-items:center;gap:var(--ddga-space-2);border:1px solid var(--ddga-color-input);border-radius:var(--ddga-radius-md);background-color:var(--ddga-color-background);inline-size:100%;color:var(--ddga-color-foreground);text-align:start;transition:border-color .12s,box-shadow .12s;display:inline-flex}.ddga-date-picker-trigger--sm{block-size:32px;padding-inline:var(--ddga-space-3);font-size:var(--ddga-font-size-sm)}.ddga-date-picker-trigger--md{block-size:36px;padding-inline:var(--ddga-space-4);font-size:var(--ddga-font-size-base)}.ddga-date-picker-trigger[data-focus-within]{border-color:var(--ddga-color-ring);box-shadow:0 0 0 1px var(--ddga-color-ring)}.ddga-date-picker-trigger[data-disabled]{opacity:.5;cursor:not-allowed;background-color:var(--ddga-color-muted)}.ddga-date-picker-trigger--error{border-color:var(--ddga-color-error)}.ddga-date-picker-trigger--error[data-focus-within]{border-color:var(--ddga-color-error);box-shadow:0 0 0 1px var(--ddga-color-error)}.ddga-date-picker__input{font-variant-numeric:tabular-nums;direction:ltr;flex: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-color-foreground);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-text-placeholder)}.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-text-tertiary);padding-inline:0}.ddga-date-picker__segment[data-type=literal][data-focused]{color:var(--ddga-text-tertiary);background-color:#0000}.ddga-date-picker__icon-button{border-radius:var(--ddga-radius-sm);block-size:1.5rem;inline-size:1.5rem;color:var(--ddga-text-secondary);cursor:pointer;background-color:#0000;border:0;outline:none;flex-shrink:0;justify-content:center;align-items:center;margin-inline-start:auto;padding:0;display:inline-flex}.ddga-date-picker__icon-button:hover{color:var(--ddga-color-foreground);background-color:var(--ddga-color-muted)}.ddga-date-picker__icon-button[data-focus-visible]{box-shadow:0 0 0 2px var(--ddga-color-ring)}.ddga-date-picker__icon-button[data-disabled]{cursor:not-allowed}.ddga-date-picker__icon{block-size:1em;inline-size:1em}@media (prefers-reduced-motion:reduce){.ddga-date-picker-trigger{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__segment[data-focused]{forced-color-adjust:none;color:highlighttext;background-color:highlight}.ddga-date-picker__icon-button[data-focus-visible]{outline-offset:2px;box-shadow:none;outline:2px solid highlight}}}
+@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[data-focus-within]:not([data-pressed]):after{content:"";inset-inline:0;background-color:var(--ddga-gray-950);block-size:2px;position:absolute;bottom:-1px}.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{content:"";inset-inline:25%;background-color:var(--ddga-gray-950);block-size:2px;position:absolute;bottom:-1px}.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[data-focus-within]:after,[data-theme=dark] .ddga-date-picker-trigger[data-pressed]:not([data-disabled]):not([data-readonly]):after,[data-theme=dark] .ddga-date-picker-trigger--pressed: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{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,yMAQA,sFAUA,sUAeA,oHAKA,sHAMA,6HAKA,gHAMA,sEAGA,sIAOA,4IAcA,iDAIA,8NAUA,gFAIA,+HAQA,+FAIA,mHAOA,oTAgBA,iHAIA,+FAGA,iEAGA,uDAOA,uCACE,2CAOF,8BACE,sDAGA,4FAIA,iHAKA","sources":["src/components/date-picker.css"],"sourcesContent":["@layer ddga-components {\n  /* DatePicker field/trigger chrome only. The calendar dropdown (popover,\n     toggle, month grid) is shared with DateRangePicker — see calendar.css.\n     Wrapper (.ddga-field) + helper/error (.ddga-field__message) are shared —\n     see field.css. */\n\n  /* ─── Label + required ─── */\n\n  .ddga-date-picker__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-medium);\n    color: var(--ddga-color-foreground);\n  }\n  .ddga-date-picker__required {\n    color: var(--ddga-color-error);\n    margin-inline-start: 0.125rem;\n  }\n\n  /* ─── Trigger (react-aria Group, hosts segments + icon button) ─── */\n\n  /* Heights match Input/Select so DatePicker triggers line up in a form row.\n     The Group itself is the border/focus container — react-aria emits\n     data-focus-within when any segment or the icon button has focus. */\n  .ddga-date-picker-trigger {\n    display: inline-flex;\n    align-items: center;\n    gap: var(--ddga-space-2);\n    inline-size: 100%;\n    border: 1px solid var(--ddga-color-input);\n    border-radius: var(--ddga-radius-md);\n    background-color: var(--ddga-color-background);\n    color: var(--ddga-color-foreground);\n    text-align: start;\n    transition:\n      border-color 120ms ease,\n      box-shadow 120ms ease;\n  }\n\n  .ddga-date-picker-trigger--sm {\n    block-size: 32px;\n    padding-inline: var(--ddga-space-3);\n    font-size: var(--ddga-font-size-sm);\n  }\n  .ddga-date-picker-trigger--md {\n    block-size: 36px;\n    padding-inline: var(--ddga-space-4);\n    font-size: var(--ddga-font-size-base);\n  }\n\n  .ddga-date-picker-trigger[data-focus-within] {\n    border-color: var(--ddga-color-ring);\n    box-shadow: 0 0 0 1px var(--ddga-color-ring);\n  }\n\n  .ddga-date-picker-trigger[data-disabled] {\n    opacity: 0.5;\n    cursor: not-allowed;\n    background-color: var(--ddga-color-muted);\n  }\n\n  .ddga-date-picker-trigger--error {\n    border-color: var(--ddga-color-error);\n  }\n  .ddga-date-picker-trigger--error[data-focus-within] {\n    border-color: var(--ddga-color-error);\n    box-shadow: 0 0 0 1px var(--ddga-color-error);\n  }\n\n  /* ─── DateInput + Segments ─── */\n\n  .ddga-date-picker__input {\n    display: inline-flex;\n    align-items: center;\n    flex: 1 1 auto;\n    min-inline-size: 0;\n    /* LTR default: segments read day-month-year left-to-right. */\n    direction: ltr;\n    font-variant-numeric: tabular-nums;\n  }\n\n  /* RTL: segments must flow right-to-left so an Arabic date reads naturally —\n     day (rightmost) → month → year → era (هـ, leftmost). react-aria emits the\n     segments in that logical order (day, month, year, era); the LTR default\n     above would lay them out reversed (day on the left, era on the right). */\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-color-foreground);\n    font-variant-numeric: tabular-nums;\n    outline: none;\n    -webkit-tap-highlight-color: transparent;\n  }\n\n  .ddga-date-picker__segment[data-placeholder] {\n    color: var(--ddga-text-placeholder);\n  }\n\n  .ddga-date-picker__segment[data-focused] {\n    background-color: var(--ddga-color-primary);\n    color: var(--ddga-color-primary-foreground);\n  }\n\n  /* Non-editable segments (literal separators like \"/\" or \"-\") shouldn't show\n     the focus background even if Tab lands on them — react-aria marks them with\n     data-type=\"literal\". */\n  .ddga-date-picker__segment[data-type='literal'] {\n    padding-inline: 0;\n    color: var(--ddga-text-tertiary);\n  }\n  .ddga-date-picker__segment[data-type='literal'][data-focused] {\n    background-color: transparent;\n    color: var(--ddga-text-tertiary);\n  }\n\n  /* ─── Calendar icon button (popover trigger) ─── */\n\n  .ddga-date-picker__icon-button {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    inline-size: 1.5rem;\n    block-size: 1.5rem;\n    margin-inline-start: auto;\n    padding: 0;\n    border: 0;\n    border-radius: var(--ddga-radius-sm);\n    background-color: transparent;\n    color: var(--ddga-text-secondary);\n    cursor: pointer;\n    outline: none;\n  }\n  .ddga-date-picker__icon-button:hover {\n    color: var(--ddga-color-foreground);\n    background-color: var(--ddga-color-muted);\n  }\n  .ddga-date-picker__icon-button[data-focus-visible] {\n    box-shadow: 0 0 0 2px var(--ddga-color-ring);\n  }\n  .ddga-date-picker__icon-button[data-disabled] {\n    cursor: not-allowed;\n  }\n  .ddga-date-picker__icon {\n    inline-size: 1em;\n    block-size: 1em;\n  }\n\n  /* ─── Reduced motion ─── */\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-date-picker-trigger {\n      transition: none;\n    }\n  }\n\n  /* ─── Forced colors (Windows High Contrast) ─── */\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__segment[data-focused] {\n      forced-color-adjust: none;\n      background-color: Highlight;\n      color: HighlightText;\n    }\n    .ddga-date-picker__icon-button[data-focus-visible] {\n      outline: 2px solid Highlight;\n      outline-offset: 2px;\n      box-shadow: none;\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,8EAGA,oLAcA,2JAIA,gPAYA,uKAQA,2IAKA,4DAGA,mWAWA,kGAMA,gHAIA,4EAGA,kGAGA,gKAIA,8HAGA,oRAMA,kMAKA,4JAIA,8NASA,uCACE,2CAOF,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  .ddga-date-picker-trigger[data-focus-within]:not([data-pressed])::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  }\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    content: '';\n    position: absolute;\n    inset-inline: 25%;\n    bottom: -1px;\n    block-size: 2px;\n    background-color: var(--ddga-gray-950);\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[data-focus-within]::after,\n  [data-theme='dark']\n    .ddga-date-picker-trigger[data-pressed]:not([data-disabled]):not([data-readonly])::after,\n  [data-theme='dark'] .ddga-date-picker-trigger--pressed::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      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-date-range-picker__label{align-items:center;gap:var(--ddga-space-1);font-size:var(--ddga-font-size-sm);font-weight:var(--ddga-font-weight-medium);color:var(--ddga-color-foreground);display:inline-flex}.ddga-date-range-picker__required{color:var(--ddga-color-error);margin-inline-start:.125rem}.ddga-date-range-picker-trigger{align-items:center;gap:var(--ddga-space-1);border:1px solid var(--ddga-color-input);border-radius:var(--ddga-radius-md);background-color:var(--ddga-color-background);inline-size:100%;color:var(--ddga-color-foreground);text-align:start;transition:border-color .12s,box-shadow .12s;display:inline-flex}.ddga-date-range-picker-trigger--sm{block-size:32px;padding-inline:var(--ddga-space-3);font-size:var(--ddga-font-size-sm)}.ddga-date-range-picker-trigger--md{block-size:36px;padding-inline:var(--ddga-space-4);font-size:var(--ddga-font-size-base)}.ddga-date-range-picker-trigger[data-focus-within]{border-color:var(--ddga-color-ring);box-shadow:0 0 0 1px var(--ddga-color-ring)}.ddga-date-range-picker-trigger[data-disabled]{opacity:.5;cursor:not-allowed;background-color:var(--ddga-color-muted)}.ddga-date-range-picker-trigger--error{border-color:var(--ddga-color-error)}.ddga-date-range-picker-trigger--error[data-focus-within]{border-color:var(--ddga-color-error);box-shadow:0 0 0 1px var(--ddga-color-error)}.ddga-date-range-picker__input{font-variant-numeric:tabular-nums;direction:ltr;flex:none;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-color-foreground);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-text-placeholder)}.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-text-tertiary);padding-inline:0}.ddga-date-range-picker__segment[data-type=literal][data-focused]{color:var(--ddga-text-tertiary);background-color:#0000}.ddga-date-range-picker__separator{padding-inline:var(--ddga-space-1);color:var(--ddga-text-tertiary);flex:none}.ddga-date-range-picker__icon-button{border-radius:var(--ddga-radius-sm);block-size:1.5rem;inline-size:1.5rem;color:var(--ddga-text-secondary);cursor:pointer;background-color:#0000;border:0;outline:none;flex-shrink:0;justify-content:center;align-items:center;margin-inline-start:auto;padding:0;display:inline-flex}.ddga-date-range-picker__icon-button:hover{color:var(--ddga-color-foreground);background-color:var(--ddga-color-muted)}.ddga-date-range-picker__icon-button[data-focus-visible]{box-shadow:0 0 0 2px var(--ddga-color-ring)}.ddga-date-range-picker__icon-button[data-disabled]{cursor:not-allowed}.ddga-date-range-picker__icon{block-size:1em;inline-size:1em}.ddga-calendar--range td:has([data-selected]){background-color:color-mix(in srgb, var(--ddga-color-primary) 12%, transparent)}.ddga-calendar--range td:has([data-selection-start]){border-start-start-radius:var(--ddga-radius-sm);border-end-start-radius:var(--ddga-radius-sm)}.ddga-calendar--range td:has([data-selection-end]){border-start-end-radius:var(--ddga-radius-sm);border-end-end-radius:var(--ddga-radius-sm)}.ddga-calendar--range .ddga-calendar__cell[data-selected]:not([data-selection-start]):not([data-selection-end]){color:var(--ddga-color-foreground);background-color:#0000}@media (prefers-reduced-motion:reduce){.ddga-date-range-picker-trigger{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-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[data-focus-within]:not([data-pressed]):after{content:"";inset-inline:0;background-color:var(--ddga-gray-950);block-size:2px;position:absolute;bottom:-1px}.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{content:"";inset-inline:25%;background-color:var(--ddga-gray-950);block-size:2px;position:absolute;bottom:-1px}.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[data-focus-within]:after,[data-theme=dark] .ddga-date-range-picker-trigger[data-pressed]:not([data-disabled]):not([data-readonly]):after,[data-theme=dark] .ddga-date-range-picker-trigger--pressed: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{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,+MAQA,4FAOA,4UAeA,0HAKA,4HAMA,mIAKA,sHAMA,4EAGA,4IAOA,kJAgBA,uDAIA,oOASA,sFAGA,qIAIA,qGAIA,yHAKA,gHAQA,0TAgBA,uHAIA,qGAGA,uEAGA,6DAeA,8HAKA,mJAIA,6IAMA,0KAUA,uCACE,iDAOF,8BACE,4DAGA,kGAMA,yEAGA","sources":["src/components/date-range-picker.css"],"sourcesContent":["@layer ddga-components {\n  /* DateRangePicker field/trigger chrome + range-fill cell styling. The calendar\n     dropdown (popover, toggle, month grid, day cells) is shared with DatePicker —\n     see calendar.css. Wrapper (.ddga-field) + helper/error (.ddga-field__message)\n     are shared — see field.css. */\n\n  /* ─── Label + required ─── */\n\n  .ddga-date-range-picker__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-medium);\n    color: var(--ddga-color-foreground);\n  }\n  .ddga-date-range-picker__required {\n    color: var(--ddga-color-error);\n    margin-inline-start: 0.125rem;\n  }\n\n  /* ─── Trigger (react-aria Group: start input + separator + end input + button) ─── */\n\n  .ddga-date-range-picker-trigger {\n    display: inline-flex;\n    align-items: center;\n    gap: var(--ddga-space-1);\n    inline-size: 100%;\n    border: 1px solid var(--ddga-color-input);\n    border-radius: var(--ddga-radius-md);\n    background-color: var(--ddga-color-background);\n    color: var(--ddga-color-foreground);\n    text-align: start;\n    transition:\n      border-color 120ms ease,\n      box-shadow 120ms ease;\n  }\n\n  .ddga-date-range-picker-trigger--sm {\n    block-size: 32px;\n    padding-inline: var(--ddga-space-3);\n    font-size: var(--ddga-font-size-sm);\n  }\n  .ddga-date-range-picker-trigger--md {\n    block-size: 36px;\n    padding-inline: var(--ddga-space-4);\n    font-size: var(--ddga-font-size-base);\n  }\n\n  .ddga-date-range-picker-trigger[data-focus-within] {\n    border-color: var(--ddga-color-ring);\n    box-shadow: 0 0 0 1px var(--ddga-color-ring);\n  }\n\n  .ddga-date-range-picker-trigger[data-disabled] {\n    opacity: 0.5;\n    cursor: not-allowed;\n    background-color: var(--ddga-color-muted);\n  }\n\n  .ddga-date-range-picker-trigger--error {\n    border-color: var(--ddga-color-error);\n  }\n  .ddga-date-range-picker-trigger--error[data-focus-within] {\n    border-color: var(--ddga-color-error);\n    box-shadow: 0 0 0 1px var(--ddga-color-error);\n  }\n\n  /* ─── DateInputs + segments + separator ─── */\n\n  .ddga-date-range-picker__input {\n    display: inline-flex;\n    align-items: center;\n    flex: 0 0 auto;\n    min-inline-size: 0;\n    /* LTR default: each date reads day-month-year left-to-right. The flex row\n       itself follows page dir, so in RTL the start input still sits on the\n       right (start of the range). */\n    direction: ltr;\n    font-variant-numeric: tabular-nums;\n  }\n\n  /* RTL: each date's segments flow right-to-left so it reads naturally —\n     day (rightmost) → month → year → era (هـ, leftmost). The trigger row keeps\n     following page dir (start input on the right); only the inner segment\n     order flips. Mirrors DatePicker — keep both pickers in lockstep. */\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-color-foreground);\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-text-placeholder);\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-text-tertiary);\n  }\n  .ddga-date-range-picker__segment[data-type='literal'][data-focused] {\n    background-color: transparent;\n    color: var(--ddga-text-tertiary);\n  }\n\n  .ddga-date-range-picker__separator {\n    flex: 0 0 auto;\n    padding-inline: var(--ddga-space-1);\n    color: var(--ddga-text-tertiary);\n  }\n\n  /* ─── Calendar icon button (popover trigger) ─── */\n\n  .ddga-date-range-picker__icon-button {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    inline-size: 1.5rem;\n    block-size: 1.5rem;\n    margin-inline-start: auto;\n    padding: 0;\n    border: 0;\n    border-radius: var(--ddga-radius-sm);\n    background-color: transparent;\n    color: var(--ddga-text-secondary);\n    cursor: pointer;\n    outline: none;\n  }\n  .ddga-date-range-picker__icon-button:hover {\n    color: var(--ddga-color-foreground);\n    background-color: var(--ddga-color-muted);\n  }\n  .ddga-date-range-picker__icon-button[data-focus-visible] {\n    box-shadow: 0 0 0 2px var(--ddga-color-ring);\n  }\n  .ddga-date-range-picker__icon-button[data-disabled] {\n    cursor: not-allowed;\n  }\n  .ddga-date-range-picker__icon {\n    inline-size: 1em;\n    block-size: 1em;\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. We paint a\n     soft connector across the whole range on the <td> (so it spans the full\n     column width and reads continuous), keep the endpoints as solid primary\n     circles (the base .ddga-calendar__cell[data-selected] rule), and make the\n     in-between cells transparent so only the td connector shows behind them. */\n\n  /* Connector bar on the td — spans the full column, unlike the 2rem inner cell. */\n  .ddga-calendar--range td:has([data-selected]) {\n    background-color: color-mix(in srgb, var(--ddga-color-primary) 12%, transparent);\n  }\n  /* Round only the outer edges of the bar (logical → flips in RTL). A single-day\n     range carries both attrs, so it rounds to a full pill. */\n  .ddga-calendar--range td:has([data-selection-start]) {\n    border-start-start-radius: var(--ddga-radius-sm);\n    border-end-start-radius: var(--ddga-radius-sm);\n  }\n  .ddga-calendar--range td:has([data-selection-end]) {\n    border-start-end-radius: var(--ddga-radius-sm);\n    border-end-end-radius: var(--ddga-radius-sm);\n  }\n\n  /* In-between days: let the td connector 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  /* The endpoints stay solid primary (base rule); their secondary calendar text\n     already inherits the contrast color via calendar.css. */\n\n  /* ─── Reduced motion ─── */\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-date-range-picker-trigger {\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    /* color-mix backgrounds disappear in forced-colors — restore a visible range\n       using the Highlight system color on the connector td + endpoints. */\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,oFAGA,0LAQA,uKAIA,4PAYA,yLAKA,uJAKA,kEAGA,qeAUA,wGAWA,kFAGA,uJAIA,iJAKA,0KAQA,sHAIA,kFAGA,wGAGA,4KAIA,oIAIA,sSAMA,8MAKA,wKAIA,kIAQA,uCACE,iDAOF,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  .ddga-date-range-picker-trigger[data-focus-within]:not([data-pressed])::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  }\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    content: '';\n    position: absolute;\n    inset-inline: 25%;\n    bottom: -1px;\n    block-size: 2px;\n    background-color: var(--ddga-gray-950);\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[data-focus-within]::after,\n  [data-theme='dark']\n    .ddga-date-range-picker-trigger[data-pressed]:not([data-disabled]):not([data-readonly])::after,\n  [data-theme='dark'] .ddga-date-range-picker-trigger--pressed::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      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/digital-stamp.css

@@ -0,0 +1,2 @@
+@layer ddga-components{.ddga-digital-stamp{gap:var(--ddga-space-10);inline-size:100%;padding-inline:var(--ddga-space-4);background-color:var(--ddga-color-muted);color:var(--ddga-text-primary);flex-direction:column;padding-block:6px;font-family:inherit;display:flex;overflow:clip;container-type:inline-size}.ddga-digital-stamp[data-state=open]{padding-block-end:var(--ddga-space-4)}.ddga-digital-stamp__row{align-items:flex-start;gap:var(--ddga-space-2);flex-direction:column;display:flex}.ddga-digital-stamp__lead{align-items:flex-start;gap:var(--ddga-space-2);min-inline-size:0;display:flex}.ddga-digital-stamp__flag{border-radius:1px;flex-shrink:0;block-size:14px;inline-size:20px;margin-block-start:.1875rem}.ddga-digital-stamp__statement{min-inline-size:0;font-size:var(--ddga-font-size-sm);line-height:1.25rem;font-weight:var(--ddga-font-weight-medium);color:var(--ddga-text-primary);word-break:break-word;margin:0}.ddga-digital-stamp__trigger{align-items:center;gap:var(--ddga-space-1);font-family:inherit;font-size:var(--ddga-font-size-sm);line-height:1.25rem;font-weight:var(--ddga-font-weight-regular);color:var(--ddga-color-primary);cursor:pointer;border-radius:var(--ddga-radius-sm);background:0 0;border:0;flex-shrink:0;padding:0;display:inline-flex}.ddga-digital-stamp__trigger:focus-visible{box-shadow:0 0 0 2px var(--ddga-text-primary);outline:none}.ddga-digital-stamp__chevron{flex-shrink:0;block-size:16px;inline-size:16px;transition:transform .15s}.ddga-digital-stamp[data-state=open] .ddga-digital-stamp__chevron{transform:rotate(180deg)}.ddga-digital-stamp__panel{gap:var(--ddga-space-10);flex-direction:column;display:flex}.ddga-digital-stamp__panel[hidden]{display:none}.ddga-digital-stamp__extension{gap:var(--ddga-space-4);flex-direction:column;display:flex}.ddga-digital-stamp__column{align-items:flex-start;gap:var(--ddga-space-3);min-inline-size:0;display:flex}.ddga-digital-stamp__icon{border:1px solid var(--ddga-success-700);border-radius:var(--ddga-radius-full);block-size:32px;inline-size:32px;box-shadow:var(--ddga-shadow-xs);color:var(--ddga-success-700);flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.ddga-digital-stamp__icon>svg{block-size:16px;inline-size:16px}.ddga-digital-stamp__content{gap:var(--ddga-space-3);flex-direction:column;min-inline-size:0;display:flex}.ddga-digital-stamp__title{font-size:var(--ddga-font-size-lg);line-height:1.75rem;font-weight:var(--ddga-font-weight-semibold);color:var(--ddga-text-primary);word-break:break-word;margin:0}.ddga-digital-stamp__title strong{font-weight:inherit;color:var(--ddga-color-primary)}.ddga-digital-stamp__description{font-size:var(--ddga-font-size-base);line-height:1.5rem;font-weight:var(--ddga-font-weight-regular);color:var(--ddga-gray-700);word-break:break-word;margin:0}.ddga-digital-stamp__registration{align-items:center;gap:var(--ddga-space-6);padding-inline:var(--ddga-space-6);padding-block:var(--ddga-space-2);background-color:var(--ddga-color-background);border-radius:var(--ddga-radius-md);display:flex}.ddga-digital-stamp__logo{flex-shrink:0;display:inline-flex}.ddga-digital-stamp__logo>svg,.ddga-digital-stamp__logo>img{block-size:31px;inline-size:auto}.ddga-digital-stamp__registration-text{gap:var(--ddga-space-3);flex-direction:column;min-inline-size:0;display:flex}.ddga-digital-stamp__registration-label{font-size:var(--ddga-font-size-base);color:var(--ddga-text-primary);word-break:break-word;margin:0;line-height:1.5rem}.ddga-digital-stamp__registration-link,.ddga-digital-stamp__registration-number{font-size:var(--ddga-font-size-base);color:var(--ddga-color-primary);line-height:1.5rem}.ddga-digital-stamp__registration-link{border-radius:var(--ddga-radius-sm);text-decoration:underline}.ddga-digital-stamp__registration-link:focus-visible{box-shadow:0 0 0 2px var(--ddga-text-primary);outline:none}@container (width>=768px){.ddga-digital-stamp{padding-inline:var(--ddga-space-8)}.ddga-digital-stamp[data-state=closed]{justify-content:center;min-block-size:32px;padding-block:0}.ddga-digital-stamp[data-state=open]{padding-block-end:var(--ddga-space-8)}.ddga-digital-stamp__row{flex-direction:row;align-items:center}.ddga-digital-stamp__lead{align-items:center}.ddga-digital-stamp__flag{margin-block-start:0}.ddga-digital-stamp__extension{gap:var(--ddga-space-4);flex-flow:wrap}.ddga-digital-stamp__column{gap:var(--ddga-space-6);flex:1 1 0}.ddga-digital-stamp__icon{block-size:48px;inline-size:48px}.ddga-digital-stamp__icon>svg{block-size:24px;inline-size:24px}.ddga-digital-stamp__registration-text{align-items:center;gap:var(--ddga-space-3);flex-flow:wrap;row-gap:18px}}[data-theme=dark] .ddga-digital-stamp__description{color:var(--ddga-gray-300)}@media (forced-colors:active){.ddga-digital-stamp__icon{border-color:canvastext}.ddga-digital-stamp__trigger:focus-visible,.ddga-digital-stamp__registration-link:focus-visible{box-shadow:none;outline:2px solid highlight}}}
+/*# sourceMappingURL=digital-stamp.css.map */

package/dist/components/digital-stamp.css.map

@@ -0,0 +1 @@
+{"version":3,"mappings":"AAAA,uBAME,2RAaA,2EAIA,2GAOA,wGAOA,uHAQA,iNAUA,sVAgBA,sGAIA,sGAMA,2FAIA,uFAKA,gDAKA,0FAMA,0GAOA,qRAYA,+DAKA,0GAOA,6LAQA,sFAKA,+LAUA,iPASA,4DAIA,6FAKA,oHAMA,8JAOA,wKAMA,qGAIA,gHAMA,0BACE,uDAGA,kGAKA,2EAGA,+DAIA,6CAGA,+CAGA,sEAKA,+DAIA,2DAIA,+DAIA,+GAUF,8EAIA,8BACE,kDAGA","sources":["src/components/digital-stamp.css"],"sourcesContent":["@layer ddga-components {\n  /*\n   * SDGA Digital Stamp — government-site verification bar (collapsed) that expands to an\n   * explainer panel. Mobile-first; the desktop two-column layout switches in via a container\n   * query so the banner adapts to its own width. SDGA spacing-sm (6px) has no token → literal.\n   */\n  .ddga-digital-stamp {\n    container-type: inline-size;\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-space-10); /* 40 — between the bar row, explainer, and registration */\n    inline-size: 100%;\n    padding-inline: var(--ddga-space-4); /* 16 (mobile) */\n    padding-block: 6px; /* SDGA spacing-sm */\n    background-color: var(--ddga-color-muted);\n    color: var(--ddga-text-primary);\n    font-family: inherit;\n    overflow: clip;\n  }\n  .ddga-digital-stamp[data-state='open'] {\n    padding-block-end: var(--ddga-space-4); /* 16 (mobile) */\n  }\n\n  .ddga-digital-stamp__row {\n    display: flex;\n    flex-direction: column;\n    align-items: flex-start;\n    gap: var(--ddga-space-2); /* 8 */\n  }\n\n  .ddga-digital-stamp__lead {\n    display: flex;\n    align-items: flex-start;\n    gap: var(--ddga-space-2); /* 8 */\n    min-inline-size: 0;\n  }\n\n  .ddga-digital-stamp__flag {\n    flex-shrink: 0;\n    inline-size: 20px;\n    block-size: 14px;\n    margin-block-start: 0.1875rem; /* nudge the 14px flag onto the first text line */\n    border-radius: 1px;\n  }\n\n  .ddga-digital-stamp__statement {\n    margin: 0;\n    min-inline-size: 0;\n    font-size: var(--ddga-font-size-sm); /* 14 */\n    line-height: 1.25rem; /* 20 */\n    font-weight: var(--ddga-font-weight-medium);\n    color: var(--ddga-text-primary);\n    word-break: break-word;\n  }\n\n  .ddga-digital-stamp__trigger {\n    flex-shrink: 0;\n    display: inline-flex;\n    align-items: center;\n    gap: var(--ddga-space-1); /* 4 */\n    padding: 0;\n    border: 0;\n    background: transparent;\n    font-family: inherit;\n    font-size: var(--ddga-font-size-sm); /* 14 */\n    line-height: 1.25rem;\n    font-weight: var(--ddga-font-weight-regular);\n    color: var(--ddga-color-primary);\n    cursor: pointer;\n    border-radius: var(--ddga-radius-sm);\n  }\n  .ddga-digital-stamp__trigger:focus-visible {\n    outline: none;\n    box-shadow: 0 0 0 2px var(--ddga-text-primary);\n  }\n  .ddga-digital-stamp__chevron {\n    flex-shrink: 0;\n    inline-size: 16px;\n    block-size: 16px;\n    transition: transform 150ms ease;\n  }\n  .ddga-digital-stamp[data-state='open'] .ddga-digital-stamp__chevron {\n    transform: rotate(180deg);\n  }\n\n  .ddga-digital-stamp__panel {\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-space-10); /* 40 */\n  }\n  .ddga-digital-stamp__panel[hidden] {\n    display: none;\n  }\n\n  /* Explainer: two columns (Domain Verification + Security Confirmation) */\n  .ddga-digital-stamp__extension {\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-space-4); /* 16 (mobile stack) */\n  }\n\n  .ddga-digital-stamp__column {\n    display: flex;\n    align-items: flex-start;\n    gap: var(--ddga-space-3); /* 12 (mobile) */\n    min-inline-size: 0;\n  }\n\n  .ddga-digital-stamp__icon {\n    flex-shrink: 0;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    inline-size: 32px; /* mobile */\n    block-size: 32px;\n    border: 1px solid var(--ddga-success-700);\n    border-radius: var(--ddga-radius-full);\n    box-shadow: var(--ddga-shadow-xs);\n    color: var(--ddga-success-700);\n  }\n  .ddga-digital-stamp__icon > svg {\n    inline-size: 16px;\n    block-size: 16px;\n  }\n\n  .ddga-digital-stamp__content {\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-space-3); /* 12 */\n    min-inline-size: 0;\n  }\n\n  .ddga-digital-stamp__title {\n    margin: 0;\n    font-size: var(--ddga-font-size-lg); /* 18 */\n    line-height: 1.75rem; /* 28 */\n    font-weight: var(--ddga-font-weight-semibold);\n    color: var(--ddga-text-primary);\n    word-break: break-word;\n  }\n  .ddga-digital-stamp__title strong {\n    font-weight: inherit;\n    color: var(--ddga-color-primary);\n  }\n\n  .ddga-digital-stamp__description {\n    margin: 0;\n    font-size: var(--ddga-font-size-base); /* 16 */\n    line-height: 1.5rem; /* 24 */\n    font-weight: var(--ddga-font-weight-regular);\n    color: var(--ddga-gray-700);\n    word-break: break-word;\n  }\n\n  /* Registration panel (white surface) */\n  .ddga-digital-stamp__registration {\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-6); /* 24 */\n    padding-inline: var(--ddga-space-6); /* 24 */\n    padding-block: var(--ddga-space-2); /* 8 */\n    background-color: var(--ddga-color-background);\n    border-radius: var(--ddga-radius-md);\n  }\n  .ddga-digital-stamp__logo {\n    flex-shrink: 0;\n    display: inline-flex;\n  }\n  .ddga-digital-stamp__logo > svg,\n  .ddga-digital-stamp__logo > img {\n    block-size: 31px;\n    inline-size: auto;\n  }\n  .ddga-digital-stamp__registration-text {\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-space-3); /* 12 (mobile) */\n    min-inline-size: 0;\n  }\n  .ddga-digital-stamp__registration-label {\n    margin: 0;\n    font-size: var(--ddga-font-size-base); /* 16 */\n    line-height: 1.5rem;\n    color: var(--ddga-text-primary);\n    word-break: break-word;\n  }\n  .ddga-digital-stamp__registration-link,\n  .ddga-digital-stamp__registration-number {\n    font-size: var(--ddga-font-size-base);\n    line-height: 1.5rem;\n    color: var(--ddga-color-primary);\n  }\n  .ddga-digital-stamp__registration-link {\n    text-decoration: underline;\n    border-radius: var(--ddga-radius-sm);\n  }\n  .ddga-digital-stamp__registration-link:focus-visible {\n    outline: none;\n    box-shadow: 0 0 0 2px var(--ddga-text-primary);\n  }\n\n  /* Desktop: compact one-line bar + two-column explainer */\n  @container (min-width: 768px) {\n    .ddga-digital-stamp {\n      padding-inline: var(--ddga-space-8); /* 32 */\n    }\n    .ddga-digital-stamp[data-state='closed'] {\n      min-block-size: 32px;\n      padding-block: 0;\n      justify-content: center;\n    }\n    .ddga-digital-stamp[data-state='open'] {\n      padding-block-end: var(--ddga-space-8); /* 32 */\n    }\n    .ddga-digital-stamp__row {\n      flex-direction: row;\n      align-items: center;\n    }\n    .ddga-digital-stamp__lead {\n      align-items: center;\n    }\n    .ddga-digital-stamp__flag {\n      margin-block-start: 0;\n    }\n    .ddga-digital-stamp__extension {\n      flex-direction: row;\n      flex-wrap: wrap;\n      gap: var(--ddga-space-4); /* 16 */\n    }\n    .ddga-digital-stamp__column {\n      flex: 1 1 0;\n      gap: var(--ddga-space-6); /* 24 */\n    }\n    .ddga-digital-stamp__icon {\n      inline-size: 48px;\n      block-size: 48px;\n    }\n    .ddga-digital-stamp__icon > svg {\n      inline-size: 24px;\n      block-size: 24px;\n    }\n    .ddga-digital-stamp__registration-text {\n      flex-direction: row;\n      flex-wrap: wrap;\n      align-items: center;\n      gap: var(--ddga-space-3); /* 12 */\n      row-gap: 18px; /* SDGA panel wrap gap; no token */\n    }\n  }\n\n  /* Dark theme — bg/panel/ink adapt via semantic tokens; the gray-700 body needs lifting */\n  [data-theme='dark'] .ddga-digital-stamp__description {\n    color: var(--ddga-gray-300);\n  }\n\n  @media (forced-colors: active) {\n    .ddga-digital-stamp__icon {\n      border-color: CanvasText;\n    }\n    .ddga-digital-stamp__trigger:focus-visible,\n    .ddga-digital-stamp__registration-link:focus-visible {\n      outline: 2px solid Highlight;\n      box-shadow: none;\n    }\n  }\n}\n"],"names":[]}

package/dist/components/divider.css

@@ -1,2 +1,2 @@
-@layer ddga-components{.ddga-divider{--ddga-divider-color:var(--ddga-color-border);border:0}.ddga-divider--horizontal{border-block-start:1px solid var(--ddga-divider-color);block-size:0;inline-size:100%;display:block}.ddga-divider--vertical{vertical-align:middle;border-inline-start:1px solid var(--ddga-divider-color);block-size:100%;min-block-size:1em;inline-size:0;display:inline-block}.ddga-divider--dashed.ddga-divider--horizontal{border-block-start-style:dashed}.ddga-divider--dashed.ddga-divider--vertical{border-inline-start-style:dashed}.ddga-divider--labeled{align-items:center;gap:var(--ddga-space-3);border-block-start:0;block-size:auto;display:flex}.ddga-divider--labeled:before,.ddga-divider--labeled:after{content:"";border-block-start:1px solid var(--ddga-divider-color);block-size:0}.ddga-divider--labeled.ddga-divider--dashed:before,.ddga-divider--labeled.ddga-divider--dashed:after{border-block-start-style:dashed}.ddga-divider--label-center:before,.ddga-divider--label-center:after{flex:1}.ddga-divider--label-start:before{flex:0 0 var(--ddga-space-6)}.ddga-divider--label-start:after,.ddga-divider--label-end:before{flex:1}.ddga-divider--label-end:after{flex:0 0 var(--ddga-space-6)}.ddga-divider__label{font-size:var(--ddga-font-size-sm);color:var(--ddga-text-secondary);white-space:nowrap}@media (forced-colors:active){.ddga-divider,.ddga-divider--labeled:before,.ddga-divider--labeled:after{border-color:canvastext}}}
+@layer ddga-components{.ddga-divider{--ddga-divider-color:var(--ddga-color-input);border:0}.ddga-divider--tone-neutral{--ddga-divider-color:var(--ddga-color-input)}.ddga-divider--tone-primary{--ddga-divider-color:var(--ddga-color-primary)}.ddga-divider--tone-alpha-white{--ddga-divider-color:var(--ddga-alpha-white-30)}.ddga-divider--tone-white{--ddga-divider-color:#fff}.ddga-divider--horizontal{border-block-start:1px solid var(--ddga-divider-color);block-size:0;inline-size:100%;display:block}.ddga-divider--vertical{vertical-align:middle;border-inline-start:1px solid var(--ddga-divider-color);block-size:100%;min-block-size:1em;inline-size:0;display:inline-block}.ddga-divider--dashed.ddga-divider--horizontal{border-block-start-style:dashed}.ddga-divider--dashed.ddga-divider--vertical{border-inline-start-style:dashed}.ddga-divider--labeled{align-items:center;gap:var(--ddga-space-3);border-block-start:0;block-size:auto;display:flex}.ddga-divider--labeled:before,.ddga-divider--labeled:after{content:"";border-block-start:1px solid var(--ddga-divider-color);block-size:0}.ddga-divider--labeled.ddga-divider--dashed:before,.ddga-divider--labeled.ddga-divider--dashed:after{border-block-start-style:dashed}.ddga-divider--label-center:before,.ddga-divider--label-center:after{flex:1}.ddga-divider--label-start:before{flex:0 0 var(--ddga-space-6)}.ddga-divider--label-start:after,.ddga-divider--label-end:before{flex:1}.ddga-divider--label-end:after{flex:0 0 var(--ddga-space-6)}.ddga-divider__label{font-size:var(--ddga-font-size-sm);color:var(--ddga-text-secondary);white-space:nowrap}@media (forced-colors:active){.ddga-divider,.ddga-divider--labeled:before,.ddga-divider--labeled:after{border-color:canvastext}}}
 /*# sourceMappingURL=divider.css.map */

package/dist/components/divider.css.map

@@ -1 +1 @@
-{"version":3,"mappings":"AAAA,uBAGE,qEAQA,6HAWA,4KAWA,+EAGA,8EAMA,oHAUA,0IAOA,qIAMA,4EAKA,+DAGA,wEAOA,4DAIA,4GAQA,8BACE","sources":["src/components/divider.css"],"sourcesContent":["@layer ddga-components {\n  /* ─── Base ─── */\n\n  .ddga-divider {\n    /* Single hook so consumers can recolor the divider per-instance. */\n    --ddga-divider-color: var(--ddga-color-border);\n    border: 0;\n  }\n\n  /* ─── Plain (no children) ─── */\n\n  .ddga-divider--horizontal {\n    display: block;\n    block-size: 0;\n    inline-size: 100%;\n    /* Use a border so dashed style works naturally without backgrounds. */\n    border-block-start: 1px solid var(--ddga-divider-color);\n  }\n\n  /* `inline-block` so consumers can drop a vertical divider next to inline\n     content (e.g. button rows) without forcing a flex parent. Consumers in a\n     flex/grid row will still pick up the parent's cross-axis sizing. */\n  .ddga-divider--vertical {\n    display: inline-block;\n    inline-size: 0;\n    block-size: 100%;\n    min-block-size: 1em;\n    vertical-align: middle;\n    border-inline-start: 1px solid var(--ddga-divider-color);\n  }\n\n  /* ─── Dashed (overrides solid border style) ─── */\n\n  .ddga-divider--dashed.ddga-divider--horizontal {\n    border-block-start-style: dashed;\n  }\n  .ddga-divider--dashed.ddga-divider--vertical {\n    border-inline-start-style: dashed;\n  }\n\n  /* ─── Labeled (horizontal + children) ─── */\n\n  .ddga-divider--labeled {\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-3);\n    /* Override the plain-bar shape: this row is the divider, not a 0px line\n       with a top border. */\n    block-size: auto;\n    border-block-start: 0;\n  }\n\n  .ddga-divider--labeled::before,\n  .ddga-divider--labeled::after {\n    content: '';\n    block-size: 0;\n    border-block-start: 1px solid var(--ddga-divider-color);\n  }\n\n  .ddga-divider--labeled.ddga-divider--dashed::before,\n  .ddga-divider--labeled.ddga-divider--dashed::after {\n    border-block-start-style: dashed;\n  }\n\n  /* Label positions — `start`/`end` are logical so they flip in RTL. */\n  .ddga-divider--label-center::before,\n  .ddga-divider--label-center::after {\n    flex: 1;\n  }\n\n  .ddga-divider--label-start::before {\n    flex: 0 0 var(--ddga-space-6);\n  }\n  .ddga-divider--label-start::after {\n    flex: 1;\n  }\n\n  .ddga-divider--label-end::before {\n    flex: 1;\n  }\n  .ddga-divider--label-end::after {\n    flex: 0 0 var(--ddga-space-6);\n  }\n\n  .ddga-divider__label {\n    font-size: var(--ddga-font-size-sm);\n    color: var(--ddga-text-secondary);\n    white-space: nowrap;\n  }\n\n  /* ─── Forced colors ─── */\n\n  @media (forced-colors: active) {\n    .ddga-divider {\n      border-color: CanvasText;\n    }\n    .ddga-divider--labeled::before,\n    .ddga-divider--labeled::after {\n      border-color: CanvasText;\n    }\n  }\n}\n"],"names":[]}
+{"version":3,"mappings":"AAAA,uBACE,oEAOA,yEAGA,2EAGA,gFAGA,oDAIA,6HAUA,4KASA,+EAGA,8EAKA,oHAQA,0IAOA,qIAMA,4EAKA,+DAGA,wEAOA,4DAIA,4GAMA,8BACE","sources":["src/components/divider.css"],"sourcesContent":["@layer ddga-components {\n  .ddga-divider {\n    /* Single hook so consumers can recolor per-instance; defaults to SDGA Neutral (gray-300). */\n    --ddga-divider-color: var(--ddga-color-input);\n    border: 0;\n  }\n\n  /* SDGA Color axis — fixed white tones are for colored/dark surfaces (no theme-flip). */\n  .ddga-divider--tone-neutral {\n    --ddga-divider-color: var(--ddga-color-input);\n  }\n  .ddga-divider--tone-primary {\n    --ddga-divider-color: var(--ddga-color-primary);\n  }\n  .ddga-divider--tone-alpha-white {\n    --ddga-divider-color: var(--ddga-alpha-white-30);\n  }\n  .ddga-divider--tone-white {\n    --ddga-divider-color: #ffffff;\n  }\n\n  .ddga-divider--horizontal {\n    display: block;\n    block-size: 0;\n    inline-size: 100%;\n    /* Border (not background) so the dashed style works without a fill. */\n    border-block-start: 1px solid var(--ddga-divider-color);\n  }\n\n  /* `inline-block` so a vertical divider drops next to inline content (e.g. button\n     rows) without forcing a flex parent; flex/grid rows still get cross-axis sizing. */\n  .ddga-divider--vertical {\n    display: inline-block;\n    inline-size: 0;\n    block-size: 100%;\n    min-block-size: 1em;\n    vertical-align: middle;\n    border-inline-start: 1px solid var(--ddga-divider-color);\n  }\n\n  .ddga-divider--dashed.ddga-divider--horizontal {\n    border-block-start-style: dashed;\n  }\n  .ddga-divider--dashed.ddga-divider--vertical {\n    border-inline-start-style: dashed;\n  }\n\n  /* Labeled (horizontal + children): the row IS the divider, not a 0px top-border line. */\n  .ddga-divider--labeled {\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-3);\n    block-size: auto;\n    border-block-start: 0;\n  }\n\n  .ddga-divider--labeled::before,\n  .ddga-divider--labeled::after {\n    content: '';\n    block-size: 0;\n    border-block-start: 1px solid var(--ddga-divider-color);\n  }\n\n  .ddga-divider--labeled.ddga-divider--dashed::before,\n  .ddga-divider--labeled.ddga-divider--dashed::after {\n    border-block-start-style: dashed;\n  }\n\n  /* `start`/`end` are logical so they flip in RTL. */\n  .ddga-divider--label-center::before,\n  .ddga-divider--label-center::after {\n    flex: 1;\n  }\n\n  .ddga-divider--label-start::before {\n    flex: 0 0 var(--ddga-space-6);\n  }\n  .ddga-divider--label-start::after {\n    flex: 1;\n  }\n\n  .ddga-divider--label-end::before {\n    flex: 1;\n  }\n  .ddga-divider--label-end::after {\n    flex: 0 0 var(--ddga-space-6);\n  }\n\n  .ddga-divider__label {\n    font-size: var(--ddga-font-size-sm);\n    color: var(--ddga-text-secondary);\n    white-space: nowrap;\n  }\n\n  @media (forced-colors: active) {\n    .ddga-divider {\n      border-color: CanvasText;\n    }\n    .ddga-divider--labeled::before,\n    .ddga-divider--labeled::after {\n      border-color: CanvasText;\n    }\n  }\n}\n"],"names":[]}

package/dist/components/dropdown-menu.css

@@ -1,2 +1,2 @@
-@layer ddga-components{.ddga-dropdown-menu{min-inline-size:192px;max-inline-size:320px;padding:var(--ddga-space-1);background-color:var(--ddga-color-background);color:var(--ddga-color-foreground);border:1px solid var(--ddga-color-border);border-radius:var(--ddga-radius-md);box-shadow:var(--ddga-shadow-md);z-index:50;outline:none;font-family:inherit}.ddga-dropdown-menu[data-state=open]{animation:.12s cubic-bezier(.16,1,.3,1) ddga-dropdown-menu-in}.ddga-dropdown-menu[data-state=closed]{animation:80ms ease-in ddga-dropdown-menu-out}@keyframes ddga-dropdown-menu-in{0%{opacity:0;transform:translateY(-2px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes ddga-dropdown-menu-out{0%{opacity:1}to{opacity:0}}.ddga-dropdown-menu--sm{font-size:var(--ddga-font-size-sm)}.ddga-dropdown-menu--md{font-size:var(--ddga-font-size-base)}.ddga-dropdown-menu__item{align-items:center;gap:var(--ddga-space-2);inline-size:100%;padding-block:var(--ddga-space-1);padding-inline:var(--ddga-space-2);border-radius:var(--ddga-radius-sm);color:inherit;cursor:default;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;outline:none;display:flex}.ddga-dropdown-menu__item[data-highlighted]{background-color:var(--ddga-color-muted)}.ddga-dropdown-menu__item[data-disabled]{color:var(--ddga-text-tertiary);pointer-events:none}.ddga-dropdown-menu__item[data-destructive]{color:var(--ddga-color-destructive)}.ddga-dropdown-menu__item[data-destructive][data-highlighted]{background-color:var(--ddga-error-50)}.ddga-dropdown-menu__label{white-space:nowrap;text-overflow:ellipsis;flex:auto;min-inline-size:0;overflow:hidden}.ddga-dropdown-menu__icon{block-size:1em;inline-size:1em;color:var(--ddga-text-secondary);flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.ddga-dropdown-menu__icon>svg{block-size:1em;inline-size:1em}.ddga-dropdown-menu__shortcut{font-size:var(--ddga-font-size-xs);color:var(--ddga-text-tertiary);letter-spacing:.04em;margin-inline-start:auto}.ddga-dropdown-menu__item--checkable{padding-inline-start:calc(var(--ddga-space-2) + 1.25em);position:relative}.ddga-dropdown-menu__indicator{block-size:1em;inline-size:1em;color:var(--ddga-color-primary);justify-content:center;align-items:center;display:inline-flex;position:absolute;inset-block-start:50%;inset-inline-start:var(--ddga-space-2);transform:translateY(-50%)}.ddga-dropdown-menu__indicator-icon{block-size:.875em;inline-size:.875em}.ddga-dropdown-menu__radio-dot{border-radius:var(--ddga-radius-full);background-color:currentColor;block-size:.5em;inline-size:.5em;display:inline-block}.ddga-dropdown-menu__item--sub[data-state=open]{background-color:var(--ddga-color-muted)}.ddga-dropdown-menu__sub-chevron{block-size:1em;inline-size:1em;color:var(--ddga-text-tertiary);margin-inline-start:auto}[dir=rtl] .ddga-dropdown-menu__sub-chevron{transform:scaleX(-1)}.ddga-dropdown-menu__group-label{padding-block:var(--ddga-space-1);padding-inline:var(--ddga-space-2);font-size:var(--ddga-font-size-xs);font-weight:var(--ddga-font-weight-semibold);color:var(--ddga-text-tertiary);text-transform:uppercase;letter-spacing:.04em}[dir=rtl] .ddga-dropdown-menu__group-label{letter-spacing:normal;text-transform:none}[dir=rtl] .ddga-dropdown-menu__shortcut{letter-spacing:normal}.ddga-dropdown-menu__separator{block-size:1px;margin-block:var(--ddga-space-1);margin-inline:calc(var(--ddga-space-1) * -1);background-color:var(--ddga-color-border)}[data-theme=dark] .ddga-dropdown-menu__item[data-destructive][data-highlighted]{color:var(--ddga-error-200,#fecdca);background-color:#d92d203d}@media (forced-colors:active){.ddga-dropdown-menu{border:1px solid canvastext}.ddga-dropdown-menu__item[data-highlighted]{color:highlighttext;background-color:highlight}.ddga-dropdown-menu__separator{background-color:canvastext}}@media (prefers-reduced-motion:reduce){.ddga-dropdown-menu[data-state=open],.ddga-dropdown-menu[data-state=closed]{animation:none}}}
+@layer ddga-components{.ddga-dropdown-menu{min-inline-size:192px;max-inline-size:320px;padding:var(--ddga-space-2);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;outline:none;font-family:inherit;overflow:clip}.ddga-dropdown-menu[data-state=open]{animation:.12s cubic-bezier(.16,1,.3,1) ddga-dropdown-menu-in}.ddga-dropdown-menu[data-state=closed]{animation:80ms ease-in ddga-dropdown-menu-out}@keyframes ddga-dropdown-menu-in{0%{opacity:0;transform:translateY(-2px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes ddga-dropdown-menu-out{0%{opacity:1}to{opacity:0}}.ddga-dropdown-menu__item{align-items:center;gap:var(--ddga-space-2);inline-size:100%;padding:var(--ddga-space-2);border-radius:var(--ddga-radius-sm);color:var(--ddga-text-primary);cursor:default;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;outline:none;display:flex}.ddga-dropdown-menu__item:hover{background-color:var(--ddga-gray-100)}.ddga-dropdown-menu__item[data-highlighted]:not(:hover):not([data-state=open]){outline:2px solid var(--ddga-text-primary);outline-offset:-2px}.ddga-dropdown-menu__item:active{background-color:var(--ddga-gray-200)}.ddga-dropdown-menu__item[data-disabled]{color:var(--ddga-gray-400);pointer-events:none}.ddga-dropdown-menu__item[data-state=checked]{background-color:var(--ddga-sa-50);color:var(--ddga-color-primary)}.ddga-dropdown-menu__item[data-destructive]{color:var(--ddga-color-destructive)}.ddga-dropdown-menu__item[data-destructive]:hover,.ddga-dropdown-menu__item[data-destructive][data-highlighted]{background-color:var(--ddga-error-50)}.ddga-dropdown-menu__label{min-inline-size:0;font-size:var(--ddga-font-size-base);line-height:1.5;font-weight:var(--ddga-font-weight-regular);white-space:nowrap;text-overflow:ellipsis;flex:auto;overflow:hidden}.ddga-dropdown-menu__icon{block-size:24px;inline-size:24px;color:inherit;flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.ddga-dropdown-menu__icon>svg{block-size:24px;inline-size:24px}.ddga-dropdown-menu__trailing{min-block-size:24px;color:inherit;flex-shrink:0;align-items:center;margin-inline-start:auto;display:inline-flex}.ddga-dropdown-menu__indicator{block-size:24px;inline-size:24px;color:inherit;flex-shrink:0;justify-content:center;align-items:center;margin-inline-start:auto;display:inline-flex}.ddga-dropdown-menu__indicator-icon{block-size:24px;inline-size:24px}.ddga-dropdown-menu__item--sub[data-state=open]{background-color:var(--ddga-gray-100)}.ddga-dropdown-menu__sub-chevron{block-size:24px;inline-size:24px;color:inherit;flex-shrink:0;margin-inline-start:auto}[dir=rtl] .ddga-dropdown-menu__sub-chevron{transform:scaleX(-1)}.ddga-dropdown-menu__group-label{padding-block:var(--ddga-space-2) var(--ddga-space-3);padding-inline:var(--ddga-space-2) var(--ddga-space-4);font-size:var(--ddga-font-size-xs);line-height:1.5;font-weight:var(--ddga-font-weight-bold);color:var(--ddga-gray-800)}.ddga-dropdown-menu__separator{block-size:1px;margin-block:var(--ddga-space-2);margin-inline:calc(var(--ddga-space-2) * -1);background-color:var(--ddga-color-input)}[data-theme=dark] .ddga-dropdown-menu__item:hover,[data-theme=dark] .ddga-dropdown-menu__item--sub[data-state=open]{background-color:var(--ddga-color-muted)}[data-theme=dark] .ddga-dropdown-menu__item:active{background-color:var(--ddga-color-border)}[data-theme=dark] .ddga-dropdown-menu__item[data-state=checked]{color:var(--ddga-sa-400);background-color:#1b83542e}[data-theme=dark] .ddga-dropdown-menu__item[data-destructive][data-highlighted],[data-theme=dark] .ddga-dropdown-menu__item[data-destructive]:hover{color:var(--ddga-error-200,#fecdca);background-color:#d92d203d}@media (forced-colors:active){.ddga-dropdown-menu{border:1px solid canvastext}.ddga-dropdown-menu__item:hover,.ddga-dropdown-menu__item[data-highlighted]{color:highlighttext;background-color:highlight}.ddga-dropdown-menu__item:focus-visible{outline-color:highlight}.ddga-dropdown-menu__separator{background-color:canvastext}}@media (prefers-reduced-motion:reduce){.ddga-dropdown-menu[data-state=open],.ddga-dropdown-menu[data-state=closed]{animation:none}}}
 /*# sourceMappingURL=dropdown-menu.css.map */

package/dist/components/dropdown-menu.css.map

@@ -1 +1 @@
-{"version":3,"mappings":"AAAA,uBAGE,wUAgBA,mGAGA,qFAIA,iIAUA,6DAWA,2DAGA,6DAMA,wUAiBA,qFAIA,6FAOA,gFAGA,oGAKA,iHAQA,sKASA,6DAKA,+IASA,+GAMA,sQAYA,yEAIA,yJAYA,yFAIA,yHAQA,gEAMA,oQAYA,qFAIA,8DAIA,sKAYA,+IAOA,8BACE,gDAGA,2FAIA,4DAOF,uCACE","sources":["src/components/dropdown-menu.css"],"sourcesContent":["@layer ddga-components {\n  /* ─── Panel (Content / SubContent) ─── */\n\n  .ddga-dropdown-menu {\n    min-inline-size: 192px;\n    max-inline-size: 320px;\n    padding: var(--ddga-space-1);\n    background-color: var(--ddga-color-background);\n    color: var(--ddga-color-foreground);\n    border: 1px solid var(--ddga-color-border);\n    border-radius: var(--ddga-radius-md);\n    box-shadow: var(--ddga-shadow-md);\n    font-family: inherit;\n    z-index: 50;\n    outline: none;\n  }\n\n  /* Enter/exit animations follow Radix data-state. Keep them subtle so menu\n     surfaces feel instantaneous (this isn't a Modal). */\n  .ddga-dropdown-menu[data-state='open'] {\n    animation: ddga-dropdown-menu-in 120ms cubic-bezier(0.16, 1, 0.3, 1);\n  }\n  .ddga-dropdown-menu[data-state='closed'] {\n    animation: ddga-dropdown-menu-out 80ms ease-in;\n  }\n\n  @keyframes ddga-dropdown-menu-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-menu-out {\n    from {\n      opacity: 1;\n    }\n    to {\n      opacity: 0;\n    }\n  }\n\n  /* ─── Sizes ─── */\n\n  .ddga-dropdown-menu--sm {\n    font-size: var(--ddga-font-size-sm);\n  }\n  .ddga-dropdown-menu--md {\n    font-size: var(--ddga-font-size-base);\n  }\n\n  /* ─── Item (and CheckboxItem/RadioItem/SubTrigger share the base) ─── */\n\n  .ddga-dropdown-menu__item {\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-2);\n    inline-size: 100%;\n    padding-block: var(--ddga-space-1);\n    padding-inline: var(--ddga-space-2);\n    border-radius: var(--ddga-radius-sm);\n    color: inherit;\n    cursor: default;\n    user-select: none;\n    outline: none;\n    -webkit-tap-highlight-color: transparent;\n  }\n\n  /* Radix sets data-highlighted on the actively focused/hovered item — that's\n     our only \"focus ring\" since the menu manages focus internally. */\n  .ddga-dropdown-menu__item[data-highlighted] {\n    background-color: var(--ddga-color-muted);\n  }\n\n  .ddga-dropdown-menu__item[data-disabled] {\n    color: var(--ddga-text-tertiary);\n    pointer-events: none;\n  }\n\n  /* Destructive: red text and a red-tinted hover. Tracks the destructive\n     family the rest of the system uses. */\n  .ddga-dropdown-menu__item[data-destructive] {\n    color: var(--ddga-color-destructive);\n  }\n  .ddga-dropdown-menu__item[data-destructive][data-highlighted] {\n    background-color: var(--ddga-error-50);\n  }\n\n  /* Inline pieces inside the row. */\n  .ddga-dropdown-menu__label {\n    flex: 1 1 auto;\n    min-inline-size: 0;\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n  }\n\n  .ddga-dropdown-menu__icon {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    inline-size: 1em;\n    block-size: 1em;\n    flex-shrink: 0;\n    color: var(--ddga-text-secondary);\n  }\n  .ddga-dropdown-menu__icon > svg {\n    inline-size: 1em;\n    block-size: 1em;\n  }\n\n  .ddga-dropdown-menu__shortcut {\n    margin-inline-start: auto;\n    font-size: var(--ddga-font-size-xs);\n    color: var(--ddga-text-tertiary);\n    letter-spacing: 0.04em;\n  }\n\n  /* ─── Indicator slot (Checkbox/Radio) ─── */\n\n  .ddga-dropdown-menu__item--checkable {\n    /* Reserve the indicator column even when unchecked so labels align. */\n    padding-inline-start: calc(var(--ddga-space-2) + 1.25em);\n    position: relative;\n  }\n\n  .ddga-dropdown-menu__indicator {\n    position: absolute;\n    inset-inline-start: var(--ddga-space-2);\n    inset-block-start: 50%;\n    transform: translateY(-50%);\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    inline-size: 1em;\n    block-size: 1em;\n    color: var(--ddga-color-primary);\n  }\n  .ddga-dropdown-menu__indicator-icon {\n    inline-size: 0.875em;\n    block-size: 0.875em;\n  }\n  .ddga-dropdown-menu__radio-dot {\n    /* span is inline by default → inline-size/block-size are ignored. Force a\n       sized inline-block so the filled circle actually renders. */\n    display: inline-block;\n    inline-size: 0.5em;\n    block-size: 0.5em;\n    border-radius: var(--ddga-radius-full);\n    background-color: currentColor;\n  }\n\n  /* ─── Submenu ─── */\n\n  .ddga-dropdown-menu__item--sub[data-state='open'] {\n    background-color: var(--ddga-color-muted);\n  }\n\n  .ddga-dropdown-menu__sub-chevron {\n    margin-inline-start: auto;\n    inline-size: 1em;\n    block-size: 1em;\n    color: var(--ddga-text-tertiary);\n  }\n\n  /* Flip the sub-menu chevron in RTL — it should always point inline-end-ward. */\n  [dir='rtl'] .ddga-dropdown-menu__sub-chevron {\n    transform: scaleX(-1);\n  }\n\n  /* ─── Label + Separator ─── */\n\n  .ddga-dropdown-menu__group-label {\n    padding-block: var(--ddga-space-1);\n    padding-inline: var(--ddga-space-2);\n    font-size: var(--ddga-font-size-xs);\n    font-weight: var(--ddga-font-weight-semibold);\n    color: var(--ddga-text-tertiary);\n    text-transform: uppercase;\n    letter-spacing: 0.04em;\n  }\n  /* Protect Arabic cursive joining — drop the tracking + casing when RTL\n     (mirrors command.css). The shortcut hint is usually Latin but reset it\n     too for parity. */\n  [dir='rtl'] .ddga-dropdown-menu__group-label {\n    letter-spacing: normal;\n    text-transform: none;\n  }\n  [dir='rtl'] .ddga-dropdown-menu__shortcut {\n    letter-spacing: normal;\n  }\n\n  .ddga-dropdown-menu__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-border);\n  }\n\n  /* ─── Dark mode ─── */\n\n  /* The destructive-hover background uses the raw --ddga-error-50 tint\n     (near-white), which doesn't adapt in dark mode. Override with a translucent\n     red + a light-red foreground for contrast (mirrors alert.css / button.css). */\n  [data-theme='dark'] .ddga-dropdown-menu__item[data-destructive][data-highlighted] {\n    background-color: rgb(217 45 32 / 0.24);\n    color: var(--ddga-error-200, #fecdca);\n  }\n\n  /* ─── Forced colors ─── */\n\n  @media (forced-colors: active) {\n    .ddga-dropdown-menu {\n      border: 1px solid CanvasText;\n    }\n    .ddga-dropdown-menu__item[data-highlighted] {\n      background-color: Highlight;\n      color: HighlightText;\n    }\n    .ddga-dropdown-menu__separator {\n      background-color: CanvasText;\n    }\n  }\n\n  /* ─── Reduced motion ─── */\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-dropdown-menu[data-state='open'],\n    .ddga-dropdown-menu[data-state='closed'] {\n      animation: none;\n    }\n  }\n}\n"],"names":[]}
+{"version":3,"mappings":"AAAA,uBAGE,kVAeA,mGAGA,qFAGA,iIAUA,6DAWA,gTAeA,sEAOA,8IAKA,uEAGA,wFAMA,iHAKA,gFAGA,sJAOA,kNAWA,qJASA,+DAMA,8IAWA,mLAUA,qEAOA,sFAGA,uHAOA,gEAMA,qQASA,qKASA,6JAIA,6FAGA,oHAIA,mNAQA,8BACE,gDAGA,2HAKA,gEAGA,4DAOF,uCACE","sources":["src/components/dropdown-menu.css"],"sourcesContent":["@layer ddga-components {\n  /* ─── Panel (Content / SubContent) ─── */\n\n  .ddga-dropdown-menu {\n    min-inline-size: 192px;\n    max-inline-size: 320px;\n    padding: var(--ddga-space-2);\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);\n    font-family: inherit;\n    z-index: 50;\n    outline: none;\n    overflow: clip;\n  }\n\n  .ddga-dropdown-menu[data-state='open'] {\n    animation: ddga-dropdown-menu-in 120ms cubic-bezier(0.16, 1, 0.3, 1);\n  }\n  .ddga-dropdown-menu[data-state='closed'] {\n    animation: ddga-dropdown-menu-out 80ms ease-in;\n  }\n  @keyframes ddga-dropdown-menu-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-menu-out {\n    from {\n      opacity: 1;\n    }\n    to {\n      opacity: 0;\n    }\n  }\n\n  /* ─── Item (CheckboxItem/RadioItem/SubTrigger share the base) — 40px row ─── */\n\n  .ddga-dropdown-menu__item {\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-2);\n    inline-size: 100%;\n    padding: var(--ddga-space-2);\n    border-radius: var(--ddga-radius-sm);\n    color: var(--ddga-text-primary);\n    cursor: default;\n    user-select: none;\n    outline: none;\n    -webkit-tap-highlight-color: transparent;\n  }\n\n  /* SDGA Hovered — mouse over the row. */\n  .ddga-dropdown-menu__item:hover {\n    background-color: var(--ddga-gray-100);\n  }\n  /* SDGA Focused — ink ring, transparent row. Radix flags the active item\n     `data-highlighted` for BOTH pointer and keyboard (and `:focus-visible`\n     fires on hover here too), so focus can't be keyed off directly. Split on\n     `:hover`: highlighted but NOT hovered (and not an open submenu) ⇒ keyboard. */\n  .ddga-dropdown-menu__item[data-highlighted]:not(:hover):not([data-state='open']) {\n    outline: 2px solid var(--ddga-text-primary);\n    outline-offset: -2px;\n  }\n  /* SDGA Pressed. */\n  .ddga-dropdown-menu__item:active {\n    background-color: var(--ddga-gray-200);\n  }\n  .ddga-dropdown-menu__item[data-disabled] {\n    color: var(--ddga-gray-400);\n    pointer-events: none;\n  }\n\n  /* SDGA Selected = SA-50 row + green label / icons / trailing check. */\n  .ddga-dropdown-menu__item[data-state='checked'] {\n    background-color: var(--ddga-sa-50);\n    color: var(--ddga-color-primary);\n  }\n\n  .ddga-dropdown-menu__item[data-destructive] {\n    color: var(--ddga-color-destructive);\n  }\n  .ddga-dropdown-menu__item[data-destructive]:hover,\n  .ddga-dropdown-menu__item[data-destructive][data-highlighted] {\n    background-color: var(--ddga-error-50);\n  }\n\n  /* ─── Row pieces ─── */\n\n  .ddga-dropdown-menu__label {\n    flex: 1 1 auto;\n    min-inline-size: 0;\n    font-size: var(--ddga-font-size-base);\n    line-height: 1.5;\n    font-weight: var(--ddga-font-weight-regular);\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n  }\n\n  .ddga-dropdown-menu__icon {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    inline-size: 24px;\n    block-size: 24px;\n    flex-shrink: 0;\n    color: inherit;\n  }\n  .ddga-dropdown-menu__icon > svg {\n    inline-size: 24px;\n    block-size: 24px;\n  }\n\n  /* SDGA \"trail\": counter / icon / Tag / Switch / Button. Pushed to the row end. */\n  .ddga-dropdown-menu__trailing {\n    display: inline-flex;\n    align-items: center;\n    flex-shrink: 0;\n    margin-inline-start: auto;\n    min-block-size: 24px;\n    color: inherit;\n  }\n\n  /* ─── Checkbox / Radio = trailing tick-02 check (green when Selected) ─── */\n\n  .ddga-dropdown-menu__indicator {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    margin-inline-start: auto;\n    inline-size: 24px;\n    block-size: 24px;\n    color: inherit;\n  }\n  .ddga-dropdown-menu__indicator-icon {\n    inline-size: 24px;\n    block-size: 24px;\n  }\n\n  /* ─── Submenu ─── */\n\n  .ddga-dropdown-menu__item--sub[data-state='open'] {\n    background-color: var(--ddga-gray-100);\n  }\n  .ddga-dropdown-menu__sub-chevron {\n    margin-inline-start: auto;\n    inline-size: 24px;\n    block-size: 24px;\n    flex-shrink: 0;\n    color: inherit;\n  }\n  [dir='rtl'] .ddga-dropdown-menu__sub-chevron {\n    transform: scaleX(-1);\n  }\n\n  /* ─── Group label (SDGA: Text xs Bold, gray-800, no transform) + Separator ─── */\n\n  .ddga-dropdown-menu__group-label {\n    padding-block: var(--ddga-space-2) var(--ddga-space-3);\n    padding-inline: var(--ddga-space-2) var(--ddga-space-4);\n    font-size: var(--ddga-font-size-xs);\n    line-height: 1.5;\n    font-weight: var(--ddga-font-weight-bold);\n    color: var(--ddga-gray-800);\n  }\n\n  .ddga-dropdown-menu__separator {\n    block-size: 1px;\n    margin-block: var(--ddga-space-2);\n    margin-inline: calc(var(--ddga-space-2) * -1);\n    background-color: var(--ddga-color-input);\n  }\n\n  /* ─── Dark mode (SDGA light values are fixed ramp steps → remap to flipping tokens) ─── */\n\n  [data-theme='dark'] .ddga-dropdown-menu__item:hover,\n  [data-theme='dark'] .ddga-dropdown-menu__item--sub[data-state='open'] {\n    background-color: var(--ddga-color-muted);\n  }\n  [data-theme='dark'] .ddga-dropdown-menu__item:active {\n    background-color: var(--ddga-color-border);\n  }\n  [data-theme='dark'] .ddga-dropdown-menu__item[data-state='checked'] {\n    background-color: rgb(27 131 84 / 0.18);\n    color: var(--ddga-sa-400);\n  }\n  [data-theme='dark'] .ddga-dropdown-menu__item[data-destructive][data-highlighted],\n  [data-theme='dark'] .ddga-dropdown-menu__item[data-destructive]:hover {\n    background-color: rgb(217 45 32 / 0.24);\n    color: var(--ddga-error-200, #fecdca);\n  }\n\n  /* ─── Forced colors ─── */\n\n  @media (forced-colors: active) {\n    .ddga-dropdown-menu {\n      border: 1px solid CanvasText;\n    }\n    .ddga-dropdown-menu__item:hover,\n    .ddga-dropdown-menu__item[data-highlighted] {\n      background-color: Highlight;\n      color: HighlightText;\n    }\n    .ddga-dropdown-menu__item:focus-visible {\n      outline-color: Highlight;\n    }\n    .ddga-dropdown-menu__separator {\n      background-color: CanvasText;\n    }\n  }\n\n  /* ─── Reduced motion ─── */\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-dropdown-menu[data-state='open'],\n    .ddga-dropdown-menu[data-state='closed'] {\n      animation: none;\n    }\n  }\n}\n"],"names":[]}

package/dist/components/dropdown.css

@@ -0,0 +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:focus-visible:after{content:"";inset-inline:0;background-color:var(--ddga-gray-950);block-size:2px;position:absolute;bottom:-1px}.ddga-dropdown-trigger:active:not(:disabled){background-color:var(--ddga-gray-100)}.ddga-dropdown-trigger:active:not(:disabled):after{content:"";inset-inline:25%;background-color:var(--ddga-gray-950);block-size:2px;position:absolute;bottom:-1px}.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:focus-visible:after,[data-theme=dark] .ddga-dropdown-trigger:active:not(:disabled):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-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

@@ -0,0 +1 @@
+{"version":3,"mappings":"AAAA,uBAGE,wOASA,qDAOA,+ZAoBA,8EAIA,gFAKA,+FAIA,+FAKA,4GAOA,uDAKA,mGAQA,2GAKA,mFAIA,gFAGA,wJAUA,mFAGA,kKAUA,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,4KAIA,wGAGA,qJAIA,mGAGA,uFAGA,iLAKA,6FAMA,uCACE,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  .ddga-dropdown-trigger:focus-visible::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  }\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    content: '';\n    position: absolute;\n    inset-inline: 25%;\n    bottom: -1px;\n    block-size: 2px;\n    background-color: var(--ddga-gray-950);\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:focus-visible::after,\n  [data-theme='dark'] .ddga-dropdown-trigger:active:not(:disabled)::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-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/field.css

@@ -1,2 +1,2 @@
-@layer ddga-components{.ddga-field{gap:var(--ddga-space-1);flex-direction:column;display:flex}.ddga-field__message{font-size:var(--ddga-font-size-sm);margin:0;line-height:1.4}.ddga-field__message--helper{color:var(--ddga-text-secondary)}.ddga-field__message--error{color:var(--ddga-color-error)}}
+@layer ddga-components{.ddga-field{gap:var(--ddga-space-1);flex-direction:column;display:flex}.ddga-field__message{font-size:var(--ddga-font-size-sm);margin:0;line-height:1.4}.ddga-field__message--helper{color:var(--ddga-text-secondary)}.ddga-field__message--error{color:var(--ddga-color-error)}.ddga-field__message--with-icon{align-items:center;gap:var(--ddga-space-2);display:inline-flex}.ddga-field__message-icon{flex-shrink:0;display:inline-flex}}
 /*# sourceMappingURL=field.css.map */

package/dist/components/field.css.map

@@ -1 +1 @@
-{"version":3,"mappings":"AAAA,uBAKE,uEAMA,iFAMA,8DAIA","sources":["src/components/field.css"],"sourcesContent":["@layer ddga-components {\n  /* Shared field primitives , wrapper + helper/error message. Used by\n     Input / Textarea / Checkbox. Component-specific bits (the label and\n     the control itself) stay in each component's CSS. */\n\n  .ddga-field {\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-space-1);\n  }\n\n  .ddga-field__message {\n    margin: 0;\n    font-size: var(--ddga-font-size-sm);\n    line-height: 1.4;\n  }\n\n  .ddga-field__message--helper {\n    color: var(--ddga-text-secondary);\n  }\n\n  .ddga-field__message--error {\n    color: var(--ddga-color-error);\n  }\n}\n"],"names":[]}
+{"version":3,"mappings":"AAAA,uBAKE,uEAMA,iFAMA,8DAIA,0DAIA,+FAMA","sources":["src/components/field.css"],"sourcesContent":["@layer ddga-components {\n  /* Shared field primitives , wrapper + helper/error message. Used by\n     Input / Textarea / Checkbox. Component-specific bits (the label and\n     the control itself) stay in each component's CSS. */\n\n  .ddga-field {\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-space-1);\n  }\n\n  .ddga-field__message {\n    margin: 0;\n    font-size: var(--ddga-font-size-sm);\n    line-height: 1.4;\n  }\n\n  .ddga-field__message--helper {\n    color: var(--ddga-text-secondary);\n  }\n\n  .ddga-field__message--error {\n    color: var(--ddga-color-error);\n  }\n\n  .ddga-field__message--with-icon {\n    display: inline-flex;\n    align-items: center;\n    gap: var(--ddga-space-2);\n  }\n\n  .ddga-field__message-icon {\n    display: inline-flex;\n    flex-shrink: 0;\n  }\n}\n"],"names":[]}

package/dist/components/file-upload.css

@@ -1,2 +1,2 @@
-@layer ddga-components{.ddga-file-upload{color:var(--ddga-text-primary)}.ddga-file-upload__label{color:var(--ddga-text-primary);font-weight:var(--ddga-font-weight-medium);font-size:var(--ddga-font-size-sm);line-height:1.4}.ddga-file-upload__required{color:var(--ddga-color-error);margin-inline-start:.125rem}.ddga-file-upload__dropzone{justify-content:center;align-items:center;gap:var(--ddga-space-2);padding:var(--ddga-space-6) var(--ddga-space-4);border:1px dashed var(--ddga-color-input);border-radius:var(--ddga-radius-md);background-color:var(--ddga-color-background);text-align:center;cursor:pointer;flex-direction:column;transition:border-color .15s,background-color .15s,box-shadow .15s;display:flex}.ddga-file-upload__dropzone:hover{border-color:var(--ddga-color-ring);background-color:var(--ddga-color-muted)}.ddga-file-upload__dropzone:focus-within{border-color:var(--ddga-color-ring);box-shadow:0 0 0 1px var(--ddga-color-ring)}.ddga-file-upload__dropzone[data-dragging]{border-color:var(--ddga-color-primary);background-color:var(--ddga-color-muted);box-shadow:0 0 0 1px var(--ddga-color-primary);border-style:solid}.ddga-file-upload__dropzone--error{border-color:var(--ddga-color-error)}.ddga-file-upload__dropzone--error:focus-within{border-color:var(--ddga-color-error);box-shadow:0 0 0 1px var(--ddga-color-error)}.ddga-file-upload__dropzone[data-disabled]{cursor:not-allowed;opacity:.5;background-color:var(--ddga-color-muted)}.ddga-file-upload__dropzone[data-disabled]:hover{border-color:var(--ddga-color-input);border-style:dashed}.ddga-file-upload__icon{color:var(--ddga-color-muted-foreground);font-size:1.5rem}.ddga-file-upload__hint{font-size:var(--ddga-font-size-sm);color:var(--ddga-text-secondary)}.ddga-file-upload__input{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-file-upload__list{gap:var(--ddga-space-2);flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.ddga-file-upload__item{align-items:center;gap:var(--ddga-space-3);padding:var(--ddga-space-2) var(--ddga-space-3);border:1px solid var(--ddga-color-border);border-radius:var(--ddga-radius-sm);background-color:var(--ddga-color-background);display:flex}.ddga-file-upload__item-icon{color:var(--ddga-color-muted-foreground);flex:none;font-size:1.125rem;display:inline-flex}.ddga-file-upload__item[data-status=success] .ddga-file-upload__item-icon{color:var(--ddga-color-success)}.ddga-file-upload__item[data-status=error] .ddga-file-upload__item-icon{color:var(--ddga-color-error)}.ddga-file-upload__item-main{gap:var(--ddga-space-1);flex-direction:column;flex:auto;min-inline-size:0;display:flex}.ddga-file-upload__item-head{justify-content:space-between;align-items:baseline;gap:var(--ddga-space-3);display:flex}.ddga-file-upload__item-name{text-overflow:ellipsis;white-space:nowrap;font-size:var(--ddga-font-size-sm);color:var(--ddga-text-primary);overflow:hidden}.ddga-file-upload__item-meta{font-size:var(--ddga-font-size-xs);color:var(--ddga-text-secondary);font-variant-numeric:tabular-nums;flex:none}.ddga-file-upload__item-error{font-size:var(--ddga-font-size-xs);color:var(--ddga-color-error)}.ddga-file-upload__item-remove{flex:none}@media (forced-colors:active){.ddga-file-upload__dropzone:focus-within,.ddga-file-upload__dropzone[data-dragging]{outline-offset:2px;outline:2px solid highlight}}}
+@layer ddga-components{.ddga-file-upload{gap:var(--ddga-space-4);color:var(--ddga-text-primary);flex-direction:column;display:flex}.ddga-file-upload__header{gap:var(--ddga-space-2);flex-direction:column;display:flex}.ddga-file-upload[data-variant=button]>.ddga-file-upload__browse{align-self:flex-start}.ddga-file-upload__label{color:var(--ddga-text-primary);font-size:var(--ddga-font-size-base);font-weight:var(--ddga-font-weight-regular);align-items:flex-end;gap:.25rem;line-height:1.5;display:flex}.ddga-file-upload__required{color:var(--ddga-error-700)}.ddga-file-upload__description{color:var(--ddga-text-secondary);font-size:var(--ddga-font-size-xs);font-weight:var(--ddga-font-weight-regular);line-height:1.5}.ddga-file-upload__dropzone{justify-content:center;align-items:center;gap:var(--ddga-space-6);padding:var(--ddga-space-6);border-radius:var(--ddga-radius-sm);background-color:var(--ddga-color-muted);text-align:center;cursor:pointer;flex-direction:column;transition:background-color .15s,color .15s;display:flex;position:relative}.ddga-file-upload__border{block-size:100%;inline-size:100%;color:var(--ddga-color-input);pointer-events:none;transition:color .15s;position:absolute;inset:0;overflow:visible}.ddga-file-upload__border rect{fill:none;stroke:currentColor;stroke-width:1px;stroke-dasharray:10 5}.ddga-file-upload__dropzone[data-dragging]{background-color:var(--ddga-success-25);color:var(--ddga-success-700)}.ddga-file-upload__dropzone[data-dragging] .ddga-file-upload__border{color:var(--ddga-success-700)}.ddga-file-upload__dropzone[data-dragging] .ddga-file-upload__border rect{stroke-width:2px}.ddga-file-upload__dropzone[data-dragging] .ddga-file-upload__icon,.ddga-file-upload__dropzone[data-dragging] .ddga-file-upload__title,.ddga-file-upload__dropzone[data-dragging] .ddga-file-upload__description{color:var(--ddga-success-700)}.ddga-file-upload__dropzone[data-dragging] .ddga-file-upload__browse{background-color:var(--ddga-gray-200);color:var(--ddga-gray-400)}.ddga-file-upload__dropzone[data-disabled]{cursor:not-allowed;color:var(--ddga-gray-400);background-color:#0000}.ddga-file-upload__dropzone[data-disabled] .ddga-file-upload__border{color:var(--ddga-gray-400)}.ddga-file-upload__dropzone[data-disabled] .ddga-file-upload__icon{color:var(--ddga-gray-400);opacity:.7}.ddga-file-upload__dropzone[data-disabled] .ddga-file-upload__title,.ddga-file-upload__dropzone[data-disabled] .ddga-file-upload__description{color:var(--ddga-gray-400)}.ddga-file-upload__icon{color:var(--ddga-text-primary);flex:none;font-size:1.5rem}.ddga-file-upload__copy{align-items:center;gap:var(--ddga-space-2);word-break:break-word;flex-direction:column;inline-size:100%;display:flex}.ddga-file-upload__title{color:var(--ddga-text-primary);font-size:var(--ddga-font-size-base);font-weight:var(--ddga-font-weight-medium);line-height:1.5}.ddga-file-upload__input{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-file-upload__list{gap:var(--ddga-space-2);flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.ddga-file-upload__file{border:1px solid var(--ddga-color-input);border-radius:var(--ddga-radius-sm);background-color:var(--ddga-color-muted);flex-direction:column;display:flex;overflow:hidden}.ddga-file-upload__file--error{border-color:var(--ddga-error-700)}.ddga-file-upload__file-main{align-items:center;gap:var(--ddga-space-2);padding:var(--ddga-space-2);display:flex}.ddga-file-upload__file-indicator{flex:none;justify-content:center;align-items:center;block-size:1.25rem;inline-size:1.25rem;display:inline-flex}.ddga-file-upload__file-indicator--loading{color:var(--ddga-text-secondary)}.ddga-file-upload__file-indicator--loading svg{block-size:100%;inline-size:100%}.ddga-file-upload__file-indicator--success,.ddga-file-upload__file-indicator--error{border-radius:var(--ddga-radius-full)}.ddga-file-upload__file-indicator--success{background-color:var(--ddga-color-success);color:var(--ddga-color-success-foreground)}.ddga-file-upload__file-indicator--error{background-color:var(--ddga-color-error);color:var(--ddga-color-error-foreground)}.ddga-file-upload__file-indicator--success svg,.ddga-file-upload__file-indicator--error svg{block-size:.75rem;inline-size:.75rem}.ddga-file-upload__file-name{text-overflow:ellipsis;white-space:nowrap;min-inline-size:0;color:var(--ddga-text-primary);font-size:var(--ddga-font-size-sm);font-weight:var(--ddga-font-weight-medium);flex:auto;line-height:1.4286;overflow:hidden}.ddga-file-upload__file-remove{border-radius:var(--ddga-radius-sm);block-size:1.25rem;inline-size:1.25rem;color:var(--ddga-text-secondary);cursor:pointer;background:0 0;border:0;flex:none;justify-content:center;align-items:center;padding:0;font-size:1rem;display:inline-flex}.ddga-file-upload__file-remove:hover{background-color:var(--ddga-color-secondary-hover);color:var(--ddga-text-primary)}.ddga-file-upload__file-remove:focus-visible{outline:2px solid var(--ddga-color-ring);outline-offset:1px}.ddga-file-upload__file-error-row{padding:var(--ddga-space-2);border-top:1px solid var(--ddga-color-input)}.ddga-file-upload__file-error{color:var(--ddga-color-error);font-size:var(--ddga-font-size-sm);font-weight:var(--ddga-font-weight-regular);line-height:1.4286}@media (forced-colors:active){.ddga-file-upload__dropzone[data-dragging]{outline-offset:-2px;outline:2px solid highlight}}}
 /*# sourceMappingURL=file-upload.css.map */

package/dist/components/file-upload.css.map

@@ -1 +1 @@
-{"version":3,"mappings":"AAAA,uBAIE,iDAMA,sJAOA,sFAOA,iZAkBA,+GAMA,yHAMA,6LAOA,wEAIA,kIAKA,kHAMA,0GAKA,kFAKA,4FAOA,+JAcA,sHASA,4PAUA,uHAOA,0GAIA,sGAIA,oHAQA,qHAOA,yJAQA,6IAOA,+FAKA,yCASA,8BACE","sources":["src/components/file-upload.css"],"sourcesContent":["@layer ddga-components {\n  /* Wrapper (.ddga-field) + helper/error (.ddga-field__message) are shared\n     , see field.css. Only FileUpload-specific styles live here. */\n\n  .ddga-file-upload {\n    color: var(--ddga-text-primary);\n  }\n\n  /* ─── Label ─── */\n\n  .ddga-file-upload__label {\n    color: var(--ddga-text-primary);\n    font-weight: var(--ddga-font-weight-medium);\n    font-size: var(--ddga-font-size-sm);\n    line-height: 1.4;\n  }\n\n  .ddga-file-upload__required {\n    color: var(--ddga-color-error);\n    margin-inline-start: 0.125rem;\n  }\n\n  /* ─── Drop zone ─── */\n\n  .ddga-file-upload__dropzone {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    gap: var(--ddga-space-2);\n    padding: var(--ddga-space-6) var(--ddga-space-4);\n    border: 1px dashed var(--ddga-color-input);\n    border-radius: var(--ddga-radius-md);\n    background-color: var(--ddga-color-background);\n    text-align: center;\n    cursor: pointer;\n    transition:\n      border-color 150ms ease,\n      background-color 150ms ease,\n      box-shadow 150ms ease;\n  }\n\n  .ddga-file-upload__dropzone:hover {\n    border-color: var(--ddga-color-ring);\n    background-color: var(--ddga-color-muted);\n  }\n\n  /* Focus ring driven by the (visually hidden) input inside the zone. */\n  .ddga-file-upload__dropzone:focus-within {\n    border-color: var(--ddga-color-ring);\n    box-shadow: 0 0 0 1px var(--ddga-color-ring);\n  }\n\n  /* Active drag-over state. */\n  .ddga-file-upload__dropzone[data-dragging] {\n    border-color: var(--ddga-color-primary);\n    border-style: solid;\n    background-color: var(--ddga-color-muted);\n    box-shadow: 0 0 0 1px var(--ddga-color-primary);\n  }\n\n  .ddga-file-upload__dropzone--error {\n    border-color: var(--ddga-color-error);\n  }\n\n  .ddga-file-upload__dropzone--error:focus-within {\n    border-color: var(--ddga-color-error);\n    box-shadow: 0 0 0 1px var(--ddga-color-error);\n  }\n\n  .ddga-file-upload__dropzone[data-disabled] {\n    cursor: not-allowed;\n    opacity: 0.5;\n    background-color: var(--ddga-color-muted);\n  }\n\n  .ddga-file-upload__dropzone[data-disabled]:hover {\n    border-color: var(--ddga-color-input);\n    border-style: dashed;\n  }\n\n  .ddga-file-upload__icon {\n    font-size: 1.5rem;\n    color: var(--ddga-color-muted-foreground);\n  }\n\n  .ddga-file-upload__hint {\n    font-size: var(--ddga-font-size-sm);\n    color: var(--ddga-text-secondary);\n  }\n\n  /* Visually hidden, but kept focusable so keyboard users can tab to it and\n     press Space/Enter to open the picker. (Not display:none / tabindex=-1.) */\n  .ddga-file-upload__input {\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  /* ─── File list ─── */\n\n  .ddga-file-upload__list {\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-space-2);\n    margin: 0;\n    padding: 0;\n    list-style: none;\n  }\n\n  .ddga-file-upload__item {\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-3);\n    padding: var(--ddga-space-2) var(--ddga-space-3);\n    border: 1px solid var(--ddga-color-border);\n    border-radius: var(--ddga-radius-sm);\n    background-color: var(--ddga-color-background);\n  }\n\n  .ddga-file-upload__item-icon {\n    display: inline-flex;\n    flex: none;\n    font-size: 1.125rem;\n    color: var(--ddga-color-muted-foreground);\n  }\n\n  .ddga-file-upload__item[data-status='success'] .ddga-file-upload__item-icon {\n    color: var(--ddga-color-success);\n  }\n\n  .ddga-file-upload__item[data-status='error'] .ddga-file-upload__item-icon {\n    color: var(--ddga-color-error);\n  }\n\n  .ddga-file-upload__item-main {\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-space-1);\n    flex: 1 1 auto;\n    min-inline-size: 0;\n  }\n\n  .ddga-file-upload__item-head {\n    display: flex;\n    align-items: baseline;\n    justify-content: space-between;\n    gap: var(--ddga-space-3);\n  }\n\n  .ddga-file-upload__item-name {\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n    font-size: var(--ddga-font-size-sm);\n    color: var(--ddga-text-primary);\n  }\n\n  .ddga-file-upload__item-meta {\n    flex: none;\n    font-size: var(--ddga-font-size-xs);\n    color: var(--ddga-text-secondary);\n    font-variant-numeric: tabular-nums;\n  }\n\n  .ddga-file-upload__item-error {\n    font-size: var(--ddga-font-size-xs);\n    color: var(--ddga-color-error);\n  }\n\n  .ddga-file-upload__item-remove {\n    flex: none;\n  }\n\n  /* ─── Forced colors (Windows High Contrast) ─── */\n\n  /* The focus + drag-active indicators are box-shadow rings, which forced-colors\n     neutralizes — restore them as a system-colored outline so keyboard focus and\n     the active drop target stay visible. */\n  @media (forced-colors: active) {\n    .ddga-file-upload__dropzone:focus-within,\n    .ddga-file-upload__dropzone[data-dragging] {\n      outline: 2px solid Highlight;\n      outline-offset: 2px;\n    }\n  }\n}\n"],"names":[]}
+{"version":3,"mappings":"AAAA,uBACE,4GASA,qFAMA,uFAIA,sMAUA,wDAIA,+JASA,yUAiBA,8KAWA,oGAOA,iHAKA,mGAIA,2FAIA,+OAMA,sIAKA,gHAMA,gGAIA,yGAKA,yKAKA,kFAMA,6IASA,wJAQA,+JAcA,sHASA,iMASA,kEAIA,iHAOA,iJASA,4EAIA,gFAKA,0HAKA,iIAKA,2HAKA,iIAMA,mPAYA,mRAgBA,uHAKA,yGAKA,2GAKA,8JAUA,8BACE","sources":["src/components/file-upload.css"],"sourcesContent":["@layer ddga-components {\n  .ddga-file-upload {\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-space-4);\n    color: var(--ddga-text-primary);\n  }\n\n  /* ─── Label + description ─── */\n\n  .ddga-file-upload__header {\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-space-2);\n  }\n\n  .ddga-file-upload[data-variant='button'] > .ddga-file-upload__browse {\n    align-self: flex-start;\n  }\n\n  .ddga-file-upload__label {\n    display: flex;\n    align-items: flex-end;\n    gap: 0.25rem;\n    color: var(--ddga-text-primary);\n    font-size: var(--ddga-font-size-base);\n    font-weight: var(--ddga-font-weight-regular);\n    line-height: 1.5;\n  }\n\n  .ddga-file-upload__required {\n    color: var(--ddga-error-700);\n  }\n\n  .ddga-file-upload__description {\n    color: var(--ddga-text-secondary);\n    font-size: var(--ddga-font-size-xs);\n    font-weight: var(--ddga-font-weight-regular);\n    line-height: 1.5;\n  }\n\n  /* ─── Drop zone ─── */\n\n  .ddga-file-upload__dropzone {\n    position: relative;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    gap: var(--ddga-space-6);\n    padding: var(--ddga-space-6);\n    border-radius: var(--ddga-radius-sm);\n    background-color: var(--ddga-color-muted);\n    text-align: center;\n    cursor: pointer;\n    transition:\n      background-color 150ms ease,\n      color 150ms ease;\n  }\n\n  .ddga-file-upload__border {\n    position: absolute;\n    inset: 0;\n    inline-size: 100%;\n    block-size: 100%;\n    overflow: visible;\n    color: var(--ddga-color-input);\n    pointer-events: none;\n    transition: color 150ms ease;\n  }\n\n  .ddga-file-upload__border rect {\n    fill: none;\n    stroke: currentColor;\n    stroke-width: 1;\n    stroke-dasharray: 10 5;\n  }\n\n  .ddga-file-upload__dropzone[data-dragging] {\n    background-color: var(--ddga-success-25);\n    color: var(--ddga-success-700);\n  }\n\n  .ddga-file-upload__dropzone[data-dragging] .ddga-file-upload__border {\n    color: var(--ddga-success-700);\n  }\n\n  .ddga-file-upload__dropzone[data-dragging] .ddga-file-upload__border rect {\n    stroke-width: 2;\n  }\n\n  .ddga-file-upload__dropzone[data-dragging] .ddga-file-upload__icon,\n  .ddga-file-upload__dropzone[data-dragging] .ddga-file-upload__title,\n  .ddga-file-upload__dropzone[data-dragging] .ddga-file-upload__description {\n    color: var(--ddga-success-700);\n  }\n\n  .ddga-file-upload__dropzone[data-dragging] .ddga-file-upload__browse {\n    background-color: var(--ddga-gray-200);\n    color: var(--ddga-gray-400);\n  }\n\n  .ddga-file-upload__dropzone[data-disabled] {\n    cursor: not-allowed;\n    background-color: transparent;\n    color: var(--ddga-gray-400);\n  }\n\n  .ddga-file-upload__dropzone[data-disabled] .ddga-file-upload__border {\n    color: var(--ddga-gray-400);\n  }\n\n  .ddga-file-upload__dropzone[data-disabled] .ddga-file-upload__icon {\n    color: var(--ddga-gray-400);\n    opacity: 0.7;\n  }\n\n  .ddga-file-upload__dropzone[data-disabled] .ddga-file-upload__title,\n  .ddga-file-upload__dropzone[data-disabled] .ddga-file-upload__description {\n    color: var(--ddga-gray-400);\n  }\n\n  .ddga-file-upload__icon {\n    flex: none;\n    font-size: 1.5rem;\n    color: var(--ddga-text-primary);\n  }\n\n  .ddga-file-upload__copy {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    gap: var(--ddga-space-2);\n    inline-size: 100%;\n    word-break: break-word;\n  }\n\n  .ddga-file-upload__title {\n    color: var(--ddga-text-primary);\n    font-size: var(--ddga-font-size-base);\n    font-weight: var(--ddga-font-weight-medium);\n    line-height: 1.5;\n  }\n\n  /* Visually-hidden real file input (the Browse button is the keyboard trigger). */\n  .ddga-file-upload__input {\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  /* ─── File list ─── */\n\n  .ddga-file-upload__list {\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-space-2);\n    margin: 0;\n    padding: 0;\n    list-style: none;\n  }\n\n  .ddga-file-upload__file {\n    display: flex;\n    flex-direction: column;\n    overflow: hidden;\n    border: 1px solid var(--ddga-color-input);\n    border-radius: var(--ddga-radius-sm);\n    background-color: var(--ddga-color-muted);\n  }\n\n  .ddga-file-upload__file--error {\n    border-color: var(--ddga-error-700);\n  }\n\n  .ddga-file-upload__file-main {\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-2);\n    padding: var(--ddga-space-2);\n  }\n\n  .ddga-file-upload__file-indicator {\n    display: inline-flex;\n    flex: none;\n    align-items: center;\n    justify-content: center;\n    inline-size: 1.25rem;\n    block-size: 1.25rem;\n  }\n\n  .ddga-file-upload__file-indicator--loading {\n    color: var(--ddga-text-secondary);\n  }\n\n  .ddga-file-upload__file-indicator--loading svg {\n    inline-size: 100%;\n    block-size: 100%;\n  }\n\n  .ddga-file-upload__file-indicator--success,\n  .ddga-file-upload__file-indicator--error {\n    border-radius: var(--ddga-radius-full);\n  }\n\n  .ddga-file-upload__file-indicator--success {\n    background-color: var(--ddga-color-success);\n    color: var(--ddga-color-success-foreground);\n  }\n\n  .ddga-file-upload__file-indicator--error {\n    background-color: var(--ddga-color-error);\n    color: var(--ddga-color-error-foreground);\n  }\n\n  .ddga-file-upload__file-indicator--success svg,\n  .ddga-file-upload__file-indicator--error svg {\n    inline-size: 0.75rem;\n    block-size: 0.75rem;\n  }\n\n  .ddga-file-upload__file-name {\n    flex: 1 1 auto;\n    min-inline-size: 0;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n    color: var(--ddga-text-primary);\n    font-size: var(--ddga-font-size-sm);\n    font-weight: var(--ddga-font-weight-medium);\n    line-height: 1.4286;\n  }\n\n  .ddga-file-upload__file-remove {\n    display: inline-flex;\n    flex: none;\n    align-items: center;\n    justify-content: center;\n    inline-size: 1.25rem;\n    block-size: 1.25rem;\n    padding: 0;\n    border: 0;\n    border-radius: var(--ddga-radius-sm);\n    background: transparent;\n    color: var(--ddga-text-secondary);\n    font-size: 1rem;\n    cursor: pointer;\n  }\n\n  .ddga-file-upload__file-remove:hover {\n    background-color: var(--ddga-color-secondary-hover);\n    color: var(--ddga-text-primary);\n  }\n\n  .ddga-file-upload__file-remove:focus-visible {\n    outline: 2px solid var(--ddga-color-ring);\n    outline-offset: 1px;\n  }\n\n  .ddga-file-upload__file-error-row {\n    padding: var(--ddga-space-2);\n    border-top: 1px solid var(--ddga-color-input);\n  }\n\n  .ddga-file-upload__file-error {\n    color: var(--ddga-color-error);\n    font-size: var(--ddga-font-size-sm);\n    font-weight: var(--ddga-font-weight-regular);\n    line-height: 1.4286;\n  }\n\n  /* ─── Forced colors (Windows High Contrast) ─── */\n\n  /* color/bg are neutralized in forced-colors — keep the active target visible. */\n  @media (forced-colors: active) {\n    .ddga-file-upload__dropzone[data-dragging] {\n      outline: 2px solid Highlight;\n      outline-offset: -2px;\n    }\n  }\n}\n"],"names":[]}