@dev-dga/css 0.8.0 → 0.8.2

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @dev-dga/css
 
+## 0.8.2
+
+### Patch Changes
+
+- **Accessibility — `forced-colors` (Windows High Contrast Mode):** restored focus/visibility rules suppressed in HCM for the Combobox trigger ring, Command separator, DatePicker segment + icon button, and Sidebar sub-button; plus an Avatar dark-mode offline-dot override. Released in lockstep with `@dev-dga/react@0.8.2` and `@dev-dga/tokens@0.8.2`.
+
+## 0.8.1
+
+### Patch Changes
+
+- RTL, dark-mode, and high-contrast CSS refinements: `[dir='rtl']` letter-spacing resets where needed, dark-theme overrides for tinted surfaces, a `forced-colors` block for the `DescriptionList` divided variant, and a `Select` dropdown item-padding fix. Released in lockstep with `@dev-dga/react@0.8.1` and `@dev-dga/tokens@0.8.1`.
+
 ## 0.8.0
 
 ### Minor Changes

package/dist/components/aspect-ratio.css

@@ -0,0 +1,2 @@
+@layer ddga-components{.ddga-aspect-ratio{inline-size:100%;aspect-ratio:var(--ddga-aspect-ratio,1);object-fit:cover;position:relative;overflow:hidden}.ddga-aspect-ratio>*{block-size:100%;inline-size:100%}.ddga-aspect-ratio>:is(img,video,canvas,iframe){object-fit:cover}}
+/*# sourceMappingURL=aspect-ratio.css.map */

package/dist/components/aspect-ratio.css.map

@@ -0,0 +1 @@
+{"version":3,"mappings":"AAAA,uBASE,+HAWA,sDAMA","sources":["src/components/aspect-ratio.css"],"sourcesContent":["@layer ddga-components {\n  /* Constrains content to a fixed width-to-height ratio via the native CSS\n     `aspect-ratio` property (Baseline 2021) — no padding-bottom hack. The ratio\n     comes from the `--ddga-aspect-ratio` custom property the component sets\n     inline (default 1). Full-width by default; the consumer constrains the\n     width, the height follows. Direction-agnostic — `aspect-ratio` and the\n     logical sizing properties need no RTL handling. No color surface, so no\n     dark-mode or forced-colors block is required. */\n\n  .ddga-aspect-ratio {\n    position: relative;\n    inline-size: 100%;\n    aspect-ratio: var(--ddga-aspect-ratio, 1);\n    overflow: hidden;\n    /* Applies when `asChild` renders the class directly onto a replaced element\n       (<img>/<video>); a no-op on the wrapper <div>. */\n    object-fit: cover;\n  }\n\n  /* Wrapper case: the single child fills the ratio box. */\n  .ddga-aspect-ratio > * {\n    block-size: 100%;\n    inline-size: 100%;\n  }\n  /* `object-fit` only affects replaced elements — scope it so the intent is\n     explicit (a no-op on <div>/custom children, cover-crops media). */\n  .ddga-aspect-ratio > :is(img, video, canvas, iframe) {\n    object-fit: cover;\n  }\n}\n"],"names":[]}

package/dist/components/avatar.css

@@ -1,2 +1,2 @@
-@layer ddga-components{.ddga-avatar{--ddga-avatar-size:40px;inline-size:var(--ddga-avatar-size);block-size:var(--ddga-avatar-size);background-color:var(--ddga-color-muted);color:var(--ddga-text-secondary);font-size:calc(var(--ddga-avatar-size) * .4);font-weight:var(--ddga-font-weight-medium);vertical-align:middle;flex-shrink:0;justify-content:center;align-items:center;line-height:1;display:inline-flex;position:relative}.ddga-avatar--xs{--ddga-avatar-size:24px}.ddga-avatar--sm{--ddga-avatar-size:32px}.ddga-avatar--md{--ddga-avatar-size:40px}.ddga-avatar--lg{--ddga-avatar-size:48px}.ddga-avatar--xl{--ddga-avatar-size:64px}.ddga-avatar--circle{border-radius:var(--ddga-radius-full)}.ddga-avatar--square{border-radius:var(--ddga-radius-md)}.ddga-avatar__image,.ddga-avatar__fallback{border-radius:inherit;block-size:100%;inline-size:100%}.ddga-avatar__image{object-fit:cover}.ddga-avatar__fallback{background-color:inherit;color:inherit;font-size:inherit;font-weight:inherit;text-transform:uppercase;justify-content:center;align-items:center;display:flex}.ddga-avatar__fallback--default{background-color:var(--ddga-gray-100);color:var(--ddga-gray-700)}.ddga-avatar__fallback--primary{background-color:var(--ddga-sa-100);color:var(--ddga-sa-800)}.ddga-avatar__fallback--secondary{background-color:var(--ddga-gray-200);color:var(--ddga-gray-800)}.ddga-avatar__fallback--success{background-color:var(--ddga-success-100);color:var(--ddga-success-700)}.ddga-avatar__fallback--warning{background-color:var(--ddga-warning-100);color:var(--ddga-warning-700)}.ddga-avatar__fallback--destructive{background-color:var(--ddga-error-100);color:var(--ddga-error-700)}.ddga-avatar__fallback--info{background-color:var(--ddga-info-100);color:var(--ddga-info-700)}.ddga-avatar__status{inline-size:calc(var(--ddga-avatar-size) * .25);block-size:calc(var(--ddga-avatar-size) * .25);border-radius:var(--ddga-radius-full);min-block-size:8px;min-inline-size:8px;box-shadow:0 0 0 2px var(--ddga-color-background);position:absolute;inset-block-end:0;inset-inline-end:0}.ddga-avatar__status--online{background-color:var(--ddga-color-success)}.ddga-avatar__status--busy{background-color:var(--ddga-color-destructive)}.ddga-avatar__status--away{background-color:var(--ddga-color-warning)}.ddga-avatar__status--offline{background-color:var(--ddga-gray-400)}.ddga-avatar--square .ddga-avatar__status{inset-block-end:2px;inset-inline-end:2px}.ddga-avatar-group{align-items:center;display:inline-flex}.ddga-avatar-group>.ddga-avatar{box-shadow:0 0 0 2px var(--ddga-color-background);margin-inline-start:calc(var(--ddga-avatar-size) * -.25)}.ddga-avatar-group>.ddga-avatar:first-child{margin-inline-start:0}@media (forced-colors:active){.ddga-avatar,.ddga-avatar__status{border:1px solid canvastext}}}
+@layer ddga-components{.ddga-avatar{--ddga-avatar-size:40px;inline-size:var(--ddga-avatar-size);block-size:var(--ddga-avatar-size);background-color:var(--ddga-color-muted);color:var(--ddga-text-secondary);font-size:calc(var(--ddga-avatar-size) * .4);font-weight:var(--ddga-font-weight-medium);vertical-align:middle;flex-shrink:0;justify-content:center;align-items:center;line-height:1;display:inline-flex;position:relative}.ddga-avatar--xs{--ddga-avatar-size:24px}.ddga-avatar--sm{--ddga-avatar-size:32px}.ddga-avatar--md{--ddga-avatar-size:40px}.ddga-avatar--lg{--ddga-avatar-size:48px}.ddga-avatar--xl{--ddga-avatar-size:64px}.ddga-avatar--circle{border-radius:var(--ddga-radius-full)}.ddga-avatar--square{border-radius:var(--ddga-radius-md)}.ddga-avatar__image,.ddga-avatar__fallback{border-radius:inherit;block-size:100%;inline-size:100%}.ddga-avatar__image{object-fit:cover}.ddga-avatar__fallback{background-color:inherit;color:inherit;font-size:inherit;font-weight:inherit;text-transform:uppercase;justify-content:center;align-items:center;display:flex}.ddga-avatar__fallback--default{background-color:var(--ddga-gray-100);color:var(--ddga-gray-700)}.ddga-avatar__fallback--primary{background-color:var(--ddga-sa-100);color:var(--ddga-sa-800)}.ddga-avatar__fallback--secondary{background-color:var(--ddga-gray-200);color:var(--ddga-gray-800)}.ddga-avatar__fallback--success{background-color:var(--ddga-success-100);color:var(--ddga-success-700)}.ddga-avatar__fallback--warning{background-color:var(--ddga-warning-100);color:var(--ddga-warning-700)}.ddga-avatar__fallback--destructive{background-color:var(--ddga-error-100);color:var(--ddga-error-700)}.ddga-avatar__fallback--info{background-color:var(--ddga-info-100);color:var(--ddga-info-700)}.ddga-avatar__status{inline-size:calc(var(--ddga-avatar-size) * .25);block-size:calc(var(--ddga-avatar-size) * .25);border-radius:var(--ddga-radius-full);min-block-size:8px;min-inline-size:8px;box-shadow:0 0 0 2px var(--ddga-color-background);position:absolute;inset-block-end:0;inset-inline-end:0}.ddga-avatar__status--online{background-color:var(--ddga-color-success)}.ddga-avatar__status--busy{background-color:var(--ddga-color-destructive)}.ddga-avatar__status--away{background-color:var(--ddga-color-warning)}.ddga-avatar__status--offline{background-color:var(--ddga-gray-400)}.ddga-avatar--square .ddga-avatar__status{inset-block-end:2px;inset-inline-end:2px}.ddga-avatar-group{align-items:center;display:inline-flex}.ddga-avatar-group>.ddga-avatar{box-shadow:0 0 0 2px var(--ddga-color-background);margin-inline-start:calc(var(--ddga-avatar-size) * -.25)}.ddga-avatar-group>.ddga-avatar:first-child{margin-inline-start:0}[data-theme=dark] .ddga-avatar__fallback--default{background-color:var(--ddga-gray-800);color:var(--ddga-gray-200)}[data-theme=dark] .ddga-avatar__fallback--primary{background-color:var(--ddga-sa-900);color:var(--ddga-sa-200)}[data-theme=dark] .ddga-avatar__fallback--secondary{background-color:var(--ddga-gray-700);color:var(--ddga-gray-100)}[data-theme=dark] .ddga-avatar__fallback--success{background-color:var(--ddga-success-900);color:var(--ddga-success-200)}[data-theme=dark] .ddga-avatar__fallback--warning{background-color:var(--ddga-warning-900);color:var(--ddga-warning-200)}[data-theme=dark] .ddga-avatar__fallback--destructive{background-color:var(--ddga-error-900);color:var(--ddga-error-200)}[data-theme=dark] .ddga-avatar__fallback--info{background-color:var(--ddga-info-900);color:var(--ddga-info-200)}[data-theme=dark] .ddga-avatar__status--offline{background-color:var(--ddga-gray-500)}@media (forced-colors:active){.ddga-avatar,.ddga-avatar__status{border:1px solid canvastext}.ddga-avatar-group>.ddga-avatar{outline-offset:-1px;outline:2px solid canvastext}}}
 /*# sourceMappingURL=avatar.css.map */

package/dist/components/avatar.css.map

@@ -1 +1 @@
-{"version":3,"mappings":"AAAA,uBAGE,gZAqBA,yCAGA,yCAGA,yCAGA,yCAGA,yCAMA,2DAIA,yDAMA,kGAOA,qCAIA,oLAcA,iGAIA,6FAIA,mGAIA,uGAIA,uGAIA,uGAIA,8FAOA,0SAaA,wEAGA,0EAGA,sEAGA,oEAMA,mFAOA,0DAIA,2IAOA,kEAMA,8BACE","sources":["src/components/avatar.css"],"sourcesContent":["@layer ddga-components {\n  /* ─── Root ─── */\n\n  .ddga-avatar {\n    --ddga-avatar-size: 40px;\n    position: relative;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    inline-size: var(--ddga-avatar-size);\n    block-size: var(--ddga-avatar-size);\n    /* Don't clip the status dot — it's positioned half-outside the root. */\n    background-color: var(--ddga-color-muted);\n    color: var(--ddga-text-secondary);\n    /* Font sizing tracks the avatar size so fallback initials scale naturally. */\n    font-size: calc(var(--ddga-avatar-size) * 0.4);\n    font-weight: var(--ddga-font-weight-medium);\n    line-height: 1;\n    vertical-align: middle;\n  }\n\n  /* ─── Sizes (drive both the box + the fallback font via the var) ─── */\n\n  .ddga-avatar--xs {\n    --ddga-avatar-size: 24px;\n  }\n  .ddga-avatar--sm {\n    --ddga-avatar-size: 32px;\n  }\n  .ddga-avatar--md {\n    --ddga-avatar-size: 40px;\n  }\n  .ddga-avatar--lg {\n    --ddga-avatar-size: 48px;\n  }\n  .ddga-avatar--xl {\n    --ddga-avatar-size: 64px;\n  }\n\n  /* ─── Shapes ─── */\n\n  .ddga-avatar--circle {\n    border-radius: var(--ddga-radius-full);\n  }\n\n  .ddga-avatar--square {\n    border-radius: var(--ddga-radius-md);\n  }\n\n  /* ─── Image / Fallback (clip to the root's shape) ─── */\n\n  .ddga-avatar__image,\n  .ddga-avatar__fallback {\n    inline-size: 100%;\n    block-size: 100%;\n    border-radius: inherit;\n  }\n\n  .ddga-avatar__image {\n    object-fit: cover;\n  }\n\n  .ddga-avatar__fallback {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    background-color: inherit;\n    color: inherit;\n    font-size: inherit;\n    font-weight: inherit;\n    text-transform: uppercase;\n  }\n\n  /* Tonal color schemes — useful for distinguishing avatars by team/role/\n     status in chat & team UIs. Each pair uses the same -100/-700-800 tonal\n     scale as Badge subtle variants, so the family reads consistently. */\n  .ddga-avatar__fallback--default {\n    background-color: var(--ddga-gray-100);\n    color: var(--ddga-gray-700);\n  }\n  .ddga-avatar__fallback--primary {\n    background-color: var(--ddga-sa-100);\n    color: var(--ddga-sa-800);\n  }\n  .ddga-avatar__fallback--secondary {\n    background-color: var(--ddga-gray-200);\n    color: var(--ddga-gray-800);\n  }\n  .ddga-avatar__fallback--success {\n    background-color: var(--ddga-success-100);\n    color: var(--ddga-success-700);\n  }\n  .ddga-avatar__fallback--warning {\n    background-color: var(--ddga-warning-100);\n    color: var(--ddga-warning-700);\n  }\n  .ddga-avatar__fallback--destructive {\n    background-color: var(--ddga-error-100);\n    color: var(--ddga-error-700);\n  }\n  .ddga-avatar__fallback--info {\n    background-color: var(--ddga-info-100);\n    color: var(--ddga-info-700);\n  }\n\n  /* ─── Status indicator (bottom-end corner, RTL-aware via logical props) ─── */\n\n  .ddga-avatar__status {\n    position: absolute;\n    inset-block-end: 0;\n    inset-inline-end: 0;\n    inline-size: calc(var(--ddga-avatar-size) * 0.25);\n    block-size: calc(var(--ddga-avatar-size) * 0.25);\n    min-inline-size: 8px;\n    min-block-size: 8px;\n    border-radius: var(--ddga-radius-full);\n    /* Cuts a \"ring\" out of the avatar so the dot reads as separate. */\n    box-shadow: 0 0 0 2px var(--ddga-color-background);\n  }\n\n  .ddga-avatar__status--online {\n    background-color: var(--ddga-color-success);\n  }\n  .ddga-avatar__status--busy {\n    background-color: var(--ddga-color-destructive);\n  }\n  .ddga-avatar__status--away {\n    background-color: var(--ddga-color-warning);\n  }\n  .ddga-avatar__status--offline {\n    background-color: var(--ddga-gray-400);\n  }\n\n  /* Square avatars: tuck the status into the corner instead of overhanging,\n     because a square corner doesn't disguise the overhang the way a circle does. */\n  .ddga-avatar--square .ddga-avatar__status {\n    inset-block-end: 2px;\n    inset-inline-end: 2px;\n  }\n\n  /* ─── Group ─── */\n\n  .ddga-avatar-group {\n    display: inline-flex;\n    align-items: center;\n  }\n  .ddga-avatar-group > .ddga-avatar {\n    /* Each subsequent avatar tucks under the previous one. Logical margin\n       so stacking flips correctly in RTL. */\n    margin-inline-start: calc(var(--ddga-avatar-size) * -0.25);\n    /* Ring around each so they read as separate even when overlapping. */\n    box-shadow: 0 0 0 2px var(--ddga-color-background);\n  }\n  .ddga-avatar-group > .ddga-avatar:first-child {\n    margin-inline-start: 0;\n  }\n\n  /* ─── Forced colors ─── */\n\n  @media (forced-colors: active) {\n    .ddga-avatar {\n      border: 1px solid CanvasText;\n    }\n    .ddga-avatar__status {\n      border: 1px solid CanvasText;\n    }\n  }\n}\n"],"names":[]}
+{"version":3,"mappings":"AAAA,uBAGE,gZAqBA,yCAGA,yCAGA,yCAGA,yCAGA,yCAMA,2DAIA,yDAMA,kGAOA,qCAIA,oLAcA,iGAIA,6FAIA,mGAIA,uGAIA,uGAIA,uGAIA,8FAOA,0SAaA,wEAGA,0EAGA,sEAGA,oEAMA,mFAOA,0DAIA,2IAOA,kEAUA,mHAIA,+GAIA,qHAIA,yHAIA,yHAIA,yHAIA,gHAIA,sFAMA,8BACE,8DAMA","sources":["src/components/avatar.css"],"sourcesContent":["@layer ddga-components {\n  /* ─── Root ─── */\n\n  .ddga-avatar {\n    --ddga-avatar-size: 40px;\n    position: relative;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    inline-size: var(--ddga-avatar-size);\n    block-size: var(--ddga-avatar-size);\n    /* Don't clip the status dot — it's positioned half-outside the root. */\n    background-color: var(--ddga-color-muted);\n    color: var(--ddga-text-secondary);\n    /* Font sizing tracks the avatar size so fallback initials scale naturally. */\n    font-size: calc(var(--ddga-avatar-size) * 0.4);\n    font-weight: var(--ddga-font-weight-medium);\n    line-height: 1;\n    vertical-align: middle;\n  }\n\n  /* ─── Sizes (drive both the box + the fallback font via the var) ─── */\n\n  .ddga-avatar--xs {\n    --ddga-avatar-size: 24px;\n  }\n  .ddga-avatar--sm {\n    --ddga-avatar-size: 32px;\n  }\n  .ddga-avatar--md {\n    --ddga-avatar-size: 40px;\n  }\n  .ddga-avatar--lg {\n    --ddga-avatar-size: 48px;\n  }\n  .ddga-avatar--xl {\n    --ddga-avatar-size: 64px;\n  }\n\n  /* ─── Shapes ─── */\n\n  .ddga-avatar--circle {\n    border-radius: var(--ddga-radius-full);\n  }\n\n  .ddga-avatar--square {\n    border-radius: var(--ddga-radius-md);\n  }\n\n  /* ─── Image / Fallback (clip to the root's shape) ─── */\n\n  .ddga-avatar__image,\n  .ddga-avatar__fallback {\n    inline-size: 100%;\n    block-size: 100%;\n    border-radius: inherit;\n  }\n\n  .ddga-avatar__image {\n    object-fit: cover;\n  }\n\n  .ddga-avatar__fallback {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    background-color: inherit;\n    color: inherit;\n    font-size: inherit;\n    font-weight: inherit;\n    text-transform: uppercase;\n  }\n\n  /* Tonal color schemes — useful for distinguishing avatars by team/role/\n     status in chat & team UIs. Each pair uses the same -100/-700-800 tonal\n     scale as Badge subtle variants, so the family reads consistently. */\n  .ddga-avatar__fallback--default {\n    background-color: var(--ddga-gray-100);\n    color: var(--ddga-gray-700);\n  }\n  .ddga-avatar__fallback--primary {\n    background-color: var(--ddga-sa-100);\n    color: var(--ddga-sa-800);\n  }\n  .ddga-avatar__fallback--secondary {\n    background-color: var(--ddga-gray-200);\n    color: var(--ddga-gray-800);\n  }\n  .ddga-avatar__fallback--success {\n    background-color: var(--ddga-success-100);\n    color: var(--ddga-success-700);\n  }\n  .ddga-avatar__fallback--warning {\n    background-color: var(--ddga-warning-100);\n    color: var(--ddga-warning-700);\n  }\n  .ddga-avatar__fallback--destructive {\n    background-color: var(--ddga-error-100);\n    color: var(--ddga-error-700);\n  }\n  .ddga-avatar__fallback--info {\n    background-color: var(--ddga-info-100);\n    color: var(--ddga-info-700);\n  }\n\n  /* ─── Status indicator (bottom-end corner, RTL-aware via logical props) ─── */\n\n  .ddga-avatar__status {\n    position: absolute;\n    inset-block-end: 0;\n    inset-inline-end: 0;\n    inline-size: calc(var(--ddga-avatar-size) * 0.25);\n    block-size: calc(var(--ddga-avatar-size) * 0.25);\n    min-inline-size: 8px;\n    min-block-size: 8px;\n    border-radius: var(--ddga-radius-full);\n    /* Cuts a \"ring\" out of the avatar so the dot reads as separate. */\n    box-shadow: 0 0 0 2px var(--ddga-color-background);\n  }\n\n  .ddga-avatar__status--online {\n    background-color: var(--ddga-color-success);\n  }\n  .ddga-avatar__status--busy {\n    background-color: var(--ddga-color-destructive);\n  }\n  .ddga-avatar__status--away {\n    background-color: var(--ddga-color-warning);\n  }\n  .ddga-avatar__status--offline {\n    background-color: var(--ddga-gray-400);\n  }\n\n  /* Square avatars: tuck the status into the corner instead of overhanging,\n     because a square corner doesn't disguise the overhang the way a circle does. */\n  .ddga-avatar--square .ddga-avatar__status {\n    inset-block-end: 2px;\n    inset-inline-end: 2px;\n  }\n\n  /* ─── Group ─── */\n\n  .ddga-avatar-group {\n    display: inline-flex;\n    align-items: center;\n  }\n  .ddga-avatar-group > .ddga-avatar {\n    /* Each subsequent avatar tucks under the previous one. Logical margin\n       so stacking flips correctly in RTL. */\n    margin-inline-start: calc(var(--ddga-avatar-size) * -0.25);\n    /* Ring around each so they read as separate even when overlapping. */\n    box-shadow: 0 0 0 2px var(--ddga-color-background);\n  }\n  .ddga-avatar-group > .ddga-avatar:first-child {\n    margin-inline-start: 0;\n  }\n\n  /* ─── Dark mode adjustments ─── */\n  /* The fallback schemes paint raw -100 tints with -700/-800 text — light\n     chips that stay legible but don't adapt to a dark page on their own. Flip\n     each to a dark -800/-900 surface with a light -100/-200 foreground\n     (mirrors alert.css). */\n\n  [data-theme='dark'] .ddga-avatar__fallback--default {\n    background-color: var(--ddga-gray-800);\n    color: var(--ddga-gray-200);\n  }\n  [data-theme='dark'] .ddga-avatar__fallback--primary {\n    background-color: var(--ddga-sa-900);\n    color: var(--ddga-sa-200);\n  }\n  [data-theme='dark'] .ddga-avatar__fallback--secondary {\n    background-color: var(--ddga-gray-700);\n    color: var(--ddga-gray-100);\n  }\n  [data-theme='dark'] .ddga-avatar__fallback--success {\n    background-color: var(--ddga-success-900);\n    color: var(--ddga-success-200);\n  }\n  [data-theme='dark'] .ddga-avatar__fallback--warning {\n    background-color: var(--ddga-warning-900);\n    color: var(--ddga-warning-200);\n  }\n  [data-theme='dark'] .ddga-avatar__fallback--destructive {\n    background-color: var(--ddga-error-900);\n    color: var(--ddga-error-200);\n  }\n  [data-theme='dark'] .ddga-avatar__fallback--info {\n    background-color: var(--ddga-info-900);\n    color: var(--ddga-info-200);\n  }\n  [data-theme='dark'] .ddga-avatar__status--offline {\n    background-color: var(--ddga-gray-500);\n  }\n\n  /* ─── Forced colors ─── */\n\n  @media (forced-colors: active) {\n    .ddga-avatar {\n      border: 1px solid CanvasText;\n    }\n    .ddga-avatar__status {\n      border: 1px solid CanvasText;\n    }\n    .ddga-avatar-group > .ddga-avatar {\n      outline: 2px solid CanvasText;\n      outline-offset: -1px;\n    }\n  }\n}\n"],"names":[]}

package/dist/components/badge.css

@@ -1,2 +1,2 @@
-@layer ddga-components{.ddga-badge{justify-content:center;align-items:center;gap:var(--ddga-space-1);border-radius:var(--ddga-radius-full);font-weight:var(--ddga-font-weight-medium);white-space:nowrap;-webkit-user-select:none;user-select:none;border:1px solid #0000;font-family:inherit;line-height:1.4;display:inline-flex}.ddga-badge--sm{height:20px;padding-inline:var(--ddga-space-2);font-size:var(--ddga-font-size-xs)}.ddga-badge--md{height:24px;padding-inline:var(--ddga-space-2);font-size:var(--ddga-font-size-xs)}.ddga-badge--default{background-color:var(--ddga-gray-100);color:var(--ddga-gray-700)}.ddga-badge--primary{background-color:var(--ddga-color-primary);color:var(--ddga-color-primary-foreground)}.ddga-badge--secondary{background-color:var(--ddga-color-secondary);color:var(--ddga-color-secondary-foreground)}.ddga-badge--destructive{background-color:var(--ddga-color-destructive);color:var(--ddga-color-destructive-foreground)}.ddga-badge--success{background-color:var(--ddga-color-success);color:var(--ddga-color-success-foreground)}.ddga-badge--warning{background-color:var(--ddga-color-warning);color:var(--ddga-color-warning-foreground)}.ddga-badge--info{background-color:var(--ddga-color-info);color:var(--ddga-color-info-foreground)}.ddga-badge--primary-subtle{background-color:var(--ddga-sa-100);color:var(--ddga-sa-800)}.ddga-badge--secondary-subtle{background-color:var(--ddga-gray-100);color:var(--ddga-gray-700)}.ddga-badge--destructive-subtle{background-color:var(--ddga-error-100);color:var(--ddga-error-700)}.ddga-badge--success-subtle{background-color:var(--ddga-success-100);color:var(--ddga-success-700)}.ddga-badge--warning-subtle{background-color:var(--ddga-warning-100);color:var(--ddga-warning-700)}.ddga-badge--info-subtle{background-color:var(--ddga-info-100);color:var(--ddga-info-700)}.ddga-badge--outline{color:var(--ddga-color-foreground);border-color:var(--ddga-color-border);background-color:#0000}.ddga-badge__dot{border-radius:var(--ddga-radius-full);background-color:currentColor;flex-shrink:0;block-size:.5em;inline-size:.5em}.ddga-badge__icon{flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.ddga-badge__icon>svg,.ddga-badge>svg{width:.875em;height:.875em;display:block}.ddga-badge svg{flex-shrink:0;align-self:center}.ddga-badge__close{border-radius:var(--ddga-radius-full);block-size:1.5em;inline-size:1.5em;color:inherit;cursor:pointer;font:inherit;appearance:none;background-color:#0000;border:0;justify-content:center;align-items:center;margin-inline:.125em -.25em;padding:0;display:inline-flex}.ddga-badge__close>svg{block-size:.75em;inline-size:.75em}.ddga-badge__close:hover{background-color:color-mix(in srgb, currentColor 18%, transparent)}.ddga-badge__close:focus-visible{outline:2px solid var(--ddga-color-ring);outline-offset:1px}@media (forced-colors:active){.ddga-badge{border:1px solid canvastext}}}
+@layer ddga-components{.ddga-badge{justify-content:center;align-items:center;gap:var(--ddga-space-1);border-radius:var(--ddga-radius-full);font-weight:var(--ddga-font-weight-medium);white-space:nowrap;-webkit-user-select:none;user-select:none;border:1px solid #0000;font-family:inherit;line-height:1.4;display:inline-flex}.ddga-badge--sm{height:20px;padding-inline:var(--ddga-space-2);font-size:var(--ddga-font-size-xs)}.ddga-badge--md{height:24px;padding-inline:var(--ddga-space-2);font-size:var(--ddga-font-size-xs)}.ddga-badge--default{background-color:var(--ddga-gray-100);color:var(--ddga-gray-700)}.ddga-badge--primary{background-color:var(--ddga-color-primary);color:var(--ddga-color-primary-foreground)}.ddga-badge--secondary{background-color:var(--ddga-color-secondary);color:var(--ddga-color-secondary-foreground)}.ddga-badge--destructive{background-color:var(--ddga-color-destructive);color:var(--ddga-color-destructive-foreground)}.ddga-badge--success{background-color:var(--ddga-color-success);color:var(--ddga-color-success-foreground)}.ddga-badge--warning{background-color:var(--ddga-color-warning);color:var(--ddga-color-warning-foreground)}.ddga-badge--info{background-color:var(--ddga-color-info);color:var(--ddga-color-info-foreground)}.ddga-badge--primary-subtle{background-color:var(--ddga-sa-100);color:var(--ddga-sa-800)}.ddga-badge--secondary-subtle{background-color:var(--ddga-gray-100);color:var(--ddga-gray-700)}.ddga-badge--destructive-subtle{background-color:var(--ddga-error-100);color:var(--ddga-error-700)}.ddga-badge--success-subtle{background-color:var(--ddga-success-100);color:var(--ddga-success-700)}.ddga-badge--warning-subtle{background-color:var(--ddga-warning-100);color:var(--ddga-warning-700)}.ddga-badge--info-subtle{background-color:var(--ddga-info-100);color:var(--ddga-info-700)}.ddga-badge--outline{color:var(--ddga-color-foreground);border-color:var(--ddga-color-border);background-color:#0000}.ddga-badge__dot{border-radius:var(--ddga-radius-full);background-color:currentColor;flex-shrink:0;block-size:.5em;inline-size:.5em}.ddga-badge__icon{flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.ddga-badge__icon>svg,.ddga-badge>svg{width:.875em;height:.875em;display:block}.ddga-badge svg{flex-shrink:0;align-self:center}.ddga-badge__close{border-radius:var(--ddga-radius-full);block-size:1.5em;inline-size:1.5em;color:inherit;cursor:pointer;font:inherit;appearance:none;background-color:#0000;border:0;justify-content:center;align-items:center;margin-inline:.125em -.25em;padding:0;display:inline-flex}.ddga-badge__close>svg{block-size:.75em;inline-size:.75em}.ddga-badge__close:hover{background-color:color-mix(in srgb, currentColor 18%, transparent)}.ddga-badge__close:focus-visible{outline:2px solid var(--ddga-color-ring);outline-offset:1px}[data-theme=dark] .ddga-badge--default,[data-theme=dark] .ddga-badge--secondary-subtle{color:var(--ddga-gray-200);background-color:#ffffff1a}[data-theme=dark] .ddga-badge--primary-subtle{color:var(--ddga-sa-200,#b8eacb);background-color:#1b835433}[data-theme=dark] .ddga-badge--destructive-subtle{color:var(--ddga-error-200,#fecdca);background-color:#d92d202e}[data-theme=dark] .ddga-badge--success-subtle{color:var(--ddga-success-200,#abefc6);background-color:#0794552e}[data-theme=dark] .ddga-badge--warning-subtle{color:var(--ddga-warning-200,#fedf89);background-color:#dc68032e}[data-theme=dark] .ddga-badge--info-subtle{color:var(--ddga-info-200,#b2ddff);background-color:#1570ef29}@media (forced-colors:active){.ddga-badge{border:1px solid canvastext}}}
 /*# sourceMappingURL=badge.css.map */

package/dist/components/badge.css.map

@@ -1 +1 @@
-{"version":3,"mappings":"AAAA,uBAGE,2SAgBA,kGAMA,kGAQA,sFAKA,2GAKA,iHAKA,uHAKA,2GAKA,2GAKA,kGAOA,yFAKA,+FAKA,mGAKA,mGAKA,mGAKA,0FAOA,qHAQA,oIAUA,8FAOA,+EAOA,gDAOA,0RAmBA,0DAKA,4FAIA,6FAOA,8BACE","sources":["src/components/badge.css"],"sourcesContent":["@layer ddga-components {\n  /* ─── Base ─── */\n\n  .ddga-badge {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    gap: var(--ddga-space-1);\n    border: 1px solid transparent;\n    border-radius: var(--ddga-radius-full);\n    font-weight: var(--ddga-font-weight-medium);\n    font-family: inherit;\n    line-height: 1.4;\n    white-space: nowrap;\n    user-select: none;\n  }\n\n  /* ─── Sizes ─── */\n\n  .ddga-badge--sm {\n    height: 20px;\n    padding-inline: var(--ddga-space-2);\n    font-size: var(--ddga-font-size-xs);\n  }\n\n  .ddga-badge--md {\n    height: 24px;\n    padding-inline: var(--ddga-space-2);\n    font-size: var(--ddga-font-size-xs);\n  }\n\n  /* ─── Solid variants ─── */\n\n  .ddga-badge--default {\n    background-color: var(--ddga-gray-100);\n    color: var(--ddga-gray-700);\n  }\n\n  .ddga-badge--primary {\n    background-color: var(--ddga-color-primary);\n    color: var(--ddga-color-primary-foreground);\n  }\n\n  .ddga-badge--secondary {\n    background-color: var(--ddga-color-secondary);\n    color: var(--ddga-color-secondary-foreground);\n  }\n\n  .ddga-badge--destructive {\n    background-color: var(--ddga-color-destructive);\n    color: var(--ddga-color-destructive-foreground);\n  }\n\n  .ddga-badge--success {\n    background-color: var(--ddga-color-success);\n    color: var(--ddga-color-success-foreground);\n  }\n\n  .ddga-badge--warning {\n    background-color: var(--ddga-color-warning);\n    color: var(--ddga-color-warning-foreground);\n  }\n\n  .ddga-badge--info {\n    background-color: var(--ddga-color-info);\n    color: var(--ddga-color-info-foreground);\n  }\n\n  /* ─── Subtle (tonal) variants ─── */\n\n  .ddga-badge--primary-subtle {\n    background-color: var(--ddga-sa-100);\n    color: var(--ddga-sa-800);\n  }\n\n  .ddga-badge--secondary-subtle {\n    background-color: var(--ddga-gray-100);\n    color: var(--ddga-gray-700);\n  }\n\n  .ddga-badge--destructive-subtle {\n    background-color: var(--ddga-error-100);\n    color: var(--ddga-error-700);\n  }\n\n  .ddga-badge--success-subtle {\n    background-color: var(--ddga-success-100);\n    color: var(--ddga-success-700);\n  }\n\n  .ddga-badge--warning-subtle {\n    background-color: var(--ddga-warning-100);\n    color: var(--ddga-warning-700);\n  }\n\n  .ddga-badge--info-subtle {\n    background-color: var(--ddga-info-100);\n    color: var(--ddga-info-700);\n  }\n\n  /* ─── Outline ─── */\n\n  .ddga-badge--outline {\n    background-color: transparent;\n    color: var(--ddga-color-foreground);\n    border-color: var(--ddga-color-border);\n  }\n\n  /* ─── Dot ─── */\n\n  .ddga-badge__dot {\n    inline-size: 0.5em;\n    block-size: 0.5em;\n    border-radius: var(--ddga-radius-full);\n    background-color: currentColor;\n    flex-shrink: 0;\n  }\n\n  /* ─── Icons inside badge ─── */\n\n  .ddga-badge__icon {\n    flex-shrink: 0;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n  }\n\n  .ddga-badge__icon > svg,\n  .ddga-badge > svg {\n    width: 0.875em;\n    height: 0.875em;\n    display: block;\n  }\n\n  .ddga-badge svg {\n    flex-shrink: 0;\n    align-self: center;\n  }\n\n  /* ─── Close button (dismissible) ─── */\n\n  .ddga-badge__close {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    inline-size: 1.5em;\n    block-size: 1.5em;\n    margin-inline-start: 0.125em;\n    margin-inline-end: -0.25em;\n    padding: 0;\n    border: 0;\n    border-radius: var(--ddga-radius-full);\n    background-color: transparent;\n    color: inherit;\n    cursor: pointer;\n    font: inherit;\n    -webkit-appearance: none;\n    appearance: none;\n  }\n\n  .ddga-badge__close > svg {\n    inline-size: 0.75em;\n    block-size: 0.75em;\n  }\n\n  .ddga-badge__close:hover {\n    background-color: color-mix(in srgb, currentColor 18%, transparent);\n  }\n\n  .ddga-badge__close:focus-visible {\n    outline: 2px solid var(--ddga-color-ring);\n    outline-offset: 1px;\n  }\n\n  /* ─── Forced colors ─── */\n\n  @media (forced-colors: active) {\n    .ddga-badge {\n      border: 1px solid CanvasText;\n    }\n  }\n}\n"],"names":[]}
+{"version":3,"mappings":"AAAA,uBAGE,2SAgBA,kGAMA,kGAQA,sFAKA,2GAKA,iHAKA,uHAKA,2GAKA,2GAKA,kGAOA,yFAKA,+FAKA,mGAKA,mGAKA,mGAKA,0FAOA,qHAQA,oIAUA,8FAOA,+EAOA,gDAOA,0RAmBA,0DAKA,4FAIA,6FAYA,6IAKA,0GAIA,iHAIA,+GAIA,+GAIA,yGAOA,8BACE","sources":["src/components/badge.css"],"sourcesContent":["@layer ddga-components {\n  /* ─── Base ─── */\n\n  .ddga-badge {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    gap: var(--ddga-space-1);\n    border: 1px solid transparent;\n    border-radius: var(--ddga-radius-full);\n    font-weight: var(--ddga-font-weight-medium);\n    font-family: inherit;\n    line-height: 1.4;\n    white-space: nowrap;\n    user-select: none;\n  }\n\n  /* ─── Sizes ─── */\n\n  .ddga-badge--sm {\n    height: 20px;\n    padding-inline: var(--ddga-space-2);\n    font-size: var(--ddga-font-size-xs);\n  }\n\n  .ddga-badge--md {\n    height: 24px;\n    padding-inline: var(--ddga-space-2);\n    font-size: var(--ddga-font-size-xs);\n  }\n\n  /* ─── Solid variants ─── */\n\n  .ddga-badge--default {\n    background-color: var(--ddga-gray-100);\n    color: var(--ddga-gray-700);\n  }\n\n  .ddga-badge--primary {\n    background-color: var(--ddga-color-primary);\n    color: var(--ddga-color-primary-foreground);\n  }\n\n  .ddga-badge--secondary {\n    background-color: var(--ddga-color-secondary);\n    color: var(--ddga-color-secondary-foreground);\n  }\n\n  .ddga-badge--destructive {\n    background-color: var(--ddga-color-destructive);\n    color: var(--ddga-color-destructive-foreground);\n  }\n\n  .ddga-badge--success {\n    background-color: var(--ddga-color-success);\n    color: var(--ddga-color-success-foreground);\n  }\n\n  .ddga-badge--warning {\n    background-color: var(--ddga-color-warning);\n    color: var(--ddga-color-warning-foreground);\n  }\n\n  .ddga-badge--info {\n    background-color: var(--ddga-color-info);\n    color: var(--ddga-color-info-foreground);\n  }\n\n  /* ─── Subtle (tonal) variants ─── */\n\n  .ddga-badge--primary-subtle {\n    background-color: var(--ddga-sa-100);\n    color: var(--ddga-sa-800);\n  }\n\n  .ddga-badge--secondary-subtle {\n    background-color: var(--ddga-gray-100);\n    color: var(--ddga-gray-700);\n  }\n\n  .ddga-badge--destructive-subtle {\n    background-color: var(--ddga-error-100);\n    color: var(--ddga-error-700);\n  }\n\n  .ddga-badge--success-subtle {\n    background-color: var(--ddga-success-100);\n    color: var(--ddga-success-700);\n  }\n\n  .ddga-badge--warning-subtle {\n    background-color: var(--ddga-warning-100);\n    color: var(--ddga-warning-700);\n  }\n\n  .ddga-badge--info-subtle {\n    background-color: var(--ddga-info-100);\n    color: var(--ddga-info-700);\n  }\n\n  /* ─── Outline ─── */\n\n  .ddga-badge--outline {\n    background-color: transparent;\n    color: var(--ddga-color-foreground);\n    border-color: var(--ddga-color-border);\n  }\n\n  /* ─── Dot ─── */\n\n  .ddga-badge__dot {\n    inline-size: 0.5em;\n    block-size: 0.5em;\n    border-radius: var(--ddga-radius-full);\n    background-color: currentColor;\n    flex-shrink: 0;\n  }\n\n  /* ─── Icons inside badge ─── */\n\n  .ddga-badge__icon {\n    flex-shrink: 0;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n  }\n\n  .ddga-badge__icon > svg,\n  .ddga-badge > svg {\n    width: 0.875em;\n    height: 0.875em;\n    display: block;\n  }\n\n  .ddga-badge svg {\n    flex-shrink: 0;\n    align-self: center;\n  }\n\n  /* ─── Close button (dismissible) ─── */\n\n  .ddga-badge__close {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    inline-size: 1.5em;\n    block-size: 1.5em;\n    margin-inline-start: 0.125em;\n    margin-inline-end: -0.25em;\n    padding: 0;\n    border: 0;\n    border-radius: var(--ddga-radius-full);\n    background-color: transparent;\n    color: inherit;\n    cursor: pointer;\n    font: inherit;\n    -webkit-appearance: none;\n    appearance: none;\n  }\n\n  .ddga-badge__close > svg {\n    inline-size: 0.75em;\n    block-size: 0.75em;\n  }\n\n  .ddga-badge__close:hover {\n    background-color: color-mix(in srgb, currentColor 18%, transparent);\n  }\n\n  .ddga-badge__close:focus-visible {\n    outline: 2px solid var(--ddga-color-ring);\n    outline-offset: 1px;\n  }\n\n  /* ─── Dark mode adjustments ─── */\n  /* The `default` and `*-subtle` families fill from raw --ddga-*-100 tints, which\n     stay light in dark mode (the raw scale isn't theme-flipped) — they'd render as\n     light pills with dark text on a dark page. Recolor to translucent tints + a\n     light (-200) foreground so they read as dark-surface chips. Mirrors alert.css /\n     button.css. Solid + outline variants use semantic tokens and adapt on their own. */\n\n  [data-theme='dark'] .ddga-badge--default,\n  [data-theme='dark'] .ddga-badge--secondary-subtle {\n    background-color: rgb(255 255 255 / 0.1);\n    color: var(--ddga-gray-200);\n  }\n  [data-theme='dark'] .ddga-badge--primary-subtle {\n    background-color: rgb(27 131 84 / 0.2);\n    color: var(--ddga-sa-200, #b8eacb);\n  }\n  [data-theme='dark'] .ddga-badge--destructive-subtle {\n    background-color: rgb(217 45 32 / 0.18);\n    color: var(--ddga-error-200, #fecdca);\n  }\n  [data-theme='dark'] .ddga-badge--success-subtle {\n    background-color: rgb(7 148 85 / 0.18);\n    color: var(--ddga-success-200, #abefc6);\n  }\n  [data-theme='dark'] .ddga-badge--warning-subtle {\n    background-color: rgb(220 104 3 / 0.18);\n    color: var(--ddga-warning-200, #fedf89);\n  }\n  [data-theme='dark'] .ddga-badge--info-subtle {\n    background-color: rgb(21 112 239 / 0.16);\n    color: var(--ddga-info-200, #b2ddff);\n  }\n\n  /* ─── Forced colors ─── */\n\n  @media (forced-colors: active) {\n    .ddga-badge {\n      border: 1px solid CanvasText;\n    }\n  }\n}\n"],"names":[]}

package/dist/components/button.css

@@ -1,2 +1,2 @@
-@layer ddga-components{.ddga-button{justify-content:center;align-items:center;gap:var(--ddga-space-1);border-radius:var(--ddga-radius-sm);font-weight:var(--ddga-font-weight-medium);cursor:pointer;border:1px solid #0000;font-family:inherit;line-height:1.6;text-decoration:none;transition:background-color .15s,border-color .15s,color .15s,opacity .15s;display:inline-flex}.ddga-button--primary{background-color:var(--ddga-color-primary);color:var(--ddga-color-primary-foreground)}.ddga-button--primary:hover:not(:disabled):not([aria-disabled=true]){background-color:var(--ddga-color-primary-hover)}.ddga-button--secondary{background-color:var(--ddga-color-secondary);color:var(--ddga-color-secondary-foreground)}.ddga-button--secondary:hover:not(:disabled):not([aria-disabled=true]){background-color:var(--ddga-color-secondary-hover)}.ddga-button--outline{color:var(--ddga-color-foreground);border-color:var(--ddga-color-border);background-color:#0000}.ddga-button--outline:hover:not(:disabled):not([aria-disabled=true]){background-color:var(--ddga-color-muted)}.ddga-button--ghost{color:var(--ddga-color-foreground);background-color:#0000}.ddga-button--ghost:hover:not(:disabled):not([aria-disabled=true]){background-color:var(--ddga-color-muted)}.ddga-button--destructive{background-color:var(--ddga-color-destructive);color:var(--ddga-color-destructive-foreground)}.ddga-button--destructive:hover:not(:disabled):not([aria-disabled=true]){background-color:var(--ddga-color-destructive-hover)}.ddga-button--destructive-outline{color:var(--ddga-color-destructive);border-color:var(--ddga-color-destructive);background-color:#0000}.ddga-button--destructive-outline:hover:not(:disabled):not([aria-disabled=true]){background-color:var(--ddga-error-50)}.ddga-button--destructive-subtle{background-color:var(--ddga-error-50);color:var(--ddga-color-destructive)}.ddga-button--destructive-subtle:hover:not(:disabled):not([aria-disabled=true]){background-color:var(--ddga-error-100)}.ddga-button--destructive-ghost{color:var(--ddga-color-destructive);background-color:#0000}.ddga-button--destructive-ghost:hover:not(:disabled):not([aria-disabled=true]){background-color:var(--ddga-error-50)}.ddga-button--sm{height:32px;padding-inline:var(--ddga-space-3);font-size:var(--ddga-font-size-sm)}.ddga-button--md{height:36px;padding-inline:var(--ddga-space-4);font-size:var(--ddga-font-size-base)}.ddga-button--lg{height:40px;padding-inline:var(--ddga-space-4);font-size:var(--ddga-font-size-lg)}.ddga-button--icon{width:40px;height:40px;font-size:var(--ddga-font-size-base);padding:0}.ddga-button--icon-sm{width:28px;height:28px;font-size:var(--ddga-font-size-sm);padding:0}.ddga-button--full-width{flex:1 0 100%;inline-size:100%}.ddga-button--inverted.ddga-button--outline,.ddga-button--inverted.ddga-button--ghost{color:#fff;background-color:#0000}.ddga-button--inverted.ddga-button--outline{border-color:#fff6}.ddga-button--inverted.ddga-button--outline:hover:not(:disabled):not([aria-disabled=true]),.ddga-button--inverted.ddga-button--ghost:hover:not(:disabled):not([aria-disabled=true]){background-color:#ffffff1f}.ddga-button--inverted.ddga-button--outline:hover:not(:disabled):not([aria-disabled=true]){border-color:#fff9}.ddga-button--inverted.ddga-button--destructive-outline,.ddga-button--inverted.ddga-button--destructive-ghost{color:var(--ddga-error-200)}.ddga-button--inverted.ddga-button--destructive-outline{border-color:var(--ddga-error-300)}.ddga-button--inverted.ddga-button--destructive-outline:hover:not(:disabled):not([aria-disabled=true]),.ddga-button--inverted.ddga-button--destructive-ghost:hover:not(:disabled):not([aria-disabled=true]){background-color:#ffffff14}.ddga-button--fab{border-radius:var(--ddga-radius-full);box-shadow:var(--ddga-shadow-lg)}.ddga-button.ddga-button--fab:focus-visible{border-color:var(--ddga-color-ring);box-shadow:0 0 0 2px var(--ddga-color-ring), var(--ddga-shadow-lg)}.ddga-button--loading{cursor:wait;position:relative}.ddga-button__text{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.ddga-button__icon{flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.ddga-button svg{flex-shrink:0;align-self:center}@media (prefers-reduced-motion:reduce){.ddga-button{transition:none}}.ddga-button:disabled,.ddga-button[aria-disabled=true]{opacity:.5;cursor:not-allowed}.ddga-button:focus-visible{border-color:var(--ddga-color-ring);box-shadow:0 0 0 1px var(--ddga-color-ring);outline:none}@media (forced-colors:active){.ddga-button{border:1px solid buttontext}.ddga-button:focus-visible{outline:2px solid highlight}.ddga-button:disabled,.ddga-button[aria-disabled=true]{color:graytext;border-color:graytext}}}
+@layer ddga-components{.ddga-button{justify-content:center;align-items:center;gap:var(--ddga-space-1);border-radius:var(--ddga-radius-sm);font-weight:var(--ddga-font-weight-medium);cursor:pointer;border:1px solid #0000;font-family:inherit;line-height:1.6;text-decoration:none;transition:background-color .15s,border-color .15s,color .15s,opacity .15s;display:inline-flex}.ddga-button--primary{background-color:var(--ddga-color-primary);color:var(--ddga-color-primary-foreground)}.ddga-button--primary:hover:not(:disabled):not([aria-disabled=true]){background-color:var(--ddga-color-primary-hover)}.ddga-button--secondary{background-color:var(--ddga-color-secondary);color:var(--ddga-color-secondary-foreground)}.ddga-button--secondary:hover:not(:disabled):not([aria-disabled=true]){background-color:var(--ddga-color-secondary-hover)}.ddga-button--outline{color:var(--ddga-color-foreground);border-color:var(--ddga-color-border);background-color:#0000}.ddga-button--outline:hover:not(:disabled):not([aria-disabled=true]){background-color:var(--ddga-color-muted)}.ddga-button--ghost{color:var(--ddga-color-foreground);background-color:#0000}.ddga-button--ghost:hover:not(:disabled):not([aria-disabled=true]){background-color:var(--ddga-color-muted)}.ddga-button--destructive{background-color:var(--ddga-color-destructive);color:var(--ddga-color-destructive-foreground)}.ddga-button--destructive:hover:not(:disabled):not([aria-disabled=true]){background-color:var(--ddga-color-destructive-hover)}.ddga-button--destructive-outline{color:var(--ddga-color-destructive);border-color:var(--ddga-color-destructive);background-color:#0000}.ddga-button--destructive-outline:hover:not(:disabled):not([aria-disabled=true]){background-color:var(--ddga-error-50)}.ddga-button--destructive-subtle{background-color:var(--ddga-error-50);color:var(--ddga-color-destructive)}.ddga-button--destructive-subtle:hover:not(:disabled):not([aria-disabled=true]){background-color:var(--ddga-error-100)}.ddga-button--destructive-ghost{color:var(--ddga-color-destructive);background-color:#0000}.ddga-button--destructive-ghost:hover:not(:disabled):not([aria-disabled=true]){background-color:var(--ddga-error-50)}.ddga-button--sm{height:32px;padding-inline:var(--ddga-space-3);font-size:var(--ddga-font-size-sm)}.ddga-button--md{height:36px;padding-inline:var(--ddga-space-4);font-size:var(--ddga-font-size-base)}.ddga-button--lg{height:40px;padding-inline:var(--ddga-space-4);font-size:var(--ddga-font-size-lg)}.ddga-button--icon{width:40px;height:40px;font-size:var(--ddga-font-size-base);padding:0}.ddga-button--icon-sm{width:28px;height:28px;font-size:var(--ddga-font-size-sm);padding:0}.ddga-button--full-width{flex:1 0 100%;inline-size:100%}.ddga-button--inverted.ddga-button--outline,.ddga-button--inverted.ddga-button--ghost{color:#fff;background-color:#0000}.ddga-button--inverted.ddga-button--outline{border-color:#fff6}.ddga-button--inverted.ddga-button--outline:hover:not(:disabled):not([aria-disabled=true]),.ddga-button--inverted.ddga-button--ghost:hover:not(:disabled):not([aria-disabled=true]){background-color:#ffffff1f}.ddga-button--inverted.ddga-button--outline:hover:not(:disabled):not([aria-disabled=true]){border-color:#fff9}.ddga-button--inverted.ddga-button--destructive-outline,.ddga-button--inverted.ddga-button--destructive-ghost{color:var(--ddga-error-200)}.ddga-button--inverted.ddga-button--destructive-outline{border-color:var(--ddga-error-300)}.ddga-button--inverted.ddga-button--destructive-outline:hover:not(:disabled):not([aria-disabled=true]),.ddga-button--inverted.ddga-button--destructive-ghost:hover:not(:disabled):not([aria-disabled=true]){background-color:#ffffff14}.ddga-button--fab{border-radius:var(--ddga-radius-full);box-shadow:var(--ddga-shadow-lg)}.ddga-button.ddga-button--fab:focus-visible{border-color:var(--ddga-color-ring);box-shadow:0 0 0 2px var(--ddga-color-ring), var(--ddga-shadow-lg)}.ddga-button--loading{cursor:wait;position:relative}.ddga-button__text{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.ddga-button__icon{flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.ddga-button svg{flex-shrink:0;align-self:center}@media (prefers-reduced-motion:reduce){.ddga-button{transition:none}}.ddga-button:disabled,.ddga-button[aria-disabled=true]{opacity:.5;cursor:not-allowed}.ddga-button:focus-visible{border-color:var(--ddga-color-ring);box-shadow:0 0 0 1px var(--ddga-color-ring);outline:none}[data-theme=dark] .ddga-button--destructive-subtle{background-color:#d92d202e}[data-theme=dark] .ddga-button--destructive-subtle:hover:not(:disabled):not([aria-disabled=true]){background-color:#d92d2047}[data-theme=dark] .ddga-button--destructive-outline:hover:not(:disabled):not([aria-disabled=true]),[data-theme=dark] .ddga-button--destructive-ghost:hover:not(:disabled):not([aria-disabled=true]){background-color:#d92d202e}@media (forced-colors:active){.ddga-button{border:1px solid buttontext}.ddga-button:focus-visible{outline:2px solid highlight}.ddga-button:disabled,.ddga-button[aria-disabled=true]{color:graytext;border-color:graytext}}}
 /*# sourceMappingURL=button.css.map */

package/dist/components/button.css.map

@@ -1 +1 @@
-{"version":3,"mappings":"AAAA,uBAGE,4VAqBA,4GAIA,sHAMA,kHAIA,0HAMA,sHAKA,8GAMA,8EAIA,4GAMA,wHAIA,8HAMA,wIAKA,uHAMA,2GAIA,uHAMA,2FAIA,qHAMA,mGAKA,qGAKA,mGAKA,yFAQA,0FASA,wDAaA,wHAKA,+DAGA,+MAIA,8GAGA,0IAMA,2FAGA,uOAiBA,yFASA,mJASA,oDAOA,6EAOA,+FAUA,iDAKA,uCACE,8BASF,qFAMA,wHAYA,8BACE,yCAGA,uDAGA","sources":["src/components/button.css"],"sourcesContent":["@layer ddga-components {\n  /* ─── Base ─── */\n\n  .ddga-button {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    gap: var(--ddga-space-1);\n    border: 1px solid transparent;\n    border-radius: var(--ddga-radius-sm);\n    font-weight: var(--ddga-font-weight-medium);\n    font-family: inherit;\n    line-height: 1.6;\n    cursor: pointer;\n    text-decoration: none;\n    transition:\n      background-color 150ms ease,\n      border-color 150ms ease,\n      color 150ms ease,\n      opacity 150ms ease;\n  }\n\n  /* ─── Variant: Primary ─── */\n\n  .ddga-button--primary {\n    background-color: var(--ddga-color-primary);\n    color: var(--ddga-color-primary-foreground);\n  }\n  .ddga-button--primary:hover:not(:disabled):not([aria-disabled='true']) {\n    background-color: var(--ddga-color-primary-hover);\n  }\n\n  /* ─── Variant: Secondary ─── */\n\n  .ddga-button--secondary {\n    background-color: var(--ddga-color-secondary);\n    color: var(--ddga-color-secondary-foreground);\n  }\n  .ddga-button--secondary:hover:not(:disabled):not([aria-disabled='true']) {\n    background-color: var(--ddga-color-secondary-hover);\n  }\n\n  /* ─── Variant: Outline ─── */\n\n  .ddga-button--outline {\n    background-color: transparent;\n    color: var(--ddga-color-foreground);\n    border-color: var(--ddga-color-border);\n  }\n  .ddga-button--outline:hover:not(:disabled):not([aria-disabled='true']) {\n    background-color: var(--ddga-color-muted);\n  }\n\n  /* ─── Variant: Ghost ─── */\n\n  .ddga-button--ghost {\n    background-color: transparent;\n    color: var(--ddga-color-foreground);\n  }\n  .ddga-button--ghost:hover:not(:disabled):not([aria-disabled='true']) {\n    background-color: var(--ddga-color-muted);\n  }\n\n  /* ─── Variant: Destructive (filled, primary destructive) ─── */\n\n  .ddga-button--destructive {\n    background-color: var(--ddga-color-destructive);\n    color: var(--ddga-color-destructive-foreground);\n  }\n  .ddga-button--destructive:hover:not(:disabled):not([aria-disabled='true']) {\n    background-color: var(--ddga-color-destructive-hover);\n  }\n\n  /* ─── Variant: Destructive Outline (transparent + error border + error text) ─── */\n\n  .ddga-button--destructive-outline {\n    background-color: transparent;\n    color: var(--ddga-color-destructive);\n    border-color: var(--ddga-color-destructive);\n  }\n  .ddga-button--destructive-outline:hover:not(:disabled):not([aria-disabled='true']) {\n    background-color: var(--ddga-error-50);\n  }\n\n  /* ─── Variant: Destructive Subtle (light tonal bg + error text) ─── */\n\n  .ddga-button--destructive-subtle {\n    background-color: var(--ddga-error-50);\n    color: var(--ddga-color-destructive);\n  }\n  .ddga-button--destructive-subtle:hover:not(:disabled):not([aria-disabled='true']) {\n    background-color: var(--ddga-error-100);\n  }\n\n  /* ─── Variant: Destructive Ghost (transparent + error text, hover tints) ─── */\n\n  .ddga-button--destructive-ghost {\n    background-color: transparent;\n    color: var(--ddga-color-destructive);\n  }\n  .ddga-button--destructive-ghost:hover:not(:disabled):not([aria-disabled='true']) {\n    background-color: var(--ddga-error-50);\n  }\n\n  /* ─── Sizes ─── */\n\n  .ddga-button--sm {\n    height: 32px;\n    padding-inline: var(--ddga-space-3);\n    font-size: var(--ddga-font-size-sm);\n  }\n  .ddga-button--md {\n    height: 36px;\n    padding-inline: var(--ddga-space-4);\n    font-size: var(--ddga-font-size-base);\n  }\n  .ddga-button--lg {\n    height: 40px;\n    padding-inline: var(--ddga-space-4);\n    font-size: var(--ddga-font-size-lg);\n  }\n  .ddga-button--icon {\n    height: 40px;\n    width: 40px;\n    padding: 0;\n    font-size: var(--ddga-font-size-base);\n  }\n  /* Compact square icon button , fits inside form fields as an adornment\n     (sm/md field interiors) without overflowing the field border. */\n  .ddga-button--icon-sm {\n    height: 28px;\n    width: 28px;\n    padding: 0;\n    font-size: var(--ddga-font-size-sm);\n  }\n\n  /* ─── Full Width ─── */\n\n  .ddga-button--full-width {\n    inline-size: 100%;\n    flex: 1 0 100%;\n  }\n\n  /* ─── Inverted (for use on colored / dark backgrounds) ─── */\n  /*\n   * Only inverts the non-filled families — `outline`, `ghost`, and\n   * destructive's outline/ghost forms. Filled variants (`primary`,\n   * `secondary`, `destructive`, `destructive-subtle`) already carry their\n   * own background contrast and keep their normal palette. Hover uses a\n   * low-opacity white overlay so it works against any background tint.\n   */\n  .ddga-button--inverted.ddga-button--outline,\n  .ddga-button--inverted.ddga-button--ghost {\n    color: #ffffff;\n    background-color: transparent;\n  }\n  .ddga-button--inverted.ddga-button--outline {\n    border-color: rgba(255, 255, 255, 0.4);\n  }\n  .ddga-button--inverted.ddga-button--outline:hover:not(:disabled):not([aria-disabled='true']),\n  .ddga-button--inverted.ddga-button--ghost:hover:not(:disabled):not([aria-disabled='true']) {\n    background-color: rgba(255, 255, 255, 0.12);\n  }\n  .ddga-button--inverted.ddga-button--outline:hover:not(:disabled):not([aria-disabled='true']) {\n    border-color: rgba(255, 255, 255, 0.6);\n  }\n  .ddga-button--inverted.ddga-button--destructive-outline,\n  .ddga-button--inverted.ddga-button--destructive-ghost {\n    /* On colored bgs, keep destructive readable by using a light error\n       tint rather than full white (which would lose the destructive cue). */\n    color: var(--ddga-error-200);\n  }\n  .ddga-button--inverted.ddga-button--destructive-outline {\n    border-color: var(--ddga-error-300);\n  }\n  .ddga-button--inverted.ddga-button--destructive-outline:hover:not(:disabled):not(\n      [aria-disabled='true']\n    ),\n  .ddga-button--inverted.ddga-button--destructive-ghost:hover:not(:disabled):not(\n      [aria-disabled='true']\n    ) {\n    background-color: rgba(255, 255, 255, 0.08);\n  }\n\n  /* ─── FAB (floating action button) ─── */\n  /*\n   * Orthogonal modifier: fully-rounded + elevated. Composes with any color\n   * `variant` and with `size` — `size=\"icon\"` yields a circle, a text size an\n   * extended pill. Positioning is the consumer's job (see the story recipe).\n   * Shadow is static (no hover lift) to keep the base transition intact; the\n   * color variant's own :hover handles the interaction feedback.\n   */\n  .ddga-button--fab {\n    border-radius: var(--ddga-radius-full);\n    box-shadow: var(--ddga-shadow-lg);\n  }\n  /* The base `.ddga-button:focus-visible` (defined later in this file) sets\n     box-shadow for the ring, which would clobber the elevation. Use a\n     two-class selector so this wins on specificity regardless of source order\n     (matches the `.ddga-button--inverted.ddga-button--outline` idiom), and\n     render the ring AND the drop shadow together. */\n  .ddga-button.ddga-button--fab:focus-visible {\n    border-color: var(--ddga-color-ring);\n    box-shadow:\n      0 0 0 2px var(--ddga-color-ring),\n      var(--ddga-shadow-lg);\n  }\n\n  /* ─── Loading ─── */\n\n  .ddga-button--loading {\n    position: relative;\n    cursor: wait;\n  }\n\n  /* ─── Child elements ─── */\n\n  .ddga-button__text {\n    /* Truncate long text */\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n\n  .ddga-button__icon {\n    flex-shrink: 0;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n  }\n\n  /* Block-level SVGs (see reset) must not be flex-stretched on the cross\n     axis , that distorts a square icon into a tall one. Pin them square\n     to their intrinsic size and keep them centered. */\n  .ddga-button svg {\n    flex-shrink: 0;\n    align-self: center;\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-button {\n      transition: none;\n    }\n  }\n\n  /* ─── States ─── */\n\n  /* Match `:disabled` (native button) and `[aria-disabled='true']` (asChild\n     mode rendered as <a> or similar where native `disabled` has no effect). */\n  .ddga-button:disabled,\n  .ddga-button[aria-disabled='true'] {\n    opacity: 0.5;\n    cursor: not-allowed;\n  }\n\n  .ddga-button:focus-visible {\n    outline: none;\n    border-color: var(--ddga-color-ring);\n    box-shadow: 0 0 0 1px var(--ddga-color-ring);\n  }\n\n  /* RTL directional icon flip (`.ddga-icon-flip`) is a shared utility — it\n     now lives in reset.css (ddga-base) so Link and other components can reuse\n     it without depending on this sheet. */\n\n  /* ─── Forced colors (Windows High Contrast) ─── */\n\n  @media (forced-colors: active) {\n    .ddga-button {\n      border: 1px solid ButtonText;\n    }\n    .ddga-button:focus-visible {\n      outline: 2px solid Highlight;\n    }\n    .ddga-button:disabled,\n    .ddga-button[aria-disabled='true'] {\n      color: GrayText;\n      border-color: GrayText;\n    }\n  }\n}\n"],"names":[]}
+{"version":3,"mappings":"AAAA,uBAGE,4VAqBA,4GAIA,sHAMA,kHAIA,0HAMA,sHAKA,8GAMA,8EAIA,4GAMA,wHAIA,8HAMA,wIAKA,uHAMA,2GAIA,uHAMA,2FAIA,qHAMA,mGAKA,qGAKA,mGAKA,yFAQA,0FASA,wDAaA,wHAKA,+DAGA,+MAIA,8GAGA,0IAMA,2FAGA,uOAiBA,yFASA,mJASA,oDAOA,6EAOA,+FAUA,iDAKA,uCACE,8BASF,qFAMA,wHAgBA,8EAGA,6HAIA,+NASA,8BACE,yCAGA,uDAGA","sources":["src/components/button.css"],"sourcesContent":["@layer ddga-components {\n  /* ─── Base ─── */\n\n  .ddga-button {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    gap: var(--ddga-space-1);\n    border: 1px solid transparent;\n    border-radius: var(--ddga-radius-sm);\n    font-weight: var(--ddga-font-weight-medium);\n    font-family: inherit;\n    line-height: 1.6;\n    cursor: pointer;\n    text-decoration: none;\n    transition:\n      background-color 150ms ease,\n      border-color 150ms ease,\n      color 150ms ease,\n      opacity 150ms ease;\n  }\n\n  /* ─── Variant: Primary ─── */\n\n  .ddga-button--primary {\n    background-color: var(--ddga-color-primary);\n    color: var(--ddga-color-primary-foreground);\n  }\n  .ddga-button--primary:hover:not(:disabled):not([aria-disabled='true']) {\n    background-color: var(--ddga-color-primary-hover);\n  }\n\n  /* ─── Variant: Secondary ─── */\n\n  .ddga-button--secondary {\n    background-color: var(--ddga-color-secondary);\n    color: var(--ddga-color-secondary-foreground);\n  }\n  .ddga-button--secondary:hover:not(:disabled):not([aria-disabled='true']) {\n    background-color: var(--ddga-color-secondary-hover);\n  }\n\n  /* ─── Variant: Outline ─── */\n\n  .ddga-button--outline {\n    background-color: transparent;\n    color: var(--ddga-color-foreground);\n    border-color: var(--ddga-color-border);\n  }\n  .ddga-button--outline:hover:not(:disabled):not([aria-disabled='true']) {\n    background-color: var(--ddga-color-muted);\n  }\n\n  /* ─── Variant: Ghost ─── */\n\n  .ddga-button--ghost {\n    background-color: transparent;\n    color: var(--ddga-color-foreground);\n  }\n  .ddga-button--ghost:hover:not(:disabled):not([aria-disabled='true']) {\n    background-color: var(--ddga-color-muted);\n  }\n\n  /* ─── Variant: Destructive (filled, primary destructive) ─── */\n\n  .ddga-button--destructive {\n    background-color: var(--ddga-color-destructive);\n    color: var(--ddga-color-destructive-foreground);\n  }\n  .ddga-button--destructive:hover:not(:disabled):not([aria-disabled='true']) {\n    background-color: var(--ddga-color-destructive-hover);\n  }\n\n  /* ─── Variant: Destructive Outline (transparent + error border + error text) ─── */\n\n  .ddga-button--destructive-outline {\n    background-color: transparent;\n    color: var(--ddga-color-destructive);\n    border-color: var(--ddga-color-destructive);\n  }\n  .ddga-button--destructive-outline:hover:not(:disabled):not([aria-disabled='true']) {\n    background-color: var(--ddga-error-50);\n  }\n\n  /* ─── Variant: Destructive Subtle (light tonal bg + error text) ─── */\n\n  .ddga-button--destructive-subtle {\n    background-color: var(--ddga-error-50);\n    color: var(--ddga-color-destructive);\n  }\n  .ddga-button--destructive-subtle:hover:not(:disabled):not([aria-disabled='true']) {\n    background-color: var(--ddga-error-100);\n  }\n\n  /* ─── Variant: Destructive Ghost (transparent + error text, hover tints) ─── */\n\n  .ddga-button--destructive-ghost {\n    background-color: transparent;\n    color: var(--ddga-color-destructive);\n  }\n  .ddga-button--destructive-ghost:hover:not(:disabled):not([aria-disabled='true']) {\n    background-color: var(--ddga-error-50);\n  }\n\n  /* ─── Sizes ─── */\n\n  .ddga-button--sm {\n    height: 32px;\n    padding-inline: var(--ddga-space-3);\n    font-size: var(--ddga-font-size-sm);\n  }\n  .ddga-button--md {\n    height: 36px;\n    padding-inline: var(--ddga-space-4);\n    font-size: var(--ddga-font-size-base);\n  }\n  .ddga-button--lg {\n    height: 40px;\n    padding-inline: var(--ddga-space-4);\n    font-size: var(--ddga-font-size-lg);\n  }\n  .ddga-button--icon {\n    height: 40px;\n    width: 40px;\n    padding: 0;\n    font-size: var(--ddga-font-size-base);\n  }\n  /* Compact square icon button , fits inside form fields as an adornment\n     (sm/md field interiors) without overflowing the field border. */\n  .ddga-button--icon-sm {\n    height: 28px;\n    width: 28px;\n    padding: 0;\n    font-size: var(--ddga-font-size-sm);\n  }\n\n  /* ─── Full Width ─── */\n\n  .ddga-button--full-width {\n    inline-size: 100%;\n    flex: 1 0 100%;\n  }\n\n  /* ─── Inverted (for use on colored / dark backgrounds) ─── */\n  /*\n   * Only inverts the non-filled families — `outline`, `ghost`, and\n   * destructive's outline/ghost forms. Filled variants (`primary`,\n   * `secondary`, `destructive`, `destructive-subtle`) already carry their\n   * own background contrast and keep their normal palette. Hover uses a\n   * low-opacity white overlay so it works against any background tint.\n   */\n  .ddga-button--inverted.ddga-button--outline,\n  .ddga-button--inverted.ddga-button--ghost {\n    color: #ffffff;\n    background-color: transparent;\n  }\n  .ddga-button--inverted.ddga-button--outline {\n    border-color: rgba(255, 255, 255, 0.4);\n  }\n  .ddga-button--inverted.ddga-button--outline:hover:not(:disabled):not([aria-disabled='true']),\n  .ddga-button--inverted.ddga-button--ghost:hover:not(:disabled):not([aria-disabled='true']) {\n    background-color: rgba(255, 255, 255, 0.12);\n  }\n  .ddga-button--inverted.ddga-button--outline:hover:not(:disabled):not([aria-disabled='true']) {\n    border-color: rgba(255, 255, 255, 0.6);\n  }\n  .ddga-button--inverted.ddga-button--destructive-outline,\n  .ddga-button--inverted.ddga-button--destructive-ghost {\n    /* On colored bgs, keep destructive readable by using a light error\n       tint rather than full white (which would lose the destructive cue). */\n    color: var(--ddga-error-200);\n  }\n  .ddga-button--inverted.ddga-button--destructive-outline {\n    border-color: var(--ddga-error-300);\n  }\n  .ddga-button--inverted.ddga-button--destructive-outline:hover:not(:disabled):not(\n      [aria-disabled='true']\n    ),\n  .ddga-button--inverted.ddga-button--destructive-ghost:hover:not(:disabled):not(\n      [aria-disabled='true']\n    ) {\n    background-color: rgba(255, 255, 255, 0.08);\n  }\n\n  /* ─── FAB (floating action button) ─── */\n  /*\n   * Orthogonal modifier: fully-rounded + elevated. Composes with any color\n   * `variant` and with `size` — `size=\"icon\"` yields a circle, a text size an\n   * extended pill. Positioning is the consumer's job (see the story recipe).\n   * Shadow is static (no hover lift) to keep the base transition intact; the\n   * color variant's own :hover handles the interaction feedback.\n   */\n  .ddga-button--fab {\n    border-radius: var(--ddga-radius-full);\n    box-shadow: var(--ddga-shadow-lg);\n  }\n  /* The base `.ddga-button:focus-visible` (defined later in this file) sets\n     box-shadow for the ring, which would clobber the elevation. Use a\n     two-class selector so this wins on specificity regardless of source order\n     (matches the `.ddga-button--inverted.ddga-button--outline` idiom), and\n     render the ring AND the drop shadow together. */\n  .ddga-button.ddga-button--fab:focus-visible {\n    border-color: var(--ddga-color-ring);\n    box-shadow:\n      0 0 0 2px var(--ddga-color-ring),\n      var(--ddga-shadow-lg);\n  }\n\n  /* ─── Loading ─── */\n\n  .ddga-button--loading {\n    position: relative;\n    cursor: wait;\n  }\n\n  /* ─── Child elements ─── */\n\n  .ddga-button__text {\n    /* Truncate long text */\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n\n  .ddga-button__icon {\n    flex-shrink: 0;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n  }\n\n  /* Block-level SVGs (see reset) must not be flex-stretched on the cross\n     axis , that distorts a square icon into a tall one. Pin them square\n     to their intrinsic size and keep them centered. */\n  .ddga-button svg {\n    flex-shrink: 0;\n    align-self: center;\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-button {\n      transition: none;\n    }\n  }\n\n  /* ─── States ─── */\n\n  /* Match `:disabled` (native button) and `[aria-disabled='true']` (asChild\n     mode rendered as <a> or similar where native `disabled` has no effect). */\n  .ddga-button:disabled,\n  .ddga-button[aria-disabled='true'] {\n    opacity: 0.5;\n    cursor: not-allowed;\n  }\n\n  .ddga-button:focus-visible {\n    outline: none;\n    border-color: var(--ddga-color-ring);\n    box-shadow: 0 0 0 1px var(--ddga-color-ring);\n  }\n\n  /* RTL directional icon flip (`.ddga-icon-flip`) is a shared utility — it\n     now lives in reset.css (ddga-base) so Link and other components can reuse\n     it without depending on this sheet. */\n\n  /* ─── Dark mode adjustments ─── */\n  /* The destructive subtle/outline/ghost families fill from raw --ddga-error-50/\n     -100 tints, which stay light in dark mode (the raw scale isn't theme-flipped).\n     Recolor to translucent error tints so they read as dark-surface chips —\n     mirrors alert.css. Text uses the semantic --ddga-color-destructive, which\n     already adapts. */\n  [data-theme='dark'] .ddga-button--destructive-subtle {\n    background-color: rgb(217 45 32 / 0.18);\n  }\n  [data-theme='dark']\n    .ddga-button--destructive-subtle:hover:not(:disabled):not([aria-disabled='true']) {\n    background-color: rgb(217 45 32 / 0.28);\n  }\n  [data-theme='dark']\n    .ddga-button--destructive-outline:hover:not(:disabled):not([aria-disabled='true']),\n  [data-theme='dark']\n    .ddga-button--destructive-ghost:hover:not(:disabled):not([aria-disabled='true']) {\n    background-color: rgb(217 45 32 / 0.18);\n  }\n\n  /* ─── Forced colors (Windows High Contrast) ─── */\n\n  @media (forced-colors: active) {\n    .ddga-button {\n      border: 1px solid ButtonText;\n    }\n    .ddga-button:focus-visible {\n      outline: 2px solid Highlight;\n    }\n    .ddga-button:disabled,\n    .ddga-button[aria-disabled='true'] {\n      color: GrayText;\n      border-color: GrayText;\n    }\n  }\n}\n"],"names":[]}

package/dist/components/calendar.css

@@ -0,0 +1,2 @@
+@layer ddga-components{.ddga-calendar-popover{z-index:50;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);display:flex;overflow:hidden}.ddga-calendar-popover[data-entering]{animation:.12s cubic-bezier(.16,1,.3,1) ddga-calendar-in}.ddga-calendar-popover[data-exiting]{animation:80ms ease-in ddga-calendar-out}@keyframes ddga-calendar-in{0%{opacity:0;transform:translateY(-2px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes ddga-calendar-out{0%{opacity:1}to{opacity:0}}.ddga-calendar-dialog{min-block-size:0;max-block-size:100%;padding:var(--ddga-space-3);box-sizing:border-box;outline:none;flex:auto;overflow:auto}.ddga-calendar-toggle{inline-size:100%;background-color:var(--ddga-color-muted);border-radius:var(--ddga-radius-md);margin-block-end:var(--ddga-space-3);padding:2px;display:inline-flex}.ddga-calendar-toggle__button{padding-block:var(--ddga-space-1);padding-inline:var(--ddga-space-2);border-radius:calc(var(--ddga-radius-md) - 2px);color:var(--ddga-text-secondary);font:inherit;font-size:var(--ddga-font-size-sm);font-weight:var(--ddga-font-weight-medium);cursor:pointer;background-color:#0000;border:0;outline:none;flex:1 1 0;transition:background-color .12s,color .12s}.ddga-calendar-toggle__button[data-active]{background-color:var(--ddga-color-background);color:var(--ddga-color-foreground);box-shadow:0 1px 2px #00000014}.ddga-calendar-toggle__button:focus-visible{box-shadow:0 0 0 2px var(--ddga-color-ring)}.ddga-calendar{inline-size:min(100%,280px)}.ddga-calendar__header{justify-content:space-between;align-items:center;gap:var(--ddga-space-2);margin-block-end:var(--ddga-space-2);display:flex}.ddga-calendar__nav{border-radius:var(--ddga-radius-sm);block-size:1.75rem;inline-size:1.75rem;color:var(--ddga-text-secondary);cursor:pointer;background-color:#0000;border:0;outline:none;justify-content:center;align-items:center;padding:0;display:inline-flex}.ddga-calendar__nav:hover{background-color:var(--ddga-color-muted);color:var(--ddga-color-foreground)}.ddga-calendar__nav[data-focus-visible]{box-shadow:0 0 0 2px var(--ddga-color-ring)}.ddga-calendar__nav[data-disabled]{color:var(--ddga-text-tertiary);cursor:not-allowed}.ddga-calendar__heading{font-size:var(--ddga-font-size-sm);font-weight:var(--ddga-font-weight-semibold);text-align:center;color:var(--ddga-color-foreground);flex:auto;margin:0}.ddga-calendar__nav-selects{justify-content:center;align-items:center;gap:var(--ddga-space-1);flex:auto;min-inline-size:0;display:inline-flex}.ddga-calendar__select{appearance:none;border-radius:var(--ddga-radius-sm);padding-block:var(--ddga-space-1);padding-inline:var(--ddga-space-2);font:inherit;font-size:var(--ddga-font-size-sm);font-weight:var(--ddga-font-weight-semibold);color:var(--ddga-color-foreground);cursor:pointer;font-variant-numeric:tabular-nums;text-align:center;text-align-last:center;background-color:#0000;border:1px solid #0000;outline:none;max-inline-size:100%;margin:0}.ddga-calendar__select:hover{background-color:var(--ddga-color-muted)}.ddga-calendar__select:focus-visible{border-color:var(--ddga-color-ring);box-shadow:0 0 0 1px var(--ddga-color-ring)}.ddga-calendar__select option{color:canvastext;background-color:canvas}.ddga-calendar__year-select{min-inline-size:4.5ch}.ddga-calendar__grid{border-collapse:collapse;inline-size:100%}.ddga-calendar__weekday{padding-block:var(--ddga-space-1);font-size:var(--ddga-font-size-xs);font-weight:var(--ddga-font-weight-medium);color:var(--ddga-text-tertiary);text-align:center}.ddga-calendar__cell{text-align:center;block-size:2rem;inline-size:2rem;font-size:var(--ddga-font-size-sm);font-variant-numeric:tabular-nums;color:var(--ddga-color-foreground);border-radius:var(--ddga-radius-sm);cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;outline:none;flex-direction:column;justify-content:center;align-items:center;padding:0;line-height:1;display:inline-flex}.ddga-calendar__cell[data-today]:not([data-selected]){box-shadow:inset 0 0 0 1.5px var(--ddga-color-primary);color:var(--ddga-color-primary);font-weight:var(--ddga-font-weight-semibold)}.ddga-calendar__cell-primary{font-size:inherit;line-height:1}.ddga-calendar__cell-secondary{color:var(--ddga-text-tertiary);margin-block-start:1px;font-size:.625rem;line-height:1}.ddga-calendar__cell[data-selected] .ddga-calendar__cell-secondary{color:inherit;opacity:.85}.ddga-calendar__cell[data-hovered]:not([data-disabled]):not([data-selected]){background-color:var(--ddga-color-muted)}.ddga-calendar__cell[data-focus-visible]{box-shadow:inset 0 0 0 2px var(--ddga-color-ring)}.ddga-calendar__cell[data-selected]{background-color:var(--ddga-color-primary);color:var(--ddga-color-primary-foreground)}.ddga-calendar__cell[data-disabled],.ddga-calendar__cell[data-unavailable]{color:var(--ddga-text-tertiary);cursor:not-allowed}.ddga-calendar__cell[data-outside-month]{color:var(--ddga-text-tertiary)}@media (prefers-reduced-motion:reduce){.ddga-calendar-toggle__button{transition:none}.ddga-calendar-popover[data-entering],.ddga-calendar-popover[data-exiting]{animation:none}}@media (forced-colors:active){.ddga-calendar-popover{border:1px solid canvastext}.ddga-calendar__cell[data-selected]{color:highlighttext;background-color:highlight}.ddga-calendar__cell[data-focus-visible]{outline-offset:1px;outline:2px solid highlight}.ddga-calendar-toggle__button[data-active]{color:highlighttext;background-color:highlight}}}
+/*# sourceMappingURL=calendar.css.map */

package/dist/components/calendar.css.map

@@ -0,0 +1 @@
+{"version":3,"mappings":"AAAA,uBAeE,+PAYA,+FAGA,8EAGA,4HAUA,wDAgBA,kJAYA,yLAQA,kYAiBA,2JAKA,wFAMA,2CAIA,kJAQA,oQAcA,sGAIA,oFAGA,sFASA,gLAcA,8IASA,mcAoBA,sEAGA,qHAMA,uEAIA,kDAKA,+DAKA,0LAYA,8aAuBA,0LASA,6DAIA,sHAMA,6FAIA,sHAGA,2FAGA,0HAIA,8HAQA,yEAMA,uCACE,8CAGA,2FAQF,8BACE,mDAGA,mFAIA,wFAIA","sources":["src/components/calendar.css"],"sourcesContent":["@layer ddga-components {\n  /* Shared calendar dropdown chrome — consumed by both DatePicker and\n     DateRangePicker. The field/trigger surface stays per-component\n     (date-picker.css / date-range-picker.css); everything inside the popover\n     (the floating panel, the Gregorian↔Hijri toggle, and the month grid) is\n     identical regardless of single-date vs range selection, so it lives here. */\n\n  /* ─── Popover (the floating panel) ─── */\n\n  /* react-aria's useOverlayPosition sets `max-height` inline on the popover\n     based on the space available between the trigger and the viewport edge\n     (minus `containerPadding`). We pair that with `overflow: auto` on the inner\n     Dialog so when the calendar can't fit (short iframes, dual-calendar mode),\n     the content scrolls instead of being clipped. `overflow: hidden` stays on\n     the popover so the rounded corners crop animation bleed. */\n  .ddga-calendar-popover {\n    z-index: 50;\n    display: flex;\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    overflow: hidden;\n  }\n\n  /* react-aria emits data-entering / data-exiting during transitions. */\n  .ddga-calendar-popover[data-entering] {\n    animation: ddga-calendar-in 120ms cubic-bezier(0.16, 1, 0.3, 1);\n  }\n  .ddga-calendar-popover[data-exiting] {\n    animation: ddga-calendar-out 80ms ease-in;\n  }\n  @keyframes ddga-calendar-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-calendar-out {\n    from {\n      opacity: 1;\n    }\n    to {\n      opacity: 0;\n    }\n  }\n\n  /* ─── Dialog (panel padding + scroll container) ─── */\n\n  /* `max-block-size: 100%` + `overflow: auto` make the Dialog the scroll\n     container inside the popover. The Popover constrains height via its\n     react-aria-set `max-height`; the Dialog respects that bound and scrolls\n     internally when the calendar grid + toggle exceed it. `min-block-size: 0`\n     is the flex-child trick that lets the scroll container actually shrink. */\n  .ddga-calendar-dialog {\n    flex: 1 1 auto;\n    min-block-size: 0;\n    max-block-size: 100%;\n    padding: var(--ddga-space-3);\n    outline: none;\n    overflow: auto;\n    box-sizing: border-box;\n  }\n\n  /* ─── Calendar-system toggle (Gregorian ↔ Hijri) ─── */\n\n  .ddga-calendar-toggle {\n    display: inline-flex;\n    inline-size: 100%;\n    margin-block-end: var(--ddga-space-3);\n    padding: 2px;\n    background-color: var(--ddga-color-muted);\n    border-radius: var(--ddga-radius-md);\n  }\n  .ddga-calendar-toggle__button {\n    flex: 1 1 0;\n    padding-block: var(--ddga-space-1);\n    padding-inline: var(--ddga-space-2);\n    border: 0;\n    border-radius: calc(var(--ddga-radius-md) - 2px);\n    background-color: transparent;\n    color: var(--ddga-text-secondary);\n    font: inherit;\n    font-size: var(--ddga-font-size-sm);\n    font-weight: var(--ddga-font-weight-medium);\n    cursor: pointer;\n    outline: none;\n    transition:\n      background-color 120ms ease,\n      color 120ms ease;\n  }\n  .ddga-calendar-toggle__button[data-active] {\n    background-color: var(--ddga-color-background);\n    color: var(--ddga-color-foreground);\n    box-shadow: 0 1px 2px rgb(0 0 0 / 0.08);\n  }\n  .ddga-calendar-toggle__button:focus-visible {\n    box-shadow: 0 0 0 2px var(--ddga-color-ring);\n  }\n\n  /* ─── Calendar grid ─── */\n\n  .ddga-calendar {\n    inline-size: min(100%, 280px);\n  }\n\n  .ddga-calendar__header {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: var(--ddga-space-2);\n    margin-block-end: var(--ddga-space-2);\n  }\n\n  .ddga-calendar__nav {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    inline-size: 1.75rem;\n    block-size: 1.75rem;\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-calendar__nav:hover {\n    background-color: var(--ddga-color-muted);\n    color: var(--ddga-color-foreground);\n  }\n  .ddga-calendar__nav[data-focus-visible] {\n    box-shadow: 0 0 0 2px var(--ddga-color-ring);\n  }\n  .ddga-calendar__nav[data-disabled] {\n    color: var(--ddga-text-tertiary);\n    cursor: not-allowed;\n  }\n  /* RTL chevron direction is handled in the picker components by swapping the\n     icon components themselves (PrevChevron / NextChevron based on `dir`) — more\n     robust than a CSS scaleX flip because it doesn't rely on the popover portal\n     correctly inheriting the `dir` attribute from the DgaProvider root. */\n\n  .ddga-calendar__heading {\n    flex: 1 1 auto;\n    margin: 0;\n    font-size: var(--ddga-font-size-sm);\n    font-weight: var(--ddga-font-weight-semibold);\n    text-align: center;\n    color: var(--ddga-color-foreground);\n  }\n\n  /* ─── Month + Year dropdowns (CalendarNavHeader) ─── */\n\n  /* Native <select>s give free keyboard support + native focus rings +\n     screen-reader announcements; styling stays minimal so the platform's\n     wheel/typeahead stays untouched. */\n  .ddga-calendar__nav-selects {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    gap: var(--ddga-space-1);\n    flex: 1 1 auto;\n    min-inline-size: 0;\n  }\n\n  .ddga-calendar__select {\n    appearance: none;\n    -webkit-appearance: none;\n    background-color: transparent;\n    border: 1px solid transparent;\n    border-radius: var(--ddga-radius-sm);\n    padding-block: var(--ddga-space-1);\n    padding-inline: var(--ddga-space-2);\n    margin: 0;\n    font: inherit;\n    font-size: var(--ddga-font-size-sm);\n    font-weight: var(--ddga-font-weight-semibold);\n    color: var(--ddga-color-foreground);\n    cursor: pointer;\n    font-variant-numeric: tabular-nums;\n    outline: none;\n    text-align: center;\n    text-align-last: center;\n    max-inline-size: 100%;\n  }\n  .ddga-calendar__select:hover {\n    background-color: var(--ddga-color-muted);\n  }\n  .ddga-calendar__select:focus-visible {\n    border-color: var(--ddga-color-ring);\n    box-shadow: 0 0 0 1px var(--ddga-color-ring);\n  }\n  /* Native option elements pick up the OS theme; can't fully style them, but\n     ensure the popup respects RTL on supporting browsers. */\n  .ddga-calendar__select option {\n    color: CanvasText;\n    background-color: Canvas;\n  }\n  .ddga-calendar__year-select {\n    /* The year string is short (4 digits) — give it just enough width. */\n    min-inline-size: 4.5ch;\n  }\n\n  .ddga-calendar__grid {\n    inline-size: 100%;\n    border-collapse: collapse;\n  }\n\n  .ddga-calendar__weekday {\n    padding-block: var(--ddga-space-1);\n    font-size: var(--ddga-font-size-xs);\n    font-weight: var(--ddga-font-weight-medium);\n    color: var(--ddga-text-tertiary);\n    text-align: center;\n  }\n\n  /* CalendarCell renders the inner role=\"button\" div; react-aria wires the\n     <td>. Style the inner element so the focus ring + selected background stay\n     inside the cell footprint. Flex column so a secondary day number (when\n     `showSecondaryCalendar` is on) stacks neatly under the primary. */\n  .ddga-calendar__cell {\n    display: inline-flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    inline-size: 2rem;\n    block-size: 2rem;\n    padding: 0;\n    text-align: center;\n    font-size: var(--ddga-font-size-sm);\n    font-variant-numeric: tabular-nums;\n    line-height: 1;\n    color: var(--ddga-color-foreground);\n    border-radius: var(--ddga-radius-sm);\n    cursor: pointer;\n    outline: none;\n    user-select: none;\n    -webkit-tap-highlight-color: transparent;\n  }\n\n  /* Today ring — visible whenever a cell represents \"today\" in the displayed\n     calendar (react-aria emits data-today). Inset to stay inside the cell;\n     selected wins by re-painting the background. */\n  .ddga-calendar__cell[data-today]:not([data-selected]) {\n    box-shadow: inset 0 0 0 1.5px var(--ddga-color-primary);\n    color: var(--ddga-color-primary);\n    font-weight: var(--ddga-font-weight-semibold);\n  }\n\n  /* Dual-calendar layout: the primary day stays at the normal size; the\n     secondary (alternate calendar) renders below at ~70% size in the muted text\n     color. Selected state inherits the contrast color for both. */\n  .ddga-calendar__cell-primary {\n    font-size: inherit;\n    line-height: 1;\n  }\n  .ddga-calendar__cell-secondary {\n    margin-block-start: 1px;\n    font-size: 0.625rem;\n    line-height: 1;\n    color: var(--ddga-text-tertiary);\n  }\n  .ddga-calendar__cell[data-selected] .ddga-calendar__cell-secondary {\n    color: inherit;\n    opacity: 0.85;\n  }\n  .ddga-calendar__cell[data-hovered]:not([data-disabled]):not([data-selected]) {\n    background-color: var(--ddga-color-muted);\n  }\n  .ddga-calendar__cell[data-focus-visible] {\n    box-shadow: inset 0 0 0 2px var(--ddga-color-ring);\n  }\n  .ddga-calendar__cell[data-selected] {\n    background-color: var(--ddga-color-primary);\n    color: var(--ddga-color-primary-foreground);\n  }\n  .ddga-calendar__cell[data-disabled],\n  .ddga-calendar__cell[data-unavailable] {\n    color: var(--ddga-text-tertiary);\n    cursor: not-allowed;\n  }\n  /* Outside-month cells are fully clickable in the single picker — selecting\n     one navigates the visible month. Use a softer text color (no opacity\n     reduction) so they read as low-emphasis-but-active peers, not disabled. */\n  .ddga-calendar__cell[data-outside-month] {\n    color: var(--ddga-text-tertiary);\n  }\n\n  /* ─── Reduced motion ─── */\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-calendar-toggle__button {\n      transition: none;\n    }\n    .ddga-calendar-popover[data-entering],\n    .ddga-calendar-popover[data-exiting] {\n      animation: none;\n    }\n  }\n\n  /* ─── Forced colors (Windows High Contrast) ─── */\n\n  @media (forced-colors: active) {\n    .ddga-calendar-popover {\n      border: 1px solid CanvasText;\n    }\n    .ddga-calendar__cell[data-selected] {\n      background-color: Highlight;\n      color: HighlightText;\n    }\n    .ddga-calendar__cell[data-focus-visible] {\n      outline: 2px solid Highlight;\n      outline-offset: 1px;\n    }\n    .ddga-calendar-toggle__button[data-active] {\n      background-color: Highlight;\n      color: HighlightText;\n    }\n  }\n}\n"],"names":[]}

package/dist/components/card.css

@@ -1,2 +1,2 @@
-@layer ddga-components{.ddga-card{--ddga-card-padding:var(--ddga-space-5);background-color:var(--ddga-color-card);color:var(--ddga-color-card-foreground);border-radius:var(--ddga-radius-md);transition:box-shadow .15s,transform .15s,border-color .15s;display:flex;overflow:hidden}.ddga-card--vertical{flex-direction:column}.ddga-card--horizontal{flex-direction:row}.ddga-card--default{border:1px solid var(--ddga-color-border)}.ddga-card--outline{border:1px solid var(--ddga-color-border);background-color:#0000}.ddga-card--elevated{box-shadow:var(--ddga-shadow-md);border:1px solid #0000}.ddga-card--filled{background-color:var(--ddga-color-muted);border:1px solid #0000}.ddga-card--gradient{background-image:linear-gradient(90deg, var(--ddga-sa-600), var(--ddga-sa-500));color:var(--ddga-color-primary-foreground);border:1px solid #0000}.ddga-card--gradient .ddga-card__title,.ddga-card--gradient .ddga-card__description{color:inherit}.ddga-card--gradient .ddga-card__description{opacity:.85}.ddga-card--gradient .ddga-card__footer{border-block-start-color:#ffffff26}.ddga-card--ghost{background-color:#0000;border:1px solid #0000}.ddga-card--ghost .ddga-card__footer{border-block-start-color:#0000}.ddga-card--padding-sm{--ddga-card-padding:var(--ddga-space-3)}.ddga-card--padding-md{--ddga-card-padding:var(--ddga-space-5)}.ddga-card--padding-lg{--ddga-card-padding:var(--ddga-space-6)}.ddga-card--interactive{cursor:pointer}.ddga-card--interactive:hover{border-color:var(--ddga-color-input);box-shadow:var(--ddga-shadow-md)}.ddga-card--interactive.ddga-card--elevated:hover,.ddga-card--interactive.ddga-card--gradient:hover{box-shadow:var(--ddga-shadow-lg)}.ddga-card--interactive:focus-visible{border-color:var(--ddga-color-ring);box-shadow:0 0 0 2px var(--ddga-color-ring);outline:none}.ddga-card__image{object-fit:cover;block-size:auto;inline-size:100%;aspect-ratio:var(--ddga-card-image-aspect,16 / 9);display:block}.ddga-card--horizontal>.ddga-card__image{aspect-ratio:auto;flex-shrink:0;align-self:stretch;block-size:auto;inline-size:40%;max-inline-size:240px}.ddga-card--horizontal>:not(.ddga-card__image){flex:auto}.ddga-card--horizontal>.ddga-card__header+.ddga-card__content{padding-top:0}.ddga-card__header{gap:var(--ddga-space-1);padding:var(--ddga-card-padding);flex-direction:column;display:flex}.ddga-card__title{font-size:var(--ddga-font-size-lg);font-weight:var(--ddga-font-weight-semibold);color:var(--ddga-text-primary);margin:0;line-height:1.4}.ddga-card__description{font-size:var(--ddga-font-size-sm);color:var(--ddga-text-secondary);margin:0;line-height:1.5}.ddga-card__content{padding:var(--ddga-card-padding)}.ddga-card__header+.ddga-card__content{padding-top:0}.ddga-card__footer{align-items:center;gap:var(--ddga-space-2);padding:var(--ddga-card-padding);border-top:1px solid var(--ddga-color-border);display:flex}.ddga-card__footer:first-child{border-top:0}@media (prefers-reduced-motion:reduce){.ddga-card{transition:none}}[data-theme=dark] .ddga-card--gradient{background-image:linear-gradient(90deg, var(--ddga-sa-700), var(--ddga-sa-600))}}
+@layer ddga-components{.ddga-card{--ddga-card-padding:var(--ddga-space-5);background-color:var(--ddga-color-card);color:var(--ddga-color-card-foreground);border-radius:var(--ddga-radius-md);transition:box-shadow .15s,transform .15s,border-color .15s;display:flex;overflow:hidden}.ddga-card--vertical{flex-direction:column}.ddga-card--horizontal{flex-direction:row}.ddga-card--default{border:1px solid var(--ddga-color-border)}.ddga-card--outline{border:1px solid var(--ddga-color-border);background-color:#0000}.ddga-card--elevated{box-shadow:var(--ddga-shadow-md);border:1px solid #0000}.ddga-card--filled{background-color:var(--ddga-color-muted);border:1px solid #0000}.ddga-card--gradient{background-image:linear-gradient(90deg, var(--ddga-sa-600), var(--ddga-sa-500));color:var(--ddga-color-primary-foreground);border:1px solid #0000}.ddga-card--gradient .ddga-card__title,.ddga-card--gradient .ddga-card__description{color:inherit}.ddga-card--gradient .ddga-card__description{opacity:.85}.ddga-card--gradient .ddga-card__footer{border-block-start-color:#ffffff26}.ddga-card--ghost{background-color:#0000;border:1px solid #0000}.ddga-card--ghost .ddga-card__footer{border-block-start-color:#0000}.ddga-card--padding-sm{--ddga-card-padding:var(--ddga-space-3)}.ddga-card--padding-md{--ddga-card-padding:var(--ddga-space-5)}.ddga-card--padding-lg{--ddga-card-padding:var(--ddga-space-6)}.ddga-card--interactive{cursor:pointer}.ddga-card--interactive:hover{border-color:var(--ddga-color-input);box-shadow:var(--ddga-shadow-md)}.ddga-card--interactive.ddga-card--elevated:hover,.ddga-card--interactive.ddga-card--gradient:hover{box-shadow:var(--ddga-shadow-lg)}.ddga-card--interactive:focus-visible{border-color:var(--ddga-color-ring);box-shadow:0 0 0 2px var(--ddga-color-ring);outline:none}.ddga-card__image{object-fit:cover;block-size:auto;inline-size:100%;aspect-ratio:var(--ddga-card-image-aspect,16 / 9);display:block}.ddga-card--horizontal>.ddga-card__image{aspect-ratio:auto;flex-shrink:0;align-self:stretch;block-size:auto;inline-size:40%;max-inline-size:240px}.ddga-card--horizontal>:not(.ddga-card__image){flex:auto}.ddga-card--horizontal>.ddga-card__header+.ddga-card__content{padding-block-start:0}.ddga-card__header{gap:var(--ddga-space-1);padding:var(--ddga-card-padding);flex-direction:column;display:flex}.ddga-card__title{font-size:var(--ddga-font-size-lg);font-weight:var(--ddga-font-weight-semibold);color:var(--ddga-text-primary);margin:0;line-height:1.4}.ddga-card__description{font-size:var(--ddga-font-size-sm);color:var(--ddga-text-secondary);margin:0;line-height:1.5}.ddga-card__content{padding:var(--ddga-card-padding)}.ddga-card__header+.ddga-card__content{padding-block-start:0}.ddga-card__footer{align-items:center;gap:var(--ddga-space-2);padding:var(--ddga-card-padding);border-block-start:1px solid var(--ddga-color-border);display:flex}.ddga-card__footer:first-child{border-block-start:0}@media (prefers-reduced-motion:reduce){.ddga-card{transition:none}}@media (forced-colors:active){.ddga-card{border:1px solid canvastext}.ddga-card--interactive:focus-visible{outline-offset:2px;outline:2px solid canvastext}}[data-theme=dark] .ddga-card--gradient{background-image:linear-gradient(90deg, var(--ddga-sa-700), var(--ddga-sa-600))}}
 /*# sourceMappingURL=card.css.map */

package/dist/components/card.css.map

@@ -1 +1 @@
-{"version":3,"mappings":"AAAA,uBAGE,gQAgBA,2CAGA,0CAQA,8DAIA,qFAKA,6EAKA,mFAOA,uKAKA,kGAIA,yDAIA,2EAOA,gEAIA,oEAMA,+DAGA,+DAGA,+DAMA,uCAIA,oGAIA,qIAIA,mIAQA,oIAUA,kJAWA,yDAGA,4EAMA,+GAOA,0JAQA,qHAOA,qDAMA,qDAWA,0JASA,4CAMA,uCACE,4BAOF","sources":["src/components/card.css"],"sourcesContent":["@layer ddga-components {\n  /* ─── Base ─── */\n\n  .ddga-card {\n    /* Single hook drives all section padding. Variants below redefine it. */\n    --ddga-card-padding: var(--ddga-space-5);\n    display: flex;\n    background-color: var(--ddga-color-card);\n    color: var(--ddga-color-card-foreground);\n    border-radius: var(--ddga-radius-md);\n    overflow: hidden;\n    transition:\n      box-shadow 150ms ease,\n      transform 150ms ease,\n      border-color 150ms ease;\n  }\n\n  /* ─── Orientation ─── */\n\n  .ddga-card--vertical {\n    flex-direction: column;\n  }\n  .ddga-card--horizontal {\n    flex-direction: row;\n    /* RTL: row reverses to keep the image at the start (logical) — handled\n       implicitly by flexbox honoring the writing direction. */\n  }\n\n  /* ─── Variants ─── */\n\n  .ddga-card--default {\n    border: 1px solid var(--ddga-color-border);\n  }\n\n  .ddga-card--outline {\n    background-color: transparent;\n    border: 1px solid var(--ddga-color-border);\n  }\n\n  .ddga-card--elevated {\n    border: 1px solid transparent;\n    box-shadow: var(--ddga-shadow-md);\n  }\n\n  .ddga-card--filled {\n    background-color: var(--ddga-color-muted);\n    border: 1px solid transparent;\n  }\n\n  /* SA Green gradient hero — uses primary palette gradient from dga-preferences\n     §5.4 (SA 600 → SA 500 @ 90°). Text + descriptions invert to white. */\n  .ddga-card--gradient {\n    background-image: linear-gradient(90deg, var(--ddga-sa-600), var(--ddga-sa-500));\n    color: var(--ddga-color-primary-foreground);\n    border: 1px solid transparent;\n  }\n  .ddga-card--gradient .ddga-card__title,\n  .ddga-card--gradient .ddga-card__description {\n    color: inherit;\n  }\n  .ddga-card--gradient .ddga-card__description {\n    /* Softer than the title against the gradient. */\n    opacity: 0.85;\n  }\n  .ddga-card--gradient .ddga-card__footer {\n    border-block-start-color: rgb(255 255 255 / 0.15);\n  }\n\n  /* Bare card — no bg, no border, no shadow. For grouped lists where the\n     parent provides separation, or when stacking content blocks without\n     visual chrome. */\n  .ddga-card--ghost {\n    background-color: transparent;\n    border: 1px solid transparent;\n  }\n  .ddga-card--ghost .ddga-card__footer {\n    border-block-start-color: transparent;\n  }\n\n  /* ─── Padding scale ─── */\n\n  .ddga-card--padding-sm {\n    --ddga-card-padding: var(--ddga-space-3);\n  }\n  .ddga-card--padding-md {\n    --ddga-card-padding: var(--ddga-space-5);\n  }\n  .ddga-card--padding-lg {\n    --ddga-card-padding: var(--ddga-space-6);\n  }\n\n  /* ─── Interactive (hover lift + focus ring; pairs with asChild for clickable cards) ─── */\n\n  .ddga-card--interactive {\n    cursor: pointer;\n    /* No transform on touch — avoids the sticky-hover look on mobile. */\n  }\n  .ddga-card--interactive:hover {\n    border-color: var(--ddga-color-input);\n    box-shadow: var(--ddga-shadow-md);\n  }\n  .ddga-card--interactive.ddga-card--elevated:hover,\n  .ddga-card--interactive.ddga-card--gradient:hover {\n    box-shadow: var(--ddga-shadow-lg);\n  }\n  .ddga-card--interactive:focus-visible {\n    outline: none;\n    border-color: var(--ddga-color-ring);\n    box-shadow: 0 0 0 2px var(--ddga-color-ring);\n  }\n\n  /* ─── Image ─── */\n\n  .ddga-card__image {\n    display: block;\n    inline-size: 100%;\n    block-size: auto;\n    object-fit: cover;\n    aspect-ratio: var(--ddga-card-image-aspect, 16 / 9);\n  }\n\n  /* In horizontal cards, the image hugs the start edge and stretches the full\n     card height. Cap its width so the content side still has room to breathe. */\n  .ddga-card--horizontal > .ddga-card__image {\n    aspect-ratio: auto;\n    inline-size: 40%;\n    max-inline-size: 240px;\n    block-size: auto;\n    align-self: stretch;\n    flex-shrink: 0;\n  }\n\n  /* The content side of a horizontal card needs to take the remaining width\n     and keep its own column layout. */\n  .ddga-card--horizontal > :not(.ddga-card__image) {\n    flex: 1 1 auto;\n  }\n  .ddga-card--horizontal > .ddga-card__header + .ddga-card__content {\n    padding-top: 0;\n  }\n\n  /* ─── Sections (all share --ddga-card-padding) ─── */\n\n  .ddga-card__header {\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-space-1);\n    padding: var(--ddga-card-padding);\n  }\n\n  .ddga-card__title {\n    font-size: var(--ddga-font-size-lg);\n    font-weight: var(--ddga-font-weight-semibold);\n    line-height: 1.4;\n    margin: 0;\n    color: var(--ddga-text-primary);\n  }\n\n  .ddga-card__description {\n    font-size: var(--ddga-font-size-sm);\n    line-height: 1.5;\n    margin: 0;\n    color: var(--ddga-text-secondary);\n  }\n\n  .ddga-card__content {\n    padding: var(--ddga-card-padding);\n  }\n\n  /* Header immediately followed by content: collapse the redundant top padding\n     so the two sections read as one continuous block. */\n  .ddga-card__header + .ddga-card__content {\n    padding-top: 0;\n  }\n\n  /* When an image leads the card, the section under it should NOT have a stray\n     top border or extra padding — the image already provides a clean edge. */\n  .ddga-card__image + .ddga-card__header,\n  .ddga-card__image + .ddga-card__content {\n    /* (use the default --ddga-card-padding) */\n  }\n\n  .ddga-card__footer {\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-2);\n    padding: var(--ddga-card-padding);\n    border-top: 1px solid var(--ddga-color-border);\n  }\n\n  /* No top border when there's no preceding section to separate from. */\n  .ddga-card__footer:first-child {\n    border-top: 0;\n  }\n\n  /* ─── Reduced motion ─── */\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-card {\n      transition: none;\n    }\n  }\n\n  /* ─── Dark mode adjustments ─── */\n\n  [data-theme='dark'] .ddga-card--gradient {\n    background-image: linear-gradient(90deg, var(--ddga-sa-700), var(--ddga-sa-600));\n  }\n}\n"],"names":[]}
+{"version":3,"mappings":"AAAA,uBAGE,gQAgBA,2CAGA,0CAQA,8DAIA,qFAKA,6EAKA,mFAOA,uKAKA,kGAIA,yDAIA,2EAOA,gEAIA,oEAMA,+DAGA,+DAGA,+DAMA,uCAIA,oGAIA,qIAIA,mIAQA,oIAUA,kJAWA,yDAGA,oFAMA,+GAOA,0JAQA,qHAOA,qDAMA,6DAIA,kKASA,oDAMA,uCACE,4BAOF,8BAGE,uCAGA,uFAQF","sources":["src/components/card.css"],"sourcesContent":["@layer ddga-components {\n  /* ─── Base ─── */\n\n  .ddga-card {\n    /* Single hook drives all section padding. Variants below redefine it. */\n    --ddga-card-padding: var(--ddga-space-5);\n    display: flex;\n    background-color: var(--ddga-color-card);\n    color: var(--ddga-color-card-foreground);\n    border-radius: var(--ddga-radius-md);\n    overflow: hidden;\n    transition:\n      box-shadow 150ms ease,\n      transform 150ms ease,\n      border-color 150ms ease;\n  }\n\n  /* ─── Orientation ─── */\n\n  .ddga-card--vertical {\n    flex-direction: column;\n  }\n  .ddga-card--horizontal {\n    flex-direction: row;\n    /* RTL: row reverses to keep the image at the start (logical) — handled\n       implicitly by flexbox honoring the writing direction. */\n  }\n\n  /* ─── Variants ─── */\n\n  .ddga-card--default {\n    border: 1px solid var(--ddga-color-border);\n  }\n\n  .ddga-card--outline {\n    background-color: transparent;\n    border: 1px solid var(--ddga-color-border);\n  }\n\n  .ddga-card--elevated {\n    border: 1px solid transparent;\n    box-shadow: var(--ddga-shadow-md);\n  }\n\n  .ddga-card--filled {\n    background-color: var(--ddga-color-muted);\n    border: 1px solid transparent;\n  }\n\n  /* SA Green gradient hero — uses primary palette gradient from dga-preferences\n     §5.4 (SA 600 → SA 500 @ 90°). Text + descriptions invert to white. */\n  .ddga-card--gradient {\n    background-image: linear-gradient(90deg, var(--ddga-sa-600), var(--ddga-sa-500));\n    color: var(--ddga-color-primary-foreground);\n    border: 1px solid transparent;\n  }\n  .ddga-card--gradient .ddga-card__title,\n  .ddga-card--gradient .ddga-card__description {\n    color: inherit;\n  }\n  .ddga-card--gradient .ddga-card__description {\n    /* Softer than the title against the gradient. */\n    opacity: 0.85;\n  }\n  .ddga-card--gradient .ddga-card__footer {\n    border-block-start-color: rgb(255 255 255 / 0.15);\n  }\n\n  /* Bare card — no bg, no border, no shadow. For grouped lists where the\n     parent provides separation, or when stacking content blocks without\n     visual chrome. */\n  .ddga-card--ghost {\n    background-color: transparent;\n    border: 1px solid transparent;\n  }\n  .ddga-card--ghost .ddga-card__footer {\n    border-block-start-color: transparent;\n  }\n\n  /* ─── Padding scale ─── */\n\n  .ddga-card--padding-sm {\n    --ddga-card-padding: var(--ddga-space-3);\n  }\n  .ddga-card--padding-md {\n    --ddga-card-padding: var(--ddga-space-5);\n  }\n  .ddga-card--padding-lg {\n    --ddga-card-padding: var(--ddga-space-6);\n  }\n\n  /* ─── Interactive (hover lift + focus ring; pairs with asChild for clickable cards) ─── */\n\n  .ddga-card--interactive {\n    cursor: pointer;\n    /* No transform on touch — avoids the sticky-hover look on mobile. */\n  }\n  .ddga-card--interactive:hover {\n    border-color: var(--ddga-color-input);\n    box-shadow: var(--ddga-shadow-md);\n  }\n  .ddga-card--interactive.ddga-card--elevated:hover,\n  .ddga-card--interactive.ddga-card--gradient:hover {\n    box-shadow: var(--ddga-shadow-lg);\n  }\n  .ddga-card--interactive:focus-visible {\n    outline: none;\n    border-color: var(--ddga-color-ring);\n    box-shadow: 0 0 0 2px var(--ddga-color-ring);\n  }\n\n  /* ─── Image ─── */\n\n  .ddga-card__image {\n    display: block;\n    inline-size: 100%;\n    block-size: auto;\n    object-fit: cover;\n    aspect-ratio: var(--ddga-card-image-aspect, 16 / 9);\n  }\n\n  /* In horizontal cards, the image hugs the start edge and stretches the full\n     card height. Cap its width so the content side still has room to breathe. */\n  .ddga-card--horizontal > .ddga-card__image {\n    aspect-ratio: auto;\n    inline-size: 40%;\n    max-inline-size: 240px;\n    block-size: auto;\n    align-self: stretch;\n    flex-shrink: 0;\n  }\n\n  /* The content side of a horizontal card needs to take the remaining width\n     and keep its own column layout. */\n  .ddga-card--horizontal > :not(.ddga-card__image) {\n    flex: 1 1 auto;\n  }\n  .ddga-card--horizontal > .ddga-card__header + .ddga-card__content {\n    padding-block-start: 0;\n  }\n\n  /* ─── Sections (all share --ddga-card-padding) ─── */\n\n  .ddga-card__header {\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-space-1);\n    padding: var(--ddga-card-padding);\n  }\n\n  .ddga-card__title {\n    font-size: var(--ddga-font-size-lg);\n    font-weight: var(--ddga-font-weight-semibold);\n    line-height: 1.4;\n    margin: 0;\n    color: var(--ddga-text-primary);\n  }\n\n  .ddga-card__description {\n    font-size: var(--ddga-font-size-sm);\n    line-height: 1.5;\n    margin: 0;\n    color: var(--ddga-text-secondary);\n  }\n\n  .ddga-card__content {\n    padding: var(--ddga-card-padding);\n  }\n\n  /* Header immediately followed by content: collapse the redundant top padding\n     so the two sections read as one continuous block. */\n  .ddga-card__header + .ddga-card__content {\n    padding-block-start: 0;\n  }\n\n  .ddga-card__footer {\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-2);\n    padding: var(--ddga-card-padding);\n    border-block-start: 1px solid var(--ddga-color-border);\n  }\n\n  /* No top border when there's no preceding section to separate from. */\n  .ddga-card__footer:first-child {\n    border-block-start: 0;\n  }\n\n  /* ─── Reduced motion ─── */\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-card {\n      transition: none;\n    }\n  }\n\n  /* ─── Forced colors (Windows High Contrast) ─── */\n\n  @media (forced-colors: active) {\n    /* box-shadow + gradient are dropped in forced-colors — keep a visible\n       boundary and a real focus outline so cards and their focus state survive. */\n    .ddga-card {\n      border: 1px solid CanvasText;\n    }\n    .ddga-card--interactive:focus-visible {\n      outline: 2px solid CanvasText;\n      outline-offset: 2px;\n    }\n  }\n\n  /* ─── Dark mode adjustments ─── */\n\n  [data-theme='dark'] .ddga-card--gradient {\n    background-image: linear-gradient(90deg, var(--ddga-sa-700), var(--ddga-sa-600));\n  }\n}\n"],"names":[]}

package/dist/components/combobox.css

@@ -1,2 +1,2 @@
-@layer ddga-components{.ddga-combobox__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);margin-block-end:var(--ddga-space-2);display:inline-flex}.ddga-combobox__required{color:var(--ddga-color-error)}.ddga-combobox-trigger{justify-content:space-between;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;cursor:pointer;font-family:inherit;transition:border-color .12s,box-shadow .12s;display:inline-flex}.ddga-combobox-trigger--sm{block-size:32px;padding-inline:var(--ddga-space-3);font-size:var(--ddga-font-size-sm)}.ddga-combobox-trigger--md{block-size:36px;padding-inline:var(--ddga-space-4);font-size:var(--ddga-font-size-base)}.ddga-combobox-trigger:focus-visible{border-color:var(--ddga-color-ring);box-shadow:0 0 0 1px var(--ddga-color-ring);outline:none}.ddga-combobox-trigger:disabled{opacity:.5;cursor:not-allowed;background-color:var(--ddga-color-muted)}.ddga-combobox-trigger--error{border-color:var(--ddga-color-error)}.ddga-combobox-trigger--error:focus-visible{border-color:var(--ddga-color-error);box-shadow:0 0 0 1px var(--ddga-color-error)}.ddga-combobox__value{text-overflow:ellipsis;white-space:nowrap;flex:auto;min-inline-size:0;overflow:hidden}.ddga-combobox__placeholder{color:var(--ddga-text-placeholder)}.ddga-combobox__icon{block-size:1em;inline-size:1em;color:var(--ddga-text-secondary);flex-shrink:0}.ddga-combobox-content{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;min-inline-size:200px;overflow:hidden}.ddga-combobox-content[data-state=open]{animation:.12s cubic-bezier(.16,1,.3,1) ddga-combobox-in}.ddga-combobox-content[data-state=closed]{animation:80ms ease-in ddga-combobox-out}@keyframes ddga-combobox-in{0%{opacity:0;transform:translateY(-2px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes ddga-combobox-out{0%{opacity:1}to{opacity:0}}.ddga-combobox-command{flex-direction:column;max-block-size:min(340px,60vh);display:flex}.ddga-combobox-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-border);color:inherit;font:inherit;background-color:#0000;outline:none}.ddga-combobox-input::placeholder{color:var(--ddga-text-placeholder)}.ddga-combobox-list{min-block-size:0;padding:var(--ddga-space-1);flex:auto;overflow-y:auto}.ddga-combobox-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-combobox-item{align-items:center;gap:var(--ddga-space-2);padding-block:var(--ddga-space-1);padding-inline:var(--ddga-space-2);border-radius:var(--ddga-radius-sm);font-size:var(--ddga-font-size-sm);color:inherit;cursor:default;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;outline:none;display:flex}.ddga-combobox-item[data-selected=true]{background-color:var(--ddga-color-muted)}.ddga-combobox-item[data-disabled=true]{color:var(--ddga-text-tertiary);pointer-events:none}.ddga-combobox-item__check{block-size:1em;inline-size:1em;color:var(--ddga-color-primary);flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.ddga-combobox-item__check>svg{block-size:.875em;inline-size:.875em}.ddga-combobox-item__label{text-overflow:ellipsis;white-space:nowrap;flex:auto;min-inline-size:0;overflow:hidden}.ddga-combobox-group [cmdk-group-heading]{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}.ddga-combobox-separator{block-size:1px;margin-block:var(--ddga-space-1);margin-inline:calc(var(--ddga-space-1) * -1);background-color:var(--ddga-color-border)}@media (prefers-reduced-motion:reduce){.ddga-combobox-content[data-state=open],.ddga-combobox-content[data-state=closed]{animation:none}}@media (forced-colors:active){.ddga-combobox-trigger,.ddga-combobox-content{border:1px solid canvastext}.ddga-combobox-item[data-selected=true]{color:highlighttext;background-color:highlight}}}
+@layer ddga-components{.ddga-combobox__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);margin-block-end:var(--ddga-space-2);display:inline-flex}.ddga-combobox__required{color:var(--ddga-color-error)}.ddga-combobox-trigger{justify-content:space-between;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;cursor:pointer;font-family:inherit;transition:border-color .12s,box-shadow .12s;display:inline-flex}.ddga-combobox-trigger--sm{block-size:32px;padding-inline:var(--ddga-space-3);font-size:var(--ddga-font-size-sm)}.ddga-combobox-trigger--md{block-size:36px;padding-inline:var(--ddga-space-4);font-size:var(--ddga-font-size-base)}.ddga-combobox-trigger:focus-visible{border-color:var(--ddga-color-ring);box-shadow:0 0 0 1px var(--ddga-color-ring);outline:none}.ddga-combobox-trigger:disabled{opacity:.5;cursor:not-allowed;background-color:var(--ddga-color-muted)}.ddga-combobox-trigger--error{border-color:var(--ddga-color-error)}.ddga-combobox-trigger--error:focus-visible{border-color:var(--ddga-color-error);box-shadow:0 0 0 1px var(--ddga-color-error)}.ddga-combobox__value{text-overflow:ellipsis;white-space:nowrap;flex:auto;min-inline-size:0;overflow:hidden}.ddga-combobox__placeholder{color:var(--ddga-text-placeholder)}.ddga-combobox__icon{block-size:1em;inline-size:1em;color:var(--ddga-text-secondary);flex-shrink:0}.ddga-combobox-content{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;min-inline-size:200px;overflow:hidden}.ddga-combobox-content[data-state=open]{animation:.12s cubic-bezier(.16,1,.3,1) ddga-combobox-in}.ddga-combobox-content[data-state=closed]{animation:80ms ease-in ddga-combobox-out}@keyframes ddga-combobox-in{0%{opacity:0;transform:translateY(-2px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes ddga-combobox-out{0%{opacity:1}to{opacity:0}}.ddga-combobox-command{flex-direction:column;max-block-size:min(340px,60vh);display:flex}.ddga-combobox-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-border);color:inherit;font:inherit;background-color:#0000;outline:none}.ddga-combobox-input::placeholder{color:var(--ddga-text-placeholder)}.ddga-combobox-list{min-block-size:0;padding:var(--ddga-space-1);flex:auto;overflow-y:auto}.ddga-combobox-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-combobox-item{align-items:center;gap:var(--ddga-space-2);padding-block:var(--ddga-space-1);padding-inline:var(--ddga-space-2);border-radius:var(--ddga-radius-sm);font-size:var(--ddga-font-size-sm);color:inherit;cursor:default;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;outline:none;display:flex}.ddga-combobox-item[data-selected=true]{background-color:var(--ddga-color-muted)}.ddga-combobox-item[data-disabled=true]{color:var(--ddga-text-tertiary);pointer-events:none}.ddga-combobox-item__check{block-size:1em;inline-size:1em;color:var(--ddga-color-primary);flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.ddga-combobox-item__check>svg{block-size:.875em;inline-size:.875em}.ddga-combobox-item__label{text-overflow:ellipsis;white-space:nowrap;flex:auto;min-inline-size:0;overflow:hidden}.ddga-combobox-group [cmdk-group-heading]{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-combobox-group [cmdk-group-heading]{letter-spacing:normal;text-transform:none}.ddga-combobox-separator{block-size:1px;margin-block:var(--ddga-space-1);margin-inline:calc(var(--ddga-space-1) * -1);background-color:var(--ddga-color-border)}@media (prefers-reduced-motion:reduce){.ddga-combobox-content[data-state=open],.ddga-combobox-content[data-state=closed]{animation:none}}@media (forced-colors:active){.ddga-combobox-trigger,.ddga-combobox-content{border:1px solid canvastext}.ddga-combobox-trigger:focus-visible{outline-offset:1px;outline:2px solid highlight}.ddga-combobox-item[data-selected=true]{color:highlighttext;background-color:highlight}}}
 /*# sourceMappingURL=combobox.css.map */

package/dist/components/combobox.css.map

@@ -1 +1 @@
-{"version":3,"mappings":"AAAA,uBAGE,2OASA,uDAOA,oYAkBA,iHAKA,mHAMA,kIAMA,uGAMA,mEAGA,8HAKA,4GAQA,+DAIA,mGASA,wQAeA,iGAGA,mFAGA,4HAUA,wDAWA,yFAMA,uOAWA,qEAMA,2FAOA,+KAQA,oVAoBA,iFAGA,4FAKA,sKASA,oEAIA,iHAUA,6QAUA,gKASA,uCACE,kGAMF,8BACE,0EAIA","sources":["src/components/combobox.css"],"sourcesContent":["@layer ddga-components {\n  /* ─── Label + required ─── */\n\n  .ddga-combobox__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    margin-block-end: var(--ddga-space-2);\n  }\n  .ddga-combobox__required {\n    color: var(--ddga-color-error);\n  }\n\n  /* ─── Trigger (Popover.Trigger as <button>) ─── */\n\n  /* Heights mirror Input/Select so triggers and text inputs line up. */\n  .ddga-combobox-trigger {\n    display: inline-flex;\n    align-items: center;\n    justify-content: space-between;\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    font-family: inherit;\n    text-align: start;\n    cursor: pointer;\n    transition:\n      border-color 120ms ease,\n      box-shadow 120ms ease;\n  }\n\n  .ddga-combobox-trigger--sm {\n    block-size: 32px;\n    padding-inline: var(--ddga-space-3);\n    font-size: var(--ddga-font-size-sm);\n  }\n  .ddga-combobox-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-combobox-trigger:focus-visible {\n    outline: none;\n    border-color: var(--ddga-color-ring);\n    box-shadow: 0 0 0 1px var(--ddga-color-ring);\n  }\n\n  .ddga-combobox-trigger:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n    background-color: var(--ddga-color-muted);\n  }\n\n  .ddga-combobox-trigger--error {\n    border-color: var(--ddga-color-error);\n  }\n  .ddga-combobox-trigger--error:focus-visible {\n    border-color: var(--ddga-color-error);\n    box-shadow: 0 0 0 1px var(--ddga-color-error);\n  }\n\n  .ddga-combobox__value {\n    flex: 1 1 auto;\n    min-inline-size: 0;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n\n  .ddga-combobox__placeholder {\n    color: var(--ddga-text-placeholder);\n  }\n\n  .ddga-combobox__icon {\n    flex-shrink: 0;\n    inline-size: 1em;\n    block-size: 1em;\n    color: var(--ddga-text-secondary);\n  }\n\n  /* ─── Popover content panel ─── */\n\n  .ddga-combobox-content {\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    overflow: hidden;\n    z-index: 50;\n    /* `inline-size: var(--radix-popover-trigger-width)` set inline so the\n       panel always matches trigger width. min-width fallback for very narrow\n       triggers; the popper var is what wins normally. */\n    min-inline-size: 200px;\n  }\n\n  /* Same in/out animation as DropdownMenu — fast + subtle. */\n  .ddga-combobox-content[data-state='open'] {\n    animation: ddga-combobox-in 120ms cubic-bezier(0.16, 1, 0.3, 1);\n  }\n  .ddga-combobox-content[data-state='closed'] {\n    animation: ddga-combobox-out 80ms ease-in;\n  }\n  @keyframes ddga-combobox-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-combobox-out {\n    from {\n      opacity: 1;\n    }\n    to {\n      opacity: 0;\n    }\n  }\n\n  /* ─── cmdk root + input ─── */\n\n  .ddga-combobox-command {\n    display: flex;\n    flex-direction: column;\n    max-block-size: min(340px, 60vh);\n  }\n\n  .ddga-combobox-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-border);\n    background-color: transparent;\n    color: inherit;\n    font: inherit;\n    outline: none;\n  }\n  .ddga-combobox-input::placeholder {\n    color: var(--ddga-text-placeholder);\n  }\n\n  /* ─── List + items ─── */\n\n  .ddga-combobox-list {\n    flex: 1 1 auto;\n    min-block-size: 0;\n    overflow-y: auto;\n    padding: var(--ddga-space-1);\n  }\n\n  .ddga-combobox-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  .ddga-combobox-item {\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-2);\n    padding-block: var(--ddga-space-1);\n    padding-inline: var(--ddga-space-2);\n    border-radius: var(--ddga-radius-sm);\n    font-size: var(--ddga-font-size-sm);\n    color: inherit;\n    cursor: default;\n    user-select: none;\n    outline: none;\n    -webkit-tap-highlight-color: transparent;\n  }\n\n  /* cmdk sets data-selected on the actively highlighted item (keyboard or\n     hover). Our own data-selected (no attribute value) marks the chosen\n     value — distinct concept. CSS uses [data-selected=''] for the chosen\n     mark and [data-selected='true'] for cmdk's highlight; both can coexist\n     on the same item when the chosen item is also highlighted. */\n  .ddga-combobox-item[data-selected='true'] {\n    background-color: var(--ddga-color-muted);\n  }\n  .ddga-combobox-item[data-disabled='true'] {\n    color: var(--ddga-text-tertiary);\n    pointer-events: none;\n  }\n\n  .ddga-combobox-item__check {\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-color-primary);\n  }\n  .ddga-combobox-item__check > svg {\n    inline-size: 0.875em;\n    block-size: 0.875em;\n  }\n  .ddga-combobox-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  /* ─── Group + Separator ─── */\n\n  .ddga-combobox-group [cmdk-group-heading] {\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\n  .ddga-combobox-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  /* ─── Reduced motion + Forced colors ─── */\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-combobox-content[data-state='open'],\n    .ddga-combobox-content[data-state='closed'] {\n      animation: none;\n    }\n  }\n\n  @media (forced-colors: active) {\n    .ddga-combobox-trigger,\n    .ddga-combobox-content {\n      border: 1px solid CanvasText;\n    }\n    .ddga-combobox-item[data-selected='true'] {\n      background-color: Highlight;\n      color: HighlightText;\n    }\n  }\n}\n"],"names":[]}
+{"version":3,"mappings":"AAAA,uBAGE,2OASA,uDAOA,oYAkBA,iHAKA,mHAMA,kIAMA,uGAMA,mEAGA,8HAKA,4GAQA,+DAIA,mGASA,wQAeA,iGAGA,mFAGA,4HAUA,wDAWA,yFAMA,uOAWA,qEAMA,2FAOA,+KAQA,oVAoBA,iFAGA,4FAKA,sKASA,oEAIA,iHAUA,6QAUA,8FAKA,gKASA,uCACE,kGAMF,8BACE,0EAIA,oFAIA","sources":["src/components/combobox.css"],"sourcesContent":["@layer ddga-components {\n  /* ─── Label + required ─── */\n\n  .ddga-combobox__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    margin-block-end: var(--ddga-space-2);\n  }\n  .ddga-combobox__required {\n    color: var(--ddga-color-error);\n  }\n\n  /* ─── Trigger (Popover.Trigger as <button>) ─── */\n\n  /* Heights mirror Input/Select so triggers and text inputs line up. */\n  .ddga-combobox-trigger {\n    display: inline-flex;\n    align-items: center;\n    justify-content: space-between;\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    font-family: inherit;\n    text-align: start;\n    cursor: pointer;\n    transition:\n      border-color 120ms ease,\n      box-shadow 120ms ease;\n  }\n\n  .ddga-combobox-trigger--sm {\n    block-size: 32px;\n    padding-inline: var(--ddga-space-3);\n    font-size: var(--ddga-font-size-sm);\n  }\n  .ddga-combobox-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-combobox-trigger:focus-visible {\n    outline: none;\n    border-color: var(--ddga-color-ring);\n    box-shadow: 0 0 0 1px var(--ddga-color-ring);\n  }\n\n  .ddga-combobox-trigger:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n    background-color: var(--ddga-color-muted);\n  }\n\n  .ddga-combobox-trigger--error {\n    border-color: var(--ddga-color-error);\n  }\n  .ddga-combobox-trigger--error:focus-visible {\n    border-color: var(--ddga-color-error);\n    box-shadow: 0 0 0 1px var(--ddga-color-error);\n  }\n\n  .ddga-combobox__value {\n    flex: 1 1 auto;\n    min-inline-size: 0;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n\n  .ddga-combobox__placeholder {\n    color: var(--ddga-text-placeholder);\n  }\n\n  .ddga-combobox__icon {\n    flex-shrink: 0;\n    inline-size: 1em;\n    block-size: 1em;\n    color: var(--ddga-text-secondary);\n  }\n\n  /* ─── Popover content panel ─── */\n\n  .ddga-combobox-content {\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    overflow: hidden;\n    z-index: 50;\n    /* `inline-size: var(--radix-popover-trigger-width)` set inline so the\n       panel always matches trigger width. min-width fallback for very narrow\n       triggers; the popper var is what wins normally. */\n    min-inline-size: 200px;\n  }\n\n  /* Same in/out animation as DropdownMenu — fast + subtle. */\n  .ddga-combobox-content[data-state='open'] {\n    animation: ddga-combobox-in 120ms cubic-bezier(0.16, 1, 0.3, 1);\n  }\n  .ddga-combobox-content[data-state='closed'] {\n    animation: ddga-combobox-out 80ms ease-in;\n  }\n  @keyframes ddga-combobox-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-combobox-out {\n    from {\n      opacity: 1;\n    }\n    to {\n      opacity: 0;\n    }\n  }\n\n  /* ─── cmdk root + input ─── */\n\n  .ddga-combobox-command {\n    display: flex;\n    flex-direction: column;\n    max-block-size: min(340px, 60vh);\n  }\n\n  .ddga-combobox-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-border);\n    background-color: transparent;\n    color: inherit;\n    font: inherit;\n    outline: none;\n  }\n  .ddga-combobox-input::placeholder {\n    color: var(--ddga-text-placeholder);\n  }\n\n  /* ─── List + items ─── */\n\n  .ddga-combobox-list {\n    flex: 1 1 auto;\n    min-block-size: 0;\n    overflow-y: auto;\n    padding: var(--ddga-space-1);\n  }\n\n  .ddga-combobox-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  .ddga-combobox-item {\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-2);\n    padding-block: var(--ddga-space-1);\n    padding-inline: var(--ddga-space-2);\n    border-radius: var(--ddga-radius-sm);\n    font-size: var(--ddga-font-size-sm);\n    color: inherit;\n    cursor: default;\n    user-select: none;\n    outline: none;\n    -webkit-tap-highlight-color: transparent;\n  }\n\n  /* cmdk sets data-selected='true' on the actively highlighted item (keyboard\n     or hover) — that's the background below. The chosen value is a distinct\n     concept: the component marks it with data-active='' and shows it via the\n     check icon (not a background), so the highlight and the selection never\n     visually collide. */\n  .ddga-combobox-item[data-selected='true'] {\n    background-color: var(--ddga-color-muted);\n  }\n  .ddga-combobox-item[data-disabled='true'] {\n    color: var(--ddga-text-tertiary);\n    pointer-events: none;\n  }\n\n  .ddga-combobox-item__check {\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-color-primary);\n  }\n  .ddga-combobox-item__check > svg {\n    inline-size: 0.875em;\n    block-size: 0.875em;\n  }\n  .ddga-combobox-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  /* ─── Group + Separator ─── */\n\n  .ddga-combobox-group [cmdk-group-heading] {\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 when RTL. */\n  [dir='rtl'] .ddga-combobox-group [cmdk-group-heading] {\n    letter-spacing: normal;\n    text-transform: none;\n  }\n\n  .ddga-combobox-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  /* ─── Reduced motion + Forced colors ─── */\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-combobox-content[data-state='open'],\n    .ddga-combobox-content[data-state='closed'] {\n      animation: none;\n    }\n  }\n\n  @media (forced-colors: active) {\n    .ddga-combobox-trigger,\n    .ddga-combobox-content {\n      border: 1px solid CanvasText;\n    }\n    .ddga-combobox-trigger:focus-visible {\n      outline: 2px solid Highlight;\n      outline-offset: 1px;\n    }\n    .ddga-combobox-item[data-selected='true'] {\n      background-color: Highlight;\n      color: HighlightText;\n    }\n  }\n}\n"],"names":[]}

package/dist/components/command.css

@@ -1,2 +1,2 @@
-@layer ddga-components{.ddga-command{background-color:var(--ddga-color-card);min-block-size:0;inline-size:100%;color:var(--ddga-color-card-foreground);border:1px solid var(--ddga-color-border);border-radius:var(--ddga-radius-md);flex-direction:column;display:flex;overflow:hidden}.ddga-command--dialog{background-color:#0000;border:0;border-radius:0}.ddga-command__input-wrapper{align-items:center;gap:var(--ddga-space-2);padding-inline:var(--ddga-space-3);border-block-end:1px solid var(--ddga-color-border);display:flex}.ddga-command__search-icon{block-size:1rem;inline-size:1rem;color:var(--ddga-text-secondary);flex-shrink:0}.ddga-command__input{min-inline-size:0;padding-block:var(--ddga-space-3);color:inherit;font:inherit;background-color:#0000;border:0;outline:none;flex:auto}.ddga-command__input::placeholder{color:var(--ddga-text-placeholder)}.ddga-command__list{min-block-size:0;max-block-size:min(360px,60vh);padding:var(--ddga-space-1);scroll-padding-block:var(--ddga-space-1);flex:auto;overflow:hidden auto}.ddga-command__empty{padding-block:var(--ddga-space-5);padding-inline:var(--ddga-space-3);font-size:var(--ddga-font-size-sm);color:var(--ddga-text-tertiary);text-align:center}.ddga-command__group [cmdk-group-heading]{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-command__group [cmdk-group-heading]{letter-spacing:normal;text-transform:none}.ddga-command__separator{block-size:1px;margin-block:var(--ddga-space-1);background-color:var(--ddga-color-border)}.ddga-command__item{align-items:center;gap:var(--ddga-space-2);padding-block:var(--ddga-space-2);padding-inline:var(--ddga-space-2);border-radius:var(--ddga-radius-sm);font-size:var(--ddga-font-size-sm);color:inherit;cursor:default;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;outline:none;display:flex}.ddga-command__item[data-selected=true]{background-color:var(--ddga-color-muted)}.ddga-command__item[data-disabled=true]{color:var(--ddga-text-tertiary);pointer-events:none}.ddga-command__item-icon{block-size:1rem;inline-size:1rem;color:var(--ddga-text-secondary);flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.ddga-command__item-icon>svg{block-size:1rem;inline-size:1rem}.ddga-command__item-label{text-overflow:ellipsis;white-space:nowrap;flex:auto;min-inline-size:0;overflow:hidden}.ddga-command__item-shortcut{font-size:var(--ddga-font-size-xs);letter-spacing:.05em;color:var(--ddga-text-tertiary);flex-shrink:0;margin-inline-start:auto}[dir=rtl] .ddga-command__item-shortcut{letter-spacing:normal}.ddga-command__overlay{z-index:60;background-color:#00000080;animation-duration:.15s;animation-timing-function:ease;position:fixed;inset:0}.ddga-command-dialog{inset-block-start:12vh;z-index:61;inline-size:min(var(--ddga-command-dialog-width,640px), calc(100vw - 2rem));background-color:var(--ddga-color-card);max-block-size:min(70vh,480px);color:var(--ddga-color-card-foreground);border:1px solid var(--ddga-color-border);border-radius:var(--ddga-radius-lg);box-shadow:var(--ddga-shadow-lg);flex-direction:column;animation-duration:.18s;animation-timing-function:ease;display:flex;position:fixed;left:50%;overflow:hidden;transform:translate(-50%)}.ddga-command-dialog .ddga-command{min-block-size:0}.ddga-command-dialog .ddga-command__list{max-block-size:none}.ddga-command__overlay[data-state=open]{animation-name:ddga-command-overlay-in}.ddga-command__overlay[data-state=closed]{animation-name:ddga-command-overlay-out}.ddga-command-dialog[data-state=open]{animation-name:ddga-command-dialog-in}.ddga-command-dialog[data-state=closed]{animation-name:ddga-command-dialog-out}@keyframes ddga-command-overlay-in{0%{opacity:0}to{opacity:1}}@keyframes ddga-command-overlay-out{0%{opacity:1}to{opacity:0}}@keyframes ddga-command-dialog-in{0%{opacity:0;transform:translate(-50%)translateY(-8px)scale(.98)}to{opacity:1;transform:translate(-50%)translateY(0)scale(1)}}@keyframes ddga-command-dialog-out{0%{opacity:1;transform:translate(-50%)translateY(0)scale(1)}to{opacity:0;transform:translate(-50%)translateY(-8px)scale(.98)}}@media (prefers-reduced-motion:reduce){.ddga-command__overlay,.ddga-command-dialog{animation-duration:0s}}@media (forced-colors:active){.ddga-command,.ddga-command-dialog{border:1px solid canvastext}.ddga-command__item[data-selected=true]{color:highlighttext;background-color:highlight}}}
+@layer ddga-components{.ddga-command{background-color:var(--ddga-color-card);min-block-size:0;inline-size:100%;color:var(--ddga-color-card-foreground);border:1px solid var(--ddga-color-border);border-radius:var(--ddga-radius-md);flex-direction:column;display:flex;overflow:hidden}.ddga-command--dialog{background-color:#0000;border:0;border-radius:0}.ddga-command__input-wrapper{align-items:center;gap:var(--ddga-space-2);padding-inline:var(--ddga-space-3);border-block-end:1px solid var(--ddga-color-border);display:flex}.ddga-command__search-icon{block-size:1rem;inline-size:1rem;color:var(--ddga-text-secondary);flex-shrink:0}.ddga-command__input{min-inline-size:0;padding-block:var(--ddga-space-3);color:inherit;font:inherit;background-color:#0000;border:0;outline:none;flex:auto}.ddga-command__input::placeholder{color:var(--ddga-text-placeholder)}.ddga-command__list{min-block-size:0;max-block-size:min(360px,60vh);padding:var(--ddga-space-1);scroll-padding-block:var(--ddga-space-1);flex:auto;overflow:hidden auto}.ddga-command__empty{padding-block:var(--ddga-space-5);padding-inline:var(--ddga-space-3);font-size:var(--ddga-font-size-sm);color:var(--ddga-text-tertiary);text-align:center}.ddga-command__group [cmdk-group-heading]{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-command__group [cmdk-group-heading]{letter-spacing:normal;text-transform:none}.ddga-command__separator{block-size:1px;margin-block:var(--ddga-space-1);background-color:var(--ddga-color-border)}.ddga-command__item{align-items:center;gap:var(--ddga-space-2);padding-block:var(--ddga-space-2);padding-inline:var(--ddga-space-2);border-radius:var(--ddga-radius-sm);font-size:var(--ddga-font-size-sm);color:inherit;cursor:default;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;outline:none;display:flex}.ddga-command__item[data-selected=true]{background-color:var(--ddga-color-muted)}.ddga-command__item[data-disabled=true]{color:var(--ddga-text-tertiary);pointer-events:none}.ddga-command__item-icon{block-size:1rem;inline-size:1rem;color:var(--ddga-text-secondary);flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.ddga-command__item-icon>svg{block-size:1rem;inline-size:1rem}.ddga-command__item-label{text-overflow:ellipsis;white-space:nowrap;flex:auto;min-inline-size:0;overflow:hidden}.ddga-command__item-shortcut{font-size:var(--ddga-font-size-xs);letter-spacing:.05em;color:var(--ddga-text-tertiary);flex-shrink:0;margin-inline-start:auto}[dir=rtl] .ddga-command__item-shortcut{letter-spacing:normal}.ddga-command__overlay{z-index:60;background-color:#00000080;animation-duration:.15s;animation-timing-function:ease;position:fixed;inset:0}.ddga-command-dialog{inset-block-start:12vh;z-index:61;inline-size:min(var(--ddga-command-dialog-width,640px), calc(100vw - 2rem));background-color:var(--ddga-color-card);max-block-size:min(70vh,480px);color:var(--ddga-color-card-foreground);border:1px solid var(--ddga-color-border);border-radius:var(--ddga-radius-lg);box-shadow:var(--ddga-shadow-lg);flex-direction:column;animation-duration:.18s;animation-timing-function:ease;display:flex;position:fixed;left:50%;overflow:hidden;transform:translate(-50%)}.ddga-command-dialog .ddga-command{min-block-size:0}.ddga-command-dialog .ddga-command__list{max-block-size:none}.ddga-command__overlay[data-state=open]{animation-name:ddga-command-overlay-in}.ddga-command__overlay[data-state=closed]{animation-name:ddga-command-overlay-out}.ddga-command-dialog[data-state=open]{animation-name:ddga-command-dialog-in}.ddga-command-dialog[data-state=closed]{animation-name:ddga-command-dialog-out}@keyframes ddga-command-overlay-in{0%{opacity:0}to{opacity:1}}@keyframes ddga-command-overlay-out{0%{opacity:1}to{opacity:0}}@keyframes ddga-command-dialog-in{0%{opacity:0;transform:translate(-50%)translateY(-8px)scale(.98)}to{opacity:1;transform:translate(-50%)translateY(0)scale(1)}}@keyframes ddga-command-dialog-out{0%{opacity:1;transform:translate(-50%)translateY(0)scale(1)}to{opacity:0;transform:translate(-50%)translateY(-8px)scale(.98)}}@media (prefers-reduced-motion:reduce){.ddga-command__overlay,.ddga-command-dialog{animation-duration:0s}}@media (forced-colors:active){.ddga-command,.ddga-command-dialog{border:1px solid canvastext}.ddga-command__item[data-selected=true]{color:highlighttext;background-color:highlight}.ddga-command__separator{background-color:canvastext}}}
 /*# sourceMappingURL=command.css.map */

package/dist/components/command.css.map

@@ -1 +1 @@
-{"version":3,"mappings":"AAAA,uBAOE,iQAYA,sEAQA,4KAQA,2GAOA,2JAUA,qEAMA,wKAYA,+KAUA,6QAUA,8FAKA,mHAQA,oVAeA,iFAGA,4FAKA,uKASA,8DAKA,gHASA,4JAOA,6DAMA,2IASA,6fAwBA,oDAGA,6DAMA,+EAGA,kFAGA,4EAGA,+EAIA,8DAQA,+DAQA,gKAUA,iKAWA,uCACE,mEAQF,8BACE,+DAIA","sources":["src/components/command.css"],"sourcesContent":["@layer ddga-components {\n  /* ─── Root (cmdk container) ─── */\n  /*\n   * Base look is the standalone inline box (bordered card). Inside\n   * CommandDialog the `--dialog` modifier drops the border/bg because the\n   * dialog shell owns the surface.\n   */\n  .ddga-command {\n    display: flex;\n    flex-direction: column;\n    inline-size: 100%;\n    min-block-size: 0;\n    background-color: var(--ddga-color-card);\n    color: var(--ddga-color-card-foreground);\n    border: 1px solid var(--ddga-color-border);\n    border-radius: var(--ddga-radius-md);\n    overflow: hidden;\n  }\n\n  .ddga-command--dialog {\n    border: 0;\n    border-radius: 0;\n    background-color: transparent;\n  }\n\n  /* ─── Search input row ─── */\n\n  .ddga-command__input-wrapper {\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-2);\n    padding-inline: var(--ddga-space-3);\n    border-block-end: 1px solid var(--ddga-color-border);\n  }\n\n  .ddga-command__search-icon {\n    flex-shrink: 0;\n    inline-size: 1rem;\n    block-size: 1rem;\n    color: var(--ddga-text-secondary);\n  }\n\n  .ddga-command__input {\n    flex: 1 1 auto;\n    min-inline-size: 0;\n    padding-block: var(--ddga-space-3);\n    border: 0;\n    background-color: transparent;\n    color: inherit;\n    font: inherit;\n    outline: none;\n  }\n  .ddga-command__input::placeholder {\n    color: var(--ddga-text-placeholder);\n  }\n\n  /* ─── List + states ─── */\n\n  .ddga-command__list {\n    flex: 1 1 auto;\n    min-block-size: 0;\n    /* Cap height for the inline surface; the dialog overrides via its own\n       max-block-size. cmdk scroll-into-view drives against this container. */\n    max-block-size: min(360px, 60vh);\n    overflow-y: auto;\n    overflow-x: hidden;\n    padding: var(--ddga-space-1);\n    scroll-padding-block: var(--ddga-space-1);\n  }\n\n  .ddga-command__empty {\n    padding-block: var(--ddga-space-5);\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  /* ─── Group + separator ─── */\n\n  .ddga-command__group [cmdk-group-heading] {\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 when RTL. */\n  [dir='rtl'] .ddga-command__group [cmdk-group-heading] {\n    letter-spacing: normal;\n    text-transform: none;\n  }\n\n  .ddga-command__separator {\n    block-size: 1px;\n    margin-block: var(--ddga-space-1);\n    background-color: var(--ddga-color-border);\n  }\n\n  /* ─── Item ─── */\n\n  .ddga-command__item {\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-2);\n    padding-block: var(--ddga-space-2);\n    padding-inline: var(--ddga-space-2);\n    border-radius: var(--ddga-radius-sm);\n    font-size: var(--ddga-font-size-sm);\n    color: inherit;\n    cursor: default;\n    user-select: none;\n    outline: none;\n    -webkit-tap-highlight-color: transparent;\n  }\n  /* cmdk highlights the active item (keyboard / hover) via data-selected. */\n  .ddga-command__item[data-selected='true'] {\n    background-color: var(--ddga-color-muted);\n  }\n  .ddga-command__item[data-disabled='true'] {\n    color: var(--ddga-text-tertiary);\n    pointer-events: none;\n  }\n\n  .ddga-command__item-icon {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    inline-size: 1rem;\n    block-size: 1rem;\n    color: var(--ddga-text-secondary);\n  }\n  .ddga-command__item-icon > svg {\n    inline-size: 1rem;\n    block-size: 1rem;\n  }\n\n  .ddga-command__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  /* Shortcut hint sits at the inline-end (logical → RTL-correct). */\n  .ddga-command__item-shortcut {\n    margin-inline-start: auto;\n    flex-shrink: 0;\n    font-size: var(--ddga-font-size-xs);\n    letter-spacing: 0.05em;\n    color: var(--ddga-text-tertiary);\n  }\n  [dir='rtl'] .ddga-command__item-shortcut {\n    letter-spacing: normal;\n  }\n\n  /* ─── Dialog shell (Radix Dialog) ─── */\n\n  .ddga-command__overlay {\n    position: fixed;\n    inset: 0;\n    background-color: rgb(0 0 0 / 0.5);\n    z-index: 60;\n    animation-duration: 150ms;\n    animation-timing-function: ease;\n  }\n\n  .ddga-command-dialog {\n    /* Spotlight-style: horizontally centered, anchored near the top. Physical\n       left + translateX for centering (direction-agnostic; pairing\n       inset-inline-start with a physical translate would shift it off-screen\n       in RTL — same rationale as Modal). */\n    position: fixed;\n    inset-block-start: 12vh;\n    left: 50%;\n    transform: translateX(-50%);\n    z-index: 61;\n    display: flex;\n    flex-direction: column;\n    inline-size: min(var(--ddga-command-dialog-width, 640px), calc(100vw - 2rem));\n    max-block-size: min(70vh, 480px);\n    background-color: var(--ddga-color-card);\n    color: var(--ddga-color-card-foreground);\n    border: 1px solid var(--ddga-color-border);\n    border-radius: var(--ddga-radius-lg);\n    box-shadow: var(--ddga-shadow-lg);\n    overflow: hidden;\n    animation-duration: 180ms;\n    animation-timing-function: ease;\n  }\n  /* The inner cmdk root + its list fill the dialog and scroll inside it. */\n  .ddga-command-dialog .ddga-command {\n    min-block-size: 0;\n  }\n  .ddga-command-dialog .ddga-command__list {\n    max-block-size: none;\n  }\n\n  /* ─── Animations (Radix data-state) ─── */\n\n  .ddga-command__overlay[data-state='open'] {\n    animation-name: ddga-command-overlay-in;\n  }\n  .ddga-command__overlay[data-state='closed'] {\n    animation-name: ddga-command-overlay-out;\n  }\n  .ddga-command-dialog[data-state='open'] {\n    animation-name: ddga-command-dialog-in;\n  }\n  .ddga-command-dialog[data-state='closed'] {\n    animation-name: ddga-command-dialog-out;\n  }\n\n  @keyframes ddga-command-overlay-in {\n    from {\n      opacity: 0;\n    }\n    to {\n      opacity: 1;\n    }\n  }\n  @keyframes ddga-command-overlay-out {\n    from {\n      opacity: 1;\n    }\n    to {\n      opacity: 0;\n    }\n  }\n  @keyframes ddga-command-dialog-in {\n    from {\n      opacity: 0;\n      transform: translateX(-50%) translateY(-8px) scale(0.98);\n    }\n    to {\n      opacity: 1;\n      transform: translateX(-50%) translateY(0) scale(1);\n    }\n  }\n  @keyframes ddga-command-dialog-out {\n    from {\n      opacity: 1;\n      transform: translateX(-50%) translateY(0) scale(1);\n    }\n    to {\n      opacity: 0;\n      transform: translateX(-50%) translateY(-8px) scale(0.98);\n    }\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-command__overlay,\n    .ddga-command-dialog {\n      animation-duration: 0ms;\n    }\n  }\n\n  /* ─── Forced colors ─── */\n\n  @media (forced-colors: active) {\n    .ddga-command,\n    .ddga-command-dialog {\n      border: 1px solid CanvasText;\n    }\n    .ddga-command__item[data-selected='true'] {\n      background-color: Highlight;\n      color: HighlightText;\n    }\n  }\n}\n"],"names":[]}
+{"version":3,"mappings":"AAAA,uBAOE,iQAYA,sEAQA,4KAQA,2GAOA,2JAUA,qEAMA,wKAYA,+KAUA,6QAUA,8FAKA,mHAQA,oVAeA,iFAGA,4FAKA,uKASA,8DAKA,gHASA,4JAOA,6DAMA,2IASA,6fAwBA,oDAGA,6DAMA,+EAGA,kFAGA,4EAGA,+EAIA,8DAQA,+DAQA,gKAUA,iKAWA,uCACE,mEAQF,8BACE,+DAIA,uFAIA","sources":["src/components/command.css"],"sourcesContent":["@layer ddga-components {\n  /* ─── Root (cmdk container) ─── */\n  /*\n   * Base look is the standalone inline box (bordered card). Inside\n   * CommandDialog the `--dialog` modifier drops the border/bg because the\n   * dialog shell owns the surface.\n   */\n  .ddga-command {\n    display: flex;\n    flex-direction: column;\n    inline-size: 100%;\n    min-block-size: 0;\n    background-color: var(--ddga-color-card);\n    color: var(--ddga-color-card-foreground);\n    border: 1px solid var(--ddga-color-border);\n    border-radius: var(--ddga-radius-md);\n    overflow: hidden;\n  }\n\n  .ddga-command--dialog {\n    border: 0;\n    border-radius: 0;\n    background-color: transparent;\n  }\n\n  /* ─── Search input row ─── */\n\n  .ddga-command__input-wrapper {\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-2);\n    padding-inline: var(--ddga-space-3);\n    border-block-end: 1px solid var(--ddga-color-border);\n  }\n\n  .ddga-command__search-icon {\n    flex-shrink: 0;\n    inline-size: 1rem;\n    block-size: 1rem;\n    color: var(--ddga-text-secondary);\n  }\n\n  .ddga-command__input {\n    flex: 1 1 auto;\n    min-inline-size: 0;\n    padding-block: var(--ddga-space-3);\n    border: 0;\n    background-color: transparent;\n    color: inherit;\n    font: inherit;\n    outline: none;\n  }\n  .ddga-command__input::placeholder {\n    color: var(--ddga-text-placeholder);\n  }\n\n  /* ─── List + states ─── */\n\n  .ddga-command__list {\n    flex: 1 1 auto;\n    min-block-size: 0;\n    /* Cap height for the inline surface; the dialog overrides via its own\n       max-block-size. cmdk scroll-into-view drives against this container. */\n    max-block-size: min(360px, 60vh);\n    overflow-y: auto;\n    overflow-x: hidden;\n    padding: var(--ddga-space-1);\n    scroll-padding-block: var(--ddga-space-1);\n  }\n\n  .ddga-command__empty {\n    padding-block: var(--ddga-space-5);\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  /* ─── Group + separator ─── */\n\n  .ddga-command__group [cmdk-group-heading] {\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 when RTL. */\n  [dir='rtl'] .ddga-command__group [cmdk-group-heading] {\n    letter-spacing: normal;\n    text-transform: none;\n  }\n\n  .ddga-command__separator {\n    block-size: 1px;\n    margin-block: var(--ddga-space-1);\n    background-color: var(--ddga-color-border);\n  }\n\n  /* ─── Item ─── */\n\n  .ddga-command__item {\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-2);\n    padding-block: var(--ddga-space-2);\n    padding-inline: var(--ddga-space-2);\n    border-radius: var(--ddga-radius-sm);\n    font-size: var(--ddga-font-size-sm);\n    color: inherit;\n    cursor: default;\n    user-select: none;\n    outline: none;\n    -webkit-tap-highlight-color: transparent;\n  }\n  /* cmdk highlights the active item (keyboard / hover) via data-selected. */\n  .ddga-command__item[data-selected='true'] {\n    background-color: var(--ddga-color-muted);\n  }\n  .ddga-command__item[data-disabled='true'] {\n    color: var(--ddga-text-tertiary);\n    pointer-events: none;\n  }\n\n  .ddga-command__item-icon {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    inline-size: 1rem;\n    block-size: 1rem;\n    color: var(--ddga-text-secondary);\n  }\n  .ddga-command__item-icon > svg {\n    inline-size: 1rem;\n    block-size: 1rem;\n  }\n\n  .ddga-command__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  /* Shortcut hint sits at the inline-end (logical → RTL-correct). */\n  .ddga-command__item-shortcut {\n    margin-inline-start: auto;\n    flex-shrink: 0;\n    font-size: var(--ddga-font-size-xs);\n    letter-spacing: 0.05em;\n    color: var(--ddga-text-tertiary);\n  }\n  [dir='rtl'] .ddga-command__item-shortcut {\n    letter-spacing: normal;\n  }\n\n  /* ─── Dialog shell (Radix Dialog) ─── */\n\n  .ddga-command__overlay {\n    position: fixed;\n    inset: 0;\n    background-color: rgb(0 0 0 / 0.5);\n    z-index: 60;\n    animation-duration: 150ms;\n    animation-timing-function: ease;\n  }\n\n  .ddga-command-dialog {\n    /* Spotlight-style: horizontally centered, anchored near the top. Physical\n       left + translateX for centering (direction-agnostic; pairing\n       inset-inline-start with a physical translate would shift it off-screen\n       in RTL — same rationale as Modal). */\n    position: fixed;\n    inset-block-start: 12vh;\n    left: 50%;\n    transform: translateX(-50%);\n    z-index: 61;\n    display: flex;\n    flex-direction: column;\n    inline-size: min(var(--ddga-command-dialog-width, 640px), calc(100vw - 2rem));\n    max-block-size: min(70vh, 480px);\n    background-color: var(--ddga-color-card);\n    color: var(--ddga-color-card-foreground);\n    border: 1px solid var(--ddga-color-border);\n    border-radius: var(--ddga-radius-lg);\n    box-shadow: var(--ddga-shadow-lg);\n    overflow: hidden;\n    animation-duration: 180ms;\n    animation-timing-function: ease;\n  }\n  /* The inner cmdk root + its list fill the dialog and scroll inside it. */\n  .ddga-command-dialog .ddga-command {\n    min-block-size: 0;\n  }\n  .ddga-command-dialog .ddga-command__list {\n    max-block-size: none;\n  }\n\n  /* ─── Animations (Radix data-state) ─── */\n\n  .ddga-command__overlay[data-state='open'] {\n    animation-name: ddga-command-overlay-in;\n  }\n  .ddga-command__overlay[data-state='closed'] {\n    animation-name: ddga-command-overlay-out;\n  }\n  .ddga-command-dialog[data-state='open'] {\n    animation-name: ddga-command-dialog-in;\n  }\n  .ddga-command-dialog[data-state='closed'] {\n    animation-name: ddga-command-dialog-out;\n  }\n\n  @keyframes ddga-command-overlay-in {\n    from {\n      opacity: 0;\n    }\n    to {\n      opacity: 1;\n    }\n  }\n  @keyframes ddga-command-overlay-out {\n    from {\n      opacity: 1;\n    }\n    to {\n      opacity: 0;\n    }\n  }\n  @keyframes ddga-command-dialog-in {\n    from {\n      opacity: 0;\n      transform: translateX(-50%) translateY(-8px) scale(0.98);\n    }\n    to {\n      opacity: 1;\n      transform: translateX(-50%) translateY(0) scale(1);\n    }\n  }\n  @keyframes ddga-command-dialog-out {\n    from {\n      opacity: 1;\n      transform: translateX(-50%) translateY(0) scale(1);\n    }\n    to {\n      opacity: 0;\n      transform: translateX(-50%) translateY(-8px) scale(0.98);\n    }\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-command__overlay,\n    .ddga-command-dialog {\n      animation-duration: 0ms;\n    }\n  }\n\n  /* ─── Forced colors ─── */\n\n  @media (forced-colors: active) {\n    .ddga-command,\n    .ddga-command-dialog {\n      border: 1px solid CanvasText;\n    }\n    .ddga-command__item[data-selected='true'] {\n      background-color: Highlight;\n      color: HighlightText;\n    }\n    .ddga-command__separator {\n      background-color: CanvasText;\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}.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}.ddga-date-picker-popover{z-index:50;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);display:flex;overflow:hidden}.ddga-date-picker-popover[data-entering]{animation:.12s cubic-bezier(.16,1,.3,1) ddga-date-picker-in}.ddga-date-picker-popover[data-exiting]{animation:80ms ease-in ddga-date-picker-out}@keyframes ddga-date-picker-in{0%{opacity:0;transform:translateY(-2px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes ddga-date-picker-out{0%{opacity:1}to{opacity:0}}.ddga-date-picker-dialog{min-block-size:0;max-block-size:100%;padding:var(--ddga-space-3);box-sizing:border-box;outline:none;flex:auto;overflow:auto}.ddga-date-picker-toggle{inline-size:100%;background-color:var(--ddga-color-muted);border-radius:var(--ddga-radius-md);margin-block-end:var(--ddga-space-3);padding:2px;display:inline-flex}.ddga-date-picker-toggle__button{padding-block:var(--ddga-space-1);padding-inline:var(--ddga-space-2);border-radius:calc(var(--ddga-radius-md) - 2px);color:var(--ddga-text-secondary);font:inherit;font-size:var(--ddga-font-size-sm);font-weight:var(--ddga-font-weight-medium);cursor:pointer;background-color:#0000;border:0;outline:none;flex:1 1 0;transition:background-color .12s,color .12s}.ddga-date-picker-toggle__button[data-active]{background-color:var(--ddga-color-background);color:var(--ddga-color-foreground);box-shadow:0 1px 2px #00000014}.ddga-date-picker-toggle__button:focus-visible{box-shadow:0 0 0 2px var(--ddga-color-ring)}.ddga-date-picker-calendar{inline-size:min(100%,280px)}.ddga-date-picker-calendar__header{justify-content:space-between;align-items:center;gap:var(--ddga-space-2);margin-block-end:var(--ddga-space-2);display:flex}.ddga-date-picker-calendar__nav{border-radius:var(--ddga-radius-sm);block-size:1.75rem;inline-size:1.75rem;color:var(--ddga-text-secondary);cursor:pointer;background-color:#0000;border:0;outline:none;justify-content:center;align-items:center;padding:0;display:inline-flex}.ddga-date-picker-calendar__nav:hover{background-color:var(--ddga-color-muted);color:var(--ddga-color-foreground)}.ddga-date-picker-calendar__nav[data-focus-visible]{box-shadow:0 0 0 2px var(--ddga-color-ring)}.ddga-date-picker-calendar__nav[data-disabled]{color:var(--ddga-text-tertiary);cursor:not-allowed}.ddga-date-picker-calendar__heading{font-size:var(--ddga-font-size-sm);font-weight:var(--ddga-font-weight-semibold);text-align:center;color:var(--ddga-color-foreground);flex:auto;margin:0}.ddga-date-picker-calendar__nav-selects{justify-content:center;align-items:center;gap:var(--ddga-space-1);flex:auto;min-inline-size:0;display:inline-flex}.ddga-date-picker-calendar__select{appearance:none;border-radius:var(--ddga-radius-sm);padding-block:var(--ddga-space-1);padding-inline:var(--ddga-space-2);font:inherit;font-size:var(--ddga-font-size-sm);font-weight:var(--ddga-font-weight-semibold);color:var(--ddga-color-foreground);cursor:pointer;font-variant-numeric:tabular-nums;text-align:center;text-align-last:center;background-color:#0000;border:1px solid #0000;outline:none;max-inline-size:100%;margin:0}.ddga-date-picker-calendar__select:hover{background-color:var(--ddga-color-muted)}.ddga-date-picker-calendar__select:focus-visible{border-color:var(--ddga-color-ring);box-shadow:0 0 0 1px var(--ddga-color-ring)}.ddga-date-picker-calendar__select option{color:canvastext;background-color:canvas}.ddga-date-picker-calendar__year-select{min-inline-size:4.5ch}.ddga-date-picker-calendar__grid{border-collapse:collapse;inline-size:100%}.ddga-date-picker-calendar__weekday{padding-block:var(--ddga-space-1);font-size:var(--ddga-font-size-xs);font-weight:var(--ddga-font-weight-medium);color:var(--ddga-text-tertiary);text-align:center}.ddga-date-picker-calendar__cell{text-align:center;block-size:2rem;inline-size:2rem;font-size:var(--ddga-font-size-sm);font-variant-numeric:tabular-nums;color:var(--ddga-color-foreground);border-radius:var(--ddga-radius-sm);cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;outline:none;flex-direction:column;justify-content:center;align-items:center;padding:0;line-height:1;display:inline-flex}.ddga-date-picker-calendar__cell[data-today]:not([data-selected]){box-shadow:inset 0 0 0 1.5px var(--ddga-color-primary);color:var(--ddga-color-primary);font-weight:var(--ddga-font-weight-semibold)}.ddga-date-picker-calendar__cell-primary{font-size:inherit;line-height:1}.ddga-date-picker-calendar__cell-secondary{color:var(--ddga-text-tertiary);margin-block-start:1px;font-size:.625rem;line-height:1}.ddga-date-picker-calendar__cell[data-selected] .ddga-date-picker-calendar__cell-secondary{color:inherit;opacity:.85}.ddga-date-picker-calendar__cell[data-hovered]:not([data-disabled]):not([data-selected]){background-color:var(--ddga-color-muted)}.ddga-date-picker-calendar__cell[data-focus-visible]{box-shadow:inset 0 0 0 2px var(--ddga-color-ring)}.ddga-date-picker-calendar__cell[data-selected]{background-color:var(--ddga-color-primary);color:var(--ddga-color-primary-foreground)}.ddga-date-picker-calendar__cell[data-disabled],.ddga-date-picker-calendar__cell[data-unavailable]{color:var(--ddga-text-tertiary);cursor:not-allowed}.ddga-date-picker-calendar__cell[data-outside-month]{color:var(--ddga-text-tertiary)}@media (prefers-reduced-motion:reduce){.ddga-date-picker-trigger,.ddga-date-picker-toggle__button{transition:none}.ddga-date-picker-popover[data-entering],.ddga-date-picker-popover[data-exiting]{animation:none}}@media (forced-colors:active){.ddga-date-picker-trigger,.ddga-date-picker-popover{border:1px solid canvastext}.ddga-date-picker-trigger[data-focus-within]{outline-offset:1px;outline:2px solid highlight}.ddga-date-picker-calendar__cell[data-selected]{color:highlighttext;background-color:highlight}.ddga-date-picker-calendar__cell[data-focus-visible]{outline-offset:1px;outline:2px solid highlight}.ddga-date-picker-toggle__button[data-active]{color:highlighttext;background-color:highlight}}}
+@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}.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}}}
 /*# sourceMappingURL=date-picker.css.map */

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

@@ -1 +1 @@
-{"version":3,"mappings":"AAAA,uBAME,yMAQA,sFAUA,sUAeA,oHAKA,sHAMA,6HAKA,gHAMA,sEAGA,sIAOA,4IAYA,8NAUA,gFAIA,+HAQA,+FAIA,mHAOA,oTAgBA,iHAIA,+FAGA,iEAGA,uDAaA,kQAYA,qGAGA,oFAGA,+HAUA,2DAiBA,qJAYA,4LAQA,qYAiBA,8JAKA,2FAMA,uDAIA,8JAQA,gRAcA,kHAIA,gGAGA,kGAUA,4LAeA,0JASA,+cAoBA,kFAGA,iIAMA,mFAIA,8DAKA,2EAKA,sMAYA,0bAuBA,sMASA,yEAIA,kIAMA,qHAIA,kIAGA,uGAGA,sIAIA,sJAUA,qFAMA,uCACE,2EAIA,iGAQF,8BACE,gFAIA,4FAIA,+FAIA,oGAIA","sources":["src/components/date-picker.css"],"sourcesContent":["@layer ddga-components {\n  /* Wrapper (.ddga-field) + helper/error (.ddga-field__message) are shared\n     — see field.css. Only DatePicker-specific styles live here. */\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    /* Force LTR segment direction even in RTL UI so dates always read\n       day-month-year left-to-right (matches react-aria's recommended UX\n       for numeric date entry — keeps mental model stable across locales). */\n    direction: ltr;\n    font-variant-numeric: tabular-nums;\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\n     show the focus background even if Tab lands on them — react-aria marks\n     them with 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  /* ─── Popover (the floating panel) ─── */\n\n  /* react-aria's useOverlayPosition sets `max-height` inline on the popover\n     based on the space available between the trigger and the viewport edge\n     (minus `containerPadding`). We pair that with `overflow: auto` on the\n     inner Dialog so when the calendar can't fit (short iframes, dual-calendar\n     mode), the content scrolls instead of being clipped. `overflow: hidden`\n     stays on the popover so the rounded corners crop animation bleed. */\n  .ddga-date-picker-popover {\n    z-index: 50;\n    display: flex;\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    overflow: hidden;\n  }\n\n  /* react-aria emits data-entering / data-exiting during transitions. */\n  .ddga-date-picker-popover[data-entering] {\n    animation: ddga-date-picker-in 120ms cubic-bezier(0.16, 1, 0.3, 1);\n  }\n  .ddga-date-picker-popover[data-exiting] {\n    animation: ddga-date-picker-out 80ms ease-in;\n  }\n  @keyframes ddga-date-picker-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-date-picker-out {\n    from {\n      opacity: 1;\n    }\n    to {\n      opacity: 0;\n    }\n  }\n\n  /* ─── Dialog (panel padding + scroll container) ─── */\n\n  /* `max-block-size: 100%` + `overflow: auto` make the Dialog the scroll\n     container inside the popover. The Popover constrains height via its\n     react-aria-set `max-height`; the Dialog respects that bound and scrolls\n     internally when the calendar grid + toggle exceed it. `min-block-size: 0`\n     is the flex-child trick that lets the scroll container actually shrink\n     (otherwise it grows to content). */\n  .ddga-date-picker-dialog {\n    flex: 1 1 auto;\n    min-block-size: 0;\n    max-block-size: 100%;\n    padding: var(--ddga-space-3);\n    outline: none;\n    overflow: auto;\n    box-sizing: border-box;\n  }\n\n  /* ─── Calendar-system toggle (Gregorian ↔ Hijri) ─── */\n\n  .ddga-date-picker-toggle {\n    display: inline-flex;\n    inline-size: 100%;\n    margin-block-end: var(--ddga-space-3);\n    padding: 2px;\n    background-color: var(--ddga-color-muted);\n    border-radius: var(--ddga-radius-md);\n  }\n  .ddga-date-picker-toggle__button {\n    flex: 1 1 0;\n    padding-block: var(--ddga-space-1);\n    padding-inline: var(--ddga-space-2);\n    border: 0;\n    border-radius: calc(var(--ddga-radius-md) - 2px);\n    background-color: transparent;\n    color: var(--ddga-text-secondary);\n    font: inherit;\n    font-size: var(--ddga-font-size-sm);\n    font-weight: var(--ddga-font-weight-medium);\n    cursor: pointer;\n    outline: none;\n    transition:\n      background-color 120ms ease,\n      color 120ms ease;\n  }\n  .ddga-date-picker-toggle__button[data-active] {\n    background-color: var(--ddga-color-background);\n    color: var(--ddga-color-foreground);\n    box-shadow: 0 1px 2px rgb(0 0 0 / 0.08);\n  }\n  .ddga-date-picker-toggle__button:focus-visible {\n    box-shadow: 0 0 0 2px var(--ddga-color-ring);\n  }\n\n  /* ─── Calendar grid ─── */\n\n  .ddga-date-picker-calendar {\n    inline-size: min(100%, 280px);\n  }\n\n  .ddga-date-picker-calendar__header {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: var(--ddga-space-2);\n    margin-block-end: var(--ddga-space-2);\n  }\n\n  .ddga-date-picker-calendar__nav {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    inline-size: 1.75rem;\n    block-size: 1.75rem;\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-calendar__nav:hover {\n    background-color: var(--ddga-color-muted);\n    color: var(--ddga-color-foreground);\n  }\n  .ddga-date-picker-calendar__nav[data-focus-visible] {\n    box-shadow: 0 0 0 2px var(--ddga-color-ring);\n  }\n  .ddga-date-picker-calendar__nav[data-disabled] {\n    color: var(--ddga-text-tertiary);\n    cursor: not-allowed;\n  }\n  /* RTL chevron direction is handled in DatePicker.tsx by swapping the icon\n     components themselves (PrevChevron / NextChevron based on `dgaCtx.dir`)\n     — this is more robust than a CSS scaleX flip because it doesn't rely on\n     the popover portal correctly inheriting the `dir` attribute from the\n     DgaProvider root. */\n\n  .ddga-date-picker-calendar__heading {\n    flex: 1 1 auto;\n    margin: 0;\n    font-size: var(--ddga-font-size-sm);\n    font-weight: var(--ddga-font-weight-semibold);\n    text-align: center;\n    color: var(--ddga-color-foreground);\n  }\n\n  /* ─── Month + Year dropdowns (CalendarNavHeader) ─── */\n\n  /* Replace the static heading with two native <select>s. Native selects\n     give us free keyboard support + native focus rings + screen-reader\n     announcements; styling stays minimal so the platform's wheel/typeahead\n     stays untouched. */\n  .ddga-date-picker-calendar__nav-selects {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    gap: var(--ddga-space-1);\n    flex: 1 1 auto;\n    min-inline-size: 0;\n  }\n\n  .ddga-date-picker-calendar__select {\n    appearance: none;\n    -webkit-appearance: none;\n    background-color: transparent;\n    border: 1px solid transparent;\n    border-radius: var(--ddga-radius-sm);\n    padding-block: var(--ddga-space-1);\n    padding-inline: var(--ddga-space-2);\n    margin: 0;\n    font: inherit;\n    font-size: var(--ddga-font-size-sm);\n    font-weight: var(--ddga-font-weight-semibold);\n    color: var(--ddga-color-foreground);\n    cursor: pointer;\n    font-variant-numeric: tabular-nums;\n    outline: none;\n    text-align: center;\n    text-align-last: center;\n    max-inline-size: 100%;\n  }\n  .ddga-date-picker-calendar__select:hover {\n    background-color: var(--ddga-color-muted);\n  }\n  .ddga-date-picker-calendar__select:focus-visible {\n    border-color: var(--ddga-color-ring);\n    box-shadow: 0 0 0 1px var(--ddga-color-ring);\n  }\n  /* Native option elements pick up the OS theme; can't fully style them, but\n     ensure the popup respects RTL on supporting browsers. */\n  .ddga-date-picker-calendar__select option {\n    color: CanvasText;\n    background-color: Canvas;\n  }\n  .ddga-date-picker-calendar__year-select {\n    /* The year string is short (4 digits) — give it just enough width. */\n    min-inline-size: 4.5ch;\n  }\n\n  .ddga-date-picker-calendar__grid {\n    inline-size: 100%;\n    border-collapse: collapse;\n  }\n\n  .ddga-date-picker-calendar__weekday {\n    padding-block: var(--ddga-space-1);\n    font-size: var(--ddga-font-size-xs);\n    font-weight: var(--ddga-font-weight-medium);\n    color: var(--ddga-text-tertiary);\n    text-align: center;\n  }\n\n  /* CalendarCell renders the inner role=\"button\" div; react-aria wires the\n     <td>. Style the inner element so the focus ring + selected background\n     stay inside the cell footprint. Flex column so a secondary day number\n     (when `showSecondaryCalendar` is on) stacks neatly under the primary. */\n  .ddga-date-picker-calendar__cell {\n    display: inline-flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    inline-size: 2rem;\n    block-size: 2rem;\n    padding: 0;\n    text-align: center;\n    font-size: var(--ddga-font-size-sm);\n    font-variant-numeric: tabular-nums;\n    line-height: 1;\n    color: var(--ddga-color-foreground);\n    border-radius: var(--ddga-radius-sm);\n    cursor: pointer;\n    outline: none;\n    user-select: none;\n    -webkit-tap-highlight-color: transparent;\n  }\n\n  /* Today ring — visible whenever a cell represents \"today\" in the displayed\n     calendar (react-aria emits data-today). Inset to stay inside the cell;\n     selected wins by re-painting the background. */\n  .ddga-date-picker-calendar__cell[data-today]:not([data-selected]) {\n    box-shadow: inset 0 0 0 1.5px var(--ddga-color-primary);\n    color: var(--ddga-color-primary);\n    font-weight: var(--ddga-font-weight-semibold);\n  }\n\n  /* Dual-calendar layout: the primary day stays at the normal size; the\n     secondary (alternate calendar) renders below at ~70% size in the muted\n     text color. Selected state inherits the contrast color for both. */\n  .ddga-date-picker-calendar__cell-primary {\n    font-size: inherit;\n    line-height: 1;\n  }\n  .ddga-date-picker-calendar__cell-secondary {\n    margin-block-start: 1px;\n    font-size: 0.625rem;\n    line-height: 1;\n    color: var(--ddga-text-tertiary);\n  }\n  .ddga-date-picker-calendar__cell[data-selected] .ddga-date-picker-calendar__cell-secondary {\n    color: inherit;\n    opacity: 0.85;\n  }\n  .ddga-date-picker-calendar__cell[data-hovered]:not([data-disabled]):not([data-selected]) {\n    background-color: var(--ddga-color-muted);\n  }\n  .ddga-date-picker-calendar__cell[data-focus-visible] {\n    box-shadow: inset 0 0 0 2px var(--ddga-color-ring);\n  }\n  .ddga-date-picker-calendar__cell[data-selected] {\n    background-color: var(--ddga-color-primary);\n    color: var(--ddga-color-primary-foreground);\n  }\n  .ddga-date-picker-calendar__cell[data-disabled],\n  .ddga-date-picker-calendar__cell[data-unavailable] {\n    color: var(--ddga-text-tertiary);\n    cursor: not-allowed;\n  }\n  /* Outside-month cells are fully clickable in react-aria — selecting one\n     navigates the visible month forward/back. Use a softer text color (no\n     opacity reduction) so they read as low-emphasis-but-active peers, not\n     disabled. Hover/focus rules above continue to apply because we don't\n     scope them to \"inside month only\". */\n  .ddga-date-picker-calendar__cell[data-outside-month] {\n    color: var(--ddga-text-tertiary);\n  }\n\n  /* ─── Reduced motion ─── */\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-date-picker-trigger,\n    .ddga-date-picker-toggle__button {\n      transition: none;\n    }\n    .ddga-date-picker-popover[data-entering],\n    .ddga-date-picker-popover[data-exiting] {\n      animation: none;\n    }\n  }\n\n  /* ─── Forced colors (Windows High Contrast) ─── */\n\n  @media (forced-colors: active) {\n    .ddga-date-picker-trigger,\n    .ddga-date-picker-popover {\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-calendar__cell[data-selected] {\n      background-color: Highlight;\n      color: HighlightText;\n    }\n    .ddga-date-picker-calendar__cell[data-focus-visible] {\n      outline: 2px solid Highlight;\n      outline-offset: 1px;\n    }\n    .ddga-date-picker-toggle__button[data-active] {\n      background-color: Highlight;\n      color: HighlightText;\n    }\n  }\n}\n"],"names":[]}
+{"version":3,"mappings":"AAAA,uBAQE,yMAQA,sFAUA,sUAeA,oHAKA,sHAMA,6HAKA,gHAMA,sEAGA,sIAOA,4IAYA,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    /* Force LTR segment direction even in RTL UI so dates always read\n       day-month-year left-to-right (matches react-aria's recommended UX for\n       numeric date entry — keeps mental model stable across locales). */\n    direction: ltr;\n    font-variant-numeric: tabular-nums;\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":[]}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"mappings":"AAAA,uBAQE,+MAQA,4FAOA,4UAeA,0HAKA,4HAMA,mIAKA,sHAMA,4EAGA,4IAOA,kJAYA,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    /* Force LTR segment direction even in RTL so each date reads\n       day-month-year left-to-right. The flex row itself follows page dir, so in\n       RTL the start input correctly sits on the right (start of the range). */\n    direction: ltr;\n    font-variant-numeric: tabular-nums;\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":[]}

package/dist/components/description-list.css

@@ -1,2 +1,2 @@
-@layer ddga-components{.ddga-description-list{--ddga-dl-term-width:12rem;color:var(--ddga-text-primary);font-size:var(--ddga-font-size-base);margin:0}.ddga-description-list__item{gap:var(--ddga-space-2) var(--ddga-space-4);padding-block:var(--ddga-space-2);display:flex}.ddga-description-list__term{color:var(--ddga-text-secondary);font-weight:var(--ddga-font-weight-medium);line-height:1.5}.ddga-description-list__details{color:var(--ddga-text-primary);margin:0;line-height:1.5}.ddga-description-list--horizontal .ddga-description-list__item{flex-direction:row;align-items:baseline}.ddga-description-list--horizontal .ddga-description-list__term{inline-size:var(--ddga-dl-term-width);flex:none}.ddga-description-list--horizontal .ddga-description-list__details{flex:auto;min-inline-size:0}@media (max-width:480px){.ddga-description-list--horizontal .ddga-description-list__item{gap:var(--ddga-space-1);flex-direction:column}.ddga-description-list--horizontal .ddga-description-list__term{inline-size:auto}}.ddga-description-list--vertical .ddga-description-list__item{gap:var(--ddga-space-1);flex-direction:column}.ddga-description-list--divided .ddga-description-list__item{border-block-end:1px solid var(--ddga-color-border)}.ddga-description-list--divided .ddga-description-list__item:last-child{border-block-end:0}}
+@layer ddga-components{.ddga-description-list{--ddga-dl-term-width:12rem;color:var(--ddga-text-primary);font-size:var(--ddga-font-size-base);margin:0}.ddga-description-list__item{gap:var(--ddga-space-2) var(--ddga-space-4);padding-block:var(--ddga-space-2);display:flex}.ddga-description-list__term{color:var(--ddga-text-secondary);font-weight:var(--ddga-font-weight-medium);line-height:1.5}.ddga-description-list__details{color:var(--ddga-text-primary);margin:0;line-height:1.5}.ddga-description-list--horizontal .ddga-description-list__item{flex-direction:row;align-items:baseline}.ddga-description-list--horizontal .ddga-description-list__term{inline-size:var(--ddga-dl-term-width);flex:none}.ddga-description-list--horizontal .ddga-description-list__details{flex:auto;min-inline-size:0}@media (max-width:480px){.ddga-description-list--horizontal .ddga-description-list__item{gap:var(--ddga-space-1);flex-direction:column}.ddga-description-list--horizontal .ddga-description-list__term{inline-size:auto}}.ddga-description-list--vertical .ddga-description-list__item{gap:var(--ddga-space-1);flex-direction:column}.ddga-description-list--divided .ddga-description-list__item{border-block-end:1px solid var(--ddga-color-border)}.ddga-description-list--divided .ddga-description-list__item:last-child{border-block-end:0}@media (forced-colors:active){.ddga-description-list--divided .ddga-description-list__item{border-block-end-color:canvastext}}}
 /*# sourceMappingURL=description-list.css.map */