@engie-group/fluid-design-system-angular

@import url("https://fonts.googleapis.com/css?family=Material+Icons|Material+Icons+Outlined|Material+Icons+Round|Material+Icons+Sharp|Lato:300,400,700,900|Roboto+Mono:300,400,700,900&display=swap"); /** * Construct a name (string) based on color keywords string list * @param {List} $list - List of color keywords * @return {String} - Constructed name */ /** * Get a value (string) based on color keywords string list * @param {List} $list - List of color keywords * @return {String} - Value */ /** * Merge a result map with a new name and value * @param {Map} $result - Result map * @param {List} $name - List of color keywords * @return {Map} - Merged map */ /** * Walk through a color keywords tree and create a map of names and values for each color * @param {Map} $input - Color keywords tree * @param {List} $current-name - Current name * @param {Map} $result - Result map * @param {Number} $limit - Limit the walk depth * @return {Map} - Result map */ html { font-family: var(--nj-semantic-font-family-default), sans-serif; } body { font-family: var(--nj-semantic-font-family-default), sans-serif; font-size: var(--nj-semantic-font-size-text-md-desktop); font-weight: var(--nj-semantic-font-weight-regular); color: var(--nj-semantic-color-text-neutral-primary-default); } @font-face { font-family: "Engie Icons"; font-style: normal; font-weight: 400; src: url("data:application/vnd.ms-fontobject;base64,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") format("embedded-opentype"), url("data:font/ttf;base64,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") format("truetype"), url("data:font/woff;base64,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") format("woff"), url("data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 standalone%3D%22no%22%3F%3E%3C!DOCTYPE svg PUBLIC %22-%2F%2FW3C%2F%2FDTD SVG 1.1%2F%2FEN%22 %22http%3A%2F%2Fwww.w3.org%2FGraphics%2FSVG%2F1.1%2FDTD%2Fsvg11.dtd%22 %3E%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cmetadata%3EGenerated by IcoMoon%3C%2Fmetadata%3E%3Cdefs%3E%3Cfont id%3D%22nj-custom-icon%22 horiz-adv-x%3D%221024%22%3E%3Cfont-face units-per-em%3D%221024%22 ascent%3D%22960%22 descent%3D%22-64%22 %2F%3E%3Cmissing-glyph horiz-adv-x%3D%221024%22 %2F%3E%3Cglyph unicode%3D%22%26%23x20%3B%22 horiz-adv-x%3D%22512%22 d%3D%22%22 %2F%3E%3Cglyph unicode%3D%22%26%23xe00e%3B%22 glyph-name%3D%22ai%22 d%3D%22M106.58 418.432l155.691-52.523c79.157-27.307 140.35-88.513 167.073-165.802l0.565-1.878 52.523-155.648c9.6-28.331 49.536-28.331 59.136 0l52.523 155.691c27.307 79.157 88.513 140.35 165.802 167.073l1.878 0.565 155.648 52.523c28.331 9.6 28.331 49.536 0 59.136l-155.691 52.523c-79.157 27.307-140.35 88.513-167.073 165.802l-0.565 1.878-52.523 155.648c-9.6 28.331-49.536 28.331-59.136 0l-52.523-155.691c-27.307-79.157-88.513-140.35-165.802-167.073l-1.878-0.565-155.648-52.523c-28.331-9.6-28.331-49.536 0-59.136z%22 %2F%3E%3Cglyph unicode%3D%22%26%23xe00f%3B%22 glyph-name%3D%22engie_ai_filled%22 d%3D%22M511.688 874.875c235.455-0.006 426.565-191.105 426.565-426.563-0.006-235.455-191.11-426.559-426.565-426.565-235.459 0-426.559 191.104-426.563 426.565 0 235.461 191.101 426.563 426.563 426.563zM526.75 650.75c-4.811 14.124-24.761 14.132-29.563 0l-26.25-77.875c-13.369-39.459-44.353-70.522-83.812-83.812l-77.875-26.25c-14.132-4.802-14.124-24.752 0-29.563l77.875-26.25c39.451-13.366 70.517-44.365 83.812-83.813l26.25-77.875c4.797-14.15 24.765-14.15 29.563 0l26.25 77.875c13.37 39.449 44.364 70.522 83.813 83.813l77.875 26.25c14.15 4.797 14.15 24.766 0 29.563l-77.875 26.25c-39.448 13.374-70.525 44.362-83.813 83.812l-26.25 77.875z%22 %2F%3E%3Cglyph unicode%3D%22%EE%80%90%EE%80%90%22 glyph-name%3D%22engie_ai_filled%22 d%3D%22M511.688 874.875c235.455-0.006 426.565-191.105 426.565-426.563-0.006-235.455-191.11-426.559-426.565-426.565-235.459 0-426.559 191.104-426.563 426.565 0 235.461 191.101 426.563 426.563 426.563zM526.75 650.75c-4.811 14.124-24.761 14.132-29.563 0l-26.25-77.875c-13.369-39.459-44.353-70.522-83.812-83.812l-77.875-26.25c-14.132-4.802-14.124-24.752 0-29.563l77.875-26.25c39.451-13.366 70.517-44.365 83.812-83.813l26.25-77.875c4.797-14.15 24.765-14.15 29.563 0l26.25 77.875c13.37 39.449 44.364 70.522 83.813 83.813l77.875 26.25c14.15 4.797 14.15 24.766 0 29.563l-77.875 26.25c-39.448 13.374-70.525 44.362-83.813 83.812l-26.25 77.875z%22 %2F%3E%3Cglyph unicode%3D%22engie_ai_filled%22 glyph-name%3D%22engie_ai_filled%22 d%3D%22M511.688 874.875c235.455-0.006 426.565-191.105 426.565-426.563-0.006-235.455-191.11-426.559-426.565-426.565-235.459 0-426.559 191.104-426.563 426.565 0 235.461 191.101 426.563 426.563 426.563zM526.75 650.75c-4.811 14.124-24.761 14.132-29.563 0l-26.25-77.875c-13.369-39.459-44.353-70.522-83.812-83.812l-77.875-26.25c-14.132-4.802-14.124-24.752 0-29.563l77.875-26.25c39.451-13.366 70.517-44.365 83.812-83.813l26.25-77.875c4.797-14.15 24.765-14.15 29.563 0l26.25 77.875c13.37 39.449 44.364 70.522 83.813 83.813l77.875 26.25c14.15 4.797 14.15 24.766 0 29.563l-77.875 26.25c-39.448 13.374-70.525 44.362-83.813 83.812l-26.25 77.875z%22 %2F%3E%3Cglyph unicode%3D%22engie_ai%22 glyph-name%3D%22ai%22 d%3D%22M106.58 418.432l155.691-52.523c79.157-27.307 140.35-88.513 167.073-165.802l0.565-1.878 52.523-155.648c9.6-28.331 49.536-28.331 59.136 0l52.523 155.691c27.307 79.157 88.513 140.35 165.802 167.073l1.878 0.565 155.648 52.523c28.331 9.6 28.331 49.536 0 59.136l-155.691 52.523c-79.157 27.307-140.35 88.513-167.073 165.802l-0.565 1.878-52.523 155.648c-9.6 28.331-49.536 28.331-59.136 0l-52.523-155.691c-27.307-79.157-88.513-140.35-165.802-167.073l-1.878-0.565-155.648-52.523c-28.331-9.6-28.331-49.536 0-59.136z%22 %2F%3E%3C%2Ffont%3E%3C%2Fdefs%3E%3C%2Fsvg%3E") format("svg"); font-display: swap; } :root { --nj-semantic-font-size-display-xs: var(--nj-semantic-font-size-display-xs-mobile); --nj-semantic-line-height-display-xs: var(--nj-semantic-font-line-height-display-xs-mobile); --nj-semantic-font-size-display-sm: var(--nj-semantic-font-size-display-sm-mobile); --nj-semantic-line-height-display-sm: var(--nj-semantic-font-line-height-display-sm-mobile); --nj-semantic-font-size-display-md: var(--nj-semantic-font-size-display-md-mobile); --nj-semantic-line-height-display-md: var(--nj-semantic-font-line-height-display-md-mobile); --nj-semantic-font-size-display-xl: var(--nj-semantic-font-size-display-xl-mobile); --nj-semantic-line-height-display-xl: var(--nj-semantic-font-line-height-display-xl-mobile); --nj-semantic-font-size-display-2xl: var(--nj-semantic-font-size-display-2xl-mobile); --nj-semantic-line-height-display-2xl: var(--nj-semantic-font-line-height-display-2xl-mobile); --nj-semantic-font-size-heading-xs: var(--nj-semantic-font-size-heading-xs-mobile); --nj-semantic-line-height-heading-xs: var(--nj-semantic-font-line-height-heading-xs-mobile); --nj-semantic-font-size-heading-sm: var(--nj-semantic-font-size-heading-sm-mobile); --nj-semantic-line-height-heading-sm: var(--nj-semantic-font-line-height-heading-sm-mobile); --nj-semantic-font-size-heading-md: var(--nj-semantic-font-size-heading-md-mobile); --nj-semantic-line-height-heading-md: var(--nj-semantic-font-line-height-heading-md-mobile); --nj-semantic-font-size-heading-lg: var(--nj-semantic-font-size-heading-lg-mobile); --nj-semantic-line-height-heading-lg: var(--nj-semantic-font-line-height-heading-lg-mobile); --nj-semantic-font-size-heading-xl: var(--nj-semantic-font-size-heading-xl-mobile); --nj-semantic-line-height-heading-xl: var(--nj-semantic-font-line-height-heading-xl-mobile); --nj-semantic-font-size-text-xs: var(--nj-semantic-font-size-text-xs-mobile); --nj-semantic-line-height-text-xs: var(--nj-semantic-font-line-height-text-xs-mobile); --nj-semantic-font-size-text-sm: var(--nj-semantic-font-size-text-sm-mobile); --nj-semantic-line-height-text-sm: var(--nj-semantic-font-line-height-text-sm-mobile); --nj-semantic-font-size-text-md: var(--nj-semantic-font-size-text-md-mobile); --nj-semantic-line-height-text-md: var(--nj-semantic-font-line-height-text-md-mobile); --nj-semantic-font-size-text-lg: var(--nj-semantic-font-size-text-lg-mobile); --nj-semantic-line-height-text-lg: var(--nj-semantic-font-line-height-text-lg-mobile); } @media (min-width: 768px) { :root { --nj-semantic-font-size-display-xs: var(--nj-semantic-font-size-display-xs-desktop); --nj-semantic-line-height-display-xs: var(--nj-semantic-font-line-height-display-xs-desktop); --nj-semantic-font-size-display-sm: var(--nj-semantic-font-size-display-sm-desktop); --nj-semantic-line-height-display-sm: var(--nj-semantic-font-line-height-display-sm-desktop); --nj-semantic-font-size-display-md: var(--nj-semantic-font-size-display-md-desktop); --nj-semantic-line-height-display-md: var(--nj-semantic-font-line-height-display-md-desktop); --nj-semantic-font-size-display-xl: var(--nj-semantic-font-size-display-xl-desktop); --nj-semantic-line-height-display-xl: var(--nj-semantic-font-line-height-display-xl-desktop); --nj-semantic-font-size-display-2xl: var(--nj-semantic-font-size-display-2xl-desktop); --nj-semantic-line-height-display-2xl: var(--nj-semantic-font-line-height-display-2xl-desktop); --nj-semantic-font-size-heading-xs: var(--nj-semantic-font-size-heading-xs-desktop); --nj-semantic-line-height-heading-xs: var(--nj-semantic-font-line-height-heading-xs-desktop); --nj-semantic-font-size-heading-sm: var(--nj-semantic-font-size-heading-sm-desktop); --nj-semantic-line-height-heading-sm: var(--nj-semantic-font-line-height-heading-sm-desktop); --nj-semantic-font-size-heading-md: var(--nj-semantic-font-size-heading-md-desktop); --nj-semantic-line-height-heading-md: var(--nj-semantic-font-line-height-heading-md-desktop); --nj-semantic-font-size-heading-lg: var(--nj-semantic-font-size-heading-lg-desktop); --nj-semantic-line-height-heading-lg: var(--nj-semantic-font-line-height-heading-lg-desktop); --nj-semantic-font-size-heading-xl: var(--nj-semantic-font-size-heading-xl-desktop); --nj-semantic-line-height-heading-xl: var(--nj-semantic-font-line-height-heading-xl-desktop); --nj-semantic-font-size-text-xs: var(--nj-semantic-font-size-text-xs-desktop); --nj-semantic-line-height-text-xs: var(--nj-semantic-font-line-height-text-xs-desktop); --nj-semantic-font-size-text-sm: var(--nj-semantic-font-size-text-sm-desktop); --nj-semantic-line-height-text-sm: var(--nj-semantic-font-line-height-text-sm-desktop); --nj-semantic-font-size-text-md: var(--nj-semantic-font-size-text-md-desktop); --nj-semantic-line-height-text-md: var(--nj-semantic-font-line-height-text-md-desktop); --nj-semantic-font-size-text-lg: var(--nj-semantic-font-size-text-lg-desktop); --nj-semantic-line-height-text-lg: var(--nj-semantic-font-line-height-text-lg-desktop); } } @keyframes spin { from { transform: rotate(45deg); } to { transform: rotate(765deg); } } .nj-spinner { box-sizing: border-box; } .nj-spinner *, .nj-spinner *::before, .nj-spinner *::after { box-sizing: border-box; } .nj-spinner { font-family: var(--nj-semantic-font-family-default), sans-serif; line-height: var(--nj-semantic-font-line-height-default); position: relative; display: inline-flex; border-top: var(--nj-spinner-border-width) solid var(--nj-spinner-bg); border-right: var(--nj-spinner-border-width) solid var(--nj-spinner-thumb-bg); border-bottom: var(--nj-spinner-border-width) solid var(--nj-spinner-bg); border-left: var(--nj-spinner-border-width) solid var(--nj-spinner-bg); border-radius: 100%; animation: spin 2s cubic-bezier(0.45, 0.15, 0.57, 0.92) infinite; } .nj-spinner::after { width: 10em; height: 10em; border-radius: 50%; } .nj-spinner.nj-spinner--normal, .nj-btn.nj-btn--subtle .nj-spinner, .nj-btn.nj-btn--minimal .nj-spinner, .nj-accordion .nj-accordion__action .nj-spinner, .nj-spinner { --nj-spinner-bg: var(--nj-semantic-color-background-neutral-tertiary-translucent-default); --nj-spinner-thumb-bg: var(--nj-semantic-color-background-brand-solid-default); } .nj-spinner.nj-spinner--inverse, .nj-btn .nj-spinner, .nj-btn.nj-btn--destructive .nj-spinner, .nj-btn.nj-btn--inverse.nj-btn--subtle .nj-spinner, .nj-btn.nj-btn--inverse.nj-btn--minimal .nj-spinner, .nj-btn.nj-btn--ai .nj-spinner, .nj-modal-confirmation.nj-modal-confirmation--danger .nj-modal-confirmation__confirm-action .nj-btn .nj-spinner, .nj-accordion .nj-accordion__action .nj-spinner, .nj-accordion .nj-btn--inverse.nj-btn--subtle.nj-accordion__action .nj-spinner { --nj-spinner-bg: var(--nj-core-color-white-alpha-300); --nj-spinner-thumb-bg: var(--nj-semantic-color-background-neutral-primary-default); } .nj-spinner.nj-spinner--grey, .nj-btn.nj-btn--secondary .nj-spinner, .nj-btn.nj-btn--destructive.nj-btn--subtle .nj-spinner, .nj-btn.nj-btn--destructive.nj-btn--minimal .nj-spinner, .nj-btn.nj-btn--inverse .nj-spinner, .nj-modal-confirmation.nj-modal-confirmation--danger .nj-modal-confirmation__confirm-action .nj-btn.nj-btn--subtle .nj-spinner, .nj-accordion .nj-btn--destructive.nj-accordion__action .nj-spinner, .nj-modal-confirmation.nj-modal-confirmation--danger .nj-modal-confirmation__confirm-action .nj-accordion .nj-btn.nj-accordion__action .nj-spinner, .nj-accordion .nj-modal-confirmation.nj-modal-confirmation--danger .nj-modal-confirmation__confirm-action .nj-btn.nj-accordion__action .nj-spinner, .nj-modal-confirmation.nj-modal-confirmation--danger .nj-accordion .nj-modal-confirmation__confirm-action .nj-accordion__action.nj-btn .nj-spinner, .nj-modal-confirmation.nj-modal-confirmation--danger .nj-modal-confirmation__confirm-action .nj-btn.nj-btn--minimal .nj-spinner, .nj-accordion .nj-btn--secondary.nj-accordion__action .nj-spinner, .nj-accordion .nj-btn--inverse.nj-accordion__action .nj-spinner { --nj-spinner-bg: var(--nj-semantic-color-background-neutral-tertiary-translucent-default); --nj-spinner-thumb-bg: var(--nj-semantic-color-background-neutral-solid-default); } .nj-spinner.nj-spinner--ai, .nj-btn.nj-btn--ai.nj-btn--subtle .nj-spinner, .nj-btn.nj-btn--ai.nj-btn--minimal .nj-spinner, .nj-accordion .nj-btn--ai.nj-accordion__action .nj-spinner { --nj-spinner-bg: var(--nj-semantic-color-background-neutral-tertiary-translucent-default); --nj-spinner-thumb-bg: var(--nj-semantic-color-background-status-discovery-solid-default); } .nj-spinner.nj-spinner--2xs, .nj-btn.nj-btn--sm .nj-spinner, .nj-btn.nj-btn--xs .nj-spinner, .nj-accordion .nj-btn--sm.nj-accordion__action .nj-spinner, .nj-search--sm .nj-btn.nj-search__button .nj-spinner, .nj-accordion .nj-btn--xs.nj-accordion__action .nj-spinner { --nj-spinner-border-width: 2px; width: 16px; height: 16px; } .nj-spinner.nj-spinner--xs, .nj-btn .nj-spinner, .nj-btn.nj-btn--lg .nj-spinner, .nj-btn.nj-btn--xl .nj-spinner, .nj-search--lg .nj-btn.nj-search__button .nj-spinner, .nj-search--xl .nj-btn.nj-search__button .nj-spinner, .nj-accordion .nj-accordion__action .nj-spinner { --nj-spinner-border-width: 3px; width: 24px; height: 24px; } .nj-spinner.nj-spinner--sm { --nj-spinner-border-width: 3px; width: 32px; height: 32px; } .nj-spinner.nj-spinner--md { --nj-spinner-border-width: 5px; width: 48px; height: 48px; } .nj-spinner.nj-spinner--lg, .nj-spinner { --nj-spinner-border-width: 6px; width: 64px; height: 64px; } :root, [data-theme] { --nj-material-icon-color: var(--nj-semantic-color-icon-neutral-primary-default); --nj-material-icon-size: var(--nj-semantic-size-icon-md); } .nj-icon-material { box-sizing: border-box; } .nj-icon-material *, .nj-icon-material *::before, .nj-icon-material *::after { box-sizing: border-box; } .nj-icon-material { display: inline-block; font-family: "Material Icons", sans-serif; font-style: normal; font-weight: 400; font-feature-settings: "liga"; line-height: 1; text-transform: none; letter-spacing: normal; overflow-wrap: normal; white-space: nowrap; direction: ltr; -webkit-font-smoothing: antialiased; position: relative; font-size: var(--nj-material-icon-size); color: var(--nj-material-icon-color); background: var(--nj-material-icon-background); background-clip: var(--nj-material-icon-background-clip); } .nj-icon-material.nj-icon-material--primary { --nj-material-icon-color: var(--nj-semantic-color-icon-neutral-primary-default); } .nj-icon-material.nj-icon-material--secondary { --nj-material-icon-color: var(--nj-semantic-color-icon-neutral-secondary-default); } .nj-icon-material.nj-icon-material--tertiary { --nj-material-icon-color: var(--nj-semantic-color-icon-neutral-tertiary-default); } .nj-icon-material.nj-icon-material--contrast { --nj-material-icon-color: var(--nj-semantic-color-icon-neutral-contrast-default); } .nj-icon-material.nj-icon-material--inverse { --nj-material-icon-color: var(--nj-semantic-color-icon-neutral-inverse-default); } .nj-icon-material.nj-icon-material--brand { --nj-material-icon-color: var(--nj-semantic-color-icon-brand-primary-default); } .nj-icon-material.nj-icon-material--brand-contrast { --nj-material-icon-color: var(--nj-semantic-color-icon-brand-contrast-default); } .nj-icon-material.nj-icon-material--danger { --nj-material-icon-color: var(--nj-semantic-color-icon-status-danger-primary-default); } .nj-icon-material.nj-icon-material--danger-contrast { --nj-material-icon-color: var(--nj-semantic-color-icon-status-danger-contrast-default); } .nj-icon-material.nj-icon-material--success { --nj-material-icon-color: var(--nj-semantic-color-icon-status-success-primary-default); } .nj-icon-material.nj-icon-material--success-contrast { --nj-material-icon-color: var(--nj-semantic-color-icon-status-success-contrast-default); } .nj-icon-material.nj-icon-material--warning { --nj-material-icon-color: var(--nj-semantic-color-icon-status-warning-primary-default); } .nj-icon-material.nj-icon-material--warning-contrast { --nj-material-icon-color: var(--nj-semantic-color-icon-status-warning-contrast-default); } .nj-icon-material.nj-icon-material--information { --nj-material-icon-color: var(--nj-semantic-color-icon-status-information-primary-default); } .nj-icon-material.nj-icon-material--information-contrast { --nj-material-icon-color: var(--nj-semantic-color-icon-status-information-contrast-default); } .nj-icon-material.nj-icon-material--discovery { --nj-material-icon-color: var(--nj-semantic-color-icon-status-discovery-primary-default); } .nj-icon-material.nj-icon-material--discovery-contrast { --nj-material-icon-color: var(--nj-semantic-color-icon-status-discovery-contrast-default); } .nj-icon-material.nj-icon-material--planet { --nj-material-icon-color: var(--nj-semantic-color-icon-status-planet-primary-default); } .nj-icon-material.nj-icon-material--planet-contrast { --nj-material-icon-color: var(--nj-semantic-color-icon-status-planet-contrast-default); } .nj-icon-material.nj-icon-material--signature { --nj-material-icon-color: var(--nj-semantic-color-icon-additional-signature-default); } .nj-icon-material.nj-icon-material--blue { --nj-material-icon-color: var(--nj-semantic-color-icon-accent-blue-primary-default); } .nj-icon-material.nj-icon-material--grey { --nj-material-icon-color: var(--nj-semantic-color-icon-accent-grey-primary-default); } .nj-icon-material.nj-icon-material--red { --nj-material-icon-color: var(--nj-semantic-color-icon-accent-red-primary-default); } .nj-icon-material.nj-icon-material--green { --nj-material-icon-color: var(--nj-semantic-color-icon-accent-green-primary-default); } .nj-icon-material.nj-icon-material--orange { --nj-material-icon-color: var(--nj-semantic-color-icon-accent-orange-primary-default); } .nj-icon-material.nj-icon-material--purple { --nj-material-icon-color: var(--nj-semantic-color-icon-accent-purple-primary-default); } .nj-icon-material.nj-icon-material--teal { --nj-material-icon-color: var(--nj-semantic-color-icon-accent-teal-primary-default); } .nj-icon-material.nj-icon-material--ultramarine { --nj-material-icon-color: var(--nj-semantic-color-icon-accent-ultramarine-primary-default); } .nj-icon-material.nj-icon-material--yellow { --nj-material-icon-color: var(--nj-semantic-color-icon-accent-yellow-primary-default); } .nj-icon-material.nj-icon-material--yellow-tertiary { --nj-material-icon-color: var(--nj-semantic-color-icon-accent-yellow-tertiary-default); } .nj-icon-material.nj-icon-material--pink { --nj-material-icon-color: var(--nj-semantic-color-icon-accent-pink-primary-default); } .nj-icon-material.nj-icon-material--lime { --nj-material-icon-color: var(--nj-semantic-color-icon-accent-lime-primary-default); } .nj-icon-material.nj-icon-material--ai, .nj-btn.nj-btn--ai.nj-btn--subtle .nj-icon-material, .nj-btn.nj-btn--ai.nj-btn--minimal .nj-icon-material, .nj-accordion .nj-btn--ai.nj-accordion__action .nj-icon-material { --nj-material-icon-color: transparent; --nj-material-icon-background: var(--nj-semantic-color-background-additional-ai-default); --nj-material-icon-background-clip: text; } .nj-icon-material.nj-icon-material--color-inherit { --nj-material-icon-color: initial; } .nj-icon-material.nj-icon-material--2xs { --nj-material-icon-size: var(--nj-semantic-size-icon-2xs); } .nj-icon-material.nj-icon-material--xs { --nj-material-icon-size: var(--nj-semantic-size-icon-xs); } .nj-icon-material.nj-icon-material--sm { --nj-material-icon-size: var(--nj-semantic-size-icon-sm); } .nj-icon-material.nj-icon-material--md { --nj-material-icon-size: var(--nj-semantic-size-icon-md); } .nj-icon-material.nj-icon-material--lg { --nj-material-icon-size: var(--nj-semantic-size-icon-lg); } .nj-icon-material.nj-icon-material--xl { --nj-material-icon-size: var(--nj-semantic-size-icon-xl); } .nj-icon-material.nj-icon-material--2xl { --nj-material-icon-size: var(--nj-semantic-size-icon-2xl); } .nj-icon-material.nj-icon-material--3xl { --nj-material-icon-size: var(--nj-semantic-size-icon-3xl); } .nj-icon-material.nj-icon-material--4xl { --nj-material-icon-size: var(--nj-semantic-size-icon-4xl); } .nj-icon-material.nj-icon-material--5xl { --nj-material-icon-size: var(--nj-semantic-size-icon-5xl); } .nj-icon-material.nj-icon-material--6xl { --nj-material-icon-size: var(--nj-semantic-size-icon-6xl); } .nj-icon-material.nj-icon-material--size-inherit { --nj-material-icon-size: initial; } .nj-icon-material.nj-icon-material--engie { font-family: "Engie Icons"; font-feature-settings: "liga"; text-rendering: optimizelegibility; } .nj-icon-material.nj-icon-material--outlined { font-family: "Material Icons Outlined", sans-serif; } .nj-icon-material.nj-icon-material--rounded { font-family: "Material Icons Round", sans-serif; } .nj-icon-material.nj-icon-material--sharp { font-family: "Material Icons Sharp", sans-serif; } .nj-icon-material-text { display: flex; gap: var(--nj-semantic-size-spacing-8); align-items: center; } .nj-btn, .nj-accordion .nj-accordion__action { --nj-btn-current-bg-color: var(--nj-btn-bg-color); --nj-btn-current-color: var(--nj-btn-color); --nj-btn-bg-color: var(--nj-semantic-color-background-brand-solid-default); --nj-btn-color: var(--nj-semantic-color-text-neutral-inverse-default); --nj-btn-font-weight: var(--nj-semantic-font-weight-regular); --nj-btn-hovered-bg-color: var(--nj-semantic-color-background-brand-solid-hovered); --nj-btn-hovered-color: var(--nj-semantic-color-text-neutral-inverse-default); --nj-btn-focused-bg-color: var(--nj-semantic-color-background-brand-solid-focused); --nj-btn-focused-color: var(--nj-semantic-color-text-neutral-inverse-default); --nj-btn-pressed-bg-color: var(--nj-semantic-color-background-brand-solid-pressed); --nj-btn-pressed-color: var(--nj-semantic-color-text-neutral-inverse-default); --nj-btn-border-color: transparent; --nj-btn-focused-ring-color: var(--nj-semantic-color-border-brand-strong-default); --nj-btn-icon-size: var(--nj-semantic-size-icon-md); --nj-btn-icon-color: var(--nj-btn-current-color); --nj-btn-pad: var(--nj-semantic-size-spacing-8) var(--nj-semantic-size-spacing-32); box-sizing: border-box; } .nj-btn *, .nj-accordion .nj-accordion__action *, .nj-btn *::before, .nj-accordion .nj-accordion__action *::before, .nj-btn *::after, .nj-accordion .nj-accordion__action *::after { box-sizing: border-box; } .nj-btn, .nj-accordion .nj-accordion__action { font-family: var(--nj-semantic-font-family-default), sans-serif; position: relative; display: inline-flex; gap: var(--nj-semantic-size-spacing-8); align-items: center; justify-content: center; padding: var(--nj-btn-pad); font-size: var(--nj-semantic-font-size-text-sm-desktop); font-weight: var(--nj-btn-font-weight); line-height: var(--nj-btn-icon-size); vertical-align: middle; color: var(--nj-btn-current-color); text-align: center; letter-spacing: 0; white-space: nowrap; text-decoration: none; -webkit-user-select: none; user-select: none; outline: 0; background-color: var(--nj-btn-current-bg-color); background-image: var(--nj-btn-bg-image); background-origin: border-box; border: 1px solid var(--nj-btn-border-color); border-radius: var(--nj-semantic-size-border-radius-none); border-image-source: var(--nj-btn-border-image); border-image-slice: 1; fill: var(--nj-btn-current-color); transition: color 0.2s, border-color 0.2s, background-color 0.2s; transition-timing-function: var(--nj-semantic-motion-easing-fast-out-slow-in); } .nj-btn:not(:disabled):not(.nj-btn--disabled):not(.nj-btn:disabled):not(.nj-btn--is-loading), .nj-accordion .nj-accordion__action:not(:disabled):not(.nj-btn--disabled):not(.nj-btn:disabled):not(.nj-btn--is-loading) { cursor: pointer; } .nj-btn:not(:disabled):not(.nj-btn--disabled):not(.nj-btn:disabled):not(.nj-btn--is-loading):hover, .nj-accordion .nj-accordion__action:not(:disabled):not(.nj-btn--disabled):not(.nj-btn:disabled):not(.nj-btn--is-loading):hover { --nj-btn-bg-image: var(--nj-btn-hovered-bg-image); --nj-btn-current-bg-color: var(--nj-btn-hovered-bg-color); --nj-btn-current-color: var(--nj-btn-hovered-color); text-decoration: none; outline: 0; } .nj-btn:not(:disabled):not(.nj-btn--disabled):not(.nj-btn:disabled):not(.nj-btn--is-loading):active, .nj-accordion .nj-accordion__action:not(:disabled):not(.nj-btn--disabled):not(.nj-btn:disabled):not(.nj-btn--is-loading):active, .nj-btn:not(:disabled):not(.nj-btn--disabled):not(.nj-btn:disabled):not(.nj-btn--is-loading).active, .nj-accordion .nj-accordion__action:not(:disabled):not(.nj-btn--disabled):not(.nj-btn:disabled):not(.nj-btn--is-loading).active, .nj-btn:not(:disabled):not(.nj-btn--disabled):not(.nj-btn:disabled):not(.nj-btn--is-loading)[aria-expanded=true], .nj-accordion .nj-accordion__action:not(:disabled):not(.nj-btn--disabled):not(.nj-btn:disabled):not(.nj-btn--is-loading)[aria-expanded=true] { --nj-btn-bg-image: var(--nj-btn-pressed-bg-image); --nj-btn-current-bg-color: var(--nj-btn-pressed-bg-color); --nj-btn-current-color: var(--nj-btn-pressed-color); text-decoration: none; } .nj-btn::after, .nj-accordion .nj-accordion__action::after { position: absolute; top: 50%; left: 50%; z-index: 10; box-sizing: content-box !important; width: 100%; height: 100%; padding: var(--nj-semantic-size-border-focus-ring-offset); pointer-events: none; content: ""; border-radius: var(--nj-semantic-size-border-radius-none); box-shadow: 0 0 0 var(--nj-semantic-size-border-focus-ring-width) var(--nj-btn-focused-ring-color); opacity: 0; transform: translate(-50%, -50%) scale3d(0.85, 0.85, 1); transition: opacity 0.2s, transform 0.2s; transition-timing-function: var(--nj-semantic-motion-easing-fast-out-slow-in); } .nj-btn:focus-visible:not(:active), .nj-accordion .nj-accordion__action:focus-visible:not(:active) { --nj-btn-bg-image: var(--nj-btn-focused-bg-image); --nj-btn-current-bg-color: var(--nj-btn-focused-bg-color); --nj-btn-current-color: var(--nj-btn-focused-color); } .nj-btn:focus-visible:not(:active, .disabled)::after, .nj-accordion .nj-accordion__action:focus-visible:not(:active, .disabled)::after { opacity: 1; transform: translate(-50%, -50%) scale3d(1, 1, 1); } .nj-btn .nj-btn__icon, .nj-accordion .nj-accordion__action .nj-btn__icon { --nj-material-icon-color: var(--nj-btn-icon-color); --nj-material-icon-size: var(--nj-btn-icon-size); display: inline-flex; align-items: center; width: var(--nj-btn-icon-size); height: var(--nj-btn-icon-size); transition: color 0.2s var(--nj-semantic-motion-easing-fast-out-slow-in); } .nj-btn.nj-btn--disabled, .nj-accordion .nj-btn--disabled.nj-accordion__action, .nj-btn:disabled, .nj-accordion .nj-accordion__action:disabled, .nj-btn.nj-btn--is-loading, .nj-accordion .nj-btn--is-loading.nj-accordion__action { text-decoration: none; cursor: not-allowed; opacity: var(--nj-semantic-opacity-disabled); } .nj-btn.nj-btn--is-loading .nj-btn__icon, .nj-accordion .nj-btn--is-loading.nj-accordion__action .nj-btn__icon { display: none; } .nj-btn.nj-btn--lg, .nj-accordion .nj-btn--lg.nj-accordion__action, .nj-search--lg .nj-btn.nj-search__button { font-size: var(--nj-semantic-font-size-text-md-desktop); --nj-btn-icon-size: var(--nj-semantic-size-icon-md); --nj-btn-pad: var(--nj-semantic-size-spacing-12) var(--nj-semantic-size-spacing-48); } .nj-btn.nj-btn--xl, .nj-accordion .nj-btn--xl.nj-accordion__action, .nj-search--xl .nj-btn.nj-search__button { font-size: var(--nj-semantic-font-size-text-md-desktop); --nj-btn-icon-size: var(--nj-semantic-size-icon-md); --nj-btn-pad: var(--nj-semantic-size-spacing-16) var(--nj-semantic-size-spacing-48); } .nj-btn.nj-btn--sm, .nj-accordion .nj-btn--sm.nj-accordion__action, .nj-search--sm .nj-btn.nj-search__button { font-size: var(--nj-semantic-font-size-text-xs-desktop); --nj-btn-icon-size: var(--nj-semantic-size-icon-sm); --nj-btn-pad: var(--nj-semantic-size-spacing-8) var(--nj-semantic-size-spacing-24); } .nj-btn.nj-btn--xs, .nj-accordion .nj-btn--xs.nj-accordion__action { font-size: var(--nj-semantic-font-size-text-xs-desktop); --nj-btn-icon-size: var(--nj-semantic-size-icon-sm); --nj-btn-pad: var(--nj-semantic-size-spacing-4) var(--nj-semantic-size-spacing-16); } .nj-btn.nj-btn--subtle, .nj-accordion .nj-btn--subtle.nj-accordion__action, .nj-accordion .nj-accordion__action, .nj-btn.nj-btn--minimal, .nj-accordion .nj-btn--minimal.nj-accordion__action { --nj-btn-bg-color: var(--nj-semantic-color-background-brand-primary-translucent-default); --nj-btn-color: var(--nj-semantic-color-text-brand-primary-default); --nj-btn-hovered-bg-color: var(--nj-semantic-color-background-brand-primary-translucent-hovered); --nj-btn-hovered-color: var(--nj-semantic-color-text-brand-primary-hovered); --nj-btn-pressed-bg-color: var(--nj-semantic-color-background-brand-primary-translucent-pressed); --nj-btn-pressed-color: var(--nj-semantic-color-text-brand-primary-pressed); --nj-btn-focused-bg-color: var(--nj-semantic-color-background-brand-primary-translucent-focused); --nj-btn-focused-color: var(--nj-semantic-color-text-brand-primary-focused); } .nj-btn.nj-btn--subtle, .nj-accordion .nj-accordion__action { --nj-btn-border-color: var(--nj-semantic-color-border-brand-strong-default); } .nj-btn.nj-btn--minimal:not(.nj-btn--ai), .nj-accordion .nj-btn--minimal.nj-accordion__action:not(.nj-btn--ai) { border: none; } .nj-btn.nj-btn--secondary, .nj-accordion .nj-btn--secondary.nj-accordion__action { --nj-btn-bg-color: var(--nj-semantic-color-background-neutral-tertiary-translucent-default); --nj-btn-color: var(--nj-semantic-color-text-neutral-primary-default); --nj-btn-hovered-bg-color: var(--nj-semantic-color-background-neutral-tertiary-translucent-hovered); --nj-btn-hovered-color: var(--nj-semantic-color-text-neutral-primary-default); --nj-btn-pressed-bg-color: var(--nj-semantic-color-background-neutral-tertiary-translucent-pressed); --nj-btn-pressed-color: var(--nj-semantic-color-text-neutral-primary-default); --nj-btn-focused-bg-color: var(--nj-semantic-color-background-neutral-tertiary-translucent-focused); --nj-btn-focused-color: var(--nj-semantic-color-text-neutral-primary-default); } .nj-btn.nj-btn--secondary.nj-btn--subtle, .nj-accordion .nj-btn--secondary.nj-accordion__action, .nj-btn.nj-btn--secondary.nj-btn--minimal { --nj-btn-bg-color: var(--nj-semantic-color-background-neutral-primary-translucent-default); --nj-btn-color: var(--nj-semantic-color-text-neutral-primary-default); --nj-btn-hovered-bg-color: var(--nj-semantic-color-background-neutral-primary-translucent-hovered); --nj-btn-hovered-color: var(--nj-semantic-color-text-neutral-primary-default); --nj-btn-pressed-bg-color: var(--nj-semantic-color-background-neutral-primary-translucent-pressed); --nj-btn-pressed-color: var(--nj-semantic-color-text-neutral-primary-default); --nj-btn-focused-bg-color: var(--nj-semantic-color-background-neutral-primary-translucent-focused); --nj-btn-focused-color: var(--nj-semantic-color-text-neutral-primary-default); } .nj-btn.nj-btn--secondary.nj-btn--subtle, .nj-accordion .nj-btn--secondary.nj-accordion__action { --nj-btn-border-color: var(--nj-semantic-color-border-neutral-strong-default); } .nj-btn.nj-btn--secondary.nj-btn--minimal, .nj-accordion .nj-btn--secondary.nj-btn--minimal.nj-accordion__action { border: none; } .nj-btn.nj-btn--destructive, .nj-accordion .nj-btn--destructive.nj-accordion__action, .nj-modal-confirmation.nj-modal-confirmation--danger .nj-modal-confirmation__confirm-action .nj-btn { --nj-btn-bg-color: var(--nj-semantic-color-background-status-danger-solid-default); --nj-btn-color: var(--nj-semantic-color-text-neutral-inverse-default); --nj-btn-hovered-bg-color: var(--nj-semantic-color-background-status-danger-solid-hovered); --nj-btn-hovered-color: var(--nj-semantic-color-text-neutral-inverse-default); --nj-btn-pressed-bg-color: var(--nj-semantic-color-background-status-danger-solid-pressed); --nj-btn-pressed-color: var(--nj-semantic-color-text-neutral-inverse-default); --nj-btn-focused-bg-color: var(--nj-semantic-color-background-status-danger-solid-focused); --nj-btn-focused-color: var(--nj-semantic-color-text-neutral-inverse-default); } .nj-btn.nj-btn--destructive.nj-btn--subtle, .nj-accordion .nj-btn--destructive.nj-btn--subtle.nj-accordion__action, .nj-modal-confirmation.nj-modal-confirmation--danger .nj-modal-confirmation__confirm-action .nj-btn.nj-btn--subtle, .nj-accordion .nj-btn--destructive.nj-accordion__action, .nj-modal-confirmation.nj-modal-confirmation--danger .nj-modal-confirmation__confirm-action .nj-accordion .nj-btn.nj-accordion__action, .nj-accordion .nj-modal-confirmation.nj-modal-confirmation--danger .nj-modal-confirmation__confirm-action .nj-btn.nj-accordion__action, .nj-modal-confirmation.nj-modal-confirmation--danger .nj-accordion .nj-modal-confirmation__confirm-action .nj-accordion__action.nj-btn, .nj-btn.nj-btn--destructive.nj-btn--minimal, .nj-accordion .nj-btn--destructive.nj-btn--minimal.nj-accordion__action, .nj-modal-confirmation.nj-modal-confirmation--danger .nj-modal-confirmation__confirm-action .nj-btn.nj-btn--minimal { --nj-btn-bg-color: var(--nj-semantic-color-background-status-danger-primary-translucent-default); --nj-btn-color: var(--nj-semantic-color-text-status-danger-primary-default); --nj-btn-hovered-bg-color: var(--nj-semantic-color-background-status-danger-primary-translucent-hovered); --nj-btn-hovered-color: var(--nj-semantic-color-text-status-danger-primary-hovered); --nj-btn-pressed-bg-color: var(--nj-semantic-color-background-status-danger-primary-translucent-pressed); --nj-btn-pressed-color: var(--nj-semantic-color-text-status-danger-primary-pressed); --nj-btn-focused-bg-color: var(--nj-semantic-color-background-status-danger-primary-translucent-focused); --nj-btn-focused-color: var(--nj-semantic-color-text-status-danger-primary-focused); } .nj-btn.nj-btn--destructive.nj-btn--subtle, .nj-modal-confirmation.nj-modal-confirmation--danger .nj-modal-confirmation__confirm-action .nj-btn.nj-btn--subtle, .nj-accordion .nj-btn--destructive.nj-accordion__action, .nj-modal-confirmation.nj-modal-confirmation--danger .nj-modal-confirmation__confirm-action .nj-accordion .nj-btn.nj-accordion__action, .nj-accordion .nj-modal-confirmation.nj-modal-confirmation--danger .nj-modal-confirmation__confirm-action .nj-btn.nj-accordion__action, .nj-modal-confirmation.nj-modal-confirmation--danger .nj-accordion .nj-modal-confirmation__confirm-action .nj-accordion__action.nj-btn { --nj-btn-border-color: var(--nj-semantic-color-border-status-danger-strong-default); } .nj-btn.nj-btn--destructive.nj-btn--minimal, .nj-accordion .nj-btn--destructive.nj-btn--minimal.nj-accordion__action, .nj-modal-confirmation.nj-modal-confirmation--danger .nj-modal-confirmation__confirm-action .nj-btn.nj-btn--minimal { border: none; } .nj-btn.nj-btn--inverse, .nj-accordion .nj-btn--inverse.nj-accordion__action { --nj-btn-bg-color: var(--nj-semantic-color-background-neutral-inverse-default); --nj-btn-color: var(--nj-semantic-color-text-neutral-primary-default); --nj-btn-hovered-bg-color: var(--nj-semantic-color-background-neutral-inverse-hovered); --nj-btn-hovered-color: var(--nj-semantic-color-text-neutral-primary-default); --nj-btn-pressed-bg-color: var(--nj-semantic-color-background-neutral-inverse-pressed); --nj-btn-pressed-color: var(--nj-semantic-color-text-neutral-primary-default); --nj-btn-focused-bg-color: var(--nj-semantic-color-background-neutral-inverse-focused); --nj-btn-focused-color: var(--nj-semantic-color-text-neutral-primary-default); --nj-btn-focused-ring-color: var(--nj-semantic-color-border-neutral-inverse-default); } .nj-btn.nj-btn--inverse.nj-btn--subtle, .nj-accordion .nj-btn--inverse.nj-btn--subtle.nj-accordion__action, .nj-accordion .nj-btn--inverse.nj-accordion__action, .nj-btn.nj-btn--inverse.nj-btn--minimal, .nj-accordion .nj-btn--inverse.nj-btn--minimal.nj-accordion__action { --nj-btn-bg-color: var(--nj-core-color-reference-neutral-alpha-inverse-0); --nj-btn-color: var(--nj-semantic-color-text-neutral-inverse-default); --nj-btn-hovered-bg-color: var(--nj-core-color-reference-neutral-alpha-inverse-200); --nj-btn-hovered-color: var(--nj-semantic-color-text-neutral-inverse-default); --nj-btn-pressed-bg-color: var(--nj-core-color-reference-neutral-alpha-inverse-300); --nj-btn-pressed-color: var(--nj-semantic-color-text-neutral-inverse-default); --nj-btn-focused-bg-color: var(--nj-core-color-reference-neutral-alpha-inverse-200); --nj-btn-focused-color: var(--nj-semantic-color-text-neutral-inverse-default); } .nj-btn.nj-btn--inverse.nj-btn--subtle, .nj-accordion .nj-btn--inverse.nj-accordion__action { --nj-btn-border-color: var(--nj-semantic-color-border-neutral-inverse-default); } .nj-btn.nj-btn--ai, .nj-accordion .nj-btn--ai.nj-accordion__action { --nj-btn-bg-image: var(--nj-semantic-color-background-additional-ai-default); --nj-btn-bg-color: var(--nj-semantic-color-background-brand-solid-hovered); --nj-btn-color: var(--nj-semantic-color-text-neutral-inverse-default); --nj-btn-hovered-bg-color: var(--nj-semantic-color-background-brand-solid-hovered); --nj-btn-hovered-color: var(--nj-semantic-color-text-neutral-inverse-default); --nj-btn-pressed-bg-color: var(--nj-semantic-color-background-brand-solid-pressed); --nj-btn-pressed-color: var(--nj-semantic-color-text-neutral-inverse-default); --nj-btn-focused-bg-color: var(--nj-semantic-color-background-brand-solid-focused); --nj-btn-focused-color: var(--nj-semantic-color-text-neutral-inverse-default); --nj-btn-focused-ring-color: var(--nj-semantic-color-border-brand-strong-default); } .nj-btn.nj-btn--ai.nj-btn--subtle, .nj-accordion .nj-btn--ai.nj-btn--subtle.nj-accordion__action, .nj-accordion .nj-btn--ai.nj-accordion__action, .nj-btn.nj-btn--ai.nj-btn--minimal, .nj-accordion .nj-btn--ai.nj-btn--minimal.nj-accordion__action { --nj-btn-border-color: transparent; --nj-btn-bg-image: none; --nj-btn-bg-color: var(--nj-semantic-color-background-neutral-inverse-default); --nj-btn-color: var(--nj-semantic-color-text-brand-primary-default); --nj-btn-hovered-bg-color: var(--nj-semantic-color-background-neutral-primary-hovered); --nj-btn-hovered-color: var(--nj-semantic-color-text-brand-primary-hovered); --nj-btn-pressed-bg-color: var(--nj-semantic-color-background-neutral-primary-pressed); --nj-btn-pressed-color: var(--nj-semantic-color-text-brand-primary-pressed); --nj-btn-focused-bg-color: var(--nj-semantic-color-background-neutral-primary-hovered); --nj-btn-focused-color: var(--nj-semantic-color-text-brand-primary-hovered); --nj-btn-border-image: var(--nj-semantic-color-border-additional-ai-default); position: relative; transform-style: preserve-3d; } .nj-btn.nj-btn--ai.nj-btn--subtle::before, .nj-accordion .nj-btn--ai.nj-btn--subtle.nj-accordion__action::before, .nj-accordion .nj-btn--ai.nj-accordion__action::before, .nj-btn.nj-btn--ai.nj-btn--minimal::before, .nj-accordion .nj-btn--ai.nj-btn--minimal.nj-accordion__action::before { position: absolute; inset: 0; z-index: -1; content: ""; background-image: var(--nj-semantic-color-background-additional-ai-default); opacity: 0.15; filter: blur(16px); transform: translate3d(0, 0, -1px); } .nj-accordion { box-sizing: border-box; } .nj-accordion *, .nj-accordion *::before, .nj-accordion *::after { box-sizing: border-box; } .nj-accordion { font-family: var(--nj-semantic-font-family-default), sans-serif; line-height: var(--nj-semantic-font-line-height-default); --nj-accordion-item-shadow: none; display: flex; flex-direction: column; } .nj-accordion details.nj-accordion-item { background-color: var(--nj-semantic-color-background-neutral-primary-default); box-shadow: var(--nj-accordion-item-shadow); } .nj-accordion details.nj-accordion-item:not(:first-of-type) { --nj-accordion-item-shadow: inset 0 var(--nj-semantic-size-border-width) var(--nj-semantic-color-border-neutral-subtle-default); } .nj-accordion:is(.nj-accordion.nj-accordion--separated) detail