@licklist/design 0.78.5-dev.64 → 0.78.5-dev.67

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (36) hide show
  1. package/dist/v2/components/Badge/Badge.d.ts +1 -0
  2. package/dist/v2/components/Badge/Badge.d.ts.map +1 -1
  3. package/dist/v2/components/Badge/Badge.js +2 -1
  4. package/dist/v2/components/Checkbox/Checkbox.scss.js +1 -1
  5. package/dist/v2/components/FormField/FormField.d.ts +1 -0
  6. package/dist/v2/components/FormField/FormField.d.ts.map +1 -1
  7. package/dist/v2/components/FormField/FormField.js +4 -2
  8. package/dist/v2/components/FormField/FormField.scss.js +1 -1
  9. package/dist/v2/components/IconButton/IconButton.scss.js +1 -1
  10. package/dist/v2/components/NewInput/NewInput.d.ts +1 -0
  11. package/dist/v2/components/NewInput/NewInput.d.ts.map +1 -1
  12. package/dist/v2/components/NewInput/NewInput.js +3 -1
  13. package/dist/v2/components/ZoneCard/ResourceRow.d.ts.map +1 -1
  14. package/dist/v2/components/ZoneCard/ResourceRow.js +46 -34
  15. package/dist/v2/components/ZoneCard/ZoneCard.scss.js +1 -1
  16. package/dist/v2/components/ZoneCard/ZoneHeader.d.ts.map +1 -1
  17. package/dist/v2/components/ZoneCard/ZoneHeader.js +44 -14
  18. package/dist/v2/pages/ZonesResources/ZonesResourcesPage.d.ts.map +1 -1
  19. package/dist/v2/pages/ZonesResources/ZonesResourcesPage.js +5 -5
  20. package/dist/v2/pages/ZonesResources/ZonesResourcesPage.scss.js +1 -1
  21. package/dist/v2/styles/form/NewInput.scss +29 -0
  22. package/dist/v2/styles/form/NewInput.scss.js +1 -1
  23. package/package.json +3 -3
  24. package/src/v2/components/Badge/Badge.tsx +3 -0
  25. package/src/v2/components/Checkbox/Checkbox.scss +2 -2
  26. package/src/v2/components/Customer/CustomersList.scss +6 -0
  27. package/src/v2/components/FormField/FormField.scss +19 -0
  28. package/src/v2/components/FormField/FormField.tsx +3 -1
  29. package/src/v2/components/IconButton/IconButton.scss +7 -1
  30. package/src/v2/components/NewInput/NewInput.tsx +3 -1
  31. package/src/v2/components/ZoneCard/ResourceRow.tsx +16 -12
  32. package/src/v2/components/ZoneCard/ZoneCard.scss +21 -1
  33. package/src/v2/components/ZoneCard/ZoneHeader.tsx +21 -5
  34. package/src/v2/pages/ZonesResources/ZonesResourcesPage.scss +11 -15
  35. package/src/v2/pages/ZonesResources/ZonesResourcesPage.tsx +4 -3
  36. package/src/v2/styles/form/NewInput.scss +29 -0
package/dist/v2/components/Badge/Badge.d.ts CHANGED
@@ -5,6 +5,7 @@ export interface BadgeProps {
5
5
  variant?: 'success' | 'danger' | 'warning' | 'info' | 'neutral';
6
6
  className?: string;
7
7
  icon?: React.ReactNode;
8
+ onClick?: (e: React.MouseEvent) => void;
8
9
  }
9
10
  export declare const Badge: React.FC<BadgeProps>;
10
11
  //# sourceMappingURL=Badge.d.ts.map
package/dist/v2/components/Badge/Badge.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Badge.d.ts","sourceRoot":"","sources":["../../../../src/v2/components/Badge/Badge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,cAAc,CAAA;AAErB,MAAM,WAAW,UAAU;IACzB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,OAAO,CAAC,EAAE,SAAS,GAAG,QAAQ,GAAG,SAAS,GAAG,MAAM,GAAG,SAAS,CAAA;IAC/D,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CACvB;AAED,eAAO,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,UAAU,CActC,CAAA"}
1
+ {"version":3,"file":"Badge.d.ts","sourceRoot":"","sources":["../../../../src/v2/components/Badge/Badge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,cAAc,CAAA;AAErB,MAAM,WAAW,UAAU;IACzB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,OAAO,CAAC,EAAE,SAAS,GAAG,QAAQ,GAAG,SAAS,GAAG,MAAM,GAAG,SAAS,CAAA;IAC/D,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAA;CACxC;AAED,eAAO,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,UAAU,CAgBtC,CAAA"}
package/dist/v2/components/Badge/Badge.js CHANGED
@@ -3,9 +3,10 @@ import 'react';
3
3
  import './Badge.scss.js';
4
4
 
5
5
  var Badge = function(param) {
6
- var children = param.children, _param_variant = param.variant, variant = _param_variant === void 0 ? 'neutral' : _param_variant, _param_className = param.className, className = _param_className === void 0 ? '' : _param_className, icon = param.icon;
6
+ var children = param.children, _param_variant = param.variant, variant = _param_variant === void 0 ? 'neutral' : _param_variant, _param_className = param.className, className = _param_className === void 0 ? '' : _param_className, icon = param.icon, onClick = param.onClick;
7
7
  return /*#__PURE__*/ jsxs("span", {
8
8
  className: "new-badge new-badge--".concat(variant, " ").concat(icon ? 'new-badge--with-icon' : '', " ").concat(className),
9
+ onClick: onClick,
9
10
  children: [
10
11
  icon && /*#__PURE__*/ jsx("span", {
11
12
  className: "new-badge__icon",
package/dist/v2/components/Checkbox/Checkbox.scss.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import styleInject from '/opt/atlassian/pipelines/agent/build/node_modules/style-inject/dist/style-inject.es.js';
2
2
 
3
- var css_248z = ":root{--blue-50:#e7f4fc;--blue-100:#b4dbf6;--blue-200:#90caf2;--blue-300:#5eb2ec;--blue-400:#3ea3e8;--blue-500:#0e8ce2;--blue-600:#0d7fce;--blue-700:#0a63a0;--blue-800:#084d7c;--blue-900:#063b5f;--cyan-50:#eafbff;--cyan-75:#bdf3ff;--cyan-100:#aff1ff;--cyan-200:#9deeff;--cyan-300:#71e6ff;--cyan-400:#55e1ff;--cyan-500:#2bd9ff;--cyan-600:#27c5e8;--cyan-700:#1f9ab5;--cyan-800:#18778c;--cyan-900:#125b6b;--indigo-50:#efeffe;--indigo-100:#cdccfc;--indigo-200:#b4b4fa;--indigo-300:#9291f8;--indigo-400:#7c74ff;--indigo-500:#5d5bf4;--indigo-600:#5553de;--indigo-700:#4241ad;--indigo-800:#333286;--indigo-900:#272666;--green-50:#eef9ea;--green-100:#c9ecbd;--green-200:#afe39d;--green-300:#8bd671;--green-400:#75ce55;--green-500:#52c22b;--green-600:#4bb127;--green-700:#3a8a1f;--green-800:#2d6b18;--green-900:#225112;--red-50:#fceceb;--red-100:#f5c4c2;--red-200:#f1a8a4;--red-300:#ea807b;--red-400:#e66861;--red-500:#e0423a;--red-600:#cc3c35;--red-700:#9f2f29;--red-800:#7b2420;--red-900:#5e1c18;--purple-50:#efe6fd;--purple-100:#ceb0fa;--purple-200:#b78af7;--purple-300:#965ff4;--purple-400:#8133f1;--purple-500:#6200ee;--purple-600:#5900d9;--purple-700:#4600a9;--purple-800:#360083;--purple-900:#290064;--orange-50:#fff2e8;--orange-100:#fed7b6;--orange-200:#fec493;--orange-300:#fea962;--orange-400:#fd9843;--orange-500:#fd7e14;--orange-600:#e67312;--orange-700:#b4590e;--orange-800:#8b450b;--orange-900:#6a3508;--yellow-50:#fcf6e7;--yellow-100:#f6e3b4;--yellow-200:#f2d68f;--yellow-300:#ecc35c;--yellow-400:#fcc741;--yellow-500:#fbb912;--yellow-600:#e4a810;--yellow-700:#a07509;--yellow-800:#7c5b07;--yellow-900:#5f4505;--pink-50:#fdecf4;--pink-100:#f8c3db;--pink-200:#f4a6ca;--pink-300:#f07eb2;--pink-400:#ed65a3;--pink-500:#e83e8c;--pink-600:#d33874;--pink-700:#a52c63;--pink-800:#80224d;--pink-900:#611a3b;--teal-50:#e9faf7;--teal-100:#baf0e7;--teal-200:#99e8db;--teal-300:#6bdecb;--teal-400:#4ed8c1;--teal-500:#22ceb1;--teal-600:#1fbba1;--teal-700:#18927e;--teal-800:#137161;--teal-900:#0e574a;--neutral-white:#fff;--neutral-25:#f8f8fa;--neutral-50:#e8e9ef;--neutral-75:#d2d5e3;--neutral-100:#b6bacc;--neutral-200:#9399b3;--neutral-300:#626a90;--neutral-400:#433d7b;--neutral-500:#14215a;--neutral-600:#121e52;--neutral-700:#0e1740;--neutral-800:#0b1232;--neutral-900:#080e26;--neutral-black:#000;--purple-lightest:var(--purple-50);--purple-lighter:var(--purple-100);--purple-light:var(--purple-300);--purple-regular:var(--purple-500);--purple-dark:var(--purple-600);--purple-darker:var(--purple-800);--purple-darkest:var(--purple-900);--blue-lightest:var(--blue-50);--blue-lighter:var(--blue-100);--blue-light:var(--blue-300);--blue-regular:var(--blue-500);--blue-dark:var(--blue-600);--blue-darker:var(--blue-800);--blue-darkest:var(--blue-900);--indigo-lightest:var(--indigo-50);--indigo-lighter:var(--indigo-100);--indigo-light:var(--indigo-300);--indigo-regular:var(--indigo-500);--indigo-dark:var(--indigo-600);--indigo-darker:var(--indigo-800);--indigo-darkest:var(--indigo-900);--cyan-lightest:var(--cyan-50);--cyan-lighter:var(--cyan-100);--cyan-light:var(--cyan-300);--cyan-regular:var(--cyan-500);--cyan-dark:var(--cyan-700);--cyan-darker:var(--cyan-800);--cyan-darkest:var(--cyan-900);--red-lightest:var(--red-50);--red-lighter:var(--red-100);--red-light:var(--red-400);--red-regular:var(--red-500);--red-dark:var(--red-600);--red-darker:var(--red-800);--red-darkest:var(--red-900);--orange-lightest:var(--orange-50);--orange-lighter:var(--orange-100);--orange-light:var(--orange-300);--orange-regular:var(--orange-500);--orange-dark:var(--orange-600);--orange-darker:var(--orange-700);--orange-darkest:var(--orange-800);--yellow-lightest:var(--yellow-50);--yellow-lighter:var(--yellow-100);--yellow-light:var(--yellow-300);--yellow-regular:var(--yellow-500);--yellow-dark:var(--yellow-600);--yellow-darker:var(--yellow-800);--yellow-darkest:var(--yellow-900);--pink-lightest:var(--pink-50);--pink-lighter:var(--pink-100);--pink-light:var(--pink-300);--pink-regular:var(--pink-500);--pink-dark:var(--pink-600);--pink-darker:var(--pink-700);--pink-darkest:var(--pink-800);--green-lightest:var(--green-50);--green-lighter:var(--green-100);--green-light:var(--green-300);--green-regular:var(--green-500);--green-dark:var(--green-600);--green-darker:var(--green-800);--green-darkest:var(--green-900);--teal-lightest:var(--teal-50);--teal-lighter:var(--teal-100);--teal-light:var(--teal-300);--teal-regular:var(--teal-500);--teal-dark:var(--teal-600);--teal-darker:var(--teal-700);--teal-darkest:var(--teal-800);--tone-lightest:var(--neutral-white);--tone-lighter:var(--neutral-25);--tone-light:var(--neutral-50);--tone-regular:var(--neutral-75);--tone-dark:var(--neutral-100);--tone-darker:var(--neutral-200);--tone-darkest:var(--neutral-300);--shade-lightest:var(--neutral-400);--shade-lighter:var(--neutral-500);--shade-light:var(--neutral-600);--shade-regular:var(--neutral-700);--shade-dark:var(--neutral-800);--shade-darker:var(--neutral-900);--shade-darkest:var(--neutral-black);--highlight-lightest:var(--cyan-lightest);--highlight-lighter:var(--cyan-lighter);--highlight-light:var(--cyan-light);--highlight-regular:var(--blue-regular);--highlight-dark:var(--blue-dark);--highlight-darker:var(--blue-darker);--highlight-darkest:var(--blue-darkest);--success-lightest:var(--green-lightest);--success-lighter:var(--green-lighter);--success-light:var(--green-light);--success-regular:var(--green-regular);--success-dark:var(--green-dark);--success-darker:var(--green-darker);--success-darkest:var(--green-darkest);--errors-lightest:var(--red-lightest);--errors-lighter:var(--red-lighter);--errors-light:var(--red-light);--errors-regular:var(--red-regular);--errors-dark:var(--red-dark);--errors-darker:var(--red-darker);--errors-darkest:var(--red-darkest);--actions-lightest:var(--purple-50);--actions-lighter:var(--purple-lighter);--actions-light:var(--purple-light);--actions-regular:var(--purple-regular);--actions-dark:var(--purple-dark);--actions-darker:var(--purple-darker);--actions-darkest:var(--purple-darkest);--information-lightest:var(--blue-lightest);--information-lighter:var(--blue-lighter);--information-light:var(--blue-light);--information-regular:var(--blue-regular);--information-dark:var(--blue-dark);--information-darker:var(--blue-darker);--information-darkest:var(--blue-darkest);--alert-lightest:var(--yellow-lightest);--alert-lighter:var(--yellow-lighter);--alert-light:var(--orange-light);--alert-regular:var(--orange-regular);--alert-darker:var(--yellow-darker);--alert-darkest:var(--yellow-darkest);--danger-lightest:var(--red-lightest);--danger-lighter:var(--red-lighter);--danger-light:var(--red-light);--danger-regular:var(--red-regular);--danger-dark:var(--red-dark);--danger-darker:var(--red-darker);--danger-darkest:var(--red-darkest);--disabled-lightest:var(--tone-light);--disabled-lighter:var(--tone-regular);--disabled-light:var(--tone-dark);--disabled-regular:var(--tone-darker);--disabled-dark:var(--shade-lighter);--disabled-darker:var(--shade-light);--disabled-darkest:var(--shade-regular);--label-primary:var(--shade-light);--label-primary-alt:var(--tone-lighter);--label-secondary:var(--tone-darkest);--label-secondary-hover:var(--shade-lighter);--label-white:var(--tone-lightest);--label-highlight:var(--highlight-dark);--label-action:var(--actions-regular);--label-danger:var(--danger-dark);--label-status-error:var(--errors-dark);--label-status-success:var(--success-darker);--label-status-info:var(--information-dark);--label-status-alert:var(--alert-regular);--label-status-disabled:var(--disabled-regular);--surface-primary:var(--tone-lightest);--surface-primary-hover:var(--tone-lighter);--surface-primary-pressed:var(--tone-light);--surface-secondary:var(--neutral-25);--surface-secondary-hover:var(--tone-light);--surface-secondary-pressed:var(--tone-regular);--surface-tertiary:var(--tone-light);--surface-tertiary-hover:var(--tone-lighter);--surface-tertiary-pressed:var(--tone-lightest);--surface-status-success:var(--success-lightest);--surface-status-error:var(--errors-lightest);--surface-status-alert:var(--alert-lightest);--surface-status-info:var(--information-lightest);--surface-status-disabled:var(--disabled-lighter);--surface-action:var(--actions-regular);--surface-action-hover:var(--actions-dark);--surface-action-soft:var(--actions-lightest);--surface-action-soft-hover:var(--actions-lighter);--surface-action-soft-pressed:var(--actions-light);--surface-danger-soft:var(--danger-lightest);--surface-danger-soft-hover:var(--danger-lighter);--surface-danger-soft-pressed:var(--danger-light);--surface-highlight-soft:var(--highlight-lightest);--surface-colour-red-soft:var(--red-lightest);--surface-colour-green-soft:var(--green-lightest);--surface-colour-blue-soft:var(--blue-lightest);--surface-colour-orange-soft:var(--orange-lightest);--surface-colour-yellow-soft:var(--yellow-lightest);--surface-colour-purple-soft:var(--purple-lightest);--surface-colour-indigo-soft:var(--indigo-lightest);--surface-colour-cyan-soft:var(--cyan-lightest);--surface-colour-pink-soft:var(--pink-lightest);--surface-colour-teal-soft:var(--teal-lightest);--border-primary:var(--tone-light);--border-secondary:var(--tone-regular);--border-selected:var(--neutral-600);--border-action:var(--actions-regular);--border-status-error:var(--errors-lighter);--border-status-success:var(--success-lighter);--border-status-alert:var(--alert-lighter);--border-status-info:var(--information-lighter);--border-status-disabled:var(--disabled-lightest);--border-colour-overlay:#121e521a;--fill-primary:var(--shade-lighter);--fill-secondary:var(--tone-darkest);--fill-white:var(--tone-lightest);--fill-action:var(--actions-regular);--fill-highlight:var(--highlight-dark);--fill-danger:var(--danger-dark);--fill-status-success:var(--success-darker);--fill-status-error:var(--errors-dark);--fill-status-alert:var(--alert-regular);--fill-status-info:var(--information-regular);--fill-status-disabled:var(--disabled-light);--gradient-stop1:var(--purple-500);--gradient-stop2:var(--indigo-500);--gradient-stop3:var(--blue-500)}[data-theme=dark]{--label-primary:var(--tone-lighter);--label-primary-alt:var(--shade-light);--label-secondary:var(--tone-darker);--label-secondary-hover:var(--tone-lighter);--label-white:var(--tone-lightest);--label-highlight:var(--highlight-light);--label-action:var(--actions-lighter);--label-danger:var(--danger-light);--label-status-error:var(--errors-light);--label-status-success:var(--success-light);--label-status-info:var(--information-light);--label-status-alert:var(--alert-light);--label-status-disabled:var(--disabled-regular);--surface-primary:var(--shade-darker);--surface-primary-hover:var(--shade-dark);--surface-primary-pressed:var(--shade-regular);--surface-secondary:var(--shade-dark);--surface-secondary-hover:var(--shade-darker);--surface-secondary-pressed:var(--shade-darkest);--surface-tertiary:var(--shade-regular);--surface-tertiary-hover:var(--shade-dark);--surface-tertiary-pressed:var(--shade-darker);--surface-status-success:var(--success-darkest);--surface-status-error:var(--errors-darkest);--surface-status-alert:var(--alert-darkest);--surface-status-info:var(--information-darkest);--surface-status-disabled:var(--disabled-darkest);--surface-action:var(--actions-regular);--surface-action-hover:var(--actions-light);--surface-action-soft:var(--actions-darkest);--surface-action-soft-hover:var(--actions-darker);--surface-action-soft-pressed:var(--actions-dark);--surface-danger-soft:var(--danger-darkest);--surface-danger-soft-hover:var(--danger-darker);--surface-danger-soft-pressed:var(--danger-dark);--surface-highlight-soft:var(--highlight-darkest);--surface-colour-red-soft:var(--red-darkest);--surface-colour-green-soft:var(--green-darkest);--surface-colour-blue-soft:var(--blue-darkest);--surface-colour-orange-soft:var(--orange-darkest);--surface-colour-yellow-soft:var(--yellow-darkest);--surface-colour-purple-soft:var(--purple-darkest);--surface-colour-indigo-soft:var(--indigo-darkest);--surface-colour-cyan-soft:var(--cyan-darkest);--surface-colour-pink-soft:var(--pink-darkest);--surface-colour-teal-soft:var(--teal-darkest);--border-primary:var(--shade-light);--border-secondary:var(--shade-dark);--border-selected:var(--tone-light);--border-action:var(--actions-light);--border-status-error:var(--errors-darker);--border-status-success:var(--success-darker);--border-status-alert:var(--alert-darker);--border-status-info:var(--information-darker);--border-status-disabled:var(--disabled-dark);--border-colour-overlay:#ffffff1a;--fill-primary:var(--tone-lighter);--fill-secondary:var(--tone-darker);--fill-white:var(--tone-lightest);--fill-action:var(--actions-lighter);--fill-highlight:var(--highlight-light);--fill-danger:var(--danger-light);--fill-status-success:var(--success-light);--fill-status-error:var(--errors-light);--fill-status-alert:var(--alert-light);--fill-status-info:var(--information-light);--fill-status-disabled:var(--disabled-dark);--gradient-stop1:var(--indigo-400);--gradient-stop2:var(--cyan-500);--gradient-stop3:var(--cyan-100)}.text-primary{color:var(--label-primary)}.text-secondary{color:var(--label-secondary)}.text-white{color:var(--label-white)}.text-action{color:var(--label-action)}.text-danger{color:var(--label-danger)}.text-success{color:var(--label-status-success)}.text-error{color:var(--label-status-error)}.text-info{color:var(--label-status-info)}.text-warning{color:var(--label-status-alert)}.text-disabled{color:var(--label-status-disabled)}.bg-primary{background-color:var(--surface-primary)}.bg-secondary{background-color:var(--surface-secondary)}.bg-tertiary{background-color:var(--surface-tertiary)}.bg-success{background-color:var(--surface-status-success)}.bg-error{background-color:var(--surface-status-error)}.bg-warning{background-color:var(--surface-status-alert)}.bg-info{background-color:var(--surface-status-info)}.bg-action-soft{background-color:var(--surface-action-soft)}.bg-danger-soft{background-color:var(--surface-danger-soft)}.border-primary{border-color:var(--border-primary)}.border-secondary{border-color:var(--border-secondary)}.border-selected{border-color:var(--border-selected)}.border-action{border-color:var(--border-action)}.border-success{border-color:var(--border-status-success)}.border-error{border-color:var(--border-status-error)}.border-warning{border-color:var(--border-status-alert)}.border-info{border-color:var(--border-status-info)}:root{--radius-zero:0px;--radius-xs:1px;--radius-sm:2px;--radius-md:4px;--radius-reg:8px;--radius-lg:16px;--radius-xl:24px;--spacing-zero:0px;--spacing-xxs:1px;--spacing-xs:2px;--spacing-sm:4px;--spacing-md:8px;--spacing-reg:16px;--spacing-lg:24px;--spacing-xl:32px;--spacing-xxl:64px;--spacing-super:128px;--container-padding-mobile:16px;--opacity-0:0;--opacity-10:0.1;--opacity-20:0.2;--opacity-30:0.3;--opacity-40:0.4;--opacity-50:0.5;--opacity-60:0.6;--opacity-70:0.7;--opacity-80:0.8;--opacity-90:0.9;--opacity-100:1;--color-success-fill:#2d6b18;--color-success-background:#eef9ea;--color-success-border:#c9ecbd;--color-error-fill:#cc3c35;--color-error-background:#fceceb;--color-error-border:#f5c4c2;--color-alert-fill:#fd7e14;--color-alert-background:#fcf6e7;--color-alert-border:#f6e3b4;--color-info-fill:#0e8ce2;--color-info-background:#e7f4fc;--color-info-border:#b4dbf6;--surfaces-status-background-success:var(--color-success-background);--surfaces-status-background-error:var(--color-error-background);--surfaces-status-background-alert:var(--color-alert-background);--surfaces-status-background-info:var(--color-info-background);--borders-status-border-success:var(--color-success-border);--borders-status-border-error:var(--color-error-border);--borders-status-border-alert:var(--color-alert-border);--borders-status-border-info:var(--color-info-border);--fills-status-fill-success:var(--color-success-fill);--fills-status-fill-error:var(--color-error-fill);--fills-status-fill-alert:var(--color-alert-fill);--fills-status-fill-info:var(--color-info-fill);--font-family-sans:\"Geist\",-apple-system,BlinkMacSystemFont,\"Segoe UI\",\"Roboto\",\"Helvetica Neue\",Arial,sans-serif;--font-family-mono:\"Geist Mono\",ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,\"Liberation Mono\",\"Courier New\",monospace;--heading-xxl-size:44px;--heading-xxl-line:48px;--heading-xxl-weight:600;--heading-xl-size:32px;--heading-xl-line:36px;--heading-xl-weight:700;--heading-h1-size:24px;--heading-h1-line:28px;--heading-h1-weight:600;--heading-h2-size:20px;--heading-h2-line:24px;--heading-h2-weight:600;--heading-h3-size:17px;--heading-h3-line:20px;--heading-h3-weight:600;--heading-h4-size:15px;--heading-h4-line:18px;--heading-h4-weight:600;--heading-h5-size:13px;--heading-h5-line:16px;--heading-h5-weight:500;--heading-h6-size:11px;--heading-h6-line:14px;--heading-h6-weight:500;--heading-xxl-mobile-size:32px;--heading-xxl-mobile-line:36px;--heading-xxl-mobile-weight:600;--heading-xl-mobile-size:26px;--heading-xl-mobile-line:30px;--heading-xl-mobile-weight:700;--heading-h1-mobile-size:20px;--heading-h1-mobile-line:23px;--heading-h1-mobile-weight:600;--heading-h2-mobile-size:18px;--heading-h2-mobile-line:22px;--heading-h2-mobile-weight:600;--heading-h3-mobile-size:16px;--heading-h3-mobile-line:18px;--heading-h3-mobile-weight:600;--heading-h4-mobile-size:14px;--heading-h4-mobile-line:16px;--heading-h4-mobile-weight:600;--heading-h5-mobile-size:13px;--heading-h5-mobile-line:16px;--heading-h5-mobile-weight:500;--heading-h6-mobile-size:11px;--heading-h6-mobile-line:14px;--heading-h6-mobile-weight:500;--text-xl-size:20px;--text-xl-line:26px;--text-xl-weight:400;--text-large-size:18px;--text-large-line:24px;--text-large-weight:400;--text-regular-size:15px;--text-regular-line:20px;--text-regular-weight:400;--text-small-size:13px;--text-small-line:16px;--text-small-weight:400;--text-small-emphasis-weight:500;--text-small-bold-weight:600;--text-xs-size:10px;--text-xs-line:13px;--text-xs-weight:500;--text-xs-bold-weight:600}.waiver-template-form-section{gap:var(--padding-reg,16px)}.waiver-template-form-group,.waiver-template-form-section{align-items:flex-start;align-self:stretch;display:flex;flex-direction:column}.waiver-template-form-group{gap:var(--padding-lg,24px)}.text-description{color:var(--label-secondary,#626a90);font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:16px;font-style:normal;line-height:24px}.checkbox{align-items:flex-start;align-self:stretch;display:flex;gap:11px;max-width:500px}@media (min-width:992px){.checkbox{max-width:unset}}.checkbox__wrapper{align-items:center;cursor:pointer;display:flex;gap:11px;-webkit-user-select:none;user-select:none;width:100%}.checkbox__input{cursor:pointer;height:0;opacity:0;position:absolute;width:0}.checkbox__input:checked~.checkbox__toggle{background:var(--fill-selected,#14215a);border:1px solid var(--border-primary,#e8e9ef)}.checkbox__input:checked~.checkbox__toggle .checkbox__xmark{opacity:0;visibility:hidden}.checkbox__input:checked~.checkbox__toggle .checkbox__checked-group{opacity:1;visibility:visible}.checkbox__input:focus~.checkbox__toggle{box-shadow:0 0 0 2px #14215a33}.checkbox__input:disabled~.checkbox__toggle{background-color:var(--surface-status-disabled,#f8f8fa);border-color:var(--border-primary,#e8e9ef);cursor:not-allowed;opacity:.6}.checkbox:not(.checkbox--pristine) .checkbox__input:not(:checked)~.checkbox__toggle .checkbox__xmark{align-items:center;display:flex;justify-content:center;opacity:1;position:absolute;right:4px;top:50%;transform:translateY(-50%);visibility:visible}.checkbox:not(.checkbox--pristine) .checkbox__input:not(:checked)~.checkbox__toggle .checkbox__checked-group{opacity:0;visibility:hidden}.checkbox__toggle{align-items:center;background:var(--surface-secondary,#f8f8fa);border:1px solid var(--border-primary,#e8e9ef);border-radius:var(--padding-xl,32px);display:flex;flex-shrink:0;height:34px;justify-content:flex-end;min-width:58px;padding:4px;position:relative;width:58px}.checkbox__xmark{height:24px;opacity:0;visibility:hidden;width:24px}.checkbox__xmark svg{height:100%;width:100%}.checkbox__checked-group{left:4px;opacity:0;position:absolute;top:50%;transform:translateY(-50%);visibility:hidden}.checkbox__checked-group,.checkbox__circle{align-items:center;display:flex;height:24px;justify-content:center;width:24px}.checkbox__circle{position:relative}.checkbox__circle svg{height:100%;width:100%}.checkbox__checkmark{align-items:center;display:flex;height:24px;justify-content:center;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:24px}.checkbox__checkmark svg{height:100%;width:100%}.checkbox__content{display:flex;flex:1;flex-direction:column;gap:4px}.checkbox__label{color:var(--label-primary);font-size:15px;font-weight:600;line-height:20px}.checkbox__description,.checkbox__label{font-family:var(--font-family-sans,\"Geist\",sans-serif),serif;font-style:normal}.checkbox__description{color:var(--label-secondary);font-size:var(--text-regular-size,15px);font-weight:400;line-height:var(--text-regular-line,20px);overflow-wrap:break-word;word-break:break-word}.checkbox__error-text{color:var(--label-status-error,#ef4444);font-family:var(--font-family-sans,\"Geist\",sans-serif),serif;font-size:var(--text-xs-size,11px);line-height:var(--text-xs-line,14px);margin-left:69px}.checkbox__wrapper:hover .checkbox__input:not(:disabled)~.checkbox__toggle{border-color:var(--border-primary-hover,#d1d3de)}.checkbox--pristine .checkbox__toggle{background:var(--surface-secondary,#f8f8fa)}.checkbox--pristine .checkbox__checked-group,.checkbox--pristine .checkbox__xmark{opacity:0!important;visibility:hidden!important}.checkbox-pristine-wrapper{align-items:center;background:var(--surface-primary,#fff);border:1px solid var(--border-primary,#e8e9ef);border-radius:var(--padding-xl,32px);display:flex;gap:8px;justify-content:flex-end;padding:4px;width:58px}";
3
+ var css_248z = ":root{--blue-50:#e7f4fc;--blue-100:#b4dbf6;--blue-200:#90caf2;--blue-300:#5eb2ec;--blue-400:#3ea3e8;--blue-500:#0e8ce2;--blue-600:#0d7fce;--blue-700:#0a63a0;--blue-800:#084d7c;--blue-900:#063b5f;--cyan-50:#eafbff;--cyan-75:#bdf3ff;--cyan-100:#aff1ff;--cyan-200:#9deeff;--cyan-300:#71e6ff;--cyan-400:#55e1ff;--cyan-500:#2bd9ff;--cyan-600:#27c5e8;--cyan-700:#1f9ab5;--cyan-800:#18778c;--cyan-900:#125b6b;--indigo-50:#efeffe;--indigo-100:#cdccfc;--indigo-200:#b4b4fa;--indigo-300:#9291f8;--indigo-400:#7c74ff;--indigo-500:#5d5bf4;--indigo-600:#5553de;--indigo-700:#4241ad;--indigo-800:#333286;--indigo-900:#272666;--green-50:#eef9ea;--green-100:#c9ecbd;--green-200:#afe39d;--green-300:#8bd671;--green-400:#75ce55;--green-500:#52c22b;--green-600:#4bb127;--green-700:#3a8a1f;--green-800:#2d6b18;--green-900:#225112;--red-50:#fceceb;--red-100:#f5c4c2;--red-200:#f1a8a4;--red-300:#ea807b;--red-400:#e66861;--red-500:#e0423a;--red-600:#cc3c35;--red-700:#9f2f29;--red-800:#7b2420;--red-900:#5e1c18;--purple-50:#efe6fd;--purple-100:#ceb0fa;--purple-200:#b78af7;--purple-300:#965ff4;--purple-400:#8133f1;--purple-500:#6200ee;--purple-600:#5900d9;--purple-700:#4600a9;--purple-800:#360083;--purple-900:#290064;--orange-50:#fff2e8;--orange-100:#fed7b6;--orange-200:#fec493;--orange-300:#fea962;--orange-400:#fd9843;--orange-500:#fd7e14;--orange-600:#e67312;--orange-700:#b4590e;--orange-800:#8b450b;--orange-900:#6a3508;--yellow-50:#fcf6e7;--yellow-100:#f6e3b4;--yellow-200:#f2d68f;--yellow-300:#ecc35c;--yellow-400:#fcc741;--yellow-500:#fbb912;--yellow-600:#e4a810;--yellow-700:#a07509;--yellow-800:#7c5b07;--yellow-900:#5f4505;--pink-50:#fdecf4;--pink-100:#f8c3db;--pink-200:#f4a6ca;--pink-300:#f07eb2;--pink-400:#ed65a3;--pink-500:#e83e8c;--pink-600:#d33874;--pink-700:#a52c63;--pink-800:#80224d;--pink-900:#611a3b;--teal-50:#e9faf7;--teal-100:#baf0e7;--teal-200:#99e8db;--teal-300:#6bdecb;--teal-400:#4ed8c1;--teal-500:#22ceb1;--teal-600:#1fbba1;--teal-700:#18927e;--teal-800:#137161;--teal-900:#0e574a;--neutral-white:#fff;--neutral-25:#f8f8fa;--neutral-50:#e8e9ef;--neutral-75:#d2d5e3;--neutral-100:#b6bacc;--neutral-200:#9399b3;--neutral-300:#626a90;--neutral-400:#433d7b;--neutral-500:#14215a;--neutral-600:#121e52;--neutral-700:#0e1740;--neutral-800:#0b1232;--neutral-900:#080e26;--neutral-black:#000;--purple-lightest:var(--purple-50);--purple-lighter:var(--purple-100);--purple-light:var(--purple-300);--purple-regular:var(--purple-500);--purple-dark:var(--purple-600);--purple-darker:var(--purple-800);--purple-darkest:var(--purple-900);--blue-lightest:var(--blue-50);--blue-lighter:var(--blue-100);--blue-light:var(--blue-300);--blue-regular:var(--blue-500);--blue-dark:var(--blue-600);--blue-darker:var(--blue-800);--blue-darkest:var(--blue-900);--indigo-lightest:var(--indigo-50);--indigo-lighter:var(--indigo-100);--indigo-light:var(--indigo-300);--indigo-regular:var(--indigo-500);--indigo-dark:var(--indigo-600);--indigo-darker:var(--indigo-800);--indigo-darkest:var(--indigo-900);--cyan-lightest:var(--cyan-50);--cyan-lighter:var(--cyan-100);--cyan-light:var(--cyan-300);--cyan-regular:var(--cyan-500);--cyan-dark:var(--cyan-700);--cyan-darker:var(--cyan-800);--cyan-darkest:var(--cyan-900);--red-lightest:var(--red-50);--red-lighter:var(--red-100);--red-light:var(--red-400);--red-regular:var(--red-500);--red-dark:var(--red-600);--red-darker:var(--red-800);--red-darkest:var(--red-900);--orange-lightest:var(--orange-50);--orange-lighter:var(--orange-100);--orange-light:var(--orange-300);--orange-regular:var(--orange-500);--orange-dark:var(--orange-600);--orange-darker:var(--orange-700);--orange-darkest:var(--orange-800);--yellow-lightest:var(--yellow-50);--yellow-lighter:var(--yellow-100);--yellow-light:var(--yellow-300);--yellow-regular:var(--yellow-500);--yellow-dark:var(--yellow-600);--yellow-darker:var(--yellow-800);--yellow-darkest:var(--yellow-900);--pink-lightest:var(--pink-50);--pink-lighter:var(--pink-100);--pink-light:var(--pink-300);--pink-regular:var(--pink-500);--pink-dark:var(--pink-600);--pink-darker:var(--pink-700);--pink-darkest:var(--pink-800);--green-lightest:var(--green-50);--green-lighter:var(--green-100);--green-light:var(--green-300);--green-regular:var(--green-500);--green-dark:var(--green-600);--green-darker:var(--green-800);--green-darkest:var(--green-900);--teal-lightest:var(--teal-50);--teal-lighter:var(--teal-100);--teal-light:var(--teal-300);--teal-regular:var(--teal-500);--teal-dark:var(--teal-600);--teal-darker:var(--teal-700);--teal-darkest:var(--teal-800);--tone-lightest:var(--neutral-white);--tone-lighter:var(--neutral-25);--tone-light:var(--neutral-50);--tone-regular:var(--neutral-75);--tone-dark:var(--neutral-100);--tone-darker:var(--neutral-200);--tone-darkest:var(--neutral-300);--shade-lightest:var(--neutral-400);--shade-lighter:var(--neutral-500);--shade-light:var(--neutral-600);--shade-regular:var(--neutral-700);--shade-dark:var(--neutral-800);--shade-darker:var(--neutral-900);--shade-darkest:var(--neutral-black);--highlight-lightest:var(--cyan-lightest);--highlight-lighter:var(--cyan-lighter);--highlight-light:var(--cyan-light);--highlight-regular:var(--blue-regular);--highlight-dark:var(--blue-dark);--highlight-darker:var(--blue-darker);--highlight-darkest:var(--blue-darkest);--success-lightest:var(--green-lightest);--success-lighter:var(--green-lighter);--success-light:var(--green-light);--success-regular:var(--green-regular);--success-dark:var(--green-dark);--success-darker:var(--green-darker);--success-darkest:var(--green-darkest);--errors-lightest:var(--red-lightest);--errors-lighter:var(--red-lighter);--errors-light:var(--red-light);--errors-regular:var(--red-regular);--errors-dark:var(--red-dark);--errors-darker:var(--red-darker);--errors-darkest:var(--red-darkest);--actions-lightest:var(--purple-50);--actions-lighter:var(--purple-lighter);--actions-light:var(--purple-light);--actions-regular:var(--purple-regular);--actions-dark:var(--purple-dark);--actions-darker:var(--purple-darker);--actions-darkest:var(--purple-darkest);--information-lightest:var(--blue-lightest);--information-lighter:var(--blue-lighter);--information-light:var(--blue-light);--information-regular:var(--blue-regular);--information-dark:var(--blue-dark);--information-darker:var(--blue-darker);--information-darkest:var(--blue-darkest);--alert-lightest:var(--yellow-lightest);--alert-lighter:var(--yellow-lighter);--alert-light:var(--orange-light);--alert-regular:var(--orange-regular);--alert-darker:var(--yellow-darker);--alert-darkest:var(--yellow-darkest);--danger-lightest:var(--red-lightest);--danger-lighter:var(--red-lighter);--danger-light:var(--red-light);--danger-regular:var(--red-regular);--danger-dark:var(--red-dark);--danger-darker:var(--red-darker);--danger-darkest:var(--red-darkest);--disabled-lightest:var(--tone-light);--disabled-lighter:var(--tone-regular);--disabled-light:var(--tone-dark);--disabled-regular:var(--tone-darker);--disabled-dark:var(--shade-lighter);--disabled-darker:var(--shade-light);--disabled-darkest:var(--shade-regular);--label-primary:var(--shade-light);--label-primary-alt:var(--tone-lighter);--label-secondary:var(--tone-darkest);--label-secondary-hover:var(--shade-lighter);--label-white:var(--tone-lightest);--label-highlight:var(--highlight-dark);--label-action:var(--actions-regular);--label-danger:var(--danger-dark);--label-status-error:var(--errors-dark);--label-status-success:var(--success-darker);--label-status-info:var(--information-dark);--label-status-alert:var(--alert-regular);--label-status-disabled:var(--disabled-regular);--surface-primary:var(--tone-lightest);--surface-primary-hover:var(--tone-lighter);--surface-primary-pressed:var(--tone-light);--surface-secondary:var(--neutral-25);--surface-secondary-hover:var(--tone-light);--surface-secondary-pressed:var(--tone-regular);--surface-tertiary:var(--tone-light);--surface-tertiary-hover:var(--tone-lighter);--surface-tertiary-pressed:var(--tone-lightest);--surface-status-success:var(--success-lightest);--surface-status-error:var(--errors-lightest);--surface-status-alert:var(--alert-lightest);--surface-status-info:var(--information-lightest);--surface-status-disabled:var(--disabled-lighter);--surface-action:var(--actions-regular);--surface-action-hover:var(--actions-dark);--surface-action-soft:var(--actions-lightest);--surface-action-soft-hover:var(--actions-lighter);--surface-action-soft-pressed:var(--actions-light);--surface-danger-soft:var(--danger-lightest);--surface-danger-soft-hover:var(--danger-lighter);--surface-danger-soft-pressed:var(--danger-light);--surface-highlight-soft:var(--highlight-lightest);--surface-colour-red-soft:var(--red-lightest);--surface-colour-green-soft:var(--green-lightest);--surface-colour-blue-soft:var(--blue-lightest);--surface-colour-orange-soft:var(--orange-lightest);--surface-colour-yellow-soft:var(--yellow-lightest);--surface-colour-purple-soft:var(--purple-lightest);--surface-colour-indigo-soft:var(--indigo-lightest);--surface-colour-cyan-soft:var(--cyan-lightest);--surface-colour-pink-soft:var(--pink-lightest);--surface-colour-teal-soft:var(--teal-lightest);--border-primary:var(--tone-light);--border-secondary:var(--tone-regular);--border-selected:var(--neutral-600);--border-action:var(--actions-regular);--border-status-error:var(--errors-lighter);--border-status-success:var(--success-lighter);--border-status-alert:var(--alert-lighter);--border-status-info:var(--information-lighter);--border-status-disabled:var(--disabled-lightest);--border-colour-overlay:#121e521a;--fill-primary:var(--shade-lighter);--fill-secondary:var(--tone-darkest);--fill-white:var(--tone-lightest);--fill-action:var(--actions-regular);--fill-highlight:var(--highlight-dark);--fill-danger:var(--danger-dark);--fill-status-success:var(--success-darker);--fill-status-error:var(--errors-dark);--fill-status-alert:var(--alert-regular);--fill-status-info:var(--information-regular);--fill-status-disabled:var(--disabled-light);--gradient-stop1:var(--purple-500);--gradient-stop2:var(--indigo-500);--gradient-stop3:var(--blue-500)}[data-theme=dark]{--label-primary:var(--tone-lighter);--label-primary-alt:var(--shade-light);--label-secondary:var(--tone-darker);--label-secondary-hover:var(--tone-lighter);--label-white:var(--tone-lightest);--label-highlight:var(--highlight-light);--label-action:var(--actions-lighter);--label-danger:var(--danger-light);--label-status-error:var(--errors-light);--label-status-success:var(--success-light);--label-status-info:var(--information-light);--label-status-alert:var(--alert-light);--label-status-disabled:var(--disabled-regular);--surface-primary:var(--shade-darker);--surface-primary-hover:var(--shade-dark);--surface-primary-pressed:var(--shade-regular);--surface-secondary:var(--shade-dark);--surface-secondary-hover:var(--shade-darker);--surface-secondary-pressed:var(--shade-darkest);--surface-tertiary:var(--shade-regular);--surface-tertiary-hover:var(--shade-dark);--surface-tertiary-pressed:var(--shade-darker);--surface-status-success:var(--success-darkest);--surface-status-error:var(--errors-darkest);--surface-status-alert:var(--alert-darkest);--surface-status-info:var(--information-darkest);--surface-status-disabled:var(--disabled-darkest);--surface-action:var(--actions-regular);--surface-action-hover:var(--actions-light);--surface-action-soft:var(--actions-darkest);--surface-action-soft-hover:var(--actions-darker);--surface-action-soft-pressed:var(--actions-dark);--surface-danger-soft:var(--danger-darkest);--surface-danger-soft-hover:var(--danger-darker);--surface-danger-soft-pressed:var(--danger-dark);--surface-highlight-soft:var(--highlight-darkest);--surface-colour-red-soft:var(--red-darkest);--surface-colour-green-soft:var(--green-darkest);--surface-colour-blue-soft:var(--blue-darkest);--surface-colour-orange-soft:var(--orange-darkest);--surface-colour-yellow-soft:var(--yellow-darkest);--surface-colour-purple-soft:var(--purple-darkest);--surface-colour-indigo-soft:var(--indigo-darkest);--surface-colour-cyan-soft:var(--cyan-darkest);--surface-colour-pink-soft:var(--pink-darkest);--surface-colour-teal-soft:var(--teal-darkest);--border-primary:var(--shade-light);--border-secondary:var(--shade-dark);--border-selected:var(--tone-light);--border-action:var(--actions-light);--border-status-error:var(--errors-darker);--border-status-success:var(--success-darker);--border-status-alert:var(--alert-darker);--border-status-info:var(--information-darker);--border-status-disabled:var(--disabled-dark);--border-colour-overlay:#ffffff1a;--fill-primary:var(--tone-lighter);--fill-secondary:var(--tone-darker);--fill-white:var(--tone-lightest);--fill-action:var(--actions-lighter);--fill-highlight:var(--highlight-light);--fill-danger:var(--danger-light);--fill-status-success:var(--success-light);--fill-status-error:var(--errors-light);--fill-status-alert:var(--alert-light);--fill-status-info:var(--information-light);--fill-status-disabled:var(--disabled-dark);--gradient-stop1:var(--indigo-400);--gradient-stop2:var(--cyan-500);--gradient-stop3:var(--cyan-100)}.text-primary{color:var(--label-primary)}.text-secondary{color:var(--label-secondary)}.text-white{color:var(--label-white)}.text-action{color:var(--label-action)}.text-danger{color:var(--label-danger)}.text-success{color:var(--label-status-success)}.text-error{color:var(--label-status-error)}.text-info{color:var(--label-status-info)}.text-warning{color:var(--label-status-alert)}.text-disabled{color:var(--label-status-disabled)}.bg-primary{background-color:var(--surface-primary)}.bg-secondary{background-color:var(--surface-secondary)}.bg-tertiary{background-color:var(--surface-tertiary)}.bg-success{background-color:var(--surface-status-success)}.bg-error{background-color:var(--surface-status-error)}.bg-warning{background-color:var(--surface-status-alert)}.bg-info{background-color:var(--surface-status-info)}.bg-action-soft{background-color:var(--surface-action-soft)}.bg-danger-soft{background-color:var(--surface-danger-soft)}.border-primary{border-color:var(--border-primary)}.border-secondary{border-color:var(--border-secondary)}.border-selected{border-color:var(--border-selected)}.border-action{border-color:var(--border-action)}.border-success{border-color:var(--border-status-success)}.border-error{border-color:var(--border-status-error)}.border-warning{border-color:var(--border-status-alert)}.border-info{border-color:var(--border-status-info)}:root{--radius-zero:0px;--radius-xs:1px;--radius-sm:2px;--radius-md:4px;--radius-reg:8px;--radius-lg:16px;--radius-xl:24px;--spacing-zero:0px;--spacing-xxs:1px;--spacing-xs:2px;--spacing-sm:4px;--spacing-md:8px;--spacing-reg:16px;--spacing-lg:24px;--spacing-xl:32px;--spacing-xxl:64px;--spacing-super:128px;--container-padding-mobile:16px;--opacity-0:0;--opacity-10:0.1;--opacity-20:0.2;--opacity-30:0.3;--opacity-40:0.4;--opacity-50:0.5;--opacity-60:0.6;--opacity-70:0.7;--opacity-80:0.8;--opacity-90:0.9;--opacity-100:1;--color-success-fill:#2d6b18;--color-success-background:#eef9ea;--color-success-border:#c9ecbd;--color-error-fill:#cc3c35;--color-error-background:#fceceb;--color-error-border:#f5c4c2;--color-alert-fill:#fd7e14;--color-alert-background:#fcf6e7;--color-alert-border:#f6e3b4;--color-info-fill:#0e8ce2;--color-info-background:#e7f4fc;--color-info-border:#b4dbf6;--surfaces-status-background-success:var(--color-success-background);--surfaces-status-background-error:var(--color-error-background);--surfaces-status-background-alert:var(--color-alert-background);--surfaces-status-background-info:var(--color-info-background);--borders-status-border-success:var(--color-success-border);--borders-status-border-error:var(--color-error-border);--borders-status-border-alert:var(--color-alert-border);--borders-status-border-info:var(--color-info-border);--fills-status-fill-success:var(--color-success-fill);--fills-status-fill-error:var(--color-error-fill);--fills-status-fill-alert:var(--color-alert-fill);--fills-status-fill-info:var(--color-info-fill);--font-family-sans:\"Geist\",-apple-system,BlinkMacSystemFont,\"Segoe UI\",\"Roboto\",\"Helvetica Neue\",Arial,sans-serif;--font-family-mono:\"Geist Mono\",ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,\"Liberation Mono\",\"Courier New\",monospace;--heading-xxl-size:44px;--heading-xxl-line:48px;--heading-xxl-weight:600;--heading-xl-size:32px;--heading-xl-line:36px;--heading-xl-weight:700;--heading-h1-size:24px;--heading-h1-line:28px;--heading-h1-weight:600;--heading-h2-size:20px;--heading-h2-line:24px;--heading-h2-weight:600;--heading-h3-size:17px;--heading-h3-line:20px;--heading-h3-weight:600;--heading-h4-size:15px;--heading-h4-line:18px;--heading-h4-weight:600;--heading-h5-size:13px;--heading-h5-line:16px;--heading-h5-weight:500;--heading-h6-size:11px;--heading-h6-line:14px;--heading-h6-weight:500;--heading-xxl-mobile-size:32px;--heading-xxl-mobile-line:36px;--heading-xxl-mobile-weight:600;--heading-xl-mobile-size:26px;--heading-xl-mobile-line:30px;--heading-xl-mobile-weight:700;--heading-h1-mobile-size:20px;--heading-h1-mobile-line:23px;--heading-h1-mobile-weight:600;--heading-h2-mobile-size:18px;--heading-h2-mobile-line:22px;--heading-h2-mobile-weight:600;--heading-h3-mobile-size:16px;--heading-h3-mobile-line:18px;--heading-h3-mobile-weight:600;--heading-h4-mobile-size:14px;--heading-h4-mobile-line:16px;--heading-h4-mobile-weight:600;--heading-h5-mobile-size:13px;--heading-h5-mobile-line:16px;--heading-h5-mobile-weight:500;--heading-h6-mobile-size:11px;--heading-h6-mobile-line:14px;--heading-h6-mobile-weight:500;--text-xl-size:20px;--text-xl-line:26px;--text-xl-weight:400;--text-large-size:18px;--text-large-line:24px;--text-large-weight:400;--text-regular-size:15px;--text-regular-line:20px;--text-regular-weight:400;--text-small-size:13px;--text-small-line:16px;--text-small-weight:400;--text-small-emphasis-weight:500;--text-small-bold-weight:600;--text-xs-size:10px;--text-xs-line:13px;--text-xs-weight:500;--text-xs-bold-weight:600}.waiver-template-form-section{gap:var(--padding-reg,16px)}.waiver-template-form-group,.waiver-template-form-section{align-items:flex-start;align-self:stretch;display:flex;flex-direction:column}.waiver-template-form-group{gap:var(--padding-lg,24px)}.text-description{color:var(--label-secondary,#626a90);font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:16px;font-style:normal;line-height:24px}.checkbox{align-items:center;display:flex;gap:11px;max-width:500px}@media (min-width:992px){.checkbox{max-width:unset}}.checkbox__wrapper{align-items:center;cursor:pointer;display:flex;gap:11px;margin:0;-webkit-user-select:none;user-select:none;width:100%}.checkbox__input{cursor:pointer;height:0;opacity:0;position:absolute;width:0}.checkbox__input:checked~.checkbox__toggle{background:var(--fill-selected,#14215a);border:1px solid var(--border-primary,#e8e9ef)}.checkbox__input:checked~.checkbox__toggle .checkbox__xmark{opacity:0;visibility:hidden}.checkbox__input:checked~.checkbox__toggle .checkbox__checked-group{opacity:1;visibility:visible}.checkbox__input:focus~.checkbox__toggle{box-shadow:0 0 0 2px #14215a33}.checkbox__input:disabled~.checkbox__toggle{background-color:var(--surface-status-disabled,#f8f8fa);border-color:var(--border-primary,#e8e9ef);cursor:not-allowed;opacity:.6}.checkbox:not(.checkbox--pristine) .checkbox__input:not(:checked)~.checkbox__toggle .checkbox__xmark{align-items:center;display:flex;justify-content:center;opacity:1;position:absolute;right:4px;top:50%;transform:translateY(-50%);visibility:visible}.checkbox:not(.checkbox--pristine) .checkbox__input:not(:checked)~.checkbox__toggle .checkbox__checked-group{opacity:0;visibility:hidden}.checkbox__toggle{align-items:center;background:var(--surface-secondary,#f8f8fa);border:1px solid var(--border-primary,#e8e9ef);border-radius:var(--padding-xl,32px);display:flex;flex-shrink:0;height:34px;justify-content:flex-end;min-width:58px;padding:4px;position:relative;width:58px}.checkbox__xmark{height:24px;opacity:0;visibility:hidden;width:24px}.checkbox__xmark svg{height:100%;width:100%}.checkbox__checked-group{left:4px;opacity:0;position:absolute;top:50%;transform:translateY(-50%);visibility:hidden}.checkbox__checked-group,.checkbox__circle{align-items:center;display:flex;height:24px;justify-content:center;width:24px}.checkbox__circle{position:relative}.checkbox__circle svg{height:100%;width:100%}.checkbox__checkmark{align-items:center;display:flex;height:24px;justify-content:center;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:24px}.checkbox__checkmark svg{height:100%;width:100%}.checkbox__content{display:flex;flex:1;flex-direction:column;gap:4px}.checkbox__label{color:var(--label-primary);font-size:15px;font-weight:600;line-height:20px}.checkbox__description,.checkbox__label{font-family:var(--font-family-sans,\"Geist\",sans-serif),serif;font-style:normal}.checkbox__description{color:var(--label-secondary);font-size:var(--text-regular-size,15px);font-weight:400;line-height:var(--text-regular-line,20px);overflow-wrap:break-word;word-break:break-word}.checkbox__error-text{color:var(--label-status-error,#ef4444);font-family:var(--font-family-sans,\"Geist\",sans-serif),serif;font-size:var(--text-xs-size,11px);line-height:var(--text-xs-line,14px);margin-left:69px}.checkbox__wrapper:hover .checkbox__input:not(:disabled)~.checkbox__toggle{border-color:var(--border-primary-hover,#d1d3de)}.checkbox--pristine .checkbox__toggle{background:var(--surface-secondary,#f8f8fa)}.checkbox--pristine .checkbox__checked-group,.checkbox--pristine .checkbox__xmark{opacity:0!important;visibility:hidden!important}.checkbox-pristine-wrapper{align-items:center;background:var(--surface-primary,#fff);border:1px solid var(--border-primary,#e8e9ef);border-radius:var(--padding-xl,32px);display:flex;gap:8px;justify-content:flex-end;padding:4px;width:58px}";
4
4
  styleInject(css_248z);
5
5
 
6
6
  export { css_248z as default };
package/dist/v2/components/FormField/FormField.d.ts CHANGED
@@ -7,6 +7,7 @@ export interface FormFieldProps extends InputHTMLAttributes<HTMLInputElement> {
7
7
  success?: boolean;
8
8
  helpText?: string;
9
9
  required?: boolean;
10
+ variant?: 'default' | 'on-surface';
10
11
  }
11
12
  export declare const FormField: import("react").ForwardRefExoticComponent<FormFieldProps & import("react").RefAttributes<HTMLInputElement>>;
12
13
  //# sourceMappingURL=FormField.d.ts.map
package/dist/v2/components/FormField/FormField.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"FormField.d.ts","sourceRoot":"","sources":["../../../../src/v2/components/FormField/FormField.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAc,MAAM,OAAO,CAAA;AACvD,OAAO,kBAAkB,CAAA;AAEzB,MAAM,WAAW,cAAe,SAAQ,mBAAmB,CAAC,gBAAgB,CAAC;IAC3E,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAED,eAAO,MAAM,SAAS,6GA8BrB,CAAA"}
1
+ {"version":3,"file":"FormField.d.ts","sourceRoot":"","sources":["../../../../src/v2/components/FormField/FormField.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAc,MAAM,OAAO,CAAA;AACvD,OAAO,kBAAkB,CAAA;AAEzB,MAAM,WAAW,cAAe,SAAQ,mBAAmB,CAAC,gBAAgB,CAAC;IAC3E,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,CAAC,EAAE,SAAS,GAAG,YAAY,CAAA;CACnC;AAED,eAAO,MAAM,SAAS,6GA+BrB,CAAA"}
package/dist/v2/components/FormField/FormField.js CHANGED
@@ -58,13 +58,14 @@ function _object_without_properties_loose(source, excluded) {
58
58
  return target;
59
59
  }
60
60
  var FormField = /*#__PURE__*/ forwardRef(function(_param, ref) {
61
- var label = _param.label, error = _param.error, hasError = _param.hasError, success = _param.success, helpText = _param.helpText, required = _param.required, _param_className = _param.className, className = _param_className === void 0 ? '' : _param_className, props = _object_without_properties(_param, [
61
+ var label = _param.label, error = _param.error, hasError = _param.hasError, success = _param.success, helpText = _param.helpText, required = _param.required, variant = _param.variant, _param_className = _param.className, className = _param_className === void 0 ? '' : _param_className, props = _object_without_properties(_param, [
62
62
  "label",
63
63
  "error",
64
64
  "hasError",
65
65
  "success",
66
66
  "helpText",
67
67
  "required",
68
+ "variant",
68
69
  "className"
69
70
  ]);
70
71
  var showError = error || hasError;
@@ -72,7 +73,8 @@ var FormField = /*#__PURE__*/ forwardRef(function(_param, ref) {
72
73
  var inputClassName = [
73
74
  'form-field__input',
74
75
  showError ? 'form-field__input--error' : '',
75
- showSuccess ? 'form-field__input--success' : ''
76
+ showSuccess ? 'form-field__input--success' : '',
77
+ variant === 'on-surface' ? 'form-field__input--on-surface' : ''
76
78
  ].filter(Boolean).join(' ');
77
79
  return /*#__PURE__*/ jsxs("div", {
78
80
  className: "form-field ".concat(className),
package/dist/v2/components/FormField/FormField.scss.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import styleInject from '/opt/atlassian/pipelines/agent/build/node_modules/style-inject/dist/style-inject.es.js';
2
2
 
3
- var css_248z = ":root{--blue-50:#e7f4fc;--blue-100:#b4dbf6;--blue-200:#90caf2;--blue-300:#5eb2ec;--blue-400:#3ea3e8;--blue-500:#0e8ce2;--blue-600:#0d7fce;--blue-700:#0a63a0;--blue-800:#084d7c;--blue-900:#063b5f;--cyan-50:#eafbff;--cyan-75:#bdf3ff;--cyan-100:#aff1ff;--cyan-200:#9deeff;--cyan-300:#71e6ff;--cyan-400:#55e1ff;--cyan-500:#2bd9ff;--cyan-600:#27c5e8;--cyan-700:#1f9ab5;--cyan-800:#18778c;--cyan-900:#125b6b;--indigo-50:#efeffe;--indigo-100:#cdccfc;--indigo-200:#b4b4fa;--indigo-300:#9291f8;--indigo-400:#7c74ff;--indigo-500:#5d5bf4;--indigo-600:#5553de;--indigo-700:#4241ad;--indigo-800:#333286;--indigo-900:#272666;--green-50:#eef9ea;--green-100:#c9ecbd;--green-200:#afe39d;--green-300:#8bd671;--green-400:#75ce55;--green-500:#52c22b;--green-600:#4bb127;--green-700:#3a8a1f;--green-800:#2d6b18;--green-900:#225112;--red-50:#fceceb;--red-100:#f5c4c2;--red-200:#f1a8a4;--red-300:#ea807b;--red-400:#e66861;--red-500:#e0423a;--red-600:#cc3c35;--red-700:#9f2f29;--red-800:#7b2420;--red-900:#5e1c18;--purple-50:#efe6fd;--purple-100:#ceb0fa;--purple-200:#b78af7;--purple-300:#965ff4;--purple-400:#8133f1;--purple-500:#6200ee;--purple-600:#5900d9;--purple-700:#4600a9;--purple-800:#360083;--purple-900:#290064;--orange-50:#fff2e8;--orange-100:#fed7b6;--orange-200:#fec493;--orange-300:#fea962;--orange-400:#fd9843;--orange-500:#fd7e14;--orange-600:#e67312;--orange-700:#b4590e;--orange-800:#8b450b;--orange-900:#6a3508;--yellow-50:#fcf6e7;--yellow-100:#f6e3b4;--yellow-200:#f2d68f;--yellow-300:#ecc35c;--yellow-400:#fcc741;--yellow-500:#fbb912;--yellow-600:#e4a810;--yellow-700:#a07509;--yellow-800:#7c5b07;--yellow-900:#5f4505;--pink-50:#fdecf4;--pink-100:#f8c3db;--pink-200:#f4a6ca;--pink-300:#f07eb2;--pink-400:#ed65a3;--pink-500:#e83e8c;--pink-600:#d33874;--pink-700:#a52c63;--pink-800:#80224d;--pink-900:#611a3b;--teal-50:#e9faf7;--teal-100:#baf0e7;--teal-200:#99e8db;--teal-300:#6bdecb;--teal-400:#4ed8c1;--teal-500:#22ceb1;--teal-600:#1fbba1;--teal-700:#18927e;--teal-800:#137161;--teal-900:#0e574a;--neutral-white:#fff;--neutral-25:#f8f8fa;--neutral-50:#e8e9ef;--neutral-75:#d2d5e3;--neutral-100:#b6bacc;--neutral-200:#9399b3;--neutral-300:#626a90;--neutral-400:#433d7b;--neutral-500:#14215a;--neutral-600:#121e52;--neutral-700:#0e1740;--neutral-800:#0b1232;--neutral-900:#080e26;--neutral-black:#000;--purple-lightest:var(--purple-50);--purple-lighter:var(--purple-100);--purple-light:var(--purple-300);--purple-regular:var(--purple-500);--purple-dark:var(--purple-600);--purple-darker:var(--purple-800);--purple-darkest:var(--purple-900);--blue-lightest:var(--blue-50);--blue-lighter:var(--blue-100);--blue-light:var(--blue-300);--blue-regular:var(--blue-500);--blue-dark:var(--blue-600);--blue-darker:var(--blue-800);--blue-darkest:var(--blue-900);--indigo-lightest:var(--indigo-50);--indigo-lighter:var(--indigo-100);--indigo-light:var(--indigo-300);--indigo-regular:var(--indigo-500);--indigo-dark:var(--indigo-600);--indigo-darker:var(--indigo-800);--indigo-darkest:var(--indigo-900);--cyan-lightest:var(--cyan-50);--cyan-lighter:var(--cyan-100);--cyan-light:var(--cyan-300);--cyan-regular:var(--cyan-500);--cyan-dark:var(--cyan-700);--cyan-darker:var(--cyan-800);--cyan-darkest:var(--cyan-900);--red-lightest:var(--red-50);--red-lighter:var(--red-100);--red-light:var(--red-400);--red-regular:var(--red-500);--red-dark:var(--red-600);--red-darker:var(--red-800);--red-darkest:var(--red-900);--orange-lightest:var(--orange-50);--orange-lighter:var(--orange-100);--orange-light:var(--orange-300);--orange-regular:var(--orange-500);--orange-dark:var(--orange-600);--orange-darker:var(--orange-700);--orange-darkest:var(--orange-800);--yellow-lightest:var(--yellow-50);--yellow-lighter:var(--yellow-100);--yellow-light:var(--yellow-300);--yellow-regular:var(--yellow-500);--yellow-dark:var(--yellow-600);--yellow-darker:var(--yellow-800);--yellow-darkest:var(--yellow-900);--pink-lightest:var(--pink-50);--pink-lighter:var(--pink-100);--pink-light:var(--pink-300);--pink-regular:var(--pink-500);--pink-dark:var(--pink-600);--pink-darker:var(--pink-700);--pink-darkest:var(--pink-800);--green-lightest:var(--green-50);--green-lighter:var(--green-100);--green-light:var(--green-300);--green-regular:var(--green-500);--green-dark:var(--green-600);--green-darker:var(--green-800);--green-darkest:var(--green-900);--teal-lightest:var(--teal-50);--teal-lighter:var(--teal-100);--teal-light:var(--teal-300);--teal-regular:var(--teal-500);--teal-dark:var(--teal-600);--teal-darker:var(--teal-700);--teal-darkest:var(--teal-800);--tone-lightest:var(--neutral-white);--tone-lighter:var(--neutral-25);--tone-light:var(--neutral-50);--tone-regular:var(--neutral-75);--tone-dark:var(--neutral-100);--tone-darker:var(--neutral-200);--tone-darkest:var(--neutral-300);--shade-lightest:var(--neutral-400);--shade-lighter:var(--neutral-500);--shade-light:var(--neutral-600);--shade-regular:var(--neutral-700);--shade-dark:var(--neutral-800);--shade-darker:var(--neutral-900);--shade-darkest:var(--neutral-black);--highlight-lightest:var(--cyan-lightest);--highlight-lighter:var(--cyan-lighter);--highlight-light:var(--cyan-light);--highlight-regular:var(--blue-regular);--highlight-dark:var(--blue-dark);--highlight-darker:var(--blue-darker);--highlight-darkest:var(--blue-darkest);--success-lightest:var(--green-lightest);--success-lighter:var(--green-lighter);--success-light:var(--green-light);--success-regular:var(--green-regular);--success-dark:var(--green-dark);--success-darker:var(--green-darker);--success-darkest:var(--green-darkest);--errors-lightest:var(--red-lightest);--errors-lighter:var(--red-lighter);--errors-light:var(--red-light);--errors-regular:var(--red-regular);--errors-dark:var(--red-dark);--errors-darker:var(--red-darker);--errors-darkest:var(--red-darkest);--actions-lightest:var(--purple-50);--actions-lighter:var(--purple-lighter);--actions-light:var(--purple-light);--actions-regular:var(--purple-regular);--actions-dark:var(--purple-dark);--actions-darker:var(--purple-darker);--actions-darkest:var(--purple-darkest);--information-lightest:var(--blue-lightest);--information-lighter:var(--blue-lighter);--information-light:var(--blue-light);--information-regular:var(--blue-regular);--information-dark:var(--blue-dark);--information-darker:var(--blue-darker);--information-darkest:var(--blue-darkest);--alert-lightest:var(--yellow-lightest);--alert-lighter:var(--yellow-lighter);--alert-light:var(--orange-light);--alert-regular:var(--orange-regular);--alert-darker:var(--yellow-darker);--alert-darkest:var(--yellow-darkest);--danger-lightest:var(--red-lightest);--danger-lighter:var(--red-lighter);--danger-light:var(--red-light);--danger-regular:var(--red-regular);--danger-dark:var(--red-dark);--danger-darker:var(--red-darker);--danger-darkest:var(--red-darkest);--disabled-lightest:var(--tone-light);--disabled-lighter:var(--tone-regular);--disabled-light:var(--tone-dark);--disabled-regular:var(--tone-darker);--disabled-dark:var(--shade-lighter);--disabled-darker:var(--shade-light);--disabled-darkest:var(--shade-regular);--label-primary:var(--shade-light);--label-primary-alt:var(--tone-lighter);--label-secondary:var(--tone-darkest);--label-secondary-hover:var(--shade-lighter);--label-white:var(--tone-lightest);--label-highlight:var(--highlight-dark);--label-action:var(--actions-regular);--label-danger:var(--danger-dark);--label-status-error:var(--errors-dark);--label-status-success:var(--success-darker);--label-status-info:var(--information-dark);--label-status-alert:var(--alert-regular);--label-status-disabled:var(--disabled-regular);--surface-primary:var(--tone-lightest);--surface-primary-hover:var(--tone-lighter);--surface-primary-pressed:var(--tone-light);--surface-secondary:var(--neutral-25);--surface-secondary-hover:var(--tone-light);--surface-secondary-pressed:var(--tone-regular);--surface-tertiary:var(--tone-light);--surface-tertiary-hover:var(--tone-lighter);--surface-tertiary-pressed:var(--tone-lightest);--surface-status-success:var(--success-lightest);--surface-status-error:var(--errors-lightest);--surface-status-alert:var(--alert-lightest);--surface-status-info:var(--information-lightest);--surface-status-disabled:var(--disabled-lighter);--surface-action:var(--actions-regular);--surface-action-hover:var(--actions-dark);--surface-action-soft:var(--actions-lightest);--surface-action-soft-hover:var(--actions-lighter);--surface-action-soft-pressed:var(--actions-light);--surface-danger-soft:var(--danger-lightest);--surface-danger-soft-hover:var(--danger-lighter);--surface-danger-soft-pressed:var(--danger-light);--surface-highlight-soft:var(--highlight-lightest);--surface-colour-red-soft:var(--red-lightest);--surface-colour-green-soft:var(--green-lightest);--surface-colour-blue-soft:var(--blue-lightest);--surface-colour-orange-soft:var(--orange-lightest);--surface-colour-yellow-soft:var(--yellow-lightest);--surface-colour-purple-soft:var(--purple-lightest);--surface-colour-indigo-soft:var(--indigo-lightest);--surface-colour-cyan-soft:var(--cyan-lightest);--surface-colour-pink-soft:var(--pink-lightest);--surface-colour-teal-soft:var(--teal-lightest);--border-primary:var(--tone-light);--border-secondary:var(--tone-regular);--border-selected:var(--neutral-600);--border-action:var(--actions-regular);--border-status-error:var(--errors-lighter);--border-status-success:var(--success-lighter);--border-status-alert:var(--alert-lighter);--border-status-info:var(--information-lighter);--border-status-disabled:var(--disabled-lightest);--border-colour-overlay:#121e521a;--fill-primary:var(--shade-lighter);--fill-secondary:var(--tone-darkest);--fill-white:var(--tone-lightest);--fill-action:var(--actions-regular);--fill-highlight:var(--highlight-dark);--fill-danger:var(--danger-dark);--fill-status-success:var(--success-darker);--fill-status-error:var(--errors-dark);--fill-status-alert:var(--alert-regular);--fill-status-info:var(--information-regular);--fill-status-disabled:var(--disabled-light);--gradient-stop1:var(--purple-500);--gradient-stop2:var(--indigo-500);--gradient-stop3:var(--blue-500)}[data-theme=dark]{--label-primary:var(--tone-lighter);--label-primary-alt:var(--shade-light);--label-secondary:var(--tone-darker);--label-secondary-hover:var(--tone-lighter);--label-white:var(--tone-lightest);--label-highlight:var(--highlight-light);--label-action:var(--actions-lighter);--label-danger:var(--danger-light);--label-status-error:var(--errors-light);--label-status-success:var(--success-light);--label-status-info:var(--information-light);--label-status-alert:var(--alert-light);--label-status-disabled:var(--disabled-regular);--surface-primary:var(--shade-darker);--surface-primary-hover:var(--shade-dark);--surface-primary-pressed:var(--shade-regular);--surface-secondary:var(--shade-dark);--surface-secondary-hover:var(--shade-darker);--surface-secondary-pressed:var(--shade-darkest);--surface-tertiary:var(--shade-regular);--surface-tertiary-hover:var(--shade-dark);--surface-tertiary-pressed:var(--shade-darker);--surface-status-success:var(--success-darkest);--surface-status-error:var(--errors-darkest);--surface-status-alert:var(--alert-darkest);--surface-status-info:var(--information-darkest);--surface-status-disabled:var(--disabled-darkest);--surface-action:var(--actions-regular);--surface-action-hover:var(--actions-light);--surface-action-soft:var(--actions-darkest);--surface-action-soft-hover:var(--actions-darker);--surface-action-soft-pressed:var(--actions-dark);--surface-danger-soft:var(--danger-darkest);--surface-danger-soft-hover:var(--danger-darker);--surface-danger-soft-pressed:var(--danger-dark);--surface-highlight-soft:var(--highlight-darkest);--surface-colour-red-soft:var(--red-darkest);--surface-colour-green-soft:var(--green-darkest);--surface-colour-blue-soft:var(--blue-darkest);--surface-colour-orange-soft:var(--orange-darkest);--surface-colour-yellow-soft:var(--yellow-darkest);--surface-colour-purple-soft:var(--purple-darkest);--surface-colour-indigo-soft:var(--indigo-darkest);--surface-colour-cyan-soft:var(--cyan-darkest);--surface-colour-pink-soft:var(--pink-darkest);--surface-colour-teal-soft:var(--teal-darkest);--border-primary:var(--shade-light);--border-secondary:var(--shade-dark);--border-selected:var(--tone-light);--border-action:var(--actions-light);--border-status-error:var(--errors-darker);--border-status-success:var(--success-darker);--border-status-alert:var(--alert-darker);--border-status-info:var(--information-darker);--border-status-disabled:var(--disabled-dark);--border-colour-overlay:#ffffff1a;--fill-primary:var(--tone-lighter);--fill-secondary:var(--tone-darker);--fill-white:var(--tone-lightest);--fill-action:var(--actions-lighter);--fill-highlight:var(--highlight-light);--fill-danger:var(--danger-light);--fill-status-success:var(--success-light);--fill-status-error:var(--errors-light);--fill-status-alert:var(--alert-light);--fill-status-info:var(--information-light);--fill-status-disabled:var(--disabled-dark);--gradient-stop1:var(--indigo-400);--gradient-stop2:var(--cyan-500);--gradient-stop3:var(--cyan-100)}.text-primary{color:var(--label-primary)}.text-secondary{color:var(--label-secondary)}.text-white{color:var(--label-white)}.text-action{color:var(--label-action)}.text-danger{color:var(--label-danger)}.text-success{color:var(--label-status-success)}.text-error{color:var(--label-status-error)}.text-info{color:var(--label-status-info)}.text-warning{color:var(--label-status-alert)}.text-disabled{color:var(--label-status-disabled)}.bg-primary{background-color:var(--surface-primary)}.bg-secondary{background-color:var(--surface-secondary)}.bg-tertiary{background-color:var(--surface-tertiary)}.bg-success{background-color:var(--surface-status-success)}.bg-error{background-color:var(--surface-status-error)}.bg-warning{background-color:var(--surface-status-alert)}.bg-info{background-color:var(--surface-status-info)}.bg-action-soft{background-color:var(--surface-action-soft)}.bg-danger-soft{background-color:var(--surface-danger-soft)}.border-primary{border-color:var(--border-primary)}.border-secondary{border-color:var(--border-secondary)}.border-selected{border-color:var(--border-selected)}.border-action{border-color:var(--border-action)}.border-success{border-color:var(--border-status-success)}.border-error{border-color:var(--border-status-error)}.border-warning{border-color:var(--border-status-alert)}.border-info{border-color:var(--border-status-info)}:root{--radius-zero:0px;--radius-xs:1px;--radius-sm:2px;--radius-md:4px;--radius-reg:8px;--radius-lg:16px;--radius-xl:24px;--spacing-zero:0px;--spacing-xxs:1px;--spacing-xs:2px;--spacing-sm:4px;--spacing-md:8px;--spacing-reg:16px;--spacing-lg:24px;--spacing-xl:32px;--spacing-xxl:64px;--spacing-super:128px;--container-padding-mobile:16px;--opacity-0:0;--opacity-10:0.1;--opacity-20:0.2;--opacity-30:0.3;--opacity-40:0.4;--opacity-50:0.5;--opacity-60:0.6;--opacity-70:0.7;--opacity-80:0.8;--opacity-90:0.9;--opacity-100:1;--color-success-fill:#2d6b18;--color-success-background:#eef9ea;--color-success-border:#c9ecbd;--color-error-fill:#cc3c35;--color-error-background:#fceceb;--color-error-border:#f5c4c2;--color-alert-fill:#fd7e14;--color-alert-background:#fcf6e7;--color-alert-border:#f6e3b4;--color-info-fill:#0e8ce2;--color-info-background:#e7f4fc;--color-info-border:#b4dbf6;--surfaces-status-background-success:var(--color-success-background);--surfaces-status-background-error:var(--color-error-background);--surfaces-status-background-alert:var(--color-alert-background);--surfaces-status-background-info:var(--color-info-background);--borders-status-border-success:var(--color-success-border);--borders-status-border-error:var(--color-error-border);--borders-status-border-alert:var(--color-alert-border);--borders-status-border-info:var(--color-info-border);--fills-status-fill-success:var(--color-success-fill);--fills-status-fill-error:var(--color-error-fill);--fills-status-fill-alert:var(--color-alert-fill);--fills-status-fill-info:var(--color-info-fill);--font-family-sans:\"Geist\",-apple-system,BlinkMacSystemFont,\"Segoe UI\",\"Roboto\",\"Helvetica Neue\",Arial,sans-serif;--font-family-mono:\"Geist Mono\",ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,\"Liberation Mono\",\"Courier New\",monospace;--heading-xxl-size:44px;--heading-xxl-line:48px;--heading-xxl-weight:600;--heading-xl-size:32px;--heading-xl-line:36px;--heading-xl-weight:700;--heading-h1-size:24px;--heading-h1-line:28px;--heading-h1-weight:600;--heading-h2-size:20px;--heading-h2-line:24px;--heading-h2-weight:600;--heading-h3-size:17px;--heading-h3-line:20px;--heading-h3-weight:600;--heading-h4-size:15px;--heading-h4-line:18px;--heading-h4-weight:600;--heading-h5-size:13px;--heading-h5-line:16px;--heading-h5-weight:500;--heading-h6-size:11px;--heading-h6-line:14px;--heading-h6-weight:500;--heading-xxl-mobile-size:32px;--heading-xxl-mobile-line:36px;--heading-xxl-mobile-weight:600;--heading-xl-mobile-size:26px;--heading-xl-mobile-line:30px;--heading-xl-mobile-weight:700;--heading-h1-mobile-size:20px;--heading-h1-mobile-line:23px;--heading-h1-mobile-weight:600;--heading-h2-mobile-size:18px;--heading-h2-mobile-line:22px;--heading-h2-mobile-weight:600;--heading-h3-mobile-size:16px;--heading-h3-mobile-line:18px;--heading-h3-mobile-weight:600;--heading-h4-mobile-size:14px;--heading-h4-mobile-line:16px;--heading-h4-mobile-weight:600;--heading-h5-mobile-size:13px;--heading-h5-mobile-line:16px;--heading-h5-mobile-weight:500;--heading-h6-mobile-size:11px;--heading-h6-mobile-line:14px;--heading-h6-mobile-weight:500;--text-xl-size:20px;--text-xl-line:26px;--text-xl-weight:400;--text-large-size:18px;--text-large-line:24px;--text-large-weight:400;--text-regular-size:15px;--text-regular-line:20px;--text-regular-weight:400;--text-small-size:13px;--text-small-line:16px;--text-small-weight:400;--text-small-emphasis-weight:500;--text-small-bold-weight:600;--text-xs-size:10px;--text-xs-line:13px;--text-xs-weight:500;--text-xs-bold-weight:600}.waiver-template-form-section{gap:var(--padding-reg,16px)}.waiver-template-form-group,.waiver-template-form-section{align-items:flex-start;align-self:stretch;display:flex;flex-direction:column}.waiver-template-form-group{gap:var(--padding-lg,24px)}.text-description{color:var(--label-secondary,#626a90);font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:16px;font-style:normal;line-height:24px}.form-field{align-items:flex-start;display:flex;flex-direction:column;gap:var(--spacing-xs,4px);width:100%}.form-field__label{align-items:center;align-self:stretch;color:var(--label-primary,#121e52);display:flex;font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:15px;font-weight:600;gap:4px;line-height:20px;margin:0}.form-field__required{color:var(--label-status-error,#ef4444);margin-left:2px}.form-field__input{align-items:center;align-self:stretch;background-color:var(--surface-secondary,#f8f8fa);border:2px solid var(--border-primary,#e8e9ef);border-radius:var(--radius-md,4px);color:var(--label-primary,#121e52);display:flex;font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:var(--text-regular-size,16px);gap:8px;height:40px;line-height:var(--text-regular-line,20px);outline:none;padding:8px 10px;transition:all .2s ease;width:100%}.form-field__input::placeholder{color:var(--label-secondary,#626a90)}.form-field__input:focus{background-color:var(--surface-secondary,#f8f8fa);border-color:var(--border-selected,#6200ee)}.form-field__input--error,.form-field__input--error:focus{border-color:var(--borders-status-border-error,#ef4444)}.form-field__input--success,.form-field__input--success:focus{border-color:var(--border-status-success,#c9ecbd)}.form-field__input:disabled{background:var(--surface-status-disabled,#f8f8fa);color:var(--label-secondary,#626a90);cursor:not-allowed;opacity:.6}.form-field__help-text{color:var(--label-secondary,#626a90);font-size:var(--text-regular-size,15px);line-height:var(--text-regular-line,20px)}.form-field__error-text{color:var(--label-status-error,#ef4444);font-size:var(--text-xs-size,11px);line-height:var(--text-xs-line,14px)}";
3
+ var css_248z = ":root{--blue-50:#e7f4fc;--blue-100:#b4dbf6;--blue-200:#90caf2;--blue-300:#5eb2ec;--blue-400:#3ea3e8;--blue-500:#0e8ce2;--blue-600:#0d7fce;--blue-700:#0a63a0;--blue-800:#084d7c;--blue-900:#063b5f;--cyan-50:#eafbff;--cyan-75:#bdf3ff;--cyan-100:#aff1ff;--cyan-200:#9deeff;--cyan-300:#71e6ff;--cyan-400:#55e1ff;--cyan-500:#2bd9ff;--cyan-600:#27c5e8;--cyan-700:#1f9ab5;--cyan-800:#18778c;--cyan-900:#125b6b;--indigo-50:#efeffe;--indigo-100:#cdccfc;--indigo-200:#b4b4fa;--indigo-300:#9291f8;--indigo-400:#7c74ff;--indigo-500:#5d5bf4;--indigo-600:#5553de;--indigo-700:#4241ad;--indigo-800:#333286;--indigo-900:#272666;--green-50:#eef9ea;--green-100:#c9ecbd;--green-200:#afe39d;--green-300:#8bd671;--green-400:#75ce55;--green-500:#52c22b;--green-600:#4bb127;--green-700:#3a8a1f;--green-800:#2d6b18;--green-900:#225112;--red-50:#fceceb;--red-100:#f5c4c2;--red-200:#f1a8a4;--red-300:#ea807b;--red-400:#e66861;--red-500:#e0423a;--red-600:#cc3c35;--red-700:#9f2f29;--red-800:#7b2420;--red-900:#5e1c18;--purple-50:#efe6fd;--purple-100:#ceb0fa;--purple-200:#b78af7;--purple-300:#965ff4;--purple-400:#8133f1;--purple-500:#6200ee;--purple-600:#5900d9;--purple-700:#4600a9;--purple-800:#360083;--purple-900:#290064;--orange-50:#fff2e8;--orange-100:#fed7b6;--orange-200:#fec493;--orange-300:#fea962;--orange-400:#fd9843;--orange-500:#fd7e14;--orange-600:#e67312;--orange-700:#b4590e;--orange-800:#8b450b;--orange-900:#6a3508;--yellow-50:#fcf6e7;--yellow-100:#f6e3b4;--yellow-200:#f2d68f;--yellow-300:#ecc35c;--yellow-400:#fcc741;--yellow-500:#fbb912;--yellow-600:#e4a810;--yellow-700:#a07509;--yellow-800:#7c5b07;--yellow-900:#5f4505;--pink-50:#fdecf4;--pink-100:#f8c3db;--pink-200:#f4a6ca;--pink-300:#f07eb2;--pink-400:#ed65a3;--pink-500:#e83e8c;--pink-600:#d33874;--pink-700:#a52c63;--pink-800:#80224d;--pink-900:#611a3b;--teal-50:#e9faf7;--teal-100:#baf0e7;--teal-200:#99e8db;--teal-300:#6bdecb;--teal-400:#4ed8c1;--teal-500:#22ceb1;--teal-600:#1fbba1;--teal-700:#18927e;--teal-800:#137161;--teal-900:#0e574a;--neutral-white:#fff;--neutral-25:#f8f8fa;--neutral-50:#e8e9ef;--neutral-75:#d2d5e3;--neutral-100:#b6bacc;--neutral-200:#9399b3;--neutral-300:#626a90;--neutral-400:#433d7b;--neutral-500:#14215a;--neutral-600:#121e52;--neutral-700:#0e1740;--neutral-800:#0b1232;--neutral-900:#080e26;--neutral-black:#000;--purple-lightest:var(--purple-50);--purple-lighter:var(--purple-100);--purple-light:var(--purple-300);--purple-regular:var(--purple-500);--purple-dark:var(--purple-600);--purple-darker:var(--purple-800);--purple-darkest:var(--purple-900);--blue-lightest:var(--blue-50);--blue-lighter:var(--blue-100);--blue-light:var(--blue-300);--blue-regular:var(--blue-500);--blue-dark:var(--blue-600);--blue-darker:var(--blue-800);--blue-darkest:var(--blue-900);--indigo-lightest:var(--indigo-50);--indigo-lighter:var(--indigo-100);--indigo-light:var(--indigo-300);--indigo-regular:var(--indigo-500);--indigo-dark:var(--indigo-600);--indigo-darker:var(--indigo-800);--indigo-darkest:var(--indigo-900);--cyan-lightest:var(--cyan-50);--cyan-lighter:var(--cyan-100);--cyan-light:var(--cyan-300);--cyan-regular:var(--cyan-500);--cyan-dark:var(--cyan-700);--cyan-darker:var(--cyan-800);--cyan-darkest:var(--cyan-900);--red-lightest:var(--red-50);--red-lighter:var(--red-100);--red-light:var(--red-400);--red-regular:var(--red-500);--red-dark:var(--red-600);--red-darker:var(--red-800);--red-darkest:var(--red-900);--orange-lightest:var(--orange-50);--orange-lighter:var(--orange-100);--orange-light:var(--orange-300);--orange-regular:var(--orange-500);--orange-dark:var(--orange-600);--orange-darker:var(--orange-700);--orange-darkest:var(--orange-800);--yellow-lightest:var(--yellow-50);--yellow-lighter:var(--yellow-100);--yellow-light:var(--yellow-300);--yellow-regular:var(--yellow-500);--yellow-dark:var(--yellow-600);--yellow-darker:var(--yellow-800);--yellow-darkest:var(--yellow-900);--pink-lightest:var(--pink-50);--pink-lighter:var(--pink-100);--pink-light:var(--pink-300);--pink-regular:var(--pink-500);--pink-dark:var(--pink-600);--pink-darker:var(--pink-700);--pink-darkest:var(--pink-800);--green-lightest:var(--green-50);--green-lighter:var(--green-100);--green-light:var(--green-300);--green-regular:var(--green-500);--green-dark:var(--green-600);--green-darker:var(--green-800);--green-darkest:var(--green-900);--teal-lightest:var(--teal-50);--teal-lighter:var(--teal-100);--teal-light:var(--teal-300);--teal-regular:var(--teal-500);--teal-dark:var(--teal-600);--teal-darker:var(--teal-700);--teal-darkest:var(--teal-800);--tone-lightest:var(--neutral-white);--tone-lighter:var(--neutral-25);--tone-light:var(--neutral-50);--tone-regular:var(--neutral-75);--tone-dark:var(--neutral-100);--tone-darker:var(--neutral-200);--tone-darkest:var(--neutral-300);--shade-lightest:var(--neutral-400);--shade-lighter:var(--neutral-500);--shade-light:var(--neutral-600);--shade-regular:var(--neutral-700);--shade-dark:var(--neutral-800);--shade-darker:var(--neutral-900);--shade-darkest:var(--neutral-black);--highlight-lightest:var(--cyan-lightest);--highlight-lighter:var(--cyan-lighter);--highlight-light:var(--cyan-light);--highlight-regular:var(--blue-regular);--highlight-dark:var(--blue-dark);--highlight-darker:var(--blue-darker);--highlight-darkest:var(--blue-darkest);--success-lightest:var(--green-lightest);--success-lighter:var(--green-lighter);--success-light:var(--green-light);--success-regular:var(--green-regular);--success-dark:var(--green-dark);--success-darker:var(--green-darker);--success-darkest:var(--green-darkest);--errors-lightest:var(--red-lightest);--errors-lighter:var(--red-lighter);--errors-light:var(--red-light);--errors-regular:var(--red-regular);--errors-dark:var(--red-dark);--errors-darker:var(--red-darker);--errors-darkest:var(--red-darkest);--actions-lightest:var(--purple-50);--actions-lighter:var(--purple-lighter);--actions-light:var(--purple-light);--actions-regular:var(--purple-regular);--actions-dark:var(--purple-dark);--actions-darker:var(--purple-darker);--actions-darkest:var(--purple-darkest);--information-lightest:var(--blue-lightest);--information-lighter:var(--blue-lighter);--information-light:var(--blue-light);--information-regular:var(--blue-regular);--information-dark:var(--blue-dark);--information-darker:var(--blue-darker);--information-darkest:var(--blue-darkest);--alert-lightest:var(--yellow-lightest);--alert-lighter:var(--yellow-lighter);--alert-light:var(--orange-light);--alert-regular:var(--orange-regular);--alert-darker:var(--yellow-darker);--alert-darkest:var(--yellow-darkest);--danger-lightest:var(--red-lightest);--danger-lighter:var(--red-lighter);--danger-light:var(--red-light);--danger-regular:var(--red-regular);--danger-dark:var(--red-dark);--danger-darker:var(--red-darker);--danger-darkest:var(--red-darkest);--disabled-lightest:var(--tone-light);--disabled-lighter:var(--tone-regular);--disabled-light:var(--tone-dark);--disabled-regular:var(--tone-darker);--disabled-dark:var(--shade-lighter);--disabled-darker:var(--shade-light);--disabled-darkest:var(--shade-regular);--label-primary:var(--shade-light);--label-primary-alt:var(--tone-lighter);--label-secondary:var(--tone-darkest);--label-secondary-hover:var(--shade-lighter);--label-white:var(--tone-lightest);--label-highlight:var(--highlight-dark);--label-action:var(--actions-regular);--label-danger:var(--danger-dark);--label-status-error:var(--errors-dark);--label-status-success:var(--success-darker);--label-status-info:var(--information-dark);--label-status-alert:var(--alert-regular);--label-status-disabled:var(--disabled-regular);--surface-primary:var(--tone-lightest);--surface-primary-hover:var(--tone-lighter);--surface-primary-pressed:var(--tone-light);--surface-secondary:var(--neutral-25);--surface-secondary-hover:var(--tone-light);--surface-secondary-pressed:var(--tone-regular);--surface-tertiary:var(--tone-light);--surface-tertiary-hover:var(--tone-lighter);--surface-tertiary-pressed:var(--tone-lightest);--surface-status-success:var(--success-lightest);--surface-status-error:var(--errors-lightest);--surface-status-alert:var(--alert-lightest);--surface-status-info:var(--information-lightest);--surface-status-disabled:var(--disabled-lighter);--surface-action:var(--actions-regular);--surface-action-hover:var(--actions-dark);--surface-action-soft:var(--actions-lightest);--surface-action-soft-hover:var(--actions-lighter);--surface-action-soft-pressed:var(--actions-light);--surface-danger-soft:var(--danger-lightest);--surface-danger-soft-hover:var(--danger-lighter);--surface-danger-soft-pressed:var(--danger-light);--surface-highlight-soft:var(--highlight-lightest);--surface-colour-red-soft:var(--red-lightest);--surface-colour-green-soft:var(--green-lightest);--surface-colour-blue-soft:var(--blue-lightest);--surface-colour-orange-soft:var(--orange-lightest);--surface-colour-yellow-soft:var(--yellow-lightest);--surface-colour-purple-soft:var(--purple-lightest);--surface-colour-indigo-soft:var(--indigo-lightest);--surface-colour-cyan-soft:var(--cyan-lightest);--surface-colour-pink-soft:var(--pink-lightest);--surface-colour-teal-soft:var(--teal-lightest);--border-primary:var(--tone-light);--border-secondary:var(--tone-regular);--border-selected:var(--neutral-600);--border-action:var(--actions-regular);--border-status-error:var(--errors-lighter);--border-status-success:var(--success-lighter);--border-status-alert:var(--alert-lighter);--border-status-info:var(--information-lighter);--border-status-disabled:var(--disabled-lightest);--border-colour-overlay:#121e521a;--fill-primary:var(--shade-lighter);--fill-secondary:var(--tone-darkest);--fill-white:var(--tone-lightest);--fill-action:var(--actions-regular);--fill-highlight:var(--highlight-dark);--fill-danger:var(--danger-dark);--fill-status-success:var(--success-darker);--fill-status-error:var(--errors-dark);--fill-status-alert:var(--alert-regular);--fill-status-info:var(--information-regular);--fill-status-disabled:var(--disabled-light);--gradient-stop1:var(--purple-500);--gradient-stop2:var(--indigo-500);--gradient-stop3:var(--blue-500)}[data-theme=dark]{--label-primary:var(--tone-lighter);--label-primary-alt:var(--shade-light);--label-secondary:var(--tone-darker);--label-secondary-hover:var(--tone-lighter);--label-white:var(--tone-lightest);--label-highlight:var(--highlight-light);--label-action:var(--actions-lighter);--label-danger:var(--danger-light);--label-status-error:var(--errors-light);--label-status-success:var(--success-light);--label-status-info:var(--information-light);--label-status-alert:var(--alert-light);--label-status-disabled:var(--disabled-regular);--surface-primary:var(--shade-darker);--surface-primary-hover:var(--shade-dark);--surface-primary-pressed:var(--shade-regular);--surface-secondary:var(--shade-dark);--surface-secondary-hover:var(--shade-darker);--surface-secondary-pressed:var(--shade-darkest);--surface-tertiary:var(--shade-regular);--surface-tertiary-hover:var(--shade-dark);--surface-tertiary-pressed:var(--shade-darker);--surface-status-success:var(--success-darkest);--surface-status-error:var(--errors-darkest);--surface-status-alert:var(--alert-darkest);--surface-status-info:var(--information-darkest);--surface-status-disabled:var(--disabled-darkest);--surface-action:var(--actions-regular);--surface-action-hover:var(--actions-light);--surface-action-soft:var(--actions-darkest);--surface-action-soft-hover:var(--actions-darker);--surface-action-soft-pressed:var(--actions-dark);--surface-danger-soft:var(--danger-darkest);--surface-danger-soft-hover:var(--danger-darker);--surface-danger-soft-pressed:var(--danger-dark);--surface-highlight-soft:var(--highlight-darkest);--surface-colour-red-soft:var(--red-darkest);--surface-colour-green-soft:var(--green-darkest);--surface-colour-blue-soft:var(--blue-darkest);--surface-colour-orange-soft:var(--orange-darkest);--surface-colour-yellow-soft:var(--yellow-darkest);--surface-colour-purple-soft:var(--purple-darkest);--surface-colour-indigo-soft:var(--indigo-darkest);--surface-colour-cyan-soft:var(--cyan-darkest);--surface-colour-pink-soft:var(--pink-darkest);--surface-colour-teal-soft:var(--teal-darkest);--border-primary:var(--shade-light);--border-secondary:var(--shade-dark);--border-selected:var(--tone-light);--border-action:var(--actions-light);--border-status-error:var(--errors-darker);--border-status-success:var(--success-darker);--border-status-alert:var(--alert-darker);--border-status-info:var(--information-darker);--border-status-disabled:var(--disabled-dark);--border-colour-overlay:#ffffff1a;--fill-primary:var(--tone-lighter);--fill-secondary:var(--tone-darker);--fill-white:var(--tone-lightest);--fill-action:var(--actions-lighter);--fill-highlight:var(--highlight-light);--fill-danger:var(--danger-light);--fill-status-success:var(--success-light);--fill-status-error:var(--errors-light);--fill-status-alert:var(--alert-light);--fill-status-info:var(--information-light);--fill-status-disabled:var(--disabled-dark);--gradient-stop1:var(--indigo-400);--gradient-stop2:var(--cyan-500);--gradient-stop3:var(--cyan-100)}.text-primary{color:var(--label-primary)}.text-secondary{color:var(--label-secondary)}.text-white{color:var(--label-white)}.text-action{color:var(--label-action)}.text-danger{color:var(--label-danger)}.text-success{color:var(--label-status-success)}.text-error{color:var(--label-status-error)}.text-info{color:var(--label-status-info)}.text-warning{color:var(--label-status-alert)}.text-disabled{color:var(--label-status-disabled)}.bg-primary{background-color:var(--surface-primary)}.bg-secondary{background-color:var(--surface-secondary)}.bg-tertiary{background-color:var(--surface-tertiary)}.bg-success{background-color:var(--surface-status-success)}.bg-error{background-color:var(--surface-status-error)}.bg-warning{background-color:var(--surface-status-alert)}.bg-info{background-color:var(--surface-status-info)}.bg-action-soft{background-color:var(--surface-action-soft)}.bg-danger-soft{background-color:var(--surface-danger-soft)}.border-primary{border-color:var(--border-primary)}.border-secondary{border-color:var(--border-secondary)}.border-selected{border-color:var(--border-selected)}.border-action{border-color:var(--border-action)}.border-success{border-color:var(--border-status-success)}.border-error{border-color:var(--border-status-error)}.border-warning{border-color:var(--border-status-alert)}.border-info{border-color:var(--border-status-info)}:root{--radius-zero:0px;--radius-xs:1px;--radius-sm:2px;--radius-md:4px;--radius-reg:8px;--radius-lg:16px;--radius-xl:24px;--spacing-zero:0px;--spacing-xxs:1px;--spacing-xs:2px;--spacing-sm:4px;--spacing-md:8px;--spacing-reg:16px;--spacing-lg:24px;--spacing-xl:32px;--spacing-xxl:64px;--spacing-super:128px;--container-padding-mobile:16px;--opacity-0:0;--opacity-10:0.1;--opacity-20:0.2;--opacity-30:0.3;--opacity-40:0.4;--opacity-50:0.5;--opacity-60:0.6;--opacity-70:0.7;--opacity-80:0.8;--opacity-90:0.9;--opacity-100:1;--color-success-fill:#2d6b18;--color-success-background:#eef9ea;--color-success-border:#c9ecbd;--color-error-fill:#cc3c35;--color-error-background:#fceceb;--color-error-border:#f5c4c2;--color-alert-fill:#fd7e14;--color-alert-background:#fcf6e7;--color-alert-border:#f6e3b4;--color-info-fill:#0e8ce2;--color-info-background:#e7f4fc;--color-info-border:#b4dbf6;--surfaces-status-background-success:var(--color-success-background);--surfaces-status-background-error:var(--color-error-background);--surfaces-status-background-alert:var(--color-alert-background);--surfaces-status-background-info:var(--color-info-background);--borders-status-border-success:var(--color-success-border);--borders-status-border-error:var(--color-error-border);--borders-status-border-alert:var(--color-alert-border);--borders-status-border-info:var(--color-info-border);--fills-status-fill-success:var(--color-success-fill);--fills-status-fill-error:var(--color-error-fill);--fills-status-fill-alert:var(--color-alert-fill);--fills-status-fill-info:var(--color-info-fill);--font-family-sans:\"Geist\",-apple-system,BlinkMacSystemFont,\"Segoe UI\",\"Roboto\",\"Helvetica Neue\",Arial,sans-serif;--font-family-mono:\"Geist Mono\",ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,\"Liberation Mono\",\"Courier New\",monospace;--heading-xxl-size:44px;--heading-xxl-line:48px;--heading-xxl-weight:600;--heading-xl-size:32px;--heading-xl-line:36px;--heading-xl-weight:700;--heading-h1-size:24px;--heading-h1-line:28px;--heading-h1-weight:600;--heading-h2-size:20px;--heading-h2-line:24px;--heading-h2-weight:600;--heading-h3-size:17px;--heading-h3-line:20px;--heading-h3-weight:600;--heading-h4-size:15px;--heading-h4-line:18px;--heading-h4-weight:600;--heading-h5-size:13px;--heading-h5-line:16px;--heading-h5-weight:500;--heading-h6-size:11px;--heading-h6-line:14px;--heading-h6-weight:500;--heading-xxl-mobile-size:32px;--heading-xxl-mobile-line:36px;--heading-xxl-mobile-weight:600;--heading-xl-mobile-size:26px;--heading-xl-mobile-line:30px;--heading-xl-mobile-weight:700;--heading-h1-mobile-size:20px;--heading-h1-mobile-line:23px;--heading-h1-mobile-weight:600;--heading-h2-mobile-size:18px;--heading-h2-mobile-line:22px;--heading-h2-mobile-weight:600;--heading-h3-mobile-size:16px;--heading-h3-mobile-line:18px;--heading-h3-mobile-weight:600;--heading-h4-mobile-size:14px;--heading-h4-mobile-line:16px;--heading-h4-mobile-weight:600;--heading-h5-mobile-size:13px;--heading-h5-mobile-line:16px;--heading-h5-mobile-weight:500;--heading-h6-mobile-size:11px;--heading-h6-mobile-line:14px;--heading-h6-mobile-weight:500;--text-xl-size:20px;--text-xl-line:26px;--text-xl-weight:400;--text-large-size:18px;--text-large-line:24px;--text-large-weight:400;--text-regular-size:15px;--text-regular-line:20px;--text-regular-weight:400;--text-small-size:13px;--text-small-line:16px;--text-small-weight:400;--text-small-emphasis-weight:500;--text-small-bold-weight:600;--text-xs-size:10px;--text-xs-line:13px;--text-xs-weight:500;--text-xs-bold-weight:600}.waiver-template-form-section{gap:var(--padding-reg,16px)}.waiver-template-form-group,.waiver-template-form-section{align-items:flex-start;align-self:stretch;display:flex;flex-direction:column}.waiver-template-form-group{gap:var(--padding-lg,24px)}.text-description{color:var(--label-secondary,#626a90);font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:16px;font-style:normal;line-height:24px}.form-field{align-items:flex-start;display:flex;flex-direction:column;gap:var(--spacing-xs,4px);width:100%}.form-field__label{align-items:center;align-self:stretch;color:var(--label-primary,#121e52);display:flex;font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:15px;font-weight:600;gap:4px;line-height:20px;margin:0}.form-field__required{color:var(--label-status-error,#ef4444);margin-left:2px}.form-field__input{align-items:center;align-self:stretch;background-color:var(--surface-secondary,#f8f8fa);border:2px solid var(--border-primary,#e8e9ef);border-radius:var(--radius-md,4px);color:var(--label-primary,#121e52);display:flex;font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:var(--text-regular-size,16px);gap:8px;height:40px;line-height:var(--text-regular-line,20px);outline:none;padding:8px 10px;transition:all .2s ease;width:100%}.form-field__input::placeholder{color:var(--label-secondary,#626a90)}.form-field__input:focus{background-color:var(--surface-secondary,#f8f8fa);border-color:var(--border-selected,#6200ee)}.form-field__input--error,.form-field__input--error:focus{border-color:var(--borders-status-border-error,#ef4444)}.form-field__input--success,.form-field__input--success:focus{border-color:var(--border-status-success,#c9ecbd)}.form-field__input:disabled{background:var(--surface-status-disabled,#f8f8fa);color:var(--label-secondary,#626a90);cursor:not-allowed;opacity:.6}.form-field__input--on-surface,.form-field__input--on-surface:focus{background-color:var(--surface-primary,#fff)}.form-field__help-text{color:var(--label-secondary,#626a90);font-size:var(--text-regular-size,15px);line-height:var(--text-regular-line,20px)}.form-field__error-text{color:var(--label-status-error,#ef4444);font-size:var(--text-xs-size,11px);line-height:var(--text-xs-line,14px)}.surface-context--secondary .form-field__input,.surface-context--secondary .form-field__input:focus{background-color:var(--surface-primary,#fff)}";
4
4
  styleInject(css_248z);
5
5
 
6
6
  export { css_248z as default };
package/dist/v2/components/IconButton/IconButton.scss.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import styleInject from '/opt/atlassian/pipelines/agent/build/node_modules/style-inject/dist/style-inject.es.js';
2
2
 
3
- var css_248z = ".icon-button{align-items:center;background:#0000;border:1px solid var(--border-primary);border-radius:8px;cursor:pointer;display:inline-flex;font-family:var(--font-family-sans,\"Geist\",sans-serif);gap:var(--spacing-sm,8px);height:34px;padding:0 16px 0 12px;transition:all .2s ease}.icon-button:hover{background:var(--surface-secondary)}.icon-button:hover,.icon-button:hover .icon-button__icon,.icon-button:hover .icon-button__label{color:var(--label-primary)}.icon-button:active{background:var(--surface-tertiary)}.icon-button__icon{align-items:center;color:var(--label-primary);display:flex}.icon-button__label{color:var(--label-primary);font-size:13px;font-weight:500;line-height:16px}.icon-button--icon-only{align-items:center;background:#0000;border:1px solid var(--border-primary);border-radius:8px;color:var(--label-primary);cursor:pointer;display:inline-flex;height:32px;justify-content:center;transition:all .2s ease;width:32px}.icon-button--icon-only:hover{background:var(--surface-primary,#fff)}.icon-button--icon-only:active{background:var(--surface-tertiary)}.icon-button--danger{color:var(--label-danger,#cc3c35)}.icon-button--danger:hover{background:var(--surface-primary,#fff)}";
3
+ var css_248z = ".icon-button{align-items:center;background:#0000;border:1px solid var(--border-primary);border-radius:8px;cursor:pointer;display:inline-flex;font-family:var(--font-family-sans,\"Geist\",sans-serif);gap:var(--spacing-sm,8px);height:36px;padding:0 16px 0 12px;transition:all .2s ease;width:fit-content}@media (max-width:768px){.icon-button{height:44px;padding:0 20px 0 16px}}.icon-button:hover{background:var(--surface-secondary)}.icon-button:hover,.icon-button:hover .icon-button__icon,.icon-button:hover .icon-button__label{color:var(--label-primary)}.icon-button:active{background:var(--surface-tertiary)}.icon-button__icon{align-items:center;color:var(--label-primary);display:flex}.icon-button__label{color:var(--label-primary);font-size:13px;font-weight:500;line-height:16px}.icon-button--icon-only{align-items:center;background:#0000;border:1px solid var(--border-primary);border-radius:8px;color:var(--label-primary);cursor:pointer;display:inline-flex;height:32px;justify-content:center;transition:all .2s ease;width:32px}.icon-button--icon-only:hover{background:var(--surface-primary,#fff)}.icon-button--icon-only:active{background:var(--surface-tertiary)}.icon-button--danger{color:var(--label-danger,#cc3c35)}.icon-button--danger:hover{background:var(--surface-primary,#fff)}";
4
4
  styleInject(css_248z);
5
5
 
6
6
  export { css_248z as default };
package/dist/v2/components/NewInput/NewInput.d.ts CHANGED
@@ -9,6 +9,7 @@ type CommonInputProps = {
9
9
  iconPosition?: 'left' | 'right';
10
10
  required?: boolean;
11
11
  onIconClick?: () => void;
12
+ variant?: 'default' | 'on-surface';
12
13
  };
13
14
  type InputProps = CommonInputProps & {
14
15
  as?: 'input';
package/dist/v2/components/NewInput/NewInput.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"NewInput.d.ts","sourceRoot":"","sources":["../../../../src/v2/components/NewInput/NewInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAC,mBAAmB,EAAE,sBAAsB,EAAc,SAAS,EAAC,MAAM,OAAO,CAAC;AAChG,OAAO,iCAAiC,CAAC;AAEzC,KAAK,gBAAgB,GAAG;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,YAAY,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;CAC1B,CAAA;AAED,KAAK,UAAU,GAAG,gBAAgB,GAAG;IACnC,EAAE,CAAC,EAAE,OAAO,CAAC;CACd,GAAG,mBAAmB,CAAC,gBAAgB,CAAC,CAAA;AAEzC,KAAK,aAAa,GAAG,gBAAgB,GAAG;IACtC,EAAE,EAAE,UAAU,CAAC;CAChB,GAAG,sBAAsB,CAAC,mBAAmB,CAAC,CAAA;AAE/C,MAAM,MAAM,aAAa,GAAG,UAAU,GAAG,aAAa,CAAA;AAEtD,eAAO,MAAM,QAAQ,8GA6FpB,CAAC"}
1
+ {"version":3,"file":"NewInput.d.ts","sourceRoot":"","sources":["../../../../src/v2/components/NewInput/NewInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAC,mBAAmB,EAAE,sBAAsB,EAAc,SAAS,EAAC,MAAM,OAAO,CAAC;AAChG,OAAO,iCAAiC,CAAC;AAEzC,KAAK,gBAAgB,GAAG;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,YAAY,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,OAAO,CAAC,EAAE,SAAS,GAAG,YAAY,CAAC;CACpC,CAAA;AAED,KAAK,UAAU,GAAG,gBAAgB,GAAG;IACnC,EAAE,CAAC,EAAE,OAAO,CAAC;CACd,GAAG,mBAAmB,CAAC,gBAAgB,CAAC,CAAA;AAEzC,KAAK,aAAa,GAAG,gBAAgB,GAAG;IACtC,EAAE,EAAE,UAAU,CAAC;CAChB,GAAG,sBAAsB,CAAC,mBAAmB,CAAC,CAAA;AAE/C,MAAM,MAAM,aAAa,GAAG,UAAU,GAAG,aAAa,CAAA;AAEtD,eAAO,MAAM,QAAQ,8GA8FpB,CAAC"}
package/dist/v2/components/NewInput/NewInput.js CHANGED
@@ -58,7 +58,7 @@ function _object_without_properties_loose(source, excluded) {
58
58
  return target;
59
59
  }
60
60
  var NewInput = /*#__PURE__*/ forwardRef(function(_param, ref) {
61
- var label = _param.label, optional = _param.optional, helperText = _param.helperText, error = _param.error, icon = _param.icon, _param_iconPosition = _param.iconPosition, iconPosition = _param_iconPosition === void 0 ? 'left' : _param_iconPosition, _param_as = _param.as, as = _param_as === void 0 ? 'input' : _param_as; _param.required; var _param_className = _param.className, className = _param_className === void 0 ? '' : _param_className, onIconClick = _param.onIconClick, props = _object_without_properties(_param, [
61
+ var label = _param.label, optional = _param.optional, helperText = _param.helperText, error = _param.error, icon = _param.icon, _param_iconPosition = _param.iconPosition, iconPosition = _param_iconPosition === void 0 ? 'left' : _param_iconPosition, _param_as = _param.as, as = _param_as === void 0 ? 'input' : _param_as; _param.required; var variant = _param.variant, _param_className = _param.className, className = _param_className === void 0 ? '' : _param_className, onIconClick = _param.onIconClick, props = _object_without_properties(_param, [
62
62
  "label",
63
63
  "optional",
64
64
  "helperText",
@@ -67,6 +67,7 @@ var NewInput = /*#__PURE__*/ forwardRef(function(_param, ref) {
67
67
  "iconPosition",
68
68
  "as",
69
69
  "required",
70
+ "variant",
70
71
  "className",
71
72
  "onIconClick"
72
73
  ]);
@@ -76,6 +77,7 @@ var NewInput = /*#__PURE__*/ forwardRef(function(_param, ref) {
76
77
  'new-form-input',
77
78
  isError ? 'new-form-input--error' : '',
78
79
  props.disabled ? 'new-form-input--disabled' : '',
80
+ variant === 'on-surface' ? 'new-form-input--on-surface' : '',
79
81
  className
80
82
  ].filter(Boolean).join(' ');
81
83
  // Merge refs
package/dist/v2/components/ZoneCard/ResourceRow.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"ResourceRow.d.ts","sourceRoot":"","sources":["../../../../src/v2/components/ZoneCard/ResourceRow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAc,cAAc,EAAE,MAAM,eAAe,CAAA;AAE1D,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AACjD,OAAO,iBAAiB,CAAA;AAExB,MAAM,WAAW,iBAAiB;IAChC,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,KAAK,CAAC,EAAE,MAAM,CAAA;CACf;AAED,MAAM,WAAW,gBAAgB;IAC/B,IAAI,EAAE,MAAM,CAAA;IACZ,QAAQ,EAAE,MAAM,CAAA;IAChB,QAAQ,EAAE,MAAM,CAAA;IAChB,MAAM,CAAC,EAAE,iBAAiB,CAAA;IAC1B,SAAS,CAAC,EAAE,cAAc,EAAE,CAAA;IAC5B,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,eAAe,CAAC,EAAE,eAAe,CAAA;IACjC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;IAC3B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAA;CACxB;AAED,eAAO,MAAM,WAAW,yFA8EtB,CAAA"}
1
+ {"version":3,"file":"ResourceRow.d.ts","sourceRoot":"","sources":["../../../../src/v2/components/ZoneCard/ResourceRow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAc,cAAc,EAAE,MAAM,eAAe,CAAA;AAE1D,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AACjD,OAAO,iBAAiB,CAAA;AAExB,MAAM,WAAW,iBAAiB;IAChC,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,KAAK,CAAC,EAAE,MAAM,CAAA;CACf;AAED,MAAM,WAAW,gBAAgB;IAC/B,IAAI,EAAE,MAAM,CAAA;IACZ,QAAQ,EAAE,MAAM,CAAA;IAChB,QAAQ,EAAE,MAAM,CAAA;IAChB,MAAM,CAAC,EAAE,iBAAiB,CAAA;IAC1B,SAAS,CAAC,EAAE,cAAc,EAAE,CAAA;IAC5B,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,eAAe,CAAC,EAAE,eAAe,CAAA;IACjC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;IAC3B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAA;CACxB;AAED,eAAO,MAAM,WAAW,yFAkFtB,CAAA"}
package/dist/v2/components/ZoneCard/ResourceRow.js CHANGED
@@ -1,4 +1,4 @@
1
- import { jsxs, jsx } from 'react/jsx-runtime';
1
+ import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
2
2
  import React__default from 'react';
3
3
  import { ActionMenu } from '../ActionMenu/ActionMenu.js';
4
4
  import { GripVerticalIcon, ArrowUpIcon, ArrowDownIcon } from '../../icons/index.js';
@@ -113,53 +113,65 @@ var ResourceRow = /*#__PURE__*/ React__default.forwardRef(function(param, ref) {
113
113
  })
114
114
  ]
115
115
  }),
116
- /*#__PURE__*/ jsx("span", {
117
- className: "zone-card__resource-name",
118
- children: name
119
- }),
120
- !isMobile && /*#__PURE__*/ jsxs("div", {
121
- className: "zone-card__resource-stats",
116
+ isMobile ? /*#__PURE__*/ jsxs("div", {
117
+ className: "zone-card__resource-info",
122
118
  children: [
119
+ /*#__PURE__*/ jsx("span", {
120
+ className: "zone-card__resource-name",
121
+ children: name
122
+ }),
123
123
  /*#__PURE__*/ jsxs("span", {
124
- className: "zone-card__resource-stat",
124
+ className: "zone-card__resource-stats-mobile",
125
125
  children: [
126
126
  qtyLabel,
127
127
  ": ",
128
- quantity
129
- ]
130
- }),
131
- /*#__PURE__*/ jsxs("span", {
132
- className: "zone-card__resource-stat",
133
- children: [
128
+ quantity,
129
+ " \xb7 ",
134
130
  capLabel,
135
131
  ": ",
136
- capacity
137
- ]
138
- }),
139
- /*#__PURE__*/ jsxs("span", {
140
- className: "zone-card__resource-stat zone-card__resource-stat--total",
141
- children: [
132
+ capacity,
133
+ " \xb7 ",
142
134
  totalLabel,
143
135
  ": ",
144
136
  quantity * capacity
145
137
  ]
146
138
  })
147
139
  ]
148
- }),
149
- isMobile && /*#__PURE__*/ jsxs("span", {
150
- className: "zone-card__resource-stats-mobile",
140
+ }) : /*#__PURE__*/ jsxs(Fragment, {
151
141
  children: [
152
- qtyLabel,
153
- ": ",
154
- quantity,
155
- " \xb7 ",
156
- capLabel,
157
- ": ",
158
- capacity,
159
- " \xb7 ",
160
- totalLabel,
161
- ": ",
162
- quantity * capacity
142
+ /*#__PURE__*/ jsx("span", {
143
+ className: "zone-card__resource-name",
144
+ children: name
145
+ }),
146
+ /*#__PURE__*/ jsxs("div", {
147
+ className: "zone-card__resource-stats",
148
+ children: [
149
+ /*#__PURE__*/ jsxs("span", {
150
+ className: "zone-card__resource-stat",
151
+ children: [
152
+ qtyLabel,
153
+ ": ",
154
+ quantity
155
+ ]
156
+ }),
157
+ /*#__PURE__*/ jsxs("span", {
158
+ className: "zone-card__resource-stat",
159
+ children: [
160
+ capLabel,
161
+ ": ",
162
+ capacity
163
+ ]
164
+ }),
165
+ /*#__PURE__*/ jsxs("span", {
166
+ className: "zone-card__resource-stat zone-card__resource-stat--total",
167
+ children: [
168
+ totalLabel,
169
+ ": ",
170
+ quantity * capacity
171
+ ]
172
+ })
173
+ ]
174
+ })
163
175
  ]
164
176
  }),
165
177
  menuItems.length > 0 && /*#__PURE__*/ jsx("div", {
package/dist/v2/components/ZoneCard/ZoneCard.scss.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import styleInject from '/opt/atlassian/pipelines/agent/build/node_modules/style-inject/dist/style-inject.es.js';
2
2
 
3
- var css_248z = ".zone-card{background:var(--surface-primary);border:1px solid var(--border-primary);border-radius:8px;overflow:visible}.zone-card__header{align-items:center;background:var(--surface-secondary);display:flex;gap:16px;padding:12px 16px}.zone-card__drag-handle{align-items:center;border-radius:6px;color:var(--label-tertiary,var(--label-secondary));cursor:grab;display:flex;flex-shrink:0;padding:6px;transition:all .2s ease}.zone-card__drag-handle:hover{background:var(--surface-primary);color:var(--label-secondary)}.zone-card__drag-handle:active{cursor:grabbing}.zone-card__drag-handle--resource{color:var(--label-tertiary,var(--label-secondary))}.zone-card__reorder-arrows{display:flex;flex-direction:column;flex-shrink:0;gap:2px}.zone-card__reorder-arrows--resource{margin-right:0}.zone-card__arrow-btn{align-items:center;background:#0000;border:none;border-radius:4px;color:var(--label-tertiary,var(--label-secondary));cursor:pointer;display:flex;height:28px;justify-content:center;padding:0;transition:all .2s ease;width:28px}.zone-card__arrow-btn:hover:not(:disabled){background:var(--surface-primary);color:var(--label-secondary)}.zone-card__arrow-btn:disabled{opacity:.25;pointer-events:none}.zone-card__name{color:var(--label-primary);flex:1;font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:15px;font-weight:600;line-height:20px;min-width:0}.zone-card__header-right{align-items:center;display:flex;flex-shrink:0;gap:16px}.zone-card__total{color:var(--label-secondary);font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:13px;font-weight:400;line-height:16px;min-width:72px;text-align:right;white-space:nowrap}.zone-card__resource{align-items:center;border-top:1px solid var(--border-primary);display:flex;gap:16px;padding:10px 16px 10px 32px;transition:background .2s ease}.zone-card__resource--clickable{cursor:pointer}.zone-card__resource--clickable:hover{background:var(--surface-secondary)}.zone-card__resource--mobile{flex-wrap:wrap;padding-left:16px}.zone-card__resource-name{color:var(--label-primary);flex:1;font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:15px;font-weight:400;line-height:20px;min-width:0}.zone-card__resource-stats{align-items:center;display:flex;flex-shrink:0;gap:32px}.zone-card__resource-stat{color:var(--label-secondary);font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:13px;font-weight:400;line-height:16px;min-width:72px;white-space:nowrap}.zone-card__resource-stat--total{min-width:72px;text-align:right}.zone-card__resource-stats-mobile{color:var(--label-secondary);font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:12px;font-weight:400;line-height:16px;white-space:nowrap}.zone-card__resource-actions{display:flex;flex-shrink:0;justify-content:flex-end;width:32px}.zone-card__add-resource-wrapper{border-top:1px solid var(--border-primary);padding:12px 16px}@media (max-width:768px){.zone-card__header{padding:10px 12px}.zone-card__resource{gap:12px;padding:10px 12px}.zone-card__resource-stats{gap:16px}.zone-card__resource-stat{min-width:auto}.zone-card__add-resource-wrapper{padding:10px 12px}}";
3
+ var css_248z = ".zone-card{background:var(--surface-primary);border:1px solid var(--border-primary);border-radius:8px;overflow:visible}.zone-card__header{align-items:center;background:var(--surface-secondary);display:flex;gap:16px;padding:12px 16px}.zone-card__drag-handle{align-items:center;border-radius:6px;color:var(--label-tertiary,var(--label-secondary));cursor:grab;display:flex;flex-shrink:0;padding:6px;transition:all .2s ease}.zone-card__drag-handle:hover{background:var(--surface-primary);color:var(--label-secondary)}.zone-card__drag-handle:active{cursor:grabbing}.zone-card__drag-handle--resource{color:var(--label-tertiary,var(--label-secondary))}.zone-card__reorder-arrows{display:flex;flex-direction:column;flex-shrink:0;gap:2px}.zone-card__reorder-arrows--resource{margin-right:0}.zone-card__arrow-btn{align-items:center;background:#0000;border:none;border-radius:4px;color:var(--label-tertiary,var(--label-secondary));cursor:pointer;display:flex;height:28px;justify-content:center;padding:0;transition:all .2s ease;width:28px}.zone-card__arrow-btn:hover:not(:disabled){background:var(--surface-primary);color:var(--label-secondary)}.zone-card__arrow-btn:disabled{opacity:.25;pointer-events:none}.zone-card__name{color:var(--label-primary);flex:1;font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:15px;font-weight:600;line-height:20px;min-width:0}.zone-card__header-info{display:flex;flex:1;flex-direction:column;gap:2px;min-width:0}.zone-card__header-info .zone-card__total{min-width:auto;text-align:left}.zone-card__header-right{align-items:center;display:flex;flex-shrink:0;gap:16px}.zone-card__total{color:var(--label-secondary);font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:13px;font-weight:400;line-height:16px;min-width:72px;text-align:right;white-space:nowrap}.zone-card__resource{align-items:center;border-top:1px solid var(--border-primary);display:flex;gap:16px;padding:10px 16px 10px 32px;transition:background .2s ease}.zone-card__resource--clickable{cursor:pointer}.zone-card__resource--clickable:hover{background:var(--surface-secondary)}.zone-card__resource--mobile{padding-left:16px}.zone-card__resource-name{color:var(--label-primary);flex:1;font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:15px;font-weight:400;line-height:20px;min-width:0}.zone-card__resource-stats{align-items:center;display:flex;flex-shrink:0;gap:32px}.zone-card__resource-stat{color:var(--label-secondary);font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:13px;font-weight:400;line-height:16px;min-width:72px;white-space:nowrap}.zone-card__resource-stat--total{min-width:72px;text-align:right}.zone-card__resource-info{display:flex;flex:1;flex-direction:column;gap:2px;min-width:0}.zone-card__resource-stats-mobile{color:var(--label-secondary);font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:12px;font-weight:400;line-height:16px;white-space:nowrap}.zone-card__resource-actions{display:flex;flex-shrink:0;justify-content:flex-end;width:32px}.zone-card__add-resource-wrapper{border-top:1px solid var(--border-primary);padding:12px 16px}@media (max-width:768px){.zone-card__header{padding:10px 12px}.zone-card__resource{gap:12px;padding:10px 12px}.zone-card__resource-stats{gap:16px}.zone-card__resource-stat{min-width:auto}.zone-card__add-resource-wrapper{padding:10px 12px}}";
4
4
  styleInject(css_248z);
5
5
 
6
6
  export { css_248z as default };
package/dist/v2/components/ZoneCard/ZoneHeader.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"ZoneHeader.d.ts","sourceRoot":"","sources":["../../../../src/v2/components/ZoneCard/ZoneHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAc,cAAc,EAAE,MAAM,eAAe,CAAA;AAE1D,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AACjD,OAAO,iBAAiB,CAAA;AAExB,MAAM,WAAW,eAAe;IAC9B,IAAI,EAAE,MAAM,CAAA;IACZ,aAAa,EAAE,MAAM,CAAA;IACrB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,SAAS,CAAC,EAAE,cAAc,EAAE,CAAA;IAC5B,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,eAAe,CAAC,EAAE,eAAe,CAAA;IACjC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAA;CACxB;AAED,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CA8ChD,CAAA"}
1
+ {"version":3,"file":"ZoneHeader.d.ts","sourceRoot":"","sources":["../../../../src/v2/components/ZoneCard/ZoneHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAc,cAAc,EAAE,MAAM,eAAe,CAAA;AAE1D,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AACjD,OAAO,iBAAiB,CAAA;AAExB,MAAM,WAAW,eAAe;IAC9B,IAAI,EAAE,MAAM,CAAA;IACZ,aAAa,EAAE,MAAM,CAAA;IACrB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,SAAS,CAAC,EAAE,cAAc,EAAE,CAAA;IAC5B,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,eAAe,CAAC,EAAE,eAAe,CAAA;IACjC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAA;CACxB;AAED,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CA8DhD,CAAA"}
package/dist/v2/components/ZoneCard/ZoneHeader.js CHANGED
@@ -1,4 +1,4 @@
1
- import { jsxs, jsx } from 'react/jsx-runtime';
1
+ import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
2
2
  import 'react';
3
3
  import { ActionMenu } from '../ActionMenu/ActionMenu.js';
4
4
  import { GripVerticalIcon, ArrowUpIcon, ArrowDownIcon } from '../../icons/index.js';
@@ -92,23 +92,53 @@ var ZoneHeader = function(param) {
92
92
  })
93
93
  ]
94
94
  }),
95
- /*#__PURE__*/ jsx("span", {
96
- className: "zone-card__name",
97
- children: name
98
- }),
99
- /*#__PURE__*/ jsxs("div", {
100
- className: "zone-card__header-right",
95
+ isMobile ? /*#__PURE__*/ jsxs(Fragment, {
101
96
  children: [
102
- /*#__PURE__*/ jsxs("span", {
103
- className: "zone-card__total",
97
+ /*#__PURE__*/ jsxs("div", {
98
+ className: "zone-card__header-info",
104
99
  children: [
105
- totalLabel,
106
- ": ",
107
- totalCapacity
100
+ /*#__PURE__*/ jsx("span", {
101
+ className: "zone-card__name",
102
+ children: name
103
+ }),
104
+ /*#__PURE__*/ jsxs("span", {
105
+ className: "zone-card__total",
106
+ children: [
107
+ totalLabel,
108
+ ": ",
109
+ totalCapacity
110
+ ]
111
+ })
108
112
  ]
109
113
  }),
110
- menuItems.length > 0 && /*#__PURE__*/ jsx(ActionMenu, {
111
- items: menuItems
114
+ menuItems.length > 0 && /*#__PURE__*/ jsx("div", {
115
+ className: "zone-card__header-right",
116
+ children: /*#__PURE__*/ jsx(ActionMenu, {
117
+ items: menuItems
118
+ })
119
+ })
120
+ ]
121
+ }) : /*#__PURE__*/ jsxs(Fragment, {
122
+ children: [
123
+ /*#__PURE__*/ jsx("span", {
124
+ className: "zone-card__name",
125
+ children: name
126
+ }),
127
+ /*#__PURE__*/ jsxs("div", {
128
+ className: "zone-card__header-right",
129
+ children: [
130
+ /*#__PURE__*/ jsxs("span", {
131
+ className: "zone-card__total",
132
+ children: [
133
+ totalLabel,
134
+ ": ",
135
+ totalCapacity
136
+ ]
137
+ }),
138
+ menuItems.length > 0 && /*#__PURE__*/ jsx(ActionMenu, {
139
+ items: menuItems
140
+ })
141
+ ]
112
142
  })
113
143
  ]
114
144
  })
package/dist/v2/pages/ZonesResources/ZonesResourcesPage.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"ZonesResourcesPage.d.ts","sourceRoot":"","sources":["../../../../src/v2/pages/ZonesResources/ZonesResourcesPage.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,2BAA2B,CAAA;AAElC,MAAM,WAAW,uBAAuB;IACtC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAA;IACnB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC3B;AAED,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CA+BhE,CAAA"}
1
+ {"version":3,"file":"ZonesResourcesPage.d.ts","sourceRoot":"","sources":["../../../../src/v2/pages/ZonesResources/ZonesResourcesPage.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,OAAO,2BAA2B,CAAA;AAElC,MAAM,WAAW,uBAAuB;IACtC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAA;IACnB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC3B;AAED,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAiChE,CAAA"}
package/dist/v2/pages/ZonesResources/ZonesResourcesPage.js CHANGED
@@ -1,10 +1,9 @@
1
1
  import { jsxs, jsx } from 'react/jsx-runtime';
2
2
  import 'react';
3
- import { IconButton } from '../../components/IconButton/IconButton.js';
4
3
  import '../../components/Button/Button.scss.js';
5
4
  import { GhostButton } from '../../components/Button/GhostButton.js';
6
5
  import { NewPageHeader } from '../../components/NewPageHeader/NewPageHeader.js';
7
- import { PlusIcon } from '../../icons/index.js';
6
+ import { ArrowLeftIcon, PlusIcon } from '../../icons/index.js';
8
7
  import './ZonesResourcesPage.scss.js';
9
8
 
10
9
  var ZonesResourcesPage = function(param) {
@@ -14,9 +13,10 @@ var ZonesResourcesPage = function(param) {
14
13
  children: [
15
14
  onBack && /*#__PURE__*/ jsx("div", {
16
15
  className: "zones-resources-page__back",
17
- children: /*#__PURE__*/ jsx(IconButton, {
18
- label: backLabel,
19
- onClick: onBack
16
+ children: /*#__PURE__*/ jsx(GhostButton, {
17
+ onClick: onBack,
18
+ icon: /*#__PURE__*/ jsx(ArrowLeftIcon, {}),
19
+ children: backLabel
20
20
  })
21
21
  }),
22
22
  /*#__PURE__*/ jsx(NewPageHeader, {
package/dist/v2/pages/ZonesResources/ZonesResourcesPage.scss.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import styleInject from '/opt/atlassian/pipelines/agent/build/node_modules/style-inject/dist/style-inject.es.js';
2
2
 
3
- var css_248z = ".zones-resources-page{align-self:stretch;display:flex;flex-direction:column}.zones-resources-page__back{align-self:flex-start;padding:24px 32px 0}.zones-resources-page__back .icon-button{border-color:#0000}.zones-resources-page__back .icon-button:hover{background:var(--surface-action-soft,#f4f4fe);border-color:#0000}.zones-resources-page__back .icon-button:hover .icon-button__icon,.zones-resources-page__back .icon-button:hover .icon-button__label,.zones-resources-page__back .icon-button__icon,.zones-resources-page__back .icon-button__label{color:var(--fill-action,#5d5bf4)}@media (max-width:768px){.zones-resources-page__back{padding:16px 16px 0}}.zones-resources-page__content{padding:24px 32px}@media (max-width:768px){.zones-resources-page__content{padding:16px}}.zones-resources-page__action{display:flex;justify-content:flex-end;margin-bottom:16px}";
3
+ var css_248z = ".zones-resources-page{align-self:stretch;display:flex;flex-direction:column}.zones-resources-page__back{align-self:flex-start;padding:24px 32px 0}.zones-resources-page__back .ghost-button{border-color:var(--borders-main-border-primary,#e8e9ef);color:var(--fill-action,#5d5bf4)}.zones-resources-page__back .ghost-button:not(.active):hover:not(:disabled){background-color:var(--surface-action-soft,#f4f4fe);color:var(--fill-action,#5d5bf4)}.zones-resources-page__back .ghost-button .ghost-button__icon svg{height:24px;width:24px}@media (max-width:768px){.zones-resources-page__back{padding:16px 16px 0}}.zones-resources-page__content{padding:24px 32px}@media (max-width:768px){.zones-resources-page__content{padding:0}}.zones-resources-page__action{display:flex;justify-content:flex-end;margin-bottom:16px}";
4
4
  styleInject(css_248z);
5
5
 
6
6
  export { css_248z as default };
package/dist/v2/styles/form/NewInput.scss CHANGED
@@ -222,9 +222,38 @@
222
222
  pointer-events: none;
223
223
  }
224
224
 
225
+ &--on-surface {
226
+ .new-form-input__input,
227
+ .new-form-input__textarea,
228
+ .new-form-input__input-with-icon {
229
+ background-color: var(--surface-primary, #fff);
230
+ background: var(--surface-primary, #fff);
231
+
232
+ &:focus,
233
+ &:focus-within {
234
+ background-color: var(--surface-primary, #fff);
235
+ }
236
+ }
237
+ }
238
+
225
239
  &.dob-input {
226
240
  .new-form-input__label {
227
241
  color: var(--label-secondary, #626A90);
228
242
  }
229
243
  }
230
244
  }
245
+
246
+ // Auto-detect: swap input backgrounds when inside a surface-secondary container
247
+ .surface-context--secondary {
248
+ .new-form-input__input,
249
+ .new-form-input__textarea,
250
+ .new-form-input__input-with-icon {
251
+ background-color: var(--surface-primary, #fff);
252
+ background: var(--surface-primary, #fff);
253
+
254
+ &:focus,
255
+ &:focus-within {
256
+ background-color: var(--surface-primary, #fff);
257
+ }
258
+ }
259
+ }
package/dist/v2/styles/form/NewInput.scss.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import styleInject from '/opt/atlassian/pipelines/agent/build/node_modules/style-inject/dist/style-inject.es.js';
2
2
 
3
- var css_248z = ":root{--font-family-sans:\"Geist\",-apple-system,BlinkMacSystemFont,\"Segoe UI\",\"Roboto\",\"Helvetica Neue\",Arial,sans-serif;--font-family-mono:\"Geist Mono\",ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,\"Liberation Mono\",\"Courier New\",monospace;--heading-xxl-size:44px;--heading-xxl-line:48px;--heading-xxl-weight:600;--heading-xl-size:32px;--heading-xl-line:36px;--heading-xl-weight:700;--heading-h1-size:24px;--heading-h1-line:28px;--heading-h1-weight:600;--heading-h2-size:20px;--heading-h2-line:24px;--heading-h2-weight:600;--heading-h3-size:17px;--heading-h3-line:20px;--heading-h3-weight:600;--heading-h4-size:15px;--heading-h4-line:18px;--heading-h4-weight:600;--heading-h5-size:13px;--heading-h5-line:16px;--heading-h5-weight:500;--heading-h6-size:11px;--heading-h6-line:14px;--heading-h6-weight:500;--heading-xxl-mobile-size:32px;--heading-xxl-mobile-line:36px;--heading-xxl-mobile-weight:600;--heading-xl-mobile-size:26px;--heading-xl-mobile-line:30px;--heading-xl-mobile-weight:700;--heading-h1-mobile-size:20px;--heading-h1-mobile-line:23px;--heading-h1-mobile-weight:600;--heading-h2-mobile-size:18px;--heading-h2-mobile-line:22px;--heading-h2-mobile-weight:600;--heading-h3-mobile-size:16px;--heading-h3-mobile-line:18px;--heading-h3-mobile-weight:600;--heading-h4-mobile-size:14px;--heading-h4-mobile-line:16px;--heading-h4-mobile-weight:600;--heading-h5-mobile-size:13px;--heading-h5-mobile-line:16px;--heading-h5-mobile-weight:500;--heading-h6-mobile-size:11px;--heading-h6-mobile-line:14px;--heading-h6-mobile-weight:500;--text-xl-size:20px;--text-xl-line:26px;--text-xl-weight:400;--text-large-size:18px;--text-large-line:24px;--text-large-weight:400;--text-regular-size:15px;--text-regular-line:20px;--text-regular-weight:400;--text-small-size:13px;--text-small-line:16px;--text-small-weight:400;--text-small-emphasis-weight:500;--text-small-bold-weight:600;--text-xs-size:10px;--text-xs-line:13px;--text-xs-weight:500;--text-xs-bold-weight:600}.new-form-input{align-items:flex-start;align-self:stretch;display:flex;flex-direction:column;gap:var(--spacing-sm);width:100%}.new-form-input__label{align-items:center;color:var(--label-primary);display:flex;font-size:15px;font-weight:600;justify-content:space-between;line-height:20px;width:100%}.new-form-input__label,.new-form-input__label-optional{font-family:var(--font-family-sans,\"Geist\",sans-serif);font-style:normal}.new-form-input__label-optional{color:var(--label-secondary);font-size:13px;font-weight:400;line-height:16px}.new-form-input__input{background-color:var(--surfaces-main-background-secondary);background:var(--surface-secondary);border:2px solid var(--border-primary);border-radius:var(--radius-md);color:var(--labels-main-label-primary,#121e52);flex:1 0 0;font-family:var(--font-family-sans);font-size:var(--text-regular-size);font-weight:var(--text-regular-weight);line-height:var(--text-regular-line);min-height:40px;padding:8px 10px;transition:all .2s ease;width:100%}@media (max-width:768px){.new-form-input__input{font-size:16px}}.new-form-input__input:focus{background-color:var(--surfaces-main-background-secondary,#f8f8fa);border-color:var(--border-selected,#6200ee);outline:none}.new-form-input__input::placeholder{color:var(--labels-main-label-secondary,#626a90)}.new-form-input__textarea{background-color:var(--surfaces-main-background-secondary,#f8f8fa);border:1px solid var(--borders-main-border-primary,#e8e9ef);border-radius:var(--radius-md,4px);color:var(--labels-main-label-primary,#121e52);font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:var(--text-regular-size,15px);line-height:var(--text-regular-line,20px);min-height:120px;padding:8px 10px;resize:vertical;transition:all .2s ease;width:100%}@media (max-width:768px){.new-form-input__textarea{font-size:16px}}.new-form-input__textarea:focus{border-color:var(--border-selected,#6200ee);outline:none}.new-form-input__textarea::placeholder{color:var(--labels-main-label-secondary,#626a90)}.new-form-input__input-with-icon{align-items:center;background-color:var(--surfaces-main-background-secondary,#f8f8fa);border:2px solid var(--border-primary,#e8e9ef);border-radius:var(--radius-md,4px);display:flex;gap:var(--spacing-sm,8px);min-height:52px;padding:8px 10px;transition:all .2s ease;width:70%}.new-form-input__input-with-icon:focus-within{border-color:var(--border-selected,#6200ee)}.new-form-input__input-with-icon .icon{align-items:center;display:flex;flex-shrink:0;height:24px;justify-content:center;order:-1;width:24px}.new-form-input__input-with-icon--right .icon{order:1}.new-form-input__input-with-icon input{background:#0000;border:none;color:var(--label-primary);flex:1;font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:var(--text-regular-size,15px);line-height:var(--text-regular-line,20px)}@media (max-width:768px){.new-form-input__input-with-icon input{font-size:16px}}.new-form-input__input-with-icon input:focus{outline:none}.new-form-input__input-with-icon input::placeholder{color:var(--labels-main-label-secondary,#626a90)}.new-form-input__input-with-icon input[type=date]::-webkit-calendar-picker-indicator{-webkit-appearance:none;display:none}.new-form-input__input-with-icon input[type=date]::-webkit-inner-spin-button,.new-form-input__input-with-icon input[type=date]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.new-form-input__verification-code{display:flex;gap:var(--spacing-sm,8px);height:62px}.new-form-input__verification-code .code-input{background-color:var(--surfaces-main-background-secondary,#f8f8fa);border:2px solid var(--borders-main-border-primary,#e8e9ef);border-radius:var(--radius-md,4px);color:var(--labels-main-label-primary,#121e52);flex:1;font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:var(--text-lg-size,18px);font-weight:var(--heading-h3-weight,600);text-align:center;transition:all .2s ease}.new-form-input__verification-code .code-input:focus{border-color:var(--border-selected,#6200ee);outline:none}.new-form-input__helper-text{color:var(--label-secondary,#626a90);font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:var(--text-regular-size,15px);font-style:normal;font-weight:400;line-height:var(--text-regular-line,20px);margin-top:2px;min-width:max-content;white-space:nowrap}@media (max-width:768px){.new-form-input__helper-text{word-wrap:break-word;min-width:unset;white-space:normal}}.new-form-input__error-text{color:var(--labels-status-label-error,#ef4444);font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:11px;font-style:normal;font-weight:400;line-height:14px;margin-top:2px}.new-form-input--active .new-form-input__input{border-color:var(--border-selected,#6200ee)}.new-form-input--error .new-form-input__input{border-color:var(--borders-status-border-error,#ef4444)}.new-form-input--disabled{opacity:var(--opacity-50,.5);pointer-events:none}.new-form-input.dob-input .new-form-input__label{color:var(--label-secondary,#626a90)}";
3
+ var css_248z = ":root{--font-family-sans:\"Geist\",-apple-system,BlinkMacSystemFont,\"Segoe UI\",\"Roboto\",\"Helvetica Neue\",Arial,sans-serif;--font-family-mono:\"Geist Mono\",ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,\"Liberation Mono\",\"Courier New\",monospace;--heading-xxl-size:44px;--heading-xxl-line:48px;--heading-xxl-weight:600;--heading-xl-size:32px;--heading-xl-line:36px;--heading-xl-weight:700;--heading-h1-size:24px;--heading-h1-line:28px;--heading-h1-weight:600;--heading-h2-size:20px;--heading-h2-line:24px;--heading-h2-weight:600;--heading-h3-size:17px;--heading-h3-line:20px;--heading-h3-weight:600;--heading-h4-size:15px;--heading-h4-line:18px;--heading-h4-weight:600;--heading-h5-size:13px;--heading-h5-line:16px;--heading-h5-weight:500;--heading-h6-size:11px;--heading-h6-line:14px;--heading-h6-weight:500;--heading-xxl-mobile-size:32px;--heading-xxl-mobile-line:36px;--heading-xxl-mobile-weight:600;--heading-xl-mobile-size:26px;--heading-xl-mobile-line:30px;--heading-xl-mobile-weight:700;--heading-h1-mobile-size:20px;--heading-h1-mobile-line:23px;--heading-h1-mobile-weight:600;--heading-h2-mobile-size:18px;--heading-h2-mobile-line:22px;--heading-h2-mobile-weight:600;--heading-h3-mobile-size:16px;--heading-h3-mobile-line:18px;--heading-h3-mobile-weight:600;--heading-h4-mobile-size:14px;--heading-h4-mobile-line:16px;--heading-h4-mobile-weight:600;--heading-h5-mobile-size:13px;--heading-h5-mobile-line:16px;--heading-h5-mobile-weight:500;--heading-h6-mobile-size:11px;--heading-h6-mobile-line:14px;--heading-h6-mobile-weight:500;--text-xl-size:20px;--text-xl-line:26px;--text-xl-weight:400;--text-large-size:18px;--text-large-line:24px;--text-large-weight:400;--text-regular-size:15px;--text-regular-line:20px;--text-regular-weight:400;--text-small-size:13px;--text-small-line:16px;--text-small-weight:400;--text-small-emphasis-weight:500;--text-small-bold-weight:600;--text-xs-size:10px;--text-xs-line:13px;--text-xs-weight:500;--text-xs-bold-weight:600}.new-form-input{align-items:flex-start;align-self:stretch;display:flex;flex-direction:column;gap:var(--spacing-sm);width:100%}.new-form-input__label{align-items:center;color:var(--label-primary);display:flex;font-size:15px;font-weight:600;justify-content:space-between;line-height:20px;width:100%}.new-form-input__label,.new-form-input__label-optional{font-family:var(--font-family-sans,\"Geist\",sans-serif);font-style:normal}.new-form-input__label-optional{color:var(--label-secondary);font-size:13px;font-weight:400;line-height:16px}.new-form-input__input{background-color:var(--surfaces-main-background-secondary);background:var(--surface-secondary);border:2px solid var(--border-primary);border-radius:var(--radius-md);color:var(--labels-main-label-primary,#121e52);flex:1 0 0;font-family:var(--font-family-sans);font-size:var(--text-regular-size);font-weight:var(--text-regular-weight);line-height:var(--text-regular-line);min-height:40px;padding:8px 10px;transition:all .2s ease;width:100%}@media (max-width:768px){.new-form-input__input{font-size:16px}}.new-form-input__input:focus{background-color:var(--surfaces-main-background-secondary,#f8f8fa);border-color:var(--border-selected,#6200ee);outline:none}.new-form-input__input::placeholder{color:var(--labels-main-label-secondary,#626a90)}.new-form-input__textarea{background-color:var(--surfaces-main-background-secondary,#f8f8fa);border:1px solid var(--borders-main-border-primary,#e8e9ef);border-radius:var(--radius-md,4px);color:var(--labels-main-label-primary,#121e52);font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:var(--text-regular-size,15px);line-height:var(--text-regular-line,20px);min-height:120px;padding:8px 10px;resize:vertical;transition:all .2s ease;width:100%}@media (max-width:768px){.new-form-input__textarea{font-size:16px}}.new-form-input__textarea:focus{border-color:var(--border-selected,#6200ee);outline:none}.new-form-input__textarea::placeholder{color:var(--labels-main-label-secondary,#626a90)}.new-form-input__input-with-icon{align-items:center;background-color:var(--surfaces-main-background-secondary,#f8f8fa);border:2px solid var(--border-primary,#e8e9ef);border-radius:var(--radius-md,4px);display:flex;gap:var(--spacing-sm,8px);min-height:52px;padding:8px 10px;transition:all .2s ease;width:70%}.new-form-input__input-with-icon:focus-within{border-color:var(--border-selected,#6200ee)}.new-form-input__input-with-icon .icon{align-items:center;display:flex;flex-shrink:0;height:24px;justify-content:center;order:-1;width:24px}.new-form-input__input-with-icon--right .icon{order:1}.new-form-input__input-with-icon input{background:#0000;border:none;color:var(--label-primary);flex:1;font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:var(--text-regular-size,15px);line-height:var(--text-regular-line,20px)}@media (max-width:768px){.new-form-input__input-with-icon input{font-size:16px}}.new-form-input__input-with-icon input:focus{outline:none}.new-form-input__input-with-icon input::placeholder{color:var(--labels-main-label-secondary,#626a90)}.new-form-input__input-with-icon input[type=date]::-webkit-calendar-picker-indicator{-webkit-appearance:none;display:none}.new-form-input__input-with-icon input[type=date]::-webkit-inner-spin-button,.new-form-input__input-with-icon input[type=date]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.new-form-input__verification-code{display:flex;gap:var(--spacing-sm,8px);height:62px}.new-form-input__verification-code .code-input{background-color:var(--surfaces-main-background-secondary,#f8f8fa);border:2px solid var(--borders-main-border-primary,#e8e9ef);border-radius:var(--radius-md,4px);color:var(--labels-main-label-primary,#121e52);flex:1;font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:var(--text-lg-size,18px);font-weight:var(--heading-h3-weight,600);text-align:center;transition:all .2s ease}.new-form-input__verification-code .code-input:focus{border-color:var(--border-selected,#6200ee);outline:none}.new-form-input__helper-text{color:var(--label-secondary,#626a90);font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:var(--text-regular-size,15px);font-style:normal;font-weight:400;line-height:var(--text-regular-line,20px);margin-top:2px;min-width:max-content;white-space:nowrap}@media (max-width:768px){.new-form-input__helper-text{word-wrap:break-word;min-width:unset;white-space:normal}}.new-form-input__error-text{color:var(--labels-status-label-error,#ef4444);font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:11px;font-style:normal;font-weight:400;line-height:14px;margin-top:2px}.new-form-input--active .new-form-input__input{border-color:var(--border-selected,#6200ee)}.new-form-input--error .new-form-input__input{border-color:var(--borders-status-border-error,#ef4444)}.new-form-input--disabled{opacity:var(--opacity-50,.5);pointer-events:none}.new-form-input--on-surface .new-form-input__input,.new-form-input--on-surface .new-form-input__input-with-icon,.new-form-input--on-surface .new-form-input__textarea{background-color:var(--surface-primary,#fff);background:var(--surface-primary,#fff)}.new-form-input--on-surface .new-form-input__input-with-icon:focus,.new-form-input--on-surface .new-form-input__input-with-icon:focus-within,.new-form-input--on-surface .new-form-input__input:focus,.new-form-input--on-surface .new-form-input__input:focus-within,.new-form-input--on-surface .new-form-input__textarea:focus,.new-form-input--on-surface .new-form-input__textarea:focus-within{background-color:var(--surface-primary,#fff)}.new-form-input.dob-input .new-form-input__label{color:var(--label-secondary,#626a90)}.surface-context--secondary .new-form-input__input,.surface-context--secondary .new-form-input__input-with-icon,.surface-context--secondary .new-form-input__textarea{background-color:var(--surface-primary,#fff);background:var(--surface-primary,#fff)}.surface-context--secondary .new-form-input__input-with-icon:focus,.surface-context--secondary .new-form-input__input-with-icon:focus-within,.surface-context--secondary .new-form-input__input:focus,.surface-context--secondary .new-form-input__input:focus-within,.surface-context--secondary .new-form-input__textarea:focus,.surface-context--secondary .new-form-input__textarea:focus-within{background-color:var(--surface-primary,#fff)}";
4
4
  styleInject(css_248z);
5
5
 
6
6
  export { css_248z as default };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@licklist/design",
3
- "version": "0.78.5-dev.64",
3
+ "version": "0.78.5-dev.67",
4
4
  "repository": {
5
5
  "type": "git",
6
6
  "url": "git+ssh://git@bitbucket.org/bookedit-licklist/licklist_design.git"
@@ -42,7 +42,7 @@
42
42
  ]
43
43
  },
44
44
  "peerDependencies": {
45
- "@licklist/core": "0.36.1-dev.16",
45
+ "@licklist/core": "0.36.1-dev.18",
46
46
  "@licklist/eslint-config": "0.5.6",
47
47
  "@licklist/plugins": "0.36.4-dev.13",
48
48
  "clsx": "2.1.1",
@@ -64,7 +64,7 @@
64
64
  "@dnd-kit/utilities": "2.0.0",
65
65
  "@fortawesome/fontawesome-svg-core": "1.2.34",
66
66
  "@fortawesome/free-solid-svg-icons": "5.15.2",
67
- "@licklist/core": "0.36.1-dev.16",
67
+ "@licklist/core": "0.36.1-dev.18",
68
68
  "@licklist/eslint-config": "0.5.6",
69
69
  "@licklist/plugins": "0.36.4-dev.13",
70
70
  "@mantine/core": "6.0.22",
package/src/v2/components/Badge/Badge.tsx CHANGED
@@ -6,6 +6,7 @@ export interface BadgeProps {
6
6
  variant?: 'success' | 'danger' | 'warning' | 'info' | 'neutral'
7
7
  className?: string
8
8
  icon?: React.ReactNode
9
+ onClick?: (e: React.MouseEvent) => void
9
10
  }
10
11
 
11
12
  export const Badge: React.FC<BadgeProps> = ({
@@ -13,11 +14,13 @@ export const Badge: React.FC<BadgeProps> = ({
13
14
  variant = 'neutral',
14
15
  className = '',
15
16
  icon,
17
+ onClick,
16
18
  }) => (
17
19
  <span
18
20
  className={`new-badge new-badge--${variant} ${
19
21
  icon ? 'new-badge--with-icon' : ''
20
22
  } ${className}`}
23
+ onClick={onClick}
21
24
  >
22
25
  {icon && <span className="new-badge__icon">{icon}</span>}
23
26
  {children}
package/src/v2/components/Checkbox/Checkbox.scss CHANGED
@@ -3,9 +3,8 @@
3
3
  .checkbox {
4
4
  display: flex;
5
5
  max-width: 500px;
6
- align-items: flex-start;
6
+ align-items: center;
7
7
  gap: 11px;
8
- align-self: stretch;
9
8
 
10
9
  @media (min-width: 992px) {
11
10
  max-width: unset;
@@ -18,6 +17,7 @@
18
17
  cursor: pointer;
19
18
  user-select: none;
20
19
  width: 100%;
20
+ margin: 0;
21
21
  }
22
22
 
23
23
  &__input {
package/src/v2/components/Customer/CustomersList.scss CHANGED
@@ -624,6 +624,12 @@
624
624
  margin-top: 4px;
625
625
  display: flex;
626
626
  justify-content: flex-end;
627
+
628
+ &.waiver-col {
629
+ border-top: none;
630
+ padding-top: 0;
631
+ margin-top: 0;
632
+ }
627
633
  }
628
634
 
629
635
  &:first-child {
package/src/v2/components/FormField/FormField.scss CHANGED
@@ -74,6 +74,14 @@
74
74
  cursor: not-allowed;
75
75
  opacity: 0.6;
76
76
  }
77
+
78
+ &--on-surface {
79
+ background-color: var(--surface-primary, #fff);
80
+
81
+ &:focus {
82
+ background-color: var(--surface-primary, #fff);
83
+ }
84
+ }
77
85
  }
78
86
 
79
87
  &__help-text {
@@ -89,3 +97,14 @@
89
97
  }
90
98
  }
91
99
 
100
+ // Auto-detect: swap input backgrounds when inside a surface-secondary container
101
+ .surface-context--secondary {
102
+ .form-field__input {
103
+ background-color: var(--surface-primary, #fff);
104
+
105
+ &:focus {
106
+ background-color: var(--surface-primary, #fff);
107
+ }
108
+ }
109
+ }
110
+
package/src/v2/components/FormField/FormField.tsx CHANGED
@@ -8,16 +8,18 @@ export interface FormFieldProps extends InputHTMLAttributes<HTMLInputElement> {
8
8
  success?: boolean
9
9
  helpText?: string
10
10
  required?: boolean
11
+ variant?: 'default' | 'on-surface'
11
12
  }
12
13
 
13
14
  export const FormField = forwardRef<HTMLInputElement, FormFieldProps>(
14
- ({ label, error, hasError, success, helpText, required, className = '', ...props }, ref) => {
15
+ ({ label, error, hasError, success, helpText, required, variant, className = '', ...props }, ref) => {
15
16
  const showError = error || hasError
16
17
  const showSuccess = success && !showError
17
18
  const inputClassName = [
18
19
  'form-field__input',
19
20
  showError ? 'form-field__input--error' : '',
20
21
  showSuccess ? 'form-field__input--success' : '',
22
+ variant === 'on-surface' ? 'form-field__input--on-surface' : '',
21
23
  ].filter(Boolean).join(' ')
22
24
 
23
25
  return (
package/src/v2/components/IconButton/IconButton.scss CHANGED
@@ -1,9 +1,10 @@
1
1
  .icon-button {
2
2
  display: inline-flex;
3
3
  align-items: center;
4
+ width: fit-content;
4
5
  gap: var(--spacing-sm, 8px);
5
6
  padding: 0 16px 0 12px;
6
- height: 34px;
7
+ height: 36px;
7
8
  background: transparent;
8
9
  border: 1px solid var(--border-primary);
9
10
  border-radius: 8px;
@@ -11,6 +12,11 @@
11
12
  transition: all 0.2s ease;
12
13
  font-family: var(--font-family-sans, 'Geist', sans-serif);
13
14
 
15
+ @media (max-width: 768px) {
16
+ height: 44px;
17
+ padding: 0 20px 0 16px;
18
+ }
19
+
14
20
  &:hover {
15
21
  background: var(--surface-secondary);
16
22
  color: var(--label-primary);
package/src/v2/components/NewInput/NewInput.tsx CHANGED
@@ -10,6 +10,7 @@ type CommonInputProps = {
10
10
  iconPosition?: 'left' | 'right';
11
11
  required?: boolean;
12
12
  onIconClick?: () => void;
13
+ variant?: 'default' | 'on-surface';
13
14
  }
14
15
 
15
16
  type InputProps = CommonInputProps & {
@@ -23,13 +24,14 @@ type TextareaProps = CommonInputProps & {
23
24
  export type NewInputProps = InputProps | TextareaProps
24
25
 
25
26
  export const NewInput = forwardRef<HTMLInputElement | HTMLTextAreaElement, NewInputProps>(
26
- ({label, optional, helperText, error, icon, iconPosition = 'left', as = 'input', required, className = '', onIconClick, ...props}, ref) => {
27
+ ({label, optional, helperText, error, icon, iconPosition = 'left', as = 'input', required, variant, className = '', onIconClick, ...props}, ref) => {
27
28
  const inputRef = React.useRef<HTMLInputElement>(null);
28
29
  const isError = !!error;
29
30
  const containerClasses = [
30
31
  'new-form-input',
31
32
  isError ? 'new-form-input--error' : '',
32
33
  props.disabled ? 'new-form-input--disabled' : '',
34
+ variant === 'on-surface' ? 'new-form-input--on-surface' : '',
33
35
  className
34
36
  ].filter(Boolean).join(' ');
35
37
 
package/src/v2/components/ZoneCard/ResourceRow.tsx CHANGED
@@ -84,20 +84,24 @@ export const ResourceRow = React.forwardRef<HTMLDivElement, ResourceRowProps>(({
84
84
  </button>
85
85
  </div>
86
86
  )}
87
- <span className="zone-card__resource-name">{name}</span>
88
- {!isMobile && (
89
- <div className="zone-card__resource-stats">
90
- <span className="zone-card__resource-stat">{qtyLabel}: {quantity}</span>
91
- <span className="zone-card__resource-stat">{capLabel}: {capacity}</span>
92
- <span className="zone-card__resource-stat zone-card__resource-stat--total">
93
- {totalLabel}: {quantity * capacity}
87
+ {isMobile ? (
88
+ <div className="zone-card__resource-info">
89
+ <span className="zone-card__resource-name">{name}</span>
90
+ <span className="zone-card__resource-stats-mobile">
91
+ {qtyLabel}: {quantity} &middot; {capLabel}: {capacity} &middot; {totalLabel}: {quantity * capacity}
94
92
  </span>
95
93
  </div>
96
- )}
97
- {isMobile && (
98
- <span className="zone-card__resource-stats-mobile">
99
- {qtyLabel}: {quantity} &middot; {capLabel}: {capacity} &middot; {totalLabel}: {quantity * capacity}
100
- </span>
94
+ ) : (
95
+ <>
96
+ <span className="zone-card__resource-name">{name}</span>
97
+ <div className="zone-card__resource-stats">
98
+ <span className="zone-card__resource-stat">{qtyLabel}: {quantity}</span>
99
+ <span className="zone-card__resource-stat">{capLabel}: {capacity}</span>
100
+ <span className="zone-card__resource-stat zone-card__resource-stat--total">
101
+ {totalLabel}: {quantity * capacity}
102
+ </span>
103
+ </div>
104
+ </>
101
105
  )}
102
106
  {menuItems.length > 0 && (
103
107
  <div className="zone-card__resource-actions" onClick={(e) => e.stopPropagation()}>
package/src/v2/components/ZoneCard/ZoneCard.scss CHANGED
@@ -83,6 +83,19 @@
83
83
  color: var(--label-primary);
84
84
  }
85
85
 
86
+ &__header-info {
87
+ display: flex;
88
+ flex-direction: column;
89
+ flex: 1;
90
+ min-width: 0;
91
+ gap: 2px;
92
+
93
+ .zone-card__total {
94
+ text-align: left;
95
+ min-width: auto;
96
+ }
97
+ }
98
+
86
99
  &__header-right {
87
100
  display: flex;
88
101
  align-items: center;
@@ -119,7 +132,6 @@
119
132
  }
120
133
 
121
134
  &--mobile {
122
- flex-wrap: wrap;
123
135
  padding-left: 16px;
124
136
  }
125
137
  }
@@ -156,6 +168,14 @@
156
168
  }
157
169
  }
158
170
 
171
+ &__resource-info {
172
+ display: flex;
173
+ flex-direction: column;
174
+ flex: 1;
175
+ min-width: 0;
176
+ gap: 2px;
177
+ }
178
+
159
179
  // Mobile-only compact stats line
160
180
  &__resource-stats-mobile {
161
181
  font-family: var(--font-family-sans, 'Geist', sans-serif);
package/src/v2/components/ZoneCard/ZoneHeader.tsx CHANGED
@@ -58,11 +58,27 @@ export const ZoneHeader: React.FC<ZoneHeaderProps> = ({
58
58
  </button>
59
59
  </div>
60
60
  )}
61
- <span className="zone-card__name">{name}</span>
62
- <div className="zone-card__header-right">
63
- <span className="zone-card__total">{totalLabel}: {totalCapacity}</span>
64
- {menuItems.length > 0 && <ActionMenu items={menuItems} />}
65
- </div>
61
+ {isMobile ? (
62
+ <>
63
+ <div className="zone-card__header-info">
64
+ <span className="zone-card__name">{name}</span>
65
+ <span className="zone-card__total">{totalLabel}: {totalCapacity}</span>
66
+ </div>
67
+ {menuItems.length > 0 && (
68
+ <div className="zone-card__header-right">
69
+ <ActionMenu items={menuItems} />
70
+ </div>
71
+ )}
72
+ </>
73
+ ) : (
74
+ <>
75
+ <span className="zone-card__name">{name}</span>
76
+ <div className="zone-card__header-right">
77
+ <span className="zone-card__total">{totalLabel}: {totalCapacity}</span>
78
+ {menuItems.length > 0 && <ActionMenu items={menuItems} />}
79
+ </div>
80
+ </>
81
+ )}
66
82
  </div>
67
83
  )
68
84
  }
package/src/v2/pages/ZonesResources/ZonesResourcesPage.scss CHANGED
@@ -7,23 +7,19 @@
7
7
  padding: 24px 32px 0 32px;
8
8
  align-self: flex-start;
9
9
 
10
- .icon-button {
11
- border-color: transparent;
12
-
13
- &:hover {
14
- background: var(--surface-action-soft, #F4F4FE);
15
- border-color: transparent;
10
+ .ghost-button {
11
+ color: var(--fill-action, #5D5BF4);
12
+ border-color: var(--borders-main-border-primary, #E8E9EF);
16
13
 
17
- .icon-button__icon,
18
- .icon-button__label {
19
- color: var(--fill-action, #5D5BF4);
20
- }
14
+ &:not(.active):hover:not(:disabled) {
15
+ background-color: var(--surface-action-soft, #F4F4FE);
16
+ color: var(--fill-action, #5D5BF4);
21
17
  }
22
- }
23
18
 
24
- .icon-button__icon,
25
- .icon-button__label {
26
- color: var(--fill-action, #5D5BF4);
19
+ .ghost-button__icon svg {
20
+ width: 24px;
21
+ height: 24px;
22
+ }
27
23
  }
28
24
 
29
25
  @media (max-width: 768px) {
@@ -35,7 +31,7 @@
35
31
  padding: 24px 32px;
36
32
 
37
33
  @media (max-width: 768px) {
38
- padding: 16px;
34
+ padding: 0;
39
35
  }
40
36
  }
41
37
 
package/src/v2/pages/ZonesResources/ZonesResourcesPage.tsx CHANGED
@@ -1,8 +1,7 @@
1
1
  import React from 'react'
2
- import { IconButton } from '../../components/IconButton'
3
2
  import { GhostButton } from '../../components/Button'
4
3
  import { NewPageHeader } from '../../components/NewPageHeader'
5
- import { PlusIcon } from '../../icons'
4
+ import { ArrowLeftIcon, PlusIcon } from '../../icons'
6
5
  import './ZonesResourcesPage.scss'
7
6
 
8
7
  export interface ZonesResourcesPageProps {
@@ -26,7 +25,9 @@ export const ZonesResourcesPage: React.FC<ZonesResourcesPageProps> = ({
26
25
  <div className="zones-resources-page">
27
26
  {onBack && (
28
27
  <div className="zones-resources-page__back">
29
- <IconButton label={backLabel} onClick={onBack} />
28
+ <GhostButton onClick={onBack} icon={<ArrowLeftIcon />}>
29
+ {backLabel}
30
+ </GhostButton>
30
31
  </div>
31
32
  )}
32
33
  <NewPageHeader
package/src/v2/styles/form/NewInput.scss CHANGED
@@ -222,9 +222,38 @@
222
222
  pointer-events: none;
223
223
  }
224
224
 
225
+ &--on-surface {
226
+ .new-form-input__input,
227
+ .new-form-input__textarea,
228
+ .new-form-input__input-with-icon {
229
+ background-color: var(--surface-primary, #fff);
230
+ background: var(--surface-primary, #fff);
231
+
232
+ &:focus,
233
+ &:focus-within {
234
+ background-color: var(--surface-primary, #fff);
235
+ }
236
+ }
237
+ }
238
+
225
239
  &.dob-input {
226
240
  .new-form-input__label {
227
241
  color: var(--label-secondary, #626A90);
228
242
  }
229
243
  }
230
244
  }
245
+
246
+ // Auto-detect: swap input backgrounds when inside a surface-secondary container
247
+ .surface-context--secondary {
248
+ .new-form-input__input,
249
+ .new-form-input__textarea,
250
+ .new-form-input__input-with-icon {
251
+ background-color: var(--surface-primary, #fff);
252
+ background: var(--surface-primary, #fff);
253
+
254
+ &:focus,
255
+ &:focus-within {
256
+ background-color: var(--surface-primary, #fff);
257
+ }
258
+ }
259
+ }