@shortstravelmgmt/component-lib 0.5.0 → 0.5.1-canary.95.g6683883

package/dist/index.esm.js

@@ -1124,7 +1124,7 @@ const contentStyle$e = {
 const iconStyle$i = {
     label: 'Alert-iconStyle', flexShrink: 0, marginTop: 1, color: 'var(--alert-accent)'
 };
-const bodyStyle$e = {
+const bodyStyle$f = {
     label: 'Alert-bodyStyle', flex: 1, minWidth: 0
 };
 const titleStyle$J = {
@@ -1196,7 +1196,7 @@ const variantIcons = {
  */
 const Alert = ({ variant = 'primary', title, children, dismissible = false, onDismiss, className = '', }) => {
     const IconComponent = variantIcons[variant];
-    return (jsx("div", { className: cx(sx(alertStyle$5), sx(variantStyles$8[variant]), className), role: "alert", children: jsxs("div", { className: sx(contentStyle$e), children: [jsx(IconComponent, { className: sx(iconStyle$i), size: 20 }), jsxs("div", { className: sx(bodyStyle$e), children: [title && jsx("h4", { className: sx(titleStyle$J), children: title }), jsx("div", { className: sx(messageStyle$3), children: children })] }), dismissible && onDismiss && (jsx("button", { type: "button", onClick: onDismiss, className: sx(dismissButtonStyle), "aria-label": "Dismiss alert", children: jsx(CloseIcon, { size: 16 }) }))] }) }));
+    return (jsx("div", { className: cx(sx(alertStyle$5), sx(variantStyles$8[variant]), className), role: "alert", children: jsxs("div", { className: sx(contentStyle$e), children: [jsx(IconComponent, { className: sx(iconStyle$i), size: 20 }), jsxs("div", { className: sx(bodyStyle$f), children: [title && jsx("h4", { className: sx(titleStyle$J), children: title }), jsx("div", { className: sx(messageStyle$3), children: children })] }), dismissible && onDismiss && (jsx("button", { type: "button", onClick: onDismiss, className: sx(dismissButtonStyle), "aria-label": "Dismiss alert", children: jsx(CloseIcon, { size: 16 }) }))] }) }));
 };
 
 const avatarSizeStyles = {
@@ -2011,12 +2011,12 @@ const labelTextSizeStyles = {
     lg: { fontSize: 'var(--text-base)' },
 };
 /** Helper and error text hang under the label, indented past the box. */
-const helperTextStyle$6 = {
+const helperTextStyle$7 = {
     label: 'Checkbox-helperTextStyle',
     fontSize: 'var(--text-xs)',
     color: 'var(--color-gray-500)',
 };
-const errorTextStyle$6 = {
+const errorTextStyle$7 = {
     label: 'Checkbox-errorTextStyle',
     fontSize: 'var(--text-xs)',
     color: 'var(--color-red-500)',
@@ -2063,7 +2063,7 @@ const Checkbox = forwardRef(({ label, size = 'md', helperText, error, indetermin
                                     ? indicator({ checked: !!checked, indeterminate, disabled: !!disabled })
                                     : indeterminate
                                         ? jsx(IndeterminateIcon, {})
-                                        : jsx(CheckIcon, {}) })] }), label && (jsx("span", { className: cx(sx(labelTextStyle), sx(labelTextSizeStyles[size])), children: label }))] }), error && (jsx("span", { id: errorId, className: cx(sx(errorTextStyle$6), sx(assistiveOffsetStyles[size])), children: error })), helperText && !error && (jsx("span", { id: helperId, className: cx(sx(helperTextStyle$6), sx(assistiveOffsetStyles[size])), children: helperText }))] }));
+                                        : jsx(CheckIcon, {}) })] }), label && (jsx("span", { className: cx(sx(labelTextStyle), sx(labelTextSizeStyles[size])), children: label }))] }), error && (jsx("span", { id: errorId, className: cx(sx(errorTextStyle$7), sx(assistiveOffsetStyles[size])), children: error })), helperText && !error && (jsx("span", { id: helperId, className: cx(sx(helperTextStyle$7), sx(assistiveOffsetStyles[size])), children: helperText }))] }));
 });
 Checkbox.displayName = 'Checkbox';
 
@@ -2192,12 +2192,12 @@ const inputDisabledStyle = {
     cursor: 'not-allowed',
     color: 'var(--color-gray-500)',
 };
-const helperTextStyle$5 = {
+const helperTextStyle$6 = {
     label: 'Datepicker-helperTextStyle',
     fontSize: 'var(--text-xs)',
     color: 'var(--color-gray-500)',
 };
-const errorTextStyle$5 = {
+const errorTextStyle$6 = {
     label: 'Datepicker-errorTextStyle',
     fontSize: 'var(--text-xs)',
     color: 'var(--color-red-500)',
@@ -2218,7 +2218,7 @@ const Datepicker = forwardRef(({ size = 'md', label, helperText, error, fullWidt
     !error && !disabled && sx(inputWrapperHoverStyle), error && sx(inputWrapperErrorStyle), disabled && sx(inputWrapperDisabledStyle));
     return (jsxs("div", { className: wrapperClasses, children: [label && (jsx("label", { htmlFor: inputId, className: sx(labelStyle$h), children: label })), jsxs("div", { className: inputWrapperClasses, children: [jsx("span", { className: cx(sx(iconStyle$f), sx(iconSizeStyles$1[size])), children: jsx(CalendarIcon, {}) }), jsx("input", { ref: ref, type: "date", id: inputId, className: cx(sx(inputStyle$6), sx(inputSizeStyles$1[size]), disabled && sx(inputDisabledStyle)), disabled: disabled, "aria-invalid": !!error, "aria-describedby": [error ? errorId : null, helperText ? helperId : null]
                             .filter(Boolean)
-                            .join(' ') || undefined, ...props })] }), error && (jsx("span", { id: errorId, className: sx(errorTextStyle$5), children: error })), helperText && !error && (jsx("span", { id: helperId, className: sx(helperTextStyle$5), children: helperText }))] }));
+                            .join(' ') || undefined, ...props })] }), error && (jsx("span", { id: errorId, className: sx(errorTextStyle$6), children: error })), helperText && !error && (jsx("span", { id: helperId, className: sx(helperTextStyle$6), children: helperText }))] }));
 });
 Datepicker.displayName = 'Datepicker';
 
@@ -2915,12 +2915,12 @@ const disabledStyle$6 = {
         cursor: 'not-allowed',
     },
 };
-const helperTextStyle$4 = {
+const helperTextStyle$5 = {
     label: 'Input-helperTextStyle',
     fontSize: 'var(--fs-xs)',
     color: 'var(--fg-3)',
 };
-const errorTextStyle$4 = {
+const errorTextStyle$5 = {
     label: 'Input-errorTextStyle',
     fontSize: 'var(--fs-xs)',
     color: 'var(--color-error)',
@@ -3034,7 +3034,7 @@ const Input = forwardRef(({ size = 'md', sizing = 'fixed', label, helperText, er
     // The fixed-height class still applies its horizontal padding and gap;
     // the padded classes that follow override height and the vertical rhythm.
     sx(sizeStyles$8[size]), paddedClasses(sizing, size), error && sx(errorStyle$4), disabled && sx(disabledStyle$6));
-    return (jsxs("div", { className: wrapperClasses, children: [label && (jsx("label", { htmlFor: inputId, className: sx(labelStyle$g), children: label })), jsxs("div", { className: inputWrapperClasses, children: [leftIcon && jsx("span", { className: sx(iconStyle$e), children: leftIcon }), jsx("input", { ref: ref, id: inputId, className: sx(inputStyle$5), disabled: disabled, "aria-invalid": !!error, "aria-describedby": error ? `${inputId}-error` : helperText ? `${inputId}-helper` : undefined, ...props }), rightIcon && jsx("span", { className: sx(iconStyle$e), children: rightIcon })] }), error && (jsx("span", { id: `${inputId}-error`, className: sx(errorTextStyle$4), children: error })), helperText && !error && (jsx("span", { id: `${inputId}-helper`, className: sx(helperTextStyle$4), children: helperText }))] }));
+    return (jsxs("div", { className: wrapperClasses, children: [label && (jsx("label", { htmlFor: inputId, className: sx(labelStyle$g), children: label })), jsxs("div", { className: inputWrapperClasses, children: [leftIcon && jsx("span", { className: sx(iconStyle$e), children: leftIcon }), jsx("input", { ref: ref, id: inputId, className: sx(inputStyle$5), disabled: disabled, "aria-invalid": !!error, "aria-describedby": error ? `${inputId}-error` : helperText ? `${inputId}-helper` : undefined, ...props }), rightIcon && jsx("span", { className: sx(iconStyle$e), children: rightIcon })] }), error && (jsx("span", { id: `${inputId}-error`, className: sx(errorTextStyle$5), children: error })), helperText && !error && (jsx("span", { id: `${inputId}-helper`, className: sx(helperTextStyle$5), children: helperText }))] }));
 });
 Input.displayName = 'Input';
 /**
@@ -3050,7 +3050,7 @@ const Textarea = forwardRef(({ size = 'md', sizing = 'fixed', label, helperText,
     // `.textarea.paddedSm` — the type scale the padded rules put on a
     // descendant `.input` that a bare <textarea> does not have.
     sizing === 'padded' && sx(textareaPaddedSizeStyles[size]), error && sx(errorStyle$4), disabled && sx(disabledStyle$6));
-    return (jsxs("div", { className: wrapperClasses, children: [label && (jsx("label", { htmlFor: textareaId, className: sx(labelStyle$g), children: label })), jsx("textarea", { ref: ref, id: textareaId, className: textareaClasses, disabled: disabled, rows: rows, "aria-invalid": !!error, "aria-describedby": error ? `${textareaId}-error` : helperText ? `${textareaId}-helper` : undefined, ...props }), error && (jsx("span", { id: `${textareaId}-error`, className: sx(errorTextStyle$4), children: error })), helperText && !error && (jsx("span", { id: `${textareaId}-helper`, className: sx(helperTextStyle$4), children: helperText }))] }));
+    return (jsxs("div", { className: wrapperClasses, children: [label && (jsx("label", { htmlFor: textareaId, className: sx(labelStyle$g), children: label })), jsx("textarea", { ref: ref, id: textareaId, className: textareaClasses, disabled: disabled, rows: rows, "aria-invalid": !!error, "aria-describedby": error ? `${textareaId}-error` : helperText ? `${textareaId}-helper` : undefined, ...props }), error && (jsx("span", { id: `${textareaId}-error`, className: sx(errorTextStyle$5), children: error })), helperText && !error && (jsx("span", { id: `${textareaId}-helper`, className: sx(helperTextStyle$5), children: helperText }))] }));
 });
 Textarea.displayName = 'Textarea';
 
@@ -3441,12 +3441,12 @@ const paddedSizeStyles = {
         },
     },
 };
-const helperTextStyle$3 = {
+const helperTextStyle$4 = {
     label: 'Select-helperTextStyle',
     fontSize: 'var(--text-xs)',
     color: 'var(--color-gray-500)',
 };
-const errorTextStyle$3 = {
+const errorTextStyle$4 = {
     label: 'Select-errorTextStyle',
     fontSize: 'var(--text-xs)',
     color: 'var(--color-red-500)',
@@ -3483,7 +3483,7 @@ const Select = forwardRef(({ options, optionGroups, size = 'md', label, placehol
     };
     return (jsxs("div", { className: wrapperClasses, children: [label && (jsx("label", { htmlFor: selectId, className: sx(labelStyle$e), children: label })), jsxs("div", { className: selectWrapperClasses, children: [leftIcon && jsx("span", { className: sx(leftIconStyle), children: leftIcon }), jsxs("select", { ref: ref, id: selectId, className: sx(selectStyle$2), disabled: disabled, "aria-invalid": !!error, "aria-describedby": [error ? errorId : null, helperText ? helperId : null]
                             .filter(Boolean)
-                            .join(' ') || undefined, ...props, children: [placeholder && (jsx("option", { value: "", disabled: true, children: placeholder })), renderOptions()] }), jsx("span", { className: sx(chevronStyle$5), children: jsx(ChevronDownIcon, {}) })] }), error && (jsx("span", { id: errorId, className: sx(errorTextStyle$3), children: error })), helperText && !error && (jsx("span", { id: helperId, className: sx(helperTextStyle$3), children: helperText }))] }));
+                            .join(' ') || undefined, ...props, children: [placeholder && (jsx("option", { value: "", disabled: true, children: placeholder })), renderOptions()] }), jsx("span", { className: sx(chevronStyle$5), children: jsx(ChevronDownIcon, {}) })] }), error && (jsx("span", { id: errorId, className: sx(errorTextStyle$4), children: error })), helperText && !error && (jsx("span", { id: helperId, className: sx(helperTextStyle$4), children: helperText }))] }));
 });
 Select.displayName = 'Select';
 
@@ -3525,14 +3525,14 @@ const sizeStyles$6 = {
     xl: { width: 40, height: 40 },
 };
 /** The theme's own helper — this was a verbatim copy of it. */
-const srOnlyStyle$4 = srOnly;
+const srOnlyStyle$5 = srOnly;
 
 /**
  * Indeterminate loading indicator for waits with no known duration.
  * Exposes its label to screen readers, so give it one that says what is loading.
  */
 const Spinner = ({ size = 'md', className = '', color, label = 'Loading...', }) => {
-    return (jsxs("span", { className: cx(sx(spinnerStyle$1), sx(sizeStyles$6[size]), className), role: "status", "aria-label": label, style: color ? { color } : undefined, children: [jsxs("svg", { className: sx(svgStyle), xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", children: [jsx("circle", { className: sx(trackStyle), cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }), jsx("path", { className: sx(indicatorStyle), fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" })] }), jsx("span", { className: sx(srOnlyStyle$4), children: label })] }));
+    return (jsxs("span", { className: cx(sx(spinnerStyle$1), sx(sizeStyles$6[size]), className), role: "status", "aria-label": label, style: color ? { color } : undefined, children: [jsxs("svg", { className: sx(svgStyle), xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", children: [jsx("circle", { className: sx(trackStyle), cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }), jsx("path", { className: sx(indicatorStyle), fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" })] }), jsx("span", { className: sx(srOnlyStyle$5), children: label })] }));
 };
 
 const statusVariantStyles = (theme) => ({
@@ -3856,12 +3856,12 @@ const sizeStyles$5 = {
         },
     },
 };
-const helperTextStyle$2 = {
+const helperTextStyle$3 = {
     label: 'Timepicker-helperTextStyle',
     fontSize: 'var(--text-xs)',
     color: 'var(--color-gray-500)',
 };
-const errorTextStyle$2 = {
+const errorTextStyle$3 = {
     label: 'Timepicker-errorTextStyle',
     fontSize: 'var(--text-xs)',
     color: 'var(--color-red-500)',
@@ -3880,7 +3880,7 @@ const Timepicker = forwardRef(({ size = 'md', label, helperText, error, fullWidt
     const inputWrapperClasses = cx(sx(inputWrapperStyle$2), sx(sizeStyles$5[size]), error ? sx(errorStyle$2) : '', disabled ? sx(disabledStyle$4) : '');
     return (jsxs("div", { className: wrapperClasses, children: [label && (jsx("label", { htmlFor: inputId, className: sx(labelStyle$d), children: label })), jsxs("div", { className: inputWrapperClasses, children: [jsx("span", { className: sx(iconStyle$d), children: jsx(ClockIcon$1, {}) }), jsx("input", { ref: ref, type: "time", id: inputId, className: sx(inputStyle$4), disabled: disabled, "aria-invalid": !!error, "aria-describedby": [error ? errorId : null, helperText ? helperId : null]
                             .filter(Boolean)
-                            .join(' ') || undefined, ...props })] }), error && (jsx("span", { id: errorId, className: sx(errorTextStyle$2), children: error })), helperText && !error && (jsx("span", { id: helperId, className: sx(helperTextStyle$2), children: helperText }))] }));
+                            .join(' ') || undefined, ...props })] }), error && (jsx("span", { id: errorId, className: sx(errorTextStyle$3), children: error })), helperText && !error && (jsx("span", { id: helperId, className: sx(helperTextStyle$3), children: helperText }))] }));
 });
 Timepicker.displayName = 'Timepicker';
 
@@ -4564,11 +4564,11 @@ const openStyle$3 = {
         transform: 'rotate(90deg)',
     },
 };
-const headerStyle$M = {
+const headerStyle$N = {
     label: 'Accordion-headerStyle',
     flex: 1,
 };
-const bodyStyle$d = {
+const bodyStyle$e = {
     label: 'Accordion-bodyStyle',
     position: 'relative',
     paddingLeft: 24,
@@ -4638,7 +4638,7 @@ const Accordion = ({ header, children, defaultOpen = true, open: controlledOpen,
         }
         onOpenChange?.(newOpen);
     };
-    return (jsxs("div", { className: cx(sx(accordionStyle), className), children: [jsxs("div", { className: sx(headerContainerStyle), children: [jsx("button", { type: "button", className: sx(toggleStyle$4), onClick: handleToggle, "aria-expanded": isOpen, children: jsx(CaretIcon, { className: cx(sx(caretStyle), isOpen && sx(openStyle$3)) }) }), jsx("div", { className: sx(headerStyle$M), children: header })] }), jsxs("div", { className: cx(sx(bodyStyle$d), isOpen ? sx(visibleStyle) : sx(hiddenStyle$2)), "aria-hidden": !isOpen, children: [showTimeline && (jsxs("div", { className: sx(timelineStyle$1), children: [jsx("div", { className: sx(lineStyle) }), jsx(CaretIcon, { className: sx(endCaretStyle) })] })), jsx("div", { className: sx(contentStyle$9), children: children })] })] }));
+    return (jsxs("div", { className: cx(sx(accordionStyle), className), children: [jsxs("div", { className: sx(headerContainerStyle), children: [jsx("button", { type: "button", className: sx(toggleStyle$4), onClick: handleToggle, "aria-expanded": isOpen, children: jsx(CaretIcon, { className: cx(sx(caretStyle), isOpen && sx(openStyle$3)) }) }), jsx("div", { className: sx(headerStyle$N), children: header })] }), jsxs("div", { className: cx(sx(bodyStyle$e), isOpen ? sx(visibleStyle) : sx(hiddenStyle$2)), "aria-hidden": !isOpen, children: [showTimeline && (jsxs("div", { className: sx(timelineStyle$1), children: [jsx("div", { className: sx(lineStyle) }), jsx(CaretIcon, { className: sx(endCaretStyle) })] })), jsx("div", { className: sx(contentStyle$9), children: children })] })] }));
 };
 Accordion.displayName = 'Accordion';
 
@@ -4773,7 +4773,7 @@ const contactStyle$1 = {
     display: 'flex',
     gap: 12,
 };
-const bodyStyle$c = {
+const bodyStyle$d = {
     label: 'ContactCard-bodyStyle',
     display: 'flex',
     flexDirection: 'column',
@@ -4820,7 +4820,7 @@ const linkTextStyle = {
 const ContactCard$1 = ({ name, title, phone, email, action, showAvatar = true, className = '', }) => {
     if (!action && !name)
         return null;
-    return (jsxs("div", { className: cx(sx(contactStyle$1), className), children: [name && showAvatar && jsx(Avatar, { name: name, size: 36 }), jsxs("div", { className: sx(bodyStyle$c), children: [jsxs("div", { className: sx(identityStyle$2), children: [action || jsx("span", { className: sx(nameStyle$6), children: name }), title && jsx("span", { className: sx(titleStyle$H), children: title })] }), phone && (jsxs("a", { href: `tel:${phone}`, className: sx(linkStyle$1), children: [jsx(PhoneIcon, { size: 16, "aria-hidden": "true" }), jsx("span", { className: sx(linkTextStyle), children: phone })] })), email && (jsxs("a", { href: `mailto:${email}`, className: sx(linkStyle$1), children: [jsx(MailIcon, { size: 16, "aria-hidden": "true" }), jsx("span", { className: sx(linkTextStyle), children: email })] }))] })] }));
+    return (jsxs("div", { className: cx(sx(contactStyle$1), className), children: [name && showAvatar && jsx(Avatar, { name: name, size: 36 }), jsxs("div", { className: sx(bodyStyle$d), children: [jsxs("div", { className: sx(identityStyle$2), children: [action || jsx("span", { className: sx(nameStyle$6), children: name }), title && jsx("span", { className: sx(titleStyle$H), children: title })] }), phone && (jsxs("a", { href: `tel:${phone}`, className: sx(linkStyle$1), children: [jsx(PhoneIcon, { size: 16, "aria-hidden": "true" }), jsx("span", { className: sx(linkTextStyle), children: phone })] })), email && (jsxs("a", { href: `mailto:${email}`, className: sx(linkStyle$1), children: [jsx(MailIcon, { size: 16, "aria-hidden": "true" }), jsx("span", { className: sx(linkTextStyle), children: email })] }))] })] }));
 };
 ContactCard$1.displayName = 'ContactCard';
 
@@ -5148,7 +5148,7 @@ const titleStyle$G = {
     fontWeight: 'var(--fw-semibold)',
     lineHeight: 'var(--lh-base)',
 };
-const descriptionStyle$a = {
+const descriptionStyle$b = {
     label: 'EmptyState-descriptionStyle',
     maxWidth: '46ch',
     margin: 0,
@@ -5156,7 +5156,7 @@ const descriptionStyle$a = {
     fontSize: 'var(--fs-sm)',
     lineHeight: 'var(--lh-sm)',
 };
-const actionsStyle$c = {
+const actionsStyle$d = {
     label: 'EmptyState-actionsStyle',
     display: 'flex',
     flexWrap: 'wrap',
@@ -5166,7 +5166,7 @@ const actionsStyle$c = {
 };
 
 /** Placeholder shown when a list, table, or panel has nothing to display. */
-const EmptyState$1 = ({ title, description, icon, actionLabel, onAction, secondaryActionLabel, onSecondaryAction, size = 'md', children, className = '', }) => (jsxs("div", { className: cx(sx(emptyStateStyle$1), sx(sizeStyles$4[size]), className), "data-test": "empty-state", children: [icon && jsx("div", { className: sx(iconStyle$b), "aria-hidden": "true", children: icon }), jsx("p", { className: sx(titleStyle$G), children: title }), description && jsx("p", { className: sx(descriptionStyle$a), children: description }), (actionLabel || secondaryActionLabel) && (jsxs("div", { className: sx(actionsStyle$c), children: [actionLabel && (jsx(Button, { size: "sm", onClick: onAction, "data-test": "empty-state-action", children: actionLabel })), secondaryActionLabel && (jsx(Button, { size: "sm", variant: "secondary", onClick: onSecondaryAction, "data-test": "empty-state-secondary-action", children: secondaryActionLabel }))] })), children] }));
+const EmptyState$1 = ({ title, description, icon, actionLabel, onAction, secondaryActionLabel, onSecondaryAction, size = 'md', children, className = '', }) => (jsxs("div", { className: cx(sx(emptyStateStyle$1), sx(sizeStyles$4[size]), className), "data-test": "empty-state", children: [icon && jsx("div", { className: sx(iconStyle$b), "aria-hidden": "true", children: icon }), jsx("p", { className: sx(titleStyle$G), children: title }), description && jsx("p", { className: sx(descriptionStyle$b), children: description }), (actionLabel || secondaryActionLabel) && (jsxs("div", { className: sx(actionsStyle$d), children: [actionLabel && (jsx(Button, { size: "sm", onClick: onAction, "data-test": "empty-state-action", children: actionLabel })), secondaryActionLabel && (jsx(Button, { size: "sm", variant: "secondary", onClick: onSecondaryAction, "data-test": "empty-state-secondary-action", children: secondaryActionLabel }))] })), children] }));
 
 /** FieldLayout's compiled rules. */
 const fieldStyle$4 = {
@@ -5250,7 +5250,7 @@ const errorStyle$1 = {
     label: 'FieldLayout-errorStyle',
     color: 'var(--color-error, #940000)',
 };
-const noteStyle$2 = {
+const noteStyle$3 = {
     label: 'FieldLayout-noteStyle',
     color: 'var(--color-stone, #787878)',
 };
@@ -5292,7 +5292,7 @@ const FieldLayout = ({ children, label, labelPosition = 'top', showLabel = true,
     const hasError = Boolean(error);
     const describedBy = [hint ? hintId : '', hasError ? errorId : ''].filter(Boolean).join(' ') || undefined;
     const hintElement = hint ? (jsx("p", { id: hintId, className: cx(sx(messageStyle$2), sx(hintStyle$1), labelPosition === 'top' ? '' : sx(hintBesideStyle(Boolean(label && showLabel)))), children: hint })) : null;
-    return (jsxs("div", { className: cx(sx(fieldStyle$4), sx(labelPositionStyles[labelPosition]), className), children: [label && showLabel && (jsxs("label", { htmlFor: id, className: cx(sx(labelStyle$b), hasError ? sx(labelErrorStyle) : ''), children: [label, required && !disabled && (jsx("span", { className: sx(requiredStyle$2), "aria-hidden": "true", children: "*" })), tooltip && (jsx(Tooltip, { className: sx(tooltipStyle$1), content: tooltip, children: jsx(InfoIcon$1, { size: 16 }) }))] })), labelPosition === 'top' && hintElement, jsxs("div", { className: sx(controlStyle$2), children: [leftIcon && !disabled && (jsx("span", { className: cx(sx(iconStyle$a), sx(iconLeftStyle)), "aria-hidden": "true", children: leftIcon })), children({ id, describedBy, hasError }), rightIcon && !disabled && (jsx("span", { className: cx(sx(iconStyle$a), sx(iconRightStyle)), "aria-hidden": "true", children: rightIcon }))] }), hasError && (jsx("p", { id: errorId, className: cx(sx(messageStyle$2), sx(errorStyle$1)), children: error })), note && jsx("p", { className: cx(sx(messageStyle$2), sx(noteStyle$2)), children: note }), labelPosition !== 'top' && hintElement] }));
+    return (jsxs("div", { className: cx(sx(fieldStyle$4), sx(labelPositionStyles[labelPosition]), className), children: [label && showLabel && (jsxs("label", { htmlFor: id, className: cx(sx(labelStyle$b), hasError ? sx(labelErrorStyle) : ''), children: [label, required && !disabled && (jsx("span", { className: sx(requiredStyle$2), "aria-hidden": "true", children: "*" })), tooltip && (jsx(Tooltip, { className: sx(tooltipStyle$1), content: tooltip, children: jsx(InfoIcon$1, { size: 16 }) }))] })), labelPosition === 'top' && hintElement, jsxs("div", { className: sx(controlStyle$2), children: [leftIcon && !disabled && (jsx("span", { className: cx(sx(iconStyle$a), sx(iconLeftStyle)), "aria-hidden": "true", children: leftIcon })), children({ id, describedBy, hasError }), rightIcon && !disabled && (jsx("span", { className: cx(sx(iconStyle$a), sx(iconRightStyle)), "aria-hidden": "true", children: rightIcon }))] }), hasError && (jsx("p", { id: errorId, className: cx(sx(messageStyle$2), sx(errorStyle$1)), children: error })), note && jsx("p", { className: cx(sx(messageStyle$2), sx(noteStyle$3)), children: note }), labelPosition !== 'top' && hintElement] }));
 };
 FieldLayout.displayName = 'FieldLayout';
 
@@ -5644,14 +5644,14 @@ const inputErrorStyle = {
         boxShadow: '0 0 0 3px rgba(220, 38, 38, 0.1) !important',
     },
 };
-const helperTextStyle$1 = {
+const helperTextStyle$2 = {
     label: 'FormField-helperTextStyle',
     fontSize: 'var(--font-size-xs)',
     color: 'var(--color-neutral-500)',
     margin: 0,
     lineHeight: 'var(--line-height-normal)',
 };
-const errorTextStyle$1 = {
+const errorTextStyle$2 = {
     label: 'FormField-errorTextStyle',
     fontSize: 'var(--font-size-xs)',
     color: 'var(--color-status-error)',
@@ -5709,12 +5709,12 @@ const FormField = forwardRef(({ label, helperText, error, required = false, hide
         }
         return (jsx(Input, { ref: ref, id: inputId, "aria-describedby": describedBy, "aria-invalid": hasError, "aria-required": required, ...inputProps, className: cx(sx(inputElementStyle), hasError && sx(inputErrorStyle), inputProps?.className) }));
     };
-    return (jsxs("div", { className: cx(sx(formFieldStyle), className), children: [jsxs("label", { htmlFor: inputId, className: cx(sx(labelStyle$9), hideLabel && sx(visuallyHiddenStyle$2)), children: [label, required && jsx("span", { className: sx(requiredStyle$1), "aria-hidden": "true", children: "*" })] }), renderInput(), helperText && !hasError && (jsx("p", { id: helperId, className: sx(helperTextStyle$1), children: helperText })), hasError && (jsx("p", { id: errorId, className: sx(errorTextStyle$1), role: "alert", children: error }))] }));
+    return (jsxs("div", { className: cx(sx(formFieldStyle), className), children: [jsxs("label", { htmlFor: inputId, className: cx(sx(labelStyle$9), hideLabel && sx(visuallyHiddenStyle$2)), children: [label, required && jsx("span", { className: sx(requiredStyle$1), "aria-hidden": "true", children: "*" })] }), renderInput(), helperText && !hasError && (jsx("p", { id: helperId, className: sx(helperTextStyle$2), children: helperText })), hasError && (jsx("p", { id: errorId, className: sx(errorTextStyle$2), role: "alert", children: error }))] }));
 });
 FormField.displayName = 'FormField';
 
 /** FormRow's compiled rules. */
-const rowStyle$8 = {
+const rowStyle$9 = {
     label: 'FormRow-rowStyle',
     display: 'grid',
     width: '100%',
@@ -5763,7 +5763,7 @@ const FormRow = ({ children, columns, gap = 'md', className, stackOnMobile = tru
     // With no children at all `colCount` is 0, which the module stylesheet met
     // with a missing `.cols0` — no column rule. The cast keeps that shape honest.
     const columnStyle = colsStyles[colCount];
-    return (jsx("div", { className: cx(sx(rowStyle$8), columnStyle ? sx(columnStyle) : '', sx(gapStyles$1[gap]), stackOnMobile ? sx(stackMobileStyle) : '', className || ''), children: children }));
+    return (jsx("div", { className: cx(sx(rowStyle$9), columnStyle ? sx(columnStyle) : '', sx(gapStyles$1[gap]), stackOnMobile ? sx(stackMobileStyle) : '', className || ''), children: children }));
 };
 FormRow.displayName = 'FormRow';
 
@@ -5785,14 +5785,14 @@ const sectionStyle$a = {
  * Declared before `headerStyle` so its content-hashed class name can be
  * resolved for the `:has()` below.
  */
-const descriptionStyle$9 = {
+const descriptionStyle$a = {
     label: 'FormSection-descriptionStyle',
     margin: '4px 0 0',
     color: 'var(--fg-3, #5C5C5C)',
     fontSize: 14,
     lineHeight: 1.5,
 };
-const headerStyle$L = {
+const headerStyle$M = {
     label: 'FormSection-headerStyle',
     display: 'flex',
     alignItems: 'center',
@@ -5802,7 +5802,7 @@ const headerStyle$L = {
        rather than to the middle of the block. `:has()` is scored by its argument,
        so this is (0,2,0) against the base rule's (0,1,0) — the same margin the
        stylesheet had. */
-    [`&:has(.${sx(descriptionStyle$9)})`]: {
+    [`&:has(.${sx(descriptionStyle$a)})`]: {
         alignItems: 'flex-start',
     },
 };
@@ -5833,7 +5833,7 @@ const titleStyle$F = {
         fontSize: 20,
     },
 };
-const fieldsetStyle = {
+const fieldsetStyle$2 = {
     label: 'FormSection-fieldsetStyle',
     display: 'flex',
     flexDirection: 'column',
@@ -5890,12 +5890,12 @@ const statusStyles = {
 const FormSection = ({ title, icon, description, action, status, disabled = false, children, className, id, dataTest, }) => {
     const isSubmitted = status === 'submitted';
     const isDisabled = disabled || isSubmitted;
-    return (jsxs("div", { className: cx(sx(sectionStyle$a), className), id: id, "data-test": dataTest, children: [jsxs("div", { className: sx(headerStyle$L), children: [icon && jsx("span", { className: sx(iconStyle$9), children: icon }), jsxs("div", { className: sx(headingStyle$5), children: [jsx("h2", { className: sx(titleStyle$F), children: title }), description && jsx("p", { className: sx(descriptionStyle$9), children: description })] }), action && jsx("div", { className: sx(actionStyle$1), children: action })] }), jsxs("fieldset", { disabled: isDisabled, className: cx(sx(fieldsetStyle), isDisabled && sx(disabledStyle$3)), children: [status && (jsxs("div", { className: sx(statusStyle$6), children: [jsx("span", { className: sx(statusLabelStyle), children: "Status:" }), jsx("span", { className: cx(sx(statusValueStyle), sx(statusStyles[status])), children: status === 'submitted' ? 'Submitted' : status === 'draft' ? 'Draft' : 'Not Submitted' })] })), children] })] }));
+    return (jsxs("div", { className: cx(sx(sectionStyle$a), className), id: id, "data-test": dataTest, children: [jsxs("div", { className: sx(headerStyle$M), children: [icon && jsx("span", { className: sx(iconStyle$9), children: icon }), jsxs("div", { className: sx(headingStyle$5), children: [jsx("h2", { className: sx(titleStyle$F), children: title }), description && jsx("p", { className: sx(descriptionStyle$a), children: description })] }), action && jsx("div", { className: sx(actionStyle$1), children: action })] }), jsxs("fieldset", { disabled: isDisabled, className: cx(sx(fieldsetStyle$2), isDisabled && sx(disabledStyle$3)), children: [status && (jsxs("div", { className: sx(statusStyle$6), children: [jsx("span", { className: sx(statusLabelStyle), children: "Status:" }), jsx("span", { className: cx(sx(statusValueStyle), sx(statusStyles[status])), children: status === 'submitted' ? 'Submitted' : status === 'draft' ? 'Draft' : 'Not Submitted' })] })), children] })] }));
 };
 FormSection.displayName = 'FormSection';
 
 /** Vertical grid the form fields sit in. */
-const stackStyle$5 = {
+const stackStyle$6 = {
     label: 'FormStack-stackStyle',
     display: 'grid',
 };
@@ -5907,7 +5907,7 @@ const gapStyles = {
 };
 
 /** Standard vertical form-field rhythm used by Hub modal forms. */
-const FormStack = ({ children, gap = 'md', className = '' }) => (jsx("div", { className: cx(sx(stackStyle$5), sx(gapStyles[gap]), className), children: children }));
+const FormStack = ({ children, gap = 'md', className = '' }) => (jsx("div", { className: cx(sx(stackStyle$6), sx(gapStyles[gap]), className), children: children }));
 
 /* IconRevealLink's rules — an icon that, on hover or keyboard focus, slides
    its text label out beside it. The label is collapsed (zero width, clear,
@@ -6639,7 +6639,7 @@ const hintStyle = {
     color: 'var(--fg-3)',
     boxShadow: 'var(--shadow-md, 0 4px 6px -1px rgba(0, 0, 0, 0.1))',
 };
-const helperTextStyle = {
+const helperTextStyle$1 = {
     label: 'MultiUserSearch-helperTextStyle',
     fontSize: 'var(--fs-xs)',
     color: 'var(--fg-3)',
@@ -6649,7 +6649,7 @@ const helperTextStyle = {
  * Doubled: `.errorText` and `.helperText` were both (0,1,0) and both set
  * `color`, so the error colour won only by sitting later in the file.
  */
-const errorTextStyle = {
+const errorTextStyle$1 = {
     label: 'MultiUserSearch-errorTextStyle',
     '&&': {
         color: 'var(--color-error)',
@@ -6785,7 +6785,7 @@ const MultiUserSearch = ({ label = 'Search users', placeholder = 'Type to search
     return (jsxs("div", { ref: containerRef, className: cx(sx(containerStyle$4), disabled && sx(disabledStyle$2), className), "data-test": dataTest, children: [label && (jsx("label", { className: sx(labelStyle$8), htmlFor: `${dataTest}-input`, children: label })), selectedUsers.length > 0 && (jsx("div", { className: sx(selectedUsersStyle), "data-test": `${dataTest}-selected`, children: selectedUsers.map((user) => (jsx(Badge, { variant: "info", size: "sm", className: sx(selectedBadgeStyle), "data-test": `${dataTest}-selected-${user.id}`, children: jsxs("span", { className: sx(badgeContentStyle), children: [user.name, jsx("button", { type: "button", className: sx(removeButtonStyle$1), onClick: () => removeSelection(user.id), "aria-label": `Remove ${user.name}`, disabled: disabled, children: jsx(CloseIcon, { size: 12 }) })] }) }, user.id))) })), jsxs("div", { className: sx(inputWrapperStyle$1), children: [jsx(Input, { ref: inputRef, id: `${dataTest}-input`, type: "search", placeholder: placeholder, value: query, onChange: handleInputChange, onFocus: handleInputFocus, onKeyDown: handleKeyDown, disabled: disabled, leftIcon: jsx(SearchIcon$1, { size: 16 }), rightIcon: loading ? jsx(Spinner, { size: "xs", label: "Searching" }) : undefined, "aria-expanded": isOpen, "aria-controls": `${dataTest}-listbox`, "aria-autocomplete": "list", "aria-activedescendant": highlightedIndex >= 0
                             ? `${dataTest}-option-${availableOptions[highlightedIndex]?.id}`
                             : undefined, role: "combobox", fullWidth: true, "data-test": `${dataTest}-input` }), showDropdown && (jsxs("ul", { ref: listRef, id: `${dataTest}-listbox`, className: sx(listboxStyle), role: "listbox", "aria-label": "Search results", "data-test": `${dataTest}-listbox`, children: [loading && (jsxs("li", { className: sx(loadingItemStyle), role: "status", children: [jsx(Spinner, { size: "sm", label: "Searching users" }), jsx("span", { children: "Searching users\u2026" })] })), !loading &&
-                                availableOptions.map((option, index) => (jsxs("li", { id: `${dataTest}-option-${option.id}`, role: "option", "aria-selected": highlightedIndex === index, "aria-disabled": option.disabled, className: cx(sx(optionStyle$2), highlightedIndex === index && sx(highlightedStyle), option.disabled && sx(optionDisabledStyle)), onClick: () => selectOption(option), title: option.disabledReason, "data-test": `${dataTest}-option-${option.id}`, children: [jsx("span", { className: sx(optionAvatarStyle$1), "aria-hidden": "true", children: jsx(UserIcon, { size: 16 }) }), jsxs("span", { className: sx(optionContentStyle), children: [jsx("span", { className: sx(optionNameStyle), children: option.name }), jsx("span", { className: sx(optionEmailStyle), children: option.email }), option.title && (jsx("span", { className: sx(optionTitleStyle), children: option.title }))] })] }, option.id))), showNoResults && (jsxs("li", { className: sx(noResultsStyle$1), role: "status", children: ["No users found matching \"", trimmedQuery, "\""] }))] })), showMinLengthHint && (jsxs("div", { className: sx(hintStyle), role: "status", children: ["Enter at least ", minSearchLength, " characters to search"] }))] }), (helperText || error) && (jsx("p", { className: cx(sx(helperTextStyle), error && sx(errorTextStyle)), role: error ? 'alert' : undefined, children: error || helperText }))] }));
+                                availableOptions.map((option, index) => (jsxs("li", { id: `${dataTest}-option-${option.id}`, role: "option", "aria-selected": highlightedIndex === index, "aria-disabled": option.disabled, className: cx(sx(optionStyle$2), highlightedIndex === index && sx(highlightedStyle), option.disabled && sx(optionDisabledStyle)), onClick: () => selectOption(option), title: option.disabledReason, "data-test": `${dataTest}-option-${option.id}`, children: [jsx("span", { className: sx(optionAvatarStyle$1), "aria-hidden": "true", children: jsx(UserIcon, { size: 16 }) }), jsxs("span", { className: sx(optionContentStyle), children: [jsx("span", { className: sx(optionNameStyle), children: option.name }), jsx("span", { className: sx(optionEmailStyle), children: option.email }), option.title && (jsx("span", { className: sx(optionTitleStyle), children: option.title }))] })] }, option.id))), showNoResults && (jsxs("li", { className: sx(noResultsStyle$1), role: "status", children: ["No users found matching \"", trimmedQuery, "\""] }))] })), showMinLengthHint && (jsxs("div", { className: sx(hintStyle), role: "status", children: ["Enter at least ", minSearchLength, " characters to search"] }))] }), (helperText || error) && (jsx("p", { className: cx(sx(helperTextStyle$1), error && sx(errorTextStyle$1)), role: error ? 'alert' : undefined, children: error || helperText }))] }));
 };
 MultiUserSearch.displayName = 'MultiUserSearch';
 
@@ -7026,7 +7026,7 @@ const NavItem = ({ icon, label, active = false, collapsed = false, variant = 'de
  * The header reserves its space even with nothing to show, fading in once a
  * title arrives, so the page below does not jump as data loads.
  */
-const headerStyle$K = {
+const headerStyle$L = {
     label: 'PageHeader-headerStyle',
     display: 'flex',
     alignItems: 'flex-start',
@@ -7042,7 +7042,7 @@ const emptyStyle$n = {
     opacity: 0,
     pointerEvents: 'none',
 };
-const bodyStyle$b = {
+const bodyStyle$c = {
     label: 'PageHeader-bodyStyle',
     display: 'flex',
     justifyContent: 'space-between',
@@ -7084,7 +7084,7 @@ const titleStyle$E = {
  * The header keeps its height while `title` is empty and fades in once one
  * arrives, so pages do not jump as their data loads.
  */
-const PageHeader = ({ title, pretitle, after, back, className = '', }) => (jsxs("div", { className: cx(sx(headerStyle$K), !title && sx(emptyStyle$n), className), children: [back, jsx("div", { className: sx(bodyStyle$b), children: jsxs("div", { className: sx(textStyle), children: [pretitle && jsx("h2", { className: sx(pretitleStyle$1), children: pretitle }), jsxs("h1", { className: sx(titleStyle$E), children: [title, "\u00A0"] }), after] }) })] }));
+const PageHeader = ({ title, pretitle, after, back, className = '', }) => (jsxs("div", { className: cx(sx(headerStyle$L), !title && sx(emptyStyle$n), className), children: [back, jsx("div", { className: sx(bodyStyle$c), children: jsxs("div", { className: sx(textStyle), children: [pretitle && jsx("h2", { className: sx(pretitleStyle$1), children: pretitle }), jsxs("h1", { className: sx(titleStyle$E), children: [title, "\u00A0"] }), after] }) })] }));
 PageHeader.displayName = 'PageHeader';
 
 /**
@@ -7093,7 +7093,7 @@ PageHeader.displayName = 'PageHeader';
  * The back arrow leads the section line, so the arrow and the page name both
  * start on the page's left edge and the header lines up with the content below.
  */
-const headerStyle$J = {
+const headerStyle$K = {
     label: 'PageHeaderSubsection-headerStyle',
     display: 'grid',
     gridTemplateColumns: 'minmax(0, 1fr) auto',
@@ -7151,13 +7151,13 @@ const titleStyle$D = {
     fontWeight: 400,
     lineHeight: '44px',
 };
-const metaStyle$1 = {
+const metaStyle$2 = {
     label: 'PageHeaderSubsection-metaStyle',
     gridArea: 'meta',
     minWidth: 0,
     marginTop: 4,
 };
-const actionsStyle$b = {
+const actionsStyle$c = {
     label: 'PageHeaderSubsection-actionsStyle',
     gridArea: 'actions',
     display: 'flex',
@@ -7177,7 +7177,7 @@ const PageHeaderSubsection = ({ sectionName, pageName, meta, onBack, backLabel =
         else
             window.history.back();
     };
-    return (jsxs("div", { className: cx(sx(headerStyle$J), className), "data-test": "page-header-subsection", children: [jsxs("div", { className: sx(sectionRowStyle), children: [!hideBack && (jsx("button", { type: "button", className: sx(backButtonStyle$1), onClick: handleBack, "aria-label": backLabel, "data-test": "page-header-subsection-back", children: jsx(BackIcon$1, {}) })), jsx("p", { className: sx(sectionStyle$9), children: sectionName })] }), jsx("h1", { className: sx(titleStyle$D), children: pageName }), meta && jsx("div", { className: sx(metaStyle$1), children: meta }), actions && jsx("div", { className: sx(actionsStyle$b), children: actions })] }));
+    return (jsxs("div", { className: cx(sx(headerStyle$K), className), "data-test": "page-header-subsection", children: [jsxs("div", { className: sx(sectionRowStyle), children: [!hideBack && (jsx("button", { type: "button", className: sx(backButtonStyle$1), onClick: handleBack, "aria-label": backLabel, "data-test": "page-header-subsection-back", children: jsx(BackIcon$1, {}) })), jsx("p", { className: sx(sectionStyle$9), children: sectionName })] }), jsx("h1", { className: sx(titleStyle$D), children: pageName }), meta && jsx("div", { className: sx(metaStyle$2), children: meta }), actions && jsx("div", { className: sx(actionsStyle$c), children: actions })] }));
 };
 PageHeaderSubsection.displayName = 'PageHeaderSubsection';
 
@@ -7189,7 +7189,7 @@ const toneColors = {
     success: { panel: 'var(--color-alert-success-bg)', accent: 'var(--color-success-accent)' },
     error: { panel: 'var(--color-alert-error-bg)', accent: 'var(--color-danger-accent)' },
 };
-const rootStyle$2 = {
+const rootStyle$3 = {
     label: 'PanelTabs-rootStyle',
     display: 'flex',
     flexDirection: 'column',
@@ -7305,7 +7305,7 @@ const PanelTabs = ({ options, value, onChange, 'aria-label': ariaLabel, children
             choose(event.key === 'Home' ? 0 : options.length - 1);
         }
     };
-    return (jsxs("div", { className: cx(sx(rootStyle$2), className), children: [jsx("div", { className: cx(sx(tabListStyle), sx(shortenStyle(shortenBelow))), role: "radiogroup", "aria-label": ariaLabel, children: options.map((option, index) => {
+    return (jsxs("div", { className: cx(sx(rootStyle$3), className), children: [jsx("div", { className: cx(sx(tabListStyle), sx(shortenStyle(shortenBelow))), role: "radiogroup", "aria-label": ariaLabel, children: options.map((option, index) => {
                     const selected = index === chosen;
                     return (jsxs("button", { ref: (element) => {
                             tabs.current[index] = element;
@@ -7408,7 +7408,7 @@ const focusRing = {
  * current page is matched on `[aria-current="page"]` instead — the component
  * sets that attribute from the same expression that sets `currentStyle`.
  */
-const pageStyle$u = {
+const pageStyle$v = {
     label: 'Pagination-pageStyle',
     ...buttonBase,
     '&:hover:not([aria-current="page"])': {
@@ -7491,7 +7491,7 @@ const Pagination = ({ page, pageSize, totalItems, siblingCount = 1, pageSizeOpti
             return;
         onPageChange?.(next);
     };
-    return (jsxs("nav", { className: cx(sx(paginationStyle$3), className), "aria-label": ariaLabel, "data-test": "pagination", children: [!hideSummary && (jsxs("p", { className: sx(summaryStyle$6), "data-test": "pagination-summary", children: ["Showing ", firstItem, "\u2013", lastItem, " of ", totalItems, " ", itemLabel] })), jsxs("div", { className: sx(controlsStyle), children: [showSizeSelector && (jsxs("label", { className: sx(pageSizeStyle), children: [jsx("span", { children: "Rows per page" }), jsx("select", { value: pageSize, onChange: (event) => onPageSizeChange?.(Number(event.target.value)), "data-test": "pagination-page-size", children: pageSizeOptions.map((option) => (jsx("option", { value: option, children: option }, option))) })] })), jsxs("ul", { className: sx(pagesStyle), children: [jsx("li", { children: jsx("button", { type: "button", className: sx(stepStyle), onClick: () => goTo(currentPage - 1), disabled: currentPage <= 1, "aria-label": "Previous page", "data-test": "pagination-previous", children: jsx(ChevronLeftIcon, { size: 16 }) }) }), items.map((item, index) => item === 'ellipsis' ? (jsx("li", { className: sx(ellipsisStyle), "aria-hidden": "true", children: "\u2026" }, `ellipsis-${index}`)) : (jsx("li", { children: jsx("button", { type: "button", className: cx(sx(pageStyle$u), item === currentPage && sx(currentStyle)), onClick: () => goTo(item), "aria-label": `Page ${item}`, "aria-current": item === currentPage ? 'page' : undefined, "data-test": `pagination-page-${item}`, children: item }) }, item))), jsx("li", { children: jsx("button", { type: "button", className: sx(stepStyle), onClick: () => goTo(currentPage + 1), disabled: currentPage >= pageCount, "aria-label": "Next page", "data-test": "pagination-next", children: jsx(ChevronRightIcon$1, { size: 16 }) }) })] })] })] }));
+    return (jsxs("nav", { className: cx(sx(paginationStyle$3), className), "aria-label": ariaLabel, "data-test": "pagination", children: [!hideSummary && (jsxs("p", { className: sx(summaryStyle$6), "data-test": "pagination-summary", children: ["Showing ", firstItem, "\u2013", lastItem, " of ", totalItems, " ", itemLabel] })), jsxs("div", { className: sx(controlsStyle), children: [showSizeSelector && (jsxs("label", { className: sx(pageSizeStyle), children: [jsx("span", { children: "Rows per page" }), jsx("select", { value: pageSize, onChange: (event) => onPageSizeChange?.(Number(event.target.value)), "data-test": "pagination-page-size", children: pageSizeOptions.map((option) => (jsx("option", { value: option, children: option }, option))) })] })), jsxs("ul", { className: sx(pagesStyle), children: [jsx("li", { children: jsx("button", { type: "button", className: sx(stepStyle), onClick: () => goTo(currentPage - 1), disabled: currentPage <= 1, "aria-label": "Previous page", "data-test": "pagination-previous", children: jsx(ChevronLeftIcon, { size: 16 }) }) }), items.map((item, index) => item === 'ellipsis' ? (jsx("li", { className: sx(ellipsisStyle), "aria-hidden": "true", children: "\u2026" }, `ellipsis-${index}`)) : (jsx("li", { children: jsx("button", { type: "button", className: cx(sx(pageStyle$v), item === currentPage && sx(currentStyle)), onClick: () => goTo(item), "aria-label": `Page ${item}`, "aria-current": item === currentPage ? 'page' : undefined, "data-test": `pagination-page-${item}`, children: item }) }, item))), jsx("li", { children: jsx("button", { type: "button", className: sx(stepStyle), onClick: () => goTo(currentPage + 1), disabled: currentPage >= pageCount, "aria-label": "Next page", "data-test": "pagination-next", children: jsx(ChevronRightIcon$1, { size: 16 }) }) })] })] })] }));
 };
 
 /* Progress Bar */
@@ -7958,7 +7958,7 @@ const SearchField = forwardRef(({ placeholder = 'Search...', value, defaultValue
 SearchField.displayName = 'SearchField';
 
 /** The form's own vertical rhythm. */
-const formStyle$5 = {
+const formStyle$6 = {
     label: 'SchoolContactForm-formStyle',
     display: 'grid',
     gap: 16,
@@ -8017,7 +8017,7 @@ const phoneFieldsStyle = {
  * Layout for Hub's school-contact editor. Field controls stay injectable so
  * consuming applications retain their form state, validation, and masking.
  */
-const SchoolContactForm = ({ mode, createFromPortalUser, firstNameField, middleInitialField, lastNameField, businessPhoneField, cellPhoneField, emailField, className = '', }) => (jsxs("div", { className: cx(sx(formStyle$5), className), children: [mode === 'Add' && (jsxs(Fragment, { children: [jsxs("div", { children: [jsx("label", { className: sx(portalLabelStyle), children: "Create From Portal User" }), createFromPortalUser] }), jsx("div", { className: sx(dividerStyle$2), children: jsx("strong", { children: "OR" }) }), jsx("p", { className: sx(newContactLabelStyle), children: "Create New Contact Without Portal Access" })] })), jsxs("div", { className: sx(nameFieldsStyle), children: [firstNameField, middleInitialField, lastNameField] }), jsxs("div", { className: sx(phoneFieldsStyle), children: [businessPhoneField, cellPhoneField] }), jsx("div", { children: emailField })] }));
+const SchoolContactForm = ({ mode, createFromPortalUser, firstNameField, middleInitialField, lastNameField, businessPhoneField, cellPhoneField, emailField, className = '', }) => (jsxs("div", { className: cx(sx(formStyle$6), className), children: [mode === 'Add' && (jsxs(Fragment, { children: [jsxs("div", { children: [jsx("label", { className: sx(portalLabelStyle), children: "Create From Portal User" }), createFromPortalUser] }), jsx("div", { className: sx(dividerStyle$2), children: jsx("strong", { children: "OR" }) }), jsx("p", { className: sx(newContactLabelStyle), children: "Create New Contact Without Portal Access" })] })), jsxs("div", { className: sx(nameFieldsStyle), children: [firstNameField, middleInitialField, lastNameField] }), jsxs("div", { className: sx(phoneFieldsStyle), children: [businessPhoneField, cellPhoneField] }), jsx("div", { children: emailField })] }));
 
 const segmentStyle$2 = {
     label: 'Segment-segmentStyle',
@@ -8151,7 +8151,7 @@ SportCodeBadge.displayName = 'SportCodeBadge';
  * the job this component exists for (tabbed dropdowns jumped as each tab's
  * longest option changed).
  */
-const stackStyle$4 = {
+const stackStyle$5 = {
     label: 'TabPanelStack-stackStyle',
     display: 'grid',
 };
@@ -8180,7 +8180,7 @@ const hiddenPanelStyle = {
  * focus order and the accessibility tree (`aria-hidden` says so explicitly),
  * so only the visible one can be read or tabbed to.
  */
-const TabPanelStack = ({ panels, activeId, idPrefix, className = '' }) => (jsx("div", { className: [sx(stackStyle$4), className].filter(Boolean).join(' '), children: panels.map(({ id, content, labelledBy }) => {
+const TabPanelStack = ({ panels, activeId, idPrefix, className = '' }) => (jsx("div", { className: [sx(stackStyle$5), className].filter(Boolean).join(' '), children: panels.map(({ id, content, labelledBy }) => {
         const active = id === activeId;
         return (jsx("div", { id: idPrefix ? `${idPrefix}-${id}` : undefined, role: "tabpanel", "aria-labelledby": labelledBy, "aria-hidden": active ? undefined : true, className: [sx(panelStyle$9), !active && sx(hiddenPanelStyle)].filter(Boolean).join(' '), children: content }, id));
     }) }));
@@ -8400,7 +8400,7 @@ TabStrip.displayName = 'TabStrip';
  * inherit the title's display font and size. `&&` (0,2,0) so a host's descendant
  * rule (e.g. `.title span`, 0,1,1) can't restyle it either.
  */
-const rootStyle$1 = {
+const rootStyle$2 = {
     label: 'TeamPicker-rootStyle',
     '&&': {
         fontFamily: 'var(--font-family-base, Inter, system-ui, sans-serif)',
@@ -8520,7 +8520,7 @@ const TeamPicker = ({ groups, groupOrder, activeGroup, onGroupChange, mode = 'si
                         onOnly(value);
                     }, children: "Only" }))] }, value));
     };
-    return (jsxs("div", { className: sx(rootStyle$1), children: [jsx("div", { className: sx(tabRowStyle), children: jsx(TabStrip, { idPrefix: uid, accent: "teal", "aria-label": ariaLabel, activeTab: current, onTabChange: changeGroup, tabs: ids.map((id) => {
+    return (jsxs("div", { className: sx(rootStyle$2), children: [jsx("div", { className: sx(tabRowStyle), children: jsx(TabStrip, { idPrefix: uid, accent: "teal", "aria-label": ariaLabel, activeTab: current, onTabChange: changeGroup, tabs: ids.map((id) => {
                         const values = (groups[id] ?? []).map(teamValue);
                         const count = values.filter((value) => selected.includes(value)).length;
                         const all = values.length > 0 && count === values.length;
@@ -8548,7 +8548,7 @@ TeamPicker.displayName = 'TeamPicker';
  */
 /** Shrink-wrapped, as before: inline content stays beside it, and the icon
  * trigger's right-aligned panel hangs from the icon, not the container. */
-const rootStyle = {
+const rootStyle$1 = {
     label: 'SelectFilter-rootStyle',
     position: 'relative',
     display: 'inline-block',
@@ -8758,7 +8758,7 @@ const choicesStyle = {
     overflowY: 'auto',
 };
 /** Extra content above the title, ruled off from the choices. */
-const headerStyle$I = {
+const headerStyle$J = {
     label: 'SelectFilter-headerStyle',
     padding: '6px 12px 10px',
     marginBottom: 'var(--space-1)',
@@ -8873,7 +8873,7 @@ const optionBodyStyle = {
 };
 const optionLabelStyle = { label: 'SelectFilter-optionLabelStyle', flex: 1 };
 /** Text for assistive technology only (a trigger's state the eye reads from colour). */
-const srOnlyStyle$3 = { label: 'SelectFilter-srOnlyStyle', ...srOnly };
+const srOnlyStyle$4 = { label: 'SelectFilter-srOnlyStyle', ...srOnly };
 
 /**
  * One flat option. A single pick is a button. A multi-select row is its
@@ -9106,7 +9106,7 @@ const SelectFilter = forwardRef(({ label, options = [], groupedOptions = {}, gro
     else if (trigger === 'filter') {
         triggerElement = (
         // An outlined pill, blue while open or while a filter is in effect.
-        jsxs("button", { "aria-expanded": isOpen, className: cx(sx(filterPillStyle), isOpen || active ? sx(filterPillActiveStyle) : ''), "data-testid": `${label}-filter`, disabled: disabled, onClick: toggle, type: "button", children: [jsx(Icon, { name: "Filter", size: 16 }), triggerLabel, active && !(activeCount > 0) && jsx("span", { className: sx(srOnlyStyle$3), children: " (filter on)" }), activeCount > 0 && (jsx("span", { "aria-label": `${activeCount} on`, className: sx(filterCountStyle), children: activeCount }))] }));
+        jsxs("button", { "aria-expanded": isOpen, className: cx(sx(filterPillStyle), isOpen || active ? sx(filterPillActiveStyle) : ''), "data-testid": `${label}-filter`, disabled: disabled, onClick: toggle, type: "button", children: [jsx(Icon, { name: "Filter", size: 16 }), triggerLabel, active && !(activeCount > 0) && jsx("span", { className: sx(srOnlyStyle$4), children: " (filter on)" }), activeCount > 0 && (jsx("span", { "aria-label": `${activeCount} on`, className: sx(filterCountStyle), children: activeCount }))] }));
     }
     else if (trigger === 'link') {
         triggerElement = (jsxs("button", { "aria-expanded": isOpen, "aria-label": `Filter by ${label}: ${triggerText}`, className: sx(linkTriggerStyle), "data-testid": `${label}-filter`, disabled: disabled, onClick: toggle, type: "button", children: [singleTeam ? (jsxs("span", { className: sx(teamValueStyle), children: [jsx(SportCodeBadge, { code: codeOf(singleTeam), group: singleTeamTab && isSportCodeGroup(singleTeamTab) ? singleTeamTab : undefined }), jsx("span", { children: singleTeam.name ?? singleTeam.label })] })) : (jsx("span", { children: triggerText })), chevron] }));
@@ -9114,13 +9114,13 @@ const SelectFilter = forwardRef(({ label, options = [], groupedOptions = {}, gro
     else {
         triggerElement = (jsxs("button", { "aria-expanded": isOpen, "aria-label": `${label}: ${triggerText}`, className: cx(sx(fieldTriggerStyle), fullWidth ? sx(fieldTriggerFullStyle) : '', disabled ? sx(fieldTriggerDisabledStyle) : ''), "data-testid": `${label}-filter`, disabled: disabled, onClick: toggle, type: "button", children: [jsx("span", { className: sx(tagsStyle$1), children: isAll ? (jsxs("span", { className: sx(tagStyle), "data-testid": `${label}-option-all`, children: ["All ", label, "s"] })) : !chosen.length ? (jsx("span", { className: sx(placeholderStyle), children: placeholderText })) : (jsxs(Fragment, { children: [chosen.slice(0, tagLimit).map(renderTag), remaining > 0 && (jsxs("span", { className: sx(tagStyle), "data-testid": `${label}-option-remaining`, children: ["+", remaining] }))] })) }), jsx("span", { className: sx(chevronButtonStyle), children: chevron })] }));
     }
-    return (jsxs("div", { className: cx(sx(rootStyle), fullWidth ? sx(fullWidthStyle) : '', className ?? ''), ref: (element) => {
+    return (jsxs("div", { className: cx(sx(rootStyle$1), fullWidth ? sx(fullWidthStyle) : '', className ?? ''), ref: (element) => {
             rootRef.current = element;
             if (typeof ref === 'function')
                 ref(element);
             else if (ref)
                 ref.current = element;
-        }, children: [triggerElement, isOpen && (jsxs("div", { className: cx(sx(panelStyle$8), sx(trigger === 'icon' || trigger === 'filter' ? panelRightStyle : panelLeftStyle)), style: width ? { minWidth: width } : undefined, children: [header && jsx("div", { className: sx(headerStyle$I), children: header }), (title || showAllLink) && (jsxs("div", { className: sx(titleRowStyle$5), children: [title && jsx("span", { className: sx(titleStyle$C), children: title }), showAllLink && (jsx("button", { className: sx(allLinkStyle), onClick: selectAll, type: "button", children: "All" }))] })), jsx("div", { className: sx(choicesStyle), ref: choicesRef, children: grouped ? (
+        }, children: [triggerElement, isOpen && (jsxs("div", { className: cx(sx(panelStyle$8), sx(trigger === 'icon' || trigger === 'filter' ? panelRightStyle : panelLeftStyle)), style: width ? { minWidth: width } : undefined, children: [header && jsx("div", { className: sx(headerStyle$J), children: header }), (title || showAllLink) && (jsxs("div", { className: sx(titleRowStyle$5), children: [title && jsx("span", { className: sx(titleStyle$C), children: title }), showAllLink && (jsx("button", { className: sx(allLinkStyle), onClick: selectAll, type: "button", children: "All" }))] })), jsx("div", { className: sx(choicesStyle), ref: choicesRef, children: grouped ? (
                         // Multi-select stages here (with a select-all per tab and "Only");
                         // Apply below commits it. A single pick commits at once.
                         jsx(TeamPicker, { activeGroup: activeTab, "aria-label": `${label} groups`, emptyMessage: "No options found", groupOrder: tabs, groups: teamGroups, mode: multiselect ? 'multiple' : 'single', onGroupChange: setActiveTab, onOnly: (key) => only(byKey(key)), onSelect: (key) => select(byKey(key)), onToggle: (key) => select(byKey(key)), onToggleGroup: (_, keys) => toggleGroup(keys.map(byKey)), selected: staged.map(keyOf) })) : currentOptions.length === 0 ? (jsx("div", { className: sx(emptyStyle$l), children: "No options found" })) : (jsxs(Fragment, { children: [multiselect && !hideCheckAll && (
@@ -9291,7 +9291,7 @@ const SupplierTypeToggle = ({ value, defaultValue = '', onChange, disabled = fal
 };
 
 /** Sticks to the top of the calendar column as the schedule scrolls past. */
-const headerStyle$H = {
+const headerStyle$I = {
     label: 'TeamCalendarHeader-headerStyle',
     position: 'sticky',
     top: 0,
@@ -9303,7 +9303,7 @@ const headerStyle$H = {
         justifyContent: 'space-between',
     },
 };
-const rowStyle$7 = {
+const rowStyle$8 = {
     label: 'TeamCalendarHeader-rowStyle',
     display: 'flex',
     justifyContent: 'space-between',
@@ -9357,7 +9357,7 @@ const contentStyle$8 = {
  * It sticks to the top of its column so the team stays identifiable while the
  * schedule scrolls.
  */
-const TeamCalendarHeader = ({ teamCode, teamFullName, children, className = '', }) => (jsxs("div", { className: cx(sx(headerStyle$H), className), children: [jsx("div", { className: sx(rowStyle$7), children: jsxs("div", { className: sx(identityStyle$1), children: [jsx("div", { className: sx(codeStyle$3), children: teamCode }), teamFullName && jsx("span", { className: sx(nameStyle$4), children: teamFullName })] }) }), jsx("div", { className: sx(contentStyle$8), children: children })] }));
+const TeamCalendarHeader = ({ teamCode, teamFullName, children, className = '', }) => (jsxs("div", { className: cx(sx(headerStyle$I), className), children: [jsx("div", { className: sx(rowStyle$8), children: jsxs("div", { className: sx(identityStyle$1), children: [jsx("div", { className: sx(codeStyle$3), children: teamCode }), teamFullName && jsx("span", { className: sx(nameStyle$4), children: teamFullName })] }) }), jsx("div", { className: sx(contentStyle$8), children: children })] }));
 TeamCalendarHeader.displayName = 'TeamCalendarHeader';
 
 /**
@@ -9374,7 +9374,7 @@ const subMenuStyle = {
     label: 'TeamHeader-subMenuStyle',
     marginBottom: 24,
 };
-const headerStyle$G = {
+const headerStyle$H = {
     label: 'TeamHeader-headerStyle',
     display: 'flex',
     alignItems: 'flex-start',
@@ -9440,7 +9440,7 @@ const titleStyle$B = {
         lineHeight: '52px',
     },
 };
-const actionsStyle$a = {
+const actionsStyle$b = {
     label: 'TeamHeader-actionsStyle',
     display: 'flex',
     alignItems: 'center',
@@ -9455,7 +9455,7 @@ const TeamHeader = ({ title: suppliedTitle, teamCode, teamName, pretitle = 'Team
     const title = suppliedTitle ?? (teamCode && teamName
         ? `${teamCode} - ${teamName}`
         : teamName || teamCode || '');
-    const headerClasses = cx(sx(headerStyle$G), !title && sx(emptyStyle$k), className);
+    const headerClasses = cx(sx(headerStyle$H), !title && sx(emptyStyle$k), className);
     const handleBack = () => {
         if (onBack) {
             onBack();
@@ -9465,7 +9465,7 @@ const TeamHeader = ({ title: suppliedTitle, teamCode, teamName, pretitle = 'Team
             window.location.href = backHref;
         }
     };
-    return (jsxs("div", { className: headerClasses, "data-test": "team-header", children: [jsxs("div", { className: sx(leftStyle$1), children: [(backHref || onBack) && (jsx("button", { type: "button", className: sx(backButtonStyle), onClick: handleBack, "aria-label": "Go back", "data-test": "team-header-back", children: jsx(BackIcon, {}) })), jsxs("div", { className: sx(titlesStyle), children: [pretitle && jsx("span", { className: sx(pretitleStyle), children: pretitle }), jsxs("h1", { className: sx(titleStyle$B), children: [title, "\u00A0"] })] })] }), actions && (jsx("div", { className: sx(actionsStyle$a), children: actions }))] }));
+    return (jsxs("div", { className: headerClasses, "data-test": "team-header", children: [jsxs("div", { className: sx(leftStyle$1), children: [(backHref || onBack) && (jsx("button", { type: "button", className: sx(backButtonStyle), onClick: handleBack, "aria-label": "Go back", "data-test": "team-header-back", children: jsx(BackIcon, {}) })), jsxs("div", { className: sx(titlesStyle), children: [pretitle && jsx("span", { className: sx(pretitleStyle), children: pretitle }), jsxs("h1", { className: sx(titleStyle$B), children: [title, "\u00A0"] })] })] }), actions && (jsx("div", { className: sx(actionsStyle$b), children: actions }))] }));
 };
 const DEFAULT_TABS$1 = [
     { id: 'profile', label: 'Profile' },
@@ -9609,7 +9609,7 @@ const locationStyle = {
     fontWeight: 'var(--font-semibold)',
     color: 'var(--color-gray-900)',
 };
-const routeStyle$3 = {
+const routeStyle$4 = {
     label: 'TripSegment-routeStyle',
     display: 'flex',
     alignItems: 'center',
@@ -9691,7 +9691,7 @@ const AirSegment = ({ flights, variant = 'light', className = '', }) => {
     if (!flights || flights.length === 0) {
         return (jsx(TripSegment, { type: "air", variant: variant, className: className, children: jsx("span", { className: sx(emptyStyle$j), children: "No flights" }) }));
     }
-    return (jsx(TripSegment, { type: "air", variant: variant, className: className, children: flights.map((flight, i) => (jsxs("div", { className: sx(itemStyle$3), children: [jsxs("div", { className: sx(itemHeaderStyle), children: [jsx(PlaneIcon$2, {}), jsx("span", { className: sx(itemTypeStyle), children: flight.type === 'charter' ? 'Charter' : 'Commercial' })] }), jsxs("div", { className: sx(routeStyle$3), children: [jsx("span", { className: sx(locationStyle), children: flight.departure }), jsx(ArrowIcon, {}), jsx("span", { className: sx(locationStyle), children: flight.arrival })] }), jsxs("div", { className: sx(detailsStyle$3), children: [jsx("span", { children: flight.departureDate }), flight.departureTime && jsx("span", { children: flight.departureTime })] }), flight.airline && (jsxs("div", { className: sx(detailsStyle$3), children: [jsx("span", { children: flight.airline }), flight.flightNumber && jsxs("span", { children: ["#", flight.flightNumber] })] }))] }, i))) }));
+    return (jsx(TripSegment, { type: "air", variant: variant, className: className, children: flights.map((flight, i) => (jsxs("div", { className: sx(itemStyle$3), children: [jsxs("div", { className: sx(itemHeaderStyle), children: [jsx(PlaneIcon$2, {}), jsx("span", { className: sx(itemTypeStyle), children: flight.type === 'charter' ? 'Charter' : 'Commercial' })] }), jsxs("div", { className: sx(routeStyle$4), children: [jsx("span", { className: sx(locationStyle), children: flight.departure }), jsx(ArrowIcon, {}), jsx("span", { className: sx(locationStyle), children: flight.arrival })] }), jsxs("div", { className: sx(detailsStyle$3), children: [jsx("span", { children: flight.departureDate }), flight.departureTime && jsx("span", { children: flight.departureTime })] }), flight.airline && (jsxs("div", { className: sx(detailsStyle$3), children: [jsx("span", { children: flight.airline }), flight.flightNumber && jsxs("span", { children: ["#", flight.flightNumber] })] }))] }, i))) }));
 };
 /**
  * GroundSegment component for displaying ground transportation
@@ -9700,7 +9700,7 @@ const GroundSegment = ({ segments, variant = 'light', className = '', }) => {
     if (!segments || segments.length === 0) {
         return (jsx(TripSegment, { type: "ground", variant: variant, className: className, children: jsx("span", { className: sx(emptyStyle$j), children: "No ground transportation" }) }));
     }
-    return (jsx(TripSegment, { type: "ground", variant: variant, className: className, children: segments.map((segment, i) => (jsxs("div", { className: sx(itemStyle$3), children: [jsxs("div", { className: sx(itemHeaderStyle), children: [jsx(BusIcon$1, {}), jsx("span", { className: sx(itemTypeStyle), children: segment.type.charAt(0).toUpperCase() + segment.type.slice(1) })] }), jsxs("div", { className: sx(routeStyle$3), children: [jsx("span", { className: sx(locationStyle), children: segment.pickupLocation }), jsx(ArrowIcon, {}), jsx("span", { className: sx(locationStyle), children: segment.dropoffLocation })] }), jsxs("div", { className: sx(detailsStyle$3), children: [jsx("span", { children: segment.pickupDate }), segment.pickupTime && jsx("span", { children: segment.pickupTime })] }), segment.company && (jsxs("div", { className: sx(detailsStyle$3), children: [jsx("span", { children: segment.company }), segment.vehicleCount && jsxs("span", { children: [segment.vehicleCount, " vehicles"] })] }))] }, i))) }));
+    return (jsx(TripSegment, { type: "ground", variant: variant, className: className, children: segments.map((segment, i) => (jsxs("div", { className: sx(itemStyle$3), children: [jsxs("div", { className: sx(itemHeaderStyle), children: [jsx(BusIcon$1, {}), jsx("span", { className: sx(itemTypeStyle), children: segment.type.charAt(0).toUpperCase() + segment.type.slice(1) })] }), jsxs("div", { className: sx(routeStyle$4), children: [jsx("span", { className: sx(locationStyle), children: segment.pickupLocation }), jsx(ArrowIcon, {}), jsx("span", { className: sx(locationStyle), children: segment.dropoffLocation })] }), jsxs("div", { className: sx(detailsStyle$3), children: [jsx("span", { children: segment.pickupDate }), segment.pickupTime && jsx("span", { children: segment.pickupTime })] }), segment.company && (jsxs("div", { className: sx(detailsStyle$3), children: [jsx("span", { children: segment.company }), segment.vehicleCount && jsxs("span", { children: [segment.vehicleCount, " vehicles"] })] }))] }, i))) }));
 };
 /**
  * HotelSegment component for displaying hotel information
@@ -9747,7 +9747,7 @@ const panelStyle$7 = {
     borderRadius: 'var(--radius-xl)',
     backgroundColor: 'var(--bg-surface)',
 };
-const panelTitleStyle = {
+const panelTitleStyle$1 = {
     label: 'AcmiQuoteCalculator-panelTitleStyle',
     margin: 0,
     color: 'var(--fg-1)',
@@ -9818,7 +9818,7 @@ const legErrorStyle = {
     color: 'var(--color-error)',
     fontSize: 'var(--fs-sm)',
 };
-const actionsStyle$9 = {
+const actionsStyle$a = {
     label: 'AcmiQuoteCalculator-actionsStyle',
     display: 'flex',
     flexWrap: 'wrap',
@@ -10056,10 +10056,10 @@ const AcmiQuoteCalculator = ({ carrierOptions = ACMI_CARRIER_OPTIONS, aircraftOp
     const seatHint = specs
         ? `Maximum ${specs.seats} passengers for this aircraft`
         : 'Select an aircraft to see seat capacity';
-    return (jsxs("div", { className: cx(sx(calculatorStyle$1), className), "data-test": "acmi-quote-calculator", children: [showErrors && errorList.length > 0 && (jsx(Alert, { variant: "error", title: "Fix these before calculating", children: jsx("ul", { className: sx(errorSummaryStyle$1), "data-test": "acmi-error-summary", children: errorList.map(([field, message]) => (jsx("li", { children: message }, field))) }) })), calculationError && (jsx(Alert, { variant: "error", title: "Quote could not be calculated", children: jsx("p", { className: sx(alertMessageStyle), "data-test": "acmi-calculation-error", children: calculationError }) })), jsxs("div", { className: sx(columnsStyle), children: [jsxs("section", { className: sx(panelStyle$7), "aria-label": "Quote configuration", children: [jsx("h3", { className: sx(panelTitleStyle), children: "Quote Configuration" }), jsx(Select, { id: "acmi-carrier", label: "Carrier", placeholder: "Select Carrier\u2026", options: carrierOptions, value: inputs.carrier, error: showErrors ? errors.carrier : undefined, onChange: (event) => updateCarrier(event.target.value), "data-test": "acmi-carrier" }), jsx(Select, { id: "acmi-aircraft", label: "Aircraft Type", placeholder: "Select Aircraft\u2026", options: availableAircraftOptions, value: inputs.aircraft, disabled: !inputs.carrier, error: showErrors ? errors.aircraft : undefined, onChange: (event) => update('aircraft', event.target.value), "data-test": "acmi-aircraft" }), jsx(Input, { id: "acmi-passengers", type: "number", label: "Number of Passengers", placeholder: "Enter passenger count", helperText: seatHint, value: inputs.passengers, error: showErrors ? errors.passengers : undefined, onChange: (event) => update('passengers', event.target.value), "data-test": "acmi-passengers" }), jsx(Input, { id: "acmi-fuel-price", type: "number", step: "0.01", label: "Fuel Price ($/gallon)", placeholder: "e.g. 5.50", value: inputs.fuelPrice, error: showErrors ? errors.fuelPrice : undefined, onChange: (event) => update('fuelPrice', event.target.value), "data-test": "acmi-fuel-price" }), jsx(Input, { id: "acmi-markup", type: "number", step: "0.1", label: "Markup %", helperText: "Standard is 7% \u2014 adjustable as needed", value: inputs.markupPercent, onChange: (event) => update('markupPercent', event.target.value), "data-test": "acmi-markup" }), jsx(Input, { id: "acmi-insurance", label: "Insurance (Flat Fee)", helperText: `${currency.format(insuranceFlat)} per trip (locked)`, value: currency.format(insuranceFlat), readOnly: true, disabled: true, "data-test": "acmi-insurance" }), jsx(Input, { id: "acmi-crew-nights", type: "number", label: "Crew Nights (RON)", helperText: "Number of nights crew stays away from base", value: inputs.crewNights, onChange: (event) => update('crewNights', event.target.value), "data-test": "acmi-crew-nights" }), showTripMonth && (jsx(Select, { id: "acmi-trip-month", label: "Trip Month (for Historic Winds)", options: TRIP_MONTH_OPTIONS, helperText: "Use this only when the configured pricing service applies a historic winds profile.", value: inputs.tripMonth, onChange: (event) => update('tripMonth', event.target.value), "data-test": "acmi-trip-month" }))] }), jsxs("section", { className: sx(panelStyle$7), "aria-label": "Flight itinerary", children: [jsx("h3", { className: sx(panelTitleStyle), children: "Flight Itinerary" }), jsx(Alert, { variant: "primary", children: positioningMode === 'automatic' ? (jsxs(Fragment, { children: ["Enter ", jsx("strong", { children: "live legs only" }), ", in trip order. The host pricing engine adds positioning ferry legs automatically. Leave flight time blank to use its route estimate; an entered time is treated as an explicit contractual input."] })) : (jsxs(Fragment, { children: ["Enter ", jsx("strong", { children: "every flown leg in order" }), ", including positioning. Mark each leg as live or ferry. Leave flight time blank to use the pricing engine\u2019s route estimate; an entered time is treated as an explicit contractual input."] })) }), showErrors && errors.legs && (jsx("p", { className: sx(legErrorStyle), role: "alert", "data-test": "acmi-legs-error", children: errors.legs })), jsx("ol", { className: sx(legsStyle$3), children: inputs.legs.map((leg, index) => (jsxs("li", { className: cx(sx(legStyle$2), positioningMode === 'automatic' && sx(automaticLegStyle)), "data-test": "acmi-leg", children: [jsxs("span", { className: sx(legIndexStyle$1), children: ["Leg ", index + 1] }), positioningMode === 'explicit' && (jsx(Select, { id: `${leg.id}-type`, size: "sm", label: "Leg type", options: [
+    return (jsxs("div", { className: cx(sx(calculatorStyle$1), className), "data-test": "acmi-quote-calculator", children: [showErrors && errorList.length > 0 && (jsx(Alert, { variant: "error", title: "Fix these before calculating", children: jsx("ul", { className: sx(errorSummaryStyle$1), "data-test": "acmi-error-summary", children: errorList.map(([field, message]) => (jsx("li", { children: message }, field))) }) })), calculationError && (jsx(Alert, { variant: "error", title: "Quote could not be calculated", children: jsx("p", { className: sx(alertMessageStyle), "data-test": "acmi-calculation-error", children: calculationError }) })), jsxs("div", { className: sx(columnsStyle), children: [jsxs("section", { className: sx(panelStyle$7), "aria-label": "Quote configuration", children: [jsx("h3", { className: sx(panelTitleStyle$1), children: "Quote Configuration" }), jsx(Select, { id: "acmi-carrier", label: "Carrier", placeholder: "Select Carrier\u2026", options: carrierOptions, value: inputs.carrier, error: showErrors ? errors.carrier : undefined, onChange: (event) => updateCarrier(event.target.value), "data-test": "acmi-carrier" }), jsx(Select, { id: "acmi-aircraft", label: "Aircraft Type", placeholder: "Select Aircraft\u2026", options: availableAircraftOptions, value: inputs.aircraft, disabled: !inputs.carrier, error: showErrors ? errors.aircraft : undefined, onChange: (event) => update('aircraft', event.target.value), "data-test": "acmi-aircraft" }), jsx(Input, { id: "acmi-passengers", type: "number", label: "Number of Passengers", placeholder: "Enter passenger count", helperText: seatHint, value: inputs.passengers, error: showErrors ? errors.passengers : undefined, onChange: (event) => update('passengers', event.target.value), "data-test": "acmi-passengers" }), jsx(Input, { id: "acmi-fuel-price", type: "number", step: "0.01", label: "Fuel Price ($/gallon)", placeholder: "e.g. 5.50", value: inputs.fuelPrice, error: showErrors ? errors.fuelPrice : undefined, onChange: (event) => update('fuelPrice', event.target.value), "data-test": "acmi-fuel-price" }), jsx(Input, { id: "acmi-markup", type: "number", step: "0.1", label: "Markup %", helperText: "Standard is 7% \u2014 adjustable as needed", value: inputs.markupPercent, onChange: (event) => update('markupPercent', event.target.value), "data-test": "acmi-markup" }), jsx(Input, { id: "acmi-insurance", label: "Insurance (Flat Fee)", helperText: `${currency.format(insuranceFlat)} per trip (locked)`, value: currency.format(insuranceFlat), readOnly: true, disabled: true, "data-test": "acmi-insurance" }), jsx(Input, { id: "acmi-crew-nights", type: "number", label: "Crew Nights (RON)", helperText: "Number of nights crew stays away from base", value: inputs.crewNights, onChange: (event) => update('crewNights', event.target.value), "data-test": "acmi-crew-nights" }), showTripMonth && (jsx(Select, { id: "acmi-trip-month", label: "Trip Month (for Historic Winds)", options: TRIP_MONTH_OPTIONS, helperText: "Use this only when the configured pricing service applies a historic winds profile.", value: inputs.tripMonth, onChange: (event) => update('tripMonth', event.target.value), "data-test": "acmi-trip-month" }))] }), jsxs("section", { className: sx(panelStyle$7), "aria-label": "Flight itinerary", children: [jsx("h3", { className: sx(panelTitleStyle$1), children: "Flight Itinerary" }), jsx(Alert, { variant: "primary", children: positioningMode === 'automatic' ? (jsxs(Fragment, { children: ["Enter ", jsx("strong", { children: "live legs only" }), ", in trip order. The host pricing engine adds positioning ferry legs automatically. Leave flight time blank to use its route estimate; an entered time is treated as an explicit contractual input."] })) : (jsxs(Fragment, { children: ["Enter ", jsx("strong", { children: "every flown leg in order" }), ", including positioning. Mark each leg as live or ferry. Leave flight time blank to use the pricing engine\u2019s route estimate; an entered time is treated as an explicit contractual input."] })) }), showErrors && errors.legs && (jsx("p", { className: sx(legErrorStyle), role: "alert", "data-test": "acmi-legs-error", children: errors.legs })), jsx("ol", { className: sx(legsStyle$3), children: inputs.legs.map((leg, index) => (jsxs("li", { className: cx(sx(legStyle$2), positioningMode === 'automatic' && sx(automaticLegStyle)), "data-test": "acmi-leg", children: [jsxs("span", { className: sx(legIndexStyle$1), children: ["Leg ", index + 1] }), positioningMode === 'explicit' && (jsx(Select, { id: `${leg.id}-type`, size: "sm", label: "Leg type", options: [
                                                 { value: 'live', label: 'Live' },
                                                 { value: 'ferry', label: 'Ferry' },
-                                            ], value: leg.type ?? 'live', onChange: (event) => updateLeg(leg.id, { type: event.target.value }), "data-test": "acmi-leg-type" })), jsx(Input, { id: `${leg.id}-origin`, size: "sm", label: "From", maxLength: 4, value: leg.origin, onChange: (event) => updateLeg(leg.id, { origin: event.target.value.toUpperCase() }), "data-test": "acmi-leg-origin" }), jsx(Input, { id: `${leg.id}-destination`, size: "sm", label: "To", maxLength: 4, value: leg.destination, onChange: (event) => updateLeg(leg.id, { destination: event.target.value.toUpperCase() }), "data-test": "acmi-leg-destination" }), jsx(Input, { id: `${leg.id}-flight-time`, size: "sm", type: "number", step: "0.1", label: "Flight time (h, optional)", value: leg.flightTime, onChange: (event) => updateLeg(leg.id, { flightTime: event.target.value }), "data-test": "acmi-leg-flight-time" }), jsx(Button, { variant: "ghost", size: "sm", square: true, "aria-label": `Remove leg ${index + 1}`, disabled: inputs.legs.length === 1, onClick: () => removeLeg(leg.id), "data-test": "acmi-remove-leg", children: jsx(TrashIcon$2, { size: 16 }) })] }, leg.id))) }), jsxs("div", { className: sx(actionsStyle$9), children: [jsx(Button, { variant: "outline", size: "sm", leftIcon: jsx(PlusIcon$2, { size: 16 }), onClick: addLeg, "data-test": "acmi-add-leg", children: "Add Flight Leg" }), jsx(Button, { size: "sm", loading: calculating, onClick: calculate, "data-test": "acmi-calculate", children: calculating ? 'Calculating' : 'Calculate Quote' }), result && onSubmitForApproval && (jsx(Button, { variant: "secondary", size: "sm", onClick: () => onSubmitForApproval(inputs), "data-test": "acmi-submit-approval", children: "Use This Total" }))] })] })] }), result && (jsxs("section", { className: sx(resultsStyle), "aria-label": "Quote summary", "data-test": "acmi-results", children: [jsx("h3", { className: sx(panelTitleStyle), children: "Quote Summary" }), jsxs("dl", { className: sx(resultGridStyle), children: [jsxs("div", { children: [jsx("dt", { children: "Operating Subtotal" }), jsx("dd", { children: currency.format(result.operatingSubtotal) })] }), jsxs("div", { children: [jsx("dt", { children: "Markup Applied" }), jsx("dd", { children: currency.format(result.markupAmount) })] }), jsxs("div", { children: [jsx("dt", { children: "Insurance (Flat Fee)" }), jsx("dd", { children: currency.format(result.insuranceAmount) })] }), jsxs("div", { children: [jsx("dt", { children: "Pre-Tax Total" }), jsx("dd", { children: currency.format(result.preTaxTotal) })] }), jsxs("div", { children: [jsx("dt", { children: "Federal Excise Tax" }), jsx("dd", { children: currency.format(result.fet) })] }), jsxs("div", { children: [jsx("dt", { children: "Segment Fees" }), jsx("dd", { children: currency.format(result.segmentFees) })] })] }), jsxs("p", { className: sx(finalPriceStyle), "data-test": "acmi-final-price", children: [jsx("span", { children: "Total Quoted Price" }), jsx("strong", { children: currency.format(result.finalPrice) })] }), result.pricingDetails && (jsxs("dl", { className: sx(contractFactsStyle), "data-test": "acmi-pricing-details", children: [jsxs("div", { "data-test": "acmi-ferry-floor", children: [jsx("dt", { children: "Ferry block time" }), jsxs("dd", { children: [result.pricingDetails.ferryBlockHours.toFixed(2), " h", result.pricingDetails.ferryMinimumHours
+                                            ], value: leg.type ?? 'live', onChange: (event) => updateLeg(leg.id, { type: event.target.value }), "data-test": "acmi-leg-type" })), jsx(Input, { id: `${leg.id}-origin`, size: "sm", label: "From", maxLength: 4, value: leg.origin, onChange: (event) => updateLeg(leg.id, { origin: event.target.value.toUpperCase() }), "data-test": "acmi-leg-origin" }), jsx(Input, { id: `${leg.id}-destination`, size: "sm", label: "To", maxLength: 4, value: leg.destination, onChange: (event) => updateLeg(leg.id, { destination: event.target.value.toUpperCase() }), "data-test": "acmi-leg-destination" }), jsx(Input, { id: `${leg.id}-flight-time`, size: "sm", type: "number", step: "0.1", label: "Flight time (h, optional)", value: leg.flightTime, onChange: (event) => updateLeg(leg.id, { flightTime: event.target.value }), "data-test": "acmi-leg-flight-time" }), jsx(Button, { variant: "ghost", size: "sm", square: true, "aria-label": `Remove leg ${index + 1}`, disabled: inputs.legs.length === 1, onClick: () => removeLeg(leg.id), "data-test": "acmi-remove-leg", children: jsx(TrashIcon$2, { size: 16 }) })] }, leg.id))) }), jsxs("div", { className: sx(actionsStyle$a), children: [jsx(Button, { variant: "outline", size: "sm", leftIcon: jsx(PlusIcon$2, { size: 16 }), onClick: addLeg, "data-test": "acmi-add-leg", children: "Add Flight Leg" }), jsx(Button, { size: "sm", loading: calculating, onClick: calculate, "data-test": "acmi-calculate", children: calculating ? 'Calculating' : 'Calculate Quote' }), result && onSubmitForApproval && (jsx(Button, { variant: "secondary", size: "sm", onClick: () => onSubmitForApproval(inputs), "data-test": "acmi-submit-approval", children: "Use This Total" }))] })] })] }), result && (jsxs("section", { className: sx(resultsStyle), "aria-label": "Quote summary", "data-test": "acmi-results", children: [jsx("h3", { className: sx(panelTitleStyle$1), children: "Quote Summary" }), jsxs("dl", { className: sx(resultGridStyle), children: [jsxs("div", { children: [jsx("dt", { children: "Operating Subtotal" }), jsx("dd", { children: currency.format(result.operatingSubtotal) })] }), jsxs("div", { children: [jsx("dt", { children: "Markup Applied" }), jsx("dd", { children: currency.format(result.markupAmount) })] }), jsxs("div", { children: [jsx("dt", { children: "Insurance (Flat Fee)" }), jsx("dd", { children: currency.format(result.insuranceAmount) })] }), jsxs("div", { children: [jsx("dt", { children: "Pre-Tax Total" }), jsx("dd", { children: currency.format(result.preTaxTotal) })] }), jsxs("div", { children: [jsx("dt", { children: "Federal Excise Tax" }), jsx("dd", { children: currency.format(result.fet) })] }), jsxs("div", { children: [jsx("dt", { children: "Segment Fees" }), jsx("dd", { children: currency.format(result.segmentFees) })] })] }), jsxs("p", { className: sx(finalPriceStyle), "data-test": "acmi-final-price", children: [jsx("span", { children: "Total Quoted Price" }), jsx("strong", { children: currency.format(result.finalPrice) })] }), result.pricingDetails && (jsxs("dl", { className: sx(contractFactsStyle), "data-test": "acmi-pricing-details", children: [jsxs("div", { "data-test": "acmi-ferry-floor", children: [jsx("dt", { children: "Ferry block time" }), jsxs("dd", { children: [result.pricingDetails.ferryBlockHours.toFixed(2), " h", result.pricingDetails.ferryMinimumHours
                                                 ? ` · ${result.pricingDetails.ferryMinimumHours.toFixed(2)} h minimum per estimated SkyWest ferry leg`
                                                 : ''] })] }), jsxs("div", { "data-test": "acmi-fuel-buffer", children: [jsx("dt", { children: "Fuel buffer" }), jsxs("dd", { children: [(result.pricingDetails.fuelBufferPercent * 100).toFixed(0), "% \u00B7 ", currency.format(result.pricingDetails.fuelBufferAmount)] })] }), jsxs("div", { "data-test": "acmi-screening", children: [jsx("dt", { children: "Security screening" }), jsx("dd", { children: currency.format(result.pricingDetails.screeningAmount) })] })] })), result.legs && result.legs.length > 0 && (jsxs("div", { className: sx(pricedLegsStyle), "data-test": "acmi-priced-legs", children: [jsx("h4", { children: "Backend-priced itinerary" }), jsxs("div", { className: sx(pricedLegHeaderStyle), "aria-hidden": "true", children: [jsx("span", { children: "Leg" }), jsx("span", { children: "Type" }), jsx("span", { children: "Block" }), jsx("span", { children: "Total" })] }), result.legs.map((leg) => (jsxs("div", { className: sx(pricedLegStyle), "data-test": "acmi-priced-leg", children: [jsxs("span", { children: [leg.origin, " \u2192 ", leg.destination] }), jsx("span", { "data-test": "acmi-priced-leg-type", children: leg.type === 'ferry' ? 'Ferry' : 'Live' }), jsxs("span", { "data-test": "acmi-priced-leg-block", children: [leg.blockHours.toFixed(2), " h"] }), jsx("span", { children: currency.format(leg.total) })] }, leg.id)))] }))] }))] }));
 };
@@ -10104,7 +10104,7 @@ const showHideAllStyle = {
         opacity: 0.5,
     },
 };
-const filtersStyle$5 = {
+const filtersStyle$6 = {
     label: 'AgentGroupTravelRequestsTable-filtersStyle',
     display: 'flex',
     flexWrap: 'wrap',
@@ -10221,7 +10221,7 @@ const iconButtonStyle$1 = {
     cursor: 'pointer',
     '&:hover': { background: 'var(--color-primary-light)' },
 };
-const mutedStyle$2 = {
+const mutedStyle$3 = {
     label: 'AgentGroupTravelRequestsTable-mutedStyle', color: 'var(--fg-4, var(--color-stone))'
 };
 const idLinkStyle = {
@@ -10334,7 +10334,7 @@ const subPnrPanelStyle = {
     gap: 'var(--space-2)',
     padding: 'var(--space-2) 0',
 };
-const legendStyle$2 = {
+const legendStyle$4 = {
     label: 'AgentGroupTravelRequestsTable-legendStyle',
     margin: 0,
     color: 'var(--fg-3, var(--color-slate))',
@@ -10461,12 +10461,12 @@ const AgentGroupTravelRequestsTable = ({ requests, sports = [], views = [], toda
         setDateEdits((current) => ({ ...current, [id]: { ...current[id], submittedDate: value } }));
         onSubmittedDateChange?.(id, value);
     };
-    return (jsxs("div", { className: cx(sx(wrapperStyle$2), className), "data-test": "agent-gtr-table", children: [jsxs("div", { className: sx(toolbarStyle$3), children: [jsxs("button", { type: "button", className: sx(showHideAllStyle), title: "Show/Hide all PNRs", onClick: toggleExpandAll, disabled: multiPnrIds.length === 0, "data-test": "agent-gtr-toggle-all", children: [allExpanded ? jsx(ChevronUpIcon, { size: 16 }) : jsx(ChevronDownIcon$1, { size: 16 }), jsx("span", { children: allExpanded ? 'Collapse all PNRs' : 'Expand all PNRs' })] }), jsxs("div", { className: sx(filtersStyle$5), children: [jsxs("label", { className: sx(filterFieldStyle$1), children: [jsx("span", { children: "Filter by sport" }), jsxs("select", { value: sportFilter, onChange: (event) => setSportFilter(event.target.value), "data-test": "agent-gtr-sport-filter", children: [jsx("option", { value: "", children: "All Sports" }), sports.map((sport) => (jsx("option", { value: sport.code, children: sport.label }, sport.code)))] })] }), views.length > 0 && (jsxs("label", { className: sx(filterFieldStyle$1), children: [jsx("span", { children: "Filter by view" }), jsxs("select", { value: viewFilter, onChange: (event) => setViewFilter(event.target.value), "data-test": "agent-gtr-view-filter", children: [jsx("option", { value: "", children: "All Accounts" }), views.map((view) => (jsx("option", { value: view.id, children: view.label }, view.id)))] })] }))] })] }), jsx("div", { className: sx(tableScrollStyle$2), children: jsxs("table", { className: sx(tableStyle$b), children: [jsx("thead", { children: jsxs("tr", { children: [jsx("th", { className: sx(colExpandStyle), children: jsx("span", { className: "sr-only", children: "Expand" }) }), jsx("th", { children: "Source" }), jsx("th", { children: "Master Trip" }), jsx("th", { children: "ID" }), jsx("th", { children: "Start Date" }), jsx("th", { children: "Name" }), jsx("th", { children: "Sport" }), jsxs("th", { children: [jsx(PlaneIcon$3, { size: 16 }), jsx("span", { className: "sr-only", children: "Carrier" })] }), jsx("th", { children: "Routing" }), jsx("th", { children: "Submitted" }), jsx("th", { children: "Type" }), jsx("th", { children: "Quote Sent" }), jsx("th", { children: "Confirmation" }), jsx("th", { children: "Deposit" }), jsx("th", { children: "Utilization" }), jsx("th", { children: "Names" }), jsx("th", { children: "Ticketing" }), jsx("th", { children: "PNR" }), jsx("th", { className: sx(colDeleteStyle), children: jsx("span", { className: "sr-only", children: "Delete" }) })] }) }), jsxs("tbody", { children: [!groups.length && (jsx("tr", { children: jsx("td", { colSpan: COLUMN_COUNT, className: sx(emptyStyle$i), "data-test": "agent-gtr-empty", children: "No open group travel requests match these filters." }) })), groups.map((group) => (jsxs(Fragment$1, { children: [jsx("tr", { className: sx(accountRowStyle), children: jsx("td", { colSpan: COLUMN_COUNT, children: group.accountName }) }), group.items.map((request) => {
+    return (jsxs("div", { className: cx(sx(wrapperStyle$2), className), "data-test": "agent-gtr-table", children: [jsxs("div", { className: sx(toolbarStyle$3), children: [jsxs("button", { type: "button", className: sx(showHideAllStyle), title: "Show/Hide all PNRs", onClick: toggleExpandAll, disabled: multiPnrIds.length === 0, "data-test": "agent-gtr-toggle-all", children: [allExpanded ? jsx(ChevronUpIcon, { size: 16 }) : jsx(ChevronDownIcon$1, { size: 16 }), jsx("span", { children: allExpanded ? 'Collapse all PNRs' : 'Expand all PNRs' })] }), jsxs("div", { className: sx(filtersStyle$6), children: [jsxs("label", { className: sx(filterFieldStyle$1), children: [jsx("span", { children: "Filter by sport" }), jsxs("select", { value: sportFilter, onChange: (event) => setSportFilter(event.target.value), "data-test": "agent-gtr-sport-filter", children: [jsx("option", { value: "", children: "All Sports" }), sports.map((sport) => (jsx("option", { value: sport.code, children: sport.label }, sport.code)))] })] }), views.length > 0 && (jsxs("label", { className: sx(filterFieldStyle$1), children: [jsx("span", { children: "Filter by view" }), jsxs("select", { value: viewFilter, onChange: (event) => setViewFilter(event.target.value), "data-test": "agent-gtr-view-filter", children: [jsx("option", { value: "", children: "All Accounts" }), views.map((view) => (jsx("option", { value: view.id, children: view.label }, view.id)))] })] }))] })] }), jsx("div", { className: sx(tableScrollStyle$2), children: jsxs("table", { className: sx(tableStyle$b), children: [jsx("thead", { children: jsxs("tr", { children: [jsx("th", { className: sx(colExpandStyle), children: jsx("span", { className: "sr-only", children: "Expand" }) }), jsx("th", { children: "Source" }), jsx("th", { children: "Master Trip" }), jsx("th", { children: "ID" }), jsx("th", { children: "Start Date" }), jsx("th", { children: "Name" }), jsx("th", { children: "Sport" }), jsxs("th", { children: [jsx(PlaneIcon$3, { size: 16 }), jsx("span", { className: "sr-only", children: "Carrier" })] }), jsx("th", { children: "Routing" }), jsx("th", { children: "Submitted" }), jsx("th", { children: "Type" }), jsx("th", { children: "Quote Sent" }), jsx("th", { children: "Confirmation" }), jsx("th", { children: "Deposit" }), jsx("th", { children: "Utilization" }), jsx("th", { children: "Names" }), jsx("th", { children: "Ticketing" }), jsx("th", { children: "PNR" }), jsx("th", { className: sx(colDeleteStyle), children: jsx("span", { className: "sr-only", children: "Delete" }) })] }) }), jsxs("tbody", { children: [!groups.length && (jsx("tr", { children: jsx("td", { colSpan: COLUMN_COUNT, className: sx(emptyStyle$i), "data-test": "agent-gtr-empty", children: "No open group travel requests match these filters." }) })), groups.map((group) => (jsxs(Fragment$1, { children: [jsx("tr", { className: sx(accountRowStyle), children: jsx("td", { colSpan: COLUMN_COUNT, children: group.accountName }) }), group.items.map((request) => {
                                             const isMulti = request.pnrs.length > 1;
                                             const isExpanded = expandedIds.has(request.id);
                                             const startSoon = daysUntil(request.startDate, today) < 8;
-                                            return (jsxs(Fragment$1, { children: [jsxs("tr", { className: sx(requestRowStyle), "data-test": "agent-gtr-row", children: [jsx("td", { className: sx(colExpandStyle), children: isMulti && (jsx("button", { type: "button", className: sx(expanderStyle$1), "aria-expanded": isExpanded, "aria-label": `${isExpanded ? 'Collapse' : 'Expand'} PNRs for ${request.name}`, onClick: () => toggleExpanded(request.id), "data-test": "agent-gtr-expand-row", children: isExpanded ? jsx(ChevronDownIcon$1, { size: 16 }) : jsx(ChevronRightIcon$1, { size: 16 }) })) }), jsx("td", { children: request.source === 'client' ? 'C' : 'A' }), jsx("td", { children: request.masterTripId ? (jsx("button", { type: "button", className: sx(iconButtonStyle$1), "aria-label": `View master trip ${request.masterTripId}`, title: `View Master Trip ${request.masterTripId}`, onClick: () => onViewMasterTrip?.(request.masterTripId), children: jsx(SearchIcon$1, { size: 16 }) })) : (jsx("span", { className: sx(mutedStyle$2), children: "\u2014" })) }), jsx("td", { children: jsx("button", { type: "button", className: cx(sx(idLinkStyle), request.notes && sx(hasNotesStyle)), title: request.notes || undefined, onClick: () => onOpenRequest?.(request.id), "data-test": "agent-gtr-open-request", children: request.id }) }), jsx("td", { className: cx(startSoon && sx(startSoonStyle)), children: formatShortDate$1(request.startDate) }), jsx("td", { children: truncate(request.name) }), jsx("td", { children: truncate(request.sport) }), jsx("td", { children: isMulti ? 'Multi' : request.carrier || '' }), jsx("td", { children: isMulti ? 'Multi' : request.routing }), jsx("td", { className: sx(colDateStyle), children: jsx(Datepicker, { "aria-label": `Submitted date for request ${request.id}`, size: "sm", value: dateEdits[request.id]?.submittedDate ?? request.submittedDate ?? '', onChange: (event) => handleSubmittedDateChange(request.id, event.target.value), "data-test": "agent-gtr-submitted-date" }) }), jsx("td", { children: computeTravelTypeCodes(request).join(', ') }), jsx("td", { className: sx(colDateStyle), children: jsx(Datepicker, { "aria-label": `Quote sent date for request ${request.id}`, size: "sm", value: dateEdits[request.id]?.quoteSentDate ?? request.quoteSentDate ?? '', onChange: (event) => handleQuoteSentDateChange(request.id, event.target.value), "data-test": "agent-gtr-quote-sent-date" }) }), DUE_FIELDS.map(({ field }) => (jsx("td", { children: jsx(DueStatusCell, { status: request[field], today: today, onToggle: onToggleDueStatus ? () => onToggleDueStatus(request.id, field) : undefined }) }, field))), jsx("td", { children: isMulti ? (jsx(PnrButton, { label: "Multi", tone: groupPnrTone(request.pnrs), onClick: () => toggleExpanded(request.id), dataTest: "agent-gtr-pnr-multi" })) : (jsx(PnrButton, { label: request.pnrs[0].recordLocator.toUpperCase(), tone: pnrTone(request.pnrs[0]), onClick: () => handleCopyPnr(request.pnrs[0].recordLocator), dataTest: "agent-gtr-pnr" })) }), jsx("td", { className: sx(colDeleteStyle), children: !isMulti && onDeleteRequest && (jsx("button", { type: "button", className: sx(deleteButtonStyle), "aria-label": `Delete request ${request.id}`, title: "Click to delete this trip", onClick: () => onDeleteRequest(request.id), "data-test": "agent-gtr-delete", children: jsx(TrashIcon$2, { size: 16 }) })) })] }), isMulti && isExpanded && (jsx("tr", { className: sx(subPnrRowStyle), children: jsx("td", { colSpan: COLUMN_COUNT, children: jsx("div", { className: sx(subPnrPanelStyle), "data-test": "agent-gtr-sub-pnrs", children: request.pnrs.map((pnr) => (jsx(PnrButton, { label: pnr.recordLocator.toUpperCase(), tone: pnrTone(pnr), onClick: () => handleCopyPnr(pnr.recordLocator), dataTest: "agent-gtr-sub-pnr" }, pnr.id))) }) }) }))] }, request.id));
-                                        })] }, `account-${group.accountName}`)))] })] }) }), jsx("p", { className: sx(legendStyle$2), children: "Types: A - Airline C - Car, H - Hotel" })] }));
+                                            return (jsxs(Fragment$1, { children: [jsxs("tr", { className: sx(requestRowStyle), "data-test": "agent-gtr-row", children: [jsx("td", { className: sx(colExpandStyle), children: isMulti && (jsx("button", { type: "button", className: sx(expanderStyle$1), "aria-expanded": isExpanded, "aria-label": `${isExpanded ? 'Collapse' : 'Expand'} PNRs for ${request.name}`, onClick: () => toggleExpanded(request.id), "data-test": "agent-gtr-expand-row", children: isExpanded ? jsx(ChevronDownIcon$1, { size: 16 }) : jsx(ChevronRightIcon$1, { size: 16 }) })) }), jsx("td", { children: request.source === 'client' ? 'C' : 'A' }), jsx("td", { children: request.masterTripId ? (jsx("button", { type: "button", className: sx(iconButtonStyle$1), "aria-label": `View master trip ${request.masterTripId}`, title: `View Master Trip ${request.masterTripId}`, onClick: () => onViewMasterTrip?.(request.masterTripId), children: jsx(SearchIcon$1, { size: 16 }) })) : (jsx("span", { className: sx(mutedStyle$3), children: "\u2014" })) }), jsx("td", { children: jsx("button", { type: "button", className: cx(sx(idLinkStyle), request.notes && sx(hasNotesStyle)), title: request.notes || undefined, onClick: () => onOpenRequest?.(request.id), "data-test": "agent-gtr-open-request", children: request.id }) }), jsx("td", { className: cx(startSoon && sx(startSoonStyle)), children: formatShortDate$1(request.startDate) }), jsx("td", { children: truncate(request.name) }), jsx("td", { children: truncate(request.sport) }), jsx("td", { children: isMulti ? 'Multi' : request.carrier || '' }), jsx("td", { children: isMulti ? 'Multi' : request.routing }), jsx("td", { className: sx(colDateStyle), children: jsx(Datepicker, { "aria-label": `Submitted date for request ${request.id}`, size: "sm", value: dateEdits[request.id]?.submittedDate ?? request.submittedDate ?? '', onChange: (event) => handleSubmittedDateChange(request.id, event.target.value), "data-test": "agent-gtr-submitted-date" }) }), jsx("td", { children: computeTravelTypeCodes(request).join(', ') }), jsx("td", { className: sx(colDateStyle), children: jsx(Datepicker, { "aria-label": `Quote sent date for request ${request.id}`, size: "sm", value: dateEdits[request.id]?.quoteSentDate ?? request.quoteSentDate ?? '', onChange: (event) => handleQuoteSentDateChange(request.id, event.target.value), "data-test": "agent-gtr-quote-sent-date" }) }), DUE_FIELDS.map(({ field }) => (jsx("td", { children: jsx(DueStatusCell, { status: request[field], today: today, onToggle: onToggleDueStatus ? () => onToggleDueStatus(request.id, field) : undefined }) }, field))), jsx("td", { children: isMulti ? (jsx(PnrButton, { label: "Multi", tone: groupPnrTone(request.pnrs), onClick: () => toggleExpanded(request.id), dataTest: "agent-gtr-pnr-multi" })) : (jsx(PnrButton, { label: request.pnrs[0].recordLocator.toUpperCase(), tone: pnrTone(request.pnrs[0]), onClick: () => handleCopyPnr(request.pnrs[0].recordLocator), dataTest: "agent-gtr-pnr" })) }), jsx("td", { className: sx(colDeleteStyle), children: !isMulti && onDeleteRequest && (jsx("button", { type: "button", className: sx(deleteButtonStyle), "aria-label": `Delete request ${request.id}`, title: "Click to delete this trip", onClick: () => onDeleteRequest(request.id), "data-test": "agent-gtr-delete", children: jsx(TrashIcon$2, { size: 16 }) })) })] }), isMulti && isExpanded && (jsx("tr", { className: sx(subPnrRowStyle), children: jsx("td", { colSpan: COLUMN_COUNT, children: jsx("div", { className: sx(subPnrPanelStyle), "data-test": "agent-gtr-sub-pnrs", children: request.pnrs.map((pnr) => (jsx(PnrButton, { label: pnr.recordLocator.toUpperCase(), tone: pnrTone(pnr), onClick: () => handleCopyPnr(pnr.recordLocator), dataTest: "agent-gtr-sub-pnr" }, pnr.id))) }) }) }))] }, request.id));
+                                        })] }, `account-${group.accountName}`)))] })] }) }), jsx("p", { className: sx(legendStyle$4), children: "Types: A - Airline C - Car, H - Hotel" })] }));
 };
 
 /**
@@ -10500,7 +10500,7 @@ const tableStyle$a = {
 };
 /* Header — navy brand ground with the side rail's foreground ink, matching the
    widget card headers. */
-const headerStyle$F = {
+const headerStyle$G = {
     label: 'Table-headerStyle',
     backgroundColor: 'var(--color-primary, #19345f)',
     borderBottom: '1px solid var(--nav-rail-border, rgb(255 255 255 / 8%))',
@@ -10537,11 +10537,11 @@ const sortableStyle$1 = {
     [`&:hover .${sx(sortIconStyle$2)}`]: { opacity: 1 },
 };
 /* Body */
-const bodyStyle$a = {
+const bodyStyle$b = {
     label: 'Table-bodyStyle',
     backgroundColor: 'white',
 };
-const rowStyle$6 = {
+const rowStyle$7 = {
     label: 'Table-rowStyle',
     borderBottom: '1px solid var(--color-neutral-100)',
     '&:last-child': { borderBottom: 'none' },
@@ -10603,23 +10603,23 @@ const stripedStyle = {
      * object they are emitted in this order every time rather than depending on
      * which style was injected first.
      */
-    [`& .${sx(rowStyle$6)}.${sx(selectedRowStyle)}`]: {
+    [`& .${sx(rowStyle$7)}.${sx(selectedRowStyle)}`]: {
         backgroundColor: 'var(--color-primary-light)',
     },
-    [`& .${sx(rowStyle$6)}:nth-child(even)`]: {
+    [`& .${sx(rowStyle$7)}:nth-child(even)`]: {
         backgroundColor: 'var(--color-neutral-50)',
     },
 };
 const hoverableStyle = {
     label: 'Table-hoverableStyle',
-    [`& .${sx(rowStyle$6)}.${sx(selectedRowStyle)}`]: {
+    [`& .${sx(rowStyle$7)}.${sx(selectedRowStyle)}`]: {
         backgroundColor: 'var(--color-primary-light)',
     },
-    [`& .${sx(rowStyle$6)}:hover`]: {
+    [`& .${sx(rowStyle$7)}:hover`]: {
         backgroundColor: 'var(--color-neutral-50)',
     },
     /* Outweighs both of the above, exactly as `.hoverable .row.selected:hover` did. */
-    [`& .${sx(rowStyle$6)}.${sx(selectedRowStyle)}:hover`]: {
+    [`& .${sx(rowStyle$7)}.${sx(selectedRowStyle)}:hover`]: {
         backgroundColor: 'var(--color-primary-light-hover)',
     },
 };
@@ -10741,11 +10741,11 @@ const Table = ({ columns, data, rowKey = 'id', bordered = false, striped = false
         commitSelection(Array.from(merged));
     };
     const messageColSpan = columns.length + (selectable ? 1 : 0);
-    return (jsx("div", { className: cx(sx(wrapperStyle$1), className), children: jsxs("table", { className: cx(sx(tableStyle$a), bordered && sx(borderedStyle$1), striped && sx(stripedStyle), hoverable && sx(hoverableStyle), compact && sx(compactStyle$1)), children: [jsx("thead", { className: sx(headerStyle$F), children: jsxs("tr", { children: [selectable && (jsx("th", { scope: "col", className: cx(sx(headerCellStyle), sx(selectCellStyle$1)), children: jsx(Checkbox, { size: "sm", "aria-label": selectAllLabel, checked: allSelected, indeterminate: someSelected, disabled: selectableRows.length === 0, onChange: toggleAll, "data-test": "table-select-all" }) })), columns.map((column) => (jsx("th", { className: cx(sx(headerCellStyle), column.sortable && sx(sortableStyle$1), sx(alignStyles[column.align || 'left'])), style: column.width ? { width: column.width } : undefined, onClick: () => handleSort(column), children: jsxs("span", { className: sx(headerContentStyle$2), children: [column.label, column.sortable && (jsx("span", { className: sx(sortIconStyle$2), children: sortColumn === column.key ? (sortDirection === 'asc' ? '↑' : '↓') : ('↕') }))] }) }, column.key)))] }) }), jsx("tbody", { className: sx(bodyStyle$a), children: loading ? (jsx("tr", { children: jsx("td", { colSpan: messageColSpan, className: sx(loadingStyle$5), children: "Loading..." }) })) : sortedData.length === 0 ? (jsx("tr", { children: jsx("td", { colSpan: messageColSpan, className: sx(emptyStyle$h), children: emptyContent ?? emptyMessage }) })) : (sortedData.map((row, rowIndex) => {
+    return (jsx("div", { className: cx(sx(wrapperStyle$1), className), children: jsxs("table", { className: cx(sx(tableStyle$a), bordered && sx(borderedStyle$1), striped && sx(stripedStyle), hoverable && sx(hoverableStyle), compact && sx(compactStyle$1)), children: [jsx("thead", { className: sx(headerStyle$G), children: jsxs("tr", { children: [selectable && (jsx("th", { scope: "col", className: cx(sx(headerCellStyle), sx(selectCellStyle$1)), children: jsx(Checkbox, { size: "sm", "aria-label": selectAllLabel, checked: allSelected, indeterminate: someSelected, disabled: selectableRows.length === 0, onChange: toggleAll, "data-test": "table-select-all" }) })), columns.map((column) => (jsx("th", { className: cx(sx(headerCellStyle), column.sortable && sx(sortableStyle$1), sx(alignStyles[column.align || 'left'])), style: column.width ? { width: column.width } : undefined, onClick: () => handleSort(column), children: jsxs("span", { className: sx(headerContentStyle$2), children: [column.label, column.sortable && (jsx("span", { className: sx(sortIconStyle$2), children: sortColumn === column.key ? (sortDirection === 'asc' ? '↑' : '↓') : ('↕') }))] }) }, column.key)))] }) }), jsx("tbody", { className: sx(bodyStyle$b), children: loading ? (jsx("tr", { children: jsx("td", { colSpan: messageColSpan, className: sx(loadingStyle$5), children: "Loading..." }) })) : sortedData.length === 0 ? (jsx("tr", { children: jsx("td", { colSpan: messageColSpan, className: sx(emptyStyle$h), children: emptyContent ?? emptyMessage }) })) : (sortedData.map((row, rowIndex) => {
                         const key = getRowKey(row, rowIndex);
                         const rowSelectable = isRowSelectable ? isRowSelectable(row, rowIndex) : true;
                         const isSelected = selectable && selectionSet.has(key);
-                        return (jsxs("tr", { className: cx(sx(rowStyle$6), onRowClick && sx(clickableStyle), isSelected && sx(selectedRowStyle), rowClassName?.(row, rowIndex)), "data-selected": selectable ? isSelected : undefined, onClick: () => onRowClick?.(row, rowIndex), children: [selectable && (jsx("td", { className: cx(sx(cellStyle$3), sx(selectCellStyle$1)), onClick: (event) => event.stopPropagation(), children: jsx(Checkbox, { size: "sm", "aria-label": rowSelectionLabel ? rowSelectionLabel(row, rowIndex) : `Select row ${key}`, checked: isSelected, disabled: !rowSelectable, onChange: () => toggleRow(key), "data-test": "table-select-row" }) })), columns.map((column) => (jsx("td", { className: cx(sx(cellStyle$3), sx(alignStyles[column.align || 'left'])), children: column.render
+                        return (jsxs("tr", { className: cx(sx(rowStyle$7), onRowClick && sx(clickableStyle), isSelected && sx(selectedRowStyle), rowClassName?.(row, rowIndex)), "data-selected": selectable ? isSelected : undefined, onClick: () => onRowClick?.(row, rowIndex), children: [selectable && (jsx("td", { className: cx(sx(cellStyle$3), sx(selectCellStyle$1)), onClick: (event) => event.stopPropagation(), children: jsx(Checkbox, { size: "sm", "aria-label": rowSelectionLabel ? rowSelectionLabel(row, rowIndex) : `Select row ${key}`, checked: isSelected, disabled: !rowSelectable, onChange: () => toggleRow(key), "data-test": "table-select-row" }) })), columns.map((column) => (jsx("td", { className: cx(sx(cellStyle$3), sx(alignStyles[column.align || 'left'])), children: column.render
                                         ? column.render(row[column.key], row, rowIndex)
                                         : row[column.key] }, column.key)))] }, key));
                     })) }), footer && jsx("tfoot", { children: footer })] }) }));
@@ -10757,7 +10757,7 @@ const Table = ({ columns, data, rowKey = 'id', bordered = false, striped = false
  * A bordered card: a header band with the title and Version control, then the
  * invoice table with its total row and legend.
  */
-const cardStyle$f = {
+const cardStyle$g = {
     label: 'AirInvoiceCard-cardStyle',
     overflow: 'hidden',
     backgroundColor: 'var(--bg-surface, #fff)',
@@ -10770,7 +10770,7 @@ const cardStyle$f = {
     lineHeight: '22px',
 };
 /* ---------- Card header ---------- */
-const headerStyle$E = {
+const headerStyle$F = {
     label: 'AirInvoiceCard-headerStyle',
     boxSizing: 'border-box',
     /* Fixed to the height of the Version control's row so the two cards' headers match. */
@@ -10901,7 +10901,7 @@ const totalCellStyle$1 = {
     gap: '4px 24px',
 };
 /* The legend reads as a footnote: regular weight, small, muted — even inside the bold total row. */
-const legendStyle$1 = {
+const legendStyle$3 = {
     label: 'AirInvoiceCard-legendStyle',
     display: 'inline-flex',
     alignItems: 'center',
@@ -10937,10 +10937,10 @@ const versionControlShown = (versions) => versions.length > 1;
  */
 const AirInvoiceCard = ({ title, lines, paymentStatus, total, versions = [], selectedVersionId, onVersionChange, className = '', }) => {
     const showLegend = lines.some((line) => line.knownTraveler);
-    const legend = (jsxs("span", { className: sx(legendStyle$1), "data-test": "air-invoice-legend", children: [jsx("span", { className: sx(knownTravelerStyle), children: jsx(CheckIcon$1, { size: 16 }) }), "= Known Traveler Number Loaded"] }));
+    const legend = (jsxs("span", { className: sx(legendStyle$3), "data-test": "air-invoice-legend", children: [jsx("span", { className: sx(knownTravelerStyle), children: jsx(CheckIcon$1, { size: 16 }) }), "= Known Traveler Number Loaded"] }));
     const hasHeader = Boolean(title || versionControlShown(versions));
     const versionControl = versionControlShown(versions) && (jsx(Dropdown, { label: "Version", alignment: "right", trigger: ({ isOpen, toggle }) => (jsxs("button", { type: "button", className: sx(versionButtonStyle), onClick: toggle, "aria-expanded": isOpen, "aria-haspopup": "menu", "data-test": "air-invoice-version", children: [jsx(LayersIcon, {}), "Version", jsx("span", { className: sx(versionCountStyle), children: versions.length }), jsx(ChevronDownIcon$1, { size: 16 })] })), children: versions.map((version) => (jsx(Dropdown.Item, { icon: version.id === selectedVersionId ? jsx(CheckIcon$1, { size: 14 }) : undefined, onClick: () => onVersionChange?.(version.id), children: version.label }, version.id))) }));
-    return (jsxs("section", { className: cx(sx(cardStyle$f), className), "aria-label": "Air invoice", "data-test": "air-invoice-card", children: [hasHeader && (jsxs("div", { className: sx(headerStyle$E), children: [title && jsx("h2", { className: sx(titleStyle$A), children: title }), jsx("div", { className: sx(headerEndStyle), children: versionControl })] })), jsx(Table, { className: sx(tableStyle$9), columns: columns, data: lines, hoverable: false, rowClassName: (line) => cx(line.isVoid && sx(voidRowStyle), line.struckThrough && sx(struckRowStyle)) || undefined, footer: total && (jsxs("tr", { children: [jsx("td", { colSpan: 6, children: jsxs("span", { className: sx(totalCellStyle$1), children: ["Total", showLegend && legend] }) }), jsx("td", { className: sx(upperStyle), children: paymentStatus }), jsx("td", { "data-test": "air-invoice-total", children: total })] })) }), showLegend && !total && (jsx("p", { className: sx(legendBlockStyle), children: legend }))] }));
+    return (jsxs("section", { className: cx(sx(cardStyle$g), className), "aria-label": "Air invoice", "data-test": "air-invoice-card", children: [hasHeader && (jsxs("div", { className: sx(headerStyle$F), children: [title && jsx("h2", { className: sx(titleStyle$A), children: title }), jsx("div", { className: sx(headerEndStyle), children: versionControl })] })), jsx(Table, { className: sx(tableStyle$9), columns: columns, data: lines, hoverable: false, rowClassName: (line) => cx(line.isVoid && sx(voidRowStyle), line.struckThrough && sx(struckRowStyle)) || undefined, footer: total && (jsxs("tr", { children: [jsx("td", { colSpan: 6, children: jsxs("span", { className: sx(totalCellStyle$1), children: ["Total", showLegend && legend] }) }), jsx("td", { className: sx(upperStyle), children: paymentStatus }), jsx("td", { "data-test": "air-invoice-total", children: total })] })) }), showLegend && !total && (jsx("p", { className: sx(legendBlockStyle), children: legend }))] }));
 };
 AirInvoiceCard.displayName = 'AirInvoiceCard';
 
@@ -11091,7 +11091,7 @@ const labelStyle$5 = {
     textOverflow: 'ellipsis',
 };
 /* Footer */
-const footerStyle$c = {
+const footerStyle$e = {
     label: 'Sidenav-footerStyle',
     padding: 'var(--space-5) var(--space-6)',
     marginTop: 'auto',
@@ -11122,7 +11122,7 @@ const collapsedStyle$1 = {
         padding: 0,
         justifyContent: 'center',
     },
-    [`& .${sx(footerStyle$c)}`]: {
+    [`& .${sx(footerStyle$e)}`]: {
         padding: 'var(--space-5) var(--space-4)',
         display: 'flex',
         justifyContent: 'center',
@@ -11148,7 +11148,7 @@ const Sidenav = ({ logo, logoCollapsed, items, activeKey, onItemClick, defaultEx
                     const isActive = item.key === activeKey;
                     const itemClasses = cx(sx(navItemStyle$1), isActive && sx(activeNavItemStyle));
                     return (jsxs("button", { className: itemClasses, onClick: () => handleItemClick(item), "aria-current": isActive ? 'page' : undefined, title: !expanded ? item.label : undefined, children: [jsx("span", { className: sx(iconStyle$3), children: item.icon }), expanded && jsx("span", { className: sx(labelStyle$5), children: item.label })] }, item.key));
-                }) }), footer && jsx("div", { className: sx(footerStyle$c), children: footer })] }));
+                }) }), footer && jsx("div", { className: sx(footerStyle$e), children: footer })] }));
 };
 Sidenav.displayName = 'Sidenav';
 
@@ -11393,7 +11393,7 @@ const noResultsStyle = {
     fontSize: 14,
 };
 /* Actions */
-const actionsStyle$8 = {
+const actionsStyle$9 = {
     label: 'Topbar-actionsStyle',
     display: 'flex',
     gap: 'var(--space-2, 8px)',
@@ -11458,7 +11458,7 @@ const Topbar = ({ account, accounts, onAccountSelect, onAccountClick, actions, l
     const filteredAccounts = accounts?.filter(acc => acc.name.toLowerCase().includes(searchQuery.toLowerCase()) ||
         acc.code.toLowerCase().includes(searchQuery.toLowerCase())) || [];
     const hasDropdown = accounts && accounts.length > 0;
-    return (jsxs("header", { className: classNames, ...props, children: [jsxs("div", { className: sx(leftStyle), children: [leftContent, account && (jsxs("div", { className: sx(accountWrapperStyle), ref: dropdownRef, children: [jsxs("button", { className: cx(sx(accountSelectorStyle), isOpen && sx(openStyle$1)), onClick: handleToggle, "aria-expanded": isOpen, "aria-haspopup": hasDropdown ? 'listbox' : undefined, children: [jsx("span", { className: sx(accountCodeStyle), children: account.code }), jsx("span", { className: sx(accountNameStyle), children: account.name }), hasDropdown && (jsx(ChevronDownIcon$1, { size: 16, className: cx(sx(chevronStyle$2), isOpen && sx(chevronOpenStyle)) }))] }), isOpen && hasDropdown && (jsxs("div", { className: sx(dropdownStyle), role: "listbox", children: [jsxs("div", { className: sx(dropdownSearchStyle), children: [jsxs("svg", { className: sx(searchIconStyle$1), width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [jsx("circle", { cx: "11", cy: "11", r: "8" }), jsx("line", { x1: "21", y1: "21", x2: "16.65", y2: "16.65" })] }), jsx("input", { ref: searchInputRef, type: "text", value: searchQuery, onChange: (e) => setSearchQuery(e.target.value), placeholder: "Search accounts...", className: sx(searchInputStyle$1) })] }), jsx("div", { className: sx(dropdownListStyle), children: filteredAccounts.length > 0 ? (filteredAccounts.map((acc) => (jsxs("button", { className: cx(sx(dropdownItemStyle), acc.code === account.code && sx(selectedStyle$2)), onClick: () => handleSelectAccount(acc), role: "option", "aria-selected": acc.code === account.code, children: [jsx("span", { className: sx(dropdownItemCodeStyle), children: acc.code }), jsx("span", { className: sx(dropdownItemNameStyle), children: acc.name })] }, acc.code)))) : (jsx("div", { className: sx(noResultsStyle), children: "No accounts found" })) })] }))] }))] }), actions && jsx("div", { className: sx(actionsStyle$8), children: actions })] }));
+    return (jsxs("header", { className: classNames, ...props, children: [jsxs("div", { className: sx(leftStyle), children: [leftContent, account && (jsxs("div", { className: sx(accountWrapperStyle), ref: dropdownRef, children: [jsxs("button", { className: cx(sx(accountSelectorStyle), isOpen && sx(openStyle$1)), onClick: handleToggle, "aria-expanded": isOpen, "aria-haspopup": hasDropdown ? 'listbox' : undefined, children: [jsx("span", { className: sx(accountCodeStyle), children: account.code }), jsx("span", { className: sx(accountNameStyle), children: account.name }), hasDropdown && (jsx(ChevronDownIcon$1, { size: 16, className: cx(sx(chevronStyle$2), isOpen && sx(chevronOpenStyle)) }))] }), isOpen && hasDropdown && (jsxs("div", { className: sx(dropdownStyle), role: "listbox", children: [jsxs("div", { className: sx(dropdownSearchStyle), children: [jsxs("svg", { className: sx(searchIconStyle$1), width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [jsx("circle", { cx: "11", cy: "11", r: "8" }), jsx("line", { x1: "21", y1: "21", x2: "16.65", y2: "16.65" })] }), jsx("input", { ref: searchInputRef, type: "text", value: searchQuery, onChange: (e) => setSearchQuery(e.target.value), placeholder: "Search accounts...", className: sx(searchInputStyle$1) })] }), jsx("div", { className: sx(dropdownListStyle), children: filteredAccounts.length > 0 ? (filteredAccounts.map((acc) => (jsxs("button", { className: cx(sx(dropdownItemStyle), acc.code === account.code && sx(selectedStyle$2)), onClick: () => handleSelectAccount(acc), role: "option", "aria-selected": acc.code === account.code, children: [jsx("span", { className: sx(dropdownItemCodeStyle), children: acc.code }), jsx("span", { className: sx(dropdownItemNameStyle), children: acc.name })] }, acc.code)))) : (jsx("div", { className: sx(noResultsStyle), children: "No accounts found" })) })] }))] }))] }), actions && jsx("div", { className: sx(actionsStyle$9), children: actions })] }));
 };
 Topbar.displayName = 'Topbar';
 
@@ -11511,7 +11511,7 @@ const AppLayout = ({ navItems = [], activeNavKey, logo, collapsedLogo, account,
  * Shares the AirInvoiceCard's shell — bordered card, header band with a small
  * uppercase title — so the two read as a set when stacked on a page.
  */
-const cardStyle$e = {
+const cardStyle$f = {
     label: 'BookingDetailsCard-cardStyle',
     overflow: 'hidden',
     backgroundColor: 'var(--bg-surface, #fff)',
@@ -11523,7 +11523,7 @@ const cardStyle$e = {
     fontSize: 15,
     lineHeight: '22px',
 };
-const headerStyle$D = {
+const headerStyle$E = {
     label: 'BookingDetailsCard-headerStyle',
     boxSizing: 'border-box',
     /* Fixed to the height of the Version control's row so the two cards' headers match. */
@@ -11612,12 +11612,12 @@ const BookingDetailsCard = ({ details, title = 'Booking Details', refId, childre
     if (details.length === 0 && !children)
         return null;
     const rows = Math.ceil(details.length / 2);
-    return (jsxs("section", { className: cx(sx(cardStyle$e), className), "aria-label": "Booking details", "data-test": "booking-details-card", children: [jsxs("div", { className: sx(headerStyle$D), children: [jsx("h2", { className: sx(titleStyle$z), children: title }), refId && (jsxs("p", { className: sx(refStyle), "data-test": "booking-details-ref", children: ["Short\u2019s ID: ", jsx("span", { className: sx(refValueStyle), children: refId })] }))] }), details.length > 0 && (jsx("dl", { className: sx(detailsStyle$2), style: { gridTemplateRows: `repeat(${rows}, auto)` }, children: details.map((detail) => (jsxs("div", { className: sx(detailStyle$2), children: [jsx("dt", { className: sx(detailLabelStyle$1), children: detail.label }), jsx("dd", { className: sx(detailValueStyle$1), children: detail.value })] }, detail.label))) })), children && jsx("div", { className: cx(sx(sectionStyle$8), details.length > 0 && sx(sectionRuleStyle)), "data-test": "booking-details-section", children: children })] }));
+    return (jsxs("section", { className: cx(sx(cardStyle$f), className), "aria-label": "Booking details", "data-test": "booking-details-card", children: [jsxs("div", { className: sx(headerStyle$E), children: [jsx("h2", { className: sx(titleStyle$z), children: title }), refId && (jsxs("p", { className: sx(refStyle), "data-test": "booking-details-ref", children: ["Short\u2019s ID: ", jsx("span", { className: sx(refValueStyle), children: refId })] }))] }), details.length > 0 && (jsx("dl", { className: sx(detailsStyle$2), style: { gridTemplateRows: `repeat(${rows}, auto)` }, children: details.map((detail) => (jsxs("div", { className: sx(detailStyle$2), children: [jsx("dt", { className: sx(detailLabelStyle$1), children: detail.label }), jsx("dd", { className: sx(detailValueStyle$1), children: detail.value })] }, detail.label))) })), children && jsx("div", { className: cx(sx(sectionStyle$8), details.length > 0 && sx(sectionRuleStyle)), "data-test": "booking-details-section", children: children })] }));
 };
 BookingDetailsCard.displayName = 'BookingDetailsCard';
 
 /* Card Component Styles */
-const cardStyle$d = {
+const cardStyle$e = {
     label: 'Card-cardStyle',
     background: 'var(--bg-surface)',
     borderRadius: 'var(--radius-2xl)',
@@ -11665,7 +11665,7 @@ const paddingStyles = {
     },
 };
 /* Card Header */
-const headerStyle$C = {
+const headerStyle$D = {
     label: 'Card-headerStyle',
     display: 'flex',
     alignItems: 'flex-start',
@@ -11693,19 +11693,19 @@ const subtitleStyle$7 = {
     fontSize: 'var(--fs-sm)',
     color: 'var(--fg-3)',
 };
-const actionsStyle$7 = {
+const actionsStyle$8 = {
     label: 'Card-actionsStyle',
     display: 'flex',
     gap: 'var(--space-2)',
     flexShrink: 0,
 };
 /* Card Body */
-const bodyStyle$9 = {
+const bodyStyle$a = {
     label: 'Card-bodyStyle',
     padding: 'var(--space-4)',
 };
 /* Card Footer */
-const footerStyle$b = {
+const footerStyle$d = {
     label: 'Card-footerStyle',
     display: 'flex',
     alignItems: 'center',
@@ -11728,7 +11728,7 @@ const footerStyle$b = {
  * Card component for grouping related content.
  */
 const Card = forwardRef(({ variant = 'default', padding = 'md', interactive = false, className = '', children, ...props }, ref) => {
-    const classNames = cx(sx(cardStyle$d), sx(variantStyles[variant]), sx(paddingStyles[padding]), interactive && sx(interactiveStyle), className);
+    const classNames = cx(sx(cardStyle$e), sx(variantStyles[variant]), sx(paddingStyles[padding]), interactive && sx(interactiveStyle), className);
     return (jsx("div", { ref: ref, className: classNames, ...props, children: children }));
 });
 Card.displayName = 'Card';
@@ -11736,15 +11736,15 @@ Card.displayName = 'Card';
  * Top of a Card: title, subtitle, and any header actions.
  */
 const CardHeader = ({ title, subtitle, actions, className = '', children, ...props }) => {
-    const classNames = cx(sx(headerStyle$C), className);
-    return (jsxs("div", { className: classNames, ...props, children: [jsxs("div", { className: sx(headerContentStyle$1), children: [title && jsx("h3", { className: sx(titleStyle$y), children: title }), subtitle && jsx("p", { className: sx(subtitleStyle$7), children: subtitle }), children] }), actions && jsx("div", { className: sx(actionsStyle$7), children: actions })] }));
+    const classNames = cx(sx(headerStyle$D), className);
+    return (jsxs("div", { className: classNames, ...props, children: [jsxs("div", { className: sx(headerContentStyle$1), children: [title && jsx("h3", { className: sx(titleStyle$y), children: title }), subtitle && jsx("p", { className: sx(subtitleStyle$7), children: subtitle }), children] }), actions && jsx("div", { className: sx(actionsStyle$8), children: actions })] }));
 };
 CardHeader.displayName = 'CardHeader';
 /**
  * Main content region of a Card, carrying the card padding.
  */
 const CardBody = ({ className = '', children, ...props }) => {
-    const classNames = cx(sx(bodyStyle$9), className);
+    const classNames = cx(sx(bodyStyle$a), className);
     return (jsx("div", { className: classNames, ...props, children: children }));
 };
 CardBody.displayName = 'CardBody';
@@ -11752,7 +11752,7 @@ CardBody.displayName = 'CardBody';
  * Bottom of a Card, for actions and summary detail.
  */
 const CardFooter = ({ className = '', children, ...props }) => {
-    const classNames = cx(sx(footerStyle$b), className);
+    const classNames = cx(sx(footerStyle$d), className);
     return (jsx("div", { className: classNames, ...props, children: children }));
 };
 CardFooter.displayName = 'CardFooter';
@@ -12440,7 +12440,7 @@ const alertStyle$4 = {
     label: 'ContactList-alertStyle', width: '100%'
 };
 /* Card */
-const cardStyle$c = {
+const cardStyle$d = {
     label: 'ContactList-cardStyle',
     backgroundColor: 'var(--color-white)',
     border: '1px solid var(--color-gray-200)',
@@ -12448,7 +12448,7 @@ const cardStyle$c = {
     overflow: 'hidden',
 };
 /* Header */
-const headerStyle$B = {
+const headerStyle$C = {
     label: 'ContactList-headerStyle',
     padding: 'var(--space-4)',
     borderBottom: '1px solid var(--color-gray-100)',
@@ -12609,7 +12609,7 @@ const emptyStyle$f = {
     fontSize: 'var(--text-sm)',
 };
 /* Footer */
-const footerStyle$a = {
+const footerStyle$c = {
     label: 'ContactList-footerStyle',
     padding: 'var(--space-3) var(--space-4)',
     borderTop: '1px solid var(--color-gray-100)',
@@ -12645,7 +12645,7 @@ const PlusIcon$1 = () => (jsxs("svg", { width: "16", height: "16", viewBox: "0 0
  */
 const ContactList = ({ title = 'Contacts', tooltip, contacts, onEdit, onRemove, onAdd, showAdd = true, addLabel = 'Add Contact', alert, className = '', }) => {
     const listClasses = cx(sx(containerStyle$3), className);
-    return (jsxs("div", { className: listClasses, children: [alert && (jsx("div", { className: sx(alertStyle$4), children: alert })), jsxs("div", { className: sx(cardStyle$c), children: [jsx("div", { className: sx(headerStyle$B), children: jsxs("div", { className: sx(titleRowStyle$4), children: [jsx("h3", { className: sx(titleStyle$x), children: title }), tooltip && (jsx("span", { className: sx(tooltipStyle), children: jsx(InfoIcon, {}) }))] }) }), jsxs("div", { className: sx(listStyle$4), children: [contacts.map((contact) => (jsxs("div", { className: sx(contactItemStyle), children: [jsxs("div", { className: sx(contactInfoStyle), children: [jsxs("div", { className: sx(contactNameStyle$1), children: [contact.name, contact.isPrimary && (jsx("span", { className: sx(badgeStyle$2), children: "Primary" })), contact.isSecondary && (jsx("span", { className: cx(sx(badgeStyle$2), sx(badgeSecondaryStyle)), children: "Secondary" }))] }), contact.role && (jsx("div", { className: sx(contactRoleStyle$1), children: contact.role })), jsxs("div", { className: sx(contactDetailsStyle$1), children: [contact.email && (jsx("a", { href: `mailto:${contact.email}`, className: sx(contactLinkStyle$2), children: contact.email })), contact.phone && (jsx("span", { className: sx(contactPhoneStyle), children: contact.phone }))] })] }), jsxs("div", { className: sx(contactActionsStyle), children: [onEdit && (jsx("button", { type: "button", className: sx(actionButtonStyle$1), onClick: () => onEdit(contact), "aria-label": "Edit contact", children: jsx(EditIcon$1, {}) })), onRemove && (jsx("button", { type: "button", className: cx(sx(actionButtonStyle$1), sx(actionButtonDangerStyle)), onClick: () => onRemove(contact), "aria-label": "Remove contact", children: jsx(TrashIcon$1, {}) }))] })] }, contact.id))), contacts.length === 0 && (jsx("div", { className: sx(emptyStyle$f), children: "No contacts added" }))] }), showAdd && onAdd && (jsx("div", { className: sx(footerStyle$a), children: jsxs("button", { type: "button", className: sx(addButtonStyle$1), onClick: onAdd, children: [jsx(PlusIcon$1, {}), addLabel] }) }))] })] }));
+    return (jsxs("div", { className: listClasses, children: [alert && (jsx("div", { className: sx(alertStyle$4), children: alert })), jsxs("div", { className: sx(cardStyle$d), children: [jsx("div", { className: sx(headerStyle$C), children: jsxs("div", { className: sx(titleRowStyle$4), children: [jsx("h3", { className: sx(titleStyle$x), children: title }), tooltip && (jsx("span", { className: sx(tooltipStyle), children: jsx(InfoIcon, {}) }))] }) }), jsxs("div", { className: sx(listStyle$4), children: [contacts.map((contact) => (jsxs("div", { className: sx(contactItemStyle), children: [jsxs("div", { className: sx(contactInfoStyle), children: [jsxs("div", { className: sx(contactNameStyle$1), children: [contact.name, contact.isPrimary && (jsx("span", { className: sx(badgeStyle$2), children: "Primary" })), contact.isSecondary && (jsx("span", { className: cx(sx(badgeStyle$2), sx(badgeSecondaryStyle)), children: "Secondary" }))] }), contact.role && (jsx("div", { className: sx(contactRoleStyle$1), children: contact.role })), jsxs("div", { className: sx(contactDetailsStyle$1), children: [contact.email && (jsx("a", { href: `mailto:${contact.email}`, className: sx(contactLinkStyle$2), children: contact.email })), contact.phone && (jsx("span", { className: sx(contactPhoneStyle), children: contact.phone }))] })] }), jsxs("div", { className: sx(contactActionsStyle), children: [onEdit && (jsx("button", { type: "button", className: sx(actionButtonStyle$1), onClick: () => onEdit(contact), "aria-label": "Edit contact", children: jsx(EditIcon$1, {}) })), onRemove && (jsx("button", { type: "button", className: cx(sx(actionButtonStyle$1), sx(actionButtonDangerStyle)), onClick: () => onRemove(contact), "aria-label": "Remove contact", children: jsx(TrashIcon$1, {}) }))] })] }, contact.id))), contacts.length === 0 && (jsx("div", { className: sx(emptyStyle$f), children: "No contacts added" }))] }), showAdd && onAdd && (jsx("div", { className: sx(footerStyle$c), children: jsxs("button", { type: "button", className: sx(addButtonStyle$1), onClick: onAdd, children: [jsx(PlusIcon$1, {}), addLabel] }) }))] })] }));
 };
 ContactList.displayName = 'ContactList';
 
@@ -12771,7 +12771,7 @@ const sizeStyles$2 = {
     top: blockSizeStyles,
     bottom: blockSizeStyles,
 };
-const headerStyle$A = {
+const headerStyle$B = {
     label: 'Drawer-headerStyle',
     display: 'flex',
     alignItems: 'center',
@@ -12813,13 +12813,13 @@ const closeButtonStyle$2 = {
         outlineOffset: 2,
     },
 };
-const bodyStyle$8 = {
+const bodyStyle$9 = {
     label: 'Drawer-bodyStyle',
     flex: 1,
     padding: 'var(--space-4)',
     overflowY: 'auto',
 };
-const footerStyle$9 = {
+const footerStyle$b = {
     label: 'Drawer-footerStyle',
     padding: 'var(--space-4)',
     borderTop: '1px solid var(--color-neutral-200)',
@@ -12830,15 +12830,15 @@ const footerStyle$9 = {
 /**
  * Top of a Drawer: title and the close affordance.
  */
-const DrawerHeader = ({ title, children, showClose = true, onClose, className = '', }) => (jsxs("div", { className: cx(sx(headerStyle$A), className), children: [jsxs("div", { className: sx(headerContentStyle), children: [title && jsx("h2", { className: sx(titleStyle$w), children: title }), children] }), showClose && (jsx("button", { type: "button", className: sx(closeButtonStyle$2), onClick: onClose, "aria-label": "Close drawer", children: jsx("svg", { width: "20", height: "20", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) }) }))] }));
+const DrawerHeader = ({ title, children, showClose = true, onClose, className = '', }) => (jsxs("div", { className: cx(sx(headerStyle$B), className), children: [jsxs("div", { className: sx(headerContentStyle), children: [title && jsx("h2", { className: sx(titleStyle$w), children: title }), children] }), showClose && (jsx("button", { type: "button", className: sx(closeButtonStyle$2), onClick: onClose, "aria-label": "Close drawer", children: jsx("svg", { width: "20", height: "20", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) }) }))] }));
 /**
  * Scrollable content region of a Drawer.
  */
-const DrawerBody = ({ children, className = '' }) => (jsx("div", { className: cx(sx(bodyStyle$8), className), children: children }));
+const DrawerBody = ({ children, className = '' }) => (jsx("div", { className: cx(sx(bodyStyle$9), className), children: children }));
 /**
  * Bottom of a Drawer, for actions that stay visible while the body scrolls.
  */
-const DrawerFooter = ({ children, className = '' }) => (jsx("div", { className: cx(sx(footerStyle$9), className), children: children }));
+const DrawerFooter = ({ children, className = '' }) => (jsx("div", { className: cx(sx(footerStyle$b), className), children: children }));
 const FOCUSABLE = 'a[href], button:not([disabled]), input:not([disabled]), select:not([disabled]), ' +
     'textarea:not([disabled]), [tabindex]:not([tabindex="-1"])';
 /**
@@ -12996,7 +12996,7 @@ const openStyle = {
         },
     },
 };
-const bodyStyle$7 = {
+const bodyStyle$8 = {
     label: 'DueDatesDrawer-bodyStyle',
     minHeight: 0,
     flex: 1,
@@ -13044,7 +13044,7 @@ const emptyStyle$e = {
     padding: '16px 8px 0',
     color: 'var(--color-stone, #787878)',
 };
-const cardStyle$b = {
+const cardStyle$c = {
     label: 'DueDatesDrawer-cardStyle',
     display: 'flex',
     flexDirection: 'column',
@@ -13168,7 +13168,7 @@ const DueDateCard$1 = ({ item, onToggle, onTaskClick }) => {
     const completed = isTravelDueDateCompleted(item);
     const dueDate = parseLocalDate$1(item.duedate);
     const pastDue = !!dueDate && dueDate < new Date() && !completed;
-    return (jsxs("article", { className: sx(cardStyle$b), children: [jsxs("div", { className: sx(cardTitleStyle$3), children: [onToggle ? (jsx("button", { type: "button", "aria-label": `${completed ? 'Reopen' : 'Complete'} ${item.tasktitle}`, className: cx(sx(statusStyle$5), completed ? sx(completedStyle) : pastDue ? sx(pastDueStyle) : ''), onClick: () => onToggle(item), "data-test": `due-date-toggle-${item.taskid}`, children: completed ? jsx(CheckIcon$1, { size: 12 }) : null })) : (jsx("span", { "aria-label": `${completed ? 'Completed' : pastDue ? 'Past due' : 'Incomplete'}: ${item.tasktitle}`, className: cx(sx(statusStyle$5), sx(readOnlyStatusStyle), completed ? sx(completedStyle) : pastDue ? sx(pastDueStyle) : ''), "data-test": `due-date-status-${item.taskid}`, children: completed ? jsx(CheckIcon$1, { size: 12 }) : null })), jsx("h5", { children: item.tasktitle })] }), item.description && jsx("p", { children: item.description }), jsxs("div", { className: sx(tagsStyle), children: [jsx("span", { style: { backgroundColor: sportColor$1(item.sportCode) }, children: item.sportCode }), jsx("button", { type: "button", disabled: !item.masterTripGUID || !onTaskClick, onClick: () => item.masterTripGUID && onTaskClick?.(item.masterTripGUID), children: item.tripName })] }), completed && item.completeddatetime && jsxs("div", { className: sx(completionStyle), children: [jsx(CheckIcon$1, { size: 14 }), jsxs("span", { children: [jsx("em", { children: "on" }), " ", formatDate$8(item.completeddatetime, { month: 'numeric', day: 'numeric', year: '2-digit' }), " ", jsx("em", { children: "by" }), " ", item.completedby] })] })] }));
+    return (jsxs("article", { className: sx(cardStyle$c), children: [jsxs("div", { className: sx(cardTitleStyle$3), children: [onToggle ? (jsx("button", { type: "button", "aria-label": `${completed ? 'Reopen' : 'Complete'} ${item.tasktitle}`, className: cx(sx(statusStyle$5), completed ? sx(completedStyle) : pastDue ? sx(pastDueStyle) : ''), onClick: () => onToggle(item), "data-test": `due-date-toggle-${item.taskid}`, children: completed ? jsx(CheckIcon$1, { size: 12 }) : null })) : (jsx("span", { "aria-label": `${completed ? 'Completed' : pastDue ? 'Past due' : 'Incomplete'}: ${item.tasktitle}`, className: cx(sx(statusStyle$5), sx(readOnlyStatusStyle), completed ? sx(completedStyle) : pastDue ? sx(pastDueStyle) : ''), "data-test": `due-date-status-${item.taskid}`, children: completed ? jsx(CheckIcon$1, { size: 12 }) : null })), jsx("h5", { children: item.tasktitle })] }), item.description && jsx("p", { children: item.description }), jsxs("div", { className: sx(tagsStyle), children: [jsx("span", { style: { backgroundColor: sportColor$1(item.sportCode) }, children: item.sportCode }), jsx("button", { type: "button", disabled: !item.masterTripGUID || !onTaskClick, onClick: () => item.masterTripGUID && onTaskClick?.(item.masterTripGUID), children: item.tripName })] }), completed && item.completeddatetime && jsxs("div", { className: sx(completionStyle), children: [jsx(CheckIcon$1, { size: 14 }), jsxs("span", { children: [jsx("em", { children: "on" }), " ", formatDate$8(item.completeddatetime, { month: 'numeric', day: 'numeric', year: '2-digit' }), " ", jsx("em", { children: "by" }), " ", item.completedby] })] })] }));
 };
 /** Hub's searchable, status-aware due-dates drawer. */
 const DueDatesDrawer = ({ isOpen, dueDates, selectedDate, selectedTrip, overdueOnly, onClose, onToggle, onTaskClick, className = '' }) => {
@@ -13180,7 +13180,7 @@ const DueDatesDrawer = ({ isOpen, dueDates, selectedDate, selectedTrip, overdueO
         const matches = items.filter((item) => (!selectedTrip || item.masterTripGUID === String(selectedTrip)) && (!overdueOnly || isTravelDueDateOverdue(item)) && (!normalized || item.tasktitle.toLowerCase().includes(normalized) || item.sportCode.toLowerCase().includes(normalized) || item.description.toLowerCase().includes(normalized)));
         return matches.length ? [[date, matches]] : [];
     })), [dueDates, search, selectedDate, selectedTrip, overdueOnly]);
-    return (jsxs("aside", { className: cx(sx(drawerStyle), isOpen && sx(openStyle), className), "aria-hidden": !isOpen, "aria-label": "Due Dates", children: [jsxs("header", { children: [jsx("h3", { children: "Due Dates" }), jsx("button", { type: "button", "aria-label": "Close due dates", onClick: onClose, children: jsx(CloseIcon, { size: 24 }) })] }), jsxs("div", { className: sx(bodyStyle$7), children: [jsxs("label", { className: sx(searchStyle$1), children: [jsx(SearchIcon$1, { size: 16 }), jsx("input", { type: "search", placeholder: "Search", value: search, onChange: (event) => setSearch(event.target.value) })] }), !Object.keys(filtered).length ? jsx("div", { className: sx(emptyStyle$e), children: "No due dates found." }) : Object.entries(filtered).map(([date, items]) => (jsxs("section", { children: [jsx("h4", { children: formatDate$8(date, { month: 'long', day: 'numeric', year: 'numeric' }) }), jsx("div", { className: sx(cardsStyle$2), children: items.map((item) => jsx(DueDateCard$1, { item: item, onToggle: onToggle, onTaskClick: onTaskClick }, `${date}-${item.taskid}`)) })] }, date)))] })] }));
+    return (jsxs("aside", { className: cx(sx(drawerStyle), isOpen && sx(openStyle), className), "aria-hidden": !isOpen, "aria-label": "Due Dates", children: [jsxs("header", { children: [jsx("h3", { children: "Due Dates" }), jsx("button", { type: "button", "aria-label": "Close due dates", onClick: onClose, children: jsx(CloseIcon, { size: 24 }) })] }), jsxs("div", { className: sx(bodyStyle$8), children: [jsxs("label", { className: sx(searchStyle$1), children: [jsx(SearchIcon$1, { size: 16 }), jsx("input", { type: "search", placeholder: "Search", value: search, onChange: (event) => setSearch(event.target.value) })] }), !Object.keys(filtered).length ? jsx("div", { className: sx(emptyStyle$e), children: "No due dates found." }) : Object.entries(filtered).map(([date, items]) => (jsxs("section", { children: [jsx("h4", { children: formatDate$8(date, { month: 'long', day: 'numeric', year: 'numeric' }) }), jsx("div", { className: sx(cardsStyle$2), children: items.map((item) => jsx(DueDateCard$1, { item: item, onToggle: onToggle, onTaskClick: onTaskClick }, `${date}-${item.taskid}`)) })] }, date)))] })] }));
 };
 
 /**
@@ -13192,7 +13192,7 @@ const panelStyle$5 = {
     label: 'Flyout-panelStyle',
     background: 'var(--color-white)',
 };
-const headerStyle$z = {
+const headerStyle$A = {
     label: 'Flyout-headerStyle',
     '&&': { padding: 'var(--space-5) var(--space-6)' },
 };
@@ -13210,7 +13210,7 @@ const titleStyle$v = {
     fontWeight: 'var(--font-weight-bold)',
     color: 'var(--color-ink)',
 };
-const bodyStyle$6 = {
+const bodyStyle$7 = {
     label: 'Flyout-bodyStyle',
     '&&': { padding: 'var(--space-6)' },
 };
@@ -13228,7 +13228,7 @@ const Flyout = ({ isOpen, onClose, title, icon, children, footer, width = 'min(4
     const titleId = useId();
     if (!isOpen || typeof document === 'undefined')
         return null;
-    return createPortal(jsxs(Drawer, { "aria-labelledby": titleId, className: sx(panelStyle$5), isOpen: isOpen, onClose: onClose, position: "right", size: width, children: [jsx(DrawerHeader, { className: sx(headerStyle$z), children: jsxs("div", { className: sx(titleRowStyle$3), children: [icon, jsx("h2", { className: sx(titleStyle$v), id: titleId, children: title })] }) }), jsx(DrawerBody, { className: sx(bodyStyle$6), children: children }), footer && jsx(DrawerFooter, { children: footer })] }), document.body);
+    return createPortal(jsxs(Drawer, { "aria-labelledby": titleId, className: sx(panelStyle$5), isOpen: isOpen, onClose: onClose, position: "right", size: width, children: [jsx(DrawerHeader, { className: sx(headerStyle$A), children: jsxs("div", { className: sx(titleRowStyle$3), children: [icon, jsx("h2", { className: sx(titleStyle$v), id: titleId, children: title })] }) }), jsx(DrawerBody, { className: sx(bodyStyle$7), children: children }), footer && jsx(DrawerFooter, { children: footer })] }), document.body);
 };
 
 /**
@@ -13240,7 +13240,7 @@ const Flyout = ({ isOpen, onClose, title, icon, children, footer, width = 'min(4
  * No specificity work was needed — the media query is the only override, and
  * an at-rule always outranks the base declaration it sits beside.
  */
-const headerStyle$y = {
+const headerStyle$z = {
     label: 'GridHeaderRow-headerStyle',
     display: 'none',
     width: '100%',
@@ -13287,7 +13287,7 @@ const headingStyle$3 = {
  * carrying its own labels, so a detached heading strip would caption nothing.
  */
 function GridHeaderRow({ columns, gridTemplateColumns, above, below, className = '', style, }) {
-    return (jsxs("div", { className: cx(sx(headerStyle$y), className), style: style, "data-testid": "grid-header-row", children: [above, jsx("div", { className: sx(gridStyle$8), style: { gridTemplateColumns }, role: "row", children: columns.map((column, i) => (jsxs("div", { role: "columnheader", className: cx(sx(headingStyle$3), column.labelClassName), children: [column.icon, column.label, column.labelAs?.({ name: column.name })] }, column.name ?? i))) }), below] }));
+    return (jsxs("div", { className: cx(sx(headerStyle$z), className), style: style, "data-testid": "grid-header-row", children: [above, jsx("div", { className: sx(gridStyle$8), style: { gridTemplateColumns }, role: "row", children: columns.map((column, i) => (jsxs("div", { role: "columnheader", className: cx(sx(headingStyle$3), column.labelClassName), children: [column.icon, column.label, column.labelAs?.({ name: column.name })] }, column.name ?? i))) }), below] }));
 }
 GridHeaderRow.displayName = 'GridHeaderRow';
 
@@ -13341,7 +13341,7 @@ const bannerStyle$2 = {
  * The heading row only makes sense while the grid is a grid. Below 768px each
  * row becomes a card and every cell carries its own label instead.
  */
-const headerStyle$x = {
+const headerStyle$y = {
     label: 'GridTable-headerStyle',
     display: 'none',
     width: '100%',
@@ -13391,7 +13391,7 @@ const sortIconStyle$1 = {
     flexShrink: 0,
     display: 'inline-flex',
 };
-const bodyStyle$5 = {
+const bodyStyle$6 = {
     label: 'GridTable-bodyStyle',
     display: 'flex',
     flexDirection: 'column',
@@ -13400,7 +13400,7 @@ const bodyStyle$5 = {
         gap: 0,
     },
 };
-const rowStyle$5 = {
+const rowStyle$6 = {
     label: 'GridTable-rowStyle',
     padding: 8,
     fontSize: 14,
@@ -13605,7 +13605,7 @@ const totalValueStyle = {
  * `.footer .totalCell:first-child` is written against the generated class, so
  * it keeps its (0,3,0) rank over the plain `.totalCell` rule without doubling.
  */
-const footerStyle$8 = {
+const footerStyle$a = {
     label: 'GridTable-footerStyle',
     display: 'none',
     width: '100%',
@@ -13957,7 +13957,7 @@ function GridTable({ columns, data, gridTemplateColumns = `repeat(${columns.leng
     // membership rather than truthiness so a legitimate empty-string key still
     // counts as a match.
     const markerBeforeMatches = rowMarker?.beforeKey != null && allKeys.includes(rowMarker.beforeKey);
-    return (jsxs("div", { className: cx(sx(tableStyle$8), sharedColumns ? sx(sharedRootStyle) : '', className), style: rootStyle, children: [banner && jsx("div", { className: cx(sx(bannerStyle$2), span), children: banner }), !hideHeader && (jsxs("div", { className: cx(sx(headerStyle$x), subgrid), children: [sharedColumns && header.above != null ? jsx("div", { className: span, children: header.above }) : header.above, jsxs("div", { className: cx(sx(gridStyle$7), subgrid), style: trackStyle, children: [expandable && jsx("div", { className: sx(headingStyle$2), "aria-hidden": "true" }), columns.map((column, i) => (jsx(React.Fragment, { children: heading(column, { interactive: true }) }, i)))] }), sharedColumns && header.below != null ? jsx("div", { className: span, children: header.below }) : header.below] })), !sorted.length && !draftRow ? (jsx("div", { className: cx(sx(emptyStyle$d), span), children: emptyMessage })) : (jsxs("div", { className: cx(sx(bodyStyle$5), subgrid), children: [draftRow && jsx("div", { className: cx(sx(draftRowStyle), span), children: draftRow }), sorted.map((row, rowIndex) => {
+    return (jsxs("div", { className: cx(sx(tableStyle$8), sharedColumns ? sx(sharedRootStyle) : '', className), style: rootStyle, children: [banner && jsx("div", { className: cx(sx(bannerStyle$2), span), children: banner }), !hideHeader && (jsxs("div", { className: cx(sx(headerStyle$y), subgrid), children: [sharedColumns && header.above != null ? jsx("div", { className: span, children: header.above }) : header.above, jsxs("div", { className: cx(sx(gridStyle$7), subgrid), style: trackStyle, children: [expandable && jsx("div", { className: sx(headingStyle$2), "aria-hidden": "true" }), columns.map((column, i) => (jsx(React.Fragment, { children: heading(column, { interactive: true }) }, i)))] }), sharedColumns && header.below != null ? jsx("div", { className: span, children: header.below }) : header.below] })), !sorted.length && !draftRow ? (jsx("div", { className: cx(sx(emptyStyle$d), span), children: emptyMessage })) : (jsxs("div", { className: cx(sx(bodyStyle$6), subgrid), children: [draftRow && jsx("div", { className: cx(sx(draftRowStyle), span), children: draftRow }), sorted.map((row, rowIndex) => {
                         const record = row;
                         const key = allKeys[rowIndex];
                         // Only an expandable table exposes expansion; without it, a lingering
@@ -13965,12 +13965,12 @@ function GridTable({ columns, data, gridTemplateColumns = `repeat(${columns.leng
                         // after expandable was turned off) must not leak `expanded: true` to
                         // renderers that have no toggle to collapse it.
                         const expanded = expandable && expandedKeys.has(key);
-                        return (jsxs(React.Fragment, { children: [marker && rowMarker?.beforeKey === key && marker, editRow?.key === key ? (jsx("div", { className: cx(sx(editRowStyle), bordered ? sx(borderedStyle) : '', span), "data-rowid": key, "data-testid": `row-${key}`, "data-editing": "true", children: editRow.content })) : (jsxs("div", { className: cx(sx(rowStyle$5), bordered ? sx(borderedStyle) : '', rowPainted ? sx(rowPaintedStyle) : '', flashRowKey === key ? sx(rowPainted ? flashRowPaintedStyle : flashRowStyle) : '', subgrid), style: trackStyle, "data-rowid": key, "data-testid": `row-${key}`, "data-flash": flashRowKey === key ? 'true' : undefined, children: [expandable && (jsx("div", { className: sx(expandCellStyle), children: jsx("button", { type: "button", className: sx(expandButtonStyle$1), onClick: () => toggleRow(key), "aria-expanded": expanded, "aria-label": `${expanded ? 'Collapse' : 'Expand'} ${typeof expandLabel === 'function' ? expandLabel(row, rowIndex) : expandLabel}`, children: expanded ? jsx(ChevronDown, {}) : jsx(ChevronRight$3, {}) }) })), columns.map((column, colIndex) => {
+                        return (jsxs(React.Fragment, { children: [marker && rowMarker?.beforeKey === key && marker, editRow?.key === key ? (jsx("div", { className: cx(sx(editRowStyle), bordered ? sx(borderedStyle) : '', span), "data-rowid": key, "data-testid": `row-${key}`, "data-editing": "true", children: editRow.content })) : (jsxs("div", { className: cx(sx(rowStyle$6), bordered ? sx(borderedStyle) : '', rowPainted ? sx(rowPaintedStyle) : '', flashRowKey === key ? sx(rowPainted ? flashRowPaintedStyle : flashRowStyle) : '', subgrid), style: trackStyle, "data-rowid": key, "data-testid": `row-${key}`, "data-flash": flashRowKey === key ? 'true' : undefined, children: [expandable && (jsx("div", { className: sx(expandCellStyle), children: jsx("button", { type: "button", className: sx(expandButtonStyle$1), onClick: () => toggleRow(key), "aria-expanded": expanded, "aria-label": `${expanded ? 'Collapse' : 'Expand'} ${typeof expandLabel === 'function' ? expandLabel(row, rowIndex) : expandLabel}`, children: expanded ? jsx(ChevronDown, {}) : jsx(ChevronRight$3, {}) }) })), columns.map((column, colIndex) => {
                                             const value = column.name ? record[column.name] : undefined;
                                             const formatted = column.format ? column.format(value, row) : value;
                                             return (jsxs("div", { className: cx(sx(cellWrapStyle), rowPainted ? sx(cellClearStyle) : ''), ...(column.name ? { 'data-colname': column.name } : {}), children: [column.label && jsx("div", { className: sx(stackedLabelStyle), children: heading(column, { interactive: false }) }), jsx("div", { className: cx(sx(cellStyle$2), alignTop ? sx(cellTopStyle) : '', column.className ?? ''), children: column.as ? (column.as({ row, rowIndex, name: column.name, expanded })) : column.name ? (jsx("span", { className: sx(valueStyle$2), children: formatted || jsx(Fragment, { children: "\u2013" }) })) : null })] }, colIndex));
                                         })] }, key))] }, key));
-                    }), marker && rowMarker?.atEnd && !markerBeforeMatches && sorted.length > 0 && marker] })), totalRow && (jsx("div", { className: cx(sx(footerStyle$8), subgrid), children: jsxs("div", { className: cx(sx(gridStyle$7), subgrid), style: trackStyle, children: [expandable && jsx("div", { className: sx(totalCellStyle), "aria-hidden": "true" }), columns.map((_, i) => (jsx("div", { className: i === totalIndex ? sx(totalValueStyle) : sx(totalCellStyle), children: i === 0 ? totalRow.label : i === totalIndex ? total.toLocaleString() : null }, i)))] }) }))] }));
+                    }), marker && rowMarker?.atEnd && !markerBeforeMatches && sorted.length > 0 && marker] })), totalRow && (jsx("div", { className: cx(sx(footerStyle$a), subgrid), children: jsxs("div", { className: cx(sx(gridStyle$7), subgrid), style: trackStyle, children: [expandable && jsx("div", { className: sx(totalCellStyle), "aria-hidden": "true" }), columns.map((_, i) => (jsx("div", { className: i === totalIndex ? sx(totalValueStyle) : sx(totalCellStyle), children: i === 0 ? totalRow.label : i === totalIndex ? total.toLocaleString() : null }, i)))] }) }))] }));
 }
 GridTable.displayName = 'GridTable';
 
@@ -14756,6 +14756,618 @@ const HubAppShell = ({ children, navItems, individualTravelItem, agentsItem, sou
     return (jsxs("div", { className: cx(sx(shellStyle), expanded && sx(shellExpandedStyle), className), children: [loading && jsx("div", { className: sx(loadingStyle$4), role: "status", "aria-label": "Loading", "data-testid": "loading-overlay", children: jsx("span", {}) }), bannerLabel && jsx("div", { className: sx(qaBannerStyle), children: bannerLabel }), jsxs("aside", { className: sx(sidebarStyle$3), "data-expanded": expanded, children: [jsx("button", { type: "button", className: sx(expandButtonStyle), "aria-label": expanded ? 'Collapse sidebar' : 'Expand sidebar', onClick: () => setExpanded((value) => !value), children: expanded ? jsx(ChevronLeftIcon, { size: 14 }) : jsx(ChevronRightIcon$1, { size: 14 }) }), jsx("button", { type: "button", className: sx(logoStyle), "aria-label": "Go to Home", onClick: onLogoClick, children: logo ? (expanded ? logo : (collapsedLogo ?? logo)) : jsx(DefaultLogo, { expanded: expanded }) }), jsxs("nav", { className: sx(desktopNavStyle), "aria-label": "Hub navigation", children: [homeNavItem && jsx("div", { className: navigationDisabled ? sx(disabledNavStyle) : '', children: renderNavItem(homeNavItem) }), onLegacyPortal && jsxs("button", { type: "button", className: sx(navItemStyle), "aria-label": "Old Portal", title: "Old Portal", onClick: onLegacyPortal, "data-test": "hub-nav-legacy-portal", children: [jsx("span", { className: sx(navIconStyle), children: jsx(ArrowUpRightIcon, { size: 24 }) }), expanded && jsx("span", { children: "Old Portal" })] }), resolvedIndividualTravelItem && renderNavItem(resolvedIndividualTravelItem), jsx("div", { className: navigationDisabled ? sx(disabledNavStyle) : '', children: primaryNavItems.map((item) => renderNavItem(item)) })] }), jsxs("div", { className: sx(sidebarFooterStyle), children: [resolvedFooterNavItems.map((item) => renderNavItem(item)), jsxs("div", { className: sx(profileStyle), ref: profileRef, children: [jsxs("button", { type: "button", className: sx(avatarStyle$1), "aria-label": "User Information", onClick: () => setIsProfileOpen(!isProfileOpen), children: [jsx(Avatar, { initials: userInitials, size: expanded ? 28 : 'md' }), expanded && userName && jsx("span", { className: sx(userNameStyle), children: userName })] }), isProfileOpen && (renderProfileMenu || profileMenu) && (jsx("div", { className: sx(profileMenuStyle), children: renderProfileMenu ? renderProfileMenu(() => setIsProfileOpen(false)) : profileMenu }))] })] })] }), jsxs("div", { className: sx(mainStyle$4), children: [jsxs("header", { className: sx(topbarStyle), children: [jsx("div", { children: accountSelector ?? jsx(DefaultAccount, {}) }), renderTopbarActions ? renderTopbarActions(actions) : jsx(DefaultNavigationToggle, { ...actions })] }), isMobileNavOpen && jsxs("div", { className: sx(mobileNavStyle), children: [jsx("nav", { "aria-label": "Mobile Hub navigation", children: mobileNavItems.map((item) => renderNavItem(item, true)) }), (mobileExtras || onLegacyPortal) && jsxs("div", { className: sx(mobileExtrasStyle), role: "group", "aria-label": "Mobile navigation actions", children: [mobileExtras, onLegacyPortal && jsxs("button", { type: "button", className: sx(mobilePrimaryStyle), onClick: () => { onLegacyPortal(); closeMobileNav(); }, "data-test": "hub-mobile-legacy-portal", children: [jsx(ArrowUpRightIcon, { size: 20 }), jsx("span", { children: "Legacy Portal" })] })] }), mobileFooter && jsx("div", { className: sx(mobileFooterStyle), children: mobileFooter })] }), showContent && jsx("main", { className: cx(sx(contentStyle$6), contentDisabled && sx(contentDisabledStyle)), children: children })] })] }));
 };
 
+/**
+ * The After Hours Resolution Center's domain: Incidents, the four Divisions
+ * that act on them, and the Routes that carry an Incident to each Division.
+ * Shared by the intake form, the incident card, the resolve dialog, the
+ * archive table and the page, so every surface uses the same words.
+ */
+/** The four Divisions in display order. */
+const DIVISIONS = [
+    { value: 'agency', label: 'Agency', services: 'air, hotel, car, limo' },
+    { value: 'charters', label: 'Charters', services: 'charter air' },
+    { value: 'stay', label: 'Stay', services: 'group hotels' },
+    { value: 'driven', label: 'Driven', services: 'bus, ground' },
+];
+/** Division key → display name. */
+const DIVISION_LABELS = {
+    agency: 'Agency',
+    charters: 'Charters',
+    stay: 'Stay',
+    driven: 'Driven',
+};
+/** Escalation tier → chip text. `none` is never shown. */
+const ESCALATION_LABELS = {
+    none: 'None',
+    'teams-5m': '5m Teams',
+    'dispatch-10m': '10m Dispatch',
+    'individual-20m': '20m Individual',
+};
+/** Resolution → display text. */
+const RESOLUTION_LABELS = {
+    resolved: 'Resolved',
+    'logged-in-error': 'Logged in error',
+};
+/** Priority → display text. */
+const PRIORITY_LABELS = {
+    routine: 'Routine',
+    urgent: 'Urgent',
+};
+/** Central time — STM's operations clock — unless a caller says otherwise. */
+const DEFAULT_INCIDENT_TIME_ZONE = 'America/Chicago';
+/** "12m", "1h 05m", "2d 3h" since `from`, measured at `now`; "Just now" under a minute. */
+const formatElapsed = (from, now) => {
+    const minutes = Math.max(0, Math.floor((Date.parse(now) - Date.parse(from)) / 60000));
+    if (minutes < 1)
+        return 'Just now';
+    if (minutes < 60)
+        return `${minutes}m`;
+    const hours = Math.floor(minutes / 60);
+    if (hours < 24)
+        return `${hours}h ${String(minutes % 60).padStart(2, '0')}m`;
+    return `${Math.floor(hours / 24)}d ${hours % 24}h`;
+};
+/** "10:42 PM" in the given time zone. */
+const formatClockTime = (iso, timeZone = DEFAULT_INCIDENT_TIME_ZONE) => new Intl.DateTimeFormat('en-US', { hour: 'numeric', minute: '2-digit', timeZone }).format(new Date(iso));
+/** "Oct 14, 2026" in the given time zone. */
+const formatIncidentDate = (iso, timeZone = DEFAULT_INCIDENT_TIME_ZONE) => new Intl.DateTimeFormat('en-US', { month: 'short', day: 'numeric', year: 'numeric', timeZone }).format(new Date(iso));
+/** "2026-10-14" in the given time zone — the shape a date filter compares against. */
+const toIncidentDateKey = (iso, timeZone = DEFAULT_INCIDENT_TIME_ZONE) => new Intl.DateTimeFormat('en-CA', { year: 'numeric', month: '2-digit', day: '2-digit', timeZone }).format(new Date(iso));
+/** Acknowledged and total Route counts. */
+const countAcknowledged = (routes) => ({
+    acknowledged: routes.filter((route) => Boolean(route.acknowledgedAt)).length,
+    total: routes.length,
+});
+
+/** IncidentArchiveTable's compiled rules. */
+const rootStyle = {
+    label: 'IncidentArchiveTable-rootStyle',
+    display: 'flex',
+    flexDirection: 'column',
+    gap: 'var(--space-4)',
+    minWidth: 0,
+};
+const filtersStyle$5 = {
+    label: 'IncidentArchiveTable-filtersStyle',
+    display: 'grid',
+    gridTemplateColumns: 'repeat(auto-fit, minmax(11rem, 1fr))',
+    alignItems: 'end',
+    gap: 'var(--space-3)',
+};
+const numberStyle$1 = {
+    label: 'IncidentArchiveTable-numberStyle',
+    color: 'var(--fg-1)',
+    fontFamily: 'var(--font-family-mono)',
+    fontWeight: 'var(--fw-semibold)',
+    whiteSpace: 'nowrap',
+};
+const stackStyle$4 = {
+    label: 'IncidentArchiveTable-stackStyle',
+    display: 'flex',
+    flexDirection: 'column',
+    gap: 'var(--space-0-5)',
+};
+const secondaryStyle = {
+    label: 'IncidentArchiveTable-secondaryStyle',
+    color: 'var(--fg-3)',
+    fontSize: 'var(--fs-xs)',
+    lineHeight: 'var(--lh-xs)',
+};
+const rootCauseStyle = {
+    label: 'IncidentArchiveTable-rootCauseStyle',
+    display: 'block',
+    maxWidth: '40ch',
+    color: 'var(--fg-1)',
+    whiteSpace: 'normal',
+    overflowWrap: 'anywhere',
+};
+/* Positioned so the sr-only text inside stays within the table's scroll box, not the page's. */
+const mutedStyle$2 = {
+    label: 'IncidentArchiveTable-mutedStyle',
+    position: 'relative',
+    color: 'var(--fg-3)',
+};
+const srOnlyStyle$3 = { label: 'IncidentArchiveTable-srOnlyStyle', ...srOnly };
+/* The scroll box is ours, not Table's, so it can take focus and a name for keyboard scrolling. */
+const scrollRegionStyle = {
+    label: 'IncidentArchiveTable-scrollRegionStyle',
+    overflowX: 'auto',
+    borderRadius: 'var(--radius-lg)',
+    '&:focus-visible': {
+        outline: '2px solid var(--color-primary)',
+        outlineOffset: 2,
+    },
+};
+const tableNoScrollStyle = {
+    label: 'IncidentArchiveTable-tableNoScrollStyle',
+    '&&': { overflowX: 'visible' },
+};
+
+/** The Archive shows 50 resolved Incidents a page. */
+const ARCHIVE_PAGE_SIZE = 50;
+/**
+ * The read-only Archive of resolved Incidents: newest first, 50 a page,
+ * filterable by date range and account. Nothing here can be reopened.
+ */
+const IncidentArchiveTable = ({ incidents, totalItems, page, pageSize = ARCHIVE_PAGE_SIZE, accounts, filters, onFiltersChange, onPageChange, loading = false, timeZone = DEFAULT_INCIDENT_TIME_ZONE, className = '', }) => {
+    const id = useId();
+    const filtered = Boolean(filters.from || filters.to || filters.accountId);
+    const update = (patch) => onFiltersChange?.({ ...filters, ...patch });
+    const columns = [
+        {
+            key: 'number',
+            label: 'Incident',
+            render: (_value, row) => jsx("span", { className: sx(numberStyle$1), children: row.number }),
+        },
+        {
+            key: 'createdAt',
+            label: 'Logged',
+            render: (_value, row) => (jsxs("span", { className: sx(stackStyle$4), children: [jsx("time", { dateTime: row.createdAt, children: formatIncidentDate(row.createdAt, timeZone) }), jsx("span", { className: sx(secondaryStyle), children: formatClockTime(row.createdAt, timeZone) })] })),
+        },
+        {
+            key: 'accountName',
+            label: 'Account',
+            render: (_value, row) => (jsxs("span", { className: sx(stackStyle$4), children: [jsx("span", { children: row.accountName }), row.teamName && jsx("span", { className: sx(secondaryStyle), children: row.teamName })] })),
+        },
+        {
+            key: 'leadDivision',
+            label: 'Lead Division',
+            render: (_value, row) => DIVISION_LABELS[row.leadDivision],
+        },
+        {
+            key: 'priority',
+            label: 'Priority',
+            render: (_value, row) => (jsx(Badge, { variant: row.priority === 'urgent' ? 'error' : 'default', size: "sm", children: PRIORITY_LABELS[row.priority] })),
+        },
+        {
+            key: 'resolution',
+            label: 'Resolution',
+            render: (_value, row) => (jsx(Badge, { variant: row.resolution === 'resolved' ? 'success' : 'warning', size: "sm", children: RESOLUTION_LABELS[row.resolution] })),
+        },
+        {
+            key: 'rootCause',
+            label: 'Root cause',
+            render: (_value, row) => row.rootCause ? (jsx("span", { className: sx(rootCauseStyle), children: row.rootCause })) : (jsxs("span", { className: sx(mutedStyle$2), children: [jsx("span", { "aria-hidden": "true", children: "\u2014" }), jsx("span", { className: sx(srOnlyStyle$3), children: "No root cause" })] })),
+        },
+        {
+            key: 'resolvedBy',
+            label: 'Resolved by',
+            render: (_value, row) => (jsxs("span", { className: sx(stackStyle$4), children: [jsx("span", { children: row.resolvedBy }), jsxs("time", { className: sx(secondaryStyle), dateTime: row.resolvedAt, children: [formatIncidentDate(row.resolvedAt, timeZone), " ", formatClockTime(row.resolvedAt, timeZone)] })] })),
+        },
+    ];
+    return (jsxs("div", { className: cx(sx(rootStyle), className), "data-test": "incident-archive", children: [jsxs("div", { className: sx(filtersStyle$5), role: "group", "aria-label": "Archive filters", children: [jsx(Datepicker, { id: `${id}-from`, label: "From", size: "sm", value: filters.from ?? '', max: filters.to, onChange: (event) => update({ from: event.target.value || undefined }), fullWidth: true, "data-test": "incident-archive-from" }), jsx(Datepicker, { id: `${id}-to`, label: "To", size: "sm", value: filters.to ?? '', min: filters.from, onChange: (event) => update({ to: event.target.value || undefined }), fullWidth: true, "data-test": "incident-archive-to" }), jsx(Select, { id: `${id}-account`, label: "Account", size: "sm", options: [{ value: '', label: 'All accounts' }, ...accounts.map((a) => ({ value: a.id, label: a.name }))], value: filters.accountId ?? '', onChange: (event) => update({ accountId: event.target.value || undefined }), fullWidth: true, "data-test": "incident-archive-account" }), filtered && (jsx(Button, { variant: "ghost", size: "sm", onClick: () => onFiltersChange?.({}), "data-test": "incident-archive-clear", children: "Clear filters" }))] }), jsx("div", { className: sx(scrollRegionStyle), role: "region", "aria-label": "Resolved incidents", tabIndex: 0, "data-test": "incident-archive-scroll", children: jsx(Table, { className: sx(tableNoScrollStyle), columns: columns, data: incidents, rowKey: "id", loading: loading, emptyContent: jsx(EmptyState$1, { size: "sm", title: filtered ? 'No resolved incidents match' : 'No resolved incidents yet', description: filtered
+                            ? 'Try a wider date range or a different account.'
+                            : 'Incidents land here once they are resolved or closed as logged in error.' }) }) }), totalItems > 0 && (jsx(Pagination, { page: page, pageSize: pageSize, totalItems: totalItems, itemLabel: "incidents", ariaLabel: "Archive pages", onPageChange: onPageChange }))] }));
+};
+IncidentArchiveTable.displayName = 'IncidentArchiveTable';
+
+/** IncidentCard's compiled rules. One rule per element; every value is a token. */
+const cardStyle$b = {
+    label: 'IncidentCard-cardStyle',
+    display: 'flex',
+    flexDirection: 'column',
+    gap: 'var(--space-3)',
+    minWidth: 0,
+};
+/* Doubled so it outranks Card's own border rule, which is injected after this one. */
+const urgentStyle = {
+    label: 'IncidentCard-urgentStyle',
+    '&&': {
+        borderColor: 'var(--color-alert-error-border)',
+        borderLeft: '4px solid var(--color-error)',
+        background: 'var(--alert-error-bg)',
+    },
+};
+const headerStyle$x = {
+    label: 'IncidentCard-headerStyle',
+    display: 'flex',
+    flexWrap: 'wrap',
+    alignItems: 'center',
+    gap: 'var(--space-2)',
+};
+const numberStyle = {
+    label: 'IncidentCard-numberStyle',
+    margin: 0,
+    color: 'var(--fg-1)',
+    fontFamily: 'var(--font-family-mono)',
+    fontSize: 'var(--fs-base)',
+    fontWeight: 'var(--fw-semibold)',
+    lineHeight: 'var(--lh-base)',
+};
+const syncingStyle = {
+    label: 'IncidentCard-syncingStyle',
+    color: 'var(--fg-3)',
+    fontFamily: 'var(--font-family-base)',
+    fontStyle: 'italic',
+    fontWeight: 'var(--fw-medium)',
+};
+const elapsedStyle = {
+    label: 'IncidentCard-elapsedStyle',
+    marginLeft: 'auto',
+    color: 'var(--fg-3)',
+    fontSize: 'var(--fs-sm)',
+    lineHeight: 'var(--lh-sm)',
+    whiteSpace: 'nowrap',
+};
+const accountStyle = {
+    label: 'IncidentCard-accountStyle',
+    margin: 0,
+    color: 'var(--fg-1)',
+    fontSize: 'var(--fs-sm)',
+    fontWeight: 'var(--fw-semibold)',
+    lineHeight: 'var(--lh-sm)',
+    overflowWrap: 'anywhere',
+};
+const metaStyle$1 = {
+    label: 'IncidentCard-metaStyle',
+    display: 'grid',
+    gridTemplateColumns: 'max-content minmax(0, 1fr)',
+    columnGap: 'var(--space-3)',
+    rowGap: 'var(--space-1)',
+    margin: 0,
+    fontSize: 'var(--fs-sm)',
+    lineHeight: 'var(--lh-sm)',
+};
+const metaTermStyle = {
+    label: 'IncidentCard-metaTermStyle',
+    color: 'var(--fg-3)',
+};
+const metaValueStyle = {
+    label: 'IncidentCard-metaValueStyle',
+    margin: 0,
+    color: 'var(--fg-1)',
+    overflowWrap: 'anywhere',
+};
+const telLinkStyle = {
+    label: 'IncidentCard-telLinkStyle',
+    color: 'var(--fg-link)',
+    fontWeight: 'var(--fw-medium)',
+    whiteSpace: 'nowrap',
+    '&:hover': { color: 'var(--fg-link-hover)' },
+    '&:focus-visible': {
+        outline: '2px solid var(--color-primary)',
+        outlineOffset: 2,
+    },
+};
+const narrativeStyle = {
+    label: 'IncidentCard-narrativeStyle',
+    margin: 0,
+    color: 'var(--fg-1)',
+    fontSize: 'var(--fs-sm)',
+    lineHeight: 'var(--lh-sm)',
+    whiteSpace: 'pre-wrap',
+    overflowWrap: 'anywhere',
+};
+const loggedByStyle = {
+    label: 'IncidentCard-loggedByStyle',
+    margin: 0,
+    color: 'var(--fg-3)',
+    fontSize: 'var(--fs-xs)',
+    lineHeight: 'var(--lh-xs)',
+};
+const routesStyle = {
+    label: 'IncidentCard-routesStyle',
+    display: 'flex',
+    flexDirection: 'column',
+    gap: 'var(--space-2)',
+    paddingTop: 'var(--space-3)',
+    borderTop: '1px solid var(--border-color)',
+};
+const routesHeaderStyle = {
+    label: 'IncidentCard-routesHeaderStyle',
+    display: 'flex',
+    flexWrap: 'wrap',
+    alignItems: 'baseline',
+    justifyContent: 'space-between',
+    gap: 'var(--space-2)',
+};
+const routesTitleStyle = {
+    label: 'IncidentCard-routesTitleStyle',
+    margin: 0,
+    color: 'var(--fg-2)',
+    fontSize: 'var(--fs-xs)',
+    fontWeight: 'var(--fw-semibold)',
+    lineHeight: 'var(--lh-xs)',
+    textTransform: 'uppercase',
+    letterSpacing: '0.04em',
+};
+const progressStyle = {
+    label: 'IncidentCard-progressStyle',
+    color: 'var(--fg-2)',
+    fontSize: 'var(--fs-xs)',
+    fontWeight: 'var(--fw-medium)',
+    lineHeight: 'var(--lh-xs)',
+};
+const routeListStyle = {
+    label: 'IncidentCard-routeListStyle',
+    display: 'flex',
+    flexDirection: 'column',
+    gap: 'var(--space-2)',
+    margin: 0,
+    padding: 0,
+    listStyle: 'none',
+};
+const routeStyle$3 = {
+    label: 'IncidentCard-routeStyle',
+    display: 'flex',
+    flexWrap: 'wrap',
+    alignItems: 'center',
+    gap: 'var(--space-2)',
+    padding: 'var(--space-2) var(--space-3)',
+    borderRadius: 'var(--radius-lg)',
+    background: 'var(--bg-subtle)',
+};
+const routeDivisionStyle = {
+    label: 'IncidentCard-routeDivisionStyle',
+    minWidth: '9ch',
+    color: 'var(--fg-1)',
+    fontSize: 'var(--fs-sm)',
+    fontWeight: 'var(--fw-semibold)',
+    lineHeight: 'var(--lh-sm)',
+};
+const routeStatusStyle = {
+    label: 'IncidentCard-routeStatusStyle',
+    flex: '1 1 12ch',
+    color: 'var(--fg-2)',
+    fontSize: 'var(--fs-xs)',
+    lineHeight: 'var(--lh-xs)',
+};
+const routeAckedStyle = {
+    label: 'IncidentCard-routeAckedStyle',
+    color: 'var(--color-success-ink)',
+    fontWeight: 'var(--fw-medium)',
+};
+const footerStyle$9 = {
+    label: 'IncidentCard-footerStyle',
+    display: 'flex',
+    justifyContent: 'flex-end',
+};
+
+const ESCALATION_BADGES = {
+    'teams-5m': 'warning',
+    'dispatch-10m': 'error',
+    'individual-20m': 'error',
+};
+/** `tel:` href from a display number; US 10-digit numbers get +1. */
+const toTelHref = (phone) => {
+    const digits = phone.replace(/[^\d+]/g, '');
+    return `tel:${/^\d{10}$/.test(digits) ? `+1${digits}` : digits}`;
+};
+/**
+ * One Open Incident in the Alert Log: who called, what happened, and which
+ * Divisions have acknowledged it. Unacknowledged Routes do not block Resolve.
+ */
+const IncidentCard = ({ incident, now, timeZone = DEFAULT_INCIDENT_TIME_ZONE, onMarkReceived, onResolve, headingLevel = 3, className = '', }) => {
+    const titleId = useId();
+    const Heading = `h${headingLevel}`;
+    const urgent = incident.priority === 'urgent';
+    const { acknowledged, total } = countAcknowledged(incident.routes);
+    const elapsed = formatElapsed(incident.createdAt, now);
+    const label = incident.number ?? 'syncing incident';
+    return (jsxs(Card, { variant: "default", padding: "md", role: "article", "aria-labelledby": titleId, className: cx(sx(cardStyle$b), urgent && sx(urgentStyle), className), "data-test": "incident-card", "data-priority": incident.priority, children: [jsxs("div", { className: sx(headerStyle$x), children: [jsx(Heading, { id: titleId, className: sx(numberStyle), children: incident.number ?? (jsx("span", { className: sx(syncingStyle), "data-test": "incident-syncing", children: "Syncing\u2026" })) }), jsx(Badge, { variant: urgent ? 'error' : 'default', dot: urgent, children: PRIORITY_LABELS[incident.priority] }), jsx("time", { className: sx(elapsedStyle), dateTime: incident.createdAt, title: `Logged ${formatClockTime(incident.createdAt, timeZone)}`, children: elapsed === 'Just now' ? elapsed : `${elapsed} ago` })] }), jsxs("p", { className: sx(accountStyle), children: [incident.accountName, incident.teamName && ` · ${incident.teamName}`] }), jsxs("dl", { className: sx(metaStyle$1), children: [jsx("dt", { className: sx(metaTermStyle), children: "Lead Division" }), jsx("dd", { className: sx(metaValueStyle), children: DIVISION_LABELS[incident.leadDivision] }), jsx("dt", { className: sx(metaTermStyle), children: "Caller" }), jsxs("dd", { className: sx(metaValueStyle), children: [incident.callerName && `${incident.callerName} · `, jsx("a", { className: sx(telLinkStyle), href: toTelHref(incident.callbackNumber), "data-test": "incident-callback", children: incident.callbackNumber })] }), incident.incidentType && (jsxs(Fragment, { children: [jsx("dt", { className: sx(metaTermStyle), children: "Type" }), jsx("dd", { className: sx(metaValueStyle), children: incident.incidentType })] }))] }), jsx("p", { className: sx(narrativeStyle), "data-test": "incident-narrative", children: incident.narrative }), jsxs("p", { className: sx(loggedByStyle), children: ["Logged by ", incident.loggedBy, " (", DIVISION_LABELS[incident.loggingDivision], ") at", ' ', formatClockTime(incident.createdAt, timeZone)] }), jsxs("section", { className: sx(routesStyle), "aria-label": `Routes for ${label}`, children: [jsxs("div", { className: sx(routesHeaderStyle), children: [jsx("p", { className: sx(routesTitleStyle), children: "Routes" }), jsxs("span", { className: sx(progressStyle), "data-test": "incident-ack-progress", children: ["Acknowledged ", acknowledged, "/", total, " ", total === 1 ? 'division' : 'divisions'] })] }), jsx("ul", { className: sx(routeListStyle), children: incident.routes.map((route) => {
+                            const name = DIVISION_LABELS[route.division];
+                            return (jsxs("li", { className: sx(routeStyle$3), "data-test": `incident-route-${route.division}`, children: [jsx("span", { className: sx(routeDivisionStyle), children: name }), route.acknowledgedAt ? (jsxs("span", { className: cx(sx(routeStatusStyle), sx(routeAckedStyle)), children: ["Received by ", route.acknowledgedBy, " at ", formatClockTime(route.acknowledgedAt, timeZone)] })) : (jsxs(Fragment, { children: [jsx("span", { className: sx(routeStatusStyle), children: "Not acknowledged" }), route.escalation !== 'none' && (jsxs(Badge, { variant: ESCALATION_BADGES[route.escalation], size: "sm", "data-test": "incident-route-escalation", children: ["Escalated \u00B7 ", ESCALATION_LABELS[route.escalation]] })), jsx(Button, { size: "sm", variant: "outline", onClick: () => onMarkReceived?.(incident.id, route.division), "aria-label": `Mark received for ${name}`, "data-test": "incident-mark-received", children: "Mark received" })] }))] }, route.division));
+                        }) })] }), jsx("div", { className: sx(footerStyle$9), children: jsx(Button, { size: "sm", variant: "primary", onClick: () => onResolve?.(incident.id), "aria-label": `Resolve ${label}`, "data-test": "incident-resolve", children: "Resolve" }) })] }));
+};
+IncidentCard.displayName = 'IncidentCard';
+
+/** IncidentIntakeForm's compiled rules. Compact by design: the target is intake in under a minute. */
+const formStyle$5 = {
+    label: 'IncidentIntakeForm-formStyle',
+    display: 'flex',
+    flexDirection: 'column',
+    gap: 'var(--space-3)',
+    minWidth: 0,
+};
+const rowStyle$5 = {
+    label: 'IncidentIntakeForm-rowStyle',
+    display: 'grid',
+    gridTemplateColumns: 'repeat(auto-fit, minmax(13rem, 1fr))',
+    gap: 'var(--space-3)',
+};
+const fieldsetStyle$1 = {
+    label: 'IncidentIntakeForm-fieldsetStyle',
+    display: 'flex',
+    flexDirection: 'column',
+    gap: 'var(--space-1-5)',
+    minWidth: 0,
+    margin: 0,
+    padding: 0,
+    border: 0,
+};
+const legendStyle$2 = {
+    label: 'IncidentIntakeForm-legendStyle',
+    marginBottom: 'var(--space-1-5)',
+    padding: 0,
+    color: 'var(--fg-1)',
+    fontSize: 'var(--fs-sm)',
+    fontWeight: 'var(--fw-medium)',
+};
+const divisionGridStyle = {
+    label: 'IncidentIntakeForm-divisionGridStyle',
+    display: 'grid',
+    gridTemplateColumns: 'repeat(auto-fit, minmax(13rem, 1fr))',
+    gap: 'var(--space-2) var(--space-3)',
+};
+const errorTextStyle = {
+    label: 'IncidentIntakeForm-errorTextStyle',
+    margin: 0,
+    color: 'var(--color-error)',
+    fontSize: 'var(--fs-xs)',
+};
+const helperTextStyle = {
+    label: 'IncidentIntakeForm-helperTextStyle',
+    margin: 0,
+    color: 'var(--fg-3)',
+    fontSize: 'var(--fs-xs)',
+};
+const footerStyle$8 = {
+    label: 'IncidentIntakeForm-footerStyle',
+    display: 'flex',
+    flexWrap: 'wrap',
+    alignItems: 'flex-end',
+    justifyContent: 'space-between',
+    gap: 'var(--space-3)',
+    paddingTop: 'var(--space-1)',
+};
+const priorityStyle = {
+    label: 'IncidentIntakeForm-priorityStyle',
+    display: 'flex',
+    flexDirection: 'column',
+    gap: 'var(--space-1-5)',
+};
+const priorityLabelStyle = {
+    label: 'IncidentIntakeForm-priorityLabelStyle',
+    color: 'var(--fg-1)',
+    fontSize: 'var(--fs-sm)',
+    fontWeight: 'var(--fw-medium)',
+};
+/* Urgent's selected segment turns red, so the choice is unmistakable before submitting. */
+const urgentSegmentStyle = {
+    label: 'IncidentIntakeForm-urgentSegmentStyle',
+    '& [role="radio"][aria-checked="true"]': {
+        background: 'var(--color-error)',
+        color: 'var(--color-white)',
+    },
+};
+const actionsStyle$7 = {
+    label: 'IncidentIntakeForm-actionsStyle',
+    display: 'flex',
+    gap: 'var(--space-2)',
+    marginLeft: 'auto',
+};
+/* Textarea's size ramp pins a single-line height; let `rows` set it instead. */
+const textareaRowsStyle$1 = {
+    label: 'IncidentIntakeForm-textareaRowsStyle',
+    '& textarea': { height: 'auto' },
+};
+/* Select's own error text uses an off-token red that fails contrast; restate Input's error token. */
+const selectErrorTokenStyle = {
+    label: 'IncidentIntakeForm-selectErrorTokenStyle',
+    '& [id$="-error"]': { color: 'var(--color-error)' },
+};
+
+const DIVISION_OPTIONS = DIVISIONS.map((division) => ({ value: division.value, label: division.label }));
+const PRIORITY_OPTIONS = [
+    { value: 'routine', label: 'Routine' },
+    { value: 'urgent', label: 'Urgent' },
+];
+const FIELD_ORDER = ['account', 'callbackNumber', 'loggingDivision', 'divisions', 'narrative'];
+const emptyValues = (loggingDivision) => ({
+    accountName: '',
+    teamId: '',
+    callbackNumber: '',
+    callerName: '',
+    loggingDivision,
+    divisions: [],
+    leadDivision: loggingDivision,
+    incidentType: '',
+    narrative: '',
+    priority: 'routine',
+});
+/** Adds a Division, keeping the list in display order. */
+const withDivision = (list, division) => DIVISIONS.map((d) => d.value).filter((d) => d === division || list.includes(d));
+const findAccount = (accounts, name) => accounts.find((account) => account.name.toLowerCase() === name.trim().toLowerCase());
+/** The validation message per field, or nothing when the field is fine. */
+const validateIncidentIntake = (values, accounts) => {
+    const errors = {};
+    if (!values.accountName.trim())
+        errors.account = 'Enter the client or account.';
+    else if (!findAccount(accounts, values.accountName))
+        errors.account = 'Choose an account from the list.';
+    const digits = values.callbackNumber.replace(/\D/g, '');
+    if (!digits)
+        errors.callbackNumber = 'Enter a callback number.';
+    else if (digits.length < 7)
+        errors.callbackNumber = 'Callback number needs at least 7 digits.';
+    if (!values.loggingDivision)
+        errors.loggingDivision = 'Choose the Division you are logging as.';
+    if (values.divisions.length === 0)
+        errors.divisions = 'Tick at least one Division.';
+    if (!values.narrative.trim())
+        errors.narrative = 'Describe the issue.';
+    return errors;
+};
+/**
+ * The "New incident" intake form. Lead Division follows Logging as until it is
+ * changed by hand; choosing an unticked Lead Division ticks it. Team is hidden
+ * when Agency leads, since Agency work is not tied to a team.
+ */
+const IncidentIntakeForm = ({ accounts, defaultLoggingDivision, onSubmit, onLoggingDivisionChange, onCancel, submitting = false, ariaLabel = 'New incident', className = '', }) => {
+    const id = useId();
+    const [values, setValues] = useState(() => emptyValues(defaultLoggingDivision ?? ''));
+    const [leadTouched, setLeadTouched] = useState(false);
+    const [attempted, setAttempted] = useState(false);
+    const fieldRefs = useRef({});
+    const account = findAccount(accounts, values.accountName);
+    const teamOptions = useMemo(() => (account?.teams ?? []).map((team) => ({ value: team.id, label: team.name })), [account]);
+    const showTeam = values.leadDivision !== 'agency';
+    const errors = attempted ? validateIncidentIntake(values, accounts) : {};
+    const set = (key, value) => setValues((current) => ({ ...current, [key]: value }));
+    const changeLogging = (division) => {
+        setValues((current) => ({
+            ...current,
+            loggingDivision: division,
+            leadDivision: leadTouched ? current.leadDivision : division,
+        }));
+        onLoggingDivisionChange?.(division);
+    };
+    const changeLead = (division) => {
+        setLeadTouched(true);
+        setValues((current) => ({
+            ...current,
+            leadDivision: division,
+            divisions: withDivision(current.divisions, division),
+        }));
+    };
+    const toggleDivision = (division, checked) => setValues((current) => ({
+        ...current,
+        divisions: checked
+            ? withDivision(current.divisions, division)
+            : current.divisions.filter((d) => d !== division),
+    }));
+    const handleSubmit = (event) => {
+        event.preventDefault();
+        setAttempted(true);
+        const found = validateIncidentIntake(values, accounts);
+        const firstInvalid = FIELD_ORDER.find((key) => found[key]);
+        if (firstInvalid) {
+            fieldRefs.current[firstInvalid]?.focus();
+            return;
+        }
+        const loggingDivision = values.loggingDivision;
+        onSubmit({
+            accountId: account.id,
+            teamId: showTeam && values.teamId ? values.teamId : undefined,
+            callbackNumber: values.callbackNumber.trim(),
+            callerName: values.callerName.trim() || undefined,
+            loggingDivision,
+            divisions: values.divisions,
+            leadDivision: (values.leadDivision || loggingDivision),
+            incidentType: values.incidentType.trim() || undefined,
+            narrative: values.narrative.trim(),
+            priority: values.priority,
+        });
+        setValues(emptyValues(loggingDivision));
+        setLeadTouched(false);
+        setAttempted(false);
+    };
+    return (jsxs("form", { className: cx(sx(formStyle$5), className), "aria-label": ariaLabel, noValidate: true, onSubmit: handleSubmit, "data-test": "incident-intake-form", children: [jsxs("div", { className: sx(rowStyle$5), children: [jsx(Input, { id: `${id}-account`, ref: (node) => {
+                            fieldRefs.current.account = node;
+                        }, label: "Client / Account", placeholder: "Start typing a school\u2026", list: `${id}-accounts`, autoComplete: "off", value: values.accountName, onChange: (event) => setValues((current) => ({ ...current, accountName: event.target.value, teamId: '' })), error: errors.account, required: true, fullWidth: true, size: "sm", "data-test": "incident-intake-account" }), jsx("datalist", { id: `${id}-accounts`, children: accounts.map((option) => (jsx("option", { value: option.name }, option.id))) }), showTeam && (jsx(Select, { id: `${id}-team`, label: "Team (optional)", placeholder: account ? (teamOptions.length ? 'Select a team' : 'No teams on this account') : 'Choose an account first', options: teamOptions, value: values.teamId, onChange: (event) => set('teamId', event.target.value), disabled: !account || teamOptions.length === 0, fullWidth: true, size: "sm", "data-test": "incident-intake-team" }))] }), jsxs("div", { className: sx(rowStyle$5), children: [jsx(Input, { id: `${id}-callback`, ref: (node) => {
+                            fieldRefs.current.callbackNumber = node;
+                        }, label: "Callback number", type: "tel", inputMode: "tel", autoComplete: "off", value: values.callbackNumber, onChange: (event) => set('callbackNumber', event.target.value), error: errors.callbackNumber, required: true, fullWidth: true, size: "sm", "data-test": "incident-intake-callback" }), jsx(Input, { id: `${id}-caller`, label: "Caller name (optional)", autoComplete: "off", value: values.callerName, onChange: (event) => set('callerName', event.target.value), fullWidth: true, size: "sm", "data-test": "incident-intake-caller" })] }), jsxs("div", { className: sx(rowStyle$5), children: [jsx(Select, { id: `${id}-logging`, ref: (node) => {
+                            fieldRefs.current.loggingDivision = node;
+                        }, label: "Logging as", placeholder: "Select your Division", options: DIVISION_OPTIONS, value: values.loggingDivision, onChange: (event) => changeLogging(event.target.value), helperText: "Remembered for your next incident.", error: errors.loggingDivision, "aria-required": "true", className: sx(selectErrorTokenStyle), fullWidth: true, size: "sm", "data-test": "incident-intake-logging-division" }), jsx(Select, { id: `${id}-lead`, label: "Lead Division", placeholder: "Defaults to Logging as", options: DIVISION_OPTIONS, value: values.leadDivision, onChange: (event) => changeLead(event.target.value), helperText: "Picking an unticked Division ticks it below.", fullWidth: true, size: "sm", "data-test": "incident-intake-lead-division" })] }), jsxs("fieldset", { className: sx(fieldsetStyle$1), "aria-describedby": errors.divisions ? `${id}-divisions-error` : undefined, "data-test": "incident-intake-divisions", children: [jsx("legend", { className: sx(legendStyle$2), children: "Divisions involved" }), jsx("div", { className: sx(divisionGridStyle), children: DIVISIONS.map((division, index) => (jsx(Checkbox, { ref: index === 0
+                                ? (node) => {
+                                    fieldRefs.current.divisions = node;
+                                }
+                                : undefined, size: "sm", label: `${division.label} — ${division.services}`, checked: values.divisions.includes(division.value), onChange: (event) => toggleDivision(division.value, event.target.checked), "data-test": `incident-intake-division-${division.value}` }, division.value))) }), errors.divisions && (jsx("p", { id: `${id}-divisions-error`, className: sx(errorTextStyle), children: errors.divisions }))] }), jsx(Input, { id: `${id}-type`, label: "Incident type (optional)", placeholder: "e.g. Charter delay, bus no-show", autoComplete: "off", value: values.incidentType, onChange: (event) => set('incidentType', event.target.value), fullWidth: true, size: "sm", "data-test": "incident-intake-type" }), jsx(Textarea, { id: `${id}-narrative`, ref: (node) => {
+                    fieldRefs.current.narrative = node;
+                }, label: "Issue narrative", rows: 4, value: values.narrative, onChange: (event) => set('narrative', event.target.value), error: errors.narrative, required: true, fullWidth: true, size: "sm", "data-test": "incident-intake-narrative", className: sx(textareaRowsStyle$1) }), jsxs("div", { className: sx(footerStyle$8), children: [jsxs("div", { className: sx(priorityStyle), "data-test": "incident-intake-priority", children: [jsx("span", { className: sx(priorityLabelStyle), "aria-hidden": "true", children: "Priority" }), jsx(Segment, { "aria-label": "Priority", size: "sm", options: PRIORITY_OPTIONS, value: values.priority, onChange: (value) => set('priority', value), className: cx(values.priority === 'urgent' && sx(urgentSegmentStyle)) }), jsx("p", { className: sx(helperTextStyle), children: values.priority === 'urgent' ? 'Urgent posts to Teams and sends SMS.' : 'Routine posts a Teams card only.' })] }), jsxs("div", { className: sx(actionsStyle$7), children: [onCancel && (jsx(Button, { type: "button", variant: "secondary", onClick: onCancel, "data-test": "incident-intake-cancel", children: "Cancel" })), jsx(Button, { type: "submit", variant: values.priority === 'urgent' ? 'danger' : 'primary', loading: submitting, "data-test": "incident-intake-submit", children: "Log incident" })] })] })] }));
+};
+IncidentIntakeForm.displayName = 'IncidentIntakeForm';
+
 /**
  * Explicit specificity keeps service and cancellation border colors stable
  * regardless of style injection order: base < type (`&&`) < cancelled (`&&&`).
@@ -16221,7 +16833,7 @@ const scrollBodyStyle = {
     minHeight: 0,
     overflowY: 'auto',
 };
-const bodyStyle$4 = {
+const bodyStyle$5 = {
     label: 'Module-bodyStyle',
     flex: 1,
     fontSize: 14,
@@ -16294,7 +16906,7 @@ const Module = ({ title, icon, iconClassName = '', badge, before, children, afte
             setOpen(!open);
         }
     };
-    return (jsxs("div", { className: cx(sx(moduleStyle), className), children: [title && (jsx("div", { className: cx(sx(headerStyle$u), sx(headerSizeStyles[size]), !open && sx(closedStyle), headerClassName), children: jsxs("div", { className: cx(sx(titleRowStyle$1), sx(titleRowSizeStyles[size]), titleClassName), children: [icon && (jsx("span", { className: cx(sx(iconStyle$1), size !== 'sm' && sx(iconSpacedStyle), iconClassName), children: icon })), jsx("div", { className: sx(titleStyle$r), children: title }), badge && jsx("span", { className: sx(badgeStyle$1), children: badge }), jsxs("div", { className: sx(toolsStyle), children: [tools, useToggle && (jsx("button", { type: "button", className: sx(toggleBtnStyle), onClick: handleToggle, "aria-expanded": open, children: jsx(ChevronIcon, { direction: open ? 'up' : 'down' }) }))] })] }) })), jsxs("div", { className: cx(sx(bodyWrapperStyle), scrollBody && sx(scrollBodyStyle)), children: [before, jsx("div", { className: cx(sx(bodyStyle$4), sx(bodySizeStyles[size]), !open && sx(hiddenStyle), bodyClassName), children: children }), after] }), footer && (jsx("div", { className: cx(sx(footerStyle$6), !open && sx(hiddenStyle)), children: footer }))] }));
+    return (jsxs("div", { className: cx(sx(moduleStyle), className), children: [title && (jsx("div", { className: cx(sx(headerStyle$u), sx(headerSizeStyles[size]), !open && sx(closedStyle), headerClassName), children: jsxs("div", { className: cx(sx(titleRowStyle$1), sx(titleRowSizeStyles[size]), titleClassName), children: [icon && (jsx("span", { className: cx(sx(iconStyle$1), size !== 'sm' && sx(iconSpacedStyle), iconClassName), children: icon })), jsx("div", { className: sx(titleStyle$r), children: title }), badge && jsx("span", { className: sx(badgeStyle$1), children: badge }), jsxs("div", { className: sx(toolsStyle), children: [tools, useToggle && (jsx("button", { type: "button", className: sx(toggleBtnStyle), onClick: handleToggle, "aria-expanded": open, children: jsx(ChevronIcon, { direction: open ? 'up' : 'down' }) }))] })] }) })), jsxs("div", { className: cx(sx(bodyWrapperStyle), scrollBody && sx(scrollBodyStyle)), children: [before, jsx("div", { className: cx(sx(bodyStyle$5), sx(bodySizeStyles[size]), !open && sx(hiddenStyle), bodyClassName), children: children }), after] }), footer && (jsx("div", { className: cx(sx(footerStyle$6), !open && sx(hiddenStyle)), children: footer }))] }));
 };
 /**
  * Horizontal divider for Module content
@@ -18282,6 +18894,82 @@ const RequestSummary = ({ sections, values, enabledSections = {}, submissionInfo
 };
 RequestSummary.displayName = 'RequestSummary';
 
+/** ResolveIncidentDialog's compiled rules. */
+const bodyStyle$4 = {
+    label: 'ResolveIncidentDialog-bodyStyle',
+    display: 'flex',
+    flexDirection: 'column',
+    gap: 'var(--space-4)',
+};
+const fieldsetStyle = {
+    label: 'ResolveIncidentDialog-fieldsetStyle',
+    display: 'flex',
+    flexDirection: 'column',
+    gap: 'var(--space-2)',
+    margin: 0,
+    padding: 0,
+    border: 0,
+};
+const legendStyle$1 = {
+    label: 'ResolveIncidentDialog-legendStyle',
+    marginBottom: 'var(--space-2)',
+    padding: 0,
+    color: 'var(--fg-1)',
+    fontSize: 'var(--fs-sm)',
+    fontWeight: 'var(--fw-medium)',
+};
+const noteStyle$2 = {
+    label: 'ResolveIncidentDialog-noteStyle',
+    margin: 0,
+    color: 'var(--fg-2)',
+    fontSize: 'var(--fs-sm)',
+    lineHeight: 'var(--lh-sm)',
+};
+/* Textarea's size ramp pins a single-line height; let `rows` set it instead. */
+const textareaRowsStyle = {
+    label: 'ResolveIncidentDialog-textareaRowsStyle',
+    '& textarea': { height: 'auto' },
+};
+
+/**
+ * Closes an Open Incident, taking it off the Alert Log and into the Archive.
+ * "Resolved" requires a root cause; "Logged in error" needs none. There is no
+ * reopening, so the confirm button says exactly what it does.
+ */
+const ResolveIncidentDialog = ({ isOpen, incidentNumber, accountName, unacknowledgedCount = 0, defaultResolution = 'resolved', onConfirm, onClose, submitting = false, }) => {
+    const id = useId();
+    const formId = `${id}-form`;
+    const [resolution, setResolution] = useState(defaultResolution);
+    const [rootCause, setRootCause] = useState('');
+    const [attempted, setAttempted] = useState(false);
+    const firstRadioRef = useRef(null);
+    const rootCauseRef = useRef(null);
+    useEffect(() => {
+        if (!isOpen)
+            return;
+        setResolution(defaultResolution);
+        setRootCause('');
+        setAttempted(false);
+        firstRadioRef.current?.focus();
+    }, [isOpen, defaultResolution]);
+    const rootCauseError = attempted && resolution === 'resolved' && !rootCause.trim() ? 'Enter the root cause.' : undefined;
+    const handleSubmit = (event) => {
+        event.preventDefault();
+        setAttempted(true);
+        if (resolution === 'resolved') {
+            if (!rootCause.trim()) {
+                rootCauseRef.current?.focus();
+                return;
+            }
+            onConfirm({ resolution, rootCause: rootCause.trim() });
+            return;
+        }
+        onConfirm({ resolution });
+    };
+    return (jsx(Modal, { isOpen: isOpen, onClose: onClose, size: "sm", title: incidentNumber ? `Resolve ${incidentNumber}` : 'Resolve incident', subtitle: accountName, footer: jsxs(ModalFooter, { children: [jsx(Button, { type: "button", variant: "secondary", onClick: onClose, "data-test": "resolve-incident-cancel", children: "Cancel" }), jsx(Button, { type: "submit", form: formId, loading: submitting, "data-test": "resolve-incident-confirm", children: resolution === 'resolved' ? 'Resolve incident' : 'Close as logged in error' })] }), children: jsxs("form", { id: formId, className: sx(bodyStyle$4), noValidate: true, onSubmit: handleSubmit, children: [jsxs("fieldset", { className: sx(fieldsetStyle), children: [jsx("legend", { className: sx(legendStyle$1), children: "Outcome" }), jsx(Checkbox, { ref: firstRadioRef, type: "radio", name: `${id}-outcome`, value: "resolved", label: "Resolved", helperText: "The issue was handled. Record the root cause.", checked: resolution === 'resolved', onChange: () => setResolution('resolved'), "data-test": "resolve-incident-resolved" }), jsx(Checkbox, { type: "radio", name: `${id}-outcome`, value: "logged-in-error", label: "Logged in error", helperText: "Duplicate, test or not a real incident. No root cause needed.", checked: resolution === 'logged-in-error', onChange: () => setResolution('logged-in-error'), "data-test": "resolve-incident-logged-in-error" })] }), resolution === 'resolved' && (jsx(Textarea, { id: `${id}-root-cause`, ref: rootCauseRef, label: "Root cause", rows: 3, value: rootCause, onChange: (event) => setRootCause(event.target.value), error: rootCauseError, required: true, fullWidth: true, size: "sm", "data-test": "resolve-incident-root-cause", className: sx(textareaRowsStyle) })), unacknowledgedCount > 0 && (jsxs("p", { className: sx(noteStyle$2), "data-test": "resolve-incident-unacknowledged", children: [unacknowledgedCount === 1 ? '1 Division has' : `${unacknowledgedCount} Divisions have`, " not acknowledged yet. You can still resolve."] }))] }) }));
+};
+ResolveIncidentDialog.displayName = 'ResolveIncidentDialog';
+
 /* RequestFormLayout's compiled rules.
  *
  * The chrome shared by every Hub travel request form. The offsets here are
@@ -29885,7 +30573,7 @@ const TripTable = ({ trips, variant = 'current', density = 'comfortable', vendor
  * `.card:hover .chevron`), so the icon and the chevron are declared first and
  * their generated class names resolved into `cardStyle` as computed keys.
  */
-const pageStyle$t = {
+const pageStyle$u = {
     label: 'AdministrationPage-pageStyle',
     color: 'var(--color-ink)',
 };
@@ -30022,8 +30710,109 @@ const AdministrationPage = ({ activeTab = 'system', enabledTabs = ADMINISTRATION
     const resolvedActiveTab = visibleTabs.some((tab) => tab.key === activeTab)
         ? activeTab
         : visibleTabs[0]?.key;
-    return jsxs("div", { className: cx(sx(pageStyle$t), className), children: [jsx("header", { className: sx(headerStyle$n), children: jsx("h1", { children: "Administration\u00A0" }) }), visibleTabs.length > 0 && (jsx(TabStrip, { className: sx(tabsStyle$5), tabs: visibleTabs.map((tab) => ({ id: tab.key, label: tab.label })), activeTab: resolvedActiveTab, onTabChange: (id) => onTabChange?.(id), "aria-label": "Administration sections" })), children ?? (resolvedActiveTab === 'system' ? (jsx("div", { className: sx(cardsStyle$1), children: resolvedCards.map((card) => (jsxs("button", { type: "button", className: sx(cardStyle$5), onClick: () => onCardClick?.(card), children: [jsx("span", { className: sx(cardIconStyle$1), children: card.icon }), jsxs("span", { className: sx(cardCopyStyle), children: [jsx("span", { className: sx(cardTitleStyle$2), children: card.title }), jsx("span", { className: sx(cardDescriptionStyle$1), children: card.description })] }), jsx(ChevronRightIcon$1, { className: sx(chevronStyle), size: 14 })] }, card.key))) })) : resolvedActiveTab === 'client' ? (jsx("p", { className: sx(comingSoonStyle), children: "Client administration settings coming soon." })) : (jsx("p", { className: sx(comingSoonStyle), "data-test": "administration-empty-tabs", children: "No administration sections are available." })))] });
+    return jsxs("div", { className: cx(sx(pageStyle$u), className), children: [jsx("header", { className: sx(headerStyle$n), children: jsx("h1", { children: "Administration\u00A0" }) }), visibleTabs.length > 0 && (jsx(TabStrip, { className: sx(tabsStyle$5), tabs: visibleTabs.map((tab) => ({ id: tab.key, label: tab.label })), activeTab: resolvedActiveTab, onTabChange: (id) => onTabChange?.(id), "aria-label": "Administration sections" })), children ?? (resolvedActiveTab === 'system' ? (jsx("div", { className: sx(cardsStyle$1), children: resolvedCards.map((card) => (jsxs("button", { type: "button", className: sx(cardStyle$5), onClick: () => onCardClick?.(card), children: [jsx("span", { className: sx(cardIconStyle$1), children: card.icon }), jsxs("span", { className: sx(cardCopyStyle), children: [jsx("span", { className: sx(cardTitleStyle$2), children: card.title }), jsx("span", { className: sx(cardDescriptionStyle$1), children: card.description })] }), jsx(ChevronRightIcon$1, { className: sx(chevronStyle), size: 14 })] }, card.key))) })) : resolvedActiveTab === 'client' ? (jsx("p", { className: sx(comingSoonStyle), children: "Client administration settings coming soon." })) : (jsx("p", { className: sx(comingSoonStyle), "data-test": "administration-empty-tabs", children: "No administration sections are available." })))] });
+};
+
+/** AfterHoursResolutionCenterPage's compiled rules. Two panels on desktop; one column under 768px. */
+const pageStyle$t = {
+    label: 'AfterHoursResolutionCenterPage-pageStyle',
+    display: 'flex',
+    flexDirection: 'column',
+    gap: 'var(--space-4)',
+    minHeight: '100%',
+    padding: 'var(--space-5) var(--space-6)',
+    background: 'var(--bg-page)',
+    '@media (max-width: 767px)': {
+        padding: 'var(--space-4)',
+    },
+};
+const descriptionStyle$9 = {
+    label: 'AfterHoursResolutionCenterPage-descriptionStyle',
+    maxWidth: '80ch',
+    margin: 0,
+    color: 'var(--fg-3)',
+    fontSize: 'var(--fs-sm)',
+    lineHeight: 'var(--lh-sm)',
+};
+const panelsStyle = {
+    label: 'AfterHoursResolutionCenterPage-panelsStyle',
+    display: 'grid',
+    gridTemplateColumns: 'minmax(22rem, 2fr) minmax(0, 3fr)',
+    alignItems: 'start',
+    gap: 'var(--space-4)',
+    '@media (max-width: 767px)': {
+        gridTemplateColumns: 'minmax(0, 1fr)',
+    },
+};
+/* The intake panel leaves the flow on mobile; the New incident button opens it full-screen instead. */
+const intakePanelStyle = {
+    label: 'AfterHoursResolutionCenterPage-intakePanelStyle',
+    minWidth: 0,
+    '@media (max-width: 767px)': {
+        display: 'none',
+    },
+};
+const mobileOnlyStyle = {
+    label: 'AfterHoursResolutionCenterPage-mobileOnlyStyle',
+    display: 'none',
+    '@media (max-width: 767px)': {
+        display: 'block',
+    },
+};
+const logPanelStyle = {
+    label: 'AfterHoursResolutionCenterPage-logPanelStyle',
+    minWidth: 0,
+};
+const panelTitleStyle = {
+    label: 'AfterHoursResolutionCenterPage-panelTitleStyle',
+    margin: 0,
+    color: 'var(--fg-1)',
+    fontSize: 'var(--fs-lg)',
+    fontWeight: 'var(--fw-semibold)',
+    lineHeight: 'var(--lh-lg)',
+};
+const feedStyle = {
+    label: 'AfterHoursResolutionCenterPage-feedStyle',
+    display: 'flex',
+    flexDirection: 'column',
+    gap: 'var(--space-3)',
+    margin: 0,
+    padding: 0,
+    listStyle: 'none',
+};
+const archiveSurfaceStyle = {
+    label: 'AfterHoursResolutionCenterPage-archiveSurfaceStyle',
+    minWidth: 0,
+};
+
+const PAGE_TITLE = 'After Hours Resolution Center';
+const EMPTY_ARCHIVE = { incidents: [], totalItems: 0, page: 1, filters: {} };
+/**
+ * The After Hours Resolution Center: log an Incident on one side, watch the
+ * live Alert Log of Open Incidents on the other. Built for a Microsoft Teams
+ * tab, so it carries its own heading and no Hub chrome; one column on mobile.
+ */
+const AfterHoursResolutionCenterPage = ({ view = 'log', incidents, archive = EMPTY_ARCHIVE, accounts, now, timeZone = DEFAULT_INCIDENT_TIME_ZONE, defaultLoggingDivision, onCreateIncident, onLoggingDivisionChange, onMarkReceived, onResolve, onSeeAll, onBack, onArchiveFiltersChange, onArchivePageChange, className = '', }) => {
+    const drawerTitleId = useId();
+    const [intakeOpen, setIntakeOpen] = useState(false);
+    const [resolvingId, setResolvingId] = useState(null);
+    const ordered = useMemo(() => [...incidents].sort((a, b) => Date.parse(b.createdAt) - Date.parse(a.createdAt)), [incidents]);
+    const resolving = incidents.find((incident) => incident.id === resolvingId);
+    if (view === 'archive') {
+        return (jsxs("div", { className: cx(sx(pageStyle$t), className), "data-test": "after-hours-page", "data-view": "archive", children: [jsx(PageHeaderSubsection, { sectionName: PAGE_TITLE, pageName: "Archive", meta: jsx("p", { className: sx(descriptionStyle$9), children: "Resolved incidents, newest first. Read-only." }), onBack: onBack, backLabel: "Back to Alert Log" }), jsx(Card, { padding: "md", className: sx(archiveSurfaceStyle), children: jsx(IncidentArchiveTable, { incidents: archive.incidents, totalItems: archive.totalItems, page: archive.page, filters: archive.filters, loading: archive.loading, accounts: accounts, timeZone: timeZone, onFiltersChange: onArchiveFiltersChange, onPageChange: onArchivePageChange }) })] }));
+    }
+    const intakeForm = (inDrawer) => (jsx(IncidentIntakeForm, { accounts: accounts, defaultLoggingDivision: defaultLoggingDivision, onLoggingDivisionChange: onLoggingDivisionChange, onCancel: inDrawer ? () => setIntakeOpen(false) : undefined, onSubmit: (draft) => {
+            onCreateIncident?.(draft);
+            if (inDrawer)
+                setIntakeOpen(false);
+        } }));
+    return (jsxs("div", { className: cx(sx(pageStyle$t), className), "data-test": "after-hours-page", "data-view": "log", children: [jsx(PageHeader, { title: PAGE_TITLE, after: jsx("p", { className: sx(descriptionStyle$9), children: "Log after-hours incidents, route them to the Divisions that must act, and resolve them." }) }), jsx("div", { className: sx(mobileOnlyStyle), children: jsx(Button, { size: "lg", fullWidth: true, leftIcon: jsx(PlusIcon$2, { size: 20 }), onClick: () => setIntakeOpen(true), "data-test": "after-hours-new-incident", children: "New incident" }) }), jsxs("div", { className: sx(panelsStyle), children: [jsx("section", { className: sx(intakePanelStyle), "aria-label": "New incident panel", children: jsx(Module, { title: jsx("h2", { className: sx(panelTitleStyle), children: "New incident" }), useToggle: false, children: intakeForm(false) }) }), jsx("section", { className: sx(logPanelStyle), "aria-label": "Alert Log panel", children: jsx(Module, { title: jsx("h2", { className: sx(panelTitleStyle), children: "Alert Log" }), badge: ordered.length || undefined, useToggle: false, footer: jsx(Button, { variant: "secondary", fullWidth: true, onClick: onSeeAll, "data-test": "after-hours-see-all", children: "See All" }), children: ordered.length === 0 ? (jsx(EmptyState$1, { size: "sm", title: "No open incidents", description: "New incidents appear here as soon as they are logged. Resolved ones move to the Archive." })) : (jsx("ul", { className: sx(feedStyle), "aria-label": "Open incidents", "data-test": "after-hours-feed", children: ordered.map((incident) => (jsx("li", { children: jsx(IncidentCard, { incident: incident, now: now, timeZone: timeZone, onMarkReceived: onMarkReceived, onResolve: setResolvingId }) }, incident.id))) })) }) })] }), jsxs(Drawer, { isOpen: intakeOpen, onClose: () => setIntakeOpen(false), position: "right", size: "full", "aria-labelledby": drawerTitleId, children: [jsx(Drawer.Header, { children: jsx("h2", { id: drawerTitleId, className: sx(panelTitleStyle), children: "New incident" }) }), jsx(Drawer.Body, { children: intakeForm(true) })] }), jsx(ResolveIncidentDialog, { isOpen: Boolean(resolving), incidentNumber: resolving?.number, accountName: resolving?.accountName, unacknowledgedCount: resolving?.routes.filter((route) => !route.acknowledgedAt).length ?? 0, onClose: () => setResolvingId(null), onConfirm: (input) => {
+                    if (resolving)
+                        onResolve?.(resolving.id, input);
+                    setResolvingId(null);
+                } })] }));
 };
+AfterHoursResolutionCenterPage.displayName = 'AfterHoursResolutionCenterPage';
 
 const pageStyle$s = {
     label: 'AgentGroupTravelRequestsPage-pageStyle',
@@ -39774,5 +40563,5 @@ const TripDetailPage = ({ header, airSegment, groundSegment, hotelSegment, files
 };
 TripDetailPage.displayName = 'TripDetailPage';
 
-export { ACMI_AIRCRAFT_OPTIONS, ACMI_CARRIER_OPTIONS, ACMI_INSURANCE_FLAT, AccentCard, Accordion, AcmiQuoteCalculator, AdministrationPage, AgentGroupTravelRequestsPage, AgentGroupTravelRequestsTable, AirInvoiceCard, AirSegment, Alert, AppLayout, ArrowDownLeftIcon, ArrowUpRightIcon, Avatar, AvatarGroup, BID_TYPE_HEADINGS, BackLink, Badge, BookingDetailsCard, BuildingIcon, BusIcon$2 as BusIcon, Button, ButtonStyled, CARRIER_CATERING_OPTIONS, CARRIER_CONTACT_TYPES, CHAMPIONSHIP_BID_TYPES, CHAMPIONSHIP_HEADINGS, CHARTER_CONTACT_GROUPS, CHARTER_SECTIONS, CalendarIcon$1 as CalendarIcon, CalendarTypeSelector, CalendarViewSelector, CarIcon$1 as CarIcon, Card, CardBody, CardFooter, CardHeader, CarrierProfilePage, ChampionshipBidDetailPage, ChampionshipBidsPage, CharterBidResponsePage, CharterBidViewPage, CharterManifestPage, CharterSourcingEmailPreview, ChartersAccessManagementPage, ChartersHomePage, CheckIcon$1 as CheckIcon, Checkbox, ChevronDownIcon$1 as ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon$1 as ChevronRightIcon, ChevronUpIcon, ClientSelector, CloseIcon, ConfirmModal, ContactCard$1 as ContactCard, ContactList, ContactUsPage, CubeIcon, DOCUMENT_FILE_EXTENSIONS, DashboardIcon, DashboardPage, Datepicker, DetailList, DocumentIcon, DownloadIcon, Drawer, DrawerBody, DrawerFooter, DrawerHeader, Dropdown, DueDatesDrawer, EditIcon$2 as EditIcon, EmptyState$1 as EmptyState, EyeIcon, FeatureFlagManagementPage, FieldLayout, FileUploadButton, FilterChip, FilterIcon$1 as FilterIcon, Flyout, FormField, FormRow, FormSection, FormStack, GridHeaderRow, GridIcon, GridTable, GroundSegment, GroupTravelRequestPage, HUB_ADMIN_ITEM, HUB_AGENTS_ITEM, HUB_INDIVIDUAL_TRAVEL_ITEM, HUB_NAV_ITEMS, HUB_OFF_FLEET_ITEM, HUB_SOURCING_ITEM, HUB_STM_CHARTERS_ITEM, HandIcon, HeadsetIcon, HomeIcon, HotelIcon$3 as HotelIcon, HotelSegment, HubAppShell, Icon, IconRevealLink, Icons, IndividualTravelPage, IndividualTravelRequestDetailPage, IndividualTravelRequestFormPage, InfoCenterPage, InfoIcon$1 as InfoIcon, InfoTile, Input, ItineraryPage, ItinerarySegmentCard, ItineraryTimeline, LightbulbIcon, LimoIcon, ListboxSelect, LockIcon$1 as LockIcon, LogoIcon, LogoutIcon, MailIcon, ManifestCapacityStats, ManifestViewToggle, MegaphoneIcon, MembershipPrograms, MenuIcon, Metric, MinusIcon, Modal, ModalFooter, Module, ModuleDivider, ModuleVerticalDivider, MultiUserSearch, NavCard, NavItem, NextTripCard, NotFoundPage, OFF_FLEET_LEARNED_DESCRIPTION, OFF_FLEET_LEARNED_EMPTY_COPY, OFF_FLEET_QUEUE_DESCRIPTION, OffFleetLearnedExamplesPage, OffFleetReviewQueuePage, OffFleetSubmissionDetailPage, PageBanners, PageHeader, PageHeaderSubsection, Pagination, PanelTabs, PhoneIcon, PlaneIcon$3 as PlaneIcon, PlusIcon$2 as PlusIcon, PreferencesPanel, PrinterIcon, ProfileMenu, Progress, ProgressBar, ProgressCircle, QuoteCostBreakdown, QuoteReviewActions, REGULAR_SEASON_BID_TYPES, RailIcon, RefreshIcon, RegularSeasonBidsPage, RegularSeasonBidsTable, ReportIcon, RequestFormFooter, RequestFormHeader, RequestFormLayout, RequestServiceLink, RequestSummary, ResultCount, RosterProgramNumbersPage, RosterReportsPage, RosterToolbar, SOURCING_COST_CATEGORIES, SOURCING_COST_CATEGORY_LABELS, SUPPLIER_TYPE_OPTIONS, SchoolContactForm, SearchField, SearchIcon$1 as SearchIcon, Segment, SegmentedSelector, Select, SelectFilter, ServiceToggle, ServiceToggleList, SettingsIcon, Sidenav, SingleTeamPanelSelector, SourcingQuoteDetailPage, SourcingReviewQueuePage, SourcingReviewQueueTable, Spinner, SportCodeBadge, StatusBadge, SummarySection, SupplierTypeToggle, TRIP_MONTH_OPTIONS, TabPanelStack, TabStrip, Table, TableCell, Tag, TeamCalendarHeader, TeamCard, TeamContactsPanel, TeamEquipmentForm, TeamHeader, TeamImportForm, TeamManagementPage, TeamPicker, TeamProgramForm, TeamRosterMemberForm, TeamScheduleActions, TeamScheduleCompactTable, TeamScheduleEditor, TeamScheduleExpandedTable, TeamSchedulePage, TeamSubMenu, TeamTravelCalendarCardView, TeamTravelCalendarListView, TeamTravelCalendarPage, TeamTravelCalendarToolbar, TeamTravelCalendarView, TeamUserAccessForm, Textarea, ThemeProvider, Timepicker, Title, Toggle, Tooltip, Topbar, TrashIcon$2 as TrashIcon, TravelBoard, TravelDateRange, TravelServiceIcon, TravelSummaryMetrics, TravelerForm, TrendDownIcon, TrendUpIcon, TripDetailPage, TripSegment, TripTable, TypeIcon, UploadIcon, UserIcon, UsersIcon$1 as UsersIcon, WarningIcon$1 as WarningIcon, XIcon, absoluteFill, accentColors, alertBandTokens, alertTokens, boxShadow, brandColors, breakpoints, buildPaginationItems, buttonReset, computeLineItemTotal, computeQuoteTotals, computeTravelTypeCodes, css, cx, darkTheme, lightTheme as defaultTheme, deriveProgramBidStatus, flexCenter, flexCol, flexRow, font, fontFamily, fontSize, fontWeight, formatCompactTripCost, formatItineraryDate, formatItineraryDateRange, formatItineraryMoney, formatTeamScheduleDueDate, formatTeamScheduleTravelDates, getCharterSourcingEmailRoute, getCharterSourcingEmailSubject, getPageCount, getSegmentDate, getSegmentStartMinutes, getSegmentTitle, getTeamTravelCalendarPeriodLabel, groupSegmentsByDay, iconNames, iconRegistry, injectGlobal, isExpiringSoon, isProgramBiddable, isQuoteActionable, isSportCodeGroup, isTravelDueDateCompleted, isTravelDueDateOverdue, itineraryPageName, leading, lightTheme, lineClamp, lineHeight, matchesQuoteSearch, merge, moveTeamTravelCalendarPeriod, navyColors, neutralColors, ordinalDay, parseClockTime, parseItineraryDate, primaryColors, radius, rounded, semanticColors, shadow, sharedColumnWidth, size, space, spacing, sportCodeVariant, srOnly, statusColors, styled, sx, tabStripTabId, teamColors, textColors, tintColors, toInlineStyle, trans, transition, truncate$1 as truncate, useSharedColumnWidth, useTheme, weight };
+export { ACMI_AIRCRAFT_OPTIONS, ACMI_CARRIER_OPTIONS, ACMI_INSURANCE_FLAT, ARCHIVE_PAGE_SIZE, AccentCard, Accordion, AcmiQuoteCalculator, AdministrationPage, AfterHoursResolutionCenterPage, AgentGroupTravelRequestsPage, AgentGroupTravelRequestsTable, AirInvoiceCard, AirSegment, Alert, AppLayout, ArrowDownLeftIcon, ArrowUpRightIcon, Avatar, AvatarGroup, BID_TYPE_HEADINGS, BackLink, Badge, BookingDetailsCard, BuildingIcon, BusIcon$2 as BusIcon, Button, ButtonStyled, CARRIER_CATERING_OPTIONS, CARRIER_CONTACT_TYPES, CHAMPIONSHIP_BID_TYPES, CHAMPIONSHIP_HEADINGS, CHARTER_CONTACT_GROUPS, CHARTER_SECTIONS, CalendarIcon$1 as CalendarIcon, CalendarTypeSelector, CalendarViewSelector, CarIcon$1 as CarIcon, Card, CardBody, CardFooter, CardHeader, CarrierProfilePage, ChampionshipBidDetailPage, ChampionshipBidsPage, CharterBidResponsePage, CharterBidViewPage, CharterManifestPage, CharterSourcingEmailPreview, ChartersAccessManagementPage, ChartersHomePage, CheckIcon$1 as CheckIcon, Checkbox, ChevronDownIcon$1 as ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon$1 as ChevronRightIcon, ChevronUpIcon, ClientSelector, CloseIcon, ConfirmModal, ContactCard$1 as ContactCard, ContactList, ContactUsPage, CubeIcon, DEFAULT_INCIDENT_TIME_ZONE, DIVISIONS, DIVISION_LABELS, DOCUMENT_FILE_EXTENSIONS, DashboardIcon, DashboardPage, Datepicker, DetailList, DocumentIcon, DownloadIcon, Drawer, DrawerBody, DrawerFooter, DrawerHeader, Dropdown, DueDatesDrawer, ESCALATION_LABELS, EditIcon$2 as EditIcon, EmptyState$1 as EmptyState, EyeIcon, FeatureFlagManagementPage, FieldLayout, FileUploadButton, FilterChip, FilterIcon$1 as FilterIcon, Flyout, FormField, FormRow, FormSection, FormStack, GridHeaderRow, GridIcon, GridTable, GroundSegment, GroupTravelRequestPage, HUB_ADMIN_ITEM, HUB_AGENTS_ITEM, HUB_INDIVIDUAL_TRAVEL_ITEM, HUB_NAV_ITEMS, HUB_OFF_FLEET_ITEM, HUB_SOURCING_ITEM, HUB_STM_CHARTERS_ITEM, HandIcon, HeadsetIcon, HomeIcon, HotelIcon$3 as HotelIcon, HotelSegment, HubAppShell, Icon, IconRevealLink, Icons, IncidentArchiveTable, IncidentCard, IncidentIntakeForm, IndividualTravelPage, IndividualTravelRequestDetailPage, IndividualTravelRequestFormPage, InfoCenterPage, InfoIcon$1 as InfoIcon, InfoTile, Input, ItineraryPage, ItinerarySegmentCard, ItineraryTimeline, LightbulbIcon, LimoIcon, ListboxSelect, LockIcon$1 as LockIcon, LogoIcon, LogoutIcon, MailIcon, ManifestCapacityStats, ManifestViewToggle, MegaphoneIcon, MembershipPrograms, MenuIcon, Metric, MinusIcon, Modal, ModalFooter, Module, ModuleDivider, ModuleVerticalDivider, MultiUserSearch, NavCard, NavItem, NextTripCard, NotFoundPage, OFF_FLEET_LEARNED_DESCRIPTION, OFF_FLEET_LEARNED_EMPTY_COPY, OFF_FLEET_QUEUE_DESCRIPTION, OffFleetLearnedExamplesPage, OffFleetReviewQueuePage, OffFleetSubmissionDetailPage, PRIORITY_LABELS, PageBanners, PageHeader, PageHeaderSubsection, Pagination, PanelTabs, PhoneIcon, PlaneIcon$3 as PlaneIcon, PlusIcon$2 as PlusIcon, PreferencesPanel, PrinterIcon, ProfileMenu, Progress, ProgressBar, ProgressCircle, QuoteCostBreakdown, QuoteReviewActions, REGULAR_SEASON_BID_TYPES, RESOLUTION_LABELS, RailIcon, RefreshIcon, RegularSeasonBidsPage, RegularSeasonBidsTable, ReportIcon, RequestFormFooter, RequestFormHeader, RequestFormLayout, RequestServiceLink, RequestSummary, ResolveIncidentDialog, ResultCount, RosterProgramNumbersPage, RosterReportsPage, RosterToolbar, SOURCING_COST_CATEGORIES, SOURCING_COST_CATEGORY_LABELS, SUPPLIER_TYPE_OPTIONS, SchoolContactForm, SearchField, SearchIcon$1 as SearchIcon, Segment, SegmentedSelector, Select, SelectFilter, ServiceToggle, ServiceToggleList, SettingsIcon, Sidenav, SingleTeamPanelSelector, SourcingQuoteDetailPage, SourcingReviewQueuePage, SourcingReviewQueueTable, Spinner, SportCodeBadge, StatusBadge, SummarySection, SupplierTypeToggle, TRIP_MONTH_OPTIONS, TabPanelStack, TabStrip, Table, TableCell, Tag, TeamCalendarHeader, TeamCard, TeamContactsPanel, TeamEquipmentForm, TeamHeader, TeamImportForm, TeamManagementPage, TeamPicker, TeamProgramForm, TeamRosterMemberForm, TeamScheduleActions, TeamScheduleCompactTable, TeamScheduleEditor, TeamScheduleExpandedTable, TeamSchedulePage, TeamSubMenu, TeamTravelCalendarCardView, TeamTravelCalendarListView, TeamTravelCalendarPage, TeamTravelCalendarToolbar, TeamTravelCalendarView, TeamUserAccessForm, Textarea, ThemeProvider, Timepicker, Title, Toggle, Tooltip, Topbar, TrashIcon$2 as TrashIcon, TravelBoard, TravelDateRange, TravelServiceIcon, TravelSummaryMetrics, TravelerForm, TrendDownIcon, TrendUpIcon, TripDetailPage, TripSegment, TripTable, TypeIcon, UploadIcon, UserIcon, UsersIcon$1 as UsersIcon, WarningIcon$1 as WarningIcon, XIcon, absoluteFill, accentColors, alertBandTokens, alertTokens, boxShadow, brandColors, breakpoints, buildPaginationItems, buttonReset, computeLineItemTotal, computeQuoteTotals, computeTravelTypeCodes, countAcknowledged, css, cx, darkTheme, lightTheme as defaultTheme, deriveProgramBidStatus, flexCenter, flexCol, flexRow, font, fontFamily, fontSize, fontWeight, formatClockTime, formatCompactTripCost, formatElapsed, formatIncidentDate, formatItineraryDate, formatItineraryDateRange, formatItineraryMoney, formatTeamScheduleDueDate, formatTeamScheduleTravelDates, getCharterSourcingEmailRoute, getCharterSourcingEmailSubject, getPageCount, getSegmentDate, getSegmentStartMinutes, getSegmentTitle, getTeamTravelCalendarPeriodLabel, groupSegmentsByDay, iconNames, iconRegistry, injectGlobal, isExpiringSoon, isProgramBiddable, isQuoteActionable, isSportCodeGroup, isTravelDueDateCompleted, isTravelDueDateOverdue, itineraryPageName, leading, lightTheme, lineClamp, lineHeight, matchesQuoteSearch, merge, moveTeamTravelCalendarPeriod, navyColors, neutralColors, ordinalDay, parseClockTime, parseItineraryDate, primaryColors, radius, rounded, semanticColors, shadow, sharedColumnWidth, size, space, spacing, sportCodeVariant, srOnly, statusColors, styled, sx, tabStripTabId, teamColors, textColors, tintColors, toIncidentDateKey, toInlineStyle, toTelHref, trans, transition, truncate$1 as truncate, useSharedColumnWidth, useTheme, validateIncidentIntake, weight };
 //# sourceMappingURL=index.esm.js.map