/* docara-shell-source: runtime/utility/min-height/default/css/default.css */
@layer sf.utilities {
  .min-h-full {
    min-height: 100%;
  }
  .min-h-screen {
    min-height: 100vh;
  }
  .min-h-min {
    min-height: -webkit-min-content;
    min-height: -moz-min-content;
    min-height: min-content;
  }
  .min-h-max {
    min-height: -webkit-max-content;
    min-height: -moz-max-content;
    min-height: max-content;
  }
  .min-h-fit {
    min-height: -webkit-fit-content;
    min-height: -moz-fit-content;
    min-height: fit-content;
  }
  .min-h-0 {
    min-height: 0;
  }
}

/* docara-shell-source: runtime/utility/min-width/default/css/default.css */
@layer sf.utilities {
  .min-w-min {
    min-width: -webkit-min-content;
    min-width: -moz-min-content;
    min-width: min-content;
  }
  .min-w-max {
    min-width: -webkit-max-content;
    min-width: -moz-max-content;
    min-width: max-content;
  }
  .min-w-fit {
    min-width: -webkit-fit-content;
    min-width: -moz-fit-content;
    min-width: fit-content;
  }
  .min-w-full {
    min-width: 100%;
  }
  .min-w-0 {
    min-width: 0;
  }
}

/* docara-shell-source: runtime/utility/overflow/default/css/default.css */
@layer sf.utilities {
  .overflow-auto {
    overflow: auto;
  }
  .overflow-hidden {
    overflow: hidden;
  }
  .overflow-visible {
    overflow: visible;
  }
  .overflow-scroll {
    overflow: scroll;
  }
  .overflow-x-auto {
    overflow-x: auto;
  }
  .overflow-y-auto {
    overflow-y: auto;
  }
  .overflow-x-hidden {
    overflow-x: hidden;
  }
  .overflow-y-hidden {
    overflow-y: hidden;
  }
  .overflow-x-visible {
    overflow-x: visible;
  }
  .overflow-y-visible {
    overflow-y: visible;
  }
  .overflow-x-scroll {
    overflow-x: scroll;
  }
  .overflow-y-scroll {
    overflow-y: scroll;
  }
}

/* docara-shell-source: runtime/utility/padding/default/css/default.css */
@layer sf.utilities {
  .p-0 {
    padding: var(--sf-space-0);
  }
  .p-top-0 {
    padding-top: var(--sf-space-0);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-inline-end-0 {
    padding-right: var(--sf-space-0);
  }
  @supports not (padding-inline-end: initial) {
  html:not([dir="rtl"]) .p-inline-end-0 {
    padding-right: var(--sf-space-0);
    }
  }
  .p-inline-end-0:where(:dir(ltr)) {
    padding-right: var(--sf-space-0);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-inline-end-0 {
    padding-left: var(--sf-space-0);
  }
  @supports not (padding-inline-end: initial) {
  [dir="rtl"] .p-inline-end-0 {
    padding-left: var(--sf-space-0);
    }
  }
  .p-inline-end-0:where(:dir(rtl)) {
    padding-left: var(--sf-space-0);
  }
  .p-inline-end-0 {
    -webkit-padding-end: var(--sf-space-0);
            padding-inline-end: var(--sf-space-0);
  }
  .p-bottom-0 {
    padding-bottom: var(--sf-space-0);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-x-0 {
    padding-left: var(--sf-space-0);
  }
  @supports not (padding-inline-start: initial) {
  html:not([dir="rtl"]) .p-x-0 {
    padding-left: var(--sf-space-0);
    }
  }
  .p-x-0:where(:dir(ltr)) {
    padding-left: var(--sf-space-0);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-x-0 {
    padding-right: var(--sf-space-0);
  }
  @supports not (padding-inline-start: initial) {
  [dir="rtl"] .p-x-0 {
    padding-right: var(--sf-space-0);
    }
  }
  .p-x-0:where(:dir(rtl)) {
    padding-right: var(--sf-space-0);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-x-0 {
    padding-right: var(--sf-space-0);
  }
  @supports not (padding-inline-end: initial) {
  html:not([dir="rtl"]) .p-x-0 {
    padding-right: var(--sf-space-0);
    }
  }
  .p-x-0:where(:dir(ltr)) {
    padding-right: var(--sf-space-0);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-x-0 {
    padding-left: var(--sf-space-0);
  }
  @supports not (padding-inline-end: initial) {
  [dir="rtl"] .p-x-0 {
    padding-left: var(--sf-space-0);
    }
  }
  .p-x-0:where(:dir(rtl)) {
    padding-left: var(--sf-space-0);
  }
  .p-x-0 {
    -webkit-padding-start: var(--sf-space-0);
            padding-inline-start: var(--sf-space-0);
    -webkit-padding-end: var(--sf-space-0);
            padding-inline-end: var(--sf-space-0);
  }
  .p-y-0 {
    padding-top: var(--sf-space-0);
    padding-bottom: var(--sf-space-0);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-inline-start-0 {
    padding-left: var(--sf-space-0);
  }
  @supports not (padding-inline-start: initial) {
  html:not([dir="rtl"]) .p-inline-start-0 {
    padding-left: var(--sf-space-0);
    }
  }
  .p-inline-start-0:where(:dir(ltr)) {
    padding-left: var(--sf-space-0);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-inline-start-0 {
    padding-right: var(--sf-space-0);
  }
  @supports not (padding-inline-start: initial) {
  [dir="rtl"] .p-inline-start-0 {
    padding-right: var(--sf-space-0);
    }
  }
  .p-inline-start-0:where(:dir(rtl)) {
    padding-right: var(--sf-space-0);
  }
  .p-inline-start-0 {
    -webkit-padding-start: var(--sf-space-0);
            padding-inline-start: var(--sf-space-0);
  }
  .p-1\/4 {
    padding: var(--sf-space-1\/4);
  }
  .p-top-1\/4 {
    padding-top: var(--sf-space-1\/4);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-inline-end-1\/4 {
    padding-right: var(--sf-space-1\/4);
  }
  @supports not (padding-inline-end: initial) {
  html:not([dir="rtl"]) .p-inline-end-1\/4 {
    padding-right: var(--sf-space-1\/4);
    }
  }
  .p-inline-end-1\/4:where(:dir(ltr)) {
    padding-right: var(--sf-space-1\/4);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-inline-end-1\/4 {
    padding-left: var(--sf-space-1\/4);
  }
  @supports not (padding-inline-end: initial) {
  [dir="rtl"] .p-inline-end-1\/4 {
    padding-left: var(--sf-space-1\/4);
    }
  }
  .p-inline-end-1\/4:where(:dir(rtl)) {
    padding-left: var(--sf-space-1\/4);
  }
  .p-inline-end-1\/4 {
    -webkit-padding-end: var(--sf-space-1\/4);
            padding-inline-end: var(--sf-space-1\/4);
  }
  .p-bottom-1\/4 {
    padding-bottom: var(--sf-space-1\/4);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-x-1\/4 {
    padding-left: var(--sf-space-1\/4);
  }
  @supports not (padding-inline-start: initial) {
  html:not([dir="rtl"]) .p-x-1\/4 {
    padding-left: var(--sf-space-1\/4);
    }
  }
  .p-x-1\/4:where(:dir(ltr)) {
    padding-left: var(--sf-space-1\/4);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-x-1\/4 {
    padding-right: var(--sf-space-1\/4);
  }
  @supports not (padding-inline-start: initial) {
  [dir="rtl"] .p-x-1\/4 {
    padding-right: var(--sf-space-1\/4);
    }
  }
  .p-x-1\/4:where(:dir(rtl)) {
    padding-right: var(--sf-space-1\/4);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-x-1\/4 {
    padding-right: var(--sf-space-1\/4);
  }
  @supports not (padding-inline-end: initial) {
  html:not([dir="rtl"]) .p-x-1\/4 {
    padding-right: var(--sf-space-1\/4);
    }
  }
  .p-x-1\/4:where(:dir(ltr)) {
    padding-right: var(--sf-space-1\/4);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-x-1\/4 {
    padding-left: var(--sf-space-1\/4);
  }
  @supports not (padding-inline-end: initial) {
  [dir="rtl"] .p-x-1\/4 {
    padding-left: var(--sf-space-1\/4);
    }
  }
  .p-x-1\/4:where(:dir(rtl)) {
    padding-left: var(--sf-space-1\/4);
  }
  .p-x-1\/4 {
    -webkit-padding-start: var(--sf-space-1\/4);
            padding-inline-start: var(--sf-space-1\/4);
    -webkit-padding-end: var(--sf-space-1\/4);
            padding-inline-end: var(--sf-space-1\/4);
  }
  .p-y-1\/4 {
    padding-top: var(--sf-space-1\/4);
    padding-bottom: var(--sf-space-1\/4);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-inline-start-1\/4 {
    padding-left: var(--sf-space-1\/4);
  }
  @supports not (padding-inline-start: initial) {
  html:not([dir="rtl"]) .p-inline-start-1\/4 {
    padding-left: var(--sf-space-1\/4);
    }
  }
  .p-inline-start-1\/4:where(:dir(ltr)) {
    padding-left: var(--sf-space-1\/4);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-inline-start-1\/4 {
    padding-right: var(--sf-space-1\/4);
  }
  @supports not (padding-inline-start: initial) {
  [dir="rtl"] .p-inline-start-1\/4 {
    padding-right: var(--sf-space-1\/4);
    }
  }
  .p-inline-start-1\/4:where(:dir(rtl)) {
    padding-right: var(--sf-space-1\/4);
  }
  .p-inline-start-1\/4 {
    -webkit-padding-start: var(--sf-space-1\/4);
            padding-inline-start: var(--sf-space-1\/4);
  }
  .p-1\/3 {
    padding: var(--sf-space-1\/3);
  }
  .p-top-1\/3 {
    padding-top: var(--sf-space-1\/3);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-inline-end-1\/3 {
    padding-right: var(--sf-space-1\/3);
  }
  @supports not (padding-inline-end: initial) {
  html:not([dir="rtl"]) .p-inline-end-1\/3 {
    padding-right: var(--sf-space-1\/3);
    }
  }
  .p-inline-end-1\/3:where(:dir(ltr)) {
    padding-right: var(--sf-space-1\/3);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-inline-end-1\/3 {
    padding-left: var(--sf-space-1\/3);
  }
  @supports not (padding-inline-end: initial) {
  [dir="rtl"] .p-inline-end-1\/3 {
    padding-left: var(--sf-space-1\/3);
    }
  }
  .p-inline-end-1\/3:where(:dir(rtl)) {
    padding-left: var(--sf-space-1\/3);
  }
  .p-inline-end-1\/3 {
    -webkit-padding-end: var(--sf-space-1\/3);
            padding-inline-end: var(--sf-space-1\/3);
  }
  .p-bottom-1\/3 {
    padding-bottom: var(--sf-space-1\/3);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-x-1\/3 {
    padding-left: var(--sf-space-1\/3);
  }
  @supports not (padding-inline-start: initial) {
  html:not([dir="rtl"]) .p-x-1\/3 {
    padding-left: var(--sf-space-1\/3);
    }
  }
  .p-x-1\/3:where(:dir(ltr)) {
    padding-left: var(--sf-space-1\/3);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-x-1\/3 {
    padding-right: var(--sf-space-1\/3);
  }
  @supports not (padding-inline-start: initial) {
  [dir="rtl"] .p-x-1\/3 {
    padding-right: var(--sf-space-1\/3);
    }
  }
  .p-x-1\/3:where(:dir(rtl)) {
    padding-right: var(--sf-space-1\/3);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-x-1\/3 {
    padding-right: var(--sf-space-1\/3);
  }
  @supports not (padding-inline-end: initial) {
  html:not([dir="rtl"]) .p-x-1\/3 {
    padding-right: var(--sf-space-1\/3);
    }
  }
  .p-x-1\/3:where(:dir(ltr)) {
    padding-right: var(--sf-space-1\/3);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-x-1\/3 {
    padding-left: var(--sf-space-1\/3);
  }
  @supports not (padding-inline-end: initial) {
  [dir="rtl"] .p-x-1\/3 {
    padding-left: var(--sf-space-1\/3);
    }
  }
  .p-x-1\/3:where(:dir(rtl)) {
    padding-left: var(--sf-space-1\/3);
  }
  .p-x-1\/3 {
    -webkit-padding-start: var(--sf-space-1\/3);
            padding-inline-start: var(--sf-space-1\/3);
    -webkit-padding-end: var(--sf-space-1\/3);
            padding-inline-end: var(--sf-space-1\/3);
  }
  .p-y-1\/3 {
    padding-top: var(--sf-space-1\/3);
    padding-bottom: var(--sf-space-1\/3);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-inline-start-1\/3 {
    padding-left: var(--sf-space-1\/3);
  }
  @supports not (padding-inline-start: initial) {
  html:not([dir="rtl"]) .p-inline-start-1\/3 {
    padding-left: var(--sf-space-1\/3);
    }
  }
  .p-inline-start-1\/3:where(:dir(ltr)) {
    padding-left: var(--sf-space-1\/3);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-inline-start-1\/3 {
    padding-right: var(--sf-space-1\/3);
  }
  @supports not (padding-inline-start: initial) {
  [dir="rtl"] .p-inline-start-1\/3 {
    padding-right: var(--sf-space-1\/3);
    }
  }
  .p-inline-start-1\/3:where(:dir(rtl)) {
    padding-right: var(--sf-space-1\/3);
  }
  .p-inline-start-1\/3 {
    -webkit-padding-start: var(--sf-space-1\/3);
            padding-inline-start: var(--sf-space-1\/3);
  }
  .p-1\/2 {
    padding: var(--sf-space-1\/2);
  }
  .p-top-1\/2 {
    padding-top: var(--sf-space-1\/2);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-inline-end-1\/2 {
    padding-right: var(--sf-space-1\/2);
  }
  @supports not (padding-inline-end: initial) {
  html:not([dir="rtl"]) .p-inline-end-1\/2 {
    padding-right: var(--sf-space-1\/2);
    }
  }
  .p-inline-end-1\/2:where(:dir(ltr)) {
    padding-right: var(--sf-space-1\/2);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-inline-end-1\/2 {
    padding-left: var(--sf-space-1\/2);
  }
  @supports not (padding-inline-end: initial) {
  [dir="rtl"] .p-inline-end-1\/2 {
    padding-left: var(--sf-space-1\/2);
    }
  }
  .p-inline-end-1\/2:where(:dir(rtl)) {
    padding-left: var(--sf-space-1\/2);
  }
  .p-inline-end-1\/2 {
    -webkit-padding-end: var(--sf-space-1\/2);
            padding-inline-end: var(--sf-space-1\/2);
  }
  .p-bottom-1\/2 {
    padding-bottom: var(--sf-space-1\/2);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-x-1\/2 {
    padding-left: var(--sf-space-1\/2);
  }
  @supports not (padding-inline-start: initial) {
  html:not([dir="rtl"]) .p-x-1\/2 {
    padding-left: var(--sf-space-1\/2);
    }
  }
  .p-x-1\/2:where(:dir(ltr)) {
    padding-left: var(--sf-space-1\/2);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-x-1\/2 {
    padding-right: var(--sf-space-1\/2);
  }
  @supports not (padding-inline-start: initial) {
  [dir="rtl"] .p-x-1\/2 {
    padding-right: var(--sf-space-1\/2);
    }
  }
  .p-x-1\/2:where(:dir(rtl)) {
    padding-right: var(--sf-space-1\/2);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-x-1\/2 {
    padding-right: var(--sf-space-1\/2);
  }
  @supports not (padding-inline-end: initial) {
  html:not([dir="rtl"]) .p-x-1\/2 {
    padding-right: var(--sf-space-1\/2);
    }
  }
  .p-x-1\/2:where(:dir(ltr)) {
    padding-right: var(--sf-space-1\/2);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-x-1\/2 {
    padding-left: var(--sf-space-1\/2);
  }
  @supports not (padding-inline-end: initial) {
  [dir="rtl"] .p-x-1\/2 {
    padding-left: var(--sf-space-1\/2);
    }
  }
  .p-x-1\/2:where(:dir(rtl)) {
    padding-left: var(--sf-space-1\/2);
  }
  .p-x-1\/2 {
    -webkit-padding-start: var(--sf-space-1\/2);
            padding-inline-start: var(--sf-space-1\/2);
    -webkit-padding-end: var(--sf-space-1\/2);
            padding-inline-end: var(--sf-space-1\/2);
  }
  .p-y-1\/2 {
    padding-top: var(--sf-space-1\/2);
    padding-bottom: var(--sf-space-1\/2);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-inline-start-1\/2 {
    padding-left: var(--sf-space-1\/2);
  }
  @supports not (padding-inline-start: initial) {
  html:not([dir="rtl"]) .p-inline-start-1\/2 {
    padding-left: var(--sf-space-1\/2);
    }
  }
  .p-inline-start-1\/2:where(:dir(ltr)) {
    padding-left: var(--sf-space-1\/2);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-inline-start-1\/2 {
    padding-right: var(--sf-space-1\/2);
  }
  @supports not (padding-inline-start: initial) {
  [dir="rtl"] .p-inline-start-1\/2 {
    padding-right: var(--sf-space-1\/2);
    }
  }
  .p-inline-start-1\/2:where(:dir(rtl)) {
    padding-right: var(--sf-space-1\/2);
  }
  .p-inline-start-1\/2 {
    -webkit-padding-start: var(--sf-space-1\/2);
            padding-inline-start: var(--sf-space-1\/2);
  }
  .p-1 {
    padding: var(--sf-space-1);
  }
  .p-top-1 {
    padding-top: var(--sf-space-1);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-inline-end-1 {
    padding-right: var(--sf-space-1);
  }
  @supports not (padding-inline-end: initial) {
  html:not([dir="rtl"]) .p-inline-end-1 {
    padding-right: var(--sf-space-1);
    }
  }
  .p-inline-end-1:where(:dir(ltr)) {
    padding-right: var(--sf-space-1);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-inline-end-1 {
    padding-left: var(--sf-space-1);
  }
  @supports not (padding-inline-end: initial) {
  [dir="rtl"] .p-inline-end-1 {
    padding-left: var(--sf-space-1);
    }
  }
  .p-inline-end-1:where(:dir(rtl)) {
    padding-left: var(--sf-space-1);
  }
  .p-inline-end-1 {
    -webkit-padding-end: var(--sf-space-1);
            padding-inline-end: var(--sf-space-1);
  }
  .p-bottom-1 {
    padding-bottom: var(--sf-space-1);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-x-1 {
    padding-left: var(--sf-space-1);
  }
  @supports not (padding-inline-start: initial) {
  html:not([dir="rtl"]) .p-x-1 {
    padding-left: var(--sf-space-1);
    }
  }
  .p-x-1:where(:dir(ltr)) {
    padding-left: var(--sf-space-1);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-x-1 {
    padding-right: var(--sf-space-1);
  }
  @supports not (padding-inline-start: initial) {
  [dir="rtl"] .p-x-1 {
    padding-right: var(--sf-space-1);
    }
  }
  .p-x-1:where(:dir(rtl)) {
    padding-right: var(--sf-space-1);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-x-1 {
    padding-right: var(--sf-space-1);
  }
  @supports not (padding-inline-end: initial) {
  html:not([dir="rtl"]) .p-x-1 {
    padding-right: var(--sf-space-1);
    }
  }
  .p-x-1:where(:dir(ltr)) {
    padding-right: var(--sf-space-1);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-x-1 {
    padding-left: var(--sf-space-1);
  }
  @supports not (padding-inline-end: initial) {
  [dir="rtl"] .p-x-1 {
    padding-left: var(--sf-space-1);
    }
  }
  .p-x-1:where(:dir(rtl)) {
    padding-left: var(--sf-space-1);
  }
  .p-x-1 {
    -webkit-padding-start: var(--sf-space-1);
            padding-inline-start: var(--sf-space-1);
    -webkit-padding-end: var(--sf-space-1);
            padding-inline-end: var(--sf-space-1);
  }
  .p-y-1 {
    padding-top: var(--sf-space-1);
    padding-bottom: var(--sf-space-1);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-inline-start-1 {
    padding-left: var(--sf-space-1);
  }
  @supports not (padding-inline-start: initial) {
  html:not([dir="rtl"]) .p-inline-start-1 {
    padding-left: var(--sf-space-1);
    }
  }
  .p-inline-start-1:where(:dir(ltr)) {
    padding-left: var(--sf-space-1);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-inline-start-1 {
    padding-right: var(--sf-space-1);
  }
  @supports not (padding-inline-start: initial) {
  [dir="rtl"] .p-inline-start-1 {
    padding-right: var(--sf-space-1);
    }
  }
  .p-inline-start-1:where(:dir(rtl)) {
    padding-right: var(--sf-space-1);
  }
  .p-inline-start-1 {
    -webkit-padding-start: var(--sf-space-1);
            padding-inline-start: var(--sf-space-1);
  }
  .p-2 {
    padding: var(--sf-space-2);
  }
  .p-top-2 {
    padding-top: var(--sf-space-2);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-inline-end-2 {
    padding-right: var(--sf-space-2);
  }
  @supports not (padding-inline-end: initial) {
  html:not([dir="rtl"]) .p-inline-end-2 {
    padding-right: var(--sf-space-2);
    }
  }
  .p-inline-end-2:where(:dir(ltr)) {
    padding-right: var(--sf-space-2);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-inline-end-2 {
    padding-left: var(--sf-space-2);
  }
  @supports not (padding-inline-end: initial) {
  [dir="rtl"] .p-inline-end-2 {
    padding-left: var(--sf-space-2);
    }
  }
  .p-inline-end-2:where(:dir(rtl)) {
    padding-left: var(--sf-space-2);
  }
  .p-inline-end-2 {
    -webkit-padding-end: var(--sf-space-2);
            padding-inline-end: var(--sf-space-2);
  }
  .p-bottom-2 {
    padding-bottom: var(--sf-space-2);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-x-2 {
    padding-left: var(--sf-space-2);
  }
  @supports not (padding-inline-start: initial) {
  html:not([dir="rtl"]) .p-x-2 {
    padding-left: var(--sf-space-2);
    }
  }
  .p-x-2:where(:dir(ltr)) {
    padding-left: var(--sf-space-2);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-x-2 {
    padding-right: var(--sf-space-2);
  }
  @supports not (padding-inline-start: initial) {
  [dir="rtl"] .p-x-2 {
    padding-right: var(--sf-space-2);
    }
  }
  .p-x-2:where(:dir(rtl)) {
    padding-right: var(--sf-space-2);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-x-2 {
    padding-right: var(--sf-space-2);
  }
  @supports not (padding-inline-end: initial) {
  html:not([dir="rtl"]) .p-x-2 {
    padding-right: var(--sf-space-2);
    }
  }
  .p-x-2:where(:dir(ltr)) {
    padding-right: var(--sf-space-2);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-x-2 {
    padding-left: var(--sf-space-2);
  }
  @supports not (padding-inline-end: initial) {
  [dir="rtl"] .p-x-2 {
    padding-left: var(--sf-space-2);
    }
  }
  .p-x-2:where(:dir(rtl)) {
    padding-left: var(--sf-space-2);
  }
  .p-x-2 {
    -webkit-padding-start: var(--sf-space-2);
            padding-inline-start: var(--sf-space-2);
    -webkit-padding-end: var(--sf-space-2);
            padding-inline-end: var(--sf-space-2);
  }
  .p-y-2 {
    padding-top: var(--sf-space-2);
    padding-bottom: var(--sf-space-2);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-inline-start-2 {
    padding-left: var(--sf-space-2);
  }
  @supports not (padding-inline-start: initial) {
  html:not([dir="rtl"]) .p-inline-start-2 {
    padding-left: var(--sf-space-2);
    }
  }
  .p-inline-start-2:where(:dir(ltr)) {
    padding-left: var(--sf-space-2);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-inline-start-2 {
    padding-right: var(--sf-space-2);
  }
  @supports not (padding-inline-start: initial) {
  [dir="rtl"] .p-inline-start-2 {
    padding-right: var(--sf-space-2);
    }
  }
  .p-inline-start-2:where(:dir(rtl)) {
    padding-right: var(--sf-space-2);
  }
  .p-inline-start-2 {
    -webkit-padding-start: var(--sf-space-2);
            padding-inline-start: var(--sf-space-2);
  }
  .p-3 {
    padding: var(--sf-space-3);
  }
  .p-top-3 {
    padding-top: var(--sf-space-3);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-inline-end-3 {
    padding-right: var(--sf-space-3);
  }
  @supports not (padding-inline-end: initial) {
  html:not([dir="rtl"]) .p-inline-end-3 {
    padding-right: var(--sf-space-3);
    }
  }
  .p-inline-end-3:where(:dir(ltr)) {
    padding-right: var(--sf-space-3);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-inline-end-3 {
    padding-left: var(--sf-space-3);
  }
  @supports not (padding-inline-end: initial) {
  [dir="rtl"] .p-inline-end-3 {
    padding-left: var(--sf-space-3);
    }
  }
  .p-inline-end-3:where(:dir(rtl)) {
    padding-left: var(--sf-space-3);
  }
  .p-inline-end-3 {
    -webkit-padding-end: var(--sf-space-3);
            padding-inline-end: var(--sf-space-3);
  }
  .p-bottom-3 {
    padding-bottom: var(--sf-space-3);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-x-3 {
    padding-left: var(--sf-space-3);
  }
  @supports not (padding-inline-start: initial) {
  html:not([dir="rtl"]) .p-x-3 {
    padding-left: var(--sf-space-3);
    }
  }
  .p-x-3:where(:dir(ltr)) {
    padding-left: var(--sf-space-3);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-x-3 {
    padding-right: var(--sf-space-3);
  }
  @supports not (padding-inline-start: initial) {
  [dir="rtl"] .p-x-3 {
    padding-right: var(--sf-space-3);
    }
  }
  .p-x-3:where(:dir(rtl)) {
    padding-right: var(--sf-space-3);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-x-3 {
    padding-right: var(--sf-space-3);
  }
  @supports not (padding-inline-end: initial) {
  html:not([dir="rtl"]) .p-x-3 {
    padding-right: var(--sf-space-3);
    }
  }
  .p-x-3:where(:dir(ltr)) {
    padding-right: var(--sf-space-3);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-x-3 {
    padding-left: var(--sf-space-3);
  }
  @supports not (padding-inline-end: initial) {
  [dir="rtl"] .p-x-3 {
    padding-left: var(--sf-space-3);
    }
  }
  .p-x-3:where(:dir(rtl)) {
    padding-left: var(--sf-space-3);
  }
  .p-x-3 {
    -webkit-padding-start: var(--sf-space-3);
            padding-inline-start: var(--sf-space-3);
    -webkit-padding-end: var(--sf-space-3);
            padding-inline-end: var(--sf-space-3);
  }
  .p-y-3 {
    padding-top: var(--sf-space-3);
    padding-bottom: var(--sf-space-3);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-inline-start-3 {
    padding-left: var(--sf-space-3);
  }
  @supports not (padding-inline-start: initial) {
  html:not([dir="rtl"]) .p-inline-start-3 {
    padding-left: var(--sf-space-3);
    }
  }
  .p-inline-start-3:where(:dir(ltr)) {
    padding-left: var(--sf-space-3);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-inline-start-3 {
    padding-right: var(--sf-space-3);
  }
  @supports not (padding-inline-start: initial) {
  [dir="rtl"] .p-inline-start-3 {
    padding-right: var(--sf-space-3);
    }
  }
  .p-inline-start-3:where(:dir(rtl)) {
    padding-right: var(--sf-space-3);
  }
  .p-inline-start-3 {
    -webkit-padding-start: var(--sf-space-3);
            padding-inline-start: var(--sf-space-3);
  }
  .p-4 {
    padding: var(--sf-space-4);
  }
  .p-top-4 {
    padding-top: var(--sf-space-4);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-inline-end-4 {
    padding-right: var(--sf-space-4);
  }
  @supports not (padding-inline-end: initial) {
  html:not([dir="rtl"]) .p-inline-end-4 {
    padding-right: var(--sf-space-4);
    }
  }
  .p-inline-end-4:where(:dir(ltr)) {
    padding-right: var(--sf-space-4);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-inline-end-4 {
    padding-left: var(--sf-space-4);
  }
  @supports not (padding-inline-end: initial) {
  [dir="rtl"] .p-inline-end-4 {
    padding-left: var(--sf-space-4);
    }
  }
  .p-inline-end-4:where(:dir(rtl)) {
    padding-left: var(--sf-space-4);
  }
  .p-inline-end-4 {
    -webkit-padding-end: var(--sf-space-4);
            padding-inline-end: var(--sf-space-4);
  }
  .p-bottom-4 {
    padding-bottom: var(--sf-space-4);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-x-4 {
    padding-left: var(--sf-space-4);
  }
  @supports not (padding-inline-start: initial) {
  html:not([dir="rtl"]) .p-x-4 {
    padding-left: var(--sf-space-4);
    }
  }
  .p-x-4:where(:dir(ltr)) {
    padding-left: var(--sf-space-4);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-x-4 {
    padding-right: var(--sf-space-4);
  }
  @supports not (padding-inline-start: initial) {
  [dir="rtl"] .p-x-4 {
    padding-right: var(--sf-space-4);
    }
  }
  .p-x-4:where(:dir(rtl)) {
    padding-right: var(--sf-space-4);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-x-4 {
    padding-right: var(--sf-space-4);
  }
  @supports not (padding-inline-end: initial) {
  html:not([dir="rtl"]) .p-x-4 {
    padding-right: var(--sf-space-4);
    }
  }
  .p-x-4:where(:dir(ltr)) {
    padding-right: var(--sf-space-4);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-x-4 {
    padding-left: var(--sf-space-4);
  }
  @supports not (padding-inline-end: initial) {
  [dir="rtl"] .p-x-4 {
    padding-left: var(--sf-space-4);
    }
  }
  .p-x-4:where(:dir(rtl)) {
    padding-left: var(--sf-space-4);
  }
  .p-x-4 {
    -webkit-padding-start: var(--sf-space-4);
            padding-inline-start: var(--sf-space-4);
    -webkit-padding-end: var(--sf-space-4);
            padding-inline-end: var(--sf-space-4);
  }
  .p-y-4 {
    padding-top: var(--sf-space-4);
    padding-bottom: var(--sf-space-4);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-inline-start-4 {
    padding-left: var(--sf-space-4);
  }
  @supports not (padding-inline-start: initial) {
  html:not([dir="rtl"]) .p-inline-start-4 {
    padding-left: var(--sf-space-4);
    }
  }
  .p-inline-start-4:where(:dir(ltr)) {
    padding-left: var(--sf-space-4);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-inline-start-4 {
    padding-right: var(--sf-space-4);
  }
  @supports not (padding-inline-start: initial) {
  [dir="rtl"] .p-inline-start-4 {
    padding-right: var(--sf-space-4);
    }
  }
  .p-inline-start-4:where(:dir(rtl)) {
    padding-right: var(--sf-space-4);
  }
  .p-inline-start-4 {
    -webkit-padding-start: var(--sf-space-4);
            padding-inline-start: var(--sf-space-4);
  }
  .p-5 {
    padding: var(--sf-space-5);
  }
  .p-top-5 {
    padding-top: var(--sf-space-5);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-inline-end-5 {
    padding-right: var(--sf-space-5);
  }
  @supports not (padding-inline-end: initial) {
  html:not([dir="rtl"]) .p-inline-end-5 {
    padding-right: var(--sf-space-5);
    }
  }
  .p-inline-end-5:where(:dir(ltr)) {
    padding-right: var(--sf-space-5);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-inline-end-5 {
    padding-left: var(--sf-space-5);
  }
  @supports not (padding-inline-end: initial) {
  [dir="rtl"] .p-inline-end-5 {
    padding-left: var(--sf-space-5);
    }
  }
  .p-inline-end-5:where(:dir(rtl)) {
    padding-left: var(--sf-space-5);
  }
  .p-inline-end-5 {
    -webkit-padding-end: var(--sf-space-5);
            padding-inline-end: var(--sf-space-5);
  }
  .p-bottom-5 {
    padding-bottom: var(--sf-space-5);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-x-5 {
    padding-left: var(--sf-space-5);
  }
  @supports not (padding-inline-start: initial) {
  html:not([dir="rtl"]) .p-x-5 {
    padding-left: var(--sf-space-5);
    }
  }
  .p-x-5:where(:dir(ltr)) {
    padding-left: var(--sf-space-5);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-x-5 {
    padding-right: var(--sf-space-5);
  }
  @supports not (padding-inline-start: initial) {
  [dir="rtl"] .p-x-5 {
    padding-right: var(--sf-space-5);
    }
  }
  .p-x-5:where(:dir(rtl)) {
    padding-right: var(--sf-space-5);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-x-5 {
    padding-right: var(--sf-space-5);
  }
  @supports not (padding-inline-end: initial) {
  html:not([dir="rtl"]) .p-x-5 {
    padding-right: var(--sf-space-5);
    }
  }
  .p-x-5:where(:dir(ltr)) {
    padding-right: var(--sf-space-5);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-x-5 {
    padding-left: var(--sf-space-5);
  }
  @supports not (padding-inline-end: initial) {
  [dir="rtl"] .p-x-5 {
    padding-left: var(--sf-space-5);
    }
  }
  .p-x-5:where(:dir(rtl)) {
    padding-left: var(--sf-space-5);
  }
  .p-x-5 {
    -webkit-padding-start: var(--sf-space-5);
            padding-inline-start: var(--sf-space-5);
    -webkit-padding-end: var(--sf-space-5);
            padding-inline-end: var(--sf-space-5);
  }
  .p-y-5 {
    padding-top: var(--sf-space-5);
    padding-bottom: var(--sf-space-5);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-inline-start-5 {
    padding-left: var(--sf-space-5);
  }
  @supports not (padding-inline-start: initial) {
  html:not([dir="rtl"]) .p-inline-start-5 {
    padding-left: var(--sf-space-5);
    }
  }
  .p-inline-start-5:where(:dir(ltr)) {
    padding-left: var(--sf-space-5);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-inline-start-5 {
    padding-right: var(--sf-space-5);
  }
  @supports not (padding-inline-start: initial) {
  [dir="rtl"] .p-inline-start-5 {
    padding-right: var(--sf-space-5);
    }
  }
  .p-inline-start-5:where(:dir(rtl)) {
    padding-right: var(--sf-space-5);
  }
  .p-inline-start-5 {
    -webkit-padding-start: var(--sf-space-5);
            padding-inline-start: var(--sf-space-5);
  }
  .p-6 {
    padding: var(--sf-space-6);
  }
  .p-top-6 {
    padding-top: var(--sf-space-6);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-inline-end-6 {
    padding-right: var(--sf-space-6);
  }
  @supports not (padding-inline-end: initial) {
  html:not([dir="rtl"]) .p-inline-end-6 {
    padding-right: var(--sf-space-6);
    }
  }
  .p-inline-end-6:where(:dir(ltr)) {
    padding-right: var(--sf-space-6);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-inline-end-6 {
    padding-left: var(--sf-space-6);
  }
  @supports not (padding-inline-end: initial) {
  [dir="rtl"] .p-inline-end-6 {
    padding-left: var(--sf-space-6);
    }
  }
  .p-inline-end-6:where(:dir(rtl)) {
    padding-left: var(--sf-space-6);
  }
  .p-inline-end-6 {
    -webkit-padding-end: var(--sf-space-6);
            padding-inline-end: var(--sf-space-6);
  }
  .p-bottom-6 {
    padding-bottom: var(--sf-space-6);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-x-6 {
    padding-left: var(--sf-space-6);
  }
  @supports not (padding-inline-start: initial) {
  html:not([dir="rtl"]) .p-x-6 {
    padding-left: var(--sf-space-6);
    }
  }
  .p-x-6:where(:dir(ltr)) {
    padding-left: var(--sf-space-6);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-x-6 {
    padding-right: var(--sf-space-6);
  }
  @supports not (padding-inline-start: initial) {
  [dir="rtl"] .p-x-6 {
    padding-right: var(--sf-space-6);
    }
  }
  .p-x-6:where(:dir(rtl)) {
    padding-right: var(--sf-space-6);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-x-6 {
    padding-right: var(--sf-space-6);
  }
  @supports not (padding-inline-end: initial) {
  html:not([dir="rtl"]) .p-x-6 {
    padding-right: var(--sf-space-6);
    }
  }
  .p-x-6:where(:dir(ltr)) {
    padding-right: var(--sf-space-6);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-x-6 {
    padding-left: var(--sf-space-6);
  }
  @supports not (padding-inline-end: initial) {
  [dir="rtl"] .p-x-6 {
    padding-left: var(--sf-space-6);
    }
  }
  .p-x-6:where(:dir(rtl)) {
    padding-left: var(--sf-space-6);
  }
  .p-x-6 {
    -webkit-padding-start: var(--sf-space-6);
            padding-inline-start: var(--sf-space-6);
    -webkit-padding-end: var(--sf-space-6);
            padding-inline-end: var(--sf-space-6);
  }
  .p-y-6 {
    padding-top: var(--sf-space-6);
    padding-bottom: var(--sf-space-6);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-inline-start-6 {
    padding-left: var(--sf-space-6);
  }
  @supports not (padding-inline-start: initial) {
  html:not([dir="rtl"]) .p-inline-start-6 {
    padding-left: var(--sf-space-6);
    }
  }
  .p-inline-start-6:where(:dir(ltr)) {
    padding-left: var(--sf-space-6);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-inline-start-6 {
    padding-right: var(--sf-space-6);
  }
  @supports not (padding-inline-start: initial) {
  [dir="rtl"] .p-inline-start-6 {
    padding-right: var(--sf-space-6);
    }
  }
  .p-inline-start-6:where(:dir(rtl)) {
    padding-right: var(--sf-space-6);
  }
  .p-inline-start-6 {
    -webkit-padding-start: var(--sf-space-6);
            padding-inline-start: var(--sf-space-6);
  }
  .p-7 {
    padding: var(--sf-space-7);
  }
  .p-top-7 {
    padding-top: var(--sf-space-7);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-inline-end-7 {
    padding-right: var(--sf-space-7);
  }
  @supports not (padding-inline-end: initial) {
  html:not([dir="rtl"]) .p-inline-end-7 {
    padding-right: var(--sf-space-7);
    }
  }
  .p-inline-end-7:where(:dir(ltr)) {
    padding-right: var(--sf-space-7);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-inline-end-7 {
    padding-left: var(--sf-space-7);
  }
  @supports not (padding-inline-end: initial) {
  [dir="rtl"] .p-inline-end-7 {
    padding-left: var(--sf-space-7);
    }
  }
  .p-inline-end-7:where(:dir(rtl)) {
    padding-left: var(--sf-space-7);
  }
  .p-inline-end-7 {
    -webkit-padding-end: var(--sf-space-7);
            padding-inline-end: var(--sf-space-7);
  }
  .p-bottom-7 {
    padding-bottom: var(--sf-space-7);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-x-7 {
    padding-left: var(--sf-space-7);
  }
  @supports not (padding-inline-start: initial) {
  html:not([dir="rtl"]) .p-x-7 {
    padding-left: var(--sf-space-7);
    }
  }
  .p-x-7:where(:dir(ltr)) {
    padding-left: var(--sf-space-7);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-x-7 {
    padding-right: var(--sf-space-7);
  }
  @supports not (padding-inline-start: initial) {
  [dir="rtl"] .p-x-7 {
    padding-right: var(--sf-space-7);
    }
  }
  .p-x-7:where(:dir(rtl)) {
    padding-right: var(--sf-space-7);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-x-7 {
    padding-right: var(--sf-space-7);
  }
  @supports not (padding-inline-end: initial) {
  html:not([dir="rtl"]) .p-x-7 {
    padding-right: var(--sf-space-7);
    }
  }
  .p-x-7:where(:dir(ltr)) {
    padding-right: var(--sf-space-7);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-x-7 {
    padding-left: var(--sf-space-7);
  }
  @supports not (padding-inline-end: initial) {
  [dir="rtl"] .p-x-7 {
    padding-left: var(--sf-space-7);
    }
  }
  .p-x-7:where(:dir(rtl)) {
    padding-left: var(--sf-space-7);
  }
  .p-x-7 {
    -webkit-padding-start: var(--sf-space-7);
            padding-inline-start: var(--sf-space-7);
    -webkit-padding-end: var(--sf-space-7);
            padding-inline-end: var(--sf-space-7);
  }
  .p-y-7 {
    padding-top: var(--sf-space-7);
    padding-bottom: var(--sf-space-7);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-inline-start-7 {
    padding-left: var(--sf-space-7);
  }
  @supports not (padding-inline-start: initial) {
  html:not([dir="rtl"]) .p-inline-start-7 {
    padding-left: var(--sf-space-7);
    }
  }
  .p-inline-start-7:where(:dir(ltr)) {
    padding-left: var(--sf-space-7);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-inline-start-7 {
    padding-right: var(--sf-space-7);
  }
  @supports not (padding-inline-start: initial) {
  [dir="rtl"] .p-inline-start-7 {
    padding-right: var(--sf-space-7);
    }
  }
  .p-inline-start-7:where(:dir(rtl)) {
    padding-right: var(--sf-space-7);
  }
  .p-inline-start-7 {
    -webkit-padding-start: var(--sf-space-7);
            padding-inline-start: var(--sf-space-7);
  }
  .p-8 {
    padding: var(--sf-space-8);
  }
  .p-top-8 {
    padding-top: var(--sf-space-8);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-inline-end-8 {
    padding-right: var(--sf-space-8);
  }
  @supports not (padding-inline-end: initial) {
  html:not([dir="rtl"]) .p-inline-end-8 {
    padding-right: var(--sf-space-8);
    }
  }
  .p-inline-end-8:where(:dir(ltr)) {
    padding-right: var(--sf-space-8);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-inline-end-8 {
    padding-left: var(--sf-space-8);
  }
  @supports not (padding-inline-end: initial) {
  [dir="rtl"] .p-inline-end-8 {
    padding-left: var(--sf-space-8);
    }
  }
  .p-inline-end-8:where(:dir(rtl)) {
    padding-left: var(--sf-space-8);
  }
  .p-inline-end-8 {
    -webkit-padding-end: var(--sf-space-8);
            padding-inline-end: var(--sf-space-8);
  }
  .p-bottom-8 {
    padding-bottom: var(--sf-space-8);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-x-8 {
    padding-left: var(--sf-space-8);
  }
  @supports not (padding-inline-start: initial) {
  html:not([dir="rtl"]) .p-x-8 {
    padding-left: var(--sf-space-8);
    }
  }
  .p-x-8:where(:dir(ltr)) {
    padding-left: var(--sf-space-8);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-x-8 {
    padding-right: var(--sf-space-8);
  }
  @supports not (padding-inline-start: initial) {
  [dir="rtl"] .p-x-8 {
    padding-right: var(--sf-space-8);
    }
  }
  .p-x-8:where(:dir(rtl)) {
    padding-right: var(--sf-space-8);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-x-8 {
    padding-right: var(--sf-space-8);
  }
  @supports not (padding-inline-end: initial) {
  html:not([dir="rtl"]) .p-x-8 {
    padding-right: var(--sf-space-8);
    }
  }
  .p-x-8:where(:dir(ltr)) {
    padding-right: var(--sf-space-8);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-x-8 {
    padding-left: var(--sf-space-8);
  }
  @supports not (padding-inline-end: initial) {
  [dir="rtl"] .p-x-8 {
    padding-left: var(--sf-space-8);
    }
  }
  .p-x-8:where(:dir(rtl)) {
    padding-left: var(--sf-space-8);
  }
  .p-x-8 {
    -webkit-padding-start: var(--sf-space-8);
            padding-inline-start: var(--sf-space-8);
    -webkit-padding-end: var(--sf-space-8);
            padding-inline-end: var(--sf-space-8);
  }
  .p-y-8 {
    padding-top: var(--sf-space-8);
    padding-bottom: var(--sf-space-8);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .p-inline-start-8 {
    padding-left: var(--sf-space-8);
  }
  @supports not (padding-inline-start: initial) {
  html:not([dir="rtl"]) .p-inline-start-8 {
    padding-left: var(--sf-space-8);
    }
  }
  .p-inline-start-8:where(:dir(ltr)) {
    padding-left: var(--sf-space-8);
  }
  _:-ms-input-placeholder, [dir="rtl"] .p-inline-start-8 {
    padding-right: var(--sf-space-8);
  }
  @supports not (padding-inline-start: initial) {
  [dir="rtl"] .p-inline-start-8 {
    padding-right: var(--sf-space-8);
    }
  }
  .p-inline-start-8:where(:dir(rtl)) {
    padding-right: var(--sf-space-8);
  }
  .p-inline-start-8 {
    -webkit-padding-start: var(--sf-space-8);
            padding-inline-start: var(--sf-space-8);
  }
}

/* docara-shell-source: runtime/utility/position/default/css/default.css */
@layer sf.utilities {
  .static {
    position: static;
  }
  .fixed {
    position: fixed;
  }
  .absolute {
    position: absolute;
  }
  .relative {
    position: relative;
  }
  .sticky {
    position: sticky;
  }
}

/* docara-shell-source: runtime/utility/sr-only/default/css/default.css */
@layer sf.utilities {
  .sr-only {
    position: absolute;
    width: var(--sf-px);
    height: var(--sf-px);
    padding: 0;
    margin: calc(-1 * var(--sf-px));
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
  }
  .not-sr-only {
    position: static;
    width: auto;
    height: auto;
    padding: 0;
    margin: 0;
    overflow: visible;
    clip: auto;
    white-space: normal;
  }
}

/* docara-shell-source: runtime/utility/table-border/default/css/default.css */
@layer sf.utilities {
  .table-border > :not(caption) > * {
    border-width: var(--sf-px) var(--sf-0);
  }
  .table-border > :not(caption) > * > * {
    border-width: var(--sf-0) var(--sf-px);
  }
}

/* docara-shell-source: runtime/utility/table-stripe/default/css/default.css */
@layer sf.utilities {
  .table-stripe > tbody > tr:nth-of-type(odd) > * {
    --sf-table-accent-bg: var(--sf-table-stripe-bg);
    color: var(--sf-table-stripe-color);
  }
  .table-stripe-col > :not(caption) > tr > :nth-child(2n) {
    --sf-table-accent-bg: var(--sf-table-stripe-bg);
    color: var(--sf-table-stripe-color);
  }
}

/* docara-shell-source: runtime/utility/table/default/css/default.css */
@layer sf.utilities {
  table {
    caption-side: bottom;
    border-collapse: collapse;
  }
  tbody, td, tfoot, th, thead, tr {
    border-color: inherit;
    border-style: solid;
    border-width: 0;
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .table {
    text-align: left;
  }
  @supports not (text-align: start) {
  html:not([dir="rtl"]) .table {
    text-align: left;
    }
  }
  .table:where(:dir(ltr)) {
    text-align: left;
  }
  _:-ms-input-placeholder, [dir="rtl"] .table {
    text-align: right;
  }
  @supports not (text-align: start) {
  [dir="rtl"] .table {
    text-align: right;
    }
  }
  .table:where(:dir(rtl)) {
    text-align: right;
  }
  .table {
    --sf-table-color: var(--sf-on-surface);
    --sf-table-border-color: var(--sf-outline-variant);
    --sf-table-accent-bg: rgba(0, 0, 0, 0);
    --sf-table-stripe-color: var(--sf-on-surface);
    --sf-table-stripe-bg: var(--sf-surface-transparent-select);
    --sf-table-active-color: var(--sf-on-surface);
    --sf-table-active-bg: var(--sf-surface-transparent-select);
    --sf-table-hover-color: var(--sf-on-surface);
    --sf-table-hover-bg: var(--sf-surface-transparent-hover);
    width: 100%;
    margin-bottom: var(--sf-b6);
    color: var(--sf-table-color);
    vertical-align: top;
    border-color: var(--sf-table-border-color);
    text-align: start;
  }
  .table > :not(caption) > * > * {
    padding: 0.5rem 0.5rem;
    border-bottom-width: var(--sf-px);
    background-image: linear-gradient(var(--sf-table-accent-bg), var(--sf-table-accent-bg));
  }
  .table > tbody {
    vertical-align: inherit;
  }
  .table > thead {
    vertical-align: bottom;
  }
  .table-sm > :not(caption) > * > *,
  .table-small > :not(caption) > * > * {
    padding: 0.25rem 0.25rem;
  }
}

/* docara-shell-source: runtime/utility/text-color/default/css/default.css */
@layer sf.utilities {
  .color-transparent {
    color: var(--sf-transparent);
  }
  .color-current {
    color: var(--sf-current);
  }
  .color-inherit {
    color: var(--sf-inherit);
  }
  .color-on-surface {
    color: var(--sf-on-surface);
  }
  .color-on-surface-fixed {
    color: var(--sf-on-surface-fixed);
  }
  .color-on-surface-variant {
    color: var(--sf-on-surface-variant);
  }
  .color-on-surface-inverse {
    color: var(--sf-on-surface-inverse);
  }
  .color-on-surface-inverse-fixed {
    color: var(--sf-on-surface-inverse-fixed);
  }
  .color-disable {
    color: var(--sf-disable);
  }
  .color-on-disable {
    color: var(--sf-on-disable);
  }
  .color-primary {
    color: var(--sf-primary);
  }
  .color-on-primary {
    color: var(--sf-on-primary);
  }
  .color-on-primary-container {
    color: var(--sf-on-primary-container);
  }
  .color-on-primary-container-graphic {
    color: var(--sf-on-primary-container-graphic);
  }
  .color-secondary {
    color: var(--sf-secondary);
  }
  .color-on-secondary {
    color: var(--sf-on-secondary);
  }
  .color-on-secondary-container {
    color: var(--sf-on-secondary-container);
  }
  .color-on-secondary-container-graphic {
    color: var(--sf-on-secondary-container-graphic);
  }
  .color-tertiary {
    color: var(--sf-tertiary);
  }
  .color-on-tertiary {
    color: var(--sf-on-tertiary);
  }
  .color-on-tertiary-container {
    color: var(--sf-on-tertiary-container);
  }
  .color-on-tertiary-container-graphic {
    color: var(--sf-on-tertiary-container-graphic);
  }
  .color-error {
    color: var(--sf-error);
  }
  .color-on-error {
    color: var(--sf-on-error);
  }
  .color-on-error-container {
    color: var(--sf-on-error-container);
  }
  .color-on-error-container-graphic {
    color: var(--sf-on-error-container-graphic);
  }
  .color-warning {
    color: var(--sf-warning);
  }
  .color-on-warning {
    color: var(--sf-on-warning);
  }
  .color-on-warning-container {
    color: var(--sf-on-warning-container);
  }
  .color-on-warning-container-graphic {
    color: var(--sf-on-warning-container-graphic);
  }
  .color-success {
    color: var(--sf-success);
  }
  .color-on-success {
    color: var(--sf-on-success);
  }
  .color-on-success-container {
    color: var(--sf-on-success-container);
  }
  .color-on-success-container-graphic {
    color: var(--sf-on-success-container-graphic);
  }
  .color-white {
    color: rgb(255, 255, 255);
  }
  .color-black {
    color: rgb(0, 0, 0);
  }
  .color-gray {
    color: rgb(106, 115, 125);
  }
  .color-gray-0 {
    color: rgb(250, 251, 252);
  }
  .color-gray-1 {
    color: rgb(246, 248, 250);
  }
  .color-gray-2 {
    color: rgb(225, 228, 232);
  }
  .color-gray-3 {
    color: rgb(209, 213, 218);
  }
  .color-gray-4 {
    color: rgb(149, 157, 165);
  }
  .color-gray-5 {
    color: rgb(106, 115, 125);
  }
  .color-gray-6 {
    color: rgb(88, 96, 105);
  }
  .color-gray-7 {
    color: rgb(68, 77, 86);
  }
  .color-gray-8 {
    color: rgb(47, 54, 61);
  }
  .color-gray-9 {
    color: rgb(36, 41, 46);
  }
  .color-red {
    color: rgb(215, 58, 73);
  }
  .color-red-0 {
    color: rgb(255, 238, 240);
  }
  .color-red-1 {
    color: rgb(255, 220, 224);
  }
  .color-red-2 {
    color: rgb(253, 174, 183);
  }
  .color-red-3 {
    color: rgb(249, 117, 131);
  }
  .color-red-4 {
    color: rgb(234, 74, 90);
  }
  .color-red-5 {
    color: rgb(215, 58, 73);
  }
  .color-red-6 {
    color: rgb(203, 36, 49);
  }
  .color-red-7 {
    color: rgb(179, 29, 40);
  }
  .color-red-8 {
    color: rgb(158, 28, 35);
  }
  .color-red-9 {
    color: rgb(134, 24, 29);
  }
  .color-orange {
    color: rgb(246, 106, 10);
  }
  .color-orange-0 {
    color: rgb(255, 248, 242);
  }
  .color-orange-1 {
    color: rgb(255, 235, 218);
  }
  .color-orange-2 {
    color: rgb(255, 209, 172);
  }
  .color-orange-3 {
    color: rgb(255, 171, 112);
  }
  .color-orange-4 {
    color: rgb(251, 133, 50);
  }
  .color-orange-5 {
    color: rgb(246, 106, 10);
  }
  .color-orange-6 {
    color: rgb(227, 98, 9);
  }
  .color-orange-7 {
    color: rgb(209, 87, 4);
  }
  .color-orange-8 {
    color: rgb(194, 78, 0);
  }
  .color-orange-9 {
    color: rgb(160, 65, 0);
  }
  .color-yellow {
    color: rgb(255, 211, 61);
  }
  .color-yellow-0 {
    color: rgb(255, 253, 239);
  }
  .color-yellow-1 {
    color: rgb(255, 251, 221);
  }
  .color-yellow-2 {
    color: rgb(255, 245, 177);
  }
  .color-yellow-3 {
    color: rgb(255, 234, 127);
  }
  .color-yellow-4 {
    color: rgb(255, 223, 93);
  }
  .color-yellow-5 {
    color: rgb(255, 211, 61);
  }
  .color-yellow-6 {
    color: rgb(249, 197, 19);
  }
  .color-yellow-7 {
    color: rgb(219, 171, 9);
  }
  .color-yellow-8 {
    color: rgb(176, 136, 0);
  }
  .color-yellow-9 {
    color: rgb(115, 92, 15);
  }
  .color-green {
    color: rgb(40, 167, 69);
  }
  .color-green-0 {
    color: rgb(240, 255, 244);
  }
  .color-green-1 {
    color: rgb(220, 255, 228);
  }
  .color-green-2 {
    color: rgb(190, 245, 203);
  }
  .color-green-3 {
    color: rgb(133, 232, 157);
  }
  .color-green-4 {
    color: rgb(52, 208, 88);
  }
  .color-green-5 {
    color: rgb(40, 167, 69);
  }
  .color-green-6 {
    color: rgb(34, 134, 58);
  }
  .color-green-7 {
    color: rgb(23, 111, 44);
  }
  .color-green-8 {
    color: rgb(22, 92, 38);
  }
  .color-green-9 {
    color: rgb(20, 70, 32);
  }
  .color-blue {
    color: rgb(3, 102, 214);
  }
  .color-blue-0 {
    color: rgb(241, 248, 255);
  }
  .color-blue-1 {
    color: rgb(219, 237, 255);
  }
  .color-blue-2 {
    color: rgb(200, 225, 255);
  }
  .color-blue-3 {
    color: rgb(121, 184, 255);
  }
  .color-blue-4 {
    color: rgb(33, 136, 255);
  }
  .color-blue-5 {
    color: rgb(3, 102, 214);
  }
  .color-blue-6 {
    color: rgb(0, 92, 197);
  }
  .color-blue-7 {
    color: rgb(4, 66, 137);
  }
  .color-blue-8 {
    color: rgb(3, 47, 98);
  }
  .color-blue-9 {
    color: rgb(5, 38, 76);
  }
  .color-purple {
    color: rgb(111, 66, 193);
  }
  .color-purple-0 {
    color: rgb(245, 240, 255);
  }
  .color-purple-1 {
    color: rgb(230, 220, 253);
  }
  .color-purple-2 {
    color: rgb(209, 188, 249);
  }
  .color-purple-3 {
    color: rgb(179, 146, 240);
  }
  .color-purple-4 {
    color: rgb(138, 99, 210);
  }
  .color-purple-5 {
    color: rgb(111, 66, 193);
  }
  .color-purple-6 {
    color: rgb(90, 50, 163);
  }
  .color-purple-7 {
    color: rgb(76, 40, 136);
  }
  .color-purple-8 {
    color: rgb(58, 29, 110);
  }
  .color-purple-9 {
    color: rgb(41, 19, 78);
  }
  .color-pink {
    color: rgb(234, 74, 170);
  }
  .color-pink-0 {
    color: rgb(255, 238, 248);
  }
  .color-pink-1 {
    color: rgb(254, 219, 240);
  }
  .color-pink-2 {
    color: rgb(249, 179, 221);
  }
  .color-pink-3 {
    color: rgb(246, 146, 206);
  }
  .color-pink-4 {
    color: rgb(236, 108, 185);
  }
  .color-pink-5 {
    color: rgb(234, 74, 170);
  }
  .color-pink-6 {
    color: rgb(208, 53, 146);
  }
  .color-pink-7 {
    color: rgb(185, 58, 134);
  }
  .color-pink-8 {
    color: rgb(153, 48, 111);
  }
  .color-pink-9 {
    color: rgb(109, 34, 79);
  }
}

/* docara-shell-source: runtime/utility/text-decoration/default/css/default.css */
@layer sf.utilities {
  .underline {
    -webkit-text-decoration-line: underline;
            text-decoration-line: underline;
  }
  .overline {
    -webkit-text-decoration-line: overline;
            text-decoration-line: overline;
  }
  .line-through {
    -webkit-text-decoration-line: line-through;
            text-decoration-line: line-through;
  }
  .decoration-none {
    -webkit-text-decoration-line: none;
            text-decoration-line: none;
  }
}

/* docara-shell-source: runtime/utility/title/default/css/default.css */
@layer sf.utilities {
  .title-1 {
    font-size: var(--sf-text--size-1);
    line-height: var(--sf-title--height-1);
  }
  .title-2 {
    font-size: var(--sf-text--size-2);
    line-height: var(--sf-title--height-2);
  }
  .title-3 {
    font-size: var(--sf-text--size-3);
    line-height: var(--sf-title--height-3);
  }
  .title-4 {
    font-size: var(--sf-text--size-4);
    line-height: var(--sf-title--height-4);
  }
  .title-5 {
    font-size: var(--sf-text--size-5);
    line-height: var(--sf-title--height-5);
  }
  .title-6 {
    font-size: var(--sf-text--size-6);
    line-height: var(--sf-title--height-6);
  }
  .title-7 {
    font-size: var(--sf-text--size-7);
    line-height: var(--sf-title--height-7);
  }
  .title-8 {
    font-size: var(--sf-text--size-8);
    line-height: var(--sf-title--height-8);
  }
  .title-9 {
    font-size: var(--sf-text--size-9);
    line-height: var(--sf-title--height-9);
  }
  .title-10 {
    font-size: var(--sf-text--size-10);
    line-height: var(--sf-title--height-10);
  }
  .title-11 {
    font-size: var(--sf-text--size-11);
    line-height: var(--sf-title--height-11);
  }
  .title-12 {
    font-size: var(--sf-text--size-12);
    line-height: var(--sf-title--height-12);
  }
}

/* docara-shell-source: runtime/utility/transition-property/default/css/default.css */
@layer sf.utilities {
  .transition-none {
    transition-property: none;
  }
  .transition-all {
    transition-property: all;
    transition-timing-function: var(--sf-ease-move);
    transition-duration: var(--sf-duration-normal);
  }
  .transition {
    transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, -webkit-text-decoration-color, -webkit-transform, -webkit-filter, -webkit-backdrop-filter;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-transform, -webkit-filter, -webkit-backdrop-filter;
    transition-timing-function: var(--sf-ease-move);
    transition-duration: var(--sf-duration-normal);
  }
  .transition-colors {
    transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;
    transition-timing-function: var(--sf-ease-move);
    transition-duration: var(--sf-duration-normal);
  }
  .transition-opacity {
    transition-property: opacity;
    transition-timing-function: var(--sf-ease-move);
    transition-duration: var(--sf-duration-normal);
  }
  .transition-shadow {
    transition-property: box-shadow;
    transition-timing-function: var(--sf-ease-move);
    transition-duration: var(--sf-duration-normal);
  }
  .transition-transform {
    transition-property: -webkit-transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform;
    transition-timing-function: var(--sf-ease-move);
    transition-duration: var(--sf-duration-normal);
  }
  .transition-width {
    transition-property: width;
    transition-timing-function: var(--sf-ease-move);
    transition-duration: var(--sf-duration-normal);
  }
  .transition-height {
    transition-property: height;
    transition-timing-function: var(--sf-ease-move);
    transition-duration: var(--sf-duration-normal);
  }
  .transition-size {
    transition-property: width, height;
    transition-timing-function: var(--sf-ease-move);
    transition-duration: var(--sf-duration-normal);
  }
  .transition-max-width {
    transition-property: max-width;
    transition-timing-function: var(--sf-ease-move);
    transition-duration: var(--sf-duration-normal);
  }
  .transition-max-height {
    transition-property: max-height;
    transition-timing-function: var(--sf-ease-move);
    transition-duration: var(--sf-duration-normal);
  }
  .transition-max-size {
    transition-property: max-width, max-height;
    transition-timing-function: var(--sf-ease-move);
    transition-duration: var(--sf-duration-normal);
  }
  .transition-flex {
    transition-property: flex, flex-basis;
    transition-timing-function: var(--sf-ease-move);
    transition-duration: var(--sf-duration-normal);
  }
  .transition-flex-basis {
    transition-property: flex-basis;
    transition-timing-function: var(--sf-ease-move);
    transition-duration: var(--sf-duration-normal);
  }
  .transition-layout {
    transition-property: flex-grow, flex-shrink, flex-basis, width, min-width, max-width;
    transition-timing-function: var(--sf-ease-move);
    transition-duration: var(--sf-duration-normal);
  }
}