@charset "UTF-8";
/* ------------------------------------ *\
  $BREAKPOINTS
\* ------------------------------------ */
/* ------------------------------------*\
  #TYPOGRAPHY MIXINS
\*------------------------------------ */
/**
 * Headline
 */
/**
 * Title
 */
/**
 * Label
 */
/**
 * Body
 */
/**
 * Name
 */
/**
 * Button
 */
/* deprecated */
/* deprecated */
/* ------------------------------------*\
  #GENERAL MIXINS
\*------------------------------------ */
/**
 * Size function
 * 1. The size function multiplies a provided value ($number) by the base sizing unit (--size-base-unit)
 * 2. $number should be limited to integers (e.g. 3) or half integers (e.g. 1.5)
 */
/**
 * Visually hidden from display
 */
/**
 * Visible focus outline for elements
 */
/**
 * Label element
 */
/**
 * Input element
 * 1. Ensures that the padding and border are included in the element's total width and height.
 */
/**
 * RTL support for values logical properties can't automatically adjust for
 * 1. Percentage based horizontal translate values need to be flipped
 * 2. Percentage based horizontal translate values need to be flipped for full width in left position
 * 3. Percentage based horizontal translate values need to be flipped for full width in right position
 * 4. Rotations need to be flipped
 * 5. Directions need to be flipped
 * 6. Flips box shadow from right to left on rtl change
 */
[dir=rtl] {
  --rtlTranslateX: 50%; /* 1 */
  --rtlTranslateFullXStart: 100%; /* 2 */
  --rtlTranslateFullXEnd: -100%; /* 3 */
  --rtlRotate: 180deg; /* 4 */
  --rtlDirection: left; /* 5 */
  --rtlBoxShadowRight: var(--nef-drop-shadow-left); /* 6 */
  --rtlBoxShadowLeft: var(--nef-drop-shadow-right); /* 6 */
}

/**
 * LTR support for values logical properties can't automatically adjust for
 * 1. Percentage based horizontal translate values need to be flipped
 * 2. Percentage based horizontal translate values need to be flipped for full width in left position
 * 3. Percentage based horizontal translate values need to be flipped for full width in right position
 * 4. Rotations need to be flipped
 * 5. Directions need to be flipped
 * 6. Flips box shadow from right to left on rtl change
 */
[dir=ltr] {
  --rtlTranslateX: -50%; /* 1 */
  --rtlTranslateFullXStart: -100%; /* 2 */
  --rtlTranslateFullXEnd: 100%; /* 3 */
  --rtlRotate: 0deg; /* 4 */
  --rtlDirection: right; /* 5 */
  --rtlBoxShadowRight: var(--nef-drop-shadow-right); /* 6 */
  --rtlBoxShadowLeft: var(--nef-drop-shadow-left); /* 6 */
}

:host,
body .nef-c-default {
  color: var(--nef-semantic-color-content-default);
  background: var(--nef-semantic-color-background-default);
  font-family: var(--nef-semantic-typography-body-default-font-family);
  font-size: var(--nef-semantic-typography-body-default-font-size);
  font-weight: var(--nef-semantic-typography-body-default-font-weight);
  letter-spacing: var(--nef-semantic-typography-body-default-letter-spacing);
  line-height: var(--nef-semantic-typography-body-default-line-height);
  --nef-z-index-navigation: 1050;
  --nef-z-index-modal: 1060;
  --nef-z-index-drawer: 1060;
}

:host {
  background: transparent;
  display: contents;
}

:host * {
  scrollbar-color: var(--nef-semantic-color-background-subtle) var(--nef-semantic-color-background-default);
  scrollbar-width: thin;
  scrollbar-gutter: auto;
}
:host *:hover {
  scrollbar-color: var(--nef-semantic-color-content-xsubtle) var(--nef-semantic-color-background-default);
}
:host *::-webkit-scrollbar {
  height: 7px;
  width: 7px;
  border: 3px solid transparent;
  background: var(--nef-semantic-color-background-default);
  scrollbar-gutter: auto;
}
:host *::-webkit-scrollbar:hover::-webkit-scrollbar-thumb {
  background: var(--nef-semantic-color-content-xsubtle);
}
:host *::-webkit-scrollbar-corner {
  background: var(--nef-semantic-color-background-default);
}
:host *::-webkit-scrollbar-track {
  border-radius: 15px;
}
:host *::-webkit-scrollbar-track:hover::-webkit-scrollbar-thumb {
  background: var(--nef-semantic-color-content-xsubtle);
}
:host *::-webkit-scrollbar-thumb {
  border-radius: 15px;
  background: var(--nef-semantic-color-background-subtle);
}
:host *::-webkit-scrollbar-thumb:hover {
  background: var(--nef-semantic-color-content-xsubtle);
}

body .nef-c-default {
  display: flex;
}

:focus-visible {
  outline: var(--nef-semantic-border-width-md) solid var(--nef-semantic-color-border-focus);
  outline-offset: var(--nef-focus-outline-offset, var(--nef-semantic-border-width-md));
}

.nef-density-xcompact {
  --nef-density: "xcompact";
}

.nef-density-compact {
  --nef-density: "compact";
}

.nef-density-default {
  --nef-density: "default";
}

.nef-density-comfortable {
  --nef-density: "comfortable";
}

.nef-dir-rtl {
  --nef-dir: "rtl";
}

.nef-dir-ltr {
  --nef-dir: "ltr";
}

.nef-c-rich-text-editor__content[contenteditable=true] {
  display: flex;
  flex-direction: column;
  gap: var(--nef-size-8);
  color: var(--nef-semantic-color-content-default);
  font-family: var(--nef-semantic-typography-body-default-font-family);
  font-size: var(--nef-semantic-typography-body-default-font-size);
  font-weight: var(--nef-semantic-typography-body-default-font-weight);
  letter-spacing: var(--nef-semantic-typography-body-default-letter-spacing);
  line-height: var(--nef-semantic-typography-body-default-line-height);
}
.nef-c-rich-text-editor__content[contenteditable=true] > * {
  padding: 0;
  margin: 0;
}
.nef-c-rich-text-editor__content[contenteditable=true] h1 {
  font-family: var(--nef-semantic-typography-title-lg-font-family);
  font-size: var(--nef-semantic-typography-title-lg-font-size);
  font-weight: var(--nef-semantic-typography-title-lg-font-weight);
  letter-spacing: var(--nef-semantic-typography-title-lg-letter-spacing);
  line-height: var(--nef-semantic-typography-title-lg-line-height);
}
.nef-c-rich-text-editor__content[contenteditable=true] h2 {
  font-family: var(--nef-semantic-typography-title-default-font-family);
  font-size: var(--nef-semantic-typography-title-default-font-size);
  font-weight: var(--nef-semantic-typography-title-default-font-weight);
  letter-spacing: var(--nef-semantic-typography-title-default-letter-spacing);
  line-height: var(--nef-semantic-typography-title-default-line-height);
}
.nef-c-rich-text-editor__content[contenteditable=true] h3 {
  font-family: var(--nef-semantic-typography-title-sm-font-family);
  font-size: var(--nef-semantic-typography-title-sm-font-size);
  font-weight: var(--nef-semantic-typography-title-sm-font-weight);
  letter-spacing: var(--nef-semantic-typography-title-sm-letter-spacing);
  line-height: var(--nef-semantic-typography-title-sm-line-height);
}
.nef-c-rich-text-editor__content[contenteditable=true] h4 {
  font-family: var(--nef-semantic-typography-title-xs-font-family);
  font-size: var(--nef-semantic-typography-title-xs-font-size);
  font-weight: var(--nef-semantic-typography-title-xs-font-weight);
  letter-spacing: var(--nef-semantic-typography-title-xs-letter-spacing);
  line-height: var(--nef-semantic-typography-title-xs-line-height);
}
.nef-c-rich-text-editor__content[contenteditable=true] ul, .nef-c-rich-text-editor__content[contenteditable=true] ol {
  padding-inline-start: 0;
  margin-inline-start: var(--nef-size-24);
}
.nef-c-rich-text-editor__content[contenteditable=true] ul li ul {
  margin-inline-start: var(--nef-size-24);
}
.nef-c-rich-text-editor__content[contenteditable=true] blockquote,
.nef-c-rich-text-editor__content[contenteditable=true] blockquote > * {
  position: relative;
  font-style: italic;
}
.nef-c-rich-text-editor__content[contenteditable=true] blockquote {
  margin-left: var(--nef-size-24);
}
.nef-c-rich-text-editor__content[contenteditable=true] blockquote::before {
  content: "“";
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: calc(var(--nef-size-24) * -1);
  font-weight: var(--nef-font-weight-regular);
  font-size: var(--nef-typography-font-size-48);
  line-height: var(--nef-semantic-typography-body-default-line-height);
}
.nef-c-rich-text-editor__content[contenteditable=true] .bold,
.nef-c-rich-text-editor__content[contenteditable=true] .font-bold {
  font-weight: var(--nef-font-weight-bold);
}
.nef-c-rich-text-editor__content[contenteditable=true] .italic {
  font-style: italic;
}
.nef-c-rich-text-editor__content[contenteditable=true] .underline {
  text-decoration: underline;
}

.nef-c-rich-text-editor__content {
  display: flex;
  flex-direction: column;
  gap: var(--nef-size-8);
  color: var(--nef-semantic-color-content-default);
  font-family: var(--nef-semantic-typography-body-default-font-family);
  font-size: var(--nef-semantic-typography-body-default-font-size);
  font-weight: var(--nef-semantic-typography-body-default-font-weight);
  letter-spacing: var(--nef-semantic-typography-body-default-letter-spacing);
  line-height: var(--nef-semantic-typography-body-default-line-height);
}
.nef-c-rich-text-editor__content > * {
  padding: 0;
  margin: 0;
}
.nef-c-rich-text-editor__content h1 {
  font-family: var(--nef-semantic-typography-title-lg-font-family);
  font-size: var(--nef-semantic-typography-title-lg-font-size);
  font-weight: var(--nef-semantic-typography-title-lg-font-weight);
  letter-spacing: var(--nef-semantic-typography-title-lg-letter-spacing);
  line-height: var(--nef-semantic-typography-title-lg-line-height);
}
.nef-c-rich-text-editor__content h2 {
  font-family: var(--nef-semantic-typography-title-default-font-family);
  font-size: var(--nef-semantic-typography-title-default-font-size);
  font-weight: var(--nef-semantic-typography-title-default-font-weight);
  letter-spacing: var(--nef-semantic-typography-title-default-letter-spacing);
  line-height: var(--nef-semantic-typography-title-default-line-height);
}
.nef-c-rich-text-editor__content h3 {
  font-family: var(--nef-semantic-typography-title-sm-font-family);
  font-size: var(--nef-semantic-typography-title-sm-font-size);
  font-weight: var(--nef-semantic-typography-title-sm-font-weight);
  letter-spacing: var(--nef-semantic-typography-title-sm-letter-spacing);
  line-height: var(--nef-semantic-typography-title-sm-line-height);
}
.nef-c-rich-text-editor__content h4 {
  font-family: var(--nef-semantic-typography-title-xs-font-family);
  font-size: var(--nef-semantic-typography-title-xs-font-size);
  font-weight: var(--nef-semantic-typography-title-xs-font-weight);
  letter-spacing: var(--nef-semantic-typography-title-xs-letter-spacing);
  line-height: var(--nef-semantic-typography-title-xs-line-height);
}
.nef-c-rich-text-editor__content ul, .nef-c-rich-text-editor__content ol {
  padding-inline-start: 0;
  margin-inline-start: var(--nef-size-24);
}
.nef-c-rich-text-editor__content ul li ul {
  margin-inline-start: var(--nef-size-24);
}
.nef-c-rich-text-editor__content blockquote,
.nef-c-rich-text-editor__content blockquote > * {
  position: relative;
  font-style: italic;
}
.nef-c-rich-text-editor__content blockquote {
  margin-left: var(--nef-size-24);
}
.nef-c-rich-text-editor__content blockquote::before {
  content: "“";
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: calc(var(--nef-size-24) * -1);
  font-weight: var(--nef-font-weight-regular);
  font-size: var(--nef-typography-font-size-48);
  line-height: var(--nef-semantic-typography-body-default-line-height);
}
.nef-c-rich-text-editor__content .bold,
.nef-c-rich-text-editor__content .font-bold {
  font-weight: var(--nef-font-weight-bold);
}
.nef-c-rich-text-editor__content .italic {
  font-style: italic;
}
.nef-c-rich-text-editor__content .underline {
  text-decoration: underline;
}

/*# sourceMappingURL=global.css.map */