/* NexoFrame 1.0.0. Generated from DTCG token source. Default = NexoCrew light. */

/* Place product, mode and density attributes on the same theme root. Breakpoint variables are documentation values: compile media queries with their numeric values. */

:root {
  --nf-foundation-color-neutral-0: #FFFFFF;
  --nf-foundation-color-neutral-25: #FCFCFD;
  --nf-foundation-color-neutral-50: #F9FAFB;
  --nf-foundation-color-neutral-75: #F7F9FC;
  --nf-foundation-color-neutral-100: #F2F4F7;
  --nf-foundation-color-neutral-200: #EAECF0;
  --nf-foundation-color-neutral-300: #D0D5DD;
  --nf-foundation-color-neutral-400: #98A2B3;
  --nf-foundation-color-neutral-500: #667085;
  --nf-foundation-color-neutral-600: #475467;
  --nf-foundation-color-neutral-700: #344054;
  --nf-foundation-color-neutral-800: #1D2939;
  --nf-foundation-color-neutral-900: #101828;
  --nf-foundation-color-neutral-950: #0B1220;
  --nf-foundation-color-jade-50: #F0FDF8;
  --nf-foundation-color-jade-100: #DCFCEB;
  --nf-foundation-color-jade-200: #B7F3D6;
  --nf-foundation-color-jade-300: #8DE8CA;
  --nf-foundation-color-jade-400: #3FD6B0;
  --nf-foundation-color-jade-500: #13B892;
  --nf-foundation-color-jade-600: #007F6D;
  --nf-foundation-color-jade-700: #006657;
  --nf-foundation-color-jade-800: #005347;
  --nf-foundation-color-jade-900: #06473E;
  --nf-foundation-color-jade-950: #062D26;
  --nf-foundation-color-cobalt-50: #EFF4FF;
  --nf-foundation-color-cobalt-100: #D1E0FF;
  --nf-foundation-color-cobalt-200: #B2CCFF;
  --nf-foundation-color-cobalt-300: #84ADFF;
  --nf-foundation-color-cobalt-400: #528BFF;
  --nf-foundation-color-cobalt-500: #2970FF;
  --nf-foundation-color-cobalt-600: #175CD3;
  --nf-foundation-color-cobalt-700: #1849A9;
  --nf-foundation-color-cobalt-800: #194185;
  --nf-foundation-color-cobalt-900: #102A56;
  --nf-foundation-color-cobalt-950: #0A1B38;
  --nf-foundation-color-coral-50: #FFF1ED;
  --nf-foundation-color-coral-100: #FFE1D8;
  --nf-foundation-color-coral-200: #FFC2B2;
  --nf-foundation-color-coral-300: #FFA18B;
  --nf-foundation-color-coral-400: #FF806B;
  --nf-foundation-color-coral-500: #F9705A;
  --nf-foundation-color-coral-600: #ED634E;
  --nf-foundation-color-coral-700: #BA432F;
  --nf-foundation-color-coral-800: #A13222;
  --nf-foundation-color-coral-900: #712C24;
  --nf-foundation-color-coral-950: #381713;
  --nf-foundation-color-utility-control-dark: #8290A8;
  --nf-foundation-color-utility-success-light-bg: #ECFDF3;
  --nf-foundation-color-utility-success-light-fg: #05603A;
  --nf-foundation-color-utility-success-light-border: #067647;
  --nf-foundation-color-utility-success-dark-bg: #073321;
  --nf-foundation-color-utility-success-dark-fg: #75E0A7;
  --nf-foundation-color-utility-success-dark-border: #47CD89;
  --nf-foundation-color-utility-warning-light-bg: #FFFAEB;
  --nf-foundation-color-utility-warning-light-fg: #93370D;
  --nf-foundation-color-utility-warning-light-border: #B54708;
  --nf-foundation-color-utility-warning-dark-bg: #35260D;
  --nf-foundation-color-utility-warning-dark-fg: #FEDF89;
  --nf-foundation-color-utility-warning-dark-border: #FEC84B;
  --nf-foundation-color-utility-danger-light-bg: #FEF3F2;
  --nf-foundation-color-utility-danger-light-fg: #912018;
  --nf-foundation-color-utility-danger-light-border: #B42318;
  --nf-foundation-color-utility-danger-dark-bg: #3A1513;
  --nf-foundation-color-utility-danger-dark-fg: #FECDCA;
  --nf-foundation-color-utility-danger-dark-border: #FDA29B;
  --nf-foundation-color-utility-info-light-bg: #EFF8FF;
  --nf-foundation-color-utility-info-light-fg: #1849A9;
  --nf-foundation-color-utility-info-light-border: #175CD3;
  --nf-foundation-color-utility-info-dark-bg: #102A56;
  --nf-foundation-color-utility-info-dark-fg: #B2CCFF;
  --nf-foundation-color-utility-info-dark-border: #84ADFF;
  --nf-foundation-color-utility-hover-dark: #243247;
  --nf-foundation-space-0: 0rem;
  --nf-foundation-space-1: 0.25rem;
  --nf-foundation-space-2: 0.5rem;
  --nf-foundation-space-3: 0.75rem;
  --nf-foundation-space-4: 1rem;
  --nf-foundation-space-5: 1.25rem;
  --nf-foundation-space-6: 1.5rem;
  --nf-foundation-space-8: 2rem;
  --nf-foundation-space-10: 2.5rem;
  --nf-foundation-space-12: 3rem;
  --nf-foundation-space-16: 4rem;
  --nf-foundation-space-20: 5rem;
  --nf-foundation-space-24: 6rem;
  --nf-foundation-radius-none: 0px;
  --nf-foundation-radius-small: 6px;
  --nf-foundation-radius-control: 8px;
  --nf-foundation-radius-card: 12px;
  --nf-foundation-radius-panel: 16px;
  --nf-foundation-radius-pill: 9999px;
  --nf-foundation-stroke-hairline: 1px;
  --nf-foundation-stroke-emphasis: 2px;
  --nf-foundation-stroke-focus: 3px;
  --nf-foundation-font-family: "Be Vietnam Pro", sans-serif;
  --nf-foundation-font-weight-regular: 400;
  --nf-foundation-font-weight-medium: 500;
  --nf-foundation-font-weight-semibold: 600;
  --nf-foundation-font-weight-bold: 700;
  --nf-foundation-typography-display-font-family: "Be Vietnam Pro", sans-serif;
  --nf-foundation-typography-display-font-size: 3rem;
  --nf-foundation-typography-display-font-weight: 700;
  --nf-foundation-typography-display-letter-spacing: -0.96px;
  --nf-foundation-typography-display-line-height: 1.25;
  --nf-foundation-typography-heading1-font-family: "Be Vietnam Pro", sans-serif;
  --nf-foundation-typography-heading1-font-size: 2rem;
  --nf-foundation-typography-heading1-font-weight: 700;
  --nf-foundation-typography-heading1-letter-spacing: -0.64px;
  --nf-foundation-typography-heading1-line-height: 1.3125;
  --nf-foundation-typography-heading2-font-family: "Be Vietnam Pro", sans-serif;
  --nf-foundation-typography-heading2-font-size: 1.5rem;
  --nf-foundation-typography-heading2-font-weight: 600;
  --nf-foundation-typography-heading2-letter-spacing: -0.24px;
  --nf-foundation-typography-heading2-line-height: 1.41667;
  --nf-foundation-typography-heading3-font-family: "Be Vietnam Pro", sans-serif;
  --nf-foundation-typography-heading3-font-size: 1.25rem;
  --nf-foundation-typography-heading3-font-weight: 600;
  --nf-foundation-typography-heading3-letter-spacing: 0px;
  --nf-foundation-typography-heading3-line-height: 1.5;
  --nf-foundation-typography-body-font-family: "Be Vietnam Pro", sans-serif;
  --nf-foundation-typography-body-font-size: 1rem;
  --nf-foundation-typography-body-font-weight: 400;
  --nf-foundation-typography-body-letter-spacing: 0px;
  --nf-foundation-typography-body-line-height: 1.625;
  --nf-foundation-typography-ui-font-family: "Be Vietnam Pro", sans-serif;
  --nf-foundation-typography-ui-font-size: 0.875rem;
  --nf-foundation-typography-ui-font-weight: 500;
  --nf-foundation-typography-ui-letter-spacing: 0px;
  --nf-foundation-typography-ui-line-height: 1.57143;
  --nf-foundation-typography-caption-font-family: "Be Vietnam Pro", sans-serif;
  --nf-foundation-typography-caption-font-size: 0.75rem;
  --nf-foundation-typography-caption-font-weight: 400;
  --nf-foundation-typography-caption-letter-spacing: 0px;
  --nf-foundation-typography-caption-line-height: 1.5;
  --nf-foundation-typography-data-font-family: "Be Vietnam Pro", sans-serif;
  --nf-foundation-typography-data-font-size: 0.875rem;
  --nf-foundation-typography-data-font-weight: 500;
  --nf-foundation-typography-data-letter-spacing: 0px;
  --nf-foundation-typography-data-line-height: 1.57143;
  --nf-foundation-motion-duration-instant: 0ms;
  --nf-foundation-motion-duration-fast: 120ms;
  --nf-foundation-motion-duration-standard: 180ms;
  --nf-foundation-motion-duration-deliberate: 240ms;
  --nf-foundation-motion-easing-standard: cubic-bezier(0.2, 0, 0, 1);
  --nf-foundation-motion-easing-exit: cubic-bezier(0.4, 0, 1, 1);
  --nf-foundation-breakpoint-small: 640px;
  --nf-foundation-breakpoint-medium: 960px;
  --nf-foundation-breakpoint-wide: 1280px;
  --nf-foundation-layout-sidebar: 15rem;
  --nf-foundation-layout-detail-panel: 30rem;
  --nf-foundation-layout-dialog: 35rem;
  --nf-foundation-layout-reading: 45rem;
  --nf-foundation-layout-content-max: 90rem;
  --nf-foundation-size-compact-control: 36px;
  --nf-foundation-size-comfortable-control: 44px;
  --nf-foundation-size-compact-row: 40px;
  --nf-foundation-size-comfortable-row: 48px;
  --nf-foundation-size-touch-target: 44px;
  --nf-foundation-size-icon: 20px;
  --nf-foundation-size-icon-small: 16px;
  --nf-foundation-size-focus-offset: 2px;
  --nf-foundation-layer-base: 0;
  --nf-foundation-layer-sticky: 10;
  --nf-foundation-layer-dropdown: 20;
  --nf-foundation-layer-overlay: 30;
  --nf-foundation-layer-dialog: 40;
  --nf-foundation-layer-toast: 50;
  --nf-foundation-layer-tooltip: 60;
  --nf-foundation-shadow-raised: 0px 2px 8px 0px rgba(16, 24, 40, 0.1);
  --nf-foundation-shadow-overlay: 0px 8px 32px 0px rgba(16, 24, 40, 0.18);
  --nf-semantic-surface-canvas: #F7F9FC;
  --nf-semantic-surface-base: #FFFFFF;
  --nf-semantic-surface-raised: #FFFFFF;
  --nf-semantic-surface-subtle: #F2F4F7;
  --nf-semantic-surface-hover: #F2F4F7;
  --nf-semantic-text-primary: #101828;
  --nf-semantic-text-secondary: #475467;
  --nf-semantic-text-muted: #667085;
  --nf-semantic-text-link: #1849A9;
  --nf-semantic-border-subtle: #D0D5DD;
  --nf-semantic-border-control: #667085;
  --nf-semantic-action-disabled-background: #EAECF0;
  --nf-semantic-action-disabled-foreground: #475467;
  --nf-semantic-action-primary-background: #007F6D;
  --nf-semantic-action-primary-foreground: #FFFFFF;
  --nf-semantic-action-primary-hover: #006657;
  --nf-semantic-action-primary-pressed: #005347;
  --nf-semantic-action-primary-border: #006657;
  --nf-semantic-action-selected-background: #F0FDF8;
  --nf-semantic-action-selected-foreground: #005347;
  --nf-semantic-focus-ring: #175CD3;
  --nf-semantic-brand-accent: #007F6D;
  --nf-semantic-brand-on-accent: #FFFFFF;
  --nf-semantic-status-success-background: #ECFDF3;
  --nf-semantic-status-success-foreground: #05603A;
  --nf-semantic-status-success-border: #067647;
  --nf-semantic-status-success-icon: #067647;
  --nf-semantic-status-warning-background: #FFFAEB;
  --nf-semantic-status-warning-foreground: #93370D;
  --nf-semantic-status-warning-border: #B54708;
  --nf-semantic-status-warning-icon: #B54708;
  --nf-semantic-status-danger-background: #FEF3F2;
  --nf-semantic-status-danger-foreground: #912018;
  --nf-semantic-status-danger-border: #B42318;
  --nf-semantic-status-danger-icon: #B42318;
  --nf-semantic-status-information-background: #EFF8FF;
  --nf-semantic-status-information-foreground: #1849A9;
  --nf-semantic-status-information-border: #175CD3;
  --nf-semantic-status-information-icon: #175CD3;
  --nf-semantic-status-neutral-background: #F2F4F7;
  --nf-semantic-status-neutral-foreground: #344054;
  --nf-semantic-status-neutral-border: #667085;
  --nf-semantic-status-neutral-icon: #667085;
  --nf-component-button-primary-background: #007F6D;
  --nf-component-button-primary-foreground: #FFFFFF;
  --nf-component-button-primary-hover: #006657;
  --nf-component-button-primary-pressed: #005347;
  --nf-component-button-primary-border: #006657;
  --nf-component-button-secondary-background: #FFFFFF;
  --nf-component-button-secondary-foreground: #101828;
  --nf-component-button-secondary-border: #667085;
  --nf-component-button-disabled-background: #EAECF0;
  --nf-component-button-disabled-foreground: #475467;
  --nf-component-button-height: 44px;
  --nf-component-button-radius: 8px;
  --nf-component-button-padding-inline: 1rem;
  --nf-component-button-gap: 0.5rem;
  --nf-component-field-background: #FFFFFF;
  --nf-component-field-foreground: #101828;
  --nf-component-field-placeholder: #667085;
  --nf-component-field-border: #667085;
  --nf-component-field-error-border: #B42318;
  --nf-component-field-height: 44px;
  --nf-component-field-radius: 8px;
  --nf-component-field-padding-inline: 0.75rem;
  --nf-component-card-background: #FFFFFF;
  --nf-component-card-border: #D0D5DD;
  --nf-component-card-radius: 12px;
  --nf-component-card-padding: 1.5rem;
  --nf-component-table-header-background: #F2F4F7;
  --nf-component-table-row-background: #FFFFFF;
  --nf-component-table-row-hover: #F2F4F7;
  --nf-component-table-row-height: 48px;
  --nf-component-nav-selected-background: #F0FDF8;
  --nf-component-nav-selected-foreground: #005347;
  --nf-component-badge-warning-background: #FFFAEB;
  --nf-component-badge-warning-foreground: #93370D;
  --nf-component-focus-color: #175CD3;
  --nf-component-focus-width: 3px;
  --nf-component-focus-offset: 2px;
  --nf-component-panel-radius: 16px;
  --nf-component-icon-size: 20px;
  --nf-component-transition-duration: 120ms;
  --nf-component-transition-easing: cubic-bezier(0.2, 0, 0, 1);
  --nf-component-overlay-shadow: 0px 8px 32px 0px rgba(16, 24, 40, 0.18);
}

[data-nexo-product="nexobox"][data-nexo-mode="light"] {
  --nf-semantic-surface-canvas: #F7F9FC;
  --nf-semantic-surface-base: #FFFFFF;
  --nf-semantic-surface-raised: #FFFFFF;
  --nf-semantic-surface-subtle: #F2F4F7;
  --nf-semantic-surface-hover: #F2F4F7;
  --nf-semantic-text-primary: #101828;
  --nf-semantic-text-secondary: #475467;
  --nf-semantic-text-muted: #667085;
  --nf-semantic-text-link: #1849A9;
  --nf-semantic-border-subtle: #D0D5DD;
  --nf-semantic-border-control: #667085;
  --nf-semantic-action-disabled-background: #EAECF0;
  --nf-semantic-action-disabled-foreground: #475467;
  --nf-semantic-action-primary-background: #101828;
  --nf-semantic-action-primary-foreground: #FFFFFF;
  --nf-semantic-action-primary-hover: #344054;
  --nf-semantic-action-primary-pressed: #475467;
  --nf-semantic-action-primary-border: #101828;
  --nf-semantic-action-selected-background: #F2F4F7;
  --nf-semantic-action-selected-foreground: #101828;
  --nf-semantic-focus-ring: #175CD3;
  --nf-semantic-brand-accent: #101828;
  --nf-semantic-brand-on-accent: #FFFFFF;
  --nf-semantic-status-success-background: #ECFDF3;
  --nf-semantic-status-success-foreground: #05603A;
  --nf-semantic-status-success-border: #067647;
  --nf-semantic-status-success-icon: #067647;
  --nf-semantic-status-warning-background: #FFFAEB;
  --nf-semantic-status-warning-foreground: #93370D;
  --nf-semantic-status-warning-border: #B54708;
  --nf-semantic-status-warning-icon: #B54708;
  --nf-semantic-status-danger-background: #FEF3F2;
  --nf-semantic-status-danger-foreground: #912018;
  --nf-semantic-status-danger-border: #B42318;
  --nf-semantic-status-danger-icon: #B42318;
  --nf-semantic-status-information-background: #EFF8FF;
  --nf-semantic-status-information-foreground: #1849A9;
  --nf-semantic-status-information-border: #175CD3;
  --nf-semantic-status-information-icon: #175CD3;
  --nf-semantic-status-neutral-background: #F2F4F7;
  --nf-semantic-status-neutral-foreground: #344054;
  --nf-semantic-status-neutral-border: #667085;
  --nf-semantic-status-neutral-icon: #667085;
  --nf-component-button-primary-background: #101828;
  --nf-component-button-primary-foreground: #FFFFFF;
  --nf-component-button-primary-hover: #344054;
  --nf-component-button-primary-pressed: #475467;
  --nf-component-button-primary-border: #101828;
  --nf-component-button-secondary-background: #FFFFFF;
  --nf-component-button-secondary-foreground: #101828;
  --nf-component-button-secondary-border: #667085;
  --nf-component-button-disabled-background: #EAECF0;
  --nf-component-button-disabled-foreground: #475467;
  --nf-component-button-height: 44px;
  --nf-component-button-radius: 8px;
  --nf-component-button-padding-inline: 1rem;
  --nf-component-button-gap: 0.5rem;
  --nf-component-field-background: #FFFFFF;
  --nf-component-field-foreground: #101828;
  --nf-component-field-placeholder: #667085;
  --nf-component-field-border: #667085;
  --nf-component-field-error-border: #B42318;
  --nf-component-field-height: 44px;
  --nf-component-field-radius: 8px;
  --nf-component-field-padding-inline: 0.75rem;
  --nf-component-card-background: #FFFFFF;
  --nf-component-card-border: #D0D5DD;
  --nf-component-card-radius: 12px;
  --nf-component-card-padding: 1.5rem;
  --nf-component-table-header-background: #F2F4F7;
  --nf-component-table-row-background: #FFFFFF;
  --nf-component-table-row-hover: #F2F4F7;
  --nf-component-table-row-height: 48px;
  --nf-component-nav-selected-background: #F2F4F7;
  --nf-component-nav-selected-foreground: #101828;
  --nf-component-badge-warning-background: #FFFAEB;
  --nf-component-badge-warning-foreground: #93370D;
  --nf-component-focus-color: #175CD3;
  --nf-component-focus-width: 3px;
  --nf-component-focus-offset: 2px;
  --nf-component-panel-radius: 16px;
  --nf-component-icon-size: 20px;
  --nf-component-transition-duration: 120ms;
  --nf-component-transition-easing: cubic-bezier(0.2, 0, 0, 1);
  --nf-component-overlay-shadow: 0px 8px 32px 0px rgba(16, 24, 40, 0.18);
}

[data-nexo-product="nexobox"][data-nexo-mode="dark"] {
  --nf-semantic-surface-canvas: #0B1220;
  --nf-semantic-surface-base: #101828;
  --nf-semantic-surface-raised: #1D2939;
  --nf-semantic-surface-subtle: #1D2939;
  --nf-semantic-surface-hover: #243247;
  --nf-semantic-text-primary: #F9FAFB;
  --nf-semantic-text-secondary: #D0D5DD;
  --nf-semantic-text-muted: #98A2B3;
  --nf-semantic-text-link: #B2CCFF;
  --nf-semantic-border-subtle: #344054;
  --nf-semantic-border-control: #8290A8;
  --nf-semantic-action-disabled-background: #1D2939;
  --nf-semantic-action-disabled-foreground: #98A2B3;
  --nf-semantic-action-primary-background: #F9FAFB;
  --nf-semantic-action-primary-foreground: #101828;
  --nf-semantic-action-primary-hover: #EAECF0;
  --nf-semantic-action-primary-pressed: #D0D5DD;
  --nf-semantic-action-primary-border: #F9FAFB;
  --nf-semantic-action-selected-background: #1D2939;
  --nf-semantic-action-selected-foreground: #F9FAFB;
  --nf-semantic-focus-ring: #84ADFF;
  --nf-semantic-brand-accent: #F9FAFB;
  --nf-semantic-brand-on-accent: #101828;
  --nf-semantic-status-success-background: #073321;
  --nf-semantic-status-success-foreground: #75E0A7;
  --nf-semantic-status-success-border: #47CD89;
  --nf-semantic-status-success-icon: #47CD89;
  --nf-semantic-status-warning-background: #35260D;
  --nf-semantic-status-warning-foreground: #FEDF89;
  --nf-semantic-status-warning-border: #FEC84B;
  --nf-semantic-status-warning-icon: #FEC84B;
  --nf-semantic-status-danger-background: #3A1513;
  --nf-semantic-status-danger-foreground: #FECDCA;
  --nf-semantic-status-danger-border: #FDA29B;
  --nf-semantic-status-danger-icon: #FDA29B;
  --nf-semantic-status-information-background: #102A56;
  --nf-semantic-status-information-foreground: #B2CCFF;
  --nf-semantic-status-information-border: #84ADFF;
  --nf-semantic-status-information-icon: #84ADFF;
  --nf-semantic-status-neutral-background: #1D2939;
  --nf-semantic-status-neutral-foreground: #D0D5DD;
  --nf-semantic-status-neutral-border: #8290A8;
  --nf-semantic-status-neutral-icon: #8290A8;
  --nf-component-button-primary-background: #F9FAFB;
  --nf-component-button-primary-foreground: #101828;
  --nf-component-button-primary-hover: #EAECF0;
  --nf-component-button-primary-pressed: #D0D5DD;
  --nf-component-button-primary-border: #F9FAFB;
  --nf-component-button-secondary-background: #1D2939;
  --nf-component-button-secondary-foreground: #F9FAFB;
  --nf-component-button-secondary-border: #8290A8;
  --nf-component-button-disabled-background: #1D2939;
  --nf-component-button-disabled-foreground: #98A2B3;
  --nf-component-button-height: 44px;
  --nf-component-button-radius: 8px;
  --nf-component-button-padding-inline: 1rem;
  --nf-component-button-gap: 0.5rem;
  --nf-component-field-background: #1D2939;
  --nf-component-field-foreground: #F9FAFB;
  --nf-component-field-placeholder: #98A2B3;
  --nf-component-field-border: #8290A8;
  --nf-component-field-error-border: #FDA29B;
  --nf-component-field-height: 44px;
  --nf-component-field-radius: 8px;
  --nf-component-field-padding-inline: 0.75rem;
  --nf-component-card-background: #1D2939;
  --nf-component-card-border: #344054;
  --nf-component-card-radius: 12px;
  --nf-component-card-padding: 1.5rem;
  --nf-component-table-header-background: #1D2939;
  --nf-component-table-row-background: #1D2939;
  --nf-component-table-row-hover: #243247;
  --nf-component-table-row-height: 48px;
  --nf-component-nav-selected-background: #1D2939;
  --nf-component-nav-selected-foreground: #F9FAFB;
  --nf-component-badge-warning-background: #35260D;
  --nf-component-badge-warning-foreground: #FEDF89;
  --nf-component-focus-color: #84ADFF;
  --nf-component-focus-width: 3px;
  --nf-component-focus-offset: 2px;
  --nf-component-panel-radius: 16px;
  --nf-component-icon-size: 20px;
  --nf-component-transition-duration: 120ms;
  --nf-component-transition-easing: cubic-bezier(0.2, 0, 0, 1);
  --nf-component-overlay-shadow: 0px 8px 32px 0px rgba(16, 24, 40, 0.18);
}

[data-nexo-product="nexocrew"][data-nexo-mode="light"] {
  --nf-semantic-surface-canvas: #F7F9FC;
  --nf-semantic-surface-base: #FFFFFF;
  --nf-semantic-surface-raised: #FFFFFF;
  --nf-semantic-surface-subtle: #F2F4F7;
  --nf-semantic-surface-hover: #F2F4F7;
  --nf-semantic-text-primary: #101828;
  --nf-semantic-text-secondary: #475467;
  --nf-semantic-text-muted: #667085;
  --nf-semantic-text-link: #1849A9;
  --nf-semantic-border-subtle: #D0D5DD;
  --nf-semantic-border-control: #667085;
  --nf-semantic-action-disabled-background: #EAECF0;
  --nf-semantic-action-disabled-foreground: #475467;
  --nf-semantic-action-primary-background: #007F6D;
  --nf-semantic-action-primary-foreground: #FFFFFF;
  --nf-semantic-action-primary-hover: #006657;
  --nf-semantic-action-primary-pressed: #005347;
  --nf-semantic-action-primary-border: #006657;
  --nf-semantic-action-selected-background: #F0FDF8;
  --nf-semantic-action-selected-foreground: #005347;
  --nf-semantic-focus-ring: #175CD3;
  --nf-semantic-brand-accent: #007F6D;
  --nf-semantic-brand-on-accent: #FFFFFF;
  --nf-semantic-status-success-background: #ECFDF3;
  --nf-semantic-status-success-foreground: #05603A;
  --nf-semantic-status-success-border: #067647;
  --nf-semantic-status-success-icon: #067647;
  --nf-semantic-status-warning-background: #FFFAEB;
  --nf-semantic-status-warning-foreground: #93370D;
  --nf-semantic-status-warning-border: #B54708;
  --nf-semantic-status-warning-icon: #B54708;
  --nf-semantic-status-danger-background: #FEF3F2;
  --nf-semantic-status-danger-foreground: #912018;
  --nf-semantic-status-danger-border: #B42318;
  --nf-semantic-status-danger-icon: #B42318;
  --nf-semantic-status-information-background: #EFF8FF;
  --nf-semantic-status-information-foreground: #1849A9;
  --nf-semantic-status-information-border: #175CD3;
  --nf-semantic-status-information-icon: #175CD3;
  --nf-semantic-status-neutral-background: #F2F4F7;
  --nf-semantic-status-neutral-foreground: #344054;
  --nf-semantic-status-neutral-border: #667085;
  --nf-semantic-status-neutral-icon: #667085;
  --nf-component-button-primary-background: #007F6D;
  --nf-component-button-primary-foreground: #FFFFFF;
  --nf-component-button-primary-hover: #006657;
  --nf-component-button-primary-pressed: #005347;
  --nf-component-button-primary-border: #006657;
  --nf-component-button-secondary-background: #FFFFFF;
  --nf-component-button-secondary-foreground: #101828;
  --nf-component-button-secondary-border: #667085;
  --nf-component-button-disabled-background: #EAECF0;
  --nf-component-button-disabled-foreground: #475467;
  --nf-component-button-height: 44px;
  --nf-component-button-radius: 8px;
  --nf-component-button-padding-inline: 1rem;
  --nf-component-button-gap: 0.5rem;
  --nf-component-field-background: #FFFFFF;
  --nf-component-field-foreground: #101828;
  --nf-component-field-placeholder: #667085;
  --nf-component-field-border: #667085;
  --nf-component-field-error-border: #B42318;
  --nf-component-field-height: 44px;
  --nf-component-field-radius: 8px;
  --nf-component-field-padding-inline: 0.75rem;
  --nf-component-card-background: #FFFFFF;
  --nf-component-card-border: #D0D5DD;
  --nf-component-card-radius: 12px;
  --nf-component-card-padding: 1.5rem;
  --nf-component-table-header-background: #F2F4F7;
  --nf-component-table-row-background: #FFFFFF;
  --nf-component-table-row-hover: #F2F4F7;
  --nf-component-table-row-height: 48px;
  --nf-component-nav-selected-background: #F0FDF8;
  --nf-component-nav-selected-foreground: #005347;
  --nf-component-badge-warning-background: #FFFAEB;
  --nf-component-badge-warning-foreground: #93370D;
  --nf-component-focus-color: #175CD3;
  --nf-component-focus-width: 3px;
  --nf-component-focus-offset: 2px;
  --nf-component-panel-radius: 16px;
  --nf-component-icon-size: 20px;
  --nf-component-transition-duration: 120ms;
  --nf-component-transition-easing: cubic-bezier(0.2, 0, 0, 1);
  --nf-component-overlay-shadow: 0px 8px 32px 0px rgba(16, 24, 40, 0.18);
}

[data-nexo-product="nexocrew"][data-nexo-mode="dark"] {
  --nf-semantic-surface-canvas: #0B1220;
  --nf-semantic-surface-base: #101828;
  --nf-semantic-surface-raised: #1D2939;
  --nf-semantic-surface-subtle: #1D2939;
  --nf-semantic-surface-hover: #243247;
  --nf-semantic-text-primary: #F9FAFB;
  --nf-semantic-text-secondary: #D0D5DD;
  --nf-semantic-text-muted: #98A2B3;
  --nf-semantic-text-link: #B2CCFF;
  --nf-semantic-border-subtle: #344054;
  --nf-semantic-border-control: #8290A8;
  --nf-semantic-action-disabled-background: #1D2939;
  --nf-semantic-action-disabled-foreground: #98A2B3;
  --nf-semantic-action-primary-background: #3FD6B0;
  --nf-semantic-action-primary-foreground: #062D26;
  --nf-semantic-action-primary-hover: #8DE8CA;
  --nf-semantic-action-primary-pressed: #B7F3D6;
  --nf-semantic-action-primary-border: #3FD6B0;
  --nf-semantic-action-selected-background: #062D26;
  --nf-semantic-action-selected-foreground: #8DE8CA;
  --nf-semantic-focus-ring: #84ADFF;
  --nf-semantic-brand-accent: #3FD6B0;
  --nf-semantic-brand-on-accent: #062D26;
  --nf-semantic-status-success-background: #073321;
  --nf-semantic-status-success-foreground: #75E0A7;
  --nf-semantic-status-success-border: #47CD89;
  --nf-semantic-status-success-icon: #47CD89;
  --nf-semantic-status-warning-background: #35260D;
  --nf-semantic-status-warning-foreground: #FEDF89;
  --nf-semantic-status-warning-border: #FEC84B;
  --nf-semantic-status-warning-icon: #FEC84B;
  --nf-semantic-status-danger-background: #3A1513;
  --nf-semantic-status-danger-foreground: #FECDCA;
  --nf-semantic-status-danger-border: #FDA29B;
  --nf-semantic-status-danger-icon: #FDA29B;
  --nf-semantic-status-information-background: #102A56;
  --nf-semantic-status-information-foreground: #B2CCFF;
  --nf-semantic-status-information-border: #84ADFF;
  --nf-semantic-status-information-icon: #84ADFF;
  --nf-semantic-status-neutral-background: #1D2939;
  --nf-semantic-status-neutral-foreground: #D0D5DD;
  --nf-semantic-status-neutral-border: #8290A8;
  --nf-semantic-status-neutral-icon: #8290A8;
  --nf-component-button-primary-background: #3FD6B0;
  --nf-component-button-primary-foreground: #062D26;
  --nf-component-button-primary-hover: #8DE8CA;
  --nf-component-button-primary-pressed: #B7F3D6;
  --nf-component-button-primary-border: #3FD6B0;
  --nf-component-button-secondary-background: #1D2939;
  --nf-component-button-secondary-foreground: #F9FAFB;
  --nf-component-button-secondary-border: #8290A8;
  --nf-component-button-disabled-background: #1D2939;
  --nf-component-button-disabled-foreground: #98A2B3;
  --nf-component-button-height: 44px;
  --nf-component-button-radius: 8px;
  --nf-component-button-padding-inline: 1rem;
  --nf-component-button-gap: 0.5rem;
  --nf-component-field-background: #1D2939;
  --nf-component-field-foreground: #F9FAFB;
  --nf-component-field-placeholder: #98A2B3;
  --nf-component-field-border: #8290A8;
  --nf-component-field-error-border: #FDA29B;
  --nf-component-field-height: 44px;
  --nf-component-field-radius: 8px;
  --nf-component-field-padding-inline: 0.75rem;
  --nf-component-card-background: #1D2939;
  --nf-component-card-border: #344054;
  --nf-component-card-radius: 12px;
  --nf-component-card-padding: 1.5rem;
  --nf-component-table-header-background: #1D2939;
  --nf-component-table-row-background: #1D2939;
  --nf-component-table-row-hover: #243247;
  --nf-component-table-row-height: 48px;
  --nf-component-nav-selected-background: #062D26;
  --nf-component-nav-selected-foreground: #8DE8CA;
  --nf-component-badge-warning-background: #35260D;
  --nf-component-badge-warning-foreground: #FEDF89;
  --nf-component-focus-color: #84ADFF;
  --nf-component-focus-width: 3px;
  --nf-component-focus-offset: 2px;
  --nf-component-panel-radius: 16px;
  --nf-component-icon-size: 20px;
  --nf-component-transition-duration: 120ms;
  --nf-component-transition-easing: cubic-bezier(0.2, 0, 0, 1);
  --nf-component-overlay-shadow: 0px 8px 32px 0px rgba(16, 24, 40, 0.18);
}

[data-nexo-product="nexoframe"][data-nexo-mode="light"] {
  --nf-semantic-surface-canvas: #F7F9FC;
  --nf-semantic-surface-base: #FFFFFF;
  --nf-semantic-surface-raised: #FFFFFF;
  --nf-semantic-surface-subtle: #F2F4F7;
  --nf-semantic-surface-hover: #F2F4F7;
  --nf-semantic-text-primary: #101828;
  --nf-semantic-text-secondary: #475467;
  --nf-semantic-text-muted: #667085;
  --nf-semantic-text-link: #1849A9;
  --nf-semantic-border-subtle: #D0D5DD;
  --nf-semantic-border-control: #667085;
  --nf-semantic-action-disabled-background: #EAECF0;
  --nf-semantic-action-disabled-foreground: #475467;
  --nf-semantic-action-primary-background: #101828;
  --nf-semantic-action-primary-foreground: #FFFFFF;
  --nf-semantic-action-primary-hover: #344054;
  --nf-semantic-action-primary-pressed: #475467;
  --nf-semantic-action-primary-border: #101828;
  --nf-semantic-action-selected-background: #F2F4F7;
  --nf-semantic-action-selected-foreground: #101828;
  --nf-semantic-focus-ring: #175CD3;
  --nf-semantic-brand-accent: #101828;
  --nf-semantic-brand-on-accent: #FFFFFF;
  --nf-semantic-status-success-background: #ECFDF3;
  --nf-semantic-status-success-foreground: #05603A;
  --nf-semantic-status-success-border: #067647;
  --nf-semantic-status-success-icon: #067647;
  --nf-semantic-status-warning-background: #FFFAEB;
  --nf-semantic-status-warning-foreground: #93370D;
  --nf-semantic-status-warning-border: #B54708;
  --nf-semantic-status-warning-icon: #B54708;
  --nf-semantic-status-danger-background: #FEF3F2;
  --nf-semantic-status-danger-foreground: #912018;
  --nf-semantic-status-danger-border: #B42318;
  --nf-semantic-status-danger-icon: #B42318;
  --nf-semantic-status-information-background: #EFF8FF;
  --nf-semantic-status-information-foreground: #1849A9;
  --nf-semantic-status-information-border: #175CD3;
  --nf-semantic-status-information-icon: #175CD3;
  --nf-semantic-status-neutral-background: #F2F4F7;
  --nf-semantic-status-neutral-foreground: #344054;
  --nf-semantic-status-neutral-border: #667085;
  --nf-semantic-status-neutral-icon: #667085;
  --nf-component-button-primary-background: #101828;
  --nf-component-button-primary-foreground: #FFFFFF;
  --nf-component-button-primary-hover: #344054;
  --nf-component-button-primary-pressed: #475467;
  --nf-component-button-primary-border: #101828;
  --nf-component-button-secondary-background: #FFFFFF;
  --nf-component-button-secondary-foreground: #101828;
  --nf-component-button-secondary-border: #667085;
  --nf-component-button-disabled-background: #EAECF0;
  --nf-component-button-disabled-foreground: #475467;
  --nf-component-button-height: 44px;
  --nf-component-button-radius: 8px;
  --nf-component-button-padding-inline: 1rem;
  --nf-component-button-gap: 0.5rem;
  --nf-component-field-background: #FFFFFF;
  --nf-component-field-foreground: #101828;
  --nf-component-field-placeholder: #667085;
  --nf-component-field-border: #667085;
  --nf-component-field-error-border: #B42318;
  --nf-component-field-height: 44px;
  --nf-component-field-radius: 8px;
  --nf-component-field-padding-inline: 0.75rem;
  --nf-component-card-background: #FFFFFF;
  --nf-component-card-border: #D0D5DD;
  --nf-component-card-radius: 12px;
  --nf-component-card-padding: 1.5rem;
  --nf-component-table-header-background: #F2F4F7;
  --nf-component-table-row-background: #FFFFFF;
  --nf-component-table-row-hover: #F2F4F7;
  --nf-component-table-row-height: 48px;
  --nf-component-nav-selected-background: #F2F4F7;
  --nf-component-nav-selected-foreground: #101828;
  --nf-component-badge-warning-background: #FFFAEB;
  --nf-component-badge-warning-foreground: #93370D;
  --nf-component-focus-color: #175CD3;
  --nf-component-focus-width: 3px;
  --nf-component-focus-offset: 2px;
  --nf-component-panel-radius: 16px;
  --nf-component-icon-size: 20px;
  --nf-component-transition-duration: 120ms;
  --nf-component-transition-easing: cubic-bezier(0.2, 0, 0, 1);
  --nf-component-overlay-shadow: 0px 8px 32px 0px rgba(16, 24, 40, 0.18);
}

[data-nexo-product="nexoframe"][data-nexo-mode="dark"] {
  --nf-semantic-surface-canvas: #0B1220;
  --nf-semantic-surface-base: #101828;
  --nf-semantic-surface-raised: #1D2939;
  --nf-semantic-surface-subtle: #1D2939;
  --nf-semantic-surface-hover: #243247;
  --nf-semantic-text-primary: #F9FAFB;
  --nf-semantic-text-secondary: #D0D5DD;
  --nf-semantic-text-muted: #98A2B3;
  --nf-semantic-text-link: #B2CCFF;
  --nf-semantic-border-subtle: #344054;
  --nf-semantic-border-control: #8290A8;
  --nf-semantic-action-disabled-background: #1D2939;
  --nf-semantic-action-disabled-foreground: #98A2B3;
  --nf-semantic-action-primary-background: #F9FAFB;
  --nf-semantic-action-primary-foreground: #101828;
  --nf-semantic-action-primary-hover: #EAECF0;
  --nf-semantic-action-primary-pressed: #D0D5DD;
  --nf-semantic-action-primary-border: #F9FAFB;
  --nf-semantic-action-selected-background: #1D2939;
  --nf-semantic-action-selected-foreground: #F9FAFB;
  --nf-semantic-focus-ring: #84ADFF;
  --nf-semantic-brand-accent: #F9FAFB;
  --nf-semantic-brand-on-accent: #101828;
  --nf-semantic-status-success-background: #073321;
  --nf-semantic-status-success-foreground: #75E0A7;
  --nf-semantic-status-success-border: #47CD89;
  --nf-semantic-status-success-icon: #47CD89;
  --nf-semantic-status-warning-background: #35260D;
  --nf-semantic-status-warning-foreground: #FEDF89;
  --nf-semantic-status-warning-border: #FEC84B;
  --nf-semantic-status-warning-icon: #FEC84B;
  --nf-semantic-status-danger-background: #3A1513;
  --nf-semantic-status-danger-foreground: #FECDCA;
  --nf-semantic-status-danger-border: #FDA29B;
  --nf-semantic-status-danger-icon: #FDA29B;
  --nf-semantic-status-information-background: #102A56;
  --nf-semantic-status-information-foreground: #B2CCFF;
  --nf-semantic-status-information-border: #84ADFF;
  --nf-semantic-status-information-icon: #84ADFF;
  --nf-semantic-status-neutral-background: #1D2939;
  --nf-semantic-status-neutral-foreground: #D0D5DD;
  --nf-semantic-status-neutral-border: #8290A8;
  --nf-semantic-status-neutral-icon: #8290A8;
  --nf-component-button-primary-background: #F9FAFB;
  --nf-component-button-primary-foreground: #101828;
  --nf-component-button-primary-hover: #EAECF0;
  --nf-component-button-primary-pressed: #D0D5DD;
  --nf-component-button-primary-border: #F9FAFB;
  --nf-component-button-secondary-background: #1D2939;
  --nf-component-button-secondary-foreground: #F9FAFB;
  --nf-component-button-secondary-border: #8290A8;
  --nf-component-button-disabled-background: #1D2939;
  --nf-component-button-disabled-foreground: #98A2B3;
  --nf-component-button-height: 44px;
  --nf-component-button-radius: 8px;
  --nf-component-button-padding-inline: 1rem;
  --nf-component-button-gap: 0.5rem;
  --nf-component-field-background: #1D2939;
  --nf-component-field-foreground: #F9FAFB;
  --nf-component-field-placeholder: #98A2B3;
  --nf-component-field-border: #8290A8;
  --nf-component-field-error-border: #FDA29B;
  --nf-component-field-height: 44px;
  --nf-component-field-radius: 8px;
  --nf-component-field-padding-inline: 0.75rem;
  --nf-component-card-background: #1D2939;
  --nf-component-card-border: #344054;
  --nf-component-card-radius: 12px;
  --nf-component-card-padding: 1.5rem;
  --nf-component-table-header-background: #1D2939;
  --nf-component-table-row-background: #1D2939;
  --nf-component-table-row-hover: #243247;
  --nf-component-table-row-height: 48px;
  --nf-component-nav-selected-background: #1D2939;
  --nf-component-nav-selected-foreground: #F9FAFB;
  --nf-component-badge-warning-background: #35260D;
  --nf-component-badge-warning-foreground: #FEDF89;
  --nf-component-focus-color: #84ADFF;
  --nf-component-focus-width: 3px;
  --nf-component-focus-offset: 2px;
  --nf-component-panel-radius: 16px;
  --nf-component-icon-size: 20px;
  --nf-component-transition-duration: 120ms;
  --nf-component-transition-easing: cubic-bezier(0.2, 0, 0, 1);
  --nf-component-overlay-shadow: 0px 8px 32px 0px rgba(16, 24, 40, 0.18);
}

[data-nexo-product="nexopay"][data-nexo-mode="light"] {
  --nf-semantic-surface-canvas: #F7F9FC;
  --nf-semantic-surface-base: #FFFFFF;
  --nf-semantic-surface-raised: #FFFFFF;
  --nf-semantic-surface-subtle: #F2F4F7;
  --nf-semantic-surface-hover: #F2F4F7;
  --nf-semantic-text-primary: #101828;
  --nf-semantic-text-secondary: #475467;
  --nf-semantic-text-muted: #667085;
  --nf-semantic-text-link: #1849A9;
  --nf-semantic-border-subtle: #D0D5DD;
  --nf-semantic-border-control: #667085;
  --nf-semantic-action-disabled-background: #EAECF0;
  --nf-semantic-action-disabled-foreground: #475467;
  --nf-semantic-action-primary-background: #175CD3;
  --nf-semantic-action-primary-foreground: #FFFFFF;
  --nf-semantic-action-primary-hover: #1849A9;
  --nf-semantic-action-primary-pressed: #194185;
  --nf-semantic-action-primary-border: #1849A9;
  --nf-semantic-action-selected-background: #EFF4FF;
  --nf-semantic-action-selected-foreground: #194185;
  --nf-semantic-focus-ring: #175CD3;
  --nf-semantic-brand-accent: #175CD3;
  --nf-semantic-brand-on-accent: #FFFFFF;
  --nf-semantic-status-success-background: #ECFDF3;
  --nf-semantic-status-success-foreground: #05603A;
  --nf-semantic-status-success-border: #067647;
  --nf-semantic-status-success-icon: #067647;
  --nf-semantic-status-warning-background: #FFFAEB;
  --nf-semantic-status-warning-foreground: #93370D;
  --nf-semantic-status-warning-border: #B54708;
  --nf-semantic-status-warning-icon: #B54708;
  --nf-semantic-status-danger-background: #FEF3F2;
  --nf-semantic-status-danger-foreground: #912018;
  --nf-semantic-status-danger-border: #B42318;
  --nf-semantic-status-danger-icon: #B42318;
  --nf-semantic-status-information-background: #EFF8FF;
  --nf-semantic-status-information-foreground: #1849A9;
  --nf-semantic-status-information-border: #175CD3;
  --nf-semantic-status-information-icon: #175CD3;
  --nf-semantic-status-neutral-background: #F2F4F7;
  --nf-semantic-status-neutral-foreground: #344054;
  --nf-semantic-status-neutral-border: #667085;
  --nf-semantic-status-neutral-icon: #667085;
  --nf-component-button-primary-background: #175CD3;
  --nf-component-button-primary-foreground: #FFFFFF;
  --nf-component-button-primary-hover: #1849A9;
  --nf-component-button-primary-pressed: #194185;
  --nf-component-button-primary-border: #1849A9;
  --nf-component-button-secondary-background: #FFFFFF;
  --nf-component-button-secondary-foreground: #101828;
  --nf-component-button-secondary-border: #667085;
  --nf-component-button-disabled-background: #EAECF0;
  --nf-component-button-disabled-foreground: #475467;
  --nf-component-button-height: 44px;
  --nf-component-button-radius: 8px;
  --nf-component-button-padding-inline: 1rem;
  --nf-component-button-gap: 0.5rem;
  --nf-component-field-background: #FFFFFF;
  --nf-component-field-foreground: #101828;
  --nf-component-field-placeholder: #667085;
  --nf-component-field-border: #667085;
  --nf-component-field-error-border: #B42318;
  --nf-component-field-height: 44px;
  --nf-component-field-radius: 8px;
  --nf-component-field-padding-inline: 0.75rem;
  --nf-component-card-background: #FFFFFF;
  --nf-component-card-border: #D0D5DD;
  --nf-component-card-radius: 12px;
  --nf-component-card-padding: 1.5rem;
  --nf-component-table-header-background: #F2F4F7;
  --nf-component-table-row-background: #FFFFFF;
  --nf-component-table-row-hover: #F2F4F7;
  --nf-component-table-row-height: 48px;
  --nf-component-nav-selected-background: #EFF4FF;
  --nf-component-nav-selected-foreground: #194185;
  --nf-component-badge-warning-background: #FFFAEB;
  --nf-component-badge-warning-foreground: #93370D;
  --nf-component-focus-color: #175CD3;
  --nf-component-focus-width: 3px;
  --nf-component-focus-offset: 2px;
  --nf-component-panel-radius: 16px;
  --nf-component-icon-size: 20px;
  --nf-component-transition-duration: 120ms;
  --nf-component-transition-easing: cubic-bezier(0.2, 0, 0, 1);
  --nf-component-overlay-shadow: 0px 8px 32px 0px rgba(16, 24, 40, 0.18);
}

[data-nexo-product="nexopay"][data-nexo-mode="dark"] {
  --nf-semantic-surface-canvas: #0B1220;
  --nf-semantic-surface-base: #101828;
  --nf-semantic-surface-raised: #1D2939;
  --nf-semantic-surface-subtle: #1D2939;
  --nf-semantic-surface-hover: #243247;
  --nf-semantic-text-primary: #F9FAFB;
  --nf-semantic-text-secondary: #D0D5DD;
  --nf-semantic-text-muted: #98A2B3;
  --nf-semantic-text-link: #B2CCFF;
  --nf-semantic-border-subtle: #344054;
  --nf-semantic-border-control: #8290A8;
  --nf-semantic-action-disabled-background: #1D2939;
  --nf-semantic-action-disabled-foreground: #98A2B3;
  --nf-semantic-action-primary-background: #84ADFF;
  --nf-semantic-action-primary-foreground: #0A1B38;
  --nf-semantic-action-primary-hover: #B2CCFF;
  --nf-semantic-action-primary-pressed: #D1E0FF;
  --nf-semantic-action-primary-border: #84ADFF;
  --nf-semantic-action-selected-background: #0A1B38;
  --nf-semantic-action-selected-foreground: #B2CCFF;
  --nf-semantic-focus-ring: #84ADFF;
  --nf-semantic-brand-accent: #84ADFF;
  --nf-semantic-brand-on-accent: #0A1B38;
  --nf-semantic-status-success-background: #073321;
  --nf-semantic-status-success-foreground: #75E0A7;
  --nf-semantic-status-success-border: #47CD89;
  --nf-semantic-status-success-icon: #47CD89;
  --nf-semantic-status-warning-background: #35260D;
  --nf-semantic-status-warning-foreground: #FEDF89;
  --nf-semantic-status-warning-border: #FEC84B;
  --nf-semantic-status-warning-icon: #FEC84B;
  --nf-semantic-status-danger-background: #3A1513;
  --nf-semantic-status-danger-foreground: #FECDCA;
  --nf-semantic-status-danger-border: #FDA29B;
  --nf-semantic-status-danger-icon: #FDA29B;
  --nf-semantic-status-information-background: #102A56;
  --nf-semantic-status-information-foreground: #B2CCFF;
  --nf-semantic-status-information-border: #84ADFF;
  --nf-semantic-status-information-icon: #84ADFF;
  --nf-semantic-status-neutral-background: #1D2939;
  --nf-semantic-status-neutral-foreground: #D0D5DD;
  --nf-semantic-status-neutral-border: #8290A8;
  --nf-semantic-status-neutral-icon: #8290A8;
  --nf-component-button-primary-background: #84ADFF;
  --nf-component-button-primary-foreground: #0A1B38;
  --nf-component-button-primary-hover: #B2CCFF;
  --nf-component-button-primary-pressed: #D1E0FF;
  --nf-component-button-primary-border: #84ADFF;
  --nf-component-button-secondary-background: #1D2939;
  --nf-component-button-secondary-foreground: #F9FAFB;
  --nf-component-button-secondary-border: #8290A8;
  --nf-component-button-disabled-background: #1D2939;
  --nf-component-button-disabled-foreground: #98A2B3;
  --nf-component-button-height: 44px;
  --nf-component-button-radius: 8px;
  --nf-component-button-padding-inline: 1rem;
  --nf-component-button-gap: 0.5rem;
  --nf-component-field-background: #1D2939;
  --nf-component-field-foreground: #F9FAFB;
  --nf-component-field-placeholder: #98A2B3;
  --nf-component-field-border: #8290A8;
  --nf-component-field-error-border: #FDA29B;
  --nf-component-field-height: 44px;
  --nf-component-field-radius: 8px;
  --nf-component-field-padding-inline: 0.75rem;
  --nf-component-card-background: #1D2939;
  --nf-component-card-border: #344054;
  --nf-component-card-radius: 12px;
  --nf-component-card-padding: 1.5rem;
  --nf-component-table-header-background: #1D2939;
  --nf-component-table-row-background: #1D2939;
  --nf-component-table-row-hover: #243247;
  --nf-component-table-row-height: 48px;
  --nf-component-nav-selected-background: #0A1B38;
  --nf-component-nav-selected-foreground: #B2CCFF;
  --nf-component-badge-warning-background: #35260D;
  --nf-component-badge-warning-foreground: #FEDF89;
  --nf-component-focus-color: #84ADFF;
  --nf-component-focus-width: 3px;
  --nf-component-focus-offset: 2px;
  --nf-component-panel-radius: 16px;
  --nf-component-icon-size: 20px;
  --nf-component-transition-duration: 120ms;
  --nf-component-transition-easing: cubic-bezier(0.2, 0, 0, 1);
  --nf-component-overlay-shadow: 0px 8px 32px 0px rgba(16, 24, 40, 0.18);
}

[data-nexo-product="nexocrm"][data-nexo-mode="light"] {
  --nf-semantic-surface-canvas: #F7F9FC;
  --nf-semantic-surface-base: #FFFFFF;
  --nf-semantic-surface-raised: #FFFFFF;
  --nf-semantic-surface-subtle: #F2F4F7;
  --nf-semantic-surface-hover: #F2F4F7;
  --nf-semantic-text-primary: #101828;
  --nf-semantic-text-secondary: #475467;
  --nf-semantic-text-muted: #667085;
  --nf-semantic-text-link: #1849A9;
  --nf-semantic-border-subtle: #D0D5DD;
  --nf-semantic-border-control: #667085;
  --nf-semantic-action-disabled-background: #EAECF0;
  --nf-semantic-action-disabled-foreground: #475467;
  --nf-semantic-action-primary-background: #FF806B;
  --nf-semantic-action-primary-foreground: #101828;
  --nf-semantic-action-primary-hover: #F9705A;
  --nf-semantic-action-primary-pressed: #ED634E;
  --nf-semantic-action-primary-border: #A13222;
  --nf-semantic-action-selected-background: #FFF1ED;
  --nf-semantic-action-selected-foreground: #A13222;
  --nf-semantic-focus-ring: #175CD3;
  --nf-semantic-brand-accent: #FF806B;
  --nf-semantic-brand-on-accent: #101828;
  --nf-semantic-status-success-background: #ECFDF3;
  --nf-semantic-status-success-foreground: #05603A;
  --nf-semantic-status-success-border: #067647;
  --nf-semantic-status-success-icon: #067647;
  --nf-semantic-status-warning-background: #FFFAEB;
  --nf-semantic-status-warning-foreground: #93370D;
  --nf-semantic-status-warning-border: #B54708;
  --nf-semantic-status-warning-icon: #B54708;
  --nf-semantic-status-danger-background: #FEF3F2;
  --nf-semantic-status-danger-foreground: #912018;
  --nf-semantic-status-danger-border: #B42318;
  --nf-semantic-status-danger-icon: #B42318;
  --nf-semantic-status-information-background: #EFF8FF;
  --nf-semantic-status-information-foreground: #1849A9;
  --nf-semantic-status-information-border: #175CD3;
  --nf-semantic-status-information-icon: #175CD3;
  --nf-semantic-status-neutral-background: #F2F4F7;
  --nf-semantic-status-neutral-foreground: #344054;
  --nf-semantic-status-neutral-border: #667085;
  --nf-semantic-status-neutral-icon: #667085;
  --nf-component-button-primary-background: #FF806B;
  --nf-component-button-primary-foreground: #101828;
  --nf-component-button-primary-hover: #F9705A;
  --nf-component-button-primary-pressed: #ED634E;
  --nf-component-button-primary-border: #A13222;
  --nf-component-button-secondary-background: #FFFFFF;
  --nf-component-button-secondary-foreground: #101828;
  --nf-component-button-secondary-border: #667085;
  --nf-component-button-disabled-background: #EAECF0;
  --nf-component-button-disabled-foreground: #475467;
  --nf-component-button-height: 44px;
  --nf-component-button-radius: 8px;
  --nf-component-button-padding-inline: 1rem;
  --nf-component-button-gap: 0.5rem;
  --nf-component-field-background: #FFFFFF;
  --nf-component-field-foreground: #101828;
  --nf-component-field-placeholder: #667085;
  --nf-component-field-border: #667085;
  --nf-component-field-error-border: #B42318;
  --nf-component-field-height: 44px;
  --nf-component-field-radius: 8px;
  --nf-component-field-padding-inline: 0.75rem;
  --nf-component-card-background: #FFFFFF;
  --nf-component-card-border: #D0D5DD;
  --nf-component-card-radius: 12px;
  --nf-component-card-padding: 1.5rem;
  --nf-component-table-header-background: #F2F4F7;
  --nf-component-table-row-background: #FFFFFF;
  --nf-component-table-row-hover: #F2F4F7;
  --nf-component-table-row-height: 48px;
  --nf-component-nav-selected-background: #FFF1ED;
  --nf-component-nav-selected-foreground: #A13222;
  --nf-component-badge-warning-background: #FFFAEB;
  --nf-component-badge-warning-foreground: #93370D;
  --nf-component-focus-color: #175CD3;
  --nf-component-focus-width: 3px;
  --nf-component-focus-offset: 2px;
  --nf-component-panel-radius: 16px;
  --nf-component-icon-size: 20px;
  --nf-component-transition-duration: 120ms;
  --nf-component-transition-easing: cubic-bezier(0.2, 0, 0, 1);
  --nf-component-overlay-shadow: 0px 8px 32px 0px rgba(16, 24, 40, 0.18);
}

[data-nexo-product="nexocrm"][data-nexo-mode="dark"] {
  --nf-semantic-surface-canvas: #0B1220;
  --nf-semantic-surface-base: #101828;
  --nf-semantic-surface-raised: #1D2939;
  --nf-semantic-surface-subtle: #1D2939;
  --nf-semantic-surface-hover: #243247;
  --nf-semantic-text-primary: #F9FAFB;
  --nf-semantic-text-secondary: #D0D5DD;
  --nf-semantic-text-muted: #98A2B3;
  --nf-semantic-text-link: #B2CCFF;
  --nf-semantic-border-subtle: #344054;
  --nf-semantic-border-control: #8290A8;
  --nf-semantic-action-disabled-background: #1D2939;
  --nf-semantic-action-disabled-foreground: #98A2B3;
  --nf-semantic-action-primary-background: #FFA18B;
  --nf-semantic-action-primary-foreground: #101828;
  --nf-semantic-action-primary-hover: #FFC2B2;
  --nf-semantic-action-primary-pressed: #FFE1D8;
  --nf-semantic-action-primary-border: #FFA18B;
  --nf-semantic-action-selected-background: #381713;
  --nf-semantic-action-selected-foreground: #FFC2B2;
  --nf-semantic-focus-ring: #84ADFF;
  --nf-semantic-brand-accent: #FFA18B;
  --nf-semantic-brand-on-accent: #101828;
  --nf-semantic-status-success-background: #073321;
  --nf-semantic-status-success-foreground: #75E0A7;
  --nf-semantic-status-success-border: #47CD89;
  --nf-semantic-status-success-icon: #47CD89;
  --nf-semantic-status-warning-background: #35260D;
  --nf-semantic-status-warning-foreground: #FEDF89;
  --nf-semantic-status-warning-border: #FEC84B;
  --nf-semantic-status-warning-icon: #FEC84B;
  --nf-semantic-status-danger-background: #3A1513;
  --nf-semantic-status-danger-foreground: #FECDCA;
  --nf-semantic-status-danger-border: #FDA29B;
  --nf-semantic-status-danger-icon: #FDA29B;
  --nf-semantic-status-information-background: #102A56;
  --nf-semantic-status-information-foreground: #B2CCFF;
  --nf-semantic-status-information-border: #84ADFF;
  --nf-semantic-status-information-icon: #84ADFF;
  --nf-semantic-status-neutral-background: #1D2939;
  --nf-semantic-status-neutral-foreground: #D0D5DD;
  --nf-semantic-status-neutral-border: #8290A8;
  --nf-semantic-status-neutral-icon: #8290A8;
  --nf-component-button-primary-background: #FFA18B;
  --nf-component-button-primary-foreground: #101828;
  --nf-component-button-primary-hover: #FFC2B2;
  --nf-component-button-primary-pressed: #FFE1D8;
  --nf-component-button-primary-border: #FFA18B;
  --nf-component-button-secondary-background: #1D2939;
  --nf-component-button-secondary-foreground: #F9FAFB;
  --nf-component-button-secondary-border: #8290A8;
  --nf-component-button-disabled-background: #1D2939;
  --nf-component-button-disabled-foreground: #98A2B3;
  --nf-component-button-height: 44px;
  --nf-component-button-radius: 8px;
  --nf-component-button-padding-inline: 1rem;
  --nf-component-button-gap: 0.5rem;
  --nf-component-field-background: #1D2939;
  --nf-component-field-foreground: #F9FAFB;
  --nf-component-field-placeholder: #98A2B3;
  --nf-component-field-border: #8290A8;
  --nf-component-field-error-border: #FDA29B;
  --nf-component-field-height: 44px;
  --nf-component-field-radius: 8px;
  --nf-component-field-padding-inline: 0.75rem;
  --nf-component-card-background: #1D2939;
  --nf-component-card-border: #344054;
  --nf-component-card-radius: 12px;
  --nf-component-card-padding: 1.5rem;
  --nf-component-table-header-background: #1D2939;
  --nf-component-table-row-background: #1D2939;
  --nf-component-table-row-hover: #243247;
  --nf-component-table-row-height: 48px;
  --nf-component-nav-selected-background: #381713;
  --nf-component-nav-selected-foreground: #FFC2B2;
  --nf-component-badge-warning-background: #35260D;
  --nf-component-badge-warning-foreground: #FEDF89;
  --nf-component-focus-color: #84ADFF;
  --nf-component-focus-width: 3px;
  --nf-component-focus-offset: 2px;
  --nf-component-panel-radius: 16px;
  --nf-component-icon-size: 20px;
  --nf-component-transition-duration: 120ms;
  --nf-component-transition-easing: cubic-bezier(0.2, 0, 0, 1);
  --nf-component-overlay-shadow: 0px 8px 32px 0px rgba(16, 24, 40, 0.18);
}

:root[data-nexo-density="compact"], [data-nexo-product][data-nexo-mode][data-nexo-density="compact"] {
  --nf-component-button-height: 36px;
  --nf-component-field-height: 36px;
  --nf-component-table-row-height: 40px;
}

/* Comfortable controls remain the default. Use comfortable density for coarse pointers. */
@media (pointer: coarse) {
  :root, :root[data-nexo-density], [data-nexo-product][data-nexo-mode], [data-nexo-product][data-nexo-mode][data-nexo-density] {
    --nf-component-button-height: 44px;
    --nf-component-field-height: 44px;
    --nf-component-table-row-height: 48px;
  }
}

@media (prefers-reduced-motion: reduce) {
  :root, [data-nexo-product][data-nexo-mode] {
    --nf-foundation-motion-duration-instant: 0ms;
    --nf-foundation-motion-duration-fast: 0ms;
    --nf-foundation-motion-duration-standard: 0ms;
    --nf-foundation-motion-duration-deliberate: 0ms;
    --nf-component-transition-duration: 0ms;
  }
}