/*!*************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/@angular-devkit/build-angular/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[9].rules[0].oneOf[0].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[9].rules[0].oneOf[0].use[2]!./node_modules/resolve-url-loader/index.js??ruleSet[1].rules[9].rules[1].use[0]!./node_modules/@angular-devkit/build-angular/node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[9].rules[1].use[1]!./src/styles.scss?ngGlobalStyle ***!
  \*************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
@charset "UTF-8";
/* You can add global styles to this file, and also import other style files */
@keyframes floatingText {
  0% {
    transform: translate(0);
  }
  50% {
    transform: translate(calc(-100% + 26px / 2));
  }
  100% {
    transform: translate(0);
  }
}
@keyframes loader {
  40% {
    opacity: 1;
  }
}
@keyframes loadingProgressbar {
  0% {
    transform: scaleX(0);
  }
  50% {
    transform: scaleX(1);
  }
  100% {
    transform: translateX(100%);
  }
}
@keyframes loadingSkeleton {
  0% {
    opacity: 0.7;
  }
  50% {
    opacity: 0.8;
  }
  100% {
    opacity: 0.9;
  }
}
@keyframes pulsingColorLoading {
  0% {
    background-color: #f5f5f5;
  }
  50% {
    background-color: rgb(250.1, 250.1, 250.1);
  }
  100% {
    background-color: rgb(246.275, 246.275, 246.275);
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes floatingText {
  0% {
    transform: translate(0);
  }
  50% {
    transform: translate(calc(-100% + 26px / 2));
  }
  100% {
    transform: translate(0);
  }
}
@keyframes loader {
  40% {
    opacity: 1;
  }
}
@keyframes loadingProgressbar {
  0% {
    transform: scaleX(0);
  }
  50% {
    transform: scaleX(1);
  }
  100% {
    transform: translateX(100%);
  }
}
@keyframes loadingSkeleton {
  0% {
    opacity: 0.7;
  }
  50% {
    opacity: 0.8;
  }
  100% {
    opacity: 0.9;
  }
}
@keyframes pulsingColorLoading {
  0% {
    background-color: #f5f5f5;
  }
  50% {
    background-color: rgb(250.1, 250.1, 250.1);
  }
  100% {
    background-color: rgb(246.275, 246.275, 246.275);
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@font-face {
  font-family: "WebComponentsIcons";
  font-style: normal;
  font-weight: normal;
  src: url('kendo-font-icons.0f48fbe137cdbe1a.ttf') format("truetype");
}
.k-font-icon {
  width: 1em;
  height: 1em;
  outline: 0;
  font-size: 16px;
  font-family: "WebComponentsIcons";
  font-style: normal;
  font-variant: normal;
  font-weight: normal;
  line-height: 1;
  speak: none;
  text-transform: none;
  text-decoration: none;
  flex-shrink: 0;
  display: inline-flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
  position: relative;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
}

.k-font-icon:hover, .k-font-icon:focus {
  text-decoration: none;
}

.k-i-none::before {
  display: none !important;
}

.k-icon-xs {
  font-size: calc(16px * 0.75);
}

.k-icon-sm {
  font-size: calc(16px * 0.875);
}

.k-icon-md {
  font-size: 16px;
}

.k-icon-lg {
  font-size: calc(16px * 1.25);
}

.k-icon-xl {
  font-size: calc(16px * 1.5);
}

.k-icon-xxl {
  font-size: calc(16px * 2);
}

.k-icon-xxxl {
  font-size: calc(16px * 3);
}

.k-flip-h, .k-flip-x {
  transform: scaleX(-1);
}

.k-flip-v, .k-flip-y {
  transform: scaleY(-1);
}

.k-flip-h.k-flip-v, .k-flip-v.k-flip-x, .k-flip-h.k-flip-y, .k-flip-x.k-flip-y,
.k-flip-both {
  transform: scale(-1, -1);
}

.k-rotate-0 {
  transform: rotate(0deg);
}

.k-rotate-45 {
  transform: rotate(45deg);
}

.k-rotate-90 {
  transform: rotate(90deg);
}

.k-rotate-135 {
  transform: rotate(135deg);
}

.k-rotate-180 {
  transform: rotate(180deg);
}

.k-rotate-225 {
  transform: rotate(225deg);
}

.k-rotate-270 {
  transform: rotate(270deg);
}

.k-rotate-315 {
  transform: rotate(315deg);
}

.k-i-caret-tr::before {
  content: "\e000";
}

.k-i-arrow-45-up-right::before {
  content: "\e000";
}

.k-i-collapse-ne::before {
  content: "\e000";
}

.k-i-resize-ne::before {
  content: "\e000";
}

.k-i-caret-br::before {
  content: "\e001";
}

.k-i-arrow-45-down-right::before {
  content: "\e001";
}

.k-i-collapse-se::before {
  content: "\e001";
}

.k-i-resize-se::before {
  content: "\e001";
}

.k-i-caret-bl::before {
  content: "\e002";
}

.k-i-arrow-45-down-left::before {
  content: "\e002";
}

.k-i-collapse-sw::before {
  content: "\e002";
}

.k-i-resize-sw::before {
  content: "\e002";
}

.k-i-caret-tl::before {
  content: "\e003";
}

.k-i-arrow-45-up-left::before {
  content: "\e003";
}

.k-i-collapse-nw::before {
  content: "\e003";
}

.k-i-resize-nw::before {
  content: "\e003";
}

.k-i-caret-alt-up::before {
  content: "\e004";
}

.k-i-arrow-60-up::before {
  content: "\e004";
}

.k-i-arrow-n::before {
  content: "\e004";
}

.k-i-kpi-trend-increase::before {
  content: "\e004";
}

.k-i-expand-n::before {
  content: "\e004";
}

.k-i-sarrow-n::before {
  content: "\e004";
}

.k-i-caret-alt-right::before {
  content: "\e005";
}

.k-i-arrow-60-right::before {
  content: "\e005";
}

.k-i-arrow-e::before {
  content: "\e005";
}

.k-i-expand::before {
  content: "\e005";
}

.k-i-expand-e::before {
  content: "\e005";
}

.k-i-sarrow-e::before {
  content: "\e005";
}

.k-i-caret-alt-down::before {
  content: "\e006";
}

.k-i-arrow-60-down::before {
  content: "\e006";
}

.k-i-arrow-s::before {
  content: "\e006";
}

.k-i-kpi-trend-decrease::before {
  content: "\e006";
}

.k-i-expand-s::before {
  content: "\e006";
}

.k-i-collapse::before {
  content: "\e006";
}

.k-i-sarrow-s::before {
  content: "\e006";
}

.k-i-caret-alt-left::before {
  content: "\e007";
}

.k-i-arrow-60-left::before {
  content: "\e007";
}

.k-i-arrow-w::before {
  content: "\e007";
}

.k-i-expand-w::before {
  content: "\e007";
}

.k-i-sarrow-w::before {
  content: "\e007";
}

.k-i-caret-alt-to-top::before {
  content: "\e008";
}

.k-i-arrow-end-up::before {
  content: "\e008";
}

.k-i-seek-n::before {
  content: "\e008";
}

.k-i-caret-alt-to-right::before {
  content: "\e009";
}

.k-i-arrow-end-right::before {
  content: "\e009";
}

.k-i-seek-e::before {
  content: "\e009";
}

.k-i-caret-alt-to-bottom::before {
  content: "\e00a";
}

.k-i-arrow-end-down::before {
  content: "\e00a";
}

.k-i-seek-s::before {
  content: "\e00a";
}

.k-i-caret-alt-to-left::before {
  content: "\e00b";
}

.k-i-arrow-end-left::before {
  content: "\e00b";
}

.k-i-seek-w::before {
  content: "\e00b";
}

.k-i-caret-double-alt-up::before {
  content: "\e00c";
}

.k-i-arrow-double-60-up::before {
  content: "\e00c";
}

.k-i-arrow-seek-up::before {
  content: "\e00c";
}

.k-i-caret-double-alt-right::before {
  content: "\e00d";
}

.k-i-arrow-double-60-right::before {
  content: "\e00d";
}

.k-i-arrow-seek-right::before {
  content: "\e00d";
}

.k-i-forward-sm::before {
  content: "\e00d";
}

.k-i-caret-double-alt-down::before {
  content: "\e00e";
}

.k-i-arrow-double-60-down::before {
  content: "\e00e";
}

.k-i-arrow-seek-down::before {
  content: "\e00e";
}

.k-i-caret-double-alt-left::before {
  content: "\e00f";
}

.k-i-arrow-double-60-left::before {
  content: "\e00f";
}

.k-i-arrow-seek-left::before {
  content: "\e00f";
}

.k-i-rewind-sm::before {
  content: "\e00f";
}

.k-i-caret-alt-expand::before {
  content: "\e010";
}

.k-i-arrows-kpi::before {
  content: "\e010";
}

.k-i-kpi::before {
  content: "\e010";
}

.k-i-caret-alt-sort::before {
  content: "\e010";
}

.k-i-arrows-no-change::before {
  content: "\e011";
}

.k-i-arrow-overflow-down::before {
  content: "\e012";
}

.k-i-chevron-up::before {
  content: "\e013";
}

.k-i-arrow-chevron-up::before {
  content: "\e013";
}

.k-i-arrowhead-n::before {
  content: "\e013";
}

.k-i-chevron-right::before {
  content: "\e014";
}

.k-i-arrow-chevron-right::before {
  content: "\e014";
}

.k-i-arrowhead-e::before {
  content: "\e014";
}

.k-i-chevron-down::before {
  content: "\e015";
}

.k-i-arrow-chevron-down::before {
  content: "\e015";
}

.k-i-arrowhead-s::before {
  content: "\e015";
}

.k-i-chevron-left::before {
  content: "\e016";
}

.k-i-arrow-chevron-left::before {
  content: "\e016";
}

.k-i-arrowhead-w::before {
  content: "\e016";
}

.k-i-arrow-up::before {
  content: "\e017";
}

.k-i-arrow-right::before {
  content: "\e018";
}

.k-i-arrow-down::before {
  content: "\e019";
}

.k-i-arrow-left::before {
  content: "\e01a";
}

.k-i-level-down::before {
  content: "\e01b";
}

.k-i-arrow-drill::before {
  content: "\e01b";
}

.k-i-level-up::before {
  content: "\e01c";
}

.k-i-arrow-parent::before {
  content: "\e01c";
}

.k-i-level-to-top::before {
  content: "\e01d";
}

.k-i-arrow-root::before {
  content: "\e01d";
}

.k-i-level-root::before {
  content: "\e01d";
}

.k-i-col-resize::before {
  content: "\e01e";
}

.k-i-arrows-resizing::before {
  content: "\e01e";
}

.k-i-arrows-axes::before {
  content: "\e01f";
}

.k-i-arrows-dimensions::before {
  content: "\e01f";
}

.k-i-dimension::before {
  content: "\e01f";
}

.k-i-arrows-swap::before {
  content: "\e020";
}

.k-i-drag-and-drop::before {
  content: "\e021";
}

.k-i-categorize::before {
  content: "\e022";
}

.k-i-grid::before {
  content: "\e023";
}

.k-i-grid-layout::before {
  content: "\e024";
}

.k-i-group::before {
  content: "\e025";
}

.k-i-ungroup::before {
  content: "\e026";
}

.k-i-handle-drag::before {
  content: "\e027";
}

.k-i-handler-drag::before {
  content: "\e027";
}

.k-i-layout::before {
  content: "\e028";
}

.k-i-layout-1-by-4::before {
  content: "\e029";
}

.k-i-layout-2-by-2::before {
  content: "\e02a";
}

.k-i-page-layout::before {
  content: "\e02a";
}

.k-i-layout-side-by-side::before {
  content: "\e02b";
}

.k-i-layout-stacked::before {
  content: "\e02c";
}

.k-i-columns::before {
  content: "\e02d";
}

.k-i-rows::before {
  content: "\e02e";
}

.k-i-reorder::before {
  content: "\e02f";
}

.k-i-menu::before {
  content: "\e030";
}

.k-i-hamburger::before {
  content: "\e030";
}

.k-i-more-vertical::before {
  content: "\e031";
}

.k-i-more-v::before {
  content: "\e031";
}

.k-i-vbars::before {
  content: "\e031";
}

.k-i-more-horizontal::before {
  content: "\e032";
}

.k-i-more-h::before {
  content: "\e032";
}

.k-i-hbars::before {
  content: "\e032";
}

.k-i-overlap::before {
  content: "\e033";
}

.k-i-home::before {
  content: "\e034";
}

.k-i-root::before {
  content: "\e034";
}

.k-i-arrows-left-right::before {
  content: "\e035";
}

.k-i-arrows-top-bottom::before {
  content: "\e036";
}

.k-i-border-radius-bottom-left::before {
  content: "\e037";
}

.k-i-border-radius-bottom-right::before {
  content: "\e038";
}

.k-i-border-radius-top-left::before {
  content: "\e039";
}

.k-i-border-radius-top-right::before {
  content: "\e03a";
}

.k-i-border-radius::before {
  content: "\e03b";
}

.k-i-border-style-bottom::before {
  content: "\e03c";
}

.k-i-border-style-left::before {
  content: "\e03d";
}

.k-i-border-style-right::before {
  content: "\e03e";
}

.k-i-border-style-top::before {
  content: "\e03f";
}

.k-i-border-style::before {
  content: "\e040";
}

.k-i-box-sizing::before {
  content: "\e041";
}

.k-i-chevron-double-down::before {
  content: "\e042";
}

.k-i-chevron-double-left::before {
  content: "\e043";
}

.k-i-chevron-double-right::before {
  content: "\e044";
}

.k-i-chevron-double-up::before {
  content: "\e045";
}

.k-i-data-ods::before {
  content: "\e046";
}

.k-i-non-recurrence::before {
  content: "\e047";
}

.k-i-display-block::before {
  content: "\e048";
}

.k-i-display-flex::before {
  content: "\e049";
}

.k-i-display-inline-flex::before {
  content: "\e04a";
}

.k-i-droplet-slider::before {
  content: "\e04b";
}

.k-i-color-canvas::before {
  content: "\e04b";
}

.k-i-file-report::before {
  content: "\e04c";
}

.k-i-gap-column::before {
  content: "\e04d";
}

.k-i-gap-row::before {
  content: "\e04e";
}

.k-i-handle-resize-alt::before {
  content: "\e04f";
}

.k-i-handle-resize::before {
  content: "\e050";
}

.k-i-images::before {
  content: "\e051";
}

.k-i-letter-space::before {
  content: "\e052";
}

.k-i-line-height::before {
  content: "\e053";
}

.k-i-list-latin-big::before {
  content: "\e054";
}

.k-i-list-latin-small::before {
  content: "\e055";
}

.k-i-list-roman-big::before {
  content: "\e056";
}

.k-i-list-roman-small::before {
  content: "\e057";
}

.k-i-list-unordered-outline::before {
  content: "\e058";
}

.k-i-list-unordered-square::before {
  content: "\e059";
}

.k-i-max-height::before {
  content: "\e05a";
}

.k-i-max-width::before {
  content: "\e05b";
}

.k-i-min-height::before {
  content: "\e05c";
}

.k-i-min-width::before {
  content: "\e05d";
}

.k-i-outline-offset::before {
  content: "\e05e";
}

.k-i-outline-width::before {
  content: "\e05f";
}

.k-i-padding-bottom::before {
  content: "\e060";
}

.k-i-padding-left::before {
  content: "\e061";
}

.k-i-padding-right::before {
  content: "\e062";
}

.k-i-padding-top::before {
  content: "\e063";
}

.k-i-padding::before {
  content: "\e064";
}

.k-i-position-bottom::before {
  content: "\e065";
}

.k-i-position-left::before {
  content: "\e066";
}

.k-i-position-right::before {
  content: "\e067";
}

.k-i-position-top::before {
  content: "\e068";
}

.k-i-regular-expression::before {
  content: "\e069";
}

.k-i-replace-all::before {
  content: "\e06a";
}

.k-i-replace-single::before {
  content: "\e06b";
}

.k-i-report-element::before {
  content: "\e06c";
}

.k-i-right-double-quotes::before {
  content: "\e06d";
}

.k-i-blockquote::before {
  content: "\e06d";
}

.k-i-whole-word::before {
  content: "\e06e";
}

.k-i-data-sds::before {
  content: "\e06f";
}

.k-i-download-light::before {
  content: "\e070";
}

.k-i-eye-slash::before {
  content: "\e071";
}

.k-i-preview-off::before {
  content: "\e071";
}

.k-i-display-inline-block::before {
  content: "\e072";
}

.k-i-paper-plane::before {
  content: "\e073";
}

.k-i-gauge-linear::before {
  content: "\e074";
}

.k-i-gauge-radial::before {
  content: "\e075";
}

.k-i-envelope-box::before {
  content: "\e076";
}

.k-i-envelope-link::before {
  content: "\e077";
}

.k-i-envelope::before {
  content: "\e078";
}

.k-i-warning-circle::before {
  content: "\e079";
}

.k-i-warning-triangle::before {
  content: "\e07a";
}

.k-i-info-solid::before {
  content: "\e07b";
}

.k-i-font-grow::before {
  content: "\e07c";
}

.k-i-font-shrink::before {
  content: "\e07d";
}

.k-i-text-overflow::before {
  content: "\e07e";
}

.k-i-text-wrap-arrow::before {
  content: "\e07f";
}

.k-i-text-truncate::before {
  content: "\e080";
}

.k-i-text-clip::before {
  content: "\e081";
}

.k-i-border-color::before {
  content: "\e082";
}

.k-i-border-type::before {
  content: "\e083";
}

.k-i-thumb-down-outline::before {
  content: "\e084";
}

.k-i-thumb-down::before {
  content: "\e085";
}

.k-i-thumb-up-outline::before {
  content: "\e086";
}

.k-i-thumb-up::before {
  content: "\e087";
}

.k-i-sparkles::before {
  content: "\e088";
}

.k-i-paragraph-mark::before {
  content: "\e089";
}

.k-i-pilcrow::before {
  content: "\e089";
}

.k-i-paragraph-height::before {
  content: "\e08a";
}

.k-i-user-outline::before {
  content: "\e08b";
}

.k-i-wallet-solid::before {
  content: "\e08c";
}

.k-i-stamp::before {
  content: "\e08d";
}

.k-i-sticky-note::before {
  content: "\e08e";
}

.k-i-ruler-outline::before {
  content: "\e08f";
}

.k-i-eraser-outline::before {
  content: "\e090";
}

.k-i-edit-annotations::before {
  content: "\e091";
}

.k-i-highlight::before {
  content: "\e092";
}

.k-i-highlight-free::before {
  content: "\e093";
}

.k-i-free-text::before {
  content: "\e094";
}

.k-i-x-logo::before {
  content: "\e095";
}

.k-i-undo::before {
  content: "\e100";
}

.k-i-undo-large::before {
  content: "\e100";
}

.k-i-redo::before {
  content: "\e101";
}

.k-i-redo-large::before {
  content: "\e101";
}

.k-i-arrow-rotate-ccw::before {
  content: "\e102";
}

.k-i-reset::before {
  content: "\e102";
}

.k-i-arrow-rotate-cw::before {
  content: "\e103";
}

.k-i-reload::before {
  content: "\e103";
}

.k-i-refresh::before {
  content: "\e103";
}

.k-i-recurrence::before {
  content: "\e103";
}

.k-i-arrows-repeat::before {
  content: "\e103";
}

.k-i-arrows-no-repeat::before {
  content: "\e104";
}

.k-i-non-recurrence::before {
  content: "\e104";
}

.k-i-refresh-clear::before {
  content: "\e104";
}

.k-i-arrow-rotate-ccw-small::before {
  content: "\e105";
}

.k-i-reset-sm::before {
  content: "\e105";
}

.k-i-arrow-rotate-cw-small::before {
  content: "\e106";
}

.k-i-reload-sm::before {
  content: "\e106";
}

.k-i-refresh-sm::before {
  content: "\e106";
}

.k-i-recurrence-sm::before {
  content: "\e106";
}

.k-i-arrows-repeat-sm::before {
  content: "\e106";
}

.k-i-clock::before {
  content: "\e107";
}

.k-i-calendar::before {
  content: "\e108";
}

.k-i-save::before {
  content: "\e109";
}

.k-i-floppy::before {
  content: "\e109";
}

.k-i-print::before {
  content: "\e10a";
}

.k-i-printer::before {
  content: "\e10a";
}

.k-i-pencil::before {
  content: "\e10b";
}

.k-i-edit::before {
  content: "\e10b";
}

.k-i-trash::before {
  content: "\e10c";
}

.k-i-delete::before {
  content: "\e10c";
}

.k-i-paperclip::before {
  content: "\e10d";
}

.k-i-attachment::before {
  content: "\e10d";
}

.k-i-clip::before {
  content: "\e10d";
}

.k-i-paperclip-alt::before {
  content: "\e10e";
}

.k-i-attachment-45::before {
  content: "\e10e";
}

.k-i-clip-45::before {
  content: "\e10e";
}

.k-i-link::before {
  content: "\e10f";
}

.k-i-link-horizontal::before {
  content: "\e10f";
}

.k-i-hyperlink::before {
  content: "\e10f";
}

.k-i-link-h::before {
  content: "\e10f";
}

.k-i-unlink::before {
  content: "\e110";
}

.k-i-unlink-horizontal::before {
  content: "\e110";
}

.k-i-hyperlink-remove::before {
  content: "\e110";
}

.k-i-unlink-h::before {
  content: "\e110";
}

.k-i-link-vertical::before {
  content: "\e111";
}

.k-i-link-v::before {
  content: "\e111";
}

.k-i-unlink-vertical::before {
  content: "\e112";
}

.k-i-unlink-v::before {
  content: "\e112";
}

.k-i-lock::before {
  content: "\e113";
}

.k-i-unlock::before {
  content: "\e114";
}

.k-i-cancel::before {
  content: "\e115";
}

.k-i-cancel-outline::before {
  content: "\e116";
}

.k-i-deny::before {
  content: "\e116";
}

.k-i-cancel-circle::before {
  content: "\e117";
}

.k-i-check::before {
  content: "\e118";
}

.k-i-checkmark::before {
  content: "\e118";
}

.k-i-tick::before {
  content: "\e118";
}

.k-i-check-outline::before {
  content: "\e119";
}

.k-i-checkmark-outline::before {
  content: "\e119";
}

.k-i-success::before {
  content: "\e119";
}

.k-i-check-circle::before {
  content: "\e11a";
}

.k-i-checkmark-circle::before {
  content: "\e11a";
}

.k-i-x::before {
  content: "\e11b";
}

.k-i-close::before {
  content: "\e11b";
}

.k-i-clear::before {
  content: "\e11b";
}

.k-i-times::before {
  content: "\e11b";
}

.k-i-group-delete::before {
  content: "\e11b";
}

.k-i-x-outline::before {
  content: "\e11c";
}

.k-i-close-outline::before {
  content: "\e11c";
}

.k-i-clear-outline::before {
  content: "\e11c";
}

.k-i-times-outline::before {
  content: "\e11c";
}

.k-i-error::before {
  content: "\e11c";
}

.k-i-x-circle::before {
  content: "\e11d";
}

.k-i-close-circle::before {
  content: "\e11d";
}

.k-i-clear-circle::before {
  content: "\e11d";
}

.k-i-times-circle::before {
  content: "\e11d";
}

.k-i-plus::before {
  content: "\e11e";
}

.k-i-add::before {
  content: "\e11e";
}

.k-i-plus-outline::before {
  content: "\e11f";
}

.k-i-add-outline::before {
  content: "\e11f";
}

.k-i-plus-circle::before {
  content: "\e120";
}

.k-i-add-circle::before {
  content: "\e120";
}

.k-i-minus::before {
  content: "\e121";
}

.k-i-kpi-trend-equal::before {
  content: "\e121";
}

.k-i-minus-outline::before {
  content: "\e122";
}

.k-i-minus-circle::before {
  content: "\e123";
}

.k-i-sort-asc::before {
  content: "\e124";
}

.k-i-sort-desc::before {
  content: "\e125";
}

.k-i-sort-clear::before {
  content: "\e126";
}

.k-i-unsort::before {
  content: "\e126";
}

.k-i-sort-asc-small::before {
  content: "\e127";
}

.k-i-sort-asc-sm::before {
  content: "\e127";
}

.k-i-sort-desc-small::before {
  content: "\e128";
}

.k-i-sort-desc-sm::before {
  content: "\e128";
}

.k-i-filter::before {
  content: "\e129";
}

.k-i-filter-clear::before {
  content: "\e12a";
}

.k-i-filter-small::before {
  content: "\e12b";
}

.k-i-filter-sm::before {
  content: "\e12b";
}

.k-i-filter-sort-asc-small::before {
  content: "\e12c";
}

.k-i-filter-sort-asc-sm::before {
  content: "\e12c";
}

.k-i-filter-sort-desc-small::before {
  content: "\e12d";
}

.k-i-filter-sort-desc-sm::before {
  content: "\e12d";
}

.k-i-filter-add-expression::before {
  content: "\e12e";
}

.k-i-filter-add-group::before {
  content: "\e12f";
}

.k-i-login::before {
  content: "\e130";
}

.k-i-sign-in::before {
  content: "\e130";
}

.k-i-logout::before {
  content: "\e131";
}

.k-i-sign-out::before {
  content: "\e131";
}

.k-i-download::before {
  content: "\e132";
}

.k-i-upload::before {
  content: "\e133";
}

.k-i-hyperlink-open::before {
  content: "\e134";
}

.k-i-hyperlink-open-sm::before {
  content: "\e135";
}

.k-i-launch::before {
  content: "\e136";
}

.k-i-window::before {
  content: "\e137";
}

.k-i-window-maximize::before {
  content: "\e137";
}

.k-i-maximize::before {
  content: "\e137";
}

.k-i-window-restore::before {
  content: "\e138";
}

.k-i-windows::before {
  content: "\e138";
}

.k-i-tiles::before {
  content: "\e138";
}

.k-i-restore::before {
  content: "\e138";
}

.k-i-window-minimize::before {
  content: "\e139";
}

.k-i-minimize::before {
  content: "\e139";
}

.k-i-gear::before {
  content: "\e13a";
}

.k-i-cog::before {
  content: "\e13a";
}

.k-i-custom::before {
  content: "\e13a";
}

.k-i-gears::before {
  content: "\e13b";
}

.k-i-cogs::before {
  content: "\e13b";
}

.k-i-wrench::before {
  content: "\e13c";
}

.k-i-settings::before {
  content: "\e13c";
}

.k-i-eye::before {
  content: "\e13d";
}

.k-i-preview::before {
  content: "\e13d";
}

.k-i-search::before {
  content: "\e13e";
}

.k-i-zoom::before {
  content: "\e13e";
}

.k-i-zoom-in::before {
  content: "\e13f";
}

.k-i-zoom-out::before {
  content: "\e140";
}

.k-i-arrows-move::before {
  content: "\e141";
}

.k-i-pan::before {
  content: "\e141";
}

.k-i-move::before {
  content: "\e141";
}

.k-i-calculator::before {
  content: "\e142";
}

.k-i-cart::before {
  content: "\e143";
}

.k-i-shopping-cart::before {
  content: "\e143";
}

.k-i-connector::before {
  content: "\e144";
}

.k-i-plus-sm::before {
  content: "\e145";
}

.k-i-splus::before {
  content: "\e145";
}

.k-i-minus-sm::before {
  content: "\e146";
}

.k-i-sminus::before {
  content: "\e146";
}

.k-i-kpi-status-deny::before {
  content: "\e147";
}

.k-i-kpi-status-hold::before {
  content: "\e148";
}

.k-i-kpi-status-open::before {
  content: "\e149";
}

.k-i-equal::before {
  content: "\e14a";
}

.k-i-not-equal::before {
  content: "\e14b";
}

.k-i-less-or-equal::before {
  content: "\e14c";
}

.k-i-greater-or-equal::before {
  content: "\e14d";
}

.k-i-divide::before {
  content: "\e14e";
}

.k-i-accessibility::before {
  content: "\e14f";
}

.k-i-barcode-outline::before {
  content: "\e150";
}

.k-i-barcode::before {
  content: "\e151";
}

.k-i-barcode-scanner::before {
  content: "\e152";
}

.k-i-qr-code-outline::before {
  content: "\e153";
}

.k-i-qr-code::before {
  content: "\e154";
}

.k-i-qr-code-scanner::before {
  content: "\e155";
}

.k-i-barcode-qr-code-scanner::before {
  content: "\e156";
}

.k-i-signature::before {
  content: "\e157";
}

.k-i-hand::before {
  content: "\e158";
}

.k-i-pointer::before {
  content: "\e159";
}

.k-i-cursor::before {
  content: "\e159";
}

.k-i-stick::before {
  content: "\e15a";
}

.k-i-unstick::before {
  content: "\e15b";
}

.k-i-set-column-position::before {
  content: "\e15c";
}

.k-i-clock-arrow-rotate::before {
  content: "\e15d";
}

.k-i-play::before {
  content: "\e200";
}

.k-i-pause::before {
  content: "\e201";
}

.k-i-stop::before {
  content: "\e202";
}

.k-i-rewind::before {
  content: "\e203";
}

.k-i-forward::before {
  content: "\e204";
}

.k-i-volume-down::before {
  content: "\e205";
}

.k-i-volume-low::before {
  content: "\e205";
}

.k-i-volume-up::before {
  content: "\e206";
}

.k-i-volume-high::before {
  content: "\e206";
}

.k-i-volume-mute::before {
  content: "\e207";
}

.k-i-volume-off::before {
  content: "\e207";
}

.k-i-hd::before {
  content: "\e208";
}

.k-i-closed-captions::before {
  content: "\e209";
}

.k-i-subtitles::before {
  content: "\e209";
}

.k-i-playlist::before {
  content: "\e20a";
}

.k-i-music-notes::before {
  content: "\e20b";
}

.k-i-audio::before {
  content: "\e20b";
}

.k-i-play-sm::before {
  content: "\e20c";
}

.k-i-pause-sm::before {
  content: "\e20d";
}

.k-i-stop-sm::before {
  content: "\e20e";
}

.k-i-heart-outline::before {
  content: "\e300";
}

.k-i-fav-outline::before {
  content: "\e300";
}

.k-i-favorite-outline::before {
  content: "\e300";
}

.k-i-heart::before {
  content: "\e301";
}

.k-i-fav::before {
  content: "\e301";
}

.k-i-favorite::before {
  content: "\e301";
}

.k-i-star-outline::before {
  content: "\e302";
}

.k-i-bookmark-outline::before {
  content: "\e302";
}

.k-i-star::before {
  content: "\e303";
}

.k-i-bookmark::before {
  content: "\e303";
}

.k-i-checkbox::before {
  content: "\e304";
}

.k-i-shape-rect::before {
  content: "\e304";
}

.k-i-checkbox-checked::before {
  content: "\e305";
}

.k-i-checkbox-indeterminate::before {
  content: "\e306";
}

.k-i-tri-state-indeterminate::before {
  content: "\e306";
}

.k-i-checkbox-null::before {
  content: "\e307";
}

.k-i-tri-state-null::before {
  content: "\e307";
}

.k-i-circle::before {
  content: "\e308";
}

.k-i-radiobutton::before {
  content: "\e309";
}

.k-i-shape-circle::before {
  content: "\e309";
}

.k-i-radiobutton-checked::before {
  content: "\e30a";
}

.k-i-bell::before {
  content: "\e400";
}

.k-i-notification::before {
  content: "\e400";
}

.k-i-info-circle::before {
  content: "\e401";
}

.k-i-information::before {
  content: "\e401";
}

.k-i-info::before {
  content: "\e401";
}

.k-i-note::before {
  content: "\e401";
}

.k-i-question-circle::before {
  content: "\e402";
}

.k-i-question::before {
  content: "\e402";
}

.k-i-help::before {
  content: "\e402";
}

.k-i-exclamation-circle::before {
  content: "\e403";
}

.k-i-warning::before {
  content: "\e403";
}

.k-i-exception::before {
  content: "\e403";
}

.k-i-camera::before {
  content: "\e500";
}

.k-i-photo-camera::before {
  content: "\e500";
}

.k-i-image::before {
  content: "\e501";
}

.k-i-photo::before {
  content: "\e501";
}

.k-i-image-export::before {
  content: "\e502";
}

.k-i-photo-export::before {
  content: "\e502";
}

.k-i-zoom-actual-size::before {
  content: "\e503";
}

.k-i-zoom-best-fit::before {
  content: "\e504";
}

.k-i-image-resize::before {
  content: "\e505";
}

.k-i-crop::before {
  content: "\e506";
}

.k-i-mirror::before {
  content: "\e507";
}

.k-i-flip-horizontal::before {
  content: "\e508";
}

.k-i-flip-h::before {
  content: "\e508";
}

.k-i-flip-vertical::before {
  content: "\e509";
}

.k-i-flip-v::before {
  content: "\e509";
}

.k-i-rotate::before {
  content: "\e50a";
}

.k-i-rotate-right::before {
  content: "\e50b";
}

.k-i-rotate-cw::before {
  content: "\e50b";
}

.k-i-rotate-left::before {
  content: "\e50c";
}

.k-i-rotate-ccw::before {
  content: "\e50c";
}

.k-i-brush::before {
  content: "\e50d";
}

.k-i-palette::before {
  content: "\e50e";
}

.k-i-droplet::before {
  content: "\e50f";
}

.k-i-paint::before {
  content: "\e50f";
}

.k-i-background::before {
  content: "\e50f";
}

.k-i-shape-line::before {
  content: "\e510";
}

.k-i-line::before {
  content: "\e510";
}

.k-i-brightness-contrast::before {
  content: "\e511";
}

.k-i-sliders::before {
  content: "\e512";
}

.k-i-saturation::before {
  content: "\e512";
}

.k-i-invert-colors::before {
  content: "\e513";
}

.k-i-transparency::before {
  content: "\e514";
}

.k-i-opacity::before {
  content: "\e514";
}

.k-i-grayscale::before {
  content: "\e515";
}

.k-i-blur::before {
  content: "\e516";
}

.k-i-sharpen::before {
  content: "\e517";
}

.k-i-shapes::before {
  content: "\e518";
}

.k-i-shape::before {
  content: "\e518";
}

.k-i-round-corners::before {
  content: "\e519";
}

.k-i-bring-to-front::before {
  content: "\e51a";
}

.k-i-front-element::before {
  content: "\e51a";
}

.k-i-bring-to-back::before {
  content: "\e51b";
}

.k-i-back-element::before {
  content: "\e51b";
}

.k-i-bring-forward::before {
  content: "\e51c";
}

.k-i-forward-element::before {
  content: "\e51c";
}

.k-i-bring-backward::before {
  content: "\e51d";
}

.k-i-backward-element::before {
  content: "\e51d";
}

.k-i-align-self-start::before {
  content: "\e51e";
}

.k-i-align-left-element::before {
  content: "\e51e";
}

.k-i-align-self-center::before {
  content: "\e51f";
}

.k-i-align-center-element::before {
  content: "\e51f";
}

.k-i-align-self-end::before {
  content: "\e520";
}

.k-i-align-right-element::before {
  content: "\e520";
}

.k-i-align-self-start-alt::before {
  content: "\e521";
}

.k-i-align-top-element::before {
  content: "\e521";
}

.k-i-align-self-center-alt::before {
  content: "\e522";
}

.k-i-align-middle-element::before {
  content: "\e522";
}

.k-i-align-self-end-alt::before {
  content: "\e523";
}

.k-i-align-bottom-element::before {
  content: "\e523";
}

.k-i-thumbnails-up::before {
  content: "\e524";
}

.k-i-thumbnails-right::before {
  content: "\e525";
}

.k-i-thumbnails-down::before {
  content: "\e526";
}

.k-i-thumbnails-left::before {
  content: "\e527";
}

.k-i-fullscreen::before {
  content: "\e528";
}

.k-i-full-screen::before {
  content: "\e528";
}

.k-i-fullscreen-enter::before {
  content: "\e528";
}

.k-i-fullscreen-exit::before {
  content: "\e529";
}

.k-i-full-screen-exit::before {
  content: "\e529";
}

.k-i-droplet-slash::before {
  content: "\e52a";
}

.k-i-reset-color::before {
  content: "\e52a";
}

.k-i-paint-remove::before {
  content: "\e52a";
}

.k-i-background-remove::before {
  content: "\e52a";
}

.k-i-photos::before {
  content: "\e52b";
}

.k-i-images::before {
  content: "\e52b";
}

.k-i-gallery::before {
  content: "\e52b";
}

.k-i-align-to-grid::before {
  content: "\e52c";
}

.k-i-size-to-grid::before {
  content: "\e52d";
}

.k-i-make-same-size::before {
  content: "\e52e";
}

.k-i-make-same-width::before {
  content: "\e52f";
}

.k-i-make-same-height::before {
  content: "\e530";
}

.k-i-make-horizontal-spacing-equal::before {
  content: "\e531";
}

.k-i-increase-horizontal-spacing::before {
  content: "\e532";
}

.k-i-decrease-horizontal-spacing::before {
  content: "\e533";
}

.k-i-remove-horizontal-spacing::before {
  content: "\e534";
}

.k-i-make-vertical-spacing-equal::before {
  content: "\e535";
}

.k-i-increase-vertical-spacing::before {
  content: "\e536";
}

.k-i-decrease-vertical-spacing::before {
  content: "\e537";
}

.k-i-remove-vertical-spacing::before {
  content: "\e538";
}

.k-i-eyedropper::before {
  content: "\e539";
}

.k-i-snap-grid::before {
  content: "\e53a";
}

.k-i-snap-to-gridlines::before {
  content: "\e53b";
}

.k-i-snap-to-snaplines::before {
  content: "\e53c";
}

.k-i-dimensions::before {
  content: "\e53d";
}

.k-i-align-self-stretch::before {
  content: "\e53e";
}

.k-i-align-stretch-element-horizontal::before {
  content: "\e53e";
}

.k-i-align-self-stretch-alt::before {
  content: "\e53f";
}

.k-i-align-stretch-element-vertical::before {
  content: "\e53f";
}

.k-i-align-items-start::before {
  content: "\e540";
}

.k-i-align-left-elements::before {
  content: "\e540";
}

.k-i-align-items-center::before {
  content: "\e541";
}

.k-i-align-center-elements::before {
  content: "\e541";
}

.k-i-align-items-end::before {
  content: "\e542";
}

.k-i-align-right-elements::before {
  content: "\e542";
}

.k-i-align-items-stretch::before {
  content: "\e543";
}

.k-i-align-stretch-elements-horizontal::before {
  content: "\e543";
}

.k-i-align-items-baseline::before {
  content: "\e544";
}

.k-i-align-baseline-horizontal::before {
  content: "\e544";
}

.k-i-align-items-start-alt::before {
  content: "\e545";
}

.k-i-align-top-elements::before {
  content: "\e545";
}

.k-i-align-items-center-alt::before {
  content: "\e546";
}

.k-i-align-middle-elements::before {
  content: "\e546";
}

.k-i-align-items-end-alt::before {
  content: "\e547";
}

.k-i-align-bottom-elements::before {
  content: "\e547";
}

.k-i-align-items-stretch-alt::before {
  content: "\e548";
}

.k-i-align-stretch-elements-vertical::before {
  content: "\e548";
}

.k-i-align-items-baseline-alt::before {
  content: "\e549";
}

.k-i-align-baseline-vertical::before {
  content: "\e549";
}

.k-i-justify-content-start::before {
  content: "\e54a";
}

.k-i-justify-start-horizontal::before {
  content: "\e54a";
}

.k-i-justify-content-center::before {
  content: "\e54b";
}

.k-i-justify-center-horizontal::before {
  content: "\e54b";
}

.k-i-justify-content-end::before {
  content: "\e54c";
}

.k-i-justify-end-horizontal::before {
  content: "\e54c";
}

.k-i-justify-content-between::before {
  content: "\e54d";
}

.k-i-justify-between-horizontal::before {
  content: "\e54d";
}

.k-i-justify-content-around::before {
  content: "\e54e";
}

.k-i-justify-around-horizontal::before {
  content: "\e54e";
}

.k-i-justify-content-start-alt::before {
  content: "\e54f";
}

.k-i-justify-start-vertical::before {
  content: "\e54f";
}

.k-i-justify-content-center-alt::before {
  content: "\e550";
}

.k-i-justify-center-vertical::before {
  content: "\e550";
}

.k-i-justify-content-end-alt::before {
  content: "\e551";
}

.k-i-justify-end-vertical::before {
  content: "\e551";
}

.k-i-justify-content-between-alt::before {
  content: "\e552";
}

.k-i-justify-between-vertical::before {
  content: "\e552";
}

.k-i-justify-content-around-alt::before {
  content: "\e553";
}

.k-i-justify-around-vertical::before {
  content: "\e553";
}

.k-i-file-wrench::before {
  content: "\e600";
}

.k-i-page-properties::before {
  content: "\e600";
}

.k-i-bold::before {
  content: "\e601";
}

.k-i-italic::before {
  content: "\e602";
}

.k-i-underline::before {
  content: "\e603";
}

.k-i-font-family::before {
  content: "\e604";
}

.k-i-foreground-color::before {
  content: "\e605";
}

.k-i-text::before {
  content: "\e605";
}

.k-i-convert-lowercase::before {
  content: "\e606";
}

.k-i-convert-uppercase::before {
  content: "\e607";
}

.k-i-strikethrough::before {
  content: "\e608";
}

.k-i-strike-through::before {
  content: "\e608";
}

.k-i-subscript::before {
  content: "\e609";
}

.k-i-sub-script::before {
  content: "\e609";
}

.k-i-supscript::before {
  content: "\e60a";
}

.k-i-sup-script::before {
  content: "\e60a";
}

.k-i-superscript::before {
  content: "\e60a";
}

.k-i-div::before {
  content: "\e60b";
}

.k-i-all::before {
  content: "\e60c";
}

.k-i-h1::before {
  content: "\e60d";
}

.k-i-h2::before {
  content: "\e60e";
}

.k-i-h3::before {
  content: "\e60f";
}

.k-i-h4::before {
  content: "\e610";
}

.k-i-h5::before {
  content: "\e611";
}

.k-i-h6::before {
  content: "\e612";
}

.k-i-list-ordered::before {
  content: "\e613";
}

.k-i-list-numbered::before {
  content: "\e613";
}

.k-i-insert-ordered-list::before {
  content: "\e613";
}

.k-i-list-unordered::before {
  content: "\e614";
}

.k-i-list-bulleted::before {
  content: "\e614";
}

.k-i-insert-unordered-list::before {
  content: "\e614";
}

.k-i-indent::before {
  content: "\e615";
}

.k-i-indent-increase::before {
  content: "\e615";
}

.k-i-outdent::before {
  content: "\e616";
}

.k-i-indent-decrease::before {
  content: "\e616";
}

.k-i-insert-top::before {
  content: "\e617";
}

.k-i-insert-up::before {
  content: "\e617";
}

.k-i-insert-n::before {
  content: "\e617";
}

.k-i-insert-middle::before {
  content: "\e618";
}

.k-i-insert-m::before {
  content: "\e618";
}

.k-i-insert-bottom::before {
  content: "\e619";
}

.k-i-insert-down::before {
  content: "\e619";
}

.k-i-insert-s::before {
  content: "\e619";
}

.k-i-align-top::before {
  content: "\e61a";
}

.k-i-align-middle::before {
  content: "\e61b";
}

.k-i-align-bottom::before {
  content: "\e61c";
}

.k-i-align-left::before {
  content: "\e61d";
}

.k-i-justify-left::before {
  content: "\e61d";
}

.k-i-align-center::before {
  content: "\e61e";
}

.k-i-justify-center::before {
  content: "\e61e";
}

.k-i-align-right::before {
  content: "\e61f";
}

.k-i-justify-left::before {
  content: "\e61f";
}

.k-i-align-justify::before {
  content: "\e620";
}

.k-i-justify-full::before {
  content: "\e620";
}

.k-i-align-remove::before {
  content: "\e621";
}

.k-i-justify-clear::before {
  content: "\e621";
}

.k-i-text-wrap::before {
  content: "\e622";
}

.k-i-horizontal-rule::before {
  content: "\e623";
}

.k-i-rule-horizontal::before {
  content: "\e623";
}

.k-i-hr::before {
  content: "\e623";
}

.k-i-table-align-top-left::before {
  content: "\e624";
}

.k-i-table-align-top-center::before {
  content: "\e625";
}

.k-i-table-align-top-right::before {
  content: "\e626";
}

.k-i-table-align-middle-left::before {
  content: "\e627";
}

.k-i-table-align-middle-center::before {
  content: "\e628";
}

.k-i-table-align-middle-right::before {
  content: "\e629";
}

.k-i-table-align-bottom-left::before {
  content: "\e62a";
}

.k-i-table-align-bottom-center::before {
  content: "\e62b";
}

.k-i-table-align-bottom-right::before {
  content: "\e62c";
}

.k-i-table-align-remove::before {
  content: "\e62d";
}

.k-i-borders-all::before {
  content: "\e62e";
}

.k-i-all-borders::before {
  content: "\e62e";
}

.k-i-borders-outside::before {
  content: "\e62f";
}

.k-i-outside-borders::before {
  content: "\e62f";
}

.k-i-borders-inside::before {
  content: "\e630";
}

.k-i-inside-borders::before {
  content: "\e630";
}

.k-i-borders-inside-horizontal::before {
  content: "\e631";
}

.k-i-border-inside-h::before {
  content: "\e631";
}

.k-i-inside-horizontal-borders::before {
  content: "\e631";
}

.k-i-borders-inside-vertical::before {
  content: "\e632";
}

.k-i-borders-inside-v::before {
  content: "\e632";
}

.k-i-inside-vertical-borders::before {
  content: "\e632";
}

.k-i-border-top::before {
  content: "\e633";
}

.k-i-top-border::before {
  content: "\e633";
}

.k-i-border-bottom::before {
  content: "\e634";
}

.k-i-bottom-border::before {
  content: "\e634";
}

.k-i-border-left::before {
  content: "\e635";
}

.k-i-left-border::before {
  content: "\e635";
}

.k-i-border-right::before {
  content: "\e636";
}

.k-i-right-border::before {
  content: "\e636";
}

.k-i-borders-none::before {
  content: "\e637";
}

.k-i-border-no::before {
  content: "\e637";
}

.k-i-no-borders::before {
  content: "\e637";
}

.k-i-borders-show-hide::before {
  content: "\e638";
}

.k-i-form::before {
  content: "\e639";
}

.k-i-border::before {
  content: "\e639";
}

.k-i-form-element::before {
  content: "\e63a";
}

.k-i-code-snippet::before {
  content: "\e63b";
}

.k-i-select-all::before {
  content: "\e63c";
}

.k-i-button::before {
  content: "\e63d";
}

.k-i-select-box::before {
  content: "\e63e";
}

.k-i-calendar-date::before {
  content: "\e63f";
}

.k-i-group-box::before {
  content: "\e640";
}

.k-i-textarea::before {
  content: "\e641";
}

.k-i-textbox::before {
  content: "\e642";
}

.k-i-textbox-hidden::before {
  content: "\e643";
}

.k-i-password::before {
  content: "\e644";
}

.k-i-paragraph-add::before {
  content: "\e645";
}

.k-i-edit-tools::before {
  content: "\e646";
}

.k-i-template-manager::before {
  content: "\e647";
}

.k-i-change-manually::before {
  content: "\e648";
}

.k-i-track-changes::before {
  content: "\e649";
}

.k-i-track-changes-enable::before {
  content: "\e64a";
}

.k-i-track-changes-accept::before {
  content: "\e64b";
}

.k-i-track-changes-accept-all::before {
  content: "\e64c";
}

.k-i-track-changes-reject::before {
  content: "\e64d";
}

.k-i-track-changes-reject-all::before {
  content: "\e64e";
}

.k-i-document-manager::before {
  content: "\e64f";
}

.k-i-custom-icon::before {
  content: "\e650";
}

.k-i-book::before {
  content: "\e651";
}

.k-i-dictionary-add::before {
  content: "\e651";
}

.k-i-image-add::before {
  content: "\e652";
}

.k-i-image-light-dialog::before {
  content: "\e652";
}

.k-i-image-insert::before {
  content: "\e652";
}

.k-i-insert-image::before {
  content: "\e652";
}

.k-i-image-edit::before {
  content: "\e653";
}

.k-i-image-map-editor::before {
  content: "\e654";
}

.k-i-comment::before {
  content: "\e655";
}

.k-i-comment-remove::before {
  content: "\e656";
}

.k-i-comments-remove::before {
  content: "\e657";
}

.k-i-comments-remove-all::before {
  content: "\e657";
}

.k-i-silverlight::before {
  content: "\e658";
}

.k-i-media-manager::before {
  content: "\e659";
}

.k-i-video-external::before {
  content: "\e65a";
}

.k-i-flash-manager::before {
  content: "\e65b";
}

.k-i-binoculars::before {
  content: "\e65c";
}

.k-i-find-and-replace::before {
  content: "\e65c";
}

.k-i-find::before {
  content: "\e65c";
}

.k-i-copy::before {
  content: "\e65d";
}

.k-i-files::before {
  content: "\e65d";
}

.k-i-cut::before {
  content: "\e65e";
}

.k-i-clipboard::before {
  content: "\e65f";
}

.k-i-paste::before {
  content: "\e65f";
}

.k-i-clipboard-code::before {
  content: "\e660";
}

.k-i-paste-as-html::before {
  content: "\e660";
}

.k-i-clipboard-word::before {
  content: "\e661";
}

.k-i-paste-from-word::before {
  content: "\e661";
}

.k-i-clipboard-word-alt::before {
  content: "\e662";
}

.k-i-paste-from-word-strip-file::before {
  content: "\e662";
}

.k-i-clipboard-html::before {
  content: "\e663";
}

.k-i-paste-html::before {
  content: "\e663";
}

.k-i-clipboard-markdown::before {
  content: "\e664";
}

.k-i-paste-markdown::before {
  content: "\e664";
}

.k-i-clipboard-text::before {
  content: "\e665";
}

.k-i-paste-plain-text::before {
  content: "\e665";
}

.k-i-apply-format::before {
  content: "\e666";
}

.k-i-clear-css::before {
  content: "\e667";
}

.k-i-clearformat::before {
  content: "\e667";
}

.k-i-copy-format::before {
  content: "\e668";
}

.k-i-strip-all-formatting::before {
  content: "\e669";
}

.k-i-strip-css-format::before {
  content: "\e66a";
}

.k-i-strip-font-elements::before {
  content: "\e66b";
}

.k-i-strip-span-elements::before {
  content: "\e66c";
}

.k-i-strip-word-formatting::before {
  content: "\e66d";
}

.k-i-format-code-block::before {
  content: "\e66e";
}

.k-i-building-blocks::before {
  content: "\e66f";
}

.k-i-style-builder::before {
  content: "\e66f";
}

.k-i-puzzle-piece::before {
  content: "\e670";
}

.k-i-module-manager::before {
  content: "\e670";
}

.k-i-puzzle::before {
  content: "\e670";
}

.k-i-link-add::before {
  content: "\e671";
}

.k-i-hyperlink-light-dialog::before {
  content: "\e671";
}

.k-i-hyperlink-insert::before {
  content: "\e671";
}

.k-i-globe-link::before {
  content: "\e672";
}

.k-i-hyperlink-globe::before {
  content: "\e672";
}

.k-i-globe-unlink::before {
  content: "\e673";
}

.k-i-hyperlink-globe-remove::before {
  content: "\e673";
}

.k-i-envelop-link::before {
  content: "\e674";
}

.k-i-hyperlink-email::before {
  content: "\e674";
}

.k-i-anchor::before {
  content: "\e675";
}

.k-i-table-add::before {
  content: "\e676";
}

.k-i-table-light-dialog::before {
  content: "\e676";
}

.k-i-table-insert::before {
  content: "\e676";
}

.k-i-create-table::before {
  content: "\e676";
}

.k-i-table::before {
  content: "\e677";
}

.k-i-table-properties::before {
  content: "\e678";
}

.k-i-table-cell::before {
  content: "\e679";
}

.k-i-table-cell-properties::before {
  content: "\e67a";
}

.k-i-table-column-insert-left::before {
  content: "\e67b";
}

.k-i-add-column-left::before {
  content: "\e67b";
}

.k-i-table-column-insert-right::before {
  content: "\e67c";
}

.k-i-add-column-right::before {
  content: "\e67c";
}

.k-i-table-row-insert-above::before {
  content: "\e67d";
}

.k-i-add-row-above::before {
  content: "\e67d";
}

.k-i-table-row-insert-below::before {
  content: "\e67e";
}

.k-i-add-row-below::before {
  content: "\e67e";
}

.k-i-table-column-delete::before {
  content: "\e67f";
}

.k-i-delete-column::before {
  content: "\e67f";
}

.k-i-table-row-delete::before {
  content: "\e680";
}

.k-i-delete-row::before {
  content: "\e680";
}

.k-i-table-cell-delete::before {
  content: "\e681";
}

.k-i-table-delete::before {
  content: "\e682";
}

.k-i-cells-merge::before {
  content: "\e683";
}

.k-i-merge-cells::before {
  content: "\e683";
}

.k-i-cells-merge-horizontally::before {
  content: "\e684";
}

.k-i-cells-merge-h::before {
  content: "\e684";
}

.k-i-merge-horizontally::before {
  content: "\e684";
}

.k-i-cells-merge-vertically::before {
  content: "\e685";
}

.k-i-cells-merge-v::before {
  content: "\e685";
}

.k-i-merge-vertically::before {
  content: "\e685";
}

.k-i-cell-split-horizontally::before {
  content: "\e686";
}

.k-i-cells-split-h::before {
  content: "\e686";
}

.k-i-cell-split-vertically::before {
  content: "\e687";
}

.k-i-cells-split-v::before {
  content: "\e687";
}

.k-i-table-unmerge::before {
  content: "\e688";
}

.k-i-normal-layout::before {
  content: "\e688";
}

.k-i-pane-freeze::before {
  content: "\e689";
}

.k-i-freeze-pane::before {
  content: "\e689";
}

.k-i-row-freeze::before {
  content: "\e68a";
}

.k-i-freeze-row::before {
  content: "\e68a";
}

.k-i-column-freeze::before {
  content: "\e68b";
}

.k-i-col-freeze::before {
  content: "\e68b";
}

.k-i-freeze-col::before {
  content: "\e68b";
}

.k-i-toolbar-float::before {
  content: "\e68c";
}

.k-i-spell-checker::before {
  content: "\e68d";
}

.k-i-validation-xhtml::before {
  content: "\e68e";
}

.k-i-validation-data::before {
  content: "\e68f";
}

.k-i-toggle-full-screen-mode::before {
  content: "\e690";
}

.k-i-formula-fx::before {
  content: "\e691";
}

.k-i-fx::before {
  content: "\e691";
}

.k-i-sum::before {
  content: "\e692";
}

.k-i-symbol::before {
  content: "\e693";
}

.k-i-dollar::before {
  content: "\e694";
}

.k-i-currency::before {
  content: "\e694";
}

.k-i-percent::before {
  content: "\e695";
}

.k-i-custom-format::before {
  content: "\e696";
}

.k-i-format-number::before {
  content: "\e696";
}

.k-i-decimal-increase::before {
  content: "\e697";
}

.k-i-increace-decimal::before {
  content: "\e697";
}

.k-i-decimal-decrease::before {
  content: "\e698";
}

.k-i-decrease-decimal::before {
  content: "\e698";
}

.k-i-font-size::before {
  content: "\e699";
}

.k-i-image-absolute-position::before {
  content: "\e69a";
}

.k-i-table-wizard::before {
  content: "\e69b";
}

.k-i-crosstab::before {
  content: "\e69c";
}

.k-i-crosstab-wizard::before {
  content: "\e69d";
}

.k-i-table-body::before {
  content: "\e69e";
}

.k-i-table-column-groups::before {
  content: "\e69f";
}

.k-i-table-corner::before {
  content: "\e6a0";
}

.k-i-table-row-groups::before {
  content: "\e6a1";
}

.k-i-globe-outline::before {
  content: "\e700";
}

.k-i-globe::before {
  content: "\e701";
}

.k-i-map-marker::before {
  content: "\e702";
}

.k-i-marker-pin::before {
  content: "\e702";
}

.k-i-map-marker-target::before {
  content: "\e703";
}

.k-i-marker-pin-target::before {
  content: "\e703";
}

.k-i-pin::before {
  content: "\e704";
}

.k-i-unpin::before {
  content: "\e705";
}

.k-i-share::before {
  content: "\e800";
}

.k-i-user::before {
  content: "\e801";
}

.k-i-inbox::before {
  content: "\e802";
}

.k-i-blogger::before {
  content: "\e803";
}

.k-i-blogger-box::before {
  content: "\e804";
}

.k-i-delicious::before {
  content: "\e805";
}

.k-i-delicious-box::before {
  content: "\e806";
}

.k-i-digg::before {
  content: "\e807";
}

.k-i-digg-box::before {
  content: "\e808";
}

.k-i-envelop::before {
  content: "\e809";
}

.k-i-email::before {
  content: "\e809";
}

.k-i-letter::before {
  content: "\e809";
}

.k-i-envelop-box::before {
  content: "\e80a";
}

.k-i-email-box::before {
  content: "\e80a";
}

.k-i-letter-box::before {
  content: "\e80a";
}

.k-i-facebook::before {
  content: "\e80b";
}

.k-i-facebook-box::before {
  content: "\e80c";
}

.k-i-google::before {
  content: "\e80d";
}

.k-i-google-box::before {
  content: "\e80e";
}

.k-i-google-plus::before {
  content: "\e80f";
}

.k-i-google-plus-box::before {
  content: "\e810";
}

.k-i-linkedin::before {
  content: "\e811";
}

.k-i-linkedin-box::before {
  content: "\e812";
}

.k-i-myspace::before {
  content: "\e813";
}

.k-i-myspace-box::before {
  content: "\e814";
}

.k-i-pinterest::before {
  content: "\e815";
}

.k-i-pinterest-box::before {
  content: "\e816";
}

.k-i-reddit::before {
  content: "\e817";
}

.k-i-reddit-box::before {
  content: "\e818";
}

.k-i-stumble-upon::before {
  content: "\e819";
}

.k-i-stumble-upon-box::before {
  content: "\e81a";
}

.k-i-tell-a-friend::before {
  content: "\e81b";
}

.k-i-tell-a-friend-box::before {
  content: "\e81c";
}

.k-i-tumblr::before {
  content: "\e81d";
}

.k-i-tumblr-box::before {
  content: "\e81e";
}

.k-i-twitter::before {
  content: "\e81f";
}

.k-i-twitter-box::before {
  content: "\e820";
}

.k-i-yammer::before {
  content: "\e821";
}

.k-i-yammer-box::before {
  content: "\e822";
}

.k-i-behance::before {
  content: "\e823";
}

.k-i-behance-box::before {
  content: "\e824";
}

.k-i-dribbble::before {
  content: "\e825";
}

.k-i-dribbble-box::before {
  content: "\e826";
}

.k-i-rss::before {
  content: "\e827";
}

.k-i-rss-box::before {
  content: "\e828";
}

.k-i-vimeo::before {
  content: "\e829";
}

.k-i-vimeo-box::before {
  content: "\e82a";
}

.k-i-youtube::before {
  content: "\e82b";
}

.k-i-youtube-box::before {
  content: "\e82c";
}

.k-i-folder::before {
  content: "\e900";
}

.k-i-folder-open::before {
  content: "\e901";
}

.k-i-folder-add::before {
  content: "\e902";
}

.k-i-folder-up::before {
  content: "\e903";
}

.k-i-folder-more::before {
  content: "\e904";
}

.k-i-fields-more::before {
  content: "\e904";
}

.k-i-aggregate-fields::before {
  content: "\e905";
}

.k-i-file::before {
  content: "\e906";
}

.k-i-file-vertical::before {
  content: "\e906";
}

.k-i-page-portrait::before {
  content: "\e906";
}

.k-i-file-v::before {
  content: "\e906";
}

.k-i-file-add::before {
  content: "\e907";
}

.k-i-insert-file::before {
  content: "\e907";
}

.k-i-file-txt::before {
  content: "\e908";
}

.k-i-txt::before {
  content: "\e908";
}

.k-i-file-csv::before {
  content: "\e909";
}

.k-i-csv::before {
  content: "\e909";
}

.k-i-file-excel::before {
  content: "\e90a";
}

.k-i-file-xls::before {
  content: "\e90a";
}

.k-i-excel::before {
  content: "\e90a";
}

.k-i-xls::before {
  content: "\e90a";
}

.k-i-xlsa::before {
  content: "\e90a";
}

.k-i-file-word::before {
  content: "\e90b";
}

.k-i-file-doc::before {
  content: "\e90b";
}

.k-i-word::before {
  content: "\e90b";
}

.k-i-doc::before {
  content: "\e90b";
}

.k-i-file-mdb::before {
  content: "\e90c";
}

.k-i-mdb::before {
  content: "\e90c";
}

.k-i-file-ppt::before {
  content: "\e90d";
}

.k-i-ppt::before {
  content: "\e90d";
}

.k-i-file-pdf::before {
  content: "\e90e";
}

.k-i-pdf::before {
  content: "\e90e";
}

.k-i-pdfa::before {
  content: "\e90e";
}

.k-i-file-psd::before {
  content: "\e90f";
}

.k-i-psd::before {
  content: "\e90f";
}

.k-i-file-flash::before {
  content: "\e910";
}

.k-i-flash::before {
  content: "\e910";
}

.k-i-file-config::before {
  content: "\e911";
}

.k-i-config::before {
  content: "\e911";
}

.k-i-file-ascx::before {
  content: "\e912";
}

.k-i-ascx::before {
  content: "\e912";
}

.k-i-file-bac::before {
  content: "\e913";
}

.k-i-bac::before {
  content: "\e913";
}

.k-i-file-zip::before {
  content: "\e914";
}

.k-i-zip::before {
  content: "\e914";
}

.k-i-film::before {
  content: "\e915";
}

.k-i-css3::before {
  content: "\e916";
}

.k-i-html5::before {
  content: "\e917";
}

.k-i-code::before {
  content: "\e918";
}

.k-i-html::before {
  content: "\e918";
}

.k-i-source-code::before {
  content: "\e918";
}

.k-i-view-source::before {
  content: "\e918";
}

.k-i-css::before {
  content: "\e919";
}

.k-i-js::before {
  content: "\e91a";
}

.k-i-exe::before {
  content: "\e91b";
}

.k-i-csproj::before {
  content: "\e91c";
}

.k-i-vbproj::before {
  content: "\e91d";
}

.k-i-cs::before {
  content: "\e91e";
}

.k-i-vb::before {
  content: "\e91f";
}

.k-i-sln::before {
  content: "\e920";
}

.k-i-cloud::before {
  content: "\e921";
}

.k-i-file-horizontal::before {
  content: "\e922";
}

.k-i-page-landscape::before {
  content: "\e922";
}

.k-i-file-h::before {
  content: "\e922";
}

.k-i-subreport::before {
  content: "\e923";
}

.k-i-data::before {
  content: "\e924";
}

.k-i-file-header::before {
  content: "\e925";
}

.k-i-report-header-section::before {
  content: "\e925";
}

.k-i-file-footer::before {
  content: "\e926";
}

.k-i-report-footer-section::before {
  content: "\e926";
}

.k-i-group-header-section::before {
  content: "\e927";
}

.k-i-group-footer-section::before {
  content: "\e928";
}

.k-i-page-header-section::before {
  content: "\e929";
}

.k-i-page-footer-section::before {
  content: "\e92a";
}

.k-i-detail-section::before {
  content: "\e92b";
}

.k-i-toc-section::before {
  content: "\e92c";
}

.k-i-group-section::before {
  content: "\e92d";
}

.k-i-parameters::before {
  content: "\e92e";
}

.k-i-data-csv::before {
  content: "\e92f";
}

.k-i-data-json::before {
  content: "\e930";
}

.k-i-data-sql::before {
  content: "\e931";
}

.k-i-data-web::before {
  content: "\e932";
}

.k-i-group-collection::before {
  content: "\e933";
}

.k-i-parameter-boolean::before {
  content: "\e934";
}

.k-i-parameter-date-time::before {
  content: "\e935";
}

.k-i-parameter-float::before {
  content: "\e936";
}

.k-i-parameter-integer::before {
  content: "\e937";
}

.k-i-parameter-string::before {
  content: "\e938";
}

.k-i-toc-section-level::before {
  content: "\e939";
}

.k-i-inherited::before {
  content: "\e93a";
}

.k-i-file-video::before {
  content: "\e93b";
}

.k-i-file-audio::before {
  content: "\e93c";
}

.k-i-file-image::before {
  content: "\e93d";
}

.k-i-file-presentation::before {
  content: "\e93e";
}

.k-i-file-data::before {
  content: "\e93f";
}

.k-i-file-disc-image::before {
  content: "\e940";
}

.k-i-file-programming::before {
  content: "\e941";
}

.k-i-parameters-byte-array::before {
  content: "\e942";
}

.k-i-parameters-unknown::before {
  content: "\e943";
}

.k-i-file-error::before {
  content: "\e944";
}

.k-i-file-validation::before {
  content: "\e944";
}

.k-i-files-error::before {
  content: "\e945";
}

.k-i-files-validation::before {
  content: "\e945";
}

.k-i-data-rest::before {
  content: "\e946";
}

.k-i-file-typescript::before {
  content: "\e947";
}

.k-i-table-position-start::before {
  content: "\e948";
}

.k-i-table-position-left::before {
  content: "\e948";
}

.k-i-table-position-center::before {
  content: "\e949";
}

.k-i-table-position-end::before {
  content: "\e94a";
}

.k-i-table-position-right::before {
  content: "\e94a";
}

.k-i-list-roman-upper::before {
  content: "\e94b";
}

.k-i-list-roman-lower::before {
  content: "\e94c";
}

.k-i-import::before {
  content: "\e94d";
}

.k-i-export::before {
  content: "\e94e";
}

.k-i-graph::before {
  content: "\ea00";
}

.k-i-chart-column-clustered::before {
  content: "\ea01";
}

.k-i-chart-column-stacked::before {
  content: "\ea02";
}

.k-i-chart-column-stacked100::before {
  content: "\ea03";
}

.k-i-chart-column-range::before {
  content: "\ea04";
}

.k-i-chart-bar-clustered::before {
  content: "\ea05";
}

.k-i-chart-bar-stacked::before {
  content: "\ea06";
}

.k-i-chart-bar-stacked100::before {
  content: "\ea07";
}

.k-i-chart-bar-range::before {
  content: "\ea08";
}

.k-i-chart-area-clustered::before {
  content: "\ea09";
}

.k-i-chart-area-stacked::before {
  content: "\ea0a";
}

.k-i-chart-area-stacked100::before {
  content: "\ea0b";
}

.k-i-chart-area-range::before {
  content: "\ea0c";
}

.k-i-chart-line::before {
  content: "\ea0d";
}

.k-i-chart-line-stacked::before {
  content: "\ea0e";
}

.k-i-chart-line-stacked100::before {
  content: "\ea0f";
}

.k-i-chart-line-markers::before {
  content: "\ea10";
}

.k-i-chart-line-stacked-markers::before {
  content: "\ea11";
}

.k-i-chart-line-stacked100-markers::before {
  content: "\ea12";
}

.k-i-chart-pie::before {
  content: "\ea13";
}

.k-i-chart-doughnut::before {
  content: "\ea14";
}

.k-i-chart-scatter::before {
  content: "\ea15";
}

.k-i-chart-scatter-smooth-lines-markers::before {
  content: "\ea16";
}

.k-i-chart-scatter-smooth-lines::before {
  content: "\ea17";
}

.k-i-chart-scatter-straight-lines-markers::before {
  content: "\ea18";
}

.k-i-chart-scatter-straight-lines::before {
  content: "\ea19";
}

.k-i-chart-bubble::before {
  content: "\ea1a";
}

.k-i-chart-candlestick::before {
  content: "\ea1b";
}

.k-i-chart-ohlc::before {
  content: "\ea1c";
}

.k-i-chart-radar::before {
  content: "\ea1d";
}

.k-i-chart-radar-markers::before {
  content: "\ea1e";
}

.k-i-chart-radar-filled::before {
  content: "\ea1f";
}

.k-i-chart-rose::before {
  content: "\ea20";
}

.k-i-chart-choropleth::before {
  content: "\ea21";
}

:root {
  --kendo-disabled-text: ;
  --kendo-disabled-bg: ;
  --kendo-disabled-border: ;
  --kendo-disabled-opacity: 0.6;
  --kendo-disabled-filter: grayscale(0.1);
  --kendo-hr-border: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
  --kendo-marquee-text: var(--kendo-color-on-primary, #ffffff);
  --kendo-marquee-bg: var(--kendo-color-primary, #ff6358);
  --kendo-marquee-border: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
  --kendo-text-selection-bg: var(--kendo-color-primary, #ff6358);
}

:root {
  --kendo-color-app-surface: #ffffff;
  --kendo-color-on-app-surface: #3d3d3d;
  --kendo-color-subtle: #666666;
  --kendo-color-surface: #fafafa;
  --kendo-color-surface-alt: #ffffff;
  --kendo-color-border: rgba(0, 0, 0, 0.08);
  --kendo-color-border-alt: rgba(0, 0, 0, 0.16);
  --kendo-color-base-subtle: #ebebeb;
  --kendo-color-base-subtle-hover: #e0e0e0;
  --kendo-color-base-subtle-active: #d6d6d6;
  --kendo-color-base: #f5f5f5;
  --kendo-color-base-hover: #ebebeb;
  --kendo-color-base-active: #d6d6d6;
  --kendo-color-base-emphasis: #c2c2c2;
  --kendo-color-base-on-subtle: #3d3d3d;
  --kendo-color-on-base: #3d3d3d;
  --kendo-color-base-on-surface: #3d3d3d;
  --kendo-color-primary-subtle: #ffeceb;
  --kendo-color-primary-subtle-hover: #ffdedb;
  --kendo-color-primary-subtle-active: #ffc8c4;
  --kendo-color-primary: #ff6358;
  --kendo-color-primary-hover: #ea5a51;
  --kendo-color-primary-active: #d45349;
  --kendo-color-primary-emphasis: #ff9d97;
  --kendo-color-primary-on-subtle: #5c201c;
  --kendo-color-on-primary: #ffffff;
  --kendo-color-primary-on-surface: #ff6358;
  --kendo-color-secondary-subtle: #fafafa;
  --kendo-color-secondary-subtle-hover: #f5f5f5;
  --kendo-color-secondary-subtle-active: #ebebeb;
  --kendo-color-secondary: #666666;
  --kendo-color-secondary-hover: #525252;
  --kendo-color-secondary-active: #3d3d3d;
  --kendo-color-secondary-emphasis: #e0e0e0;
  --kendo-color-secondary-on-subtle: #141414;
  --kendo-color-on-secondary: #ffffff;
  --kendo-color-secondary-on-surface: #292929;
  --kendo-color-tertiary-subtle: #d8f1fd;
  --kendo-color-tertiary-subtle-hover: #c5eafc;
  --kendo-color-tertiary-subtle-active: #a3dffb;
  --kendo-color-tertiary: #03a9f4;
  --kendo-color-tertiary-hover: #039ae0;
  --kendo-color-tertiary-active: #028ccb;
  --kendo-color-tertiary-emphasis: #61c9f9;
  --kendo-color-tertiary-on-subtle: #023f5c;
  --kendo-color-on-tertiary: #ffffff;
  --kendo-color-tertiary-on-surface: #028ccb;
  --kendo-color-info-subtle: #d2e2fb;
  --kendo-color-info-subtle-hover: #bdd4f8;
  --kendo-color-info-subtle-active: #80acf4;
  --kendo-color-info: #0058e9;
  --kendo-color-info-hover: #0052d6;
  --kendo-color-info-active: #004ac2;
  --kendo-color-info-emphasis: #6098f2;
  --kendo-color-info-on-subtle: #002259;
  --kendo-color-on-info: #ffffff;
  --kendo-color-info-on-surface: #004ac2;
  --kendo-color-success-subtle: #dcf0d3;
  --kendo-color-success-subtle-hover: #cbe9bf;
  --kendo-color-success-subtle-active: #b7e1a5;
  --kendo-color-success: #37b400;
  --kendo-color-success-hover: #32a500;
  --kendo-color-success-active: #2d9600;
  --kendo-color-success-emphasis: #81d15f;
  --kendo-color-success-on-subtle: #1c5a00;
  --kendo-color-on-success: #ffffff;
  --kendo-color-success-on-surface: #2d9600;
  --kendo-color-warning-subtle: #fff4d3;
  --kendo-color-warning-subtle-hover: #ffeebd;
  --kendo-color-warning-subtle-active: #ffe79e;
  --kendo-color-warning: #ffc000;
  --kendo-color-warning-hover: #eaaf00;
  --kendo-color-warning-active: #d49f00;
  --kendo-color-warning-emphasis: #ffd760;
  --kendo-color-warning-on-subtle: #5e4700;
  --kendo-color-on-warning: #3d3d3d;
  --kendo-color-warning-on-surface: #ffc000;
  --kendo-color-error-subtle: #fcddda;
  --kendo-color-error-subtle-hover: #fbc8c3;
  --kendo-color-error-subtle-active: #f98b80;
  --kendo-color-error: #f31700;
  --kendo-color-error-hover: #df1600;
  --kendo-color-error-active: #ca1400;
  --kendo-color-error-emphasis: #f76f60;
  --kendo-color-error-on-subtle: #7a0c00;
  --kendo-color-on-error: #ffffff;
  --kendo-color-error-on-surface: #ca1400;
  --kendo-color-light-subtle: #fafafa;
  --kendo-color-light-subtle-hover: #f5f5f5;
  --kendo-color-light-subtle-active: #ebebeb;
  --kendo-color-light: #ebebeb;
  --kendo-color-light-hover: #e0e0e0;
  --kendo-color-light-active: #d6d6d6;
  --kendo-color-light-emphasis: #d6d6d6;
  --kendo-color-light-on-subtle: #141414;
  --kendo-color-on-light: #000000;
  --kendo-color-light-on-surface: #e0e0e0;
  --kendo-color-dark-subtle: #c2c2c2;
  --kendo-color-dark-subtle-hover: #adadad;
  --kendo-color-dark-subtle-active: #999999;
  --kendo-color-dark: #3d3d3d;
  --kendo-color-dark-hover: #292929;
  --kendo-color-dark-active: #1f1f1f;
  --kendo-color-dark-emphasis: #666666;
  --kendo-color-dark-on-subtle: #1f1f1f;
  --kendo-color-on-dark: #ffffff;
  --kendo-color-dark-on-surface: #141414;
  --kendo-color-inverse-subtle: #c2c2c2;
  --kendo-color-inverse-subtle-hover: #adadad;
  --kendo-color-inverse-subtle-active: #999999;
  --kendo-color-inverse: #3d3d3d;
  --kendo-color-inverse-hover: #292929;
  --kendo-color-inverse-active: #1f1f1f;
  --kendo-color-inverse-emphasis: #666666;
  --kendo-color-inverse-on-subtle: #1f1f1f;
  --kendo-color-on-inverse: #ffffff;
  --kendo-color-inverse-on-surface: #141414;
  --kendo-color-series-a: #ff6358;
  --kendo-color-series-a-bold: #bf4a42;
  --kendo-color-series-a-bolder: #80322c;
  --kendo-color-series-a-subtle: #ffb1ac;
  --kendo-color-series-a-subtler: #ff8a82;
  --kendo-color-series-b: #ffe162;
  --kendo-color-series-b-bold: #bfa94a;
  --kendo-color-series-b-bolder: #807131;
  --kendo-color-series-b-subtle: #fff0b1;
  --kendo-color-series-b-subtler: #ffe989;
  --kendo-color-series-c: #4cd180;
  --kendo-color-series-c-bold: #399d60;
  --kendo-color-series-c-bolder: #266940;
  --kendo-color-series-c-subtle: #a6e8c0;
  --kendo-color-series-c-subtler: #79dda0;
  --kendo-color-series-d: #4b5ffa;
  --kendo-color-series-d-bold: #3847bc;
  --kendo-color-series-d-bolder: #26307d;
  --kendo-color-series-d-subtle: #a5affd;
  --kendo-color-series-d-subtler: #7887fb;
  --kendo-color-series-e: #ac58ff;
  --kendo-color-series-e-bold: #8142bf;
  --kendo-color-series-e-bolder: #562c80;
  --kendo-color-series-e-subtle: #d6acff;
  --kendo-color-series-e-subtler: #c182ff;
  --kendo-color-series-f: #ff5892;
  --kendo-color-series-f-bold: #bf426e;
  --kendo-color-series-f-bolder: #802c49;
  --kendo-color-series-f-subtle: #ffacc9;
  --kendo-color-series-f-subtler: #ff82ae;
}

.k-sr-only {
  position: absolute;
  left: -1px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.k-push-right-enter, .k-push-right-appear {
  transform: translate(-100%, 0);
}

.k-push-right-enter-active, .k-push-right-appear-active {
  transform: translate(0, 0);
  transition: transform 300ms ease-in-out;
}

.k-push-right-exit {
  transform: translate(0, 0);
}

.k-push-right-exit-active {
  transform: translate(100%, 0);
  transition: transform 300ms ease-in-out;
}

.k-push-left-enter, .k-push-left-appear {
  transform: translate(100%, 0);
}

.k-push-left-enter-active, .k-push-left-appear-active {
  transform: translate(0, 0);
  transition: transform 300ms ease-in-out;
}

.k-push-left-exit {
  transform: translate(0, 0);
}

.k-push-left-exit-active {
  transform: translate(-100%, 0);
  transition: transform 300ms ease-in-out;
}

.k-push-down-enter, .k-push-down-appear {
  transform: translate(0, -100%);
}

.k-push-down-enter-active, .k-push-down-appear-active {
  transform: translate(0, 0);
  transition: transform 300ms ease-in-out;
}

.k-push-down-exit {
  transform: translate(0, 0);
}

.k-push-down-exit-active {
  transform: translate(0, 100%);
  transition: transform 300ms ease-in-out;
}

.k-push-up-enter, .k-push-up-appear {
  transform: translate(0, 100%);
}

.k-push-up-enter-active, .k-push-up-appear-active {
  transform: translate(0, 0);
  transition: transform 300ms ease-in-out;
}

.k-push-up-exit {
  transform: translate(0, 0);
}

.k-push-up-exit-active {
  transform: translate(0, -100%);
  transition: transform 300ms ease-in-out;
}

.k-expand-vertical-enter, .k-expand-vertical-appear {
  transform: scaleY(0);
}

.k-expand-vertical-enter-active, .k-expand-vertical-appear-active {
  transform: scaleY(1);
  transition: transform 300ms ease-in-out;
}

.k-expand-vertical-exit {
  transform: scaleY(1);
}

.k-expand-vertical-exit-active {
  transform: scaleY(0);
  transition: transform 300ms ease-in-out;
}

.k-expand-horizontal-enter, .k-expand-horizontal-appear {
  transform: scaleX(0);
}

.k-expand-horizontal-enter-active, .k-expand-horizontal-appear-active {
  transform: scaleX(1);
  transition: transform 300ms ease-in-out;
}

.k-expand-horizontal-exit {
  transform: scaleX(1);
}

.k-expand-horizontal-exit-active {
  transform: scaleX(0);
  transition: transform 300ms ease-in-out;
}

.k-fade-enter, .k-fade-appear {
  opacity: 0;
}

.k-fade-enter-active, .k-fade-appear-active {
  opacity: 1;
  transition: opacity 500ms ease-in-out;
}

.k-fade-exit {
  opacity: 1;
}

.k-fade-exit-active {
  opacity: 0;
  transition: opacity 500ms ease-in-out;
}

.k-fade-exit-active + .k-fade-exit-active, .k-fade-enter-active + .k-fade-enter-active {
  display: none;
}

.k-zoom-in-enter, .k-zoom-in-appear {
  opacity: 0;
  transform: scale(0);
}

.k-zoom-in-enter-active, .k-zoom-in-appear-active {
  opacity: 1;
  transform: scale(1);
  transition: transform, opacity 300ms ease-in-out;
}

.k-zoom-in-exit {
  opacity: 1;
  transform: scale(1);
}

.k-zoom-in-exit-active {
  opacity: 0;
  transform: scale(2);
  transition: transform, opacity 300ms ease-in-out;
}

.k-zoom-out-enter, .k-zoom-out-appear {
  opacity: 0;
  transform: scale(2);
}

.k-zoom-out-enter-active, .k-zoom-out-appear-active {
  opacity: 1;
  transform: scale(1);
  transition: transform, opacity 300ms ease-in-out;
}

.k-zoom-out-exit {
  opacity: 1;
  transform: scale(1);
}

.k-zoom-out-exit-active {
  opacity: 0;
  transform: scale(0);
  transition: transform, opacity 300ms ease-in-out;
}

.k-slide-in-appear {
  opacity: 0.1;
  transform: translate(0, -3em);
}

.k-slide-in-appear .k-centered {
  transform: translate(-50%, -60%);
}

.k-slide-in-appear-active {
  opacity: 1;
  transform: translate(0, 0);
  transition: transform 0.3s cubic-bezier(0.2, 0.6, 0.4, 1), opacity 0.3s cubic-bezier(0.2, 1, 0.2, 1);
}

.k-slide-in-appear-active .k-centered {
  transform: translate(-50%, -50%);
}

.k-slide-down-enter, .k-slide-down-appear {
  transform: translateY(-100%);
}

.k-slide-down-enter-active, .k-slide-down-appear-active {
  transform: translateY(0);
  transition: transform 300ms ease-in-out;
}

.k-slide-down-exit {
  transform: translateY(0);
}

.k-slide-down-exit-active {
  transform: translateY(-100%);
  transition: transform 300ms ease-in-out;
}

.k-slide-up-enter, .k-slide-up-appear {
  transform: translateY(100%);
}

.k-slide-up-enter-active, .k-slide-up-appear-active {
  transform: translateY(0);
  transition: transform 300ms ease-in-out;
}

.k-slide-up-exit {
  transform: translateY(0);
}

.k-slide-up-exit-active {
  transform: translateY(100%);
  transition: transform 300ms ease-in-out;
}

.k-slide-right-enter, .k-slide-right-appear {
  transform: translateX(-100%);
}

.k-slide-right-enter-active, .k-slide-right-appear-active {
  transform: translateX(0);
  transition: transform 300ms ease-in-out;
}

.k-slide-right-exit {
  transform: translateX(0);
}

.k-slide-right-exit-active {
  transform: translateX(-100%);
  transition: transform 300ms ease-in-out;
}

.k-slide-left-enter, .k-slide-left-appear {
  transform: translateX(100%);
}

.k-slide-left-enter-active, .k-slide-left-appear-active {
  transform: translateX(0);
  transition: transform 300ms ease-in-out;
}

.k-slide-left-exit {
  transform: translateX(0);
}

.k-slide-left-exit-active {
  transform: translateX(100%);
  transition: transform 300ms ease-in-out;
}

.k-reveal-vertical-enter, .k-reveal-vertical-appear {
  max-height: 0;
}

.k-reveal-vertical-enter-active, .k-reveal-vertical-appear-active {
  transition: max-height 300ms ease-in-out;
}

.k-reveal-vertical-exit-active {
  max-height: 0 !important;
  transition: max-height 300ms ease-in-out;
}

.k-reveal-horizontal-enter, .k-reveal-horizontal-appear {
  max-width: 0;
}

.k-reveal-horizontal-enter-active, .k-reveal-horizontal-appear-active {
  transition: max-width 300ms ease-in-out;
}

.k-reveal-horizontal-exit-active {
  max-width: 0 !important;
  transition: max-width 300ms ease-in-out;
}

.k-fx-end .k-fx-next,
.k-fx-end .k-fx-current {
  transition: all 350ms ease-out;
}

.k-fx {
  position: relative;
}

.k-fx .k-fx-current {
  z-index: 0;
}

.k-fx .k-fx-next {
  z-index: 1;
}

.k-fx-hidden,
.k-fx-hidden * {
  visibility: hidden !important;
}

.k-fx-reverse .k-fx-current {
  z-index: 1;
}

.k-fx-reverse .k-fx-next {
  z-index: 0;
}

.k-fx-zoom.k-fx-start .k-fx-next {
  transform: scale(0) !important;
}

.k-fx-zoom.k-fx-end .k-fx-next {
  transform: scale(1) !important;
}

.k-fx-zoom.k-fx-reverse.k-fx-start .k-fx-next, .k-fx-zoom.k-fx-reverse.k-fx-end .k-fx-next {
  transform: scale(1) !important;
}

.k-fx-zoom.k-fx-reverse.k-fx-start .k-fx-current {
  transform: scale(1) !important;
}

.k-fx-zoom.k-fx-reverse.k-fx-end .k-fx-current {
  transform: scale(0) !important;
}

.k-fx-fade.k-fx-start .k-fx-next {
  will-change: opacity;
  opacity: 0;
}

.k-fx-fade.k-fx-end .k-fx-next {
  opacity: 1;
}

.k-fx-fade.k-fx-reverse.k-fx-start .k-fx-current {
  will-change: opacity;
  opacity: 1;
}

.k-fx-fade.k-fx-reverse.k-fx-end .k-fx-current {
  opacity: 0;
}

.k-fx-slide.k-fx-end .k-fx-next .k-content, .k-fx-slide.k-fx-end .k-fx-next .k-header, .k-fx-slide.k-fx-end .k-fx-next .k-footer, .k-fx-slide.k-fx-end .k-fx-current .k-content, .k-fx-slide.k-fx-end .k-fx-current .k-header, .k-fx-slide.k-fx-end .k-fx-current .k-footer, .k-fx-slide.k-fx-end .k-fx-next .km-content, .k-fx-slide.k-fx-end .k-fx-next .km-header, .k-fx-slide.k-fx-end .k-fx-next .km-footer, .k-fx-slide.k-fx-end .k-fx-current .km-content, .k-fx-slide.k-fx-end .k-fx-current .km-header, .k-fx-slide.k-fx-end .k-fx-current .km-footer {
  transition: all 350ms ease-out;
}

.k-fx-slide.k-fx-start .k-fx-next .k-content, .k-fx-slide.k-fx-start .k-fx-next .km-content {
  will-change: transform;
  transform: translateX(100%);
}

.k-fx-slide.k-fx-start .k-fx-next .k-header, .k-fx-slide.k-fx-start .k-fx-next .k-footer, .k-fx-slide.k-fx-start .k-fx-next .km-header, .k-fx-slide.k-fx-start .k-fx-next .km-footer {
  will-change: opacity;
  opacity: 0;
}

.k-fx-slide.k-fx-end .k-fx-current .k-content, .k-fx-slide.k-fx-end .k-fx-current .km-content {
  transform: translateX(-100%);
}

.k-fx-slide.k-fx-end .k-fx-next .k-header, .k-fx-slide.k-fx-end .k-fx-next .k-footer, .k-fx-slide.k-fx-end .k-fx-next .km-header, .k-fx-slide.k-fx-end .k-fx-next .km-footer {
  opacity: 1;
}

.k-fx-slide.k-fx-reverse.k-fx-start .k-fx-current .k-content, .k-fx-slide.k-fx-reverse.k-fx-start .k-fx-current .km-content {
  will-change: transform;
  transform: translateX(0);
}

.k-fx-slide.k-fx-reverse.k-fx-end .k-fx-current .k-content, .k-fx-slide.k-fx-reverse.k-fx-end .k-fx-current .km-content {
  transform: translateX(100%);
}

.k-fx-slide.k-fx-reverse.k-fx-start .k-fx-next .k-content, .k-fx-slide.k-fx-reverse.k-fx-start .k-fx-next .km-content {
  transform: translateX(-100%);
}

.k-fx-slide.k-fx-reverse.k-fx-end .k-fx-next .k-content, .k-fx-slide.k-fx-reverse.k-fx-end .k-fx-next .km-content {
  transform: translateX(0);
}

.k-fx-slide.k-fx-reverse.k-fx-start .k-fx-current .k-header, .k-fx-slide.k-fx-reverse.k-fx-start .k-fx-current .k-footer, .k-fx-slide.k-fx-reverse.k-fx-start .k-fx-current .km-header, .k-fx-slide.k-fx-reverse.k-fx-start .k-fx-current .km-footer {
  will-change: opacity;
  opacity: 1;
}

.k-fx-slide.k-fx-reverse.k-fx-start .k-fx-next .k-header, .k-fx-slide.k-fx-reverse.k-fx-start .k-fx-next .k-footer, .k-fx-slide.k-fx-reverse.k-fx-start .k-fx-next .km-header, .k-fx-slide.k-fx-reverse.k-fx-start .k-fx-next .km-footer {
  opacity: 1;
}

.k-fx-slide.k-fx-reverse.k-fx-end .k-fx-current .k-header, .k-fx-slide.k-fx-reverse.k-fx-end .k-fx-current .k-footer, .k-fx-slide.k-fx-reverse.k-fx-end .k-fx-current .km-header, .k-fx-slide.k-fx-reverse.k-fx-end .k-fx-current .km-footer {
  opacity: 0;
}

.k-fx-slide.k-fx-reverse.k-fx-end .k-fx-next .k-header, .k-fx-slide.k-fx-reverse.k-fx-end .k-fx-next .k-footer, .k-fx-slide.k-fx-reverse.k-fx-end .k-fx-next .km-header, .k-fx-slide.k-fx-reverse.k-fx-end .k-fx-next .km-footer {
  opacity: 1;
}

.k-fx-slide.k-fx-right.k-fx-start .k-fx-next .k-content, .k-fx-slide.k-fx-right.k-fx-start .k-fx-next .km-content {
  transform: translateX(-100%);
}

.k-fx-slide.k-fx-right.k-fx-end .k-fx-current .k-content, .k-fx-slide.k-fx-right.k-fx-end .k-fx-current .km-content {
  transform: translateX(100%);
}

.k-fx-slide.k-fx-right.k-fx-reverse.k-fx-start .k-fx-current .k-content, .k-fx-slide.k-fx-right.k-fx-reverse.k-fx-start .k-fx-current .km-content {
  transform: translateX(0);
}

.k-fx-slide.k-fx-right.k-fx-reverse.k-fx-end .k-fx-current .k-content, .k-fx-slide.k-fx-right.k-fx-reverse.k-fx-end .k-fx-current .km-content {
  transform: translateX(-100%);
}

.k-fx-slide.k-fx-right.k-fx-reverse.k-fx-start .k-fx-next .k-content, .k-fx-slide.k-fx-right.k-fx-reverse.k-fx-start .k-fx-next .km-content {
  transform: translateX(100%);
}

.k-fx-slide.k-fx-right.k-fx-reverse.k-fx-end .k-fx-next .k-content, .k-fx-slide.k-fx-right.k-fx-reverse.k-fx-end .k-fx-next .km-content {
  transform: translateX(0%);
}

.k-fx-tile.k-fx-start .k-fx-next {
  will-change: transform;
  transform: translateX(100%);
}

.k-fx-tile.k-fx-end .k-fx-current {
  transform: translateX(-100%);
}

.k-fx-tile.k-fx-reverse.k-fx-start .k-fx-current {
  will-change: transform;
  transform: translateX(0);
}

.k-fx-tile.k-fx-reverse.k-fx-end .k-fx-current {
  transform: translateX(100%);
}

.k-fx-tile.k-fx-reverse.k-fx-start .k-fx-next {
  transform: translateX(-100%);
}

.k-fx-tile.k-fx-reverse.k-fx-end .k-fx-next {
  transform: translateX(0);
}

.k-fx-tile.k-fx-right.k-fx-start .k-fx-next {
  transform: translateX(-100%);
}

.k-fx-tile.k-fx-right.k-fx-end .k-fx-current {
  transform: translateX(100%);
}

.k-fx-tile.k-fx-right.k-fx-reverse.k-fx-start .k-fx-current {
  transform: translateX(0);
}

.k-fx-tile.k-fx-right.k-fx-reverse.k-fx-end .k-fx-current {
  transform: translateX(-100%);
}

.k-fx-tile.k-fx-right.k-fx-reverse.k-fx-start .k-fx-next {
  transform: translateX(100%);
}

.k-fx-tile.k-fx-right.k-fx-reverse.k-fx-end .k-fx-next {
  transform: translateX(0%);
}

.k-fx.k-fx-overlay.k-fx-start .k-fx-next, .k-fx.k-fx-overlay.k-fx-left.k-fx-start .k-fx-next {
  will-change: transform;
  transform: translateX(100%);
}

.k-fx.k-fx-overlay.k-fx-right.k-fx-start .k-fx-next {
  transform: translateX(-100%);
}

.k-fx.k-fx-overlay.k-fx-up.k-fx-start .k-fx-next {
  transform: translateY(100%);
}

.k-fx.k-fx-overlay.k-fx-down.k-fx-start .k-fx-next {
  transform: translateY(-100%);
}

.k-fx.k-fx-overlay.k-fx-reverse.k-fx-start .k-fx-next {
  transform: none;
}

.k-fx.k-fx-overlay.k-fx-reverse.k-fx-start .k-fx-current {
  will-change: transform;
  transform: none;
}

.k-fx.k-fx-overlay.k-fx-reverse.k-fx-end .k-fx-current, .k-fx.k-fx-overlay.k-fx-reverse.k-fx-left.k-fx-end .k-fx-current {
  transform: translateX(100%);
}

.k-fx.k-fx-overlay.k-fx-reverse.k-fx-right.k-fx-end .k-fx-current {
  transform: translateX(-100%);
}

.k-fx.k-fx-overlay.k-fx-reverse.k-fx-up.k-fx-end .k-fx-current {
  transform: translateY(100%);
}

.k-fx.k-fx-overlay.k-fx-reverse.k-fx-down.k-fx-end .k-fx-current {
  transform: translateY(-100%);
}

.k-theme-test-class,
.k-common-test-class {
  opacity: 0;
}

.k-hstack, .k-hbox {
  display: flex;
  flex-flow: row nowrap;
}

.k-vstack, .k-vbox {
  display: flex;
  flex-flow: column nowrap;
}

.k-spacer, .k-flex {
  flex: 1 1 auto;
}

.k-spacer-sized {
  flex: none;
}

.k-float-wrap::after, .k-floatwrap::after {
  content: "";
  display: block;
  clear: both;
}

.k-flex-layout {
  display: flex;
}

.k-grid-layout {
  display: grid;
}

.k-separator {
  width: auto;
  height: 0;
  border-width: 1px 0 0;
  border-style: solid;
  border-color: inherit;
  display: block;
  flex-grow: 0 !important;
  flex-shrink: 0 !important;
  align-self: stretch;
}

.k-separator-horizontal,
.k-vstack > .k-separator,
.k-vbox > .k-separator {
  width: auto;
  height: 0;
  border-width: 1px 0 0;
}

.k-separator-vertical,
.k-hstack > .k-separator,
.k-hbox > .k-separator {
  width: 0;
  height: auto;
  border-width: 0 0 0 1px;
}

hr.k-separator {
  margin: 0;
  padding: 0;
}

.k-hidden {
  display: none !important;
}

.k-rtl {
  direction: rtl;
}

[hidden] {
  display: none !important;
}

script {
  display: none !important;
}

.k-disabled,
.k-widget[disabled],
.k-disabled {
  outline: none;
  cursor: default;
  color: var(--kendo-disabled-text, unset);
  background-color: var(--kendo-disabled-bg, unset);
  border-color: var(--kendo-disabled-border, unset);
  opacity: var(--kendo-disabled-opacity, unset);
  filter: var(--kendo-disabled-filter, unset);
  pointer-events: none;
  box-shadow: none;
}

.k-disabled .k-link,
.k-widget[disabled] .k-link,
.k-disabled .k-link {
  cursor: default;
  outline: 0;
}

.k-disabled [disabled],
.k-disabled .k-disabled,
.k-widget[disabled] [disabled],
.k-widget[disabled] .k-disabled,
.k-disabled [disabled],
.k-disabled .k-disabled {
  --kendo-disabled-opacity: 1;
  --kendo-disabled-filter: grayscale(0);
}

.k-hr {
  margin-block: var(--kendo-spacing-4, 1rem);
  padding: 0;
  height: 0;
  border-width: 1px 0 0;
  border-style: solid;
  border-color: var(--kendo-hr-border, unset);
  display: block;
  float: none;
  clear: both;
}

.k-d-flex-row > .k-hr {
  margin: 0;
  width: 0;
  height: auto;
  border-width: 0 0 0 1px;
  flex: 0 0 auto;
}

.k-d-flex-col > .k-hr {
  margin: 0;
  flex: 0 0 auto;
}

.k-sprite {
  display: inline-block;
  width: 1rem;
  height: 1rem;
  overflow: hidden;
  background-repeat: no-repeat;
  font-size: 0;
  line-height: 0;
  text-align: center;
}

.k-image {
  display: inline-block;
}

.k-reset {
  margin: 0;
  padding: 0;
  border-width: 0;
  outline: 0;
  text-decoration: none;
  font: inherit;
  list-style: none;
}

kendo-sortable {
  display: block;
}

.k-link,
.k-link:hover {
  color: inherit;
  text-decoration: none;
  outline: 0;
  cursor: pointer;
}

.k-content {
  outline: 0;
}

.k-centered {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.k-no-click {
  pointer-events: none;
}

.k-pdf-export-shadow {
  position: absolute;
  overflow: hidden;
  left: -15000px;
  width: 14400px;
}

.kendo-pdf-hide-pseudo-elements::before,
.kendo-pdf-hide-pseudo-elements::after {
  display: none !important;
}

.k-dirty {
  margin: 0;
  padding: 0;
  width: 0;
  height: 0;
  border-width: 3px;
  border-style: solid;
  border-block-start-color: currentColor;
  border-block-end-color: transparent;
  border-inline-start-color: transparent;
  border-inline-end-color: currentColor;
  position: absolute;
  inset-block-start: 0;
  inset-inline-end: 0;
}

.k-marquee {
  position: absolute;
  z-index: 100000;
}

.k-marquee-color,
.k-marquee-text {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.k-marquee-color {
  color: var(--kendo-marquee-text, unset);
  background-color: var(--kendo-marquee-bg, unset);
  border-color: var(--kendo-marquee-border, unset);
  opacity: 0.6;
}

.k-marquee-text {
  color: var(--kendo-marquee-text, unset);
}

.k-text-selection ::selection {
  background-color: var(--kendo-text-selection-bg, unset);
  color: var(--kendo-marquee-text, unset);
}

.k-scrollbar {
  position: absolute;
  overflow: scroll;
}

.k-scrollbar-vertical {
  top: 0;
  right: 0;
  width: 17px;
  height: 100%;
  overflow-x: hidden;
}

.k-touch-scrollbar {
  display: none;
  position: absolute;
  z-index: 200000;
  height: 8px;
  width: 8px;
  border: 1px solid #8a8a8a;
  background-color: #858585;
}

.k-resize-handle,
.k-resize-hint {
  position: absolute;
  border-color: inherit;
  z-index: 200;
}

.k-resize-handle {
  display: flex;
  align-items: center;
  justify-content: center;
}

.k-resize-handle::before {
  content: "";
  border: 0 solid;
  border-color: inherit;
}

.k-resize-n {
  width: 100%;
  height: 6px;
  flex-direction: row;
  left: 0;
  top: -3px;
  cursor: n-resize;
}

.k-resize-s {
  width: 100%;
  height: 6px;
  flex-direction: row;
  left: 0;
  bottom: -3px;
  cursor: s-resize;
}

.k-resize-w {
  width: 6px;
  height: 100%;
  flex-direction: column;
  top: 0;
  left: -3px;
  cursor: w-resize;
}

.k-resize-e {
  width: 6px;
  height: 100%;
  flex-direction: column;
  top: 0;
  right: -3px;
  cursor: e-resize;
}

.k-resize-sw,
.k-resize-se,
.k-resize-nw,
.k-resize-ne {
  width: 5px;
  height: 5px;
}

.k-resize-sw {
  cursor: sw-resize;
  bottom: 0;
  left: 0;
}

.k-resize-se {
  cursor: se-resize;
  bottom: 0;
  right: 0;
}

.k-resize-nw {
  cursor: nw-resize;
  top: 0;
  left: 0;
}

.k-resize-ne {
  cursor: ne-resize;
  top: 0;
  right: 0;
}

.k-vertical-resize {
  cursor: row-resize;
}

.k-horizontal-resize {
  cursor: col-resize;
}

.k-resize-hint {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.k-resize-hint .k-resize-hint-handle {
  width: auto;
  height: 20px;
  align-self: stretch;
}

.k-resize-hint .k-resize-hint-marker {
  width: 2px;
  height: auto;
  flex: 1 1 auto;
}

.k-resize-hint-vertical {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.k-resize-hint-vertical .k-resize-hint-handle {
  width: 20px;
  height: auto;
  align-self: stretch;
}

.k-resize-hint-vertical .k-resize-hint-marker {
  width: auto;
  height: 2px;
  flex: 1 1 auto;
}

.k-top-start,
.k-pos-top-start {
  top: 0;
  inset-inline-start: 0;
}

.k-top-end,
.k-pos-top-end {
  top: 0;
  inset-inline-end: 0;
}

.k-bottom-start,
.k-pos-bottom-start {
  bottom: 0;
  inset-inline-start: 0;
}

.k-bottom-end,
.k-pos-bottom-end {
  bottom: 0;
  inset-inline-end: 0;
}

.k-top-center,
.k-pos-top-center {
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}

.k-middle-left,
.k-middle-start,
.k-pos-middle-start {
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}

.k-middle-center {
  top: 50%;
  left: 50%;
  transform: translateY(-50%);
}

.k-middle-right,
.k-middle-end,
.k-pos-middle-end {
  top: 50%;
  right: 0;
  transform: translateY(-50%);
}

.k-bottom-center,
.k-pos-bottom-center {
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}

:root {
  --kendo-spacing-0: 0px;
  --kendo-spacing-1px: 1px;
  --kendo-spacing-0\.5: 0.125rem;
  --kendo-spacing-1: 0.25rem;
  --kendo-spacing-1\.5: 0.375rem;
  --kendo-spacing-2: 0.5rem;
  --kendo-spacing-2\.5: 0.625rem;
  --kendo-spacing-3: 0.75rem;
  --kendo-spacing-3\.5: 0.875rem;
  --kendo-spacing-4: 1rem;
  --kendo-spacing-4\.5: 1.125rem;
  --kendo-spacing-5: 1.25rem;
  --kendo-spacing-5\.5: 1.375rem;
  --kendo-spacing-6: 1.5rem;
  --kendo-spacing-6\.5: 1.625rem;
  --kendo-spacing-7: 1.75rem;
  --kendo-spacing-7\.5: 1.875rem;
  --kendo-spacing-8: 2rem;
  --kendo-spacing-9: 2.25rem;
  --kendo-spacing-10: 2.5rem;
  --kendo-spacing-11: 2.75rem;
  --kendo-spacing-12: 3rem;
  --kendo-spacing-13: 3.25rem;
  --kendo-spacing-14: 3.5rem;
  --kendo-spacing-15: 3.75rem;
  --kendo-spacing-16: 4rem;
  --kendo-spacing-17: 4.25rem;
  --kendo-spacing-18: 4.5rem;
  --kendo-spacing-19: 4.75rem;
  --kendo-spacing-20: 5rem;
  --kendo-spacing-21: 5.25rem;
  --kendo-spacing-22: 5.5rem;
  --kendo-spacing-23: 5.75rem;
  --kendo-spacing-24: 6rem;
  --kendo-spacing-25: 7rem;
  --kendo-spacing-26: 8rem;
  --kendo-spacing-27: 9rem;
  --kendo-spacing-28: 10rem;
  --kendo-spacing-29: 11rem;
  --kendo-spacing-30: 12rem;
}

:root {
  --kendo-elevation-1: 0 2px 3px rgba(0, 0, 0, 0.04), 0 4px 16px rgba(0, 0, 0, 0.12);
  --kendo-elevation-2: 0 4px 6px rgba(0, 0, 0, 0.06), 0 4px 16px rgba(0, 0, 0, 0.12);
  --kendo-elevation-3: 0 6px 8px rgba(0, 0, 0, 0.08), 0 4px 16px rgba(0, 0, 0, 0.12);
  --kendo-elevation-4: 0 8px 10px rgba(0, 0, 0, 0.12), 0 4px 16px rgba(0, 0, 0, 0.12);
  --kendo-elevation-5: 0 10px 12px rgba(0, 0, 0, 0.16), 0 4px 16px rgba(0, 0, 0, 0.12);
  --kendo-elevation-6: 0 12px 14px rgba(0, 0, 0, 0.2), 0 4px 16px rgba(0, 0, 0, 0.12);
  --kendo-elevation-7: 0 14px 16px rgba(0, 0, 0, 0.24), 0 4px 16px rgba(0, 0, 0, 0.12);
  --kendo-elevation-8: 0 16px 18px rgba(0, 0, 0, 0.28), 0 4px 16px rgba(0, 0, 0, 0.12);
  --kendo-elevation-9: 0 32px 34px rgba(0, 0, 0, 0.32), 0 4px 16px rgba(0, 0, 0, 0.12);
}

:root {
  --kendo-font-family: inherit;
  --kendo-font-size: 0.875rem;
  --kendo-line-height: 1.4285714286;
  --kendo-font-weight: 400;
  --kendo-letter-spacing: ;
  --kendo-font-size-xxs: 0.5rem;
  --kendo-font-size-xs: 0.625rem;
  --kendo-font-size-sm: 0.75rem;
  --kendo-font-size-md: 0.875rem;
  --kendo-font-size-lg: 1rem;
  --kendo-font-size-xl: 1.25rem;
  --kendo-line-height-xs: 1;
  --kendo-line-height-sm: 1.25;
  --kendo-line-height-md: 1.4285714286;
  --kendo-line-height-lg: 1.5;
  --kendo-font-weight-thin: 100;
  --kendo-font-weight-extra-light: 200;
  --kendo-font-weight-light: 300;
  --kendo-font-weight-normal: 400;
  --kendo-font-weight-medium: 500;
  --kendo-font-weight-semibold: 600;
  --kendo-font-weight-bold: 700;
  --kendo-letter-spacing-tightest: -0.15px;
  --kendo-letter-spacing-tighter: -0.1px;
  --kendo-letter-spacing-tight: -0.5px;
  --kendo-letter-spacing-normal: 0px;
  --kendo-letter-spacing-wide: 0.5px;
  --kendo-letter-spacing-wider: 0.1px;
  --kendo-letter-spacing-widest: 0.15px;
  --kendo-font-family-sans: Arial, Verdana, Tahoma, Trebuchet MS, Helvetica, Impact, Gill Sans;
  --kendo-font-family-serif: Times New Roman, Georgia, Garamond, Palatino, Baskerville;
  --kendo-font-family-sans-serif: system-ui, -apple-system, Segoe UI, Roboto, Helvetica Neue, Noto Sans, Liberation Sans, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
  --kendo-font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, Roboto Mono, Ubuntu Mono, Lucida Console, Courier New, monospace;
}

:root {
  --kendo-border-radius-none: 0px;
  --kendo-border-radius-xs: 1px;
  --kendo-border-radius-sm: 0.125rem;
  --kendo-border-radius-md: 0.25rem;
  --kendo-border-radius-lg: 0.375rem;
  --kendo-border-radius-xl: 0.5rem;
  --kendo-border-radius-xxl: 0.75rem;
  --kendo-border-radius-xxxl: 1rem;
  --kendo-border-radius-full: 9999px;
}

.k-rounded-none {
  border-radius: var(--kendo-border-radius-none, 0px);
}

.k-rounded-xs {
  border-radius: var(--kendo-border-radius-xs, 1px);
}

.k-rounded-sm {
  border-radius: var(--kendo-border-radius-sm, 0.125rem);
}

.k-rounded-md {
  border-radius: var(--kendo-border-radius-md, 0.25rem);
}

.k-rounded-lg {
  border-radius: var(--kendo-border-radius-lg, 0.375rem);
}

.k-rounded-xl {
  border-radius: var(--kendo-border-radius-xl, 0.5rem);
}

.k-rounded-xxl {
  border-radius: var(--kendo-border-radius-xxl, 0.75rem);
}

.k-rounded-xxxl {
  border-radius: var(--kendo-border-radius-xxxl, 1rem);
}

.k-rounded-full {
  border-radius: var(--kendo-border-radius-full, 9999px);
}

.k-svg-icon {
  width: 16px;
  height: 16px;
  outline: 0;
  line-height: 1;
  display: inline-flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
  position: relative;
}

.k-svg-icon > svg {
  fill: currentColor;
  flex: 1 1 auto;
}

.k-svg-icon.k-icon-xs {
  width: calc(16px * 0.75);
  height: calc(16px * 0.75);
}

.k-svg-icon.k-icon-sm {
  width: calc(16px * 0.875);
  height: calc(16px * 0.875);
}

.k-svg-icon.k-icon-md {
  width: 16px;
  height: 16px;
}

.k-svg-icon.k-icon-lg {
  width: calc(16px * 1.25);
  height: calc(16px * 1.25);
}

.k-svg-icon.k-icon-xl {
  width: calc(16px * 1.5);
  height: calc(16px * 1.5);
}

.k-svg-icon.k-icon-xxl {
  width: calc(16px * 2);
  height: calc(16px * 2);
}

.k-svg-icon.k-icon-xxxl {
  width: calc(16px * 3);
  height: calc(16px * 3);
}

.k-flip-h.k-svg-icon, .k-svg-icon.k-flip-x,
.k-flip-v.k-svg-icon,
.k-svg-icon.k-flip-y,
.k-flip-h.k-flip-v.k-svg-icon {
  transform: none;
}

.k-flip-h > svg, .k-flip-x > svg {
  transform: scaleX(-1);
}

.k-flip-v > svg, .k-flip-y > svg {
  transform: scaleY(-1);
}

.k-flip-h.k-flip-v > svg, .k-flip-h.k-flip-y > svg, .k-flip-v.k-flip-x > svg, .k-flip-x.k-flip-y > svg,
.k-flip-both > svg {
  transform: scale(-1, -1);
}

.k-rotate-0.k-svg-icon {
  transform: none;
}

.k-rotate-0 > svg {
  transform: rotate(0deg);
}

.k-rotate-45.k-svg-icon {
  transform: none;
}

.k-rotate-45 > svg {
  transform: rotate(45deg);
}

.k-rotate-90.k-svg-icon {
  transform: none;
}

.k-rotate-90 > svg {
  transform: rotate(90deg);
}

.k-rotate-135.k-svg-icon {
  transform: none;
}

.k-rotate-135 > svg {
  transform: rotate(135deg);
}

.k-rotate-180.k-svg-icon {
  transform: none;
}

.k-rotate-180 > svg {
  transform: rotate(180deg);
}

.k-rotate-225.k-svg-icon {
  transform: none;
}

.k-rotate-225 > svg {
  transform: rotate(225deg);
}

.k-rotate-270.k-svg-icon {
  transform: none;
}

.k-rotate-270 > svg {
  transform: rotate(270deg);
}

.k-rotate-315.k-svg-icon {
  transform: none;
}

.k-rotate-315 > svg {
  transform: rotate(315deg);
}

.k-icon-wrap {
  flex: none;
  display: inline-flex;
  flex-flow: row nowrap;
  gap: 0;
  align-items: center;
  align-self: flex-start;
  vertical-align: middle;
  position: relative;
}

.k-icon-wrap::before {
  content: "​";
  width: 0;
  overflow: hidden;
  flex: none;
  display: inline-block;
  vertical-align: top;
}

.k-icon-wrapper-host {
  display: contents;
}

.k-icon-with-modifier {
  position: relative;
  margin: 0.25em;
}

.k-icon.k-icon-modifier {
  width: 1em;
  height: 1em;
  position: absolute;
  font-size: 0.5em;
  bottom: 0;
  right: 0;
  margin: 0 -0.5em -0.5em 0;
}

.k-i-none::before {
  content: "";
  display: none;
}

.k-icon-action {
  display: inline-flex;
  padding: var(--kendo-spacing-1, 0.25rem);
  line-height: 1;
  align-items: center;
  vertical-align: middle;
  cursor: pointer;
}

.k-sprite {
  display: inline-block;
  width: 16px;
  height: 16px;
  overflow: hidden;
  background-repeat: no-repeat;
  font-size: 0;
  line-height: 0;
  text-align: center;
}

.k-image {
  display: inline-block;
}

.k-rotate-0 {
  transform: rotate(0deg);
}

.\!k-rotate-0 {
  transform: rotate(0deg) !important;
}

.k-rotate-45 {
  transform: rotate(45deg);
}

.\!k-rotate-45 {
  transform: rotate(45deg) !important;
}

.k-rotate-90 {
  transform: rotate(90deg);
}

.\!k-rotate-90 {
  transform: rotate(90deg) !important;
}

.k-rotate-135 {
  transform: rotate(135deg);
}

.\!k-rotate-135 {
  transform: rotate(135deg) !important;
}

.k-rotate-180 {
  transform: rotate(180deg);
}

.\!k-rotate-180 {
  transform: rotate(180deg) !important;
}

.k-rotate-225 {
  transform: rotate(225deg);
}

.\!k-rotate-225 {
  transform: rotate(225deg) !important;
}

.k-rotate-270 {
  transform: rotate(270deg);
}

.\!k-rotate-270 {
  transform: rotate(270deg) !important;
}

.k-rotate-315 {
  transform: rotate(315deg);
}

.\!k-rotate-315 {
  transform: rotate(315deg) !important;
}

.k-flip-h, .k-flip-x {
  transform: scaleX(-1);
}

.\!k-flip-h, .\!k-flip-x {
  transform: scaleX(-1) !important;
}

.k-flip-v, .k-flip-y {
  transform: scaleY(-1);
}

.\!k-flip-v, .\!k-flip-y {
  transform: scaleY(-1) !important;
}

.k-flip-h.k-flip-v, .k-flip-h.k-flip-y, .k-flip-v.k-flip-x, .k-flip-x.k-flip-y {
  transform: scale(-1, -1);
}

.\!k-flip-h.\!k-flip-v, .\!k-flip-h.\!k-flip-y, .\!k-flip-v.\!k-flip-x, .\!k-flip-x.\!k-flip-y {
  transform: scale(-1, -1) !important;
}

.k-text-app-surface {
  color: var(--kendo-color-app-surface, #ffffff);
}

.\!k-text-app-surface {
  color: var(--kendo-color-app-surface, #ffffff) !important;
}

.k-text-on-app-surface {
  color: var(--kendo-color-on-app-surface, #3d3d3d);
}

.\!k-text-on-app-surface {
  color: var(--kendo-color-on-app-surface, #3d3d3d) !important;
}

.k-text-subtle {
  color: var(--kendo-color-subtle, #666666);
}

.\!k-text-subtle {
  color: var(--kendo-color-subtle, #666666) !important;
}

.k-text-surface {
  color: var(--kendo-color-surface, #fafafa);
}

.\!k-text-surface {
  color: var(--kendo-color-surface, #fafafa) !important;
}

.k-text-surface-alt {
  color: var(--kendo-color-surface-alt, #ffffff);
}

.\!k-text-surface-alt {
  color: var(--kendo-color-surface-alt, #ffffff) !important;
}

.k-text-border {
  color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
}

.\!k-text-border {
  color: var(--kendo-color-border, rgba(0, 0, 0, 0.08)) !important;
}

.k-text-border-alt {
  color: var(--kendo-color-border-alt, rgba(0, 0, 0, 0.16));
}

.\!k-text-border-alt {
  color: var(--kendo-color-border-alt, rgba(0, 0, 0, 0.16)) !important;
}

.k-text-base-subtle {
  color: var(--kendo-color-base-subtle, #ebebeb);
}

.\!k-text-base-subtle {
  color: var(--kendo-color-base-subtle, #ebebeb) !important;
}

.k-text-base-emphasis {
  color: var(--kendo-color-base-emphasis, #c2c2c2);
}

.\!k-text-base-emphasis {
  color: var(--kendo-color-base-emphasis, #c2c2c2) !important;
}

.k-text-primary-subtle {
  color: var(--kendo-color-primary-subtle, #ffeceb);
}

.\!k-text-primary-subtle {
  color: var(--kendo-color-primary-subtle, #ffeceb) !important;
}

.k-text-primary {
  color: var(--kendo-color-primary, #ff6358);
}

.\!k-text-primary {
  color: var(--kendo-color-primary, #ff6358) !important;
}

.k-text-primary-emphasis {
  color: var(--kendo-color-primary-emphasis, #ff9d97);
}

.\!k-text-primary-emphasis {
  color: var(--kendo-color-primary-emphasis, #ff9d97) !important;
}

.k-text-secondary-subtle {
  color: var(--kendo-color-secondary-subtle, #fafafa);
}

.\!k-text-secondary-subtle {
  color: var(--kendo-color-secondary-subtle, #fafafa) !important;
}

.k-text-secondary {
  color: var(--kendo-color-secondary, #666666);
}

.\!k-text-secondary {
  color: var(--kendo-color-secondary, #666666) !important;
}

.k-text-secondary-emphasis {
  color: var(--kendo-color-secondary-emphasis, #e0e0e0);
}

.\!k-text-secondary-emphasis {
  color: var(--kendo-color-secondary-emphasis, #e0e0e0) !important;
}

.k-text-tertiary-subtle {
  color: var(--kendo-color-tertiary-subtle, #d8f1fd);
}

.\!k-text-tertiary-subtle {
  color: var(--kendo-color-tertiary-subtle, #d8f1fd) !important;
}

.k-text-tertiary {
  color: var(--kendo-color-tertiary, #03a9f4);
}

.\!k-text-tertiary {
  color: var(--kendo-color-tertiary, #03a9f4) !important;
}

.k-text-tertiary-emphasis {
  color: var(--kendo-color-tertiary-emphasis, #61c9f9);
}

.\!k-text-tertiary-emphasis {
  color: var(--kendo-color-tertiary-emphasis, #61c9f9) !important;
}

.k-text-info-subtle {
  color: var(--kendo-color-info-subtle, #d2e2fb);
}

.\!k-text-info-subtle {
  color: var(--kendo-color-info-subtle, #d2e2fb) !important;
}

.k-text-info {
  color: var(--kendo-color-info, #0058e9);
}

.\!k-text-info {
  color: var(--kendo-color-info, #0058e9) !important;
}

.k-text-info-emphasis {
  color: var(--kendo-color-info-emphasis, #6098f2);
}

.\!k-text-info-emphasis {
  color: var(--kendo-color-info-emphasis, #6098f2) !important;
}

.k-text-success-subtle {
  color: var(--kendo-color-success-subtle, #dcf0d3);
}

.\!k-text-success-subtle {
  color: var(--kendo-color-success-subtle, #dcf0d3) !important;
}

.k-text-success {
  color: var(--kendo-color-success, #37b400);
}

.\!k-text-success {
  color: var(--kendo-color-success, #37b400) !important;
}

.k-text-success-emphasis {
  color: var(--kendo-color-success-emphasis, #81d15f);
}

.\!k-text-success-emphasis {
  color: var(--kendo-color-success-emphasis, #81d15f) !important;
}

.k-text-warning-subtle {
  color: var(--kendo-color-warning-subtle, #fff4d3);
}

.\!k-text-warning-subtle {
  color: var(--kendo-color-warning-subtle, #fff4d3) !important;
}

.k-text-warning {
  color: var(--kendo-color-warning, #ffc000);
}

.\!k-text-warning {
  color: var(--kendo-color-warning, #ffc000) !important;
}

.k-text-warning-emphasis {
  color: var(--kendo-color-warning-emphasis, #ffd760);
}

.\!k-text-warning-emphasis {
  color: var(--kendo-color-warning-emphasis, #ffd760) !important;
}

.k-text-error-subtle {
  color: var(--kendo-color-error-subtle, #fcddda);
}

.\!k-text-error-subtle {
  color: var(--kendo-color-error-subtle, #fcddda) !important;
}

.k-text-error {
  color: var(--kendo-color-error, #f31700);
}

.\!k-text-error {
  color: var(--kendo-color-error, #f31700) !important;
}

.k-text-error-emphasis {
  color: var(--kendo-color-error-emphasis, #f76f60);
}

.\!k-text-error-emphasis {
  color: var(--kendo-color-error-emphasis, #f76f60) !important;
}

.k-text-light-subtle {
  color: var(--kendo-color-light-subtle, #fafafa);
}

.\!k-text-light-subtle {
  color: var(--kendo-color-light-subtle, #fafafa) !important;
}

.k-text-light {
  color: var(--kendo-color-light, #ebebeb);
}

.\!k-text-light {
  color: var(--kendo-color-light, #ebebeb) !important;
}

.k-text-light-emphasis {
  color: var(--kendo-color-light-emphasis, #d6d6d6);
}

.\!k-text-light-emphasis {
  color: var(--kendo-color-light-emphasis, #d6d6d6) !important;
}

.k-text-dark-subtle {
  color: var(--kendo-color-dark-subtle, #c2c2c2);
}

.\!k-text-dark-subtle {
  color: var(--kendo-color-dark-subtle, #c2c2c2) !important;
}

.k-text-dark {
  color: var(--kendo-color-dark, #3d3d3d);
}

.\!k-text-dark {
  color: var(--kendo-color-dark, #3d3d3d) !important;
}

.k-text-dark-emphasis {
  color: var(--kendo-color-dark-emphasis, #666666);
}

.\!k-text-dark-emphasis {
  color: var(--kendo-color-dark-emphasis, #666666) !important;
}

.k-text-inherit {
  color: var(--kendo-color-inherit, inherit);
}

.\!k-text-inherit {
  color: var(--kendo-color-inherit, inherit) !important;
}

.k-text-current {
  color: var(--kendo-color-current, currentColor);
}

.\!k-text-current {
  color: var(--kendo-color-current, currentColor) !important;
}

.k-text-transparent {
  color: var(--kendo-color-transparent, transparent);
}

.\!k-text-transparent {
  color: var(--kendo-color-transparent, transparent) !important;
}

.k-text-black {
  color: var(--kendo-color-black, black);
}

.\!k-text-black {
  color: var(--kendo-color-black, black) !important;
}

.k-text-white {
  color: var(--kendo-color-white, white);
}

.\!k-text-white {
  color: var(--kendo-color-white, white) !important;
}

.k-color-app-surface {
  color: var(--kendo-color-app-surface, #ffffff);
}

.\!k-color-app-surface {
  color: var(--kendo-color-app-surface, #ffffff) !important;
}

.k-color-on-app-surface {
  color: var(--kendo-color-on-app-surface, #3d3d3d);
}

.\!k-color-on-app-surface {
  color: var(--kendo-color-on-app-surface, #3d3d3d) !important;
}

.k-color-subtle {
  color: var(--kendo-color-subtle, #666666);
}

.\!k-color-subtle {
  color: var(--kendo-color-subtle, #666666) !important;
}

.k-color-surface {
  color: var(--kendo-color-surface, #fafafa);
}

.\!k-color-surface {
  color: var(--kendo-color-surface, #fafafa) !important;
}

.k-color-surface-alt {
  color: var(--kendo-color-surface-alt, #ffffff);
}

.\!k-color-surface-alt {
  color: var(--kendo-color-surface-alt, #ffffff) !important;
}

.k-color-border {
  color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
}

.\!k-color-border {
  color: var(--kendo-color-border, rgba(0, 0, 0, 0.08)) !important;
}

.k-color-border-alt {
  color: var(--kendo-color-border-alt, rgba(0, 0, 0, 0.16));
}

.\!k-color-border-alt {
  color: var(--kendo-color-border-alt, rgba(0, 0, 0, 0.16)) !important;
}

.k-color-base-subtle {
  color: var(--kendo-color-base-subtle, #ebebeb);
}

.\!k-color-base-subtle {
  color: var(--kendo-color-base-subtle, #ebebeb) !important;
}

.k-color-base-emphasis {
  color: var(--kendo-color-base-emphasis, #c2c2c2);
}

.\!k-color-base-emphasis {
  color: var(--kendo-color-base-emphasis, #c2c2c2) !important;
}

.k-color-primary-subtle {
  color: var(--kendo-color-primary-subtle, #ffeceb);
}

.\!k-color-primary-subtle {
  color: var(--kendo-color-primary-subtle, #ffeceb) !important;
}

.k-color-primary {
  color: var(--kendo-color-primary, #ff6358);
}

.\!k-color-primary {
  color: var(--kendo-color-primary, #ff6358) !important;
}

.k-color-primary-emphasis {
  color: var(--kendo-color-primary-emphasis, #ff9d97);
}

.\!k-color-primary-emphasis {
  color: var(--kendo-color-primary-emphasis, #ff9d97) !important;
}

.k-color-secondary-subtle {
  color: var(--kendo-color-secondary-subtle, #fafafa);
}

.\!k-color-secondary-subtle {
  color: var(--kendo-color-secondary-subtle, #fafafa) !important;
}

.k-color-secondary {
  color: var(--kendo-color-secondary, #666666);
}

.\!k-color-secondary {
  color: var(--kendo-color-secondary, #666666) !important;
}

.k-color-secondary-emphasis {
  color: var(--kendo-color-secondary-emphasis, #e0e0e0);
}

.\!k-color-secondary-emphasis {
  color: var(--kendo-color-secondary-emphasis, #e0e0e0) !important;
}

.k-color-tertiary-subtle {
  color: var(--kendo-color-tertiary-subtle, #d8f1fd);
}

.\!k-color-tertiary-subtle {
  color: var(--kendo-color-tertiary-subtle, #d8f1fd) !important;
}

.k-color-tertiary {
  color: var(--kendo-color-tertiary, #03a9f4);
}

.\!k-color-tertiary {
  color: var(--kendo-color-tertiary, #03a9f4) !important;
}

.k-color-tertiary-emphasis {
  color: var(--kendo-color-tertiary-emphasis, #61c9f9);
}

.\!k-color-tertiary-emphasis {
  color: var(--kendo-color-tertiary-emphasis, #61c9f9) !important;
}

.k-color-info-subtle {
  color: var(--kendo-color-info-subtle, #d2e2fb);
}

.\!k-color-info-subtle {
  color: var(--kendo-color-info-subtle, #d2e2fb) !important;
}

.k-color-info {
  color: var(--kendo-color-info, #0058e9);
}

.\!k-color-info {
  color: var(--kendo-color-info, #0058e9) !important;
}

.k-color-info-emphasis {
  color: var(--kendo-color-info-emphasis, #6098f2);
}

.\!k-color-info-emphasis {
  color: var(--kendo-color-info-emphasis, #6098f2) !important;
}

.k-color-success-subtle {
  color: var(--kendo-color-success-subtle, #dcf0d3);
}

.\!k-color-success-subtle {
  color: var(--kendo-color-success-subtle, #dcf0d3) !important;
}

.k-color-success {
  color: var(--kendo-color-success, #37b400);
}

.\!k-color-success {
  color: var(--kendo-color-success, #37b400) !important;
}

.k-color-success-emphasis {
  color: var(--kendo-color-success-emphasis, #81d15f);
}

.\!k-color-success-emphasis {
  color: var(--kendo-color-success-emphasis, #81d15f) !important;
}

.k-color-warning-subtle {
  color: var(--kendo-color-warning-subtle, #fff4d3);
}

.\!k-color-warning-subtle {
  color: var(--kendo-color-warning-subtle, #fff4d3) !important;
}

.k-color-warning {
  color: var(--kendo-color-warning, #ffc000);
}

.\!k-color-warning {
  color: var(--kendo-color-warning, #ffc000) !important;
}

.k-color-warning-emphasis {
  color: var(--kendo-color-warning-emphasis, #ffd760);
}

.\!k-color-warning-emphasis {
  color: var(--kendo-color-warning-emphasis, #ffd760) !important;
}

.k-color-error-subtle {
  color: var(--kendo-color-error-subtle, #fcddda);
}

.\!k-color-error-subtle {
  color: var(--kendo-color-error-subtle, #fcddda) !important;
}

.k-color-error {
  color: var(--kendo-color-error, #f31700);
}

.\!k-color-error {
  color: var(--kendo-color-error, #f31700) !important;
}

.k-color-error-emphasis {
  color: var(--kendo-color-error-emphasis, #f76f60);
}

.\!k-color-error-emphasis {
  color: var(--kendo-color-error-emphasis, #f76f60) !important;
}

.k-color-light-subtle {
  color: var(--kendo-color-light-subtle, #fafafa);
}

.\!k-color-light-subtle {
  color: var(--kendo-color-light-subtle, #fafafa) !important;
}

.k-color-light {
  color: var(--kendo-color-light, #ebebeb);
}

.\!k-color-light {
  color: var(--kendo-color-light, #ebebeb) !important;
}

.k-color-light-emphasis {
  color: var(--kendo-color-light-emphasis, #d6d6d6);
}

.\!k-color-light-emphasis {
  color: var(--kendo-color-light-emphasis, #d6d6d6) !important;
}

.k-color-dark-subtle {
  color: var(--kendo-color-dark-subtle, #c2c2c2);
}

.\!k-color-dark-subtle {
  color: var(--kendo-color-dark-subtle, #c2c2c2) !important;
}

.k-color-dark {
  color: var(--kendo-color-dark, #3d3d3d);
}

.\!k-color-dark {
  color: var(--kendo-color-dark, #3d3d3d) !important;
}

.k-color-dark-emphasis {
  color: var(--kendo-color-dark-emphasis, #666666);
}

.\!k-color-dark-emphasis {
  color: var(--kendo-color-dark-emphasis, #666666) !important;
}

.k-color-inherit {
  color: var(--kendo-color-inherit, inherit);
}

.\!k-color-inherit {
  color: var(--kendo-color-inherit, inherit) !important;
}

.k-color-current {
  color: var(--kendo-color-current, currentColor);
}

.\!k-color-current {
  color: var(--kendo-color-current, currentColor) !important;
}

.k-color-transparent {
  color: var(--kendo-color-transparent, transparent);
}

.\!k-color-transparent {
  color: var(--kendo-color-transparent, transparent) !important;
}

.k-color-black {
  color: var(--kendo-color-black, black);
}

.\!k-color-black {
  color: var(--kendo-color-black, black) !important;
}

.k-color-white {
  color: var(--kendo-color-white, white);
}

.\!k-color-white {
  color: var(--kendo-color-white, white) !important;
}

.k-badge {
  padding: 0;
  border-width: 1px;
  border-style: solid;
  border-color: transparent;
  box-sizing: border-box;
  color: inherit;
  background-color: transparent;
  font: inherit;
  text-align: center;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
  overflow: hidden;
  text-overflow: ellipsis;
}

.k-badge *,
.k-badge *::before,
.k-badge *::after {
  box-sizing: border-box;
}

.k-badge > * {
  color: inherit;
}

a.k-badge,
.k-badge > a {
  text-decoration: none;
}

a.k-badge:hover,
.k-badge > a:hover {
  text-decoration: underline;
}

.k-badge-icon {
  max-width: 1em;
  max-height: 1em;
  font-size: inherit;
}

.k-badge-icon.k-svg-icon svg {
  fill: currentColor;
}

.k-badge-sm {
  padding-block: var(--kendo-spacing-0\.5, 0.125rem);
  padding-inline: var(--kendo-spacing-0\.5, 0.125rem);
  font-size: var(--kendo-font-size-xs, inherit);
  line-height: 1;
  min-width: calc(1em + var(--kendo-spacing-0\.5, 0.125rem) * 2 + 1px * 2);
}

.k-badge-sm:empty {
  padding: var(--kendo-spacing-0\.5, 0.125rem);
  min-width: auto;
}

.k-badge-md {
  padding-block: var(--kendo-spacing-1, 0.25rem);
  padding-inline: var(--kendo-spacing-1, 0.25rem);
  font-size: var(--kendo-font-size-xs, inherit);
  line-height: 1;
  min-width: calc(1em + var(--kendo-spacing-1, 0.25rem) * 2 + 1px * 2);
}

.k-badge-md:empty {
  padding: var(--kendo-spacing-1, 0.25rem);
  min-width: auto;
}

.k-badge-lg {
  padding-block: var(--kendo-spacing-1\.5, 0.375rem);
  padding-inline: var(--kendo-spacing-1\.5, 0.375rem);
  font-size: var(--kendo-font-size-xs, inherit);
  line-height: 1;
  min-width: calc(1em + var(--kendo-spacing-1\.5, 0.375rem) * 2 + 1px * 2);
}

.k-badge-lg:empty {
  padding: var(--kendo-spacing-1\.5, 0.375rem);
  min-width: auto;
}

kendo-badge-container {
  display: inline-block;
}

.k-badge-container {
  position: relative;
  overflow: visible;
}

.k-badge-inside {
  position: absolute;
  z-index: 9999;
}

.k-badge-edge {
  position: absolute;
  z-index: 9999;
}

.k-badge-edge.k-top-start {
  transform: translate(-50%, -50%);
}

.k-badge-edge.k-top-end {
  transform: translate(50%, -50%);
}

.k-badge-edge.k-bottom-start {
  transform: translate(-50%, 50%);
}

.k-badge-edge.k-bottom-end {
  transform: translate(50%, 50%);
}

.k-rtl .k-badge-edge.k-top-start,
[dir=rtl].k-badge-edge.k-top-start,
[dir=rtl] .k-badge-edge.k-top-start {
  transform: translate(50%, -50%);
}

.k-rtl .k-badge-edge.k-top-end,
[dir=rtl].k-badge-edge.k-top-end,
[dir=rtl] .k-badge-edge.k-top-end {
  transform: translate(-50%, -50%);
}

.k-rtl .k-badge-edge.k-bottom-start,
[dir=rtl].k-badge-edge.k-bottom-start,
[dir=rtl] .k-badge-edge.k-bottom-start {
  transform: translate(50%, 50%);
}

.k-rtl .k-badge-edge.k-bottom-end,
[dir=rtl].k-badge-edge.k-bottom-end,
[dir=rtl] .k-badge-edge.k-bottom-end {
  transform: translate(-50%, 50%);
}

.k-badge-outside {
  position: absolute;
  z-index: 9999;
}

.k-badge-outside.k-top-start {
  transform: translate(-100%, -100%);
}

.k-badge-outside.k-top-end {
  transform: translate(100%, -100%);
}

.k-badge-outside.k-bottom-start {
  transform: translate(-100%, 100%);
}

.k-badge-outside.k-bottom-end {
  transform: translate(100%, 100%);
}

.k-rtl .k-badge-outside.k-top-start,
[dir=rtl].k-badge-outside.k-top-start,
[dir=rtl] .k-badge-outside.k-top-start {
  transform: translate(100%, -100%);
}

.k-rtl .k-badge-outside.k-top-end,
[dir=rtl].k-badge-outside.k-top-end,
[dir=rtl] .k-badge-outside.k-top-end {
  transform: translate(-100%, -100%);
}

.k-rtl .k-badge-outside.k-bottom-start,
[dir=rtl].k-badge-outside.k-bottom-start,
[dir=rtl] .k-badge-outside.k-bottom-start {
  transform: translate(100%, 100%);
}

.k-rtl .k-badge-outside.k-bottom-end,
[dir=rtl].k-badge-outside.k-bottom-end,
[dir=rtl] .k-badge-outside.k-bottom-end {
  transform: translate(-100%, 100%);
}

.k-badge-border-cutout {
  box-shadow: 0 0 0 2px var(--kendo-color-surface-alt, #ffffff);
}

.k-badge-solid-primary {
  border-color: var(--kendo-color-primary, #ff6358);
  color: var(--kendo-color-on-primary, #ffffff);
  background-color: var(--kendo-color-primary, #ff6358);
}

.k-badge-solid-secondary {
  border-color: var(--kendo-color-secondary, #666666);
  color: var(--kendo-color-on-secondary, #ffffff);
  background-color: var(--kendo-color-secondary, #666666);
}

.k-badge-solid-tertiary {
  border-color: var(--kendo-color-tertiary, #03a9f4);
  color: var(--kendo-color-on-tertiary, #ffffff);
  background-color: var(--kendo-color-tertiary, #03a9f4);
}

.k-badge-solid-info {
  border-color: var(--kendo-color-info, #0058e9);
  color: var(--kendo-color-on-info, #ffffff);
  background-color: var(--kendo-color-info, #0058e9);
}

.k-badge-solid-success {
  border-color: var(--kendo-color-success, #37b400);
  color: var(--kendo-color-on-success, #ffffff);
  background-color: var(--kendo-color-success, #37b400);
}

.k-badge-solid-warning {
  border-color: var(--kendo-color-warning, #ffc000);
  color: var(--kendo-color-on-warning, #3d3d3d);
  background-color: var(--kendo-color-warning, #ffc000);
}

.k-badge-solid-error {
  border-color: var(--kendo-color-error, #f31700);
  color: var(--kendo-color-on-error, #ffffff);
  background-color: var(--kendo-color-error, #f31700);
}

.k-badge-solid-dark {
  border-color: var(--kendo-color-dark, #3d3d3d);
  color: var(--kendo-color-on-dark, #ffffff);
  background-color: var(--kendo-color-dark, #3d3d3d);
}

.k-badge-solid-light {
  border-color: var(--kendo-color-light, #ebebeb);
  color: var(--kendo-color-on-light, #000000);
  background-color: var(--kendo-color-light, #ebebeb);
}

.k-badge-solid-inverse {
  border-color: var(--kendo-color-dark, #3d3d3d);
  color: var(--kendo-color-on-inverse, #ffffff);
  background-color: var(--kendo-color-dark, #3d3d3d);
}

.k-badge-outline {
  border-color: currentColor;
  background-color: transparent;
}

.k-badge-outline-primary {
  color: var(--kendo-color-primary, #ff6358);
}

.k-badge-outline-secondary {
  color: var(--kendo-color-secondary, #666666);
}

.k-badge-outline-tertiary {
  color: var(--kendo-color-tertiary, #03a9f4);
}

.k-badge-outline-info {
  color: var(--kendo-color-info, #0058e9);
}

.k-badge-outline-success {
  color: var(--kendo-color-success, #37b400);
}

.k-badge-outline-warning {
  color: var(--kendo-color-warning, #ffc000);
}

.k-badge-outline-error {
  color: var(--kendo-color-error, #f31700);
}

.k-badge-outline-dark {
  color: var(--kendo-color-dark, #3d3d3d);
}

.k-badge-outline-light {
  color: var(--kendo-color-light, #ebebeb);
}

.k-badge-outline-inverse {
  color: var(--kendo-color-dark, #3d3d3d);
}

.k-button {
  box-sizing: border-box;
  border-width: 1px;
  border-style: solid;
  color: inherit;
  background: none;
  font-family: var(--kendo-font-family, inherit);
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--kendo-spacing-1, 0.25rem);
  vertical-align: middle;
  -webkit-user-select: none;
          user-select: none;
  cursor: pointer;
  outline: none;
  -webkit-appearance: none;
  position: relative;
  transition: color 0.2s ease-in-out;
}

.k-button *,
.k-button *::before,
.k-button *::after {
  box-sizing: border-box;
}

.k-button:disabled, .k-button.k-disabled {
  outline: none;
  cursor: default;
  opacity: 0.6;
  filter: grayscale(0.1);
  pointer-events: none;
  box-shadow: none;
}

.k-button::-moz-focus-inner {
  padding: 0;
  border: 0;
  outline: 0;
}

.k-button:hover, .k-button:focus {
  text-decoration: none;
  outline: 0;
}

.k-icon-button {
  gap: 0;
}

.k-icon-button .k-icon {
  display: inline-flex;
}

.k-button-icon {
  color: inherit;
  align-self: center;
  position: relative;
}

.k-button-sm {
  padding-block: var(--kendo-spacing-0\.5, 0.125rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
  font-size: var(--kendo-font-size, inherit);
  line-height: var(--kendo-line-height, normal);
}

.k-button-sm.k-icon-button {
  padding: var(--kendo-spacing-0\.5, 0.125rem);
}

.k-button-sm.k-icon-button .k-button-icon {
  min-width: calc(var(--kendo-font-size, inherit) * var(--kendo-line-height, normal));
  min-height: calc(var(--kendo-font-size, inherit) * var(--kendo-line-height, normal));
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.k-button-sm.k-icon-button .k-button-icon.k-svg-icon > svg, .k-button-sm.k-icon-button .k-button-icon.k-icon-md > svg {
  width: 16px;
  height: 16px;
}

.k-button-sm.k-icon-button .k-button-icon.k-icon-xs > svg {
  width: calc(16px * 0.75);
  height: calc(16px * 0.75);
}

.k-button-sm.k-icon-button .k-button-icon.k-icon-sm > svg {
  width: calc(16px * 0.875);
  height: calc(16px * 0.875);
}

.k-button-sm.k-icon-button .k-button-icon.k-icon-lg > svg {
  width: calc(16px * 1.25);
  height: calc(16px * 1.25);
}

.k-button-sm.k-icon-button .k-button-icon.k-icon-xl > svg {
  width: calc(16px * 1.5);
  height: calc(16px * 1.5);
}

.k-button-sm.k-icon-button .k-button-icon.k-icon-xxl > svg {
  width: calc(16px * 2);
  height: calc(16px * 2);
}

.k-button-sm.k-icon-button .k-button-icon.k-icon-xxxl > svg {
  width: calc(16px * 3);
  height: calc(16px * 3);
}

.k-button-md {
  padding-block: var(--kendo-spacing-1, 0.25rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
  font-size: var(--kendo-font-size, inherit);
  line-height: var(--kendo-line-height, normal);
}

.k-button-md.k-icon-button {
  padding: var(--kendo-spacing-1, 0.25rem);
}

.k-button-md.k-icon-button .k-button-icon {
  min-width: calc(var(--kendo-font-size, inherit) * var(--kendo-line-height, normal));
  min-height: calc(var(--kendo-font-size, inherit) * var(--kendo-line-height, normal));
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.k-button-md.k-icon-button .k-button-icon.k-svg-icon > svg, .k-button-md.k-icon-button .k-button-icon.k-icon-md > svg {
  width: 16px;
  height: 16px;
}

.k-button-md.k-icon-button .k-button-icon.k-icon-xs > svg {
  width: calc(16px * 0.75);
  height: calc(16px * 0.75);
}

.k-button-md.k-icon-button .k-button-icon.k-icon-sm > svg {
  width: calc(16px * 0.875);
  height: calc(16px * 0.875);
}

.k-button-md.k-icon-button .k-button-icon.k-icon-lg > svg {
  width: calc(16px * 1.25);
  height: calc(16px * 1.25);
}

.k-button-md.k-icon-button .k-button-icon.k-icon-xl > svg {
  width: calc(16px * 1.5);
  height: calc(16px * 1.5);
}

.k-button-md.k-icon-button .k-button-icon.k-icon-xxl > svg {
  width: calc(16px * 2);
  height: calc(16px * 2);
}

.k-button-md.k-icon-button .k-button-icon.k-icon-xxxl > svg {
  width: calc(16px * 3);
  height: calc(16px * 3);
}

.k-button-lg {
  padding-block: var(--kendo-spacing-2, 0.5rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
  font-size: var(--kendo-font-size-lg, inherit);
  line-height: var(--kendo-line-height-lg, normal);
}

.k-button-lg.k-icon-button {
  padding: var(--kendo-spacing-2, 0.5rem);
}

.k-button-lg.k-icon-button .k-button-icon {
  min-width: calc(var(--kendo-font-size-lg, inherit) * var(--kendo-line-height-lg, normal));
  min-height: calc(var(--kendo-font-size-lg, inherit) * var(--kendo-line-height-lg, normal));
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.k-button-lg.k-icon-button .k-button-icon.k-svg-icon > svg, .k-button-lg.k-icon-button .k-button-icon.k-icon-md > svg {
  width: 16px;
  height: 16px;
}

.k-button-lg.k-icon-button .k-button-icon.k-icon-xs > svg {
  width: calc(16px * 0.75);
  height: calc(16px * 0.75);
}

.k-button-lg.k-icon-button .k-button-icon.k-icon-sm > svg {
  width: calc(16px * 0.875);
  height: calc(16px * 0.875);
}

.k-button-lg.k-icon-button .k-button-icon.k-icon-lg > svg {
  width: calc(16px * 1.25);
  height: calc(16px * 1.25);
}

.k-button-lg.k-icon-button .k-button-icon.k-icon-xl > svg {
  width: calc(16px * 1.5);
  height: calc(16px * 1.5);
}

.k-button-lg.k-icon-button .k-button-icon.k-icon-xxl > svg {
  width: calc(16px * 2);
  height: calc(16px * 2);
}

.k-button-lg.k-icon-button .k-button-icon.k-icon-xxxl > svg {
  width: calc(16px * 3);
  height: calc(16px * 3);
}

.k-button-square {
  aspect-ratio: 1;
}

.k-button-group {
  margin: 0;
  padding: 0;
  border-width: 0;
  box-sizing: border-box;
  list-style: none;
  outline: 0;
  display: inline-flex;
  flex-flow: row nowrap;
  vertical-align: middle;
  position: relative;
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.k-button-group > .k-button + .k-button {
  margin-inline-start: -1px;
}

.k-button-group > .k-button:hover,
.k-button-group > .k-button.k-hover,
.k-button-group > .k-button:focus,
.k-button-group > .k-button.k-focus,
.k-button-group > .k-button:active,
.k-button-group > .k-button.k-active,
.k-button-group > .k-button.k-selected {
  z-index: 2;
}

.k-button-group .k-button:not(:first-child):not(:last-child) {
  border-start-end-radius: 0;
  border-end-end-radius: 0;
  border-start-start-radius: 0;
  border-end-start-radius: 0;
}

.k-button-group > .k-button:first-child:not(:only-child) {
  border-start-end-radius: 0;
  border-end-end-radius: 0;
}

.k-button-group > .k-button:last-child:not(:only-child) {
  border-start-start-radius: 0;
  border-end-start-radius: 0;
}

.k-button-group:disabled, .k-button-group[disabled], .k-button-group.k-disabled {
  opacity: 1;
  filter: none;
}

.k-button-group-stretched {
  width: 100%;
}

.k-button-group-stretched > * {
  flex: 1 0 0%;
  overflow: hidden;
}

.k-button-flat {
  border-color: transparent !important;
  color: inherit;
  background: none !important;
  box-shadow: none !important;
}

.k-button-flat::before {
  display: block !important;
}

.k-button-flat::after {
  box-shadow: inset 0 0 0 2px currentColor;
  display: block !important;
}

.k-button-flat:focus::after, .k-button-flat.k-focus::after {
  opacity: 0.12;
}

.k-button-outline {
  border-color: currentColor;
  color: inherit;
  background: none;
}

.k-button-link {
  border-color: transparent;
  color: inherit;
  text-decoration: none;
  background: none;
}

.k-button-link:hover, .k-button-link.k-hover {
  text-decoration: underline;
}

.k-button-clear {
  border-color: transparent !important;
  color: inherit;
  background: none !important;
  box-shadow: none !important;
}

.k-button-overlay, .k-button::before {
  border-radius: inherit;
  content: "";
  background: currentColor;
  opacity: 0;
  display: none;
  pointer-events: none;
  position: absolute;
  left: -1px;
  right: -1px;
  top: -1px;
  bottom: -1px;
  z-index: 0;
  transition: opacity 0.2s ease-in-out;
}

.k-button:hover::before, .k-button.k-hover::before {
  opacity: 0.04;
}

.k-button.k-no-focus:not(:hover)::before, .k-button.k-no-focus:not(.k-hover)::before {
  opacity: 0;
}

.k-button:active::before, .k-button.k-active::before {
  opacity: 0.16;
}

.k-button.k-selected::before {
  opacity: 0.2;
}

.k-button::after {
  border-radius: inherit;
  content: "";
  opacity: 0;
  display: none;
  pointer-events: none;
  position: absolute;
  left: -1px;
  right: -1px;
  top: -1px;
  bottom: -1px;
  z-index: 0;
  transition: opacity 0.2s ease-in-out;
}

.k-button-solid-base {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
  color: var(--kendo-color-on-base, #3d3d3d);
  background-color: var(--kendo-color-base, #f5f5f5);
}

.k-button-solid-base:hover, .k-button-solid-base.k-hover {
  background-color: var(--kendo-color-base-hover, #ebebeb);
}

.k-button-solid-base:focus, .k-button-solid-base.k-focus {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--kendo-color-on-app-surface, #3d3d3d) 8%, transparent);
}

.k-button-solid-base:active, .k-button-solid-base.k-active {
  background-color: var(--kendo-color-base-active, #d6d6d6);
}

.k-button-solid-base.k-selected {
  border-color: var(--kendo-color-primary, #ff6358);
  color: var(--kendo-color-on-primary, #ffffff);
  background-color: var(--kendo-color-primary, #ff6358);
}

.k-button-solid-primary {
  border-color: var(--kendo-color-primary, #ff6358);
  color: var(--kendo-color-on-primary, #ffffff);
  background-color: var(--kendo-color-primary, #ff6358);
}

.k-button-solid-primary:hover, .k-button-solid-primary.k-hover {
  border-color: var(--kendo-color-primary-hover, #ea5a51);
  background-color: var(--kendo-color-primary-hover, #ea5a51);
}

.k-button-solid-primary:focus, .k-button-solid-primary.k-focus {
  box-shadow: 0 0 0px 2px color-mix(in srgb, var(--kendo-color-primary, #ff6358) 30%, transparent);
}

.k-button-solid-primary:active, .k-button-solid-primary.k-active {
  border-color: var(--kendo-color-primary-active, #d45349);
  background-color: var(--kendo-color-primary-active, #d45349);
}

.k-button-solid-primary.k-selected {
  border-color: var(--kendo-color-primary-active, #d45349);
  background-color: var(--kendo-color-primary-active, #d45349);
}

.k-button-solid-secondary {
  border-color: var(--kendo-color-secondary, #666666);
  color: var(--kendo-color-on-secondary, #ffffff);
  background-color: var(--kendo-color-secondary, #666666);
}

.k-button-solid-secondary:hover, .k-button-solid-secondary.k-hover {
  border-color: var(--kendo-color-secondary-hover, #525252);
  background-color: var(--kendo-color-secondary-hover, #525252);
}

.k-button-solid-secondary:focus, .k-button-solid-secondary.k-focus {
  box-shadow: 0 0 0px 2px color-mix(in srgb, var(--kendo-color-secondary, #666666) 30%, transparent);
}

.k-button-solid-secondary:active, .k-button-solid-secondary.k-active {
  border-color: var(--kendo-color-secondary-active, #3d3d3d);
  background-color: var(--kendo-color-secondary-active, #3d3d3d);
}

.k-button-solid-secondary.k-selected {
  border-color: var(--kendo-color-secondary-active, #3d3d3d);
  background-color: var(--kendo-color-secondary-active, #3d3d3d);
}

.k-button-solid-tertiary {
  border-color: var(--kendo-color-tertiary, #03a9f4);
  color: var(--kendo-color-on-tertiary, #ffffff);
  background-color: var(--kendo-color-tertiary, #03a9f4);
}

.k-button-solid-tertiary:hover, .k-button-solid-tertiary.k-hover {
  border-color: var(--kendo-color-tertiary-hover, #039ae0);
  background-color: var(--kendo-color-tertiary-hover, #039ae0);
}

.k-button-solid-tertiary:focus, .k-button-solid-tertiary.k-focus {
  box-shadow: 0 0 0px 2px color-mix(in srgb, var(--kendo-color-tertiary, #03a9f4) 30%, transparent);
}

.k-button-solid-tertiary:active, .k-button-solid-tertiary.k-active {
  border-color: var(--kendo-color-tertiary-active, #028ccb);
  background-color: var(--kendo-color-tertiary-active, #028ccb);
}

.k-button-solid-tertiary.k-selected {
  border-color: var(--kendo-color-tertiary-active, #028ccb);
  background-color: var(--kendo-color-tertiary-active, #028ccb);
}

.k-button-solid-info {
  border-color: var(--kendo-color-info, #0058e9);
  color: var(--kendo-color-on-info, #ffffff);
  background-color: var(--kendo-color-info, #0058e9);
}

.k-button-solid-info:hover, .k-button-solid-info.k-hover {
  border-color: var(--kendo-color-info-hover, #0052d6);
  background-color: var(--kendo-color-info-hover, #0052d6);
}

.k-button-solid-info:focus, .k-button-solid-info.k-focus {
  box-shadow: 0 0 0px 2px color-mix(in srgb, var(--kendo-color-info, #0058e9) 30%, transparent);
}

.k-button-solid-info:active, .k-button-solid-info.k-active {
  border-color: var(--kendo-color-info-active, #004ac2);
  background-color: var(--kendo-color-info-active, #004ac2);
}

.k-button-solid-info.k-selected {
  border-color: var(--kendo-color-info-active, #004ac2);
  background-color: var(--kendo-color-info-active, #004ac2);
}

.k-button-solid-success {
  border-color: var(--kendo-color-success, #37b400);
  color: var(--kendo-color-on-success, #ffffff);
  background-color: var(--kendo-color-success, #37b400);
}

.k-button-solid-success:hover, .k-button-solid-success.k-hover {
  border-color: var(--kendo-color-success-hover, #32a500);
  background-color: var(--kendo-color-success-hover, #32a500);
}

.k-button-solid-success:focus, .k-button-solid-success.k-focus {
  box-shadow: 0 0 0px 2px color-mix(in srgb, var(--kendo-color-success, #37b400) 30%, transparent);
}

.k-button-solid-success:active, .k-button-solid-success.k-active {
  border-color: var(--kendo-color-success-active, #2d9600);
  background-color: var(--kendo-color-success-active, #2d9600);
}

.k-button-solid-success.k-selected {
  border-color: var(--kendo-color-success-active, #2d9600);
  background-color: var(--kendo-color-success-active, #2d9600);
}

.k-button-solid-warning {
  border-color: var(--kendo-color-warning, #ffc000);
  color: var(--kendo-color-on-warning, #3d3d3d);
  background-color: var(--kendo-color-warning, #ffc000);
}

.k-button-solid-warning:hover, .k-button-solid-warning.k-hover {
  border-color: var(--kendo-color-warning-hover, #eaaf00);
  background-color: var(--kendo-color-warning-hover, #eaaf00);
}

.k-button-solid-warning:focus, .k-button-solid-warning.k-focus {
  box-shadow: 0 0 0px 2px color-mix(in srgb, var(--kendo-color-warning, #ffc000) 30%, transparent);
}

.k-button-solid-warning:active, .k-button-solid-warning.k-active {
  border-color: var(--kendo-color-warning-active, #d49f00);
  background-color: var(--kendo-color-warning-active, #d49f00);
}

.k-button-solid-warning.k-selected {
  border-color: var(--kendo-color-warning-active, #d49f00);
  background-color: var(--kendo-color-warning-active, #d49f00);
}

.k-button-solid-error {
  border-color: var(--kendo-color-error, #f31700);
  color: var(--kendo-color-on-error, #ffffff);
  background-color: var(--kendo-color-error, #f31700);
}

.k-button-solid-error:hover, .k-button-solid-error.k-hover {
  border-color: var(--kendo-color-error-hover, #df1600);
  background-color: var(--kendo-color-error-hover, #df1600);
}

.k-button-solid-error:focus, .k-button-solid-error.k-focus {
  box-shadow: 0 0 0px 2px color-mix(in srgb, var(--kendo-color-error, #f31700) 30%, transparent);
}

.k-button-solid-error:active, .k-button-solid-error.k-active {
  border-color: var(--kendo-color-error-active, #ca1400);
  background-color: var(--kendo-color-error-active, #ca1400);
}

.k-button-solid-error.k-selected {
  border-color: var(--kendo-color-error-active, #ca1400);
  background-color: var(--kendo-color-error-active, #ca1400);
}

.k-button-solid-dark {
  border-color: var(--kendo-color-dark, #3d3d3d);
  color: var(--kendo-color-on-dark, #ffffff);
  background-color: var(--kendo-color-dark, #3d3d3d);
}

.k-button-solid-dark:hover, .k-button-solid-dark.k-hover {
  border-color: var(--kendo-color-dark-hover, #292929);
  background-color: var(--kendo-color-dark-hover, #292929);
}

.k-button-solid-dark:focus, .k-button-solid-dark.k-focus {
  box-shadow: 0 0 0px 2px color-mix(in srgb, var(--kendo-color-dark, #3d3d3d) 30%, transparent);
}

.k-button-solid-dark:active, .k-button-solid-dark.k-active {
  border-color: var(--kendo-color-dark-active, #1f1f1f);
  background-color: var(--kendo-color-dark-active, #1f1f1f);
}

.k-button-solid-dark.k-selected {
  border-color: var(--kendo-color-dark-active, #1f1f1f);
  background-color: var(--kendo-color-dark-active, #1f1f1f);
}

.k-button-solid-light {
  border-color: var(--kendo-color-light, #ebebeb);
  color: var(--kendo-color-on-light, #000000);
  background-color: var(--kendo-color-light, #ebebeb);
}

.k-button-solid-light:hover, .k-button-solid-light.k-hover {
  border-color: var(--kendo-color-light-hover, #e0e0e0);
  background-color: var(--kendo-color-light-hover, #e0e0e0);
}

.k-button-solid-light:focus, .k-button-solid-light.k-focus {
  box-shadow: 0 0 0px 2px color-mix(in srgb, var(--kendo-color-light, #ebebeb) 30%, transparent);
}

.k-button-solid-light:active, .k-button-solid-light.k-active {
  border-color: var(--kendo-color-light-active, #d6d6d6);
  background-color: var(--kendo-color-light-active, #d6d6d6);
}

.k-button-solid-light.k-selected {
  border-color: var(--kendo-color-light-active, #d6d6d6);
  background-color: var(--kendo-color-light-active, #d6d6d6);
}

.k-button-solid-inverse {
  border-color: var(--kendo-color-inverse, #3d3d3d);
  color: var(--kendo-color-on-inverse, #ffffff);
  background-color: var(--kendo-color-inverse, #3d3d3d);
}

.k-button-solid-inverse:hover, .k-button-solid-inverse.k-hover {
  border-color: var(--kendo-color-inverse-hover, #292929);
  background-color: var(--kendo-color-inverse-hover, #292929);
}

.k-button-solid-inverse:focus, .k-button-solid-inverse.k-focus {
  box-shadow: 0 0 0px 2px color-mix(in srgb, var(--kendo-color-inverse, #3d3d3d) 30%, transparent);
}

.k-button-solid-inverse:active, .k-button-solid-inverse.k-active {
  border-color: var(--kendo-color-inverse-active, #1f1f1f);
  background-color: var(--kendo-color-inverse-active, #1f1f1f);
}

.k-button-solid-inverse.k-selected {
  border-color: var(--kendo-color-inverse-active, #1f1f1f);
  background-color: var(--kendo-color-inverse-active, #1f1f1f);
}

.k-button-outline-primary {
  box-shadow: none;
  border-color: currentColor;
  color: var(--kendo-color-primary-on-surface, #ff6358);
  background-color: transparent;
}

.k-button-outline-primary:hover, .k-button-outline-primary.k-hover {
  border-color: var(--kendo-color-primary, #ff6358);
  color: var(--kendo-color-on-primary, #ffffff);
  background-color: var(--kendo-color-primary, #ff6358);
}

.k-button-outline-primary:focus, .k-button-outline-primary.k-focus {
  box-shadow: 0 0 0px 2px color-mix(in srgb, var(--kendo-color-primary, #ff6358) 30%, transparent);
}

.k-button-outline-primary:active, .k-button-outline-primary.k-active {
  border-color: var(--kendo-color-primary, #ff6358);
  color: var(--kendo-color-on-primary, #ffffff);
  background-color: var(--kendo-color-primary, #ff6358);
}

.k-button-outline-primary.k-selected {
  border-color: var(--kendo-color-primary, #ff6358);
  color: var(--kendo-color-on-primary, #ffffff);
  background-color: var(--kendo-color-primary, #ff6358);
}

.k-button-outline-secondary {
  box-shadow: none;
  border-color: currentColor;
  color: var(--kendo-color-secondary-on-surface, #292929);
  background-color: transparent;
}

.k-button-outline-secondary:hover, .k-button-outline-secondary.k-hover {
  border-color: var(--kendo-color-secondary, #666666);
  color: var(--kendo-color-on-secondary, #ffffff);
  background-color: var(--kendo-color-secondary, #666666);
}

.k-button-outline-secondary:focus, .k-button-outline-secondary.k-focus {
  box-shadow: 0 0 0px 2px color-mix(in srgb, var(--kendo-color-secondary, #666666) 30%, transparent);
}

.k-button-outline-secondary:active, .k-button-outline-secondary.k-active {
  border-color: var(--kendo-color-secondary, #666666);
  color: var(--kendo-color-on-secondary, #ffffff);
  background-color: var(--kendo-color-secondary, #666666);
}

.k-button-outline-secondary.k-selected {
  border-color: var(--kendo-color-secondary, #666666);
  color: var(--kendo-color-on-secondary, #ffffff);
  background-color: var(--kendo-color-secondary, #666666);
}

.k-button-outline-tertiary {
  box-shadow: none;
  border-color: currentColor;
  color: var(--kendo-color-tertiary-on-surface, #028ccb);
  background-color: transparent;
}

.k-button-outline-tertiary:hover, .k-button-outline-tertiary.k-hover {
  border-color: var(--kendo-color-tertiary, #03a9f4);
  color: var(--kendo-color-on-tertiary, #ffffff);
  background-color: var(--kendo-color-tertiary, #03a9f4);
}

.k-button-outline-tertiary:focus, .k-button-outline-tertiary.k-focus {
  box-shadow: 0 0 0px 2px color-mix(in srgb, var(--kendo-color-tertiary, #03a9f4) 30%, transparent);
}

.k-button-outline-tertiary:active, .k-button-outline-tertiary.k-active {
  border-color: var(--kendo-color-tertiary, #03a9f4);
  color: var(--kendo-color-on-tertiary, #ffffff);
  background-color: var(--kendo-color-tertiary, #03a9f4);
}

.k-button-outline-tertiary.k-selected {
  border-color: var(--kendo-color-tertiary, #03a9f4);
  color: var(--kendo-color-on-tertiary, #ffffff);
  background-color: var(--kendo-color-tertiary, #03a9f4);
}

.k-button-outline-info {
  box-shadow: none;
  border-color: currentColor;
  color: var(--kendo-color-info-on-surface, #004ac2);
  background-color: transparent;
}

.k-button-outline-info:hover, .k-button-outline-info.k-hover {
  border-color: var(--kendo-color-info, #0058e9);
  color: var(--kendo-color-on-info, #ffffff);
  background-color: var(--kendo-color-info, #0058e9);
}

.k-button-outline-info:focus, .k-button-outline-info.k-focus {
  box-shadow: 0 0 0px 2px color-mix(in srgb, var(--kendo-color-info, #0058e9) 30%, transparent);
}

.k-button-outline-info:active, .k-button-outline-info.k-active {
  border-color: var(--kendo-color-info, #0058e9);
  color: var(--kendo-color-on-info, #ffffff);
  background-color: var(--kendo-color-info, #0058e9);
}

.k-button-outline-info.k-selected {
  border-color: var(--kendo-color-info, #0058e9);
  color: var(--kendo-color-on-info, #ffffff);
  background-color: var(--kendo-color-info, #0058e9);
}

.k-button-outline-success {
  box-shadow: none;
  border-color: currentColor;
  color: var(--kendo-color-success-on-surface, #2d9600);
  background-color: transparent;
}

.k-button-outline-success:hover, .k-button-outline-success.k-hover {
  border-color: var(--kendo-color-success, #37b400);
  color: var(--kendo-color-on-success, #ffffff);
  background-color: var(--kendo-color-success, #37b400);
}

.k-button-outline-success:focus, .k-button-outline-success.k-focus {
  box-shadow: 0 0 0px 2px color-mix(in srgb, var(--kendo-color-success, #37b400) 30%, transparent);
}

.k-button-outline-success:active, .k-button-outline-success.k-active {
  border-color: var(--kendo-color-success, #37b400);
  color: var(--kendo-color-on-success, #ffffff);
  background-color: var(--kendo-color-success, #37b400);
}

.k-button-outline-success.k-selected {
  border-color: var(--kendo-color-success, #37b400);
  color: var(--kendo-color-on-success, #ffffff);
  background-color: var(--kendo-color-success, #37b400);
}

.k-button-outline-warning {
  box-shadow: none;
  border-color: currentColor;
  color: var(--kendo-color-warning-on-surface, #ffc000);
  background-color: transparent;
}

.k-button-outline-warning:hover, .k-button-outline-warning.k-hover {
  border-color: var(--kendo-color-warning, #ffc000);
  color: var(--kendo-color-on-warning, #3d3d3d);
  background-color: var(--kendo-color-warning, #ffc000);
}

.k-button-outline-warning:focus, .k-button-outline-warning.k-focus {
  box-shadow: 0 0 0px 2px color-mix(in srgb, var(--kendo-color-warning, #ffc000) 30%, transparent);
}

.k-button-outline-warning:active, .k-button-outline-warning.k-active {
  border-color: var(--kendo-color-warning, #ffc000);
  color: var(--kendo-color-on-warning, #3d3d3d);
  background-color: var(--kendo-color-warning, #ffc000);
}

.k-button-outline-warning.k-selected {
  border-color: var(--kendo-color-warning, #ffc000);
  color: var(--kendo-color-on-warning, #3d3d3d);
  background-color: var(--kendo-color-warning, #ffc000);
}

.k-button-outline-error {
  box-shadow: none;
  border-color: currentColor;
  color: var(--kendo-color-error-on-surface, #ca1400);
  background-color: transparent;
}

.k-button-outline-error:hover, .k-button-outline-error.k-hover {
  border-color: var(--kendo-color-error, #f31700);
  color: var(--kendo-color-on-error, #ffffff);
  background-color: var(--kendo-color-error, #f31700);
}

.k-button-outline-error:focus, .k-button-outline-error.k-focus {
  box-shadow: 0 0 0px 2px color-mix(in srgb, var(--kendo-color-error, #f31700) 30%, transparent);
}

.k-button-outline-error:active, .k-button-outline-error.k-active {
  border-color: var(--kendo-color-error, #f31700);
  color: var(--kendo-color-on-error, #ffffff);
  background-color: var(--kendo-color-error, #f31700);
}

.k-button-outline-error.k-selected {
  border-color: var(--kendo-color-error, #f31700);
  color: var(--kendo-color-on-error, #ffffff);
  background-color: var(--kendo-color-error, #f31700);
}

.k-button-outline-dark {
  box-shadow: none;
  border-color: currentColor;
  color: var(--kendo-color-dark-on-surface, #141414);
  background-color: transparent;
}

.k-button-outline-dark:hover, .k-button-outline-dark.k-hover {
  border-color: var(--kendo-color-dark, #3d3d3d);
  color: var(--kendo-color-on-dark, #ffffff);
  background-color: var(--kendo-color-dark, #3d3d3d);
}

.k-button-outline-dark:focus, .k-button-outline-dark.k-focus {
  box-shadow: 0 0 0px 2px color-mix(in srgb, var(--kendo-color-dark, #3d3d3d) 30%, transparent);
}

.k-button-outline-dark:active, .k-button-outline-dark.k-active {
  border-color: var(--kendo-color-dark, #3d3d3d);
  color: var(--kendo-color-on-dark, #ffffff);
  background-color: var(--kendo-color-dark, #3d3d3d);
}

.k-button-outline-dark.k-selected {
  border-color: var(--kendo-color-dark, #3d3d3d);
  color: var(--kendo-color-on-dark, #ffffff);
  background-color: var(--kendo-color-dark, #3d3d3d);
}

.k-button-outline-light {
  box-shadow: none;
  border-color: currentColor;
  color: var(--kendo-color-light-on-surface, #e0e0e0);
  background-color: transparent;
}

.k-button-outline-light:hover, .k-button-outline-light.k-hover {
  border-color: var(--kendo-color-light, #ebebeb);
  color: var(--kendo-color-on-light, #000000);
  background-color: var(--kendo-color-light, #ebebeb);
}

.k-button-outline-light:focus, .k-button-outline-light.k-focus {
  box-shadow: 0 0 0px 2px color-mix(in srgb, var(--kendo-color-light, #ebebeb) 30%, transparent);
}

.k-button-outline-light:active, .k-button-outline-light.k-active {
  border-color: var(--kendo-color-light, #ebebeb);
  color: var(--kendo-color-on-light, #000000);
  background-color: var(--kendo-color-light, #ebebeb);
}

.k-button-outline-light.k-selected {
  border-color: var(--kendo-color-light, #ebebeb);
  color: var(--kendo-color-on-light, #000000);
  background-color: var(--kendo-color-light, #ebebeb);
}

.k-button-outline-inverse {
  box-shadow: none;
  border-color: currentColor;
  color: var(--kendo-color-inverse-on-surface, #141414);
  background-color: transparent;
}

.k-button-outline-inverse:hover, .k-button-outline-inverse.k-hover {
  border-color: var(--kendo-color-dark, #3d3d3d);
  color: var(--kendo-color-on-inverse, #ffffff);
  background-color: var(--kendo-color-dark, #3d3d3d);
}

.k-button-outline-inverse:focus, .k-button-outline-inverse.k-focus {
  box-shadow: 0 0 0px 2px color-mix(in srgb, var(--kendo-color-inverse, #3d3d3d) 30%, transparent);
}

.k-button-outline-inverse:active, .k-button-outline-inverse.k-active {
  border-color: var(--kendo-color-dark, #3d3d3d);
  color: var(--kendo-color-on-inverse, #ffffff);
  background-color: var(--kendo-color-dark, #3d3d3d);
}

.k-button-outline-inverse.k-selected {
  border-color: var(--kendo-color-dark, #3d3d3d);
  color: var(--kendo-color-on-inverse, #ffffff);
  background-color: var(--kendo-color-dark, #3d3d3d);
}

.k-button-outline-base {
  box-shadow: none;
  border-color: currentColor;
  color: var(--kendo-color-base-on-surface, #3d3d3d);
  background-color: transparent;
}

.k-button-outline-base:hover, .k-button-outline-base.k-hover {
  border-color: var(--kendo-color-on-base, #3d3d3d);
  color: var(--kendo-color-base, #f5f5f5);
  background-color: var(--kendo-color-on-base, #3d3d3d);
}

.k-button-outline-base:focus, .k-button-outline-base.k-focus {
  box-shadow: 0 0 0px 2px color-mix(in srgb, var(--kendo-color-on-app-surface, #3d3d3d) 30%, transparent);
}

.k-button-outline-base:active, .k-button-outline-base.k-active {
  border-color: var(--kendo-color-on-base, #3d3d3d);
  color: var(--kendo-color-base, #f5f5f5);
  background-color: var(--kendo-color-on-base, #3d3d3d);
}

.k-button-outline-base.k-selected {
  border-color: var(--kendo-color-on-base, #3d3d3d);
  color: var(--kendo-color-base, #f5f5f5);
  background-color: var(--kendo-color-on-base, #3d3d3d);
}

.k-button-flat-primary {
  color: var(--kendo-color-primary-on-surface, #ff6358);
}

.k-button-flat-secondary {
  color: var(--kendo-color-secondary-on-surface, #292929);
}

.k-button-flat-tertiary {
  color: var(--kendo-color-tertiary-on-surface, #028ccb);
}

.k-button-flat-info {
  color: var(--kendo-color-info-on-surface, #004ac2);
}

.k-button-flat-success {
  color: var(--kendo-color-success-on-surface, #2d9600);
}

.k-button-flat-warning {
  color: var(--kendo-color-warning-on-surface, #ffc000);
}

.k-button-flat-error {
  color: var(--kendo-color-error-on-surface, #ca1400);
}

.k-button-flat-dark {
  color: var(--kendo-color-dark-on-surface, #141414);
}

.k-button-flat-light {
  color: var(--kendo-color-light-on-surface, #e0e0e0);
}

.k-button-flat-inverse {
  color: var(--kendo-color-inverse-on-surface, #141414);
}

.k-button-flat-base {
  color: inherit;
}

.k-button-link-primary {
  color: var(--kendo-color-primary, #ff6358);
}

.k-button-link-primary:hover, .k-button-link-primary.k-hover {
  color: var(--kendo-color-primary-hover, #ea5a51);
}

.k-button-link-primary:focus, .k-button-link-primary.k-focus {
  box-shadow: 0 0 0px 2px color-mix(in srgb, var(--kendo-color-primary, #ff6358) 30%, transparent);
}

.k-button-link-primary:active, .k-button-link-primary.k-active {
  color: var(--kendo-color-primary-active, #d45349);
}

.k-button-link-primary.k-selected {
  color: var(--kendo-color-primary-active, #d45349);
}

.k-button-link-secondary {
  color: var(--kendo-color-secondary, #666666);
}

.k-button-link-secondary:hover, .k-button-link-secondary.k-hover {
  color: var(--kendo-color-secondary-hover, #525252);
}

.k-button-link-secondary:focus, .k-button-link-secondary.k-focus {
  box-shadow: 0 0 0px 2px color-mix(in srgb, var(--kendo-color-secondary, #666666) 30%, transparent);
}

.k-button-link-secondary:active, .k-button-link-secondary.k-active {
  color: var(--kendo-color-secondary-active, #3d3d3d);
}

.k-button-link-secondary.k-selected {
  color: var(--kendo-color-secondary-active, #3d3d3d);
}

.k-button-link-tertiary {
  color: var(--kendo-color-tertiary, #03a9f4);
}

.k-button-link-tertiary:hover, .k-button-link-tertiary.k-hover {
  color: var(--kendo-color-tertiary-hover, #039ae0);
}

.k-button-link-tertiary:focus, .k-button-link-tertiary.k-focus {
  box-shadow: 0 0 0px 2px color-mix(in srgb, var(--kendo-color-tertiary, #03a9f4) 30%, transparent);
}

.k-button-link-tertiary:active, .k-button-link-tertiary.k-active {
  color: var(--kendo-color-tertiary-active, #028ccb);
}

.k-button-link-tertiary.k-selected {
  color: var(--kendo-color-tertiary-active, #028ccb);
}

.k-button-link-info {
  color: var(--kendo-color-info, #0058e9);
}

.k-button-link-info:hover, .k-button-link-info.k-hover {
  color: var(--kendo-color-info-hover, #0052d6);
}

.k-button-link-info:focus, .k-button-link-info.k-focus {
  box-shadow: 0 0 0px 2px color-mix(in srgb, var(--kendo-color-info, #0058e9) 30%, transparent);
}

.k-button-link-info:active, .k-button-link-info.k-active {
  color: var(--kendo-color-info-active, #004ac2);
}

.k-button-link-info.k-selected {
  color: var(--kendo-color-info-active, #004ac2);
}

.k-button-link-success {
  color: var(--kendo-color-success, #37b400);
}

.k-button-link-success:hover, .k-button-link-success.k-hover {
  color: var(--kendo-color-success-hover, #32a500);
}

.k-button-link-success:focus, .k-button-link-success.k-focus {
  box-shadow: 0 0 0px 2px color-mix(in srgb, var(--kendo-color-success, #37b400) 30%, transparent);
}

.k-button-link-success:active, .k-button-link-success.k-active {
  color: var(--kendo-color-success-active, #2d9600);
}

.k-button-link-success.k-selected {
  color: var(--kendo-color-success-active, #2d9600);
}

.k-button-link-warning {
  color: var(--kendo-color-warning, #ffc000);
}

.k-button-link-warning:hover, .k-button-link-warning.k-hover {
  color: var(--kendo-color-warning-hover, #eaaf00);
}

.k-button-link-warning:focus, .k-button-link-warning.k-focus {
  box-shadow: 0 0 0px 2px color-mix(in srgb, var(--kendo-color-warning, #ffc000) 30%, transparent);
}

.k-button-link-warning:active, .k-button-link-warning.k-active {
  color: var(--kendo-color-warning-active, #d49f00);
}

.k-button-link-warning.k-selected {
  color: var(--kendo-color-warning-active, #d49f00);
}

.k-button-link-error {
  color: var(--kendo-color-error, #f31700);
}

.k-button-link-error:hover, .k-button-link-error.k-hover {
  color: var(--kendo-color-error-hover, #df1600);
}

.k-button-link-error:focus, .k-button-link-error.k-focus {
  box-shadow: 0 0 0px 2px color-mix(in srgb, var(--kendo-color-error, #f31700) 30%, transparent);
}

.k-button-link-error:active, .k-button-link-error.k-active {
  color: var(--kendo-color-error-active, #ca1400);
}

.k-button-link-error.k-selected {
  color: var(--kendo-color-error-active, #ca1400);
}

.k-button-link-dark {
  color: var(--kendo-color-dark, #3d3d3d);
}

.k-button-link-dark:hover, .k-button-link-dark.k-hover {
  color: var(--kendo-color-dark-hover, #292929);
}

.k-button-link-dark:focus, .k-button-link-dark.k-focus {
  box-shadow: 0 0 0px 2px color-mix(in srgb, var(--kendo-color-dark, #3d3d3d) 30%, transparent);
}

.k-button-link-dark:active, .k-button-link-dark.k-active {
  color: var(--kendo-color-dark-active, #1f1f1f);
}

.k-button-link-dark.k-selected {
  color: var(--kendo-color-dark-active, #1f1f1f);
}

.k-button-link-light {
  color: var(--kendo-color-light, #ebebeb);
}

.k-button-link-light:hover, .k-button-link-light.k-hover {
  color: var(--kendo-color-light-hover, #e0e0e0);
}

.k-button-link-light:focus, .k-button-link-light.k-focus {
  box-shadow: 0 0 0px 2px color-mix(in srgb, var(--kendo-color-light, #ebebeb) 30%, transparent);
}

.k-button-link-light:active, .k-button-link-light.k-active {
  color: var(--kendo-color-light-active, #d6d6d6);
}

.k-button-link-light.k-selected {
  color: var(--kendo-color-light-active, #d6d6d6);
}

.k-button-link-inverse {
  color: var(--kendo-color-dark, #3d3d3d);
}

.k-button-link-inverse:hover, .k-button-link-inverse.k-hover {
  color: var(--kendo-color-inverse-hover, #292929);
}

.k-button-link-inverse:focus, .k-button-link-inverse.k-focus {
  box-shadow: 0 0 0px 2px color-mix(in srgb, var(--kendo-color-inverse, #3d3d3d) 30%, transparent);
}

.k-button-link-inverse:active, .k-button-link-inverse.k-active {
  color: var(--kendo-color-inverse-active, #1f1f1f);
}

.k-button-link-inverse.k-selected {
  color: var(--kendo-color-inverse-active, #1f1f1f);
}

.k-button-link-base {
  color: var(--kendo-color-on-app-surface, #3d3d3d);
}

.k-button-link-base:hover, .k-button-link-base.k-hover {
  color: var(--kendo-color-on-app-surface, #3d3d3d);
}

.k-button-link-base:focus, .k-button-link-base.k-focus {
  box-shadow: 0 0 0px 2px color-mix(in srgb, var(--kendo-color-on-app-surface, #3d3d3d) 30%, transparent);
}

.k-button-link-base:active, .k-button-link-base.k-active {
  color: var(--kendo-color-on-app-surface, #3d3d3d);
}

.k-button-link-base.k-selected {
  color: var(--kendo-color-on-app-surface, #3d3d3d);
}

.k-button-clear-primary {
  color: var(--kendo-color-primary-on-surface, #ff6358);
}

.k-button-clear-primary:focus::after, .k-button-clear-primary.k-focus::after, .k-button-clear-primary:active::after {
  background-color: currentColor;
  opacity: 0.1;
  display: block;
}

.k-button-clear-secondary {
  color: var(--kendo-color-secondary-on-surface, #292929);
}

.k-button-clear-secondary:focus::after, .k-button-clear-secondary.k-focus::after, .k-button-clear-secondary:active::after {
  background-color: currentColor;
  opacity: 0.1;
  display: block;
}

.k-button-clear-tertiary {
  color: var(--kendo-color-tertiary-on-surface, #028ccb);
}

.k-button-clear-tertiary:focus::after, .k-button-clear-tertiary.k-focus::after, .k-button-clear-tertiary:active::after {
  background-color: currentColor;
  opacity: 0.1;
  display: block;
}

.k-button-clear-info {
  color: var(--kendo-color-info-on-surface, #004ac2);
}

.k-button-clear-info:focus::after, .k-button-clear-info.k-focus::after, .k-button-clear-info:active::after {
  background-color: currentColor;
  opacity: 0.1;
  display: block;
}

.k-button-clear-success {
  color: var(--kendo-color-success-on-surface, #2d9600);
}

.k-button-clear-success:focus::after, .k-button-clear-success.k-focus::after, .k-button-clear-success:active::after {
  background-color: currentColor;
  opacity: 0.1;
  display: block;
}

.k-button-clear-warning {
  color: var(--kendo-color-warning-on-surface, #ffc000);
}

.k-button-clear-warning:focus::after, .k-button-clear-warning.k-focus::after, .k-button-clear-warning:active::after {
  background-color: currentColor;
  opacity: 0.1;
  display: block;
}

.k-button-clear-error {
  color: var(--kendo-color-error-on-surface, #ca1400);
}

.k-button-clear-error:focus::after, .k-button-clear-error.k-focus::after, .k-button-clear-error:active::after {
  background-color: currentColor;
  opacity: 0.1;
  display: block;
}

.k-button-clear-dark {
  color: var(--kendo-color-dark-on-surface, #141414);
}

.k-button-clear-dark:focus::after, .k-button-clear-dark.k-focus::after, .k-button-clear-dark:active::after {
  background-color: currentColor;
  opacity: 0.1;
  display: block;
}

.k-button-clear-light {
  color: var(--kendo-color-light-on-surface, #e0e0e0);
}

.k-button-clear-light:focus::after, .k-button-clear-light.k-focus::after, .k-button-clear-light:active::after {
  background-color: currentColor;
  opacity: 0.1;
  display: block;
}

.k-button-clear-inverse {
  color: var(--kendo-color-inverse-on-surface, #141414);
}

.k-button-clear-inverse:focus::after, .k-button-clear-inverse.k-focus::after, .k-button-clear-inverse:active::after {
  background-color: currentColor;
  opacity: 0.1;
  display: block;
}

.k-button-clear-base {
  color: var(--kendo-color-base-on-surface, #3d3d3d);
}

.k-button-clear-base:focus::after, .k-button-clear-base.k-focus::after, .k-button-clear-base:active::after {
  background-color: currentColor;
  opacity: 0.1;
  display: block;
}

.k-input,
.k-picker {
  margin: 0;
  padding: 0;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  border-width: 1px;
  border-style: solid;
  outline: 0;
  font-family: var(--kendo-font-family, inherit);
  font-size: var(--kendo-font-size, inherit);
  line-height: var(--kendo-line-height, normal);
  font-weight: normal;
  text-align: start;
  box-shadow: none;
  display: inline-flex;
  flex-flow: row nowrap;
  align-items: stretch;
  vertical-align: middle;
  position: relative;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-appearance: none;
}

.k-input *,
.k-input *::before,
.k-input *::after,
.k-picker *,
.k-picker *::before,
.k-picker *::after {
  box-sizing: border-box;
}

.k-input > .k-input,
.k-input > .k-picker,
.k-picker > .k-input,
.k-picker > .k-picker {
  border-width: 0 !important;
  color: inherit;
  background: none;
  font: inherit;
  outline: 0;
  box-shadow: none;
}

.k-input > *,
.k-picker > * {
  margin: 0;
}

.k-input::placeholder,
.k-picker::placeholder {
  color: var(--kendo-color-subtle, #666666);
  opacity: 1;
  -webkit-user-select: none;
          user-select: none;
}

input.k-input,
textarea.k-textarea {
  padding-block: var(--kendo-spacing-1, 0.25rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
}

input.k-input:disabled, input.k-input[disabled],
textarea.k-textarea:disabled,
textarea.k-textarea[disabled] {
  outline: none;
  cursor: default;
  opacity: 0.6;
  filter: grayscale(0.1);
  pointer-events: none;
  box-shadow: none;
}

:is([disabled], .k-disabled) :is(input.k-input, textarea.k-textarea):is(:disabled, [disabled]) {
  opacity: 1;
  filter: grayscale(0);
}

textarea.k-textarea {
  overflow: auto;
}

.k-picker {
  cursor: pointer;
}

select.k-picker {
  padding-block: var(--kendo-spacing-1, 0.25rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
  -webkit-appearance: auto;
          appearance: auto;
  align-items: center;
}

select.k-picker:disabled, select.k-picker[disabled] {
  outline: none;
  cursor: default;
  opacity: 0.6;
  filter: grayscale(0.1);
  pointer-events: none;
  box-shadow: none;
}

:is([disabled], .k-disabled) select.k-picker:is(:disabled, [disabled]) {
  opacity: 1;
  filter: grayscale(0);
}

.k-input-inner {
  padding-block: var(--kendo-spacing-1, 0.25rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
  width: 100%;
  border: 0;
  outline: 0;
  color: inherit;
  background: none;
  font: inherit;
  flex: 1;
  position: relative;
  z-index: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-appearance: none;
}

.k-input-inner::placeholder {
  color: var(--kendo-color-subtle, #666666);
  opacity: 1;
  -webkit-user-select: none;
          user-select: none;
}

.k-input-inner:invalid {
  box-shadow: none;
}

span.k-input-inner {
  white-space: nowrap;
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
}

textarea.k-input-inner {
  margin: 0;
}

.k-input-value-icon {
  flex: none;
}

.k-input-value-text {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
}

.k-input-value-text::before {
  content: "​";
  width: 0px;
  overflow: hidden;
  flex: none;
  display: inline-block;
  vertical-align: top;
}

.k-input-values {
  min-width: 0px;
  width: 100%;
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  cursor: text;
}

.k-input-values .k-chip-list {
  display: contents;
}

.k-icon-picker > .k-input-inner {
  padding: var(--kendo-spacing-1, 0.25rem);
  justify-content: center;
}

.k-input-prefix,
.k-input-suffix {
  border-color: inherit;
  display: flex;
  align-items: center;
  flex: none;
}

.k-input-prefix > *,
.k-input-suffix > * {
  flex-shrink: 0;
  border: none;
}

.k-input-prefix-vertical,
.k-input-suffix-vertical {
  flex-flow: column wrap;
}

.k-input-prefix-horizontal,
.k-input-suffix-horizontal {
  flex-flow: row wrap;
}

.k-input-separator {
  margin: 0;
  border-style: solid;
  border-color: inherit;
  border-width: 0 0 0 1px;
  height: 16px;
  align-self: center;
}

.k-input-separator-horizontal {
  height: auto;
  margin-inline: var(--kendo-spacing-1, 0.25rem);
  align-self: stretch;
  border-width: 1px 0 0;
}

.k-input-separator-vertical {
  height: auto;
  margin-block: var(--kendo-spacing-1, 0.25rem);
  align-self: stretch;
  border-width: 0 0 0 1px;
}

.k-input-group {
  margin: 0;
  padding: 0;
  border-width: 0;
  box-sizing: border-box;
  list-style: none;
  outline: 0;
  display: inline-flex;
  flex-flow: row nowrap;
  vertical-align: middle;
  position: relative;
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.k-input-group > .k-input + .k-input {
  margin-inline-start: -1px;
}

.k-input-group > .k-input:hover,
.k-input-group > .k-input.k-hover,
.k-input-group > .k-input:focus,
.k-input-group > .k-input:focus-within,
.k-input-group > .k-input.k-focus,
.k-input-group > .k-input:active,
.k-input-group > .k-input.k-active,
.k-input-group > .k-input.k-selected {
  z-index: 2;
}

.k-input-group .k-input:not(:first-child):not(:last-child) {
  border-start-end-radius: 0;
  border-end-end-radius: 0;
  border-start-start-radius: 0;
  border-end-start-radius: 0;
}

.k-input-group > .k-input:first-child:not(:only-child) {
  border-start-end-radius: 0;
  border-end-end-radius: 0;
}

.k-input-group > .k-input:last-child:not(:only-child) {
  border-start-start-radius: 0;
  border-end-start-radius: 0;
}

.k-input-group:disabled, .k-input-group[disabled], .k-input-group.k-disabled {
  opacity: 1;
  filter: none;
}

.k-input-icon,
.k-input-validation-icon,
.k-input-loading-icon {
  flex: none;
  align-self: center;
  display: inline-flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
  box-sizing: content-box;
}

.k-input-loading-icon {
  width: 1em;
  height: 1em;
  font-size: 16px;
}

.k-input-icon.k-svg-icon > svg, .k-input-icon.k-icon-md > svg,
.k-input-validation-icon.k-svg-icon > svg,
.k-input-validation-icon.k-icon-md > svg,
.k-input-loading-icon.k-svg-icon > svg,
.k-input-loading-icon.k-icon-md > svg {
  width: 16px;
  height: 16px;
}

.k-input-icon.k-icon-xs > svg,
.k-input-validation-icon.k-icon-xs > svg,
.k-input-loading-icon.k-icon-xs > svg {
  width: calc(16px * 0.75);
  height: calc(16px * 0.75);
}

.k-input-icon.k-icon-sm > svg,
.k-input-validation-icon.k-icon-sm > svg,
.k-input-loading-icon.k-icon-sm > svg {
  width: calc(16px * 0.875);
  height: calc(16px * 0.875);
}

.k-input-icon.k-icon-lg > svg,
.k-input-validation-icon.k-icon-lg > svg,
.k-input-loading-icon.k-icon-lg > svg {
  width: calc(16px * 1.25);
  height: calc(16px * 1.25);
}

.k-input-icon.k-icon-xl > svg,
.k-input-validation-icon.k-icon-xl > svg,
.k-input-loading-icon.k-icon-xl > svg {
  width: calc(16px * 1.5);
  height: calc(16px * 1.5);
}

.k-input-icon.k-icon-xxl > svg,
.k-input-validation-icon.k-icon-xxl > svg,
.k-input-loading-icon.k-icon-xxl > svg {
  width: calc(16px * 2);
  height: calc(16px * 2);
}

.k-input-icon.k-icon-xxxl > svg,
.k-input-validation-icon.k-icon-xxxl > svg,
.k-input-loading-icon.k-icon-xxxl > svg {
  width: calc(16px * 3);
  height: calc(16px * 3);
}

.k-clear-value {
  outline: 0;
  flex: none;
  align-self: center;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  opacity: 0.5;
}

.k-clear-value:hover,
.k-clear-value.k-hover {
  opacity: 1;
}

.k-clear-value:focus-visible {
  outline: 1px dotted;
  outline-offset: -1px;
}

.k-input-button {
  width: calc(var(--kendo-line-height, normal) * 1em + var(--kendo-spacing-1, 0.25rem) * 2);
  border-width: 0;
  border-inline-start-width: 1px;
  flex: none;
  aspect-ratio: auto;
  box-shadow: none;
}

.k-input-button > .k-button-icon {
  min-width: auto !important;
}

.k-input-button:focus {
  box-shadow: none;
}

.k-picker .k-input-button {
  color: inherit;
  background: none;
  border-color: transparent;
}

.k-input-spinner {
  width: calc(var(--kendo-line-height, normal) * 1em + var(--kendo-spacing-1, 0.25rem) * 2);
  flex: none;
  display: flex;
  flex-flow: column nowrap;
}

.k-input-spinner .k-spinner-increase,
.k-input-spinner .k-spinner-decrease {
  border-width: 0;
  border-inline-start-width: 1px;
  flex: 1 1 50%;
  box-shadow: none;
  position: relative;
  aspect-ratio: auto;
}

.k-input-spinner .k-spinner-increase .k-button-icon,
.k-input-spinner .k-spinner-decrease .k-button-icon {
  margin-block: -1em;
  margin-inline: 0;
  min-width: auto !important;
  min-height: auto !important;
}

.k-input-spinner .k-spinner-increase .k-icon {
  bottom: auto;
}

.k-input-spinner .k-spinner-decrease .k-icon {
  top: auto;
}

.k-searchbar {
  flex: 1 1 auto;
  display: flex;
  flex-flow: row nowrap;
}

.k-picker-wrap,
.k-dropdown-wrap,
.k-dateinput-wrap,
.k-multiselect-wrap,
.k-numeric-wrap {
  width: 100%;
  border-width: 0;
  border-color: inherit;
  box-sizing: border-box;
  flex: 1 1 auto;
  display: flex;
  flex-flow: row nowrap;
  overflow: hidden;
  position: relative;
}

.k-input-flat,
.k-picker-flat {
  border-bottom-right-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
  border-width: 1px 0;
  border-top-color: transparent !important;
  background-image: none !important;
}

.k-input-outline {
  background: none !important;
}

.k-input-sm,
.k-picker-sm {
  font-size: var(--kendo-font-size, inherit);
  line-height: var(--kendo-line-height, normal);
}

.k-input-sm .k-input-values,
.k-picker-sm .k-input-values {
  padding: calc(var(--kendo-spacing-0\.5, 0.125rem) / 2);
  gap: calc(var(--kendo-spacing-0\.5, 0.125rem) / 2);
}

.k-input-sm .k-input-values > .k-searchbar,
.k-input-sm .k-input-values > .k-input-inner,
.k-picker-sm .k-input-values > .k-searchbar,
.k-picker-sm .k-input-values > .k-input-inner {
  margin: calc(var(--kendo-spacing-0\.5, 0.125rem) / 2 * -1);
}

.k-input-sm .k-input-inner,
.k-picker-sm .k-input-inner {
  padding-block: var(--kendo-spacing-0\.5, 0.125rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
}

.k-input-sm .k-input-button,
.k-input-sm .k-spinner-increase,
.k-input-sm .k-spinner-decrease,
.k-picker-sm .k-input-button,
.k-picker-sm .k-spinner-increase,
.k-picker-sm .k-spinner-decrease {
  padding-block: var(--kendo-spacing-0\.5, 0.125rem);
  padding-inline: var(--kendo-spacing-0\.5, 0.125rem);
}

.k-input-sm .k-input-icon,
.k-input-sm .k-input-validation-icon,
.k-input-sm .k-input-loading-icon,
.k-input-sm .k-clear-value,
.k-input-sm .k-input-prefix > .k-icon,
.k-input-sm .k-input-prefix > .k-input-prefix-text,
.k-input-sm .k-input-suffix > .k-icon,
.k-input-sm .k-input-suffix > .k-input-suffix-text,
.k-picker-sm .k-input-icon,
.k-picker-sm .k-input-validation-icon,
.k-picker-sm .k-input-loading-icon,
.k-picker-sm .k-clear-value,
.k-picker-sm .k-input-prefix > .k-icon,
.k-picker-sm .k-input-prefix > .k-input-prefix-text,
.k-picker-sm .k-input-suffix > .k-icon,
.k-picker-sm .k-input-suffix > .k-input-suffix-text {
  padding-block: var(--kendo-spacing-0\.5, 0.125rem);
  padding-inline: var(--kendo-spacing-0\.5, 0.125rem);
  box-sizing: content-box;
}

.k-input-sm .k-input-separator-horizontal,
.k-picker-sm .k-input-separator-horizontal {
  margin-inline: var(--kendo-spacing-0\.5, 0.125rem);
}

.k-input-sm .k-input-separator-vertical,
.k-picker-sm .k-input-separator-vertical {
  margin-block: var(--kendo-spacing-0\.5, 0.125rem);
}

.k-input-sm.k-icon-picker > .k-input-inner,
.k-picker-sm.k-icon-picker > .k-input-inner {
  width: calc(var(--kendo-line-height, normal) * 1em);
  height: calc(var(--kendo-line-height, normal) * 1em);
  padding: var(--kendo-spacing-0\.5, 0.125rem);
  box-sizing: content-box;
}

.k-dropdown-operator.k-picker-sm .k-input-button {
  padding: var(--kendo-spacing-0\.5, 0.125rem);
}

select.k-picker-sm {
  padding-block: var(--kendo-spacing-0\.5, 0.125rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
}

.k-input-md,
.k-picker-md {
  font-size: var(--kendo-font-size, inherit);
  line-height: var(--kendo-line-height, normal);
}

.k-input-md .k-input-values,
.k-picker-md .k-input-values {
  padding: calc(var(--kendo-spacing-1, 0.25rem) / 2);
  gap: calc(var(--kendo-spacing-1, 0.25rem) / 2);
}

.k-input-md .k-input-values > .k-searchbar,
.k-input-md .k-input-values > .k-input-inner,
.k-picker-md .k-input-values > .k-searchbar,
.k-picker-md .k-input-values > .k-input-inner {
  margin: calc(var(--kendo-spacing-1, 0.25rem) / 2 * -1);
}

.k-input-md .k-input-inner,
.k-picker-md .k-input-inner {
  padding-block: var(--kendo-spacing-1, 0.25rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
}

.k-input-md .k-input-button,
.k-input-md .k-spinner-increase,
.k-input-md .k-spinner-decrease,
.k-picker-md .k-input-button,
.k-picker-md .k-spinner-increase,
.k-picker-md .k-spinner-decrease {
  padding-block: var(--kendo-spacing-1, 0.25rem);
  padding-inline: var(--kendo-spacing-1, 0.25rem);
}

.k-input-md .k-input-icon,
.k-input-md .k-input-validation-icon,
.k-input-md .k-input-loading-icon,
.k-input-md .k-clear-value,
.k-input-md .k-input-prefix > .k-icon,
.k-input-md .k-input-prefix > .k-input-prefix-text,
.k-input-md .k-input-suffix > .k-icon,
.k-input-md .k-input-suffix > .k-input-suffix-text,
.k-picker-md .k-input-icon,
.k-picker-md .k-input-validation-icon,
.k-picker-md .k-input-loading-icon,
.k-picker-md .k-clear-value,
.k-picker-md .k-input-prefix > .k-icon,
.k-picker-md .k-input-prefix > .k-input-prefix-text,
.k-picker-md .k-input-suffix > .k-icon,
.k-picker-md .k-input-suffix > .k-input-suffix-text {
  padding-block: var(--kendo-spacing-1, 0.25rem);
  padding-inline: var(--kendo-spacing-1, 0.25rem);
  box-sizing: content-box;
}

.k-input-md .k-input-separator-horizontal,
.k-picker-md .k-input-separator-horizontal {
  margin-inline: var(--kendo-spacing-1, 0.25rem);
}

.k-input-md .k-input-separator-vertical,
.k-picker-md .k-input-separator-vertical {
  margin-block: var(--kendo-spacing-1, 0.25rem);
}

.k-input-md.k-icon-picker > .k-input-inner,
.k-picker-md.k-icon-picker > .k-input-inner {
  width: calc(var(--kendo-line-height, normal) * 1em);
  height: calc(var(--kendo-line-height, normal) * 1em);
  padding: var(--kendo-spacing-1, 0.25rem);
  box-sizing: content-box;
}

.k-dropdown-operator.k-picker-md .k-input-button {
  padding: var(--kendo-spacing-1, 0.25rem);
}

select.k-picker-md {
  padding-block: var(--kendo-spacing-1, 0.25rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
}

.k-input-lg,
.k-picker-lg {
  font-size: var(--kendo-font-size-lg, inherit);
  line-height: var(--kendo-line-height-lg, normal);
}

.k-input-lg .k-input-values,
.k-picker-lg .k-input-values {
  padding: calc(var(--kendo-spacing-2, 0.5rem) / 2);
  gap: calc(var(--kendo-spacing-2, 0.5rem) / 2);
}

.k-input-lg .k-input-values > .k-searchbar,
.k-input-lg .k-input-values > .k-input-inner,
.k-picker-lg .k-input-values > .k-searchbar,
.k-picker-lg .k-input-values > .k-input-inner {
  margin: calc(var(--kendo-spacing-2, 0.5rem) / 2 * -1);
}

.k-input-lg .k-input-inner,
.k-picker-lg .k-input-inner {
  padding-block: var(--kendo-spacing-2, 0.5rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
}

.k-input-lg .k-input-button,
.k-input-lg .k-spinner-increase,
.k-input-lg .k-spinner-decrease,
.k-picker-lg .k-input-button,
.k-picker-lg .k-spinner-increase,
.k-picker-lg .k-spinner-decrease {
  padding-block: var(--kendo-spacing-2, 0.5rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
}

.k-input-lg .k-input-icon,
.k-input-lg .k-input-validation-icon,
.k-input-lg .k-input-loading-icon,
.k-input-lg .k-clear-value,
.k-input-lg .k-input-prefix > .k-icon,
.k-input-lg .k-input-prefix > .k-input-prefix-text,
.k-input-lg .k-input-suffix > .k-icon,
.k-input-lg .k-input-suffix > .k-input-suffix-text,
.k-picker-lg .k-input-icon,
.k-picker-lg .k-input-validation-icon,
.k-picker-lg .k-input-loading-icon,
.k-picker-lg .k-clear-value,
.k-picker-lg .k-input-prefix > .k-icon,
.k-picker-lg .k-input-prefix > .k-input-prefix-text,
.k-picker-lg .k-input-suffix > .k-icon,
.k-picker-lg .k-input-suffix > .k-input-suffix-text {
  padding-block: var(--kendo-spacing-2, 0.5rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
  box-sizing: content-box;
}

.k-input-lg .k-input-separator-horizontal,
.k-picker-lg .k-input-separator-horizontal {
  margin-inline: var(--kendo-spacing-2, 0.5rem);
}

.k-input-lg .k-input-separator-vertical,
.k-picker-lg .k-input-separator-vertical {
  margin-block: var(--kendo-spacing-2, 0.5rem);
}

.k-input-lg.k-icon-picker > .k-input-inner,
.k-picker-lg.k-icon-picker > .k-input-inner {
  width: calc(var(--kendo-line-height-lg, normal) * 1em);
  height: calc(var(--kendo-line-height-lg, normal) * 1em);
  padding: var(--kendo-spacing-2, 0.5rem);
  box-sizing: content-box;
}

.k-dropdown-operator.k-picker-lg .k-input-button {
  padding: var(--kendo-spacing-2, 0.5rem);
}

select.k-picker-lg {
  padding-block: var(--kendo-spacing-2, 0.5rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
}

.k-input > kendo-popup,
.k-picker > kendo-popup {
  position: fixed;
}

@keyframes autoFillStart {}
@keyframes autoFillEnd {}
.k-autofill:-webkit-autofill {
  animation-name: autoFillStart;
}

.k-autofill:not(:-webkit-autofill) {
  animation-name: autoFillEnd;
}

.k-input:-webkit-autofill {
  animation-name: autoFillStart;
}

.k-input:not(:-webkit-autofill) {
  animation-name: autoFillEnd;
}

.k-input-solid {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
  color: var(--kendo-color-on-app-surface, #3d3d3d);
  background-color: var(--kendo-color-surface-alt, #ffffff);
}

.k-input-solid:hover, .k-input-solid.k-hover {
  border-color: var(--kendo-color-border-alt, rgba(0, 0, 0, 0.16));
}

.k-input-solid:focus, .k-input-solid.k-focus {
  border-color: var(--kendo-color-border-alt, rgba(0, 0, 0, 0.16));
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--kendo-color-on-app-surface, #3d3d3d) 8%, transparent);
}

.k-input-solid:focus-within {
  border-color: var(--kendo-color-border-alt, rgba(0, 0, 0, 0.16));
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--kendo-color-on-app-surface, #3d3d3d) 8%, transparent);
}

.k-input-solid.k-invalid, .k-input-solid.ng-invalid.ng-touched, .k-input-solid.ng-invalid.ng-dirty {
  border-color: var(--kendo-color-error, #f31700);
}

.k-input-solid.k-invalid .k-input-validation-icon, .k-input-solid.ng-invalid.ng-touched .k-input-validation-icon, .k-input-solid.ng-invalid.ng-dirty .k-input-validation-icon {
  color: var(--kendo-color-error, #f31700);
}

.k-input-solid .k-input-prefix {
  color: var(--kendo-color-subtle, #666666);
}

.k-input-solid .k-input-suffix {
  color: var(--kendo-color-subtle, #666666);
}

.k-input-solid .k-input-separator {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
}

.k-picker-solid {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
  color: var(--kendo-color-on-base, #3d3d3d);
  background-color: var(--kendo-color-base, #f5f5f5);
}

.k-picker-solid:hover, .k-picker-solid.k-hover {
  background-color: var(--kendo-color-base-hover, #ebebeb);
}

.k-picker-solid:focus, .k-picker-solid.k-focus {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--kendo-color-on-app-surface, #3d3d3d) 8%, transparent);
}

.k-picker-solid:focus-within {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--kendo-color-on-app-surface, #3d3d3d) 8%, transparent);
}

.k-picker-solid.k-invalid, .k-picker-solid.ng-invalid.ng-touched, .k-picker-solid.ng-invalid.ng-dirty {
  border-color: var(--kendo-color-error, #f31700);
}

.k-picker-solid.k-invalid .k-input-validation-icon, .k-picker-solid.ng-invalid.ng-touched .k-input-validation-icon, .k-picker-solid.ng-invalid.ng-dirty .k-input-validation-icon {
  color: var(--kendo-color-error, #f31700);
}

.k-input-outline {
  border-color: color-mix(in srgb, var(--kendo-color-on-base, #3d3d3d) 50%, transparent);
  color: var(--kendo-color-on-app-surface, #3d3d3d);
}

.k-input-outline > .k-input-button {
  border-color: inherit;
}

.k-input-outline > .k-input-spinner {
  border-color: inherit;
}

.k-input-outline > .k-input-spinner > .k-spinner-increase, .k-input-outline > .k-input-spinner > .k-spinner-decrease {
  border-color: inherit;
}

.k-input-outline:hover, .k-input-outline.k-hover {
  border-color: color-mix(in srgb, var(--kendo-color-on-base, #3d3d3d) 80%, transparent);
}

.k-input-outline:focus, .k-input-outline.k-focus {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--kendo-color-on-app-surface, #3d3d3d) 8%, transparent);
}

.k-input-outline:focus-within {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--kendo-color-on-app-surface, #3d3d3d) 8%, transparent);
}

.k-input-outline.k-invalid, .k-input-outline.ng-invalid.ng-touched, .k-input-outline.ng-invalid.ng-dirty {
  border-color: var(--kendo-color-error, #f31700);
}

.k-input-outline.k-invalid .k-input-validation-icon, .k-input-outline.ng-invalid.ng-touched .k-input-validation-icon, .k-input-outline.ng-invalid.ng-dirty .k-input-validation-icon {
  color: var(--kendo-color-error, #f31700);
}

.k-input-outline .k-input-prefix {
  color: var(--kendo-color-subtle, #666666);
}

.k-input-outline .k-input-suffix {
  color: var(--kendo-color-subtle, #666666);
}

.k-input-outline .k-input-separator {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
}

.k-picker-outline {
  border-color: color-mix(in srgb, var(--kendo-color-on-base, #3d3d3d) 50%, transparent);
  color: var(--kendo-color-on-base, #3d3d3d);
}

.k-picker-outline:hover, .k-picker-outline.k-hover {
  border-color: var(--kendo-color-on-base, #3d3d3d);
  color: var(--kendo-color-base, #f5f5f5);
  background-color: var(--kendo-color-on-base, #3d3d3d);
}

.k-picker-outline:focus, .k-picker-outline.k-focus {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--kendo-color-on-app-surface, #3d3d3d) 8%, transparent);
}

.k-picker-outline:focus-within {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--kendo-color-on-app-surface, #3d3d3d) 8%, transparent);
}

.k-picker-outline.k-invalid, .k-picker-outline.ng-invalid.ng-touched, .k-picker-outline.ng-invalid.ng-dirty {
  border-color: var(--kendo-color-error, #f31700);
}

.k-picker-outline.k-invalid .k-input-validation-icon, .k-picker-outline.ng-invalid.ng-touched .k-input-validation-icon, .k-picker-outline.ng-invalid.ng-dirty .k-input-validation-icon {
  color: var(--kendo-color-error, #f31700);
}

.k-input-flat {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
  color: var(--kendo-color-on-app-surface, #3d3d3d);
}

.k-input-flat:hover, .k-input-flat.k-hover {
  border-color: var(--kendo-color-border-alt, rgba(0, 0, 0, 0.16));
}

.k-input-flat:focus, .k-input-flat.k-focus {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--kendo-color-on-app-surface, #3d3d3d) 8%, transparent);
}

.k-input-flat:focus-within {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--kendo-color-on-app-surface, #3d3d3d) 8%, transparent);
}

.k-input-flat.k-invalid, .k-input-flat.ng-invalid.ng-touched, .k-input-flat.ng-invalid.ng-dirty {
  border-color: var(--kendo-color-error, #f31700);
}

.k-input-flat.k-invalid .k-input-validation-icon, .k-input-flat.ng-invalid.ng-touched .k-input-validation-icon, .k-input-flat.ng-invalid.ng-dirty .k-input-validation-icon {
  color: var(--kendo-color-error, #f31700);
}

.k-input-flat .k-input-prefix {
  color: var(--kendo-color-subtle, #666666);
}

.k-input-flat .k-input-suffix {
  color: var(--kendo-color-subtle, #666666);
}

.k-input-flat .k-input-separator {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
}

.k-picker-flat {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
  color: var(--kendo-color-on-base, #3d3d3d);
}

.k-picker-flat:hover, .k-picker-flat.k-hover {
  border-color: var(--kendo-color-border-alt, rgba(0, 0, 0, 0.16));
  background-color: color-mix(in srgb, var(--kendo-color-on-base, #3d3d3d) 4%, transparent);
}

.k-picker-flat:focus, .k-picker-flat.k-focus {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--kendo-color-on-app-surface, #3d3d3d) 8%, transparent);
}

.k-picker-flat:focus-within {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--kendo-color-on-app-surface, #3d3d3d) 8%, transparent);
}

.k-picker-flat.k-invalid, .k-picker-flat.ng-invalid.ng-touched, .k-picker-flat.ng-invalid.ng-dirty {
  border-color: var(--kendo-color-error, #f31700);
}

.k-picker-flat.k-invalid .k-input-validation-icon, .k-picker-flat.ng-invalid.ng-touched .k-input-validation-icon, .k-picker-flat.ng-invalid.ng-dirty .k-input-validation-icon {
  color: var(--kendo-color-error, #f31700);
}

.k-animation-container {
  position: absolute;
  overflow: hidden;
  z-index: 100;
}

.k-animation-container-fixed {
  position: fixed;
}

.k-animation-container-relative {
  position: relative;
  display: inline-block;
}

.k-animation-container {
  border-radius: 0 0 0.25rem 0.25rem;
}

.k-animation-container-shown {
  overflow: visible;
}

.k-popup {
  margin: 0;
  padding: 0;
  border-width: 1px;
  border-style: solid;
  box-sizing: border-box;
  font-size: var(--kendo-font-size, inherit);
  line-height: var(--kendo-line-height, normal);
  display: flex;
  flex-direction: column;
  align-items: stretch;
}

.k-popup .k-item {
  outline: none;
}

.k-popup > .k-colorpalette {
  padding-block: var(--kendo-spacing-2, 0.5rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
}

.k-popup.k-popup-transparent {
  border-width: 0;
  background-color: transparent;
  box-shadow: none;
}

.k-popup.k-popup-flush {
  padding: 0;
}

.k-popup > .k-widget,
.k-popup > .k-coloreditor {
  border-width: 0;
}

.k-shadow {
  box-shadow: var(--kendo-elevation-4, 0 8px 10px rgba(0, 0, 0, 0.12), 0 4px 16px rgba(0, 0, 0, 0.12));
}

.k-popup {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
  color: var(--kendo-color-on-app-surface, #3d3d3d);
  background-color: var(--kendo-color-surface-alt, #ffffff);
  box-shadow: var(--kendo-elevation-4, 0 8px 10px rgba(0, 0, 0, 0.12), 0 4px 16px rgba(0, 0, 0, 0.12));
}

.k-list-container {
  display: flex;
  flex-flow: column nowrap;
}

.k-list-container > .k-list {
  flex: 1;
  height: 100%;
}

.k-list {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: var(--kendo-font-family, inherit);
  display: flex;
  flex-flow: column nowrap;
  outline: none;
  position: relative;
  overflow: hidden;
}

.k-list *,
.k-list *::before,
.k-list *::after {
  box-sizing: border-box;
}

.k-popup > .k-list {
  height: 100%;
  border-width: 0;
}

.k-list-group-sticky-header {
  border-width: 0;
  border-width: 0 0 1px;
  border-style: solid;
  font-weight: var(--kendo-font-weight-bold, normal);
  white-space: nowrap;
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  flex: none;
  overflow: hidden;
  text-overflow: ellipsis;
  cursor: pointer;
}

.k-list-content {
  border-color: inherit;
  flex: 1 1 auto;
  overflow: hidden;
  overflow-y: auto;
  position: relative;
}

.k-list-ul {
  margin: 0;
  padding: 0;
  border-width: 0;
  border-color: inherit;
  height: auto;
  list-style: none;
}

.k-list-item, .k-list-optionlabel {
  border: 0;
  outline: none;
  cursor: pointer;
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  align-content: center;
  gap: var(--kendo-spacing-1, 0.25rem);
  position: relative;
  transition-property: color, background-color, outline-color, box-shadow;
  transition-duration: 200ms;
  transition-timing-function: ease;
}

.k-list-item.k-first::before, .k-first.k-list-optionlabel::before {
  content: "";
  border-width: 1px 0 0;
  border-style: solid;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
}

.k-list-item-text::before,
.k-list-header-text::before,
.k-list-optionlabel::before {
  content: "​";
  width: 0px;
  overflow: hidden;
}

.k-list-optionlabel {
  -moz-column-gap: 0;
       column-gap: 0;
}

.k-list-group-item {
  border-width: 0;
  border-width: 1px 0 0;
  border-style: solid;
  font-weight: var(--kendo-font-weight-bold, normal);
  cursor: default;
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  align-content: center;
  gap: var(--kendo-spacing-1, 0.25rem);
  position: relative;
}

.k-list-item-group-label {
  padding-block: 0;
  padding-inline: 0.5em;
  font-size: 0.75em;
  position: absolute;
  top: 0;
  inset-inline-end: 0;
}

.k-virtual-content,
.k-virtual-list .k-list-content {
  overflow-y: scroll;
}

.k-virtual-list .k-list-item, .k-virtual-list .k-list-optionlabel,
.k-virtual-list .k-list-group-item,
.k-virtual-content .k-list-item,
.k-virtual-content .k-list-optionlabel,
.k-virtual-content .k-list-group-item {
  position: absolute;
  width: 100%;
}

.k-virtual-list .k-list-item-text,
.k-virtual-list .k-list-header-text {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.k-virtual-list .k-list-optionlabel {
  position: relative;
}

.k-list-filter {
  display: block;
  position: relative;
  padding: var(--kendo-spacing-2, 0.5rem);
  box-sizing: border-box;
  flex: none;
}

.k-list-sm {
  font-size: var(--kendo-font-size, inherit);
  line-height: var(--kendo-line-height, normal);
}

.k-list-sm .k-list-group-sticky-header {
  padding-block: var(--kendo-spacing-0\.5, 0.125rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
}

.k-list-sm .k-list-item, .k-list-sm .k-list-optionlabel {
  padding-block: var(--kendo-spacing-0\.5, 0.125rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
}

.k-list-sm .k-list-group-item {
  padding-block: var(--kendo-spacing-0\.5, 0.125rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
}

.k-list-md {
  font-size: var(--kendo-font-size, inherit);
  line-height: var(--kendo-line-height, normal);
}

.k-list-md .k-list-group-sticky-header {
  padding-block: var(--kendo-spacing-1, 0.25rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
}

.k-list-md .k-list-item, .k-list-md .k-list-optionlabel {
  padding-block: var(--kendo-spacing-1, 0.25rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
}

.k-list-md .k-list-group-item {
  padding-block: var(--kendo-spacing-1, 0.25rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
}

.k-list-lg {
  font-size: var(--kendo-font-size-lg, inherit);
  line-height: var(--kendo-line-height-lg, normal);
}

.k-list-lg .k-list-group-sticky-header {
  padding-block: var(--kendo-spacing-1\.5, 0.375rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
}

.k-list-lg .k-list-item, .k-list-lg .k-list-optionlabel {
  padding-block: var(--kendo-spacing-2, 0.5rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
}

.k-list-lg .k-list-group-item {
  padding-block: var(--kendo-spacing-1\.5, 0.375rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
}

.k-list {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
  color: var(--kendo-color-on-app-surface, #3d3d3d);
  background-color: var(--kendo-color-surface-alt, #ffffff);
}

.k-list-group-sticky-header {
  border-color: inherit;
  box-shadow: var(--kendo-elevation-2, 0 4px 6px rgba(0, 0, 0, 0.06), 0 4px 16px rgba(0, 0, 0, 0.12));
}

.k-list-item:hover, .k-list-optionlabel:hover, .k-list-item.k-hover, .k-hover.k-list-optionlabel {
  color: var(--kendo-color-on-app-surface, #3d3d3d);
  background-color: var(--kendo-color-base-hover, #ebebeb);
}

.k-list-item:focus, .k-list-optionlabel:focus, .k-list-item.k-focus, .k-focus.k-list-optionlabel {
  box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.12);
}

.k-list-item.k-selected, .k-selected.k-list-optionlabel {
  color: var(--kendo-color-on-primary, #ffffff);
  background-color: var(--kendo-color-primary, #ff6358);
}

.k-list-item.k-selected:hover, .k-selected.k-list-optionlabel:hover, .k-list-item.k-selected.k-hover, .k-selected.k-hover.k-list-optionlabel {
  color: var(--kendo-color-on-primary, #ffffff);
  background-color: var(--kendo-color-primary-hover, #ea5a51);
}

.k-list-optionlabel,
.k-list-optionlabel.k-hover,
.k-list-optionlabel:hover {
  color: var(--kendo-color-subtle, #666666);
}

.k-list-group-item {
  border-color: inherit;
}

.k-list-item-group-label {
  color: var(--kendo-color-surface-alt, #ffffff);
  background-color: var(--kendo-color-on-app-surface, #3d3d3d);
}

.k-calendar {
  inline-size: var(--INTERNAL--kendo-calendar-width, min-content);
  block-size: var(--INTERNAL--kendo-calendar-height, min-content);
  border-width: 1px;
  border-style: solid;
  box-sizing: border-box;
  outline: 0;
  font-family: var(--kendo-font-family, inherit);
  font-size: var(--kendo-font-size, inherit);
  line-height: var(--kendo-line-height, normal);
  position: relative;
  overflow: hidden;
  display: inline-flex;
  flex-flow: column nowrap;
  -webkit-user-select: none;
          user-select: none;
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.k-calendar > .k-calendar {
  border: 0;
}

.k-calendar-table {
  margin-block: 0;
  margin-inline: auto;
  border-width: 0;
  border-color: inherit;
  border-spacing: 0;
  border-collapse: separate;
  table-layout: fixed;
  text-align: center;
  outline: 0;
  display: table;
  position: relative;
  z-index: 1;
}

.k-calendar-caption,
.k-calendar-caption.k-calendar-th,
.k-calendar .k-meta-header,
.k-calendar .k-month-header {
  padding-block: var(--kendo-spacing-1, 0.25rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
  height: 32px;
  box-sizing: border-box;
  text-transform: none;
  text-align: start;
  font-weight: var(--kendo-font-weight-bold, normal);
  cursor: default;
}

.k-calendar-th,
.k-calendar-td {
  border-width: 0;
  padding: 0;
  text-align: center;
  border-style: solid;
  border-color: inherit;
  font-weight: normal;
  cursor: default;
}

.k-calendar-th {
  inline-size: var(--INTERNAL--kendo-calendar-cell-size, 32px);
  block-size: var(--INTERNAL--kendo-calendar-cell-size, 32px);
  font-size: var(--kendo-font-size-sm, inherit);
  line-height: 2;
  text-transform: uppercase;
}

.k-calendar-td {
  border-radius: var(--kendo-border-radius-md, 0.25rem);
  inline-size: var(--INTERNAL--kendo-calendar-cell-size, min-content);
  block-size: var(--INTERNAL--kendo-calendar-cell-size, min-content);
  border-color: transparent;
}

.k-calendar-td.k-alt {
  font-size: 0.75rem;
}

.k-calendar .k-calendar-cell-inner, .k-calendar .k-link {
  border-radius: var(--kendo-border-radius-md, 0.25rem);
  padding-inline: var(--INTERNAL--kendo-calendar-cell-padding-x, 0.25em);
  padding-block: var(--INTERNAL--kendo-calendar-cell-padding-y, 0.25em);
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  white-space: normal;
  position: relative;
  overflow: hidden;
}

.k-calendar .k-header {
  padding-block: var(--kendo-spacing-1, 0.25rem);
  padding-inline: var(--kendo-spacing-1, 0.25rem);
  border-bottom-width: 1px;
  border-bottom-style: solid;
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  position: relative;
  z-index: 2;
}

.k-calendar-header {
  padding-block: var(--kendo-spacing-1, 0.25rem);
  padding-inline: var(--kendo-spacing-1, 0.25rem);
  min-width: 256px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex: 0 0 auto;
}

.k-calendar-header .k-calendar-nav {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
}

.k-calendar-footer,
.k-calendar .k-footer {
  padding-block: var(--kendo-spacing-2, 0.5rem);
  padding-inline: var(--kendo-spacing-4, 1rem);
  text-align: center;
  clear: both;
}

.k-calendar-view {
  margin: auto;
  padding-block: 0;
  padding-inline: var(--kendo-spacing-1, 0.25rem);
  width: 256px;
  inline-size: var(--INTERNAL--kendo-calendar-view-width, 256px);
  min-height: 224px;
  box-sizing: content-box;
  gap: var(--kendo-spacing-4, 1rem);
  position: relative;
  z-index: 1;
  overflow: hidden;
}

.k-calendar-view .k-today {
  font-weight: bold;
}

.k-month-calendar .k-calendar-td,
.k-calendar-monthview .k-calendar-td {
  width: 32px;
  height: 32px;
  inline-size: var(--INTERNAL--kendo-calendar-cell-size, 32px);
  block-size: var(--INTERNAL--kendo-calendar-cell-size, 32px);
}

.k-year-calendar .k-calendar-td,
.k-calendar-yearview .k-calendar-td {
  width: 64px;
  height: 64px;
  inline-size: var(--INTERNAL--kendo-calendar-cell-size, 64px);
  block-size: var(--INTERNAL--kendo-calendar-cell-size, 64px);
}

.k-decade-calendar .k-calendar-td,
.k-calendar-decadeview .k-calendar-td {
  width: 64px;
  height: 64px;
  inline-size: var(--INTERNAL--kendo-calendar-cell-size, 64px);
  block-size: var(--INTERNAL--kendo-calendar-cell-size, 64px);
}

.k-century-calendar .k-calendar-td,
.k-calendar-centuryview .k-calendar-td {
  width: 64px;
  height: 64px;
  inline-size: var(--INTERNAL--kendo-calendar-cell-size, 64px);
  block-size: var(--INTERNAL--kendo-calendar-cell-size, 64px);
}

.k-century-calendar .k-calendar-cell-inner, .k-century-calendar .k-link,
.k-calendar-centuryview .k-calendar-cell-inner,
.k-calendar-centuryview .k-link {
  text-align: start;
}

.k-popup .k-calendar {
  height: 100%;
}

.k-calendar-container,
.k-datetime-container {
  padding: 0;
}

.k-calendar-container .k-calendar,
.k-datetime-container .k-calendar {
  border-width: 0;
}

.k-calendar .k-content.k-scrollable,
.k-calendar .k-calendar-content.k-scrollable {
  box-sizing: content-box;
  overflow-x: hidden;
  overflow-y: auto;
  display: block;
  padding-right: 100px;
  padding-left: 100px;
  margin-left: -100px;
  margin-right: calc(-100px - var(--kendo-scrollbar-width, 17px));
}

.k-calendar .k-scrollable-placeholder {
  position: absolute;
  z-index: -1;
  width: 1px;
  top: 0;
  right: 0;
}

.k-calendar-sm {
  --INTERNAL--kendo-calendar-view-width: 224px;
  --INTERNAL--kendo-calendar-cell-padding-x: var( --kendo-calendar-sm-cell-padding-x, var(--kendo-spacing-0\.5, 0.125rem) );
  --INTERNAL--kendo-calendar-cell-padding-y: var( --kendo-calendar-sm-cell-padding-y, var(--kendo-spacing-0\.5, 0.125rem) );
  font-size: var(--kendo-font-size, inherit);
  line-height: var(--kendo-line-height, normal);
}

.k-calendar-sm.k-month-calendar,
.k-calendar-sm .k-calendar-monthview {
  --INTERNAL--kendo-calendar-cell-size: var( --kendo-calendar-sm-month-cell-size, 28px );
}

.k-calendar-sm.k-year-calendar,
.k-calendar-sm .k-calendar-yearview {
  --INTERNAL--kendo-calendar-cell-size: var( --kendo-calendar-sm-year-cell-size, 56px );
}

.k-calendar-sm.k-decade-calendar,
.k-calendar-sm .k-calendar-decadeview {
  --INTERNAL--kendo-calendar-cell-size: var( --kendo-calendar-sm-decade-cell-size, 56px );
}

.k-calendar-sm.k-century-calendar,
.k-calendar-sm .k-calendar-centuryview {
  --INTERNAL--kendo-calendar-cell-size: var( --kendo-calendar-sm-century-cell-size, 56px );
}

.k-calendar-md {
  --INTERNAL--kendo-calendar-view-width: 256px;
  --INTERNAL--kendo-calendar-cell-padding-x: var( --kendo-calendar-md-cell-padding-x, var(--kendo-spacing-1, 0.25rem) );
  --INTERNAL--kendo-calendar-cell-padding-y: var( --kendo-calendar-md-cell-padding-y, var(--kendo-spacing-1, 0.25rem) );
  font-size: var(--kendo-font-size, inherit);
  line-height: var(--kendo-line-height, normal);
}

.k-calendar-md.k-month-calendar,
.k-calendar-md .k-calendar-monthview {
  --INTERNAL--kendo-calendar-cell-size: var( --kendo-calendar-md-month-cell-size, 32px );
}

.k-calendar-md.k-year-calendar,
.k-calendar-md .k-calendar-yearview {
  --INTERNAL--kendo-calendar-cell-size: var( --kendo-calendar-md-year-cell-size, 64px );
}

.k-calendar-md.k-decade-calendar,
.k-calendar-md .k-calendar-decadeview {
  --INTERNAL--kendo-calendar-cell-size: var( --kendo-calendar-md-decade-cell-size, 64px );
}

.k-calendar-md.k-century-calendar,
.k-calendar-md .k-calendar-centuryview {
  --INTERNAL--kendo-calendar-cell-size: var( --kendo-calendar-md-century-cell-size, 64px );
}

.k-calendar-lg {
  --INTERNAL--kendo-calendar-view-width: 320px;
  --INTERNAL--kendo-calendar-cell-padding-x: var( --kendo-calendar-lg-cell-padding-x, var(--kendo-spacing-2, 0.5rem) );
  --INTERNAL--kendo-calendar-cell-padding-y: var( --kendo-calendar-lg-cell-padding-y, var(--kendo-spacing-2, 0.5rem) );
  font-size: var(--kendo-font-size-lg, inherit);
  line-height: var(--kendo-line-height-lg, normal);
}

.k-calendar-lg.k-month-calendar,
.k-calendar-lg .k-calendar-monthview {
  --INTERNAL--kendo-calendar-cell-size: var( --kendo-calendar-lg-month-cell-size, 40px );
}

.k-calendar-lg.k-year-calendar,
.k-calendar-lg .k-calendar-yearview {
  --INTERNAL--kendo-calendar-cell-size: var( --kendo-calendar-lg-year-cell-size, 80px );
}

.k-calendar-lg.k-decade-calendar,
.k-calendar-lg .k-calendar-decadeview {
  --INTERNAL--kendo-calendar-cell-size: var( --kendo-calendar-lg-decade-cell-size, 80px );
}

.k-calendar-lg.k-century-calendar,
.k-calendar-lg .k-calendar-centuryview {
  --INTERNAL--kendo-calendar-cell-size: var( --kendo-calendar-lg-century-cell-size, 80px );
}

.k-calendar-infinite {
  box-sizing: content-box;
  display: inline-flex;
  flex-flow: row nowrap;
}

.k-calendar-infinite .k-calendar-view {
  padding-block: var(--kendo-spacing-0, 0px);
  padding-inline: var(--kendo-spacing-4, 1rem);
  height: 288px;
  flex: 0 0 auto;
  display: flex;
  flex-flow: column nowrap;
  gap: 0;
  overflow: hidden;
}

.k-calendar-infinite .k-calendar-view .k-content.k-scrollable {
  position: relative;
}

.k-calendar-infinite .k-calendar-view::after {
  display: block;
  position: absolute;
  bottom: 0;
  content: "​";
  height: 0;
  line-height: 0;
  z-index: 1;
  width: 150%;
  left: -25%;
  box-shadow: 0 0 32px 16px var(--kendo-color-surface-alt, #ffffff);
}

.k-calendar-infinite .k-calendar-header {
  margin-left: calc(var(--kendo-spacing-4, 1rem) * -1);
  margin-right: calc(var(--kendo-spacing-4, 1rem) * -1);
  padding-block: var(--kendo-spacing-2, 0.5rem);
  padding-inline: var(--kendo-spacing-4, 1rem);
  width: auto;
  min-width: 0;
}

.k-calendar-infinite .k-calendar-weekdays {
  flex: 0 0 auto;
}

.k-calendar-navigation {
  width: 5em;
  text-align: center;
  flex: 0 0 auto;
  display: block;
  overflow: hidden;
  position: relative;
  z-index: 1;
}

.k-calendar-navigation::before, .k-calendar-navigation::after {
  display: block;
  position: absolute;
  content: "​";
  height: 0;
  line-height: 0;
  z-index: 1;
  width: 200%;
  left: -50%;
  box-shadow: 0 0 6em 3em var(--kendo-color-surface, #fafafa);
}

.k-calendar-navigation::before {
  top: 0;
}

.k-calendar-navigation::after {
  bottom: 0;
}

.k-calendar-navigation .k-content,
.k-calendar-navigation .k-calendar-content {
  background: transparent;
  height: auto;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}

.k-calendar-navigation .k-content ul,
.k-calendar-navigation .k-calendar-content ul {
  width: 5em;
}

.k-calendar-navigation .k-content li,
.k-calendar-navigation .k-calendar-content li {
  height: 2em;
  line-height: 2em;
  cursor: pointer;
  padding-block: 0;
  padding-inline: 1em;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: clip;
}

.k-calendar-navigation .k-calendar-navigation-marker {
  font-weight: bold;
}

.k-calendar-navigation .k-calendar-navigation-highlight {
  width: 100%;
  border-width: 1px 0;
  border-style: solid;
  height: 2em;
  box-sizing: border-box;
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
}

.k-calendar-range {
  width: auto;
}

.k-calendar-range .k-calendar-view {
  width: auto;
  white-space: nowrap;
}

.k-calendar-range .k-calendar-view::after {
  display: none;
}

.k-calendar-range .k-calendar-view:focus {
  outline: 0;
}

.k-range-start {
  border-radius: var(--kendo-border-radius-lg, 0.375rem) 0 0 var(--kendo-border-radius-lg, 0.375rem);
}

.k-range-start .k-calendar-cell-inner,
.k-range-start .k-link {
  border-color: inherit;
  border-radius: inherit;
}

.k-range-end {
  border-radius: 0 var(--kendo-border-radius-lg, 0.375rem) var(--kendo-border-radius-lg, 0.375rem) 0;
}

.k-range-end .k-calendar-cell-inner,
.k-range-end .k-link {
  border-color: inherit;
  border-radius: inherit;
}

.k-range-mid {
  border-color: inherit;
  border-radius: 0;
}

.k-range-start.k-range-end {
  border-radius: var(--kendo-border-radius-lg, 0.375rem);
}

.k-rtl .k-calendar .k-content.k-scrollable,
.k-rtl .k-calendar .k-calendar-content.k-scrollable,
[dir=rtl] .k-calendar .k-content.k-scrollable,
[dir=rtl] .k-calendar .k-calendar-content.k-scrollable,
.k-calendar.k-rtl .k-content.k-scrollable,
.k-calendar.k-rtl .k-calendar-content.k-scrollable,
.k-calendar[dir=rtl] .k-content.k-scrollable,
.k-calendar[dir=rtl] .k-calendar-content.k-scrollable {
  padding-right: 100px;
  padding-left: 100px;
  margin-left: calc(-100px - var(--kendo-scrollbar-width, 17px));
  margin-right: -100px;
}

.k-rtl .k-calendar .k-range-start,
[dir=rtl] .k-calendar .k-range-start,
.k-calendar.k-rtl .k-range-start,
.k-calendar[dir=rtl] .k-range-start {
  border-radius: 0 var(--kendo-border-radius-lg, 0.375rem) var(--kendo-border-radius-lg, 0.375rem) 0;
}

.k-rtl .k-calendar .k-range-end,
[dir=rtl] .k-calendar .k-range-end,
.k-calendar.k-rtl .k-range-end,
.k-calendar[dir=rtl] .k-range-end {
  border-radius: var(--kendo-border-radius-lg, 0.375rem) 0 0 var(--kendo-border-radius-lg, 0.375rem);
}

.k-calendar {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
  color: var(--kendo-color-on-app-surface, #3d3d3d);
  background-color: var(--kendo-color-surface-alt, #ffffff);
}

.k-calendar .k-header {
  border-color: inherit;
  color: var(--kendo-color-on-app-surface, #3d3d3d);
  background-color: var(--kendo-color-surface, #fafafa);
  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.1);
}

.k-calendar .k-calendar-th,
.k-calendar .k-calendar-caption,
.k-calendar .k-meta-header,
.k-calendar .k-month-header {
  color: var(--kendo-color-subtle, #666666);
}

.k-calendar .k-calendar-view .k-today {
  color: var(--kendo-color-primary, #ff6358);
}

.k-calendar .k-other-month {
  color: var(--kendo-color-subtle, #666666);
}

.k-calendar .k-alt {
  background-color: transparent;
  color: var(--kendo-color-subtle, #666666);
}

.k-calendar .k-calendar-td:hover .k-calendar-cell-inner, .k-calendar .k-calendar-td:hover .k-link,
.k-calendar .k-calendar-td.k-hover .k-calendar-cell-inner,
.k-calendar .k-calendar-td.k-hover .k-link {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
  color: var(--kendo-color-on-app-surface, #3d3d3d);
  background-color: var(--kendo-color-base-hover, #ebebeb);
}

.k-calendar .k-calendar-td.k-selected .k-calendar-cell-inner, .k-calendar .k-calendar-td.k-selected .k-link {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
  color: var(--kendo-color-on-primary, #ffffff);
  background-color: var(--kendo-color-primary, #ff6358);
}

.k-calendar .k-calendar-td.k-selected:hover .k-calendar-cell-inner, .k-calendar .k-calendar-td.k-selected:hover .k-link,
.k-calendar .k-calendar-td.k-selected.k-hover .k-calendar-cell-inner,
.k-calendar .k-calendar-td.k-selected.k-hover .k-link {
  color: var(--kendo-color-on-primary, #ffffff);
  background-color: var(--kendo-color-primary-hover, #ea5a51);
}

.k-calendar .k-calendar-td:focus .k-calendar-cell-inner, .k-calendar .k-calendar-td:focus .k-link,
.k-calendar .k-calendar-td.k-focus .k-calendar-cell-inner,
.k-calendar .k-calendar-td.k-focus .k-link {
  box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.08);
}

.k-calendar .k-calendar-td.k-selected:focus .k-calendar-cell-inner, .k-calendar .k-calendar-td.k-selected:focus .k-link,
.k-calendar .k-calendar-td.k-selected.k-focus .k-calendar-cell-inner,
.k-calendar .k-calendar-td.k-selected.k-focus .k-link {
  box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.08);
}

.k-calendar .k-calendar-navigation {
  color: var(--kendo-color-on-app-surface, #3d3d3d);
  background-color: var(--kendo-color-surface, #fafafa);
  box-shadow: inset -1px 0 var(--kendo-color-border, rgba(0, 0, 0, 0.08));
}

.k-calendar .k-calendar-navigation li:hover,
.k-calendar .k-calendar-navigation li.k-hover {
  color: var(--kendo-color-primary-hover, #ea5a51);
}

.k-calendar .k-calendar-navigation-highlight {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
  color: var(--kendo-color-on-app-surface, #3d3d3d);
  background-color: var(--kendo-color-surface-alt, #ffffff);
}

.k-calendar.k-invalid, .k-calendar.k-invalid:hover, .k-calendar.ng-invalid.ng-touched, .k-calendar.ng-invalid.ng-dirty {
  border-color: var(--kendo-color-error, #f31700);
}

.k-rtl .k-calendar .k-calendar-navigation,
.k-calendar[dir=rtl] .k-calendar-navigation {
  box-shadow: inset 1px 0 var(--kendo-color-border, rgba(0, 0, 0, 0.08));
}

.k-scheduler .k-calendar .k-other-month {
  color: var(--kendo-color-subtle, #666666);
  background-color: transparent;
}

.k-calendar .k-range-start,
.k-calendar .k-range-end,
.k-calendar .k-range-mid {
  background-color: color-mix(in srgb, var(--kendo-color-primary, #ff6358) 25%, transparent);
}

.k-calendar .k-range-start .k-calendar-cell-inner, .k-calendar .k-range-start .k-link,
.k-calendar .k-range-end .k-calendar-cell-inner,
.k-calendar .k-range-end .k-link {
  background-color: var(--kendo-color-primary, #ff6358);
}

.k-calendar .k-range-start.k-active .k-calendar-cell-inner, .k-calendar .k-range-start.k-active .k-link,
.k-calendar .k-range-end.k-active .k-calendar-cell-inner,
.k-calendar .k-range-end.k-active .k-link {
  box-shadow: inset 0 0 2px 2px rgba(0, 0, 0, 0.2);
}

.k-calendar .k-range-split-start,
.k-calendar .k-range-split-end {
  position: relative;
}

.k-calendar .k-range-split-start::after,
.k-calendar .k-range-split-end::after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  width: 5px;
}

.k-calendar .k-range-split-start::after {
  left: -5px;
  right: auto;
  background-image: linear-gradient(to left, color-mix(in srgb, var(--kendo-color-primary, #ff6358) 25%, transparent), transparent 100%);
}

.k-calendar .k-range-split-end::after {
  right: -5px;
  left: auto;
  background-image: linear-gradient(to right, color-mix(in srgb, var(--kendo-color-primary, #ff6358) 25%, transparent), transparent 100%);
}

.k-align-items-normal {
  align-items: normal;
}

.\!k-align-items-normal {
  align-items: normal !important;
}

.k-align-items-stretch {
  align-items: stretch;
}

.\!k-align-items-stretch {
  align-items: stretch !important;
}

.k-align-items-center {
  align-items: center;
}

.\!k-align-items-center {
  align-items: center !important;
}

.k-align-items-start {
  align-items: start;
}

.\!k-align-items-start {
  align-items: start !important;
}

.k-align-items-end {
  align-items: end;
}

.\!k-align-items-end {
  align-items: end !important;
}

.k-align-items-flex-start {
  align-items: flex-start;
}

.\!k-align-items-flex-start {
  align-items: flex-start !important;
}

.k-align-items-flex-end {
  align-items: flex-end;
}

.\!k-align-items-flex-end {
  align-items: flex-end !important;
}

.k-align-items-baseline {
  align-items: baseline;
}

.\!k-align-items-baseline {
  align-items: baseline !important;
}

.k-align-items-first-baseline {
  align-items: first baseline;
}

.\!k-align-items-first-baseline {
  align-items: first baseline !important;
}

.k-align-items-last-baseline {
  align-items: last baseline;
}

.\!k-align-items-last-baseline {
  align-items: last baseline !important;
}

.k-align-items-self-start {
  align-items: self-start;
}

.\!k-align-items-self-start {
  align-items: self-start !important;
}

.k-align-items-self-end {
  align-items: self-end;
}

.\!k-align-items-self-end {
  align-items: self-end !important;
}

.k-justify-content-normal {
  justify-content: normal;
}

.\!k-justify-content-normal {
  justify-content: normal !important;
}

.k-justify-content-stretch {
  justify-content: stretch;
}

.\!k-justify-content-stretch {
  justify-content: stretch !important;
}

.k-justify-content-center {
  justify-content: center;
}

.\!k-justify-content-center {
  justify-content: center !important;
}

.k-justify-content-start {
  justify-content: start;
}

.\!k-justify-content-start {
  justify-content: start !important;
}

.k-justify-content-end {
  justify-content: end;
}

.\!k-justify-content-end {
  justify-content: end !important;
}

.k-justify-content-flex-start {
  justify-content: flex-start;
}

.\!k-justify-content-flex-start {
  justify-content: flex-start !important;
}

.k-justify-content-flex-end {
  justify-content: flex-end;
}

.\!k-justify-content-flex-end {
  justify-content: flex-end !important;
}

.k-justify-content-left {
  justify-content: left;
}

.\!k-justify-content-left {
  justify-content: left !important;
}

.k-justify-content-right {
  justify-content: right;
}

.\!k-justify-content-right {
  justify-content: right !important;
}

.k-justify-content-baseline {
  justify-content: baseline;
}

.\!k-justify-content-baseline {
  justify-content: baseline !important;
}

.k-justify-content-first-baseline {
  justify-content: first baseline;
}

.\!k-justify-content-first-baseline {
  justify-content: first baseline !important;
}

.k-justify-content-last-baseline {
  justify-content: last baseline;
}

.\!k-justify-content-last-baseline {
  justify-content: last baseline !important;
}

.k-justify-content-between {
  justify-content: space-between;
}

.\!k-justify-content-between {
  justify-content: space-between !important;
}

.k-justify-content-around {
  justify-content: space-around;
}

.\!k-justify-content-around {
  justify-content: space-around !important;
}

.k-justify-content-evenly {
  justify-content: space-evenly;
}

.\!k-justify-content-evenly {
  justify-content: space-evenly !important;
}

.k-justify-content-stretch > * {
  flex: 1 0 0%;
}

.\!.k-justify-content-stretch > * {
  flex: 1 0 0% !important;
}

.k-pointer-events-none {
  pointer-events: none;
}

.\!k-pointer-events-none {
  pointer-events: none !important;
}

.k-pointer-events-auto {
  pointer-events: auto;
}

.\!k-pointer-events-auto {
  pointer-events: auto !important;
}

.k-actions, .k-form-buttons, .k-edit-buttons,
.k-action-buttons,
.k-columnmenu-actions {
  padding-block: var(--kendo-spacing-2, 0.5rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
  box-sizing: border-box;
  border-width: 0px 0 0 0;
  border-style: solid;
  border-color: inherit;
  flex-shrink: 0;
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  gap: var(--kendo-spacing-2, 0.5rem);
  overflow: hidden;
  clear: both;
}

.k-actions *, .k-form-buttons *, .k-edit-buttons *,
.k-action-buttons *,
.k-columnmenu-actions *,
.k-actions *::before,
.k-form-buttons *::before,
.k-edit-buttons *::before,
.k-action-buttons *::before,
.k-columnmenu-actions *::before,
.k-actions *::after,
.k-form-buttons *::after,
.k-edit-buttons *::after,
.k-action-buttons *::after,
.k-columnmenu-actions *::after {
  box-sizing: border-box;
}

.k-popup .k-actions, .k-popup .k-form-buttons, .k-popup .k-edit-buttons,
.k-popup .k-action-buttons,
.k-popup .k-columnmenu-actions {
  margin-top: var(--kendo-spacing-4, 1rem);
}

.k-actions-start {
  justify-content: flex-start;
}

.k-actions-center {
  justify-content: center;
}

.k-actions-end {
  justify-content: flex-end;
}

.k-actions-stretched > * {
  flex: 1 0 0%;
}

.k-actions-horizontal {
  width: 100%;
  flex-flow: row nowrap;
}

.k-actions-vertical {
  flex-flow: column nowrap;
}

.k-timeselector {
  border-width: 1px;
  border-style: solid;
  box-sizing: border-box;
  outline: 0;
  font-family: var(--kendo-font-family, inherit);
  font-size: var(--kendo-font-size, inherit);
  line-height: var(--kendo-line-height, normal);
  position: relative;
  overflow: hidden;
  display: flex;
  flex-flow: column nowrap;
  -webkit-user-select: none;
          user-select: none;
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.k-popup > .k-timeselector {
  border-width: 0;
}

.k-time-header,
.k-time-selector-header {
  padding-block: var(--kendo-spacing-2, 0.5rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex: 0 0 auto;
}

.k-time-header .k-title,
.k-time-header .k-time-selector-header-title,
.k-time-selector-header .k-title,
.k-time-selector-header .k-time-selector-header-title {
  padding-block: var(--kendo-spacing-1, 0.25rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
  font-weight: bold;
  display: inline-block;
}

.k-time-header .k-time-now,
.k-time-selector-header .k-time-now {
  border-width: 0;
  line-height: inherit;
  cursor: pointer;
}

.k-actions.k-time-fast-selection, .k-time-fast-selection.k-form-buttons, .k-time-fast-selection.k-edit-buttons,
.k-time-fast-selection.k-action-buttons,
.k-time-fast-selection.k-columnmenu-actions {
  margin-top: 0;
}

.k-time-list-container {
  display: flex;
  position: relative;
  flex: 1 1 auto;
  overflow: hidden;
}

.k-time-highlight,
.k-time-list-highlight {
  width: 100%;
  height: calc(var(--kendo-font-size, inherit) * var(--kendo-line-height, normal) + var(--kendo-spacing-1, 0.25rem) * 2);
  border-width: 1px 0px;
  border-style: solid;
  box-sizing: border-box;
  position: absolute;
  top: calc(50% + calc((var(--kendo-font-size-sm, inherit)) * (var(--kendo-line-height-lg, normal))) / 2);
  left: 0;
  right: 0;
  transform: translateY(-50%);
  z-index: 1;
}

.k-time-list-wrapper {
  min-width: 4em;
  height: 240px;
  box-sizing: content-box;
  display: inline-flex;
  flex-flow: column nowrap;
  align-items: stretch;
  overflow: hidden;
  position: relative;
  text-align: center;
  flex: 1 1 auto;
}

.k-time-list-wrapper .k-title {
  font-size: var(--kendo-font-size-sm, inherit);
  line-height: var(--kendo-line-height-lg, normal);
  font-weight: bold;
  text-align: center;
  text-transform: capitalize;
  display: block;
}

.k-time-list-wrapper.k-focus::before, .k-time-list-wrapper.k-focus::after {
  display: block;
  content: "​";
  position: absolute;
  width: 100%;
  left: 0;
  pointer-events: none;
  height: calc(50% - calc(var(--kendo-font-size, inherit) * var(--kendo-line-height, normal) + var(--kendo-spacing-1, 0.25rem) * 2) / 2);
  box-sizing: border-box;
  border-width: 0;
  border-style: solid;
}

.k-time-list-wrapper.k-focus::before {
  top: calc((var(--kendo-font-size-sm, inherit)) * (var(--kendo-line-height-lg, normal)));
}

.k-time-list-wrapper.k-focus::after {
  bottom: 0;
}

.k-time-list {
  display: flex;
  flex-flow: row nowrap;
  align-items: stretch;
  flex: 1;
  position: relative;
  z-index: 1;
  outline: 0;
  overflow: hidden;
}

.k-time-list::before, .k-time-list::after {
  display: block;
  position: absolute;
  content: "​";
  height: 0;
  line-height: 0;
  z-index: 1;
  width: 200%;
  left: -50%;
}

.k-time-list::before {
  top: 0;
}

.k-time-list::after {
  bottom: 0;
}

.k-time-container,
.k-time-list-content {
  position: relative;
  flex: 1 1 auto;
  display: block;
  overflow-x: hidden;
  overflow-y: scroll;
  padding-right: 100px;
  padding-left: 100px;
  margin-left: -100px;
  margin-right: calc(-100px - var(--kendo-scrollbar-width, 17px));
}

.k-time-container > ul,
.k-time-list-content > ul {
  height: auto;
  width: 4em;
  margin: auto;
}

.k-time-container .k-scrollable-placeholder,
.k-time-list-content .k-scrollable-placeholder {
  position: absolute;
  width: 1px;
  top: 0;
  right: 0;
}

.k-time-list-item,
.k-time-list .k-item {
  padding-block: var(--kendo-spacing-1, 0.25rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
}

.k-time-separator {
  width: 0;
  height: calc(var(--kendo-font-size, inherit) * var(--kendo-line-height, normal) + var(--kendo-spacing-1, 0.25rem) * 2);
  align-self: center;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  position: relative;
  z-index: 11;
  top: calc(calc((var(--kendo-font-size-sm, inherit)) * (var(--kendo-line-height-lg, normal))) / 2);
}

.k-timeselector-sm {
  font-size: var(--kendo-font-size, inherit);
  line-height: var(--kendo-line-height, normal);
}

.k-timeselector-sm .k-time-highlight,
.k-timeselector-sm .k-time-list-highlight {
  height: calc(var(--kendo-font-size, inherit) * var(--kendo-line-height, normal) + var(--kendo-spacing-0\.5, 0.125rem) * 2);
}

.k-timeselector-sm .k-time-separator {
  height: calc(var(--kendo-font-size, inherit) * var(--kendo-line-height, normal) + var(--kendo-spacing-0\.5, 0.125rem) * 2);
}

.k-timeselector-sm .k-time-list-item,
.k-timeselector-sm .k-time-list .k-item {
  padding-block: var(--kendo-spacing-0\.5, 0.125rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
}

.k-timeselector-md {
  font-size: var(--kendo-font-size, inherit);
  line-height: var(--kendo-line-height, normal);
}

.k-timeselector-md .k-time-highlight,
.k-timeselector-md .k-time-list-highlight {
  height: calc(var(--kendo-font-size, inherit) * var(--kendo-line-height, normal) + var(--kendo-spacing-1, 0.25rem) * 2);
}

.k-timeselector-md .k-time-separator {
  height: calc(var(--kendo-font-size, inherit) * var(--kendo-line-height, normal) + var(--kendo-spacing-1, 0.25rem) * 2);
}

.k-timeselector-md .k-time-list-item,
.k-timeselector-md .k-time-list .k-item {
  padding-block: var(--kendo-spacing-1, 0.25rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
}

.k-timeselector-lg {
  font-size: var(--kendo-font-size-lg, inherit);
  line-height: var(--kendo-line-height-lg, normal);
}

.k-timeselector-lg .k-time-highlight,
.k-timeselector-lg .k-time-list-highlight {
  height: calc(var(--kendo-font-size-lg, inherit) * var(--kendo-line-height-lg, normal) + var(--kendo-spacing-2, 0.5rem) * 2);
}

.k-timeselector-lg .k-time-separator {
  height: calc(var(--kendo-font-size-lg, inherit) * var(--kendo-line-height-lg, normal) + var(--kendo-spacing-2, 0.5rem) * 2);
}

.k-timeselector-lg .k-time-list-item,
.k-timeselector-lg .k-time-list .k-item {
  padding-block: var(--kendo-spacing-2, 0.5rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
}

.k-rtl .k-time-container,
.k-rtl .k-time-list-content,
[dir=rtl] .k-time-container,
[dir=rtl] .k-time-list-content {
  padding-right: 100px;
  padding-left: 100px;
  margin-left: calc(-100px - var(--kendo-scrollbar-width, 17px));
  margin-right: -100px;
}

.k-timeselector {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
  color: var(--kendo-color-on-app-surface, #3d3d3d);
  background-color: var(--kendo-color-surface-alt, #ffffff);
}

.k-time-header .k-time-now,
.k-time-selector-header .k-time-now {
  color: var(--kendo-color-primary, #ff6358);
}

.k-time-header .k-time-now:hover,
.k-time-selector-header .k-time-now:hover {
  color: var(--kendo-color-primary-hover, #ea5a51);
}

.k-time-list-wrapper .k-title {
  color: var(--kendo-color-subtle, #666666);
}

.k-time-list-wrapper.k-focus .k-title {
  color: var(--kendo-color-on-app-surface, #3d3d3d);
}

.k-time-list-wrapper.k-focus::before, .k-time-list-wrapper.k-focus::after {
  background-color: rgba(0, 0, 0, 0.04);
}

.k-time-list::before, .k-time-list::after {
  box-shadow: 0 0 3em 1.5em var(--kendo-color-surface-alt, #ffffff);
}

.k-time-list .k-item:hover {
  color: var(--kendo-color-primary, #ff6358);
}

.k-time-container {
  background: transparent;
}

.k-time-highlight {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
  background-color: var(--kendo-color-surface-alt, #ffffff);
}

.k-datetime-selector {
  display: flex;
  transition: transform 0.2s;
}

.k-datetime-wrap {
  width: calc(32px * 8 + var(--kendo-spacing-4, 1rem) * 2);
  overflow: hidden;
}

.k-datetime-wrap .k-datetime-buttongroup {
  padding-block: var(--kendo-spacing-2, 0.5rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
}

.k-datetime-wrap .k-calendar,
.k-datetime-wrap .k-timeselector {
  width: 100%;
  border-width: 0;
}

.k-datetime-calendar-wrap,
.k-datetime-time-wrap {
  text-align: center;
  flex: 0 0 calc(32px * 8 + var(--kendo-spacing-4, 1rem) * 2);
}

.k-date-tab .k-datetime-selector {
  transform: translateX(0);
}

.k-time-tab .k-datetime-selector {
  transform: translateX(-100%);
}

:is(.k-rtl, [dir=rtl]) .k-time-tab .k-datetime-selector,
.k-time-tab .k-datetime-selector:is(.k-rtl, [dir=rtl]) {
  transform: translateX(100%);
}

.k-floating-label-container {
  padding-top: calc(var(--kendo-line-height, normal) * var(--kendo-font-size, inherit));
  box-sizing: border-box;
  display: inline-flex;
  vertical-align: middle;
  position: relative;
  flex-direction: column;
  justify-content: stretch;
}

.k-floating-label-container *,
.k-floating-label-container *::before,
.k-floating-label-container *::after {
  box-sizing: border-box;
}

.k-floating-label-container > .k-floating-label {
  max-width: 90%;
  font-size: var(--kendo-font-size, inherit);
  line-height: var(--kendo-line-height, normal);
  white-space: nowrap;
  text-overflow: ellipsis;
  position: absolute;
  top: var(--kendo-floating-label-offset-y, calc(calc(var(--kendo-line-height, normal) * var(--kendo-font-size, inherit)) + 1px + var(--kendo-spacing-1, 0.25rem)));
  left: var(--kendo-floating-label-offset-x, calc(var(--kendo-spacing-2, 0.5rem) + 1px));
  overflow: hidden;
  cursor: text;
  transform-origin: left center;
  transition: transform 0.2s ease-out, color 0.2s ease-out, top 0.2s ease-out, left 0.2s ease-out;
}

.k-floating-label-container.k-empty > .k-floating-label {
  top: var(--kendo-floating-label-offset-y, calc(calc(var(--kendo-line-height, normal) * var(--kendo-font-size, inherit)) + 1px + var(--kendo-spacing-1, 0.25rem)));
  left: var(--kendo-floating-label-offset-x, calc(var(--kendo-spacing-2, 0.5rem) + 1px));
  transform: scale(1);
  pointer-events: none;
}

.k-floating-label-container > .k-floating-label, .k-floating-label-container.k-focus > .k-floating-label {
  top: var(--kendo-floating-label-focus-offset-y, 0);
  left: var(--kendo-floating-label-focus-offset-x, 0);
  transform: scale(1);
}

.k-floating-label-container:focus-within > .k-floating-label {
  top: var(--kendo-floating-label-focus-offset-y, 0);
  left: var(--kendo-floating-label-focus-offset-x, 0);
  transform: scale(1);
}

.k-floating-label-container.k-empty:not(.k-focus):not(:focus-within) ::placeholder {
  color: transparent;
}

[dir=rtl] .k-floating-label-container > .k-floating-label,
.k-rtl .k-floating-label-container > .k-floating-label,
.k-floating-label-container[dir=rtl] > .k-floating-label {
  transform-origin: right center;
  transition: transform 0.2s ease-out, color 0.2s ease-out, top 0.2s ease-out, right 0.2s ease-out;
}

[dir=rtl] .k-floating-label-container.k-empty > .k-floating-label,
.k-rtl .k-floating-label-container.k-empty > .k-floating-label,
.k-floating-label-container[dir=rtl].k-empty > .k-floating-label {
  left: auto;
  right: var(--kendo-floating-label-offset-x, calc(var(--kendo-spacing-2, 0.5rem) + 1px));
}

[dir=rtl] .k-floating-label-container > .k-floating-label, [dir=rtl] .k-floating-label-container.k-focus > .k-floating-label,
.k-rtl .k-floating-label-container > .k-floating-label,
.k-rtl .k-floating-label-container.k-focus > .k-floating-label,
.k-floating-label-container[dir=rtl] > .k-floating-label,
.k-floating-label-container[dir=rtl].k-focus > .k-floating-label {
  left: auto;
  right: var(--kendo-floating-label-focus-offset-x, 0);
}

[dir=rtl] .k-floating-label-container:focus-within > .k-floating-label,
.k-rtl .k-floating-label-container:focus-within > .k-floating-label,
.k-floating-label-container[dir=rtl]:focus-within > .k-floating-label {
  left: auto;
  right: var(--kendo-floating-label-focus-offset-x, 0);
}

.k-floating-label-container.k-invalid > .k-floating-label, .k-floating-label-container.ng-invalid.ng-touched > .k-floating-label, .k-floating-label-container.ng-invalid.ng-dirty > .k-floating-label {
  color: var(--kendo-color-error, #f31700);
}

.k-daterange-picker, .k-daterangepicker {
  width: 100%;
  display: flex;
  flex-flow: row nowrap;
  align-items: flex-end;
  gap: var(--kendo-spacing-2, 0.5rem);
}

.k-daterange-picker *, .k-daterangepicker *,
.k-daterange-picker *::before,
.k-daterangepicker *::before,
.k-daterange-picker *::after,
.k-daterangepicker *::after {
  box-sizing: border-box;
}

.k-daterange-picker .k-dateinput, .k-daterangepicker .k-dateinput {
  width: 10em;
}

.k-daterangepicker-wrap {
  display: inherit;
  flex-flow: inherit;
  align-items: inherit;
  gap: inherit;
}

.k-color-preview {
  width: 100%;
  height: 100%;
  border-width: 1px;
  border-radius: var(--kendo-border-radius-md, 0.25rem);
  box-sizing: border-box;
  border-style: solid;
  display: inline-flex;
  flex-flow: row nowrap;
  position: relative;
  overflow: hidden;
}

.k-color-preview *,
.k-color-preview *::before,
.k-color-preview *::after {
  box-sizing: border-box;
}

.k-coloreditor-current-color {
  cursor: pointer;
}

.k-icon-color-preview {
  border-width: 0;
  border-radius: 0;
  display: flex;
  flex-flow: column nowrap;
  align-items: center;
  justify-content: center;
  gap: 2px;
}

.k-icon-color-preview .k-color-preview-mask {
  width: calc(16px - 2px);
  height: 2px;
}

.k-color-preview-mask {
  width: 100%;
  height: 100%;
  position: relative;
}

.k-color-preview-mask::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAuSURBVHgBxYyxDQAwDMJIL+YT+DjtzFRliUfLcklqBCRT4eCTxbD6kdL2/LgYXqpvCbs3kBv/AAAAAElFTkSuQmCC");
  background-size: contain;
  background-position: 0 0;
}

.k-no-color .k-color-preview-mask::before {
  content: "";
  background-color: #ffffff;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' version='1.1'%3e%3cline x1='0' x2='20' y1='0' y2='20' stroke='var%28--kendo-color-error, %23f31700%29' stroke-width='1'/%3e%3c/svg%3e");
  background-size: 100% 100%;
  background-position: 0 0;
}

.k-color-preview {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
}

.k-color-preview:hover, .k-color-preview.k-hover {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
}

.k-colorpalette {
  border-width: 0;
  box-sizing: border-box;
  outline: 0;
  font-size: var(--kendo-font-size, inherit);
  font-family: var(--kendo-font-family, inherit);
  line-height: 0;
  display: inline-flex;
  position: relative;
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.k-colorpalette *,
.k-colorpalette *::before,
.k-colorpalette *::after {
  box-sizing: border-box;
}

.k-colorpalette-table {
  width: 100%;
  height: 100%;
  border-collapse: collapse;
  position: relative;
}

.k-colorpalette-tile {
  width: var(--kendo-spacing-6, 1.5rem);
  height: var(--kendo-spacing-6, 1.5rem);
  box-sizing: border-box;
  overflow: hidden;
  cursor: pointer;
}

.k-colorpalette-tile:hover, .k-colorpalette-tile.k-hover {
  position: relative;
  z-index: 101;
}

.k-colorpalette-tile:focus, .k-colorpalette-tile.k-focus, .k-colorpalette-tile.k-selected, .k-colorpalette-tile.k-selected:hover {
  position: relative;
  z-index: 100;
}

.k-colorpalette-sm .k-colorpalette-tile {
  width: var(--kendo-spacing-5\.5, 1.375rem);
  height: var(--kendo-spacing-5\.5, 1.375rem);
}

.k-colorpalette-md .k-colorpalette-tile {
  width: var(--kendo-spacing-6, 1.5rem);
  height: var(--kendo-spacing-6, 1.5rem);
}

.k-colorpalette-lg .k-colorpalette-tile {
  width: var(--kendo-spacing-8, 2rem);
  height: var(--kendo-spacing-8, 2rem);
}

.k-colorpalette-tile:focus, .k-colorpalette-tile.k-focus {
  box-shadow: 0 0 3px 1px rgba(0, 0, 0, 0.3), inset 0 0 0 1px rgba(255, 255, 255, 0.5);
}

.k-colorpalette-tile:hover, .k-colorpalette-tile.k-hover {
  box-shadow: 0 0 3px 1px rgba(0, 0, 0, 0.3), inset 0 0 0 1px rgba(255, 255, 255, 0.8);
}

.k-colorpalette-tile.k-selected, .k-colorpalette-tile.k-selected:hover {
  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.3), inset 0 0 0 1px white;
}

.k-tooltip {
  border-radius: var(--kendo-border-radius-md, 0.25rem);
  margin: 0;
  padding-block: var(--kendo-spacing-1, 0.25rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
  border-width: 0px;
  border-style: solid;
  box-sizing: border-box;
  background-repeat: repeat-x;
  outline: 0;
  font-family: var(--kendo-font-family, inherit);
  font-size: var(--kendo-font-size, inherit);
  line-height: var(--kendo-line-height-sm, normal);
  display: flex;
  flex-flow: row nowrap;
  align-items: flex-start;
  position: absolute;
  z-index: 12000;
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.k-tooltip *,
.k-tooltip *::before,
.k-tooltip *::after {
  box-sizing: border-box;
}

.k-tooltip-icon {
  margin-inline-end: var(--kendo-spacing-1, 0.25rem);
  flex-shrink: 0;
}

.k-tooltip-title {
  margin-bottom: 0.25em;
  font-size: calc(var(--kendo-font-size, 0.875rem) * 1.25);
  line-height: var(--kendo-line-height-xs, normal);
}

.k-tooltip-content {
  align-self: stretch;
  flex: 1 1 auto;
  overflow: hidden;
  text-overflow: ellipsis;
}

.k-tooltip-button {
  margin-inline-start: var(--kendo-spacing-1, 0.25rem);
  flex-shrink: 0;
}

.k-tooltip-button .k-icon {
  color: inherit;
  vertical-align: top;
}

.k-callout {
  width: calc(6px * 2);
  height: calc(6px * 2);
  border-width: 6px;
  border-style: solid;
  border-color: transparent;
  position: absolute;
  pointer-events: none;
}

.k-callout-n {
  margin-left: calc(6px * -1);
  border-bottom-color: currentColor;
  top: calc(6px * -1 * 2);
  left: 50%;
  pointer-events: none;
}

.k-callout-e {
  margin-top: calc(6px * -1);
  border-left-color: currentColor;
  top: 50%;
  right: calc(6px * -1 * 2);
  pointer-events: none;
}

.k-callout-s {
  margin-left: calc(6px * -1);
  border-top-color: currentColor;
  bottom: calc(6px * -1 * 2);
  left: 50%;
  pointer-events: none;
}

.k-callout-w {
  margin-top: calc(6px * -1);
  border-right-color: currentColor;
  top: 50%;
  left: calc(6px * -1 * 2);
  pointer-events: none;
}

.k-tooltip {
  border-color: var(--kendo-color-on-app-surface, #3d3d3d);
  color: var(--kendo-color-app-surface, #ffffff);
  background-color: var(--kendo-color-on-app-surface, #3d3d3d);
  box-shadow: var(--kendo-elevation-2, 0 4px 6px rgba(0, 0, 0, 0.06), 0 4px 16px rgba(0, 0, 0, 0.12));
}

.k-tooltip .k-callout {
  color: var(--kendo-color-on-app-surface, #3d3d3d);
}

.k-tooltip-inverse {
  border-color: var(--kendo-color-dark, #3d3d3d);
  color: var(--kendo-color-on-inverse, #ffffff);
  background-color: var(--kendo-color-dark, #3d3d3d);
}

.k-tooltip-inverse .k-callout {
  color: var(--kendo-color-dark, #3d3d3d);
}

.k-tooltip-light {
  border-color: var(--kendo-color-light, #ebebeb);
  color: var(--kendo-color-on-light, #000000);
  background-color: var(--kendo-color-light, #ebebeb);
}

.k-tooltip-light .k-callout {
  color: var(--kendo-color-light, #ebebeb);
}

.k-tooltip-dark {
  border-color: var(--kendo-color-dark, #3d3d3d);
  color: var(--kendo-color-on-dark, #ffffff);
  background-color: var(--kendo-color-dark, #3d3d3d);
}

.k-tooltip-dark .k-callout {
  color: var(--kendo-color-dark, #3d3d3d);
}

.k-tooltip-error {
  border-color: var(--kendo-color-error, #f31700);
  color: var(--kendo-color-on-error, #ffffff);
  background-color: var(--kendo-color-error, #f31700);
}

.k-tooltip-error .k-callout {
  color: var(--kendo-color-error, #f31700);
}

.k-tooltip-warning {
  border-color: var(--kendo-color-warning, #ffc000);
  color: var(--kendo-color-on-warning, #3d3d3d);
  background-color: var(--kendo-color-warning, #ffc000);
}

.k-tooltip-warning .k-callout {
  color: var(--kendo-color-warning, #ffc000);
}

.k-tooltip-success {
  border-color: var(--kendo-color-success, #37b400);
  color: var(--kendo-color-on-success, #ffffff);
  background-color: var(--kendo-color-success, #37b400);
}

.k-tooltip-success .k-callout {
  color: var(--kendo-color-success, #37b400);
}

.k-tooltip-info {
  border-color: var(--kendo-color-info, #0058e9);
  color: var(--kendo-color-on-info, #ffffff);
  background-color: var(--kendo-color-info, #0058e9);
}

.k-tooltip-info .k-callout {
  color: var(--kendo-color-info, #0058e9);
}

.k-tooltip-tertiary {
  border-color: var(--kendo-color-tertiary, #03a9f4);
  color: var(--kendo-color-on-tertiary, #ffffff);
  background-color: var(--kendo-color-tertiary, #03a9f4);
}

.k-tooltip-tertiary .k-callout {
  color: var(--kendo-color-tertiary, #03a9f4);
}

.k-tooltip-secondary {
  border-color: var(--kendo-color-secondary, #666666);
  color: var(--kendo-color-on-secondary, #ffffff);
  background-color: var(--kendo-color-secondary, #666666);
}

.k-tooltip-secondary .k-callout {
  color: var(--kendo-color-secondary, #666666);
}

.k-tooltip-primary {
  border-color: var(--kendo-color-primary, #ff6358);
  color: var(--kendo-color-on-primary, #ffffff);
  background-color: var(--kendo-color-primary, #ff6358);
}

.k-tooltip-primary .k-callout {
  color: var(--kendo-color-primary, #ff6358);
}

.k-slider {
  border: 0;
  box-sizing: border-box;
  outline: 0;
  font-family: var(--kendo-font-family, inherit);
  font-size: var(--kendo-font-size, inherit);
  line-height: var(--kendo-line-height, normal);
  background: none;
  display: inline-flex;
  align-items: center;
  position: relative;
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.k-slider *,
.k-slider *::before,
.k-slider *::after {
  box-sizing: border-box;
}

.k-slider .k-label {
  width: auto;
  font-size: 0.92em;
  line-height: 1;
  white-space: nowrap;
  position: absolute;
}

.k-slider .k-tick,
.k-slider .k-slider-track {
  cursor: pointer;
}

.k-slider .k-tick {
  background-color: transparent;
  background-position: center center;
  background-repeat: no-repeat;
  margin: 0;
  padding: 0;
  position: relative;
}

.k-slider.k-disabled .k-tick,
.k-slider.k-disabled .k-slider-track,
.k-slider.k-disabled .k-draghandle {
  cursor: default;
}

.k-slider {
  width: min-content;
  height: min-content;
  gap: calc(14px / 2);
}

.k-slider .k-button {
  flex: none;
}

.k-slider .k-slider-track-wrap {
  flex: 1 1 auto;
  display: flex;
  flex-flow: inherit;
  position: relative;
  touch-action: none;
}

.k-slider .k-slider-track-wrap .k-slider-items {
  margin: 0;
  padding: 0;
  list-style: none;
  flex: 1 1 100%;
  display: flex;
  flex-flow: inherit;
  justify-content: space-between;
  -webkit-user-select: none;
          user-select: none;
}

.k-slider .k-slider-track-wrap .k-tick {
  flex: 0 0 1px;
}

.k-slider .k-slider-track-wrap .k-tick-horizontal {
  width: 1px;
  min-height: 100%;
}

.k-slider .k-slider-track-wrap .k-tick-vertical {
  width: 100%;
  min-height: 1px;
}

.k-slider .k-slider-track-wrap .k-draghandle {
  position: absolute;
}

.k-slider-horizontal .k-slider-track-wrap {
  height: 26px;
}

.k-slider-horizontal .k-slider-track-wrap .k-slider-track {
  width: 100%;
}

.k-slider-horizontal .k-slider-track-wrap .k-draghandle {
  top: 50%;
  transform: translate(-50%, -50%);
}

.k-slider-horizontal .k-slider-track-wrap .k-draghandle:focus,
.k-slider-horizontal .k-slider-track-wrap .k-draghandle:active {
  transform: translate(-50%, -50%) scale(1);
}

.k-slider-horizontal .k-slider-track-wrap .k-slider-selection {
  width: calc((var(--kendo-slider-end, 0) - var(--kendo-slider-start, 0)) * 1%);
  inset-inline-start: calc(var(--kendo-slider-start, 0) * 1%);
}

.k-slider-horizontal .k-slider-track-wrap .k-draghandle-start {
  inset-inline-start: calc(var(--kendo-slider-start, 0) * 1%);
}

.k-slider-horizontal .k-slider-track-wrap .k-draghandle-end {
  inset-inline-start: calc(var(--kendo-slider-end, 0) * 1%);
}

.k-slider-vertical .k-slider-track-wrap {
  width: 26px;
}

.k-slider-vertical .k-slider-track-wrap .k-slider-track {
  height: 100%;
}

.k-slider-vertical .k-slider-track-wrap .k-draghandle {
  left: 50%;
  transform: translate(-50%, 50%);
}

.k-slider-vertical .k-slider-track-wrap .k-draghandle:focus,
.k-slider-vertical .k-slider-track-wrap .k-draghandle:active {
  transform: translate(-50%, 50%) scale(1);
}

.k-slider-vertical .k-slider-track-wrap .k-slider-selection {
  bottom: calc(var(--kendo-slider-start, 0) * 1%);
  height: calc((var(--kendo-slider-end, 0) - var(--kendo-slider-start, 0)) * 1%);
}

.k-slider-vertical .k-slider-track-wrap .k-draghandle-start {
  bottom: calc(var(--kendo-slider-start, 0) * 1%);
}

.k-slider-vertical .k-slider-track-wrap .k-draghandle-end {
  bottom: calc(var(--kendo-slider-end, 0) * 1%);
}

.k-slider-vertical {
  height: 200px;
  flex-flow: column-reverse nowrap;
}

.k-slider-vertical .k-tick {
  text-align: end;
  margin-left: 2px;
}

.k-slider-vertical .k-slider-topleft .k-tick {
  text-align: start;
}

.k-slider-vertical .k-tick {
  background-position: -94px center;
}

.k-slider-vertical .k-slider-topleft .k-tick {
  background-position: -124px center;
}

.k-slider-vertical .k-slider-bottomright .k-tick {
  background-position: -154px center;
}

.k-slider-vertical .k-tick-large {
  display: flex;
  align-items: center;
  background-position: -4px center;
}

.k-slider-vertical .k-slider-topleft .k-tick-large {
  background-position: -34px center;
}

.k-slider-vertical .k-slider-bottomright .k-tick-large {
  background-position: -64px center;
}

.k-slider-vertical .k-first {
  background-position: -94px 100%;
}

.k-slider-vertical .k-tick-large.k-first {
  background-position: -4px 100%;
}

.k-slider-vertical .k-slider-topleft .k-first {
  background-position: -124px 100%;
}

.k-slider-vertical .k-slider-topleft .k-tick-large.k-first {
  background-position: -34px 100%;
}

.k-slider-vertical .k-slider-bottomright .k-first {
  background-position: -154px 100%;
}

.k-slider-vertical .k-slider-bottomright .k-tick-large.k-first {
  background-position: -64px 100%;
}

.k-slider-vertical .k-last {
  background-position: -94px 0;
}

.k-slider-vertical .k-tick-large.k-last {
  background-position: -4px 0;
}

.k-slider-vertical .k-slider-topleft .k-last {
  background-position: -124px 0;
}

.k-slider-vertical .k-slider-topleft .k-tick-large.k-last {
  background-position: -34px 0;
}

.k-slider-vertical .k-slider-bottomright .k-last {
  background-position: -154px 0;
}

.k-slider-vertical .k-slider-bottomright .k-tick-large.k-last {
  background-position: -64px 0;
}

.k-slider-vertical .k-label {
  text-align: start;
  inset-inline-start: 120%;
  top: 50%;
  transform: translateY(-50%);
}

.k-slider-vertical .k-first .k-label {
  top: 100%;
}

.k-slider-vertical .k-last .k-label {
  top: 0;
}

.k-slider-vertical .k-slider-topleft .k-label {
  inset-inline-start: auto;
  inset-inline-end: 120%;
}

.k-slider-horizontal {
  width: 200px;
  flex-flow: row nowrap;
}

.k-slider-horizontal .k-tick {
  background-position: center -92px;
}

.k-slider-horizontal .k-slider-topleft .k-tick {
  background-position: center -122px;
}

.k-slider-horizontal .k-slider-bottomright .k-tick {
  background-position: center -152px;
}

.k-slider-horizontal .k-tick-large {
  background-position: center -2px;
}

.k-slider-horizontal .k-slider-topleft .k-tick-large {
  background-position: center -32px;
}

.k-slider-horizontal .k-slider-bottomright .k-tick-large {
  background-position: center -62px;
}

.k-slider-horizontal .k-first {
  background-position: 0 -92px;
}

.k-slider-horizontal .k-tick-large.k-first {
  background-position: 0 -2px;
}

.k-slider-horizontal .k-slider-topleft .k-first {
  background-position: 0 -122px;
}

.k-slider-horizontal .k-slider-topleft .k-tick-large.k-first {
  background-position: 0 -32px;
}

.k-slider-horizontal .k-slider-bottomright .k-first {
  background-position: 0 -152px;
}

.k-slider-horizontal .k-slider-bottomright .k-tick-large.k-first {
  background-position: 0 -62px;
}

.k-slider-horizontal .k-last {
  background-position: 100% -92px;
}

.k-slider-horizontal .k-tick-large.k-last {
  background-position: 100% -2px;
}

.k-slider-horizontal .k-slider-topleft .k-last {
  background-position: 100% -122px;
}

.k-slider-horizontal .k-slider-topleft .k-tick-large.k-last {
  background-position: 100% -32px;
}

.k-slider-horizontal .k-slider-bottomright .k-last {
  background-position: 100% -152px;
}

.k-slider-horizontal .k-slider-bottomright .k-tick-large.k-last {
  background-position: 100% -62px;
}

.k-slider-horizontal .k-label {
  inset-inline-start: 50%;
  bottom: -1.2em;
  transform: translateX(-50%);
}

.k-slider-horizontal .k-first .k-label {
  inset-inline-start: 0;
}

.k-slider-horizontal .k-last .k-label {
  inset-inline-start: 100%;
}

.k-slider-horizontal .k-slider-topleft .k-label {
  top: -1.2em;
}

.k-slider-track,
.k-slider-selection {
  margin: 0;
  padding: 0;
  position: absolute;
}

.k-slider-horizontal :is(.k-slider-track, .k-slider-selection) {
  height: 4px;
  left: 0;
  margin-top: -2px;
  top: 50%;
}

.k-slider-vertical :is(.k-slider-track, .k-slider-selection) {
  bottom: 0;
  left: 50%;
  margin-left: -2px;
  width: 4px;
}

.k-draghandle {
  background-color: transparent;
  background-repeat: no-repeat;
  border-style: solid;
  border-width: 1px;
  outline: 0;
  position: absolute;
  text-align: center;
  text-decoration: none;
  width: 14px;
  height: 14px;
}

.k-draghandle.k-pressed {
  transition: none;
}

.k-slider-selection.k-pressed {
  transition: none;
}

.k-slider-transitions.k-slider-horizontal .k-draghandle {
  transition: inset-inline-start 0.3s ease-out, background-color 0.3s ease-out, transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
}

.k-slider-transitions.k-slider-horizontal .k-slider-selection {
  transition: width 0.3s ease-out;
}

.k-slider-transitions.k-slider-vertical .k-draghandle {
  transition: bottom 0.3s ease-out, background-color 0.3s ease-out, transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
}

.k-slider-transitions.k-slider-vertical .k-slider-selection {
  transition: height 0.3s ease-out;
}

.k-slider.k-readonly .k-button,
.k-slider.k-readonly .k-slider-track,
.k-slider.k-readonly .k-tick,
.k-slider.k-readonly .k-draghandle {
  pointer-events: none;
}

.k-slider-tooltip .k-callout-n,
.k-slider-tooltip .k-callout-s {
  margin-inline-start: -6px / 2;
}

.k-slider-tooltip .k-callout-w,
.k-slider-tooltip .k-callout-e {
  margin-top: -6px / 2;
}

.k-slider-rtl.k-slider-horizontal .k-draghandle, .k-slider-horizontal.k-slider[dir=rtl] .k-draghandle,
[dir=rtl] .k-slider-horizontal.k-slider .k-draghandle,
.k-slider-horizontal.k-slider.k-rtl .k-draghandle,
.k-rtl .k-slider-horizontal.k-slider .k-draghandle {
  transform: translate(50%, -50%);
}

.k-slider-rtl.k-slider-horizontal .k-draghandle:focus, .k-slider-horizontal.k-slider[dir=rtl] .k-draghandle:focus,
[dir=rtl] .k-slider-horizontal.k-slider .k-draghandle:focus,
.k-slider-horizontal.k-slider.k-rtl .k-draghandle:focus,
.k-rtl .k-slider-horizontal.k-slider .k-draghandle:focus,
.k-slider-rtl.k-slider-horizontal .k-draghandle:active,
.k-slider-horizontal.k-slider[dir=rtl] .k-draghandle:active,
[dir=rtl] .k-slider-horizontal.k-slider .k-draghandle:active,
.k-slider-horizontal.k-slider.k-rtl .k-draghandle:active,
.k-rtl .k-slider-horizontal.k-slider .k-draghandle:active {
  transform: translate(50%, -50%) scale(1);
}

.k-slider-rtl.k-slider-horizontal .k-label, .k-slider-horizontal.k-slider[dir=rtl] .k-label,
[dir=rtl] .k-slider-horizontal.k-slider .k-label,
.k-slider-horizontal.k-slider.k-rtl .k-label,
.k-rtl .k-slider-horizontal.k-slider .k-label {
  transform: translateX(50%);
}

.k-slider kendo-resize-sensor {
  position: absolute;
}

.k-slider {
  color: var(--kendo-color-on-app-surface, #3d3d3d);
}

.k-slider .k-slider-track,
.k-slider .k-slider-selection {
  border-radius: var(--kendo-border-radius-md, 0.25rem);
}

.k-slider .k-slider-track {
  background-color: var(--kendo-color-base-emphasis, #c2c2c2);
}

.k-slider .k-slider-selection {
  background-color: var(--kendo-color-primary, #ff6358);
}

.k-slider .k-draghandle {
  border-color: var(--kendo-color-primary, #ff6358);
  color: var(--kendo-color-on-primary, #ffffff);
  background-color: var(--kendo-color-primary, #ff6358);
  border-radius: 50%;
}

.k-slider .k-draghandle:hover, .k-slider .k-draghandle.k-hover {
  border-color: var(--kendo-color-primary, #ff6358);
  background-color: var(--kendo-color-primary-hover, #ea5a51);
}

.k-slider .k-draghandle:active, .k-slider .k-draghandle.k-active, .k-slider .k-draghandle.k-pressed {
  border-color: var(--kendo-color-primary-active, #d45349);
  background-color: var(--kendo-color-primary-active, #d45349);
}

.k-slider .k-draghandle:focus, .k-slider .k-draghandle.k-focus {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--kendo-color-primary, #ff6358) 30%, transparent);
}

.k-slider.k-focus .k-draghandle {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--kendo-color-primary, #ff6358) 30%, transparent);
}

.k-slider-horizontal .k-tick {
  background-image: url(data:image/gif;base64,R0lGODlhAQC0AIABALi4uAAAACH5BAEAAAEALAAAAAABALQAAAIWjIGJxqzazlux2ovlzND2rAHgSIZWAQA7);
}

.k-slider-vertical .k-tick {
  background-image: url(data:image/gif;base64,R0lGODlhtAABAIABALi4uAAAACH5BAEAAAEALAAAAAC0AAEAAAIWjIGJxqzazlux2ovlzND2rAHgSIZWAQA7);
}

.k-colorgradient {
  border-radius: var(--kendo-border-radius-md, 0.25rem);
  width: 272px;
  padding-block: var(--kendo-spacing-3, 0.75rem);
  padding-inline: var(--kendo-spacing-3, 0.75rem);
  border-style: solid;
  border-width: 1px;
  box-sizing: border-box;
  outline: 0;
  font-size: var(--kendo-font-size, inherit);
  font-family: var(--kendo-font-family, inherit);
  line-height: var(--kendo-line-height, normal);
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--kendo-spacing-3, 0.75rem);
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.k-colorgradient *,
.k-colorgradient *::before,
.k-colorgradient *::after {
  box-sizing: border-box;
}

.k-colorgradient-canvas {
  gap: var(--kendo-spacing-3, 0.75rem);
}

.k-colorgradient-canvas .k-hsv-rectangle {
  border-radius: var(--kendo-border-radius-md, 0.25rem);
  position: relative;
  flex: 1 1 auto;
  -webkit-user-select: none;
          user-select: none;
}

.k-colorgradient-canvas .k-hsv-gradient {
  border-radius: var(--kendo-border-radius-md, 0.25rem);
  height: 180px;
}

.k-colorgradient-canvas .k-hsv-draghandle {
  margin-top: -7px;
  margin-left: -7px;
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 1;
  cursor: pointer;
}

.k-colorgradient-canvas .k-hsv-controls {
  position: relative;
  flex-shrink: 0;
  gap: var(--kendo-spacing-3, 0.75rem);
}

.k-colorgradient-canvas.k-vstack, .k-colorgradient-canvas.k-vbox {
  padding-inline: 8px;
}

.k-colorgradient .k-draghandle {
  border-radius: 50%;
  width: 14px;
  height: 14px;
  border-width: 1px;
  border-style: solid;
  outline-width: 1px;
  outline-style: solid;
  box-sizing: border-box;
}

.k-colorgradient-slider.k-slider-vertical {
  width: 10px;
  height: 180px;
  flex: 0 0 10px;
}

.k-colorgradient-slider.k-slider-vertical .k-slider-track {
  width: 10px;
  border-radius: 10px;
  margin-left: -5px;
}

.k-colorgradient-slider.k-slider-horizontal {
  width: 100%;
  height: 10px;
  flex: 0 0 10px;
}

.k-colorgradient-slider.k-slider-horizontal .k-slider-track {
  height: 10px;
  border-radius: 10px;
  margin-top: -5px;
}

.k-colorgradient-slider.k-alpha-slider .k-slider-track::before {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  border-radius: 10px;
  position: relative;
  z-index: -1;
}

.k-colorgradient-slider .k-slider-track-wrap {
  z-index: 1;
}

.k-colorgradient-slider .k-slider-selection {
  display: none;
}

.k-colorgradient-slider .k-draghandle {
  border-width: 3px;
}

.k-colorgradient-sm {
  width: 252px;
  gap: var(--kendo-spacing-3, 0.75rem);
  padding-block: var(--kendo-spacing-3, 0.75rem);
  padding-inline: var(--kendo-spacing-3, 0.75rem);
}

.k-colorgradient-sm .k-colorgradient-inputs .k-numerictextbox {
  width: 42px;
}

.k-colorgradient-sm .k-colorgradient-canvas {
  gap: var(--kendo-spacing-3, 0.75rem);
}

.k-colorgradient-sm .k-colorgradient-canvas .k-hsv-gradient {
  height: 180px;
}

.k-colorgradient-sm .k-colorgradient-canvas .k-slider-vertical {
  height: 180px;
}

.k-colorgradient-sm .k-colorgradient-canvas .k-hsv-controls {
  gap: var(--kendo-spacing-3, 0.75rem);
}

.k-colorgradient-md {
  width: 272px;
  gap: var(--kendo-spacing-3, 0.75rem);
  padding-block: var(--kendo-spacing-3, 0.75rem);
  padding-inline: var(--kendo-spacing-3, 0.75rem);
}

.k-colorgradient-md .k-colorgradient-inputs .k-numerictextbox {
  width: 46px;
}

.k-colorgradient-md .k-colorgradient-canvas {
  gap: var(--kendo-spacing-3, 0.75rem);
}

.k-colorgradient-md .k-colorgradient-canvas .k-hsv-gradient {
  height: 180px;
}

.k-colorgradient-md .k-colorgradient-canvas .k-slider-vertical {
  height: 180px;
}

.k-colorgradient-md .k-colorgradient-canvas .k-hsv-controls {
  gap: var(--kendo-spacing-3, 0.75rem);
}

.k-colorgradient-lg {
  width: 362px;
  gap: var(--kendo-spacing-4\.5, 1.125rem);
  padding-block: var(--kendo-spacing-4\.5, 1.125rem);
  padding-inline: var(--kendo-spacing-4\.5, 1.125rem);
}

.k-colorgradient-lg .k-colorgradient-inputs .k-numerictextbox {
  width: 62px;
}

.k-colorgradient-lg .k-colorgradient-canvas {
  gap: var(--kendo-spacing-4\.5, 1.125rem);
}

.k-colorgradient-lg .k-colorgradient-canvas .k-hsv-gradient {
  height: 268px;
}

.k-colorgradient-lg .k-colorgradient-canvas .k-slider-vertical {
  height: 268px;
}

.k-colorgradient-lg .k-colorgradient-canvas .k-hsv-controls {
  gap: var(--kendo-spacing-4\.5, 1.125rem);
}

.k-colorgradient-inputs {
  gap: var(--kendo-spacing-2, 0.5rem);
}

.k-colorgradient-inputs .k-colorgradient-input-label {
  text-transform: uppercase;
}

.k-colorgradient-inputs > .k-vstack, .k-colorgradient-inputs > .k-vbox {
  gap: calc(var(--kendo-spacing-3, 0.75rem) / 3);
}

.k-colorgradient-inputs .k-numerictextbox {
  width: 46px;
}

.k-colorgradient-inputs .k-input-inner {
  padding-inline-start: 2px;
  padding-inline-end: 2px;
  text-align: center;
  text-overflow: clip;
}

.k-colorgradient-color-contrast > div {
  display: flex;
  flex-flow: row nowrap;
  gap: calc(var(--kendo-spacing-3, 0.75rem) / 1.5);
}

.k-colorgradient-color-contrast .k-contrast-ratio {
  margin-bottom: calc(var(--kendo-spacing-3, 0.75rem) / 1.5);
}

.k-colorgradient-color-contrast .k-contrast-ratio-text {
  font-weight: var(--kendo-font-weight-bold, normal);
}

.k-colorgradient-color-contrast .k-contrast-validation {
  display: inline-flex;
  align-items: center;
  gap: calc(calc(var(--kendo-spacing-3, 0.75rem) / 1.5) / 2);
}

.k-colorgradient-color-contrast .k-contrast-validation .k-icon {
  vertical-align: middle;
}

.k-colorgradient-color-contrast .k-contrast-validation .k-icon + .k-icon,
.k-colorgradient-color-contrast .k-contrast-validation .k-icon-wrapper-host + .k-icon-wrapper-host .k-icon {
  margin-inline-start: -13px;
}

.k-color-contrast-svg {
  position: absolute;
  top: 0;
  left: 0;
  overflow: visible;
  pointer-events: none;
}

.k-colorgradient {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
  color: var(--kendo-color-on-app-surface, #3d3d3d);
  background-color: var(--kendo-color-surface-alt, #ffffff);
}

.k-colorgradient:focus,
.k-colorgradient.k-focus {
  box-shadow: var(--kendo-elevation-3, 0 6px 8px rgba(0, 0, 0, 0.08), 0 4px 16px rgba(0, 0, 0, 0.12));
}

.k-colorgradient-canvas .k-hsv-gradient {
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0), black), linear-gradient(to right, white, rgba(255, 255, 255, 0));
}

.k-colorgradient .k-draghandle {
  border-color: rgba(255, 255, 255, 0.8);
  background-color: transparent;
  outline-color: #000000;
  box-shadow: var(--kendo-elevation-2, 0 4px 6px rgba(0, 0, 0, 0.06), 0 4px 16px rgba(0, 0, 0, 0.12));
}

.k-colorgradient .k-draghandle:focus, .k-colorgradient .k-draghandle.k-focus {
  border-color: #ffffff;
  background-color: transparent;
  outline-color: #000000;
  box-shadow: var(--kendo-elevation-2, 0 4px 6px rgba(0, 0, 0, 0.06), 0 4px 16px rgba(0, 0, 0, 0.12));
}

.k-colorgradient .k-draghandle:hover, .k-colorgradient .k-draghandle.k-hover, .k-colorgradient .k-draghandle.k-active, .k-colorgradient .k-draghandle:active {
  border-color: #ffffff;
  background-color: transparent;
  outline-color: #000000;
}

.k-colorgradient-slider.k-hue-slider.k-slider-horizontal .k-slider-track {
  background: linear-gradient(to right, #ff0000, #ffff00, #00ff00, #00ffff, #0000ff, #ff00ff, #ff0000);
}

.k-colorgradient-slider.k-hue-slider.k-slider-vertical .k-slider-track {
  background: linear-gradient(to top, #ff0000, #ffff00, #00ff00, #00ffff, #0000ff, #ff00ff, #ff0000);
}

.k-colorgradient-slider.k-alpha-slider .k-slider-track::before {
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAuSURBVHgBxYyxDQAwDMJIL+YT+DjtzFRliUfLcklqBCRT4eCTxbD6kdL2/LgYXqpvCbs3kBv/AAAAAElFTkSuQmCC) center repeat;
}

.k-colorgradient-input-label {
  color: var(--kendo-color-subtle, #666666);
}

.k-rtl .k-colorgradient .k-hue-slider.k-slider-horizontal .k-slider-track,
[dir=rtl] .k-colorgradient .k-hue-slider.k-slider-horizontal .k-slider-track {
  background: linear-gradient(to left, #ff0000, #ffff00, #00ff00, #00ffff, #0000ff, #ff00ff, #ff0000);
}

.k-flex-1 {
  flex: 1 1 0%;
}

.\!k-flex-1 {
  flex: 1 1 0% !important;
}

.k-flex-auto {
  flex: 1 1 auto;
}

.\!k-flex-auto {
  flex: 1 1 auto !important;
}

.k-flex-initial {
  flex: 0 1 auto;
}

.\!k-flex-initial {
  flex: 0 1 auto !important;
}

.k-flex-none {
  flex: none;
}

.\!k-flex-none {
  flex: none !important;
}

.k-align-self-auto {
  align-self: auto;
}

.\!k-align-self-auto {
  align-self: auto !important;
}

.k-align-self-normal {
  align-self: normal;
}

.\!k-align-self-normal {
  align-self: normal !important;
}

.k-align-self-stretch {
  align-self: stretch;
}

.\!k-align-self-stretch {
  align-self: stretch !important;
}

.k-align-self-center {
  align-self: center;
}

.\!k-align-self-center {
  align-self: center !important;
}

.k-align-self-start {
  align-self: start;
}

.\!k-align-self-start {
  align-self: start !important;
}

.k-align-self-end {
  align-self: end;
}

.\!k-align-self-end {
  align-self: end !important;
}

.k-align-self-flex-start {
  align-self: flex-start;
}

.\!k-align-self-flex-start {
  align-self: flex-start !important;
}

.k-align-self-flex-end {
  align-self: flex-end;
}

.\!k-align-self-flex-end {
  align-self: flex-end !important;
}

.k-align-self-baseline {
  align-self: baseline;
}

.\!k-align-self-baseline {
  align-self: baseline !important;
}

.k-align-self-first-baseline {
  align-self: first baseline;
}

.\!k-align-self-first-baseline {
  align-self: first baseline !important;
}

.k-align-self-last-baseline {
  align-self: last baseline;
}

.\!k-align-self-last-baseline {
  align-self: last baseline !important;
}

.k-align-self-self-start {
  align-self: self-start;
}

.\!k-align-self-self-start {
  align-self: self-start !important;
}

.k-align-self-self-end {
  align-self: self-end;
}

.\!k-align-self-self-end {
  align-self: self-end !important;
}

.k-coloreditor {
  border-radius: var(--kendo-border-radius-md, 0.25rem);
  min-width: 272px;
  border-width: 1px;
  border-style: solid;
  box-sizing: border-box;
  outline: 0;
  font-size: var(--kendo-font-size, inherit);
  font-family: var(--kendo-font-family, inherit);
  line-height: var(--kendo-line-height, normal);
  display: inline-flex;
  flex-direction: column;
  align-items: stretch;
}

.k-coloreditor *,
.k-coloreditor *::before,
.k-coloreditor *::after {
  box-sizing: border-box;
}

.k-coloreditor-header {
  padding: var(--kendo-spacing-3, 0.75rem) var(--kendo-spacing-3, 0.75rem) 0;
}

.k-coloreditor-header-actions {
  gap: var(--kendo-spacing-2, 0.5rem);
}

.k-coloreditor-preview {
  display: flex;
  flex-flow: column nowrap;
  align-items: stretch;
  justify-content: center;
  gap: var(--kendo-spacing-1, 0.25rem);
  position: relative;
  z-index: 1;
}

.k-coloreditor-preview .k-color-preview {
  width: 32px;
  height: 12px;
}

.k-coloreditor-sm {
  min-width: 252px;
}

.k-coloreditor-sm .k-coloreditor-header {
  padding: var(--kendo-spacing-3, 0.75rem) var(--kendo-spacing-3, 0.75rem) 0;
}

.k-coloreditor-sm .k-coloreditor-views {
  padding-block: var(--kendo-spacing-3, 0.75rem);
  padding-inline: var(--kendo-spacing-3, 0.75rem);
}

.k-coloreditor-sm .k-coloreditor-preview {
  gap: var(--kendo-spacing-0\.5, 0.125rem);
}

.k-coloreditor-sm .k-coloreditor-preview .k-color-preview {
  width: 34px;
  height: 12px;
}

.k-coloreditor-md {
  min-width: 272px;
}

.k-coloreditor-md .k-coloreditor-header {
  padding: var(--kendo-spacing-3, 0.75rem) var(--kendo-spacing-3, 0.75rem) 0;
}

.k-coloreditor-md .k-coloreditor-views {
  padding-block: var(--kendo-spacing-3, 0.75rem);
  padding-inline: var(--kendo-spacing-3, 0.75rem);
}

.k-coloreditor-md .k-coloreditor-preview {
  gap: var(--kendo-spacing-1, 0.25rem);
}

.k-coloreditor-md .k-coloreditor-preview .k-color-preview {
  width: 32px;
  height: 12px;
}

.k-coloreditor-lg {
  min-width: 362px;
}

.k-coloreditor-lg .k-coloreditor-header {
  padding: var(--kendo-spacing-4\.5, 1.125rem) var(--kendo-spacing-4\.5, 1.125rem) 0;
}

.k-coloreditor-lg .k-coloreditor-views {
  padding-block: var(--kendo-spacing-4\.5, 1.125rem);
  padding-inline: var(--kendo-spacing-4\.5, 1.125rem);
}

.k-coloreditor-lg .k-coloreditor-preview {
  gap: var(--kendo-spacing-1, 0.25rem);
}

.k-coloreditor-lg .k-coloreditor-preview .k-color-preview {
  width: 44px;
  height: 16px;
}

.k-coloreditor-views {
  min-width: calc(var(--kendo-color-preview-width, var(--kendo-spacing-6, 1.5rem)) * var(--kendo-color-preview-columns, 10));
  padding-block: var(--kendo-spacing-3, 0.75rem);
  padding-inline: var(--kendo-spacing-3, 0.75rem);
  gap: var(--kendo-spacing-3, 0.75rem);
}

.k-coloreditor-views .k-colorgradient {
  padding: 0;
  width: auto;
  border-width: 0;
}

.k-coloreditor-views .k-colorgradient:focus,
.k-coloreditor-views .k-colorgradient.k-focus {
  outline: 2px dotted;
  outline-offset: 4px;
  border-radius: 0;
}

.k-coloreditor-views .k-colorpalette {
  align-self: center;
}

.k-coloreditor-footer.k-actions, .k-coloreditor-footer.k-form-buttons, .k-coloreditor-footer.k-edit-buttons,
.k-coloreditor-footer.k-action-buttons,
.k-coloreditor-footer.k-columnmenu-actions {
  margin: 0;
}

.k-coloreditor {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
  color: var(--kendo-color-on-app-surface, #3d3d3d);
  background-color: var(--kendo-color-surface-alt, #ffffff);
}

.k-coloreditor .k-colorgradient:focus,
.k-coloreditor .k-colorgradient.k-focus {
  box-shadow: none;
  outline-color: rgba(0, 0, 0, 0.3);
}

.k-color-picker, .k-colorpicker {
  width: min-content;
}

.k-table {
  width: 100%;
  max-width: none;
  border-width: 1px;
  border-style: solid;
  text-align: start;
  border-collapse: collapse;
  border-spacing: 0;
  empty-cells: show;
  outline: none;
}

.k-data-table {
  border-width: 1px;
  border-style: solid;
}

.k-data-table .k-table {
  table-layout: fixed;
}

.k-table-thead,
.k-table-tbody,
.k-table-tfoot,
.k-table-row,
.k-table-alt-row {
  border-color: inherit;
  text-align: inherit;
}

.k-table-th,
.k-table-td {
  border-width: 0 0 0px 1px;
  border-style: solid;
  border-color: inherit;
  box-sizing: border-box;
  font-weight: normal;
  text-align: inherit;
  white-space: nowrap;
  text-overflow: ellipsis;
  display: table-cell;
  overflow: hidden;
  position: relative;
}

.k-table-th:first-child,
.k-table-td:first-child {
  border-left-width: 0;
}

.k-table-th {
  border-bottom-width: 1px;
}

.k-table-header {
  padding-inline-end: var(--kendo-scrollbar-width);
  border-width: 0 0 1px;
  border-style: solid;
  box-sizing: border-box;
}

.k-table-header .k-table {
  border-width: 0;
}

.k-table-header-wrap {
  margin-right: -1px;
  width: 100%;
  border-width: 0 1px 0 0;
  border-style: solid;
  border-color: inherit;
  overflow: hidden;
}

.k-table-header > .k-table,
.k-table-header-wrap > .k-table {
  margin-bottom: -1px;
}

.k-table-group-sticky-header {
  flex: none;
}

.k-table-group-sticky-header .k-table-th {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  align-content: center;
}

.k-table-list {
  margin: 0;
  padding: 0;
  width: 100%;
  max-width: none;
  border-width: 0;
  display: table;
  border-collapse: collapse;
  border-spacing: 0;
  table-layout: fixed;
  empty-cells: show;
  list-style: none;
  outline: none;
}

.k-table-list .k-table-row {
  position: relative;
}

.k-table-list .k-table-row,
.k-table-list .k-table-group-row {
  width: 100%;
  box-sizing: border-box;
  display: table-row;
}

.k-table-list .k-table-row.k-first {
  border-top: 1px solid currentColor;
}

.k-table-list .k-table-th,
.k-table-list .k-table-td {
  vertical-align: middle;
}

.k-table-list .k-table-group-row {
  position: sticky;
}

.k-table-list .k-table-group-row::before {
  content: "​";
  padding-inline: 0;
  width: 0;
  display: block;
  overflow: hidden;
}

.k-table-list .k-table-group-row .k-table-th {
  width: 100%;
  border-color: inherit;
  color: inherit;
  background-color: inherit;
  position: absolute;
  top: 0;
}

.k-table-list .k-table-spacer-td {
  padding: 0 !important;
  width: 0 !important;
  border-left-width: 0 !important;
  border-right-width: 0 !important;
}

.k-table-list .k-table-group-td {
  padding: 0 !important;
  width: 0 !important;
  border-left-width: 0 !important;
  border-right-width: 0 !important;
  overflow: visible;
}

.k-table-list .k-table-group-td > span {
  font-size: 0.75em;
  position: absolute;
  top: 0;
  right: 0;
}

.k-virtual-table .k-table-row,
.k-virtual-table .k-table-group-row {
  position: absolute;
  width: 100%;
}

.k-table-scroller {
  position: relative;
  overflow: auto;
}

.k-table-scroller > .k-table {
  border-width: 0;
}

.k-table-footer {
  padding-inline-end: var(--kendo-scrollbar-width);
  border-width: 1px 0 0;
  border-style: solid;
  box-sizing: border-box;
}

.k-table-footer .k-table {
  border-width: 0;
}

.k-table-footer-wrap {
  margin-right: -1px;
  width: 100%;
  border-width: 0 1px 0 0;
  border-style: solid;
  border-color: inherit;
  overflow: hidden;
}

.k-table-sm {
  font-size: var(--kendo-font-size, inherit);
  line-height: var(--kendo-line-height, normal);
}

.k-table-sm .k-table-th,
.k-table-sm .k-table-td {
  padding-block: var(--kendo-spacing-1, 0.25rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
}

.k-table-sm .k-table-list .k-table-group-td > span {
  padding-block: 0;
  padding-inline: calc(var(--kendo-spacing-2, 0.5rem) / 2);
}

.k-table-sm .k-table-list .k-table-group-row::before {
  padding-block: var(--kendo-spacing-1, 0.25rem);
  padding-inline: 0;
}

.k-table-md {
  font-size: var(--kendo-font-size, inherit);
  line-height: var(--kendo-line-height, normal);
}

.k-table-md .k-table-th,
.k-table-md .k-table-td {
  padding-block: var(--kendo-spacing-2, 0.5rem);
  padding-inline: var(--kendo-spacing-3, 0.75rem);
}

.k-table-md .k-table-list .k-table-group-td > span {
  padding-block: 0;
  padding-inline: calc(var(--kendo-spacing-3, 0.75rem) / 2);
}

.k-table-md .k-table-list .k-table-group-row::before {
  padding-block: var(--kendo-spacing-2, 0.5rem);
  padding-inline: 0;
}

.k-table-lg {
  font-size: var(--kendo-font-size, inherit);
  line-height: var(--kendo-line-height, normal);
}

.k-table-lg .k-table-th,
.k-table-lg .k-table-td {
  padding-block: var(--kendo-spacing-2\.5, 0.625rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
}

.k-table-lg .k-table-list .k-table-group-td > span {
  padding-block: 0;
  padding-inline: calc(var(--kendo-spacing-2, 0.5rem) / 2);
}

.k-table-lg .k-table-list .k-table-group-row::before {
  padding-block: var(--kendo-spacing-2\.5, 0.625rem);
  padding-inline: 0;
}

.k-rtl.k-table .k-table-th,
.k-rtl.k-table .k-table-td,
.k-rtl .k-table .k-table-th,
.k-rtl .k-table .k-table-td,
[dir=rtl].k-table .k-table-th,
[dir=rtl].k-table .k-table-td,
[dir=rtl] .k-table .k-table-th,
[dir=rtl] .k-table .k-table-td {
  border-left-width: 0;
  border-right-width: 1px;
}

.k-rtl.k-table .k-table-th:first-child,
.k-rtl.k-table .k-table-td:first-child,
.k-rtl .k-table .k-table-th:first-child,
.k-rtl .k-table .k-table-td:first-child,
[dir=rtl].k-table .k-table-th:first-child,
[dir=rtl].k-table .k-table-td:first-child,
[dir=rtl] .k-table .k-table-th:first-child,
[dir=rtl] .k-table .k-table-td:first-child {
  border-right-width: 0;
}

.k-rtl.k-table .k-table-header-wrap,
.k-rtl.k-table .k-table-footer-wrap,
.k-rtl .k-table .k-table-header-wrap,
.k-rtl .k-table .k-table-footer-wrap,
[dir=rtl].k-table .k-table-header-wrap,
[dir=rtl].k-table .k-table-footer-wrap,
[dir=rtl] .k-table .k-table-header-wrap,
[dir=rtl] .k-table .k-table-footer-wrap {
  margin-right: 0;
  margin-left: -1px;
  border-left-width: 1px;
  border-right-width: 0;
}

.k-rtl .k-table-list .k-table-group-td > span,
[dir=rtl] .k-table-list .k-table-group-td > span {
  left: 0;
  right: auto;
}

.k-table,
.k-data-table {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
  color: var(--kendo-color-on-app-surface, #3d3d3d);
  background-color: var(--kendo-color-surface-alt, #ffffff);
}

.k-table-thead,
.k-table-header,
.k-table-group-sticky-header {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
  color: var(--kendo-color-on-app-surface, #3d3d3d);
  background-color: var(--kendo-color-surface, #fafafa);
}

.k-table-tfoot,
.k-table-footer {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
  color: var(--kendo-color-on-app-surface, #3d3d3d);
  background-color: var(--kendo-color-surface, #fafafa);
}

.k-table-group-row {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
  color: var(--kendo-color-on-app-surface, #3d3d3d);
  background-color: var(--kendo-color-surface, #fafafa);
}

.k-table-group-td > span {
  color: var(--kendo-color-surface-alt, #ffffff);
  background-color: var(--kendo-color-on-app-surface, #3d3d3d);
}

.k-table-alt-row {
  background-color: color-mix(in srgb, var(--kendo-color-on-app-surface, #3d3d3d) 5%, transparent);
}

.k-table-tbody .k-table-row:hover,
.k-table-list .k-table-row:hover,
.k-table-tbody .k-table-row.k-hover,
.k-table-list .k-table-row.k-hover {
  background-color: color-mix(in srgb, var(--kendo-color-on-app-surface, #3d3d3d) 11%, transparent);
}

.k-table-tbody .k-table-row.k-focus, .k-table-tbody .k-table-row:focus,
.k-table-list .k-table-row.k-focus,
.k-table-list .k-table-row:focus,
.k-table-tbody .k-table-td.k-focus,
.k-table-tbody .k-table-td:focus,
.k-table-list .k-table-td.k-focus,
.k-table-list .k-table-td:focus {
  box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.12);
}

.k-table-tbody .k-table-row.k-selected > .k-table-td,
.k-table-list .k-table-row.k-selected {
  background-color: color-mix(in srgb, var(--kendo-color-primary, #ff6358) 25%, transparent);
}

.k-dropdowngrid-popup {
  overflow: hidden;
}

.k-dropdowngrid-popup > .k-data-table {
  border-width: 0;
}

.k-dropdown-operator {
  width: min-content;
  flex: none;
}

.k-dropdown-operator .k-input-button {
  border-width: 0;
  width: min-content;
}

.k-dropdown-operator .k-input-button .k-button-icon {
  width: auto;
  aspect-ratio: 1;
}

.k-dropdown-operator .k-input-inner {
  display: none;
}

.k-chip {
  padding-block: var(--kendo-spacing-1, 0.25rem);
  padding-inline: var(--kendo-spacing-1, 0.25rem);
  border-width: 1px;
  border-style: solid;
  outline: 0;
  font-family: var(--kendo-font-family, inherit);
  font-size: var(--kendo-font-size, inherit);
  line-height: 1;
  display: inline-flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
  gap: var(--kendo-spacing-1, 0.25rem);
  position: relative;
  overflow: hidden;
  cursor: pointer;
  -webkit-user-select: none;
          user-select: none;
}

.k-chip *,
.k-chip *::before,
.k-chip *::after {
  box-sizing: border-box;
}

.k-chip .k-selected-icon-wrapper {
  display: none !important;
}

.k-chip-content {
  min-width: 0;
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  flex: 1 1 auto;
}

.k-chip-content .k-icon-wrapper-host {
  display: initial;
}

.k-chip-content:first-child {
  margin-inline-start: var(--kendo-spacing-1, 0.25rem);
}

.k-chip-content:last-child {
  margin-inline-end: var(--kendo-spacing-1, 0.25rem);
}

.k-chip-text,
.k-chip-label {
  padding-block: 0.5em;
  padding-inline: 0;
  margin-block: -0.5em;
  margin-inline: 0;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  flex: 1 1 auto;
}

.k-chip-avatar {
  border-radius: 50%;
  background-size: cover;
  background-position: center;
  flex: none;
}

.k-chip-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
}

.k-chip-actions {
  margin-block: -5em;
  margin-inline: 0;
  flex: none;
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  align-self: center;
}

.k-chip-action {
  flex: none;
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  align-self: center;
}

.k-remove-icon {
  font-size: inherit;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
}

.k-chip-list {
  min-width: 0px;
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  position: relative;
}

.k-chip-sm {
  padding-block: var(--kendo-spacing-0\.5, 0.125rem);
  padding-inline: var(--kendo-spacing-1, 0.25rem);
  font-size: var(--kendo-font-size, inherit);
  line-height: 1;
}

.k-chip-sm .k-chip-action {
  padding: var(--kendo-spacing-0\.5, 0.125rem);
}

.k-chip-avatar {
  width: 1em;
  height: 1em;
  flex-basis: 1em;
}

.k-chip-md {
  padding-block: var(--kendo-spacing-1, 0.25rem);
  padding-inline: var(--kendo-spacing-1, 0.25rem);
  font-size: var(--kendo-font-size, inherit);
  line-height: 1;
}

.k-chip-md .k-chip-action {
  padding: var(--kendo-spacing-1, 0.25rem);
}

.k-chip-avatar {
  width: 1em;
  height: 1em;
  flex-basis: 1em;
}

.k-chip-lg {
  padding-block: var(--kendo-spacing-1\.5, 0.375rem);
  padding-inline: var(--kendo-spacing-1, 0.25rem);
  font-size: var(--kendo-font-size, inherit);
  line-height: 1;
}

.k-chip-lg .k-chip-action {
  padding: var(--kendo-spacing-1\.5, 0.375rem);
}

.k-chip-avatar {
  width: 1em;
  height: 1em;
  flex-basis: 1em;
}

.k-chip-list-sm {
  gap: var(--kendo-spacing-1, 0.25rem);
}

.k-chip-list-md {
  gap: var(--kendo-spacing-1, 0.25rem);
}

.k-chip-list-lg {
  gap: var(--kendo-spacing-1, 0.25rem);
}

.k-chip-solid-base {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
  color: var(--kendo-color-on-base, #3d3d3d);
  background-color: var(--kendo-color-base-subtle, #ebebeb);
}

.k-chip-solid-base:focus, .k-chip-solid-base.k-focus {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--kendo-color-on-app-surface, #3d3d3d) 8%, transparent);
}

.k-chip-solid-base:hover, .k-chip-solid-base.k-hover {
  background-color: var(--kendo-color-base-subtle-hover, #e0e0e0);
}

.k-chip-solid-base.k-selected {
  background-color: var(--kendo-color-base-active, #d6d6d6);
}

.k-chip-solid-error {
  border-color: var(--kendo-color-error-emphasis, #f76f60);
  color: var(--kendo-color-error-on-subtle, #7a0c00);
  background-color: var(--kendo-color-error-subtle, #fcddda);
}

.k-chip-solid-error:focus, .k-chip-solid-error.k-focus {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--kendo-color-error, #f31700) 16%, transparent);
}

.k-chip-solid-error:hover, .k-chip-solid-error.k-hover {
  background-color: var(--kendo-color-error-subtle-hover, #fbc8c3);
}

.k-chip-solid-error.k-selected {
  background-color: var(--kendo-color-error-subtle-active, #f98b80);
}

.k-chip-solid-info {
  border-color: var(--kendo-color-info-emphasis, #6098f2);
  color: var(--kendo-color-info-on-subtle, #002259);
  background-color: var(--kendo-color-info-subtle, #d2e2fb);
}

.k-chip-solid-info:focus, .k-chip-solid-info.k-focus {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--kendo-color-info, #0058e9) 16%, transparent);
}

.k-chip-solid-info:hover, .k-chip-solid-info.k-hover {
  background-color: var(--kendo-color-info-subtle-hover, #bdd4f8);
}

.k-chip-solid-info.k-selected {
  background-color: var(--kendo-color-info-subtle-active, #80acf4);
}

.k-chip-solid-warning {
  border-color: var(--kendo-color-warning-emphasis, #ffd760);
  color: var(--kendo-color-warning-on-subtle, #5e4700);
  background-color: var(--kendo-color-warning-subtle, #fff4d3);
}

.k-chip-solid-warning:focus, .k-chip-solid-warning.k-focus {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--kendo-color-warning, #ffc000) 16%, transparent);
}

.k-chip-solid-warning:hover, .k-chip-solid-warning.k-hover {
  background-color: var(--kendo-color-warning-subtle-hover, #ffeebd);
}

.k-chip-solid-warning.k-selected {
  background-color: var(--kendo-color-warning-subtle-active, #ffe79e);
}

.k-chip-solid-success {
  border-color: var(--kendo-color-success-emphasis, #81d15f);
  color: var(--kendo-color-success-on-subtle, #1c5a00);
  background-color: var(--kendo-color-success-subtle, #dcf0d3);
}

.k-chip-solid-success:focus, .k-chip-solid-success.k-focus {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--kendo-color-success, #37b400) 16%, transparent);
}

.k-chip-solid-success:hover, .k-chip-solid-success.k-hover {
  background-color: var(--kendo-color-success-subtle-hover, #cbe9bf);
}

.k-chip-solid-success.k-selected {
  background-color: var(--kendo-color-success-subtle-active, #b7e1a5);
}

.k-chip-outline-base {
  border-color: var(--kendo-color-base-on-surface, #3d3d3d);
  color: var(--kendo-color-base-on-surface, #3d3d3d);
  background-color: transparent;
}

.k-chip-outline-base:focus, .k-chip-outline-base.k-focus {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--kendo-color-on-app-surface, #3d3d3d) 8%, transparent);
}

.k-chip-outline-base:hover, .k-chip-outline-base.k-hover {
  color: var(--kendo-color-base, #f5f5f5);
  background-color: var(--kendo-color-base-on-surface, #3d3d3d);
}

.k-chip-outline-base.k-selected {
  color: var(--kendo-color-base, #f5f5f5);
  background-color: var(--kendo-color-base-on-surface, #3d3d3d);
}

.k-chip-outline-error {
  border-color: var(--kendo-color-error-on-surface, #ca1400);
  color: var(--kendo-color-error-on-surface, #ca1400);
  background-color: transparent;
}

.k-chip-outline-error:focus, .k-chip-outline-error.k-focus {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--kendo-color-error, #f31700) 16%, transparent);
}

.k-chip-outline-error:hover, .k-chip-outline-error.k-hover {
  border-color: var(--kendo-color-error-hover, #df1600);
  color: var(--kendo-color-on-error, #ffffff);
  background-color: var(--kendo-color-error-hover, #df1600);
}

.k-chip-outline-error.k-selected {
  border-color: var(--kendo-color-error-active, #ca1400);
  color: var(--kendo-color-on-error, #ffffff);
  background-color: var(--kendo-color-error-active, #ca1400);
}

.k-chip-outline-info {
  border-color: var(--kendo-color-info-on-surface, #004ac2);
  color: var(--kendo-color-info-on-surface, #004ac2);
  background-color: transparent;
}

.k-chip-outline-info:focus, .k-chip-outline-info.k-focus {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--kendo-color-info, #0058e9) 16%, transparent);
}

.k-chip-outline-info:hover, .k-chip-outline-info.k-hover {
  border-color: var(--kendo-color-info-hover, #0052d6);
  color: var(--kendo-color-on-info, #ffffff);
  background-color: var(--kendo-color-info-hover, #0052d6);
}

.k-chip-outline-info.k-selected {
  border-color: var(--kendo-color-info-active, #004ac2);
  color: var(--kendo-color-on-info, #ffffff);
  background-color: var(--kendo-color-info-active, #004ac2);
}

.k-chip-outline-warning {
  border-color: var(--kendo-color-warning, #ffc000);
  color: var(--kendo-color-on-app-surface, #3d3d3d);
  background-color: transparent;
}

.k-chip-outline-warning:focus, .k-chip-outline-warning.k-focus {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--kendo-color-warning, #ffc000) 16%, transparent);
}

.k-chip-outline-warning:hover, .k-chip-outline-warning.k-hover {
  color: var(--kendo-color-on-warning, #3d3d3d);
  background-color: var(--kendo-color-warning, #ffc000);
}

.k-chip-outline-warning.k-selected {
  color: var(--kendo-color-on-warning, #3d3d3d);
  background-color: var(--kendo-color-warning, #ffc000);
}

.k-chip-outline-success {
  border-color: var(--kendo-color-success-on-surface, #2d9600);
  color: var(--kendo-color-success-on-surface, #2d9600);
  background-color: transparent;
}

.k-chip-outline-success:focus, .k-chip-outline-success.k-focus {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--kendo-color-success, #37b400) 16%, transparent);
}

.k-chip-outline-success:hover, .k-chip-outline-success.k-hover {
  border-color: var(--kendo-color-success-hover, #32a500);
  color: var(--kendo-color-on-success, #ffffff);
  background-color: var(--kendo-color-success-hover, #32a500);
}

.k-chip-outline-success.k-selected {
  border-color: var(--kendo-color-success-active, #2d9600);
  color: var(--kendo-color-on-success, #ffffff);
  background-color: var(--kendo-color-success-active, #2d9600);
}

.k-text-clip {
  text-overflow: clip;
}

.\!k-text-clip {
  text-overflow: clip !important;
}

.k-text-ellipsis {
  text-overflow: ellipsis;
}

.\!k-text-ellipsis {
  text-overflow: ellipsis !important;
}

.k-text-truncate, .k-text-ellipsis {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.\!k-text-truncate, .\!k-text-ellipsis {
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.k-checkbox {
  margin: 0;
  padding: 0;
  line-height: initial;
  border-width: 1px;
  border-style: solid;
  outline: 0;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  display: inline-block;
  flex: none;
  vertical-align: middle;
  position: relative;
  cursor: pointer;
  -webkit-appearance: none;
}

.k-checkbox::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
}

.k-checkbox:checked::before,
.k-checkbox.k-checked::before {
  background-color: currentColor;
  -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23ffffff' stroke-linecap='square' stroke-linejoin='square' stroke-width='2' d='M3,8 l3,3 l7-7'/%3e%3c/svg%3e");
          mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23ffffff' stroke-linecap='square' stroke-linejoin='square' stroke-width='2' d='M3,8 l3,3 l7-7'/%3e%3c/svg%3e");
}

.k-checkbox:indeterminate::before,
.k-checkbox.k-indeterminate::before {
  background-color: currentColor;
  -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23ff6358' stroke-linecap='square' stroke-linejoin='square' stroke-width='2' d='M4,8 h8'/%3e%3c/svg%3e");
          mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23ff6358' stroke-linecap='square' stroke-linejoin='square' stroke-width='2' d='M4,8 h8'/%3e%3c/svg%3e");
}

.k-checkbox:disabled,
.k-checkbox.k-disabled {
  outline: none;
  cursor: default;
  opacity: 0.6;
  filter: grayscale(0.1);
  pointer-events: none;
  box-shadow: none;
}

.k-checkbox-wrap {
  flex: none;
  display: inline-flex;
  flex-flow: row nowrap;
  gap: 0;
  align-items: center;
  align-self: flex-start;
  vertical-align: middle;
  position: relative;
}

.k-checkbox-wrap::before {
  content: "​";
  width: 0px;
  overflow: hidden;
  flex: none;
  display: inline-block;
  vertical-align: top;
}

.k-checkbox-label {
  margin: 0;
  padding: 0;
  display: inline-flex;
  align-items: flex-start;
  gap: var(--kendo-spacing-1, 0.25rem);
  vertical-align: middle;
  position: relative;
  cursor: pointer;
}

.k-checkbox-label .k-ripple {
  visibility: hidden !important;
}

.k-checkbox + .k-label,
.k-checkbox-wrap + .k-label,
.k-checkbox + .k-checkbox-label,
.k-checkbox-wrap + .k-checkbox-label {
  display: inline;
  margin-inline-start: var(--kendo-spacing-1, 0.25rem);
}

.k-checkbox-label:empty {
  display: none !important;
}

.k-checkbox-label.k-no-text {
  min-width: 1px;
}

.k-checkbox-list {
  margin: 0;
  padding: 0;
  display: flex;
  flex-flow: column nowrap;
  gap: 0;
  list-style: none;
}

.k-checkbox-item,
.k-checkbox-list-item {
  padding-block: var(--kendo-spacing-1, 0.25rem);
  padding-inline: var(--kendo-spacing-0, 0px);
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  align-content: center;
  gap: var(--kendo-spacing-1, 0.25rem);
}

.k-checkbox-item .k-checkbox-label,
.k-checkbox-list-item .k-checkbox-label {
  margin: 0;
}

.k-checkbox-list-horizontal,
.k-checkbox-list.k-list-horizontal {
  display: flex;
  flex-flow: row wrap;
  gap: var(--kendo-spacing-4, 1rem);
}

.k-ripple-container .k-checkbox::after {
  content: "";
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  border-radius: 100%;
  z-index: -1;
  transition: opacity 100ms linear, transform 150ms cubic-bezier(0.4, 0, 0.2, 1);
  transform: translate(-50%, -50%) scale(0);
  transform-origin: center center;
}

.k-ripple-container .k-checkbox:focus,
.k-ripple-container .k-checkbox.k-focus {
  box-shadow: none !important;
}

.k-ripple-container .k-checkbox:disabled::after,
.k-ripple-container .k-checkbox.k-disabled::after {
  display: none;
}

.k-checkbox-sm {
  width: var(--kendo-spacing-3, 0.75rem);
  height: var(--kendo-spacing-3, 0.75rem);
}

.k-checkbox-sm::before {
  font-size: var(--kendo-spacing-2\.5, 0.625rem);
}

.k-ripple-container .k-checkbox-sm::after {
  width: 300%;
  height: 300%;
}

.k-checkbox-md {
  width: var(--kendo-spacing-4, 1rem);
  height: var(--kendo-spacing-4, 1rem);
}

.k-checkbox-md::before {
  font-size: var(--kendo-spacing-3\.5, 0.875rem);
}

.k-ripple-container .k-checkbox-md::after {
  width: 300%;
  height: 300%;
}

.k-checkbox-lg {
  width: var(--kendo-spacing-5, 1.25rem);
  height: var(--kendo-spacing-5, 1.25rem);
}

.k-checkbox-lg::before {
  font-size: var(--kendo-spacing-4\.5, 1.125rem);
}

.k-ripple-container .k-checkbox-lg::after {
  width: 300%;
  height: 300%;
}

.k-checkbox {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
  background-color: var(--kendo-color-surface-alt, #ffffff);
}

.k-checkbox:focus,
.k-checkbox.k-focus {
  box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.06);
}

.k-checkbox:indeterminate,
.k-checkbox.k-indeterminate {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
  color: var(--kendo-color-primary, #ff6358);
  background-color: var(--kendo-color-surface-alt, #ffffff);
}

.k-checkbox:checked,
.k-checkbox.k-checked {
  border-color: var(--kendo-color-primary, #ff6358);
  color: var(--kendo-color-on-primary, #ffffff);
  background-color: var(--kendo-color-primary, #ff6358);
}

.k-checkbox:checked:focus,
.k-checkbox.k-checked.k-focus {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--kendo-color-primary, #ff6358) 30%, transparent);
}

.k-checkbox.k-invalid {
  border-color: var(--kendo-color-error, #f31700);
}

.k-checkbox.k-invalid + .k-checkbox-label {
  color: var(--kendo-color-error, #f31700);
}

.k-checkbox-wrap .k-ripple-blob {
  color: var(--kendo-color-primary, #ff6358);
  opacity: 0.25;
}

.k-ripple-container .k-checkbox::after {
  background: var(--kendo-color-primary, #ff6358);
  opacity: 0.25;
}

.k-treeview {
  padding: 0;
  border-width: 0;
  background: none;
  box-sizing: border-box;
  outline: 0;
  font-family: var(--kendo-font-family, inherit);
  font-size: var(--kendo-font-size, inherit);
  line-height: var(--kendo-line-height, normal);
  display: block;
  cursor: default;
  overflow: auto;
  white-space: nowrap;
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.k-treeview *,
.k-treeview *::before,
.k-treeview *::after {
  box-sizing: border-box;
}

.k-treeview-filter {
  padding: var(--kendo-spacing-2, 0.5rem);
  display: block;
  position: relative;
  flex: none;
}

.k-treeview-group {
  margin: 0;
  padding: 0;
  list-style: none;
  position: relative;
  outline: 0;
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.k-treeview-group.ng-animating {
  overflow: hidden;
}

.k-treeview-top,
.k-treeview-mid,
.k-treeview-bot {
  display: flex;
  flex-direction: row;
  align-items: center;
  align-content: center;
}

.k-treeview-item {
  outline-style: none;
  margin: 0;
  padding: 0 0 0 24px;
  border-width: 0;
  display: block;
}

.k-treeview-toggle {
  margin-inline-start: -24px;
  flex: none;
  display: inline-flex;
  flex-flow: row nowrap;
  align-items: center;
  cursor: pointer;
}

.k-treeview-toggle .k-icon {
  padding: var(--kendo-spacing-1, 0.25rem);
  box-sizing: content-box;
}

.k-treeview-loading {
  margin-right: var(--kendo-spacing-1, 0.25rem);
}

.k-treeview .k-checkbox-wrap,
.k-treeview .k-checkbox-wrapper {
  align-self: center;
}

.k-treeview-leaf {
  border-radius: var(--kendo-border-radius-md, 0.25rem);
  padding-block: var(--kendo-spacing-1, 0.25rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
  border: 0px solid transparent;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  align-content: center;
  vertical-align: middle;
  position: relative;
}

.k-treeview-leaf .k-icon,
.k-treeview-leaf .k-image,
.k-treeview-leaf .k-sprite {
  margin-right: var(--kendo-spacing-1, 0.25rem);
}

.k-treeview-leaf.k-focus {
  z-index: 1;
}

.k-treeview .k-treeview-load-more-button {
  cursor: pointer;
}

.k-treeview .k-treeview-load-more-button:hover, .k-treeview .k-treeview-load-more-button.k-hover, .k-treeview .k-treeview-load-more-button:focus, .k-treeview .k-treeview-load-more-button.k-focus {
  text-decoration: underline;
}

.k-rtl .k-treeview .k-treeview-item,
[dir=rtl] .k-treeview .k-treeview-item,
.k-treeview.k-rtl .k-treeview-item,
.k-treeview[dir=rtl] .k-treeview-item {
  padding-left: 0;
  padding-right: 24px;
}

.k-rtl .k-treeview .k-treeview-loading,
[dir=rtl] .k-treeview .k-treeview-loading,
.k-treeview.k-rtl .k-treeview-loading,
.k-treeview[dir=rtl] .k-treeview-loading {
  margin-right: 0;
  margin-left: var(--kendo-spacing-1, 0.25rem);
}

.k-rtl .k-treeview .k-treeview-leaf .k-icon,
.k-rtl .k-treeview .k-treeview-leaf .k-image,
.k-rtl .k-treeview .k-treeview-leaf .k-sprite,
.k-rtl .k-treeview .k-in .k-icon,
.k-rtl .k-treeview .k-in .k-image,
.k-rtl .k-treeview .k-in .k-sprite,
[dir=rtl] .k-treeview .k-treeview-leaf .k-icon,
[dir=rtl] .k-treeview .k-treeview-leaf .k-image,
[dir=rtl] .k-treeview .k-treeview-leaf .k-sprite,
[dir=rtl] .k-treeview .k-in .k-icon,
[dir=rtl] .k-treeview .k-in .k-image,
[dir=rtl] .k-treeview .k-in .k-sprite,
.k-treeview.k-rtl .k-treeview-leaf .k-icon,
.k-treeview.k-rtl .k-treeview-leaf .k-image,
.k-treeview.k-rtl .k-treeview-leaf .k-sprite,
.k-treeview.k-rtl .k-in .k-icon,
.k-treeview.k-rtl .k-in .k-image,
.k-treeview.k-rtl .k-in .k-sprite,
.k-treeview[dir=rtl] .k-treeview-leaf .k-icon,
.k-treeview[dir=rtl] .k-treeview-leaf .k-image,
.k-treeview[dir=rtl] .k-treeview-leaf .k-sprite,
.k-treeview[dir=rtl] .k-in .k-icon,
.k-treeview[dir=rtl] .k-in .k-image,
.k-treeview[dir=rtl] .k-in .k-sprite {
  margin-right: 0;
  margin-left: var(--kendo-spacing-1, 0.25rem);
}

.k-treeview-sm {
  font-size: var(--kendo-font-size, inherit);
  line-height: var(--kendo-line-height, normal);
}

.k-treeview-sm .k-treeview-leaf {
  padding-block: var(--kendo-spacing-0\.5, 0.125rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
}

.k-treeview-sm .k-checkbox-wrap {
  padding-block: var(--kendo-spacing-0\.5, 0.125rem);
  padding-inline: var(--kendo-spacing-1, 0.25rem);
}

.k-treeview-md {
  font-size: var(--kendo-font-size, inherit);
  line-height: var(--kendo-line-height, normal);
}

.k-treeview-md .k-treeview-leaf {
  padding-block: var(--kendo-spacing-1, 0.25rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
}

.k-treeview-md .k-checkbox-wrap {
  padding-block: var(--kendo-spacing-0\.5, 0.125rem);
  padding-inline: var(--kendo-spacing-1, 0.25rem);
}

.k-treeview-lg {
  font-size: var(--kendo-font-size-lg, inherit);
  line-height: var(--kendo-line-height-lg, normal);
}

.k-treeview-lg .k-treeview-leaf {
  padding-block: var(--kendo-spacing-2, 0.5rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
}

.k-treeview-lg .k-checkbox-wrap {
  padding-inline: var(--kendo-spacing-1, 0.25rem);
}

.k-treeview {
  color: var(--kendo-color-on-app-surface, #3d3d3d);
}

.k-treeview-leaf:hover, .k-treeview-leaf.k-hover {
  color: var(--kendo-color-on-app-surface, #3d3d3d);
  background-color: var(--kendo-color-base-hover, #ebebeb);
}

.k-treeview-leaf:focus, .k-treeview-leaf.k-focus {
  box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.13);
}

.k-treeview-leaf.k-selected {
  color: var(--kendo-color-on-primary, #ffffff);
  background-color: var(--kendo-color-primary, #ff6358);
}

.k-treeview .k-treeview-load-more-button {
  color: var(--kendo-color-primary, #ff6358);
  background-color: transparent;
}

.k-treeview .k-treeview-load-more-button:hover, .k-treeview .k-treeview-load-more-button.k-hover {
  color: var(--kendo-color-primary-hover, #ea5a51);
  background-color: transparent;
}

.k-treeview .k-treeview-load-more-button:focus, .k-treeview .k-treeview-load-more-button.k-focus {
  color: var(--kendo-color-primary-hover, #ea5a51);
  background-color: transparent;
  box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.13);
}

.k-popup-dropdowntree .k-treeview,
.k-dropdowntree-popup .k-treeview,
.k-multiselecttree-popup .k-treeview {
  padding-block: calc(var(--kendo-spacing-2, 0.5rem) / 2);
  padding-inline: calc(var(--kendo-spacing-2, 0.5rem) / 2);
}

.k-popup-dropdowntree .k-check-all,
.k-dropdowntree-popup .k-check-all,
.k-multiselecttree-popup .k-check-all {
  padding-block: var(--kendo-spacing-2, 0.5rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
}

.k-multiselecttree .k-input-values {
  width: auto;
  max-width: 100%;
}

.k-multiselecttree .k-input-inner::before {
  content: "​";
  width: 0px;
  overflow: hidden;
  flex: none;
  display: inline-block;
  vertical-align: top;
}

.k-text-left {
  text-align: left;
}

.\!k-text-left {
  text-align: left !important;
}

.k-text-right {
  text-align: right;
}

.\!k-text-right {
  text-align: right !important;
}

.k-text-center {
  text-align: center;
}

.\!k-text-center {
  text-align: center !important;
}

.k-text-justify {
  text-align: justify;
}

.\!k-text-justify {
  text-align: justify !important;
}

.k-text-start {
  text-align: start;
}

.\!k-text-start {
  text-align: start !important;
}

.k-text-end {
  text-align: end;
}

.\!k-text-end {
  text-align: end !important;
}

.k-menu-bar, .k-menu {
  border-width: 0px;
  border-style: solid;
  box-sizing: border-box;
  outline: 0;
  font-family: var(--kendo-font-family, inherit);
  font-size: var(--kendo-font-size, inherit);
  line-height: var(--kendo-line-height, normal);
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  position: relative;
  cursor: default;
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.k-menu-bar *, .k-menu *,
.k-menu-bar *::before,
.k-menu *::before,
.k-menu-bar *::after,
.k-menu *::after {
  box-sizing: border-box;
}

.k-menu-item {
  border-width: 0;
  outline: 0;
  display: flex;
  flex-flow: column nowrap;
  flex: none;
  position: relative;
  -webkit-user-select: none;
          user-select: none;
}

.k-menu-item.k-selected {
  font-weight: var(--kendo-font-weight-bold, normal);
}

.k-menu-item-content {
  display: block;
  height: auto;
  overflow: visible;
}

.k-menu-item-content .k-actions, .k-menu-item-content .k-form-buttons, .k-menu-item-content .k-edit-buttons,
.k-menu-item-content .k-action-buttons,
.k-menu-item-content .k-columnmenu-actions {
  margin-top: 0;
}

.k-menu-link {
  padding-block: var(--kendo-spacing-1\.5, 0.375rem);
  padding-inline: var(--kendo-spacing-3, 0.75rem);
  outline: 0;
  color: inherit;
  display: flex;
  flex-flow: row nowrap;
  flex: 1 1 auto;
  gap: var(--kendo-spacing-1, 0.25rem);
  align-items: center;
  position: relative;
  white-space: nowrap;
  cursor: pointer;
}

.k-menu-link-text {
  display: flex;
  flex-flow: row nowrap;
  flex: 1 1 auto;
  overflow: hidden;
  text-overflow: ellipsis;
}

.k-menu-expand-arrow {
  margin-inline-end: calc(var(--kendo-spacing-1, 0.25rem) * -1);
  display: inline-flex;
  flex-flow: row wrap;
  align-items: center;
  flex: none;
  position: relative;
}

.k-menu-horizontal {
  flex-direction: row;
}

.k-menu-horizontal > .k-menu-item + .k-menu-item {
  margin-inline-start: var(--kendo-spacing-0, 0px);
}

.k-menu-horizontal > .k-separator {
  margin-block: var(--kendo-spacing-1\.5, 0.375rem);
  margin-inline: var(--kendo-spacing-1, 0.25rem);
  width: 0;
  height: auto;
  border-width: 0 0 0 1px;
  border-style: solid;
}

.k-menu-vertical {
  flex-direction: column;
  width: 100%;
}

.k-menu-vertical > .k-menu-item + .k-menu-item {
  margin-top: var(--kendo-spacing-0, 0px);
}

.k-menu-vertical > .k-menu-item > .k-menu-link {
  padding-block: var(--kendo-spacing-1, 0.25rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
  padding-inline-end: calc(var(--kendo-spacing-2, 0.5rem) * 2 + 16px);
}

.k-menu-vertical > .k-menu-item > .k-menu-link > .k-menu-expand-arrow {
  margin-inline-start: var(--kendo-spacing-2, 0.5rem);
  margin-inline-end: calc(-1 * (calc(var(--kendo-spacing-2, 0.5rem) * 2 + 16px) - var(--kendo-spacing-2, 0.5rem) / 2));
}

.k-menu-vertical > .k-separator {
  margin-block: var(--kendo-spacing-1\.5, 0.375rem);
  margin-inline: 0;
  height: 0;
  border-width: 1px 0 0;
  border-style: solid;
  display: block;
}

.k-menu-popup {
  box-sizing: border-box;
  border-width: 1px;
  border-style: solid;
  overflow: auto;
  max-height: 80vh;
}

.k-menu-popup *,
.k-menu-popup *::before,
.k-menu-popup *::after {
  box-sizing: border-box;
}

.k-menu-popup .k-menu-item {
  font-weight: initial;
}

.k-menu-group {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-flow: column nowrap;
  position: absolute;
}

.k-menu-group .k-menu-item + .k-menu-item {
  margin-top: var(--kendo-spacing-0, 0px);
}

.k-menu-group .k-separator {
  margin-block: var(--kendo-spacing-1, 0.25rem);
  margin-inline: 0;
  height: 0;
  border-width: 1px 0 0;
  border-style: solid;
  display: block;
}

.k-menu-popup .k-menu-group {
  position: relative;
}

.k-menu-group-sm {
  font-size: var(--kendo-font-size, inherit);
  line-height: var(--kendo-line-height, normal);
}

.k-menu-group-sm .k-menu-item {
  font-size: var(--kendo-font-size, inherit);
  line-height: var(--kendo-line-height, normal);
}

.k-menu-group-sm .k-menu-link {
  padding-block: var(--kendo-spacing-0\.5, 0.125rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
  padding-inline-end: calc(var(--kendo-spacing-2, 0.5rem) * 2 + 16px);
}

.k-menu-group-sm .k-menu-expand-arrow {
  margin-inline-start: var(--kendo-spacing-2, 0.5rem);
  margin-inline-end: calc(-1 * (calc(var(--kendo-spacing-2, 0.5rem) * 2 + 16px) - var(--kendo-spacing-2, 0.5rem) / 2));
}

.k-menu-group-md {
  font-size: var(--kendo-font-size, inherit);
  line-height: var(--kendo-line-height, normal);
}

.k-menu-group-md .k-menu-item {
  font-size: var(--kendo-font-size, inherit);
  line-height: var(--kendo-line-height, normal);
}

.k-menu-group-md .k-menu-link {
  padding-block: var(--kendo-spacing-1, 0.25rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
  padding-inline-end: calc(var(--kendo-spacing-2, 0.5rem) * 2 + 16px);
}

.k-menu-group-md .k-menu-expand-arrow {
  margin-inline-start: var(--kendo-spacing-2, 0.5rem);
  margin-inline-end: calc(-1 * (calc(var(--kendo-spacing-2, 0.5rem) * 2 + 16px) - var(--kendo-spacing-2, 0.5rem) / 2));
}

.k-menu-group-lg {
  font-size: var(--kendo-font-size-lg, inherit);
  line-height: var(--kendo-line-height-lg, normal);
}

.k-menu-group-lg .k-menu-item {
  font-size: var(--kendo-font-size-lg, inherit);
  line-height: var(--kendo-line-height-lg, normal);
}

.k-menu-group-lg .k-menu-link {
  padding-block: var(--kendo-spacing-1\.5, 0.375rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
  padding-inline-end: calc(var(--kendo-spacing-2, 0.5rem) * 2 + 16px);
}

.k-menu-group-lg .k-menu-expand-arrow {
  margin-inline-start: var(--kendo-spacing-2, 0.5rem);
  margin-inline-end: calc(-1 * (calc(var(--kendo-spacing-2, 0.5rem) * 2 + 16px) - var(--kendo-spacing-2, 0.5rem) / 2));
}

.k-popups-wrapper {
  position: relative;
  border: 0;
  margin: 0;
  padding: 0;
}

.k-context-menu {
  margin: 0;
  border-width: 1px;
  border-style: solid;
}

.k-animation-container .k-context-menu.k-menu-horizontal {
  display: flex !important;
  flex-wrap: nowrap;
}

.k-context-menu-popup {
  z-index: 12000;
}

.k-context-menu-popup .k-context-menu {
  border-width: 0;
}

.k-popup .k-context-menu,
.k-context-menu-popup .k-context-menu {
  border-width: 0;
}

.k-menu-scroll-wrapper {
  margin: 0;
  padding: 0;
  border: 0;
  position: relative;
  display: flex;
  align-items: center;
}

.k-menu-scroll-wrapper .k-menu {
  overflow: hidden;
  flex-wrap: nowrap;
}

.k-menu-scroll-wrapper-vertical {
  flex-direction: column;
}

.k-menu-scroll-wrapper-vertical > .k-menu-scroll-button {
  width: 100%;
}

.k-menu:not(.k-context-menu) {
  color: var(--kendo-color-on-app-surface, #3d3d3d);
  background-color: transparent;
}

.k-menu:not(.k-context-menu) > .k-item {
  color: var(--kendo-color-subtle, #666666);
}

.k-menu:not(.k-context-menu) > .k-item:hover, .k-menu:not(.k-context-menu) > .k-item.k-hover {
  color: var(--kendo-color-on-app-surface, #3d3d3d);
}

.k-menu:not(.k-context-menu) > .k-item:active, .k-menu:not(.k-context-menu) > .k-item.k-active {
  color: var(--kendo-color-primary, #ff6358);
}

.k-menu:not(.k-context-menu) > .k-item:focus, .k-menu:not(.k-context-menu) > .k-item.k-focus {
  box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.12);
}

.k-menu:not(.k-context-menu) > .k-item.k-selected {
  color: var(--kendo-color-primary, #ff6358);
}

.k-menu:not(.k-context-menu) > .k-separator {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
}

.k-menu-group,
.k-menu.k-context-menu {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
  color: var(--kendo-color-on-app-surface, #3d3d3d);
  background-color: var(--kendo-color-surface-alt, #ffffff);
}

.k-menu-group .k-item > .k-link:hover, .k-menu-group .k-item > .k-link.k-hover,
.k-menu.k-context-menu .k-item > .k-link:hover,
.k-menu.k-context-menu .k-item > .k-link.k-hover {
  color: var(--kendo-color-on-app-surface, #3d3d3d);
  background-color: var(--kendo-color-base-hover, #ebebeb);
}

.k-menu-group .k-item > .k-link:active, .k-menu-group .k-item > .k-link.k-active, .k-menu-group .k-item > .k-link.k-selected,
.k-menu.k-context-menu .k-item > .k-link:active,
.k-menu.k-context-menu .k-item > .k-link.k-active,
.k-menu.k-context-menu .k-item > .k-link.k-selected {
  color: var(--kendo-color-on-primary, #ffffff);
  background-color: var(--kendo-color-primary, #ff6358);
}

.k-menu-group .k-item:focus > .k-link,
.k-menu-group .k-item.k-focus > .k-link,
.k-menu.k-context-menu .k-item:focus > .k-link,
.k-menu.k-context-menu .k-item.k-focus > .k-link {
  box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.12);
}

.k-menu-group > .k-separator,
.k-menu.k-context-menu > .k-separator {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
}

.k-menu-scroll-wrapper .k-menu-scroll-button {
  color: var(--kendo-color-subtle, #666666);
}

.k-menu-scroll-wrapper .k-menu-scroll-button:hover {
  color: var(--kendo-color-on-app-surface, #3d3d3d);
}

.k-menu-scroll-wrapper .k-menu-scroll-button:hover::before {
  opacity: 0;
}

.k-toolbar {
  margin: 0;
  padding-block: var(--kendo-spacing-2, 0.5rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
  border-width: 1px;
  border-style: solid;
  box-sizing: border-box;
  outline: 0;
  font-family: var(--kendo-font-family, inherit);
  font-size: var(--kendo-font-size, inherit);
  line-height: var(--kendo-line-height, normal);
  list-style: none;
  display: flex;
  flex-flow: row wrap;
  gap: var(--kendo-spacing-2, 0.5rem);
  align-items: center;
  justify-content: flex-start;
  position: relative;
  overflow: hidden;
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.k-toolbar::before {
  content: "";
  height: calc(var(--kendo-line-height, normal) * 1em + var(--kendo-spacing-1, 0.25rem) * 2 + 1px * 2);
}

.k-toolbar.k-toolbar-resizable {
  flex-wrap: nowrap;
}

.k-toolbar.k-toolbar-scrollable {
  flex-wrap: nowrap;
  position: relative;
}

.k-toolbar.k-toolbar-scrollable-overlay::before, .k-toolbar.k-toolbar-scrollable-overlay::after {
  content: "";
  height: 100%;
  aspect-ratio: 1;
  position: absolute;
  z-index: 3;
}

.k-toolbar.k-toolbar-scrollable-overlay::before {
  inset-inline-start: 0;
}

.k-toolbar.k-toolbar-scrollable-overlay::after {
  inset-inline-end: 0;
}

.k-toolbar.k-toolbar-scrollable-overlay.k-toolbar-scrollable-start::before, .k-toolbar.k-toolbar-scrollable-overlay.k-toolbar-scrollable-end::after {
  display: none;
}

.k-toolbar > * {
  flex-shrink: 0;
  display: inline-flex;
  align-content: center;
  vertical-align: middle;
}

.k-toolbar > * > label {
  margin-inline-end: var(--kendo-spacing-2, 0.5rem);
  align-self: center;
}

.k-toolbar .k-input,
.k-toolbar .k-picker {
  width: 10em;
}

.k-toolbar .k-color-picker, .k-toolbar .k-colorpicker {
  width: min-content;
}

.k-toolbar .k-toolbar-overflow-button {
  margin-inline-start: auto;
}

.k-toolbar .k-toolbar-button-separator {
  height: calc(var(--kendo-line-height, normal) * 1em + var(--kendo-spacing-1, 0.25rem) * 2 + 1px * 2);
  margin-inline-start: auto;
}

.k-toolbar .k-toolbar-button-separator + .k-toolbar-overflow-button {
  margin-inline-start: 0;
}

.k-toolbar .k-toolbar-spacer {
  height: calc(1.4285714286 * 1em);
  flex: 1 0 0%;
}

.k-toolbar .k-toolbar-item:focus,
.k-toolbar .k-toolbar-item.k-focus {
  text-decoration: none;
  outline: 0;
}

.k-toolbar .k-separator,
.k-toolbar-separator {
  width: 0;
  height: calc(1.4285714286 * 1em);
  border-width: 0 0 0 1px;
  border-style: solid;
  align-self: center;
}

.k-toolbar-items {
  display: flex;
  flex-flow: row nowrap;
  gap: var(--kendo-spacing-2, 0.5rem);
  align-items: center;
  justify-content: flex-start;
  flex: 1 1 auto;
  overflow: hidden;
}

.k-toolbar-items-scroll {
  overflow-x: auto;
  scrollbar-width: none;
}

.k-toolbar-items-scroll::-webkit-scrollbar {
  display: none;
}

.k-toolbar-items-list {
  display: flex;
  flex-flow: row wrap;
  gap: var(--kendo-spacing-2, 0.5rem);
  align-items: center;
  justify-content: flex-start;
  flex: 1 1 auto;
  overflow: hidden;
}

.k-toolbar-outline {
  border-width: 1px;
  background: none;
}

.k-toolbar-flat {
  border-top-color: transparent !important;
  border-inline-color: transparent !important;
  background: none !important;
}

.k-toolbar-group {
  display: flex;
  flex-direction: inherit;
  flex-wrap: nowrap;
  gap: inherit;
}

.k-toolbar-sm {
  padding-block: var(--kendo-spacing-1, 0.25rem);
  padding-inline: var(--kendo-spacing-1, 0.25rem);
  gap: var(--kendo-spacing-1\.5, 0.375rem);
}

.k-toolbar-sm::before {
  margin-inline-start: calc(var(--kendo-spacing-1\.5, 0.375rem) * -1);
}

.k-toolbar-sm.k-toolbar-scrollable-overlay::before {
  inset-inline-start: var(--kendo-spacing-1\.5, 0.375rem);
}

.k-toolbar-sm > * > label {
  margin-inline-end: var(--kendo-spacing-1\.5, 0.375rem);
}

.k-toolbar-sm .k-toolbar-items {
  gap: var(--kendo-spacing-1\.5, 0.375rem);
}

.k-toolbar-sm .k-toolbar-button-separator {
  height: calc(var(--kendo-line-height, normal) * 1em + var(--kendo-spacing-0\.5, 0.125rem) * 2 + 1px * 2);
}

.k-toolbar-items-list-sm {
  padding-block: var(--kendo-spacing-1, 0.25rem);
  padding-inline: var(--kendo-spacing-1, 0.25rem);
  gap: var(--kendo-spacing-1\.5, 0.375rem);
}

.k-toolbar-md {
  padding-block: var(--kendo-spacing-2, 0.5rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
  gap: var(--kendo-spacing-2, 0.5rem);
}

.k-toolbar-md::before {
  margin-inline-start: calc(var(--kendo-spacing-2, 0.5rem) * -1);
}

.k-toolbar-md.k-toolbar-scrollable-overlay::before {
  inset-inline-start: var(--kendo-spacing-2, 0.5rem);
}

.k-toolbar-md > * > label {
  margin-inline-end: var(--kendo-spacing-2, 0.5rem);
}

.k-toolbar-md .k-toolbar-items {
  gap: var(--kendo-spacing-2, 0.5rem);
}

.k-toolbar-md .k-toolbar-button-separator {
  height: calc(var(--kendo-line-height, normal) * 1em + var(--kendo-spacing-1, 0.25rem) * 2 + 1px * 2);
}

.k-toolbar-items-list-md {
  padding-block: var(--kendo-spacing-2, 0.5rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
  gap: var(--kendo-spacing-2, 0.5rem);
}

.k-toolbar-lg {
  padding-block: var(--kendo-spacing-2\.5, 0.625rem);
  padding-inline: var(--kendo-spacing-2\.5, 0.625rem);
  gap: var(--kendo-spacing-2\.5, 0.625rem);
}

.k-toolbar-lg::before {
  margin-inline-start: calc(var(--kendo-spacing-2\.5, 0.625rem) * -1);
}

.k-toolbar-lg.k-toolbar-scrollable-overlay::before {
  inset-inline-start: var(--kendo-spacing-2\.5, 0.625rem);
}

.k-toolbar-lg > * > label {
  margin-inline-end: var(--kendo-spacing-2\.5, 0.625rem);
}

.k-toolbar-lg .k-toolbar-items {
  gap: var(--kendo-spacing-2\.5, 0.625rem);
}

.k-toolbar-lg .k-toolbar-button-separator {
  height: calc(var(--kendo-line-height-lg, normal) * 1em + var(--kendo-spacing-2, 0.5rem) * 2 + 1px * 2);
}

.k-toolbar-items-list-lg {
  padding-block: var(--kendo-spacing-2\.5, 0.625rem);
  padding-inline: var(--kendo-spacing-2\.5, 0.625rem);
  gap: var(--kendo-spacing-2\.5, 0.625rem);
}

.k-toolbar-sm::before {
  height: calc(var(--kendo-line-height, normal) * 1em + var(--kendo-spacing-0\.5, 0.125rem) * 2 + 1px * 2);
}

.k-toolbar-md::before {
  height: calc(var(--kendo-line-height, normal) * 1em + var(--kendo-spacing-1, 0.25rem) * 2 + 1px * 2);
}

.k-toolbar-lg::before {
  height: calc(var(--kendo-line-height-lg, normal) * 1em + var(--kendo-spacing-2, 0.5rem) * 2 + 1px * 2);
}

.k-floating-toolbar,
.editorToolbarWindow.k-window-content {
  padding-block: var(--kendo-spacing-2, 0.5rem) !important;
  padding-inline: var(--kendo-spacing-2, 0.5rem) !important;
  border-width: 1px;
  border-style: solid;
  display: flex;
  flex-flow: row nowrap;
  gap: var(--kendo-spacing-2, 0.5rem);
  align-items: center;
}

.k-floating-toolbar .k-toolbar,
.editorToolbarWindow.k-window-content .k-toolbar {
  padding: 0;
  border-width: 0;
  flex-shrink: 1;
  color: inherit;
  background: none;
}

.k-editortoolbar-dragHandle {
  cursor: move;
  display: flex;
  align-items: center;
  align-self: stretch;
  flex-shrink: 0;
}

.k-overflow-container {
  font-size: var(--kendo-font-size, inherit);
  line-height: var(--kendo-line-height, normal);
}

.k-overflow-container > .k-item {
  border-color: inherit;
}

.k-overflow-container .k-separator {
  margin: var(--kendo-spacing-1, 0.25rem) 0;
}

.k-overflow-container .k-overflow-tool-group {
  display: block;
}

.k-overflow-container .k-overflow-button {
  padding-block: var(--kendo-spacing-1, 0.25rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
  width: 100%;
  height: auto;
  border-width: 0;
  border-radius: 0;
  aspect-ratio: auto;
  color: inherit;
  background-color: transparent;
  background-image: none;
  font: inherit;
  cursor: pointer;
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  align-content: center;
  gap: var(--kendo-spacing-1, 0.25rem);
  justify-content: flex-start;
  position: relative;
}

.k-overflow-container .k-button-group {
  box-shadow: none;
  display: flex;
  flex-flow: column nowrap;
}

.k-overflow-container .k-button-group .k-button {
  margin: 0;
}

.k-overflow-container .k-split-button {
  display: flex;
  flex-direction: column;
}

.k-overflow-container .k-overflow-hidden {
  display: none;
}

.k-toolbar .k-toolbar-item:focus,
.k-toolbar .k-toolbar-item.k-focus {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--kendo-color-on-app-surface, #3d3d3d) 8%, transparent);
}

.k-toolbar-items {
  border-color: inherit;
}

.k-toolbar .k-separator,
.k-toolbar-separator {
  border-color: inherit;
}

.k-toolbar-solid {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
  color: var(--kendo-color-on-app-surface, #3d3d3d);
  background-color: var(--kendo-color-surface, #fafafa);
}

.k-toolbar-solid.k-toolbar-scrollable-overlay::before {
  background: linear-gradient(90deg, var(--kendo-color-surface, #fafafa), color-mix(in srgb, var(--kendo-color-app-surface, #ffffff) 0%, transparent));
}

.k-toolbar-solid.k-toolbar-scrollable-overlay::after {
  background: linear-gradient(270deg, var(--kendo-color-surface, #fafafa), color-mix(in srgb, var(--kendo-color-app-surface, #ffffff) 0%, transparent));
}

.k-toolbar-items-list-solid {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
}

.k-toolbar-outline {
  border-color: color-mix(in srgb, var(--kendo-color-on-base, #3d3d3d) 50%, transparent);
  color: var(--kendo-color-on-base, #3d3d3d);
}

.k-toolbar-outline.k-toolbar-scrollable-overlay::before {
  background: linear-gradient(90deg, var(--kendo-color-app-surface, #ffffff), color-mix(in srgb, var(--kendo-color-app-surface, #ffffff) 0%, transparent));
}

.k-toolbar-outline.k-toolbar-scrollable-overlay::after {
  background: linear-gradient(270deg, var(--kendo-color-app-surface, #ffffff), color-mix(in srgb, var(--kendo-color-app-surface, #ffffff) 0%, transparent));
}

.k-toolbar-items-list-outline {
  border-color: color-mix(in srgb, var(--kendo-color-on-base, #3d3d3d) 50%, transparent);
}

.k-toolbar-flat {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
}

.k-toolbar-flat > .k-separator,
.k-toolbar-flat .k-toolbar-separator {
  border-inline-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
}

.k-toolbar-flat.k-toolbar-scrollable-overlay::before {
  background: linear-gradient(90deg, var(--kendo-color-app-surface, #ffffff), color-mix(in srgb, var(--kendo-color-app-surface, #ffffff) 0%, transparent));
}

.k-toolbar-flat.k-toolbar-scrollable-overlay::after {
  background: linear-gradient(270deg, var(--kendo-color-app-surface, #ffffff), color-mix(in srgb, var(--kendo-color-app-surface, #ffffff) 0%, transparent));
}

.k-toolbar-items-list-flat {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
}

.k-floating-toolbar,
.editorToolbarWindow.k-window-content {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
  color: var(--kendo-color-on-app-surface, #3d3d3d);
  background-color: var(--kendo-color-surface, #fafafa);
}

.k-overflow-container .k-button:hover, .k-overflow-container .k-button.k-hover {
  color: var(--kendo-color-on-app-surface, #3d3d3d);
  background: var(--kendo-color-base-hover, #ebebeb);
}

.k-overflow-container .k-button:focus, .k-overflow-container .k-button.k-focus {
  box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.12);
}

.k-overflow-container .k-button:active, .k-overflow-container .k-button.k-active {
  color: var(--kendo-color-on-app-surface, #3d3d3d);
  background: var(--kendo-color-base-hover, #ebebeb);
}

.k-overflow-container .k-button.k-selected {
  color: var(--kendo-color-on-primary, #ffffff);
  background: var(--kendo-color-primary, #ff6358);
}

.k-overflow-container .k-button:disabled, .k-overflow-container .k-button.k-disabled {
  color: inherit;
}

:is(.k-rtl .k-toolbar-scrollable-overlay, [dir=rtl] .k-toolbar-scrollable-overlay, .k-toolbar-scrollable-overlay.k-rtl, .k-toolbar-scrollable-overlay[dir=rtl])::before {
  background: linear-gradient(270deg, var(--kendo-color-surface, #fafafa), color-mix(in srgb, var(--kendo-color-app-surface, #ffffff) 0%, transparent));
}

:is(.k-rtl .k-toolbar-scrollable-overlay, [dir=rtl] .k-toolbar-scrollable-overlay, .k-toolbar-scrollable-overlay.k-rtl, .k-toolbar-scrollable-overlay[dir=rtl])::after {
  background: linear-gradient(90deg, var(--kendo-color-surface, #fafafa), color-mix(in srgb, var(--kendo-color-app-surface, #ffffff) 0%, transparent));
}

:is(.k-rtl .k-toolbar-scrollable-overlay, [dir=rtl] .k-toolbar-scrollable-overlay, .k-toolbar-scrollable-overlay.k-rtl, .k-toolbar-scrollable-overlay[dir=rtl]).k-toolbar-outline::before {
  background: linear-gradient(270deg, var(--kendo-color-app-surface, #ffffff), color-mix(in srgb, var(--kendo-color-app-surface, #ffffff) 0%, transparent));
}

:is(.k-rtl .k-toolbar-scrollable-overlay, [dir=rtl] .k-toolbar-scrollable-overlay, .k-toolbar-scrollable-overlay.k-rtl, .k-toolbar-scrollable-overlay[dir=rtl]).k-toolbar-outline::after {
  background: linear-gradient(90deg, var(--kendo-color-app-surface, #ffffff), color-mix(in srgb, var(--kendo-color-app-surface, #ffffff) 0%, transparent));
}

:is(.k-rtl .k-toolbar-scrollable-overlay, [dir=rtl] .k-toolbar-scrollable-overlay, .k-toolbar-scrollable-overlay.k-rtl, .k-toolbar-scrollable-overlay[dir=rtl]).k-toolbar-flat::before {
  background: linear-gradient(270deg, var(--kendo-color-app-surface, #ffffff), color-mix(in srgb, var(--kendo-color-app-surface, #ffffff) 0%, transparent));
}

:is(.k-rtl .k-toolbar-scrollable-overlay, [dir=rtl] .k-toolbar-scrollable-overlay, .k-toolbar-scrollable-overlay.k-rtl, .k-toolbar-scrollable-overlay[dir=rtl]).k-toolbar-flat::after {
  background: linear-gradient(90deg, var(--kendo-color-app-surface, #ffffff), color-mix(in srgb, var(--kendo-color-app-surface, #ffffff) 0%, transparent));
}

.k-overflow-auto {
  overflow: auto;
}

.\!k-overflow-auto {
  overflow: auto !important;
}

.k-overflow-hidden {
  overflow: hidden;
}

.\!k-overflow-hidden {
  overflow: hidden !important;
}

.k-overflow-visible {
  overflow: visible;
}

.\!k-overflow-visible {
  overflow: visible !important;
}

.k-overflow-scroll {
  overflow: scroll;
}

.\!k-overflow-scroll {
  overflow: scroll !important;
}

.k-overflow-clip {
  overflow: clip;
}

.\!k-overflow-clip {
  overflow: clip !important;
}

.k-overflow-x-auto {
  overflow-x: auto;
}

.\!k-overflow-x-auto {
  overflow-x: auto !important;
}

.k-overflow-x-hidden {
  overflow-x: hidden;
}

.\!k-overflow-x-hidden {
  overflow-x: hidden !important;
}

.k-overflow-x-visible {
  overflow-x: visible;
}

.\!k-overflow-x-visible {
  overflow-x: visible !important;
}

.k-overflow-x-scroll {
  overflow-x: scroll;
}

.\!k-overflow-x-scroll {
  overflow-x: scroll !important;
}

.k-overflow-x-clip {
  overflow-x: clip;
}

.\!k-overflow-x-clip {
  overflow-x: clip !important;
}

.k-overflow-y-auto {
  overflow-y: auto;
}

.\!k-overflow-y-auto {
  overflow-y: auto !important;
}

.k-overflow-y-hidden {
  overflow-y: hidden;
}

.\!k-overflow-y-hidden {
  overflow-y: hidden !important;
}

.k-overflow-y-visible {
  overflow-y: visible;
}

.\!k-overflow-y-visible {
  overflow-y: visible !important;
}

.k-overflow-y-scroll {
  overflow-y: scroll;
}

.\!k-overflow-y-scroll {
  overflow-y: scroll !important;
}

.k-overflow-y-clip {
  overflow-y: clip;
}

.\!k-overflow-y-clip {
  overflow-y: clip !important;
}

.k-align-baseline {
  vertical-align: baseline;
}

.\!k-align-baseline {
  vertical-align: baseline !important;
}

.k-align-top {
  vertical-align: top;
}

.\!k-align-top {
  vertical-align: top !important;
}

.k-align-middle {
  vertical-align: middle;
}

.\!k-align-middle {
  vertical-align: middle !important;
}

.k-align-bottom {
  vertical-align: bottom;
}

.\!k-align-bottom {
  vertical-align: bottom !important;
}

.k-align-text-top {
  vertical-align: text-top;
}

.\!k-align-text-top {
  vertical-align: text-top !important;
}

.k-align-text-bottom {
  vertical-align: text-bottom;
}

.\!k-align-text-bottom {
  vertical-align: text-bottom !important;
}

.k-align-sub {
  vertical-align: sub;
}

.\!k-align-sub {
  vertical-align: sub !important;
}

.k-align-super {
  vertical-align: super;
}

.\!k-align-super {
  vertical-align: super !important;
}

.k-external-dropzone {
  height: 220px;
  display: flex;
  flex-flow: row nowrap;
}

.k-dropzone-inner {
  padding-block: var(--kendo-spacing-2, 0.5rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
  border-width: 1px;
  border-style: solid;
  box-sizing: border-box;
  font-size: var(--kendo-font-size, inherit);
  font-family: var(--kendo-font-family, inherit);
  line-height: var(--kendo-line-height, normal);
  flex: 1 1 auto;
  display: flex;
  flex-flow: column nowrap;
  align-items: center;
  justify-content: center;
  position: relative;
}

.k-dropzone-inner .k-dropzone-icon {
  margin-bottom: var(--kendo-spacing-6, 1.5rem);
}

.k-dropzone-inner .k-dropzone-hint {
  margin-bottom: var(--kendo-spacing-2, 0.5rem);
}

.k-dropzone-inner .k-dropzone-note {
  font-size: var(--kendo-font-size-sm, inherit);
}

.k-dropzone-inner {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
  color: var(--kendo-color-on-app-surface, #3d3d3d);
  background-color: var(--kendo-color-surface, #fafafa);
}

.k-dropzone-inner .k-icon,
.k-dropzone-inner .k-dropzone-icon {
  color: var(--kendo-color-subtle, #666666);
}

.k-dropzone-inner .k-dropzone-note {
  color: var(--kendo-color-subtle, #666666);
}

.k-external-dropzone-hover .k-icon,
.k-external-dropzone-hover .k-dropzone-icon {
  color: var(--kendo-color-primary, #ff6358);
}

.k-upload {
  border-width: 1px;
  border-style: solid;
  box-sizing: border-box;
  outline: 0;
  font-family: var(--kendo-font-family, inherit);
  font-size: var(--kendo-font-size, inherit);
  line-height: var(--kendo-line-height, normal);
  position: relative;
  display: block;
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.k-upload *,
.k-upload *::before,
.k-upload *::after {
  box-sizing: border-box;
}

.k-upload .k-upload-button {
  min-width: 7em;
}

.k-upload .k-dropzone,
.k-upload .k-upload-dropzone {
  padding-block: var(--kendo-spacing-2, 0.5rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
  border-width: 0;
  text-align: end;
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
  background-color: transparent;
}

.k-upload .k-dropzone .k-dropzone-hint,
.k-upload .k-upload-dropzone .k-dropzone-hint {
  font-style: normal;
  font-weight: normal;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  position: relative;
  flex: 1;
}

.k-upload .k-dropzone .k-upload-status,
.k-upload .k-upload-dropzone .k-upload-status {
  font-weight: normal;
  display: flex;
  align-items: center;
  position: relative;
}

.k-upload .k-dropzone .k-upload-status > .k-icon,
.k-upload .k-upload-dropzone .k-upload-status > .k-icon {
  margin-inline-end: var(--kendo-spacing-1, 0.25rem);
}

.k-upload .k-dropzone .k-upload-status + .k-dropzone-hint,
.k-upload .k-upload-dropzone .k-upload-status + .k-dropzone-hint {
  display: none;
}

.k-upload .k-dropzone-active .k-upload-status {
  display: none;
}

.k-upload .k-dropzone-active .k-upload-status + .k-dropzone-hint {
  display: block;
}

.k-upload .k-upload-files {
  max-height: 300px;
  overflow-y: auto;
  margin: 0;
  padding: 0;
  border-width: 1px 0 0;
  border-style: solid;
  border-color: inherit;
  list-style: none;
}

.k-upload .k-upload-files .k-file-multiple,
.k-upload .k-upload-files .k-file-single {
  width: 100%;
  display: flex;
  justify-content: space-between;
}

.k-upload .k-upload-files .k-file-single {
  align-items: center;
}

.k-upload .k-upload-files .k-file-multiple {
  align-items: flex-start;
}

.k-upload .k-upload-files .k-file {
  padding: var(--kendo-spacing-2, 0.5rem) var(--kendo-spacing-2, 0.5rem) calc(var(--kendo-spacing-2, 0.5rem) + 2px);
  border-width: 0 0 1px;
  border-style: solid;
  outline: none;
  display: flex;
  align-items: flex-start;
  position: relative;
}

.k-upload .k-upload-files .k-file:last-child {
  border-width: 0;
}

.k-upload .k-upload-files .k-filename {
  margin-left: var(--kendo-spacing-4, 1rem);
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  position: relative;
}

.k-upload .k-upload-files .k-upload-pct {
  margin-block: 0;
  margin-inline: var(--kendo-spacing-1, 0.25rem);
  font-weight: normal;
  vertical-align: middle;
}

.k-upload .k-upload-files ~ .k-clear-selected,
.k-upload .k-upload-files ~ .k-upload-selected {
  margin-top: calc(-1 * var(--kendo-spacing-1, 0.25rem));
  border-width: 0;
}

.k-upload .k-upload-files ~ .k-upload-selected {
  border-left-width: 1px;
  border-left-style: solid;
  margin-left: -1px;
}

.k-upload .k-upload-files .k-file-name,
.k-upload .k-upload-files .k-file-size,
.k-upload .k-upload-files .k-file-validation-message,
.k-upload .k-upload-files .k-file-summary {
  display: block;
}

.k-upload .k-upload-files .k-file-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  position: relative;
}

.k-upload .k-upload-files .k-file-size,
.k-upload .k-upload-files .k-file-summary,
.k-upload .k-upload-files .k-file-validation-message {
  font-size: var(--kendo-font-size-sm, inherit);
  line-height: var(--kendo-line-height-xs, normal);
}

.k-upload .k-upload-files .k-file-icon-wrapper .k-file-state {
  position: absolute;
}

.k-upload .k-upload-files .k-file-state {
  visibility: hidden;
}

.k-upload .k-upload-files .k-file-info {
  min-height: calc(16px * 2);
  display: block;
  overflow: hidden;
  flex: 1 0 0;
}

.k-upload .k-multiple-files-wrapper,
.k-upload .k-file-single > .k-file-info {
  margin-inline-start: var(--kendo-spacing-2, 0.5rem);
  min-height: calc(16px * 2);
  display: block;
  overflow: hidden;
  flex: 1 0 0;
}

.k-upload .k-multiple-files-wrapper .k-file-info {
  margin-bottom: var(--kendo-spacing-3, 0.75rem);
  display: block;
}

.k-upload .k-multiple-files-wrapper .k-file-summary {
  margin-top: calc(var(--kendo-spacing-3, 0.75rem) / 3 * -1);
}

.k-upload .k-progressbar {
  --kendo-progressbar-height: 2px;
  position: absolute;
  left: var(--kendo-spacing-2, 0.5rem);
  right: var(--kendo-spacing-2, 0.5rem);
  bottom: calc(var(--kendo-spacing-2, 0.5rem) / 2);
  width: auto;
}

.k-upload .k-actions, .k-upload .k-form-buttons, .k-upload .k-edit-buttons,
.k-upload .k-action-buttons,
.k-upload .k-columnmenu-actions {
  border-top-width: 1px;
}

.k-upload-button-wrap {
  position: relative;
  direction: ltr;
}

.k-upload-button-wrap input {
  font: 170px monospace !important;
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: 1;
}

.k-upload-button-wrap input[disabled],
.k-upload-button-wrap input.k-disabled {
  visibility: hidden;
}

.k-upload {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
  color: var(--kendo-color-on-app-surface, #3d3d3d);
  background-color: var(--kendo-color-surface-alt, #ffffff);
}

.k-upload .k-dropzone,
.k-upload .k-upload-dropzone {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
  color: var(--kendo-color-on-app-surface, #3d3d3d);
  background-color: var(--kendo-color-surface, #fafafa);
}

.k-upload .k-dropzone.k-hover,
.k-upload .k-upload-dropzone.k-hover {
  background-color: var(--kendo-color-base-hover, #ebebeb);
}

.k-upload .k-dropzone .k-dropzone-hint,
.k-upload .k-upload-dropzone .k-dropzone-hint {
  color: var(--kendo-color-subtle, #666666);
}

.k-upload .k-upload-files,
.k-upload .k-file {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
}

.k-upload .k-file.k-focus {
  box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.13);
}

.k-upload .k-file .k-upload-action.k-focus {
  box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.13);
}

.k-upload .k-upload-status {
  color: var(--kendo-color-subtle, #666666);
}

.k-upload .k-file-progress .k-progressbar .k-selected {
  background-color: var(--kendo-color-info, #0058e9);
}

.k-upload .k-file-success .k-file-validation-message {
  color: var(--kendo-color-success, #37b400);
}

.k-upload .k-file-success .k-progressbar .k-selected {
  background-color: var(--kendo-color-success, #37b400);
}

.k-upload .k-file-error .k-file-validation-message {
  color: var(--kendo-color-error, #f31700);
}

.k-upload .k-file-error .k-progressbar .k-selected {
  background-color: var(--kendo-color-error, #f31700);
}

.k-upload .k-file-icon-wrapper {
  color: var(--kendo-color-subtle, #666666);
  border-color: var(--kendo-color-subtle, #666666);
}

.k-upload .k-file-size,
.k-upload .k-file-validation-message,
.k-upload .k-file-summary {
  color: var(--kendo-color-subtle, #666666);
}

.k-upload .k-multiple-files-wrapper .k-file-summary {
  color: var(--kendo-color-on-app-surface, #3d3d3d);
}

.k-upload.k-invalid, .k-upload.ng-invalid.ng-touched, .k-upload.ng-invalid.ng-dirty {
  border-color: var(--kendo-color-error, #f31700);
}

.k-overlay {
  width: 100%;
  height: 100%;
  opacity: 0.5;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10001;
}

.k-overlay {
  background-color: #000000;
}

.k-overlay-primary {
  background-color: var(--kendo-color-primary, #ff6358);
}

.k-overlay-secondary {
  background-color: var(--kendo-color-secondary, #666666);
}

.k-overlay-tertiary {
  background-color: var(--kendo-color-tertiary, #03a9f4);
}

.k-overlay-info {
  background-color: var(--kendo-color-info, #0058e9);
}

.k-overlay-success {
  background-color: var(--kendo-color-success, #37b400);
}

.k-overlay-warning {
  background-color: var(--kendo-color-warning, #ffc000);
}

.k-overlay-error {
  background-color: var(--kendo-color-error, #f31700);
}

.k-overlay-dark {
  background-color: var(--kendo-color-dark, #3d3d3d);
}

.k-overlay-light {
  background-color: var(--kendo-color-light, #ebebeb);
}

.k-overlay-inverse {
  background-color: var(--kendo-color-dark, #3d3d3d);
}

.k-form,
.k-form-inline {
  font-size: var(--kendo-font-size, inherit);
  line-height: var(--kendo-line-height, normal);
}

.k-fieldset {
  margin: var(--kendo-spacing-7\.5, 1.875rem);
  border-width: 1px 0 0;
  border-style: solid;
  padding: 25px 0 0;
}

.k-fieldset > legend {
  margin-left: 0;
  padding: 0 var(--kendo-spacing-2, 0.5rem) 0 0;
  text-transform: uppercase;
}

kendo-label > .k-label {
  margin: 0;
}

.k-label-optional {
  margin-left: var(--kendo-spacing-1\.5, 0.375rem);
  font-size: var(--kendo-font-size-sm, inherit);
  font-style: italic;
  align-self: center;
}

.k-label-empty::before {
  content: "";
  display: inline-block;
}

.k-form {
  border: 0;
}

.k-form .k-form-field > .k-label,
.k-form .k-form-field > kendo-label,
.k-form .k-form-label {
  margin-bottom: var(--kendo-spacing-0, 0px);
  display: flex;
  flex-flow: row nowrap;
}

.k-form .k-label + .k-radio {
  margin-left: 0;
}

.k-form .k-form-fieldset {
  margin: 2em 0 0;
  padding: var(--kendo-spacing-0, 0px);
  border: 0;
}

.k-form .k-form-fieldset > *:not(.k-hidden):first-child, .k-form .k-form-fieldset > *.k-hidden + :not(.k-hidden) {
  margin-top: 0;
}

.k-form .k-form-legend {
  margin: 0 0 1em;
  padding: var(--kendo-spacing-0, 0px);
  border-width: 0 0 2px;
  border-style: solid;
  width: 100%;
  font-size: var(--kendo-font-size, inherit);
  text-transform: uppercase;
}

.k-form .k-form-group {
  padding: 0;
}

.k-form > *:not(.k-hidden):first-child, .k-form > *.k-hidden + :not(.k-hidden) {
  margin-top: 0;
}

.k-form .k-form-field,
.k-form .k-form-field-wrap {
  display: block;
}

.k-form .k-form-field-disabled .k-label,
.k-form .k-form-field-disabled .k-form-label {
  outline: none;
  cursor: default;
  opacity: 0.6;
  filter: grayscale(0.1);
  pointer-events: none;
  box-shadow: none;
}

.k-form .k-alert-error {
  font-size: var(--kendo-font-size-sm, inherit);
  margin-top: calc(var(--kendo-spacing-1, 0.25rem) * 2);
}

.k-form .k-field-info {
  display: inline-block;
  font-size: var(--kendo-font-size-xs, inherit);
  line-height: 1;
  margin-block: 0;
  margin-inline: var(--kendo-spacing-2, 0.5rem);
}

.k-form .k-multiselect,
.k-form .k-floating-label-container,
.k-form .k-daterangepicker .k-dateinput,
.k-form .k-signature {
  display: inline-flex;
  width: 100%;
}

.k-form-buttons {
  padding: 0;
  overflow: visible;
}

.k-form-hint,
.k-form-error {
  margin-top: var(--kendo-spacing-1, 0.25rem);
  display: flex;
  font-size: var(--kendo-font-size-sm, inherit);
  font-style: italic;
}

.k-text-start,
.k-buttons-start {
  justify-content: flex-start;
}

.k-text-end,
.k-buttons-end {
  justify-content: flex-end;
}

.k-form-separator {
  margin: var(--kendo-spacing-3\.5, 0.875rem) 0 0;
  border-width: 1px 0 0;
  border-style: solid;
  display: block;
  flex: 0 0 auto;
}

.k-form-horizontal .k-form-field {
  display: flex;
}

.k-form-horizontal .k-form-field > .k-label,
.k-form-horizontal .k-form-field > kendo-label,
.k-form-horizontal .k-form-field > .k-form-label {
  margin-right: var(--kendo-spacing-2\.5, 0.625rem);
  padding-top: calc(var(--kendo-spacing-2\.5, 0.625rem) / 2);
  width: 25%;
  text-align: end;
  flex-direction: column;
  align-items: flex-end;
  justify-content: flex-start;
}

.k-form-horizontal .k-form-field .k-label-optional {
  margin: 0;
  align-self: inherit;
}

.k-form-horizontal .k-form-field-wrap {
  max-width: calc(100% - 25% - var(--kendo-spacing-2\.5, 0.625rem));
  flex: 1 1 auto;
}

.k-form [dir=rtl] .k-label-optional,
.k-rtl .k-form .k-label-optional {
  margin-left: 0;
  margin-right: var(--kendo-spacing-1\.5, 0.375rem);
}

.k-form-horizontal [dir=rtl].k-form-field > .k-label,
.k-form-horizontal [dir=rtl].k-form-field > kendo-label,
.k-form-horizontal [dir=rtl].k-form-field > .k-form-label,
.k-form-horizontal [dir=rtl] .k-form-field > .k-label,
.k-form-horizontal [dir=rtl] .k-form-field > kendo-label,
.k-form-horizontal [dir=rtl] .k-form-field > .k-form-label,
.k-rtl .k-form-horizontal.k-form-field > .k-label,
.k-rtl .k-form-horizontal.k-form-field > kendo-label,
.k-rtl .k-form-horizontal.k-form-field > .k-form-label,
.k-rtl .k-form-horizontal .k-form-field > .k-label,
.k-rtl .k-form-horizontal .k-form-field > kendo-label,
.k-rtl .k-form-horizontal .k-form-field > .k-form-label {
  margin-right: 0;
  margin-left: var(--kendo-spacing-2\.5, 0.625rem);
}

.k-form-sm .k-form-field,
.k-form-sm .k-form-buttons {
  margin-top: var(--kendo-spacing-2\.5, 0.625rem);
}

.k-form-md .k-form-field,
.k-form-md .k-form-buttons {
  margin-top: var(--kendo-spacing-3\.5, 0.875rem);
}

.k-form-lg .k-form-field,
.k-form-lg .k-form-buttons {
  margin-top: var(--kendo-spacing-4\.5, 1.125rem);
}

.k-form-inline {
  padding: calc(var(--kendo-spacing-2, 0.5rem) * 2);
}

.k-form-inline fieldset {
  border-width: 1px 0 0;
  border-style: solid;
  margin: calc(calc(var(--kendo-spacing-2, 0.5rem) * 2) * 2) 0;
  padding: 0;
}

.k-form-inline fieldset:first-child:first-of-type {
  margin-top: 0;
}

.k-form-inline fieldset:last-child:last-of-type {
  margin-bottom: 0;
}

.k-form-inline legend {
  font-size: var(--kendo-font-size-sm, inherit);
  text-align: start;
  font-weight: 600;
  line-height: 1;
  margin-bottom: calc(var(--kendo-spacing-1\.5, 0.375rem) * 2);
  text-transform: uppercase;
  padding: 0 var(--kendo-spacing-2, 0.5rem) 0 0;
  width: auto;
}

.k-form-inline .k-form-field {
  display: flex;
  align-items: flex-start;
  text-align: start;
  margin-bottom: calc(var(--kendo-spacing-1\.5, 0.375rem) * 2);
}

.k-form-inline .k-form-field > span:not(.k-widget) {
  width: 25%;
  text-align: end;
  line-height: var(--kendo-line-height, normal);
  padding-block: calc(var(--kendo-spacing-1, 0.25rem) + 1px);
  padding-inline: 0 var(--kendo-spacing-3, 0.75rem);
  align-self: center;
}

.k-form-inline .k-form-field > input {
  align-self: center;
}

.k-form-inline .k-form-field > input:not(.k-checkbox):not(.k-radio) {
  flex: 1 1 auto;
}

.k-form-inline .k-form-field .k-alert-error {
  font-size: var(--kendo-font-size-sm, inherit);
  margin-top: calc(var(--kendo-spacing-1, 0.25rem) * 2);
}

.k-form-inline .k-form-field .k-field-info {
  display: block;
  font-size: var(--kendo-font-size-xs, inherit);
  line-height: 1;
  margin: 0;
}

.k-form-inline .k-form-field:last-child {
  margin-bottom: 0;
}

.k-edit-form-container {
  width: 400px;
  min-width: 400px;
  border-color: inherit;
  position: relative;
}

.k-popup-edit-form > .k-actions, .k-popup-edit-form > .k-edit-buttons,
.k-popup-edit-form > .k-action-buttons,
.k-popup-edit-form > .k-columnmenu-actions, .k-popup-edit-form > .k-form-buttons,
.k-edit-form-container .k-actions,
.k-edit-form-container .k-edit-buttons,
.k-edit-form-container .k-action-buttons,
.k-edit-form-container .k-columnmenu-actions,
.k-edit-form-container .k-form-buttons {
  margin: var(--kendo-spacing-4, 1rem) calc(var(--kendo-spacing-4, 1rem) * -1) calc(var(--kendo-spacing-4, 1rem) * -1);
}

.k-edit-label {
  margin: 0 0 var(--kendo-spacing-4, 1rem);
  padding: calc(var(--kendo-spacing-1, 0.25rem) + 1px) 0;
  width: 30%;
  line-height: var(--kendo-line-height, normal);
  text-align: end;
  float: left;
  clear: both;
}

.k-edit-field {
  margin: 0 0 var(--kendo-spacing-4, 1rem);
  width: 65%;
  float: right;
  clear: right;
  position: relative;
}

.k-edit-field.k-no-editor {
  padding: calc(var(--kendo-spacing-1, 0.25rem) + 1px) 0;
}

.k-edit-field > .k-widget {
  width: 100%;
  box-sizing: border-box;
}

.k-edit-field input[type=radio]:not(.k-radio),
.k-edit-field input[type=checkbox]:not(.k-checkbox) {
  margin-right: 0.4ex;
}

.k-edit-field .k-radio-label,
.k-edit-field .k-checkbox-label {
  margin-right: var(--kendo-spacing-4, 1rem);
}

.k-edit-field > .k-reset > li + li {
  margin-top: var(--kendo-spacing-2, 0.5rem);
}

.k-edit-field .k-reset .k-widget {
  margin: 0 0.4ex 0 1ex;
}

.k-form,
.k-form-inline {
  color: var(--kendo-color-on-app-surface, #3d3d3d);
}

.k-form fieldset legend,
.k-form-inline fieldset legend {
  color: var(--kendo-color-on-app-surface, #3d3d3d);
}

.k-form .k-form-legend,
.k-form-inline .k-form-legend {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
}

.k-form .k-field-info,
.k-form-inline .k-field-info {
  color: var(--kendo-color-subtle, #666666);
}

.k-form .k-alert-error,
.k-form-inline .k-alert-error {
  color: var(--kendo-color-error, #f31700);
}

.k-form-error,
.k-text-error,
.k-form-field-error .k-label {
  color: var(--kendo-color-error, #f31700);
}

.k-form-separator {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
}

.k-d-none {
  display: none;
}

.\!k-d-none {
  display: none !important;
}

.k-d-contents {
  display: contents;
}

.\!k-d-contents {
  display: contents !important;
}

.k-d-block {
  display: block;
}

.\!k-d-block {
  display: block !important;
}

.k-d-inline {
  display: inline;
}

.\!k-d-inline {
  display: inline !important;
}

.k-d-inline-block {
  display: inline-block;
}

.\!k-d-inline-block {
  display: inline-block !important;
}

.k-d-flex, .k-d-flex-col, .k-d-flex-row {
  display: flex;
}

.\!k-d-flex, .\!k-d-flex-col, .\!k-d-flex-row {
  display: flex !important;
}

.k-d-inline-flex {
  display: inline-flex;
}

.\!k-d-inline-flex {
  display: inline-flex !important;
}

.k-d-grid {
  display: grid;
}

.\!k-d-grid {
  display: grid !important;
}

.k-d-inline-grid {
  display: inline-grid;
}

.\!k-d-inline-grid {
  display: inline-grid !important;
}

.k-d-table {
  display: table;
}

.\!k-d-table {
  display: table !important;
}

.k-d-inline-table {
  display: inline-table;
}

.\!k-d-inline-table {
  display: inline-table !important;
}

.k-d-table-row {
  display: table-row;
}

.\!k-d-table-row {
  display: table-row !important;
}

.k-d-table-cell {
  display: table-cell;
}

.\!k-d-table-cell {
  display: table-cell !important;
}

.k-d-list-item {
  display: list-item;
}

.\!k-d-list-item {
  display: list-item !important;
}

.k-display-none {
  display: none;
}

.\!k-display-none {
  display: none !important;
}

.k-display-contents {
  display: contents;
}

.\!k-display-contents {
  display: contents !important;
}

.k-display-block {
  display: block;
}

.\!k-display-block {
  display: block !important;
}

.k-display-inline {
  display: inline;
}

.\!k-display-inline {
  display: inline !important;
}

.k-display-inline-block {
  display: inline-block;
}

.\!k-display-inline-block {
  display: inline-block !important;
}

.k-display-flex {
  display: flex;
}

.\!k-display-flex {
  display: flex !important;
}

.k-display-inline-flex {
  display: inline-flex;
}

.\!k-display-inline-flex {
  display: inline-flex !important;
}

.k-display-grid {
  display: grid;
}

.\!k-display-grid {
  display: grid !important;
}

.k-display-inline-grid {
  display: inline-grid;
}

.\!k-display-inline-grid {
  display: inline-grid !important;
}

.k-display-table {
  display: table;
}

.\!k-display-table {
  display: table !important;
}

.k-display-inline-table {
  display: inline-table;
}

.\!k-display-inline-table {
  display: inline-table !important;
}

.k-display-table-row {
  display: table-row;
}

.\!k-display-table-row {
  display: table-row !important;
}

.k-display-table-cell {
  display: table-cell;
}

.\!k-display-table-cell {
  display: table-cell !important;
}

.k-display-list-item {
  display: list-item;
}

.\!k-display-list-item {
  display: list-item !important;
}

.k-gap-0 {
  gap: var(--kendo-spacing-0, 0px);
}

.\!k-gap-0 {
  gap: var(--kendo-spacing-0, 0px) !important;
}

.k-gap-1px {
  gap: var(--kendo-spacing-1px, 1px);
}

.\!k-gap-1px {
  gap: var(--kendo-spacing-1px, 1px) !important;
}

.k-gap-0\.5 {
  gap: var(--kendo-spacing-0\.5, 0.125rem);
}

.\!k-gap-0\.5 {
  gap: var(--kendo-spacing-0\.5, 0.125rem) !important;
}

.k-gap-1 {
  gap: var(--kendo-spacing-1, 0.25rem);
}

.\!k-gap-1 {
  gap: var(--kendo-spacing-1, 0.25rem) !important;
}

.k-gap-1\.5 {
  gap: var(--kendo-spacing-1\.5, 0.375rem);
}

.\!k-gap-1\.5 {
  gap: var(--kendo-spacing-1\.5, 0.375rem) !important;
}

.k-gap-2 {
  gap: var(--kendo-spacing-2, 0.5rem);
}

.\!k-gap-2 {
  gap: var(--kendo-spacing-2, 0.5rem) !important;
}

.k-gap-2\.5 {
  gap: var(--kendo-spacing-2\.5, 0.625rem);
}

.\!k-gap-2\.5 {
  gap: var(--kendo-spacing-2\.5, 0.625rem) !important;
}

.k-gap-3 {
  gap: var(--kendo-spacing-3, 0.75rem);
}

.\!k-gap-3 {
  gap: var(--kendo-spacing-3, 0.75rem) !important;
}

.k-gap-3\.5 {
  gap: var(--kendo-spacing-3\.5, 0.875rem);
}

.\!k-gap-3\.5 {
  gap: var(--kendo-spacing-3\.5, 0.875rem) !important;
}

.k-gap-4 {
  gap: var(--kendo-spacing-4, 1rem);
}

.\!k-gap-4 {
  gap: var(--kendo-spacing-4, 1rem) !important;
}

.k-gap-4\.5 {
  gap: var(--kendo-spacing-4\.5, 1.125rem);
}

.\!k-gap-4\.5 {
  gap: var(--kendo-spacing-4\.5, 1.125rem) !important;
}

.k-gap-5 {
  gap: var(--kendo-spacing-5, 1.25rem);
}

.\!k-gap-5 {
  gap: var(--kendo-spacing-5, 1.25rem) !important;
}

.k-gap-5\.5 {
  gap: var(--kendo-spacing-5\.5, 1.375rem);
}

.\!k-gap-5\.5 {
  gap: var(--kendo-spacing-5\.5, 1.375rem) !important;
}

.k-gap-6 {
  gap: var(--kendo-spacing-6, 1.5rem);
}

.\!k-gap-6 {
  gap: var(--kendo-spacing-6, 1.5rem) !important;
}

.k-gap-6\.5 {
  gap: var(--kendo-spacing-6\.5, 1.625rem);
}

.\!k-gap-6\.5 {
  gap: var(--kendo-spacing-6\.5, 1.625rem) !important;
}

.k-gap-7 {
  gap: var(--kendo-spacing-7, 1.75rem);
}

.\!k-gap-7 {
  gap: var(--kendo-spacing-7, 1.75rem) !important;
}

.k-gap-7\.5 {
  gap: var(--kendo-spacing-7\.5, 1.875rem);
}

.\!k-gap-7\.5 {
  gap: var(--kendo-spacing-7\.5, 1.875rem) !important;
}

.k-gap-8 {
  gap: var(--kendo-spacing-8, 2rem);
}

.\!k-gap-8 {
  gap: var(--kendo-spacing-8, 2rem) !important;
}

.k-gap-9 {
  gap: var(--kendo-spacing-9, 2.25rem);
}

.\!k-gap-9 {
  gap: var(--kendo-spacing-9, 2.25rem) !important;
}

.k-gap-10 {
  gap: var(--kendo-spacing-10, 2.5rem);
}

.\!k-gap-10 {
  gap: var(--kendo-spacing-10, 2.5rem) !important;
}

.k-gap-11 {
  gap: var(--kendo-spacing-11, 2.75rem);
}

.\!k-gap-11 {
  gap: var(--kendo-spacing-11, 2.75rem) !important;
}

.k-gap-12 {
  gap: var(--kendo-spacing-12, 3rem);
}

.\!k-gap-12 {
  gap: var(--kendo-spacing-12, 3rem) !important;
}

.k-gap-13 {
  gap: var(--kendo-spacing-13, 3.25rem);
}

.\!k-gap-13 {
  gap: var(--kendo-spacing-13, 3.25rem) !important;
}

.k-gap-14 {
  gap: var(--kendo-spacing-14, 3.5rem);
}

.\!k-gap-14 {
  gap: var(--kendo-spacing-14, 3.5rem) !important;
}

.k-gap-15 {
  gap: var(--kendo-spacing-15, 3.75rem);
}

.\!k-gap-15 {
  gap: var(--kendo-spacing-15, 3.75rem) !important;
}

.k-gap-16 {
  gap: var(--kendo-spacing-16, 4rem);
}

.\!k-gap-16 {
  gap: var(--kendo-spacing-16, 4rem) !important;
}

.k-gap-17 {
  gap: var(--kendo-spacing-17, 4.25rem);
}

.\!k-gap-17 {
  gap: var(--kendo-spacing-17, 4.25rem) !important;
}

.k-gap-18 {
  gap: var(--kendo-spacing-18, 4.5rem);
}

.\!k-gap-18 {
  gap: var(--kendo-spacing-18, 4.5rem) !important;
}

.k-gap-19 {
  gap: var(--kendo-spacing-19, 4.75rem);
}

.\!k-gap-19 {
  gap: var(--kendo-spacing-19, 4.75rem) !important;
}

.k-gap-20 {
  gap: var(--kendo-spacing-20, 5rem);
}

.\!k-gap-20 {
  gap: var(--kendo-spacing-20, 5rem) !important;
}

.k-gap-21 {
  gap: var(--kendo-spacing-21, 5.25rem);
}

.\!k-gap-21 {
  gap: var(--kendo-spacing-21, 5.25rem) !important;
}

.k-gap-22 {
  gap: var(--kendo-spacing-22, 5.5rem);
}

.\!k-gap-22 {
  gap: var(--kendo-spacing-22, 5.5rem) !important;
}

.k-gap-23 {
  gap: var(--kendo-spacing-23, 5.75rem);
}

.\!k-gap-23 {
  gap: var(--kendo-spacing-23, 5.75rem) !important;
}

.k-gap-24 {
  gap: var(--kendo-spacing-24, 6rem);
}

.\!k-gap-24 {
  gap: var(--kendo-spacing-24, 6rem) !important;
}

.k-gap-25 {
  gap: var(--kendo-spacing-25, 7rem);
}

.\!k-gap-25 {
  gap: var(--kendo-spacing-25, 7rem) !important;
}

.k-gap-26 {
  gap: var(--kendo-spacing-26, 8rem);
}

.\!k-gap-26 {
  gap: var(--kendo-spacing-26, 8rem) !important;
}

.k-gap-27 {
  gap: var(--kendo-spacing-27, 9rem);
}

.\!k-gap-27 {
  gap: var(--kendo-spacing-27, 9rem) !important;
}

.k-gap-28 {
  gap: var(--kendo-spacing-28, 10rem);
}

.\!k-gap-28 {
  gap: var(--kendo-spacing-28, 10rem) !important;
}

.k-gap-29 {
  gap: var(--kendo-spacing-29, 11rem);
}

.\!k-gap-29 {
  gap: var(--kendo-spacing-29, 11rem) !important;
}

.k-gap-30 {
  gap: var(--kendo-spacing-30, 12rem);
}

.\!k-gap-30 {
  gap: var(--kendo-spacing-30, 12rem) !important;
}

.k-gap-xs {
  gap: var(--kendo-spacing-xs, var(--kendo-spacing-1, 0.25rem));
}

.\!k-gap-xs {
  gap: var(--kendo-spacing-xs, var(--kendo-spacing-1, 0.25rem)) !important;
}

.k-gap-sm {
  gap: var(--kendo-spacing-sm, var(--kendo-spacing-2, 0.5rem));
}

.\!k-gap-sm {
  gap: var(--kendo-spacing-sm, var(--kendo-spacing-2, 0.5rem)) !important;
}

.k-gap-md {
  gap: var(--kendo-spacing-md, var(--kendo-spacing-3, 0.75rem));
}

.\!k-gap-md {
  gap: var(--kendo-spacing-md, var(--kendo-spacing-3, 0.75rem)) !important;
}

.k-gap-lg {
  gap: var(--kendo-spacing-lg, var(--kendo-spacing-4, 1rem));
}

.\!k-gap-lg {
  gap: var(--kendo-spacing-lg, var(--kendo-spacing-4, 1rem)) !important;
}

.k-gap-xl {
  gap: var(--kendo-spacing-xl, var(--kendo-spacing-6, 1.5rem));
}

.\!k-gap-xl {
  gap: var(--kendo-spacing-xl, var(--kendo-spacing-6, 1.5rem)) !important;
}

.k-gap-thin {
  gap: var(--kendo-spacing-thin, var(--kendo-spacing-0\.5, 0.125rem));
}

.\!k-gap-thin {
  gap: var(--kendo-spacing-thin, var(--kendo-spacing-0\.5, 0.125rem)) !important;
}

.k-gap-hair {
  gap: var(--kendo-spacing-hair, var(--kendo-spacing-1px, 1px));
}

.\!k-gap-hair {
  gap: var(--kendo-spacing-hair, var(--kendo-spacing-1px, 1px)) !important;
}

.k-gap-x-0 {
  -moz-column-gap: var(--kendo-spacing-0, 0px);
       column-gap: var(--kendo-spacing-0, 0px);
}

.\!k-gap-x-0 {
  -moz-column-gap: var(--kendo-spacing-0, 0px) !important;
       column-gap: var(--kendo-spacing-0, 0px) !important;
}

.k-gap-x-1px {
  -moz-column-gap: var(--kendo-spacing-1px, 1px);
       column-gap: var(--kendo-spacing-1px, 1px);
}

.\!k-gap-x-1px {
  -moz-column-gap: var(--kendo-spacing-1px, 1px) !important;
       column-gap: var(--kendo-spacing-1px, 1px) !important;
}

.k-gap-x-0\.5 {
  -moz-column-gap: var(--kendo-spacing-0\.5, 0.125rem);
       column-gap: var(--kendo-spacing-0\.5, 0.125rem);
}

.\!k-gap-x-0\.5 {
  -moz-column-gap: var(--kendo-spacing-0\.5, 0.125rem) !important;
       column-gap: var(--kendo-spacing-0\.5, 0.125rem) !important;
}

.k-gap-x-1 {
  -moz-column-gap: var(--kendo-spacing-1, 0.25rem);
       column-gap: var(--kendo-spacing-1, 0.25rem);
}

.\!k-gap-x-1 {
  -moz-column-gap: var(--kendo-spacing-1, 0.25rem) !important;
       column-gap: var(--kendo-spacing-1, 0.25rem) !important;
}

.k-gap-x-1\.5 {
  -moz-column-gap: var(--kendo-spacing-1\.5, 0.375rem);
       column-gap: var(--kendo-spacing-1\.5, 0.375rem);
}

.\!k-gap-x-1\.5 {
  -moz-column-gap: var(--kendo-spacing-1\.5, 0.375rem) !important;
       column-gap: var(--kendo-spacing-1\.5, 0.375rem) !important;
}

.k-gap-x-2 {
  -moz-column-gap: var(--kendo-spacing-2, 0.5rem);
       column-gap: var(--kendo-spacing-2, 0.5rem);
}

.\!k-gap-x-2 {
  -moz-column-gap: var(--kendo-spacing-2, 0.5rem) !important;
       column-gap: var(--kendo-spacing-2, 0.5rem) !important;
}

.k-gap-x-2\.5 {
  -moz-column-gap: var(--kendo-spacing-2\.5, 0.625rem);
       column-gap: var(--kendo-spacing-2\.5, 0.625rem);
}

.\!k-gap-x-2\.5 {
  -moz-column-gap: var(--kendo-spacing-2\.5, 0.625rem) !important;
       column-gap: var(--kendo-spacing-2\.5, 0.625rem) !important;
}

.k-gap-x-3 {
  -moz-column-gap: var(--kendo-spacing-3, 0.75rem);
       column-gap: var(--kendo-spacing-3, 0.75rem);
}

.\!k-gap-x-3 {
  -moz-column-gap: var(--kendo-spacing-3, 0.75rem) !important;
       column-gap: var(--kendo-spacing-3, 0.75rem) !important;
}

.k-gap-x-3\.5 {
  -moz-column-gap: var(--kendo-spacing-3\.5, 0.875rem);
       column-gap: var(--kendo-spacing-3\.5, 0.875rem);
}

.\!k-gap-x-3\.5 {
  -moz-column-gap: var(--kendo-spacing-3\.5, 0.875rem) !important;
       column-gap: var(--kendo-spacing-3\.5, 0.875rem) !important;
}

.k-gap-x-4 {
  -moz-column-gap: var(--kendo-spacing-4, 1rem);
       column-gap: var(--kendo-spacing-4, 1rem);
}

.\!k-gap-x-4 {
  -moz-column-gap: var(--kendo-spacing-4, 1rem) !important;
       column-gap: var(--kendo-spacing-4, 1rem) !important;
}

.k-gap-x-4\.5 {
  -moz-column-gap: var(--kendo-spacing-4\.5, 1.125rem);
       column-gap: var(--kendo-spacing-4\.5, 1.125rem);
}

.\!k-gap-x-4\.5 {
  -moz-column-gap: var(--kendo-spacing-4\.5, 1.125rem) !important;
       column-gap: var(--kendo-spacing-4\.5, 1.125rem) !important;
}

.k-gap-x-5 {
  -moz-column-gap: var(--kendo-spacing-5, 1.25rem);
       column-gap: var(--kendo-spacing-5, 1.25rem);
}

.\!k-gap-x-5 {
  -moz-column-gap: var(--kendo-spacing-5, 1.25rem) !important;
       column-gap: var(--kendo-spacing-5, 1.25rem) !important;
}

.k-gap-x-5\.5 {
  -moz-column-gap: var(--kendo-spacing-5\.5, 1.375rem);
       column-gap: var(--kendo-spacing-5\.5, 1.375rem);
}

.\!k-gap-x-5\.5 {
  -moz-column-gap: var(--kendo-spacing-5\.5, 1.375rem) !important;
       column-gap: var(--kendo-spacing-5\.5, 1.375rem) !important;
}

.k-gap-x-6 {
  -moz-column-gap: var(--kendo-spacing-6, 1.5rem);
       column-gap: var(--kendo-spacing-6, 1.5rem);
}

.\!k-gap-x-6 {
  -moz-column-gap: var(--kendo-spacing-6, 1.5rem) !important;
       column-gap: var(--kendo-spacing-6, 1.5rem) !important;
}

.k-gap-x-6\.5 {
  -moz-column-gap: var(--kendo-spacing-6\.5, 1.625rem);
       column-gap: var(--kendo-spacing-6\.5, 1.625rem);
}

.\!k-gap-x-6\.5 {
  -moz-column-gap: var(--kendo-spacing-6\.5, 1.625rem) !important;
       column-gap: var(--kendo-spacing-6\.5, 1.625rem) !important;
}

.k-gap-x-7 {
  -moz-column-gap: var(--kendo-spacing-7, 1.75rem);
       column-gap: var(--kendo-spacing-7, 1.75rem);
}

.\!k-gap-x-7 {
  -moz-column-gap: var(--kendo-spacing-7, 1.75rem) !important;
       column-gap: var(--kendo-spacing-7, 1.75rem) !important;
}

.k-gap-x-7\.5 {
  -moz-column-gap: var(--kendo-spacing-7\.5, 1.875rem);
       column-gap: var(--kendo-spacing-7\.5, 1.875rem);
}

.\!k-gap-x-7\.5 {
  -moz-column-gap: var(--kendo-spacing-7\.5, 1.875rem) !important;
       column-gap: var(--kendo-spacing-7\.5, 1.875rem) !important;
}

.k-gap-x-8 {
  -moz-column-gap: var(--kendo-spacing-8, 2rem);
       column-gap: var(--kendo-spacing-8, 2rem);
}

.\!k-gap-x-8 {
  -moz-column-gap: var(--kendo-spacing-8, 2rem) !important;
       column-gap: var(--kendo-spacing-8, 2rem) !important;
}

.k-gap-x-9 {
  -moz-column-gap: var(--kendo-spacing-9, 2.25rem);
       column-gap: var(--kendo-spacing-9, 2.25rem);
}

.\!k-gap-x-9 {
  -moz-column-gap: var(--kendo-spacing-9, 2.25rem) !important;
       column-gap: var(--kendo-spacing-9, 2.25rem) !important;
}

.k-gap-x-10 {
  -moz-column-gap: var(--kendo-spacing-10, 2.5rem);
       column-gap: var(--kendo-spacing-10, 2.5rem);
}

.\!k-gap-x-10 {
  -moz-column-gap: var(--kendo-spacing-10, 2.5rem) !important;
       column-gap: var(--kendo-spacing-10, 2.5rem) !important;
}

.k-gap-x-11 {
  -moz-column-gap: var(--kendo-spacing-11, 2.75rem);
       column-gap: var(--kendo-spacing-11, 2.75rem);
}

.\!k-gap-x-11 {
  -moz-column-gap: var(--kendo-spacing-11, 2.75rem) !important;
       column-gap: var(--kendo-spacing-11, 2.75rem) !important;
}

.k-gap-x-12 {
  -moz-column-gap: var(--kendo-spacing-12, 3rem);
       column-gap: var(--kendo-spacing-12, 3rem);
}

.\!k-gap-x-12 {
  -moz-column-gap: var(--kendo-spacing-12, 3rem) !important;
       column-gap: var(--kendo-spacing-12, 3rem) !important;
}

.k-gap-x-13 {
  -moz-column-gap: var(--kendo-spacing-13, 3.25rem);
       column-gap: var(--kendo-spacing-13, 3.25rem);
}

.\!k-gap-x-13 {
  -moz-column-gap: var(--kendo-spacing-13, 3.25rem) !important;
       column-gap: var(--kendo-spacing-13, 3.25rem) !important;
}

.k-gap-x-14 {
  -moz-column-gap: var(--kendo-spacing-14, 3.5rem);
       column-gap: var(--kendo-spacing-14, 3.5rem);
}

.\!k-gap-x-14 {
  -moz-column-gap: var(--kendo-spacing-14, 3.5rem) !important;
       column-gap: var(--kendo-spacing-14, 3.5rem) !important;
}

.k-gap-x-15 {
  -moz-column-gap: var(--kendo-spacing-15, 3.75rem);
       column-gap: var(--kendo-spacing-15, 3.75rem);
}

.\!k-gap-x-15 {
  -moz-column-gap: var(--kendo-spacing-15, 3.75rem) !important;
       column-gap: var(--kendo-spacing-15, 3.75rem) !important;
}

.k-gap-x-16 {
  -moz-column-gap: var(--kendo-spacing-16, 4rem);
       column-gap: var(--kendo-spacing-16, 4rem);
}

.\!k-gap-x-16 {
  -moz-column-gap: var(--kendo-spacing-16, 4rem) !important;
       column-gap: var(--kendo-spacing-16, 4rem) !important;
}

.k-gap-x-17 {
  -moz-column-gap: var(--kendo-spacing-17, 4.25rem);
       column-gap: var(--kendo-spacing-17, 4.25rem);
}

.\!k-gap-x-17 {
  -moz-column-gap: var(--kendo-spacing-17, 4.25rem) !important;
       column-gap: var(--kendo-spacing-17, 4.25rem) !important;
}

.k-gap-x-18 {
  -moz-column-gap: var(--kendo-spacing-18, 4.5rem);
       column-gap: var(--kendo-spacing-18, 4.5rem);
}

.\!k-gap-x-18 {
  -moz-column-gap: var(--kendo-spacing-18, 4.5rem) !important;
       column-gap: var(--kendo-spacing-18, 4.5rem) !important;
}

.k-gap-x-19 {
  -moz-column-gap: var(--kendo-spacing-19, 4.75rem);
       column-gap: var(--kendo-spacing-19, 4.75rem);
}

.\!k-gap-x-19 {
  -moz-column-gap: var(--kendo-spacing-19, 4.75rem) !important;
       column-gap: var(--kendo-spacing-19, 4.75rem) !important;
}

.k-gap-x-20 {
  -moz-column-gap: var(--kendo-spacing-20, 5rem);
       column-gap: var(--kendo-spacing-20, 5rem);
}

.\!k-gap-x-20 {
  -moz-column-gap: var(--kendo-spacing-20, 5rem) !important;
       column-gap: var(--kendo-spacing-20, 5rem) !important;
}

.k-gap-x-21 {
  -moz-column-gap: var(--kendo-spacing-21, 5.25rem);
       column-gap: var(--kendo-spacing-21, 5.25rem);
}

.\!k-gap-x-21 {
  -moz-column-gap: var(--kendo-spacing-21, 5.25rem) !important;
       column-gap: var(--kendo-spacing-21, 5.25rem) !important;
}

.k-gap-x-22 {
  -moz-column-gap: var(--kendo-spacing-22, 5.5rem);
       column-gap: var(--kendo-spacing-22, 5.5rem);
}

.\!k-gap-x-22 {
  -moz-column-gap: var(--kendo-spacing-22, 5.5rem) !important;
       column-gap: var(--kendo-spacing-22, 5.5rem) !important;
}

.k-gap-x-23 {
  -moz-column-gap: var(--kendo-spacing-23, 5.75rem);
       column-gap: var(--kendo-spacing-23, 5.75rem);
}

.\!k-gap-x-23 {
  -moz-column-gap: var(--kendo-spacing-23, 5.75rem) !important;
       column-gap: var(--kendo-spacing-23, 5.75rem) !important;
}

.k-gap-x-24 {
  -moz-column-gap: var(--kendo-spacing-24, 6rem);
       column-gap: var(--kendo-spacing-24, 6rem);
}

.\!k-gap-x-24 {
  -moz-column-gap: var(--kendo-spacing-24, 6rem) !important;
       column-gap: var(--kendo-spacing-24, 6rem) !important;
}

.k-gap-x-25 {
  -moz-column-gap: var(--kendo-spacing-25, 7rem);
       column-gap: var(--kendo-spacing-25, 7rem);
}

.\!k-gap-x-25 {
  -moz-column-gap: var(--kendo-spacing-25, 7rem) !important;
       column-gap: var(--kendo-spacing-25, 7rem) !important;
}

.k-gap-x-26 {
  -moz-column-gap: var(--kendo-spacing-26, 8rem);
       column-gap: var(--kendo-spacing-26, 8rem);
}

.\!k-gap-x-26 {
  -moz-column-gap: var(--kendo-spacing-26, 8rem) !important;
       column-gap: var(--kendo-spacing-26, 8rem) !important;
}

.k-gap-x-27 {
  -moz-column-gap: var(--kendo-spacing-27, 9rem);
       column-gap: var(--kendo-spacing-27, 9rem);
}

.\!k-gap-x-27 {
  -moz-column-gap: var(--kendo-spacing-27, 9rem) !important;
       column-gap: var(--kendo-spacing-27, 9rem) !important;
}

.k-gap-x-28 {
  -moz-column-gap: var(--kendo-spacing-28, 10rem);
       column-gap: var(--kendo-spacing-28, 10rem);
}

.\!k-gap-x-28 {
  -moz-column-gap: var(--kendo-spacing-28, 10rem) !important;
       column-gap: var(--kendo-spacing-28, 10rem) !important;
}

.k-gap-x-29 {
  -moz-column-gap: var(--kendo-spacing-29, 11rem);
       column-gap: var(--kendo-spacing-29, 11rem);
}

.\!k-gap-x-29 {
  -moz-column-gap: var(--kendo-spacing-29, 11rem) !important;
       column-gap: var(--kendo-spacing-29, 11rem) !important;
}

.k-gap-x-30 {
  -moz-column-gap: var(--kendo-spacing-30, 12rem);
       column-gap: var(--kendo-spacing-30, 12rem);
}

.\!k-gap-x-30 {
  -moz-column-gap: var(--kendo-spacing-30, 12rem) !important;
       column-gap: var(--kendo-spacing-30, 12rem) !important;
}

.k-gap-x-xs {
  -moz-column-gap: var(--kendo-spacing-xs, var(--kendo-spacing-1, 0.25rem));
       column-gap: var(--kendo-spacing-xs, var(--kendo-spacing-1, 0.25rem));
}

.\!k-gap-x-xs {
  -moz-column-gap: var(--kendo-spacing-xs, var(--kendo-spacing-1, 0.25rem)) !important;
       column-gap: var(--kendo-spacing-xs, var(--kendo-spacing-1, 0.25rem)) !important;
}

.k-gap-x-sm {
  -moz-column-gap: var(--kendo-spacing-sm, var(--kendo-spacing-2, 0.5rem));
       column-gap: var(--kendo-spacing-sm, var(--kendo-spacing-2, 0.5rem));
}

.\!k-gap-x-sm {
  -moz-column-gap: var(--kendo-spacing-sm, var(--kendo-spacing-2, 0.5rem)) !important;
       column-gap: var(--kendo-spacing-sm, var(--kendo-spacing-2, 0.5rem)) !important;
}

.k-gap-x-md {
  -moz-column-gap: var(--kendo-spacing-md, var(--kendo-spacing-3, 0.75rem));
       column-gap: var(--kendo-spacing-md, var(--kendo-spacing-3, 0.75rem));
}

.\!k-gap-x-md {
  -moz-column-gap: var(--kendo-spacing-md, var(--kendo-spacing-3, 0.75rem)) !important;
       column-gap: var(--kendo-spacing-md, var(--kendo-spacing-3, 0.75rem)) !important;
}

.k-gap-x-lg {
  -moz-column-gap: var(--kendo-spacing-lg, var(--kendo-spacing-4, 1rem));
       column-gap: var(--kendo-spacing-lg, var(--kendo-spacing-4, 1rem));
}

.\!k-gap-x-lg {
  -moz-column-gap: var(--kendo-spacing-lg, var(--kendo-spacing-4, 1rem)) !important;
       column-gap: var(--kendo-spacing-lg, var(--kendo-spacing-4, 1rem)) !important;
}

.k-gap-x-xl {
  -moz-column-gap: var(--kendo-spacing-xl, var(--kendo-spacing-6, 1.5rem));
       column-gap: var(--kendo-spacing-xl, var(--kendo-spacing-6, 1.5rem));
}

.\!k-gap-x-xl {
  -moz-column-gap: var(--kendo-spacing-xl, var(--kendo-spacing-6, 1.5rem)) !important;
       column-gap: var(--kendo-spacing-xl, var(--kendo-spacing-6, 1.5rem)) !important;
}

.k-gap-x-thin {
  -moz-column-gap: var(--kendo-spacing-thin, var(--kendo-spacing-0\.5, 0.125rem));
       column-gap: var(--kendo-spacing-thin, var(--kendo-spacing-0\.5, 0.125rem));
}

.\!k-gap-x-thin {
  -moz-column-gap: var(--kendo-spacing-thin, var(--kendo-spacing-0\.5, 0.125rem)) !important;
       column-gap: var(--kendo-spacing-thin, var(--kendo-spacing-0\.5, 0.125rem)) !important;
}

.k-gap-x-hair {
  -moz-column-gap: var(--kendo-spacing-hair, var(--kendo-spacing-1px, 1px));
       column-gap: var(--kendo-spacing-hair, var(--kendo-spacing-1px, 1px));
}

.\!k-gap-x-hair {
  -moz-column-gap: var(--kendo-spacing-hair, var(--kendo-spacing-1px, 1px)) !important;
       column-gap: var(--kendo-spacing-hair, var(--kendo-spacing-1px, 1px)) !important;
}

.k-gap-y-0 {
  row-gap: var(--kendo-spacing-0, 0px);
}

.\!k-gap-y-0 {
  row-gap: var(--kendo-spacing-0, 0px) !important;
}

.k-gap-y-1px {
  row-gap: var(--kendo-spacing-1px, 1px);
}

.\!k-gap-y-1px {
  row-gap: var(--kendo-spacing-1px, 1px) !important;
}

.k-gap-y-0\.5 {
  row-gap: var(--kendo-spacing-0\.5, 0.125rem);
}

.\!k-gap-y-0\.5 {
  row-gap: var(--kendo-spacing-0\.5, 0.125rem) !important;
}

.k-gap-y-1 {
  row-gap: var(--kendo-spacing-1, 0.25rem);
}

.\!k-gap-y-1 {
  row-gap: var(--kendo-spacing-1, 0.25rem) !important;
}

.k-gap-y-1\.5 {
  row-gap: var(--kendo-spacing-1\.5, 0.375rem);
}

.\!k-gap-y-1\.5 {
  row-gap: var(--kendo-spacing-1\.5, 0.375rem) !important;
}

.k-gap-y-2 {
  row-gap: var(--kendo-spacing-2, 0.5rem);
}

.\!k-gap-y-2 {
  row-gap: var(--kendo-spacing-2, 0.5rem) !important;
}

.k-gap-y-2\.5 {
  row-gap: var(--kendo-spacing-2\.5, 0.625rem);
}

.\!k-gap-y-2\.5 {
  row-gap: var(--kendo-spacing-2\.5, 0.625rem) !important;
}

.k-gap-y-3 {
  row-gap: var(--kendo-spacing-3, 0.75rem);
}

.\!k-gap-y-3 {
  row-gap: var(--kendo-spacing-3, 0.75rem) !important;
}

.k-gap-y-3\.5 {
  row-gap: var(--kendo-spacing-3\.5, 0.875rem);
}

.\!k-gap-y-3\.5 {
  row-gap: var(--kendo-spacing-3\.5, 0.875rem) !important;
}

.k-gap-y-4 {
  row-gap: var(--kendo-spacing-4, 1rem);
}

.\!k-gap-y-4 {
  row-gap: var(--kendo-spacing-4, 1rem) !important;
}

.k-gap-y-4\.5 {
  row-gap: var(--kendo-spacing-4\.5, 1.125rem);
}

.\!k-gap-y-4\.5 {
  row-gap: var(--kendo-spacing-4\.5, 1.125rem) !important;
}

.k-gap-y-5 {
  row-gap: var(--kendo-spacing-5, 1.25rem);
}

.\!k-gap-y-5 {
  row-gap: var(--kendo-spacing-5, 1.25rem) !important;
}

.k-gap-y-5\.5 {
  row-gap: var(--kendo-spacing-5\.5, 1.375rem);
}

.\!k-gap-y-5\.5 {
  row-gap: var(--kendo-spacing-5\.5, 1.375rem) !important;
}

.k-gap-y-6 {
  row-gap: var(--kendo-spacing-6, 1.5rem);
}

.\!k-gap-y-6 {
  row-gap: var(--kendo-spacing-6, 1.5rem) !important;
}

.k-gap-y-6\.5 {
  row-gap: var(--kendo-spacing-6\.5, 1.625rem);
}

.\!k-gap-y-6\.5 {
  row-gap: var(--kendo-spacing-6\.5, 1.625rem) !important;
}

.k-gap-y-7 {
  row-gap: var(--kendo-spacing-7, 1.75rem);
}

.\!k-gap-y-7 {
  row-gap: var(--kendo-spacing-7, 1.75rem) !important;
}

.k-gap-y-7\.5 {
  row-gap: var(--kendo-spacing-7\.5, 1.875rem);
}

.\!k-gap-y-7\.5 {
  row-gap: var(--kendo-spacing-7\.5, 1.875rem) !important;
}

.k-gap-y-8 {
  row-gap: var(--kendo-spacing-8, 2rem);
}

.\!k-gap-y-8 {
  row-gap: var(--kendo-spacing-8, 2rem) !important;
}

.k-gap-y-9 {
  row-gap: var(--kendo-spacing-9, 2.25rem);
}

.\!k-gap-y-9 {
  row-gap: var(--kendo-spacing-9, 2.25rem) !important;
}

.k-gap-y-10 {
  row-gap: var(--kendo-spacing-10, 2.5rem);
}

.\!k-gap-y-10 {
  row-gap: var(--kendo-spacing-10, 2.5rem) !important;
}

.k-gap-y-11 {
  row-gap: var(--kendo-spacing-11, 2.75rem);
}

.\!k-gap-y-11 {
  row-gap: var(--kendo-spacing-11, 2.75rem) !important;
}

.k-gap-y-12 {
  row-gap: var(--kendo-spacing-12, 3rem);
}

.\!k-gap-y-12 {
  row-gap: var(--kendo-spacing-12, 3rem) !important;
}

.k-gap-y-13 {
  row-gap: var(--kendo-spacing-13, 3.25rem);
}

.\!k-gap-y-13 {
  row-gap: var(--kendo-spacing-13, 3.25rem) !important;
}

.k-gap-y-14 {
  row-gap: var(--kendo-spacing-14, 3.5rem);
}

.\!k-gap-y-14 {
  row-gap: var(--kendo-spacing-14, 3.5rem) !important;
}

.k-gap-y-15 {
  row-gap: var(--kendo-spacing-15, 3.75rem);
}

.\!k-gap-y-15 {
  row-gap: var(--kendo-spacing-15, 3.75rem) !important;
}

.k-gap-y-16 {
  row-gap: var(--kendo-spacing-16, 4rem);
}

.\!k-gap-y-16 {
  row-gap: var(--kendo-spacing-16, 4rem) !important;
}

.k-gap-y-17 {
  row-gap: var(--kendo-spacing-17, 4.25rem);
}

.\!k-gap-y-17 {
  row-gap: var(--kendo-spacing-17, 4.25rem) !important;
}

.k-gap-y-18 {
  row-gap: var(--kendo-spacing-18, 4.5rem);
}

.\!k-gap-y-18 {
  row-gap: var(--kendo-spacing-18, 4.5rem) !important;
}

.k-gap-y-19 {
  row-gap: var(--kendo-spacing-19, 4.75rem);
}

.\!k-gap-y-19 {
  row-gap: var(--kendo-spacing-19, 4.75rem) !important;
}

.k-gap-y-20 {
  row-gap: var(--kendo-spacing-20, 5rem);
}

.\!k-gap-y-20 {
  row-gap: var(--kendo-spacing-20, 5rem) !important;
}

.k-gap-y-21 {
  row-gap: var(--kendo-spacing-21, 5.25rem);
}

.\!k-gap-y-21 {
  row-gap: var(--kendo-spacing-21, 5.25rem) !important;
}

.k-gap-y-22 {
  row-gap: var(--kendo-spacing-22, 5.5rem);
}

.\!k-gap-y-22 {
  row-gap: var(--kendo-spacing-22, 5.5rem) !important;
}

.k-gap-y-23 {
  row-gap: var(--kendo-spacing-23, 5.75rem);
}

.\!k-gap-y-23 {
  row-gap: var(--kendo-spacing-23, 5.75rem) !important;
}

.k-gap-y-24 {
  row-gap: var(--kendo-spacing-24, 6rem);
}

.\!k-gap-y-24 {
  row-gap: var(--kendo-spacing-24, 6rem) !important;
}

.k-gap-y-25 {
  row-gap: var(--kendo-spacing-25, 7rem);
}

.\!k-gap-y-25 {
  row-gap: var(--kendo-spacing-25, 7rem) !important;
}

.k-gap-y-26 {
  row-gap: var(--kendo-spacing-26, 8rem);
}

.\!k-gap-y-26 {
  row-gap: var(--kendo-spacing-26, 8rem) !important;
}

.k-gap-y-27 {
  row-gap: var(--kendo-spacing-27, 9rem);
}

.\!k-gap-y-27 {
  row-gap: var(--kendo-spacing-27, 9rem) !important;
}

.k-gap-y-28 {
  row-gap: var(--kendo-spacing-28, 10rem);
}

.\!k-gap-y-28 {
  row-gap: var(--kendo-spacing-28, 10rem) !important;
}

.k-gap-y-29 {
  row-gap: var(--kendo-spacing-29, 11rem);
}

.\!k-gap-y-29 {
  row-gap: var(--kendo-spacing-29, 11rem) !important;
}

.k-gap-y-30 {
  row-gap: var(--kendo-spacing-30, 12rem);
}

.\!k-gap-y-30 {
  row-gap: var(--kendo-spacing-30, 12rem) !important;
}

.k-gap-y-xs {
  row-gap: var(--kendo-spacing-xs, var(--kendo-spacing-1, 0.25rem));
}

.\!k-gap-y-xs {
  row-gap: var(--kendo-spacing-xs, var(--kendo-spacing-1, 0.25rem)) !important;
}

.k-gap-y-sm {
  row-gap: var(--kendo-spacing-sm, var(--kendo-spacing-2, 0.5rem));
}

.\!k-gap-y-sm {
  row-gap: var(--kendo-spacing-sm, var(--kendo-spacing-2, 0.5rem)) !important;
}

.k-gap-y-md {
  row-gap: var(--kendo-spacing-md, var(--kendo-spacing-3, 0.75rem));
}

.\!k-gap-y-md {
  row-gap: var(--kendo-spacing-md, var(--kendo-spacing-3, 0.75rem)) !important;
}

.k-gap-y-lg {
  row-gap: var(--kendo-spacing-lg, var(--kendo-spacing-4, 1rem));
}

.\!k-gap-y-lg {
  row-gap: var(--kendo-spacing-lg, var(--kendo-spacing-4, 1rem)) !important;
}

.k-gap-y-xl {
  row-gap: var(--kendo-spacing-xl, var(--kendo-spacing-6, 1.5rem));
}

.\!k-gap-y-xl {
  row-gap: var(--kendo-spacing-xl, var(--kendo-spacing-6, 1.5rem)) !important;
}

.k-gap-y-thin {
  row-gap: var(--kendo-spacing-thin, var(--kendo-spacing-0\.5, 0.125rem));
}

.\!k-gap-y-thin {
  row-gap: var(--kendo-spacing-thin, var(--kendo-spacing-0\.5, 0.125rem)) !important;
}

.k-gap-y-hair {
  row-gap: var(--kendo-spacing-hair, var(--kendo-spacing-1px, 1px));
}

.\!k-gap-y-hair {
  row-gap: var(--kendo-spacing-hair, var(--kendo-spacing-1px, 1px)) !important;
}

.k-grid-cols-1 {
  grid-template-columns: repeat(1, minmax(0, 1fr));
}

.\!k-grid-cols-1 {
  grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
}

.k-grid-cols-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.\!k-grid-cols-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

.k-grid-cols-3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.\!k-grid-cols-3 {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.k-grid-cols-4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.\!k-grid-cols-4 {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

.k-grid-cols-5 {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.\!k-grid-cols-5 {
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
}

.k-grid-cols-6 {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.\!k-grid-cols-6 {
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
}

.k-grid-cols-7 {
  grid-template-columns: repeat(7, minmax(0, 1fr));
}

.\!k-grid-cols-7 {
  grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
}

.k-grid-cols-8 {
  grid-template-columns: repeat(8, minmax(0, 1fr));
}

.\!k-grid-cols-8 {
  grid-template-columns: repeat(8, minmax(0, 1fr)) !important;
}

.k-grid-cols-9 {
  grid-template-columns: repeat(9, minmax(0, 1fr));
}

.\!k-grid-cols-9 {
  grid-template-columns: repeat(9, minmax(0, 1fr)) !important;
}

.k-grid-cols-10 {
  grid-template-columns: repeat(10, minmax(0, 1fr));
}

.\!k-grid-cols-10 {
  grid-template-columns: repeat(10, minmax(0, 1fr)) !important;
}

.k-grid-cols-11 {
  grid-template-columns: repeat(11, minmax(0, 1fr));
}

.\!k-grid-cols-11 {
  grid-template-columns: repeat(11, minmax(0, 1fr)) !important;
}

.k-grid-cols-12 {
  grid-template-columns: repeat(12, minmax(0, 1fr));
}

.\!k-grid-cols-12 {
  grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
}

.k-grid-cols-none {
  grid-template-columns: none;
}

.\!k-grid-cols-none {
  grid-template-columns: none !important;
}

.k-col-span-1 {
  grid-column: span 1/span 1;
}

.\!k-col-span-1 {
  grid-column: span 1/span 1 !important;
}

.k-col-span-2 {
  grid-column: span 2/span 2;
}

.\!k-col-span-2 {
  grid-column: span 2/span 2 !important;
}

.k-col-span-3 {
  grid-column: span 3/span 3;
}

.\!k-col-span-3 {
  grid-column: span 3/span 3 !important;
}

.k-col-span-4 {
  grid-column: span 4/span 4;
}

.\!k-col-span-4 {
  grid-column: span 4/span 4 !important;
}

.k-col-span-5 {
  grid-column: span 5/span 5;
}

.\!k-col-span-5 {
  grid-column: span 5/span 5 !important;
}

.k-col-span-6 {
  grid-column: span 6/span 6;
}

.\!k-col-span-6 {
  grid-column: span 6/span 6 !important;
}

.k-col-span-7 {
  grid-column: span 7/span 7;
}

.\!k-col-span-7 {
  grid-column: span 7/span 7 !important;
}

.k-col-span-8 {
  grid-column: span 8/span 8;
}

.\!k-col-span-8 {
  grid-column: span 8/span 8 !important;
}

.k-col-span-9 {
  grid-column: span 9/span 9;
}

.\!k-col-span-9 {
  grid-column: span 9/span 9 !important;
}

.k-col-span-10 {
  grid-column: span 10/span 10;
}

.\!k-col-span-10 {
  grid-column: span 10/span 10 !important;
}

.k-col-span-11 {
  grid-column: span 11/span 11;
}

.\!k-col-span-11 {
  grid-column: span 11/span 11 !important;
}

.k-col-span-12 {
  grid-column: span 12/span 12;
}

.\!k-col-span-12 {
  grid-column: span 12/span 12 !important;
}

.k-col-span-full {
  grid-column: 1 / -1;
}

.\!k-col-span-full {
  grid-column: 1 / -1 !important;
}

.k-col-span-auto {
  grid-column: auto;
}

.\!k-col-span-auto {
  grid-column: auto !important;
}

.k-col-start-1 {
  grid-column-start: 1;
}

.\!k-col-start-1 {
  grid-column-start: 1 !important;
}

.k-col-start-2 {
  grid-column-start: 2;
}

.\!k-col-start-2 {
  grid-column-start: 2 !important;
}

.k-col-start-3 {
  grid-column-start: 3;
}

.\!k-col-start-3 {
  grid-column-start: 3 !important;
}

.k-col-start-4 {
  grid-column-start: 4;
}

.\!k-col-start-4 {
  grid-column-start: 4 !important;
}

.k-col-start-5 {
  grid-column-start: 5;
}

.\!k-col-start-5 {
  grid-column-start: 5 !important;
}

.k-col-start-6 {
  grid-column-start: 6;
}

.\!k-col-start-6 {
  grid-column-start: 6 !important;
}

.k-col-start-7 {
  grid-column-start: 7;
}

.\!k-col-start-7 {
  grid-column-start: 7 !important;
}

.k-col-start-8 {
  grid-column-start: 8;
}

.\!k-col-start-8 {
  grid-column-start: 8 !important;
}

.k-col-start-9 {
  grid-column-start: 9;
}

.\!k-col-start-9 {
  grid-column-start: 9 !important;
}

.k-col-start-10 {
  grid-column-start: 10;
}

.\!k-col-start-10 {
  grid-column-start: 10 !important;
}

.k-col-start-11 {
  grid-column-start: 11;
}

.\!k-col-start-11 {
  grid-column-start: 11 !important;
}

.k-col-start-12 {
  grid-column-start: 12;
}

.\!k-col-start-12 {
  grid-column-start: 12 !important;
}

.k-col-start-13 {
  grid-column-start: 13;
}

.\!k-col-start-13 {
  grid-column-start: 13 !important;
}

.k-col-start-auto {
  grid-column-start: auto;
}

.\!k-col-start-auto {
  grid-column-start: auto !important;
}

.k-col-end-1 {
  grid-column-end: 1;
}

.\!k-col-end-1 {
  grid-column-end: 1 !important;
}

.k-col-end-2 {
  grid-column-end: 2;
}

.\!k-col-end-2 {
  grid-column-end: 2 !important;
}

.k-col-end-3 {
  grid-column-end: 3;
}

.\!k-col-end-3 {
  grid-column-end: 3 !important;
}

.k-col-end-4 {
  grid-column-end: 4;
}

.\!k-col-end-4 {
  grid-column-end: 4 !important;
}

.k-col-end-5 {
  grid-column-end: 5;
}

.\!k-col-end-5 {
  grid-column-end: 5 !important;
}

.k-col-end-6 {
  grid-column-end: 6;
}

.\!k-col-end-6 {
  grid-column-end: 6 !important;
}

.k-col-end-7 {
  grid-column-end: 7;
}

.\!k-col-end-7 {
  grid-column-end: 7 !important;
}

.k-col-end-8 {
  grid-column-end: 8;
}

.\!k-col-end-8 {
  grid-column-end: 8 !important;
}

.k-col-end-9 {
  grid-column-end: 9;
}

.\!k-col-end-9 {
  grid-column-end: 9 !important;
}

.k-col-end-10 {
  grid-column-end: 10;
}

.\!k-col-end-10 {
  grid-column-end: 10 !important;
}

.k-col-end-11 {
  grid-column-end: 11;
}

.\!k-col-end-11 {
  grid-column-end: 11 !important;
}

.k-col-end-12 {
  grid-column-end: 12;
}

.\!k-col-end-12 {
  grid-column-end: 12 !important;
}

.k-col-end-13 {
  grid-column-end: 13;
}

.\!k-col-end-13 {
  grid-column-end: 13 !important;
}

.k-col-end-auto {
  grid-column-end: auto;
}

.\!k-col-end-auto {
  grid-column-end: auto !important;
}

.k-colspan-1 {
  grid-column: span 1/span 1;
}

.\!k-colspan-1 {
  grid-column: span 1/span 1 !important;
}

.k-colspan-2 {
  grid-column: span 2/span 2;
}

.\!k-colspan-2 {
  grid-column: span 2/span 2 !important;
}

.k-colspan-3 {
  grid-column: span 3/span 3;
}

.\!k-colspan-3 {
  grid-column: span 3/span 3 !important;
}

.k-colspan-4 {
  grid-column: span 4/span 4;
}

.\!k-colspan-4 {
  grid-column: span 4/span 4 !important;
}

.k-colspan-5 {
  grid-column: span 5/span 5;
}

.\!k-colspan-5 {
  grid-column: span 5/span 5 !important;
}

.k-colspan-6 {
  grid-column: span 6/span 6;
}

.\!k-colspan-6 {
  grid-column: span 6/span 6 !important;
}

.k-colspan-7 {
  grid-column: span 7/span 7;
}

.\!k-colspan-7 {
  grid-column: span 7/span 7 !important;
}

.k-colspan-8 {
  grid-column: span 8/span 8;
}

.\!k-colspan-8 {
  grid-column: span 8/span 8 !important;
}

.k-colspan-9 {
  grid-column: span 9/span 9;
}

.\!k-colspan-9 {
  grid-column: span 9/span 9 !important;
}

.k-colspan-10 {
  grid-column: span 10/span 10;
}

.\!k-colspan-10 {
  grid-column: span 10/span 10 !important;
}

.k-colspan-11 {
  grid-column: span 11/span 11;
}

.\!k-colspan-11 {
  grid-column: span 11/span 11 !important;
}

.k-colspan-12 {
  grid-column: span 12/span 12;
}

.\!k-colspan-12 {
  grid-column: span 12/span 12 !important;
}

.k-colspan-full, .k-colspan-all {
  grid-column: 1 / -1;
}

.\!k-colspan-full, .\!k-colspan-all {
  grid-column: 1 / -1 !important;
}

.k-colspan-auto {
  grid-column: auto;
}

.\!k-colspan-auto {
  grid-column: auto !important;
}

.k-window {
  border-radius: 0px;
  padding: 0;
  border-width: 0px;
  border-style: solid;
  box-sizing: border-box;
  outline: 0;
  font-family: var(--kendo-font-family, inherit);
  font-size: var(--kendo-font-size, inherit);
  line-height: var(--kendo-line-height-sm, normal);
  display: inline-flex;
  flex-direction: column;
  position: absolute;
  z-index: 10002;
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.k-window.k-window-maximized {
  max-width: 100vw;
  max-height: 100vh;
  box-shadow: none;
}

.k-window-sm {
  width: 300px;
}

.k-window-md {
  width: 800px;
}

.k-window-lg {
  width: 1200px;
}

.k-window-titlebar {
  border-top-left-radius: 0px;
  border-top-right-radius: 0px;
  padding-block: var(--kendo-spacing-3, 0.75rem);
  padding-inline: var(--kendo-spacing-4, 1rem);
  border-width: 0 0 1px;
  border-style: solid;
  white-space: nowrap;
  display: flex;
  flex-direction: row;
  flex-shrink: 0;
  align-items: center;
}

.k-window-minimized .k-window-titlebar {
  border-width: 0;
}

.k-window-title {
  padding-block: 0.5em;
  padding-inline: 0;
  margin-block: -0.5em;
  margin-inline: 0;
  font-size: var(--kendo-font-size-lg, inherit);
  line-height: var(--kendo-line-height-sm, normal);
  text-overflow: ellipsis;
  overflow: hidden;
  cursor: default;
  flex: 1;
}

.k-window-title:empty::before {
  content: "​";
}

.k-window-titlebar-actions {
  margin-block: -5em;
  margin-inline: 0;
  margin-inline-end: calc(var(--kendo-spacing-3, 0.75rem) - var(--kendo-spacing-4, 1rem));
  line-height: 1;
  display: flex;
  flex-flow: row nowrap;
  flex-shrink: 0;
  align-items: center;
  vertical-align: top;
}

.k-window-titlebar-action {
  flex-shrink: 0;
}

.k-window-content,
.k-prompt-container {
  padding-block: var(--kendo-spacing-4, 1rem);
  padding-inline: var(--kendo-spacing-4, 1rem);
  border-width: 0;
  border-color: inherit;
  color: inherit;
  background: none;
  outline: 0;
  overflow: auto;
  position: relative;
  flex: 1 1 auto;
}

.k-window-content + .k-prompt-container {
  margin-top: -var(--kendo-spacing-4, 1rem) / 2;
}

.k-window-content:first-child {
  padding-top: clamp(var(--kendo-spacing-4, 1rem), var(--kendo-spacing-3, 0.75rem), var(--kendo-spacing-3, 0.75rem));
}

.k-window-content:last-child {
  padding-bottom: clamp(var(--kendo-spacing-4, 1rem), var(--kendo-spacing-3, 0.75rem), var(--kendo-spacing-3, 0.75rem));
}

.k-window-iframecontent {
  padding: 0;
  overflow: visible;
}

.k-window-iframecontent .k-content-frame {
  vertical-align: top;
  border: 0;
  width: 100%;
  height: 100%;
}

.k-window-actions {
  border-bottom-right-radius: 0px;
  border-bottom-left-radius: 0px;
  padding-block: var(--kendo-spacing-2, 0.5rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
  border-width: 1px 0 0;
  border-style: solid;
  border-color: inherit;
  flex: 0 0 auto;
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  overflow: hidden;
}

.k-prompt-container > .k-textarea {
  width: 100%;
}

.k-window .k-resize-n {
  top: 0;
}

.k-window .k-resize-e {
  right: 0;
}

.k-window .k-resize-s {
  bottom: 0;
}

.k-window .k-resize-w {
  left: 0;
}

.k-window {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
  color: var(--kendo-color-on-app-surface, #3d3d3d);
  background-color: var(--kendo-color-surface-alt, #ffffff);
  box-shadow: var(--kendo-elevation-8, 0 16px 18px rgba(0, 0, 0, 0.28), 0 4px 16px rgba(0, 0, 0, 0.12));
}

.k-window:focus,
.k-window.k-focus {
  box-shadow: var(--kendo-elevation-9, 0 32px 34px rgba(0, 0, 0, 0.32), 0 4px 16px rgba(0, 0, 0, 0.12));
}

.k-window-titlebar {
  border-color: inherit;
  color: var(--kendo-color-on-app-surface, #3d3d3d);
  background-color: var(--kendo-color-surface, #fafafa);
}

.k-window-primary .k-window-titlebar {
  color: var(--kendo-color-on-primary, #ffffff);
  background-color: var(--kendo-color-primary, #ff6358);
}

.k-window-light .k-window-titlebar {
  color: var(--kendo-color-on-light, #000000);
  background-color: var(--kendo-color-light, #ebebeb);
}

.k-window-dark .k-window-titlebar {
  color: var(--kendo-color-on-dark, #ffffff);
  background-color: var(--kendo-color-dark, #3d3d3d);
}

.k-editor {
  border-width: 1px;
  border-style: solid;
  box-sizing: border-box;
  outline: 0;
  font-family: var(--kendo-font-family, inherit);
  font-size: var(--kendo-font-size, inherit);
  line-height: var(--kendo-line-height, normal);
  display: flex;
  flex-flow: column nowrap;
  position: relative;
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.k-editor.k-readonly .k-editor-content {
  pointer-events: auto;
}

.k-editor.k-readonly .k-editor-content.k-focus {
  outline-width: 1px;
  outline-style: dashed;
}

.k-editor-inline {
  border-radius: var(--kendo-border-radius-md, 0.25rem);
  padding-block: var(--kendo-spacing-0\.5, 0.125rem);
  padding-inline: var(--kendo-spacing-1, 0.25rem);
  border: 1px solid transparent;
  word-wrap: break-word;
  overflow: auto;
  background: none;
}

.k-editor-resizable {
  resize: both;
  overflow: auto;
}

.k-editor-resize-handles-wrapper {
  position: absolute;
  visibility: hidden;
}

.k-editor-resize-wrap-element {
  display: inline-block;
  position: relative;
}

.k-editor-resize-handle {
  width: 8px;
  height: 8px;
  border-width: 1px;
  border-style: solid;
  box-sizing: border-box;
  position: absolute;
  visibility: visible;
  z-index: 100;
}

.k-editor-resize-handle.northwest {
  top: 0;
  left: 0;
  transform: translate(-50%, -50%);
  cursor: nw-resize;
}

.k-editor-resize-handle.north {
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%);
  cursor: n-resize;
}

.k-editor-resize-handle.northeast {
  top: 0;
  right: 0;
  transform: translate(50%, -50%);
  cursor: ne-resize;
}

.k-editor-resize-handle.southwest {
  left: 0;
  bottom: 0;
  transform: translate(-50%, 50%);
  cursor: sw-resize;
}

.k-editor-resize-handle.south {
  bottom: 0;
  left: 50%;
  transform: translate(-50%, 50%);
  cursor: s-resize;
}

.k-editor-resize-handle.southeast {
  right: 0;
  bottom: 0;
  transform: translate(50%, 50%);
  cursor: se-resize;
}

.k-editor-resize-handle.west {
  top: 50%;
  left: 0;
  transform: translate(-50%, -50%);
  cursor: w-resize;
}

.k-editor-resize-handle.east {
  top: 50%;
  right: 0;
  transform: translate(50%, -50%);
  cursor: e-resize;
}

.ProseMirror-selectednode {
  outline-width: 2px;
  outline-style: solid;
}

.ProseMirror-hideselection {
  caret-color: transparent;
}

.ProseMirror-hideselection *::selection,
.ProseMirror-hideselection *::-moz-selection {
  background: transparent;
}

.k-editor-toolbar {
  border-width: 0 0 1px;
  flex-shrink: 0;
}

.k-editor-toolbar .k-editor-export .k-icon {
  margin-right: 0.25em;
}

.k-editor-toolbar .k-editor-export .k-icon,
.k-editor-toolbar .k-editor-export .k-export-tool-text {
  vertical-align: middle;
}

.k-editor-content {
  flex: 1 1 auto;
  overflow-y: auto;
}

.k-editor-content > .k-iframe {
  width: 100%;
  height: 100%;
  border-width: 0;
  display: block;
}

.k-editor-content > .ProseMirror {
  padding: var(--kendo-spacing-2, 0.5rem);
  width: 100%;
  height: 100%;
  position: relative;
  box-sizing: border-box;
  outline: none;
  white-space: pre-wrap;
  overflow: auto;
}

.k-editor-content > .ProseMirror table {
  white-space: pre-wrap;
}

.k-editor-content > .ProseMirror .k-placeholder::before {
  content: attr(data-placeholder);
  height: 0;
  color: var(--kendo-color-subtle, #666666);
  float: left;
  opacity: 1;
  cursor: text;
  -webkit-user-select: none;
          user-select: none;
}

.k-editor-content > .ProseMirror[contenteditable=false] {
  cursor: unset !important;
}

.k-editor-content > .ProseMirror[contenteditable=false] .k-editor-resize-handles-wrapper,
.k-editor-content > .ProseMirror[contenteditable=false] .k-editor-resize-handle,
.k-editor-content > .ProseMirror[contenteditable=false] .row-resize-handle,
.k-editor-content > .ProseMirror[contenteditable=false] .column-resize-handle {
  display: none;
}

.k-editor-content > .ProseMirror[contenteditable=false] img,
.k-editor-content > .ProseMirror[contenteditable=false] table {
  pointer-events: none;
}

.k-editor-content > .ProseMirror[contenteditable=false] .ProseMirror-selectednode {
  outline: none;
}

.k-editor-content p {
  margin: 0 0 1rem;
}

.k-editor-content td p,
.k-editor-content th p,
.k-editor-content li p {
  margin: 0;
}

.k-editor-content table {
  margin: 0;
  border-collapse: collapse;
  table-layout: fixed;
  width: 100%;
  overflow: hidden;
}

.k-editor-content td,
.k-editor-content th {
  min-width: 1em;
  border: 1px solid;
  padding-block: 3px;
  padding-inline: 5px;
  vertical-align: top;
  box-sizing: border-box;
  position: relative;
}

.k-editor-content th {
  font-weight: bold;
  text-align: start;
}

.k-editor-content td {
  text-align: start;
}

.k-editor-content .selectedCell::after {
  z-index: 2;
  position: absolute;
  content: "";
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  pointer-events: none;
}

.k-edit-form-content {
  flex: 1 1 auto;
  overflow: auto;
  margin-block: -var(--kendo-spacing-4, 1rem);
  margin-inline: -var(--kendo-spacing-4, 1rem);
  padding-block: var(--kendo-spacing-4, 1rem);
  padding-inline: var(--kendo-spacing-4, 1rem);
}

.k-ct-popup {
  box-sizing: border-box;
  width: 190px;
  padding: 5px;
}

.k-ct-popup .k-button {
  width: 100%;
}

.k-ct-popup .k-ct-cell {
  margin: 1px;
  width: 20px;
  height: 20px;
  box-sizing: border-box;
  border: 1px solid;
  border-color: inherit;
  display: inline-block;
  vertical-align: top;
  overflow: hidden;
  opacity: 0.7;
  pointer-events: all;
}

.k-editor .k-resize-handle {
  position: absolute;
  right: 0;
  bottom: 0;
  padding: 0;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 0 13px 13px;
  border-color: transparent;
  border-bottom-color: inherit;
  cursor: se-resize;
}

.k-editor .k-resize-handle .k-i-arrow-45-down-right,
.k-editor .k-resize-handle .k-i-caret-br {
  display: none;
}

.k-editor-find-replace .k-content {
  position: relative;
}

.k-editor-find-replace .k-actions, .k-editor-find-replace .k-edit-buttons,
.k-editor-find-replace .k-action-buttons,
.k-editor-find-replace .k-columnmenu-actions, .k-editor-find-replace .k-form-buttons {
  padding: 0;
}

.k-editor-find-replace .k-search-options {
  display: flex;
  flex-direction: column;
  padding: 10px 0 40px;
}

.k-editor-find-replace .k-matches-container {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 0;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}

.k-textarea.k-editor-textarea {
  width: 100%;
  height: 100%;
  resize: none;
}

.k-filebrowser {
  max-width: 100%;
}

.k-filebrowser .k-floatwrap {
  display: flex;
}

.k-filebrowser .k-floatwrap::after {
  display: none;
}

.k-filebrowser .k-breadcrumbs {
  flex: 1;
}

.k-filebrowser .k-search-wrap {
  margin: 0 0 0 var(--kendo-spacing-4, 1rem);
  width: 150px;
  display: flex;
  align-items: center;
}

.k-filebrowser .k-search-wrap .k-input {
  flex: 1;
  width: 100px;
}

.k-filebrowser .k-search-wrap .k-icon {
  margin: 0;
  position: static;
}

.k-filebrowser .k-filebrowser-toolbar {
  margin: var(--kendo-spacing-4, 1rem) 0 0;
}

.k-filebrowser .k-upload {
  padding: 0;
  border-width: 0;
  background: none;
}

.k-filebrowser .k-upload .k-upload-button {
  margin: 0;
}

.k-filebrowser .k-upload .k-upload-status {
  display: none;
}

.k-filebrowser .k-upload-files {
  display: none;
}

.k-filebrowser .k-tiles {
  display: flex;
  flex-flow: row wrap;
  height: 390px;
  max-height: 50vh;
  margin: 0 0 var(--kendo-spacing-4, 1rem);
  padding-block: var(--kendo-spacing-1, 0.25rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
  border-top-width: 0;
  overflow: auto;
}

.k-filebrowser .k-tile {
  width: 33%;
  height: 90px;
  padding-block: var(--kendo-spacing-1, 0.25rem);
  padding-inline: var(--kendo-spacing-2, 0.5rem);
  box-sizing: border-box;
  white-space: nowrap;
  overflow: hidden;
  cursor: pointer;
  border-radius: var(--kendo-border-radius-md, 0.25rem);
}

.k-filebrowser .k-tile .k-i-file,
.k-filebrowser .k-tile .k-i-folder {
  font-size: 4em;
}

.k-filebrowser .k-tile input {
  width: 100px;
}

.k-filebrowser .k-tile strong {
  display: block;
  font-weight: 400;
  overflow: hidden;
  text-overflow: ellipsis;
}

.k-filebrowser .k-tile-empty {
  display: block;
  margin: auto;
}

.k-filebrowser .k-tile-empty.k-selected {
  color: inherit;
  border-width: 0;
  background-image: none;
  background-color: transparent;
}

.k-filebrowser .k-tile-empty strong {
  opacity: 0.5;
  font-size: 3em;
  font-weight: 400;
}

.k-filebrowser .k-thumb {
  float: left;
  margin-right: var(--kendo-spacing-1, 0.25rem);
}

.k-filebrowser .k-breadcrumbs-wrap {
  position: absolute;
  left: var(--kendo-spacing-2, 0.5rem);
  top: var(--kendo-spacing-1, 0.25rem);
}

.k-filebrowser .k-breadcrumbs-wrap .k-icon {
  position: static;
  margin-top: 0;
}

.k-editor-table-wizard-window .k-tabstrip-wrapper {
  display: flex;
  flex: 1 1 auto;
  overflow: auto;
}

.k-editor-table-wizard-window .k-tabstrip-wrapper .k-tabstrip.k-root-tabs {
  flex: 1 1 auto;
  margin-bottom: 0;
}

.k-editor-table-wizard-window .k-edit-field > .k-checkbox {
  position: relative;
}

.k-editor-inline .k-table {
  width: 100%;
  border-spacing: 0;
  margin: 0 0 1em;
}

.k-editor-inline .k-table, .k-editor-inline .k-table td {
  outline: 0;
  border-width: 1px;
  border-style: dotted;
}

.k-editor-inline .k-table td {
  min-width: 1px;
  padding-block: var(--kendo-spacing-0\.5, 0.125rem);
  padding-inline: var(--kendo-spacing-1, 0.25rem);
}

.k-editor-inline .k-element-resize-handle-wrapper {
  position: absolute;
  width: 5px;
  height: 5px;
  border-width: 1px;
  border-style: solid;
  z-index: 100;
}

.k-editor-inline .k-element-resize-handle-wrapper .k-element-resize-handle {
  width: 100%;
  height: 100%;
}

.k-editor-inline .k-element-resize-handle-wrapper .k-element-resize-handle.k-resize-east {
  cursor: e-resize;
}

.k-editor-inline .k-element-resize-handle-wrapper .k-element-resize-handle.k-resize-north {
  cursor: n-resize;
}

.k-editor-inline .k-element-resize-handle-wrapper .k-element-resize-handle.k-resize-northeast {
  cursor: ne-resize;
}

.k-editor-inline .k-element-resize-handle-wrapper .k-element-resize-handle.k-resize-northwest {
  cursor: nw-resize;
}

.k-editor-inline .k-element-resize-handle-wrapper .k-element-resize-handle.k-resize-south {
  cursor: s-resize;
}

.k-editor-inline .k-element-resize-handle-wrapper .k-element-resize-handle.k-resize-southeast {
  cursor: se-resize;
}

.k-editor-inline .k-element-resize-handle-wrapper .k-element-resize-handle.k-resize-southwest {
  cursor: sw-resize;
}

.k-editor-inline .k-element-resize-handle-wrapper .k-element-resize-handle.k-resize-west {
  cursor: w-resize;
}

.k-editor-inline .k-column-resize-handle-wrapper {
  position: absolute;
  height: 10px;
  width: 10px;
  cursor: col-resize;
  z-index: 2;
}

.k-editor-inline .k-column-resize-handle-wrapper .k-column-resize-handle {
  width: 100%;
  height: 100%;
}

.k-editor-inline .k-column-resize-handle-wrapper .k-column-resize-handle .k-column-resize-marker {
  width: 2px;
  height: 100%;
  margin-block: 0;
  margin-inline: auto;
  display: none;
  opacity: 0.8;
}

.k-editor-inline .k-row-resize-handle-wrapper {
  position: absolute;
  z-index: 2;
  cursor: row-resize;
  width: 10px;
  height: 10px;
}

.k-editor-inline .k-row-resize-handle-wrapper .k-row-resize-handle {
  display: table;
  width: 100%;
  height: 100%;
}

.k-editor-inline .k-row-resize-handle-wrapper .k-row-resize-marker-wrapper {
  display: table-cell;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  vertical-align: middle;
}

.k-editor-inline .k-row-resize-handle-wrapper .k-row-resize-marker {
  display: none;
  margin: 0;
  padding: 0;
  width: 100%;
  height: 2px;
  opacity: 0.8;
}

.k-editor {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
  color: var(--kendo-color-on-app-surface, #3d3d3d);
  background-color: var(--kendo-color-surface-alt, #ffffff);
}

.k-editor.k-readonly .k-editor-content.k-focus {
  outline-color: var(--kendo-color-on-app-surface, #3d3d3d);
}

.k-editor-inline .k-table, .k-editor-inline .k-table td {
  border-color: #cccccc;
}

.k-editor-inline .k-element-resize-handle-wrapper {
  background-color: #ffffff;
  border-color: #000000;
}

.k-editor-inline .k-column-resize-handle-wrapper .k-column-resize-handle .k-column-resize-marker {
  background-color: #00b0ff;
}

.k-editor-inline .k-row-resize-handle-wrapper .k-row-resize-marker {
  background-color: #00b0ff;
}

.k-editor-inline:hover, .k-editor-inline.k-hover, .k-editor-inline.k-active {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
}

.k-editor-resize-handle {
  background-color: #ffffff;
  border-color: #000000;
}

.ProseMirror-selectednode {
  outline-color: #88ccff;
}

.k-ct-popup .k-selected {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
  color: var(--kendo-color-on-primary, #ffffff);
  background-color: var(--kendo-color-primary, #ff6358);
  background-image: none;
}

.k-editor-content .k-text-selected, .k-editor-content::selection {
  color: var(--kendo-color-on-primary, #ffffff);
  background-color: var(--kendo-color-primary, #ff6358);
}

.k-editor-content .k-text-highlighted {
  background-color: var(--kendo-color-primary-subtle, #ffeceb);
}

.k-editor-content td,
.k-editor-content th {
  border-color: #dddddd;
}

.k-editor-content .selectedCell::after {
  background-color: rgba(200, 200, 255, 0.4);
}

.k-imageeditor {
  border-width: 1px;
  border-style: solid;
  box-sizing: border-box;
  outline: 0;
  font-family: var(--kendo-font-family, inherit);
  font-size: var(--kendo-font-size, inherit);
  line-height: var(--kendo-line-height, normal);
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.k-imageeditor *,
.k-imageeditor *::before,
.k-imageeditor *::after {
  box-sizing: border-box;
}

.k-imageeditor-toolbar {
  border-width: 0;
  border-bottom-width: 1px;
}

.k-imageeditor-content {
  border-width: 0;
  border-style: solid;
  border-color: inherit;
  display: flex;
  flex-flow: row nowrap;
}

.k-imageeditor-canvas-container {
  flex: 1 1 100%;
  display: flex;
  flex-flow: row nowrap;
  overflow: auto;
}

.k-imageeditor-canvas {
  margin: auto;
  display: flex;
  flex-direction: column;
  position: relative;
}

.k-imageeditor-action-pane {
  padding-block: var(--kendo-spacing-8, 2rem);
  padding-inline: var(--kendo-spacing-4, 1rem);
  width: calc(240px + 1px);
  border-width: 0;
  border-left-width: 1px;
  border-style: solid;
  border-color: inherit;
  box-sizing: border-box;
  flex: none;
  overflow-y: auto;
}

.k-imageeditor-action-pane .k-input-inner,
.k-imageeditor-action-pane .k-input-value-text {
  text-overflow: clip;
}

.k-imageeditor-crop-overlay {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.k-imageeditor-crop {
  width: 100%;
  height: 100%;
  border-width: 1px;
  border-style: dashed;
  box-sizing: border-box;
  position: absolute;
}

.k-imageeditor-crop .k-resize-handle {
  margin-block: var(--kendo-spacing-1px, 1px);
  margin-inline: var(--kendo-spacing-1px, 1px);
  border-style: solid;
  border-width: 0 2px 2px 0;
}

.k-imageeditor-crop .k-resize-sw,
.k-imageeditor-crop .k-resize-se,
.k-imageeditor-crop .k-resize-nw,
.k-imageeditor-crop .k-resize-ne {
  width: 15px;
  height: 15px;
}

.k-imageeditor-crop .k-resize-n,
.k-imageeditor-crop .k-resize-s {
  left: calc(50% - (7.5px));
  width: 15px;
  height: 0;
}

.k-imageeditor-crop .k-resize-w,
.k-imageeditor-crop .k-resize-e {
  top: calc(50% - (7.5px));
  width: 0;
  height: 15px;
}

.k-imageeditor-crop .k-resize-ne {
  transform: rotate(-90deg);
}

.k-imageeditor-crop .k-resize-nw {
  transform: rotate(-180deg);
}

.k-imageeditor-crop .k-resize-sw {
  transform: rotate(90deg);
}

.k-imageeditor-crop .k-resize-n {
  top: 0;
}

.k-imageeditor-crop .k-resize-s {
  bottom: 0;
}

.k-imageeditor-crop .k-resize-w {
  left: 0;
}

.k-imageeditor-crop .k-resize-e {
  right: 0;
}

.k-imageeditor {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
  color: var(--kendo-color-on-app-surface, #3d3d3d);
  background-color: var(--kendo-color-surface-alt, #ffffff);
}

.k-imageeditor-content {
  background-color: #c6c6c6;
}

.k-imageeditor-canvas {
  background: linear-gradient(45deg, rgba(0, 0, 0, 0.09) 25%, transparent 25%, transparent 75%, rgba(0, 0, 0, 0.09) 75%, rgba(0, 0, 0, 0.09)), linear-gradient(45deg, rgba(0, 0, 0, 0.09) 25%, transparent 25%, transparent 75%, rgba(0, 0, 0, 0.09) 75%, rgba(0, 0, 0, 0.09)), white;
  background-repeat: repeat, repeat;
  background-position: 0px 0px, calc(10px / 2) calc(10px / 2);
  transform-origin: 0 0 0;
  background-origin: padding-box, padding-box;
  background-size: 10px 10px, 10px 10px;
  box-shadow: none;
  text-shadow: none;
  transition: none;
  transform: scaleX(1) scaleY(1) scaleZ(1);
}

.k-imageeditor-action-pane {
  background-color: var(--kendo-color-surface, #fafafa);
}

.k-imageeditor-crop {
  border-color: white;
}

.k-imageeditor-crop-overlay {
  background-color: rgba(0, 0, 0, 0.3);
}

.k-tabstrip-wrapper {
  padding-block: var(--kendo-spacing-0, 0px);
  padding-inline: var(--kendo-spacing-0, 0px);
  box-sizing: border-box;
  border-width: 0px;
  border-style: solid;
  display: flex;
  flex-direction: column;
  position: relative;
}

.k-tabstrip {
  border-width: 0;
  border-color: transparent;
  box-sizing: border-box;
  outline: 0;
  font-family: var(--kendo-font-family, inherit);
  font-size: var(--kendo-font-size, inherit);
  line-height: var(--kendo-line-height, normal);
  color: inherit;
  background-color: transparent;
  display: flex;
  flex-flow: column nowrap;
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.k-tabstrip-wrapper > .k-tabstrip {
  flex: 1 1 auto;
}

.k-tabstrip-items-wrapper {
  box-sizing: border-box;
  border-width: 0;
  border-style: solid;
  border-color: inherit;
  position: relative;
  flex-shrink: 0;
}

.k-tabstrip-items {
  box-sizing: border-box;
  outline: 0;
  display: flex;
  flex-direction: inherit;
  flex-wrap: wrap;
  flex: 1 1 auto;
  gap: var(--kendo-spacing-0, 0px);
}

.k-tabstrip-items *,
.k-tabstrip-items *::before,
.k-tabstrip-items *::after {
  box-sizing: border-box;
}

.k-tabstrip-items .k-item {
  margin: 0;
  padding: 0;
  border: 1px solid transparent;
  position: relative;
  flex-shrink: 0;
  display: flex;
  flex-direction: row;
  align-items: stretch;
  justify-items: stretch;
  outline: 0;
}

.k-tabstrip-items .k-item-actions {
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: row;
}

.k-tabstrip-items .k-link {
  padding-block: var(--kendo-spacing-1\.5, 0.375rem);
  padding-inline: var(--kendo-spacing-3, 0.75rem);
  color: inherit;
  cursor: pointer;
  display: inline-flex;
  vertical-align: middle;
  flex: 1 1 auto;
  flex-direction: row;
  align-content: center;
  align-items: center;
  gap: var(--kendo-spacing-1, 0.25rem);
}

.k-tabstrip-content,
.k-tabstrip > .k-content {
  margin: 0 !important;
  padding-block: var(--kendo-spacing-4, 1rem);
  padding-inline: var(--kendo-spacing-4, 1rem);
  box-sizing: border-box;
  border-width: 1px;
  border-style: solid;
  border-color: inherit;
  display: none;
  overflow: auto;
  flex: 1 1 auto;
  position: relative;
}

.k-tabstrip-content.k-active,
.k-tabstrip > .k-content.k-active {
  display: block;
}

.k-tabstrip-content:focus, .k-tabstrip-content.k-focus,
.k-tabstrip > .k-content:focus,
.k-tabstrip > .k-content.k-focus {
  outline-width: 1px;
  outline-style: dotted;
  outline-offset: -1px;
}

.k-tabstrip-items .k-loading {
  width: 20%;
  height: 0;
  border: 0;
  border-top: 1px solid transparent;
  border-color: inherit;
  background: none;
  position: absolute;
  top: 0;
  left: 0;
  transition: width 0.2s linear;
  display: none;
}

.k-tabstrip-items .k-loading.k-complete {
  width: 100%;
  border-top-width: 0;
}

.k-tabstrip-scrollable > .k-tabstrip-items-wrapper > .k-tabstrip-items {
  flex-wrap: nowrap;
  white-space: nowrap;
  overflow: hidden;
}

.k-tabstrip-scrollable > .k-tabstrip-items-wrapper > .k-tabstrip-items.k-tabstrip-items-scroll {
  scrollbar-width: none;
}

.k-tabstrip-scrollable > .k-tabstrip-items-wrapper > .k-tabstrip-items.k-tabstrip-items-scroll::-webkit-scrollbar {
  display: none;
}

.k-tabstrip-scrollable.k-tabstrip-top .k-tabstrip-items.k-tabstrip-items-scroll, .k-tabstrip-scrollable.k-tabstrip-bottom .k-tabstrip-items.k-tabstrip-items-scroll {
  overflow-x: auto;
}

.k-tabstrip-scrollable.k-tabstrip-left .k-tabstrip-items.k-tabstrip-items-scroll, .k-tabstrip-scrollable.k-tabstrip-right .k-tabstrip-items.k-tabstrip-items-scroll {
  overflow-y: auto;
}

.k-tabstrip-scrollable-overlay .k-tabstrip-items-wrapper::before, .k-tabstrip-scrollable-overlay .k-tabstrip-items-wrapper::after {
  content: "";
  position: absolute;
  z-index: 3;
}

.k-tabstrip-scrollable-overlay.k-tabstrip-top .k-tabstrip-items-wrapper::before, .k-tabstrip-scrollable-overlay.k-tabstrip-top .k-tabstrip-items-wrapper::after, .k-tabstrip-scrollable-overlay.k-tabstrip-bottom .k-tabstrip-items-wrapper::before, .k-tabstrip-scrollable-overlay.k-tabstrip-bottom .k-tabstrip-items-wrapper::after {
  height: 100%;
  aspect-ratio: 1;
}

.k-tabstrip-scrollable-overlay.k-tabstrip-top .k-tabstrip-items-wrapper::before, .k-tabstrip-scrollable-overlay.k-tabstrip-bottom .k-tabstrip-items-wrapper::before {
  inset-inline-start: 0;
}

.k-tabstrip-scrollable-overlay.k-tabstrip-top .k-tabstrip-items-wrapper::after, .k-tabstrip-scrollable-overlay.k-tabstrip-bottom .k-tabstrip-items-wrapper::after {
  inset-inline-end: 0;
}

.k-tabstrip-scrollable-overlay.k-tabstrip-left .k-tabstrip-items-wrapper::before, .k-tabstrip-scrollable-overlay.k-tabstrip-left .k-tabstrip-items-wrapper::after, .k-tabstrip-scrollable-overlay.k-tabstrip-right .k-tabstrip-items-wrapper::before, .k-tabstrip-scrollable-overlay.k-tabstrip-right .k-tabstrip-items-wrapper::after {
  width: 100%;
}

.k-tabstrip-scrollable-overlay.k-tabstrip-left .k-tabstrip-items-wrapper::before, .k-tabstrip-scrollable-overlay.k-tabstrip-right .k-tabstrip-items-wrapper::before {
  inset-block-start: 0;
}

.k-tabstrip-scrollable-overlay.k-tabstrip-left .k-tabstrip-items-wrapper::after, .k-tabstrip-scrollable-overlay.k-tabstrip-right .k-tabstrip-items-wrapper::after {
  inset-block-end: 0;
}

.k-tabstrip-scrollable-overlay.k-tabstrip-scrollable-start .k-tabstrip-items-wrapper::before {
  display: none;
}

.k-tabstrip-scrollable-overlay.k-tabstrip-scrollable-end .k-tabstrip-items-wrapper::after {
  display: none;
}

.k-tabstrip-horizontal, .k-tabstrip-bottom > .k-tabstrip-items-wrapper, .k-tabstrip-top > .k-tabstrip-items-wrapper {
  flex-direction: row;
}

.k-tabstrip-vertical, .k-tabstrip-right > .k-tabstrip-items-wrapper, .k-tabstrip-left > .k-tabstrip-items-wrapper {
  flex-direction: column;
}

.k-tabstrip-top > .k-tabstrip-items-wrapper {
  border-bottom-width: 1px;
}

.k-tabstrip-top > .k-tabstrip-items-wrapper .k-item {
  border-top-left-radius: var(--kendo-border-radius-md, 0.25rem);
  border-top-right-radius: var(--kendo-border-radius-md, 0.25rem);
  border-bottom-width: 0;
}

.k-tabstrip-top > .k-tabstrip-items-wrapper .k-item .k-link {
  justify-content: center;
}

.k-tabstrip-top > .k-tabstrip-items-wrapper .k-item:active,
.k-tabstrip-top > .k-tabstrip-items-wrapper .k-item.k-active {
  margin-bottom: -1px;
  border-bottom-width: 1px;
  border-bottom-color: transparent !important;
}

.k-tabstrip-top > .k-content,
.k-tabstrip-top > .k-tabstrip-content {
  border-bottom-right-radius: var(--kendo-border-radius-md, 0.25rem);
  border-bottom-left-radius: var(--kendo-border-radius-md, 0.25rem);
  border-top-width: 0 !important;
}

.k-tabstrip-bottom > .k-tabstrip-items-wrapper {
  border-top-width: 1px;
}

.k-tabstrip-bottom > .k-tabstrip-items-wrapper .k-item {
  border-bottom-right-radius: var(--kendo-border-radius-md, 0.25rem);
  border-bottom-left-radius: var(--kendo-border-radius-md, 0.25rem);
  border-top-width: 0;
}

.k-tabstrip-bottom > .k-tabstrip-items-wrapper .k-item .k-link {
  justify-content: center;
}

.k-tabstrip-bottom > .k-tabstrip-items-wrapper .k-item:active,
.k-tabstrip-bottom > .k-tabstrip-items-wrapper .k-item.k-active {
  margin-top: -1px;
  border-top-width: 1px;
  border-top-color: transparent !important;
}

.k-tabstrip-bottom > .k-content,
.k-tabstrip-bottom > .k-tabstrip-content {
  border-top-left-radius: var(--kendo-border-radius-md, 0.25rem);
  border-top-right-radius: var(--kendo-border-radius-md, 0.25rem);
  border-bottom-width: 0 !important;
}

.k-tabstrip-left {
  flex-direction: row;
}

.k-tabstrip-left > .k-tabstrip-items-wrapper {
  border-right-width: 1px;
}

.k-tabstrip-left > .k-tabstrip-items-wrapper .k-item {
  border-top-left-radius: var(--kendo-border-radius-md, 0.25rem);
  border-bottom-left-radius: var(--kendo-border-radius-md, 0.25rem);
  border-right-width: 0;
}

.k-tabstrip-left > .k-tabstrip-items-wrapper .k-item:active,
.k-tabstrip-left > .k-tabstrip-items-wrapper .k-item.k-active {
  margin-right: -1px;
  border-right-width: 1px;
  border-right-color: transparent !important;
}

.k-tabstrip-left > .k-content,
.k-tabstrip-left > .k-tabstrip-content {
  border-top-right-radius: var(--kendo-border-radius-md, 0.25rem);
  border-bottom-right-radius: var(--kendo-border-radius-md, 0.25rem);
  border-left-width: 0 !important;
}

.k-tabstrip-right {
  flex-direction: row-reverse;
}

.k-tabstrip-right > .k-tabstrip-items-wrapper {
  border-left-width: 1px;
}

.k-tabstrip-right > .k-tabstrip-items-wrapper .k-item {
  border-top-right-radius: var(--kendo-border-radius-md, 0.25rem);
  border-bottom-right-radius: var(--kendo-border-radius-md, 0.25rem);
  border-left-width: 0;
}

.k-tabstrip-right > .k-tabstrip-items-wrapper .k-item:active,
.k-tabstrip-right > .k-tabstrip-items-wrapper .k-item.k-active {
  margin-left: -1px;
  border-left-width: 1px;
  border-left-color: transparent !important;
}

.k-tabstrip-right > .k-content,
.k-tabstrip-right > .k-tabstrip-content {
  border-top-left-radius: var(--kendo-border-radius-md, 0.25rem);
  border-bottom-left-radius: var(--kendo-border-radius-md, 0.25rem);
  border-right-width: 0;
}

.k-tabstrip-items-start {
  justify-content: flex-start;
}

.k-tabstrip-items-center {
  justify-content: center;
}

.k-tabstrip-items-end {
  justify-content: flex-end;
}

.k-tabstrip-items-justify {
  justify-content: space-between;
}

.k-tabstrip-items-stretched > * {
  flex: 1 0 0;
}

.k-rtl .k-tabstrip.k-tabstrip-left > .k-tabstrip-items-wrapper, .k-rtl .k-tabstrip.k-tabstrip-right > .k-tabstrip-items-wrapper,
.k-tabstrip[dir=rtl].k-tabstrip-left > .k-tabstrip-items-wrapper,
.k-tabstrip[dir=rtl].k-tabstrip-right > .k-tabstrip-items-wrapper {
  order: 1;
}

.k-rtl .k-tabstrip.k-tabstrip-left > .k-content, .k-rtl .k-tabstrip.k-tabstrip-right > .k-content,
.k-tabstrip[dir=rtl].k-tabstrip-left > .k-content,
.k-tabstrip[dir=rtl].k-tabstrip-right > .k-content {
  order: 0;
}

.k-rtl .k-tabstrip.k-tabstrip-left > .k-tabstrip-content, .k-rtl .k-tabstrip.k-tabstrip-right > .k-tabstrip-content,
.k-tabstrip[dir=rtl].k-tabstrip-left > .k-tabstrip-content,
.k-tabstrip[dir=rtl].k-tabstrip-right > .k-tabstrip-content {
  order: 0;
}

.k-tabstrip-sm .k-tabstrip-items .k-link {
  font-size: var(--kendo-font-size, inherit);
  line-height: var(--kendo-line-height, normal);
  padding-block: var(--kendo-spacing-1, 0.25rem);
  padding-inline: var(--kendo-spacing-3, 0.75rem);
}

:is(.k-tabstrip-sm.k-tabstrip-left, .k-tabstrip-sm.k-tabstrip-right):is(.k-tabstrip-scrollable-overlay) :is(.k-tabstrip-items-wrapper)::before, :is(.k-tabstrip-sm.k-tabstrip-left, .k-tabstrip-sm.k-tabstrip-right):is(.k-tabstrip-scrollable-overlay) :is(.k-tabstrip-items-wrapper)::after {
  height: calc(var(--kendo-line-height, normal) * 1em + 2px + var(--kendo-spacing-1, 0.25rem) * 2);
}

.k-tabstrip-md .k-tabstrip-items .k-link {
  font-size: var(--kendo-font-size, inherit);
  line-height: var(--kendo-line-height, normal);
  padding-block: var(--kendo-spacing-1\.5, 0.375rem);
  padding-inline: var(--kendo-spacing-3, 0.75rem);
}

:is(.k-tabstrip-md.k-tabstrip-left, .k-tabstrip-md.k-tabstrip-right):is(.k-tabstrip-scrollable-overlay) :is(.k-tabstrip-items-wrapper)::before, :is(.k-tabstrip-md.k-tabstrip-left, .k-tabstrip-md.k-tabstrip-right):is(.k-tabstrip-scrollable-overlay) :is(.k-tabstrip-items-wrapper)::after {
  height: calc(var(--kendo-line-height, normal) * 1em + 2px + var(--kendo-spacing-1\.5, 0.375rem) * 2);
}

.k-tabstrip-lg .k-tabstrip-items .k-link {
  font-size: var(--kendo-font-size-lg, inherit);
  line-height: var(--kendo-line-height-lg, normal);
  padding-block: var(--kendo-spacing-2\.5, 0.625rem);
  padding-inline: var(--kendo-spacing-3, 0.75rem);
}

:is(.k-tabstrip-lg.k-tabstrip-left, .k-tabstrip-lg.k-tabstrip-right):is(.k-tabstrip-scrollable-overlay) :is(.k-tabstrip-items-wrapper)::before, :is(.k-tabstrip-lg.k-tabstrip-left, .k-tabstrip-lg.k-tabstrip-right):is(.k-tabstrip-scrollable-overlay) :is(.k-tabstrip-items-wrapper)::after {
  height: calc(var(--kendo-line-height-lg, normal) * 1em + 2px + var(--kendo-spacing-2\.5, 0.625rem) * 2);
}

.k-tabstrip-items-wrapper {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
  color: var(--kendo-color-on-app-surface, #3d3d3d);
}

.k-tabstrip-items-wrapper .k-item {
  color: var(--kendo-color-subtle, #666666);
}

.k-tabstrip-items-wrapper .k-item:hover, .k-tabstrip-items-wrapper .k-item.k-hover {
  color: var(--kendo-color-on-app-surface, #3d3d3d);
}

.k-tabstrip-items-wrapper .k-item:active, .k-tabstrip-items-wrapper .k-item.k-active, .k-tabstrip-items-wrapper .k-item.k-selected {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
  color: var(--kendo-color-primary, #ff6358);
  background-color: var(--kendo-color-surface-alt, #ffffff);
}

.k-tabstrip-items-wrapper .k-item:focus, .k-tabstrip-items-wrapper .k-item.k-focus {
  box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.12);
}

.k-tabstrip-items-wrapper .k-item.k-tabstrip-dragging {
  box-shadow: var(--kendo-elevation-3, 0 6px 8px rgba(0, 0, 0, 0.08), 0 4px 16px rgba(0, 0, 0, 0.12));
}

.k-tabstrip-content,
.k-tabstrip > .k-content {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
  color: var(--kendo-color-on-app-surface, #3d3d3d);
  background-color: var(--kendo-color-surface-alt, #ffffff);
}

.k-tabstrip-content:focus, .k-tabstrip-content.k-focus,
.k-tabstrip > .k-content:focus,
.k-tabstrip > .k-content.k-focus {
  outline-color: var(--kendo-color-on-app-surface, #3d3d3d);
}

.k-tabstrip-scrollable-overlay.k-tabstrip-top .k-tabstrip-items-wrapper::before, .k-tabstrip-scrollable-overlay.k-tabstrip-bottom .k-tabstrip-items-wrapper::before {
  background: linear-gradient(90deg, var(--kendo-color-app-surface, #ffffff), color-mix(in srgb, var(--kendo-color-app-surface, #ffffff) 0%, transparent));
}

.k-tabstrip-scrollable-overlay.k-tabstrip-top .k-tabstrip-items-wrapper::after, .k-tabstrip-scrollable-overlay.k-tabstrip-bottom .k-tabstrip-items-wrapper::after {
  background: linear-gradient(270deg, var(--kendo-color-app-surface, #ffffff), color-mix(in srgb, var(--kendo-color-app-surface, #ffffff) 0%, transparent));
}

.k-tabstrip-scrollable-overlay.k-tabstrip-left .k-tabstrip-items-wrapper::before, .k-tabstrip-scrollable-overlay.k-tabstrip-right .k-tabstrip-items-wrapper::before {
  background: linear-gradient(180deg, var(--kendo-color-app-surface, #ffffff), color-mix(in srgb, var(--kendo-color-app-surface, #ffffff) 0%, transparent));
}

.k-tabstrip-scrollable-overlay.k-tabstrip-left .k-tabstrip-items-wrapper::after, .k-tabstrip-scrollable-overlay.k-tabstrip-right .k-tabstrip-items-wrapper::after {
  background: linear-gradient(360deg, var(--kendo-color-app-surface, #ffffff), color-mix(in srgb, var(--kendo-color-app-surface, #ffffff) 0%, transparent));
}

:is(.k-rtl .k-tabstrip-scrollable-overlay, [dir=rtl] .k-tabstrip-scrollable-overlay, .k-tabstrip-scrollable-overlay.k-rtl, .k-tabstrip-scrollable-overlay[dir=rtl]).k-tabstrip-top .k-tabstrip-items-wrapper::before, :is(.k-rtl .k-tabstrip-scrollable-overlay, [dir=rtl] .k-tabstrip-scrollable-overlay, .k-tabstrip-scrollable-overlay.k-rtl, .k-tabstrip-scrollable-overlay[dir=rtl]).k-tabstrip-bottom .k-tabstrip-items-wrapper::before {
  background: linear-gradient(270deg, var(--kendo-color-app-surface, #ffffff), color-mix(in srgb, var(--kendo-color-app-surface, #ffffff) 0%, transparent));
}

:is(.k-rtl .k-tabstrip-scrollable-overlay, [dir=rtl] .k-tabstrip-scrollable-overlay, .k-tabstrip-scrollable-overlay.k-rtl, .k-tabstrip-scrollable-overlay[dir=rtl]).k-tabstrip-top .k-tabstrip-items-wrapper::after, :is(.k-rtl .k-tabstrip-scrollable-overlay, [dir=rtl] .k-tabstrip-scrollable-overlay, .k-tabstrip-scrollable-overlay.k-rtl, .k-tabstrip-scrollable-overlay[dir=rtl]).k-tabstrip-bottom .k-tabstrip-items-wrapper::after {
  background: linear-gradient(90deg, var(--kendo-color-app-surface, #ffffff), color-mix(in srgb, var(--kendo-color-app-surface, #ffffff) 0%, transparent));
}

.k-pos-static, .k-static {
  position: static;
}

.\!k-pos-static, .\!k-static {
  position: static !important;
}

.k-pos-relative, .k-relative {
  position: relative;
}

.\!k-pos-relative, .\!k-relative {
  position: relative !important;
}

.k-pos-absolute, .k-absolute {
  position: absolute;
}

.\!k-pos-absolute, .\!k-absolute {
  position: absolute !important;
}

.k-pos-fixed, .k-fixed {
  position: fixed;
}

.\!k-pos-fixed, .\!k-fixed {
  position: fixed !important;
}

.k-pos-sticky, .k-sticky {
  position: sticky;
}

.\!k-pos-sticky, .\!k-sticky {
  position: sticky !important;
}

.k-pager {
  padding: 0;
  border-width: 1px;
  border-style: solid;
  box-sizing: border-box;
  outline: 0;
  font-family: var(--kendo-font-family, inherit);
  font-size: var(--kendo-font-size, inherit);
  line-height: var(--kendo-line-height, normal);
  white-space: nowrap;
  display: flex;
  align-items: center;
  position: relative;
  overflow: hidden;
  cursor: default;
  flex: 0 0 auto;
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.k-pager *,
.k-pager *::before,
.k-pager *::after {
  box-sizing: border-box;
}

.k-pager-info, .k-pager-sizes, .k-pager-input {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.k-pager-nav {
  color: inherit;
  text-align: center;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

.k-pager-nav:hover {
  z-index: 2;
}

.k-disabled.k-pager-nav {
  color: inherit;
}

.k-pager-numbers-wrap {
  display: flex;
  flex-direction: row;
  position: relative;
}

.k-pager-numbers-wrap select.k-dropdown-list, .k-pager-numbers-wrap select.k-dropdown,
.k-pager-numbers-wrap select.k-dropdownlist {
  width: 5em;
}

.k-pager-numbers {
  display: flex;
  flex-direction: row;
}

.k-pager-numbers .k-selected {
  cursor: inherit;
  z-index: 2;
}

.k-pager-input {
  gap: 1ex;
}

.k-pager-input .k-textbox,
.k-pager-input .k-numerictextbox {
  margin-block: 0;
  width: 5em;
}

.k-pager-sizes {
  gap: 1ex;
}

.k-pager-sizes .k-input-inner,
.k-pager-sizes .k-input-value-text {
  text-overflow: clip;
}

.k-pager-info {
  text-align: end;
  justify-content: flex-end;
  flex: 1 1 0%;
  order: 9;
}

.k-pager-refresh {
  margin-inline-start: auto;
  color: inherit;
  order: 10;
}

.k-pager-sm {
  padding-inline: var(--kendo-spacing-1, 0.25rem);
  padding-block: var(--kendo-spacing-1, 0.25rem);
  gap: var(--kendo-spacing-3, 0.75rem);
}

.k-pager-sm .k-pager-numbers-wrap .k-button {
  min-width: calc(var(--kendo-line-height, normal) * 1em + var(--kendo-spacing-0\.5, 0.125rem) * 2 + 1px * 2);
}

.k-pager-sm .k-pager-numbers-wrap .k-pager-input,
.k-pager-sm .k-pager-numbers-wrap > select.k-dropdown-list,
.k-pager-sm .k-pager-numbers-wrap > select.k-dropdown,
.k-pager-sm .k-pager-numbers-wrap > select.k-dropdownlist {
  margin-inline-start: var(--kendo-spacing-3, 0.75rem);
  margin-inline-end: var(--kendo-spacing-3, 0.75rem);
}

.k-pager-sm .k-pager-sizes .k-dropdown-list, .k-pager-sm .k-pager-sizes .k-dropdown,
.k-pager-sm .k-pager-sizes .k-dropdownlist,
.k-pager-sm .k-pager-sizes > select {
  width: 5em;
}

.k-pager-md {
  padding-inline: var(--kendo-spacing-2, 0.5rem);
  padding-block: var(--kendo-spacing-2, 0.5rem);
  gap: var(--kendo-spacing-3\.5, 0.875rem);
}

.k-pager-md .k-pager-numbers-wrap .k-button {
  min-width: calc(var(--kendo-line-height, normal) * 1em + var(--kendo-spacing-1, 0.25rem) * 2 + 1px * 2);
}

.k-pager-md .k-pager-numbers-wrap .k-pager-input,
.k-pager-md .k-pager-numbers-wrap > select.k-dropdown-list,
.k-pager-md .k-pager-numbers-wrap > select.k-dropdown,
.k-pager-md .k-pager-numbers-wrap > select.k-dropdownlist {
  margin-inline-start: var(--kendo-spacing-3\.5, 0.875rem);
  margin-inline-end: var(--kendo-spacing-3\.5, 0.875rem);
}

.k-pager-md .k-pager-sizes .k-dropdown-list, .k-pager-md .k-pager-sizes .k-dropdown,
.k-pager-md .k-pager-sizes .k-dropdownlist,
.k-pager-md .k-pager-sizes > select {
  width: 5em;
}

.k-pager-lg {
  padding-inline: var(--kendo-spacing-2\.5, 0.625rem);
  padding-block: var(--kendo-spacing-2\.5, 0.625rem);
  gap: var(--kendo-spacing-4, 1rem);
}

.k-pager-lg .k-pager-numbers-wrap .k-button {
  min-width: calc(var(--kendo-line-height-lg, normal) * 1em + var(--kendo-spacing-2, 0.5rem) * 2 + 1px * 2);
}

.k-pager-lg .k-pager-numbers-wrap .k-pager-input,
.k-pager-lg .k-pager-numbers-wrap > select.k-dropdown-list,
.k-pager-lg .k-pager-numbers-wrap > select.k-dropdown,
.k-pager-lg .k-pager-numbers-wrap > select.k-dropdownlist {
  margin-inline-start: var(--kendo-spacing-4, 1rem);
  margin-inline-end: var(--kendo-spacing-4, 1rem);
}

.k-pager-lg .k-pager-sizes .k-dropdown-list, .k-pager-lg .k-pager-sizes .k-dropdown,
.k-pager-lg .k-pager-sizes .k-dropdownlist,
.k-pager-lg .k-pager-sizes > select {
  width: 5em;
}

.k-pager {
  border-color: var(--kendo-color-border, rgba(0, 0, 0, 0.08));
  color: var(--kendo-color-on-app-surface, #3d3d3d);
  background-color: var(--kendo-color-surface, #fafafa);
}

.k-pager:focus, .k-pager.k-focus {
  box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.13);
}

:root {
  --date-time-border-radius: 50%;
  --font-size-xs: 13px;
  --font-size-sm: 14px;
  --font-size-md: 16px;
  --date-time-icon-offset: 35px;
  --date-time-width: 10.4em;
  --date-time-height: 36px;
  --date-time-padding-horizontal: 8px;
  --date-time-padding-vertical: 12px;
  --date-time-icon-size: 24px;
  --border-radius-small: 3px;
  --icon-size-s: 1.6rem;
  --kendo-border-radius-none: 0px;
  --kendo-border-radius-xs: 1px;
  --kendo-border-radius-sm: 0.125rem;
  --kendo-border-radius-md: 0.25rem;
  --kendo-border-radius-lg: 0.5rem;
  --kendo-border-radius-xl: 0.75rem;
  --kendo-border-radius-xxl: 1rem;
  --kendo-border-radius-xxxl: 1.25rem;
  --kendo-border-radius-full: 9999px;
  --kendo-spacing-0: 0px;
  --kendo-spacing-1: 0.25rem;
  --kendo-spacing-2: 0.5rem;
  --kendo-spacing-3: 0.75rem;
  --kendo-spacing-4: 1rem;
  --kendo-spacing-5: 1.25rem;
  --kendo-spacing-6: 1.5rem;
  --kendo-spacing-7: 1.75rem;
  --kendo-spacing-8: 2rem;
  --kendo-spacing-9: 2.25rem;
  --kendo-spacing-10: 2.5rem;
  --kendo-spacing-11: 2.75rem;
  --kendo-spacing-12: 3rem;
  --kendo-spacing-13: 3.25rem;
  --kendo-spacing-14: 3.5rem;
  --kendo-spacing-15: 3.75rem;
  --kendo-spacing-16: 4rem;
  --kendo-spacing-17: 4.25rem;
  --kendo-spacing-18: 4.5rem;
  --kendo-spacing-19: 4.75rem;
  --kendo-spacing-20: 5rem;
  --kendo-spacing-21: 5.25rem;
  --kendo-spacing-22: 5.5rem;
  --kendo-spacing-23: 5.75rem;
  --kendo-spacing-24: 6rem;
  --kendo-spacing-25: 7rem;
  --kendo-spacing-26: 8rem;
  --kendo-spacing-27: 9rem;
  --kendo-spacing-28: 10rem;
  --kendo-spacing-29: 11rem;
  --kendo-spacing-30: 12rem;
  --kendo-spacing-1px: 1px;
  --kendo-spacing-0-5: 0.125rem;
  --kendo-spacing-1-5: 0.375rem;
  --kendo-spacing-2-5: 0.625rem;
  --kendo-spacing-3-5: 0.875rem;
  --kendo-spacing-4-5: 1.125rem;
  --kendo-spacing-5-5: 1.375rem;
  --kendo-spacing-6-5: 1.625rem;
  --kendo-spacing-7-5: 1.875rem;
  --date-time-icon-border-color: #e4e4e4;
  --date-time-icon-color: #777;
  --date-time-content-color: #656565;
  --color-info-bg: #dcecf5;
  --color-primary-invert: #333;
  --color-primary: #fff;
  --color-info: #006cd9;
  --color-primary-variant: #f5f5f5;
  --color-secondary: #ccc;
  --date-time-icon-bg-hover: #e4e4e4;
  --kendo-neutral-220: #ee8010ff;
  --color-secondary-lightest: #eee;
  --color-secondary-darkest: #777;
  --color-secondary-darker: #999;
  --kendo-color-app-surface: #ffffff;
  --kendo-color-on-app-surface: #323130;
  --kendo-color-subtle: #605e5c;
  --kendo-color-surface: #faf9f8;
  --kendo-color-surface-alt: #ffffff;
  --kendo-color-border: #8a8886;
  --kendo-color-border-alt: #323130;
  --kendo-color-base-subtle: #edebe9;
  --kendo-color-base-subtle-hover: #e1dfdd;
  --kendo-color-base-subtle-active: #d2d0ce;
  --kendo-color-base: #ffffff;
  --kendo-color-base-hover: #f3f2f1;
  --kendo-color-base-active: #edebe9;
  --kendo-color-base-emphasis: #605e5c;
  --kendo-color-base-on-subtle: #323130;
  --kendo-color-on-base: #323130;
  --kendo-color-base-on-surface: #323130;
  --kendo-color-primary-subtle: #deecf9;
  --kendo-color-primary-subtle-hover: #c7e0f4;
  --kendo-color-primary-subtle-active: #abd1ef;
  --kendo-color-primary: #0078d4;
  --kendo-color-primary-hover: #106ebe;
  --kendo-color-primary-active: #005a9e;
  --kendo-color-primary-emphasis: #004578;
  --kendo-color-primary-on-subtle: #001c30;
  --kendo-color-on-primary: #ffffff;
  --kendo-color-primary-on-surface: #0078d4;
  --kendo-color-secondary-subtle: #faf9f8;
  --kendo-color-secondary-subtle-hover: #f3f2f1;
  --kendo-color-secondary-subtle-active: #edebe9;
  --kendo-color-secondary: #979593;
  --kendo-color-secondary-hover: #8a8886;
  --kendo-color-secondary-active: #797775;
  --kendo-color-secondary-emphasis: #605e5c;
  --kendo-color-secondary-on-subtle: #323130;
  --kendo-color-on-secondary: #ffffff;
  --kendo-color-secondary-on-surface: #605e5c;
  --kendo-color-tertiary-subtle: #deecf9;
  --kendo-color-tertiary-subtle-hover: #bfdbf3;
  --kendo-color-tertiary-subtle-active: #aacfef;
  --kendo-color-tertiary: #2b88d8;
  --kendo-color-tertiary-hover: #287ec7;
  --kendo-color-tertiary-active: #2473b7;
  --kendo-color-tertiary-emphasis: #2169a6;
  --kendo-color-tertiary-on-subtle: #174974;
  --kendo-color-on-tertiary: #ffffff;
  --kendo-color-tertiary-on-surface: #2b88d8;
  --kendo-color-info-subtle: #cee5ff;
  --kendo-color-info-subtle-hover: #add4ff;
  --kendo-color-info-subtle-active: #8dc3ff;
  --kendo-color-info: #0a7eff;
  --kendo-color-info-hover: #096edf;
  --kendo-color-info-active: #085ebf;
  --kendo-color-info-emphasis: #064f9f;
  --kendo-color-info-on-subtle: #032040;
  --kendo-color-on-info: #ffffff;
  --kendo-color-info-on-surface: #096edf;
  --kendo-color-success-subtle: #dff6dd;
  --kendo-color-success-subtle-hover: #c8e8c6;
  --kendo-color-success-subtle-active: #b1dbaf;
  --kendo-color-success: #55a554;
  --kendo-color-success-hover: #3e973e;
  --kendo-color-success-active: #278a27;
  --kendo-color-success-emphasis: #107c10;
  --kendo-color-success-on-subtle: #063206;
  --kendo-color-on-success: #ffffff;
  --kendo-color-success-on-surface: #107c10;
  --kendo-color-warning-subtle: #fff4ce;
  --kendo-color-warning-subtle-hover: #ffedad;
  --kendo-color-warning-subtle-active: #ffe58d;
  --kendo-color-warning: #ffc80a;
  --kendo-color-warning-hover: #f5c000;
  --kendo-color-warning-active: #e0b000;
  --kendo-color-warning-emphasis: #4e4d4b;
  --kendo-color-warning-on-subtle: #323130;
  --kendo-color-on-warning: #323130;
  --kendo-color-warning-on-surface: #7a6000;
  --kendo-color-error-subtle: #fde7e9;
  --kendo-color-error-subtle-hover: #f3d2d4;
  --kendo-color-error-subtle-active: #e9bcbf;
  --kendo-color-error: #c2666b;
  --kendo-color-error-hover: #b85156;
  --kendo-color-error-active: #ae3b41;
  --kendo-color-error-emphasis: #a4262c;
  --kendo-color-error-on-subtle: #420f12;
  --kendo-color-on-error: #ffffff;
  --kendo-color-error-on-surface: #a4262c;
  --kendo-color-light-subtle: #faf9f8;
  --kendo-color-light-subtle-hover: #f3f2f1;
  --kendo-color-light-subtle-active: #edebe9;
  --kendo-color-light: #d2d0ce;
  --kendo-color-light-hover: #c8c6c4;
  --kendo-color-light-active: #a19f9d;
  --kendo-color-light-emphasis: #e1dfdd;
  --kendo-color-light-on-subtle: #323130;
  --kendo-color-on-light: #323130;
  --kendo-color-light-on-surface: #d2d0ce;
  --kendo-color-dark-subtle: #a19f9d;
  --kendo-color-dark-subtle-hover: #979593;
  --kendo-color-dark-subtle-active: #8a8886;
  --kendo-color-dark: #323130;
  --kendo-color-dark-hover: #201f1e;
  --kendo-color-dark-active: #000000;
  --kendo-color-dark-emphasis: #797775;
  --kendo-color-dark-on-subtle: #201f1e;
  --kendo-color-on-dark: #ffffff;
  --kendo-color-dark-on-surface: #323130;
  --kendo-color-inverse-subtle: #a19f9d;
  --kendo-color-inverse-subtle-hover: #979593;
  --kendo-color-inverse-subtle-active: #8a8886;
  --kendo-color-inverse: #323130;
  --kendo-color-inverse-hover: #201f1e;
  --kendo-color-inverse-active: #000000;
  --kendo-color-inverse-emphasis: #797775;
  --kendo-color-inverse-on-subtle: #201f1e;
  --kendo-color-on-inverse: #ffffff;
  --kendo-color-inverse-on-surface: #323130;
  --kendo-color-series-a: #0099bc;
  --kendo-color-series-a-bold: #00738d;
  --kendo-color-series-a-bolder: #004d5e;
  --kendo-color-series-a-subtle: #40b3cd;
  --kendo-color-series-a-subtler: #80ccdd;
  --kendo-color-series-b: #e74856;
  --kendo-color-series-b-bold: #ad3641;
  --kendo-color-series-b-bolder: #74242b;
  --kendo-color-series-b-subtle: #ed7680;
  --kendo-color-series-b-subtler: #f3a3aa;
  --kendo-color-series-c: #ffb900;
  --kendo-color-series-c-bold: #bf8b00;
  --kendo-color-series-c-bolder: #805d00;
  --kendo-color-series-c-subtle: #ffcb40;
  --kendo-color-series-c-subtler: #ffdc80;
  --kendo-color-series-d: #0078d7;
  --kendo-color-series-d-bold: #005aa1;
  --kendo-color-series-d-bolder: #003c6c;
  --kendo-color-series-d-subtle: #409ae1;
  --kendo-color-series-d-subtler: #80bbeb;
  --kendo-color-series-e: #8764b8;
  --kendo-color-series-e-bold: #654b8a;
  --kendo-color-series-e-bolder: #44325c;
  --kendo-color-series-e-subtle: #a58bca;
  --kendo-color-series-e-subtler: #c3b1db;
  --kendo-color-series-f: #00cc6a;
  --kendo-color-series-f-bold: #009950;
  --kendo-color-series-f-bolder: #006635;
  --kendo-color-series-f-subtle: #40d98f;
  --kendo-color-series-f-subtler: #80e5b4;
  --kendo-elevation-1: 0px 0.3px 0.9px 0 rgba(0, 0, 0, 0.1), 0px 1.6px 3.6px 0 rgba(0, 0, 0, 0.13);
  --kendo-elevation-2: 0px 0.6px 1.8px 0 rgba(0, 0, 0, 0.1), 0px 3.2px 7.2px 0 rgba(0, 0, 0, 0.13);
  --kendo-elevation-3: 0px 0.9px 2.7px 0 rgba(0, 0, 0, 0.1), 0px 4.8px 10.8px 0 rgba(0, 0, 0, 0.13);
  --kendo-elevation-4: 0px 1.2px 3.6px 0 rgba(0, 0, 0, 0.1), 0px 6.4px 14.4px 0 rgba(0, 0, 0, 0.13);
  --kendo-elevation-5: 0px 1.8px 5.4px 0 rgba(0, 0, 0, 0.1), 0px 9.6px 21.6px 0 rgba(0, 0, 0, 0.13);
  --kendo-elevation-6: 0px 2.4px 7.2px 0 rgba(0, 0, 0, 0.18), 0px 12.8px 28.8px 0 rgba(0, 0, 0, 0.22);
  --kendo-elevation-7: 0px 3.2px 10.8px 0 rgba(0, 0, 0, 0.18), 0px 19.2px 43.2px 0 rgba(0, 0, 0, 0.22);
  --kendo-elevation-8: 0px 4.8px 14.4px 0 rgba(0, 0, 0, 0.18), 0px 25.6px 57.6px 0 rgba(0, 0, 0, 0.22);
  --kendo-elevation-9: 0px 6.4px 18px 0 rgba(0, 0, 0, 0.18), 0px 32px 72px 0 rgba(0, 0, 0, 0.22);
  --kendo-border-radius-none: var(--kendo-border-radius-none);
  --kendo-border-radius-xs: var(--kendo-border-radius-xs);
  --kendo-border-radius-sm: var(--kendo-border-radius-sm);
  --kendo-border-radius-md: var(--kendo-border-radius-md);
  --kendo-border-radius-lg: var(--kendo-border-radius-lg);
  --kendo-border-radius-xl: var(--kendo-border-radius-xl);
  --kendo-border-radius-xxl: var(--kendo-border-radius-xxl);
  --kendo-border-radius-xxxl: var(--kendo-border-radius-xxxl);
  --kendo-border-radius-full: var(--kendo-border-radius-full);
  --kendo-spacing-0: var(--kendo-spacing-0);
  --kendo-spacing-1: var(--kendo-spacing-1);
  --kendo-spacing-2: var(--kendo-spacing-2);
  --kendo-spacing-3: var(--kendo-spacing-3);
  --kendo-spacing-4: var(--kendo-spacing-4);
  --kendo-spacing-5: var(--kendo-spacing-5);
  --kendo-spacing-6: var(--kendo-spacing-6);
  --kendo-spacing-7: var(--kendo-spacing-7);
  --kendo-spacing-8: var(--kendo-spacing-8);
  --kendo-spacing-9: var(--kendo-spacing-9);
  --kendo-spacing-10: var(--kendo-spacing-10);
  --kendo-spacing-11: var(--kendo-spacing-11);
  --kendo-spacing-12: var(--kendo-spacing-12);
  --kendo-spacing-13: var(--kendo-spacing-13);
  --kendo-spacing-14: var(--kendo-spacing-14);
  --kendo-spacing-15: var(--kendo-spacing-15);
  --kendo-spacing-16: var(--kendo-spacing-16);
  --kendo-spacing-17: var(--kendo-spacing-17);
  --kendo-spacing-18: var(--kendo-spacing-18);
  --kendo-spacing-19: var(--kendo-spacing-19);
  --kendo-spacing-20: var(--kendo-spacing-20);
  --kendo-spacing-21: var(--kendo-spacing-21);
  --kendo-spacing-22: var(--kendo-spacing-22);
  --kendo-spacing-23: var(--kendo-spacing-23);
  --kendo-spacing-24: var(--kendo-spacing-24);
  --kendo-spacing-25: var(--kendo-spacing-25);
  --kendo-spacing-26: var(--kendo-spacing-26);
  --kendo-spacing-27: var(--kendo-spacing-27);
  --kendo-spacing-28: var(--kendo-spacing-28);
  --kendo-spacing-29: var(--kendo-spacing-29);
  --kendo-spacing-30: var(--kendo-spacing-30);
  --kendo-spacing-1px: var(--kendo-spacing-1px);
  --kendo-spacing-0-5: var(--kendo-spacing-0-5);
  --kendo-spacing-1-5: var(--kendo-spacing-1-5);
  --kendo-spacing-2-5: var(--kendo-spacing-2-5);
  --kendo-spacing-3-5: var(--kendo-spacing-3-5);
  --kendo-spacing-4-5: var(--kendo-spacing-4-5);
  --kendo-spacing-5-5: var(--kendo-spacing-5-5);
  --kendo-spacing-6-5: var(--kendo-spacing-6-5);
  --kendo-spacing-7-5: var(--kendo-spacing-7-5);
  --kendo-color-app-surface: var(--kendo-color-app-surface);
  --kendo-color-on-app-surface: var(--kendo-color-on-app-surface);
  --kendo-color-subtle: var(--kendo-color-subtle);
  --kendo-color-surface: var(--kendo-color-surface);
  --kendo-color-surface-alt: var(--kendo-color-surface-alt);
  --kendo-color-border: var(--kendo-color-border);
  --kendo-color-border-alt: var(--kendo-color-border-alt);
  --kendo-color-base-subtle: var(--kendo-color-base-subtle);
  --kendo-color-base-subtle-hover: var(--kendo-color-base-subtle-hover);
  --kendo-color-base-subtle-active: var(--kendo-color-base-subtle-active);
  --kendo-color-base: var(--kendo-color-base);
  --kendo-color-base-hover: var(--kendo-color-base-hover);
  --kendo-color-base-active: var(--kendo-color-base-active);
  --kendo-color-base-emphasis: var(--kendo-color-base-emphasis);
  --kendo-color-base-on-subtle: var(--kendo-color-base-on-subtle);
  --kendo-color-on-base: var(--kendo-color-on-base);
  --kendo-color-base-on-surface: var(--kendo-color-base-on-surface);
  --kendo-color-primary-subtle: var(--kendo-color-primary-subtle);
  --kendo-color-primary-subtle-hover: var(--kendo-color-primary-subtle-hover);
  --kendo-color-primary-subtle-active: var(--kendo-color-primary-subtle-active);
  --kendo-color-primary: var(--kendo-color-primary);
  --kendo-color-primary-hover: var(--kendo-color-primary-hover);
  --kendo-color-primary-active: var(--kendo-color-primary-active);
  --kendo-color-primary-emphasis: var(--kendo-color-primary-emphasis);
  --kendo-color-primary-on-subtle: var(--kendo-color-primary-on-subtle);
  --kendo-color-on-primary: var(--kendo-color-on-primary);
  --kendo-color-primary-on-surface: var(--kendo-color-primary-on-surface);
  --kendo-color-secondary-subtle: var(--kendo-color-secondary-subtle);
  --kendo-color-secondary-subtle-hover: var(--kendo-color-secondary-subtle-hover);
  --kendo-color-secondary-subtle-active: var(--kendo-color-secondary-subtle-active);
  --kendo-color-secondary: var(--kendo-color-secondary);
  --kendo-color-secondary-hover: var(--kendo-color-secondary-hover);
  --kendo-color-secondary-active: var(--kendo-color-secondary-active);
  --kendo-color-secondary-emphasis: var(--kendo-color-secondary-emphasis);
  --kendo-color-secondary-on-subtle: var(--kendo-color-secondary-on-subtle);
  --kendo-color-on-secondary: var(--kendo-color-on-secondary);
  --kendo-color-secondary-on-surface: var(--kendo-color-secondary-on-surface);
  --kendo-color-tertiary-subtle: var(--kendo-color-tertiary-subtle);
  --kendo-color-tertiary-subtle-hover: var(--kendo-color-tertiary-subtle-hover);
  --kendo-color-tertiary-subtle-active: var(--kendo-color-tertiary-subtle-active);
  --kendo-color-tertiary: var(--kendo-color-tertiary);
  --kendo-color-tertiary-hover: var(--kendo-color-tertiary-hover);
  --kendo-color-tertiary-active: var(--kendo-color-tertiary-active);
  --kendo-color-tertiary-emphasis: var(--kendo-color-tertiary-emphasis);
  --kendo-color-tertiary-on-subtle: var(--kendo-color-tertiary-on-subtle);
  --kendo-color-on-tertiary: var(--kendo-color-on-tertiary);
  --kendo-color-tertiary-on-surface: var(--kendo-color-tertiary-on-surface);
  --kendo-color-info-subtle: var(--kendo-color-info-subtle);
  --kendo-color-info-subtle-hover: var(--kendo-color-info-subtle-hover);
  --kendo-color-info-subtle-active: var(--kendo-color-info-subtle-active);
  --kendo-color-info: var(--kendo-color-info);
  --kendo-color-info-hover: var(--kendo-color-info-hover);
  --kendo-color-info-active: var(--kendo-color-info-active);
  --kendo-color-info-emphasis: var(--kendo-color-info-emphasis);
  --kendo-color-info-on-subtle: var(--kendo-color-info-on-subtle);
  --kendo-color-on-info: var(--kendo-color-on-info);
  --kendo-color-info-on-surface: var(--kendo-color-info-on-surface);
  --kendo-color-success-subtle: var(--kendo-color-success-subtle);
  --kendo-color-success-subtle-hover: var(--kendo-color-success-subtle-hover);
  --kendo-color-success-subtle-active: var(--kendo-color-success-subtle-active);
  --kendo-color-success: var(--kendo-color-success);
  --kendo-color-success-hover: var(--kendo-color-success-hover);
  --kendo-color-success-active: var(--kendo-color-success-active);
  --kendo-color-success-emphasis: var(--kendo-color-success-emphasis);
  --kendo-color-success-on-subtle: var(--kendo-color-success-on-subtle);
  --kendo-color-on-success: var(--kendo-color-on-success);
  --kendo-color-success-on-surface: var(--kendo-color-success-on-surface);
  --kendo-color-warning-subtle: var(--kendo-color-warning-subtle);
  --kendo-color-warning-subtle-hover: var(--kendo-color-warning-subtle-hover);
  --kendo-color-warning-subtle-active: var(--kendo-color-warning-subtle-active);
  --kendo-color-warning: var(--kendo-color-warning);
  --kendo-color-warning-hover: var(--kendo-color-warning-hover);
  --kendo-color-warning-active: var(--kendo-color-warning-active);
  --kendo-color-warning-emphasis: var(--kendo-color-warning-emphasis);
  --kendo-color-warning-on-subtle: var(--kendo-color-warning-on-subtle);
  --kendo-color-on-warning: var(--kendo-color-on-warning);
  --kendo-color-warning-on-surface: var(--kendo-color-warning-on-surface);
  --kendo-color-error-subtle: var(--kendo-color-error-subtle);
  --kendo-color-error-subtle-hover: var(--kendo-color-error-subtle-hover);
  --kendo-color-error-subtle-active: var(--kendo-color-error-subtle-active);
  --kendo-color-error: var(--kendo-color-error);
  --kendo-color-error-hover: var(--kendo-color-error-hover);
  --kendo-color-error-active: var(--kendo-color-error-active);
  --kendo-color-error-emphasis: var(--kendo-color-error-emphasis);
  --kendo-color-error-on-subtle: var(--kendo-color-error-on-subtle);
  --kendo-color-on-error: var(--kendo-color-on-error);
  --kendo-color-error-on-surface: var(--kendo-color-error-on-surface);
  --kendo-color-light-subtle: var(--kendo-color-light-subtle);
  --kendo-color-light-subtle-hover: var(--kendo-color-light-subtle-hover);
  --kendo-color-light-subtle-active: var(--kendo-color-light-subtle-active);
  --kendo-color-light: var(--kendo-color-light);
  --kendo-color-light-hover: var(--kendo-color-light-hover);
  --kendo-color-light-active: var(--kendo-color-light-active);
  --kendo-color-light-emphasis: var(--kendo-color-light-emphasis);
  --kendo-color-light-on-subtle: var(--kendo-color-light-on-subtle);
  --kendo-color-on-light: var(--kendo-color-on-light);
  --kendo-color-light-on-surface: var(--kendo-color-light-on-surface);
  --kendo-color-dark-subtle: var(--kendo-color-dark-subtle);
  --kendo-color-dark-subtle-hover: var(--kendo-color-dark-subtle-hover);
  --kendo-color-dark-subtle-active: var(--kendo-color-dark-subtle-active);
  --kendo-color-dark: var(--kendo-color-dark);
  --kendo-color-dark-hover: var(--kendo-color-dark-hover);
  --kendo-color-dark-active: var(--kendo-color-dark-active);
  --kendo-color-dark-emphasis: var(--kendo-color-dark-emphasis);
  --kendo-color-dark-on-subtle: var(--kendo-color-dark-on-subtle);
  --kendo-color-on-dark: var(--kendo-color-on-dark);
  --kendo-color-dark-on-surface: var(--kendo-color-dark-on-surface);
  --kendo-color-inverse-subtle: var(--kendo-color-inverse-subtle);
  --kendo-color-inverse-subtle-hover: var(--kendo-color-inverse-subtle-hover);
  --kendo-color-inverse-subtle-active: var(--kendo-color-inverse-subtle-active);
  --kendo-color-inverse: var(--kendo-color-inverse);
  --kendo-color-inverse-hover: var(--kendo-color-inverse-hover);
  --kendo-color-inverse-active: var(--kendo-color-inverse-active);
  --kendo-color-inverse-emphasis: var(--kendo-color-inverse-emphasis);
  --kendo-color-inverse-on-subtle: var(--kendo-color-inverse-on-subtle);
  --kendo-color-on-inverse: var(--kendo-color-on-inverse);
  --kendo-color-inverse-on-surface: var(--kendo-color-inverse-on-surface);
  --kendo-color-series-a: var(--kendo-color-series-a);
  --kendo-color-series-a-bold: var(--kendo-color-series-a-bold);
  --kendo-color-series-a-bolder: var(--kendo-color-series-a-bolder);
  --kendo-color-series-a-subtle: var(--kendo-color-series-a-subtle);
  --kendo-color-series-a-subtler: var(--kendo-color-series-a-subtler);
  --kendo-color-series-b: var(--kendo-color-series-b);
  --kendo-color-series-b-bold: var(--kendo-color-series-b-bold);
  --kendo-color-series-b-bolder: var(--kendo-color-series-b-bolder);
  --kendo-color-series-b-subtle: var(--kendo-color-series-b-subtle);
  --kendo-color-series-b-subtler: var(--kendo-color-series-b-subtler);
  --kendo-color-series-c: var(--kendo-color-series-c);
  --kendo-color-series-c-bold: var(--kendo-color-series-c-bold);
  --kendo-color-series-c-bolder: var(--kendo-color-series-c-bolder);
  --kendo-color-series-c-subtle: var(--kendo-color-series-c-subtle);
  --kendo-color-series-c-subtler: var(--kendo-color-series-c-subtler);
  --kendo-color-series-d: var(--kendo-color-series-d);
  --kendo-color-series-d-bold: var(--kendo-color-series-d-bold);
  --kendo-color-series-d-bolder: var(--kendo-color-series-d-bolder);
  --kendo-color-series-d-subtle: var(--kendo-color-series-d-subtle);
  --kendo-color-series-d-subtler: var(--kendo-color-series-d-subtler);
  --kendo-color-series-e: var(--kendo-color-series-e);
  --kendo-color-series-e-bold: var(--kendo-color-series-e-bold);
  --kendo-color-series-e-bolder: var(--kendo-color-series-e-bolder);
  --kendo-color-series-e-subtle: var(--kendo-color-series-e-subtle);
  --kendo-color-series-e-subtler: var(--kendo-color-series-e-subtler);
  --kendo-color-series-f: var(--kendo-color-series-f);
  --kendo-color-series-f-bold: var(--kendo-color-series-f-bold);
  --kendo-color-series-f-bolder: var(--kendo-color-series-f-bolder);
  --kendo-color-series-f-subtle: var(--kendo-color-series-f-subtle);
  --kendo-color-series-f-subtler: var(--kendo-color-series-f-subtler);
  --kendo-elevation-1: var(--kendo-elevation-1);
  --kendo-elevation-2: var(--kendo-elevation-2);
  --kendo-elevation-3: var(--kendo-elevation-3);
  --kendo-elevation-4: var(--kendo-elevation-4);
  --kendo-elevation-5: var(--kendo-elevation-5);
  --kendo-elevation-6: var(--kendo-elevation-6);
  --kendo-elevation-7: var(--kendo-elevation-7);
  --kendo-elevation-8: var(--kendo-elevation-8);
  --kendo-elevation-9: var(--kendo-elevation-9);
  --kendo-font-family: "Open Sans", "Segoe UI", -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", sans-serif;
  --kendo-font-size: 14px;
  --kendo-font-weight: 400;
  --kendo-line-height: 1.4285714286;
}

.k-calendar .k-calendar-view.k-calendar-monthview .k-content .k-calendar-td .k-link {
  font-size: var(--font-size-sm);
  color: var(--color-primary-invert);
}

.k-calendar .k-calendar-view.k-calendar-monthview .k-content .k-calendar-td.k-today .k-link {
  background-color: initial;
  background-image: none;
  font-weight: 400;
}

.k-calendar .k-calendar-view.k-calendar-yearview .k-content .k-calendar-td.k-today .k-link {
  background-color: initial;
  background-image: none;
  color: var(--color-primary-invert);
  font-weight: 400;
}

.k-calendar .k-calendar-view.k-calendar-decadeview .k-content .k-calendar-td.k-today .k-link {
  color: var(--color-primary-invert);
  background-color: initial;
  background-image: none;
  font-weight: 400;
}

.k-calendar .k-calendar-view.k-calendar-centuryview .k-content .k-calendar-td.k-today .k-link {
  color: var(--color-primary-invert);
  background-color: initial;
  background-image: none;
  font-weight: 400;
}

.k-calendar .k-calendar-view.k-calendar-monthview .k-content .k-calendar-td.k-hover .k-link,
.k-calendar .k-calendar-view.k-calendar-monthview .k-content .k-calendar-td.k-state-hover .k-link,
.k-calendar .k-calendar-view.k-calendar-monthview .k-content .k-calendar-td.k-state-hovered .k-link,
.k-calendar .k-calendar-view.k-calendar-monthview .k-content .k-calendar-td:hover .k-link {
  background-color: initial;
}

.k-calendar .k-calendar-view.k-calendar-monthview .k-content .k-calendar-td.k-hover .k-link,
.k-calendar .k-calendar-view.k-calendar-monthview .k-content .k-calendar-td.k-state-hover .k-link,
.k-calendar .k-calendar-view.k-calendar-monthview .k-content .k-calendar-td.k-state-hovered .k-link,
.k-calendar .k-calendar-view.k-calendar-monthview .k-content .k-calendar-td:hover .k-link {
  background-image: none;
}

.k-calendar .k-calendar-view.k-calendar-yearview .k-content .k-calendar-td.k-hover .k-link,
.k-calendar .k-calendar-view.k-calendar-yearview .k-content .k-calendar-td.k-state-hover .k-link,
.k-calendar .k-calendar-view.k-calendar-yearview .k-content .k-calendar-td.k-state-hovered .k-link,
.k-calendar .k-calendar-view.k-calendar-yearview .k-content .k-calendar-td:hover .k-link {
  background-color: initial;
}

.k-calendar .k-calendar-view.k-calendar-yearview .k-content .k-calendar-td.k-hover .k-link,
.k-calendar .k-calendar-view.k-calendar-yearview .k-content .k-calendar-td.k-state-hover .k-link,
.k-calendar .k-calendar-view.k-calendar-yearview .k-content .k-calendar-td.k-state-hovered .k-link,
.k-calendar .k-calendar-view.k-calendar-yearview .k-content .k-calendar-td:hover .k-link {
  background-image: none;
}

.k-calendar .k-calendar-view.k-calendar-decadeview .k-content .k-calendar-td.k-hover .k-link,
.k-calendar .k-calendar-view.k-calendar-decadeview .k-content .k-calendar-td.k-state-hover .k-link,
.k-calendar .k-calendar-view.k-calendar-decadeview .k-content .k-calendar-td.k-state-hovered .k-link,
.k-calendar .k-calendar-view.k-calendar-decadeview .k-content .k-calendar-td:hover .k-link {
  background-color: initial;
}

.k-calendar .k-calendar-view.k-calendar-decadeview .k-content .k-calendar-td.k-hover .k-link,
.k-calendar .k-calendar-view.k-calendar-decadeview .k-content .k-calendar-td.k-state-hover .k-link,
.k-calendar .k-calendar-view.k-calendar-decadeview .k-content .k-calendar-td.k-state-hovered .k-link,
.k-calendar .k-calendar-view.k-calendar-decadeview .k-content .k-calendar-td:hover .k-link {
  background-image: none;
}

.k-calendar .k-calendar-view.k-calendar-centuryview .k-content .k-calendar-td.k-hover .k-link,
.k-calendar .k-calendar-view.k-calendar-centuryview .k-content .k-calendar-td.k-state-hover .k-link,
.k-calendar .k-calendar-view.k-calendar-centuryview .k-content .k-calendar-td.k-state-hovered .k-link,
.k-calendar .k-calendar-view.k-calendar-centuryview .k-content .k-calendar-td:hover .k-link {
  background-color: initial;
}

.k-calendar .k-calendar-view.k-calendar-centuryview .k-content .k-calendar-td.k-hover .k-link,
.k-calendar .k-calendar-view.k-calendar-centuryview .k-content .k-calendar-td.k-state-hover .k-link,
.k-calendar .k-calendar-view.k-calendar-centuryview .k-content .k-calendar-td.k-state-hovered .k-link,
.k-calendar .k-calendar-view.k-calendar-centuryview .k-content .k-calendar-td:hover .k-link {
  background-image: none;
}

.k-calendar .k-calendar-view.k-calendar-monthview .k-content .k-calendar-td.k-focus .k-link,
.k-calendar .k-calendar-view.k-calendar-monthview .k-content .k-calendar-td.k-state-focus .k-link,
.k-calendar .k-calendar-view.k-calendar-monthview .k-content .k-calendar-td.k-state-focused .k-link,
.k-calendar .k-calendar-view.k-calendar-monthview .k-content .k-calendar-td:focus .k-link {
  border-bottom-left-radius: var(--date-time-border-radius);
  border-bottom-right-radius: var(--date-time-border-radius);
  border-top-left-radius: var(--date-time-border-radius);
  border-top-right-radius: var(--date-time-border-radius);
  box-shadow: inset 0px 0px 0px 1px var(--date-time-icon-border-color);
}

.k-calendar .k-calendar-view.k-calendar-monthview .k-content .k-calendar-td.k-focus .k-link,
.k-calendar .k-calendar-view.k-calendar-monthview .k-content .k-calendar-td.k-state-focus .k-link,
.k-calendar .k-calendar-view.k-calendar-monthview .k-content .k-calendar-td.k-state-focused .k-link,
.k-calendar .k-calendar-view.k-calendar-monthview .k-content .k-calendar-td:focus .k-link {
  border-bottom-style: none;
  border-left-style: none;
  border-right-style: none;
  border-top-style: none;
}

.k-calendar .k-calendar-view.k-calendar-yearview .k-content .k-calendar-td.k-focus .k-link,
.k-calendar .k-calendar-view.k-calendar-yearview .k-content .k-calendar-td.k-state-focus .k-link,
.k-calendar .k-calendar-view.k-calendar-yearview .k-content .k-calendar-td.k-state-focused .k-link,
.k-calendar .k-calendar-view.k-calendar-yearview .k-content .k-calendar-td:focus .k-link {
  border-bottom-left-radius: var(--date-time-border-radius);
  border-bottom-right-radius: var(--date-time-border-radius);
  border-top-left-radius: var(--date-time-border-radius);
  border-top-right-radius: var(--date-time-border-radius);
}

.k-calendar .k-calendar-view.k-calendar-decadeview .k-content .k-calendar-td.k-focus .k-link,
.k-calendar .k-calendar-view.k-calendar-decadeview .k-content .k-calendar-td.k-state-focus .k-link,
.k-calendar .k-calendar-view.k-calendar-decadeview .k-content .k-calendar-td.k-state-focused .k-link,
.k-calendar .k-calendar-view.k-calendar-decadeview .k-content .k-calendar-td:focus .k-link {
  border-bottom-left-radius: var(--date-time-border-radius);
  border-bottom-right-radius: var(--date-time-border-radius);
  border-top-left-radius: var(--date-time-border-radius);
  border-top-right-radius: var(--date-time-border-radius);
}

.k-calendar .k-calendar-view.k-calendar-centuryview .k-content .k-calendar-td.k-focus .k-link,
.k-calendar .k-calendar-view.k-calendar-centuryview .k-content .k-calendar-td.k-state-focus .k-link,
.k-calendar .k-calendar-view.k-calendar-centuryview .k-content .k-calendar-td.k-state-focused .k-link,
.k-calendar .k-calendar-view.k-calendar-centuryview .k-content .k-calendar-td:focus .k-link {
  border-bottom-left-radius: var(--date-time-border-radius);
  border-bottom-right-radius: var(--date-time-border-radius);
  border-top-left-radius: var(--date-time-border-radius);
  border-top-right-radius: var(--date-time-border-radius);
}

.k-calendar .k-calendar-view.k-calendar-monthview .k-content .k-calendar-td.k-selected .k-link {
  background-color: var(--color-info-bg);
  background-image: none;
  border-bottom-style: none;
  border-left-style: none;
  border-right-style: none;
  border-top-style: none;
  border-bottom-left-radius: var(--date-time-border-radius);
  border-bottom-right-radius: var(--date-time-border-radius);
  border-top-left-radius: var(--date-time-border-radius);
  border-top-right-radius: var(--date-time-border-radius);
  box-shadow: inset 0px 0px 0px 1px var(--date-time-icon-border-color);
}

.k-calendar .k-calendar-view.k-calendar-yearview .k-content .k-calendar-td.k-selected .k-link {
  background-color: initial;
  background-image: none;
  border-bottom-left-radius: var(--date-time-border-radius);
  border-bottom-right-radius: var(--date-time-border-radius);
  border-top-left-radius: var(--date-time-border-radius);
  border-top-right-radius: var(--date-time-border-radius);
}

.k-calendar .k-calendar-view.k-calendar-decadeview .k-content .k-calendar-td.k-selected .k-link {
  background-color: initial;
  background-image: none;
  border-bottom-left-radius: var(--date-time-border-radius);
  border-bottom-right-radius: var(--date-time-border-radius);
  border-top-left-radius: var(--date-time-border-radius);
  border-top-right-radius: var(--date-time-border-radius);
}

.k-calendar .k-calendar-view.k-calendar-centuryview .k-content .k-calendar-td.k-selected .k-link {
  background-color: initial;
  background-image: none;
  border-bottom-left-radius: var(--date-time-border-radius);
  border-bottom-right-radius: var(--date-time-border-radius);
  border-top-left-radius: var(--date-time-border-radius);
  border-top-right-radius: var(--date-time-border-radius);
}

.k-calendar .k-calendar-view.k-calendar-monthview .k-content .k-calendar-td.k-range-mid .k-link {
  border-bottom-left-radius: var(--date-time-border-radius);
  border-bottom-right-radius: var(--date-time-border-radius);
  border-top-left-radius: var(--date-time-border-radius);
  border-top-right-radius: var(--date-time-border-radius);
}

.k-calendar .k-calendar-view.k-calendar-yearview .k-content .k-calendar-td.k-range-mid {
  border-bottom-left-radius: var(--date-time-border-radius);
  border-bottom-right-radius: var(--date-time-border-radius);
  border-top-left-radius: var(--date-time-border-radius);
  border-top-right-radius: var(--date-time-border-radius);
}

.k-calendar .k-calendar-view.k-calendar-monthview .k-content .k-calendar-td.k-range-mid {
  border-bottom-left-radius: var(--date-time-border-radius);
  border-bottom-right-radius: var(--date-time-border-radius);
  border-top-left-radius: var(--date-time-border-radius);
  border-top-right-radius: var(--date-time-border-radius);
}

.k-calendar .k-calendar-view.k-calendar-decadeview .k-content .k-calendar-td.k-range-mid {
  border-bottom-left-radius: var(--date-time-border-radius);
  border-bottom-right-radius: var(--date-time-border-radius);
  border-top-left-radius: var(--date-time-border-radius);
  border-top-right-radius: var(--date-time-border-radius);
}

.k-calendar .k-calendar-view.k-calendar-centuryview .k-content .k-calendar-td.k-range-mid {
  border-bottom-left-radius: var(--date-time-border-radius);
  border-bottom-right-radius: var(--date-time-border-radius);
  border-top-left-radius: var(--date-time-border-radius);
  border-top-right-radius: var(--date-time-border-radius);
}

.k-calendar .k-calendar-navigation .k-content .k-reset li.k-hover,
.k-calendar .k-calendar-navigation .k-content .k-reset li.k-state-hover,
.k-calendar .k-calendar-navigation .k-content .k-reset li.k-state-hovered,
.k-calendar .k-calendar-navigation .k-content .k-reset li:hover {
  color: var(--color-primary-invert);
}

.k-calendar .k-calendar-header .k-calendar-nav .k-button.k-button-md.k-button-flat.k-button-flat-base.k-rounded-md.k-calendar-nav-today::before {
  visibility: hidden;
}

.k-calendar .k-calendar-view.k-calendar-monthview .k-content .k-calendar-td.k-weekend .k-link {
  color: var(--date-time-icon-color);
}

.k-calendar .k-calendar-header .k-calendar-nav .k-button.k-button-md.k-button-flat.k-button-flat-base.k-rounded-md.k-calendar-nav-today {
  font-family: "Open Sans";
  font-weight: 400;
  font-size: var(--font-size-xs);
  text-transform: uppercase;
  color: var(--color-info);
}

.k-calendar .k-calendar-header .k-button.k-button-md.k-button-flat.k-button-flat-primary.k-rounded-md.k-calendar-title {
  font-family: "Open Sans";
  font-weight: 700;
  font-size: var(--font-size-xs);
}

.k-calendar .k-calendar-header .k-calendar-nav .k-button.k-button-md.k-button-flat.k-button-flat-base.k-rounded-md.k-calendar-nav-today.k-hover,
.k-calendar .k-calendar-header .k-calendar-nav .k-button.k-button-md.k-button-flat.k-button-flat-base.k-rounded-md.k-calendar-nav-today.k-state-hover,
.k-calendar .k-calendar-header .k-calendar-nav .k-button.k-button-md.k-button-flat.k-button-flat-base.k-rounded-md.k-calendar-nav-today.k-state-hovered,
.k-calendar .k-calendar-header .k-calendar-nav .k-button.k-button-md.k-button-flat.k-button-flat-base.k-rounded-md.k-calendar-nav-today:hover {
  color: inherit;
}

.k-calendar .k-calendar-view .k-content.k-scrollable .k-calendar-table .k-calendar-tbody .k-calendar-tr .k-calendar-caption {
  padding-top: 10px;
  padding-bottom: 10px;
}

.k-calendar.k-disabled .k-calendar-view.k-calendar-monthview .k-calendar-table.k-calendar-weekdays,
.k-calendar.k-state-disabled .k-calendar-view.k-calendar-monthview .k-calendar-table.k-calendar-weekdays,
.k-calendar:disabled .k-calendar-view.k-calendar-monthview .k-calendar-table.k-calendar-weekdays {
  text-transform: uppercase;
  font-size: 12px;
}

.k-calendar .k-calendar-view.k-calendar-monthview .k-calendar-table.k-calendar-weekdays {
  padding-top: 10px;
  padding-bottom: 10px;
  font-size: 12px;
  color: var(--color-secondary);
  font-weight: 700;
  text-transform: capitalize;
}

.k-calendar.k-calendar-infinite.k-calendar-md .k-calendar-weekdays .k-calendar-th {
  width: 32px;
}

.k-calendar.k-calendar-infinite.k-calendar-md .k-calendar-table {
  width: 100%;
}

.k-datepicker.k-input .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button .k-button-icon.k-icon.k-font-icon.k-i-calendar {
  font-family: FontAwesome;
  width: var(--date-time-icon-size);
  height: var(--date-time-icon-size);
  border-bottom-color: var(--date-time-icon-border-color);
  border-left-color: var(--date-time-icon-border-color);
  border-right-color: var(--date-time-icon-border-color);
  border-top-color: var(--date-time-icon-border-color);
  border-bottom-style: solid;
  border-left-style: solid;
  border-right-style: solid;
  border-top-style: solid;
  border-bottom-width: 1px;
  border-left-width: 1px;
  border-right-width: 1px;
  border-top-width: 1px;
  border-bottom-left-radius: var(--date-time-border-radius);
  border-bottom-right-radius: var(--date-time-border-radius);
  border-top-left-radius: var(--date-time-border-radius);
  border-top-right-radius: var(--date-time-border-radius);
  font-size: var(--font-size-sm);
  color: var(--date-time-icon-color);
}

.k-datepicker.k-input .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button .k-button-icon.k-icon.k-font-icon.k-i-calendar::before {
  content: "\f073";
}

.k-datepicker.k-input {
  border-bottom-width: 0px;
  border-left-width: 0px;
  border-right-width: 0px;
  border-top-width: 0px;
  align-self: center;
  width: var(--date-time-width);
  overflow: visible;
  margin-right: var(--date-time-icon-offset);
  align-items: center;
}

.k-datepicker.k-input .k-input-inner {
  border-bottom-color: var(--date-time-icon-border-color);
  border-bottom-style: solid;
  border-bottom-width: 1px;
  border-left-color: var(--date-time-icon-border-color);
  border-left-style: solid;
  border-left-width: 1px;
  border-right-color: var(--date-time-icon-border-color);
  border-right-style: solid;
  border-right-width: 1px;
  border-top-color: var(--date-time-icon-border-color);
  border-top-style: solid;
  border-top-width: 1px;
  width: 100%;
  height: var(--date-time-height);
  padding-top: var(--date-time-padding-vertical);
  padding-right: var(--date-time-padding-horizontal);
  padding-bottom: var(--date-time-padding-vertical);
  padding-left: var(--date-time-padding-horizontal);
}

.k-datepicker.k-input.k-state-focus-within,
.k-datepicker.k-input:focus-within {
  border-bottom-color: var(--kendo-color-info);
  border-left-color: var(--kendo-color-info);
  border-right-color: var(--kendo-color-info);
  border-top-color: var(--kendo-color-info);
}

.k-datepicker.k-input.k-state-focus-within::after,
.k-datepicker.k-input:focus-within::after {
  visibility: hidden;
}

.k-datepicker.k-input.k-state-focus-within::after,
.k-datepicker.k-input:focus-within::after {
  border-bottom-width: unset;
  border-left-width: unset;
  border-right-width: unset;
  border-top-width: unset;
  border-bottom-style: none;
  border-left-style: none;
  border-right-style: none;
  border-top-style: none;
  border-bottom-color: var(--color-info-bg);
  border-left-color: var(--color-info-bg);
  border-right-color: var(--color-info-bg);
  border-top-color: var(--color-info-bg);
}

.k-datepicker.k-input.k-hover .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button,
.k-datepicker.k-input.k-state-hover .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button,
.k-datepicker.k-input.k-state-hovered .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button,
.k-datepicker.k-input:hover .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button {
  background-color: initial;
  background-image: none;
  color: transparent;
}

.k-datepicker.k-input.k-state-focus-within .k-input-inner,
.k-datepicker.k-input:focus-within .k-input-inner {
  width: 100%;
}

.k-datepicker.k-input .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button {
  position: absolute;
  right: -35px;
  background-color: initial;
  background-image: none;
}

.k-timepicker.k-input {
  width: var(--date-time-width);
  overflow: visible;
  margin-right: var(--date-time-icon-offset);
  border-bottom-width: 0px;
  border-left-width: 0px;
  border-right-width: 0px;
  border-top-width: 0px;
  align-self: center;
  align-items: center;
}

.k-timepicker.k-input .k-input-inner {
  height: var(--date-time-height);
  padding-top: var(--date-time-padding-vertical);
  padding-right: var(--date-time-padding-horizontal);
  padding-bottom: var(--date-time-padding-vertical);
  padding-left: var(--date-time-padding-horizontal);
  border-bottom-color: var(--date-time-icon-border-color);
  border-bottom-style: solid;
  border-bottom-width: 1px;
  border-left-color: var(--date-time-icon-border-color);
  border-left-style: solid;
  border-left-width: 1px;
  border-right-color: var(--date-time-icon-border-color);
  border-right-style: solid;
  border-right-width: 1px;
  border-top-color: var(--date-time-icon-border-color);
  border-top-style: solid;
  border-top-width: 1px;
}

.k-timepicker.k-input .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button {
  position: absolute;
  right: -35px;
}

.k-timepicker.k-input .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button .k-button-icon.k-icon.k-font-icon.k-i-clock {
  color: var(--date-time-icon-color);
  font-family: FontAwesome;
  font-size: var(--font-size-sm);
  width: var(--date-time-icon-size);
  height: var(--date-time-icon-size);
  border-bottom-width: 1px;
  border-left-width: 1px;
  border-right-width: 1px;
  border-top-width: 1px;
  border-bottom-color: var(--date-time-icon-border-color);
  border-bottom-style: solid;
  border-left-color: var(--date-time-icon-border-color);
  border-left-style: solid;
  border-right-color: var(--date-time-icon-border-color);
  border-right-style: solid;
  border-top-color: var(--date-time-icon-border-color);
  border-top-style: solid;
  border-bottom-left-radius: var(--date-time-border-radius);
  border-bottom-right-radius: var(--date-time-border-radius);
  border-top-left-radius: var(--date-time-border-radius);
  border-top-right-radius: var(--date-time-border-radius);
}

.k-timepicker.k-input .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button .k-button-icon.k-icon.k-font-icon.k-i-clock::before {
  content: "\f017";
}

.k-datepicker.k-input.k-disabled .k-input-inner,
.k-datepicker.k-input.k-state-disabled .k-input-inner,
.k-datepicker.k-input:disabled .k-input-inner {
  background-color: var(--color-primary-variant);
  background-image: none;
  color: var(--color-secondary);
}

.k-datepicker.k-input.k-disabled .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button,
.k-datepicker.k-input.k-state-disabled .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button,
.k-datepicker.k-input:disabled .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button {
  background-color: initial;
  background-image: none;
}

.k-datepicker.k-input.k-disabled .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button .k-button-icon.k-icon.k-font-icon.k-i-calendar,
.k-datepicker.k-input.k-state-disabled .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button .k-button-icon.k-icon.k-font-icon.k-i-calendar,
.k-datepicker.k-input:disabled .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button .k-button-icon.k-icon.k-font-icon.k-i-calendar {
  color: var(--color-secondary);
}

.k-datepicker.k-input.k-disabled .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button .k-button-icon.k-icon.k-font-icon.k-i-calendar,
.k-datepicker.k-input.k-state-disabled .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button .k-button-icon.k-icon.k-font-icon.k-i-calendar,
.k-datepicker.k-input:disabled .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button .k-button-icon.k-icon.k-font-icon.k-i-calendar {
  background-color: var(--color-primary-variant);
  background-image: none;
}

.k-timepicker.k-input.k-disabled .k-input-inner,
.k-timepicker.k-input.k-state-disabled .k-input-inner,
.k-timepicker.k-input:disabled .k-input-inner {
  background-color: var(--color-primary-variant);
  background-image: none;
  color: var(--color-secondary);
}

.k-timepicker.k-input.k-disabled .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button,
.k-timepicker.k-input.k-state-disabled .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button,
.k-timepicker.k-input:disabled .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button {
  background-color: initial;
  background-image: none;
}

.k-timepicker.k-input.k-disabled .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button .k-button-icon.k-icon.k-font-icon.k-i-clock,
.k-timepicker.k-input.k-state-disabled .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button .k-button-icon.k-icon.k-font-icon.k-i-clock,
.k-timepicker.k-input:disabled .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button .k-button-icon.k-icon.k-font-icon.k-i-clock {
  color: var(--color-secondary);
}

.k-timepicker.k-input.k-disabled .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button .k-button-icon.k-icon.k-font-icon.k-i-clock,
.k-timepicker.k-input.k-state-disabled .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button .k-button-icon.k-icon.k-font-icon.k-i-clock,
.k-timepicker.k-input:disabled .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button .k-button-icon.k-icon.k-font-icon.k-i-clock {
  background-color: var(--color-primary-variant);
  background-image: none;
}

.k-timepicker.k-input.k-state-focus-within .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button .k-button-icon.k-icon.k-font-icon.k-i-clock,
.k-timepicker.k-input:focus-within .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button .k-button-icon.k-icon.k-font-icon.k-i-clock {
  background-color: initial;
  background-image: none;
}

.k-timepicker.k-input.k-hover .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button,
.k-timepicker.k-input.k-state-hover .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button,
.k-timepicker.k-input.k-state-hovered .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button,
.k-timepicker.k-input:hover .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button {
  background-color: initial;
  background-image: none;
}

.k-calendar .k-calendar-view.k-calendar-monthview .k-content .k-calendar-td.k-other-month.k-selected .k-link {
  box-shadow: inset 0px 0px 0px 1px var(--date-time-icon-border-color);
}

.k-timeselector .k-time-header .k-button.k-button-md.k-button-flat.k-button-flat-primary.k-rounded-md.k-time-now {
  color: var(--color-info);
  font-family: "Open Sans";
  font-weight: 400;
  font-size: var(--font-size-xs);
  text-transform: uppercase;
}

.k-timeselector .k-time-header .k-button.k-button-md.k-button-flat.k-button-flat-primary.k-rounded-md.k-time-now.k-hover,
.k-timeselector .k-time-header .k-button.k-button-md.k-button-flat.k-button-flat-primary.k-rounded-md.k-time-now.k-state-hover,
.k-timeselector .k-time-header .k-button.k-button-md.k-button-flat.k-button-flat-primary.k-rounded-md.k-time-now.k-state-hovered,
.k-timeselector .k-time-header .k-button.k-button-md.k-button-flat.k-button-flat-primary.k-rounded-md.k-time-now:hover {
  background-color: initial !important;
  background-image: none !important;
  color: var(--color-primary-invert);
}

.k-timeselector .k-time-header .k-button.k-button-md.k-button-flat.k-button-flat-primary.k-rounded-md.k-time-now.k-active,
.k-timeselector .k-time-header .k-button.k-button-md.k-button-flat.k-button-flat-primary.k-rounded-md.k-time-now.k-state-active,
.k-timeselector .k-time-header .k-button.k-button-md.k-button-flat.k-button-flat-primary.k-rounded-md.k-time-now:active {
  background-color: initial !important;
  background-image: none !important;
}

.k-timeselector .k-time-header .k-button.k-button-md.k-button-flat.k-button-flat-primary.k-rounded-md.k-time-now.k-focus,
.k-timeselector .k-time-header .k-button.k-button-md.k-button-flat.k-button-flat-primary.k-rounded-md.k-time-now.k-state-focus,
.k-timeselector .k-time-header .k-button.k-button-md.k-button-flat.k-button-flat-primary.k-rounded-md.k-time-now.k-state-focused,
.k-timeselector .k-time-header .k-button.k-button-md.k-button-flat.k-button-flat-primary.k-rounded-md.k-time-now:focus {
  background-color: initial !important;
  background-image: none !important;
}

.k-time-footer.k-actions.k-actions-stretched.k-actions-horizontal .k-button.k-button-md.k-button-solid.k-button-solid-base.k-rounded-md.k-time-cancel, .k-time-footer.k-actions-stretched.k-actions-horizontal.k-edit-buttons .k-button.k-button-md.k-button-solid.k-button-solid-base.k-rounded-md.k-time-cancel,
.k-time-footer.k-actions-stretched.k-actions-horizontal.k-action-buttons .k-button.k-button-md.k-button-solid.k-button-solid-base.k-rounded-md.k-time-cancel,
.k-time-footer.k-actions-stretched.k-actions-horizontal.k-columnmenu-actions .k-button.k-button-md.k-button-solid.k-button-solid-base.k-rounded-md.k-time-cancel, .k-time-footer.k-actions-stretched.k-actions-horizontal.k-form-buttons .k-button.k-button-md.k-button-solid.k-button-solid-base.k-rounded-md.k-time-cancel {
  visibility: hidden;
}

.k-popup.k-timepicker-popup .k-time-footer.k-actions.k-actions-stretched.k-actions-horizontal, .k-popup.k-timepicker-popup .k-time-footer.k-actions-stretched.k-actions-horizontal.k-edit-buttons,
.k-popup.k-timepicker-popup .k-time-footer.k-actions-stretched.k-actions-horizontal.k-action-buttons,
.k-popup.k-timepicker-popup .k-time-footer.k-actions-stretched.k-actions-horizontal.k-columnmenu-actions, .k-popup.k-timepicker-popup .k-time-footer.k-actions-stretched.k-actions-horizontal.k-form-buttons {
  justify-content: center;
  border-top-color: var(--date-time-icon-border-color);
  border-top-style: solid;
  border-top-width: 1px;
  margin-top: 0px;
}

.k-time-footer.k-actions.k-actions-stretched.k-actions-horizontal .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept, .k-time-footer.k-actions-stretched.k-actions-horizontal.k-edit-buttons .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept,
.k-time-footer.k-actions-stretched.k-actions-horizontal.k-action-buttons .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept,
.k-time-footer.k-actions-stretched.k-actions-horizontal.k-columnmenu-actions .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept, .k-time-footer.k-actions-stretched.k-actions-horizontal.k-form-buttons .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept {
  background-color: initial;
  background-image: none;
  color: var(--color-info);
  border-bottom-style: none;
  border-left-style: none;
  border-right-style: none;
  border-top-style: none;
  font-family: "Open Sans";
  font-weight: 400;
  font-size: var(--font-size-xs);
}

.k-time-footer.k-actions.k-actions-stretched.k-actions-horizontal .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept.k-focus::after, .k-time-footer.k-actions-stretched.k-actions-horizontal.k-edit-buttons .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept.k-focus::after,
.k-time-footer.k-actions-stretched.k-actions-horizontal.k-action-buttons .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept.k-focus::after,
.k-time-footer.k-actions-stretched.k-actions-horizontal.k-columnmenu-actions .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept.k-focus::after, .k-time-footer.k-actions-stretched.k-actions-horizontal.k-form-buttons .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept.k-focus::after,
.k-time-footer.k-actions.k-actions-stretched.k-actions-horizontal .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept.k-state-focus::after,
.k-time-footer.k-actions-stretched.k-actions-horizontal.k-edit-buttons .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept.k-state-focus::after,
.k-time-footer.k-actions-stretched.k-actions-horizontal.k-action-buttons .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept.k-state-focus::after,
.k-time-footer.k-actions-stretched.k-actions-horizontal.k-columnmenu-actions .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept.k-state-focus::after,
.k-time-footer.k-actions-stretched.k-actions-horizontal.k-form-buttons .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept.k-state-focus::after,
.k-time-footer.k-actions.k-actions-stretched.k-actions-horizontal .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept.k-state-focused::after,
.k-time-footer.k-actions-stretched.k-actions-horizontal.k-edit-buttons .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept.k-state-focused::after,
.k-time-footer.k-actions-stretched.k-actions-horizontal.k-action-buttons .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept.k-state-focused::after,
.k-time-footer.k-actions-stretched.k-actions-horizontal.k-columnmenu-actions .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept.k-state-focused::after,
.k-time-footer.k-actions-stretched.k-actions-horizontal.k-form-buttons .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept.k-state-focused::after,
.k-time-footer.k-actions.k-actions-stretched.k-actions-horizontal .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept:focus::after,
.k-time-footer.k-actions-stretched.k-actions-horizontal.k-edit-buttons .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept:focus::after,
.k-time-footer.k-actions-stretched.k-actions-horizontal.k-action-buttons .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept:focus::after,
.k-time-footer.k-actions-stretched.k-actions-horizontal.k-columnmenu-actions .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept:focus::after,
.k-time-footer.k-actions-stretched.k-actions-horizontal.k-form-buttons .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept:focus::after {
  visibility: hidden;
}

.k-popup.k-timepicker-popup .k-timeselector .k-time-list-container .k-time-list-wrapper .k-time-list::after {
  visibility: hidden;
}

.k-timeselector .k-time-list-container .k-time-list-wrapper.k-focus::before,
.k-timeselector .k-time-list-container .k-time-list-wrapper.k-state-focus::before,
.k-timeselector .k-time-list-container .k-time-list-wrapper.k-state-focused::before,
.k-timeselector .k-time-list-container .k-time-list-wrapper:focus::before {
  top: 0px;
  height: 52%;
}

.k-time-footer.k-actions.k-actions-stretched.k-actions-horizontal .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept.k-hover, .k-time-footer.k-actions-stretched.k-actions-horizontal.k-edit-buttons .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept.k-hover,
.k-time-footer.k-actions-stretched.k-actions-horizontal.k-action-buttons .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept.k-hover,
.k-time-footer.k-actions-stretched.k-actions-horizontal.k-columnmenu-actions .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept.k-hover, .k-time-footer.k-actions-stretched.k-actions-horizontal.k-form-buttons .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept.k-hover,
.k-time-footer.k-actions.k-actions-stretched.k-actions-horizontal .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept.k-state-hover,
.k-time-footer.k-actions-stretched.k-actions-horizontal.k-edit-buttons .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept.k-state-hover,
.k-time-footer.k-actions-stretched.k-actions-horizontal.k-action-buttons .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept.k-state-hover,
.k-time-footer.k-actions-stretched.k-actions-horizontal.k-columnmenu-actions .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept.k-state-hover,
.k-time-footer.k-actions-stretched.k-actions-horizontal.k-form-buttons .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept.k-state-hover,
.k-time-footer.k-actions.k-actions-stretched.k-actions-horizontal .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept.k-state-hovered,
.k-time-footer.k-actions-stretched.k-actions-horizontal.k-edit-buttons .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept.k-state-hovered,
.k-time-footer.k-actions-stretched.k-actions-horizontal.k-action-buttons .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept.k-state-hovered,
.k-time-footer.k-actions-stretched.k-actions-horizontal.k-columnmenu-actions .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept.k-state-hovered,
.k-time-footer.k-actions-stretched.k-actions-horizontal.k-form-buttons .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept.k-state-hovered,
.k-time-footer.k-actions.k-actions-stretched.k-actions-horizontal .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept:hover,
.k-time-footer.k-actions-stretched.k-actions-horizontal.k-edit-buttons .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept:hover,
.k-time-footer.k-actions-stretched.k-actions-horizontal.k-action-buttons .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept:hover,
.k-time-footer.k-actions-stretched.k-actions-horizontal.k-columnmenu-actions .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept:hover,
.k-time-footer.k-actions-stretched.k-actions-horizontal.k-form-buttons .k-button.k-button-md.k-button-solid.k-button-solid-primary.k-rounded-md.k-time-accept:hover {
  color: var(--color-primary-invert);
}

.k-treeview .k-treeview-group .k-treeview-item .k-treeview-leaf {
  display: block;
  align-self: stretch;
  width: 100%;
  color: var(--color-primary-invert);
  padding-bottom: 10px;
  padding-left: 10px;
  padding-right: 10px;
  padding-top: 10px;
}

.k-pager .k-pager-numbers-wrap .k-pager-numbers .k-button.k-button-flat.k-button-flat-primary {
  background-color: initial;
  background-image: none;
  color: inherit;
  font-family: "Open Sans";
  font-weight: 400;
  font-size: var(--font-size-xs);
  line-height: 1;
  border-bottom-left-radius: var(--border-radius-small);
  border-bottom-right-radius: var(--border-radius-small);
  border-top-left-radius: var(--border-radius-small);
  border-top-right-radius: var(--border-radius-small);
  height: 32px;
  padding-top: 4px;
  padding-right: 8px;
  padding-bottom: 4px;
  padding-left: 8px;
  width: 32px;
}

.k-pager {
  background-color: initial;
  background-image: none;
  color: var(--date-time-icon-color);
  border-bottom-style: none;
  border-left-style: none;
  border-right-style: none;
  border-top-style: none;
  border-bottom-width: 0px;
  border-left-width: 0px;
  border-right-width: 0px;
  border-top-width: 0px;
  font-family: "Open Sans";
  font-weight: 400;
  font-size: var(--font-size-xs);
}

.k-pager .k-pager-numbers-wrap .k-pager-numbers .k-button.k-button-flat.k-button-flat-primary.k-hover,
.k-pager .k-pager-numbers-wrap .k-pager-numbers .k-button.k-button-flat.k-button-flat-primary.k-state-hover,
.k-pager .k-pager-numbers-wrap .k-pager-numbers .k-button.k-button-flat.k-button-flat-primary.k-state-hovered,
.k-pager .k-pager-numbers-wrap .k-pager-numbers .k-button.k-button-flat.k-button-flat-primary:hover {
  border-bottom-color: #eee !important;
  border-left-color: #eee !important;
  border-right-color: #eee !important;
  border-top-color: #eee !important;
  border-bottom-style: solid;
  border-left-style: solid;
  border-right-style: solid;
  border-top-style: solid;
}

.k-pager .k-pager-numbers-wrap .k-pager-numbers .k-button.k-button-flat.k-button-flat-primary.k-selected {
  background-color: #eee;
  background-image: none;
  color: var(--color-primary-invert);
  border-bottom-color: #eee !important;
  border-left-color: #eee !important;
  border-right-color: #eee !important;
  border-top-color: #eee !important;
  border-bottom-style: solid;
  border-left-style: solid;
  border-right-style: solid;
  border-top-style: solid;
}

.k-pager .k-pager-numbers-wrap .k-pager-numbers .k-button.k-button-flat.k-button-flat-primary.k-focus,
.k-pager .k-pager-numbers-wrap .k-pager-numbers .k-button.k-button-flat.k-button-flat-primary.k-state-focus,
.k-pager .k-pager-numbers-wrap .k-pager-numbers .k-button.k-button-flat.k-button-flat-primary.k-state-focused,
.k-pager .k-pager-numbers-wrap .k-pager-numbers .k-button.k-button-flat.k-button-flat-primary:focus {
  outline-style: none;
}

.k-pager .k-pager-numbers-wrap .k-pager-numbers .k-button.k-button-flat.k-button-flat-primary.k-focus,
.k-pager .k-pager-numbers-wrap .k-pager-numbers .k-button.k-button-flat.k-button-flat-primary.k-state-focus,
.k-pager .k-pager-numbers-wrap .k-pager-numbers .k-button.k-button-flat.k-button-flat-primary.k-state-focused,
.k-pager .k-pager-numbers-wrap .k-pager-numbers .k-button.k-button-flat.k-button-flat-primary:focus {
  visibility: visible;
}

.k-pager .k-pager-numbers-wrap .k-pager-numbers {
  -moz-column-gap: 2px;
       column-gap: 2px;
}

.k-pager .k-pager-info {
  color: #999;
}

.k-treeview .k-treeview-group .k-treeview-item .k-treeview-leaf .k-treeview-leaf-text {
  width: 100%;
  color: var(--color-primary-invert);
}

.k-treeview .k-treeview-group .k-treeview-item .k-treeview-leaf.k-selected {
  background-color: var(--color-info-bg);
  background-image: none;
}

.k-treeview .k-treeview-lines.k-treeview-group .k-treeview-item .k-treeview-toggle .k-icon.k-font-icon.k-i-caret-alt-down {
  font-family: FontAwesome;
  color: var(--color-secondary-darkest);
  font-size: var(--font-size-md);
}

.k-treeview .k-treeview-lines.k-treeview-group .k-treeview-item .k-treeview-toggle .k-icon.k-font-icon.k-i-caret-alt-down::before {
  content: "\f0d7";
}

.k-treeview .k-treeview-lines.k-treeview-group .k-treeview-item .k-treeview-toggle .k-icon.k-font-icon.k-i-caret-alt-right {
  font-family: FontAwesome;
  color: var(--color-secondary-darkest);
  font-size: var(--font-size-md);
}

.k-treeview .k-treeview-lines.k-treeview-group .k-treeview-item .k-treeview-toggle .k-icon.k-font-icon.k-i-caret-alt-right::before {
  content: "\f0da";
}

.k-treeview .k-treeview-group .k-treeview-item .k-treeview-leaf.k-hover,
.k-treeview .k-treeview-group .k-treeview-item .k-treeview-leaf.k-state-hover,
.k-treeview .k-treeview-group .k-treeview-item .k-treeview-leaf.k-state-hovered,
.k-treeview .k-treeview-group .k-treeview-item .k-treeview-leaf:hover {
  background-color: var(--color-primary-variant);
}

.k-treeview .k-treeview-group .k-treeview-item .k-treeview-leaf.k-hover,
.k-treeview .k-treeview-group .k-treeview-item .k-treeview-leaf.k-state-hover,
.k-treeview .k-treeview-group .k-treeview-item .k-treeview-leaf.k-state-hovered,
.k-treeview .k-treeview-group .k-treeview-item .k-treeview-leaf:hover {
  background-image: none;
}

.k-treeview .k-treeview-group .k-treeview-item .k-treeview-leaf.k-focus,
.k-treeview .k-treeview-group .k-treeview-item .k-treeview-leaf.k-state-focus,
.k-treeview .k-treeview-group .k-treeview-item .k-treeview-leaf.k-state-focused,
.k-treeview .k-treeview-group .k-treeview-item .k-treeview-leaf:focus {
  background-color: initial;
  box-shadow: none;
}

.k-treeview .k-treeview-group .k-treeview-item .k-treeview-leaf.k-focus,
.k-treeview .k-treeview-group .k-treeview-item .k-treeview-leaf.k-state-focus,
.k-treeview .k-treeview-group .k-treeview-item .k-treeview-leaf.k-state-focused,
.k-treeview .k-treeview-group .k-treeview-item .k-treeview-leaf:focus {
  background-image: none;
}

.k-treeview .k-treeview-group .k-treeview-item .k-treeview-leaf.k-disabled .k-treeview-leaf-text,
.k-treeview .k-treeview-group .k-treeview-item .k-treeview-leaf.k-state-disabled .k-treeview-leaf-text,
.k-treeview .k-treeview-group .k-treeview-item .k-treeview-leaf:disabled .k-treeview-leaf-text {
  color: var(--color-secondary-darker);
}

.k-treeview .k-treeview-group .k-treeview-item .k-treeview-leaf.k-selected.k-focus,
.k-treeview .k-treeview-group .k-treeview-item .k-treeview-leaf.k-selected.k-state-focus,
.k-treeview .k-treeview-group .k-treeview-item .k-treeview-leaf.k-selected.k-state-focused,
.k-treeview .k-treeview-group .k-treeview-item .k-treeview-leaf.k-selected:focus {
  background-color: var(--color-info-bg);
}

.k-treeview .k-treeview-group .k-treeview-item .k-treeview-leaf.k-selected.k-focus,
.k-treeview .k-treeview-group .k-treeview-item .k-treeview-leaf.k-selected.k-state-focus,
.k-treeview .k-treeview-group .k-treeview-item .k-treeview-leaf.k-selected.k-state-focused,
.k-treeview .k-treeview-group .k-treeview-item .k-treeview-leaf.k-selected:focus {
  background-image: none;
}

.k-numerictextbox.k-input .k-input-spinner.k-spin-button .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-spinner-increase.k-hover,
.k-numerictextbox.k-input .k-input-spinner.k-spin-button .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-spinner-increase.k-state-hover,
.k-numerictextbox.k-input .k-input-spinner.k-spin-button .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-spinner-increase.k-state-hovered,
.k-numerictextbox.k-input .k-input-spinner.k-spin-button .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-spinner-increase:hover {
  background-color: #ffffff;
  background-image: none;
}

.k-calendar .k-calendar-view.k-calendar-monthview .k-content .k-calendar-td.k-range-mid::before {
  border-bottom-style: none;
  border-left-style: none;
  border-right-style: none;
  border-top-style: none;
  border-bottom-color: #edebe9;
  border-left-color: #edebe9;
  border-right-color: #edebe9;
  border-top-color: #edebe9;
}

.k-calendar .k-calendar-view.k-calendar-yearview .k-content .k-calendar-td.k-range-mid::before {
  border-bottom-color: #edebe9;
  border-left-color: #edebe9;
  border-right-color: #edebe9;
  border-top-color: #edebe9;
  border-bottom-style: none;
  border-left-style: none;
  border-right-style: none;
  border-top-style: none;
}

.k-calendar .k-calendar-view.k-calendar-decadeview .k-content .k-calendar-td.k-range-mid::before {
  border-bottom-style: none;
  border-left-style: none;
  border-right-style: none;
  border-top-style: none;
}

.k-calendar .k-calendar-view.k-calendar-centuryview .k-content .k-calendar-td.k-range-mid::before {
  border-bottom-style: none;
  border-left-style: none;
  border-right-style: none;
  border-top-style: none;
}

.k-calendar .k-calendar-header .k-calendar-nav .k-button.k-button-md.k-button-flat.k-button-flat-base.k-rounded-md.k-calendar-nav-today.k-hover::before,
.k-calendar .k-calendar-header .k-calendar-nav .k-button.k-button-md.k-button-flat.k-button-flat-base.k-rounded-md.k-calendar-nav-today.k-state-hover::before,
.k-calendar .k-calendar-header .k-calendar-nav .k-button.k-button-md.k-button-flat.k-button-flat-base.k-rounded-md.k-calendar-nav-today.k-state-hovered::before,
.k-calendar .k-calendar-header .k-calendar-nav .k-button.k-button-md.k-button-flat.k-button-flat-base.k-rounded-md.k-calendar-nav-today:hover::before {
  opacity: initial;
}

.k-calendar .k-calendar-view .k-calendar-header {
  padding-top: 8px;
  padding-bottom: 8px;
  padding-right: 16px;
  padding-left: 16px;
}

.k-calendar .k-calendar-header .k-button.k-button-md.k-button-flat.k-button-flat-primary.k-rounded-md.k-calendar-title.k-hover,
.k-calendar .k-calendar-header .k-button.k-button-md.k-button-flat.k-button-flat-primary.k-rounded-md.k-calendar-title.k-state-hover,
.k-calendar .k-calendar-header .k-button.k-button-md.k-button-flat.k-button-flat-primary.k-rounded-md.k-calendar-title.k-state-hovered,
.k-calendar .k-calendar-header .k-button.k-button-md.k-button-flat.k-button-flat-primary.k-rounded-md.k-calendar-title:hover {
  color: var(--color-info-bg);
  background-color: initial;
  background-image: none;
}

.k-calendar .k-calendar-header .k-button.k-button-md.k-button-flat.k-button-flat-primary.k-rounded-md.k-calendar-title .k-button-text {
  color: var(--color-primary-invert);
  font-weight: 700;
}

.k-calendar .k-calendar-view.k-calendar-monthview .k-calendar-table.k-calendar-weekdays .k-calendar-thead .k-calendar-tr .k-calendar-th {
  font-size: inherit;
  font-weight: inherit;
}

.k-datepicker.k-input.k-state-focus-within .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button,
.k-datepicker.k-input:focus-within .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button {
  color: transparent;
}

.k-timepicker.k-input.k-hover .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button .k-button-icon.k-icon.k-font-icon.k-i-clock,
.k-timepicker.k-input.k-state-hover .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button .k-button-icon.k-icon.k-font-icon.k-i-clock,
.k-timepicker.k-input.k-state-hovered .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button .k-button-icon.k-icon.k-font-icon.k-i-clock,
.k-timepicker.k-input:hover .k-button.k-button-md.k-button-solid.k-button-solid-base.k-icon-button.k-input-button .k-button-icon.k-icon.k-font-icon.k-i-clock {
  color: var(--color-primary-invert);
}

.-sf-integrated-app .k-widget:not(.k-scheduler)::selection,
.-sf-integrated-app .k-widget:not(.k-scheduler) ::selection,
.-sf-integrated-app .k-datepicker::selection,
.-sf-integrated-app .k-datepicker ::selection,
.-sf-integrated-app .k-editor::selection,
.-sf-integrated-app .k-editor ::selection,
.-sf-integrated-app .k-timepicker::selection,
.-sf-integrated-app .k-timepicker ::selection {
  color: #333;
  background: var(--sf-color-info-bg, #dcecf5);
}

.-sf-integrated-app .k-widget:not(.k-scheduler) .k-input,
.-sf-integrated-app .k-widget:not(.k-scheduler) .k-editor-toolbar .k-dropdown,
.-sf-integrated-app .k-widget:not(.k-scheduler) .k-colorpicker .k-picker-wrap {
  font-size: var(--font-size-lg);
}

.-sf-integrated-app .k-widget:not(.k-scheduler) .k-input,
.-sf-integrated-app .k-widget:not(.k-scheduler) .k-textbox {
  height: 36px;
  text-indent: 0;
}

.-sf-integrated-app .k-widget:not(.k-scheduler) textarea.k-input,
.-sf-integrated-app .k-widget:not(.k-scheduler) textarea.k-textbox {
  min-height: 80px;
  padding: 8px 10px;
}

.-sf-integrated-app .k-widget:not(.k-scheduler) .k-button:active, .-sf-integrated-app .k-widget:not(.k-scheduler) .k-button.k-active, .-sf-integrated-app .k-widget:not(.k-scheduler) .k-button.k-selected, .-sf-integrated-app .k-widget:not(.k-scheduler) .k-button.k-state-active, .-sf-integrated-app .k-widget:not(.k-scheduler) .k-button.k-state-selected {
  box-shadow: none;
  background: none;
}

.-sf-integrated-app .k-widget:not(.k-scheduler) .k-button.k-primary, .-sf-integrated-app .k-widget:not(.k-scheduler) .k-button.k-primary:active {
  background-image: none;
}

.-sf-integrated-app .k-overlay {
  background-color: #fff;
  opacity: 1 !important;
}

.-sf-integrated-app .k-dropdown .k-state-focused {
  color: #333;
  background-color: transparent;
  box-shadow: none;
}

.-sf-integrated-app .k-popup {
  background-color: #fff;
}

.-sf-modal-window-open .k-widget, .-sf-modal-window-open .k-popup, .-sf-modal-window-open .k-animation-container {
  --font-size-h1: 42px;
  --font-size-h4-lg: 14px;
  --font-size-lg: 15px;
  --icon-size-xs: 14px;
  --icon-size-s: 16px;
  --icon-size-m: 18px;
}

.k-pager:focus, .k-pager.k-focus {
  box-shadow: none;
}

.k-pager .k-pager-numbers-wrap .k-pager-numbers .k-button {
  align-items: center;
  justify-content: center;
  border: 1px solid transparent;
}

.k-pager .k-pager-numbers-wrap .k-pager-numbers .k-button::before, .k-pager .k-pager-numbers-wrap .k-pager-numbers .k-button::after {
  display: none !important;
}

.k-pager .k-pager-numbers-wrap .k-pager-numbers .k-button.k-selected {
  background-color: #eee !important;
  background-image: none !important;
}

.k-pager .k-pager-info {
  color: var(--sf-color-secondary-dark, #999);
}

.k-context-menu {
  padding: 15px 0 !important;
}

.k-context-menu .k-menu-item {
  height: 40px;
}

.k-context-menu .k-menu-item.k-focus .k-link {
  box-shadow: none !important;
}

.k-context-menu .k-menu-item .k-menu-link {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.k-context-menu .k-menu-item .k-menu-link.k-link {
  padding: 0 20px;
}

.k-context-menu .k-menu-item .k-menu-link .k-menu-link-text {
  width: 100px;
  display: inline-block;
  font-family: "Open Sans", sans-serif;
  font-size: var(--font-size-base);
  color: #333;
}

.k-context-menu .k-menu-item .k-link:active {
  color: #333 !important;
  background-color: initial !important;
}

.k-context-menu .k-menu-item.k-disabled {
  color: var(--sf-color-secondary, #ccc);
}

.k-context-menu .k-menu-item.k-disabled .k-menu-link-text {
  color: var(--sf-color-secondary, #ccc);
}

@keyframes floatingText {
  0% {
    transform: translate(0);
  }
  50% {
    transform: translate(calc(-100% + 26px / 2));
  }
  100% {
    transform: translate(0);
  }
}
@keyframes loader {
  40% {
    opacity: 1;
  }
}
@keyframes loadingProgressbar {
  0% {
    transform: scaleX(0);
  }
  50% {
    transform: scaleX(1);
  }
  100% {
    transform: translateX(100%);
  }
}
@keyframes loadingSkeleton {
  0% {
    opacity: 0.7;
  }
  50% {
    opacity: 0.8;
  }
  100% {
    opacity: 0.9;
  }
}
@keyframes pulsingColorLoading {
  0% {
    background-color: #f5f5f5;
  }
  50% {
    background-color: rgb(250.1, 250.1, 250.1);
  }
  100% {
    background-color: rgb(246.275, 246.275, 246.275);
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
sf-app.sf-app article, sf-app.sf-app aside, sf-app.sf-app details, sf-app.sf-app figcaption, sf-app.sf-app figure, sf-app.sf-app footer, sf-app.sf-app header, sf-app.sf-app hgroup, sf-app.sf-app main, sf-app.sf-app nav, sf-app.sf-app section, sf-app.sf-app summary,
sf-app.sf-app button, sf-app.sf-app input, sf-app.sf-app optgroup, sf-app.sf-app select, sf-app.sf-app textarea,
sf-app.sf-app h1, sf-app.sf-app h2, sf-app.sf-app h3, sf-app.sf-app h4, sf-app.sf-app h5, sf-app.sf-app h6,
sf-app.sf-app p, sf-app.sf-app blockquote, sf-app.sf-app pre,
sf-app.sf-app dl, sf-app.sf-app dd, sf-app.sf-app ol, sf-app.sf-app ul, sf-app.sf-app li,
sf-app.sf-app form, sf-app.sf-app fieldset, sf-app.sf-app legend, sf-app.sf-app label,
sf-app.sf-app table, sf-app.sf-app th, sf-app.sf-app td, sf-app.sf-app caption,
sf-app.sf-app hr {
  place-content: stretch flex-start;
  align-items: stretch;
  align-self: auto;
  animation: none;
  backface-visibility: visible;
  background: transparent none;
  border: 0;
  inset: auto auto auto auto;
  -webkit-box-decoration-break: slice;
          box-decoration-break: slice;
  box-shadow: none;
  box-sizing: border-box;
  -moz-column-break-after: auto;
       break-after: auto;
  -moz-column-break-before: auto;
       break-before: auto;
  -moz-column-break-inside: auto;
       break-inside: auto;
  caption-side: top;
  caret-color: auto;
  clear: none;
  clip: auto;
  clip-path: none;
  color: inherit;
  -moz-columns: auto;
       columns: auto;
  content: normal;
  counter-increment: none;
  counter-reset: none;
  empty-cells: show;
  font-family: inherit;
  filter: none;
  flex-direction: row;
  flex: 0 1 auto;
  float: none;
  font-feature-settings: normal;
  font-kerning: auto;
  font-language-override: normal;
  font-size-adjust: none;
  font-stretch: normal;
  font-synthesis: weight style;
  grid: none;
  height: auto;
  -webkit-hyphens: manual;
          hyphens: manual;
  image-orientation: 0deg;
  image-rendering: auto;
  image-resolution: 1dppx;
  ime-mode: auto;
  inline-size: auto;
  isolation: auto;
  letter-spacing: normal;
  line-break: auto;
  margin: 0;
  max-height: none;
  max-width: none;
  min-height: 0;
  min-width: 0;
  object-fit: fill;
  object-position: 50% 50%;
  opacity: 1;
  order: 0;
  orphans: 2;
  outline: medium invert initial;
  outline-offset: 0;
  overflow: visible;
  overflow-wrap: normal;
  padding: 0;
  page-break-after: auto;
  page-break-before: auto;
  page-break-inside: auto;
  perspective: none;
  perspective-origin: 50% 50%;
  position: static;
  quotes: initial;
  resize: none;
  ruby-align: space-around;
  ruby-merge: separate;
  ruby-position: over;
  scroll-behavior: auto;
  scroll-snap-coordinate: none;
  scroll-snap-destination: 0 0;
  scroll-snap-points-x: none;
  scroll-snap-points-y: none;
  scroll-snap-type: none;
  shape-image-threshold: 0%;
  shape-margin: 0;
  shape-outside: none;
  -moz-tab-size: 8;
       tab-size: 8;
  table-layout: auto;
  text-align: inherit;
  text-align-last: auto;
  text-combine-upright: none;
  text-decoration: none;
  -webkit-text-emphasis: none;
          text-emphasis: none;
  text-indent: 0;
  text-justify: auto;
  text-orientation: mixed;
  text-overflow: clip;
  text-rendering: auto;
  text-shadow: none;
  text-transform: inherit;
  text-underline-position: auto;
  touch-action: auto;
  transform: none;
  transform-box: border-box;
  transform-origin: 50% 50% 0;
  transform-style: flat;
  transition: all 0s ease 0s;
  vertical-align: inherit;
  white-space: inherit;
  widows: 2;
  width: auto;
  will-change: auto;
  word-break: normal;
  word-spacing: normal;
  word-wrap: normal;
  z-index: auto;
}

/*!
 *  Font Awesome 4.7.0 by @davegandy - http://fontawesome.io - @fontawesome
 *  License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)
 */
/* FONT PATH
 * -------------------------- */
@font-face {
  font-family: "FontAwesome";
  src: url("/assets/fonts/font-awesome/fontawesome-webfont.eot?v=4.7.0");
  src: url("/assets/fonts/font-awesome/fontawesome-webfont.eot?#iefix&v=4.7.0") format("embedded-opentype"), url("/assets/fonts/font-awesome/fontawesome-webfont.woff2?v=4.7.0") format("woff2"), url("/assets/fonts/font-awesome/fontawesome-webfont.woff?v=4.7.0") format("woff"), url("/assets/fonts/font-awesome/fontawesome-webfont.ttf?v=4.7.0") format("truetype"), url("/assets/fonts/font-awesome/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular") format("svg");
  font-weight: normal;
  font-style: normal;
}
.sf-fa {
  display: inline-block;
  font: normal normal normal 14px / 1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* makes the font 33% larger relative to the icon container */
.sf-fa-lg {
  font-size: 1.3333333333em;
  line-height: 0.75em;
  vertical-align: -15%;
}

.sf-fa-2x {
  font-size: 2em;
}

.sf-fa-3x {
  font-size: 3em;
}

.sf-fa-4x {
  font-size: 4em;
}

.sf-fa-5x {
  font-size: 5em;
}

.sf-fa-fw {
  width: 1.2857142857em;
  text-align: center;
}

.sf-fa-ul {
  padding-left: 0;
  margin-left: 2.1428571429em;
  list-style-type: none;
}

.sf-fa-ul > li {
  position: relative;
}

.sf-fa-li {
  position: absolute;
  left: -2.1428571429em;
  width: 2.1428571429em;
  top: 0.1428571429em;
  text-align: center;
}

.sf-fa-li.sf-fa-lg {
  left: -1.8571428571em;
}

.sf-fa-border {
  padding: 0.2em 0.25em 0.15em;
  border: solid 0.08em #eee;
  border-radius: 0.1em;
}

.sf-fa-pull-left {
  float: left;
}

.sf-fa-pull-right {
  float: right;
}

.sf-fa.sf-fa-pull-left {
  margin-right: 0.3em;
}

.sf-fa.sf-fa-pull-right {
  margin-left: 0.3em;
}

/* Deprecated as of 4.4.0 */
.pull-right {
  float: right;
}

.pull-left {
  float: left;
}

.sf-fa.pull-left {
  margin-right: 0.3em;
}

.sf-fa.pull-right {
  margin-left: 0.3em;
}

.sf-fa-spin {
  animation: fa-spin 2s infinite linear;
}

.sf-fa-pulse {
  animation: fa-spin 1s infinite steps(8);
}
@keyframes fa-spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(359deg);
  }
}
.sf-fa-rotate-90 {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)";
  transform: rotate(90deg);
}

.sf-fa-rotate-180 {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2)";
  transform: rotate(180deg);
}

.sf-fa-rotate-270 {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=3)";
  transform: rotate(270deg);
}

.sf-fa-flip-horizontal {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1)";
  transform: scale(-1, 1);
}

.sf-fa-flip-vertical {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)";
  transform: scale(1, -1);
}

:root .sf-fa-rotate-90,
:root .sf-fa-rotate-180,
:root .sf-fa-rotate-270,
:root .sf-fa-flip-horizontal,
:root .sf-fa-flip-vertical {
  filter: none;
}

.sf-fa-stack {
  position: relative;
  display: inline-block;
  width: 2em;
  height: 2em;
  line-height: 2em;
  vertical-align: middle;
}

.sf-fa-stack-1x, .sf-fa-stack-2x {
  position: absolute;
  left: 0;
  width: 100%;
  text-align: center;
}

.sf-fa-stack-1x {
  line-height: inherit;
}

.sf-fa-stack-2x {
  font-size: 2em;
}

.sf-fa-inverse {
  color: #fff;
}

/* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen
   readers do not read off random characters that represent icons */
.sf-fa-glass:before {
  content: "\f000";
}

.sf-fa-music:before {
  content: "\f001";
}

.sf-fa-search:before {
  content: "\f002";
}

.sf-fa-envelope-o:before {
  content: "\f003";
}

.sf-fa-heart:before {
  content: "\f004";
}

.sf-fa-star:before {
  content: "\f005";
}

.sf-fa-star-o:before {
  content: "\f006";
}

.sf-fa-user:before {
  content: "\f007";
}

.sf-fa-film:before {
  content: "\f008";
}

.sf-fa-th-large:before {
  content: "\f009";
}

.sf-fa-th:before {
  content: "\f00a";
}

.sf-fa-th-list:before {
  content: "\f00b";
}

.sf-fa-check:before {
  content: "\f00c";
}

.sf-fa-remove:before,
.sf-fa-close:before,
.sf-fa-times:before {
  content: "\f00d";
}

.sf-fa-search-plus:before {
  content: "\f00e";
}

.sf-fa-search-minus:before {
  content: "\f010";
}

.sf-fa-power-off:before {
  content: "\f011";
}

.sf-fa-signal:before {
  content: "\f012";
}

.sf-fa-gear:before,
.sf-fa-cog:before {
  content: "\f013";
}

.sf-fa-trash-o:before {
  content: "\f014";
}

.sf-fa-home:before {
  content: "\f015";
}

.sf-fa-file-o:before {
  content: "\f016";
}

.sf-fa-clock-o:before {
  content: "\f017";
}

.sf-fa-road:before {
  content: "\f018";
}

.sf-fa-download:before {
  content: "\f019";
}

.sf-fa-arrow-circle-o-down:before {
  content: "\f01a";
}

.sf-fa-arrow-circle-o-up:before {
  content: "\f01b";
}

.sf-fa-inbox:before {
  content: "\f01c";
}

.sf-fa-play-circle-o:before {
  content: "\f01d";
}

.sf-fa-rotate-right:before,
.sf-fa-repeat:before {
  content: "\f01e";
}

.sf-fa-refresh:before {
  content: "\f021";
}

.sf-fa-list-alt:before {
  content: "\f022";
}

.sf-fa-lock:before {
  content: "\f023";
}

.sf-fa-flag:before {
  content: "\f024";
}

.sf-fa-headphones:before {
  content: "\f025";
}

.sf-fa-volume-off:before {
  content: "\f026";
}

.sf-fa-volume-down:before {
  content: "\f027";
}

.sf-fa-volume-up:before {
  content: "\f028";
}

.sf-fa-qrcode:before {
  content: "\f029";
}

.sf-fa-barcode:before {
  content: "\f02a";
}

.sf-fa-tag:before {
  content: "\f02b";
}

.sf-fa-tags:before {
  content: "\f02c";
}

.sf-fa-book:before {
  content: "\f02d";
}

.sf-fa-bookmark:before {
  content: "\f02e";
}

.sf-fa-print:before {
  content: "\f02f";
}

.sf-fa-camera:before {
  content: "\f030";
}

.sf-fa-font:before {
  content: "\f031";
}

.sf-fa-bold:before {
  content: "\f032";
}

.sf-fa-italic:before {
  content: "\f033";
}

.sf-fa-text-height:before {
  content: "\f034";
}

.sf-fa-text-width:before {
  content: "\f035";
}

.sf-fa-align-left:before {
  content: "\f036";
}

.sf-fa-align-center:before {
  content: "\f037";
}

.sf-fa-align-right:before {
  content: "\f038";
}

.sf-fa-align-justify:before {
  content: "\f039";
}

.sf-fa-list:before {
  content: "\f03a";
}

.sf-fa-dedent:before,
.sf-fa-outdent:before {
  content: "\f03b";
}

.sf-fa-indent:before {
  content: "\f03c";
}

.sf-fa-video-camera:before {
  content: "\f03d";
}

.sf-fa-photo:before,
.sf-fa-image:before,
.sf-fa-picture-o:before {
  content: "\f03e";
}

.sf-fa-pencil:before {
  content: "\f040";
}

.sf-fa-map-marker:before {
  content: "\f041";
}

.sf-fa-adjust:before {
  content: "\f042";
}

.sf-fa-tint:before {
  content: "\f043";
}

.sf-fa-edit:before,
.sf-fa-pencil-square-o:before {
  content: "\f044";
}

.sf-fa-share-square-o:before {
  content: "\f045";
}

.sf-fa-check-square-o:before {
  content: "\f046";
}

.sf-fa-arrows:before {
  content: "\f047";
}

.sf-fa-step-backward:before {
  content: "\f048";
}

.sf-fa-fast-backward:before {
  content: "\f049";
}

.sf-fa-backward:before {
  content: "\f04a";
}

.sf-fa-play:before {
  content: "\f04b";
}

.sf-fa-pause:before {
  content: "\f04c";
}

.sf-fa-stop:before {
  content: "\f04d";
}

.sf-fa-forward:before {
  content: "\f04e";
}

.sf-fa-fast-forward:before {
  content: "\f050";
}

.sf-fa-step-forward:before {
  content: "\f051";
}

.sf-fa-eject:before {
  content: "\f052";
}

.sf-fa-chevron-left:before {
  content: "\f053";
}

.sf-fa-chevron-right:before {
  content: "\f054";
}

.sf-fa-plus-circle:before {
  content: "\f055";
}

.sf-fa-minus-circle:before {
  content: "\f056";
}

.sf-fa-times-circle:before {
  content: "\f057";
}

.sf-fa-check-circle:before {
  content: "\f058";
}

.sf-fa-question-circle:before {
  content: "\f059";
}

.sf-fa-info-circle:before {
  content: "\f05a";
}

.sf-fa-crosshairs:before {
  content: "\f05b";
}

.sf-fa-times-circle-o:before {
  content: "\f05c";
}

.sf-fa-check-circle-o:before {
  content: "\f05d";
}

.sf-fa-ban:before {
  content: "\f05e";
}

.sf-fa-arrow-left:before {
  content: "\f060";
}

.sf-fa-arrow-right:before {
  content: "\f061";
}

.sf-fa-arrow-up:before {
  content: "\f062";
}

.sf-fa-arrow-down:before {
  content: "\f063";
}

.sf-fa-mail-forward:before,
.sf-fa-share:before {
  content: "\f064";
}

.sf-fa-expand:before {
  content: "\f065";
}

.sf-fa-compress:before {
  content: "\f066";
}

.sf-fa-plus:before {
  content: "\f067";
}

.sf-fa-minus:before {
  content: "\f068";
}

.sf-fa-asterisk:before {
  content: "\f069";
}

.sf-fa-exclamation-circle:before {
  content: "\f06a";
}

.sf-fa-gift:before {
  content: "\f06b";
}

.sf-fa-leaf:before {
  content: "\f06c";
}

.sf-fa-fire:before {
  content: "\f06d";
}

.sf-fa-eye:before {
  content: "\f06e";
}

.sf-fa-eye-slash:before {
  content: "\f070";
}

.sf-fa-warning:before,
.sf-fa-exclamation-triangle:before {
  content: "\f071";
}

.sf-fa-plane:before {
  content: "\f072";
}

.sf-fa-calendar:before {
  content: "\f073";
}

.sf-fa-random:before {
  content: "\f074";
}

.sf-fa-comment:before {
  content: "\f075";
}

.sf-fa-magnet:before {
  content: "\f076";
}

.sf-fa-chevron-up:before {
  content: "\f077";
}

.sf-fa-chevron-down:before {
  content: "\f078";
}

.sf-fa-retweet:before {
  content: "\f079";
}

.sf-fa-shopping-cart:before {
  content: "\f07a";
}

.sf-fa-folder:before {
  content: "\f07b";
}

.sf-fa-folder-open:before {
  content: "\f07c";
}

.sf-fa-arrows-v:before {
  content: "\f07d";
}

.sf-fa-arrows-h:before {
  content: "\f07e";
}

.sf-fa-bar-chart-o:before,
.sf-fa-bar-chart:before {
  content: "\f080";
}

.sf-fa-twitter-square:before {
  content: "\f081";
}

.sf-fa-facebook-square:before {
  content: "\f082";
}

.sf-fa-camera-retro:before {
  content: "\f083";
}

.sf-fa-key:before {
  content: "\f084";
}

.sf-fa-gears:before,
.sf-fa-cogs:before {
  content: "\f085";
}

.sf-fa-comments:before {
  content: "\f086";
}

.sf-fa-thumbs-o-up:before {
  content: "\f087";
}

.sf-fa-thumbs-o-down:before {
  content: "\f088";
}

.sf-fa-star-half:before {
  content: "\f089";
}

.sf-fa-heart-o:before {
  content: "\f08a";
}

.sf-fa-sign-out:before {
  content: "\f08b";
}

.sf-fa-linkedin-square:before {
  content: "\f08c";
}

.sf-fa-thumb-tack:before {
  content: "\f08d";
}

.sf-fa-external-link:before {
  content: "\f08e";
}

.sf-fa-sign-in:before {
  content: "\f090";
}

.sf-fa-trophy:before {
  content: "\f091";
}

.sf-fa-github-square:before {
  content: "\f092";
}

.sf-fa-upload:before {
  content: "\f093";
}

.sf-fa-lemon-o:before {
  content: "\f094";
}

.sf-fa-phone:before {
  content: "\f095";
}

.sf-fa-square-o:before {
  content: "\f096";
}

.sf-fa-bookmark-o:before {
  content: "\f097";
}

.sf-fa-phone-square:before {
  content: "\f098";
}

.sf-fa-twitter:before {
  content: "\f099";
}

.sf-fa-facebook-f:before,
.sf-fa-facebook:before {
  content: "\f09a";
}

.sf-fa-github:before {
  content: "\f09b";
}

.sf-fa-unlock:before {
  content: "\f09c";
}

.sf-fa-credit-card:before {
  content: "\f09d";
}

.sf-fa-feed:before,
.sf-fa-rss:before {
  content: "\f09e";
}

.sf-fa-hdd-o:before {
  content: "\f0a0";
}

.sf-fa-bullhorn:before {
  content: "\f0a1";
}

.sf-fa-bell:before {
  content: "\f0f3";
}

.sf-fa-certificate:before {
  content: "\f0a3";
}

.sf-fa-hand-o-right:before {
  content: "\f0a4";
}

.sf-fa-hand-o-left:before {
  content: "\f0a5";
}

.sf-fa-hand-o-up:before {
  content: "\f0a6";
}

.sf-fa-hand-o-down:before {
  content: "\f0a7";
}

.sf-fa-arrow-circle-left:before {
  content: "\f0a8";
}

.sf-fa-arrow-circle-right:before {
  content: "\f0a9";
}

.sf-fa-arrow-circle-up:before {
  content: "\f0aa";
}

.sf-fa-arrow-circle-down:before {
  content: "\f0ab";
}

.sf-fa-globe:before {
  content: "\f0ac";
}

.sf-fa-wrench:before {
  content: "\f0ad";
}

.sf-fa-tasks:before {
  content: "\f0ae";
}

.sf-fa-filter:before {
  content: "\f0b0";
}

.sf-fa-briefcase:before {
  content: "\f0b1";
}

.sf-fa-arrows-alt:before {
  content: "\f0b2";
}

.sf-fa-group:before,
.sf-fa-users:before {
  content: "\f0c0";
}

.sf-fa-chain:before,
.sf-fa-link:before {
  content: "\f0c1";
}

.sf-fa-cloud:before {
  content: "\f0c2";
}

.sf-fa-flask:before {
  content: "\f0c3";
}

.sf-fa-cut:before,
.sf-fa-scissors:before {
  content: "\f0c4";
}

.sf-fa-copy:before,
.sf-fa-files-o:before {
  content: "\f0c5";
}

.sf-fa-paperclip:before {
  content: "\f0c6";
}

.sf-fa-save:before,
.sf-fa-floppy-o:before {
  content: "\f0c7";
}

.sf-fa-square:before {
  content: "\f0c8";
}

.sf-fa-navicon:before,
.sf-fa-reorder:before,
.sf-fa-bars:before {
  content: "\f0c9";
}

.sf-fa-list-ul:before {
  content: "\f0ca";
}

.sf-fa-list-ol:before {
  content: "\f0cb";
}

.sf-fa-strikethrough:before {
  content: "\f0cc";
}

.sf-fa-underline:before {
  content: "\f0cd";
}

.sf-fa-table:before {
  content: "\f0ce";
}

.sf-fa-magic:before {
  content: "\f0d0";
}

.sf-fa-truck:before {
  content: "\f0d1";
}

.sf-fa-pinterest:before {
  content: "\f0d2";
}

.sf-fa-pinterest-square:before {
  content: "\f0d3";
}

.sf-fa-google-plus-square:before {
  content: "\f0d4";
}

.sf-fa-google-plus:before {
  content: "\f0d5";
}

.sf-fa-money:before {
  content: "\f0d6";
}

.sf-fa-caret-down:before {
  content: "\f0d7";
}

.sf-fa-caret-up:before {
  content: "\f0d8";
}

.sf-fa-caret-left:before {
  content: "\f0d9";
}

.sf-fa-caret-right:before {
  content: "\f0da";
}

.sf-fa-columns:before {
  content: "\f0db";
}

.sf-fa-unsorted:before,
.sf-fa-sort:before {
  content: "\f0dc";
}

.sf-fa-sort-down:before,
.sf-fa-sort-desc:before {
  content: "\f0dd";
}

.sf-fa-sort-up:before,
.sf-fa-sort-asc:before {
  content: "\f0de";
}

.sf-fa-envelope:before {
  content: "\f0e0";
}

.sf-fa-linkedin:before {
  content: "\f0e1";
}

.sf-fa-rotate-left:before,
.sf-fa-undo:before {
  content: "\f0e2";
}

.sf-fa-legal:before,
.sf-fa-gavel:before {
  content: "\f0e3";
}

.sf-fa-dashboard:before,
.sf-fa-tachometer:before {
  content: "\f0e4";
}

.sf-fa-comment-o:before {
  content: "\f0e5";
}

.sf-fa-comments-o:before {
  content: "\f0e6";
}

.sf-fa-flash:before,
.sf-fa-bolt:before {
  content: "\f0e7";
}

.sf-fa-sitemap:before {
  content: "\f0e8";
}

.sf-fa-umbrella:before {
  content: "\f0e9";
}

.sf-fa-paste:before,
.sf-fa-clipboard:before {
  content: "\f0ea";
}

.sf-fa-lightbulb-o:before {
  content: "\f0eb";
}

.sf-fa-exchange:before {
  content: "\f0ec";
}

.sf-fa-cloud-download:before {
  content: "\f0ed";
}

.sf-fa-cloud-upload:before {
  content: "\f0ee";
}

.sf-fa-user-md:before {
  content: "\f0f0";
}

.sf-fa-stethoscope:before {
  content: "\f0f1";
}

.sf-fa-suitcase:before {
  content: "\f0f2";
}

.sf-fa-bell-o:before {
  content: "\f0a2";
}

.sf-fa-coffee:before {
  content: "\f0f4";
}

.sf-fa-cutlery:before {
  content: "\f0f5";
}

.sf-fa-file-text-o:before {
  content: "\f0f6";
}

.sf-fa-building-o:before {
  content: "\f0f7";
}

.sf-fa-hospital-o:before {
  content: "\f0f8";
}

.sf-fa-ambulance:before {
  content: "\f0f9";
}

.sf-fa-medkit:before {
  content: "\f0fa";
}

.sf-fa-fighter-jet:before {
  content: "\f0fb";
}

.sf-fa-beer:before {
  content: "\f0fc";
}

.sf-fa-h-square:before {
  content: "\f0fd";
}

.sf-fa-plus-square:before {
  content: "\f0fe";
}

.sf-fa-angle-double-left:before {
  content: "\f100";
}

.sf-fa-angle-double-right:before {
  content: "\f101";
}

.sf-fa-angle-double-up:before {
  content: "\f102";
}

.sf-fa-angle-double-down:before {
  content: "\f103";
}

.sf-fa-angle-left:before {
  content: "\f104";
}

.sf-fa-angle-right:before {
  content: "\f105";
}

.sf-fa-angle-up:before {
  content: "\f106";
}

.sf-fa-angle-down:before {
  content: "\f107";
}

.sf-fa-desktop:before {
  content: "\f108";
}

.sf-fa-laptop:before {
  content: "\f109";
}

.sf-fa-tablet:before {
  content: "\f10a";
}

.sf-fa-mobile-phone:before,
.sf-fa-mobile:before {
  content: "\f10b";
}

.sf-fa-circle-o:before {
  content: "\f10c";
}

.sf-fa-quote-left:before {
  content: "\f10d";
}

.sf-fa-quote-right:before {
  content: "\f10e";
}

.sf-fa-spinner:before {
  content: "\f110";
}

.sf-fa-circle:before {
  content: "\f111";
}

.sf-fa-mail-reply:before,
.sf-fa-reply:before {
  content: "\f112";
}

.sf-fa-github-alt:before {
  content: "\f113";
}

.sf-fa-folder-o:before {
  content: "\f114";
}

.sf-fa-folder-open-o:before {
  content: "\f115";
}

.sf-fa-smile-o:before {
  content: "\f118";
}

.sf-fa-frown-o:before {
  content: "\f119";
}

.sf-fa-meh-o:before {
  content: "\f11a";
}

.sf-fa-gamepad:before {
  content: "\f11b";
}

.sf-fa-keyboard-o:before {
  content: "\f11c";
}

.sf-fa-flag-o:before {
  content: "\f11d";
}

.sf-fa-flag-checkered:before {
  content: "\f11e";
}

.sf-fa-terminal:before {
  content: "\f120";
}

.sf-fa-code:before {
  content: "\f121";
}

.sf-fa-mail-reply-all:before,
.sf-fa-reply-all:before {
  content: "\f122";
}

.sf-fa-star-half-empty:before,
.sf-fa-star-half-full:before,
.sf-fa-star-half-o:before {
  content: "\f123";
}

.sf-fa-location-arrow:before {
  content: "\f124";
}

.sf-fa-crop:before {
  content: "\f125";
}

.sf-fa-code-fork:before {
  content: "\f126";
}

.sf-fa-unlink:before,
.sf-fa-chain-broken:before {
  content: "\f127";
}

.sf-fa-question:before {
  content: "\f128";
}

.sf-fa-info:before {
  content: "\f129";
}

.sf-fa-exclamation:before {
  content: "\f12a";
}

.sf-fa-superscript:before {
  content: "\f12b";
}

.sf-fa-subscript:before {
  content: "\f12c";
}

.sf-fa-eraser:before {
  content: "\f12d";
}

.sf-fa-puzzle-piece:before {
  content: "\f12e";
}

.sf-fa-microphone:before {
  content: "\f130";
}

.sf-fa-microphone-slash:before {
  content: "\f131";
}

.sf-fa-shield:before {
  content: "\f132";
}

.sf-fa-calendar-o:before {
  content: "\f133";
}

.sf-fa-fire-extinguisher:before {
  content: "\f134";
}

.sf-fa-rocket:before {
  content: "\f135";
}

.sf-fa-maxcdn:before {
  content: "\f136";
}

.sf-fa-chevron-circle-left:before {
  content: "\f137";
}

.sf-fa-chevron-circle-right:before {
  content: "\f138";
}

.sf-fa-chevron-circle-up:before {
  content: "\f139";
}

.sf-fa-chevron-circle-down:before {
  content: "\f13a";
}

.sf-fa-html5:before {
  content: "\f13b";
}

.sf-fa-css3:before {
  content: "\f13c";
}

.sf-fa-anchor:before {
  content: "\f13d";
}

.sf-fa-unlock-alt:before {
  content: "\f13e";
}

.sf-fa-bullseye:before {
  content: "\f140";
}

.sf-fa-ellipsis-h:before {
  content: "\f141";
}

.sf-fa-ellipsis-v:before {
  content: "\f142";
}

.sf-fa-rss-square:before {
  content: "\f143";
}

.sf-fa-play-circle:before {
  content: "\f144";
}

.sf-fa-ticket:before {
  content: "\f145";
}

.sf-fa-minus-square:before {
  content: "\f146";
}

.sf-fa-minus-square-o:before {
  content: "\f147";
}

.sf-fa-level-up:before {
  content: "\f148";
}

.sf-fa-level-down:before {
  content: "\f149";
}

.sf-fa-check-square:before {
  content: "\f14a";
}

.sf-fa-pencil-square:before {
  content: "\f14b";
}

.sf-fa-external-link-square:before {
  content: "\f14c";
}

.sf-fa-share-square:before {
  content: "\f14d";
}

.sf-fa-compass:before {
  content: "\f14e";
}

.sf-fa-toggle-down:before,
.sf-fa-caret-square-o-down:before {
  content: "\f150";
}

.sf-fa-toggle-up:before,
.sf-fa-caret-square-o-up:before {
  content: "\f151";
}

.sf-fa-toggle-right:before,
.sf-fa-caret-square-o-right:before {
  content: "\f152";
}

.sf-fa-euro:before,
.sf-fa-eur:before {
  content: "\f153";
}

.sf-fa-gbp:before {
  content: "\f154";
}

.sf-fa-dollar:before,
.sf-fa-usd:before {
  content: "\f155";
}

.sf-fa-rupee:before,
.sf-fa-inr:before {
  content: "\f156";
}

.sf-fa-cny:before,
.sf-fa-rmb:before,
.sf-fa-yen:before,
.sf-fa-jpy:before {
  content: "\f157";
}

.sf-fa-ruble:before,
.sf-fa-rouble:before,
.sf-fa-rub:before {
  content: "\f158";
}

.sf-fa-won:before,
.sf-fa-krw:before {
  content: "\f159";
}

.sf-fa-bitcoin:before,
.sf-fa-btc:before {
  content: "\f15a";
}

.sf-fa-file:before {
  content: "\f15b";
}

.sf-fa-file-text:before {
  content: "\f15c";
}

.sf-fa-sort-alpha-asc:before {
  content: "\f15d";
}

.sf-fa-sort-alpha-desc:before {
  content: "\f15e";
}

.sf-fa-sort-amount-asc:before {
  content: "\f160";
}

.sf-fa-sort-amount-desc:before {
  content: "\f161";
}

.sf-fa-sort-numeric-asc:before {
  content: "\f162";
}

.sf-fa-sort-numeric-desc:before {
  content: "\f163";
}

.sf-fa-thumbs-up:before {
  content: "\f164";
}

.sf-fa-thumbs-down:before {
  content: "\f165";
}

.sf-fa-youtube-square:before {
  content: "\f166";
}

.sf-fa-youtube:before {
  content: "\f167";
}

.sf-fa-xing:before {
  content: "\f168";
}

.sf-fa-xing-square:before {
  content: "\f169";
}

.sf-fa-youtube-play:before {
  content: "\f16a";
}

.sf-fa-dropbox:before {
  content: "\f16b";
}

.sf-fa-stack-overflow:before {
  content: "\f16c";
}

.sf-fa-instagram:before {
  content: "\f16d";
}

.sf-fa-flickr:before {
  content: "\f16e";
}

.sf-fa-adn:before {
  content: "\f170";
}

.sf-fa-bitbucket:before {
  content: "\f171";
}

.sf-fa-bitbucket-square:before {
  content: "\f172";
}

.sf-fa-tumblr:before {
  content: "\f173";
}

.sf-fa-tumblr-square:before {
  content: "\f174";
}

.sf-fa-long-arrow-down:before {
  content: "\f175";
}

.sf-fa-long-arrow-up:before {
  content: "\f176";
}

.sf-fa-long-arrow-left:before {
  content: "\f177";
}

.sf-fa-long-arrow-right:before {
  content: "\f178";
}

.sf-fa-apple:before {
  content: "\f179";
}

.sf-fa-windows:before {
  content: "\f17a";
}

.sf-fa-android:before {
  content: "\f17b";
}

.sf-fa-linux:before {
  content: "\f17c";
}

.sf-fa-dribbble:before {
  content: "\f17d";
}

.sf-fa-skype:before {
  content: "\f17e";
}

.sf-fa-foursquare:before {
  content: "\f180";
}

.sf-fa-trello:before {
  content: "\f181";
}

.sf-fa-female:before {
  content: "\f182";
}

.sf-fa-male:before {
  content: "\f183";
}

.sf-fa-gittip:before,
.sf-fa-gratipay:before {
  content: "\f184";
}

.sf-fa-sun-o:before {
  content: "\f185";
}

.sf-fa-moon-o:before {
  content: "\f186";
}

.sf-fa-archive:before {
  content: "\f187";
}

.sf-fa-bug:before {
  content: "\f188";
}

.sf-fa-vk:before {
  content: "\f189";
}

.sf-fa-weibo:before {
  content: "\f18a";
}

.sf-fa-renren:before {
  content: "\f18b";
}

.sf-fa-pagelines:before {
  content: "\f18c";
}

.sf-fa-stack-exchange:before {
  content: "\f18d";
}

.sf-fa-arrow-circle-o-right:before {
  content: "\f18e";
}

.sf-fa-arrow-circle-o-left:before {
  content: "\f190";
}

.sf-fa-toggle-left:before,
.sf-fa-caret-square-o-left:before {
  content: "\f191";
}

.sf-fa-dot-circle-o:before {
  content: "\f192";
}

.sf-fa-wheelchair:before {
  content: "\f193";
}

.sf-fa-vimeo-square:before {
  content: "\f194";
}

.sf-fa-turkish-lira:before,
.sf-fa-try:before {
  content: "\f195";
}

.sf-fa-plus-square-o:before {
  content: "\f196";
}

.sf-fa-space-shuttle:before {
  content: "\f197";
}

.sf-fa-slack:before {
  content: "\f198";
}

.sf-fa-envelope-square:before {
  content: "\f199";
}

.sf-fa-wordpress:before {
  content: "\f19a";
}

.sf-fa-openid:before {
  content: "\f19b";
}

.sf-fa-institution:before,
.sf-fa-bank:before,
.sf-fa-university:before {
  content: "\f19c";
}

.sf-fa-mortar-board:before,
.sf-fa-graduation-cap:before {
  content: "\f19d";
}

.sf-fa-yahoo:before {
  content: "\f19e";
}

.sf-fa-google:before {
  content: "\f1a0";
}

.sf-fa-reddit:before {
  content: "\f1a1";
}

.sf-fa-reddit-square:before {
  content: "\f1a2";
}

.sf-fa-stumbleupon-circle:before {
  content: "\f1a3";
}

.sf-fa-stumbleupon:before {
  content: "\f1a4";
}

.sf-fa-delicious:before {
  content: "\f1a5";
}

.sf-fa-digg:before {
  content: "\f1a6";
}

.sf-fa-pied-piper-pp:before {
  content: "\f1a7";
}

.sf-fa-pied-piper-alt:before {
  content: "\f1a8";
}

.sf-fa-drupal:before {
  content: "\f1a9";
}

.sf-fa-joomla:before {
  content: "\f1aa";
}

.sf-fa-language:before {
  content: "\f1ab";
}

.sf-fa-fax:before {
  content: "\f1ac";
}

.sf-fa-building:before {
  content: "\f1ad";
}

.sf-fa-child:before {
  content: "\f1ae";
}

.sf-fa-paw:before {
  content: "\f1b0";
}

.sf-fa-spoon:before {
  content: "\f1b1";
}

.sf-fa-cube:before {
  content: "\f1b2";
}

.sf-fa-cubes:before {
  content: "\f1b3";
}

.sf-fa-behance:before {
  content: "\f1b4";
}

.sf-fa-behance-square:before {
  content: "\f1b5";
}

.sf-fa-steam:before {
  content: "\f1b6";
}

.sf-fa-steam-square:before {
  content: "\f1b7";
}

.sf-fa-recycle:before {
  content: "\f1b8";
}

.sf-fa-automobile:before,
.sf-fa-car:before {
  content: "\f1b9";
}

.sf-fa-cab:before,
.sf-fa-taxi:before {
  content: "\f1ba";
}

.sf-fa-tree:before {
  content: "\f1bb";
}

.sf-fa-spotify:before {
  content: "\f1bc";
}

.sf-fa-deviantart:before {
  content: "\f1bd";
}

.sf-fa-soundcloud:before {
  content: "\f1be";
}

.sf-fa-database:before {
  content: "\f1c0";
}

.sf-fa-file-pdf-o:before {
  content: "\f1c1";
}

.sf-fa-file-word-o:before {
  content: "\f1c2";
}

.sf-fa-file-excel-o:before {
  content: "\f1c3";
}

.sf-fa-file-powerpoint-o:before {
  content: "\f1c4";
}

.sf-fa-file-photo-o:before,
.sf-fa-file-picture-o:before,
.sf-fa-file-image-o:before {
  content: "\f1c5";
}

.sf-fa-file-zip-o:before,
.sf-fa-file-archive-o:before {
  content: "\f1c6";
}

.sf-fa-file-sound-o:before,
.sf-fa-file-audio-o:before {
  content: "\f1c7";
}

.sf-fa-file-movie-o:before,
.sf-fa-file-video-o:before {
  content: "\f1c8";
}

.sf-fa-file-code-o:before {
  content: "\f1c9";
}

.sf-fa-vine:before {
  content: "\f1ca";
}

.sf-fa-codepen:before {
  content: "\f1cb";
}

.sf-fa-jsfiddle:before {
  content: "\f1cc";
}

.sf-fa-life-bouy:before,
.sf-fa-life-buoy:before,
.sf-fa-life-saver:before,
.sf-fa-support:before,
.sf-fa-life-ring:before {
  content: "\f1cd";
}

.sf-fa-circle-o-notch:before {
  content: "\f1ce";
}

.sf-fa-ra:before,
.sf-fa-resistance:before,
.sf-fa-rebel:before {
  content: "\f1d0";
}

.sf-fa-ge:before,
.sf-fa-empire:before {
  content: "\f1d1";
}

.sf-fa-git-square:before {
  content: "\f1d2";
}

.sf-fa-git:before {
  content: "\f1d3";
}

.sf-fa-y-combinator-square:before,
.sf-fa-yc-square:before,
.sf-fa-hacker-news:before {
  content: "\f1d4";
}

.sf-fa-tencent-weibo:before {
  content: "\f1d5";
}

.sf-fa-qq:before {
  content: "\f1d6";
}

.sf-fa-wechat:before,
.sf-fa-weixin:before {
  content: "\f1d7";
}

.sf-fa-send:before,
.sf-fa-paper-plane:before {
  content: "\f1d8";
}

.sf-fa-send-o:before,
.sf-fa-paper-plane-o:before {
  content: "\f1d9";
}

.sf-fa-history:before {
  content: "\f1da";
}

.sf-fa-circle-thin:before {
  content: "\f1db";
}

.sf-fa-header:before {
  content: "\f1dc";
}

.sf-fa-paragraph:before {
  content: "\f1dd";
}

.sf-fa-sliders:before {
  content: "\f1de";
}

.sf-fa-share-alt:before {
  content: "\f1e0";
}

.sf-fa-share-alt-square:before {
  content: "\f1e1";
}

.sf-fa-bomb:before {
  content: "\f1e2";
}

.sf-fa-soccer-ball-o:before,
.sf-fa-futbol-o:before {
  content: "\f1e3";
}

.sf-fa-tty:before {
  content: "\f1e4";
}

.sf-fa-binoculars:before {
  content: "\f1e5";
}

.sf-fa-plug:before {
  content: "\f1e6";
}

.sf-fa-slideshare:before {
  content: "\f1e7";
}

.sf-fa-twitch:before {
  content: "\f1e8";
}

.sf-fa-yelp:before {
  content: "\f1e9";
}

.sf-fa-newspaper-o:before {
  content: "\f1ea";
}

.sf-fa-wifi:before {
  content: "\f1eb";
}

.sf-fa-calculator:before {
  content: "\f1ec";
}

.sf-fa-paypal:before {
  content: "\f1ed";
}

.sf-fa-google-wallet:before {
  content: "\f1ee";
}

.sf-fa-cc-visa:before {
  content: "\f1f0";
}

.sf-fa-cc-mastercard:before {
  content: "\f1f1";
}

.sf-fa-cc-discover:before {
  content: "\f1f2";
}

.sf-fa-cc-amex:before {
  content: "\f1f3";
}

.sf-fa-cc-paypal:before {
  content: "\f1f4";
}

.sf-fa-cc-stripe:before {
  content: "\f1f5";
}

.sf-fa-bell-slash:before {
  content: "\f1f6";
}

.sf-fa-bell-slash-o:before {
  content: "\f1f7";
}

.sf-fa-trash:before {
  content: "\f1f8";
}

.sf-fa-copyright:before {
  content: "\f1f9";
}

.sf-fa-at:before {
  content: "\f1fa";
}

.sf-fa-eyedropper:before {
  content: "\f1fb";
}

.sf-fa-paint-brush:before {
  content: "\f1fc";
}

.sf-fa-birthday-cake:before {
  content: "\f1fd";
}

.sf-fa-area-chart:before {
  content: "\f1fe";
}

.sf-fa-pie-chart:before {
  content: "\f200";
}

.sf-fa-line-chart:before {
  content: "\f201";
}

.sf-fa-lastfm:before {
  content: "\f202";
}

.sf-fa-lastfm-square:before {
  content: "\f203";
}

.sf-fa-toggle-off:before {
  content: "\f204";
}

.sf-fa-toggle-on:before {
  content: "\f205";
}

.sf-fa-bicycle:before {
  content: "\f206";
}

.sf-fa-bus:before {
  content: "\f207";
}

.sf-fa-ioxhost:before {
  content: "\f208";
}

.sf-fa-angellist:before {
  content: "\f209";
}

.sf-fa-cc:before {
  content: "\f20a";
}

.sf-fa-shekel:before,
.sf-fa-sheqel:before,
.sf-fa-ils:before {
  content: "\f20b";
}

.sf-fa-meanpath:before {
  content: "\f20c";
}

.sf-fa-buysellads:before {
  content: "\f20d";
}

.sf-fa-connectdevelop:before {
  content: "\f20e";
}

.sf-fa-dashcube:before {
  content: "\f210";
}

.sf-fa-forumbee:before {
  content: "\f211";
}

.sf-fa-leanpub:before {
  content: "\f212";
}

.sf-fa-sellsy:before {
  content: "\f213";
}

.sf-fa-shirtsinbulk:before {
  content: "\f214";
}

.sf-fa-simplybuilt:before {
  content: "\f215";
}

.sf-fa-skyatlas:before {
  content: "\f216";
}

.sf-fa-cart-plus:before {
  content: "\f217";
}

.sf-fa-cart-arrow-down:before {
  content: "\f218";
}

.sf-fa-diamond:before {
  content: "\f219";
}

.sf-fa-ship:before {
  content: "\f21a";
}

.sf-fa-user-secret:before {
  content: "\f21b";
}

.sf-fa-motorcycle:before {
  content: "\f21c";
}

.sf-fa-street-view:before {
  content: "\f21d";
}

.sf-fa-heartbeat:before {
  content: "\f21e";
}

.sf-fa-venus:before {
  content: "\f221";
}

.sf-fa-mars:before {
  content: "\f222";
}

.sf-fa-mercury:before {
  content: "\f223";
}

.sf-fa-intersex:before,
.sf-fa-transgender:before {
  content: "\f224";
}

.sf-fa-transgender-alt:before {
  content: "\f225";
}

.sf-fa-venus-double:before {
  content: "\f226";
}

.sf-fa-mars-double:before {
  content: "\f227";
}

.sf-fa-venus-mars:before {
  content: "\f228";
}

.sf-fa-mars-stroke:before {
  content: "\f229";
}

.sf-fa-mars-stroke-v:before {
  content: "\f22a";
}

.sf-fa-mars-stroke-h:before {
  content: "\f22b";
}

.sf-fa-neuter:before {
  content: "\f22c";
}

.sf-fa-genderless:before {
  content: "\f22d";
}

.sf-fa-facebook-official:before {
  content: "\f230";
}

.sf-fa-pinterest-p:before {
  content: "\f231";
}

.sf-fa-whatsapp:before {
  content: "\f232";
}

.sf-fa-server:before {
  content: "\f233";
}

.sf-fa-user-plus:before {
  content: "\f234";
}

.sf-fa-user-times:before {
  content: "\f235";
}

.sf-fa-hotel:before,
.sf-fa-bed:before {
  content: "\f236";
}

.sf-fa-viacoin:before {
  content: "\f237";
}

.sf-fa-train:before {
  content: "\f238";
}

.sf-fa-subway:before {
  content: "\f239";
}

.sf-fa-medium:before {
  content: "\f23a";
}

.sf-fa-yc:before,
.sf-fa-y-combinator:before {
  content: "\f23b";
}

.sf-fa-optin-monster:before {
  content: "\f23c";
}

.sf-fa-opencart:before {
  content: "\f23d";
}

.sf-fa-expeditedssl:before {
  content: "\f23e";
}

.sf-fa-battery-4:before,
.sf-fa-battery:before,
.sf-fa-battery-full:before {
  content: "\f240";
}

.sf-fa-battery-3:before,
.sf-fa-battery-three-quarters:before {
  content: "\f241";
}

.sf-fa-battery-2:before,
.sf-fa-battery-half:before {
  content: "\f242";
}

.sf-fa-battery-1:before,
.sf-fa-battery-quarter:before {
  content: "\f243";
}

.sf-fa-battery-0:before,
.sf-fa-battery-empty:before {
  content: "\f244";
}

.sf-fa-mouse-pointer:before {
  content: "\f245";
}

.sf-fa-i-cursor:before {
  content: "\f246";
}

.sf-fa-object-group:before {
  content: "\f247";
}

.sf-fa-object-ungroup:before {
  content: "\f248";
}

.sf-fa-sticky-note:before {
  content: "\f249";
}

.sf-fa-sticky-note-o:before {
  content: "\f24a";
}

.sf-fa-cc-jcb:before {
  content: "\f24b";
}

.sf-fa-cc-diners-club:before {
  content: "\f24c";
}

.sf-fa-clone:before {
  content: "\f24d";
}

.sf-fa-balance-scale:before {
  content: "\f24e";
}

.sf-fa-hourglass-o:before {
  content: "\f250";
}

.sf-fa-hourglass-1:before,
.sf-fa-hourglass-start:before {
  content: "\f251";
}

.sf-fa-hourglass-2:before,
.sf-fa-hourglass-half:before {
  content: "\f252";
}

.sf-fa-hourglass-3:before,
.sf-fa-hourglass-end:before {
  content: "\f253";
}

.sf-fa-hourglass:before {
  content: "\f254";
}

.sf-fa-hand-grab-o:before,
.sf-fa-hand-rock-o:before {
  content: "\f255";
}

.sf-fa-hand-stop-o:before,
.sf-fa-hand-paper-o:before {
  content: "\f256";
}

.sf-fa-hand-scissors-o:before {
  content: "\f257";
}

.sf-fa-hand-lizard-o:before {
  content: "\f258";
}

.sf-fa-hand-spock-o:before {
  content: "\f259";
}

.sf-fa-hand-pointer-o:before {
  content: "\f25a";
}

.sf-fa-hand-peace-o:before {
  content: "\f25b";
}

.sf-fa-trademark:before {
  content: "\f25c";
}

.sf-fa-registered:before {
  content: "\f25d";
}

.sf-fa-creative-commons:before {
  content: "\f25e";
}

.sf-fa-gg:before {
  content: "\f260";
}

.sf-fa-gg-circle:before {
  content: "\f261";
}

.sf-fa-tripadvisor:before {
  content: "\f262";
}

.sf-fa-odnoklassniki:before {
  content: "\f263";
}

.sf-fa-odnoklassniki-square:before {
  content: "\f264";
}

.sf-fa-get-pocket:before {
  content: "\f265";
}

.sf-fa-wikipedia-w:before {
  content: "\f266";
}

.sf-fa-safari:before {
  content: "\f267";
}

.sf-fa-chrome:before {
  content: "\f268";
}

.sf-fa-firefox:before {
  content: "\f269";
}

.sf-fa-opera:before {
  content: "\f26a";
}

.sf-fa-internet-explorer:before {
  content: "\f26b";
}

.sf-fa-tv:before,
.sf-fa-television:before {
  content: "\f26c";
}

.sf-fa-contao:before {
  content: "\f26d";
}

.sf-fa-500px:before {
  content: "\f26e";
}

.sf-fa-amazon:before {
  content: "\f270";
}

.sf-fa-calendar-plus-o:before {
  content: "\f271";
}

.sf-fa-calendar-minus-o:before {
  content: "\f272";
}

.sf-fa-calendar-times-o:before {
  content: "\f273";
}

.sf-fa-calendar-check-o:before {
  content: "\f274";
}

.sf-fa-industry:before {
  content: "\f275";
}

.sf-fa-map-pin:before {
  content: "\f276";
}

.sf-fa-map-signs:before {
  content: "\f277";
}

.sf-fa-map-o:before {
  content: "\f278";
}

.sf-fa-map:before {
  content: "\f279";
}

.sf-fa-commenting:before {
  content: "\f27a";
}

.sf-fa-commenting-o:before {
  content: "\f27b";
}

.sf-fa-houzz:before {
  content: "\f27c";
}

.sf-fa-vimeo:before {
  content: "\f27d";
}

.sf-fa-black-tie:before {
  content: "\f27e";
}

.sf-fa-fonticons:before {
  content: "\f280";
}

.sf-fa-reddit-alien:before {
  content: "\f281";
}

.sf-fa-edge:before {
  content: "\f282";
}

.sf-fa-credit-card-alt:before {
  content: "\f283";
}

.sf-fa-codiepie:before {
  content: "\f284";
}

.sf-fa-modx:before {
  content: "\f285";
}

.sf-fa-fort-awesome:before {
  content: "\f286";
}

.sf-fa-usb:before {
  content: "\f287";
}

.sf-fa-product-hunt:before {
  content: "\f288";
}

.sf-fa-mixcloud:before {
  content: "\f289";
}

.sf-fa-scribd:before {
  content: "\f28a";
}

.sf-fa-pause-circle:before {
  content: "\f28b";
}

.sf-fa-pause-circle-o:before {
  content: "\f28c";
}

.sf-fa-stop-circle:before {
  content: "\f28d";
}

.sf-fa-stop-circle-o:before {
  content: "\f28e";
}

.sf-fa-shopping-bag:before {
  content: "\f290";
}

.sf-fa-shopping-basket:before {
  content: "\f291";
}

.sf-fa-hashtag:before {
  content: "\f292";
}

.sf-fa-bluetooth:before {
  content: "\f293";
}

.sf-fa-bluetooth-b:before {
  content: "\f294";
}

.sf-fa-percent:before {
  content: "\f295";
}

.sf-fa-gitlab:before {
  content: "\f296";
}

.sf-fa-wpbeginner:before {
  content: "\f297";
}

.sf-fa-wpforms:before {
  content: "\f298";
}

.sf-fa-envira:before {
  content: "\f299";
}

.sf-fa-universal-access:before {
  content: "\f29a";
}

.sf-fa-wheelchair-alt:before {
  content: "\f29b";
}

.sf-fa-question-circle-o:before {
  content: "\f29c";
}

.sf-fa-blind:before {
  content: "\f29d";
}

.sf-fa-audio-description:before {
  content: "\f29e";
}

.sf-fa-volume-control-phone:before {
  content: "\f2a0";
}

.sf-fa-braille:before {
  content: "\f2a1";
}

.sf-fa-assistive-listening-systems:before {
  content: "\f2a2";
}

.sf-fa-asl-interpreting:before,
.sf-fa-american-sign-language-interpreting:before {
  content: "\f2a3";
}

.sf-fa-deafness:before,
.sf-fa-hard-of-hearing:before,
.sf-fa-deaf:before {
  content: "\f2a4";
}

.sf-fa-glide:before {
  content: "\f2a5";
}

.sf-fa-glide-g:before {
  content: "\f2a6";
}

.sf-fa-signing:before,
.sf-fa-sign-language:before {
  content: "\f2a7";
}

.sf-fa-low-vision:before {
  content: "\f2a8";
}

.sf-fa-viadeo:before {
  content: "\f2a9";
}

.sf-fa-viadeo-square:before {
  content: "\f2aa";
}

.sf-fa-snapchat:before {
  content: "\f2ab";
}

.sf-fa-snapchat-ghost:before {
  content: "\f2ac";
}

.sf-fa-snapchat-square:before {
  content: "\f2ad";
}

.sf-fa-pied-piper:before {
  content: "\f2ae";
}

.sf-fa-first-order:before {
  content: "\f2b0";
}

.sf-fa-yoast:before {
  content: "\f2b1";
}

.sf-fa-themeisle:before {
  content: "\f2b2";
}

.sf-fa-google-plus-circle:before,
.sf-fa-google-plus-official:before {
  content: "\f2b3";
}

.sf-fa-fa:before,
.sf-fa-font-awesome:before {
  content: "\f2b4";
}

.sf-fa-handshake-o:before {
  content: "\f2b5";
}

.sf-fa-envelope-open:before {
  content: "\f2b6";
}

.sf-fa-envelope-open-o:before {
  content: "\f2b7";
}

.sf-fa-linode:before {
  content: "\f2b8";
}

.sf-fa-address-book:before {
  content: "\f2b9";
}

.sf-fa-address-book-o:before {
  content: "\f2ba";
}

.sf-fa-vcard:before,
.sf-fa-address-card:before {
  content: "\f2bb";
}

.sf-fa-vcard-o:before,
.sf-fa-address-card-o:before {
  content: "\f2bc";
}

.sf-fa-user-circle:before {
  content: "\f2bd";
}

.sf-fa-user-circle-o:before {
  content: "\f2be";
}

.sf-fa-user-o:before {
  content: "\f2c0";
}

.sf-fa-id-badge:before {
  content: "\f2c1";
}

.sf-fa-drivers-license:before,
.sf-fa-id-card:before {
  content: "\f2c2";
}

.sf-fa-drivers-license-o:before,
.sf-fa-id-card-o:before {
  content: "\f2c3";
}

.sf-fa-quora:before {
  content: "\f2c4";
}

.sf-fa-free-code-camp:before {
  content: "\f2c5";
}

.sf-fa-telegram:before {
  content: "\f2c6";
}

.sf-fa-thermometer-4:before,
.sf-fa-thermometer:before,
.sf-fa-thermometer-full:before {
  content: "\f2c7";
}

.sf-fa-thermometer-3:before,
.sf-fa-thermometer-three-quarters:before {
  content: "\f2c8";
}

.sf-fa-thermometer-2:before,
.sf-fa-thermometer-half:before {
  content: "\f2c9";
}

.sf-fa-thermometer-1:before,
.sf-fa-thermometer-quarter:before {
  content: "\f2ca";
}

.sf-fa-thermometer-0:before,
.sf-fa-thermometer-empty:before {
  content: "\f2cb";
}

.sf-fa-shower:before {
  content: "\f2cc";
}

.sf-fa-bathtub:before,
.sf-fa-s15:before,
.sf-fa-bath:before {
  content: "\f2cd";
}

.sf-fa-podcast:before {
  content: "\f2ce";
}

.sf-fa-window-maximize:before {
  content: "\f2d0";
}

.sf-fa-window-minimize:before {
  content: "\f2d1";
}

.sf-fa-window-restore:before {
  content: "\f2d2";
}

.sf-fa-times-rectangle:before,
.sf-fa-window-close:before {
  content: "\f2d3";
}

.sf-fa-times-rectangle-o:before,
.sf-fa-window-close-o:before {
  content: "\f2d4";
}

.sf-fa-bandcamp:before {
  content: "\f2d5";
}

.sf-fa-grav:before {
  content: "\f2d6";
}

.sf-fa-etsy:before {
  content: "\f2d7";
}

.sf-fa-imdb:before {
  content: "\f2d8";
}

.sf-fa-ravelry:before {
  content: "\f2d9";
}

.sf-fa-eercast:before {
  content: "\f2da";
}

.sf-fa-microchip:before {
  content: "\f2db";
}

.sf-fa-snowflake-o:before {
  content: "\f2dc";
}

.sf-fa-superpowers:before {
  content: "\f2dd";
}

.sf-fa-wpexplorer:before {
  content: "\f2de";
}

.sf-fa-meetup:before {
  content: "\f2e0";
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

.sr-only-focusable:active, .sr-only-focusable:focus {
  position: static;
  width: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  clip: auto;
}

@font-face {
  font-family: "sf-font";
  src: url("/assets/fonts/sf-font/sf-font.eot?t=1741172886221"); /* IE9*/
  src: url("/assets/fonts/sf-font/sf-font.eot?t=1741172886221#iefix") format("embedded-opentype"), url("/assets/fonts/sf-font/sf-font.woff2?t=1741172886221") format("woff2"), url("/assets/fonts/sf-font/sf-font.woff?t=1741172886221") format("woff"), url("/assets/fonts/sf-font/sf-font.ttf?t=1741172886221") format("truetype"), url("/assets/fonts/sf-font/sf-font.svg?t=1741172886221") format("svg");
}
[class^=sf-font-], [class*=" sf-font-"] {
  font-family: "sf-font" !important;
  font-size: undefined;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.sf-font-breadcrumb::before {
  content: "\ea01";
}

.sf-font-button::before {
  content: "\ea02";
}

.sf-font-call-to-action::before {
  content: "\ea03";
}

.sf-font-captcha::before {
  content: "\ea04";
}

.sf-font-chart::before {
  content: "\ea05";
}

.sf-font-chat::before {
  content: "\ea06";
}

.sf-font-check::before {
  content: "\ea07";
}

.sf-font-checkboxes::before {
  content: "\ea08";
}

.sf-font-classification::before {
  content: "\ea09";
}

.sf-font-code::before {
  content: "\ea0a";
}

.sf-font-column::before {
  content: "\ea0b";
}

.sf-font-content-block::before {
  content: "\ea0c";
}

.sf-font-content-list::before {
  content: "\ea0d";
}

.sf-font-content-section::before {
  content: "\ea0e";
}

.sf-font-copy::before {
  content: "\ea0f";
}

.sf-font-date-time::before {
  content: "\ea10";
}

.sf-font-document::before {
  content: "\ea11";
}

.sf-font-dropdown::before {
  content: "\ea12";
}

.sf-font-error::before {
  content: "\ea13";
}

.sf-font-favorites::before {
  content: "\ea14";
}

.sf-font-file-upload::before {
  content: "\ea15";
}

.sf-font-form::before {
  content: "\ea16";
}

.sf-font-heading::before {
  content: "\ea17";
}

.sf-font-history::before {
  content: "\ea18";
}

.sf-font-image::before {
  content: "\ea19";
}

.sf-font-important::before {
  content: "\ea1a";
}

.sf-font-knowledge::before {
  content: "\ea1b";
}

.sf-font-language::before {
  content: "\ea1c";
}

.sf-font-layout-icon::before {
  content: "\ea1d";
}

.sf-font-link::before {
  content: "\ea1e";
}

.sf-font-location::before {
  content: "\ea1f";
}

.sf-font-login::before {
  content: "\ea20";
}

.sf-font-mail::before {
  content: "\ea21";
}

.sf-font-manager::before {
  content: "\ea22";
}

.sf-font-multiple-choice::before {
  content: "\ea23";
}

.sf-font-navigation::before {
  content: "\ea24";
}

.sf-font-notification::before {
  content: "\ea25";
}

.sf-font-number::before {
  content: "\ea26";
}

.sf-font-paragraph-textbox::before {
  content: "\ea27";
}

.sf-font-paragraph::before {
  content: "\ea28";
}

.sf-font-password::before {
  content: "\ea29";
}

.sf-font-pencil::before {
  content: "\ea2a";
}

.sf-font-profile::before {
  content: "\ea2b";
}

.sf-font-recommendation::before {
  content: "\ea2c";
}

.sf-font-registration::before {
  content: "\ea2d";
}

.sf-font-restricted::before {
  content: "\ea2e";
}

.sf-font-rich-text::before {
  content: "\ea2f";
}

.sf-font-search::before {
  content: "\ea30";
}

.sf-font-section::before {
  content: "\ea31";
}

.sf-font-settings::before {
  content: "\ea32";
}

.sf-font-short-text::before {
  content: "\ea33";
}

.sf-font-sparkles::before {
  content: "\ea34";
}

.sf-font-textbox::before {
  content: "\ea35";
}

.sf-font-video::before {
  content: "\ea36";
}

.sf-font-yes-no::before {
  content: "\ea37";
}

sf-app.sf-app {
  --badge-white-border-color: var(--sf-color-secondary-lighter, #e4e4e4);
  --sf-badge-white-hover-bg: var(--sf-color-secondary-lighter, #e4e4e4);
  --badge-color-bg-positive: var(--sf-color-success, #38ab63);
  --badge-color-bg-negative: var(--sf-color-error, #ff4848);
  --badge-add-variation-bg-color: var(--sf-color-info-lightest, #b3d3f4);
  --badge-add-variation-border-color: var(--sf-color-info-lightest, #b3d3f4);
  --badge-add-variation-hover: var(--sf-color-info-lighter, #99c4ef);
  --badge-add-variation-border-hover: var(--sf-color-info-lighter, #99c4ef);
  --badge-add-variation-color: #fff;
  --badge-edit-variation-color: #fff;
  --badge-edit-variation-bg-color: var(--sf-color-info, #006cd9);
  --badge-edit-variation-hover: var(--sf-color-info-darker, #005BB7);
  --badge-add-color: #333;
  --sf-badge-add-color-hover: #333;
  --badge-icon-color: #333;
  --badge-white-color: #333;
  --badge-negative-color: #fff;
  --badge-positive-color: #fff;
  --badge-color: #fff;
}

sf-app.sf-app {
  --button-border-color: var(--sf-color-secondary-lighter, #e4e4e4);
  --button-background-color: #fff;
  --button-color: #333;
  --button-interaction-border-color: var(--sf-color-secondary-lighter, #e4e4e4);
  --button-interaction-background-color: var(--sf-color-secondary-lighter, #e4e4e4);
  --button-interaction-color: #333;
  --sf-button-dropped-background-color: transparent;
  --sf-button-dropped-border-color: var(--button-border-color);
  --button-disabled-border-color: #eee;
  --button-disabled-background-color: #fff;
  --button-disabled-color: var(--sf-color-secondary-lighter, #e4e4e4);
  --button-disabled-darker-color: var(--sf-color-secondary-dark, #999);
  --action-button-border-color: var(--sf-color-success, #38ab63);
  --action-button-background-color: var(--sf-color-success, #38ab63);
  --action-button-color: #fff;
  --action-button-interaction-border-color: var(--sf-color-success-darker, #309255);
  --action-button-interaction-background-color: var(--sf-color-success-darker, #309255);
  --action-button-interaction-color: #fff;
  --action-button-disabled-border-color: var(--sf-color-success-light, #c4e6d1);
  --action-button-disabled-background-color: var(--sf-color-success-light, #c4e6d1);
  --action-button-disabled-color: #fff;
  --delete-button-border-color: var(--sf-color-error, #ff4848);
  --delete-button-background-color: var(--sf-color-error, #ff4848);
  --delete-button-color: #fff;
  --delete-button-interaction-border-color: var(--sf-color-error-darker, #E62F2F);
  --delete-button-interaction-background-color: var(--sf-color-error-darker, #E62F2F);
  --delete-button-interaction-color: #fff;
  --delete-button-disabled-border-color: var(--sf-color-error-light, #FFC8C8);
  --delete-button-disabled-background-color: var(--sf-color-error-light, #FFC8C8);
  --delete-button-disabled-color: #fff;
}

sf-app.sf-app {
  --checkbox-border: var(--sf-color-secondary-lighter, #e4e4e4);
  --checkbox-checked-border: var(--sf-color-secondary-lighter, #e4e4e4);
  --checkbox-border-hover: var(--sf-color-info-bg, #dcecf5);
  --checkbox-transtion: border-color 0.3s;
}

sf-app.sf-app {
  --sf-chip-default-border-color: var(--sf-color-info-bg, #dcecf5);
  --sf-chip-success-border-color: var(--sf-color-success-bg, #caeed8);
  --sf-chip-error-border-color: var(--sf-color-error-bg, #fcc);
  --sf-chip-invert-border-color: #333;
  --sf-chip-info-border-color: var(--sf-color-info, #006cd9);
}

sf-app.sf-app {
  --radio-chip-border: #d9d9d9;
  --radio-chip-selected-bg-color: var(--sf-color-info-bg, #dcecf5);
  --radio-chip-selected-color: inherit;
  --choice-group-radio-chip-hover-bg-color: var(--button-interaction-background-color);
  --choice-group-radio-chip-hover-color: inherit;
  --radio-list-hover-bg-color: #f5f5f5;
}

sf-app.sf-app {
  --sf-breadcrumb-last-item-color: #333;
}

sf-app.sf-app {
  --dropdown-border: #eee;
  --dropdown-active-bg: #eee;
  --dropdown-item-counter-neutral: var(--sf-color-secondary, #ccc);
}

sf-app.sf-app {
  --editor-inline-min-height: 150px;
  --editor-inline-min-height-long: 300px;
  --editor-collapsed-height: 450px;
  --sf-editor-image-selected-outline: -5px;
  --sf-editor-image-selected-border: transparent;
}

sf-app.sf-app {
  --default-icon-color: var(--sf-color-secondary-dark, #777);
  --icon-lighter-color: #eee;
  --icon-light-color: var(--sf-color-secondary, #ccc);
  --icon-illustrative-font-color: #eee;
  --icon-positive-color: var(--sf-color-success, #38ab63);
  --icon-negative-color: var(--sf-color-error, #ff4848);
  --icon-badge-add-color: #fff;
  --icon-badge-add-bg-color: var(--sf-color-info-lightest, #b3d3f4);
  --icon-badge-add-border-color: var(--sf-color-info-lightest, #b3d3f4);
  --icon-link-color-hover: var(--link-secondary-color);
}

sf-app.sf-app {
  --default-icon-size: 1.8rem;
  --icon-size-7xs: 0.5rem;
  --icon-size-5xs: 1rem;
  --icon-size-4xs: 1.1rem;
  --icon-size-3xs: 1.2rem;
  --icon-size-2xs: 1.3rem;
  --icon-size-xs: 1.4rem;
  --icon-size-s: 1.6rem;
  --icon-size-m: 1.8rem;
  --icon-size-l: 2rem;
  --icon-size-xl: 2.2rem;
  --icon-size-2xl: 2.8rem;
  --icon-size-3xl: 3.6rem;
  --icon-size-4xl: 4.8rem;
  --icon-size-5xl: 6rem;
  --icon-illustrative-size: 10rem;
  --icon-illustrative-font-size: 4.8rem;
  --icon-illustrative-size-sm: 6rem;
  --icon-zone-editor-size: 1.6rem;
  --icon-faq-size: 2.4rem;
  --icon-widget: 2.4rem;
  --icon-menu-font-size: 4.2rem;
  --icon-document: 3.2rem;
  --icon-tree-font-size: 4.2rem;
  --icon-size-badge: 2.6rem;
  --icon-form-size: 1.5rem;
}

sf-app.sf-app {
  --input-border: var(--sf-color-secondary-lighter, #e4e4e4);
  --input-border-hover: var(--sf-color-secondary-lighter, #e4e4e4);
  --input-char-counter-success-color: var(--sf-color-success, #38ab63);
  --input-char-counter-error-color: var(--sf-color-error, #ff4848);
  --input-placeholder-color: var(--sf-color-secondary, #ccc);
  --input-title-placeholder-color: var(--sf-color-secondary, #ccc);
  --sf-input-color-disabled: var(--sf-color-secondary, #ccc);
  --sf-input-border-disabled: var(--sf-color-secondary-lighter, #e4e4e4);
  --sf-input-box-shadow-focus: var(--sf-color-info, #006cd9);
}

sf-app.sf-app {
  --link-secondary-color: var(--sf-color-secondary-dark, #777);
  --link-side-secondary-color: var(--sf-color-secondary, #ccc);
  --link-side-secondary-color-active: #333;
  --link-side-secondary-color-hover: var(--sf-color-secondary-dark, #999);
  --link-color: var(--sf-color-info, #006cd9);
  --link-color-hover: var(--sf-color-info, #006cd9);
  --sf-link-side-color-bg: var(--sf-color-secondary-lighter, #e4e4e4);
}

sf-app.sf-app {
  --image-empty-border: var(--sf-color-secondary-lighter, #e4e4e4);
  --not-translated-image-label-bg: transparent;
  --document-background: #f5f5f5;
  --document-border-color: #eee;
}

sf-app.sf-app {
  --select-arrow-color: var(--sf-color-secondary-dark, #777);
}

sf-app.sf-app {
  --input-box-shadow-hover: var(--sf-color-secondary-lighter, #e4e4e4);
}

sf-app.sf-app {
  --status-icon-color-system: var(--sf-color-secondary, #ccc);
  --status-icon-color-published: var(--sf-color-success, #38ab63);
  --status-icon-color-restricted: var(--sf-color-error, #ff4848);
  --status-icon-color-unpublished: var(--sf-color-secondary-dark, #999);
  --status-icon-color-scheduled: var(--sf-color-info, #006cd9);
  --status-icon-color-draft: #333;
  --status-bg-color-default: var(--sf-color-warning, #ed8527);
}

sf-app.sf-app {
  --sf-secondary-text-color: var(--sf-color-secondary-dark, #999);
  --sf-secondary-text-color-on-blue-bg: var(--sf-color-secondary-dark, #999);
  --secondary-text-base-inverted: #fff;
}

sf-app.sf-app {
  --font-size-h1-2xl: 9.8rem;
  --font-size-h1-xl: 7.2rem;
  --font-size-h1-lg: 6.4rem;
  --font-size-h1: 4.2rem;
  --font-size-h2: 2rem;
  --font-size-h3: 2rem;
  --font-size-h4-lg: 1.4rem;
  --font-size-h4: 1.3rem;
  --font-size-h5: 1rem;
  --font-size-base: 1.3rem;
  --font-size-lg: 1.5rem;
  --sf-color-h2: var(--sf-color-secondary-dark, #777);
  --sf-color-h5: var(--sf-color-secondary-dark, #999);
}

sf-app.sf-app {
  --tree-list-expander-color: var(--sf-color-secondary-dark, #777);
}

sf-app.sf-app {
  --form-width-medium: 630px;
}

sf-app.sf-app {
  --expander-icon-width-no-unit: 32;
  --expander-icon-width: 32px;
  --expander-icon-margin-right-no-unit: 28;
  --expander-icon-margin-right: calc(var(--expander-icon-margin-right-no-unit) * 1px);
  --expander-left-offset: calc((var(--expander-icon-width-no-unit) + var(--expander-icon-margin-right-no-unit)) * 1px);
  --expander-icon-margin-left: 0;
  --expander-section-margin-right: 0;
  --expander-section-padding: 0;
  --expander-section-background: transparent;
  --expander-header-padding-horizontal: 0;
  --expander-header-padding-vertical: 10px;
}

sf-app.sf-app {
  --field-label-font-size: var(--font-size-h4-lg);
  --field-table-header-vertical-padding: 5px;
  --field-table-header-padding-bottom: var(--field-table-header-vertical-padding);
  --field-table-width: 100%;
}

sf-app.sf-app {
  --tree-common-head-color: var(--sf-secondary-text-color);
  --tree-common-border-color: #eee;
  --sf-tree-sidebar-hover-bg-color: var(--sf-color-secondary-lighter, #e4e4e4);
  --sf-tree-drag-icon-color: var(--sf-color-secondary, #ccc);
  --sf-expander-arrow-color: var(--sf-color-secondary-dark, #777);
}

.-sf-contrast sf-app.sf-app {
  --sf-badge-white-hover-bg: #d9d9d9;
  --badge-white-border-color: #d9d9d9;
  --badge-color-bg-positive: var(--sf-color-success, #38ab63);
  --badge-color-bg-negative: var(--sf-color-error, #ff4848);
  --badge-add-variation-bg-color: var(--sf-color-info-lightest, #b3d3f4);
  --badge-add-variation-border-color: var(--sf-color-info-lighter, #99c4ef);
  --badge-add-variation-hover: var(--sf-color-info-lighter, #99c4ef);
  --badge-add-variation-border-hover: var(--sf-color-info-lighter, #99c4ef);
  --badge-add-variation-color: #333;
  --badge-edit-variation-bg-color: var(--sf-color-info, #006cd9);
  --badge-edit-variation-hover: var(--sf-color-info-darker, #005BB7);
  --badge-color: #333;
  --sf-badge-add-color-hover: #333;
}

.-sf-contrast sf-app.sf-app {
  --button-border-color: #d9d9d9;
  --button-interaction-border-color: #d9d9d9;
  --button-interaction-background-color: #d9d9d9;
  --sf-button-dropped-background-color: #f5f5f5;
  --sf-button-dropped-border-color: #d9d9d9;
  --button-disabled-border-color: #d9d9d9;
  --button-disabled-color: #d9d9d9;
  --action-button-border-color: var(--sf-color-success, #38ab63);
  --action-button-background-color: var(--sf-color-success, #38ab63);
  --action-button-interaction-border-color: var(--sf-color-success-darker, #309255);
  --action-button-interaction-background-color: var(--sf-color-success-darker, #309255);
  --action-button-disabled-border-color: var(--sf-color-success-light, #c4e6d1);
  --action-button-disabled-background-color: var(--sf-color-success-light, #c4e6d1);
  --delete-button-border-color: var(--sf-color-error, #ff4848);
  --delete-button-background-color: var(--sf-color-error, #ff4848);
  --delete-button-interaction-border-color: var(--sf-color-error-darker, #E62F2F);
  --delete-button-interaction-background-color: var(--sf-color-error-darker, #E62F2F);
  --delete-button-disabled-border-color: var(--sf-color-error-light, #FFC8C8);
  --delete-button-disabled-background-color: var(--sf-color-error-light, #FFC8C8);
}

.-sf-contrast sf-app.sf-app {
  --checkbox-checked-border: #d9d9d9;
  --checkbox-border: #d9d9d9;
  --checkbox-border-hover: #cce0f5;
}

.-sf-contrast sf-app.sf-app {
  --sf-color-secondary-lighter: #eee;
  --sf-color-secondary-light: #d9d9d9;
  --sf-color-secondary: #adadad;
  --sf-color-secondary-dark: #707070;
  --sf-color-success-lighter: #cce7d0;
  --sf-color-success-light: #99cfa1;
  --sf-color-success: #008715;
  --sf-color-success-darker: #006c11;
  --sf-color-success-bg: #e6f3e8;
  --sf-color-error-lighter: #f5ccd4;
  --sf-color-error-light: #ea99a9;
  --sf-color-error: #cb0028;
  --sf-color-error-darker: #a20020;
  --sf-color-error-bg: #fae6ea;
  --sf-color-warning: #ff902d;
  --sf-color-warning-light: #f6eb85;
  --sf-color-warning-bg: #fbf7ce;
  --sf-color-info: #0065cb;
  --sf-color-info-lightest: #e6f0fa;
  --sf-color-info-lighter: #cce0f5;
  --sf-color-info-darker: #0051A2;
  --sf-color-info-bg: #e6f0fa;
  --sf-breadcrumb-last-item-color: #707070;
  --sf-sidebar-toggle-bg-color: #d9d9d9;
}

.-sf-contrast sf-app.sf-app {
  --sf-chip-default-border-color: var(--sf-color-info-lighter);
  --sf-chip-success-border-color: var(--sf-color-success-lighter);
  --sf-chip-error-border-color: var(--sf-color-error-lighter);
}

.-sf-contrast sf-app.sf-app {
  --choice-group-radio-chip-hover-bg-color: #f5f5f5;
}

.-sf-contrast sf-app.sf-app {
  --date-time-icon-border-color: var(--sf-color-secondary-dark, #777) !important;
  --date-time-icon-color: var(--sf-color-secondary-dark, #777) !important;
  --date-time-content-color: var(--sf-color-secondary-dark, #777) !important;
}

.-sf-contrast sf-app.sf-app {
  --dropdown-border: #eee;
  --dropdown-active-bg: #e6f0fa;
  --dropdown-item-counter-neutral: var(--sf-color-secondary-dark, #777);
}

.-sf-contrast sf-app.sf-app {
  --sf-editor-image-selected-outline: -6px;
  --sf-editor-image-selected-border: var(--sf-color-info-lighter);
}

.-sf-contrast sf-app.sf-app {
  --default-icon-color: var(--sf-color-secondary-dark, #777);
  --icon-lighter-color: #d9d9d9;
  --icon-light-color: #d9d9d9;
  --sf-icon-darkest-color: #333;
  --icon-illustrative-font-color: #d9d9d9;
  --icon-positive-color: var(--sf-color-success, #38ab63);
  --icon-badge-add-color: #333;
  --icon-badge-add-bg-color: var(--sf-color-info-lightest, #b3d3f4);
  --icon-badge-add-border-color: var(--sf-color-info-lighter, #99c4ef);
  --icon-link-color-hover: #333;
}

.-sf-contrast sf-app.sf-app {
  --input-placeholder-color: var(--sf-color-secondary-dark, #777);
  --input-title-placeholder-color: #adadad;
  --input-border: #949494;
  --input-border-hover: #d9d9d9;
  --input-char-counter-success-color: var(--sf-color-success, #38ab63);
  --input-char-counter-error-color: var(--sf-color-error, #ff4848);
  --sf-input-color-disabled: var(--sf-color-secondary, #ccc);
  --sf-input-border-disabled: #d9d9d9;
  --sf-input-box-shadow-focus: rgba(0, 101, 203, 0.8);
}

.-sf-contrast sf-app.sf-app {
  --link-secondary-color: var(--sf-color-secondary-dark, #777);
  --link-side-secondary-color-active: #000;
  --link-side-secondary-color-hover: #333;
  --link-side-secondary-color: var(--sf-color-secondary-dark, #777);
  --sf-link-side-color-bg: #d9d9d9;
}

.-sf-contrast sf-app.sf-app {
  --image-empty-border: #d9d9d9;
  --not-translated-image-label-bg: var(--sf-color-secondary-dark, #777);
  --sf-album-selected-background: #cce0f5;
}

.-sf-contrast sf-app.sf-app {
  --select-border-color: var(--sf-color-secondary-dark, #777) !important;
  --select-arrow-color: var(--sf-color-secondary-dark, #777) !important;
}

.-sf-contrast sf-app.sf-app {
  --input-box-shadow-hover: var(--sf-color-secondary-dark, #999);
}

body.-sf-contrast {
  --sf-footer-color: #707070;
  --sf-topbar-color: #707070;
  --sf-h5-color: #707070;
  --sf-navigation-border-color: #d9d9d9;
  --sf-user-info-border-color: #d9d9d9;
  --sf-navigation-caret: #707070;
  --sf-live-link: #008715;
  --sf-green-main: #008715;
}

.-sf-contrast sf-app.sf-app {
  --status-icon-color-published: var(--sf-color-success, #38ab63);
  --status-icon-color-restricted: var(--sf-color-error, #ff4848);
  --status-bg-color-default: var(--sf-color-warning, #ed8527);
  --status-icon-color-system: #d9d9d9;
  --status-icon-color-scheduled: var(--sf-color-info, #006cd9);
}

.-sf-contrast sf-app.sf-app {
  --sf-secondary-text-color: #707070;
  --sf-secondary-text-color-on-blue-bg: #6b6b6b;
  --sf-color-primary-invert: #333;
}

.-sf-contrast sf-app.sf-app {
  --tree-list-expander-color: var(--sf-color-secondary-dark, #999);
  --sf-tree-sidebar-hover-bg-color: #d9d9d9;
  --sf-tree-drag-icon-color: var(--sf-color-secondary-dark, #999);
  --sf-tree-active-bg-check-icon-color: #0065cb;
  --sf-tree-active-bg-check-icon-hover-color: #333;
  --sf-expander-arrow-color: #333;
}

.-sf-contrast sf-app.sf-app {
  --sf-color-h2: var(--sf-color-secondary-dark, #777);
  --sf-color-h5: var(--sf-color-secondary-dark, #999);
}

html, body {
  margin: 0;
  padding: 0;
  height: 100%;
}

html:not(.sfPageEditorWrp) {
  font-size: 62.5%;
  min-height: 100%;
}

.-sf-integrated-app body:not(.sfPageEditor) {
  font-size: var(--font-size-base);
  background-color: #fff;
  overflow: auto scroll;
}

.-sf-integrated-app body:not(.sfPageEditor):has(.sf-main.-list) {
  overflow-anchor: none;
}

sf-app.sf-app {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  position: relative;
  font-family: "Open Sans", sans-serif;
  font-size: var(--font-size-base);
  line-height: 1.4;
  color: #333;
}

::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-button {
  width: 0;
  height: 0;
  display: none;
}

::-webkit-scrollbar-track {
  background-color: #eee;
}

::-webkit-scrollbar-thumb {
  border-radius: 2px;
  background-color: rgb(193.8, 193.8, 193.8);
}

::-webkit-scrollbar-thumb:hover {
  background-color: rgb(183.6, 183.6, 183.6);
}

::-webkit-scrollbar-thumb:active {
  background-color: rgb(173.4, 173.4, 173.4);
}

.-scrollbar-small::-webkit-scrollbar {
  border-radius: 1px;
  width: 5px;
  height: 5px;
}

sf-app.sf-app {
  /*
   Default Link

   Default and secondary links

   Markup:
    <a href="#">Default link</a><br>
    <a class="-secondary">Secondary link</a>

   Styleguide: Link.default
  */
  /*
   Navigation links

   Markup:
      <a class="-side" href="#">Navigation link</a><br>
      <a class="-side -active">Settings link</a>

   Styleguide: Link.navigation
  */
  /*
   Section nav links

   Markup:
      <a class="-side-secondary" href="#">Categories and tags</a><br>
      <a class="-side-secondary -active">Search engine optimi...</a><br>
      <a class="-side-secondary" href="#">Social media</a><br>

   Styleguide: Link.section-nav-links
  */
  /*
   Basic links

      Markup:
      <span tabindex="0" class="sf-link -basic">Categories and tags</span><br>

   Styleguide: Link.basic-links
  */
  /*
   Toolbar links

      Markup:
      <div class="sf-top-toolbar" style="position: static;">
        <span tabindex="0" class="sf-link -top-toolbar">Categories and tags</span><br>
        <span tabindex="0" class="sf-link -top-toolbar -active">Categories and tags</span><br>
      </div>

   Styleguide: Link.toolbar-links
  */
  /*
   Default lists

   Markup:
    <ul>
      <li>Item 1</li>
      <li>Item 2</li>
    </ul>
    <br>
    <ol>
      <li>Item 1</li>
      <li>Item 2</li>
    </ol>

   Styleguide: List.default
  */
  /*
   List with list-style: none:

    Markup:
    <ul class="-list-style-none">
      <li>Item 1</li>
      <li>Item 2</li>
    </ul>
    <br>
    <ol class="-list-style-none">
      <li>Item 1</li>
      <li>Item 2</li>
    </ol>

   Styleguide: List.list-style-none
  */
  /*
    Spacing utility classes

    Margin left and right specials

    `-sf-ml-auto, -sf-mr-auto, -sf-ml-50, -sf-mr-50`

        @example
        <div class="-sf-ml-auto">.-sf-ml-auto - auto</div>
        <div class="-sf-mr-auto">.-sf-mr-auto - auto</div>
        <div class="-sf-ml-50">.-sf-ml-50 - 50%</div>
        <div class="-sf-mr-50">.-sf-mr-50 - 50%</div>

   Styleguide: Spacing.margin-left-right
   */
  /*
    Margin-top classes

    `-sf-mt-{zero,8xs,7xs,6xs,5xs,4xs,3xs,2xs,xs,s,m,l,xl,2xl,3xl,4xl,5xl,6xl,7xl,8xl, 9xl}`

        @example
        <div class="-sf-mt-zero">.-sf-mt-zero - 0</div>
        <div class="-sf-mt-8xs">.-sf-mt-8xs - 1px</div>
        <div class="-sf-mt-7xs">.-sf-mt-7xs - 2px</div>
        <div class="-sf-mt-6xs">.-sf-mt-6xs - 3px</div>
        <div class="-sf-mt-5xs">.-sf-mt-5xs - 4px</div>
        <div class="-sf-mt-4xs">.-sf-mt-4xs - 5px</div>
        <div class="-sf-mt-3xs">.-sf-mt-3xs - 10px</div>
        <div class="-sf-mt-2xs">.-sf-mt-2xs - 15px</div>
        <div class="-sf-mt-xs">.-sf-mt-xs - 20px</div>
        <div class="-sf-mt-s">.-sf-mt-s - 25px</div>
        <div class="-sf-mt-m">.-sf-mt-m - 30px</div>
        <div class="-sf-mt-l">.-sf-mt-l - 35px</div>
        <div class="-sf-mt-xl">.-sf-mt-xl - 40x</div>
        <div class="-sf-mt-2xl">.-sf-mt-2xl - 45px</div>
        <div class="-sf-mt-3xl">.-sf-mt-3xl  - 50px</div>
        <div class="-sf-mt-4xl">.-sf-mt-4xl - 55px</div>
        <div class="-sf-mt-5xl">.-sf-mt-5xl  - 60px</div>
        <div class="-sf-mt-6xl">.-sf-mt-6xl - 80px</div>
        <div class="-sf-mt-7xl">.-sf-mt-7xl  - 100px</div>
        <div class="-sf-mt-8xl">.-sf-mt-8xl  - 120px</div>
        <div class="-sf-mt-9xl">.-sf-mt-9xl  - 140px</div>
        <div class="-sf-mt-10xl">.-sf-mt-10xl  - 160px</div>
        <div class="-sf-mt-11xl">.-sf-mt-11xl  - 180px</div>
        <div class="-sf-mt-12xl">.-sf-mt-12xl  - 200px</div>

      Styleguide: Spacing.margin-top
   */
  /*
    Margin-top negative classes

    `-sf-mt--{6xl, 5xl, 4xl, 3xl, 2xl, xl, l, m, s, xs, 2xs, 3xs, 4xs}`

        Markup:
        <div class="--sf-mt--6xl">.-sf-mt--6xl - -80px</div>
        <div class="--sf-mt--5xl">.-sf-mt--5xl  - -60px</div>
        <div class="--sf-mt--4xl">.-sf-mt--4xl - -55px</div>
        <div class="--sf-mt--3xl">.-sf-mt--3xl  - -50px</div>
        <div class="--sf-mt--2xl">.-sf-mt--2xl - -45px</div>
        <div class="--sf-mt--xl">.-sf-mt--xl - -40x</div>
        <div class="--sf-mt--l">.-sf-mt--l - -35px</div>
        <div class="--sf-mt--m">.-sf-mt--m - -30px</div>
        <div class="--sf-mt--s">.-sf-mt--s - -25px</div>
        <div class="--sf-mt--xs">.-sf-mt--xs - -20px</div>
        <div class="--sf-mt--2xs">.-sf-mt--2xs - -15px</div>
        <div class="--sf-mt--3xs">.-sf-mt--3xs - -10px</div>
        <div class="--sf-mt--4xs">.-sf-mt--4xs - -5px</div>

   Styleguide: Spacing.margin-top-negative
   */
  /*
    Margin-bottom classes

    `-sf-mb-{zero,8xs,7xs,6xs,5xs,4xs,3xs,2xs,xs,s,m,l,xl,2xl,3xl,4xl,5xl,6xl,7xl,8xl, 9xl}`

        Markup:
        <div class="-sf-mb-zero">.-sf-mb-zero - 0</div>
        <div class="-sf-mb-8xs">.-sf-mb-8xs - 1px</div>
        <div class="-sf-mb-7xs">.-sf-mb-7xs - 2px</div>
        <div class="-sf-mb-6xs">.-sf-mb-6xs - 3px</div>
        <div class="-sf-mb-5xs">.-sf-mb-5xs - 4px</div>
        <div class="-sf-mb-4xs">.-sf-mb-4xs - 5px</div>
        <div class="-sf-mb-3xs">.-sf-mb-3xs - 10px</div>
        <div class="-sf-mb-2xs">.-sf-mb-2xs - 15px</div>
        <div class="-sf-mb-xs">.-sf-mb-xs - 20px</div>
        <div class="-sf-mb-s">.-sf-mb-s - 25px</div>
        <div class="-sf-mb-m">.-sf-mb-m - 30px</div>
        <div class="-sf-mb-l">.-sf-mb-l - 35px</div>
        <div class="-sf-mb-xl">.-sf-mb-xl - 40x</div>
        <div class="-sf-mb-2xl">.-sf-mb-2xl - 45px</div>
        <div class="-sf-mb-3xl">.-sf-mb-3xl  - 50px</div>
        <div class="-sf-mb-4xl">.-sf-mb-4xl - 55px</div>
        <div class="-sf-mb-5xl">.-sf-mb-5xl  - 60px</div>
        <div class="-sf-mb-6xl">.-sf-mb-6xl - 80px</div>
        <div class="-sf-mb-7xl">.-sf-mb-7xl  - 100px</div>
        <div class="-sf-mb-8xl">.-sf-mb-8xl  - 120px</div>

   Styleguide: Spacing.margin-bottom
   */
  /*
    Margin-bottom negative classes

    `-sf-mb--{6xl, 5xl, 4xl, 3xl, 2xl, xl, l, m, s, xs, 2xs, 3xs, 4xs}`

        Markup:
        <div class="--sf-mb--6xl">.-sf-mb--6xl - -80px</div>
        <div class="--sf-mb--5xl">.-sf-mb--5xl  - -60px</div>
        <div class="--sf-mb--4xl">.-sf-mb--4xl - -55px</div>
        <div class="--sf-mb--3xl">.-sf-mb--3xl  - -50px</div>
        <div class="--sf-mb--2xl">.-sf-mb--2xl - -45px</div>
        <div class="--sf-mb--xl">.-sf-mb--xl - -40x</div>
        <div class="--sf-mb--l">.-sf-mb--l - -35px</div>
        <div class="--sf-mb--m">.-sf-mb--m - -30px</div>
        <div class="--sf-mb--s">.-sf-mb--s - -25px</div>
        <div class="--sf-mb--xs">.-sf-mb--xs - -20px</div>
        <div class="--sf-mb--2xs">.-sf-mb--2xs - -15px</div>
        <div class="--sf-mb--3xs">.-sf-mb--3xs - -10px</div>
        <div class="--sf-mb--4xs">.-sf-mb--4xs - -5px</div>

   Styleguide: Spacing.margin-bottom-negative
   */
  /*
    Margin-left classes

    `-sf-ml-{auto,zero,8xs,7xs,6xs,5xs,4xs,3xs,2xs,xs,s,m,l,xl,2xl,3xl,4xl,5xl,6xl,7xl,8xl, 9xl}`

        Markup:
        <div class="-sf-ml-auto">.-sf-ml-auto - auto</div>
        <div class="-sf-ml-zero">.-sf-ml-zero - 0</div>
        <div class="-sf-ml-8xs">.-sf-ml-8xs - 1px</div>
        <div class="-sf-ml-7xs">.-sf-ml-7xs - 2px</div>
        <div class="-sf-ml-6xs">.-sf-ml-6xs - 3px</div>
        <div class="-sf-ml-5xs">.-sf-ml-5xs - 4px</div>
        <div class="-sf-ml-4xs">.-sf-ml-4xs - 5px</div>
        <div class="-sf-ml-3xs">.-sf-ml-3xs - 10px</div>
        <div class="-sf-ml-2xs">.-sf-ml-2xs - 15px</div>
        <div class="-sf-ml-xs">.-sf-ml-xs - 20px</div>
        <div class="-sf-ml-s">.-sf-ml-s - 25px</div>
        <div class="-sf-ml-m">.-sf-ml-m - 30px</div>
        <div class="-sf-ml-l">.-sf-ml-l - 35px</div>
        <div class="-sf-ml-xl">.-sf-ml-xl - 40x</div>
        <div class="-sf-ml-2xl">.-sf-ml-2xl - 45px</div>
        <div class="-sf-ml-3xl">.-sf-ml-3xl  - 50px</div>
        <div class="-sf-ml-4xl">.-sf-ml-4xl - 55px</div>
        <div class="-sf-ml-5xl">.-sf-ml-5xl  - 60px</div>
        <div class="-sf-ml-6xl">.-sf-ml-6xl - 80px</div>
        <div class="-sf-ml-7xl">.-sf-ml-7xl  - 100px</div>
        <div class="-sf-ml-8xl">.-sf-ml-8xl  - 120px</div>

   Styleguide: Spacing.margin-left
   */
  /*
    Margin-left negative classes

    `-sf-ml--{6xl, 5xl, 4xl, 3xl, 2xl, xl, l, m, s, xs, 2xs, 3xs, 4xs}`

        Markup:
        <div class="--sf-ml--6xl">.-sf-ml--6xl - -80px</div>
        <div class="--sf-ml--5xl">.-sf-ml--5xl  - -60px</div>
        <div class="--sf-ml--4xl">.-sf-ml--4xl - -55px</div>
        <div class="--sf-ml--3xl">.-sf-ml--3xl  - -50px</div>
        <div class="--sf-ml--2xl">.-sf-ml--2xl - -45px</div>
        <div class="--sf-ml--xl">.-sf-ml--xl - -40x</div>
        <div class="--sf-ml--l">.-sf-ml--l - -35px</div>
        <div class="--sf-ml--m">.-sf-ml--m - -30px</div>
        <div class="--sf-ml--s">.-sf-ml--s - -25px</div>
        <div class="--sf-ml--xs">.-sf-ml--xs - -20px</div>
        <div class="--sf-ml--2xs">.-sf-ml--2xs - -15px</div>
        <div class="--sf-ml--3xs">.-sf-ml--3xs - -10px</div>
        <div class="--sf-ml--4xs">.-sf-ml--4xs - -5px</div>

   Styleguide: Spacing.margin-left-negative
   */
  /*
    Margin-right classes

    `-sf-mr-{auto,zero,8xs,7xs,6xs,5xs,4xs,3xs,2xs,xs,s,m,l,xl,2xl,3xl,4xl,5xl,6xl,7xl,8xl, 9xl}`

        Markup:
        <div class="-sf-mr-auto">.-sf-mr-auto - auto</div>
        <div class="-sf-mr-zero">.-sf-mr-zero - 0</div>
        <div class="-sf-mr-8xs">.-sf-mr-8xs - 1px</div>
        <div class="-sf-mr-7xs">.-sf-mr-7xs - 2px</div>
        <div class="-sf-mr-6xs">.-sf-mr-6xs - 3px</div>
        <div class="-sf-mr-5xs">.-sf-mr-5xs - 4px</div>
        <div class="-sf-mr-4xs">.-sf-mr-4xs - 5px</div>
        <div class="-sf-mr-3xs">.-sf-mr-3xs - 10px</div>
        <div class="-sf-mr-2xs">.-sf-mr-2xs - 15px</div>
        <div class="-sf-mr-xs">.-sf-mr-xs - 20px</div>
        <div class="-sf-mr-s">.-sf-mr-s - 25px</div>
        <div class="-sf-mr-m">.-sf-mr-m - 30px</div>
        <div class="-sf-mr-l">.-sf-mr-l - 35px</div>
        <div class="-sf-mr-xl">.-sf-mr-xl - 40x</div>
        <div class="-sf-mr-2xl">.-sf-mr-2xl - 45px</div>
        <div class="-sf-mr-3xl">.-sf-mr-3xl  - 50px</div>
        <div class="-sf-mr-4xl">.-sf-mr-4xl - 55px</div>
        <div class="-sf-mr-5xl">.-sf-mr-5xl  - 60px</div>
        <div class="-sf-mr-6xl">.-sf-mr-6xl - 80px</div>
        <div class="-sf-mr-7xl">.-sf-mr-7xl  - 100px</div>
        <div class="-sf-mr-8xl">.-sf-mr-8xl  - 120px</div>

   Styleguide: Spacing.margin-right
   */
  /*
    Margin-right negative classes

    `-sf-mr--{6xl, 5xl, 4xl, 3xl, 2xl, xl, l, m, s, xs, 2xs, 3xs, 4xs}`

        Markup:
        <div class="--sf-mr--6xl">.-sf-mr--6xl - -80px</div>
        <div class="--sf-mr--5xl">.-sf-mr--5xl  - -60px</div>
        <div class="--sf-mr--4xl">.-sf-mr--4xl - -55px</div>
        <div class="--sf-mr--3xl">.-sf-mr--3xl  - -50px</div>
        <div class="--sf-mr--2xl">.-sf-mr--2xl - -45px</div>
        <div class="--sf-mr--xl">.-sf-mr--xl - -40x</div>
        <div class="--sf-mr--l">.-sf-mr--l - -35px</div>
        <div class="--sf-mr--m">.-sf-mr--m - -30px</div>
        <div class="--sf-mr--s">.-sf-mr--s - -25px</div>
        <div class="--sf-mr--xs">.-sf-mr--xs - -20px</div>
        <div class="--sf-mr--2xs">.-sf-mr--2xs - -15px</div>
        <div class="--sf-mr--3xs">.-sf-mr--3xs - -10px</div>
        <div class="--sf-mr--4xs">.-sf-mr--4xs - -5px</div>

   Styleguide: Spacing.margin-right-negative
   */
  /*
    Margin classes

    `-sf-m-{auto,zero,8xs,7xs,6xs,5xs,4xs,3xs,2xs,xs,s,m,l,xl,2xl,3xl,4xl,5xl,6xl,7xl,8xl, 9xl}`

        Markup:
        <div class="-sf-m-auto">.-sf-m-auto - auto</div>
        <div class="-sf-m-zero">.-sf-m-zero - 0</div>
        <div class="-sf-m-8xs">.-sf-m-8xs - 1px</div>
        <div class="-sf-m-7xs">.-sf-m-7xs - 2px</div>
        <div class="-sf-m-6xs">.-sf-m-6xs - 3px</div>
        <div class="-sf-m-5xs">.-sf-m-5xs - 4px</div>
        <div class="-sf-m-4xs">.-sf-m-4xs - 5px</div>
        <div class="-sf-m-3xs">.-sf-m-3xs - 10px</div>
        <div class="-sf-m-2xs">.-sf-m-2xs - 15px</div>
        <div class="-sf-m-xs">.-sf-m-xs - 20px</div>
        <div class="-sf-m-s">.-sf-m-s - 25px</div>
        <div class="-sf-m-m">.-sf-m-m - 30px</div>
        <div class="-sf-m-l">.-sf-m-l - 35px</div>
        <div class="-sf-m-xl">.-sf-m-xl - 40x</div>
        <div class="-sf-m-2xl">.-sf-m-2xl - 45px</div>
        <div class="-sf-m-3xl">.-sf-m-3xl  - 50px</div>
        <div class="-sf-m-4xl">.-sf-m-4xl - 55px</div>
        <div class="-sf-m-5xl">.-sf-m-5xl  - 60px</div>
        <div class="-sf-m-6xl">.-sf-m-6xl - 80px</div>
        <div class="-sf-m-7xl">.-sf-m-7xl  - 100px</div>
        <div class="-sf-m-8xl">.-sf-m-8xl  - 120px</div>

   Styleguide: Spacing.margin-classes
   */
  /*
    Padding-top classes

    `-sf-pt-{zero,8xs,7xs,6xs,5xs,4xs,3xs,2xs,xs,s,m,l,xl,2xl,3xl,4xl,5xl,6xl,7xl,8xl, 9xl}`

        Markup:
        <div class="-sf-pt-zero">.-sf-pt-zero - 0</div>
        <div class="-sf-m-8xs">.-sf-pt-8xs - 1px</div>
        <div class="-sf-m-7xs">.-sf-pt-7xs - 2px</div>
        <div class="-sf-m-6xs">.-sf-pt-6xs - 3px</div>
        <div class="-sf-m-5xs">.-sf-pt-5xs - 4px</div>
        <div class="-sf-pt-4xs">.-sf-pt-4xs - 5px</div>
        <div class="-sf-pt-3xs">.-sf-pt-3xs - 10px</div>
        <div class="-sf-pt-2xs">.-sf-pt-2xs - 15px</div>
        <div class="-sf-pt-xs">.-sf-pt-xs - 20px</div>
        <div class="-sf-pt-s">.-sf-pt-s - 25px</div>
        <div class="-sf-pt-m">.-sf-pt-m - 30px</div>
        <div class="-sf-pt-l">.-sf-pt-l - 35px</div>
        <div class="-sf-pt-xl">.-sf-pt-xl - 40x</div>
        <div class="-sf-pt-2xl">.-sf-pt-2xl - 45px</div>
        <div class="-sf-pt-3xl">.-sf-pt-3xl  - 50px</div>
        <div class="-sf-pt-4xl">.-sf-pt-4xl - 55px</div>
        <div class="-sf-pt-5xl">.-sf-pt-5xl  - 60px</div>
        <div class="-sf-pt-6xl">.-sf-pt-6xl - 80px</div>
        <div class="-sf-pt-7xl">.-sf-pt-7xl  - 100px</div>
        <div class="-sf-pt-8xl">.-sf-pt-8xl  - 120px</div>

   Styleguide: Spacing.padding-top
   */
  /*
    Padding-bottom classes

    `-sf-pb-{zero,8xs,7xs,6xs,5xs,4xs,3xs,2xs,xs,s,m,l,xl,2xl,3xl,4xl,5xl,6xl,7xl,8xl, 9xl}`

        Markup:
        <div class="-sf-pb-zero">.-sf-pb-zero - 0</div>
        <div class="-sf-m-8xs">.-sf-pb-8xs - 1px</div>
        <div class="-sf-m-7xs">.-sf-pb-7xs - 2px</div>
        <div class="-sf-m-6xs">.-sf-pb-6xs - 3px</div>
        <div class="-sf-m-5xs">.-sf-pb-5xs - 4px</div>
        <div class="-sf-pb-4xs">.-sf-pb-4xs - 5px</div>
        <div class="-sf-pb-3xs">.-sf-pb-3xs - 10px</div>
        <div class="-sf-pb-2xs">.-sf-pb-2xs - 15px</div>
        <div class="-sf-pb-xs">.-sf-pb-xs - 20px</div>
        <div class="-sf-pb-s">.-sf-pb-s - 25px</div>
        <div class="-sf-pb-m">.-sf-pb-m - 30px</div>
        <div class="-sf-pb-l">.-sf-pb-l - 35px</div>
        <div class="-sf-pb-xl">.-sf-pb-xl - 40x</div>
        <div class="-sf-pb-2xl">.-sf-pb-2xl - 45px</div>
        <div class="-sf-pb-3xl">.-sf-pb-3xl  - 50px</div>
        <div class="-sf-pb-4xl">.-sf-pb-4xl - 55px</div>
        <div class="-sf-pb-5xl">.-sf-pb-5xl  - 60px</div>
        <div class="-sf-pb-6xl">.-sf-pb-6xl - 80px</div>
        <div class="-sf-pb-7xl">.-sf-pb-7xl  - 100px</div>
        <div class="-sf-pb-8xl">.-sf-pb-8xl  - 120px</div>

   Styleguide: Spacing.padding-bottom
   */
  /*
    Padding-left classes

    `-sf-pl-{zero,8xs,7xs,6xs,5xs,4xs,3xs,2xs,xs,s,m,l,xl,2xl,3xl,4xl,5xl,6xl,7xl,8xl, 9xl}`

        Markup:
        <div class="-sf-pl-zero">.-sf-pl-zero - 0</div>
        <div class="-sf-m-8xs">.-sf-pl-8xs - 1px</div>
        <div class="-sf-m-7xs">.-sf-pl-7xs - 2px</div>
        <div class="-sf-m-6xs">.-sf-pl-6xs - 3px</div>
        <div class="-sf-m-5xs">.-sf-pl-5xs - 4px</div>
        <div class="-sf-pl-4xs">.-sf-pl-4xs - 5px</div>
        <div class="-sf-pl-3xs">.-sf-pl-3xs - 10px</div>
        <div class="-sf-pl-2xs">.-sf-pl-2xs - 15px</div>
        <div class="-sf-pl-xs">.-sf-pl-xs - 20px</div>
        <div class="-sf-pl-s">.-sf-pl-s - 25px</div>
        <div class="-sf-pl-m">.-sf-pl-m - 30px</div>
        <div class="-sf-pl-l">.-sf-pl-l - 35px</div>
        <div class="-sf-pl-xl">.-sf-pl-xl - 40x</div>
        <div class="-sf-pl-2xl">.-sf-pl-2xl - 45px</div>
        <div class="-sf-pl-3xl">.-sf-pl-3xl  - 50px</div>
        <div class="-sf-pl-4xl">.-sf-pl-4xl - 55px</div>
        <div class="-sf-pl-5xl">.-sf-pl-5xl  - 60px</div>
        <div class="-sf-pl-6xl">.-sf-pl-6xl - 80px</div>
        <div class="-sf-pl-7xl">.-sf-pl-7xl  - 100px</div>
        <div class="-sf-pl-8xl">.-sf-pl-8xl  - 120px</div>

   Styleguide: Spacing.padding-left
   */
  /*
    Padding-right classes

    `-sf-pr-{zero,8xs,7xs,6xs,5xs,4xs,3xs,2xs,xs,s,m,l,xl,2xl,3xl,4xl,5xl,6xl,7xl,8xl, 9xl}`

        Markup:
        <div class="-sf-pr-zero">.-sf-pr-zero - 0</div>
        <div class="-sf-m-8xs">.-sf-pr-8xs - 1px</div>
        <div class="-sf-m-7xs">.-sf-pr-7xs - 2px</div>
        <div class="-sf-m-6xs">.-sf-pr-6xs - 3px</div>
        <div class="-sf-m-5xs">.-sf-pr-5xs - 4px</div>
        <div class="-sf-pr-4xs">.-sf-pr-4xs - 5px</div>
        <div class="-sf-pr-3xs">.-sf-pr-3xs - 10px</div>
        <div class="-sf-pr-2xs">.-sf-pr-2xs - 15px</div>
        <div class="-sf-pr-xs">.-sf-pr-xs - 20px</div>
        <div class="-sf-pr-s">.-sf-pr-s - 25px</div>
        <div class="-sf-pr-m">.-sf-pr-m - 30px</div>
        <div class="-sf-pr-l">.-sf-pr-l - 35px</div>
        <div class="-sf-pr-xl">.-sf-pr-xl - 40x</div>
        <div class="-sf-pr-2xl">.-sf-pr-2xl - 45px</div>
        <div class="-sf-pr-3xl">.-sf-pr-3xl  - 50px</div>
        <div class="-sf-pr-4xl">.-sf-pr-4xl - 55px</div>
        <div class="-sf-pr-5xl">.-sf-pr-5xl  - 60px</div>
        <div class="-sf-pr-6xl">.-sf-pr-6xl - 80px</div>
        <div class="-sf-pr-7xl">.-sf-pr-7xl  - 100px</div>
        <div class="-sf-pr-8xl">.-sf-pr-8xl  - 120px</div>

   Styleguide: Spacing.padding-right
   */
  /* Padding classes

   `-sf-p-{4xs,3xs,2xs,xs,s,m,l,xl,2xl,3xl,4xl,5xl,6xl,7xl,8xl, 9xl}`

       Markup:
       <div class="-sf-p-4xs">.-sf-p-4xs - 5px</div>
       <div class="-sf-p-3xs">.-sf-p-3xs - 10px</div>
       <div class="-sf-p-2xs">.-sf-p-2xs - 15px</div>
       <div class="-sf-p-xs">.-sf-p-xs - 20px</div>
       <div class="-sf-p-s">.-sf-p-s - 25px</div>
       <div class="-sf-p-m">.-sf-p-m - 30px</div>
       <div class="-sf-p-l">.-sf-p-l - 35px</div>
       <div class="-sf-p-xl">.-sf-p-xl - 40x</div>
       <div class="-sf-p-2xl">.-sf-p-2xl - 45px</div>
       <div class="-sf-p-3xl">.-sf-p-3xl  - 50px</div>
       <div class="-sf-p-4xl">.-sf-p-4xl - 55px</div>
       <div class="-sf-p-5xl">.-sf-p-5xl  - 60px</div>
       <div class="-sf-p-6xl">.-sf-p-6xl - 80px</div>
       <div class="-sf-p-7xl">.-sf-p-7xl  - 100px</div>
       <div class="-sf-p-8xl">.-sf-p-8xl  - 120px</div>

      Styleguide: Spacing.padding-classes
  */
  /*
    Border utility classes

    Border

    `-sf-border-top, -sf-border-bottom, -sf-border-lighter, -sf-border-lightest`

        Markup:
        <div class="-sf-border-top" style="margin-bottom: 20px;">.-sf-border-top</div>
        <div class="-sf-border-bottom" style="margin-bottom: 20px;">.-sf-border-bottom</div>
        <div class="-sf-border-left" style="margin-bottom: 20px;">.-sf-border-left</div>
        <div class="-sf-border-right" style="margin-bottom: 20px;">.-sf-border-right</div>
        <div class="-sf-border-bottom -sf-border-lighter" style="margin-bottom: 20px;">.-sf-border-lighter</div>
        <div class="-sf-border-bottom -sf-border-lightest">.-sf-border-lightest</div>

        Styleguide: Border.classes
   */
  /*
    Centered box

    `-sf-centered-box`

    Sets box's right and left margins to auto to center the box horizontally if it has width.

        Markup:
        <div style="width: 200px" class="-sf-centered-box">Centered box with fixed width</div>

        Styleguide: Center utility classes.centered
   */
  /*
    Centered horizontally and vertically box

    `-sf-centered-vertical-box` Sets box's right and left margins to auto to center the box horizontally if it has width and set it's display to flex and min-height to 100% of the view height.

        Markup:
        <div class="-sf-centered-vertical-box">Centered box with fixed width</div>

        Styleguide: Center utility classes.horizontally-vertically-centered
   */
  /*
    Expands element to 100% height of parent

    `-sf-full-height`

        Markup:
        <div style="height: 300px; width: 300px; border:1px solid #eee">
         <div class="-sf-full-height" style="background-color: #fefefe;">Grey child is as tall as parent</div>
        </div>

        Styleguide: Center utility classes.full-height
   */
  /*
    Cursor/Disabled utility classes

    Disabled link

    `-sf-disabled`

        Markup:
        <a class="-sf-disabled" href="https://www.progress.com/">Disabled link</a>

        Styleguide: Disabled.disabled
   */
  /*
    Element which looks clickable

    `-sf-clickable`

        Markup:
        <span class="-sf-clickable">Clickable element</span>

        Styleguide: Disabled.clickable
   */
  /*
    Element with cursor text

    `-sf-cursor-text`

        Markup:
        <span class="-sf-cursor-text">Cursor text</span>

        Styleguide: Disabled.cursor-text
   */
  /*
    Element that cannot be selected

    `-sf-user-select-none`

        Markup:
        <span class="-sf-user-select-none">User selection none</span>

        Styleguide: Disabled.user-select-none
   */
  /*
    Text utility classes

    Hint, dimmed, success, failure

   `.-sf-txt-hint, .-sf-txt-dimmed, .-sf-txt-success, .-sf-txt-failure`

        Markup:
        <div class="-sf-txt-hint">Hint: Pellentesque luctus, erat sed elementum aliquam, libero nibh aliquam lacus, sollicitudin accumsan justo nibh eu nisi.</div>
        <div class="-sf-txt-dimmed">Dimmed: Pellentesque luctus, erat sed elementum aliquam, libero nibh aliquam lacus, sollicitudin accumsan justo nibh eu nisi.</div>
        <div class="-sf-txt-success">Success: Pellentesque luctus, erat sed elementum aliquam, libero nibh aliquam lacus, sollicitudin accumsan justo nibh eu nisi.</div>
        <div class="-sf-txt-failure">Failure: Pellentesque luctus, erat sed elementum aliquam, libero nibh aliquam lacus, sollicitudin accumsan justo nibh eu nisi.</div>

        Styleguide: Text.utility
   */
  /*
    Text align

   `.-sf-txt-align-left, -sf-txt-align-right, -sf-txt-align-center`

        Markup:
        <div class="-sf-txt-align-left">Pellentesque luctus, erat sed elementum aliquam.</div>
        <div class="-sf-txt-align-right">Pellentesque luctus, erat sed elementum aliquam.</div>
        <div class="-sf-txt-align-center">Pellentesque luctus, erat sed elementum aliquam.</div>

      Styleguide: Text.align
   */
  /*
    Vertical align middle

   `.-sf-txt-vertical-align-middle`

        Markup:
        <div class="-sf-txt-vertical-align-middle">Pellentesque luctus, erat sed elementum aliquam.</div>

        Styleguide: Text.txt-vertical-align-middle
   */
  /*
    Text transform

   `.-sf-txt-nowrap, -sf-txt-lower-case, -sf-txt-upper-case`

        Markup:
        <div class="-sf-txt-nowrap">Pellentesque luctus, erat sed elementum aliquam, libero nibh aliquam lacus, sollicitudin accumsan justo nibh eu nisi. Pellentesque luctus, erat sed elementum aliquam, libero nibh aliquam lacus, sollicitudin accumsan justo nibh eu nisi.</div>
        <div class="-sf-txt-lower-case">Pellentesque luctus, erat sed elementum aliquam.</div>
        <div class="-sf-txt-upper-case">Pellentesque luctus, erat sed elementum aliquam.</div>

        Styleguide: Text.transform
   */
  /*
    Overflow hidden

    `-sf-overflow-hidden`

        Markup:
        <p class="-sf-overflow-hidden" style="width: 500px; ">Loremipsumdolorsitamet,consecteturadipiscingelit.Seddapibustemporjustononullamcorper.Phasellusullamcorpernislorci,idfringillaexegestasin.Pellentesquetortorurna,feugiatutnunclaoreet,imperdietsollicitudinneque.Duisbibendumnonauguequisullamcorper.Quisqueeunibhegetestdignissimpharetra.Sedeupulvinarelit,quismalesuadaleo.Duisvitaevariusligula.Sedsitametpulvinardiam.VestibulumanteipsumprimisinfaucibusorciluctusetultricesposuerecubiliaCurae;Namutiaculisdui.Aeneanefficitur,tortorveldictumauctor,nibhtortorcondimentumnunc,noncursusnisinuncsedest.Utfringillamaurisacnislbibendum,velsagittisquamfacilisis.Vestibulumsagittisnonligulanonsollicitudin.</p>

        Styleguide: Text.overflow-hidden
   */
  /*
    Overflow auto

    `-sf-overflow-auto`

        Markup:
        <p class="-sf-overflow-auto" style="width: 500px; ">Loremipsumdolorsitamet,consecteturadipiscingelit.Seddapibustemporjustononullamcorper.Phasellusullamcorpernislorci,idfringillaexegestasin.Pellentesquetortorurna,feugiatutnunclaoreet,imperdietsollicitudinneque.Duisbibendumnonauguequisullamcorper.Quisqueeunibhegetestdignissimpharetra.Sedeupulvinarelit,quismalesuadaleo.Duisvitaevariusligula.Sedsitametpulvinardiam.VestibulumanteipsumprimisinfaucibusorciluctusetultricesposuerecubiliaCurae;Namutiaculisdui.Aeneanefficitur,tortorveldictumauctor,nibhtortorcondimentumnunc,noncursusnisinuncsedest.Utfringillamaurisacnislbibendum,velsagittisquamfacilisis.Vestibulumsagittisnonligulanonsollicitudin.</p>

        Styleguide: Text.overflow-auto
   */
  /*
    Overflow ellipsis

    `-sf-overflow-ellipsis`

        Markup:
        <p class="-sf-overflow-ellipsis" style="width: 500px; ">Loremipsumdolorsitamet,consecteturadipiscingelit.Seddapibustemporjustononullamcorper.Phasellusullamcorpernislorci,idfringillaexegestasin.Pellentesquetortorurna,feugiatutnunclaoreet,imperdietsollicitudinneque.Duisbibendumnonauguequisullamcorper.Quisqueeunibhegetestdignissimpharetra.Sedeupulvinarelit,quismalesuadaleo.Duisvitaevariusligula.Sedsitametpulvinardiam.VestibulumanteipsumprimisinfaucibusorciluctusetultricesposuerecubiliaCurae;Namutiaculisdui.Aeneanefficitur,tortorveldictumauctor,nibhtortorcondimentumnunc,noncursusnisinuncsedest.Utfringillamaurisacnislbibendum,velsagittisquamfacilisis.Vestibulumsagittisnonligulanonsollicitudin.</p>

        Styleguide: Text.overflow-ellipsis
   */
  /*
    Overflow ellipsis on the second line

    `-sf-overflow-multiline-ellipsis`

        Markup:
        <p class="-sf-overflow-multiline-ellipsis" style="width: 500px; ">Loremipsumdolorsitamet,consecteturadipiscingelit.Seddapibustemporjustononullamcorper.Phasellusullamcorpernislorci,idfringillaexegestasin.Pellentesquetortorurna,feugiatutnunclaoreet,imperdietsollicitudinneque.Duisbibendumnonauguequisullamcorper.Quisqueeunibhegetestdignissimpharetra.Sedeupulvinarelit,quismalesuadaleo.Duisvitaevariusligula.Sedsitametpulvinardiam.VestibulumanteipsumprimisinfaucibusorciluctusetultricesposuerecubiliaCurae;Namutiaculisdui.Aeneanefficitur,tortorveldictumauctor,nibhtortorcondimentumnunc,noncursusnisinuncsedest.Utfringillamaurisacnislbibendum,velsagittisquamfacilisis.Vestibulumsagittisnonligulanonsollicitudin.</p>

        Styleguide: Text.overflow-multiline-ellipsis
   */
  /*
    Word break

    `-sf-word-break-all`

        Markup:
        <p class="-sf-word-break-all" style="width: 500px; ">Loremipsumdolorsitamet,consecteturadipiscingelit.Seddapibustemporjustononullamcorper.Phasellusullamcorpernislorci,idfringillaexegestasin.Pellentesquetortorurna,feugiatutnunclaoreet,imperdietsollicitudinneque.Duisbibendumnonauguequisullamcorper.Quisqueeunibhegetestdignissimpharetra.Sedeupulvinarelit,quismalesuadaleo.Duisvitaevariusligula.Sedsitametpulvinardiam.VestibulumanteipsumprimisinfaucibusorciluctusetultricesposuerecubiliaCurae;Namutiaculisdui.Aeneanefficitur,tortorveldictumauctor,nibhtortorcondimentumnunc,noncursusnisinuncsedest.Utfringillamaurisacnislbibendum,velsagittisquamfacilisis.Vestibulumsagittisnonligulanonsollicitudin.</p>

     Styleguide: Text.word-break-all
   */
  /*
    Word break

    `-sf-word-break-word`

        Markup:
        <p class="-sf-word-break-word" style="width: 500px; ">Loremipsumdolorsitamet,consecteturadipiscingelit.Seddapibustemporjustononullamcorper.Phasellusullamcorpernislorci,idfringillaexegestasin.Pellentesquetortorurna,feugiatutnunclaoreet,imperdietsollicitudinneque.Duisbibendumnonauguequisullamcorper.Quisqueeunibhegetestdignissimpharetra.Sedeupulvinarelit,quismalesuadaleo.Duisvitaevariusligula.Sedsitametpulvinardiam.VestibulumanteipsumprimisinfaucibusorciluctusetultricesposuerecubiliaCurae;Namutiaculisdui.Aeneanefficitur,tortorveldictumauctor,nibhtortorcondimentumnunc,noncursusnisinuncsedest.Utfringillamaurisacnislbibendum,velsagittisquamfacilisis.Vestibulumsagittisnonligulanonsollicitudin.</p>

        Styleguide: Text.word-break-word
   */
  /*
    Text direction

    `-sf-direction-rtl, -sf-direction-ltr`

        Markup:
        <p class="-sf-direction-rtl">Loremipsumdolorsitamet, consecteturadipiscingelit. Seddapibustemporjustononullamcorper. Phasellusullamcorpernislorci, idfringillaexegestasin. Pellentesquetortorurna, feugiatutnunclaoreet, imperdietsollicitudinneque.</p>
        <p class="-sf-direction-ltr">Loremipsumdolorsitamet, consecteturadipiscingelit. Seddapibustemporjustononullamcorper. Phasellusullamcorpernislorci, idfringillaexegestasin. Pellentesquetortorurna, feugiatutnunclaoreet, imperdietsollicitudinneque.</p>

        Styleguide: Text.direction
   */
  /*
    Large text

   `.-sf-txt-large`

        Markup:
        <div class="-sf-txt-large">Pellentesque luctus, erat sed elementum aliquam, libero nibh aliquam lacus, sollicitudin accumsan justo nibh eu nisi.</div>

        Styleguide: Text.txt-large
   */
  /*
    Small text

   `.-sf-txt-small`

        Markup:
        <div class="-sf-txt-small">Pellentesque luctus, erat sed elementum aliquam, libero nibh aliquam lacus, sollicitudin accumsan justo nibh eu nisi.</div>

        Styleguide: Text.txt-small
   */
  /*
    Base text

   `.-sf-txt-base`

        Markup:
        <div class="-sf-txt-base">Pellentesque luctus, erat sed elementum aliquam, libero nibh aliquam lacus, sollicitudin accumsan justo nibh eu nisi.</div>

        Styleguide: Text.txt-base
   */
  /*
    Visibility utility classes

    Hide classes

    `-sf-hidden, -sf-invisible, -sf-transparent`

        Markup:
        <div class="-sf-hidden">.-sf-hidden</div>
        <div class="-sf-invisible">.-sf-invisible</div>
        <div class="-sf-transparent">.-sf-transparent</div>

        Styleguide: Visibility.hide
   */
  /*
    Visually hidden but accessible to screen readers

    `-sf-visually-hidden`

        Markup:
        <div class="-sf-visually-hidden">This text is visually hidden but accessible to screen readers</div>

        Styleguide: Visibility.visually-hidden
   */
  /*
   Image fit cover

   `-sf-img-fit-cover`

       Markup:
       <div style="width: 200px; height: 300px"><img src="/assets/svg_new_user_interface.svg"  alt="" class="-sf-img-fit-cover"></div>

        Styleguide: Visibility.img-fit-cover
   */
  /*
    Positions

    `-sf-absolute, -sf-relative`

        Markup:
        <div class="-sf-absolute">Absolute position</div>
        <div class="-sf-relative">Relative position</div>
        <div class="-sf-static">Static position</div>

        Styleguide: Visibility.positions
   */
  /*
    Rotate

    `-sf-rotate-90, sf-rotate--90, sf-rotate-180`

        Markup:
        <div class="-sf-rotate-90">Rotate 90deg</div>
        <div class="-sf-rotate--90">Rotate -90deg</div>
        <div class="-sf-rotate-180">Rotate 180deg</div>

        Styleguide: Visibility.rotate
   */
  /* Min width */
  /*
    Width utility classes

    Width classes

    `.-sf-width-{1,2,...,12}, .-sf-width-form-{small, medium, large}`

        Markup:
        <div class="-sf-width-1" style="background-color: #83e3ff;">.-sf-width-1 ~8%</div>
        <div class="-sf-width-2" style="background-color: #83e3ff;">.-sf-width-2 ~16%</div>
        <div class="-sf-width-3" style="background-color: #83e3ff;">.-sf-width-3 25%</div>
        <div class="-sf-width-4" style="background-color: #83e3ff;">.-sf-width-4 ~33%</div>
        <div class="-sf-width-5" style="background-color: #83e3ff;">.-sf-width-5 ~41%</div>
        <div class="-sf-width-6" style="background-color: #83e3ff;">.-sf-width-6 50%</div>
        <div class="-sf-width-7" style="background-color: #83e3ff;">.-sf-width-7 ~58%</div>
        <div class="-sf-width-8" style="background-color: #83e3ff;">.-sf-width-8 ~66%</div>
        <div class="-sf-width-9" style="background-color: #83e3ff;">.-sf-width-9 75%</div>
        <div class="-sf-width-10" style="background-color: #83e3ff;">.-sf-width-10 ~83%</div>
        <div class="-sf-width-11" style="background-color: #83e3ff;">.-sf-width-11 ~91%</div>
        <div class="-sf-width-12" style="background-color: #83e3ff;">.-sf-width-12 100%</div>
        <div class="-sf-width-12" style="background-color: #83e3ff;">.-sf-width-form-small 410px}</div>
        <div class="-sf-width-12" style="background-color: #83e3ff;">.-sf-width-form-medium var(--form-width-medium)}</div>
        <div class="-sf-width-12" style="background-color: #83e3ff;">.-sf-width-form-large 1000px}</div>

         Styleguide: Width.classes
   */
  /*
    Typography

    Headings

        Markup:
        <h1 class="-sf-h-large">H1 List Page Title</h1>
        <h1>H1 Detail Page Title</h1>
        <h2>H2 Group Title</h2>
        <h3>H3 Item Title</h3>
        <h4 class="-sf-h-large">H4 Form Label</h4>
        <h4>H4 Regular Label</h4>
        <h5>H5 Small Labels</h5>

        Styleguide: Typography.headings
   */
  /*
   Heading CSS Classes

       Markup:
       <div class="h1 -sf-h-large">H1 List Page Title</div>
       <div class="h1">H1 Detail Page Title</div>
       <div class="h2">H2 Group Title</div>
       <div class="h3">H3 Item Title</div>
       <div class="h4 -sf-h-large">H4 Form Label</div>
       <div class="h4">H4 Regular Label</div>
       <div class="h5">H5 Small Labels</div>

       Styleguide: Typography.headings-classes
   */
  /*
   Paragraph

       Markup:
       <p><a href="#">Lorem ipsum dolor sit amet</a>, consectetur adipiscing elit. <a class="-secondary">Pellentesque luctus</a>, erat sed elementum aliquam, libero nibh aliquam lacus, sollicitudin accumsan justo nibh eu nisi. Donec faucibus commodo lacus, quis laoreet nulla. Ut et neque quis tortor dapibus consequat. Nulla iaculis id sem eget ullamcorper. In ac euismod nunc. Fusce at tortor viverra, maximus quam quis, interdum velit. Mauris varius risus ut ante porttitor tempor.</p>

       Styleguide: Typography.Paragraph
  */
  /*
    Default Breadcrumb

    .sf-breadcrumb

    Markup:
    <div class="sf-breadcrumb">Earth > Europe > Bulgaria > Sofia > Mladost</div>
    <div class="sf-breadcrumb -sf-overflow-ellipsis" style="width: 150px; ">Earth > Europe > Bulgaria > Sofia > Mladost</div>

    Styleguide: Breadcrumb.default
   */
  /*
    Default Tabstrip

    `.sf-tabs`

        Markup:
        <div class="sf-tabs">
             <a class="sf-tabs__item">Recent</a>
             <a class="sf-tabs__item -selected">Libraries</a>
             <a class="sf-tabs__item">Selected <span class="sf-tabs__badge sf-badge">0</span></a>
        </div>

        Styleguide: Tabstrip.default
   */
  /*
    Large

    `.sf-tabs.-large`

        Markup:
        <div class="sf-tabs -large">
             <a class="sf-tabs__item">Recent</a>
             <a class="sf-tabs__item -selected">Libraries</a>
             <a class="sf-tabs__item">Selected <span class="sf-tabs__badge sf-badge -positive">4</span></a>
        </div>

        Styleguide: Tabstrip.large
   */
  /*
    Icons with text

    `.sf-icon`

        Markup:
        <i class="sf-fa sf-fa-sliders sf-icon"></i><span>Settings</span><br />
        <i class="sf-fa sf-fa-question-circle sf-icon"></i><span>Help</span><br />
        <i class="sf-fa sf-fa-folder-o sf-icon"></i><span>Folder</span><br />
        <i class="sf-fa sf-fa-exclamation-circle sf-icon -exclamation"></i><br />

       Styleguide: Icon.text
   */
  /*
    Close icon

    `.sf-icon.-close`

        Markup:
        <i class="sf-icon -close"></i>

        Styleguide: Icon.close
   */
  /*
   Illustrative icons

   `.sf-icon.-illustrative`

       Markup:
       <i class="sf-fa sf-fa-check-square-o sf-icon -illustrative"></i>
       <i class="sf-fa sf-fa-user sf-icon -illustrative -size-3xl"></i>

       Styleguide: Icon.illustrative
  */
  /*
   Colors

   `.sf-icon.-{light, lighter, black, white, color-inherit}`

       Markup:
       <i class="sf-fa sf-fa-folder-o sf-icon -light -size-xl"></i>
       <i class="sf-fa sf-fa-ellipsis-v sf-icon -light"></i>
       <i class="sf-fa sf-fa-ellipsis-v sf-icon -light -size-xs"></i>
       <br />
       <i class="sf-fa sf-fa-folder-o sf-icon -lighter -size-xl"></i>
       <i class="sf-fa sf-fa-ellipsis-v sf-icon -lighter"></i>
       <i class="sf-fa sf-fa-ellipsis-v sf-icon -lighter -size-xs"></i>
       <br />
       <i class="sf-fa sf-fa-folder-o sf-icon -black -size-xl"></i>
       <i class="sf-fa sf-fa-ellipsis-v sf-icon -black"></i>
       <i class="sf-fa sf-fa-ellipsis-v sf-icon -black -size-xs"></i>
       <div style="background-color: grey; color: pink; padding: 5px; max-width: 150px;">
       <i class="sf-fa sf-fa-folder-o sf-icon -white -size-xl"></i>
       <i class="sf-fa sf-fa-ellipsis-v sf-icon -white"></i>
       <i class="sf-fa sf-fa-ellipsis-v sf-icon -white -size-xs"></i>
       <br />
       <i class="sf-fa sf-fa-folder-o sf-icon -color-inherit -size-xl"></i>
       <i class="sf-fa sf-fa-ellipsis-v sf-icon -color-inherit"></i>
       <i class="sf-fa sf-fa-ellipsis-v sf-icon -color-inherit -size-xs"></i>
       </div>

       Styleguide: Icon.colors
  */
  /*
   Icon sizes

   `.sf-icon.-size-{7xs, 4xs, 3xs, 2xs, xs, s, m, l, xl, 2xl, 3xl, 4xl, 5xl}`

       Markup:
       <i class="sf-fa sf-fa-ellipsis-v sf-icon -size-7xs"></i>-size-7xs — 5px<br />
       <i class="sf-fa sf-fa-ellipsis-v sf-icon -size-4xs"></i>-size-4xs — 11px<br />
       <i class="sf-fa sf-fa-ellipsis-v sf-icon -size-3xs"></i>-size-3xs — 12px<br />
       <i class="sf-fa sf-fa-ellipsis-v sf-icon -size-2xs"></i>-size-2xs — 13px<br />
       <i class="sf-fa sf-fa-ellipsis-v sf-icon -size-xs"></i>-size-xs — 14px<br />
       <i class="sf-fa sf-fa-ellipsis-v sf-icon -size-s"></i>-size-s — 16px<br />
       <i class="sf-fa sf-fa-ellipsis-v sf-icon -size-m"></i>-size-m — 18px<br />
       <i class="sf-fa sf-fa-ellipsis-v sf-icon -size-l"></i>-size-l — 20px<br />
       <i class="sf-fa sf-fa-ellipsis-v sf-icon -size-xl"></i>-size-xl — 22px<br />
       <i class="sf-fa sf-fa-ellipsis-v sf-icon -size-2xl"></i>-size-2xl — 28px<br />
       <i class="sf-fa sf-fa-ellipsis-v sf-icon -size-3xl"></i>-size-3xl — 36px<br />
       <i class="sf-fa sf-fa-ellipsis-v sf-icon -size-4xl"></i>-size-4xl — 48px<br />
       <i class="sf-fa sf-fa-ellipsis-v sf-icon -size-5xl"></i>-size-5xl — 60px<br />

       Styleguide: Icon.sizes
   */
  /*
   Stacked icons

   `.sf-stack {.sf-stack__in,.sf-stack__out}`

       Markup:
       <div class="sf-icon-stack">
         <i class="sf-icon-stack__in sf-fa sf-fa-info sf-icon -size-3xs -white"></i>
         <i class="sf-icon-stack__out sf-fa sf-fa-circle sf-icon -size-l -black"></i>
       </div>
       <div class="sf-icon-stack">
         <i class="sf-icon-stack__in sf-fa sf-fa-check sf-icon -size-2xs -light"></i>
         <i class="sf-icon-stack__in sf-fa sf-fa-circle sf-icon -size-xl -black"></i>
         <i class="sf-icon-stack__out sf-fa sf-fa-circle sf-icon -size-2xl -light"></i>
       </div>

        Styleguide: Icon.stacked
  */
  /*
    Text

    `.sf-status__text`

        Markup:
        <p class="sf-status__text">Published</p>

        Styleguide: Status.text
   */
  /*
    Icon

    `.status__icon.-{published, locked, unpublished, rejectedforpublishing, rejected, scheduled, draft, draftnewer, dimmed, for-translation, for-published, for-restricted, for-scheduled, for-draft}`

        Markup:
        <i class="sf-status__icon"></i> Default<br /><br />
        <i class="sf-status__icon -published"></i> Published<br /><br />
        <i class="sf-status__icon -locked"></i> Locked<br /><br />
        <i class="sf-status__icon -unpublished"></i> Unpublished<br /><br />
        <i class="sf-status__icon -rejectedforpublishing"></i> Rejected for publishing<br /><br />
        <i class="sf-status__icon -rejected"></i> Rejected<br /><br />
        <i class="sf-status__icon -scheduled"></i> Scheduled<br /><br />
        <i class="sf-status__icon -draft"></i> Draft<br /><br />
        <i class="sf-status__icon -draftnewer"></i> Draft newer than published<br /><br />
        <i class="sf-status__icon -published -dimmed"></i> Published Dimmed — used to dim the status of not translated items<br /><br />
        <i class="sf-status__icon -for-translation"></i> For traslation<br /><br />
        <i class="sf-status__icon -for-published sf-fa-bell-o"></i> Custom status icon with color of Published<br /><br />
        <i class="sf-status__icon -for-restricted sf-fa-bullhorn"></i> Custom status icon with color of Rejected<br /><br />
        <i class="sf-status__icon -for-unpublished sf-fa-envelope-o"></i> Custom status icon with color of Unpublished<br /><br />
        <i class="sf-status__icon -for-scheduled sf-fa-eye"></i> Custom status with color of Scheduled<br /><br />
        <i class="sf-status__icon -for-draft sf-fa-star-o"></i> Custom status with color of Draft<br />

   Styleguide: Status.Icon
   */
  /*
    Button
   */
  /*
   Default Button

   `.sf-button`

       Markup:
       <button class="sf-button">Default Button</button>
       <button class="sf-button" disabled>Disabled Default Button</button>
       <a class="sf-button">Default Button</a>
       <a class="sf-button -disabled">Disabled Default Button</a>

      Styleguide: Button.default
   */
  /*
   large Button

   `.sf-button.-large`

       Markup:
       <button class="sf-button -large">large Default Button</button>
       <button class="sf-button -large" disabled>Disabled large Default Button</button>

     Styleguide: Button.large
  */
  /*
   small Button

   `.sf-button.-small`

       Markup:
       <button class="sf-button -small">small Default Button</button>
       <button class="sf-button -small" disabled>Disabled small Default Button</button>

     Styleguide: Button.small
  */
  /*
   sidebar-tree Button

   `.sf-button.-sidebar-tree`

       Markup:
       <button class="sf-button -sidebar-tree">sidebar-tree Default Button</button>
       <button class="sf-button -sidebar-tree" disabled>Disabled sidebar-tree Default Button</button>

    Styleguide: Button.sidebar-tree
  */
  /*
   sidebar-tree large Button

   `.sf-button.-large.-sidebar-tree`

       Markup:
       <button class="sf-button -sidebar-tree -large">sidebar-tree large Default Button</button>
       <button class="sf-button -sidebar-tree -large" disabled>Disabled sidebar-tree large Default Button</button>

       Styleguide: Button.sidebar-tree-large
  */
  /*
   sidebar-tree small Button

   `.sf-button.-small.-sidebar-tree`

       Markup:
       <button class="sf-button -sidebar-tree -small">sidebar-tree small Default Button</button>
       <button class="sf-button -sidebar-tree -small" disabled>Disabled sidebar-tree small Default Button</button>

       Styleguide: Button.sidebar-tree-small
  */
  /*
   sidebar-tree-invert Button

   `.sf-button.-sidebar-tree-invert`

       Markup:
       <button class="sf-button -sidebar-tree-invert">sidebar-tree-invert Default Button</button>
       <button class="sf-button -sidebar-tree-invert" disabled>Disabled sidebar-tree-invert Default Button</button>

    Styleguide: Button.sidebar-tree-invert
  */
  /*
   sidebar-tree-invert large Button

   `.sf-button.-large.-sidebar-tree-invert`

       Markup:
       <button class="sf-button -sidebar-tree-invert -large">sidebar-tree-invert large Default Button</button>
       <button class="sf-button -sidebar-tree-invert -large" disabled>Disabled sidebar-tree-invert large Default Button</button>

       Styleguide: Button.sidebar-tree-invert-large
  */
  /*
   sidebar-tree-invert small Button

   `.sf-button.-small.-sidebar-tree-invert`

       Markup:
       <button class="sf-button -sidebar-tree-invert -small">sidebar-tree-invert small Default Button</button>
       <button class="sf-button -sidebar-tree-invert -small" disabled>Disabled sidebar-tree-invert small Default Button</button>

       Styleguide: Button.sidebar-tree-invert-small
  */
  /*
   action Button

   `.sf-button.-action`

       Markup:
       <button class="sf-button -action">action Default Button</button>
       <button class="sf-button -action" disabled>Disabled action Default Button</button>

    Styleguide: Button.action
  */
  /*
   action large Button

   `.sf-button.-large.-action`

       Markup:
       <button class="sf-button -action -large">action large Default Button</button>
       <button class="sf-button -action -large" disabled>Disabled action large Default Button</button>

       Styleguide: Button.action-large
  */
  /*
   action small Button

   `.sf-button.-small.-action`

       Markup:
       <button class="sf-button -action -small">action small Default Button</button>
       <button class="sf-button -action -small" disabled>Disabled action small Default Button</button>

       Styleguide: Button.action-small
  */
  /*
   delete Button

   `.sf-button.-delete`

       Markup:
       <button class="sf-button -delete">delete Default Button</button>
       <button class="sf-button -delete" disabled>Disabled delete Default Button</button>

    Styleguide: Button.delete
  */
  /*
   delete large Button

   `.sf-button.-large.-delete`

       Markup:
       <button class="sf-button -delete -large">delete large Default Button</button>
       <button class="sf-button -delete -large" disabled>Disabled delete large Default Button</button>

       Styleguide: Button.delete-large
  */
  /*
   delete small Button

   `.sf-button.-small.-delete`

       Markup:
       <button class="sf-button -delete -small">delete small Default Button</button>
       <button class="sf-button -delete -small" disabled>Disabled delete small Default Button</button>

       Styleguide: Button.delete-small
  */
  /*
   link Button

   `.sf-button.-link`

       Markup:
       <button class="sf-button -link">link Default Button</button>
       <button class="sf-button -link" disabled>Disabled link Default Button</button>

    Styleguide: Button.link
  */
  /*
   link large Button

   `.sf-button.-large.-link`

       Markup:
       <button class="sf-button -link -large">link large Default Button</button>
       <button class="sf-button -link -large" disabled>Disabled link large Default Button</button>

       Styleguide: Button.link-large
  */
  /*
   link small Button

   `.sf-button.-small.-link`

       Markup:
       <button class="sf-button -link -small">link small Default Button</button>
       <button class="sf-button -link -small" disabled>Disabled link small Default Button</button>

       Styleguide: Button.link-small
  */
  /*
   invert Button

   `.sf-button.-invert`

       Markup:
       <button class="sf-button -invert">invert Default Button</button>
       <button class="sf-button -invert" disabled>Disabled invert Default Button</button>

    Styleguide: Button.invert
  */
  /*
   invert large Button

   `.sf-button.-large.-invert`

       Markup:
       <button class="sf-button -invert -large">invert large Default Button</button>
       <button class="sf-button -invert -large" disabled>Disabled invert large Default Button</button>

       Styleguide: Button.invert-large
  */
  /*
   invert small Button

   `.sf-button.-small.-invert`

       Markup:
       <button class="sf-button -invert -small">invert small Default Button</button>
       <button class="sf-button -invert -small" disabled>Disabled invert small Default Button</button>

       Styleguide: Button.invert-small
  */
  /*
   invert-border-primary Button

   `.sf-button.-invert-border-primary`

       Markup:
       <button class="sf-button -invert-border-primary">invert-border-primary Default Button</button>
       <button class="sf-button -invert-border-primary" disabled>Disabled invert-border-primary Default Button</button>

    Styleguide: Button.invert-border-primary
  */
  /*
   invert-border-primary large Button

   `.sf-button.-large.-invert-border-primary`

       Markup:
       <button class="sf-button -invert-border-primary -large">invert-border-primary large Default Button</button>
       <button class="sf-button -invert-border-primary -large" disabled>Disabled invert-border-primary large Default Button</button>

       Styleguide: Button.invert-border-primary-large
  */
  /*
   invert-border-primary small Button

   `.sf-button.-small.-invert-border-primary`

       Markup:
       <button class="sf-button -invert-border-primary -small">invert-border-primary small Default Button</button>
       <button class="sf-button -invert-border-primary -small" disabled>Disabled invert-border-primary small Default Button</button>

       Styleguide: Button.invert-border-primary-small
  */
  /*
   Button with Feedback Icon

   `.sf-button.-feedback`

       Markup:
       <button class="sf-button -feedback"><div class="sf-button__content">Feedback Button</div><i class="sf-button__icon sf-fa sf-fa-check sf-icon"></i></button>
       <button class="sf-button -feedback -done"><div class="sf-button__content">Feedback Button</div><i class="sf-button__icon sf-fa sf-fa-check sf-icon"></i></button>

  Styleguide: Button.feedback-icon
  */
  /*
   Button with Loader

      Markup:
      <button class="sf-button -loader -inprogress">
          <div class="sf-loader -color">
              <div class="sf-loader__content">
                   <div class="sf-loader__rect -first"></div>
                   <div class="sf-loader__rect -second"></div>
                   <div class="sf-loader__rect -third"></div>
              </div>
          </div>
          <span class="sf-button__content">Button</span>
      </button>
      <button class="sf-button -loader -action -inprogress">
          <div class="sf-loader -transparent">
              <div class="sf-loader__content">
                   <div class="sf-loader__rect -first"></div>
                   <div class="sf-loader__rect -second"></div>
                   <div class="sf-loader__rect -third"></div>
              </div>
          </div>
          <span class="sf-button__content">Button</span>
      </button>

   */
  /*
   Dropdown button

   `.sf-button`

       Markup:
       <div style="height: 150px; padding-left: 160px;">
           <button type="button" class="sf-button -icon -dropdown -dropped">
               <i class="sf-button__icon sf-icon sf-fa sf-fa-ellipsis-h -size-m" title="Actions"></i>
               <div class="sf-button__dropdown">
                   <div class="sf-dropdown">
                        <div class="sf-dropdown__heading">
                           Edit
                        </div>
                        <div class="sf-dropdown__item -active">
                           Default News
                        </div>
                        <div class="sf-dropdown__item">
                            News items<span class="sf-dropdown__counter -positive">14</span>
                        </div>
                        <div class="sf-dropdown__separator">
                        </div>
                        <div class="sf-dropdown__item -sf-txt-failure">
                            Delete
                        </div>
                   </div>
              </div>
           </button>
       </div>

   Styleguide: Button.loader
   */
  /*
   Dropdown button without border

   `.sf-button.-no-border`

       Markup:
       <div style="height: 150px; padding-left: 160px;">
           <button type="button" class="sf-button -no-border -icon -dropdown -dropped">
               <i class="sf-button__icon sf-icon sf-fa sf-fa-ellipsis-h -size-m" title="Actions"></i>
               <div class="sf-button__dropdown">
                   <div class="sf-dropdown">
                        <div class="sf-dropdown__heading">
                           Edit
                        </div>
                        <div class="sf-dropdown__item -active">
                           Default News
                        </div>
                        <div class="sf-dropdown__item">
                           test News
                        </div>
                        <div class="sf-dropdown__separator">
                        </div>
                        <div class="sf-dropdown__item -sf-txt-failure">
                            Delete
                        </div>
                   </div>
              </div>
           </button>
       </div>

   Styleguide: Button.dropdown
   */
  /*
   Dropdown button with icon and text

       Markup:
       <div style="height: 120px;">
           <a class="sf-button -no-border -left -icon -dropdown -dropped">
               <span>Default News</span>
               <i class="sf-button__icon sf-icon sf-fa sf-fa-caret-down -size-xs"></i>
               <div class="sf-button__dropdown">
                   <div class="sf-dropdown">
                        <div class="sf-dropdown__item -active">
                           Default News
                        </div>
                        <div class="sf-dropdown__item">
                           test News
                        </div>
                   </div>
              </div>
           </a>
       </div>

   Styleguide: Button.dropdown-with-icon-text
   */
  /*
   Dropdown as color picker

   Markup:
   <a class="sf-button -large -left -angled -sf-pr-5xs -no-hover -icon -dropdown -dropped" aria-expanded="true" aria-haspopup="true" role="listbox" tabindex="0" >
      <span class="sf-button__content">
          <i class="sf-badge -sf-m-4xs -size-l -square" style="background-color: rgb(220, 236, 245);"></i>
      </span>
      <i class="sf-button__icon sf-icon sf-fa sf-fa-caret-down -size-m"></i>
      <div class="sf-button__dropdown">
          <div class="sf-dropdown -narrow" >
              <div class="sf-color-palette" style="grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;">
                  <div class="sf-color-palette__item" style="background-color: rgb(255, 173, 173);"></div>
                  <div class="sf-color-palette__item" style="background-color: rgb(255, 164, 225);"></div>
                  <div class="sf-color-palette__item" style="background-color: rgb(245, 154, 255);"></div>
                  <div class="sf-color-palette__item" style="background-color: rgb(139, 244, 255);"></div>
                  <div class="sf-color-palette__item" style="background-color: rgb(146, 255, 251);"></div>
                  <div class="sf-color-palette__item" style="background-color: rgb(158, 255, 201);"></div>
                  <div class="sf-color-palette__item" style="background-color: rgb(255, 255, 174);"></div>
                  <div class="sf-color-palette__item" style="background-color: rgb(255, 235, 141);"></div>
                  <div class="sf-color-palette__item" style="background-color: rgb(228, 207, 197);"></div>
                  <div class="sf-color-palette__item" style="background-color: rgb(220, 236, 245);"></div>
                  <div class="sf-color-palette__item" style="background-color: rgb(255, 122, 123);"></div>
                  <div class="sf-color-palette__item" style="background-color: rgb(255, 113, 173);"></div>
                  <div class="sf-color-palette__item" style="background-color: rgb(194, 103, 220);"></div>
                  <div class="sf-color-palette__item" style="background-color: rgb(87, 193, 255);"></div>
                  <div class="sf-color-palette__item" style="background-color: rgb(95, 208, 200);"></div>
                  <div class="sf-color-palette__item" style="background-color: rgb(107, 222, 150);"></div>
                  <div class="sf-color-palette__item" style="background-color: rgb(255, 255, 123);"></div>
                  <div class="sf-color-palette__item" style="background-color: rgb(255, 184, 90);"></div>
                  <div class="sf-color-palette__item" style="background-color: rgb(177, 157, 146);"></div>
                  <div class="sf-color-palette__item" style="background-color: rgb(169, 185, 194);"></div>
                  <div class="sf-color-palette__item" style="background-color: rgb(255, 72, 72);"></div>
                  <div class="sf-color-palette__item" style="background-color: rgb(220, 62, 123);"></div>
                  <div class="sf-color-palette__item" style="background-color: rgb(143, 52, 169);"></div>
                  <div class="sf-color-palette__item" style="background-color: rgb(35, 142, 252);"></div>
                  <div class="sf-color-palette__item" style="background-color: rgb(44, 157, 149);"></div>
                  <div class="sf-color-palette__item" style="background-color: rgb(56, 171, 99);"></div>
                  <div class="sf-color-palette__item" style="background-color: rgb(255, 224, 72);"></div>
                  <div class="sf-color-palette__item" style="background-color: rgb(237, 133, 39);"></div>
                  <div class="sf-color-palette__item" style="background-color: rgb(126, 106, 95);"></div>
                  <div class="sf-color-palette__item" style="background-color: rgb(118, 134, 143);"></div>
              </div>
          </div>
      </div>
   </a>

   Styleguide: Button.dropdown-color-picker
   */
  /*
   Icon Button

   `.sf-button.-icon`

       Markup:
       <button class="sf-button -icon"><i class="sf-icon -size-xs sf-fa sf-fa-sliders sf-button__icon"></i></button>
       <button class="sf-button -icon" disabled><i class="sf-icon -size-xs sf-fa sf-fa-sliders sf-button__icon"></i></button>
       <button class="sf-button -action -icon"><i class="sf-icon -size-xs sf-fa sf-fa-sliders sf-button__icon"></i></button>
       <button class="sf-button -action -icon" disabled><i class="sf-icon -size-xs sf-fa sf-fa-sliders sf-button__icon"></i></button>
       <br>
       <a class="sf-button -icon"><i class="sf-icon -size-xs sf-fa sf-fa-sliders sf-button__icon"></i></a>
       <a class="sf-button -icon -disabled"><i class="sf-icon -size-xs sf-fa sf-fa-sliders sf-button__icon"></i></a>

  Styleguide: Button.icon
  */
  /*
   Toggle buttons

   `.sf-button.-toggle`

       Markup:
       <button class="sf-button -icon -toggle"><i class="sf-icon sf-fa sf-fa-sitemap sf-button__icon"></i></button>
       <button class="sf-button -active -icon -toggle"><i class="sf-icon sf-fa sf-fa-filter sf-button__icon"></i></button>
       <button class="sf-button -icon -toggle"><i class="sf-icon sf-fa sf-fa-cog sf-button__icon"></i></button>
       <button class="sf-button -icon -toggle"><i class="sf-icon sf-fa sf-fa-lightbulb-o sf-button__icon"></i></button>
       <button class="sf-button -icon -toggle"><i class="sf-icon sf-fa sf-fa-th-list sf-button__icon"></i></button>
       <button class="sf-button -toggle"><span class="sf-button__content"><i class="sf-badge -size-xl-fixed -add-variation -sf-txt-small">EN</i></span></button>
       <br>
       <a class="sf-button -icon -toggle"><i class="sf-icon sf-fa sf-fa-sitemap sf-button__icon"></i></a>
       <a class="sf-button -active -icon -toggle"><i class="sf-icon sf-fa sf-fa-filter sf-button__icon"></i></a>
       <a class="sf-button -icon -toggle"><i class="sf-icon sf-fa sf-fa-cog sf-button__icon"></i></a>
       <a class="sf-button -icon -toggle"><i class="sf-icon sf-fa sf-fa-lightbulb-o sf-button__icon"></i></a>
       <a class="sf-button -icon -toggle"><i class="sf-icon sf-fa sf-fa-th-list sf-button__icon"></i></a>
       <a class="sf-button -icon -toggle"><i class="sf-icon sf-fa sf-fa-angle-left -size-2xl sf-button__icon"></i></a>
       <a class="sf-button -icon -toggle -disabled"><i class="sf-icon sf-fa sf-fa-angle-left -size-2xl sf-button__icon"></i></a>

  Styleguide: Button.toggle
  */
  /*
   Circled Icon Button

   `.sf-button.-icon.-circle`

       Markup:
       <button class="sf-button -icon -circle"><i class="sf-icon -size-xs sf-fa sf-fa-plus sf-button__icon"></i></button>
       <button class="sf-button -icon -circle" disabled><i class="sf-icon -size-xs sf-fa sf-fa-times sf-button__icon"></i></button>
       <button class="sf-button -icon -circle -small"><i class="sf-icon -size-xs sf-fa sf-fa-times sf-button__icon"></i></button>
       <br>
       <a class="sf-button -icon -circle"><i class="sf-icon -size-xs sf-fa sf-fa-plus sf-button__icon"></i></a>
       <a class="sf-button -icon -circle -disabled"><i class="sf-icon -size-xs sf-fa sf-fa-times sf-button__icon"></i></a>
       <a class="sf-button -icon -circle -small"><i class="sf-icon -size-xs sf-fa sf-fa-times sf-button__icon"></i></a>

       Styleguide: Button.icon-button
  */
  /*
   Circled Icon with small font size

   `.sf-button.-txt-small.-circle`

   Markup:
   <button class="sf-button -txt-small -small -circle">+4</button>
   <br>
   <a class="sf-button -txt-small -small -circle">+4</a>

    Styleguide: Button.circle-icon-small
  */
  /*
    Button group

    `.sf-button-group`

        Markup:
        <div class="sf-button-group">
        <button class="sf-button -icon -toggle"><i class="sf-icon sf-fa sf-fa-sitemap sf-button__icon"></i></button>
        <button class="sf-button -active -icon -toggle"><i class="sf-icon sf-fa sf-fa-filter sf-button__icon"></i></button>
        <button class="sf-button -icon -toggle"><i class="sf-icon sf-fa sf-fa-cog sf-button__icon"></i></button>
        <button class="sf-button -icon -toggle"><i class="sf-icon sf-fa sf-fa-lightbulb-o sf-button__icon"></i></button>
        <button class="sf-button -icon -toggle"><i class="sf-icon sf-fa sf-fa-th-list sf-button__icon"></i></button>
        </div>

     Styleguide: Button.button-group
   */
  /*
    Search Button Group
    `.sf-button-group`

        Markup:
        <div class="sf-button-group -search">
         <div class="sf-input">
              <input type="text" class="sf-input__field" placeholder="Search..." />
        </div>
         <button class="sf-button -icon">
             <i class="sf-fa sf-fa-search sf-icon -size-s sf-button__icon"></i>
         </button>
       </div>

       Styleguide: Button.search-button-group
   */
  /*
     Filter Button Group

    `.sf-button-group`

        Markup:
        <div class="sf-button-group -search">
         <i class="sf-fa sf-fa-search sf-icon -size-s -light"></i>
         <div class="sf-input -clearable">
            <input type="text" class="sf-input__field" placeholder="Narrow by typing..." />
             <span class="sf-input__clear-button">
                 <i class="sf-icon sf-fa sf-fa-times -size-3xs"></i>
             </span>
          </div>
       </div>
        <div class="sf-button-group -search">
         <i class="sf-fa sf-fa-search sf-icon -size-s -light"></i>
         <div class="sf-input -clearable">
            <input type="text" class="sf-input__field" placeholder="Narrow by typing..." />
             <span class="sf-input__clear-button -show">
                 <i class="sf-icon sf-fa sf-fa-times -size-3xs"></i>
             </span>
          </div>
       </div>

       Styleguide: Button.filter-button-group
   */
  /*
    Notification
   */
  /*
    info Notification

    `.sf-notification.-info`

        Markup:
        <div class="sf-notification -info">
            <div class="sf-notification__content">
                <h4>Curabitur sem nulla</h4>
                Lorem ipsum dolor sit amet, consectetur adipiscing elit. In a tristique elit. Curabitur sem nulla, porttitor sit amet pretium luctus.
            </div>
        </div>

     Styleguide: Notification.default
   */
  /*
    success Notification

    `.sf-notification.-success`

        Markup:
        <div class="sf-notification -success">
            <div class="sf-notification__content">
                <h4>Curabitur sem nulla</h4>
                Lorem ipsum dolor sit amet, consectetur adipiscing elit. In a tristique elit. Curabitur sem nulla, porttitor sit amet pretium luctus.
            </div>
        </div>

     Styleguide: Notification.default
   */
  /*
    error Notification

    `.sf-notification.-error`

        Markup:
        <div class="sf-notification -error">
            <div class="sf-notification__content">
                <h4>Curabitur sem nulla</h4>
                Lorem ipsum dolor sit amet, consectetur adipiscing elit. In a tristique elit. Curabitur sem nulla, porttitor sit amet pretium luctus.
            </div>
        </div>

     Styleguide: Notification.default
   */
  /*
    warning Notification

    `.sf-notification.-warning`

        Markup:
        <div class="sf-notification -warning">
            <div class="sf-notification__content">
                <h4>Curabitur sem nulla</h4>
                Lorem ipsum dolor sit amet, consectetur adipiscing elit. In a tristique elit. Curabitur sem nulla, porttitor sit amet pretium luctus.
            </div>
        </div>

     Styleguide: Notification.default
   */
  /*
    black Notification

    `.sf-notification.-black`

        Markup:
        <div class="sf-notification -black">
            <div class="sf-notification__content">
                <h4>Curabitur sem nulla</h4>
                Lorem ipsum dolor sit amet, consectetur adipiscing elit. In a tristique elit. Curabitur sem nulla, porttitor sit amet pretium luctus.
            </div>
        </div>

     Styleguide: Notification.default
   */
  /*
    transparent Notification

    `.sf-notification.-transparent`

        Markup:
        <div class="sf-notification -transparent">
            <div class="sf-notification__content">
                <h4>Curabitur sem nulla</h4>
                Lorem ipsum dolor sit amet, consectetur adipiscing elit. In a tristique elit. Curabitur sem nulla, porttitor sit amet pretium luctus.
            </div>
        </div>

     Styleguide: Notification.default
   */
  /*
   * info notification with close button

    `.sf-notification.-success`

        Markup:
        <div class="sf-notification -success">
            <span class="sf-notification__close-button"></span>
            <div class="sf-notification__content">
                Lorem ipsum dolor sit amet, consectetur adipiscing elit. In a tristique elit. Curabitur sem nulla, porttitor sit amet pretium luctus.
            </div>
        </div>

        Styleguide: Notification.with-close
   */
  /*
    Inline notification (as wide as the content in it)

    `.sf-notification.-inline`

        Markup:
        <div class="sf-notification -info -inline">
            <span class="sf-notification__close-button"></span>
            <div class="sf-notification__content">
                Lorem ipsum dolor sit amet, consectetur adipiscing elit. In a tristique elit. Curabitur sem nulla, porttitor sit amet pretium luctus.
            </div>
        </div>

        Styleguide: Notification.inline
   */
  /*
   Notification with bottom up

   `.sf-notification.-info.-up`

       Markup:
       <div class="sf-notification -info -up">
            <div class="sf-notification__content">
                Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque luctus, erat sed elementum aliquam, libero nibh aliquam lacus, sollicitudin accumsan justo nibh eu nisi. Donec faucibus commodo lacus, quis laoreet nulla. Ut et neque quis tortor dapibus consequat.
            </div>
        </div>

        Styleguide: Notification.bottom-up
  */
  /*
           Notification with top arrow

           `.sf-notification.-info.-down`

               Markup:
               <div class="sf-notification -info -down">
                    <div class="sf-notification__content">
                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque luctus, erat sed elementum aliquam, libero nibh aliquam lacus, sollicitudin accumsan justo nibh eu nisi. Donec faucibus commodo lacus, quis laoreet nulla. Ut et neque quis tortor dapibus consequat.
                    </div>
                </div>

      Styleguide: Notification.loader-big
  */
  /*
     Notification with right arrow

     `.sf-notification.-info.-left`

         Markup:
         <div class="sf-notification -info -left">
              <div class="sf-notification__content">
                  Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque luctus, erat sed elementum aliquam, libero nibh aliquam lacus, sollicitudin accumsan justo nibh eu nisi. Donec faucibus commodo lacus, quis laoreet nulla. Ut et neque quis tortor dapibus consequat.
              </div>
          </div>

          Styleguide: Notification.right-arrow
  */
  /*
   Notification with left arrow

   `.sf-notification.-info.-right`

       Markup:
       <div class="sf-notification -info -right">
            <div class="sf-notification__content">
                Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque luctus, erat sed elementum aliquam, libero nibh aliquam lacus, sollicitudin accumsan justo nibh eu nisi. Donec faucibus commodo lacus, quis laoreet nulla. Ut et neque quis tortor dapibus consequat.
            </div>
        </div>

        Styleguide: Notification.left-arrow
  */
  /*
     Notification as tooltip

     `.sf-notification.-tooltip`

         Markup:
         <div class="sf-notification -tooltip">
              <div class="sf-notification__content">
                  Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque luctus, erat sed elementum aliquam, libero nibh aliquam lacus, sollicitudin accumsan justo nibh eu nisi. Donec faucibus commodo lacus, quis laoreet nulla. Ut et neque quis tortor dapibus consequat.
              </div>
          </div>

          Styleguide: Notification.tooltip
   */
  /*
   Notification as tooltip with top left arrow

   `.sf-notification.-tooltip.-down-left`

       Markup:
       <div class="sf-notification -tooltip -down-left">
            <div class="sf-notification__content">
                Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque luctus, erat sed elementum aliquam, libero nibh aliquam lacus, sollicitudin accumsan justo nibh eu nisi. Donec faucibus commodo lacus, quis laoreet nulla. Ut et neque quis tortor dapibus consequat.
            </div>
        </div>
        Styleguide: Notification.tooltip-with-top-left-arrow
  */
  /*
   Notification as tooltip with top right arrow and close button

   `.sf-notification.-tooltip.-down-right`

       Markup:
       <div class="sf-notification -tooltip -down-right">
            <i class="sf-notification__close-button sf-icon -close -black -size-2xs"></i>
            <div class="sf-notification__content">
                Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque luctus, erat sed elementum aliquam, libero nibh aliquam lacus, sollicitudin accumsan justo nibh eu nisi. Donec faucibus commodo lacus, quis laoreet nulla. Ut et neque quis tortor dapibus consequat.
            </div>
        </div>

        Styleguide: Notification.tooltip-with-top-right-arrow
  */
  /*
   Notification as tooltip with left arrow

   `.sf-notification.-tooltip.-left`

       Markup:
       <div class="sf-notification -tooltip -left">
            <div class="sf-notification__content">
                Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque luctus, erat sed elementum aliquam, libero nibh aliquam lacus, sollicitudin accumsan justo nibh eu nisi. Donec faucibus commodo lacus, quis laoreet nulla. Ut et neque quis tortor dapibus consequat.
            </div>
        </div>

        Styleguide: Notification.tooltip-with-left-arrow
  */
  /*
   Notification as tooltip with right arrow

   `.sf-notification.-tooltip.-right`

       Markup:
       <div class="sf-notification -tooltip -right">
            <i class="sf-notification__close-button sf-icon -close -black -size-2xs"></i>
            <div class="sf-notification__content">
                Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque luctus, erat sed elementum aliquam, libero nibh aliquam lacus, sollicitudin accumsan justo nibh eu nisi. Donec faucibus commodo lacus, quis laoreet nulla. Ut et neque quis tortor dapibus consequat.
            </div>
        </div>

        Styleguide: Notification.tooltip-with-right-arrow
  */
  /*
   Notification as tooltip with down arrow

   `.sf-notification.-tooltip.-down`

       Markup:
       <div class="sf-notification -tooltip -down">
            <div class="sf-notification__content">
                Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque luctus, erat sed elementum aliquam, libero nibh aliquam lacus, sollicitudin accumsan justo nibh eu nisi. Donec faucibus commodo lacus, quis laoreet nulla. Ut et neque quis tortor dapibus consequat.
            </div>
        </div>

        Styleguide: Notification.tooltip-with-down-arrow
  */
  /*
   Notification as tooltip with up arrow

   `.sf-notification.-tooltip.-up`

       Markup:
       <div class="sf-notification -tooltip -up">
            <i class="sf-notification__close-button sf-icon -close -black -size-2xs"></i>
            <div class="sf-notification__content">
                Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque luctus, erat sed elementum aliquam, libero nibh aliquam lacus, sollicitudin accumsan justo nibh eu nisi. Donec faucibus commodo lacus, quis laoreet nulla. Ut et neque quis tortor dapibus consequat.
            </div>
        </div>

        Styleguide: Notification.tooltip-with-up-arrow
  */
  /*
   Edit item notification

   `.sf-notification.-success.-fixed.-inline`

       Markup:
       <div class="sf-notification -success -fixed -inline">
     	<div class="sf-notification__close-button"><i class="sf-icon sf-fa sf-fa-times -size-3xs -darkest"></i></div>
     	<div class="sf-notification__content">
     		Content has been published successfully.
     	</div>
      </div>

      Styleguide: Notification.edit-item
  */
  /*
   Notification as toolset for link

   `.sf-notification.-toolset.-black.-down`

       Markup:
       <div class="sf-notification -black -toolset -down">
            <div class="sf-notification__content">
                <span class="sf-notification__tool-link" title="Open link: https://drive.google.com/drive/folders/">https://drive.google.com/drive/folders/</span>
                <span class="sf-notification__tool-button"><i class="sf-icon -color-inherit -size-xs sf-fa sf-fa-external-link"></i></span>
                <span class="sf-notification__tool-separator"></span>
                <span class="sf-notification__tool-button"><i class="-color-inherit -size-xs sf-icon sf-fa sf-fa-pencil"></i></span>
                <span class="sf-notification__tool-separator"></span>
                <span class="sf-notification__tool-button"><i class="-color-inherit -size-xs sf-icon sf-fa sf-fa-unlink"></i></span>
            </div>
        </div>

       Styleguide: Notification.toolset-for-link
  */
  /*
   Notification as toolset for other objects

   `.sf-notification.-toolset.-black.-up`

       Markup:
       <div class="sf-notification -black -toolset -up">
            <div class="sf-notification__content">
                <span class="sf-notification__tool-group">
                     <span class="sf-notification__tool-button">
                         <i class="-color-inherit -size-xs sf-icon sf-fa sf-fa-align-left"></i>
                     </span>
                     <span class="sf-notification__tool-button">
                         <i class="-color-inherit -size-xs sf-icon sf-fa sf-fa-align-center"></i>
                     </span>
                     <span class="sf-notification__tool-button -active">
                         <i class="-color-inherit -size-xs sf-icon sf-fa sf-fa-align-right"></i>
                     </span>
                </span>
                <span class="sf-notification__tool-separator"></span>
                <span class="sf-notification__tool-button"><i class="-color-inherit -size-xs sf-icon sf-fa sf-fa-link"></i></span>
                <span class="sf-notification__tool-separator"></span>
                <span class="sf-notification__tool-button"><i class="-color-inherit -size-xs sf-icon sf-fa sf-fa-paint-brush"></i></span>
                <span class="sf-notification__tool-separator"></span>
                <span class="sf-notification__tool-button"><i class="-color-inherit -size-xs sf-icon sf-fa sf-fa-pencil"></i></span>
            </div>
        </div>

        Styleguide: Notification.toolset-for-other-objects
  */
  /*
   Notification as toolset for styles menu

   `.sf-notification.-toolset.-black.-down`

       Markup:
       <div class="sf-notification -black -toolset -down">
            <div class="sf-notification__content">
                <label class="sf-notification__tool-link">Link Style</label>
                 <select class="sf-notification__tool-dropdown">
                     <option selected>No style</option>
                     <option value="sf-button -action -large">Big call action</option>
                     <option value="sf-button -small">Small button</option>
                 </select>
            </div>
        </div>

        Styleguide: Notification.toolset-for-styles-menu
  */
  /*
   Info icon and tooltip

   `.sf-tooltip`

       Markup:
       <div class="sf-tooltip">
            <i class="sf-icon sf-fa sf-fa-info-circle -black -size-m"></i>
            <div class="sf-tooltip__content sf-notification -tooltip">
                <div class="sf-notification__content">
                    1920 x 1200<br>
  			        <span class="-sf-txt-upper-case">jpeg</span><br>
  			        762.72 KB
                </div>
            </div>
       </div>

      Styleguide: Tooltip.tooltip
   */
  /*
    Info icon and tooltip opens on click

    `.sf-tooltip`

        Markup:
        <div class="sf-row -align-items-center">
        <div class="sf-tooltip -open-on-click">
             <i class="sf-icon -sf-clickable sf-fa sf-fa-info-circle -black -size-m"></i>
             <div class="sf-tooltip__content sf-notification -tooltip">
                 <div class="sf-notification__content">
                     1920 x 1200<br>
   			        <span class="-sf-txt-upper-case">jpeg</span><br>
   			        762.72 KB
                 </div>
             </div>
        </div>
        <div class="sf-tooltip -open-on-click -dropped">
             <i class="sf-icon -sf-clickable sf-fa sf-fa-info-circle -black -size-m"></i>
             <div class="sf-tooltip__content sf-notification -tooltip">
                 <div class="sf-notification__content">
                     1920 x 1200<br>
   			        <span class="-sf-txt-upper-case">jpeg</span><br>
   			        762.72 KB
                 </div>
             </div>
        </div>
        </div>

        Styleguide: Tooltip.on-click
   */
  /*
    Tooltip on the right

    `.sf-tooltip`

        Markup:
        <div class="sf-row -align-items-center">
         <div class="sf-tooltip -dropped">
               <button type="button" class="sf-button">Load 50 more News</button>
                <div class="sf-tooltip__content -right">
                 <div class="sf-notification -tooltip -right">
                   <span class="sf-notification__close-button"></span>
                   <div class="sf-notification__content">
                       <h4>Looking for specific items?</h4>
                       <a>Search </a>or<a> filtering</a> may be easier
                   </div>
                 </div>
             </div>
         </div>
        </div>

        Styleguide: Tooltip.on-the-right
   */
  /*
    Tooltip on the left

    `.sf-tooltip`

        Markup:
        <div class="sf-row -align-items-center" style="padding-left: 250px;">
        <div class="sf-tooltip -dropped">
             <button type="button" class="sf-button">Load 50 more News</button>
             <div class="sf-tooltip__content -left">
                 <div class="sf-notification -tooltip -left">
                     <span class="sf-notification__close-button"></span>
                     <div class="sf-notification__content">
                         <h4>Looking for specific items?</h4>
                         <a>Search </a>or<a> filtering</a> may be easier
                     </div>
                 </div>
             </div>
          </div>
          </div>

          Styleguide: Tooltip.on-the-left
   */
  /*
    Tooltip on top

    `.sf-tooltip`

        Markup:
        <div class="sf-row -align-items-center" style="padding-top: 100px;">
        <div class="sf-tooltip -dropped">
             <div class="sf-tooltip__content -up">
                 <div class="sf-notification -tooltip -up">
                     <span class="sf-notification__close-button"></span>
                     <div class="sf-notification__content">
                         <h4>Looking for specific items?</h4>
                         <a>Search </a>or<a> filtering</a> may be easier
                     </div>
                 </div>
             </div>
             <button type="button" class="sf-button">Load 50 more News</button>
          </div>
          </div>

          `Styleguide: Tooltip.on-top
   */
  /*
   Tooltip on bottom

   `.sf-tooltip`

       Markup:
       <div class="sf-row -align-items-center" style="padding-bottom: 100px;">
       <div class="sf-tooltip -dropped">
            <button type="button" class="sf-button">Load 50 more News</button>
            <div class="sf-tooltip__content -down">
                <div class="sf-notification -tooltip -down">
                    <span class="sf-notification__close-button"></span>
                    <div class="sf-notification__content">
                        <h4>Looking for specific items?</h4>
                        <a>Search</a> or <a>filtering</a> may be easier
                    </div>
                </div>
            </div>
         </div>
         </div>

         Styleguide: Tooltip.on-bottom
   */
  /* stylelint-disable selector-pseudo-class-no-unknown */
  /* stylelint-enable selector-pseudo-class-no-unknown */
  /*
    Input

       Default

       `.sf-input`

       Markup:
       <div class="sf-input">
           <label class="sf-input__label" for="input_1">
               <span>Input title</span>
           </label>
            <input type="text" class="sf-input__field" id="input_1" placeholder="Search the blog..." />
           <p class="hint sf-input__hint">Example:&nbsp;Input example text</p>
       </div>

        Styleguide: Input.default
  */
  /*
   Disabled:

   `.sf-input`

       Markup:
       <div class="sf-input">
           <label class="sf-input__label" for="input-6">
               <span>Input title</span>
           </label>
           <input type="text" class="sf-input__field" disabled value="User name" id="input-6" />
       </div>

       Styleguide: Input.disabled
  */
  /*
   Readonly

   `.sf-input`

       Markup:
       <div class="sf-input">
           <label class="sf-input__label" for="input-7" >
                <span>Input title</span>
           </label>
           <input type="text" class="sf-input__field" readonly value="User name" id="input-7" />
       </div>

       Styleguide: Input.readonly
  */
  /*
   Value not set:

   `.sf-input .sf-input__no-value`

       Markup:
       <div class="sf-input">
           <label class="sf-input__label" for="input-4">
               <span>Input title</span>
           </label>
           <div class="sf-input__no-value">Not set</div>
       </div>

       Styleguide: Input.not-set
  */
  /*
   Invalid field

   `.sf-input.ng-invalid`

       Markup:
       <div class="sf-input ng-invalid ng-dirty">
           <label class="sf-input__label" for="input-77" >
                <span>Required Input</span>
           </label>
           <input type="text" class="sf-input__field ng-invalid ng-dirty" required value="User name" id="input-77" />
           <p class="sf-input__required">Field is required</p>
           <p class="hint sf-input__hint">Example:&nbsp;Input example text</p>
       </div>
       <div class="sf-input -required">
           <label class="sf-input__label" for="input-8" >
                <span>Required Input</span>
           </label>
           <input type="text" class="sf-input__field -required ng-invalid ng-dirty" required value="User name" id="input-8" />
           <p class="sf-input__required">Field is required</p>
           <p class="hint sf-input__hint">Example:&nbsp;Input example text</p>
       </div>

       Styleguide: Input.invalid
  */
  /*
   Input with clear button

   `.sf-input.-clear`

       Markup:
       <div class="sf-input -clearable">
           <label class="sf-input__label" for="input-32">
               <span>Input title</span>
           </label>
           <input type="text" class="sf-input__field" id="input-32" />
           <span class="sf-input__clear-button -show"><i class="sf-icon -size-3xs sf-fa sf-fa-times"></i></span>
           <p class="hint sf-input__hint">Example:&nbsp;Input example text</p>
       </div>

       Styleguide: Input.input-clear-button
  */
  /*
   Input with units

   `.sf-input.-unit`

       Markup:
       <div class="sf-input -left -unit">
           <input type="search" class="sf-input__field" id="input-24" />
           <label for="input-24" class="sf-icon -light -size-s sf-input__unit"><i class="sf-fa sf-fa-eur"></i></label>
       </div>
       </br>
       </br>
       <div class="sf-input -unit">
           <input type="search" class="sf-input__field" id="input-4" />
           <label  class="sf-icon -light -size-s sf-input__unit" for="input-4">m<sup>2</sup></label>
       </div>

       Styleguide: Input.units
  */
  /*
   Input and textarea with character counter

   `.sf-input .-char-counter`

       Markup:
       <div class="sf-input -char-counter">
           <input type="text" class="sf-input__field" id="input-45" />
           <span class="sf-input__char-counter">352</span>
       </div>
       </br>
       </br>
       <div class="sf-input -textarea -char-counter">
           <textarea type="textarea" class="sf-input__textarea" id="textarea-4">Longer than 4</textarea>
           <span class="sf-input__char-counter -error">-9</span>
       </div>

       Styleguide: Input.char-counter
  */
  /*
   Side content with char counter

   `.sf-input.-char-counter .sf-input__char-counter`
   `.sf-input.-side-content .sf-input__char-counter`

       Markup:
       <div class="sf-input -textarea -char-counter -side-content" style="width:600px;">
           <textarea type="textarea" class="sf-input__textarea" id="textarea-49"></textarea>
           <span class="sf-input__char-counter -success">44</span>
           <span class="sf-input__side-content">Side content</span>
       </div>

       Styleguide: Input.side-content-char-counter
  */
  /*
   Textarea

   `.sf-input`

       Markup:
       <div class="sf-input -textarea">
           <label class="sf-input__label" for="textarea-1">
               <span>Textarea title</span>
           </label>
           <textarea type="textarea" class="sf-input__textarea" id="textarea-1"></textarea>
       </div>

       Styleguide: Input.textarea
  */
  /*
   Title

   `.sf-input.-title`

       Markup:
       <div class="sf-input -title">
           <h1 class="sf-input__title -title" contenteditable="true" data-placeholder="Title"></h1>
       </div>

      Styleguide: Input.title
  /*
   Title Large

   `.sf-input.-title.-large`

       Markup:
       <div class="sf-input -title -large">
           <h1 class="sf-input__title -title" contenteditable="true" data-placeholder="Title"></h1>
       </div>

       Styleguide: Input.large
  */
  /*
   Title with side-content

   `.sf-input.-title.-side-content`

       Markup:
       <div class="sf-input -title -side-content">
           <h1 class="sf-input__title -title" contenteditable="true" data-placeholder="Title"></h1>
           <span class="sf-input__side-content"><i class="sf-icon sf-fa sf-fa-question-circle -size-xs -black"></i></span>
       </div>

       Styleguide: Input.side-content-title
  */
  /*
   Title with side-content and validation

   `.sf-input.-title.-side-content.-required`

       Markup:
       <div class="sf-input -title -side-content -required">
           <h1 class="sf-input__title -title" contenteditable="true" data-placeholder="Title"></h1>
           <p class="sf-input__required">Enter Title<br /></p>
           <span class="sf-input__side-content"><i class="sf-icon sf-fa sf-fa-question-circle -size-xs -black"></i></span>
       </div>

       Styleguide: Input.side-content-validation
  */
  /*
    File input

   Upload icon

   `.sf-input-file`

       Markup:
       <div class="sf-input-file">
           <label class="sf-input-file__label" for="input-file_1">
               <a class="-secondary sf-icon sf-fa sf-fa-upload -size-xl" title="Upload"></a>
           </label>
            <input type="file" id="input-file_1" />
       </div>

       Styleguide: Input.file-input
  */
  /*
   Plus icon

   `.sf-input-file`

       Markup:
       <div class="sf-input-file">
           <label class="sf-input-file__label" for="input-file_2">
           <a class="sf-button -icon -circle">
                 <i class="sf-icon -size-xs sf-fa sf-fa-plus sf-button__icon"></i>
           </a>
           </label>
            <input type="file" id="input-file_2" />
       </div>

       Styleguide: Input.plus-icon
  */
  /*
   Upload button:

   `.sf-input-file`

       Markup:
       <div class="sf-input-file">
           <label class="sf-input-file__label sf-row -column -align-items-center -sf-mt-xl" for="input-file_3">
               <i class="sf-icon sf-fa sf-fa-upload -illustrative -sf-mb-xl -sf-mr-zero"></i>
               <span class="sf-button -action -large -sf-mb-m">Upload images from your computer</span>
           </label>
            <input type="file" id="input-file_3" />
       </div>

       Styleguide: Input.input-file
  */
  /*
   Default Dropdown

   `.sf-dropdown`

       Markup:
       <div class="sf-dropdown" style="vertical-align:top;">
           <div class="sf-dropdown__item -active">
               Pages
           </div>
           <div class="sf-dropdown__item -disabled">
                Blogs<span class="sf-dropdown__counter -positive">14</span>
           </div>
           <div class="sf-dropdown__item">
                News items<span class="sf-dropdown__counter -neutral">0</span>
           </div>
       </div>
       <div class="sf-dropdown" style="vertical-align:top;">
           <div class="sf-dropdown__heading">
                Pages
           </div>
           <div class="sf-dropdown__item">
                Blogs
           </div>
           <div class="sf-dropdown__separator">
           </div>
           <div class="sf-dropdown__item">
                News items
           </div>
           <div class="sf-dropdown__item ">
                Blog posts
           </div>
           <div class="sf-dropdown__separator">
           </div>
           <div class="sf-dropdown__heading">
                Pages
           </div>
           <div class="sf-dropdown__item">
                Lists
           </div>
           <div class="sf-dropdown__item">
               Restaurants
           </div>
       </div>

       Styleguide: Dropdown.default
  */
  /*
   Dropdown with no items

   `.sf-dropdown .sf-dropdown__no-items`

       Markup:
       <div class="sf-dropdown">
           <div class="sf-dropdown__no-items">
                No items
           </div>
       </div>

        Styleguide: Dropdown.no-items
  */
  /*
   Dropdown without top and bottom padding

   `.sf-dropdown.-condensed`

       Markup:
       <div class="sf-dropdown -condensed">
           <div class="sf-dropdown__item">
               Restaurants
           </div>
           <div class="sf-dropdown__item">
               Hotels
           </div>
           <div class="sf-dropdown__separator">
           </div>
           <div class="sf-dropdown__item">
               Clubs
           </div>
           <div class="sf-dropdown__item">
                Show all related items
           </div>
       </div>

        Styleguide: Dropdown.no-vertical-padding
  */
  /*
  Collapsed

   `.sf-expander`

   <span style="font-size:12px">&nbsp;Web Accessibility: If non-custom element is used, user must handle the change for aria-expanded="true/false" through javaScript.</span>

       Markup:
       <div class="sf-expander">
           <input class="sf-expander__checkbox" type="checkbox" id="some-id" aria-expanded="false">
           <label class="sf-expander__header" for="some-id"><span class="sf-expander__icon sf-button -circle -icon"><i class="sf-button__icon sf-icon -size-l sf-fa sf-fa-angle-down"></i></span>Exapnded</label>
           <label class="sf-expander__header" for="some-id"><span class="sf-expander__icon sf-button -circle -icon"><i class="sf-button__icon sf-icon -size-l sf-fa sf-fa-angle-right"></i></span>Collapsed</label>
           <div class="sf-expander__content">
               <h4>
                   Lorem ipsum dolor sit amet, consectetur adipiscing elit. In a tristique elit. Curabitur sem nulla, porttitor sit amet pretium luctus.Lorem ipsum dolor sit amet, consectetur adipiscing elit. In a tristique elit.
               </h4>
           <div class="sf-input">
              <label class="sf-input__label" for="input_1">
                <span>Input title</span>
              </label>
              <input type="text" class="sf-input__field" id="input_1" />
              <p class="sf-input__required">Field is required</p>
              <p class="hint sf-input__hint">Example:&nbsp;Input example text</p>
            </div>
           </div>
       </div>

        Styleguide: Expander.default
   */
  /*
    Default Checkbox

   `.sf-checkbox`

       Markup:
  <div class="sf-checkbox">
      <input type="checkbox" class="sf-checkbox__input" id="id_1"/>
      <label class="sf-checkbox__label" for="id_1">
           <span class="sf-checkbox__icon"></span>
            <span class="sf-checkbox__text">Lorem Ipsum is simply dummy text of the printing and typesetting industry.</span>
        </label>
     </div>
  <div class="sf-checkbox">
      <input type="checkbox" class="sf-checkbox__input" id="id_3" checked/>
      <label class="sf-checkbox__label" for="id_3">
           <span class="sf-checkbox__icon"></span>
            <span class="sf-checkbox__text">CheckBox checked</span>
        </label>
  </div>
  <div class="sf-checkbox">
      <input type="checkbox" class="sf-checkbox__input" id="id_2" disabled/>
      <label class="sf-checkbox__label" for="id_2">
           <span class="sf-checkbox__icon"></span>
            <span class="sf-checkbox__text">Checkbox disabled</span>
        </label>
  </div>
  <div class="sf-checkbox">
      <input type="checkbox" class="sf-checkbox__input" id="id_4" checked disabled />
      <label class="sf-checkbox__label" for="id_4">
           <span class="sf-checkbox__icon"></span>
            <span class="sf-checkbox__text">Checkbox disabled checked</span>
        </label>
  </div>

   Styleguide: Checkbox.default
  */
  /*
   Checkbox Without a Label

   `.sf-checkbox`

   Markup:
  <div class="sf-checkbox">
      <input type="checkbox" class="sf-checkbox__input" id="id_5" checked />
      <label class="sf-checkbox__label" for="id_5">
           <span class="sf-checkbox__icon"></span>
        </label>
  </div>

   Styleguide: Checkbox.no-label
  */
  /*
    Checkbox Ellipsis

    `.sf-checkbox.-ellipsis`

    Markup:
   <div style="width: 100px">
       <div class="sf-checkbox -ellipsis">
           <input type="checkbox" class="sf-checkbox__input" id="id_6" checked />
           <label class="sf-checkbox__label" for="id_6">
                <span class="sf-checkbox__icon"></span>
                 <span class="sf-checkbox__text">Checkbox ellipsis</span>
             </label>
       </div>
   </div>

   Styleguide: Checkbox.ellipsis
   */
  /*
    Default Radio Button

    `.sf-radio`

        Markup:
   <div class="sf-radio">
        <input type="radio" class="sf-radio__input" name="navigation" id="radio_1"/>
        <label class="sf-radio__label" for="radio_1">
            <span class="sf-radio__icon"></span>
             <span class="sf-radio__text">Lorem Ipsum is simply dummy text of the printing and typesetting industry.</span>
        </label>
   </div>
   <div class="sf-radio">
        <input type="radio" class="sf-radio__input" name="navigation" id="radio_2" disabled />
        <label class="sf-radio__label" for="radio_2">
            <span class="sf-radio__icon"></span>
             <span class="sf-radio__text">Radio label</span>
        </label>
   </div>
   <div class="sf-radio">
        <input type="radio" class="sf-radio__input" name="navigation" id="radio_3" checked/>
        <label class="sf-radio__label" for="radio_3">
            <span class="sf-radio__icon"></span>
             <span class="sf-radio__text">Radio label</span>
        </label>
   </div>

   Styleguide: Radio.default
   */
  /*
    Radio Button Without a Label

    `.sf-radio`

        Markup:
   <div class="sf-radio">
        <input type="radio" class="sf-radio__input" name="navigation1" id="radio_5" checked />
        <label class="sf-radio__label" for="radio_5">
            <span class="sf-radio__icon"></span>
        </label>
   </div>

   Styleguide: Radio.without-label
   */
  /*
    Radio Button Ellipsis

    `.sf-radio.-ellipsis`

     Markup:
   <div style="width: 100px">
       <div class="sf-radio -ellipsis">
            <input type="radio" class="sf-radio__input" name="navigation2" id="radio_6" />
            <label class="sf-radio__label" for="radio_6">
                <span class="sf-radio__icon"></span>
                <span class="sf-radio__text">Radio label ellipsis</span>
            </label>
       </div>
   </div>

   Styleguide: Radio.Ellipsis
   */
  /*
    Default Loader

    `.sf-loader`

        Markup:
        <div class="sf-loader">
     	 <div class="sf-loader__content">
   		  <div class="sf-loader__rect -first"></div>
   		  <div class="sf-loader__rect -second"></div>
   	      <div class="sf-loader__rect -third"></div>
   	    </div>
       </div>

       Styleguide: Loader.default
   */
  /*
    Loader Big

    `.sf-loader.-big`

        Markup:
        <div class="sf-loader -big">
     	 <div class="sf-loader__content">
   		  <div class="sf-loader__rect -first"></div>
   		  <div class="sf-loader__rect -second"></div>
   	      <div class="sf-loader__rect -third"></div>
   	    </div>
       </div>

       Styleguide: Loader.loader-big
   */
  /*
    Loader Mini

    `.sf-loader.-mini`

        Markup:
        <div class="sf-loader -mini">
     	 <div class="sf-loader__content">
   		  <div class="sf-loader__rect -first"></div>
   		  <div class="sf-loader__rect -second"></div>
   	      <div class="sf-loader__rect -third"></div>
   	    </div>
       </div>

       Styleguide: Loader.mini
   */
  /*
    Loader Color

    `.sf-loader.-color`

       Markup:
       <div class="sf-loader -color">
     	 <div class="sf-loader__content">
   		  <div class="sf-loader__rect -first"></div>
   		  <div class="sf-loader__rect -second"></div>
   	      <div class="sf-loader__rect -third"></div>
   	    </div>
       </div>

       Styleguide: Loader.color
   */
  /*
   Loader Progressbar

   `.sf-loader.-progressbar`

       Markup:
       <div class="sf-loader -progressbar">
    	 <div class="sf-loader__content">
  	    </div>
      </div>

      Styleguide: Loader.Progressbar
  */
  /*
   Loader Skeleton Content:
   `.sf-loader.-skeleton.-content`

       Markup:
       <div class="sf-loader -skeleton -content">
    	 <div class="sf-loader__content">
  	    </div>
      </div>

      Styleguide: Loader.Skeleton-Content
  */
  /*
   Loader Skeleton Title

   `.sf-loader.-skeleton.-title`

       Markup:
       <div class="sf-loader -skeleton -title">
    	 <div class="sf-loader__content">
  	    </div>
      </div>

      Styleguide: Loader.Skeleton-Title
  */
  /*
   Loader Skeleton List

   `.sf-loader.-skeleton.-list`

       Markup:
       <div class="sf-loader -skeleton -list">
    	 <div class="sf-loader__content">
  	    </div>
      </div>

      Styleguide: Loader.Skeleton-List
  */
  /*
   Loader Skeleton Horizontal List

   `.sf-loader.-skeleton.-list-horizontal`

       Markup:
       <div class="sf-loader -skeleton -list-horizontal">
    	 <div class="sf-loader__content">
  	    </div>
      </div>

      Styleguide: Loader.Skeleton-Horizontal-List
  */
  /*
   Loader Skeleton Horizontal List With Thumbnail

   `.sf-loader.-skeleton.-list-with-thumb`

       Markup:
       <div class="sf-loader -skeleton -list-with-thumb">
    	 <div class="sf-loader__content">
  	    </div>
      </div>

      Styleguide: Loader.Horizontal-List-With-Thumbnail
  */
  /*
   Loader Skeleton side-content

   `.sf-loader.-skeleton.-side-content.-darker`

       Markup:
       <div class="sf-loader -skeleton -side-content -darker">
    	 <div class="sf-loader__content">
  	    </div>
      </div>

      Styleguide: Loader.side-content
  */
  /*
    Chip
   */
  /*
    Default chip

    `.sf-chip`

        Markup:
        <div class="sf-chip">
            <div class="sf-chip__content">
                Default chip
            </div>
        </div>
        <div class="sf-chip -removable">
            <div class="sf-chip__content">
                Default chip with remove
            </div>
            <i class="sf-icon -close -size-2xs -black sf-chip__remove-button"></i>
        </div>

      Styleguide: Chip.default
   */
  /*
    success Chip

    `.sf-chip.-success`

        Markup:
        <div class="sf-chip -success">
            <div class="sf-chip__content">
                success chip
            </div>
        </div>
        <div class="sf-chip -success -removable">
            <div class="sf-chip__content">
                success chip with remove
            </div>
            <i class="sf-icon -close -size-2xs -black sf-chip__remove-button"></i>
        </div>

        Styleguide: Chip.default-success
   */
  /*
    error Chip

    `.sf-chip.-error`

        Markup:
        <div class="sf-chip -error">
            <div class="sf-chip__content">
                error chip
            </div>
        </div>
        <div class="sf-chip -error -removable">
            <div class="sf-chip__content">
                error chip with remove
            </div>
            <i class="sf-icon -close -size-2xs -black sf-chip__remove-button"></i>
        </div>

        Styleguide: Chip.default-error
   */
  /*
    invert Chip

    `.sf-chip.-invert`

        Markup:
        <div class="sf-chip -invert">
            <div class="sf-chip__content">
                invert chip
            </div>
        </div>
        <div class="sf-chip -invert -removable">
            <div class="sf-chip__content">
                invert chip with remove
            </div>
            <i class="sf-icon -close -size-2xs -black sf-chip__remove-button"></i>
        </div>

        Styleguide: Chip.default-invert
   */
  /*
    info Chip

    `.sf-chip.-info`

        Markup:
        <div class="sf-chip -info">
            <div class="sf-chip__content">
                info chip
            </div>
        </div>
        <div class="sf-chip -info -removable">
            <div class="sf-chip__content">
                info chip with remove
            </div>
            <i class="sf-icon -close -size-2xs -black sf-chip__remove-button"></i>
        </div>

        Styleguide: Chip.default-info
   */
  /*
    Chip with avatar:

        Markup:
        <div class="sf-chip -avatar  -removable">
            <span class="sf-chip__avatar">
                 <img class="sf-chip__image" src="/assets/AnnaGreen.png" alt="Avatar Image" />
            </span>
            <span class="sf-chip__content">
                 John Smith
            </span>
            <i class="sf-icon -close -size-2xs -black sf-chip__remove-button"></i>
        </div>

        Styleguide: Chip.avatar
   */
  /*
    Chip with icon

        Markup:
        <div class="sf-chip -removable -icon">
            <span class="sf-chip__icon">
                 <span class="sf-fa sf-fa-users"></span>
            </span>
            <span class="sf-chip__content">
                 John Smith
            </span>
            <i class="sf-icon -close -size-2xs -black sf-chip__remove-button"></i>
        </div>

        Styleguide: Chip.with-icon
   */
  /*
    Chip with initials

        Markup:
        <div class="sf-chip -initials -removable">
            <span class="sf-chip__initials">
                 JS
            </span>
            <span class="sf-chip__content">
                 John Smith
            </span>
            <i class="sf-icon -close -size-2xs -black sf-chip__remove-button"></i>
        </div>

       Styleguide: Chip.initials
   */
  /*
    Editable chip

        Markup:
        <div class="sf-chip -editable">
            <span class="sf-chip__content" contenteditable="true"></span>
        </div>

        Styleguide: Chip.editable
   */
  /*
   Chip with popup with suggestions

       Markup:
       <div class="sf-chip -editable -dropped">
           <span class="sf-chip__content" contenteditable="true"></span>
          <div class="sf-dropdown sf-chip__dropdown">
             <div class="sf-dropdown__heading">
                 Recent
             </div>
             <div class="sf-dropdown__item">
               european
             </div>
             <div class="sf-dropdown__item">
               evacuation
             </div>
             <div class="sf-dropdown__item">
               event
             </div>
           </div>
       </div>

       Styleguide: Chip.popup-suggestions
  */
  /*
   Chip with popup with suggestions that looks like an input

       Markup:
       <div class="sf-chip -editable -dropped -input">
           <span class="sf-chip__content" contenteditable="true"></span>
          <div class="sf-dropdown sf-chip__dropdown">
             <div class="sf-dropdown__heading">
                 Recent
             </div>
             <div class="sf-dropdown__item">
               european
             </div>
             <div class="sf-dropdown__item">
               evacuation
             </div>
             <div class="sf-dropdown__item">
               event
             </div>
           </div>
       </div>

       Styleguide: Chip.popup-suggestions-input
  */
  /*
   Default Error

   `.sf-error`

       Markup:
       <div class="sf-error">This is an error!</div>
       <div class="sf-error-block">This is an error block!</div>

       Styleguide: Error.default
   */
  /*
  Large select

    `.sf-select`

        Markup:
   <div class="sf-select">
        <select class="sf-select__item">
            <option>Option 1</option>
            <option>Option 2</option>
            <option>Option 3</option>
        </select>
   </div>

   Styleguide: Select.large-text
   */
  /*
    Small select

    `.sf-select.-small`

        Markup:
   <div class="sf-select -small">
        <select class="sf-select__item">
            <option>Option 1</option>
            <option>Option 2</option>
            <option>Option 3</option>
        </select>
   </div>

    Styleguide: Select.small-select
   */
  /*
    Default, Small, Large

   `.sf-form, .sf-form.-small, .sf-form.-large`

       Markup:
       <div class="sf-form">
            <div class="sf-input">
                <label class="sf-input__label" for="form_input_1">
                    <span>Field 1</span>
                </label>
                <input type="text" class="sf-input__field" id="form_input_1" placeholder="Search the blog..." />
           <p class="sf-input__required" style="display: block">Field is required</p>
           <p class="hint sf-input__hint">Example:&nbsp;Input example text</p>
            </div>
            <div class="sf-input">
                <label class="sf-input__label" for="form_input_2">
                    <span>Field 2</span>
                </label>
                <input type="text" class="sf-input__field" id="form_input_2" placeholder="Search the blog..." />
            </div>
       </div>
       <div class="sf-form -small">
            <div class="sf-input">
                <label class="sf-input__label" for="form_input_3">
                    <span>Field 1</span>
                </label>
                <input type="text" class="sf-input__field" id="form_input_3" placeholder="Search the blog..." />
           <p class="sf-input__required" style="display: block">Field is required</p>
           <p class="hint sf-input__hint">Example:&nbsp;Input example text</p>
            </div>
            <div class="sf-input">
                <label class="sf-input__label" for="form_input_4">
                    <span>Field 2</span>
                </label>
                <input type="text" class="sf-input__field" id="form_input_4" placeholder="Search the blog..." />
            </div>
        </div>
       <div class="sf-form -large">
            <div class="sf-input">
                <label class="sf-input__label" for="form_input_5">
                    <span>Field 1</span>
                </label>
                <input type="text" class="sf-input__field" id="form_input_5" placeholder="Search the blog..." />
                <p class="sf-input__required" style="display: block">Field is required</p>
                <p class="hint sf-input__hint">Example:&nbsp;Input example text</p>
            </div>
            <div class="sf-input">
                <label class="sf-input__label" for="form_input_6">
                    <span>Field 2</span>
                </label>
                <input type="text" class="sf-input__field" id="form_input_6" placeholder="Search the blog..." />
            </div>
        </div>

      Styleguide: Form.default-small-large
   */
  /*
    Medium Form

    `.sf-form.-medium`

        Markup:
        <div class="sf-form -medium">
             <div class="sf-input">
                 <label class="sf-input__label" for="form_input_3">
                     <span>Field 1</span>
                 </label>
                 <input type="text" class="sf-input__field" id="form_input_3" placeholder="Search the blog ..." />
            <p class="sf-input__required" style="display: block">Field is required</p>
            <p class="hint sf-input__hint">Example:&nbsp;Input example text</p>
             </div>
             <div class="sf-input">
                 <label class="sf-input__label" for="form_input_4">
                     <span>Field 2</span>
                 </label>
                 <input type="text" class="sf-input__field" id="form_input_4" placeholder="Search the blog ..." />
             </div>
         </div>

          Styleguide: Form.medium
   */
  /*
    Framed

    `.sf-form.-framed`

        Markup:
        <div class="sf-form -framed">
             <div class="sf-input">
                 <label class="sf-input__label" for="form_input_7">
                     <span>Field 1</span>
                 </label>
                 <input type="text" class="sf-input__field" id="form_input_7" placeholder="Search the blog..." />
             </div>
             <div class="sf-input">
                 <label class="sf-input__label" for="form_input_8">
                     <span>Field 2</span>
                 </label>
                 <input type="text" class="sf-input__field" id="form_input_8" placeholder="Search the blog..." />
             </div>
        </div>

         Styleguide: Form.framed
   */
  /*
   Condensed

   `.sf-form.-condensed`

       Markup:
       <div class="sf-form -condensed">
            <div class="sf-input">
                <label class="sf-input__label" for="form_input_9">
                    <span>Field 1</span>
                </label>
                <input type="text" class="sf-input__field" id="form_input_9" placeholder="Search the blog..." />
           <p class="sf-input__required" style="display: block">Field is required</p>
           <p class="hint sf-input__hint">Example:&nbsp;Input example text</p>
            </div>
            <div class="sf-input">
                <label class="sf-input__label" for="form_input_10">
                    <span>Field 2</span>
                </label>
                <input type="text" class="sf-input__field" id="form_input_10" placeholder="Search the blog..." />
            </div>
       </div>

        Styleguide: Form.condensed
   */
  /*
    Shrinked row — no bottom margin

    `.sf-form > .sf-input.-shrinked`

        Markup:
        <div class="sf-form">
             <div class="sf-input -shrinked">
                 <label class="sf-input__label" for="form_input_11">
                     <span>Field 1</span>
                 </label>
                 <input type="text" class="sf-input__field" id="form_input_11" placeholder="Search the blog..." />
                 <p class="sf-input__required" style="display: block">Field is required</p>
                 <p class="hint sf-input__hint">Example:&nbsp;Input example text</p>
             </div>
             <div class="sf-input -shrinked">
                 <label class="sf-input__label" for="form_input_12">
                     <span>Field 2</span>
                 </label>
                 <input type="text" class="sf-input__field" id="form_input_12" placeholder="Search the blog..." />
             </div>
        </div>

         Styleguide: Form.shrinked-row
   */
  /*
   Default and secondary links:

       Markup:
       <span tabindex="0" class="sf-link">Default link</span><br>
       <span tabindex="0" class="sf-link -secondary">Secondary link</span>

       Styleguide: Link.default-secondary
  */
  /*
   Navigation links:

       Markup:
       <span tabindex="0" class="sf-link -side">Navigation link</span><br>
       <span tabindex="0" class="sf-link -side -active">Settings link</span>

      Styleguide: Link.navigation
  */
  /*
   Section nav links

       Markup:
       <span tabindex="0" class="sf-link -side-secondary">Categories and tags</span><br>
       <span tabindex="0" class="sf-link -side-secondary -active">Search engine optimi...</span><br>
       <span tabindex="0" class="sf-link -side-secondary">Social media</span><br>

       Styleguide: Link.nav-links
  */
  /*
   Basic links

       Markup:
       <span tabindex="0" class="sf-link -basic">Categories and tags</span><br>

      Styleguide: Link.basic
  */
  /*
   Toolbar links:

       Markup:
       <div class="sf-top-toolbar" style="position: static;">
         <span tabindex="0" class="sf-link -top-toolbar">Categories and tags</span><br>
         <span tabindex="0" class="sf-link -top-toolbar -active">Categories and tags</span><br>
       </div>

       Styleguide: Link.toolbar-links
  */
  /***
   * Image:
   */
  /**
   * Image placeholder:
   * `.sf-media.-empty`
   *
   *     @example
   *     <div class="sf-media -empty">
   *         <i class="sf-icon sf-fa sf-fa-picture-o -size-4xl -sf-mr-zero"></i>
   *     </div>
   *     <br>
   *     <div class="sf-media -empty -small">
   *         <i class="sf-icon sf-fa sf-fa-picture-o -size-4xl -sf-mr-zero"></i>
   *     </div>
   *
   */
  /**
   * Image with remove button and info:
   * `.sf-media`
   *
   *     @example
   *     <div class="sf-media">
   *         <img src="image.png">
   *         <button class="sf-media__remove sf-button -icon -circle -small sf-element"><i class="sf-icon sf-fa sf-fa-times -normal % sf-button__icon -left"></i><span class="sf-button__content"></span></button>
   *         <sf-button type="icon circle small" icon="times" class="sf-media__remove"></sf-button>
   *         <div class="sf-tooltip sf-media__details">
   *             <i class="sf-icon sf-fa sf-fa-info-circle -black -size-m"></i>
   *             <div class="sf-notification -tooltip sf-tooltip__content -condensed">
   *              <div class="sf-notification__content">
   *                  1920 x 1200<br>
   *			        <span class="-sf-txt-upper-case">jpeg</span><br>
   *			        762.72 KB
   *              </div>
   *             </div>
   *          </div>
   *     </div>
   *     <br>
   *     <div class="sf-media -small">
   *         <img src="image.png">
   *         <button class="sf-media__remove sf-button -icon -circle -small sf-element"><i class="sf-icon sf-fa sf-fa-times -normal % sf-button__icon -left"></i><span class="sf-button__content"></span></button>
   *         <div class="sf-tooltip sf-media__details">
   *             <i class="sf-icon sf-fa sf-fa-info-circle -black -size-m"></i>
   *             <div class="sf-notification -tooltip sf-tooltip__content -condensed">
   *              <div class="sf-notification__content">
   *                  1920 x 1200<br>
   *			        <span class="-sf-txt-upper-case">jpeg</span><br>
   *			        762.72 KB
   *              </div>
   *             </div>
   *          </div>
   *     </div>
   *
   */
  /**
   * Selectable image:
   * `.sf-media.-selectable` `.sf-media.-selectable.-selected`
   *
   *     @example
   *     <div class="sf-media -selectable">
   *         <div class="sf-badge -white -icon"><i class="sf-icon sf-fa sf-fa-check-circle sf-media__selected-indicator -size-xl"></i></div>
   *         <img src="image.png">
   *         <div class="sf-tooltip sf-media__details">
   *             <i class="sf-icon sf-fa sf-fa-info-circle -black -size-m"></i>
   *             <div class="sf-notification -tooltip sf-tooltip__content -condensed">
   *              <div class="sf-notification__content">
   *                  1920 x 1200<br>
   *			        <span class="-sf-txt-upper-case">jpeg</span><br>
   *			        762.72 KB
   *              </div>
   *             </div>
   *          </div>
   *     </div>
   *      <br>
   *     <div class="sf-media -selectable -selected">
   *         <div class="sf-badge -white -icon"><i class="sf-icon sf-fa sf-fa-check-circle sf-media__selected-indicator -size-xl"></i></div>
   *         <img src="image.png">
   *         <div class="sf-tooltip sf-media__details">
   *             <i class="sf-icon sf-fa sf-fa-info-circle -black -size-m"></i>
   *             <div class="sf-notification -tooltip sf-tooltip__content -condensed">
   *              <div class="sf-notification__content">
   *                  1920 x 1200<br>
   *			        <span class="-sf-txt-upper-case">jpeg</span><br>
   *			        762.72 KB
   *              </div>
   *             </div>
   *          </div>
   *     </div>
   *     <br>
   *     <div class="sf-media -selectable -small">
   *         <div class="sf-badge -white -icon"><i class="sf-icon sf-fa sf-fa-check-circle sf-media__selected-indicator -size-xl"></i></div>
   *         <img src="image.png">
   *         <div class="sf-tooltip sf-media__details">
   *             <i class="sf-icon sf-fa sf-fa-info-circle -black -size-m"></i>
   *             <div class="sf-notification -tooltip sf-tooltip__content -condensed">
   *              <div class="sf-notification__content">
   *                  1920 x 1200<br>
   *			        <span class="-sf-txt-upper-case">jpeg</span><br>
   *			        762.72 KB
   *              </div>
   *             </div>
   *          </div>
   *     </div>
   *      <br>
    *     <div class="sf-media -selectable -selected -small">
   *         <div class="sf-badge -white -icon"><i class="sf-icon sf-fa sf-fa-check-circle sf-media__selected-indicator -size-xl"></i></div>
   *         <img src="image.png">
   *         <div class="sf-tooltip sf-media__details">
   *             <i class="sf-icon sf-fa sf-fa-info-circle -black -size-m"></i>
   *             <div class="sf-notification -tooltip sf-tooltip__hint -condensed">
   *              <div class="sf-content">
   *                  1920 x 1200<br>
   *			        <span class="-sf-txt-upper-case">jpeg</span><br>
   *			        762.72 KB
   *              </div>
   *             </div>
   *          </div>
   *     </div>
   *
   */
}

sf-app.sf-app h1, sf-app.sf-app h2, sf-app.sf-app h3, sf-app.sf-app h4, sf-app.sf-app h5, sf-app.sf-app h6,
sf-app.sf-app p, sf-app.sf-app blockquote, sf-app.sf-app pre,
sf-app.sf-app dl, sf-app.sf-app dd, sf-app.sf-app ol, sf-app.sf-app ul,
sf-app.sf-app form, sf-app.sf-app fieldset, sf-app.sf-app legend,
sf-app.sf-app table, sf-app.sf-app th, sf-app.sf-app td, sf-app.sf-app caption,
sf-app.sf-app hr {
  margin: 0;
  padding: 0;
}

sf-app.sf-app abbr[title],
sf-app.sf-app dfn[title] {
  cursor: help;
}

sf-app.sf-app u,
sf-app.sf-app ins {
  text-decoration: none;
  border-bottom: 1px solid;
}

sf-app.sf-app article,
sf-app.sf-app aside,
sf-app.sf-app details,
sf-app.sf-app figcaption,
sf-app.sf-app figure,
sf-app.sf-app footer,
sf-app.sf-app header,
sf-app.sf-app hgroup,
sf-app.sf-app main,
sf-app.sf-app nav,
sf-app.sf-app section,
sf-app.sf-app summary {
  display: block;
}

sf-app.sf-app audio,
sf-app.sf-app canvas,
sf-app.sf-app progress,
sf-app.sf-app video {
  display: inline-block; /* 1 */
  vertical-align: baseline; /* 2 */
}

sf-app.sf-app audio:not([controls]) {
  display: none;
  height: 0;
}

sf-app.sf-app [hidden],
sf-app.sf-app template {
  display: none;
}

sf-app.sf-app a {
  background: transparent;
}

sf-app.sf-app a:active,
sf-app.sf-app a:hover {
  outline: 0;
}

sf-app.sf-app abbr[title] {
  border-bottom: 1px dotted;
}

sf-app.sf-app b,
sf-app.sf-app strong {
  font-weight: bold;
}

sf-app.sf-app dfn {
  font-style: italic;
}

sf-app.sf-app h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

sf-app.sf-app mark {
  background: var(--sf-color-warning-bg, #ffc);
  color: #333;
}

sf-app.sf-app small {
  font-size: 80%;
}

sf-app.sf-app sub,
sf-app.sf-app sup {
  font-size: 75%;
  line-height: 0;
}

sf-app.sf-app img {
  border: 0;
}

sf-app.sf-app svg:not(:root) {
  overflow: hidden;
}

sf-app.sf-app figure {
  margin: 1em 40px;
}

sf-app.sf-app hr {
  box-sizing: content-box;
  height: 0;
}

sf-app.sf-app pre {
  overflow: auto;
}

sf-app.sf-app code,
sf-app.sf-app kbd,
sf-app.sf-app pre,
sf-app.sf-app samp {
  font-family: monospace;
  font-size: 1em;
}

sf-app.sf-app button,
sf-app.sf-app input,
sf-app.sf-app optgroup,
sf-app.sf-app select,
sf-app.sf-app textarea {
  color: inherit;
  font: inherit;
  margin: 0;
}

sf-app.sf-app button {
  overflow: visible;
}

sf-app.sf-app button,
sf-app.sf-app select {
  text-transform: none;
}

sf-app.sf-app button,
sf-app.sf-app sf-app.sf-app input[type=button],
sf-app.sf-app input[type=reset],
sf-app.sf-app input[type=submit] {
  -webkit-appearance: button;
          appearance: button;
  cursor: pointer;
}

sf-app.sf-app button[disabled],
sf-app.sf-app sf-app.sf-app input[disabled] {
  cursor: default;
}

sf-app.sf-app input {
  line-height: normal;
}

sf-app.sf-app input[type=checkbox],
sf-app.sf-app input[type=radio] {
  box-sizing: border-box;
  padding: 0;
}

sf-app.sf-app input[type=number]::-webkit-inner-spin-button,
sf-app.sf-app input[type=number]::-webkit-outer-spin-button {
  height: auto;
}

sf-app.sf-app input[type=search]::-webkit-search-cancel-button,
sf-app.sf-app input[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
          appearance: none;
}

sf-app.sf-app fieldset {
  margin: 0;
  padding: 0;
  border: 0;
}

sf-app.sf-app legend {
  border: 0;
  padding: 0;
}

sf-app.sf-app textarea {
  overflow: auto;
}

sf-app.sf-app optgroup {
  font-weight: bold;
}

sf-app.sf-app table {
  border-collapse: collapse;
  border-spacing: 0;
}

sf-app.sf-app td,
sf-app.sf-app th {
  padding: 0;
}

sf-app.sf-app ol {
  list-style-position: inside;
}

sf-app.sf-app *,
sf-app.sf-app *:before,
sf-app.sf-app *:after,
sf-app.sf-app sf-app.sf-app .k-editor *,
sf-app.sf-app sf-app.sf-app .k-editor *:before {
  box-sizing: border-box;
}

sf-app.sf-app a {
  color: var(--link-color);
  text-decoration: none;
  cursor: pointer;
}

sf-app.sf-app a.-secondary {
  color: var(--link-secondary-color);
}

sf-app.sf-app a.-no-hover:hover, sf-app.sf-app a.-no-hover:active, sf-app.sf-app a.-no-hover:focus {
  color: var(--link-color);
}

sf-app.sf-app a.-side {
  display: inline-block;
  margin-bottom: 2px;
  padding: 3px 6px;
  color: #333;
}

sf-app.sf-app a.-side.-active, sf-app.sf-app a.-side:focus, sf-app.sf-app a.-side:hover {
  background-color: var(--sf-link-side-color-bg);
  border-radius: 2px;
}

sf-app.sf-app a.-side-secondary {
  color: var(--link-side-secondary-color);
}

sf-app.sf-app a.-side-secondary:hover {
  color: var(--link-side-secondary-color-hover);
}

sf-app.sf-app a.-side-secondary.-active {
  color: var(--link-side-secondary-color-active);
}

sf-app.sf-app a.-basic {
  color: #333;
}

sf-app.sf-app a.-basic:hover, sf-app.sf-app a.-basic:active, sf-app.sf-app a.-basic:focus {
  color: #333;
}

sf-app.sf-app a.-top-toolbar {
  align-items: center;
  justify-content: center;
  display: inline-flex;
  padding: 0 10px;
  color: #333;
  border: 0;
  background-color: #fff;
  border-radius: 0;
  height: 100%;
}

sf-app.sf-app a.-top-toolbar.-active, sf-app.sf-app a.-top-toolbar:focus, sf-app.sf-app a.-top-toolbar:hover {
  color: #333;
  background-color: #f5f5f5;
  border-color: #eee;
}

sf-app.sf-app a:not(.sf-tabs__item):not(.-no-underline):not(.-side):not(.-side-secondary):not(.sf-nav-dropdown__item-link):not(.sf-icon):not(.sf-expand-button):hover:not(:has([class*=sf-fa])):not(:has([class*=sf-badge])):not(:has(i.fa)):not(:has(sf-icon)):not(:has([class*=sf-icon])), sf-app.sf-app a:not(.sf-tabs__item):not(.-no-underline):not(.-side):not(.-side-secondary):not(.sf-nav-dropdown__item-link):not(.sf-icon):not(.sf-expand-button):active:not(:has([class*=sf-fa])):not(:has([class*=sf-badge])):not(:has(i.fa)):not(:has(sf-icon)):not(:has([class*=sf-icon])), sf-app.sf-app a:not(.sf-tabs__item):not(.-no-underline):not(.-side):not(.-side-secondary):not(.sf-nav-dropdown__item-link):not(.sf-icon):not(.sf-expand-button):focus:not(:has([class*=sf-fa])):not(:has([class*=sf-badge])):not(:has(i.fa)):not(:has(sf-icon)):not(:has([class*=sf-icon])) {
  border-bottom: 1px solid var(--link-color-hover);
}

sf-app.sf-app a:not(.sf-tabs__item):not(.-no-underline):not(.-side):not(.-side-secondary):not(.sf-nav-dropdown__item-link):not(.sf-icon):not(.sf-expand-button):hover:has([class*=sf-fa]) > span, sf-app.sf-app a:not(.sf-tabs__item):not(.-no-underline):not(.-side):not(.-side-secondary):not(.sf-nav-dropdown__item-link):not(.sf-icon):not(.sf-expand-button):hover:has([class*=sf-icon]) > span, sf-app.sf-app a:not(.sf-tabs__item):not(.-no-underline):not(.-side):not(.-side-secondary):not(.sf-nav-dropdown__item-link):not(.sf-icon):not(.sf-expand-button):hover:has(i.fa) > span, sf-app.sf-app a:not(.sf-tabs__item):not(.-no-underline):not(.-side):not(.-side-secondary):not(.sf-nav-dropdown__item-link):not(.sf-icon):not(.sf-expand-button):hover:has(sf-icon) > span, sf-app.sf-app a:not(.sf-tabs__item):not(.-no-underline):not(.-side):not(.-side-secondary):not(.sf-nav-dropdown__item-link):not(.sf-icon):not(.sf-expand-button):active:has([class*=sf-fa]) > span, sf-app.sf-app a:not(.sf-tabs__item):not(.-no-underline):not(.-side):not(.-side-secondary):not(.sf-nav-dropdown__item-link):not(.sf-icon):not(.sf-expand-button):active:has([class*=sf-icon]) > span, sf-app.sf-app a:not(.sf-tabs__item):not(.-no-underline):not(.-side):not(.-side-secondary):not(.sf-nav-dropdown__item-link):not(.sf-icon):not(.sf-expand-button):active:has(i.fa) > span, sf-app.sf-app a:not(.sf-tabs__item):not(.-no-underline):not(.-side):not(.-side-secondary):not(.sf-nav-dropdown__item-link):not(.sf-icon):not(.sf-expand-button):active:has(sf-icon) > span, sf-app.sf-app a:not(.sf-tabs__item):not(.-no-underline):not(.-side):not(.-side-secondary):not(.sf-nav-dropdown__item-link):not(.sf-icon):not(.sf-expand-button):focus:has([class*=sf-fa]) > span, sf-app.sf-app a:not(.sf-tabs__item):not(.-no-underline):not(.-side):not(.-side-secondary):not(.sf-nav-dropdown__item-link):not(.sf-icon):not(.sf-expand-button):focus:has([class*=sf-icon]) > span, sf-app.sf-app a:not(.sf-tabs__item):not(.-no-underline):not(.-side):not(.-side-secondary):not(.sf-nav-dropdown__item-link):not(.sf-icon):not(.sf-expand-button):focus:has(i.fa) > span, sf-app.sf-app a:not(.sf-tabs__item):not(.-no-underline):not(.-side):not(.-side-secondary):not(.sf-nav-dropdown__item-link):not(.sf-icon):not(.sf-expand-button):focus:has(sf-icon) > span {
  border-bottom: 1px solid var(--link-color-hover);
}

sf-app.sf-app ul.-list-style-none, sf-app.sf-app ol.-list-style-none {
  list-style: none;
}

sf-app.sf-app ul.-list-style-disc, sf-app.sf-app ol.-list-style-disc {
  list-style-type: disc;
}

sf-app.sf-app ul.-list-style-decimal, sf-app.sf-app ol.-list-style-decimal {
  list-style-type: decimal;
}

sf-app.sf-app ul.-list-inline li, sf-app.sf-app ol.-list-inline li {
  display: inline-block;
}

sf-app.sf-app ul.-full-height, sf-app.sf-app ol.-full-height {
  height: 100%;
}

sf-app.sf-app ul.-full-height li, sf-app.sf-app ol.-full-height li {
  height: 100%;
}

sf-app.sf-app ul.-columns, sf-app.sf-app ol.-columns {
  display: grid;
  grid-template-columns: repeat(var(--sf-columns-count, 1), 1fr);
}

sf-app.sf-app ul.-side-by-side, sf-app.sf-app ol.-side-by-side {
  display: flex;
  flex-wrap: wrap;
}

sf-app.sf-app .-sf-mt-zero {
  margin-top: 0 !important;
}

sf-app.sf-app .-sf-mt-4xs {
  margin-top: 5px !important;
}

sf-app.sf-app .-sf-mt-3xs {
  margin-top: 10px !important;
}

sf-app.sf-app .-sf-mt-2xs {
  margin-top: 15px !important;
}

sf-app.sf-app .-sf-mt-xs {
  margin-top: 20px !important;
}

sf-app.sf-app .-sf-mt-s {
  margin-top: 25px !important;
}

sf-app.sf-app .-sf-mt-m {
  margin-top: 30px !important;
}

sf-app.sf-app .-sf-mt-l {
  margin-top: 35px !important;
}

sf-app.sf-app .-sf-mt-xl {
  margin-top: 40px !important;
}

sf-app.sf-app .-sf-mt-2xl {
  margin-top: 45px !important;
}

sf-app.sf-app .-sf-mt-3xl {
  margin-top: 50px !important;
}

sf-app.sf-app .-sf-mt-4xl {
  margin-top: 55px !important;
}

sf-app.sf-app .-sf-mt-5xl {
  margin-top: 60px !important;
}

sf-app.sf-app .-sf-mt-6xl {
  margin-top: 80px !important;
}

sf-app.sf-app .-sf-mt-7xl {
  margin-top: 100px !important;
}

sf-app.sf-app .-sf-mt-8xl {
  margin-top: 120px !important;
}

sf-app.sf-app .-sf-mt-9xl {
  margin-top: 140px !important;
}

sf-app.sf-app .-sf-mt-10xl {
  margin-top: 160px !important;
}

sf-app.sf-app .-sf-mt-11xl {
  margin-top: 180px !important;
}

sf-app.sf-app .-sf-mt-12xl {
  margin-top: 200px !important;
}

sf-app.sf-app .-sf-mb-zero {
  margin-bottom: 0 !important;
}

sf-app.sf-app .-sf-mb-4xs {
  margin-bottom: 5px !important;
}

sf-app.sf-app .-sf-mb-3xs {
  margin-bottom: 10px !important;
}

sf-app.sf-app .-sf-mb-2xs {
  margin-bottom: 15px !important;
}

sf-app.sf-app .-sf-mb-xs {
  margin-bottom: 20px !important;
}

sf-app.sf-app .-sf-mb-s {
  margin-bottom: 25px !important;
}

sf-app.sf-app .-sf-mb-m {
  margin-bottom: 30px !important;
}

sf-app.sf-app .-sf-mb-l {
  margin-bottom: 35px !important;
}

sf-app.sf-app .-sf-mb-xl {
  margin-bottom: 40px !important;
}

sf-app.sf-app .-sf-mb-2xl {
  margin-bottom: 45px !important;
}

sf-app.sf-app .-sf-mb-3xl {
  margin-bottom: 50px !important;
}

sf-app.sf-app .-sf-mb-4xl {
  margin-bottom: 55px !important;
}

sf-app.sf-app .-sf-mb-5xl {
  margin-bottom: 60px !important;
}

sf-app.sf-app .-sf-mb-6xl {
  margin-bottom: 80px !important;
}

sf-app.sf-app .-sf-mb-7xl {
  margin-bottom: 100px !important;
}

sf-app.sf-app .-sf-mb-8xl {
  margin-bottom: 120px !important;
}

sf-app.sf-app .-sf-ml-zero {
  margin-left: 0 !important;
}

sf-app.sf-app .-sf-ml-4xs {
  margin-left: 5px !important;
}

sf-app.sf-app .-sf-ml-3xs {
  margin-left: 10px !important;
}

sf-app.sf-app .-sf-ml-2xs {
  margin-left: 15px !important;
}

sf-app.sf-app .-sf-ml-xs {
  margin-left: 20px !important;
}

sf-app.sf-app .-sf-ml-s {
  margin-left: 25px !important;
}

sf-app.sf-app .-sf-ml-m {
  margin-left: 30px !important;
}

sf-app.sf-app .-sf-ml-l {
  margin-left: 35px !important;
}

sf-app.sf-app .-sf-ml-xl {
  margin-left: 40px !important;
}

sf-app.sf-app .-sf-ml-2xl {
  margin-left: 45px !important;
}

sf-app.sf-app .-sf-ml-3xl {
  margin-left: 50px !important;
}

sf-app.sf-app .-sf-ml-4xl {
  margin-left: 55px !important;
}

sf-app.sf-app .-sf-ml-5xl {
  margin-left: 60px !important;
}

sf-app.sf-app .-sf-ml-6xl {
  margin-left: 80px !important;
}

sf-app.sf-app .-sf-ml-7xl {
  margin-left: 100px !important;
}

sf-app.sf-app .-sf-ml-8xl {
  margin-left: 120px !important;
}

sf-app.sf-app .-sf-mr-zero {
  margin-right: 0 !important;
}

sf-app.sf-app .-sf-mr-4xs {
  margin-right: 5px !important;
}

sf-app.sf-app .-sf-mr-3xs {
  margin-right: 10px !important;
}

sf-app.sf-app .-sf-mr-2xs {
  margin-right: 15px !important;
}

sf-app.sf-app .-sf-mr-xs {
  margin-right: 20px !important;
}

sf-app.sf-app .-sf-mr-s {
  margin-right: 25px !important;
}

sf-app.sf-app .-sf-mr-m {
  margin-right: 30px !important;
}

sf-app.sf-app .-sf-mr-l {
  margin-right: 35px !important;
}

sf-app.sf-app .-sf-mr-xl {
  margin-right: 40px !important;
}

sf-app.sf-app .-sf-mr-2xl {
  margin-right: 45px !important;
}

sf-app.sf-app .-sf-mr-3xl {
  margin-right: 50px !important;
}

sf-app.sf-app .-sf-mr-4xl {
  margin-right: 55px !important;
}

sf-app.sf-app .-sf-mr-5xl {
  margin-right: 60px !important;
}

sf-app.sf-app .-sf-mr-6xl {
  margin-right: 80px !important;
}

sf-app.sf-app .-sf-mr-7xl {
  margin-right: 100px !important;
}

sf-app.sf-app .-sf-mr-8xl {
  margin-right: 120px !important;
}

sf-app.sf-app .-sf-m-zero {
  margin: 0 !important;
}

sf-app.sf-app .-sf-m-4xs {
  margin: 5px !important;
}

sf-app.sf-app .-sf-m-3xs {
  margin: 10px !important;
}

sf-app.sf-app .-sf-m-2xs {
  margin: 15px !important;
}

sf-app.sf-app .-sf-m-xs {
  margin: 20px !important;
}

sf-app.sf-app .-sf-m-s {
  margin: 25px !important;
}

sf-app.sf-app .-sf-m-m {
  margin: 30px !important;
}

sf-app.sf-app .-sf-m-l {
  margin: 35px !important;
}

sf-app.sf-app .-sf-m-xl {
  margin: 40px !important;
}

sf-app.sf-app .-sf-m-2xl {
  margin: 45px !important;
}

sf-app.sf-app .-sf-m-3xl {
  margin: 50px !important;
}

sf-app.sf-app .-sf-m-4xl {
  margin: 55px !important;
}

sf-app.sf-app .-sf-m-5xl {
  margin: 60px !important;
}

sf-app.sf-app .-sf-m-6xl {
  margin: 80px !important;
}

sf-app.sf-app .-sf-m-7xl {
  margin: 100px !important;
}

sf-app.sf-app .-sf-m-8xl {
  margin: 120px !important;
}

sf-app.sf-app .-sf-mt-8xs {
  margin-top: 1px !important;
}

sf-app.sf-app .-sf-mt-7xs {
  margin-top: 2px !important;
}

sf-app.sf-app .-sf-mt-6xs {
  margin-top: 3px !important;
}

sf-app.sf-app .-sf-mt-5xs {
  margin-top: 4px !important;
}

sf-app.sf-app .-sf-mb-8xs {
  margin-bottom: 1px !important;
}

sf-app.sf-app .-sf-mb-7xs {
  margin-bottom: 2px !important;
}

sf-app.sf-app .-sf-mb-6xs {
  margin-bottom: 3px !important;
}

sf-app.sf-app .-sf-mb-5xs {
  margin-bottom: 4px !important;
}

sf-app.sf-app .-sf-ml-8xs {
  margin-left: 1px !important;
}

sf-app.sf-app .-sf-ml-7xs {
  margin-left: 2px !important;
}

sf-app.sf-app .-sf-ml-6xs {
  margin-left: 3px !important;
}

sf-app.sf-app .-sf-ml-5xs {
  margin-left: 4px !important;
}

sf-app.sf-app .-sf-mr-8xs {
  margin-right: 1px !important;
}

sf-app.sf-app .-sf-mr-7xs {
  margin-right: 2px !important;
}

sf-app.sf-app .-sf-mr-6xs {
  margin-right: 3px !important;
}

sf-app.sf-app .-sf-mr-5xs {
  margin-right: 4px !important;
}

sf-app.sf-app .-sf-mt--4xs {
  margin-top: -5px !important;
}

sf-app.sf-app .-sf-mt--3xs {
  margin-top: -10px !important;
}

sf-app.sf-app .-sf-mt--2xs {
  margin-top: -15px !important;
}

sf-app.sf-app .-sf-mt--xs {
  margin-top: -20px !important;
}

sf-app.sf-app .-sf-mt--s {
  margin-top: -25px !important;
}

sf-app.sf-app .-sf-mt--m {
  margin-top: -30px !important;
}

sf-app.sf-app .-sf-mt--l {
  margin-top: -35px !important;
}

sf-app.sf-app .-sf-mt--xl {
  margin-top: -40px !important;
}

sf-app.sf-app .-sf-mt--2xl {
  margin-top: -45px !important;
}

sf-app.sf-app .-sf-mt--3xl {
  margin-top: -50px !important;
}

sf-app.sf-app .-sf-mt--4xl {
  margin-top: -55px !important;
}

sf-app.sf-app .-sf-mt--5xl {
  margin-top: -60px !important;
}

sf-app.sf-app .-sf-mt--6xl {
  margin-top: -80px !important;
}

sf-app.sf-app .-sf-mb--4xs {
  margin-bottom: -5px !important;
}

sf-app.sf-app .-sf-mb--3xs {
  margin-bottom: -10px !important;
}

sf-app.sf-app .-sf-mb--2xs {
  margin-bottom: -15px !important;
}

sf-app.sf-app .-sf-mb--xs {
  margin-bottom: -20px !important;
}

sf-app.sf-app .-sf-mb--s {
  margin-bottom: -25px !important;
}

sf-app.sf-app .-sf-mb--m {
  margin-bottom: -30px !important;
}

sf-app.sf-app .-sf-mb--l {
  margin-bottom: -35px !important;
}

sf-app.sf-app .-sf-mb--xl {
  margin-bottom: -40px !important;
}

sf-app.sf-app .-sf-mb--2xl {
  margin-bottom: -45px !important;
}

sf-app.sf-app .-sf-mb--3xl {
  margin-bottom: -50px !important;
}

sf-app.sf-app .-sf-mb--4xl {
  margin-bottom: -55px !important;
}

sf-app.sf-app .-sf-mb--5xl {
  margin-bottom: -60px !important;
}

sf-app.sf-app .-sf-mb--6xl {
  margin-bottom: -80px !important;
}

sf-app.sf-app .-sf-ml--4xs {
  margin-left: -5px !important;
}

sf-app.sf-app .-sf-ml--3xs {
  margin-left: -10px !important;
}

sf-app.sf-app .-sf-ml--2xs {
  margin-left: -15px !important;
}

sf-app.sf-app .-sf-ml--xs {
  margin-left: -20px !important;
}

sf-app.sf-app .-sf-ml--s {
  margin-left: -25px !important;
}

sf-app.sf-app .-sf-ml--m {
  margin-left: -30px !important;
}

sf-app.sf-app .-sf-ml--l {
  margin-left: -35px !important;
}

sf-app.sf-app .-sf-ml--xl {
  margin-left: -40px !important;
}

sf-app.sf-app .-sf-ml--2xl {
  margin-left: -45px !important;
}

sf-app.sf-app .-sf-ml--3xl {
  margin-left: -50px !important;
}

sf-app.sf-app .-sf-ml--4xl {
  margin-left: -55px !important;
}

sf-app.sf-app .-sf-ml--5xl {
  margin-left: -60px !important;
}

sf-app.sf-app .-sf-ml--6xl {
  margin-left: -80px !important;
}

sf-app.sf-app .-sf-mr--4xs {
  margin-right: -5px !important;
}

sf-app.sf-app .-sf-mr--3xs {
  margin-right: -10px !important;
}

sf-app.sf-app .-sf-mr--2xs {
  margin-right: -15px !important;
}

sf-app.sf-app .-sf-mr--xs {
  margin-right: -20px !important;
}

sf-app.sf-app .-sf-mr--s {
  margin-right: -25px !important;
}

sf-app.sf-app .-sf-mr--m {
  margin-right: -30px !important;
}

sf-app.sf-app .-sf-mr--l {
  margin-right: -35px !important;
}

sf-app.sf-app .-sf-mr--xl {
  margin-right: -40px !important;
}

sf-app.sf-app .-sf-mr--2xl {
  margin-right: -45px !important;
}

sf-app.sf-app .-sf-mr--3xl {
  margin-right: -50px !important;
}

sf-app.sf-app .-sf-mr--4xl {
  margin-right: -55px !important;
}

sf-app.sf-app .-sf-mr--5xl {
  margin-right: -60px !important;
}

sf-app.sf-app .-sf-mr--6xl {
  margin-right: -80px !important;
}

sf-app.sf-app .-sf-pt-zero {
  padding-top: 0 !important;
}

sf-app.sf-app .-sf-pt-4xs {
  padding-top: 5px !important;
}

sf-app.sf-app .-sf-pt-3xs {
  padding-top: 10px !important;
}

sf-app.sf-app .-sf-pt-2xs {
  padding-top: 15px !important;
}

sf-app.sf-app .-sf-pt-xs {
  padding-top: 20px !important;
}

sf-app.sf-app .-sf-pt-s {
  padding-top: 25px !important;
}

sf-app.sf-app .-sf-pt-m {
  padding-top: 30px !important;
}

sf-app.sf-app .-sf-pt-l {
  padding-top: 35px !important;
}

sf-app.sf-app .-sf-pt-xl {
  padding-top: 40px !important;
}

sf-app.sf-app .-sf-pt-2xl {
  padding-top: 45px !important;
}

sf-app.sf-app .-sf-pt-3xl {
  padding-top: 50px !important;
}

sf-app.sf-app .-sf-pt-4xl {
  padding-top: 55px !important;
}

sf-app.sf-app .-sf-pt-5xl {
  padding-top: 60px !important;
}

sf-app.sf-app .-sf-pt-6xl {
  padding-top: 80px !important;
}

sf-app.sf-app .-sf-pt-7xl {
  padding-top: 100px !important;
}

sf-app.sf-app .-sf-pt-8xl {
  padding-top: 120px !important;
}

sf-app.sf-app .-sf-pb-zero {
  padding-bottom: 0 !important;
}

sf-app.sf-app .-sf-pb-4xs {
  padding-bottom: 5px !important;
}

sf-app.sf-app .-sf-pb-3xs {
  padding-bottom: 10px !important;
}

sf-app.sf-app .-sf-pb-2xs {
  padding-bottom: 15px !important;
}

sf-app.sf-app .-sf-pb-xs {
  padding-bottom: 20px !important;
}

sf-app.sf-app .-sf-pb-s {
  padding-bottom: 25px !important;
}

sf-app.sf-app .-sf-pb-m {
  padding-bottom: 30px !important;
}

sf-app.sf-app .-sf-pb-l {
  padding-bottom: 35px !important;
}

sf-app.sf-app .-sf-pb-xl {
  padding-bottom: 40px !important;
}

sf-app.sf-app .-sf-pb-2xl {
  padding-bottom: 45px !important;
}

sf-app.sf-app .-sf-pb-3xl {
  padding-bottom: 50px !important;
}

sf-app.sf-app .-sf-pb-4xl {
  padding-bottom: 55px !important;
}

sf-app.sf-app .-sf-pb-5xl {
  padding-bottom: 60px !important;
}

sf-app.sf-app .-sf-pb-6xl {
  padding-bottom: 80px !important;
}

sf-app.sf-app .-sf-pb-7xl {
  padding-bottom: 100px !important;
}

sf-app.sf-app .-sf-pb-8xl {
  padding-bottom: 120px !important;
}

sf-app.sf-app .-sf-pl-zero {
  padding-left: 0 !important;
}

sf-app.sf-app .-sf-pl-4xs {
  padding-left: 5px !important;
}

sf-app.sf-app .-sf-pl-3xs {
  padding-left: 10px !important;
}

sf-app.sf-app .-sf-pl-2xs {
  padding-left: 15px !important;
}

sf-app.sf-app .-sf-pl-xs {
  padding-left: 20px !important;
}

sf-app.sf-app .-sf-pl-s {
  padding-left: 25px !important;
}

sf-app.sf-app .-sf-pl-m {
  padding-left: 30px !important;
}

sf-app.sf-app .-sf-pl-l {
  padding-left: 35px !important;
}

sf-app.sf-app .-sf-pl-xl {
  padding-left: 40px !important;
}

sf-app.sf-app .-sf-pl-2xl {
  padding-left: 45px !important;
}

sf-app.sf-app .-sf-pl-3xl {
  padding-left: 50px !important;
}

sf-app.sf-app .-sf-pl-4xl {
  padding-left: 55px !important;
}

sf-app.sf-app .-sf-pl-5xl {
  padding-left: 60px !important;
}

sf-app.sf-app .-sf-pl-6xl {
  padding-left: 80px !important;
}

sf-app.sf-app .-sf-pl-7xl {
  padding-left: 100px !important;
}

sf-app.sf-app .-sf-pl-8xl {
  padding-left: 120px !important;
}

sf-app.sf-app .-sf-pr-zero {
  padding-right: 0 !important;
}

sf-app.sf-app .-sf-pr-4xs {
  padding-right: 5px !important;
}

sf-app.sf-app .-sf-pr-3xs {
  padding-right: 10px !important;
}

sf-app.sf-app .-sf-pr-2xs {
  padding-right: 15px !important;
}

sf-app.sf-app .-sf-pr-xs {
  padding-right: 20px !important;
}

sf-app.sf-app .-sf-pr-s {
  padding-right: 25px !important;
}

sf-app.sf-app .-sf-pr-m {
  padding-right: 30px !important;
}

sf-app.sf-app .-sf-pr-l {
  padding-right: 35px !important;
}

sf-app.sf-app .-sf-pr-xl {
  padding-right: 40px !important;
}

sf-app.sf-app .-sf-pr-2xl {
  padding-right: 45px !important;
}

sf-app.sf-app .-sf-pr-3xl {
  padding-right: 50px !important;
}

sf-app.sf-app .-sf-pr-4xl {
  padding-right: 55px !important;
}

sf-app.sf-app .-sf-pr-5xl {
  padding-right: 60px !important;
}

sf-app.sf-app .-sf-pr-6xl {
  padding-right: 80px !important;
}

sf-app.sf-app .-sf-pr-7xl {
  padding-right: 100px !important;
}

sf-app.sf-app .-sf-pr-8xl {
  padding-right: 120px !important;
}

sf-app.sf-app .-sf-p-zero {
  padding: 0 !important;
}

sf-app.sf-app .-sf-p-4xs {
  padding: 5px !important;
}

sf-app.sf-app .-sf-p-3xs {
  padding: 10px !important;
}

sf-app.sf-app .-sf-p-2xs {
  padding: 15px !important;
}

sf-app.sf-app .-sf-p-xs {
  padding: 20px !important;
}

sf-app.sf-app .-sf-p-s {
  padding: 25px !important;
}

sf-app.sf-app .-sf-p-m {
  padding: 30px !important;
}

sf-app.sf-app .-sf-p-l {
  padding: 35px !important;
}

sf-app.sf-app .-sf-p-xl {
  padding: 40px !important;
}

sf-app.sf-app .-sf-p-2xl {
  padding: 45px !important;
}

sf-app.sf-app .-sf-p-3xl {
  padding: 50px !important;
}

sf-app.sf-app .-sf-p-4xl {
  padding: 55px !important;
}

sf-app.sf-app .-sf-p-5xl {
  padding: 60px !important;
}

sf-app.sf-app .-sf-p-6xl {
  padding: 80px !important;
}

sf-app.sf-app .-sf-p-7xl {
  padding: 100px !important;
}

sf-app.sf-app .-sf-p-8xl {
  padding: 120px !important;
}

sf-app.sf-app .-sf-pt-8xs {
  padding-top: 1px !important;
}

sf-app.sf-app .-sf-pt-7xs {
  padding-top: 2px !important;
}

sf-app.sf-app .-sf-pt-6xs {
  padding-top: 3px !important;
}

sf-app.sf-app .-sf-pt-5xs {
  padding-top: 4px !important;
}

sf-app.sf-app .-sf-pb-8xs {
  padding-bottom: 1px !important;
}

sf-app.sf-app .-sf-pb-7xs {
  padding-bottom: 2px !important;
}

sf-app.sf-app .-sf-pb-6xs {
  padding-bottom: 3px !important;
}

sf-app.sf-app .-sf-pb-5xs {
  padding-bottom: 4px !important;
}

sf-app.sf-app .-sf-pl-8xs {
  padding-left: 1px !important;
}

sf-app.sf-app .-sf-pl-7xs {
  padding-left: 2px !important;
}

sf-app.sf-app .-sf-pl-6xs {
  padding-left: 3px !important;
}

sf-app.sf-app .-sf-pl-5xs {
  padding-left: 4px !important;
}

sf-app.sf-app .-sf-pr-8xs {
  padding-right: 1px !important;
}

sf-app.sf-app .-sf-pr-7xs {
  padding-right: 2px !important;
}

sf-app.sf-app .-sf-pr-6xs {
  padding-right: 3px !important;
}

sf-app.sf-app .-sf-pr-5xs {
  padding-right: 4px !important;
}

sf-app.sf-app .-sf-ml-auto {
  margin-left: auto !important;
}

sf-app.sf-app .-sf-mr-auto {
  margin-right: auto !important;
}

sf-app.sf-app .-sf-ml-50 {
  margin-left: 50% !important;
}

sf-app.sf-app .-sf-mr-50 {
  margin-right: 50% !important;
}

sf-app.sf-app .-sf-border-top {
  border-top: 1px solid var(--sf-color-secondary, #ccc);
}

sf-app.sf-app .-sf-border-bottom {
  border-bottom: 1px solid var(--sf-color-secondary, #ccc);
}

sf-app.sf-app .-sf-border-bottom-transparent {
  border-bottom: 1px solid transparent;
}

sf-app.sf-app .-sf-border-left {
  border-left: 1px solid var(--sf-color-secondary, #ccc);
}

sf-app.sf-app .-sf-border-right {
  border-right: 1px solid var(--sf-color-secondary, #ccc);
}

sf-app.sf-app .-sf-border {
  border: 1px solid var(--sf-color-secondary, #ccc);
}

sf-app.sf-app .-sf-border-lighter {
  border-color: var(--sf-color-secondary-lighter, #e4e4e4);
}

sf-app.sf-app .-sf-border-lightest {
  border-color: #eee;
}

sf-app.sf-app .-sf-border-radius-5 {
  border-radius: 5px;
}

sf-app.sf-app .-sf-border-info {
  border: 2px solid var(--sf-color-info-bg, #dcecf5) !important;
}

sf-app.sf-app .-sf-border-thick {
  border-width: 2px !important;
}

sf-app.sf-app .-sf-centered-box {
  margin-left: auto;
  margin-right: auto;
}

sf-app.sf-app .-sf-centered-vertical-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
}

sf-app.sf-app .-sf-full-height {
  height: 100% !important;
}

sf-app.sf-app .-sf-auto-height {
  height: auto !important;
}

sf-app.sf-app .-sf-full-width {
  width: 100% !important;
}

sf-app.sf-app .-sf-disabled {
  pointer-events: none;
  cursor: default;
}

sf-app.sf-app .-sf-clickable {
  cursor: pointer;
}

sf-app.sf-app .-sf-cursor-text {
  cursor: text;
}

sf-app.sf-app .-sf-user-select-none {
  -webkit-user-select: none;
          user-select: none;
}

sf-app.sf-app .-sf-overlay {
  position: fixed;
  inset: 0;
  z-index: 100000000;
}

sf-app.sf-app .-sf-txt-body {
  font-size: var(--font-size-base);
  font-weight: normal;
  color: #333;
}

sf-app.sf-app .-sf-txt-hint {
  color: var(--sf-secondary-text-color);
}

sf-app.sf-app .-sf-txt-primary-invert {
  color: #333;
}

sf-app.sf-app .-sf-txt-dimmed {
  color: var(--sf-secondary-text-color);
}

sf-app.sf-app .-sf-txt-success {
  color: var(--sf-color-success, #38ab63);
}

sf-app.sf-app .-sf-txt-failure {
  color: var(--sf-color-error, #ff4848);
}

sf-app.sf-app .-sf-txt-align-left {
  text-align: left;
}

sf-app.sf-app .-sf-txt-align-right {
  text-align: right;
}

sf-app.sf-app .-sf-txt-align-center {
  text-align: center;
}

sf-app.sf-app .-sf-txt-vertical-align-middle {
  vertical-align: middle;
}

sf-app.sf-app .-sf-txt-vertical-align-top {
  vertical-align: top;
}

sf-app.sf-app .-sf-txt-nowrap {
  white-space: nowrap;
}

sf-app.sf-app .-sf-txt-pre-wrap {
  white-space: pre-wrap;
}

sf-app.sf-app .-sf-txt-lower-case {
  text-transform: lowercase;
}

sf-app.sf-app .-sf-txt-upper-case {
  text-transform: uppercase;
}

sf-app.sf-app .-sf-overflow-hidden {
  overflow: hidden;
}

sf-app.sf-app .-sf-overflow-auto {
  overflow: auto;
}

sf-app.sf-app .-sf-overflow-visible {
  overflow: visible !important;
}

sf-app.sf-app .-sf-txt-code {
  font-family: "Courier New Regular", "Courier New", Courier, monospace;
}

sf-app.sf-app .-sf-overflow-ellipsis {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

sf-app.sf-app .-sf-wrap-ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
}

sf-app.sf-app .-sf-ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: break-word;
}

sf-app.sf-app .-sf-overflow-multiline-ellipsis {
  display: block;
  display: flex;
  word-break: break-all;
  max-height: 3em;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

sf-app.sf-app .-sf-word-break-all {
  word-break: break-all;
}

sf-app.sf-app .-sf-word-break-word {
  word-break: break-word;
}

sf-app.sf-app .-sf-direction-rtl {
  direction: rtl;
  text-align: right;
}

sf-app.sf-app .-sf-direction-ltr {
  direction: ltr;
  text-align: left;
}

sf-app.sf-app .-sf-txt-large {
  font-size: var(--font-size-lg);
}

sf-app.sf-app .-sf-txt-small {
  font-size: var(--font-size-h5);
}

sf-app.sf-app .-sf-txt-base {
  font-size: var(--font-size-base);
}

sf-app.sf-app .-sf-hidden {
  display: none !important;
}

sf-app.sf-app .-sf-invisible {
  visibility: hidden !important;
}

sf-app.sf-app .-sf-block {
  display: block !important;
}

sf-app.sf-app .-sf-inline-block {
  display: inline-block !important;
}

sf-app.sf-app .-sf-flex {
  display: flex !important;
}

sf-app.sf-app .-sf-flex-shrink-0 {
  flex-shrink: 0 !important;
}

sf-app.sf-app .-sf-flex-grow-0 {
  flex-grow: 0 !important;
}

sf-app.sf-app .-sf-flex-wrap {
  flex-wrap: wrap !important;
}

sf-app.sf-app .-sf-flex-gap-row-4xs {
  row-gap: 5px !important;
}

sf-app.sf-app .-sf-inline-flex {
  display: inline-flex !important;
}

sf-app.sf-app .-sf-absolute {
  position: absolute !important;
}

sf-app.sf-app .-sf-relative {
  position: relative !important;
}

sf-app.sf-app .-sf-static {
  position: static !important;
}

sf-app.sf-app .-sf-transparent {
  opacity: 0;
}

sf-app.sf-app .-sf-align-items-center {
  align-items: center !important;
}

sf-app.sf-app .-sf-align-self-center {
  align-self: center !important;
}

sf-app.sf-app .-sf-align-self-start {
  align-self: flex-start !important;
}

sf-app.sf-app .-sf-justify-content-end {
  justify-content: flex-end !important;
}

sf-app.sf-app .-sf-justify-content-start {
  justify-content: flex-start !important;
}

sf-app.sf-app .-sf-justify-content-center {
  justify-content: center !important;
}

sf-app.sf-app .-sf-visually-hidden {
  padding: 0;
  position: absolute;
  height: 1px;
  width: 1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
  border: 0;
}

sf-app.sf-app .-sf-img-fit-cover {
  width: 100%;
  height: 100%;
  object-fit: cover;
  overflow: hidden;
}

sf-app.sf-app .-sf-rotate-90 {
  transform: rotate(90deg);
}

sf-app.sf-app .-sf-rotate--90 {
  transform: rotate(-90deg);
}

sf-app.sf-app .-sf-rotate-180 {
  transform: rotate(180deg);
}

sf-app.sf-app .-sf-width-1 {
  width: 8.3333333333% !important;
}

sf-app.sf-app .-sf-width-2 {
  width: 16.6666666667% !important;
}

sf-app.sf-app .-sf-width-3 {
  width: 25% !important;
}

sf-app.sf-app .-sf-width-4 {
  width: 33.3333333333% !important;
}

sf-app.sf-app .-sf-width-5 {
  width: 41.6666666667% !important;
}

sf-app.sf-app .-sf-width-6 {
  width: 50% !important;
}

sf-app.sf-app .-sf-width-7 {
  width: 58.3333333333% !important;
}

sf-app.sf-app .-sf-width-8 {
  width: 66.6666666667% !important;
}

sf-app.sf-app .-sf-width-9 {
  width: 75% !important;
}

sf-app.sf-app .-sf-width-10 {
  width: 83.3333333333% !important;
}

sf-app.sf-app .-sf-width-11 {
  width: 91.6666666667% !important;
}

sf-app.sf-app .-sf-width-12 {
  width: 100% !important;
}

sf-app.sf-app .-sf-width-form-small {
  width: 410px !important;
}

sf-app.sf-app .-sf-width-form-medium {
  width: var(--form-width-medium) !important;
}

sf-app.sf-app .-sf-width-form-large {
  width: 1000px !important;
}

sf-app.sf-app .-sf-max-width-form-xsmall {
  max-width: 220px !important;
}

sf-app.sf-app .-sf-max-width-form-2xsmall {
  max-width: 157px !important;
}

sf-app.sf-app .-sf-max-width-form-large {
  max-width: 1000px !important;
}

sf-app.sf-app .-sf-width-100 {
  width: 100% !important;
}

sf-app.sf-app .-sf-width-75 {
  width: 75% !important;
}

sf-app.sf-app .-sf-width-50 {
  width: 50% !important;
}

sf-app.sf-app .-sf-width-25 {
  width: 25% !important;
}

sf-app.sf-app .-sf-max-width-100 {
  max-width: 100% !important;
}

sf-app.sf-app .-sf-width-auto {
  width: auto !important;
}

sf-app.sf-app .-sf-min-width-form-3xsmall {
  min-width: 60px !important;
}

sf-app.sf-app .-sf-min-width-form-4xsmall {
  min-width: 40px !important;
}

sf-app.sf-app .-sf-min-width-zero {
  min-width: 0 !important;
}

sf-app.sf-app .-sf-clearfix::after {
  display: table;
  content: "";
  clear: both;
}

sf-app.sf-app .-sf-pull-left {
  float: left;
}

sf-app.sf-app .-sf-hover-bg-light-grey:hover {
  background: #f5f5f5 !important;
}

sf-app.sf-app .-sf-bg-light-grey {
  background-color: #f5f5f5 !important;
}

sf-app.sf-app .-sf-bg-primary {
  background: #fff !important;
}

sf-app.sf-app .-sf-bg-primary-variant {
  background-color: #f5f5f5;
}

sf-app.sf-app .-sf-bg-info {
  background-color: var(--sf-color-info-bg, #dcecf5) !important;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
sf-app.sf-app .-sf-fade-in {
  animation: 0.4s ease-in fadeIn;
}

sf-app.sf-app h1,
sf-app.sf-app .h1 {
  font-family: "Open Sans Condensed", sans-serif;
  font-size: var(--font-size-h1);
  font-weight: bold;
  line-height: 1.3;
  margin-top: 0;
  margin-bottom: 0;
}

sf-app.sf-app h2,
sf-app.sf-app .h2 {
  font-size: var(--font-size-h2);
  font-weight: 300;
  line-height: 1.3;
  color: var(--sf-color-h2);
  margin-top: 0;
  margin-bottom: 0;
}

sf-app.sf-app h3,
sf-app.sf-app .h3 {
  font-family: "Open Sans Condensed", sans-serif;
  font-size: var(--font-size-h3);
  font-weight: bold;
  line-height: 1.3;
  margin-top: 0;
  margin-bottom: 0;
}

sf-app.sf-app h4,
sf-app.sf-app .h4 {
  font-size: var(--font-size-h4);
  font-weight: bold;
  margin-top: 0;
  margin-bottom: 0;
}

sf-app.sf-app h5,
sf-app.sf-app .h5 {
  font-size: var(--font-size-h5);
  font-weight: normal;
  color: var(--sf-color-h5);
  text-transform: uppercase;
  margin-top: 0;
  margin-bottom: 0;
}

sf-app.sf-app h1.-sf-h-large {
  font-size: var(--font-size-h1-lg);
}

sf-app.sf-app .h1.-sf-h-large {
  font-size: var(--font-size-h1-lg);
}

sf-app.sf-app h4.-sf-h-large {
  font-size: var(--font-size-h4-lg);
}

sf-app.sf-app .h4.-sf-h-large {
  font-size: var(--font-size-h4-lg);
}

sf-app.sf-app p {
  margin-bottom: calc(var(--font-size-base) * 1.4);
}

sf-app.sf-app .sf-breadcrumb {
  color: var(--sf-secondary-text-color);
}

sf-app.sf-app .-sf-breadcrumb-last-item-color {
  color: var(--sf-breadcrumb-last-item-color);
}

sf-app.sf-app .sf-tabs {
  display: flex;
  justify-content: center;
}

sf-app.sf-app .sf-tabs.-large {
  font-size: var(--font-size-lg);
}

sf-app.sf-app .sf-tabs__item {
  margin-left: 15px;
  margin-right: 15px;
  position: relative;
}

sf-app.sf-app .sf-tabs__item.sf-link:hover, sf-app.sf-app .sf-tabs__item.sf-link:focus {
  border-bottom: 2px solid var(--link-color);
}

sf-app.sf-app .sf-tabs__item.sf-link.-single-line-underline:hover, sf-app.sf-app .sf-tabs__item.sf-link.-single-line-underline:focus {
  border-bottom: 1px solid var(--link-color);
}

sf-app.sf-app .sf-tabs__item.-selected {
  padding-bottom: 5px;
}

sf-app.sf-app .sf-tabs__item.-selected, sf-app.sf-app .sf-tabs__item.-selected:hover, sf-app.sf-app .sf-tabs__item.-selected:active, sf-app.sf-app .sf-tabs__item.-selected:focus {
  color: #333;
  border-bottom: 2px solid var(--sf-color-secondary-dark, #777);
}

sf-app.sf-app .sf-tabs__item.-selected .sf-button.-link {
  color: #333;
}

sf-app.sf-app .sf-tabs__badge {
  position: absolute;
  top: 0;
  font-size: var(--font-size-base);
  margin-left: 5px;
}

sf-app.sf-app .sf-tabs.-wide .sf-tabs__item {
  text-align: center;
  margin-inline: 0;
  padding-inline: 25px;
  padding-bottom: 10px;
  min-width: 135px;
}

sf-app.sf-app .sf-icon {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  height: 1em;
  width: 1em;
  font-size: var(--default-icon-size);
  font-style: normal;
  color: var(--default-icon-color);
}

sf-app.sf-app .sf-icon.-close::before {
  content: "\2716";
}

sf-app.sf-app .sf-icon.-illustrative {
  font-size: var(--icon-illustrative-font-size);
  color: var(--icon-illustrative-font-color);
  width: var(--icon-illustrative-size);
  height: var(--icon-illustrative-size);
  border-radius: 50%;
  background: transparent;
  border: 1px solid var(--icon-illustrative-font-color);
}

sf-app.sf-app .sf-icon.-illustrative.-size-3xl {
  width: var(--icon-illustrative-size-sm);
  height: var(--icon-illustrative-size-sm);
}

sf-app.sf-app .sf-icon.-light {
  color: var(--sf-color-secondary-dark, var(--icon-light-color));
}

sf-app.sf-app .sf-icon.-faq {
  width: var(--icon-faq-size);
  height: var(--icon-faq-size);
  border-radius: 50%;
  background: #fff;
  line-height: var(--icon-faq-size);
  box-shadow: 0 3px 5px rgba(228, 228, 228, 0.5);
}

sf-app.sf-app .sf-icon.-form-size {
  font-size: var(--icon-form-size);
  line-height: var(--icon-form-size);
}

sf-app.sf-app .sf-icon.-zone-editor {
  font-size: var(--icon-zone-editor-size);
}

sf-app.sf-app .sf-icon.-zone-editor.-custom-icon {
  width: var(--icon-zone-editor-size);
  height: var(--icon-zone-editor-size);
}

sf-app.sf-app .sf-icon.-zone-editor.-custom-icon::before {
  -webkit-mask-size: var(--icon-zone-editor-size);
          mask-size: var(--icon-zone-editor-size);
}

sf-app.sf-app .sf-icon.-zone-editor.-custom-icon .sf-icon__font-icon {
  display: none !important;
}

sf-app.sf-app .sf-icon.-lightest {
  color: var(--sf-color-secondary, #ccc);
}

sf-app.sf-app .sf-icon.-lighter {
  color: var(--icon-lighter-color);
}

sf-app.sf-app .sf-icon.-darker {
  color: var(--sf-color-secondary-dark, #999);
}

sf-app.sf-app .sf-icon.-darkest {
  color: var(--sf-icon-darkest-color, var(--sf-color-secondary-dark, #777));
}

sf-app.sf-app .sf-icon.-black {
  color: #333;
}

sf-app.sf-app .sf-icon.-color-inherit {
  color: inherit;
}

sf-app.sf-app .sf-icon.-white {
  color: #fff;
}

sf-app.sf-app .sf-icon.-positive {
  color: var(--icon-positive-color);
}

sf-app.sf-app .sf-icon.-negative {
  color: var(--icon-negative-color);
}

sf-app.sf-app .sf-icon.-square {
  padding: 5px;
  border: 2px solid currentColor;
}

sf-app.sf-app .sf-icon.-document {
  font-size: var(--icon-document);
}

sf-app.sf-app .sf-icon.-tree-icon {
  font-size: var(--icon-tree-font-size);
}

sf-app.sf-app .sf-icon.sf-link:hover {
  color: var(--icon-link-color-hover);
}

sf-app.sf-app .sf-icon.-tile {
  padding: 5px;
  border: 1px solid currentColor;
  border-radius: 3px;
  width: 40px;
  height: 40px;
  font-size: var(--icon-widget);
}

sf-app.sf-app .sf-icon.-tile.-custom-icon::before {
  -webkit-mask-size: var(--icon-widget);
          mask-size: var(--icon-widget);
}

sf-app.sf-app .sf-icon.-custom-icon {
  position: relative;
}

sf-app.sf-app .sf-icon.-custom-icon::before {
  content: " ";
  background-color: currentColor;
  -webkit-mask-image: var(--drag-widget-icon);
          mask-image: var(--drag-widget-icon);
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-position: center;
          mask-position: center;
  position: absolute;
  inset: 0;
}

sf-app.sf-app .sf-icon.-square.-positive .sf-icon__font-icon, sf-app.sf-app .sf-icon.-tile.-positive .sf-icon__font-icon {
  color: var(--icon-positive-color);
}

sf-app.sf-app .sf-icon.-badge {
  width: var(--icon-size-badge);
  height: var(--icon-size-badge);
  border-radius: 50%;
  background: var(--icon-badge-add-bg-color);
  border: 1px solid var(--icon-badge-add-border-color);
  color: var(--icon-badge-add-color);
}

sf-app.sf-app .sf-icon.-badge.-edit-variation {
  color: #fff;
  background-color: var(--sf-color-info, #006cd9);
  border-color: var(--sf-color-info, #006cd9);
}

sf-app.sf-app .sf-icon.-badge.-warning-bg {
  background-color: var(--sf-color-warning, #ed8527);
  border-color: var(--sf-color-warning, #ed8527);
}

sf-app.sf-app .sf-icon.-badge.-small {
  width: var(--icon-size-s);
  height: var(--icon-size-s);
}

sf-app.sf-app .sf-icon.-warning {
  color: var(--sf-color-warning, #ed8527);
}

sf-app.sf-app .sf-icon.-sf-font-icon {
  width: auto;
  height: auto;
}

sf-app.sf-app .sf-icon.-sf-font-icon.-zone-editor .sf-icon__font-icon {
  color: #333;
}

sf-app.sf-app .sf-icon.-sf-font-icon.-zone-editor.-inverted .sf-icon__font-icon {
  color: #fff;
}

sf-app.sf-app .sf-icon.-size-7xs {
  font-size: var(--icon-size-7xs);
}

sf-app.sf-app .sf-icon.-size-5xs {
  font-size: var(--icon-size-5xs);
}

sf-app.sf-app .sf-icon.-size-4xs {
  font-size: var(--icon-size-4xs);
}

sf-app.sf-app .sf-icon.-size-3xs {
  font-size: var(--icon-size-3xs);
}

sf-app.sf-app .sf-icon.-size-2xs {
  font-size: var(--icon-size-2xs);
}

sf-app.sf-app .sf-icon.-size-xs {
  font-size: var(--icon-size-xs);
}

sf-app.sf-app .sf-icon.-size-s {
  font-size: var(--icon-size-s);
}

sf-app.sf-app .sf-icon.-size-m {
  font-size: var(--icon-size-m);
}

sf-app.sf-app .sf-icon.-size-l {
  font-size: var(--icon-size-l);
}

sf-app.sf-app .sf-icon.-size-xl {
  font-size: var(--icon-size-xl);
}

sf-app.sf-app .sf-icon.-size-2xl {
  font-size: var(--icon-size-2xl);
}

sf-app.sf-app .sf-icon.-size-3xl {
  font-size: var(--icon-size-3xl);
}

sf-app.sf-app .sf-icon.-size-4xl {
  font-size: var(--icon-size-4xl);
}

sf-app.sf-app .sf-icon.-size-5xl {
  font-size: var(--icon-size-5xl);
}

sf-app.sf-app .sf-icon__font-icon {
  line-height: normal;
}

sf-app.sf-app .sf-icon-stack {
  position: relative;
  display: inline-flex;
}

sf-app.sf-app .sf-icon-stack__in {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 10;
}

sf-app.sf-app .sf-icon-stack .sf-icon-stack__in + .sf-icon-stack__in {
  z-index: 5;
}

sf-app.sf-app .sf-icon-stack__out {
  position: relative;
}

sf-app.sf-app .sf-status__text {
  font-size: var(--font-size-base);
  margin-top: 0;
  margin-bottom: 0;
  color: var(--sf-secondary-text-color);
}

sf-app.sf-app .sf-status__icon {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  overflow: hidden;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: var(--font-size-base);
  color: #fff;
  background-color: var(--status-bg-color-default);
}

sf-app.sf-app .sf-status__icon:not([class*=sf-fa-])::before {
  content: "\f064";
}

sf-app.sf-app .sf-status__icon.-for-published {
  background-color: var(--status-icon-color-published);
}

sf-app.sf-app .sf-status__icon.-for-restricted {
  background-color: var(--status-icon-color-restricted);
}

sf-app.sf-app .sf-status__icon.-for-unpublished {
  background-color: var(--status-icon-color-unpublished);
}

sf-app.sf-app .sf-status__icon.-for-scheduled {
  background-color: var(--status-icon-color-scheduled);
}

sf-app.sf-app .sf-status__icon.-for-draft {
  background-color: var(--status-icon-color-draft);
}

sf-app.sf-app .sf-status__icon.-system-icon {
  background-color: transparent;
  color: var(--status-icon-color-system);
  font-size: var(--icon-size-xl);
  overflow: visible;
}

sf-app.sf-app .sf-status__icon.-system-icon.-dimmed {
  background-color: transparent;
}

sf-app.sf-app .sf-status__icon.-published {
  background-color: var(--status-icon-color-published);
}

sf-app.sf-app .sf-status__icon.-published::before {
  content: "\f00c";
}

sf-app.sf-app .sf-status__icon.-locked {
  background-color: var(--status-icon-color-restricted);
}

sf-app.sf-app .sf-status__icon.-locked::before {
  content: "\f023";
}

sf-app.sf-app .sf-status__icon.-unpublished {
  background-color: var(--status-icon-color-unpublished);
}

sf-app.sf-app .sf-status__icon.-unpublished::before {
  content: "\f00d";
}

sf-app.sf-app .sf-status__icon.-deleted {
  font-size: var(--icon-size-xl);
  background-color: transparent;
  color: var(--sf-color-secondary, #ccc);
}

sf-app.sf-app .sf-status__icon.-deleted::before {
  content: "\f014";
}

sf-app.sf-app .sf-status__icon.-deleted.-dimmed {
  background-color: transparent;
}

sf-app.sf-app .sf-status__icon[class*=-rejected] {
  background-color: var(--status-icon-color-restricted);
}

sf-app.sf-app .sf-status__icon[class*=-rejected]::before {
  content: "\f00d";
}

sf-app.sf-app .sf-status__icon.-scheduled {
  background-color: var(--status-icon-color-scheduled);
}

sf-app.sf-app .sf-status__icon.-scheduled::before {
  content: "\f017";
}

sf-app.sf-app .sf-status__icon.-group-page {
  background-color: transparent;
  color: var(--status-icon-color-system);
  font-size: var(--icon-size-xl);
  overflow: visible;
}

sf-app.sf-app .sf-status__icon.-group-page.-dimmed {
  background-color: transparent;
}

sf-app.sf-app .sf-status__icon.-group-page::before {
  content: "\f114";
}

sf-app.sf-app .sf-status__icon.-hierarchical {
  background-color: transparent;
  color: var(--status-icon-color-system);
  font-size: var(--icon-size-xl);
  overflow: visible;
}

sf-app.sf-app .sf-status__icon.-hierarchical.-dimmed {
  background-color: transparent;
}

sf-app.sf-app .sf-status__icon.-hierarchical::before {
  content: "\f114";
}

sf-app.sf-app .sf-status__icon.-flat {
  background-color: transparent;
  color: var(--status-icon-color-system);
  font-size: var(--icon-size-xl);
  overflow: visible;
}

sf-app.sf-app .sf-status__icon.-flat.-dimmed {
  background-color: transparent;
}

sf-app.sf-app .sf-status__icon.-flat::before {
  content: "\f02c";
}

sf-app.sf-app .sf-status__icon.-redirecting-page {
  background-color: transparent;
  color: var(--status-icon-color-system);
  font-size: var(--icon-size-xl);
  overflow: visible;
}

sf-app.sf-app .sf-status__icon.-redirecting-page.-dimmed {
  background-color: transparent;
}

sf-app.sf-app .sf-status__icon.-redirecting-page::before {
  content: "\f08e";
}

sf-app.sf-app .sf-status__icon.-draft, sf-app.sf-app .sf-status__icon.-draftnewer, sf-app.sf-app .sf-status__icon.-publishedanddraft {
  background-color: var(--status-icon-color-draft);
}

sf-app.sf-app .sf-status__icon.-draft::before, sf-app.sf-app .sf-status__icon.-draftnewer::before, sf-app.sf-app .sf-status__icon.-publishedanddraft::before {
  content: "\f040";
}

sf-app.sf-app .sf-status__icon[class*=-awaiting]::before {
  content: "\f064";
}

sf-app.sf-app .sf-status__icon.-stopped {
  font-size: var(--icon-size-4xs);
}

sf-app.sf-app .sf-status__icon.-stopped::before {
  content: "\f04d";
}

sf-app.sf-app .sf-status__icon.-dimmed {
  background-color: var(--sf-color-secondary, #ccc);
}

sf-app.sf-app .sf-status__icon.-for-translation {
  font-size: var(--icon-size-3xs);
  background-color: var(--sf-color-info, #006cd9);
}

sf-app.sf-app .sf-status__icon.-for-translation::before {
  content: "\f031";
}

sf-app.sf-app .sf-status__icon.-withnodescriptions {
  background-color: var(--status-icon-color-unpublished);
}

sf-app.sf-app .sf-status__icon.-withnodescriptions::before {
  content: "\f040";
}

sf-app.sf-app .sf-status__icon.-translations_marked {
  font-size: var(--icon-size-3xs);
  background-color: var(--sf-color-info, #006cd9);
}

sf-app.sf-app .sf-status__icon.-translations_marked::before {
  content: "\f031";
}

sf-app.sf-app .sf-status__icon.-translations_sent {
  font-size: var(--icon-size-3xs);
  background-color: var(--sf-color-info, #006cd9);
}

sf-app.sf-app .sf-status__icon.-translations_sent::before {
  content: "\f031";
}

@keyframes floatingText {
  0% {
    transform: translate(0);
  }
  50% {
    transform: translate(calc(-100% + 26px / 2));
  }
  100% {
    transform: translate(0);
  }
}
sf-app.sf-app .sf-badge {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 22px;
  height: 22px;
  border-radius: 22px;
  overflow: hidden;
  white-space: nowrap;
  font-style: normal;
  background-color: var(--sf-color-secondary-light, var(--sf-color-secondary, #ccc));
  font-family: "Open Sans", sans-serif;
  font-weight: normal;
  color: var(--badge-color);
}

sf-app.sf-app .sf-badge.-ellipse {
  width: auto;
  min-width: 22px;
}

sf-app.sf-app .sf-badge-group {
  position: relative;
}

sf-app.sf-app .sf-badge-group__icon {
  position: absolute;
  top: -5px;
  right: -8px;
}

sf-app.sf-app .sf-badge:not(sub, sup) {
  vertical-align: middle;
}

sf-app.sf-app .sf-badge:not(.-icon, .-add) {
  padding-left: 5px;
  padding-right: 5px;
}

sf-app.sf-app .sf-badge:not(.-icon, .-add).-floating-txt {
  padding-left: 3px;
}

sf-app.sf-app .sf-badge.-hover {
  cursor: pointer;
}

sf-app.sf-app .sf-badge.-size-s {
  width: 16px;
  height: 16px;
  border-radius: 16px;
}

sf-app.sf-app .sf-badge.-size-s.-ellipse {
  width: auto;
  min-width: 16px;
}

sf-app.sf-app .sf-badge.-size-m {
  width: 22px;
  height: 22px;
  border-radius: 22px;
}

sf-app.sf-app .sf-badge.-size-m.-ellipse {
  width: auto;
  min-width: 22px;
}

sf-app.sf-app .sf-badge.-size-l {
  width: 24px;
  height: 24px;
  border-radius: 24px;
}

sf-app.sf-app .sf-badge.-size-l.-ellipse {
  width: auto;
  min-width: 24px;
}

sf-app.sf-app .sf-badge.-size-xl {
  width: 26px;
  height: 26px;
  border-radius: 26px;
}

sf-app.sf-app .sf-badge.-size-xl.-ellipse {
  width: auto;
  min-width: 26px;
}

sf-app.sf-app .sf-badge.-positive {
  background-color: var(--badge-color-bg-positive);
  color: var(--badge-positive-color);
}

sf-app.sf-app .sf-badge.-negative {
  background-color: var(--badge-color-bg-negative);
  color: var(--badge-negative-color);
}

sf-app.sf-app .sf-badge.-white {
  background-color: #fff;
  color: var(--badge-white-color);
}

sf-app.sf-app .sf-badge.-icon {
  color: var(--badge-icon-color);
}

sf-app.sf-app .sf-badge.-icon .sf-icon {
  color: inherit;
  margin-right: 0;
  display: inline-flex;
  justify-content: center;
  align-items: center;
}

sf-app.sf-app .sf-badge.-add {
  background-color: #fff;
  border: 1px solid var(--badge-white-border-color);
  color: var(--badge-add-color);
}

sf-app.sf-app .sf-badge.-add.-hover:hover {
  background-color: var(--sf-badge-white-hover-bg);
  color: var(--sf-badge-add-color-hover);
}

sf-app.sf-app .sf-badge.-add-variation {
  border: 1px solid var(--badge-add-variation-border-color);
  background-color: var(--badge-add-variation-bg-color);
  color: var(--badge-add-variation-color);
}

sf-app.sf-app .sf-badge.-add-variation.-hover:hover {
  border: 1px solid var(--badge-add-variation-border-hover);
  background-color: var(--badge-add-variation-hover);
}

sf-app.sf-app .sf-badge.-add-variation.-dimmed {
  border-color: #cae0f7;
  background-color: #cae0f7;
}

sf-app.sf-app .sf-badge.-edit-variation {
  border: 1px solid var(--badge-edit-variation-bg-color);
  background-color: var(--badge-edit-variation-bg-color);
  color: var(--badge-edit-variation-color);
}

sf-app.sf-app .sf-badge.-edit-variation.-hover:hover {
  border: 1px solid var(--badge-edit-variation-hover);
  background-color: var(--badge-edit-variation-hover);
}

sf-app.sf-app .sf-badge.-edit-variation.-dimmed {
  border-color: #80b6ec;
  background-color: #80b6ec;
}

sf-app.sf-app .sf-badge.-floating-txt {
  justify-content: left;
}

sf-app.sf-app .sf-badge.-floating-txt:hover .sf-badge__animated-content {
  display: inline-block;
  animation: 3s ease floatingText;
}

sf-app.sf-app .sf-badge.-square {
  border-radius: 0;
}

sf-app.sf-app .sf-badge.-bordered {
  border: 1px solid currentColor;
}

sf-app.sf-app .sf-button {
  align-items: center;
  justify-content: center;
  display: inline-flex;
  margin: 0 5px 0 0;
  font-weight: normal;
  text-decoration: none;
  vertical-align: middle;
  cursor: pointer;
  border-width: 1px;
  border-style: solid;
  white-space: nowrap;
  height: 32px;
  min-width: 32px;
  padding: 0 16px;
  font-size: var(--font-size-base);
  border-radius: 3px;
  color: var(--button-color);
  background-color: var(--button-background-color);
  border-color: var(--button-border-color);
}

sf-app.sf-app .sf-button:hover, sf-app.sf-app .sf-button:active, sf-app.sf-app .sf-button:focus {
  transition: border-color 0.3s, background-color 0.3s, color 0.3s;
}

sf-app.sf-app .sf-button[disabled] {
  pointer-events: none;
  cursor: default;
}

sf-app.sf-app .sf-button[disabled].-icon .sf-button__icon {
  color: inherit;
}

sf-app.sf-app .sf-button.-disabled {
  pointer-events: none;
  cursor: default;
}

sf-app.sf-app .sf-button.-disabled.-icon .sf-button__icon {
  color: inherit;
}

sf-app.sf-app .sf-button.-full-size-content .sf-button__content {
  height: 100%;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

sf-app.sf-app .sf-button.-large {
  height: 36px;
  min-width: 36px;
  padding: 0 20px;
  font-size: var(--font-size-lg);
}

sf-app.sf-app .sf-button.-small {
  height: 26px;
  min-width: 26px;
  padding: 0 10px;
  border-radius: 2px;
}

sf-app.sf-app .sf-button:focus {
  color: var(--button-color);
}

sf-app.sf-app .sf-button:not(.-no-hover):hover {
  color: var(--button-interaction-color);
  background-color: var(--button-interaction-background-color);
  border-color: var(--button-interaction-border-color);
}

sf-app.sf-app .sf-button:not(.-no-focus-visible):focus-visible {
  color: var(--button-interaction-color);
  background-color: var(--button-interaction-background-color);
  border-color: var(--button-interaction-border-color);
}

sf-app.sf-app .sf-button:not(.-no-active):active {
  color: var(--button-interaction-color);
  background-color: var(--button-interaction-background-color);
  border-color: var(--button-interaction-border-color);
}

sf-app.sf-app .sf-button[disabled]:not(.-done, .-inprogress, .-no-border), sf-app.sf-app .sf-button.-disabled:not(.-done, .-inprogress, .-no-border) {
  color: var(--button-disabled-color);
  background-color: var(--button-disabled-background-color);
  border-color: var(--button-disabled-border-color);
}

sf-app.sf-app .sf-button.-sidebar-tree {
  color: #333;
  background-color: var(--sf-tree-sidebar-hover-bg-color);
  border-color: var(--sf-tree-sidebar-hover-bg-color);
}

sf-app.sf-app .sf-button.-sidebar-tree:focus {
  color: #333;
}

sf-app.sf-app .sf-button.-sidebar-tree:not(.-no-hover):hover {
  color: #333;
  background-color: var(--sf-tree-sidebar-hover-bg-color);
  border-color: var(--sf-tree-sidebar-hover-bg-color);
}

sf-app.sf-app .sf-button.-sidebar-tree-invert {
  color: #fff;
  background-color: #333;
  border-color: #333;
}

sf-app.sf-app .sf-button.-sidebar-tree-invert:focus {
  color: #fff;
}

sf-app.sf-app .sf-button.-sidebar-tree-invert:not(.-no-hover):hover {
  color: #fff;
  background-color: #333;
  border-color: #333;
}

sf-app.sf-app .sf-button.-action {
  color: var(--action-button-color);
  background-color: var(--action-button-background-color);
  border-color: var(--action-button-border-color);
}

sf-app.sf-app .sf-button.-action:focus {
  color: var(--action-button-color);
}

sf-app.sf-app .sf-button.-action:not(.-no-hover):hover {
  color: var(--action-button-interaction-color);
  background-color: var(--action-button-interaction-background-color);
  border-color: var(--action-button-interaction-border-color);
}

sf-app.sf-app .sf-button.-action:not(.-no-focus):focus {
  color: var(--action-button-interaction-color);
  background-color: var(--action-button-interaction-background-color);
  border-color: var(--action-button-interaction-border-color);
}

sf-app.sf-app .sf-button.-action:not(.-no-active):active {
  color: var(--action-button-interaction-color);
  background-color: var(--action-button-interaction-background-color);
  border-color: var(--action-button-interaction-border-color);
}

sf-app.sf-app .sf-button.-action[disabled]:not(.-done, .-inprogress, .-no-border), sf-app.sf-app .sf-button.-action.-disabled:not(.-done, .-inprogress, .-no-border) {
  color: var(--action-button-disabled-color);
  background-color: var(--action-button-disabled-background-color);
  border-color: var(--action-button-disabled-border-color);
}

sf-app.sf-app .sf-button.-delete {
  color: var(--delete-button-color);
  background-color: var(--delete-button-background-color);
  border-color: var(--delete-button-border-color);
}

sf-app.sf-app .sf-button.-delete:focus {
  color: var(--delete-button-color);
}

sf-app.sf-app .sf-button.-delete:not(.-no-hover):hover {
  color: var(--delete-button-interaction-color);
  background-color: var(--delete-button-interaction-background-color);
  border-color: var(--delete-button-interaction-border-color);
}

sf-app.sf-app .sf-button.-delete:not(.-no-focus-visible):focus-visible {
  color: var(--delete-button-interaction-color);
  background-color: var(--delete-button-interaction-background-color);
  border-color: var(--delete-button-interaction-border-color);
}

sf-app.sf-app .sf-button.-delete:not(.-no-active):active {
  color: var(--delete-button-interaction-color);
  background-color: var(--delete-button-interaction-background-color);
  border-color: var(--delete-button-interaction-border-color);
}

sf-app.sf-app .sf-button.-delete[disabled]:not(.-done, .-inprogress, .-no-border), sf-app.sf-app .sf-button.-delete.-disabled:not(.-done, .-inprogress, .-no-border) {
  color: var(--delete-button-disabled-color);
  background-color: var(--delete-button-disabled-background-color);
  border-color: var(--delete-button-disabled-border-color);
}

sf-app.sf-app .sf-button.-link {
  color: var(--link-color);
  background-color: transparent;
  border-color: transparent;
}

sf-app.sf-app .sf-button.-link:focus {
  color: var(--link-color);
}

sf-app.sf-app .sf-button.-link:not(.-no-hover):hover {
  color: var(--link-color);
  background-color: transparent;
  border-color: transparent;
}

sf-app.sf-app .sf-button.-link:not(.-no-focus-visible):focus-visible {
  color: var(--link-color);
  background-color: transparent;
  border-color: transparent;
}

sf-app.sf-app .sf-button.-link:not(.-no-active):active {
  color: var(--link-color);
  background-color: transparent;
  border-color: transparent;
}

sf-app.sf-app .sf-button.-link[disabled]:not(.-done, .-inprogress, .-no-border), sf-app.sf-app .sf-button.-link.-disabled:not(.-done, .-inprogress, .-no-border) {
  border-color: transparent;
}

sf-app.sf-app .sf-button.-invert {
  color: #fff;
  background-color: #333;
  border-color: #333;
}

sf-app.sf-app .sf-button.-invert:focus {
  color: #fff;
}

sf-app.sf-app .sf-button.-invert-border-primary {
  color: #fff;
  background-color: #333;
  border-color: #fff;
}

sf-app.sf-app .sf-button.-invert-border-primary:focus {
  color: #fff;
}

sf-app.sf-app .sf-button.-invert-border-primary:not(.-no-hover):hover {
  color: #333;
  background-color: #fff;
  border-color: #fff;
}

sf-app.sf-app .sf-button.-feedback {
  position: relative;
}

sf-app.sf-app .sf-button.-feedback .sf-button__icon {
  display: none;
}

sf-app.sf-app .sf-button.-feedback.-done .sf-button__icon {
  display: flex;
  margin-right: 0;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  color: inherit;
}

sf-app.sf-app .sf-button.-feedback.-done .sf-button__content {
  opacity: 0;
}

sf-app.sf-app .sf-button.-loader {
  position: relative;
}

sf-app.sf-app .sf-button.-loader .sf-loader {
  position: absolute;
  display: none;
  inset: 0 -1px -1px 0;
}

sf-app.sf-app .sf-button.-inprogress .sf-button__content {
  opacity: 0;
}

sf-app.sf-app .sf-button.-inprogress .sf-loader {
  display: block;
  border-radius: 2px;
}

sf-app.sf-app .sf-button.-inprogress .sf-icon {
  opacity: 0;
}

sf-app.sf-app .sf-button.-white {
  color: #fff;
}

sf-app.sf-app .sf-button.-link {
  margin: 0;
  padding: 0;
  height: auto;
  font-size: inherit;
  vertical-align: baseline;
  border: 0;
  min-width: 0;
}

sf-app.sf-app .sf-button.-link .sf-button__content {
  border-bottom: 1px solid transparent;
}

sf-app.sf-app .sf-button.-link .sf-button__content:hover {
  border-bottom-color: var(--link-color);
}

sf-app.sf-app .sf-button.-dropdown {
  position: relative;
}

sf-app.sf-app .sf-button.-dropped:focus {
  background-color: var(--sf-button-dropped-background-color);
  border-color: var(--sf-button-dropped-border-color);
}

sf-app.sf-app .sf-button.-dropped.-left .sf-button__dropdown {
  right: auto;
  left: -1px;
}

sf-app.sf-app .sf-button.-dropped .sf-button__dropdown {
  opacity: 1;
  z-index: 1000;
}

sf-app.sf-app .sf-button.-fixed-width .sf-button__dropdown {
  width: 260px;
}

sf-app.sf-app .sf-button.-fixed-width .sf-dropdown {
  white-space: normal;
  width: 100%;
}

sf-app.sf-app .sf-button.-txt-small {
  font-size: var(--font-size-h5);
}

sf-app.sf-app .sf-button.-variant {
  background-color: #f5f5f5;
}

sf-app.sf-app .sf-button.-no-border {
  background: transparent;
  border: 0;
}

sf-app.sf-app .sf-button.-no-border:hover {
  background-color: transparent;
}

sf-app.sf-app .sf-button.-no-border .sf-button__dropdown {
  top: 100%;
}

sf-app.sf-app .sf-button.-no-padding {
  padding: 0;
}

sf-app.sf-app .sf-button.-icon .sf-button__icon {
  margin: 0;
}

sf-app.sf-app .sf-button.-icon[disabled] .sf-button__icon:not(.-badge), sf-app.sf-app .sf-button.-icon.-disabled .sf-button__icon:not(.-badge), sf-app.sf-app .sf-button.-icon.-action .sf-button__icon:not(.-badge), sf-app.sf-app .sf-button.-icon.-delete .sf-button__icon:not(.-badge), sf-app.sf-app .sf-button.-icon:not(.-no-hover):hover .sf-button__icon:not(.-badge), sf-app.sf-app .sf-button.-icon:not(.-no-active):active .sf-button__icon:not(.-badge), sf-app.sf-app .sf-button.-icon:not(.-no-focus-visible):focus .sf-button__icon:not(.-badge) {
  color: inherit;
}

sf-app.sf-app .sf-button.-icon:not(.-icon-and-text, .-toolset) {
  padding: 0;
}

sf-app.sf-app .sf-button.-icon[disabled].-no-border, sf-app.sf-app .sf-button.-icon.-disabled.-no-border {
  background-color: transparent;
  color: var(--button-disabled-color);
}

sf-app.sf-app .sf-button.-icon[disabled].-no-border.-darker-disabled, sf-app.sf-app .sf-button.-icon.-disabled.-no-border.-darker-disabled {
  color: var(--button-disabled-darker-color);
}

sf-app.sf-app .sf-button.-toggle-action {
  margin: 0 5px 0 0;
  border: 1px solid transparent;
  border-radius: 3px !important;
}

sf-app.sf-app .sf-button.-toggle-action,
sf-app.sf-app .sf-button.-toggle-action .sf-button__icon:not(.-badge) {
  width: auto;
  min-width: 32px;
  height: 32px;
  border-radius: 3px;
}

sf-app.sf-app .sf-button.-toggle-action.-active {
  border-color: #eee;
}

sf-app.sf-app .sf-button.-toggle {
  padding: 0;
  margin-right: 0;
  width: 48px;
  height: 46px;
  color: var(--sf-color-secondary-dark, #777);
  border: 0;
  background-color: #fff;
  border-radius: 0;
}

sf-app.sf-app .sf-button.-toggle:focus, sf-app.sf-app .sf-button.-toggle:hover {
  background-color: var(--sf-button-dropped-background-color);
  border-color: var(--sf-button-dropped-border-color);
}

sf-app.sf-app .sf-button.-toggle .sf-button__icon:not(.-badge) {
  width: 48px;
  height: 46px;
  line-height: 46px;
}

sf-app.sf-app .sf-button.-toggle:hover .sf-button__icon:not(.-badge), sf-app.sf-app .sf-button.-toggle-action:hover .sf-button__icon:not(.-badge) {
  color: #333;
  background-color: var(--sf-color-secondary-lighter, #e4e4e4);
  border-color: var(--sf-color-secondary-lighter, #e4e4e4);
}

sf-app.sf-app .sf-button.-toggle.-auto-width, sf-app.sf-app .sf-button.-toggle-action.-auto-width {
  width: auto;
}

sf-app.sf-app .sf-button.-toggle.-active, sf-app.sf-app .sf-button.-toggle-action.-active {
  color: #333;
  background-color: #f5f5f5;
  border-color: #eee;
}

sf-app.sf-app .sf-button.-toggle.-active .sf-button__icon, sf-app.sf-app .sf-button.-toggle-action.-active .sf-button__icon {
  color: #333;
}

sf-app.sf-app .sf-button.-toggle.-active:hover .sf-button__icon, sf-app.sf-app .sf-button.-toggle-action.-active:hover .sf-button__icon {
  background-color: transparent;
  border-color: #eee;
}

sf-app.sf-app .sf-button.-toggle.-dropped, sf-app.sf-app .sf-button.-toggle-action.-dropped {
  color: #333;
  background-color: #f5f5f5;
  border-color: #eee;
}

sf-app.sf-app .sf-button.-toggle.-dropped .sf-button__icon:not(.-badge), sf-app.sf-app .sf-button.-toggle-action.-dropped .sf-button__icon:not(.-badge) {
  color: #333;
}

sf-app.sf-app .sf-button.-toggle.-dropped:hover .sf-button__icon:not(.-badge), sf-app.sf-app .sf-button.-toggle-action.-dropped:hover .sf-button__icon:not(.-badge) {
  background-color: transparent;
  border-color: #eee;
}

sf-app.sf-app .sf-button.-toggle .sf-button__dropdown, sf-app.sf-app .sf-button.-toggle-action .sf-button__dropdown {
  top: 100%;
}

sf-app.sf-app .sf-button.-circle {
  border-radius: 50%;
}

sf-app.sf-app .sf-button.-circle.-small {
  padding: 0;
  height: 26px;
  width: 26px;
  min-width: 26px;
  color: var(--sf-color-secondary-dark, #333);
}

sf-app.sf-app .sf-button.-icon-left .sf-button__icon {
  order: 1;
}

sf-app.sf-app .sf-button.-icon-left .sf-button__content {
  order: 2;
  margin-left: 5px;
}

sf-app.sf-app .sf-button.-angled {
  border-radius: 0;
}

sf-app.sf-app .sf-button.-angled .sf-button__dropdown {
  top: 100%;
}

sf-app.sf-app .sf-button.-toolset {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  padding-left: 20px;
  padding-right: 20px;
  height: 100%;
  margin-right: 0;
  min-width: 0;
}

sf-app.sf-app .sf-button.-toolset:hover {
  cursor: pointer;
  color: var(--sf-color-secondary, #ccc);
}

sf-app.sf-app .sf-button.-color-inherit, sf-app.sf-app .sf-button.-toolset:not(.-white) {
  color: inherit;
}

sf-app.sf-app .sf-button.-color-inherit:hover, sf-app.sf-app .sf-button.-color-inherit:focus {
  color: inherit;
}

sf-app.sf-app .sf-button__icon {
  margin: 0 5px 0 0;
}

sf-app.sf-app .sf-button__icon.-right {
  margin: 0 0 0 5px;
}

sf-app.sf-app .sf-button__content {
  vertical-align: baseline;
}

sf-app.sf-app .sf-button__dropdown {
  position: absolute;
  text-align: left;
  opacity: 0;
  z-index: -1;
  transition: opacity 0.3s ease-out;
  transition-property: opacity;
  top: calc(100% + 8px);
  right: -1px;
  min-width: calc(100% + 2px);
  width: auto;
}

sf-app.sf-app .sf-button__dropdown .sf-dropdown__item {
  font-size: inherit;
  line-height: normal;
  word-break: normal;
  text-transform: none;
}

sf-app.sf-app .sf-button__arrow {
  margin: 0;
  padding: 0;
  height: 30px;
  line-height: 30px;
  font-size: var(--icon-size-xs);
}

sf-app.sf-app .sf-button-group {
  margin: 0;
  padding: 0;
  display: inline-flex;
  align-items: center;
}

sf-app.sf-app .sf-button-group .sf-input .sf-input__field,
sf-app.sf-app .sf-button-group .sf-button {
  margin: 0;
  border-right-width: 0;
  border-radius: 0;
}

sf-app.sf-app .sf-button-group__input {
  width: 100%;
}

sf-app.sf-app .sf-button-group.-search {
  padding: 0 14px;
  height: 32px;
  width: 460px;
  border-radius: 16px;
  background-color: #f5f5f5;
}

sf-app.sf-app .sf-button-group.-search:focus-within {
  box-shadow: 0 0 2px var(--sf-input-box-shadow-focus);
}

sf-app.sf-app .sf-button-group.-search .sf-input__field {
  margin-left: 5px;
  padding-left: 0;
  height: 30px;
  font-size: var(--font-size-base);
}

sf-app.sf-app .sf-button-group.-search .sf-input__field:focus {
  box-shadow: none;
}

sf-app.sf-app .sf-button-group.-search .sf-input__field,
sf-app.sf-app .sf-button-group.-search .sf-button {
  border: 0;
  background-color: transparent;
}

sf-app.sf-app .sf-button-group.-search .sf-button.-icon,
sf-app.sf-app .sf-button-group.-search .sf-input__clear-button {
  margin-right: -10px;
}

sf-app.sf-app .sf-button-group.-search.-secondary {
  padding: 0;
  border-radius: 0;
  background-color: #fff;
  height: auto;
}

sf-app.sf-app .sf-button-group.-search.-secondary .sf-input__field {
  padding-left: 8px;
}

sf-app.sf-app .sf-button-group.-fluid {
  width: 100%;
}

sf-app.sf-app .sf-button-group.-no-focus-visible:focus-within {
  box-shadow: none;
}

sf-app.sf-app .sf-button-group__icon {
  position: absolute;
  right: 5px;
  top: 5px;
}

sf-app.sf-app .sf-notification {
  position: relative;
  display: flex;
  text-align: left;
  vertical-align: middle;
  padding: 7px 20px;
  border-radius: 3px;
  background-color: currentcolor;
  border-color: currentcolor;
  color: var(--sf-color-info-bg, #dcecf5);
}

sf-app.sf-app .sf-notification > * {
  color: #333;
}

sf-app.sf-app .sf-notification.-info {
  color: var(--sf-color-info-bg, #dcecf5);
  border: 1px solid var(--sf-color-info-lighter, currentcolor);
}

sf-app.sf-app .sf-notification.-success {
  color: var(--sf-color-success-bg, #caeed8);
  border: 1px solid var(--sf-color-success-lighter, currentcolor);
}

sf-app.sf-app .sf-notification.-error {
  color: var(--sf-color-error-bg, #fcc);
  border: 1px solid var(--sf-color-error-lighter, currentcolor);
}

sf-app.sf-app .sf-notification.-warning {
  color: var(--sf-color-warning-bg, #ffc);
  border: 1px solid var(--sf-color-warning-light, currentcolor);
}

sf-app.sf-app .sf-notification.-black {
  color: #333;
  border: 1px solid;
}

sf-app.sf-app .sf-notification.-black > *:not(.sf-notification__close-button) {
  color: #fff;
}

sf-app.sf-app .sf-notification.-transparent {
  color: transparent;
  border: 1px solid;
}

sf-app.sf-app .sf-notification.-transparent > *:not(.sf-notification__close-button) {
  color: #333;
}

sf-app.sf-app .sf-notification.-small {
  padding: 0 20px;
  height: 32px;
  align-items: center;
}

sf-app.sf-app .sf-notification.-inline {
  display: inline-flex;
}

sf-app.sf-app .sf-notification.-preline .sf-notification__content {
  white-space: pre-line;
}

sf-app.sf-app .sf-notification.-menu {
  padding: 9px 10px;
}

sf-app.sf-app .sf-notification.-up, sf-app.sf-app .sf-notification.-up-right, sf-app.sf-app .sf-notification.-up-left {
  margin-bottom: 10px;
}

sf-app.sf-app .sf-notification.-up:after, sf-app.sf-app .sf-notification.-up:before, sf-app.sf-app .sf-notification.-up-right:after, sf-app.sf-app .sf-notification.-up-right:before, sf-app.sf-app .sf-notification.-up-left:after, sf-app.sf-app .sf-notification.-up-left:before {
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
}

sf-app.sf-app .sf-notification.-up::after, sf-app.sf-app .sf-notification.-up-right::after, sf-app.sf-app .sf-notification.-up-left::after {
  border-width: 10px;
  border-top-color: inherit;
  bottom: -20px;
  right: 50%;
  margin-right: -10px;
}

sf-app.sf-app .sf-notification.-up::before, sf-app.sf-app .sf-notification.-up-right::before, sf-app.sf-app .sf-notification.-up-left::before {
  border-width: 11px;
  border-top-color: var(--sf-color-secondary-lighter, #e4e4e4);
  bottom: -22px;
  right: 50%;
  margin-right: -11px;
}

sf-app.sf-app .sf-notification.-down, sf-app.sf-app .sf-notification.-down-right, sf-app.sf-app .sf-notification.-down-left {
  margin-top: 10px;
}

sf-app.sf-app .sf-notification.-down:after, sf-app.sf-app .sf-notification.-down:before, sf-app.sf-app .sf-notification.-down-right:after, sf-app.sf-app .sf-notification.-down-right:before, sf-app.sf-app .sf-notification.-down-left:after, sf-app.sf-app .sf-notification.-down-left:before {
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
}

sf-app.sf-app .sf-notification.-down::after, sf-app.sf-app .sf-notification.-down-right::after, sf-app.sf-app .sf-notification.-down-left::after {
  border-width: 10px;
  border-bottom-color: inherit;
  top: -20px;
  right: 50%;
  margin-right: -10px;
}

sf-app.sf-app .sf-notification.-down::before, sf-app.sf-app .sf-notification.-down-right::before, sf-app.sf-app .sf-notification.-down-left::before {
  border-width: 11px;
  border-bottom-color: var(--sf-color-secondary-lighter, #e4e4e4);
  top: -22px;
  right: 50%;
  margin-right: -11px;
}

sf-app.sf-app .sf-notification.-left, sf-app.sf-app .sf-notification.-left-up, sf-app.sf-app .sf-notification.-left-down {
  margin-right: 20px;
}

sf-app.sf-app .sf-notification.-left:after, sf-app.sf-app .sf-notification.-left:before, sf-app.sf-app .sf-notification.-left-up:after, sf-app.sf-app .sf-notification.-left-up:before, sf-app.sf-app .sf-notification.-left-down:after, sf-app.sf-app .sf-notification.-left-down:before {
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
}

sf-app.sf-app .sf-notification.-left::after, sf-app.sf-app .sf-notification.-left-up::after, sf-app.sf-app .sf-notification.-left-down::after {
  border-width: 10px;
  border-left-color: inherit;
  right: -20px;
  top: 50%;
  margin-top: -10px;
}

sf-app.sf-app .sf-notification.-left::before, sf-app.sf-app .sf-notification.-left-up::before, sf-app.sf-app .sf-notification.-left-down::before {
  border-width: 11px;
  border-left-color: var(--sf-color-secondary-lighter, #e4e4e4);
  right: -22px;
  top: 50%;
  margin-top: -11px;
}

sf-app.sf-app .sf-notification.-right, sf-app.sf-app .sf-notification.-right-up, sf-app.sf-app .sf-notification.-right-down {
  margin-left: 20px;
}

sf-app.sf-app .sf-notification.-right:after, sf-app.sf-app .sf-notification.-right:before, sf-app.sf-app .sf-notification.-right-up:after, sf-app.sf-app .sf-notification.-right-up:before, sf-app.sf-app .sf-notification.-right-down:after, sf-app.sf-app .sf-notification.-right-down:before {
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
}

sf-app.sf-app .sf-notification.-right::after, sf-app.sf-app .sf-notification.-right-up::after, sf-app.sf-app .sf-notification.-right-down::after {
  border-width: 10px;
  border-right-color: inherit;
  left: -20px;
  top: 50%;
  margin-top: -10px;
}

sf-app.sf-app .sf-notification.-right::before, sf-app.sf-app .sf-notification.-right-up::before, sf-app.sf-app .sf-notification.-right-down::before {
  border-width: 11px;
  border-right-color: var(--sf-color-secondary-lighter, #e4e4e4);
  left: -22px;
  top: 50%;
  margin-top: -11px;
}

sf-app.sf-app .sf-notification.-down-left::before, sf-app.sf-app .sf-notification.-down-left::after, sf-app.sf-app .sf-notification.-up-left::before, sf-app.sf-app .sf-notification.-up-left::after {
  right: auto;
  left: 20px;
}

sf-app.sf-app .sf-notification.-down-right::before, sf-app.sf-app .sf-notification.-down-right::after, sf-app.sf-app .sf-notification.-up-right::before, sf-app.sf-app .sf-notification.-up-right::after {
  right: 20px;
}

sf-app.sf-app .sf-notification.-left-down::before, sf-app.sf-app .sf-notification.-left-down::after, sf-app.sf-app .sf-notification.-right-down::before, sf-app.sf-app .sf-notification.-right-down::after {
  bottom: 10px;
  top: auto;
}

sf-app.sf-app .sf-notification.-left-up::before, sf-app.sf-app .sf-notification.-left-up::after, sf-app.sf-app .sf-notification.-right-up::before, sf-app.sf-app .sf-notification.-right-up::after {
  top: 20px;
}

sf-app.sf-app .sf-notification.-tooltip {
  padding: 20px;
  border: 1px solid var(--sf-color-secondary-lighter, #e4e4e4);
  border-radius: 0;
  box-shadow: 0 0 8px rgba(228, 228, 228, 0.6);
  text-transform: none;
}

sf-app.sf-app .sf-notification.-tooltip .sf-notification__close-button {
  position: absolute;
  top: 10px;
  right: 10px;
}

sf-app.sf-app .sf-notification.-tooltip.-up:after {
  border-top-color: var(--sf-color-info-bg, #dcecf5);
}

sf-app.sf-app .sf-notification.-tooltip.-down:after {
  border-bottom-color: var(--sf-color-info-bg, #dcecf5);
}

sf-app.sf-app .sf-notification.-tooltip.-left:after {
  border-left-color: var(--sf-color-info-bg, #dcecf5);
}

sf-app.sf-app .sf-notification.-tooltip.-right:after {
  border-right-color: var(--sf-color-info-bg, #dcecf5);
}

sf-app.sf-app .sf-notification.-tooltip.-down-left:after {
  border-bottom-color: var(--sf-color-info-bg, #dcecf5);
}

sf-app.sf-app .sf-notification.-tooltip.-down-right:after {
  border-bottom-color: var(--sf-color-info-bg, #dcecf5);
}

sf-app.sf-app .sf-notification.-tooltip.-up-left:after {
  border-top-color: var(--sf-color-info-bg, #dcecf5);
}

sf-app.sf-app .sf-notification.-tooltip.-up-right:after {
  border-top-color: var(--sf-color-info-bg, #dcecf5);
}

sf-app.sf-app .sf-notification.-tooltip.-left-down:after {
  border-left-color: var(--sf-color-info-bg, #dcecf5);
}

sf-app.sf-app .sf-notification.-tooltip.-left-up:after {
  border-left-color: var(--sf-color-info-bg, #dcecf5);
}

sf-app.sf-app .sf-notification.-tooltip.-right-down:after {
  border-right-color: var(--sf-color-info-bg, #dcecf5);
}

sf-app.sf-app .sf-notification.-tooltip.-right-up:after {
  border-right-color: var(--sf-color-info-bg, #dcecf5);
}

sf-app.sf-app .sf-notification.-help {
  display: block;
  padding: 30px;
}

sf-app.sf-app .sf-notification.-help .sf-link {
  border-bottom: 1px solid transparent;
}

sf-app.sf-app .sf-notification.-faq {
  position: absolute;
  margin-bottom: 5px;
  bottom: 100%;
  right: 0;
  width: 290px;
}

sf-app.sf-app .sf-notification.-fixed {
  max-width: 850px;
}

sf-app.sf-app .sf-notification.-toolset {
  display: inline-block;
  padding: 0;
  height: 55px;
  line-height: 55px;
}

sf-app.sf-app .sf-notification.-toolset .sf-notification__content {
  display: flex;
  height: 100%;
  line-height: initial;
}

sf-app.sf-app .sf-notification.-toolset .sf-notification__tool {
  padding-left: 20px;
  padding-right: 20px;
}

sf-app.sf-app .sf-notification.-toolset .sf-notification__tool-group {
  display: inline-flex;
  align-items: center;
  padding-left: 20px;
  padding-right: 20px;
  white-space: nowrap;
}

sf-app.sf-app .sf-notification.-toolset .sf-notification__tool-group .sf-notification__tool-button {
  padding: 5px;
}

sf-app.sf-app .sf-notification.-toolset .sf-notification__tool-group .sf-notification__tool-button:not(:first-of-type) {
  margin-left: 10px;
}

sf-app.sf-app .sf-notification.-toolset .sf-notification__tool-button {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  padding-left: 20px;
  padding-right: 20px;
}

sf-app.sf-app .sf-notification.-toolset .sf-notification__tool-button:hover {
  cursor: pointer;
  color: var(--sf-color-secondary, #ccc);
}

sf-app.sf-app .sf-notification.-toolset .sf-notification__tool-button:hover {
  cursor: pointer;
}

sf-app.sf-app .sf-notification.-toolset .sf-notification__tool-button:hover.-active {
  color: #fff;
}

sf-app.sf-app .sf-notification.-toolset .sf-notification__tool-button.-active {
  background-color: var(--sf-color-secondary-dark, #999);
}

sf-app.sf-app .sf-notification.-toolset .sf-notification__tool-button.-ai {
  -moz-column-gap: 5px;
       column-gap: 5px;
}

sf-app.sf-app .sf-notification.-toolset .sf-notification__tool-button.-ai .-label {
  font-weight: bold;
  font-size: var(--font-size-base);
}

sf-app.sf-app .sf-notification.-toolset .sf-notification__tool-button.-ai .k-icon {
  font-family: WebComponentsIcons;
  top: 2px;
}

sf-app.sf-app .sf-notification.-toolset .sf-notification__tool-dropdown {
  display: inline-flex;
  align-items: center;
  align-self: center;
  min-width: 200px;
  margin-left: 20px;
  margin-right: 10px;
  color: inherit;
  background-color: inherit;
}

sf-app.sf-app .sf-notification.-toolset .sf-notification__tool-dropdown sf-select {
  flex-grow: 1;
}

sf-app.sf-app .sf-notification.-toolset .sf-notification__tool-dropdown .sf-select {
  display: flex;
  align-items: center;
}

sf-app.sf-app .sf-notification.-toolset .sf-notification__tool-dropdown .sf-select::after {
  display: none;
}

sf-app.sf-app .sf-notification.-toolset .sf-notification__tool-dropdown .sf-select select {
  display: flex;
  align-items: center;
  background: #333;
  -webkit-appearance: auto;
          appearance: auto;
}

sf-app.sf-app .sf-notification.-toolset .sf-notification__tool-link {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: break-word;
  align-self: center;
  display: inline-block;
  max-width: 200px;
  vertical-align: middle;
  padding-left: 20px;
}

sf-app.sf-app .sf-notification.-toolset .sf-notification__tool-separator {
  display: inline-block;
  width: 1px;
  background-color: var(--sf-color-secondary-dark, #777);
}

sf-app.sf-app .sf-notification.-narrow {
  width: 250px;
}

sf-app.sf-app .sf-notification.-medium {
  width: 350px;
}

sf-app.sf-app .sf-notification.-not-closable .sf-notification__close-button {
  display: none;
}

sf-app.sf-app .sf-notification__close-button {
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  position: relative;
  display: block;
  margin-left: 10px;
  order: 4;
  line-height: inherit;
  cursor: pointer;
}

sf-app.sf-app .sf-notification__close-button .sf-icon:hover {
  color: #333;
}

sf-app.sf-app .sf-notification__content {
  flex: 1;
  order: 2;
  max-width: 100%;
  word-break: normal;
}

sf-app.sf-app .sf-notification__separator {
  vertical-align: middle;
  margin-left: 10px;
  margin-right: 10px;
}

sf-app.sf-app .sf-notification-wrapper {
  position: fixed;
  top: 60px;
  left: 0;
  width: 100%;
  text-align: center;
  z-index: 10000;
  height: 0;
}

sf-app.sf-app .sf-tooltip {
  position: relative;
}

sf-app.sf-app .sf-tooltip:not(:hover, :focus, :active, .-dropped) .sf-tooltip__content, sf-app.sf-app .sf-tooltip.-open-on-click:not(.-dropped) .sf-tooltip__content {
  padding: 0;
  position: absolute;
  height: 1px;
  width: 1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
  border: 0;
  left: -1000px;
}

sf-app.sf-app .sf-tooltip__content {
  position: absolute;
  top: 100%;
  left: 0;
  font-size: var(--font-size-base);
  font-weight: normal;
}

sf-app.sf-app .sf-tooltip__content.-down, sf-app.sf-app .sf-tooltip__content.-up {
  left: 50%;
}

sf-app.sf-app .sf-tooltip__content.-down {
  transform: translateX(-50%);
}

sf-app.sf-app .sf-tooltip__content.-up {
  top: auto;
  transform: translate(-50%, -100%);
}

sf-app.sf-app .sf-tooltip__content.-right, sf-app.sf-app .sf-tooltip__content.-left {
  top: 50%;
  transform: translateY(-50%);
}

sf-app.sf-app .sf-tooltip__content.-right {
  left: 100%;
}

sf-app.sf-app .sf-tooltip__content.-left {
  left: auto;
  right: 100%;
}

sf-app.sf-app .sf-tooltip__content.-down-right, sf-app.sf-app .sf-tooltip__content.-down-left {
  transform: translateY(5px);
}

sf-app.sf-app .sf-tooltip__content.-down-right {
  left: auto;
  right: -10px;
}

sf-app.sf-app .sf-tooltip__content.-down-left {
  left: -20px;
}

sf-app.sf-app .sf-tooltip__content:not(.-toolset) {
  min-width: 250px;
  z-index: 1000000;
}

sf-app.sf-app .sf-tooltip__content.-toolset {
  z-index: 1000;
}

sf-app.sf-app .-side-content .sf-tooltip__content {
  left: auto;
  right: 0;
}

sf-app.sf-app ::-ms-input-placeholder { /* WebKit, Blink, Edge */
  color: var(--input-placeholder-color);
  font-weight: normal;
}

sf-app.sf-app :placeholder { /* Mozilla Firefox 4 to 18 */
  color: var(--input-placeholder-color);
  font-weight: normal;
  opacity: 1;
}

sf-app.sf-app ::placeholder { /* Mozilla Firefox 19+ */
  color: var(--input-placeholder-color);
  font-weight: normal;
  opacity: 1;
}

sf-app.sf-app :-moz-ui-invalid:not(output) {
  box-shadow: none;
}

sf-app.sf-app ::-ms-clear {
  display: none;
}

sf-app.sf-app :-webkit-autofill {
  box-shadow: inset 0 0 0 25px #fff;
}

sf-app.sf-app input[type=search]::-webkit-search-decoration,
sf-app.sf-app input[type=search]::-webkit-search-cancel-button,
sf-app.sf-app input[type=search]::-webkit-search-results-button,
sf-app.sf-app input[type=search]::-webkit-search-results-decoration {
  display: none;
}

sf-app.sf-app input[type=week] {
  display: flex;
  align-items: center;
}

sf-app.sf-app .sf-input {
  position: relative;
  display: inline-block;
  line-height: 18px;
  vertical-align: top;
  width: 100%;
}

sf-app.sf-app .sf-input input:not([readonly]),
sf-app.sf-app .sf-input textarea:not([readonly]) {
  display: block;
  font-family: "Open Sans", sans-serif;
  transition: border-color 0.3s;
  width: 100%;
  border: 1px solid var(--input-border);
  border-radius: 0;
  background-color: #fff;
  box-sizing: border-box;
  color: #333;
}

sf-app.sf-app .sf-input input:not([readonly]):focus,
sf-app.sf-app .sf-input textarea:not([readonly]):focus {
  box-shadow: 0 0 2px var(--sf-input-box-shadow-focus);
}

sf-app.sf-app .sf-input input:not([readonly]):disabled,
sf-app.sf-app .sf-input textarea:not([readonly]):disabled {
  background-color: #f5f5f5;
  border-color: var(--sf-input-border-disabled);
  color: var(--sf-input-color-disabled);
  -webkit-user-select: none;
          user-select: none;
}

sf-app.sf-app .sf-input input:not([readonly]):disabled:focus, sf-app.sf-app .sf-input input:not([readonly]):disabled:hover,
sf-app.sf-app .sf-input textarea:not([readonly]):disabled:focus,
sf-app.sf-app .sf-input textarea:not([readonly]):disabled:hover {
  border-color: var(--sf-input-border-disabled);
}

sf-app.sf-app .sf-input input {
  padding: 0 10px;
}

sf-app.sf-app .sf-input textarea {
  min-height: 80px;
  padding: 8px 10px;
  white-space: pre-wrap;
}

sf-app.sf-app .sf-input:not(.-bordered) input[readonly],
sf-app.sf-app .sf-input:not(.-bordered) textarea[readonly] {
  padding: 0;
  color: #333;
  background-color: transparent;
  border-color: transparent;
}

sf-app.sf-app .sf-input:not(.-bordered) input[readonly]:focus, sf-app.sf-app .sf-input:not(.-bordered) input[readonly]:hover,
sf-app.sf-app .sf-input:not(.-bordered) textarea[readonly]:focus,
sf-app.sf-app .sf-input:not(.-bordered) textarea[readonly]:hover {
  border-color: transparent;
}

sf-app.sf-app .sf-input.-clearable .sf-input__field {
  padding-right: 20px;
}

sf-app.sf-app .sf-input.-side-content .sf-input__title {
  border-right: 1px solid var(--input-border);
}

sf-app.sf-app .sf-input.-side-content .sf-input__field {
  padding-right: 46px;
}

sf-app.sf-app .sf-input.-bold .sf-input__field {
  font-weight: bold;
}

sf-app.sf-app .sf-input.-narrow {
  width: 80px;
}

sf-app.sf-app .sf-input.-narrow-medium {
  width: 200px;
}

sf-app.sf-app .sf-input.-unit {
  display: flex;
  flex-wrap: nowrap;
}

sf-app.sf-app .sf-input.-unit .sf-input__label {
  width: 100%;
}

sf-app.sf-app .sf-input.-unit .sf-input__field {
  flex: 1;
  width: auto;
  min-width: 40px;
}

sf-app.sf-app .sf-input.-unit .sf-input__field:hover + .sf-input__unit,
sf-app.sf-app .sf-input.-unit .sf-input__field:hover + .sf-input__unit::before {
  border-color: var(--input-border-hover);
}

sf-app.sf-app .sf-input.-unit.-left .sf-input__field {
  order: 2;
}

sf-app.sf-app .sf-input.-unit.-left .sf-input__unit {
  order: 1;
  border-right: 0;
  border-left: 1px solid var(--input-border);
}

sf-app.sf-app .sf-input.-unit.-left .sf-input__unit::before {
  right: auto;
  left: calc(100% + 8px);
  border-left: 0;
}

sf-app.sf-app .sf-input.-textarea.-resizable textarea {
  resize: both;
  overflow: auto;
}

sf-app.sf-app .sf-input.-textarea .sf-input__side-content {
  margin-left: 10px;
  top: 1.8em;
  left: 100%;
  right: auto;
  background: transparent;
  border: transparent;
  font-size: var(--font-size-base);
  line-height: 1.4;
  color: #333;
  height: auto;
  width: auto;
  text-align: left;
}

sf-app.sf-app .sf-input.-char-counter .sf-input__side-content {
  top: 4.3em;
}

sf-app.sf-app .sf-input.-title .sf-input__title[contenteditable=true] {
  padding-bottom: 10px;
}

sf-app.sf-app .sf-input.-title .sf-input__title[contenteditable=true]:hover {
  box-shadow: 0 3px 0 -2px var(--input-box-shadow-hover);
}

sf-app.sf-app .sf-input.-title .sf-input__title[contenteditable=true]:focus {
  box-shadow: 0 3px 2px -3px rgba(var(--sf-color-info, #006cd9), 0.8);
}

sf-app.sf-app .sf-input.-title.-large .sf-input__title {
  font-size: var(--font-size-h1-lg);
}

sf-app.sf-app .sf-input.-title.-small .sf-input__title {
  font-size: var(--font-size-h3);
  min-height: 0;
}

sf-app.sf-app .sf-input.-title .sf-input__side-content {
  margin-left: 10px;
  top: 0;
  left: 100%;
  right: auto;
  font-size: var(--font-size-base);
  line-height: 1.55;
  text-align: left;
}

sf-app.sf-app .sf-input.-short.-textarea textarea {
  min-height: 60px;
}

sf-app.sf-app .sf-input.-short .sf-input__field {
  height: 28px;
}

sf-app.sf-app .sf-input.-large.-textarea textarea {
  min-height: 145px;
}

sf-app.sf-app .sf-input.-large .sf-input__field,
sf-app.sf-app .sf-input.-large .sf-input__textarea {
  font-size: var(--font-size-lg);
}

sf-app.sf-app .sf-input.-centered .sf-input__field {
  text-align: center;
}

sf-app.sf-app .sf-input.-no-border {
  border: 0;
  padding: 0;
}

sf-app.sf-app .sf-input.-no-border .sf-input__textarea {
  border: 0;
  padding: 0;
}

sf-app.sf-app .sf-input.-no-resize .sf-input__textarea {
  resize: none;
}

sf-app.sf-app .sf-input.-inline.-large-text .sf-input__field,
sf-app.sf-app .sf-input.-inline.-large-text .sf-input__textarea {
  font-size: var(--font-size-lg);
}

sf-app.sf-app .sf-input.-inline .sf-input__field,
sf-app.sf-app .sf-input.-inline .sf-input__textarea {
  font-size: var(--font-size-base);
  border: 0;
}

sf-app.sf-app .sf-input.-inline .sf-input__field:not([disabled]):hover,
sf-app.sf-app .sf-input.-inline .sf-input__textarea:not([disabled]):hover {
  background-color: var(--sf-color-warning-bg, #ffc);
}

sf-app.sf-app .sf-input.-inline .sf-input__field:focus,
sf-app.sf-app .sf-input.-inline .sf-input__textarea:focus {
  box-shadow: none;
}

sf-app.sf-app .sf-input.-inline .sf-input__field {
  padding-left: 0;
  padding-right: 0;
  height: 22px;
}

sf-app.sf-app .sf-input.-inline .sf-input__textarea {
  padding: 0;
}

sf-app.sf-app .sf-input.-small-label .sf-input__label {
  font-size: var(--font-size-h5);
  font-weight: normal;
  color: var(--sf-color-h5);
  text-transform: uppercase;
  margin-top: 0;
  margin-bottom: 0;
  margin: 0 0 5px;
}

sf-app.sf-app .sf-input__label:not(.-small-label) {
  display: block;
  margin: 0 0 5px;
  font-weight: 700;
  font-size: var(--font-size-h4-lg);
}

sf-app.sf-app .sf-input__field {
  color: inherit;
  height: 36px;
}

sf-app.sf-app .sf-input__field:focus + .sf-input__unit {
  box-shadow: 0 0 2px var(--sf-input-box-shadow-focus);
}

sf-app.sf-app .sf-input__no-value {
  font-size: var(--font-size-lg);
  color: var(--sf-color-secondary, #ccc);
}

sf-app.sf-app .sf-input__hint {
  margin: 5px 0 0;
  color: var(--sf-secondary-text-color);
  width: 100%;
}

sf-app.sf-app .sf-input__required {
  display: block;
  margin: 5px 0 0;
  color: var(--sf-color-error, #ff4848);
}

sf-app.sf-app .sf-input__clear-button {
  position: absolute;
  text-decoration: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 100%;
  top: 0;
  right: 0;
  margin: 0;
  padding: 0;
  color: inherit;
  opacity: 0;
  transform: scale(0);
  transition: opacity 0.3s ease-out;
  transition-property: opacity, transform;
  transition-delay: 100ms;
  outline: none;
  z-index: 1;
  z-index: 5;
}

sf-app.sf-app .sf-input__clear-button:hover .sf-icon, sf-app.sf-app .sf-input__clear-button:focus .sf-icon, sf-app.sf-app .sf-input__clear-button:active .sf-icon {
  color: #333;
}

sf-app.sf-app .sf-input__clear-button.-show {
  opacity: 1;
  transform: scale(1);
}

sf-app.sf-app .sf-input__side-content {
  position: absolute;
  opacity: 1;
  top: 1.3em;
  color: var(--sf-color-secondary, #ccc);
}

sf-app.sf-app .sf-input__unit {
  cursor: pointer;
  text-decoration: none;
  text-align: center;
  vertical-align: middle;
  padding-left: 10px;
  padding-right: 10px;
  width: auto;
  height: 36px;
  line-height: 36px;
  background-color: #f5f5f5;
  border-top: 1px solid var(--input-border);
  border-right: 1px solid var(--input-border);
  border-bottom: 1px solid var(--input-border);
  outline: none;
  white-space: nowrap;
}

sf-app.sf-app .sf-input__unit, sf-app.sf-app .sf-input__unit::before {
  transition: border-color 0.3s;
}

sf-app.sf-app .sf-input__unit::before {
  display: block;
  content: "";
  position: relative;
  left: -11px;
  width: 3px;
  height: calc(100% + 2px);
  border-top: 1px solid var(--input-border);
  border-bottom: 1px solid var(--input-border);
  background-color: #f5f5f5;
}

sf-app.sf-app .sf-input__char-counter, sf-app.sf-app .sf-input__suffix {
  position: absolute;
  margin-left: 10px;
  left: 100%;
  top: 50%;
  transform: translateY(-50%);
}

sf-app.sf-app .sf-input__char-counter {
  font-size: var(--font-size-base);
  color: var(--input-char-counter-success-color);
}

sf-app.sf-app .sf-input__char-counter.-error {
  color: var(--input-char-counter-error-color);
}

sf-app.sf-app .sf-input__title {
  font-family: "Open Sans Condensed", sans-serif;
  font-size: var(--font-size-h1);
  font-weight: bold;
  line-height: 1.3;
  margin-top: 0;
  margin-bottom: 0;
  outline: none;
  cursor: text;
  min-height: 58px;
}

sf-app.sf-app .sf-input__title::-webkit-input-placeholder {
  font-family: Open Sans Condensed, sans-serif;
  font-size: var(--font-size-h1);
  line-height: 1.3;
  font-weight: bold;
}

sf-app.sf-app .sf-input__title::-moz-placeholder { /* Firefox 19+ */
  font-family: Open Sans Condensed, sans-serif;
  font-size: var(--font-size-h1);
  line-height: 1.3;
  font-weight: bold;
}

sf-app.sf-app .sf-input__title:-ms-input-placeholder {
  font-family: Open Sans Condensed, sans-serif;
  font-size: var(--font-size-h1);
  line-height: 1.3;
  font-weight: bold;
}

sf-app.sf-app .sf-input__title.-placeholder::before {
  display: block;
  content: attr(data-placeholder);
  color: var(--input-title-placeholder-color);
}

sf-app.sf-app .sf-input__title.-placeholder br:only-child {
  display: none;
}

sf-app.sf-app .sf-input__title .sf-input__required {
  margin-top: -20px;
  padding-top: 3px;
  border-top: 1px solid var(--sf-color-error, #ff4848);
}

sf-app.sf-app .sf-input.ng-dirty.ng-invalid .sf-input__field.ng-dirty.ng-invalid, sf-app.sf-app .sf-input.ng-dirty.ng-invalid .sf-input__field.ng-dirty.ng-invalid:focus, sf-app.sf-app .sf-input.ng-dirty.ng-invalid .sf-input__field.ng-dirty.ng-invalid:hover,
sf-app.sf-app .sf-input.ng-dirty.ng-invalid .sf-input__textarea.ng-dirty.ng-invalid,
sf-app.sf-app .sf-input.ng-dirty.ng-invalid .sf-input__textarea.ng-dirty.ng-invalid:focus,
sf-app.sf-app .sf-input.ng-dirty.ng-invalid .sf-input__textarea.ng-dirty.ng-invalid:hover, sf-app.sf-app .sf-input.-required .sf-input__field.ng-dirty.ng-invalid, sf-app.sf-app .sf-input.-required .sf-input__field.ng-dirty.ng-invalid:focus, sf-app.sf-app .sf-input.-required .sf-input__field.ng-dirty.ng-invalid:hover,
sf-app.sf-app .sf-input.-required .sf-input__textarea.ng-dirty.ng-invalid,
sf-app.sf-app .sf-input.-required .sf-input__textarea.ng-dirty.ng-invalid:focus,
sf-app.sf-app .sf-input.-required .sf-input__textarea.ng-dirty.ng-invalid:hover {
  border-color: var(--sf-color-error, #ff4848);
}

sf-app.sf-app .sf-input.ng-dirty.ng-invalid.-title .sf-input__required, sf-app.sf-app .sf-input.-required.-title .sf-input__required {
  margin-top: 0;
  padding-top: 3px;
  border-top: 1px solid var(--sf-color-error, #ff4848);
}

sf-app.sf-app .sf-input-file {
  display: flex;
}

sf-app.sf-app .sf-input-file__label {
  position: relative;
  cursor: pointer;
  z-index: 10;
}

sf-app.sf-app .sf-input-file input[type=file] {
  position: absolute;
  height: 0;
  width: 0;
  opacity: 0;
  z-index: auto;
}

sf-app.sf-app .sf-input-file input[type=file]:focus + .sf-input-file__label .sf-button {
  background-color: var(--sf-color-secondary-lighter, #e4e4e4);
}

sf-app.sf-app .sf-input-file input[type=file]:focus + .sf-input-file__label .sf-button.-action {
  background-color: #309255;
}

sf-app.sf-app .sf-dropdown {
  overflow: hidden;
  overflow-y: auto;
  position: relative;
  display: inline-block;
}

sf-app.sf-app .sf-dropdown:not(.-empty) {
  padding: 10px 0;
  min-width: 200px;
  white-space: nowrap;
  border: 1px solid var(--dropdown-border);
  box-shadow: 0 3px 5px rgba(var(--sf-color-secondary-lighter, #e4e4e4), 0.5);
  background-color: #fff;
  color: #333;
  max-height: calc(100vh - 46px);
}

sf-app.sf-app .sf-dropdown.-condensed {
  padding-top: 0;
  padding-bottom: 0;
}

sf-app.sf-app .sf-dropdown.-color-picker {
  width: 231px;
  padding: 4px;
}

sf-app.sf-app .sf-dropdown__item {
  display: flex;
  flex-wrap: nowrap;
  width: auto;
  position: relative;
  margin-bottom: 1px;
  padding: 3px 20px;
  word-break: break-all;
  transition: background-color 0.3s, color 0.3s;
  cursor: pointer;
}

sf-app.sf-app .sf-dropdown__item:hover, sf-app.sf-app .sf-dropdown__item:focus {
  background-color: #f5f5f5;
}

sf-app.sf-app .sf-dropdown__item:hover .sf-dropdown__delete, sf-app.sf-app .sf-dropdown__item:focus .sf-dropdown__delete {
  display: block;
}

sf-app.sf-app .sf-dropdown__item.-active {
  background-color: var(--dropdown-active-bg);
}

sf-app.sf-app .sf-dropdown__item.-not-clickable {
  cursor: default;
}

sf-app.sf-app .sf-dropdown__item.-not-clickable:hover, sf-app.sf-app .sf-dropdown__item.-not-clickable:focus {
  background-color: transparent;
  outline: 0;
}

sf-app.sf-app .sf-dropdown__item[disabled], sf-app.sf-app .sf-dropdown__item.-disabled {
  color: rgb(173.4, 173.4, 173.4);
  cursor: default;
  pointer-events: none;
}

sf-app.sf-app .sf-dropdown__delete {
  display: none;
  margin-left: auto;
}

sf-app.sf-app .sf-dropdown__no-items {
  padding: 5px 10px 30px;
  color: var(--sf-color-secondary-dark, #999);
  cursor: default;
}

sf-app.sf-app .sf-dropdown__heading {
  font-size: var(--font-size-h5);
  font-weight: normal;
  color: var(--sf-color-h5);
  text-transform: uppercase;
  margin-top: 0;
  margin-bottom: 0;
  padding: 10px 20px 8px;
  line-height: 1;
  cursor: default;
}

sf-app.sf-app .sf-dropdown__heading.-condensed {
  padding-left: 10px;
  padding-right: 10px;
}

sf-app.sf-app .sf-dropdown__heading:hover {
  background: transparent;
}

sf-app.sf-app .sf-dropdown__notification {
  margin: 5px 20px 15px;
  white-space: normal;
  cursor: default;
}

sf-app.sf-app .sf-dropdown__content {
  cursor: default;
}

sf-app.sf-app .sf-dropdown__separator {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid #eee;
  cursor: default;
}

sf-app.sf-app .sf-dropdown__description {
  font-size: var(--font-size-h5);
  font-weight: normal;
  color: var(--sf-color-h5);
  text-transform: uppercase;
  margin-top: 0;
  margin-bottom: 0;
  display: block;
  text-transform: uppercase;
  line-height: 1;
}

sf-app.sf-app .sf-dropdown__counter {
  margin-left: auto;
  min-width: 50px;
  text-align: right;
}

sf-app.sf-app .sf-dropdown__counter.-positive {
  color: var(--sf-color-success, #38ab63);
}

sf-app.sf-app .sf-dropdown__counter.-neutral {
  color: var(--dropdown-item-counter-neutral);
}

sf-app.sf-app .sf-dropdown__icon {
  font-size: inherit;
  margin-top: -5px;
}

sf-app.sf-app .sf-expander {
  display: block;
  margin-bottom: 10px;
  margin-left: calc(var(--expander-left-offset) * -1);
}

sf-app.sf-app .sf-expander > hr {
  margin-left: var(--expander-left-offset);
}

sf-app.sf-app .sf-expander__header {
  font-size: var(--font-size-h2);
  font-weight: 300;
  line-height: 1.3;
  color: var(--sf-color-h2);
  margin-top: 0;
  margin-bottom: 0;
  display: inline-block;
  padding-left: var(--expander-header-padding-horizontal, 0);
  padding-top: var(--expander-header-padding-vertical, 10px);
  padding-bottom: var(--expander-header-padding-vertical, 10px);
  width: 100%;
  position: relative;
  cursor: pointer;
}

sf-app.sf-app .sf-expander__header:focus .sf-expander__icon {
  transition: border-color 0.3s, background-color 0.3s, color 0.3s;
}

sf-app.sf-app .sf-expander__icon {
  margin-right: var(--expander-icon-margin-right, 28px) !important;
  margin-left: var(--expander-icon-margin-left, 0) !important;
}

sf-app.sf-app .sf-expander__content {
  margin-left: var(--expander-left-offset);
}

sf-app.sf-app .sf-expander__checkbox {
  position: absolute;
  left: -9999px;
}

sf-app.sf-app .sf-expander__checkbox ~ .sf-expander__content {
  visibility: hidden;
}

sf-app.sf-app .sf-expander__checkbox:checked ~ .sf-expander__content {
  visibility: visible;
}

sf-app.sf-app .sf-expander__checkbox:checked ~ .sf-expander__section {
  padding: var(--expander-section-padding, 0);
  background: var(--expander-section-background, transparent);
  margin-right: var(--expander-section-margin-right, 0);
}

sf-app.sf-app .sf-checkbox {
  position: relative;
  display: block;
}

sf-app.sf-app .sf-checkbox.-inline {
  display: inline-block;
}

sf-app.sf-app .sf-checkbox__label {
  display: flex;
  align-items: center;
  position: relative;
  width: 100%;
  font-weight: normal;
  cursor: pointer;
  transition: var(--checkbox-transtion);
}

sf-app.sf-app .sf-checkbox__label .sf-radio__icon,
sf-app.sf-app .sf-checkbox__label .sf-checkbox__icon {
  transition: var(--checkbox-transtion);
}

sf-app.sf-app .sf-checkbox__label .sf-radio__text,
sf-app.sf-app .sf-checkbox__label .sf-checkbox__text {
  margin-left: 5px;
  width: 100%;
}

sf-app.sf-app .sf-checkbox__label .sf-radio__description {
  margin-left: 5px;
  width: 100%;
}

sf-app.sf-app .sf-checkbox__label.-inline {
  display: inline-flex;
  width: auto;
}

sf-app.sf-app .sf-checkbox__label.-width-auto {
  width: auto;
}

sf-app.sf-app .sf-checkbox__input {
  position: absolute;
  margin: 0;
  width: 15px;
  height: 15px;
  z-index: 5;
  opacity: 0;
  cursor: pointer;
}

sf-app.sf-app .sf-checkbox__input:checked + label .sf-radio__icon,
sf-app.sf-app .sf-checkbox__input:checked + label .sf-checkbox__icon {
  border-radius: 1px;
  border-color: var(--checkbox-checked-border);
  background-color: #fff;
  color: var(--sf-color-secondary-dark, #777);
}

sf-app.sf-app .sf-checkbox__input:checked + label .sf-radio__icon::before,
sf-app.sf-app .sf-checkbox__input:checked + label .sf-checkbox__icon::before {
  opacity: 1;
}

sf-app.sf-app .sf-checkbox__input:checked:hover + label .sf-radio__icon,
sf-app.sf-app .sf-checkbox__input:checked:hover + label .sf-checkbox__icon {
  border-color: var(--checkbox-border-hover);
}

sf-app.sf-app .sf-checkbox__input:active + label .sf-radio__icon,
sf-app.sf-app .sf-checkbox__input:active + label .sf-checkbox__icon {
  background-color: #fff;
}

sf-app.sf-app .sf-checkbox__input:hover + label .sf-radio__icon,
sf-app.sf-app .sf-checkbox__input:hover + label .sf-checkbox__icon, sf-app.sf-app .sf-checkbox__input:focus + label .sf-radio__icon,
sf-app.sf-app .sf-checkbox__input:focus + label .sf-checkbox__icon {
  border-color: var(--checkbox-border-hover);
}

sf-app.sf-app .sf-checkbox__input:disabled {
  cursor: default;
}

sf-app.sf-app .sf-checkbox__input:disabled + label {
  cursor: default;
}

sf-app.sf-app .sf-checkbox__input:disabled + label .sf-radio__icon,
sf-app.sf-app .sf-checkbox__input:disabled + label .sf-checkbox__icon {
  border-color: var(--checkbox-border);
  background: #f5f5f5;
  color: var(--sf-color-secondary, #ccc);
}

sf-app.sf-app .sf-checkbox__input:disabled + label .sf-radio__icon::before {
  background-color: var(--checkbox-border);
}

sf-app.sf-app .sf-checkbox__icon {
  display: block;
  position: relative;
  flex: none;
  border: 1px solid var(--checkbox-border);
  transition: var(--checkbox-transtion);
  border-radius: 1px;
  width: 15px;
  height: 15px;
}

sf-app.sf-app .sf-checkbox__icon::before {
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  position: absolute;
  transition: opacity 0.3s;
  opacity: 0;
}

sf-app.sf-app .sf-checkbox__icon::before {
  top: 0;
  left: 0;
  width: 15px;
  height: 15px;
  font-size: var(--icon-size-2xs);
  content: "\f00c";
}

sf-app.sf-app .sf-checkbox.-ellipsis {
  width: 100%;
}

sf-app.sf-app .sf-checkbox.-ellipsis label .sf-checkbox__text,
sf-app.sf-app .sf-checkbox.-ellipsis label .sf-radio__text {
  padding-left: 21px;
  margin-left: -16px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: break-word;
}

sf-app.sf-app .sf-radio {
  position: relative;
  display: block;
}

sf-app.sf-app .sf-radio.-inline {
  display: inline-block;
}

sf-app.sf-app .sf-radio__label {
  display: flex;
  align-items: center;
  position: relative;
  width: 100%;
  font-weight: normal;
  cursor: pointer;
  transition: var(--checkbox-transtion);
}

sf-app.sf-app .sf-radio__label .sf-radio__icon,
sf-app.sf-app .sf-radio__label .sf-checkbox__icon {
  transition: var(--checkbox-transtion);
}

sf-app.sf-app .sf-radio__label .sf-radio__text,
sf-app.sf-app .sf-radio__label .sf-checkbox__text {
  margin-left: 5px;
  width: 100%;
}

sf-app.sf-app .sf-radio__label .sf-radio__description {
  margin-left: 5px;
  width: 100%;
}

sf-app.sf-app .sf-radio__label.-inline {
  display: inline-flex;
  width: auto;
}

sf-app.sf-app .sf-radio__label.-width-auto {
  width: auto;
}

sf-app.sf-app .sf-radio__description {
  font-size: var(--font-size-base);
  margin-left: 21px;
  margin-bottom: 0;
  color: var(--sf-secondary-text-color);
}

sf-app.sf-app .sf-radio__input {
  position: absolute;
  margin: 0;
  width: 16px;
  height: 16px;
  z-index: 5;
  opacity: 0;
  cursor: pointer;
}

sf-app.sf-app .sf-radio__input:checked + label .sf-radio__icon,
sf-app.sf-app .sf-radio__input:checked + label .sf-checkbox__icon {
  border-radius: 50%;
  border-color: var(--checkbox-checked-border);
  background-color: #fff;
  color: var(--sf-color-secondary-dark, #777);
}

sf-app.sf-app .sf-radio__input:checked + label .sf-radio__icon::before,
sf-app.sf-app .sf-radio__input:checked + label .sf-checkbox__icon::before {
  opacity: 1;
}

sf-app.sf-app .sf-radio__input:checked:hover + label .sf-radio__icon,
sf-app.sf-app .sf-radio__input:checked:hover + label .sf-checkbox__icon {
  border-color: var(--checkbox-border-hover);
}

sf-app.sf-app .sf-radio__input:active + label .sf-radio__icon,
sf-app.sf-app .sf-radio__input:active + label .sf-checkbox__icon {
  background-color: #fff;
}

sf-app.sf-app .sf-radio__input:hover + label .sf-radio__icon,
sf-app.sf-app .sf-radio__input:hover + label .sf-checkbox__icon, sf-app.sf-app .sf-radio__input:focus + label .sf-radio__icon,
sf-app.sf-app .sf-radio__input:focus + label .sf-checkbox__icon {
  border-color: var(--checkbox-border-hover);
}

sf-app.sf-app .sf-radio__input:disabled {
  cursor: default;
}

sf-app.sf-app .sf-radio__input:disabled + label {
  cursor: default;
}

sf-app.sf-app .sf-radio__input:disabled + label .sf-radio__icon,
sf-app.sf-app .sf-radio__input:disabled + label .sf-checkbox__icon {
  border-color: var(--checkbox-border);
  background: #f5f5f5;
  color: var(--sf-color-secondary, #ccc);
}

sf-app.sf-app .sf-radio__input:disabled + label .sf-radio__icon::before {
  background-color: var(--checkbox-border);
}

sf-app.sf-app .sf-radio__icon {
  display: block;
  position: relative;
  flex: none;
  border: 1px solid var(--checkbox-border);
  transition: var(--checkbox-transtion);
  border-radius: 50%;
  width: 16px;
  height: 16px;
}

sf-app.sf-app .sf-radio__icon::before {
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  position: absolute;
  transition: opacity 0.3s;
  opacity: 0;
}

sf-app.sf-app .sf-radio__icon::before {
  top: 3px;
  left: 3px;
  width: 8px;
  height: 8px;
  content: "";
  border-radius: 50%;
  background-color: var(--sf-color-secondary-dark, #777);
}

sf-app.sf-app .sf-radio.-ellipsis {
  width: 100%;
}

sf-app.sf-app .sf-radio.-ellipsis label .sf-checkbox__text,
sf-app.sf-app .sf-radio.-ellipsis label .sf-radio__text {
  padding-left: 21px;
  margin-left: -16px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: break-word;
}

sf-app.sf-app .-side-by-side .sf-radio .sf-radio__icon, sf-app.sf-app .-columns .sf-radio .sf-radio__icon {
  align-self: flex-start;
  margin-top: 3px;
}

sf-app.sf-app .sf-choice-group.-chip {
  display: inline-flex;
  font-size: var(--font-size-base);
}

sf-app.sf-app .sf-choice-group.-chip.-no-offset .sf-radio {
  margin-bottom: 0 !important;
}

sf-app.sf-app .sf-choice-group.-chip .sf-radio {
  margin-right: 0;
}

sf-app.sf-app .sf-choice-group.-chip .sf-radio:first-child .sf-radio__label {
  border-left: 1px solid var(--button-border-color);
  border-top-left-radius: 28px;
  border-bottom-left-radius: 28px;
}

sf-app.sf-app .sf-choice-group.-chip .sf-radio:last-child .sf-radio__label {
  border-top-right-radius: 28px;
  border-bottom-right-radius: 28px;
}

sf-app.sf-app .sf-choice-group.-chip .sf-radio.-size-m .sf-radio__label {
  width: 63px;
}

sf-app.sf-app .sf-choice-group.-chip .sf-radio.-size-l .sf-radio__label {
  width: auto;
}

sf-app.sf-app .sf-choice-group.-chip .sf-radio.-size-l .sf-radio__text {
  margin: 0 15px;
}

sf-app.sf-app .sf-choice-group.-chip .sf-radio__label {
  display: inline-flex;
  justify-content: center;
  height: 28px;
  line-height: 28px;
  min-width: 30px;
  text-align: center;
  border-top: 1px solid var(--button-border-color);
  border-bottom: 1px solid var(--button-border-color);
  border-right: 1px solid var(--button-border-color);
  -webkit-user-select: none;
          user-select: none;
}

sf-app.sf-app .sf-choice-group.-chip .sf-radio__label:hover {
  background-color: var(--choice-group-radio-chip-hover-bg-color);
  color: var(--choice-group-radio-chip-hover-color);
}

sf-app.sf-app .sf-choice-group.-chip .sf-radio__icon {
  display: none;
}

sf-app.sf-app .sf-choice-group.-chip .sf-radio__text {
  margin: 0 10px;
}

sf-app.sf-app .sf-choice-group.-chip .sf-radio__input:checked + .sf-radio__label {
  background-color: var(--radio-chip-selected-bg-color);
  color: var(--radio-chip-selected-color);
}

sf-app.sf-app .sf-choice-group.-list .sf-radio,
sf-app.sf-app .sf-choice-group.-list .sf-checkbox {
  margin-bottom: 0;
  margin-right: 0;
}

sf-app.sf-app .sf-choice-group.-list .sf-radio:first-child .sf-radio__label,
sf-app.sf-app .sf-choice-group.-list .sf-radio:first-child .sf-checkbox__label,
sf-app.sf-app .sf-choice-group.-list .sf-checkbox:first-child .sf-radio__label,
sf-app.sf-app .sf-choice-group.-list .sf-checkbox:first-child .sf-checkbox__label {
  border-top: 1px solid var(--button-border-color);
}

sf-app.sf-app .sf-choice-group.-list .sf-radio__label:hover {
  background-color: var(--radio-list-hover-bg-color);
}

sf-app.sf-app .sf-choice-group.-list .sf-radio__label,
sf-app.sf-app .sf-choice-group.-list .sf-checkbox__label {
  padding: 10px 9px;
  font-size: 13px;
  border-bottom: 1px solid var(--button-border-color);
}

sf-app.sf-app .sf-choice-group.-list .sf-radio__icon {
  display: none;
}

sf-app.sf-app .sf-choice-group.-list .sf-radio__text {
  margin-left: 0;
}

sf-app.sf-app .sf-choice-group.-list .sf-radio__input:checked + .sf-radio__label,
sf-app.sf-app .sf-choice-group.-list .sf-checkbox__input:checked + .sf-checkbox__label {
  background-color: var(--radio-chip-selected-bg-color);
}

@keyframes loader {
  40% {
    opacity: 1;
  }
}
@keyframes loadingProgressbar {
  0% {
    transform: scaleX(0);
  }
  50% {
    transform: scaleX(1);
  }
  100% {
    transform: translateX(100%);
  }
}
@keyframes loadingSkeleton {
  0% {
    opacity: 0.7;
  }
  50% {
    opacity: 0.8;
  }
  100% {
    opacity: 0.9;
  }
}
@keyframes pulsingColorLoading {
  0% {
    background-color: #f5f5f5;
  }
  50% {
    background-color: rgb(250.1, 250.1, 250.1);
  }
  100% {
    background-color: rgb(246.275, 246.275, 246.275);
  }
}
sf-app.sf-app .sf-loader {
  position: absolute;
  display: block;
  inset: 0;
  background-color: transparent;
}

sf-app.sf-app .sf-loader__content {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  font-size: 0;
}

sf-app.sf-app .sf-loader__rect {
  display: inline-block;
  vertical-align: middle;
  width: 6px;
  height: 6px;
  margin: 0 1px 0 0;
  background-color: var(--sf-color-success, #38ab63);
  animation: loader 1s infinite ease-in-out;
  opacity: 0.3;
  border-radius: 2px;
}

sf-app.sf-app .sf-loader__rect.-second {
  animation-delay: -0.9s;
}

sf-app.sf-app .sf-loader__rect.-third {
  animation-delay: -0.8s;
}

sf-app.sf-app .sf-loader.-home {
  position: fixed;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #fff;
  z-index: 100000;
}

sf-app.sf-app .sf-loader.-big .sf-loader__rect, sf-app.sf-app .sf-loader.-home .sf-loader__rect {
  width: 10px;
  height: 10px;
}

sf-app.sf-app .sf-loader.-mini .sf-loader__rect {
  width: 4px;
  height: 4px;
  border-radius: 1px;
}

sf-app.sf-app .sf-loader.-inline {
  position: relative;
  display: inline-block;
}

sf-app.sf-app .sf-loader.-mini:not(.-no-offset) {
  margin-top: -4px;
}

sf-app.sf-app .sf-loader.-inline.-mini:not(.-no-offset) {
  top: -2px;
}

sf-app.sf-app .sf-loader.-color .sf-loader__rect {
  background-color: #333;
}

sf-app.sf-app .sf-loader.-transparent .sf-loader__rect {
  background-color: #fff;
}

sf-app.sf-app .sf-loader.-progressbar {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  width: 100%;
  overflow: hidden;
  z-index: 10000;
}

sf-app.sf-app .sf-loader.-progressbar .sf-loader__content {
  position: absolute;
  width: 100%;
  height: 2px;
  background-color: var(--sf-color-success, #38ab63);
  animation: loadingProgressbar 1s linear infinite;
  transform-origin: 0 0;
}

sf-app.sf-app .sf-loader.-progressbar .sf-loader__rect {
  display: none;
}

sf-app.sf-app .sf-loader.-progressbar.-overlay {
  bottom: 0;
  height: 100%;
  z-index: 1000000;
}

sf-app.sf-app .sf-loader.-progressbar.-overlay .sf-loader__content {
  top: 0;
  left: 0;
}

sf-app.sf-app .sf-loader.-skeleton {
  position: static;
}

sf-app.sf-app .sf-loader.-skeleton.-fluid-content .sf-loader__content {
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
}

sf-app.sf-app .sf-loader.-skeleton.-fluid-content .sf-loader__rect {
  width: 100%;
  height: 10px;
  margin-bottom: 6px;
  background-color: #f5f5f5;
  animation: loadingSkeleton 1s linear infinite;
}

sf-app.sf-app .sf-loader.-skeleton.-fluid-content .sf-loader__rect:last-of-type {
  width: 75%;
  margin-bottom: 0;
}

sf-app.sf-app .sf-loader.-skeleton:not(.-fluid-content) .sf-loader__content {
  position: relative;
  height: 100%;
  color: #f5f5f5;
  background-repeat: no-repeat;
  animation: loadingSkeleton 1s linear infinite;
}

sf-app.sf-app .sf-loader.-skeleton:not(.-fluid-content) .sf-loader__rect {
  display: none;
}

sf-app.sf-app .sf-loader.-skeleton.-content .sf-loader__content {
  height: 126px;
  background-image: linear-gradient(currentColor 0, currentColor 100%), linear-gradient(currentColor 0, currentColor 100%), linear-gradient(currentColor 0, currentColor 100%), linear-gradient(currentColor 0, currentColor 100%), linear-gradient(currentColor 0, currentColor 100%), linear-gradient(currentColor 0, currentColor 100%), linear-gradient(currentColor 0, currentColor 100%);
  background-size: 100% 10px, 100% 10px, 100% 10px, 100% 10px, 100% 10px, 100% 10px, 75% 10px;
  background-position: 0 0, 0 16px, 0 32px, 0 48px, 0 64px, 0 80px, 0 96px;
}

sf-app.sf-app .sf-loader.-skeleton.-title .sf-loader__content {
  height: 94px;
  background-image: linear-gradient(currentColor 0, currentColor 100%), linear-gradient(currentColor 0, currentColor 100%);
  background-size: 100% 42px, 75% 42px;
  background-position: 0 0, 0 52px;
}

sf-app.sf-app .sf-loader.-skeleton.-single-title .sf-loader__content {
  height: 88px;
  background-image: linear-gradient(currentColor, currentColor);
  background-size: 100% 42px;
  background-position: 0 16px;
}

sf-app.sf-app .sf-loader.-skeleton.-single-list {
  padding: 13px 8px;
}

sf-app.sf-app .sf-loader.-skeleton.-single-list .sf-loader__content {
  height: 10px;
  background-color: currentColor;
}

sf-app.sf-app .sf-loader.-skeleton.-list {
  height: 53px;
  padding: 13px 8px;
}

sf-app.sf-app .sf-loader.-skeleton.-list .sf-loader__content {
  height: 26px;
  background-image: linear-gradient(currentColor 0, currentColor 100%), linear-gradient(currentColor 0, currentColor 100%);
  background-size: 100% 10px, 75% 10px;
  background-position: 0 0, 0 16px;
}

sf-app.sf-app .sf-loader.-skeleton.-list-horizontal {
  padding: 39px 18px;
  width: 190px;
  height: 230px;
  border: 1px solid #eee;
}

sf-app.sf-app .sf-loader.-skeleton.-list-horizontal .sf-loader__content {
  height: 58px;
  background-image: linear-gradient(currentColor 0, currentColor 100%), linear-gradient(currentColor 0, currentColor 100%), linear-gradient(currentColor 0, currentColor 100%), linear-gradient(currentColor 0, currentColor 100%);
  background-size: 100% 10px, 100% 10px, 100% 10px, 75% 10px;
  background-position: 0 0, 0 16px, 0 32px, 0 48px;
}

sf-app.sf-app .sf-loader.-skeleton.-list-with-thumb {
  width: 190px;
  height: 230px;
  border: 1px solid #eee;
}

sf-app.sf-app .sf-loader.-skeleton.-list-with-thumb .sf-loader__content {
  height: 100%;
  background-image: linear-gradient(currentColor 0, currentColor 100%), linear-gradient(currentColor 0, currentColor 100%), linear-gradient(currentColor 0, currentColor 100%), linear-gradient(currentColor 0, currentColor 100%);
  background-size: 100% 138px, 80% 10px, 80% 10px, 50% 10px;
  background-position: 0 0, 50% 164px, 50% 180px, 20% 196px;
}

sf-app.sf-app .sf-loader.-skeleton.-side-content .sf-loader__content {
  height: 100px;
  background-image: linear-gradient(currentColor 0, currentColor 100%), linear-gradient(currentColor 0, currentColor 100%), linear-gradient(currentColor 0, currentColor 100%);
  background-size: 90% 10px, 50% 10px, 75% 10px;
  background-position: 0 15px, 0 45px, 0 75px;
}

sf-app.sf-app .sf-loader.-skeleton.-darker .sf-loader__content {
  color: var(--sf-color-secondary-lighter, #e4e4e4);
}

sf-app.sf-app .sf-loader.-skeleton.-sequence {
  border-bottom: 1px solid #eee;
}

sf-app.sf-app .sf-loader.-skeleton.-sequence:first-child {
  border-top: 1px solid #eee;
}

sf-app.sf-app .sf-loader.-skeleton.-media .sf-loader__content {
  flex-direction: row;
}

sf-app.sf-app .sf-loader.-skeleton.-media .sf-loader__rect {
  height: 150px;
  background-color: #f5f5f5;
  margin-bottom: 0;
}

sf-app.sf-app .sf-loader.-skeleton.-media .sf-loader__rect:not(:first-child) {
  margin-left: 10px;
}

sf-app.sf-app .sf-loader.-skeleton.-media .-first {
  flex-basis: 15%;
}

sf-app.sf-app .sf-loader.-skeleton.-media .-second {
  flex-basis: 22%;
}

sf-app.sf-app .sf-loader.-skeleton.-media .-third {
  flex-basis: 11%;
}

sf-app.sf-app .sf-loader.-skeleton.-media .-fourth {
  flex-basis: 22%;
}

sf-app.sf-app .sf-loader.-skeleton.-media .-fifth {
  flex-basis: 15%;
}

sf-app.sf-app .sf-loader.-skeleton.-media .-sixth {
  flex-basis: 15%;
}

sf-app.sf-app .sf-loader.-skeleton.-media + .-media .-first {
  flex-basis: 11%;
}

sf-app.sf-app .sf-loader.-skeleton.-media + .-media .-second {
  flex-basis: 15%;
}

sf-app.sf-app .sf-loader.-skeleton.-media + .-media .-third {
  flex-basis: 15%;
}

sf-app.sf-app .sf-loader.-skeleton.-media + .-media .-fourth {
  flex-basis: 22%;
}

sf-app.sf-app .sf-loader.-skeleton.-media + .-media .-fifth {
  flex-basis: 15%;
}

sf-app.sf-app .sf-loader.-skeleton.-media + .-media .-sixth {
  flex-basis: 22%;
}

sf-app.sf-app .sf-loader.-skeleton.-media + .-media + .-media .-first {
  flex-basis: 22%;
}

sf-app.sf-app .sf-loader.-skeleton.-media + .-media + .-media .-second {
  flex-basis: 15%;
}

sf-app.sf-app .sf-loader.-skeleton.-media + .-media + .-media .-third {
  flex-basis: 22%;
}

sf-app.sf-app .sf-loader.-skeleton.-media + .-media + .-media .-fourth {
  flex-basis: 15%;
}

sf-app.sf-app .sf-loader.-skeleton.-media + .-media + .-media .-fifth {
  flex-basis: 15%;
}

sf-app.sf-app .sf-loader.-skeleton.-media + .-media + .-media .-sixth {
  flex-basis: 11%;
}

sf-app.sf-app .sf-loader.-negative-zindex {
  z-index: -1;
}

sf-app.sf-app .sf-loader.-solid-block {
  background-color: #f5f5f5;
  animation: pulsingColorLoading 1.2s linear infinite;
}

sf-app.sf-app sf-chip.-sf-txt-hint {
  color: var(--sf-secondary-text-color-on-blue-bg);
}

sf-app.sf-app .sf-chip {
  display: inline-block;
  position: relative;
  margin-right: 5px;
  margin-bottom: 5px;
  min-height: 28px;
  max-width: 100%;
  vertical-align: top;
  font-size: var(--font-size-h4);
}

sf-app.sf-app .sf-chip__content {
  background-color: var(--sf-color-info-bg, #dcecf5);
  border: 1px solid var(--sf-chip-default-border-color);
}

sf-app.sf-app .sf-chip.-success .sf-chip__content {
  background-color: var(--sf-color-success-bg, #caeed8);
  border: 1px solid var(--sf-chip-success-border-color);
}

sf-app.sf-app .sf-chip.-error .sf-chip__content {
  background-color: var(--sf-color-error-bg, #fcc);
  border: 1px solid var(--sf-chip-error-border-color);
}

sf-app.sf-app .sf-chip.-invert .sf-chip__content {
  background-color: #333;
  border: 1px solid var(--sf-chip-invert-border-color);
}

sf-app.sf-app .sf-chip.-info .sf-chip__content {
  background-color: var(--sf-color-info, #006cd9);
  border: 1px solid var(--sf-chip-info-border-color);
}

sf-app.sf-app .sf-chip__inner-content {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: break-word;
}

sf-app.sf-app .sf-chip.-white {
  color: #fff;
}

sf-app.sf-app .sf-chip.-small {
  min-height: auto;
}

sf-app.sf-app .sf-chip.-small,
sf-app.sf-app .sf-chip.-small .sf-chip__content {
  height: 24px;
  align-items: center;
}

sf-app.sf-app .sf-chip.-small .sf-chip__icon {
  margin-top: 1px;
}

sf-app.sf-app .sf-chip.-small .sf-chip__inner-content {
  line-height: 24px;
  margin-top: -1px;
}

sf-app.sf-app .sf-chip.-invert .sf-chip__icon {
  margin-top: 0;
}

sf-app.sf-app .sf-chip.-invert .sf-chip__icon.-transparent {
  background-color: #333;
}

sf-app.sf-app .sf-chip.-invert .sf-chip__icon .sf-icon {
  position: relative;
  top: 1px;
}

sf-app.sf-app .sf-chip.-removable .sf-chip__content {
  transition: padding 0.2s;
  overflow: hidden;
}

sf-app.sf-app .sf-chip.-removable .sf-chip__text {
  transition: text-indent 0.2s;
}

sf-app.sf-app .sf-chip.-removable:hover .sf-chip__remove-button {
  display: inline-flex;
  align-items: center;
}

sf-app.sf-app .sf-chip.-removable:hover .sf-chip__content {
  padding-right: 21px;
}

sf-app.sf-app .sf-chip.-removable:hover .sf-chip__text {
  text-indent: -6px;
}

sf-app.sf-app .sf-chip.-avatar .sf-chip__content {
  padding-left: 33.5px;
}

sf-app.sf-app .sf-chip.-icon .sf-chip__content {
  padding-left: 33.5px;
}

sf-app.sf-app .sf-chip.-initials .sf-chip__content {
  padding-left: 33.5px;
}

sf-app.sf-app .sf-chip.-editable .sf-chip__content {
  display: inline-block;
  min-width: 65px;
}

sf-app.sf-app .sf-chip.-dropped .sf-chip__dropdown {
  display: block;
  position: absolute;
  top: 33px;
  padding-top: 0;
  padding-bottom: 0;
  width: auto;
  max-width: 800px;
  z-index: 10000;
}

sf-app.sf-app .sf-chip.-input {
  display: block;
  margin-right: 0;
  margin-bottom: 0;
}

sf-app.sf-app .sf-chip.-input .sf-chip__input {
  padding-left: 5px;
  padding-right: 5px;
  height: 36px;
  width: 100%;
  border: 1px solid var(--sf-color-secondary-lighter, #e4e4e4);
  background-color: #fff;
  border-radius: 0;
}

sf-app.sf-app .sf-chip.-input .sf-chip__dropdown {
  width: 100%;
}

sf-app.sf-app .sf-chip.-stripped {
  font-size: inherit;
}

sf-app.sf-app .sf-chip.-stripped .sf-chip__content {
  background-color: transparent;
  padding: 0;
  border-radius: 0;
}

sf-app.sf-app .sf-chip__content {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: break-word;
  display: inline-flex;
  align-items: center;
  padding-left: 15px;
  padding-right: 15px;
  height: 28px;
  line-height: 28px;
  text-align: left;
  vertical-align: top;
  border-radius: 28px;
  background-color: var(--sf-color-info-bg, #dcecf5);
  overflow: hidden;
  max-width: 100%;
}

sf-app.sf-app .sf-chip__content:focus {
  outline-color: transparent;
}

sf-app.sf-app .-size-m .sf-chip__content {
  display: inline-block;
  max-width: 130px;
}

sf-app.sf-app .-size-l .sf-chip__content {
  max-width: 180px;
}

sf-app.sf-app .sf-chip__hint {
  color: var(--sf-secondary-text-color-on-blue-bg);
  flex-shrink: 0;
}

sf-app.sf-app .sf-chip__avatar {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  margin-top: 2px;
  margin-left: 2px;
  margin-right: 7.5px;
  width: 24px;
  height: 24px;
  line-height: 24px;
  text-align: center;
  border-radius: 50%;
  background-color: #fff;
  color: var(--sf-color-secondary-dark, #777);
  z-index: 10;
  max-width: 100%;
}

sf-app.sf-app .sf-chip__avatar.-transparent {
  background-color: transparent;
}

sf-app.sf-app .sf-chip__icon {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  margin-top: 2px;
  margin-left: 2px;
  margin-right: 7.5px;
  width: 24px;
  height: 24px;
  line-height: 24px;
  text-align: center;
  border-radius: 50%;
  background-color: #fff;
  color: var(--sf-color-secondary-dark, #777);
  z-index: 10;
  max-width: 100%;
}

sf-app.sf-app .sf-chip__icon.-transparent {
  background-color: transparent;
}

sf-app.sf-app .sf-chip__initials {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  margin-top: 2px;
  margin-left: 2px;
  margin-right: 7.5px;
  width: 24px;
  height: 24px;
  line-height: 24px;
  text-align: center;
  border-radius: 50%;
  background-color: #fff;
  color: var(--sf-color-secondary-dark, #777);
  z-index: 10;
  max-width: 100%;
  font-size: var(--font-size-h5);
  text-transform: uppercase;
}

sf-app.sf-app .sf-chip__initials.-transparent {
  background-color: transparent;
}

sf-app.sf-app .sf-chip__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  overflow: hidden;
  border-radius: 50%;
}

sf-app.sf-app .sf-chip__remove-button {
  display: none;
  position: absolute;
  top: 0;
  right: 7.5px;
  height: 28px;
  line-height: 28px;
  text-align: right;
  cursor: pointer;
}

sf-app.sf-app .sf-chip__dropdown {
  display: none;
}

sf-app.sf-app .sf-error {
  display: block;
  color: var(--sf-color-error, #ff4848);
  font-size: var(--font-size-base);
}

sf-app.sf-app .sf-error-block {
  border-color: var(--sf-color-error, #ff4848) !important;
}

sf-app.sf-app .sf-select {
  position: relative;
  height: 36px;
}

sf-app.sf-app .sf-select::after {
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  display: block;
  position: absolute;
  top: 0;
  right: 10px;
  height: 36px;
  line-height: 36px;
  content: "\f0d7";
  font-size: var(--icon-size-m);
  color: var(--select-arrow-color);
  pointer-events: none;
}

sf-app.sf-app .sf-select__item {
  height: 100%;
  width: 100%;
  padding-left: 10px;
  padding-right: calc(10px + var(--icon-size-m));
  -webkit-appearance: none;
          appearance: none;
}

sf-app.sf-app .sf-select__item::-ms-expand {
  display: none;
}

sf-app.sf-app .sf-select.-inline {
  display: inline-block;
}

sf-app.sf-app .sf-select.-small {
  height: 26px;
  font-size: var(--font-size-base);
}

sf-app.sf-app .sf-select.-small .sf-select__item {
  line-height: 1.8;
  padding-left: 6px;
  padding-right: calc(6px + var(--icon-size-xs));
}

sf-app.sf-app .sf-select.-small::after {
  height: 26px;
  line-height: 26px;
  font-size: var(--icon-size-xs);
  right: 6px;
}

sf-app.sf-app .sf-form {
  max-width: 850px;
  padding: 30px 0;
}

sf-app.sf-app .sf-form .sf-input {
  margin-bottom: 20px;
}

sf-app.sf-app .sf-form .sf-input.-shrinked,
sf-app.sf-app .sf-form .sf-input .sf-input {
  margin-bottom: 0;
}

sf-app.sf-app .sf-form .sf-checkbox:not(.-inline):not(.-in-group),
sf-app.sf-app .sf-form .sf-radio:not(.-inline):not(.-in-group) {
  margin-bottom: 10px;
}

sf-app.sf-app .sf-form .sf-checkbox:not(.-inline):not(.-in-group):last-child,
sf-app.sf-app .sf-form .sf-radio:not(.-inline):not(.-in-group):last-child {
  margin-bottom: 0;
}

sf-app.sf-app .sf-form .sf-checkbox,
sf-app.sf-app .sf-form .sf-radio {
  margin-right: 10px;
}

sf-app.sf-app .sf-form .sf-checkbox:last-child,
sf-app.sf-app .sf-form .sf-radio:last-child {
  margin-right: 0;
}

sf-app.sf-app .sf-form.-auto {
  width: auto;
}

sf-app.sf-app .sf-form.-small {
  width: 410px;
}

sf-app.sf-app .sf-form.-medium {
  width: var(--form-width-medium);
}

sf-app.sf-app .sf-form.-large {
  width: 1000px;
  max-width: 1000px;
}

sf-app.sf-app .sf-form.-short {
  padding-top: 0;
  padding-bottom: 0;
}

sf-app.sf-app .sf-form.-framed {
  border: 1px solid #eee;
  border-radius: 5px;
}

sf-app.sf-app .sf-form.-condensed .sf-input {
  margin-bottom: 15px;
}

sf-app.sf-app .sf-row {
  display: flex;
  flex-wrap: wrap;
  padding: 0;
  width: 100%;
  max-width: 100%;
  list-style-type: none;
  /*
    Row with auto sized columns (default)

    `.sf-row .sf-row__col`

        Markup:
        <div class="sf-row">
           <div class="sf-row__col">
               .sf-row__col
           </div>
           <div class="sf-row__col">
               .sf-row__col
           </div>
        </div>
        <div class="sf-row">
           <div class="sf-row__col">
               .sf-row__col
           </div>
           <div class="sf-row__col">
               .sf-row__col
           </div>
           <div class="sf-row__col">
               .sf-row__col
           </div>
        </div>

        Styleguide: Row.auto-sized
   */
  /*
    Nested rows

    `.sf-row .sf-row`

        Markup:
        <div class="sf-row">
           <div class="sf-row__col -col-6">
             .sf-row__col.-col-6
             <div class="sf-row">
                <div class="sf-row__col -col-4">
                    .sf-row__col.-col-4
                </div>
                <div class="sf-row__col -col-8">
                    .sf-row__col.-col-8
                </div>
             </div>
           </div>
           <div class="sf-row__col -col-6">
               .sf-row__col.-col-6
           </div>
        </div>

      Styleguide: Row.nested-rows
   */
  /*
    Row with no gutter

    `.sf-row.-no-gutter`

        Markup:
        <div class="sf-row -no-gutter">
           <div class="sf-row__col -col-6">
               I am <strong>first</strong> in the markup
           </div>
           <div class="sf-row__col -col-6">
               I am <strong>second</strong> in the markup
           </div>
        </div>

   Styleguide: Row.no-gutter
   */
  /*
    Row inline

    `.sf-row.-inline`

        Markup:
        <div class="sf-row -inline">
           <div class="sf-row__col -col-6">
               I am <strong>first</strong> in the markup
           </div>
           <div class="sf-row__col -col-6">
               I am <strong>second</strong> in the markup
           </div>
        </div>

      Styleguide: Row.inline
   */
  /*
    Row full height

    `.sf-row.-full-height`

        Markup:
        <div class="sf-row -full-height">
           <div class="sf-row__col -col-6">
               I am tall
           </div>
           <div class="sf-row__col -col-6">
               I am tall
           </div>
        </div>

   Styleguide: Row.full-height
   */
  /*
    Width auto

    `.sf-row.-auto-width`

        Markup:
        <div class="sf-row -auto-width">
        </div>

      Styleguide: Row.width-auto
   */
  /*
    flex-wrap: wrap (Default)

    `.sf-row.-wrap`

    If emitted flex-wrap: wrap

        Markup:
        <div class="sf-row -wrap">
           <div class="sf-row__col -col-6">
               I am <strong>first</strong> in the markup
           </div>
           <div class="sf-row__col -col-6">
               I am <strong>second</strong> in the markup
           </div>
           <div class="sf-row__col -col-10">
               I am <strong>third</strong> in the markup
           </div>
        </div>

        Styleguide: Row.flex-wrap-wrap
  */
  /*
    flex-wrap: no-wrap

    `.sf-row.-no-wrap`

        Markup:
        <div class="sf-row -no-wrap">
           <div class="sf-row__col -col-6">
               I am <strong>first</strong> in the markup
           </div>
           <div class="sf-row__col -col-6">
               I am <strong>second</strong> in the markup
           </div>
           <div class="sf-row__col -col-10">
               I am <strong>third</strong> in the markup
           </div>
        </div>

        Styleguide: Row.no-wrap
  */
  /*
    flex-wrap: wrap-reverse

    `.sf-row.-wrap-reverse`

        Markup:
        <div class="sf-row -wrap-reverse">
           <div class="sf-row__col -col-6">
               I am <strong>first</strong> in the markup
           </div>
           <div class="sf-row__col -col-6">
               I am <strong>second</strong> in the markup
           </div>
           <div class="sf-row__col -col-10">
               I am <strong>third</strong> in the markup
           </div>
        </div>

        Styleguide: Row.wrap-reverse
   */
  /*
    flex-direction: row (default)

    `.sf-row.-row`

    If emitted flex-direction: row

        Markup:
        <div class="sf-row -row">
           <div class="sf-row__col -col-4">
               I am <strong>first</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>second</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>third</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>fourth</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>fifth</strong> in the markup
           </div>
        </div>

        Styleguide: Row.flex-direction-row
   */
  /*
    flex-direction: row-reverse

    `.sf-row.-row-reverse `

        Markup:
        <div class="sf-row -row-reverse">
           <div class="sf-row__col -col-4">
               I am <strong>first</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>second</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>third</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>fourth</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>fifth</strong> in the markup
           </div>
        </div>

        Styleguide: Row.row-reverse
   */
  /*
    flex-direction: column

    `.sf-row.-column`

        Markup:
        <div class="sf-row -column">
           <div class="sf-row__col -col-4">
               I am <strong>first</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>second</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>third</strong> in the markup
           </div>
        </div>

        Styleguide: Row.column
   */
  /*
    flex-direction: column-reverse

    `.sf-row.-column-reverse`

        Markup:
        <div class="sf-row -column-reverse">
           <div class="sf-row__col -col-4">
               I am <strong>first</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>second</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>third</strong> in the markup
           </div>
        </div>

        Styleguide: Row.column-reverse
   */
  /*
    align-items: stretch (default)

    `.sf-row.-align-items-stretch`

    If emitted align-items: stretch

        Markup:
        <div class="sf-row -align-items-stretch">
           <div class="sf-row__col -col-4">
               I am <strong>first</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>second</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>third</strong> in the markup
           </div>
        </div>

        Styleguide: Row.align-items-stretch

   */
  /*
    align-items: flex-start

    `.sf-row.-align-items-start`

        Markup:
        <div class="sf-row -align-items-start">
           <div class="sf-row__col -col-4">
               I am <strong>first</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>second</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>third</strong> in the markup
           </div>
        </div>

        Styleguide: Row.align-items-start
   */
  /*
    align-items: flex-end

    `.sf-row.-align-items-end`

        Markup:
        <div class="sf-row -align-items-end">
           <div class="sf-row__col -flex-4">
               I am <strong>first</strong> in the markup
           </div>
           <div class="sf-row__col -flex-4">
               I am <strong>second</strong> in the markup
           </div>
           <div class="sf-row__col -flex-4">
               I am <strong>third</strong> in the markup
           </div>
        </div>

        Styleguide: Row.align-items-end
   */
  /*
    align-items: center

    `.sf-row.-align-items-center`

        Markup:
        <div class="sf-row -align-items-center">
           <div class="sf-row__col -flex-4">
               I am <strong>first</strong> in the markup
           </div>
           <div class="sf-row__col -flex-4">
               I am <strong>second</strong> in the markup
           </div>
           <div class="sf-row__col -flex-4">
               I am <strong>third</strong> in the markup
           </div>
        </div>

        Styleguide: Row.align-items-center
   */
  /*
    align-items: baseline

    `.sf-row.-align-items-baseline`

        Markup:
        <div class="sf-row -align-items-baseline">
           <div class="sf-row__col -col-4">
               I am <strong>first</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>second</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>third</strong> in the markup
           </div>
        </div>

        Styleguide: Row.align-items-baseline
   */
  /*
    align-content: stretch (default)

    `.sf-row.-align-content-stretch`

    If emitted align-content: stretch

        Markup:
        <div class="sf-row -align-content-stretch">
           <div class="sf-row__col -col-4">
               I am <strong>first</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>second</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>third</strong> in the markup
           </div>
          <div class="sf-row__col -col-4">
               I am <strong>fourth</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>fifth</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>sixth</strong> in the markup
           </div>
        </div>

        Styleguide: Row.align-content-stretch
   */
  /*
    align-content: flex-start

    `.sf-row.-align-content-start`

        Markup:
        <div class="sf-row -align-content-start">
           <div class="sf-row__col -col-4">
               I am <strong>first</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>second</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>third</strong> in the markup
           </div>
          <div class="sf-row__col -col-4">
               I am <strong>fourth</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>fifth</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>sixth</strong> in the markup
           </div>
        </div>

        Styleguide: Row.align-content-start
   */
  /*
    align-content: flex-end

    `.sf-row.-align-content-end`

        Markup:
        <div class="sf-row -align-content-end">
           <div class="sf-row__col -col-4">
               I am <strong>first</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>second</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>third</strong> in the markup
           </div>
          <div class="sf-row__col -col-4">
               I am <strong>fourth</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>fifth</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>sixth</strong> in the markup
           </div>
        </div>

        Styleguide: Row.align-content-end
   */
  /*
    align-content: center

    `.sf-row.-align-content-center`

        Markup:
        <div class="sf-row -align-content-center">
           <div class="sf-row__col -col-4">
               I am <strong>first</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>second</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>third</strong> in the markup
           </div>
          <div class="sf-row__col -col-4">
               I am <strong>fourth</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>fifth</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>sixth</strong> in the markup
           </div>
        </div>

        Styleguide: Row.align-content-center
   */
  /*
    align-content: space-between

    `.sf-row.-align-content-between`

        Markup:
        <div class="sf-row -align-content-between">
           <div class="sf-row__col -col-4">
               I am <strong>first</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>second</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>third</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>fourth</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>fifth</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>sixth</strong> in the markup
           </div>
        </div>

        Styleguide: Row.align-content-between
   */
  /*
    align-content: space-around

    `.sf-row.-align-content-around`

        Markup:
        <div class="sf-row -align-content-around">
           <div class="sf-row__col -col-4">
               I am <strong>first</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>second</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>third</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>fourth</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>fifth</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>sixth</strong> in the markup
           </div>
        </div>

        Styleguide: Row.align-content-around
   */
  /*
    justify-content: flex-start (default)

    `.sf-row.-justify-content-start`

    If emitted justify-content: flex-start

        Markup:
        <div class="sf-row -justify-content-start">
           <div class="sf-row__col -col-4">
               I am <strong>first</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>second</strong> in the markup
           </div>
        </div>

   Styleguide: Row.justify-content-start
   */
  /*
    justify-content: flex-end

    `.sf-row.-justify-content-end`

        Markup:
        <div class="sf-row -justify-content-end">
           <div class="sf-row__col -col-4">
               I am <strong>first</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>second</strong> in the markup
           </div>
        </div>

   Styleguide: Row.justify-content-end
   */
  /*
    justify-content: center

    `.theme.-row.-justify-content-center`

        Markup:
        <div class="sf-row -justify-content-center">
           <div class="sf-row__col -flex-4">
               I am <strong>first</strong> in the markup
           </div>
           <div class="sf-row__col -flex-4">
               I am <strong>second</strong> in the markup
           </div>
        </div>

   Styleguide: Row.justify-content-center
   */
  /*
    justify-content: space-between

    `.sf-row.-justify-content-between`

        Markup:
        <div class="sf-row -justify-content-between">
           <div class="sf-row__col -col-3">
               I am <strong>first</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>second</strong> in the markup
           </div>
           <div class="sf-row__col -col-3">
               I am <strong>third</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>fourth</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>fifth</strong> in the markup
           </div>
        </div>

   Styleguide: Row.justify-content-between
   */
  /*
    justify-content: space-around

    `.sf-row.-justify-content-around`

        Markup:
        <div class="sf-row -justify-content-around">
           <div class="sf-row__col -col-3">
               I am <strong>first</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>second</strong> in the markup
           </div>
           <div class="sf-row__col -col-3">
               I am <strong>third</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>fourth</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>fifth</strong> in the markup
           </div>
        </div>

   Styleguide: Row.justify-content-around
   */
  /*
    Columns with flexible width

    `sf-row.-adjustable-ellipsis`

        Markup:
        <div class="sf-row -adjustable-ellipsis">
           <div class="sf-row__col -truncatable">
               <div style="white-space: nowrap; overflow: hidden; text-overflow: ellipsis;">I am <strong>First</strong>. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passa</div>
           </div>
           <div class="sf-row__col -full-width">
               <div>The width of <strong>First</strong> adjusts to my width</div>
           </div>
        </div>

        <div class="sf-row -adjustable-ellipsis">
           <div class="sf-row__col -full-width">
               <div>The width of <strong>First</strong> adjusts to my width</div>
           </div>
           <div class="sf-row__col -truncatable">
               <div style="white-space: nowrap; overflow: hidden; text-overflow: ellipsis;">I am <strong>First</strong>. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passa</div>
           </div>
        </div>

        Styleguide: Row.adjustable-ellipsis
   */
  /*
   Row — Single Column
  */
  /*
    Columns with no gutter

    `.sf-row__col.-no-gutter`

        Markup:
        <div class="sf-row">
           <div class="sf-row__col -col-6 -no-gutter">
               .sf-row__col.-col-6.-no-gutter
           </div>
           <div class="sf-row__col -col-6">
               .sf-row__col.-col-6
           </div>
        </div>

      Styleguide: Row-single.no-gutter
   */
  /*
    Columns which are not flexible ('flex: none')

    `.sf-row__col.-no-flex`

        Markup:
        <div class="sf-row">
           <div class="sf-row__col -col-6 -no-flex">
               .sf-row__col.-col-6.-no-flex
           </div>
           <div class="sf-row__col -col-6">
               .sf-row__col.-col-6
           </div>
        </div>

    Styleguide: Row-single.no-flex
   */
  /*
    Columns which are auto flexible ('flex: auto')

    `.sf-row__col.-auto-flex`

        Markup:
        <div class="sf-row">
           <div class="sf-row__col -col-6 -auto-flex">
               .sf-row__col.-col-6.-auto-flex
           </div>
           <div class="sf-row__col -col-6">
               .sf-row__col.-col-6
           </div>
        </div>

    Styleguide: Row-single.flex-auto
   */
  /*
    Columns hide

    `.sf-row__col.-hidden`

        Markup:
        <div class="sf-row">
           <div class="sf-row__col -hidden">
               .sf-row__col.-hidden: I am hidden for all resolutions
           </div>
           <div class="sf-row__col">
               .sf-row__col
           </div>
           <div class="sf-row__col">
               .sf-row__col
           </div>
        </div>

    Styleguide: Row-single.hidden
   */
  /*
    Columns align-self: stretch (default)

    `.sf-row__col.-align-self-stretch`

    If emitted align-self: stretch

        Markup:
        <div class="sf-row">
           <div class="sf-row__col -col-4">
               I am <strong>first</strong> in the markup
           </div>
           <div class="sf-row__col -col-4 -align-self-stretch">
               I am <strong>second</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>third</strong> in the markup
           </div>
        </div>

         Styleguide: Row-single.align-self-stretch
   */
  /*
    Columns align-self: flex-start

    `.sf-row__col.-align-self-start`

        Markup:
        <div class="sf-row">
           <div class="sf-row__col -col-4">
               I am <strong>first</strong> in the markup
           </div>
           <div class="sf-row__col -col-4 -align-self-start">
               I am <strong>second</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>third</strong> in the markup
           </div>
        </div>

         Styleguide: Row-single.flex-start
   */
  /*
    Columns align-self: flex-end

    `.sf-row__col.-align-self-end`

        Markup:
        <div class="sf-row">
           <div class="sf-row__col -col-4">
               I am <strong>first</strong> in the markup
           </div>
           <div class="sf-row__col -col-4 -align-self-end">
               I am <strong>second</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>third</strong> in the markup
           </div>
        </div>

         Styleguide: Row-single.align-self-end
   */
  /*
    Columns align-self: center

    `.sf-row__col.-align-self-center`

        Markup:
        <div class="sf-row">
           <div class="sf-row__col -col-4">
               I am <strong>first</strong> in the markup
           </div>
           <div class="sf-row__col -col-4 -align-self-center">
               I am <strong>second</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>third</strong> in the markup
           </div>
        </div>

         Styleguide: Row-single.align-self-center
   */
  /*
    Columns align-self: baseline

    `.sf-row__col.-align-self-baseline`

        Markup:
        <div class="sf-row">
           <div class="sf-row__col -col-4">
               I am <strong>first</strong> in the markup
           </div>
           <div class="sf-row__col -col-4 -align-self-baseline">
               I am <strong>second</strong> in the markup
           </div>
           <div class="sf-row__col -col-4">
               I am <strong>third</strong> in the markup
           </div>
        </div>

         Styleguide: Row-single.align-self-baseline
   */
}

sf-app.sf-app .sf-row.-section-gap {
  -moz-column-gap: 30px;
       column-gap: 30px;
  justify-content: space-between;
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="2"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 15px);
  max-width: calc(8.3333333333% - 15px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="2"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 15px);
  max-width: calc(16.6666666667% - 15px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="2"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 15px);
  max-width: calc(25% - 15px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="2"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 15px);
  max-width: calc(33.3333333333% - 15px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="2"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 15px);
  max-width: calc(41.6666666667% - 15px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="2"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 15px);
  max-width: calc(50% - 15px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="2"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 15px);
  max-width: calc(58.3333333333% - 15px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="2"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 15px);
  max-width: calc(66.6666666667% - 15px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="2"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 15px);
  max-width: calc(75% - 15px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="2"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 15px);
  max-width: calc(83.3333333333% - 15px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="2"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 15px);
  max-width: calc(91.6666666667% - 15px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="2"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 15px);
  max-width: calc(100% - 15px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="2"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 30px;
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="2"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="2"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="2"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="2"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -30px;
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="3"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 20px);
  max-width: calc(8.3333333333% - 20px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="3"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 20px);
  max-width: calc(16.6666666667% - 20px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="3"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 20px);
  max-width: calc(25% - 20px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="3"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 20px);
  max-width: calc(33.3333333333% - 20px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="3"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 20px);
  max-width: calc(41.6666666667% - 20px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="3"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 20px);
  max-width: calc(50% - 20px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="3"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 20px);
  max-width: calc(58.3333333333% - 20px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="3"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 20px);
  max-width: calc(66.6666666667% - 20px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="3"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 20px);
  max-width: calc(75% - 20px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="3"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 20px);
  max-width: calc(83.3333333333% - 20px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="3"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 20px);
  max-width: calc(91.6666666667% - 20px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="3"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 20px);
  max-width: calc(100% - 20px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="3"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 30px;
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="3"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="3"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="3"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="3"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -30px;
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="4"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 22.5px);
  max-width: calc(8.3333333333% - 22.5px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="4"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 22.5px);
  max-width: calc(16.6666666667% - 22.5px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="4"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 22.5px);
  max-width: calc(25% - 22.5px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="4"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 22.5px);
  max-width: calc(33.3333333333% - 22.5px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="4"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 22.5px);
  max-width: calc(41.6666666667% - 22.5px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="4"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 22.5px);
  max-width: calc(50% - 22.5px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="4"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 22.5px);
  max-width: calc(58.3333333333% - 22.5px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="4"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 22.5px);
  max-width: calc(66.6666666667% - 22.5px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="4"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 22.5px);
  max-width: calc(75% - 22.5px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="4"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 22.5px);
  max-width: calc(83.3333333333% - 22.5px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="4"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 22.5px);
  max-width: calc(91.6666666667% - 22.5px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="4"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 22.5px);
  max-width: calc(100% - 22.5px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="4"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 30px;
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="4"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="4"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="4"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="4"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -30px;
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="5"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 24px);
  max-width: calc(8.3333333333% - 24px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="5"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 24px);
  max-width: calc(16.6666666667% - 24px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="5"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 24px);
  max-width: calc(25% - 24px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="5"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 24px);
  max-width: calc(33.3333333333% - 24px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="5"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 24px);
  max-width: calc(41.6666666667% - 24px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="5"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 24px);
  max-width: calc(50% - 24px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="5"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 24px);
  max-width: calc(58.3333333333% - 24px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="5"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 24px);
  max-width: calc(66.6666666667% - 24px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="5"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 24px);
  max-width: calc(75% - 24px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="5"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 24px);
  max-width: calc(83.3333333333% - 24px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="5"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 24px);
  max-width: calc(91.6666666667% - 24px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="5"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 24px);
  max-width: calc(100% - 24px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="5"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 30px;
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="5"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="5"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="5"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="5"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -30px;
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="6"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 25px);
  max-width: calc(8.3333333333% - 25px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="6"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 25px);
  max-width: calc(16.6666666667% - 25px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="6"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 25px);
  max-width: calc(25% - 25px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="6"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 25px);
  max-width: calc(33.3333333333% - 25px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="6"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 25px);
  max-width: calc(41.6666666667% - 25px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="6"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 25px);
  max-width: calc(50% - 25px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="6"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 25px);
  max-width: calc(58.3333333333% - 25px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="6"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 25px);
  max-width: calc(66.6666666667% - 25px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="6"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 25px);
  max-width: calc(75% - 25px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="6"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 25px);
  max-width: calc(83.3333333333% - 25px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="6"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 25px);
  max-width: calc(91.6666666667% - 25px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="6"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 25px);
  max-width: calc(100% - 25px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="6"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 30px;
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="6"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="6"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="6"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="6"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -30px;
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="7"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 25.7142857143px);
  max-width: calc(8.3333333333% - 25.7142857143px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="7"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 25.7142857143px);
  max-width: calc(16.6666666667% - 25.7142857143px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="7"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 25.7142857143px);
  max-width: calc(25% - 25.7142857143px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="7"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 25.7142857143px);
  max-width: calc(33.3333333333% - 25.7142857143px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="7"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 25.7142857143px);
  max-width: calc(41.6666666667% - 25.7142857143px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="7"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 25.7142857143px);
  max-width: calc(50% - 25.7142857143px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="7"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 25.7142857143px);
  max-width: calc(58.3333333333% - 25.7142857143px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="7"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 25.7142857143px);
  max-width: calc(66.6666666667% - 25.7142857143px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="7"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 25.7142857143px);
  max-width: calc(75% - 25.7142857143px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="7"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 25.7142857143px);
  max-width: calc(83.3333333333% - 25.7142857143px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="7"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 25.7142857143px);
  max-width: calc(91.6666666667% - 25.7142857143px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="7"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 25.7142857143px);
  max-width: calc(100% - 25.7142857143px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="7"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 30px;
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="7"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="7"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="7"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="7"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -30px;
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="8"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 26.25px);
  max-width: calc(8.3333333333% - 26.25px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="8"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 26.25px);
  max-width: calc(16.6666666667% - 26.25px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="8"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 26.25px);
  max-width: calc(25% - 26.25px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="8"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 26.25px);
  max-width: calc(33.3333333333% - 26.25px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="8"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 26.25px);
  max-width: calc(41.6666666667% - 26.25px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="8"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 26.25px);
  max-width: calc(50% - 26.25px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="8"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 26.25px);
  max-width: calc(58.3333333333% - 26.25px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="8"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 26.25px);
  max-width: calc(66.6666666667% - 26.25px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="8"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 26.25px);
  max-width: calc(75% - 26.25px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="8"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 26.25px);
  max-width: calc(83.3333333333% - 26.25px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="8"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 26.25px);
  max-width: calc(91.6666666667% - 26.25px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="8"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 26.25px);
  max-width: calc(100% - 26.25px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="8"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 30px;
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="8"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="8"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="8"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="8"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -30px;
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="9"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 26.6666666667px);
  max-width: calc(8.3333333333% - 26.6666666667px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="9"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 26.6666666667px);
  max-width: calc(16.6666666667% - 26.6666666667px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="9"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 26.6666666667px);
  max-width: calc(25% - 26.6666666667px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="9"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 26.6666666667px);
  max-width: calc(33.3333333333% - 26.6666666667px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="9"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 26.6666666667px);
  max-width: calc(41.6666666667% - 26.6666666667px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="9"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 26.6666666667px);
  max-width: calc(50% - 26.6666666667px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="9"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 26.6666666667px);
  max-width: calc(58.3333333333% - 26.6666666667px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="9"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 26.6666666667px);
  max-width: calc(66.6666666667% - 26.6666666667px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="9"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 26.6666666667px);
  max-width: calc(75% - 26.6666666667px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="9"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 26.6666666667px);
  max-width: calc(83.3333333333% - 26.6666666667px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="9"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 26.6666666667px);
  max-width: calc(91.6666666667% - 26.6666666667px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="9"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 26.6666666667px);
  max-width: calc(100% - 26.6666666667px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="9"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 30px;
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="9"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="9"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="9"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="9"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -30px;
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="10"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 27px);
  max-width: calc(8.3333333333% - 27px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="10"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 27px);
  max-width: calc(16.6666666667% - 27px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="10"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 27px);
  max-width: calc(25% - 27px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="10"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 27px);
  max-width: calc(33.3333333333% - 27px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="10"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 27px);
  max-width: calc(41.6666666667% - 27px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="10"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 27px);
  max-width: calc(50% - 27px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="10"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 27px);
  max-width: calc(58.3333333333% - 27px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="10"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 27px);
  max-width: calc(66.6666666667% - 27px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="10"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 27px);
  max-width: calc(75% - 27px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="10"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 27px);
  max-width: calc(83.3333333333% - 27px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="10"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 27px);
  max-width: calc(91.6666666667% - 27px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="10"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 27px);
  max-width: calc(100% - 27px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="10"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 30px;
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="10"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="10"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="10"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="10"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -30px;
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="11"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 27.2727272727px);
  max-width: calc(8.3333333333% - 27.2727272727px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="11"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 27.2727272727px);
  max-width: calc(16.6666666667% - 27.2727272727px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="11"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 27.2727272727px);
  max-width: calc(25% - 27.2727272727px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="11"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 27.2727272727px);
  max-width: calc(33.3333333333% - 27.2727272727px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="11"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 27.2727272727px);
  max-width: calc(41.6666666667% - 27.2727272727px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="11"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 27.2727272727px);
  max-width: calc(50% - 27.2727272727px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="11"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 27.2727272727px);
  max-width: calc(58.3333333333% - 27.2727272727px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="11"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 27.2727272727px);
  max-width: calc(66.6666666667% - 27.2727272727px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="11"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 27.2727272727px);
  max-width: calc(75% - 27.2727272727px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="11"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 27.2727272727px);
  max-width: calc(83.3333333333% - 27.2727272727px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="11"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 27.2727272727px);
  max-width: calc(91.6666666667% - 27.2727272727px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="11"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 27.2727272727px);
  max-width: calc(100% - 27.2727272727px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="11"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 30px;
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="11"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="11"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="11"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="11"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -30px;
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="12"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 27.5px);
  max-width: calc(8.3333333333% - 27.5px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="12"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 27.5px);
  max-width: calc(16.6666666667% - 27.5px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="12"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 27.5px);
  max-width: calc(25% - 27.5px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="12"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 27.5px);
  max-width: calc(33.3333333333% - 27.5px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="12"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 27.5px);
  max-width: calc(41.6666666667% - 27.5px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="12"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 27.5px);
  max-width: calc(50% - 27.5px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="12"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 27.5px);
  max-width: calc(58.3333333333% - 27.5px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="12"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 27.5px);
  max-width: calc(66.6666666667% - 27.5px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="12"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 27.5px);
  max-width: calc(75% - 27.5px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="12"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 27.5px);
  max-width: calc(83.3333333333% - 27.5px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="12"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 27.5px);
  max-width: calc(91.6666666667% - 27.5px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="12"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 27.5px);
  max-width: calc(100% - 27.5px);
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="12"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 30px;
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="12"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="12"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="12"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap[data-sfcolumn-count="12"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -30px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero {
  -moz-column-gap: 0;
       column-gap: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="2"] > .sf-row__col.-col-1 {
  flex: 0 0 8.3333333333%;
  max-width: 8.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="2"] > .sf-row__col.-col-2 {
  flex: 0 0 16.6666666667%;
  max-width: 16.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="2"] > .sf-row__col.-col-3 {
  flex: 0 0 25%;
  max-width: 25%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="2"] > .sf-row__col.-col-4 {
  flex: 0 0 33.3333333333%;
  max-width: 33.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="2"] > .sf-row__col.-col-5 {
  flex: 0 0 41.6666666667%;
  max-width: 41.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="2"] > .sf-row__col.-col-6 {
  flex: 0 0 50%;
  max-width: 50%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="2"] > .sf-row__col.-col-7 {
  flex: 0 0 58.3333333333%;
  max-width: 58.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="2"] > .sf-row__col.-col-8 {
  flex: 0 0 66.6666666667%;
  max-width: 66.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="2"] > .sf-row__col.-col-9 {
  flex: 0 0 75%;
  max-width: 75%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="2"] > .sf-row__col.-col-10 {
  flex: 0 0 83.3333333333%;
  max-width: 83.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="2"] > .sf-row__col.-col-11 {
  flex: 0 0 91.6666666667%;
  max-width: 91.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="2"] > .sf-row__col.-col-12 {
  flex: 0 0 100%;
  max-width: 100%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="2"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="2"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="2"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="2"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="2"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="3"] > .sf-row__col.-col-1 {
  flex: 0 0 8.3333333333%;
  max-width: 8.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="3"] > .sf-row__col.-col-2 {
  flex: 0 0 16.6666666667%;
  max-width: 16.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="3"] > .sf-row__col.-col-3 {
  flex: 0 0 25%;
  max-width: 25%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="3"] > .sf-row__col.-col-4 {
  flex: 0 0 33.3333333333%;
  max-width: 33.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="3"] > .sf-row__col.-col-5 {
  flex: 0 0 41.6666666667%;
  max-width: 41.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="3"] > .sf-row__col.-col-6 {
  flex: 0 0 50%;
  max-width: 50%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="3"] > .sf-row__col.-col-7 {
  flex: 0 0 58.3333333333%;
  max-width: 58.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="3"] > .sf-row__col.-col-8 {
  flex: 0 0 66.6666666667%;
  max-width: 66.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="3"] > .sf-row__col.-col-9 {
  flex: 0 0 75%;
  max-width: 75%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="3"] > .sf-row__col.-col-10 {
  flex: 0 0 83.3333333333%;
  max-width: 83.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="3"] > .sf-row__col.-col-11 {
  flex: 0 0 91.6666666667%;
  max-width: 91.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="3"] > .sf-row__col.-col-12 {
  flex: 0 0 100%;
  max-width: 100%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="3"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="3"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="3"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="3"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="3"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="4"] > .sf-row__col.-col-1 {
  flex: 0 0 8.3333333333%;
  max-width: 8.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="4"] > .sf-row__col.-col-2 {
  flex: 0 0 16.6666666667%;
  max-width: 16.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="4"] > .sf-row__col.-col-3 {
  flex: 0 0 25%;
  max-width: 25%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="4"] > .sf-row__col.-col-4 {
  flex: 0 0 33.3333333333%;
  max-width: 33.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="4"] > .sf-row__col.-col-5 {
  flex: 0 0 41.6666666667%;
  max-width: 41.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="4"] > .sf-row__col.-col-6 {
  flex: 0 0 50%;
  max-width: 50%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="4"] > .sf-row__col.-col-7 {
  flex: 0 0 58.3333333333%;
  max-width: 58.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="4"] > .sf-row__col.-col-8 {
  flex: 0 0 66.6666666667%;
  max-width: 66.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="4"] > .sf-row__col.-col-9 {
  flex: 0 0 75%;
  max-width: 75%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="4"] > .sf-row__col.-col-10 {
  flex: 0 0 83.3333333333%;
  max-width: 83.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="4"] > .sf-row__col.-col-11 {
  flex: 0 0 91.6666666667%;
  max-width: 91.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="4"] > .sf-row__col.-col-12 {
  flex: 0 0 100%;
  max-width: 100%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="4"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="4"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="4"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="4"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="4"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="5"] > .sf-row__col.-col-1 {
  flex: 0 0 8.3333333333%;
  max-width: 8.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="5"] > .sf-row__col.-col-2 {
  flex: 0 0 16.6666666667%;
  max-width: 16.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="5"] > .sf-row__col.-col-3 {
  flex: 0 0 25%;
  max-width: 25%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="5"] > .sf-row__col.-col-4 {
  flex: 0 0 33.3333333333%;
  max-width: 33.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="5"] > .sf-row__col.-col-5 {
  flex: 0 0 41.6666666667%;
  max-width: 41.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="5"] > .sf-row__col.-col-6 {
  flex: 0 0 50%;
  max-width: 50%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="5"] > .sf-row__col.-col-7 {
  flex: 0 0 58.3333333333%;
  max-width: 58.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="5"] > .sf-row__col.-col-8 {
  flex: 0 0 66.6666666667%;
  max-width: 66.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="5"] > .sf-row__col.-col-9 {
  flex: 0 0 75%;
  max-width: 75%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="5"] > .sf-row__col.-col-10 {
  flex: 0 0 83.3333333333%;
  max-width: 83.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="5"] > .sf-row__col.-col-11 {
  flex: 0 0 91.6666666667%;
  max-width: 91.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="5"] > .sf-row__col.-col-12 {
  flex: 0 0 100%;
  max-width: 100%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="5"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="5"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="5"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="5"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="5"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="6"] > .sf-row__col.-col-1 {
  flex: 0 0 8.3333333333%;
  max-width: 8.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="6"] > .sf-row__col.-col-2 {
  flex: 0 0 16.6666666667%;
  max-width: 16.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="6"] > .sf-row__col.-col-3 {
  flex: 0 0 25%;
  max-width: 25%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="6"] > .sf-row__col.-col-4 {
  flex: 0 0 33.3333333333%;
  max-width: 33.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="6"] > .sf-row__col.-col-5 {
  flex: 0 0 41.6666666667%;
  max-width: 41.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="6"] > .sf-row__col.-col-6 {
  flex: 0 0 50%;
  max-width: 50%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="6"] > .sf-row__col.-col-7 {
  flex: 0 0 58.3333333333%;
  max-width: 58.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="6"] > .sf-row__col.-col-8 {
  flex: 0 0 66.6666666667%;
  max-width: 66.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="6"] > .sf-row__col.-col-9 {
  flex: 0 0 75%;
  max-width: 75%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="6"] > .sf-row__col.-col-10 {
  flex: 0 0 83.3333333333%;
  max-width: 83.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="6"] > .sf-row__col.-col-11 {
  flex: 0 0 91.6666666667%;
  max-width: 91.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="6"] > .sf-row__col.-col-12 {
  flex: 0 0 100%;
  max-width: 100%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="6"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="6"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="6"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="6"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="6"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="7"] > .sf-row__col.-col-1 {
  flex: 0 0 8.3333333333%;
  max-width: 8.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="7"] > .sf-row__col.-col-2 {
  flex: 0 0 16.6666666667%;
  max-width: 16.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="7"] > .sf-row__col.-col-3 {
  flex: 0 0 25%;
  max-width: 25%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="7"] > .sf-row__col.-col-4 {
  flex: 0 0 33.3333333333%;
  max-width: 33.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="7"] > .sf-row__col.-col-5 {
  flex: 0 0 41.6666666667%;
  max-width: 41.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="7"] > .sf-row__col.-col-6 {
  flex: 0 0 50%;
  max-width: 50%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="7"] > .sf-row__col.-col-7 {
  flex: 0 0 58.3333333333%;
  max-width: 58.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="7"] > .sf-row__col.-col-8 {
  flex: 0 0 66.6666666667%;
  max-width: 66.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="7"] > .sf-row__col.-col-9 {
  flex: 0 0 75%;
  max-width: 75%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="7"] > .sf-row__col.-col-10 {
  flex: 0 0 83.3333333333%;
  max-width: 83.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="7"] > .sf-row__col.-col-11 {
  flex: 0 0 91.6666666667%;
  max-width: 91.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="7"] > .sf-row__col.-col-12 {
  flex: 0 0 100%;
  max-width: 100%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="7"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="7"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="7"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="7"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="7"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="8"] > .sf-row__col.-col-1 {
  flex: 0 0 8.3333333333%;
  max-width: 8.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="8"] > .sf-row__col.-col-2 {
  flex: 0 0 16.6666666667%;
  max-width: 16.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="8"] > .sf-row__col.-col-3 {
  flex: 0 0 25%;
  max-width: 25%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="8"] > .sf-row__col.-col-4 {
  flex: 0 0 33.3333333333%;
  max-width: 33.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="8"] > .sf-row__col.-col-5 {
  flex: 0 0 41.6666666667%;
  max-width: 41.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="8"] > .sf-row__col.-col-6 {
  flex: 0 0 50%;
  max-width: 50%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="8"] > .sf-row__col.-col-7 {
  flex: 0 0 58.3333333333%;
  max-width: 58.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="8"] > .sf-row__col.-col-8 {
  flex: 0 0 66.6666666667%;
  max-width: 66.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="8"] > .sf-row__col.-col-9 {
  flex: 0 0 75%;
  max-width: 75%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="8"] > .sf-row__col.-col-10 {
  flex: 0 0 83.3333333333%;
  max-width: 83.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="8"] > .sf-row__col.-col-11 {
  flex: 0 0 91.6666666667%;
  max-width: 91.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="8"] > .sf-row__col.-col-12 {
  flex: 0 0 100%;
  max-width: 100%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="8"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="8"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="8"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="8"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="8"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="9"] > .sf-row__col.-col-1 {
  flex: 0 0 8.3333333333%;
  max-width: 8.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="9"] > .sf-row__col.-col-2 {
  flex: 0 0 16.6666666667%;
  max-width: 16.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="9"] > .sf-row__col.-col-3 {
  flex: 0 0 25%;
  max-width: 25%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="9"] > .sf-row__col.-col-4 {
  flex: 0 0 33.3333333333%;
  max-width: 33.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="9"] > .sf-row__col.-col-5 {
  flex: 0 0 41.6666666667%;
  max-width: 41.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="9"] > .sf-row__col.-col-6 {
  flex: 0 0 50%;
  max-width: 50%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="9"] > .sf-row__col.-col-7 {
  flex: 0 0 58.3333333333%;
  max-width: 58.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="9"] > .sf-row__col.-col-8 {
  flex: 0 0 66.6666666667%;
  max-width: 66.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="9"] > .sf-row__col.-col-9 {
  flex: 0 0 75%;
  max-width: 75%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="9"] > .sf-row__col.-col-10 {
  flex: 0 0 83.3333333333%;
  max-width: 83.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="9"] > .sf-row__col.-col-11 {
  flex: 0 0 91.6666666667%;
  max-width: 91.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="9"] > .sf-row__col.-col-12 {
  flex: 0 0 100%;
  max-width: 100%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="9"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="9"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="9"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="9"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="9"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="10"] > .sf-row__col.-col-1 {
  flex: 0 0 8.3333333333%;
  max-width: 8.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="10"] > .sf-row__col.-col-2 {
  flex: 0 0 16.6666666667%;
  max-width: 16.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="10"] > .sf-row__col.-col-3 {
  flex: 0 0 25%;
  max-width: 25%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="10"] > .sf-row__col.-col-4 {
  flex: 0 0 33.3333333333%;
  max-width: 33.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="10"] > .sf-row__col.-col-5 {
  flex: 0 0 41.6666666667%;
  max-width: 41.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="10"] > .sf-row__col.-col-6 {
  flex: 0 0 50%;
  max-width: 50%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="10"] > .sf-row__col.-col-7 {
  flex: 0 0 58.3333333333%;
  max-width: 58.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="10"] > .sf-row__col.-col-8 {
  flex: 0 0 66.6666666667%;
  max-width: 66.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="10"] > .sf-row__col.-col-9 {
  flex: 0 0 75%;
  max-width: 75%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="10"] > .sf-row__col.-col-10 {
  flex: 0 0 83.3333333333%;
  max-width: 83.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="10"] > .sf-row__col.-col-11 {
  flex: 0 0 91.6666666667%;
  max-width: 91.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="10"] > .sf-row__col.-col-12 {
  flex: 0 0 100%;
  max-width: 100%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="10"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="10"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="10"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="10"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="10"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="11"] > .sf-row__col.-col-1 {
  flex: 0 0 8.3333333333%;
  max-width: 8.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="11"] > .sf-row__col.-col-2 {
  flex: 0 0 16.6666666667%;
  max-width: 16.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="11"] > .sf-row__col.-col-3 {
  flex: 0 0 25%;
  max-width: 25%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="11"] > .sf-row__col.-col-4 {
  flex: 0 0 33.3333333333%;
  max-width: 33.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="11"] > .sf-row__col.-col-5 {
  flex: 0 0 41.6666666667%;
  max-width: 41.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="11"] > .sf-row__col.-col-6 {
  flex: 0 0 50%;
  max-width: 50%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="11"] > .sf-row__col.-col-7 {
  flex: 0 0 58.3333333333%;
  max-width: 58.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="11"] > .sf-row__col.-col-8 {
  flex: 0 0 66.6666666667%;
  max-width: 66.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="11"] > .sf-row__col.-col-9 {
  flex: 0 0 75%;
  max-width: 75%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="11"] > .sf-row__col.-col-10 {
  flex: 0 0 83.3333333333%;
  max-width: 83.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="11"] > .sf-row__col.-col-11 {
  flex: 0 0 91.6666666667%;
  max-width: 91.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="11"] > .sf-row__col.-col-12 {
  flex: 0 0 100%;
  max-width: 100%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="11"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="11"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="11"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="11"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="11"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="12"] > .sf-row__col.-col-1 {
  flex: 0 0 8.3333333333%;
  max-width: 8.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="12"] > .sf-row__col.-col-2 {
  flex: 0 0 16.6666666667%;
  max-width: 16.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="12"] > .sf-row__col.-col-3 {
  flex: 0 0 25%;
  max-width: 25%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="12"] > .sf-row__col.-col-4 {
  flex: 0 0 33.3333333333%;
  max-width: 33.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="12"] > .sf-row__col.-col-5 {
  flex: 0 0 41.6666666667%;
  max-width: 41.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="12"] > .sf-row__col.-col-6 {
  flex: 0 0 50%;
  max-width: 50%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="12"] > .sf-row__col.-col-7 {
  flex: 0 0 58.3333333333%;
  max-width: 58.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="12"] > .sf-row__col.-col-8 {
  flex: 0 0 66.6666666667%;
  max-width: 66.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="12"] > .sf-row__col.-col-9 {
  flex: 0 0 75%;
  max-width: 75%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="12"] > .sf-row__col.-col-10 {
  flex: 0 0 83.3333333333%;
  max-width: 83.3333333333%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="12"] > .sf-row__col.-col-11 {
  flex: 0 0 91.6666666667%;
  max-width: 91.6666666667%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="12"] > .sf-row__col.-col-12 {
  flex: 0 0 100%;
  max-width: 100%;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="12"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="12"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="12"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="12"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-zero[data-sfcolumn-count="12"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-s {
  -moz-column-gap: 25px;
       column-gap: 25px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="2"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 12.5px);
  max-width: calc(8.3333333333% - 12.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="2"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 12.5px);
  max-width: calc(16.6666666667% - 12.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="2"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 12.5px);
  max-width: calc(25% - 12.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="2"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 12.5px);
  max-width: calc(33.3333333333% - 12.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="2"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 12.5px);
  max-width: calc(41.6666666667% - 12.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="2"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 12.5px);
  max-width: calc(50% - 12.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="2"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 12.5px);
  max-width: calc(58.3333333333% - 12.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="2"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 12.5px);
  max-width: calc(66.6666666667% - 12.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="2"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 12.5px);
  max-width: calc(75% - 12.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="2"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 12.5px);
  max-width: calc(83.3333333333% - 12.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="2"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 12.5px);
  max-width: calc(91.6666666667% - 12.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="2"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 12.5px);
  max-width: calc(100% - 12.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="2"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 25px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="2"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="2"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="2"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="2"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -25px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="3"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 16.6666666667px);
  max-width: calc(8.3333333333% - 16.6666666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="3"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 16.6666666667px);
  max-width: calc(16.6666666667% - 16.6666666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="3"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 16.6666666667px);
  max-width: calc(25% - 16.6666666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="3"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 16.6666666667px);
  max-width: calc(33.3333333333% - 16.6666666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="3"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 16.6666666667px);
  max-width: calc(41.6666666667% - 16.6666666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="3"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 16.6666666667px);
  max-width: calc(50% - 16.6666666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="3"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 16.6666666667px);
  max-width: calc(58.3333333333% - 16.6666666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="3"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 16.6666666667px);
  max-width: calc(66.6666666667% - 16.6666666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="3"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 16.6666666667px);
  max-width: calc(75% - 16.6666666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="3"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 16.6666666667px);
  max-width: calc(83.3333333333% - 16.6666666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="3"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 16.6666666667px);
  max-width: calc(91.6666666667% - 16.6666666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="3"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 16.6666666667px);
  max-width: calc(100% - 16.6666666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="3"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 25px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="3"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="3"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="3"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="3"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -25px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="4"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 18.75px);
  max-width: calc(8.3333333333% - 18.75px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="4"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 18.75px);
  max-width: calc(16.6666666667% - 18.75px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="4"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 18.75px);
  max-width: calc(25% - 18.75px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="4"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 18.75px);
  max-width: calc(33.3333333333% - 18.75px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="4"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 18.75px);
  max-width: calc(41.6666666667% - 18.75px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="4"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 18.75px);
  max-width: calc(50% - 18.75px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="4"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 18.75px);
  max-width: calc(58.3333333333% - 18.75px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="4"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 18.75px);
  max-width: calc(66.6666666667% - 18.75px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="4"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 18.75px);
  max-width: calc(75% - 18.75px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="4"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 18.75px);
  max-width: calc(83.3333333333% - 18.75px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="4"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 18.75px);
  max-width: calc(91.6666666667% - 18.75px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="4"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 18.75px);
  max-width: calc(100% - 18.75px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="4"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 25px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="4"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="4"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="4"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="4"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -25px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="5"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 20px);
  max-width: calc(8.3333333333% - 20px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="5"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 20px);
  max-width: calc(16.6666666667% - 20px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="5"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 20px);
  max-width: calc(25% - 20px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="5"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 20px);
  max-width: calc(33.3333333333% - 20px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="5"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 20px);
  max-width: calc(41.6666666667% - 20px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="5"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 20px);
  max-width: calc(50% - 20px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="5"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 20px);
  max-width: calc(58.3333333333% - 20px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="5"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 20px);
  max-width: calc(66.6666666667% - 20px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="5"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 20px);
  max-width: calc(75% - 20px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="5"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 20px);
  max-width: calc(83.3333333333% - 20px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="5"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 20px);
  max-width: calc(91.6666666667% - 20px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="5"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 20px);
  max-width: calc(100% - 20px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="5"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 25px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="5"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="5"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="5"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="5"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -25px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="6"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 20.8333333333px);
  max-width: calc(8.3333333333% - 20.8333333333px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="6"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 20.8333333333px);
  max-width: calc(16.6666666667% - 20.8333333333px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="6"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 20.8333333333px);
  max-width: calc(25% - 20.8333333333px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="6"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 20.8333333333px);
  max-width: calc(33.3333333333% - 20.8333333333px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="6"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 20.8333333333px);
  max-width: calc(41.6666666667% - 20.8333333333px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="6"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 20.8333333333px);
  max-width: calc(50% - 20.8333333333px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="6"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 20.8333333333px);
  max-width: calc(58.3333333333% - 20.8333333333px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="6"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 20.8333333333px);
  max-width: calc(66.6666666667% - 20.8333333333px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="6"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 20.8333333333px);
  max-width: calc(75% - 20.8333333333px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="6"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 20.8333333333px);
  max-width: calc(83.3333333333% - 20.8333333333px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="6"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 20.8333333333px);
  max-width: calc(91.6666666667% - 20.8333333333px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="6"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 20.8333333333px);
  max-width: calc(100% - 20.8333333333px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="6"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 25px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="6"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="6"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="6"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="6"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -25px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="7"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 21.4285714286px);
  max-width: calc(8.3333333333% - 21.4285714286px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="7"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 21.4285714286px);
  max-width: calc(16.6666666667% - 21.4285714286px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="7"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 21.4285714286px);
  max-width: calc(25% - 21.4285714286px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="7"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 21.4285714286px);
  max-width: calc(33.3333333333% - 21.4285714286px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="7"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 21.4285714286px);
  max-width: calc(41.6666666667% - 21.4285714286px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="7"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 21.4285714286px);
  max-width: calc(50% - 21.4285714286px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="7"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 21.4285714286px);
  max-width: calc(58.3333333333% - 21.4285714286px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="7"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 21.4285714286px);
  max-width: calc(66.6666666667% - 21.4285714286px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="7"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 21.4285714286px);
  max-width: calc(75% - 21.4285714286px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="7"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 21.4285714286px);
  max-width: calc(83.3333333333% - 21.4285714286px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="7"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 21.4285714286px);
  max-width: calc(91.6666666667% - 21.4285714286px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="7"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 21.4285714286px);
  max-width: calc(100% - 21.4285714286px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="7"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 25px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="7"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="7"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="7"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="7"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -25px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="8"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 21.875px);
  max-width: calc(8.3333333333% - 21.875px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="8"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 21.875px);
  max-width: calc(16.6666666667% - 21.875px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="8"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 21.875px);
  max-width: calc(25% - 21.875px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="8"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 21.875px);
  max-width: calc(33.3333333333% - 21.875px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="8"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 21.875px);
  max-width: calc(41.6666666667% - 21.875px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="8"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 21.875px);
  max-width: calc(50% - 21.875px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="8"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 21.875px);
  max-width: calc(58.3333333333% - 21.875px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="8"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 21.875px);
  max-width: calc(66.6666666667% - 21.875px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="8"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 21.875px);
  max-width: calc(75% - 21.875px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="8"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 21.875px);
  max-width: calc(83.3333333333% - 21.875px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="8"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 21.875px);
  max-width: calc(91.6666666667% - 21.875px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="8"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 21.875px);
  max-width: calc(100% - 21.875px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="8"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 25px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="8"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="8"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="8"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="8"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -25px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="9"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 22.2222222222px);
  max-width: calc(8.3333333333% - 22.2222222222px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="9"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 22.2222222222px);
  max-width: calc(16.6666666667% - 22.2222222222px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="9"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 22.2222222222px);
  max-width: calc(25% - 22.2222222222px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="9"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 22.2222222222px);
  max-width: calc(33.3333333333% - 22.2222222222px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="9"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 22.2222222222px);
  max-width: calc(41.6666666667% - 22.2222222222px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="9"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 22.2222222222px);
  max-width: calc(50% - 22.2222222222px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="9"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 22.2222222222px);
  max-width: calc(58.3333333333% - 22.2222222222px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="9"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 22.2222222222px);
  max-width: calc(66.6666666667% - 22.2222222222px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="9"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 22.2222222222px);
  max-width: calc(75% - 22.2222222222px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="9"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 22.2222222222px);
  max-width: calc(83.3333333333% - 22.2222222222px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="9"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 22.2222222222px);
  max-width: calc(91.6666666667% - 22.2222222222px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="9"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 22.2222222222px);
  max-width: calc(100% - 22.2222222222px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="9"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 25px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="9"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="9"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="9"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="9"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -25px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="10"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 22.5px);
  max-width: calc(8.3333333333% - 22.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="10"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 22.5px);
  max-width: calc(16.6666666667% - 22.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="10"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 22.5px);
  max-width: calc(25% - 22.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="10"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 22.5px);
  max-width: calc(33.3333333333% - 22.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="10"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 22.5px);
  max-width: calc(41.6666666667% - 22.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="10"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 22.5px);
  max-width: calc(50% - 22.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="10"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 22.5px);
  max-width: calc(58.3333333333% - 22.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="10"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 22.5px);
  max-width: calc(66.6666666667% - 22.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="10"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 22.5px);
  max-width: calc(75% - 22.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="10"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 22.5px);
  max-width: calc(83.3333333333% - 22.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="10"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 22.5px);
  max-width: calc(91.6666666667% - 22.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="10"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 22.5px);
  max-width: calc(100% - 22.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="10"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 25px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="10"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="10"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="10"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="10"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -25px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="11"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 22.7272727273px);
  max-width: calc(8.3333333333% - 22.7272727273px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="11"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 22.7272727273px);
  max-width: calc(16.6666666667% - 22.7272727273px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="11"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 22.7272727273px);
  max-width: calc(25% - 22.7272727273px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="11"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 22.7272727273px);
  max-width: calc(33.3333333333% - 22.7272727273px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="11"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 22.7272727273px);
  max-width: calc(41.6666666667% - 22.7272727273px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="11"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 22.7272727273px);
  max-width: calc(50% - 22.7272727273px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="11"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 22.7272727273px);
  max-width: calc(58.3333333333% - 22.7272727273px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="11"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 22.7272727273px);
  max-width: calc(66.6666666667% - 22.7272727273px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="11"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 22.7272727273px);
  max-width: calc(75% - 22.7272727273px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="11"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 22.7272727273px);
  max-width: calc(83.3333333333% - 22.7272727273px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="11"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 22.7272727273px);
  max-width: calc(91.6666666667% - 22.7272727273px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="11"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 22.7272727273px);
  max-width: calc(100% - 22.7272727273px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="11"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 25px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="11"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="11"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="11"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="11"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -25px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="12"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 22.9166666667px);
  max-width: calc(8.3333333333% - 22.9166666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="12"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 22.9166666667px);
  max-width: calc(16.6666666667% - 22.9166666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="12"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 22.9166666667px);
  max-width: calc(25% - 22.9166666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="12"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 22.9166666667px);
  max-width: calc(33.3333333333% - 22.9166666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="12"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 22.9166666667px);
  max-width: calc(41.6666666667% - 22.9166666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="12"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 22.9166666667px);
  max-width: calc(50% - 22.9166666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="12"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 22.9166666667px);
  max-width: calc(58.3333333333% - 22.9166666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="12"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 22.9166666667px);
  max-width: calc(66.6666666667% - 22.9166666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="12"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 22.9166666667px);
  max-width: calc(75% - 22.9166666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="12"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 22.9166666667px);
  max-width: calc(83.3333333333% - 22.9166666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="12"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 22.9166666667px);
  max-width: calc(91.6666666667% - 22.9166666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="12"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 22.9166666667px);
  max-width: calc(100% - 22.9166666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="12"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 25px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="12"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="12"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="12"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-s[data-sfcolumn-count="12"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -25px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-m {
  -moz-column-gap: 30px;
       column-gap: 30px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="2"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 15px);
  max-width: calc(8.3333333333% - 15px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="2"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 15px);
  max-width: calc(16.6666666667% - 15px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="2"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 15px);
  max-width: calc(25% - 15px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="2"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 15px);
  max-width: calc(33.3333333333% - 15px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="2"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 15px);
  max-width: calc(41.6666666667% - 15px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="2"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 15px);
  max-width: calc(50% - 15px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="2"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 15px);
  max-width: calc(58.3333333333% - 15px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="2"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 15px);
  max-width: calc(66.6666666667% - 15px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="2"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 15px);
  max-width: calc(75% - 15px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="2"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 15px);
  max-width: calc(83.3333333333% - 15px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="2"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 15px);
  max-width: calc(91.6666666667% - 15px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="2"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 15px);
  max-width: calc(100% - 15px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="2"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 30px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="2"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="2"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="2"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="2"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -30px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="3"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 20px);
  max-width: calc(8.3333333333% - 20px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="3"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 20px);
  max-width: calc(16.6666666667% - 20px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="3"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 20px);
  max-width: calc(25% - 20px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="3"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 20px);
  max-width: calc(33.3333333333% - 20px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="3"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 20px);
  max-width: calc(41.6666666667% - 20px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="3"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 20px);
  max-width: calc(50% - 20px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="3"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 20px);
  max-width: calc(58.3333333333% - 20px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="3"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 20px);
  max-width: calc(66.6666666667% - 20px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="3"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 20px);
  max-width: calc(75% - 20px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="3"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 20px);
  max-width: calc(83.3333333333% - 20px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="3"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 20px);
  max-width: calc(91.6666666667% - 20px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="3"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 20px);
  max-width: calc(100% - 20px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="3"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 30px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="3"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="3"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="3"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="3"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -30px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="4"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 22.5px);
  max-width: calc(8.3333333333% - 22.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="4"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 22.5px);
  max-width: calc(16.6666666667% - 22.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="4"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 22.5px);
  max-width: calc(25% - 22.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="4"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 22.5px);
  max-width: calc(33.3333333333% - 22.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="4"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 22.5px);
  max-width: calc(41.6666666667% - 22.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="4"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 22.5px);
  max-width: calc(50% - 22.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="4"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 22.5px);
  max-width: calc(58.3333333333% - 22.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="4"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 22.5px);
  max-width: calc(66.6666666667% - 22.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="4"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 22.5px);
  max-width: calc(75% - 22.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="4"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 22.5px);
  max-width: calc(83.3333333333% - 22.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="4"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 22.5px);
  max-width: calc(91.6666666667% - 22.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="4"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 22.5px);
  max-width: calc(100% - 22.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="4"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 30px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="4"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="4"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="4"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="4"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -30px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="5"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 24px);
  max-width: calc(8.3333333333% - 24px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="5"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 24px);
  max-width: calc(16.6666666667% - 24px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="5"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 24px);
  max-width: calc(25% - 24px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="5"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 24px);
  max-width: calc(33.3333333333% - 24px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="5"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 24px);
  max-width: calc(41.6666666667% - 24px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="5"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 24px);
  max-width: calc(50% - 24px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="5"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 24px);
  max-width: calc(58.3333333333% - 24px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="5"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 24px);
  max-width: calc(66.6666666667% - 24px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="5"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 24px);
  max-width: calc(75% - 24px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="5"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 24px);
  max-width: calc(83.3333333333% - 24px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="5"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 24px);
  max-width: calc(91.6666666667% - 24px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="5"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 24px);
  max-width: calc(100% - 24px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="5"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 30px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="5"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="5"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="5"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="5"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -30px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="6"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 25px);
  max-width: calc(8.3333333333% - 25px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="6"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 25px);
  max-width: calc(16.6666666667% - 25px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="6"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 25px);
  max-width: calc(25% - 25px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="6"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 25px);
  max-width: calc(33.3333333333% - 25px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="6"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 25px);
  max-width: calc(41.6666666667% - 25px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="6"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 25px);
  max-width: calc(50% - 25px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="6"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 25px);
  max-width: calc(58.3333333333% - 25px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="6"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 25px);
  max-width: calc(66.6666666667% - 25px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="6"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 25px);
  max-width: calc(75% - 25px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="6"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 25px);
  max-width: calc(83.3333333333% - 25px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="6"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 25px);
  max-width: calc(91.6666666667% - 25px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="6"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 25px);
  max-width: calc(100% - 25px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="6"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 30px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="6"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="6"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="6"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="6"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -30px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="7"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 25.7142857143px);
  max-width: calc(8.3333333333% - 25.7142857143px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="7"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 25.7142857143px);
  max-width: calc(16.6666666667% - 25.7142857143px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="7"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 25.7142857143px);
  max-width: calc(25% - 25.7142857143px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="7"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 25.7142857143px);
  max-width: calc(33.3333333333% - 25.7142857143px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="7"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 25.7142857143px);
  max-width: calc(41.6666666667% - 25.7142857143px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="7"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 25.7142857143px);
  max-width: calc(50% - 25.7142857143px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="7"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 25.7142857143px);
  max-width: calc(58.3333333333% - 25.7142857143px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="7"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 25.7142857143px);
  max-width: calc(66.6666666667% - 25.7142857143px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="7"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 25.7142857143px);
  max-width: calc(75% - 25.7142857143px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="7"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 25.7142857143px);
  max-width: calc(83.3333333333% - 25.7142857143px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="7"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 25.7142857143px);
  max-width: calc(91.6666666667% - 25.7142857143px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="7"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 25.7142857143px);
  max-width: calc(100% - 25.7142857143px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="7"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 30px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="7"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="7"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="7"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="7"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -30px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="8"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 26.25px);
  max-width: calc(8.3333333333% - 26.25px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="8"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 26.25px);
  max-width: calc(16.6666666667% - 26.25px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="8"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 26.25px);
  max-width: calc(25% - 26.25px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="8"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 26.25px);
  max-width: calc(33.3333333333% - 26.25px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="8"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 26.25px);
  max-width: calc(41.6666666667% - 26.25px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="8"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 26.25px);
  max-width: calc(50% - 26.25px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="8"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 26.25px);
  max-width: calc(58.3333333333% - 26.25px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="8"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 26.25px);
  max-width: calc(66.6666666667% - 26.25px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="8"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 26.25px);
  max-width: calc(75% - 26.25px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="8"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 26.25px);
  max-width: calc(83.3333333333% - 26.25px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="8"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 26.25px);
  max-width: calc(91.6666666667% - 26.25px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="8"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 26.25px);
  max-width: calc(100% - 26.25px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="8"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 30px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="8"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="8"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="8"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="8"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -30px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="9"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 26.6666666667px);
  max-width: calc(8.3333333333% - 26.6666666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="9"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 26.6666666667px);
  max-width: calc(16.6666666667% - 26.6666666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="9"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 26.6666666667px);
  max-width: calc(25% - 26.6666666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="9"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 26.6666666667px);
  max-width: calc(33.3333333333% - 26.6666666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="9"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 26.6666666667px);
  max-width: calc(41.6666666667% - 26.6666666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="9"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 26.6666666667px);
  max-width: calc(50% - 26.6666666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="9"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 26.6666666667px);
  max-width: calc(58.3333333333% - 26.6666666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="9"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 26.6666666667px);
  max-width: calc(66.6666666667% - 26.6666666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="9"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 26.6666666667px);
  max-width: calc(75% - 26.6666666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="9"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 26.6666666667px);
  max-width: calc(83.3333333333% - 26.6666666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="9"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 26.6666666667px);
  max-width: calc(91.6666666667% - 26.6666666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="9"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 26.6666666667px);
  max-width: calc(100% - 26.6666666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="9"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 30px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="9"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="9"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="9"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="9"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -30px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="10"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 27px);
  max-width: calc(8.3333333333% - 27px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="10"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 27px);
  max-width: calc(16.6666666667% - 27px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="10"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 27px);
  max-width: calc(25% - 27px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="10"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 27px);
  max-width: calc(33.3333333333% - 27px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="10"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 27px);
  max-width: calc(41.6666666667% - 27px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="10"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 27px);
  max-width: calc(50% - 27px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="10"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 27px);
  max-width: calc(58.3333333333% - 27px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="10"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 27px);
  max-width: calc(66.6666666667% - 27px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="10"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 27px);
  max-width: calc(75% - 27px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="10"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 27px);
  max-width: calc(83.3333333333% - 27px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="10"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 27px);
  max-width: calc(91.6666666667% - 27px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="10"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 27px);
  max-width: calc(100% - 27px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="10"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 30px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="10"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="10"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="10"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="10"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -30px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="11"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 27.2727272727px);
  max-width: calc(8.3333333333% - 27.2727272727px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="11"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 27.2727272727px);
  max-width: calc(16.6666666667% - 27.2727272727px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="11"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 27.2727272727px);
  max-width: calc(25% - 27.2727272727px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="11"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 27.2727272727px);
  max-width: calc(33.3333333333% - 27.2727272727px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="11"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 27.2727272727px);
  max-width: calc(41.6666666667% - 27.2727272727px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="11"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 27.2727272727px);
  max-width: calc(50% - 27.2727272727px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="11"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 27.2727272727px);
  max-width: calc(58.3333333333% - 27.2727272727px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="11"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 27.2727272727px);
  max-width: calc(66.6666666667% - 27.2727272727px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="11"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 27.2727272727px);
  max-width: calc(75% - 27.2727272727px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="11"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 27.2727272727px);
  max-width: calc(83.3333333333% - 27.2727272727px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="11"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 27.2727272727px);
  max-width: calc(91.6666666667% - 27.2727272727px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="11"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 27.2727272727px);
  max-width: calc(100% - 27.2727272727px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="11"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 30px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="11"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="11"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="11"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="11"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -30px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="12"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 27.5px);
  max-width: calc(8.3333333333% - 27.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="12"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 27.5px);
  max-width: calc(16.6666666667% - 27.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="12"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 27.5px);
  max-width: calc(25% - 27.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="12"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 27.5px);
  max-width: calc(33.3333333333% - 27.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="12"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 27.5px);
  max-width: calc(41.6666666667% - 27.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="12"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 27.5px);
  max-width: calc(50% - 27.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="12"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 27.5px);
  max-width: calc(58.3333333333% - 27.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="12"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 27.5px);
  max-width: calc(66.6666666667% - 27.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="12"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 27.5px);
  max-width: calc(75% - 27.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="12"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 27.5px);
  max-width: calc(83.3333333333% - 27.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="12"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 27.5px);
  max-width: calc(91.6666666667% - 27.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="12"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 27.5px);
  max-width: calc(100% - 27.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="12"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 30px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="12"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="12"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="12"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-m[data-sfcolumn-count="12"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -30px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-l {
  -moz-column-gap: 35px;
       column-gap: 35px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="2"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 17.5px);
  max-width: calc(8.3333333333% - 17.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="2"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 17.5px);
  max-width: calc(16.6666666667% - 17.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="2"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 17.5px);
  max-width: calc(25% - 17.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="2"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 17.5px);
  max-width: calc(33.3333333333% - 17.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="2"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 17.5px);
  max-width: calc(41.6666666667% - 17.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="2"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 17.5px);
  max-width: calc(50% - 17.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="2"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 17.5px);
  max-width: calc(58.3333333333% - 17.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="2"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 17.5px);
  max-width: calc(66.6666666667% - 17.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="2"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 17.5px);
  max-width: calc(75% - 17.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="2"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 17.5px);
  max-width: calc(83.3333333333% - 17.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="2"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 17.5px);
  max-width: calc(91.6666666667% - 17.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="2"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 17.5px);
  max-width: calc(100% - 17.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="2"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 35px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="2"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="2"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="2"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="2"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -35px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="3"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 23.3333333333px);
  max-width: calc(8.3333333333% - 23.3333333333px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="3"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 23.3333333333px);
  max-width: calc(16.6666666667% - 23.3333333333px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="3"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 23.3333333333px);
  max-width: calc(25% - 23.3333333333px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="3"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 23.3333333333px);
  max-width: calc(33.3333333333% - 23.3333333333px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="3"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 23.3333333333px);
  max-width: calc(41.6666666667% - 23.3333333333px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="3"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 23.3333333333px);
  max-width: calc(50% - 23.3333333333px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="3"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 23.3333333333px);
  max-width: calc(58.3333333333% - 23.3333333333px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="3"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 23.3333333333px);
  max-width: calc(66.6666666667% - 23.3333333333px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="3"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 23.3333333333px);
  max-width: calc(75% - 23.3333333333px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="3"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 23.3333333333px);
  max-width: calc(83.3333333333% - 23.3333333333px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="3"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 23.3333333333px);
  max-width: calc(91.6666666667% - 23.3333333333px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="3"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 23.3333333333px);
  max-width: calc(100% - 23.3333333333px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="3"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 35px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="3"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="3"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="3"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="3"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -35px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="4"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 26.25px);
  max-width: calc(8.3333333333% - 26.25px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="4"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 26.25px);
  max-width: calc(16.6666666667% - 26.25px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="4"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 26.25px);
  max-width: calc(25% - 26.25px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="4"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 26.25px);
  max-width: calc(33.3333333333% - 26.25px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="4"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 26.25px);
  max-width: calc(41.6666666667% - 26.25px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="4"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 26.25px);
  max-width: calc(50% - 26.25px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="4"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 26.25px);
  max-width: calc(58.3333333333% - 26.25px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="4"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 26.25px);
  max-width: calc(66.6666666667% - 26.25px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="4"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 26.25px);
  max-width: calc(75% - 26.25px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="4"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 26.25px);
  max-width: calc(83.3333333333% - 26.25px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="4"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 26.25px);
  max-width: calc(91.6666666667% - 26.25px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="4"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 26.25px);
  max-width: calc(100% - 26.25px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="4"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 35px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="4"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="4"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="4"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="4"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -35px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="5"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 28px);
  max-width: calc(8.3333333333% - 28px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="5"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 28px);
  max-width: calc(16.6666666667% - 28px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="5"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 28px);
  max-width: calc(25% - 28px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="5"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 28px);
  max-width: calc(33.3333333333% - 28px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="5"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 28px);
  max-width: calc(41.6666666667% - 28px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="5"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 28px);
  max-width: calc(50% - 28px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="5"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 28px);
  max-width: calc(58.3333333333% - 28px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="5"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 28px);
  max-width: calc(66.6666666667% - 28px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="5"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 28px);
  max-width: calc(75% - 28px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="5"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 28px);
  max-width: calc(83.3333333333% - 28px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="5"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 28px);
  max-width: calc(91.6666666667% - 28px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="5"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 28px);
  max-width: calc(100% - 28px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="5"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 35px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="5"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="5"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="5"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="5"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -35px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="6"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 29.1666666667px);
  max-width: calc(8.3333333333% - 29.1666666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="6"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 29.1666666667px);
  max-width: calc(16.6666666667% - 29.1666666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="6"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 29.1666666667px);
  max-width: calc(25% - 29.1666666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="6"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 29.1666666667px);
  max-width: calc(33.3333333333% - 29.1666666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="6"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 29.1666666667px);
  max-width: calc(41.6666666667% - 29.1666666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="6"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 29.1666666667px);
  max-width: calc(50% - 29.1666666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="6"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 29.1666666667px);
  max-width: calc(58.3333333333% - 29.1666666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="6"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 29.1666666667px);
  max-width: calc(66.6666666667% - 29.1666666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="6"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 29.1666666667px);
  max-width: calc(75% - 29.1666666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="6"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 29.1666666667px);
  max-width: calc(83.3333333333% - 29.1666666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="6"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 29.1666666667px);
  max-width: calc(91.6666666667% - 29.1666666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="6"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 29.1666666667px);
  max-width: calc(100% - 29.1666666667px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="6"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 35px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="6"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="6"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="6"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="6"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -35px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="7"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 30px);
  max-width: calc(8.3333333333% - 30px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="7"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 30px);
  max-width: calc(16.6666666667% - 30px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="7"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 30px);
  max-width: calc(25% - 30px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="7"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 30px);
  max-width: calc(33.3333333333% - 30px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="7"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 30px);
  max-width: calc(41.6666666667% - 30px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="7"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 30px);
  max-width: calc(50% - 30px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="7"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 30px);
  max-width: calc(58.3333333333% - 30px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="7"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 30px);
  max-width: calc(66.6666666667% - 30px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="7"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 30px);
  max-width: calc(75% - 30px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="7"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 30px);
  max-width: calc(83.3333333333% - 30px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="7"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 30px);
  max-width: calc(91.6666666667% - 30px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="7"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 30px);
  max-width: calc(100% - 30px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="7"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 35px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="7"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="7"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="7"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="7"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -35px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="8"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 30.625px);
  max-width: calc(8.3333333333% - 30.625px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="8"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 30.625px);
  max-width: calc(16.6666666667% - 30.625px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="8"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 30.625px);
  max-width: calc(25% - 30.625px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="8"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 30.625px);
  max-width: calc(33.3333333333% - 30.625px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="8"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 30.625px);
  max-width: calc(41.6666666667% - 30.625px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="8"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 30.625px);
  max-width: calc(50% - 30.625px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="8"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 30.625px);
  max-width: calc(58.3333333333% - 30.625px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="8"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 30.625px);
  max-width: calc(66.6666666667% - 30.625px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="8"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 30.625px);
  max-width: calc(75% - 30.625px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="8"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 30.625px);
  max-width: calc(83.3333333333% - 30.625px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="8"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 30.625px);
  max-width: calc(91.6666666667% - 30.625px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="8"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 30.625px);
  max-width: calc(100% - 30.625px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="8"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 35px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="8"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="8"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="8"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="8"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -35px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="9"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 31.1111111111px);
  max-width: calc(8.3333333333% - 31.1111111111px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="9"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 31.1111111111px);
  max-width: calc(16.6666666667% - 31.1111111111px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="9"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 31.1111111111px);
  max-width: calc(25% - 31.1111111111px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="9"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 31.1111111111px);
  max-width: calc(33.3333333333% - 31.1111111111px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="9"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 31.1111111111px);
  max-width: calc(41.6666666667% - 31.1111111111px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="9"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 31.1111111111px);
  max-width: calc(50% - 31.1111111111px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="9"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 31.1111111111px);
  max-width: calc(58.3333333333% - 31.1111111111px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="9"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 31.1111111111px);
  max-width: calc(66.6666666667% - 31.1111111111px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="9"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 31.1111111111px);
  max-width: calc(75% - 31.1111111111px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="9"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 31.1111111111px);
  max-width: calc(83.3333333333% - 31.1111111111px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="9"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 31.1111111111px);
  max-width: calc(91.6666666667% - 31.1111111111px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="9"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 31.1111111111px);
  max-width: calc(100% - 31.1111111111px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="9"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 35px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="9"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="9"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="9"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="9"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -35px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="10"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 31.5px);
  max-width: calc(8.3333333333% - 31.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="10"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 31.5px);
  max-width: calc(16.6666666667% - 31.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="10"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 31.5px);
  max-width: calc(25% - 31.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="10"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 31.5px);
  max-width: calc(33.3333333333% - 31.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="10"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 31.5px);
  max-width: calc(41.6666666667% - 31.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="10"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 31.5px);
  max-width: calc(50% - 31.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="10"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 31.5px);
  max-width: calc(58.3333333333% - 31.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="10"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 31.5px);
  max-width: calc(66.6666666667% - 31.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="10"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 31.5px);
  max-width: calc(75% - 31.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="10"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 31.5px);
  max-width: calc(83.3333333333% - 31.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="10"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 31.5px);
  max-width: calc(91.6666666667% - 31.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="10"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 31.5px);
  max-width: calc(100% - 31.5px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="10"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 35px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="10"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="10"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="10"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="10"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -35px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="11"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 31.8181818182px);
  max-width: calc(8.3333333333% - 31.8181818182px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="11"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 31.8181818182px);
  max-width: calc(16.6666666667% - 31.8181818182px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="11"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 31.8181818182px);
  max-width: calc(25% - 31.8181818182px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="11"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 31.8181818182px);
  max-width: calc(33.3333333333% - 31.8181818182px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="11"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 31.8181818182px);
  max-width: calc(41.6666666667% - 31.8181818182px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="11"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 31.8181818182px);
  max-width: calc(50% - 31.8181818182px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="11"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 31.8181818182px);
  max-width: calc(58.3333333333% - 31.8181818182px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="11"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 31.8181818182px);
  max-width: calc(66.6666666667% - 31.8181818182px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="11"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 31.8181818182px);
  max-width: calc(75% - 31.8181818182px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="11"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 31.8181818182px);
  max-width: calc(83.3333333333% - 31.8181818182px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="11"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 31.8181818182px);
  max-width: calc(91.6666666667% - 31.8181818182px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="11"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 31.8181818182px);
  max-width: calc(100% - 31.8181818182px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="11"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 35px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="11"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="11"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="11"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="11"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -35px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="12"] > .sf-row__col.-col-1 {
  flex: 0 0 calc(8.3333333333% - 32.0833333333px);
  max-width: calc(8.3333333333% - 32.0833333333px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="12"] > .sf-row__col.-col-2 {
  flex: 0 0 calc(16.6666666667% - 32.0833333333px);
  max-width: calc(16.6666666667% - 32.0833333333px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="12"] > .sf-row__col.-col-3 {
  flex: 0 0 calc(25% - 32.0833333333px);
  max-width: calc(25% - 32.0833333333px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="12"] > .sf-row__col.-col-4 {
  flex: 0 0 calc(33.3333333333% - 32.0833333333px);
  max-width: calc(33.3333333333% - 32.0833333333px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="12"] > .sf-row__col.-col-5 {
  flex: 0 0 calc(41.6666666667% - 32.0833333333px);
  max-width: calc(41.6666666667% - 32.0833333333px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="12"] > .sf-row__col.-col-6 {
  flex: 0 0 calc(50% - 32.0833333333px);
  max-width: calc(50% - 32.0833333333px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="12"] > .sf-row__col.-col-7 {
  flex: 0 0 calc(58.3333333333% - 32.0833333333px);
  max-width: calc(58.3333333333% - 32.0833333333px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="12"] > .sf-row__col.-col-8 {
  flex: 0 0 calc(66.6666666667% - 32.0833333333px);
  max-width: calc(66.6666666667% - 32.0833333333px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="12"] > .sf-row__col.-col-9 {
  flex: 0 0 calc(75% - 32.0833333333px);
  max-width: calc(75% - 32.0833333333px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="12"] > .sf-row__col.-col-10 {
  flex: 0 0 calc(83.3333333333% - 32.0833333333px);
  max-width: calc(83.3333333333% - 32.0833333333px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="12"] > .sf-row__col.-col-11 {
  flex: 0 0 calc(91.6666666667% - 32.0833333333px);
  max-width: calc(91.6666666667% - 32.0833333333px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="12"] > .sf-row__col.-col-12 {
  flex: 0 0 calc(100% - 32.0833333333px);
  max-width: calc(100% - 32.0833333333px);
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="12"] > .sf-row__col > :not(sf-add-widget, sf-fake-widget) {
  margin-top: 35px;
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="12"] > .sf-row__col > :first-child:not(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="12"] > .sf-row__col :is(sf-system-status):empty {
  margin-top: 0;
}

sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="12"] > .sf-row__col > :first-child:is(sf-add-widget, sf-fake-widget),
sf-app.sf-app .sf-row.-section-gap.-gap-l[data-sfcolumn-count="12"] > .sf-row__col :first-child:is(sf-system-status):empty {
  margin-bottom: -35px;
}

sf-app.sf-app .sf-row .-fill {
  flex: 1;
}

sf-app.sf-app .sf-row.-no-gutter .sf-row__col {
  padding: 0;
}

sf-app.sf-app .sf-row.-inline {
  display: inline-flex;
  width: auto;
}

sf-app.sf-app .sf-row.-full-height {
  height: 100%;
}

sf-app.sf-app .sf-row.-auto-width {
  width: auto;
}

sf-app.sf-app .sf-row.-wrap {
  flex-wrap: wrap;
}

sf-app.sf-app .sf-row.-no-wrap {
  flex-wrap: nowrap;
}

sf-app.sf-app .sf-row.-wrap-reverse {
  flex-wrap: wrap-reverse;
}

sf-app.sf-app .sf-row.-row {
  flex-direction: row;
}

sf-app.sf-app .sf-row.-row-reverse {
  flex-direction: row-reverse;
}

sf-app.sf-app .sf-row.-column {
  flex-direction: column;
}

sf-app.sf-app .sf-row.-column-reverse {
  flex-direction: column-reverse;
}

sf-app.sf-app .sf-row.-align-items-stretch {
  align-items: stretch;
}

sf-app.sf-app .sf-row.-align-items-start {
  align-items: flex-start;
}

sf-app.sf-app .sf-row.-align-items-end {
  align-items: flex-end;
}

sf-app.sf-app .sf-row.-align-items-center {
  align-items: center;
}

sf-app.sf-app .sf-row.-align-items-baseline {
  align-items: baseline;
}

sf-app.sf-app .sf-row.-align-content-stretch {
  align-content: stretch;
}

sf-app.sf-app .sf-row.-align-content-start {
  align-content: flex-start;
}

sf-app.sf-app .sf-row.-align-content-end {
  align-content: flex-end;
}

sf-app.sf-app .sf-row.-align-content-center {
  align-content: center;
}

sf-app.sf-app .sf-row.-align-content-between {
  align-content: space-between;
}

sf-app.sf-app .sf-row.-align-content-around {
  align-content: space-around;
}

sf-app.sf-app .sf-row.-justify-content-start {
  justify-content: flex-start;
}

sf-app.sf-app .sf-row.-justify-content-end {
  justify-content: flex-end;
}

sf-app.sf-app .sf-row.-justify-content-center {
  justify-content: center;
}

sf-app.sf-app .sf-row.-justify-content-between {
  justify-content: space-between;
}

sf-app.sf-app .sf-row.-justify-content-around {
  justify-content: space-around;
}

sf-app.sf-app .sf-row.-adjustable-ellipsis {
  display: inline-flex;
  width: auto;
}

sf-app.sf-app .sf-row.-adjustable-ellipsis .sf-row__col.-truncatable {
  min-width: 0;
}

sf-app.sf-app .sf-row.-adjustable-ellipsis .sf-row__col.-full-width {
  flex: none;
  white-space: nowrap;
}

sf-app.sf-app .sf-row__col {
  box-sizing: border-box;
  padding: 0;
  flex: 1;
  max-width: 100%;
  /*
    Row — Grid System

    Columns sizes

    `.sf-row__col.-col-{1, 2, 3,..., 12}`

    Column sizes applies for all devices unless overridden

        Markup:
        <div class="sf-row">
           <div class="sf-row__col -col-12">
               .sf-row__col.-col-12
           </div>
        </div>
        <div class="sf-row">
           <div class="sf-row__col -col-1">
               .sf-row__col.-col-1
           </div>
           <div class="sf-row__col -col-11">
               .sf-row__col.-col-11
           </div>
        </div>
        <div class="sf-row">
           <div class="sf-row__col -col-2">
               .sf-row__col.-col-2
           </div>
           <div class="sf-row__col -col-10">
               .sf-row__col.-col-10
           </div>
        </div>
        <div class="sf-row">
           <div class="sf-row__col -col-3">
               .sf-row__col.-col-3
           </div>
           <div class="sf-row__col -col-9">
               .sf-row__col.-col-9
           </div>
        </div>
        <div class="sf-row">
           <div class="sf-row__col -col-4">
               .sf-row__col.-col-4
           </div>
           <div class="sf-row__col -col-8">
               .sf-row__col.-col-8
           </div>
        </div>
        <div class="sf-row">
           <div class="sf-row__col -col-5">
               .sf-row__col.-col-5
           </div>
           <div class="sf-row__col -col-7">
               .sf-row__col.-col-7
           </div>
        </div>
        <div class="sf-row">
           <div class="sf-row__col -col-6">
               .sf-row__col.-col-6
           </div>
           <div class="sf-row__col -col-6">
               .sf-row__col.-col-6
           </div>
        </div>
        <div class="sf-row">
           <div class="sf-row__col -col-7">
               .sf-row__col.-col-7
           </div>
           <div class="sf-row__col -col-5">
               .sf-row__col.-col-5
           </div>
        </div>
        <div class="sf-row">
           <div class="sf-row__col -col-8">
               .sf-row__col.-col-8
           </div>
           <div class="sf-row__col -col-4">
               .sf-row__col.-col-4
           </div>
        </div>
        <div class="sf-row">
           <div class="sf-row__col -col-9">
               .sf-row__col.-col-9
           </div>
           <div class="sf-row__col -col-3">
               .sf-row__col.-col-3
           </div>
        </div>
        <div class="sf-row">
           <div class="sf-row__col -col-10">
               .sf-row__col.-col-10
           </div>
           <div class="sf-row__col -col-2">
               .sf-row__col.-col-2
           </div>
        </div>
        <div class="sf-row">
           <div class="sf-row__col -col-11">
               .sf-row__col.-col-11
           </div>
           <div class="sf-row__col -col-1">
               .sf-row__col.-col-1
           </div>
        </div>

        Styleguide: Row-grid.Columns-sizes
   */
  /*
    Columns order

    `.sf-row__col.-order-{1, 2, 3,..., 12}`

        Markup:
        <div class="sf-row">
           <div class="sf-row__col -order-2">
               .sf-row__col.-order-2
               <p>I am <strong>first</strong>&nbsp;in the markup but ordered second on the screen</p>
           </div>
           <div class="sf-row__col -order-3">
               .sf-row__col.-order-3
               <p>I am <strong>second</strong>&nbsp;in the markup but ordered third on the screen</p>
           </div>
           <div class="sf-row__col -order-1">
               .sf-row__col.-order-1
               <p>I am <strong>third</strong>&nbsp;in the markup but ordered first on the screen</p>
           </div>
        </div>

   Styleguide: Row-grid.Columns-order
   */
}

sf-app.sf-app .sf-row__col.-col-1 {
  flex: 0 0 8.3333333333%;
  max-width: 8.3333333333%;
}

sf-app.sf-app .sf-row__col.-col-2 {
  flex: 0 0 16.6666666667%;
  max-width: 16.6666666667%;
}

sf-app.sf-app .sf-row__col.-col-3 {
  flex: 0 0 25%;
  max-width: 25%;
}

sf-app.sf-app .sf-row__col.-col-4 {
  flex: 0 0 33.3333333333%;
  max-width: 33.3333333333%;
}

sf-app.sf-app .sf-row__col.-col-5 {
  flex: 0 0 41.6666666667%;
  max-width: 41.6666666667%;
}

sf-app.sf-app .sf-row__col.-col-6 {
  flex: 0 0 50%;
  max-width: 50%;
}

sf-app.sf-app .sf-row__col.-col-7 {
  flex: 0 0 58.3333333333%;
  max-width: 58.3333333333%;
}

sf-app.sf-app .sf-row__col.-col-8 {
  flex: 0 0 66.6666666667%;
  max-width: 66.6666666667%;
}

sf-app.sf-app .sf-row__col.-col-9 {
  flex: 0 0 75%;
  max-width: 75%;
}

sf-app.sf-app .sf-row__col.-col-10 {
  flex: 0 0 83.3333333333%;
  max-width: 83.3333333333%;
}

sf-app.sf-app .sf-row__col.-col-11 {
  flex: 0 0 91.6666666667%;
  max-width: 91.6666666667%;
}

sf-app.sf-app .sf-row__col.-col-12 {
  flex: 0 0 100%;
  max-width: 100%;
}

sf-app.sf-app .sf-row__col.-order-1 {
  order: 1;
}

sf-app.sf-app .sf-row__col.-order-2 {
  order: 2;
}

sf-app.sf-app .sf-row__col.-order-3 {
  order: 3;
}

sf-app.sf-app .sf-row__col.-order-4 {
  order: 4;
}

sf-app.sf-app .sf-row__col.-order-5 {
  order: 5;
}

sf-app.sf-app .sf-row__col.-order-6 {
  order: 6;
}

sf-app.sf-app .sf-row__col.-order-7 {
  order: 7;
}

sf-app.sf-app .sf-row__col.-order-8 {
  order: 8;
}

sf-app.sf-app .sf-row__col.-order-9 {
  order: 9;
}

sf-app.sf-app .sf-row__col.-order-10 {
  order: 10;
}

sf-app.sf-app .sf-row__col.-order-11 {
  order: 11;
}

sf-app.sf-app .sf-row__col.-order-12 {
  order: 12;
}

sf-app.sf-app .sf-row .-no-gutter {
  padding: 0;
}

sf-app.sf-app .sf-row .-no-flex {
  flex: none;
}

sf-app.sf-app .sf-row .-auto-flex {
  flex: auto;
}

sf-app.sf-app .sf-row .-hidden {
  display: none;
}

sf-app.sf-app .sf-row .-align-self-stretch {
  align-self: stretch;
}

sf-app.sf-app .sf-row .-align-self-start {
  align-self: flex-start;
}

sf-app.sf-app .sf-row .-align-self-end {
  align-self: flex-end;
}

sf-app.sf-app .sf-row .-align-self-center {
  align-self: center;
}

sf-app.sf-app .sf-row .-align-self-baseline {
  align-self: baseline;
}

sf-app.sf-app .sf-grid {
  display: grid;
}

sf-app.sf-app .sf-grid.-gap-zero {
  grid-gap: 0 !important;
}

sf-app.sf-app .sf-grid.-gap-4xs {
  grid-gap: 5px !important;
}

sf-app.sf-app .sf-grid.-gap-3xs {
  grid-gap: 10px !important;
}

sf-app.sf-app .sf-grid.-gap-2xs {
  grid-gap: 15px !important;
}

sf-app.sf-app .sf-grid.-gap-xs {
  grid-gap: 20px !important;
}

sf-app.sf-app .sf-grid.-gap-s {
  grid-gap: 25px !important;
}

sf-app.sf-app .sf-grid.-gap-m {
  grid-gap: 30px !important;
}

sf-app.sf-app .sf-grid.-gap-l {
  grid-gap: 35px !important;
}

sf-app.sf-app .sf-grid.-gap-xl {
  grid-gap: 40px !important;
}

sf-app.sf-app .sf-grid.-gap-2xl {
  grid-gap: 45px !important;
}

sf-app.sf-app .sf-grid.-gap-3xl {
  grid-gap: 50px !important;
}

sf-app.sf-app .sf-grid.-gap-4xl {
  grid-gap: 55px !important;
}

sf-app.sf-app .sf-grid.-gap-5xl {
  grid-gap: 60px !important;
}

sf-app.sf-app .sf-grid.-gap-6xl {
  grid-gap: 80px !important;
}

sf-app.sf-app .sf-grid.-gap-7xl {
  grid-gap: 100px !important;
}

sf-app.sf-app .sf-grid.-gap-8xl {
  grid-gap: 120px !important;
}

sf-app.sf-app .sf-grid.-gap-col-zero {
  grid-column-gap: 0 !important;
}

sf-app.sf-app .sf-grid.-gap-col-4xs {
  grid-column-gap: 5px !important;
}

sf-app.sf-app .sf-grid.-gap-col-3xs {
  grid-column-gap: 10px !important;
}

sf-app.sf-app .sf-grid.-gap-col-2xs {
  grid-column-gap: 15px !important;
}

sf-app.sf-app .sf-grid.-gap-col-xs {
  grid-column-gap: 20px !important;
}

sf-app.sf-app .sf-grid.-gap-col-s {
  grid-column-gap: 25px !important;
}

sf-app.sf-app .sf-grid.-gap-col-m {
  grid-column-gap: 30px !important;
}

sf-app.sf-app .sf-grid.-gap-col-l {
  grid-column-gap: 35px !important;
}

sf-app.sf-app .sf-grid.-gap-col-xl {
  grid-column-gap: 40px !important;
}

sf-app.sf-app .sf-grid.-gap-col-2xl {
  grid-column-gap: 45px !important;
}

sf-app.sf-app .sf-grid.-gap-col-3xl {
  grid-column-gap: 50px !important;
}

sf-app.sf-app .sf-grid.-gap-col-4xl {
  grid-column-gap: 55px !important;
}

sf-app.sf-app .sf-grid.-gap-col-5xl {
  grid-column-gap: 60px !important;
}

sf-app.sf-app .sf-grid.-gap-col-6xl {
  grid-column-gap: 80px !important;
}

sf-app.sf-app .sf-grid.-gap-col-7xl {
  grid-column-gap: 100px !important;
}

sf-app.sf-app .sf-grid.-gap-col-8xl {
  grid-column-gap: 120px !important;
}

sf-app.sf-app .sf-grid.-gap-row-zero {
  grid-row-gap: 0 !important;
}

sf-app.sf-app .sf-grid.-gap-row-4xs {
  grid-row-gap: 5px !important;
}

sf-app.sf-app .sf-grid.-gap-row-3xs {
  grid-row-gap: 10px !important;
}

sf-app.sf-app .sf-grid.-gap-row-2xs {
  grid-row-gap: 15px !important;
}

sf-app.sf-app .sf-grid.-gap-row-xs {
  grid-row-gap: 20px !important;
}

sf-app.sf-app .sf-grid.-gap-row-s {
  grid-row-gap: 25px !important;
}

sf-app.sf-app .sf-grid.-gap-row-m {
  grid-row-gap: 30px !important;
}

sf-app.sf-app .sf-grid.-gap-row-l {
  grid-row-gap: 35px !important;
}

sf-app.sf-app .sf-grid.-gap-row-xl {
  grid-row-gap: 40px !important;
}

sf-app.sf-app .sf-grid.-gap-row-2xl {
  grid-row-gap: 45px !important;
}

sf-app.sf-app .sf-grid.-gap-row-3xl {
  grid-row-gap: 50px !important;
}

sf-app.sf-app .sf-grid.-gap-row-4xl {
  grid-row-gap: 55px !important;
}

sf-app.sf-app .sf-grid.-gap-row-5xl {
  grid-row-gap: 60px !important;
}

sf-app.sf-app .sf-grid.-gap-row-6xl {
  grid-row-gap: 80px !important;
}

sf-app.sf-app .sf-grid.-gap-row-7xl {
  grid-row-gap: 100px !important;
}

sf-app.sf-app .sf-grid.-gap-row-8xl {
  grid-row-gap: 120px !important;
}

sf-app.sf-app .sf-grid.-albums {
  grid-template-columns: repeat(auto-fill, 188px);
}

sf-app.sf-app .sf-grid.-col-3 {
  grid-template-columns: 1fr 1fr 1fr;
}

sf-app.sf-app .sf-grid.-col-4 {
  grid-template-columns: 1fr 1fr 1fr 1fr;
}

sf-app.sf-app .sf-grid.-col-equal-4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

sf-app.sf-app .sf-link {
  color: var(--link-color);
  text-decoration: none;
  cursor: pointer;
}

sf-app.sf-app .sf-link.-secondary {
  color: var(--link-secondary-color);
}

sf-app.sf-app .sf-link.-no-hover:hover, sf-app.sf-app .sf-link.-no-hover:active, sf-app.sf-app .sf-link.-no-hover:focus {
  color: var(--link-color);
}

sf-app.sf-app .sf-link.-side {
  display: inline-block;
  margin-bottom: 2px;
  padding: 3px 6px;
  color: #333;
}

sf-app.sf-app .sf-link.-side.-active, sf-app.sf-app .sf-link.-side:focus, sf-app.sf-app .sf-link.-side:hover {
  background-color: var(--sf-link-side-color-bg);
  border-radius: 2px;
}

sf-app.sf-app .sf-link.-side-secondary {
  color: var(--link-side-secondary-color);
}

sf-app.sf-app .sf-link.-side-secondary:hover {
  color: var(--link-side-secondary-color-hover);
}

sf-app.sf-app .sf-link.-side-secondary.-active {
  color: var(--link-side-secondary-color-active);
}

sf-app.sf-app .sf-link.-basic {
  color: #333;
}

sf-app.sf-app .sf-link.-basic:hover, sf-app.sf-app .sf-link.-basic:active, sf-app.sf-app .sf-link.-basic:focus {
  color: #333;
}

sf-app.sf-app .sf-link.-top-toolbar {
  align-items: center;
  justify-content: center;
  display: inline-flex;
  padding: 0 10px;
  color: #333;
  border: 0;
  background-color: #fff;
  border-radius: 0;
  height: 100%;
}

sf-app.sf-app .sf-link.-top-toolbar.-active, sf-app.sf-app .sf-link.-top-toolbar:focus, sf-app.sf-app .sf-link.-top-toolbar:hover {
  color: #333;
  background-color: #f5f5f5;
  border-color: #eee;
}

sf-app.sf-app .sf-link:not(.sf-tabs__item):not(.-no-underline):not(.-side):not(.-side-secondary):not(.sf-nav-dropdown__item-link):not(.sf-icon):not(.sf-expand-button):hover:not(:has([class*=sf-fa])):not(:has([class*=sf-badge])):not(:has(i.fa)):not(:has(sf-icon)):not(:has([class*=sf-icon])), sf-app.sf-app .sf-link:not(.sf-tabs__item):not(.-no-underline):not(.-side):not(.-side-secondary):not(.sf-nav-dropdown__item-link):not(.sf-icon):not(.sf-expand-button):active:not(:has([class*=sf-fa])):not(:has([class*=sf-badge])):not(:has(i.fa)):not(:has(sf-icon)):not(:has([class*=sf-icon])), sf-app.sf-app .sf-link:not(.sf-tabs__item):not(.-no-underline):not(.-side):not(.-side-secondary):not(.sf-nav-dropdown__item-link):not(.sf-icon):not(.sf-expand-button):focus:not(:has([class*=sf-fa])):not(:has([class*=sf-badge])):not(:has(i.fa)):not(:has(sf-icon)):not(:has([class*=sf-icon])) {
  border-bottom: 1px solid var(--link-color-hover);
}

sf-app.sf-app .sf-link:not(.sf-tabs__item):not(.-no-underline):not(.-side):not(.-side-secondary):not(.sf-nav-dropdown__item-link):not(.sf-icon):not(.sf-expand-button):hover:has([class*=sf-fa]) > span, sf-app.sf-app .sf-link:not(.sf-tabs__item):not(.-no-underline):not(.-side):not(.-side-secondary):not(.sf-nav-dropdown__item-link):not(.sf-icon):not(.sf-expand-button):hover:has([class*=sf-icon]) > span, sf-app.sf-app .sf-link:not(.sf-tabs__item):not(.-no-underline):not(.-side):not(.-side-secondary):not(.sf-nav-dropdown__item-link):not(.sf-icon):not(.sf-expand-button):hover:has(i.fa) > span, sf-app.sf-app .sf-link:not(.sf-tabs__item):not(.-no-underline):not(.-side):not(.-side-secondary):not(.sf-nav-dropdown__item-link):not(.sf-icon):not(.sf-expand-button):hover:has(sf-icon) > span, sf-app.sf-app .sf-link:not(.sf-tabs__item):not(.-no-underline):not(.-side):not(.-side-secondary):not(.sf-nav-dropdown__item-link):not(.sf-icon):not(.sf-expand-button):active:has([class*=sf-fa]) > span, sf-app.sf-app .sf-link:not(.sf-tabs__item):not(.-no-underline):not(.-side):not(.-side-secondary):not(.sf-nav-dropdown__item-link):not(.sf-icon):not(.sf-expand-button):active:has([class*=sf-icon]) > span, sf-app.sf-app .sf-link:not(.sf-tabs__item):not(.-no-underline):not(.-side):not(.-side-secondary):not(.sf-nav-dropdown__item-link):not(.sf-icon):not(.sf-expand-button):active:has(i.fa) > span, sf-app.sf-app .sf-link:not(.sf-tabs__item):not(.-no-underline):not(.-side):not(.-side-secondary):not(.sf-nav-dropdown__item-link):not(.sf-icon):not(.sf-expand-button):active:has(sf-icon) > span, sf-app.sf-app .sf-link:not(.sf-tabs__item):not(.-no-underline):not(.-side):not(.-side-secondary):not(.sf-nav-dropdown__item-link):not(.sf-icon):not(.sf-expand-button):focus:has([class*=sf-fa]) > span, sf-app.sf-app .sf-link:not(.sf-tabs__item):not(.-no-underline):not(.-side):not(.-side-secondary):not(.sf-nav-dropdown__item-link):not(.sf-icon):not(.sf-expand-button):focus:has([class*=sf-icon]) > span, sf-app.sf-app .sf-link:not(.sf-tabs__item):not(.-no-underline):not(.-side):not(.-side-secondary):not(.sf-nav-dropdown__item-link):not(.sf-icon):not(.sf-expand-button):focus:has(i.fa) > span, sf-app.sf-app .sf-link:not(.sf-tabs__item):not(.-no-underline):not(.-side):not(.-side-secondary):not(.sf-nav-dropdown__item-link):not(.sf-icon):not(.sf-expand-button):focus:has(sf-icon) > span {
  border-bottom: 1px solid var(--link-color-hover);
}

sf-app.sf-app .sf-top-toolbar {
  display: flex;
  align-items: center;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 46px;
  box-shadow: 0 3px 5px #eee;
  background-color: #fff;
  z-index: 10000;
}

sf-app.sf-app .sf-top-toolbar.-zindex-sm {
  z-index: 10;
}

sf-app.sf-app .sf-top-toolbar.-in-menu {
  box-shadow: none;
}

sf-app.sf-app .sf-top-toolbar.-in-menu .sf-top-toolbar__nav-button {
  border-right: 0;
}

sf-app.sf-app .sf-top-toolbar__nav-button {
  width: 49px;
  height: 46px;
  border-right: 1px solid #eee;
}

sf-app.sf-app .sf-top-toolbar.-no-border {
  box-shadow: none;
}

sf-app.sf-app .sf-top-toolbar__skip-link {
  left: -10000px;
  top: 60px;
  padding: 5px;
  position: absolute;
  transform: translateY(-100%);
  transition: transform 0.3s;
}

sf-app.sf-app .sf-top-toolbar__skip-link::after {
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\f175";
  margin-left: 5px;
}

sf-app.sf-app .sf-top-toolbar__skip-link:focus {
  transform: translateY(0%);
  left: 69px;
  color: var(--sf-color-secondary-dark, #999) !important;
}

sf-app.sf-app .sf-toggle-menu {
  width: 49px;
  height: 46px;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000;
  transform: rotate(0deg);
  transition: 0.2s ease-in-out;
  cursor: pointer;
}

sf-app.sf-app .sf-toggle-menu:hover, sf-app.sf-app .sf-toggle-menu:focus {
  background: var(--sf-color-secondary-lighter, #e4e4e4);
}

sf-app.sf-app .sf-toggle-menu:hover span, sf-app.sf-app .sf-toggle-menu:focus span {
  background: #333;
}

sf-app.sf-app .sf-toggle-menu span {
  display: block;
  position: absolute;
  height: 3px;
  width: 17px;
  background: var(--sf-color-secondary-dark, #777);
  border-radius: 3px;
  opacity: 1;
  left: 16px;
  transform: rotate(0deg);
  transition: 0.2s ease-in-out;
}

sf-app.sf-app .sf-toggle-menu span:nth-child(1) {
  top: 15px;
  transform-origin: center center;
}

sf-app.sf-app .sf-toggle-menu span:nth-child(2) {
  top: 20px;
  transform-origin: center center;
}

sf-app.sf-app .sf-toggle-menu span:nth-child(3) {
  top: 25px;
  transform-origin: center center;
}

sf-app.sf-app .sf-toggle-menu span:nth-child(4) {
  top: 20px;
  transform-origin: center center;
}

sf-app.sf-app .sf-toggle-menu.-open span:nth-child(1) {
  opacity: 0;
}

sf-app.sf-app .sf-toggle-menu.-open span:nth-child(2) {
  /* width: 0%; */
  transform: rotate(-45deg);
}

sf-app.sf-app .sf-toggle-menu.-open span:nth-child(3) {
  opacity: 0;
}

sf-app.sf-app .sf-toggle-menu.-open span:nth-child(4) {
  transform: rotate(45deg);
}

sf-app.sf-app .sf-split-button {
  display: flex;
  align-items: center;
}

sf-app.sf-app .sf-split-button.-align-top {
  align-items: flex-start;
}

sf-app.sf-app .sf-split-button .sf-button.-dropdown {
  z-index: 100;
}

sf-app.sf-app .sf-split-button .sf-button.-link .sf-button__content {
  border-bottom: none;
}

sf-app.sf-app .sf-sidebar {
  position: fixed;
  top: 46px;
  bottom: 0;
  right: 0;
  width: 350px;
  background-color: #f5f5f5;
  border-top: 1px solid #eee;
  border-left: 1px solid #eee;
  border-bottom: 1px solid #eee;
  z-index: 100;
}

sf-app.sf-app .sf-sidebar.-animate {
  animation: sidebar 0.4s 1 ease-out;
}

sf-app.sf-app .sf-sidebar.-animate.-hidden {
  animation: hideSidebar 0.4s 1 ease-out;
}

sf-app.sf-app .sf-sidebar.-hidden {
  right: -350px;
}

sf-app.sf-app .sf-sidebar.-hidden.-toggle {
  display: block;
  right: -335px;
}

sf-app.sf-app .sf-sidebar.-hidden.-wide {
  right: -400px;
}

sf-app.sf-app .sf-sidebar.-hidden.-wide.-toggle {
  display: block;
  right: -385px;
}

sf-app.sf-app .sf-sidebar.-toggle .sf-sidebar__title,
sf-app.sf-app .sf-sidebar.-toggle .sf-sidebar__section {
  padding-left: 30px;
  padding-right: 30px;
}

sf-app.sf-app .sf-sidebar.-left {
  left: 0;
  right: auto;
}

sf-app.sf-app .sf-sidebar.-wide {
  width: 400px;
}

sf-app.sf-app .sf-sidebar__close {
  position: absolute;
  top: 0;
  right: 0;
  margin-top: 15px;
  margin-right: 10px;
  padding: 10px;
  z-index: 5;
  cursor: pointer;
  color: var(--sf-color-secondary-dark, #333);
}

sf-app.sf-app .sf-sidebar__close:hover {
  color: #333;
}

sf-app.sf-app .sf-sidebar__toggle {
  align-items: center;
  justify-content: center;
  position: absolute;
  display: flex;
  top: 50%;
  width: 7px;
  height: 55px;
  background-color: var(--sf-sidebar-toggle-bg-color, var(--sf-color-secondary-lighter, #e4e4e4));
  cursor: pointer;
  z-index: 1000;
}

sf-app.sf-app .sf-sidebar__toggle-icon {
  width: 7px;
}

sf-app.sf-app .sf-sidebar.-left-aligned {
  left: 0;
  right: auto;
  border-left: 0;
  border-right: 1px solid #eee;
}

sf-app.sf-app .sf-sidebar.-static {
  position: static;
  height: 100%;
}

sf-app.sf-app .sf-sidebar.-width-auto {
  width: auto;
}

sf-app.sf-app .sf-sidebar.-no-animation {
  animation: none;
}

sf-app.sf-app .sf-sidebar__title {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 55px 35px 20px;
  border-bottom: 1px solid #eee;
}

sf-app.sf-app .sf-sidebar__title.-no-border {
  border-bottom: 0;
}

sf-app.sf-app .sf-sidebar__items-list {
  display: block;
  background-color: #fff;
}

sf-app.sf-app .sf-sidebar__header {
  padding: 10px;
  border-bottom: 1px solid #eee;
  background-color: #fff;
}

sf-app.sf-app .sf-sidebar__scroll {
  display: block;
  position: absolute;
  bottom: 0;
  top: 102px;
  overflow: auto;
  width: 100%;
}

sf-app.sf-app .sf-sidebar__inner-scroll {
  height: 100%;
}

sf-app.sf-app .sf-sidebar__section {
  padding: 45px 35px;
}

sf-app.sf-app .sf-sidebar__section .sf-field {
  margin-bottom: 0;
}

sf-app.sf-app .sf-sidebar__section .sf-field__label,
sf-app.sf-app .sf-sidebar__section .sf-field__content,
sf-app.sf-app .sf-sidebar__section .sf-field__no-value {
  font-size: inherit;
}

sf-app.sf-app .sf-sidebar__section .-sf-short-text-default .sf-field {
  padding-bottom: 0;
}

sf-app.sf-app .sf-sidebar__section .sf-input .sf-input__title {
  font-family: "Open Sans Condensed", sans-serif;
  font-size: var(--font-size-h3);
  font-weight: bold;
  line-height: 1.3;
  margin-top: 0;
  margin-bottom: 0;
  min-height: 0;
}

sf-app.sf-app .sf-sidebar__section hr {
  margin-top: 10px;
  margin-bottom: 10px;
}

sf-app.sf-app .sf-sidebar__section .sf-media.-document {
  --document-background: #fff;
  --document-border-color: #fff;
}

sf-app.sf-app .sf-sidebar__slider-wrapper {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

sf-app.sf-app .sf-sidebar__slider {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  background-color: #f5f5f5;
}

sf-app.sf-app .sf-sidebar__no-items {
  display: flex;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
}

@keyframes sidebar {
  from {
    transform: translateX(100%);
  }
  to {
    transform: translateX(0);
  }
}
@keyframes hideSidebar {
  from {
    transform: translateX(-100%);
  }
  to {
    transform: translateX(0);
  }
}
sf-app.sf-app .sf-switch {
  border: 0;
  background: 0;
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  color: var(--sf-color-secondary-dark, #777);
  padding: 0;
}

sf-app.sf-app .sf-switch button {
  padding: 0;
  border: 0;
  background: 0;
}

sf-app.sf-app .sf-switch.-disabled {
  color: var(--sf-color-secondary-lighter, #e4e4e4);
}

sf-app.sf-app .sf-switch.-disabled .sf-icon {
  color: var(--sf-color-secondary-lighter, #e4e4e4);
}

sf-app.sf-app .sf-switch.-right button {
  margin-right: 10px;
  order: -1;
}

sf-app.sf-app .sf-insert-body {
  position: absolute;
  z-index: 1000000;
  top: 0;
  left: 0;
  visibility: hidden;
}

sf-app.sf-app .sf-list__item {
  display: flex;
  align-items: center;
  margin-bottom: -1px;
  padding-left: 10px;
  padding-right: 10px;
  height: 36px;
  border: 1px solid var(--input-border);
  background-color: #fff;
}

sf-app.sf-app .sf-list__item:hover .sf-list__remove, sf-app.sf-app .sf-list__item:focus .sf-list__remove, sf-app.sf-app .sf-list__item:focus-within .sf-list__remove {
  visibility: visible;
}

sf-app.sf-app .sf-list__item.-error {
  position: relative;
}

sf-app.sf-app .sf-list__item.-error:last-child {
  z-index: 5;
}

sf-app.sf-app .sf-list__item.-edit {
  border-left: 0;
  border-right: 0;
  padding-left: 0;
  padding-right: 0;
}

sf-app.sf-app .sf-list__item.-error + .-edit {
  position: relative;
}

sf-app.sf-app .sf-list__item.-error + .-edit::before {
  display: block;
  position: absolute;
  content: "";
  width: 100%;
  height: 1px;
  background-color: var(--sf-color-error, #ff4848);
  top: -1px;
  left: 0;
  z-index: 5;
}

sf-app.sf-app .sf-list__content {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100%;
}

sf-app.sf-app .sf-list__content.-editable {
  cursor: text;
}

sf-app.sf-app .sf-list__remove {
  visibility: hidden;
  margin-left: auto;
  margin-top: -5px;
  padding: 5px;
  cursor: pointer;
}

sf-app.sf-app .sf-tree-list.-medium {
  min-width: var(--form-width-medium);
}

sf-app.sf-app .sf-tree-list.-normal {
  min-width: 850px;
}

sf-app.sf-app .sf-tree-list.-center-header-vertical .sf-tree-list__cell.-head {
  display: flex;
  align-items: center;
}

sf-app.sf-app .sf-tree-list.-center-vertical .sf-tree-list__cell:not(.-head, .-group, .-action, .-media, .-translation, .-top-align, .-grid-thumbnail) {
  padding-top: 16px;
  padding-bottom: 4px;
}

sf-app.sf-app .sf-tree-list.-center-vertical .sf-tree-list__cell.-translation:not(.-head) {
  padding-top: 15px;
  padding-bottom: 5px;
}

sf-app.sf-app .sf-tree-list.-center-vertical .k-checkbox-wrap {
  margin-top: 6px;
}

sf-app.sf-app .sf-tree-list.-center-vertical .k-treeview-toggle {
  margin-top: 6px;
}

sf-app.sf-app .sf-tree-list.-bulk .sf-tree-list__row {
  padding-left: 0;
}

sf-app.sf-app .sf-tree-list.-bulk .sf-tree-list__cell {
  padding-left: 20px;
  padding-right: 20px;
}

sf-app.sf-app .sf-tree-list.-form-responses {
  width: calc(100vw - 120px);
  overflow: auto visible;
  position: static;
  min-height: 99px;
}

sf-app.sf-app .sf-tree-list.-form-responses .sf-tree {
  position: static;
  width: max(var(--row-width) + 130px, 100vw - 120px);
  container-name: sf-form-responses;
  container-type: inline-size;
}

sf-app.sf-app .sf-tree-list.-form-responses .sf-tree .k-treeview-item .k-checkbox-wrap {
  align-self: stretch;
  position: sticky;
  bottom: 0;
  left: 0;
  background-color: #fff;
  margin-top: 0;
  width: 43px;
}

sf-app.sf-app .sf-tree-list.-form-responses .sf-tree .k-treeview-item .k-checkbox-wrap .k-checkbox {
  z-index: 10;
}

sf-app.sf-app .sf-tree-list.-form-responses .sf-tree .k-treeview-item > .k-treeview-bot:has(.k-focus) .k-checkbox-wrap,
sf-app.sf-app .sf-tree-list.-form-responses .sf-tree .k-treeview-item > .k-treeview-bot:has(.k-focus) .sf-tree-list__cell:first-child,
sf-app.sf-app .sf-tree-list.-form-responses .sf-tree .k-treeview-item > .k-treeview-bot:has(.k-focus) .sf-tree-list__cell.-action, sf-app.sf-app .sf-tree-list.-form-responses .sf-tree .k-treeview-item > .k-treeview-mid:has(.k-focus) .k-checkbox-wrap,
sf-app.sf-app .sf-tree-list.-form-responses .sf-tree .k-treeview-item > .k-treeview-mid:has(.k-focus) .sf-tree-list__cell:first-child,
sf-app.sf-app .sf-tree-list.-form-responses .sf-tree .k-treeview-item > .k-treeview-mid:has(.k-focus) .sf-tree-list__cell.-action, sf-app.sf-app .sf-tree-list.-form-responses .sf-tree .k-treeview-item > .k-treeview-top:has(.k-focus) .k-checkbox-wrap,
sf-app.sf-app .sf-tree-list.-form-responses .sf-tree .k-treeview-item > .k-treeview-top:has(.k-focus) .sf-tree-list__cell:first-child,
sf-app.sf-app .sf-tree-list.-form-responses .sf-tree .k-treeview-item > .k-treeview-top:has(.k-focus) .sf-tree-list__cell.-action {
  background-color: #f5f5f5;
  z-index: 5;
}

sf-app.sf-app .sf-tree-list.-form-responses .sf-tree .k-treeview-item > .k-treeview-bot, sf-app.sf-app .sf-tree-list.-form-responses .sf-tree .k-treeview-item > .k-treeview-bot > .k-treeview-leaf, sf-app.sf-app .sf-tree-list.-form-responses .sf-tree .k-treeview-item > .k-treeview-mid, sf-app.sf-app .sf-tree-list.-form-responses .sf-tree .k-treeview-item > .k-treeview-mid > .k-treeview-leaf, sf-app.sf-app .sf-tree-list.-form-responses .sf-tree .k-treeview-item > .k-treeview-top, sf-app.sf-app .sf-tree-list.-form-responses .sf-tree .k-treeview-item > .k-treeview-top > .k-treeview-leaf {
  position: static;
}

sf-app.sf-app .sf-tree-list.-form-responses .sf-tree .k-treeview-item[aria-checked=false] > .k-treeview-bot:hover .sf-tree-list__row > .sf-tree-list__cell:first-child, sf-app.sf-app .sf-tree-list.-form-responses .sf-tree .k-treeview-item[aria-checked=false] > .k-treeview-bot:hover .sf-tree-list__row > .-action, sf-app.sf-app .sf-tree-list.-form-responses .sf-tree .k-treeview-item[aria-checked=false] > .k-treeview-bot:hover > .k-checkbox-wrap, sf-app.sf-app .sf-tree-list.-form-responses .sf-tree .k-treeview-item[aria-checked=false] > .k-treeview-mid:hover .sf-tree-list__row > .sf-tree-list__cell:first-child, sf-app.sf-app .sf-tree-list.-form-responses .sf-tree .k-treeview-item[aria-checked=false] > .k-treeview-mid:hover .sf-tree-list__row > .-action, sf-app.sf-app .sf-tree-list.-form-responses .sf-tree .k-treeview-item[aria-checked=false] > .k-treeview-mid:hover > .k-checkbox-wrap, sf-app.sf-app .sf-tree-list.-form-responses .sf-tree .k-treeview-item[aria-checked=false] > .k-treeview-top:hover .sf-tree-list__row > .sf-tree-list__cell:first-child, sf-app.sf-app .sf-tree-list.-form-responses .sf-tree .k-treeview-item[aria-checked=false] > .k-treeview-top:hover .sf-tree-list__row > .-action, sf-app.sf-app .sf-tree-list.-form-responses .sf-tree .k-treeview-item[aria-checked=false] > .k-treeview-top:hover > .k-checkbox-wrap {
  background-color: #f5f5f5;
}

sf-app.sf-app .sf-tree-list.-form-responses .sf-tree .k-treeview-item[aria-checked=true] .sf-tree-list__row > .sf-tree-list__cell:first-child,
sf-app.sf-app .sf-tree-list.-form-responses .sf-tree .k-treeview-item[aria-checked=true] .k-checkbox-wrap,
sf-app.sf-app .sf-tree-list.-form-responses .sf-tree .k-treeview-item[aria-checked=true] .k-treeview-leaf .-action:not(.sf-dropdown__item) {
  background-color: var(--sf-color-info-bg, #dcecf5) !important;
}

sf-app.sf-app .sf-tree-list.-form-responses .sf-tree .k-treeview-item.k-treeview-load-more-checkboxes-container {
  padding-bottom: 30px;
}

sf-app.sf-app .sf-tree-list.-form-responses .sf-tree .k-treeview-item.k-treeview-load-more-checkboxes-container .sf-row {
  justify-content: space-between;
  display: inline-flex;
}

sf-app.sf-app .sf-tree-list.-form-responses .sf-tree .k-treeview-item.k-treeview-load-more-checkboxes-container .sf-row > div:first-child {
  position: sticky;
  left: 0;
}

sf-app.sf-app .sf-tree-list.-form-responses .sf-tree .k-treeview-item.k-treeview-load-more-checkboxes-container .sf-row .-sf-txt-hint {
  flex: none;
  position: sticky;
  right: 0;
}

sf-app.sf-app .sf-tree-list.-form-responses .sf-tree .k-treeview-item:last-of-type {
  padding-bottom: 107px;
}

sf-app.sf-app .sf-tree-list.-form-responses .sf-tree-list__row > .sf-tree-list__cell:first-child,
sf-app.sf-app .sf-tree-list.-form-responses .sf-tree-list__cell.-action {
  position: sticky;
  background-color: #fff;
}

sf-app.sf-app .sf-tree-list.-form-responses .sf-tree-list__row:not(.-head) {
  cursor: pointer;
}

sf-app.sf-app .sf-tree-list.-form-responses .sf-tree-list__row.-head {
  padding-left: 0;
  width: max(var(--row-width) + 130px, 100vw - 120px);
  container-name: sf-form-responses;
  container-type: inline-size;
}

sf-app.sf-app .sf-tree-list.-form-responses .sf-tree-list__cell.-action {
  width: 60px;
  margin-left: auto;
}

@container sf-form-responses (width > 100vw) {
  sf-app.sf-app .sf-tree-list.-form-responses .sf-tree-list__cell.-action {
    position: sticky;
    right: 0;
  }
  sf-app.sf-app .sf-tree-list.-form-responses .sf-tree-list__cell.-action:has(.sf-button.-dropped) {
    z-index: 1000;
  }
}
sf-app.sf-app .sf-tree-list.-form-responses .sf-tree-list__cell:first-child.-head {
  position: sticky;
  width: 113px;
  padding-left: 43px;
  background-color: #fff;
  top: 0;
  left: 0;
}

sf-app.sf-app .sf-tree-list.-form-responses .sf-tree-list__cell:first-child:not(.-head) {
  padding-left: 0;
  width: 70px;
  left: 43px;
  position: sticky;
}

sf-app.sf-app .sf-tree-list.-form-responses .sf-tree-list__cell:nth-child(2).-head {
  margin-left: 43px;
}

sf-app.sf-app .sf-tree-list.-form-responses .sf-tree-list__cell:nth-child(2):not(.-head) {
  margin-left: 43px;
}

sf-app.sf-app .sf-tree-list.-form-responses .sf-tree-list__cell:nth-last-child(2):not(.-head) {
  padding-right: 60px;
}

sf-app.sf-app .sf-tree-list__row {
  display: flex;
  width: 100%;
}

sf-app.sf-app .sf-tree-list__row.-border {
  border-bottom: 1px solid var(--tree-common-border-color, #eee);
}

sf-app.sf-app .sf-tree-list__row.-head {
  font-size: var(--font-size-h5);
  font-weight: 400;
  text-transform: uppercase;
  text-align: left;
  color: var(--tree-common-head-color, var(--sf-color-secondary, #ccc));
  padding-left: 33px;
}

sf-app.sf-app .sf-tree-list__row.-head + .sf-tree-list__row.-loading {
  border-top: 1px solid var(--tree-common-border-color, #eee);
}

sf-app.sf-app .sf-tree-list__row.-head .-title {
  min-width: 200px;
}

sf-app.sf-app .sf-tree-list__row.-head .-title.-short {
  min-width: 157px;
}

sf-app.sf-app .sf-tree-list__row.-head .-actions {
  width: 77px;
}

sf-app.sf-app .sf-tree-list__row.-head .-two-lines {
  display: flex;
  align-items: flex-end;
  white-space: normal;
}

sf-app.sf-app .sf-tree-list__row.-active {
  background-color: var(--sf-color-info-bg, #dcecf5);
}

sf-app.sf-app .sf-tree-list__row.-loading {
  border-bottom: 1px solid var(--tree-common-border-color, #eee);
}

sf-app.sf-app .sf-tree-list__row.-loading .sf-tree-list__cell {
  padding: 0;
  width: 100%;
}

sf-app.sf-app .sf-tree-list__row.-loading .sf-tree-list__cell:hover {
  cursor: default;
  background-color: transparent;
}

sf-app.sf-app .sf-tree-list__row.-no-pointer .sf-tree-list__cell {
  cursor: inherit;
}

sf-app.sf-app .sf-tree-list__row.-no-pointer .sf-tree-list__cell.-title {
  cursor: inherit;
}

sf-app.sf-app .sf-tree-list__row.-disabled::before {
  display: block;
  content: "";
  height: 100%;
  position: absolute;
  z-index: 300;
  left: 0;
  right: 0;
}

sf-app.sf-app .sf-tree-list__row.-disable-checkbox::before {
  display: block;
  content: "";
  height: 100%;
  width: 33px;
  position: absolute;
  z-index: 300;
  left: 0;
  right: 0;
}

sf-app.sf-app .sf-tree-list__cell {
  padding: 10px 10px;
  word-break: break-all;
}

sf-app.sf-app .sf-tree-list__cell:not(.-title) {
  flex: none;
  width: 150px;
}

sf-app.sf-app .sf-tree-list__cell.-head {
  vertical-align: top;
  padding: 5px 10px;
  white-space: nowrap;
  text-align: left;
  font-weight: normal;
}

sf-app.sf-app .sf-tree-list__cell.-head.-status {
  padding-left: 52px;
}

sf-app.sf-app .sf-tree-list__cell.-head.-status.-toggle {
  padding-left: 78px;
}

sf-app.sf-app .sf-tree-list__cell.-head.-status.-thumbnail {
  padding-left: 106px;
}

sf-app.sf-app .sf-tree-list__cell.-head.-toggle {
  padding-left: 36px;
}

sf-app.sf-app .sf-tree-list__cell.-head:not(.-action, .-with-tooltip, .-two-lines) {
  overflow: hidden;
  text-overflow: ellipsis;
}

sf-app.sf-app .sf-tree-list__cell.-title:not(.-head) {
  width: 100%;
}

sf-app.sf-app .sf-tree-list__cell.-title:not(.-head):not(.-no-pointer) {
  cursor: pointer;
}

sf-app.sf-app .sf-tree-list__cell.-title {
  margin-right: auto;
  min-width: 200px;
}

sf-app.sf-app .sf-tree-list__cell.-title.-short {
  min-width: 77px;
}

sf-app.sf-app .sf-tree-list__cell.-title.-short:has(+ .-thumbnail > sf-component-loader:empty) {
  min-width: 157px;
}

sf-app.sf-app .sf-tree-list__cell.-list-thumbnail {
  width: auto;
}

sf-app.sf-app .sf-tree-list__cell.-list-thumbnail > sf-component-loader:not(:empty) {
  display: block;
  width: 80px;
}

sf-app.sf-app .sf-tree-list__cell.-list-thumbnail .sf-media {
  width: auto;
  max-width: 60px;
  height: 42px;
}

sf-app.sf-app .sf-tree-list__cell.-action {
  padding-right: 5px;
  text-align: right;
}

sf-app.sf-app .sf-tree-list__cell.-group {
  position: absolute;
  top: 15px;
  left: -62px;
  display: flex;
  padding: 0;
  width: auto;
}

sf-app.sf-app .sf-tree-list__cell.-group.h3 {
  cursor: text;
}

sf-app.sf-app .sf-tree-list__cell.-fluid {
  width: auto;
}

sf-app.sf-app .sf-tree-list__cell.-fill {
  flex: 1;
}

sf-app.sf-app .sf-tree-list__cell.-sf-simple-media:not(.-document, .-video) {
  padding-right: 10px;
  width: 90px;
}

sf-app.sf-app .sf-tree-list__cell.-sf-simple-media:not(.-document, .-video) sf-image {
  display: block;
  width: 60px;
  height: 60px;
}

sf-app.sf-app .sf-tree-list__cell.-sf-simple-media:not(.-document, .-video) sf-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  overflow: hidden;
}

sf-app.sf-app .sf-tree-list__cell.-sf-simple-media.-document sf-document {
  display: flex;
}

sf-app.sf-app .sf-tree-list__cell.-sf-simple-media.-document sf-document .sf-media__title {
  margin-left: 10px;
  font-size: var(--font-size-base);
}

sf-app.sf-app .sf-tree-list__cell.-sf-simple-media.-video sf-image {
  display: block;
}

sf-app.sf-app .sf-tree-list__cell.-sf-simple-media.-video sf-image img {
  width: 100%;
}

sf-app.sf-app .sf-tree-list__cell.-sf-short-text, sf-app.sf-app .sf-tree-list__cell.-sf-number, sf-app.sf-app .sf-tree-list__cell.-sf-yes-no-choice, sf-app.sf-app .sf-tree-list__cell.-sf-simple-media.-document {
  width: 200px;
}

sf-app.sf-app .sf-tree-list__cell.-sf-text-area, sf-app.sf-app .sf-tree-list__cell.-sf-related-data, sf-app.sf-app .sf-tree-list__cell.-sf-taxa {
  width: 300px;
}

sf-app.sf-app .sf-tree-list__cell.-sf-date-time {
  width: 420px;
}

sf-app.sf-app .sf-tree-list__cell.-sf-media {
  width: 190px;
}

sf-app.sf-app .sf-tree-list__cell.-sf-media.-wide {
  width: 280px;
}

sf-app.sf-app .sf-tree-list__cell.-col-size-4xs {
  width: 30px;
}

sf-app.sf-app .sf-tree-list__cell.-col-size-3xs {
  width: 50px;
}

sf-app.sf-app .sf-tree-list__cell.-col-size-2xs {
  width: 100px;
}

sf-app.sf-app .sf-tree-list__cell.-col-size-xs, sf-app.sf-app .sf-tree-list__cell.-sf-simple-media.-video {
  width: 120px;
}

sf-app.sf-app .sf-tree-list__cell.-col-size-s {
  width: 150px;
}

sf-app.sf-app .sf-tree-list__cell.-col-size-sm {
  width: 180px;
}

sf-app.sf-app .sf-tree-list__cell.-col-size-m {
  width: 200px;
}

sf-app.sf-app .sf-tree-list__cell.-col-size-l {
  width: 250px;
}

sf-app.sf-app .sf-tree-list__cell.-col-size-xl {
  width: 300px;
}

sf-app.sf-app .sf-tree-list__cell.-col-size-2xl {
  width: 350px;
}

sf-app.sf-app .sf-tree-list__cell.-col-size-3xl {
  width: 400px;
}

sf-app.sf-app .sf-tree-list__cell.-col-stretched {
  flex-grow: 1;
}

sf-app.sf-app .sf-tree-list__cell.-actions {
  width: 77px;
}

sf-app.sf-app .sf-tree-list__cell.-grid-thumbnail {
  width: 80px;
}

sf-app.sf-app .sf-tree-list__controlls:not(:empty) {
  min-height: 45px;
}

sf-app.sf-app .sf-tree-list__controlls:not(:empty) + .sf-tree-list__controlls:not(.-out-of-view) {
  min-height: auto;
}

sf-app.sf-app .sf-tree-list__back {
  margin-top: -19px;
  position: relative;
}

sf-app.sf-app .sf-tree-list__status {
  min-width: 42px;
}

sf-app.sf-app .sf-form-responses-wrapper {
  position: relative;
  width: calc(100vw - 120px);
  padding-bottom: 120px;
  margin-bottom: -120px;
  transition: width 0.4s ease-out;
}

sf-app.sf-app .sf-form-responses-wrapper + .sf-main__paging {
  position: relative;
  z-index: 1;
}

sf-app.sf-app .sf-form-responses-wrapper ~ .-sf-txt-hint {
  margin-top: -75px !important;
}

sf-app.sf-app .-sf-virtualized__tree {
  transition: width 0.4s ease-out;
  width: max(1010px, 100vw - 2 * 50px - 10px);
  border-top: 1px solid var(--tree-common-border-color, #eee);
}

sf-app.sf-app .-shrink .-sf-virtualized__tree {
  width: max(1010px, 100vw - 2 * 50px - 350px - 10px);
}

sf-app.sf-app .-sf-virtualized__tree tree {
  display: inline;
}

sf-app.sf-app .-sf-virtualized__tree .sf-status__text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: break-word;
}

sf-app.sf-app tree {
  display: block;
}

sf-app.sf-app .sf-tree {
  position: relative;
  width: 100%;
  overflow: unset;
  font-size: inherit;
  text-align: left;
}

sf-app.sf-app .sf-tree .k-treeview-item[aria-checked=false] > .k-treeview-bot:has(.k-focus),
sf-app.sf-app .sf-tree .k-treeview-item[aria-checked=false] > .k-treeview-mid:has(.k-focus),
sf-app.sf-app .sf-tree .k-treeview-item[aria-checked=false] > .k-treeview-top:has(.k-focus),
sf-app.sf-app .sf-tree .k-treeview-item [aria-selected=false] > .k-treeview-bot:has(.k-focus),
sf-app.sf-app .sf-tree .k-treeview-item [aria-selected=false] > .k-treeview-mid:has(.k-focus),
sf-app.sf-app .sf-tree .k-treeview-item [aria-selected=false] > .k-treeview-top:has(.k-focus) {
  background-color: #f5f5f5;
}

sf-app.sf-app .sf-tree .k-treeview-item[aria-checked=true] > .k-treeview-bot, sf-app.sf-app .sf-tree .k-treeview-item[aria-checked=true] > .k-treeview-bot:hover, sf-app.sf-app .sf-tree .k-treeview-item[aria-checked=true] > .k-treeview-bot:focus, sf-app.sf-app .sf-tree .k-treeview-item[aria-checked=true] > .k-treeview-bot:has(.k-focus),
sf-app.sf-app .sf-tree .k-treeview-item[aria-checked=true] > .k-treeview-mid,
sf-app.sf-app .sf-tree .k-treeview-item[aria-checked=true] > .k-treeview-mid:hover,
sf-app.sf-app .sf-tree .k-treeview-item[aria-checked=true] > .k-treeview-mid:focus,
sf-app.sf-app .sf-tree .k-treeview-item[aria-checked=true] > .k-treeview-mid:has(.k-focus),
sf-app.sf-app .sf-tree .k-treeview-item[aria-checked=true] > .k-treeview-top,
sf-app.sf-app .sf-tree .k-treeview-item[aria-checked=true] > .k-treeview-top:hover,
sf-app.sf-app .sf-tree .k-treeview-item[aria-checked=true] > .k-treeview-top:focus,
sf-app.sf-app .sf-tree .k-treeview-item[aria-checked=true] > .k-treeview-top:has(.k-focus) {
  background-color: var(--sf-color-info-bg, #dcecf5);
  color: initial;
}

sf-app.sf-app .sf-tree .k-treeview-item[aria-checked=true] > .k-treeview-bot .k-treeview-leaf, sf-app.sf-app .sf-tree .k-treeview-item[aria-checked=true] > .k-treeview-bot .k-treeview-leaf:hover, sf-app.sf-app .sf-tree .k-treeview-item[aria-checked=true] > .k-treeview-bot .k-treeview-leaf:focus,
sf-app.sf-app .sf-tree .k-treeview-item[aria-checked=true] > .k-treeview-mid .k-treeview-leaf,
sf-app.sf-app .sf-tree .k-treeview-item[aria-checked=true] > .k-treeview-mid .k-treeview-leaf:hover,
sf-app.sf-app .sf-tree .k-treeview-item[aria-checked=true] > .k-treeview-mid .k-treeview-leaf:focus,
sf-app.sf-app .sf-tree .k-treeview-item[aria-checked=true] > .k-treeview-top .k-treeview-leaf,
sf-app.sf-app .sf-tree .k-treeview-item[aria-checked=true] > .k-treeview-top .k-treeview-leaf:hover,
sf-app.sf-app .sf-tree .k-treeview-item[aria-checked=true] > .k-treeview-top .k-treeview-leaf:focus {
  background-color: var(--sf-color-info-bg, #dcecf5);
  color: initial;
}

sf-app.sf-app .sf-tree .k-treeview-item .k-treeview-bot:hover, sf-app.sf-app .sf-tree .k-treeview-item .k-treeview-bot:focus,
sf-app.sf-app .sf-tree .k-treeview-item .k-treeview-mid:hover,
sf-app.sf-app .sf-tree .k-treeview-item .k-treeview-mid:focus,
sf-app.sf-app .sf-tree .k-treeview-item .k-treeview-top:hover,
sf-app.sf-app .sf-tree .k-treeview-item .k-treeview-top:focus {
  background-color: #f5f5f5;
}

sf-app.sf-app .sf-tree .k-treeview-item .k-treeview-leaf.k-focus, sf-app.sf-app .sf-tree .k-treeview-item .k-treeview-leaf:focus {
  box-shadow: none;
}

sf-app.sf-app .sf-tree .k-treeview-item .k-treeview-leaf.k-selected, sf-app.sf-app .sf-tree .k-treeview-item .k-treeview-leaf.k-selected:hover, sf-app.sf-app .sf-tree .k-treeview-item .k-treeview-leaf.k-selected:focus {
  background-color: var(--sf-color-info-bg, #dcecf5);
  color: initial;
}

sf-app.sf-app .sf-tree .k-treeview-item .k-treeview-leaf.k-selected .sf-status__text {
  color: var(--sf-secondary-text-color-on-blue-bg);
}

sf-app.sf-app .sf-tree .k-treeview-item .k-treeview-leaf.k-selected:has(.-inactive), sf-app.sf-app .sf-tree .k-treeview-item .k-treeview-leaf.k-selected:has(.-inactive):hover, sf-app.sf-app .sf-tree .k-treeview-item .k-treeview-leaf.k-selected:has(.-inactive):focus {
  background-color: transparent;
}

sf-app.sf-app .sf-tree .k-treeview-item .k-treeview-leaf,
sf-app.sf-app .sf-tree .k-treeview-item .k-treeview-leaf-text {
  width: 100%;
  padding: 0;
  background-color: inherit;
}

sf-app.sf-app .sf-tree .k-treeview-item.k-treeview-load-more-checkboxes-container .k-treeview-bot,
sf-app.sf-app .sf-tree .k-treeview-item.k-treeview-load-more-checkboxes-container .k-treeview-mid,
sf-app.sf-app .sf-tree .k-treeview-item.k-treeview-load-more-checkboxes-container .k-treeview-top,
sf-app.sf-app .sf-tree .k-treeview-item.k-treeview-load-more-checkboxes-container .k-treeview-leaf {
  border-bottom: unset;
}

sf-app.sf-app .sf-tree .k-treeview-item.k-treeview-load-more-checkboxes-container .k-treeview-bot:hover, sf-app.sf-app .sf-tree .k-treeview-item.k-treeview-load-more-checkboxes-container .k-treeview-bot:focus,
sf-app.sf-app .sf-tree .k-treeview-item.k-treeview-load-more-checkboxes-container .k-treeview-mid:hover,
sf-app.sf-app .sf-tree .k-treeview-item.k-treeview-load-more-checkboxes-container .k-treeview-mid:focus,
sf-app.sf-app .sf-tree .k-treeview-item.k-treeview-load-more-checkboxes-container .k-treeview-top:hover,
sf-app.sf-app .sf-tree .k-treeview-item.k-treeview-load-more-checkboxes-container .k-treeview-top:focus,
sf-app.sf-app .sf-tree .k-treeview-item.k-treeview-load-more-checkboxes-container .k-treeview-leaf:hover,
sf-app.sf-app .sf-tree .k-treeview-item.k-treeview-load-more-checkboxes-container .k-treeview-leaf:focus {
  background-color: unset;
}

sf-app.sf-app .sf-tree .k-treeview-item.k-treeview-load-more-checkboxes-container .k-treeview-leaf {
  pointer-events: none;
  cursor: default;
}

sf-app.sf-app .sf-tree .k-treeview-item.k-treeview-load-more-checkboxes-container .-sf-enable-click {
  pointer-events: auto;
  cursor: pointer;
}

sf-app.sf-app .sf-tree .k-treeview-item.k-treeview-load-more-checkboxes-container .-sf-enable-click:not(sf-search) .sf-button {
  margin-right: 0;
}

sf-app.sf-app .sf-tree:not(.k-treeview-item) .k-treeview-group .k-treeview-item .k-treeview-leaf.k-hover, sf-app.sf-app .sf-tree:not(.k-treeview-item) .k-treeview-group .k-treeview-item .k-treeview-leaf.k-state-hover, sf-app.sf-app .sf-tree:not(.k-treeview-item) .k-treeview-group .k-treeview-item .k-treeview-leaf.k-state-hovered, sf-app.sf-app .sf-tree:not(.k-treeview-item) .k-treeview-group .k-treeview-item .k-treeview-leaf:hover {
  color: inherit;
}

sf-app.sf-app .sf-tree:not(.-sidebar) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item:not(.k-treeview-load-more-checkboxes-container) > div {
  padding-left: 18px;
}

sf-app.sf-app .sf-tree:not(.-sidebar) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item:not(.k-treeview-load-more-checkboxes-container) > div {
  padding-left: 36px;
}

sf-app.sf-app .sf-tree:not(.-sidebar) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item:not(.k-treeview-load-more-checkboxes-container) > div {
  padding-left: 54px;
}

sf-app.sf-app .sf-tree:not(.-sidebar) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item:not(.k-treeview-load-more-checkboxes-container) > div {
  padding-left: 72px;
}

sf-app.sf-app .sf-tree:not(.-sidebar) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item:not(.k-treeview-load-more-checkboxes-container) > div {
  padding-left: 90px;
}

sf-app.sf-app .sf-tree:not(.-sidebar) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item:not(.k-treeview-load-more-checkboxes-container) > div {
  padding-left: 108px;
}

sf-app.sf-app .sf-tree:not(.-sidebar) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item:not(.k-treeview-load-more-checkboxes-container) > div {
  padding-left: 126px;
}

sf-app.sf-app .sf-tree:not(.-sidebar) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item:not(.k-treeview-load-more-checkboxes-container) > div {
  padding-left: 144px;
}

sf-app.sf-app .sf-tree:not(.-sidebar) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item:not(.k-treeview-load-more-checkboxes-container) > div {
  padding-left: 162px;
}

sf-app.sf-app .sf-tree:not(.-sidebar) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item:not(.k-treeview-load-more-checkboxes-container) > div {
  padding-left: 180px;
}

sf-app.sf-app .sf-tree:not(.-sidebar) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item:not(.k-treeview-load-more-checkboxes-container) > div {
  padding-left: 198px;
}

sf-app.sf-app .sf-tree:not(.-sidebar) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item:not(.k-treeview-load-more-checkboxes-container) > div {
  padding-left: 216px;
}

sf-app.sf-app .sf-tree:not(.-sidebar) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item:not(.k-treeview-load-more-checkboxes-container) > div {
  padding-left: 234px;
}

sf-app.sf-app .sf-tree:not(.-sidebar) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item:not(.k-treeview-load-more-checkboxes-container) > div {
  padding-left: 252px;
}

sf-app.sf-app .sf-tree:not(.-sidebar) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item:not(.k-treeview-load-more-checkboxes-container) > div {
  padding-left: 270px;
}

sf-app.sf-app .sf-tree:not(.-sidebar) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item:not(.k-treeview-load-more-checkboxes-container) > div {
  padding-left: 288px;
}

sf-app.sf-app .sf-tree:not(.-sidebar) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item:not(.k-treeview-load-more-checkboxes-container) > div {
  padding-left: 306px;
}

sf-app.sf-app .sf-tree:not(.-sidebar) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item:not(.k-treeview-load-more-checkboxes-container) > div {
  padding-left: 324px;
}

sf-app.sf-app .sf-tree:not(.-sidebar) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item:not(.k-treeview-load-more-checkboxes-container) > div {
  padding-left: 342px;
}

sf-app.sf-app .sf-tree:not(.-sidebar) .k-treeview-group:not(.k-treeview-lines) .k-checkbox-wrap {
  left: -18px !important;
}

sf-app.sf-app .sf-tree:not(.-sidebar) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-checkbox-wrap {
  left: -36px !important;
}

sf-app.sf-app .sf-tree:not(.-sidebar) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-checkbox-wrap {
  left: -54px !important;
}

sf-app.sf-app .sf-tree:not(.-sidebar) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-checkbox-wrap {
  left: -72px !important;
}

sf-app.sf-app .sf-tree:not(.-sidebar) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-checkbox-wrap {
  left: -90px !important;
}

sf-app.sf-app .sf-tree:not(.-sidebar) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-checkbox-wrap {
  left: -108px !important;
}

sf-app.sf-app .sf-tree:not(.-sidebar) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-checkbox-wrap {
  left: -126px !important;
}

sf-app.sf-app .sf-tree:not(.-sidebar) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-checkbox-wrap {
  left: -144px !important;
}

sf-app.sf-app .sf-tree:not(.-sidebar) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-checkbox-wrap {
  left: -162px !important;
}

sf-app.sf-app .sf-tree:not(.-sidebar) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-checkbox-wrap {
  left: -180px !important;
}

sf-app.sf-app .sf-tree:not(.-sidebar) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-checkbox-wrap {
  left: -198px !important;
}

sf-app.sf-app .sf-tree:not(.-sidebar) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-checkbox-wrap {
  left: -216px !important;
}

sf-app.sf-app .sf-tree:not(.-sidebar) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-checkbox-wrap {
  left: -234px !important;
}

sf-app.sf-app .sf-tree:not(.-sidebar) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-checkbox-wrap {
  left: -252px !important;
}

sf-app.sf-app .sf-tree:not(.-sidebar) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-checkbox-wrap {
  left: -270px !important;
}

sf-app.sf-app .sf-tree:not(.-sidebar) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-checkbox-wrap {
  left: -288px !important;
}

sf-app.sf-app .sf-tree:not(.-sidebar) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-checkbox-wrap {
  left: -306px !important;
}

sf-app.sf-app .sf-tree:not(.-sidebar) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-checkbox-wrap {
  left: -324px !important;
}

sf-app.sf-app .sf-tree:not(.-sidebar) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-checkbox-wrap {
  left: -342px !important;
}

sf-app.sf-app .sf-tree__loading-skeleton {
  width: 100%;
  position: absolute;
  left: 0;
  bottom: 0;
  background-color: #fff;
  border-top: 1px solid var(--tree-common-border-color, #eee);
}

sf-app.sf-app .sf-tree .k-i-loading::before, sf-app.sf-app .sf-tree .k-i-loading::after {
  content: none;
}

sf-app.sf-app .sf-tree .k-drop-hint-container {
  z-index: 10;
}

sf-app.sf-app .sf-tree .k-drop-hint-container .drop-hint {
  height: 5px;
  background-color: #333;
}

sf-app.sf-app .sf-tree .k-drag-clue {
  opacity: 0.7;
  z-index: 1;
}

sf-app.sf-app .sf-tree .k-drag-clue .tree-sidebar-clue-template.k-treeview-bot, sf-app.sf-app .sf-tree .k-drag-clue .tree-sidebar-clue-template.k-treeview-mid, sf-app.sf-app .sf-tree .k-drag-clue .tree-sidebar-clue-template.k-treeview-top {
  background-color: var(--sf-tree-sidebar-hover-bg-color);
}

sf-app.sf-app .sf-tree .k-drag-clue .tree-sidebar-clue-template.k-treeview-bot .-sf-font-icon, sf-app.sf-app .sf-tree .k-drag-clue .tree-sidebar-clue-template.k-treeview-mid .-sf-font-icon, sf-app.sf-app .sf-tree .k-drag-clue .tree-sidebar-clue-template.k-treeview-top .-sf-font-icon {
  height: 1em;
}

sf-app.sf-app .sf-tree .k-treeview-bot,
sf-app.sf-app .sf-tree .k-treeview-mid,
sf-app.sf-app .sf-tree .k-treeview-top {
  line-height: initial;
  position: relative;
}

sf-app.sf-app .sf-tree .k-treeview-bot:has(.sf-tree__loading-skeleton),
sf-app.sf-app .sf-tree .k-treeview-mid:has(.sf-tree__loading-skeleton),
sf-app.sf-app .sf-tree .k-treeview-top:has(.sf-tree__loading-skeleton) {
  padding-bottom: 160px;
}

sf-app.sf-app .sf-tree .k-treeview-bot:hover:has(.-no-row-hover),
sf-app.sf-app .sf-tree .k-treeview-mid:hover:has(.-no-row-hover),
sf-app.sf-app .sf-tree .k-treeview-top:hover:has(.-no-row-hover) {
  background-color: #fff;
}

sf-app.sf-app .sf-tree.-expandable .k-treeview-toggle {
  align-self: flex-start;
  margin-left: -32px;
  order: 1;
  padding-top: 10px;
  position: relative;
  left: 10px;
}

sf-app.sf-app .sf-tree.-expandable .k-treeview-toggle .k-icon-wrapper-host .k-icon.k-font-icon.k-i-caret-alt-right, sf-app.sf-app .sf-tree.-expandable .k-treeview-toggle .k-icon-wrapper-host .k-icon.k-font-icon.k-i-caret-alt-down {
  color: var(--sf-expander-arrow-color);
}

sf-app.sf-app .sf-tree.-expandable .k-treeview-leaf {
  order: 2;
  position: unset;
}

sf-app.sf-app .sf-tree.-expandable:not(.-main-list-view):not(.-sidebar) .k-treeview-toggle {
  padding-top: 7px;
}

sf-app.sf-app .sf-tree.-expandable.-drag:not(.-sidebar) .k-treeview-mid,
sf-app.sf-app .sf-tree.-expandable.-drag:not(.-sidebar) .k-treeview-top {
  align-items: baseline;
}

sf-app.sf-app .sf-tree.-expandable.-drag:not(.-sidebar) .k-treeview-toggle {
  position: relative;
  left: 42px;
}

sf-app.sf-app .sf-tree.-expandable.-drag:not(.-sidebar) .k-treeview-leaf {
  padding-left: 42px;
  position: unset;
}

sf-app.sf-app .sf-tree.-expandable.-drag:not(.-sidebar) .sf-tree__inner {
  padding-left: 0;
}

sf-app.sf-app .sf-tree.-expandable.-checkbox .k-checkbox-wrap {
  margin-right: 17px;
  order: 0;
}

sf-app.sf-app .sf-tree.-expandable:not(.-drag):not(.-checkbox) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item:not(.k-treeview-load-more-checkboxes-container) > div {
  padding-left: 39px !important;
}

sf-app.sf-app .sf-tree.-expandable:not(.-drag):not(.-checkbox) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item:not(.k-treeview-load-more-checkboxes-container) > div {
  padding-left: 57px !important;
}

sf-app.sf-app .sf-tree.-expandable:not(.-drag):not(.-checkbox) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item:not(.k-treeview-load-more-checkboxes-container) > div {
  padding-left: 75px !important;
}

sf-app.sf-app .sf-tree.-expandable:not(.-drag):not(.-checkbox) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item:not(.k-treeview-load-more-checkboxes-container) > div {
  padding-left: 93px !important;
}

sf-app.sf-app .sf-tree.-expandable:not(.-drag):not(.-checkbox) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item:not(.k-treeview-load-more-checkboxes-container) > div {
  padding-left: 111px !important;
}

sf-app.sf-app .sf-tree.-expandable:not(.-drag):not(.-checkbox) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item:not(.k-treeview-load-more-checkboxes-container) > div {
  padding-left: 129px !important;
}

sf-app.sf-app .sf-tree.-expandable:not(.-drag):not(.-checkbox) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item:not(.k-treeview-load-more-checkboxes-container) > div {
  padding-left: 147px !important;
}

sf-app.sf-app .sf-tree.-expandable:not(.-drag):not(.-checkbox) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item:not(.k-treeview-load-more-checkboxes-container) > div {
  padding-left: 165px !important;
}

sf-app.sf-app .sf-tree.-expandable:not(.-drag):not(.-checkbox) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item:not(.k-treeview-load-more-checkboxes-container) > div {
  padding-left: 183px !important;
}

sf-app.sf-app .sf-tree.-expandable:not(.-drag):not(.-checkbox) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item:not(.k-treeview-load-more-checkboxes-container) > div {
  padding-left: 201px !important;
}

sf-app.sf-app .sf-tree.-expandable:not(.-drag):not(.-checkbox) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item:not(.k-treeview-load-more-checkboxes-container) > div {
  padding-left: 219px !important;
}

sf-app.sf-app .sf-tree.-expandable:not(.-drag):not(.-checkbox) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item:not(.k-treeview-load-more-checkboxes-container) > div {
  padding-left: 237px !important;
}

sf-app.sf-app .sf-tree.-expandable:not(.-drag):not(.-checkbox) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item:not(.k-treeview-load-more-checkboxes-container) > div {
  padding-left: 255px !important;
}

sf-app.sf-app .sf-tree.-expandable:not(.-drag):not(.-checkbox) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item:not(.k-treeview-load-more-checkboxes-container) > div {
  padding-left: 273px !important;
}

sf-app.sf-app .sf-tree.-expandable:not(.-drag):not(.-checkbox) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item:not(.k-treeview-load-more-checkboxes-container) > div {
  padding-left: 291px !important;
}

sf-app.sf-app .sf-tree.-expandable:not(.-drag):not(.-checkbox) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item:not(.k-treeview-load-more-checkboxes-container) > div {
  padding-left: 309px !important;
}

sf-app.sf-app .sf-tree.-expandable:not(.-drag):not(.-checkbox) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item:not(.k-treeview-load-more-checkboxes-container) > div {
  padding-left: 327px !important;
}

sf-app.sf-app .sf-tree.-expandable:not(.-drag):not(.-checkbox) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item:not(.k-treeview-load-more-checkboxes-container) > div {
  padding-left: 345px !important;
}

sf-app.sf-app .sf-tree.-expandable:not(.-drag):not(.-checkbox) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item:not(.k-treeview-load-more-checkboxes-container) > div {
  padding-left: 363px !important;
}

sf-app.sf-app .sf-tree.-expandable:not(.-drag):not(.-checkbox) .k-treeview-bot,
sf-app.sf-app .sf-tree.-expandable:not(.-drag):not(.-checkbox) .k-treeview-mid,
sf-app.sf-app .sf-tree.-expandable:not(.-drag):not(.-checkbox) .k-treeview-top {
  padding-left: 21px;
}

sf-app.sf-app .sf-tree.-expandable:not(.-drag):not(.-checkbox) .k-treeview-bot:has(.k-treeview-leaf.k-selected):not(:has(.-inactive)),
sf-app.sf-app .sf-tree.-expandable:not(.-drag):not(.-checkbox) .k-treeview-mid:has(.k-treeview-leaf.k-selected):not(:has(.-inactive)),
sf-app.sf-app .sf-tree.-expandable:not(.-drag):not(.-checkbox) .k-treeview-top:has(.k-treeview-leaf.k-selected):not(:has(.-inactive)) {
  background-color: var(--sf-color-info-bg, #dcecf5);
}

sf-app.sf-app .sf-tree .k-treeview-toggle {
  padding-left: initial;
  z-index: 5;
}

sf-app.sf-app .sf-tree .k-treeview-toggle .k-icon {
  padding: 4px 8px;
}

sf-app.sf-app .sf-tree .k-checkbox-wrap {
  position: relative;
  align-self: flex-start;
}

sf-app.sf-app .sf-tree .k-checkbox-wrap .k-checkbox {
  width: 13px;
  height: 13px;
  -webkit-appearance: auto;
          appearance: auto;
  align-self: flex-start;
}

sf-app.sf-app .sf-tree .sf-tree-list__cell {
  white-space: normal;
  text-wrap: wrap;
}

sf-app.sf-app .sf-tree .k-treeview-load-more-button:hover {
  text-decoration: none;
}

sf-app.sf-app .sf-tree .k-treeview-load-more-button .sf-button {
  padding: 0;
  border: 0;
}

sf-app.sf-app .sf-tree .k-treeview-load-more-button .sf-button__content {
  border: 1px solid var(--button-border-color);
  border-radius: 3px;
  display: block;
  line-height: 32px;
  padding: 0 16px;
}

sf-app.sf-app .sf-tree__row {
  display: flex;
  width: 100%;
}

sf-app.sf-app .sf-tree__row.-no-row-hover:hover {
  background-color: #fff;
}

sf-app.sf-app .sf-tree__row.-inverted {
  color: #fff;
}

sf-app.sf-app .sf-tree__outer {
  position: absolute;
  left: 0;
  padding-top: 15px;
  text-align: center;
  z-index: 10;
}

sf-app.sf-app .sf-tree:not(.-flat) .sf-drag-handle {
  display: block;
  margin-top: -2px;
}

sf-app.sf-app .sf-tree__drop-not-allowed {
  display: none;
}

sf-app.sf-app .sf-tree__inner {
  display: flex;
  align-items: center;
  flex: auto;
  position: relative;
  padding: 10px;
  max-width: 100%;
  min-width: 0;
  cursor: pointer;
}

sf-app.sf-app .sf-tree__inner.-large {
  padding: 15px 15px 13px 15px;
}

sf-app.sf-app .sf-tree__inner.-inverted {
  color: #fff;
}

sf-app.sf-app .sf-tree__inner.-loading {
  padding: 0;
}

sf-app.sf-app .sf-tree__inner.-loading:hover::after {
  content: none;
}

sf-app.sf-app .sf-tree__inner.-no-pointer {
  cursor: default;
}

sf-app.sf-app .sf-tree__inner.-active {
  background-color: var(--sf-color-info-bg, #dcecf5);
}

sf-app.sf-app .sf-tree__inner.-active-light {
  background-color: var(--sf-color-info-bg, #dcecf5);
}

sf-app.sf-app .sf-tree__inner.-active-light:hover {
  background-color: var(--sf-color-info-lighter, #99c4ef);
}

sf-app.sf-app .sf-tree__inner.-active-light .-sf-txt-dimmed {
  color: var(--sf-secondary-text-color-on-blue-bg);
}

sf-app.sf-app .sf-tree__inner.-link {
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 10px;
  color: var(--sf-color-info, #006cd9);
}

sf-app.sf-app .sf-tree__inner.-link:hover .sf-tree__item-title {
  border-bottom-color: var(--link-color);
}

sf-app.sf-app .sf-tree__inner.-link.-no-underline:hover .sf-tree__item-title {
  border-bottom-color: transparent;
  color: #333;
}

sf-app.sf-app .sf-tree__inner.-link .sf-tree__item-title {
  border-bottom: 1px solid transparent;
  display: block;
}

sf-app.sf-app .sf-tree__inner.-with-check:hover .sf-tree__check {
  visibility: visible;
  color: var(--sf-tree-active-bg-check-icon-color, var(--sf-color-secondary, #ccc));
}

sf-app.sf-app .sf-tree__inner.-with-check:hover .sf-tree__check:hover {
  color: var(--sf-tree-active-bg-check-icon-hover-color, var(--sf-color-secondary-dark, #777));
}

sf-app.sf-app .sf-tree__content, sf-app.sf-app .sf-tree__description {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: normal;
}

sf-app.sf-app .sf-tree__content.-no-ellipsis, sf-app.sf-app .sf-tree__description.-no-ellipsis {
  white-space: normal;
  overflow: auto;
}

sf-app.sf-app .sf-tree__description {
  font-size: var(--font-size-base);
}

sf-app.sf-app .sf-tree__content, sf-app.sf-app .sf-tree__status, sf-app.sf-app .sf-tree__icon, sf-app.sf-app .sf-tree__avatar, sf-app.sf-app .sf-tree__right-align {
  position: relative;
  z-index: 10;
}

sf-app.sf-app .sf-tree__status {
  margin-right: 10px;
  align-self: flex-start;
}

sf-app.sf-app .sf-tree__content.-no-status {
  margin-left: 32px;
}

sf-app.sf-app .sf-tree__right-align, sf-app.sf-app .sf-tree__right-status {
  margin-left: auto;
  flex-shrink: 0;
}

sf-app.sf-app .sf-tree__right-align {
  margin-right: 5px;
  align-self: center;
}

sf-app.sf-app .sf-tree__right-status {
  padding: 10px;
}

sf-app.sf-app .sf-tree__check {
  display: flex;
  justify-content: center;
  align-items: center;
  visibility: hidden;
  width: 30px;
  height: 30px;
  text-align: right;
  cursor: pointer;
}

sf-app.sf-app .sf-tree__action {
  font-size: var(--font-size-base);
}

sf-app.sf-app .sf-tree__action:hover {
  cursor: pointer;
}

sf-app.sf-app .sf-tree__avatar {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  overflow: hidden;
  width: 36px;
  margin-right: 10px;
  background-color: #eee;
  color: var(--sf-color-secondary-dark, #999);
}

sf-app.sf-app .sf-tree__icon {
  margin-right: 10px;
}

sf-app.sf-app .sf-tree__icon + .sf-tree__content.-no-status {
  margin-left: 0;
}

sf-app.sf-app .sf-tree__separator {
  border-top: 1px solid var(--sf-color-secondary-lighter, #e4e4e4);
  position: relative;
  width: 200%;
  left: -100%;
  z-index: 10;
}

sf-app.sf-app .sf-tree__item-title.-heading {
  font-size: var(--font-size-h5);
  color: var(--sf-color-secondary-dark, #999);
  text-transform: uppercase;
}

sf-app.sf-app .sf-tree__item-btn {
  margin-left: 5px;
  display: flex;
  align-items: center;
  position: relative;
}

sf-app.sf-app .sf-tree__item-btn::before {
  content: "";
  position: absolute;
  width: 5px;
  height: calc(100% + 2px);
  left: -5px;
  background: #f5f5f5;
}

sf-app.sf-app .sf-tree.-checkbox kendo-checkbox {
  padding-top: 15px;
  width: 33px;
  text-align: center;
  justify-content: center;
}

sf-app.sf-app .sf-tree.-checkbox:not(.-main-list-view) kendo-checkbox {
  padding-top: 12px;
}

sf-app.sf-app .sf-tree.-checkbox .-inactive {
  position: relative;
}

sf-app.sf-app .sf-tree.-checkbox .-inactive::before {
  content: "";
  position: absolute;
  inset: 0 0 -33px;
  -webkit-user-select: none;
          user-select: none;
}

sf-app.sf-app .sf-tree.-checkbox:not(.-flat) .-inactive::before {
  left: -45px;
}

sf-app.sf-app .sf-tree.-drag.-condensed .k-treeview-leaf {
  padding-left: 21px;
  padding-right: 0;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-group:not(.k-treeview-lines) .k-treeview-item > div {
  margin-left: 25px;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item > div {
  margin-left: 50px;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item > div {
  margin-left: 75px;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item > div {
  margin-left: 100px;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item > div {
  margin-left: 125px;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item > div {
  margin-left: 150px;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item > div {
  margin-left: 175px;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item > div {
  margin-left: 200px;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item > div {
  margin-left: 225px;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item > div {
  margin-left: 250px;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item > div {
  margin-left: 275px;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item > div {
  margin-left: 300px;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item > div {
  margin-left: 325px;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item > div {
  margin-left: 350px;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item > div {
  margin-left: 375px;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item > div {
  margin-left: 400px;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item > div {
  margin-left: 425px;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item > div {
  margin-left: 450px;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-group:not(.k-treeview-lines) .k-treeview-item > div {
  margin-left: 475px;
}

sf-app.sf-app .sf-tree.-drag.-sidebar:has(.tree-sidebar-clue-template .sf-icon.sf-fa-ban) .k-treeview-bot:hover,
sf-app.sf-app .sf-tree.-drag.-sidebar:has(.tree-sidebar-clue-template .sf-icon.sf-fa-ban) .k-treeview-mid:hover,
sf-app.sf-app .sf-tree.-drag.-sidebar:has(.tree-sidebar-clue-template .sf-icon.sf-fa-ban) .k-treeview-top:hover {
  background-color: transparent;
}

sf-app.sf-app .sf-tree.-drag.-sidebar:has(.tree-sidebar-clue-template .sf-icon.sf-fa-ban) .k-treeview-bot .sf-tree__item-btn,
sf-app.sf-app .sf-tree.-drag.-sidebar:has(.tree-sidebar-clue-template .sf-icon.sf-fa-ban) .k-treeview-mid .sf-tree__item-btn,
sf-app.sf-app .sf-tree.-drag.-sidebar:has(.tree-sidebar-clue-template .sf-icon.sf-fa-ban) .k-treeview-top .sf-tree__item-btn {
  display: none !important;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item.-editable > .k-treeview-bot, sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item.-editable > .k-treeview-bot:hover, sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item.-editable > .k-treeview-bot:focus,
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item.-editable > .k-treeview-mid,
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item.-editable > .k-treeview-mid:hover,
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item.-editable > .k-treeview-mid:focus,
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item.-editable > .k-treeview-top,
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item.-editable > .k-treeview-top:hover,
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item.-editable > .k-treeview-top:focus {
  --color-secondary-darkest: #fff;
  background-color: #333;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item.-editable > .k-treeview-bot .sf-tree__item-btn, sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item.-editable > .k-treeview-bot:hover .sf-tree__item-btn, sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item.-editable > .k-treeview-bot:focus .sf-tree__item-btn,
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item.-editable > .k-treeview-mid .sf-tree__item-btn,
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item.-editable > .k-treeview-mid:hover .sf-tree__item-btn,
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item.-editable > .k-treeview-mid:focus .sf-tree__item-btn,
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item.-editable > .k-treeview-top .sf-tree__item-btn,
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item.-editable > .k-treeview-top:hover .sf-tree__item-btn,
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item.-editable > .k-treeview-top:focus .sf-tree__item-btn {
  display: block;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item.-editable > .k-treeview-bot .sf-tree__outer, sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item.-editable > .k-treeview-bot:hover .sf-tree__outer, sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item.-editable > .k-treeview-bot:focus .sf-tree__outer,
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item.-editable > .k-treeview-mid .sf-tree__outer,
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item.-editable > .k-treeview-mid:hover .sf-tree__outer,
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item.-editable > .k-treeview-mid:focus .sf-tree__outer,
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item.-editable > .k-treeview-top .sf-tree__outer,
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item.-editable > .k-treeview-top:hover .sf-tree__outer,
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item.-editable > .k-treeview-top:focus .sf-tree__outer {
  display: none !important;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item > .k-treeview-bot:has(.sf-tree__row):has([data-expandable=true]),
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item > .k-treeview-mid:has(.sf-tree__row):has([data-expandable=true]),
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item > .k-treeview-top:has(.sf-tree__row):has([data-expandable=true]) {
  position: relative;
  left: -21px;
  padding-left: 41px;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item > .k-treeview-bot:has(.sf-tree__row):has([data-expandable=true]) .sf-tree__outer,
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item > .k-treeview-mid:has(.sf-tree__row):has([data-expandable=true]) .sf-tree__outer,
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item > .k-treeview-top:has(.sf-tree__row):has([data-expandable=true]) .sf-tree__outer {
  left: -41px;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item > .k-treeview-bot:has(.sf-tree__row):has([data-expandable=false]) .k-treeview-toggle,
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item > .k-treeview-mid:has(.sf-tree__row):has([data-expandable=false]) .k-treeview-toggle,
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item > .k-treeview-top:has(.sf-tree__row):has([data-expandable=false]) .k-treeview-toggle {
  display: none;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item > .k-treeview-bot:has(.sf-tree__row):has([data-move-allowed=false]),
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item > .k-treeview-mid:has(.sf-tree__row):has([data-move-allowed=false]),
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item > .k-treeview-top:has(.sf-tree__row):has([data-move-allowed=false]) {
  padding-left: 0;
  position: relative;
  left: 21px;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item > .k-treeview-bot:has(.sf-tree__row):has([data-move-allowed=false]):has([data-expandable=true]),
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item > .k-treeview-mid:has(.sf-tree__row):has([data-move-allowed=false]):has([data-expandable=true]),
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-item > .k-treeview-top:has(.sf-tree__row):has([data-move-allowed=false]):has([data-expandable=true]) {
  padding-left: 21px;
  left: 0;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .sf-tree__inner {
  min-width: unset;
  max-width: unset;
  flex: unset;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .sf-tree__outer {
  left: -36px;
  padding: 5px 4px 0;
  display: none;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .sf-tree__row {
  position: relative;
  height: 100%;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .sf-tree__item-btn {
  display: none;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-bot,
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-mid,
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-top {
  width: -moz-fit-content;
  width: fit-content;
  margin-bottom: 2px;
  padding-left: 21px;
  border-radius: 3px;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-bot:hover, sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-bot:has(.k-focus),
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-mid:hover,
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-mid:has(.k-focus),
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-top:hover,
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-top:has(.k-focus) {
  background-color: var(--sf-tree-sidebar-hover-bg-color);
}

sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-bot:hover:has([data-move-allowed=true]) .sf-tree__outer, sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-bot:has(.k-focus):has([data-move-allowed=true]) .sf-tree__outer,
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-mid:hover:has([data-move-allowed=true]) .sf-tree__outer,
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-mid:has(.k-focus):has([data-move-allowed=true]) .sf-tree__outer,
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-top:hover:has([data-move-allowed=true]) .sf-tree__outer,
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-top:has(.k-focus):has([data-move-allowed=true]) .sf-tree__outer {
  display: block;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-bot:hover .sf-tree__item-btn, sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-bot:has(.k-focus) .sf-tree__item-btn,
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-mid:hover .sf-tree__item-btn,
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-mid:has(.k-focus) .sf-tree__item-btn,
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-top:hover .sf-tree__item-btn,
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-top:has(.k-focus) .sf-tree__item-btn {
  display: block;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-bot:has(.-inverted) .k-icon,
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-mid:has(.-inverted) .k-icon,
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-top:has(.-inverted) .k-icon {
  color: #fff;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-bot .sf-tree__outer,
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-mid .sf-tree__outer,
sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-top .sf-tree__outer {
  left: -21px;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-toggle {
  padding-top: 3px;
  padding-left: 0;
  left: 6px;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-leaf {
  cursor: pointer;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-leaf, sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-leaf.k-focus, sf-app.sf-app .sf-tree.-drag.-sidebar .k-treeview-leaf.k-selected {
  background-color: inherit;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .-not-draggable.-expandable {
  margin-left: 2px !important;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .-not-draggable .sf-tree__outer {
  display: none;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .is-dragging-over-disabled [hidden] {
  display: block !important;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .is-dragging-over-disabled .sf-tree__drop-not-allowed {
  display: block;
}

sf-app.sf-app .sf-tree.-drag.-sidebar .is-dragging-over-disabled .sf-tree_drag-handle {
  display: none;
}

sf-app.sf-app .sf-tree.-drag:not(.-flat) .sf-tree__outer.-sf-just-added {
  height: 100%;
  padding-right: calc(100% - 21px);
}

sf-app.sf-app .sf-tree.-drag:not(.-flat) .is-dragging-over .sf-tree__item-title {
  background-color: #000;
  color: #fff;
}

sf-app.sf-app .sf-tree.-drag.-flat .k-treeview-leaf {
  padding-left: 21px;
}

sf-app.sf-app .sf-tree.-flat .sf-tree__outer + .sf-tree__inner {
  margin-left: -10px;
}

sf-app.sf-app .sf-tree.-flat.-sidebar .sf-tree__outer + .sf-tree__inner {
  margin-left: 0;
}

sf-app.sf-app .sf-tree.-flat.-checkbox:not(.-main-list-view) .k-checkbox-wrap {
  flex-shrink: 0;
}

sf-app.sf-app .sf-tree.-flat.-checkbox:not(.-main-list-view) .k-treeview-leaf {
  overflow: hidden;
}

sf-app.sf-app .sf-tree.-actions-on-hover .sf-tree__action {
  visibility: hidden;
}

sf-app.sf-app .sf-tree.-actions-on-hover .sf-tree-list__row:hover .sf-tree__action,
sf-app.sf-app .sf-tree.-actions-on-hover .sf-tree__inner:hover .sf-tree__action {
  visibility: visible;
}

sf-app.sf-app .sf-tree.-condensed .sf-tree__inner:not(.-link) {
  padding-top: 8px;
  padding-bottom: 8px;
}

sf-app.sf-app .sf-tree.-condensed .sf-tree__outer {
  padding-top: 8px;
  height: calc(100% - 1px);
}

sf-app.sf-app .sf-tree.-condensed .sf-tree__outer.-tree-item {
  height: 36px;
}

sf-app.sf-app .sf-tree:not(.-no-separators) {
  border-top: 1px solid var(--tree-common-border-color, #eee);
}

sf-app.sf-app .sf-tree:not(.-no-separators) .k-treeview-bot,
sf-app.sf-app .sf-tree:not(.-no-separators) .k-treeview-mid,
sf-app.sf-app .sf-tree:not(.-no-separators) .k-treeview-top {
  border-bottom: 1px solid var(--tree-common-border-color, #eee);
}

sf-app.sf-app .sf-tree.-text-status .sf-tree__status {
  margin-top: 4px;
}

sf-app.sf-app .sf-tree.-list {
  border-left: 1px solid var(--sf-color-secondary-lighter, #e4e4e4);
  border-right: 1px solid var(--sf-color-secondary-lighter, #e4e4e4);
}

sf-app.sf-app .sf-tree.-list .sf-tree__file-extension {
  display: none;
}

sf-app.sf-app .sf-tree.-read-only .sf-tree__inner, sf-app.sf-app .-read-only .sf-tree .sf-tree__inner {
  cursor: default;
}

sf-app.sf-app .sf-tree.-drag .sf-tree__row.-system-link .sf-tree__icon, sf-app.sf-app .sf-tree.-status .sf-tree__row.-system-link .sf-tree__icon, sf-app.sf-app .sf-tree.-checkbox .sf-tree__row.-system-link .sf-tree__icon {
  margin-left: auto;
  margin-right: 0;
  padding-right: 5px;
}

sf-app.sf-app .sf-tree.-drag .sf-tree__row.-system-link .sf-tree__icon,
sf-app.sf-app .sf-tree.-drag .sf-tree__row.-system-link .sf-tree__content, sf-app.sf-app .sf-tree.-status .sf-tree__row.-system-link .sf-tree__icon,
sf-app.sf-app .sf-tree.-status .sf-tree__row.-system-link .sf-tree__content, sf-app.sf-app .sf-tree.-checkbox .sf-tree__row.-system-link .sf-tree__icon,
sf-app.sf-app .sf-tree.-checkbox .sf-tree__row.-system-link .sf-tree__content {
  cursor: pointer;
}

sf-app.sf-app .sf-tree.-main-list-view:not(.-flat) kendo-checkbox {
  padding-left: 10px;
  width: 43px;
}

sf-app.sf-app .sf-tree.-sidebar .sf-tree__inner {
  padding: 5px 7px;
  border-radius: 3px;
}

sf-app.sf-app .sf-tree.-sidebar .k-treeview-toggle .k-icon-wrapper-host .k-icon.k-font-icon.k-i-caret-alt-right, sf-app.sf-app .sf-tree.-sidebar .k-treeview-toggle .k-icon-wrapper-host .k-icon.k-font-icon.k-i-caret-alt-down {
  color: #333;
}

sf-app.sf-app .sf-tree.-sidebar-hiarachical-nav .sf-tree__inner {
  padding: 0;
}

sf-app.sf-app .sf-tree.-sidebar-hiarachical-nav .sf-tree__content:hover, sf-app.sf-app .sf-tree.-sidebar-hiarachical-nav .sf-tree__content:focus,
sf-app.sf-app .sf-tree.-sidebar-hiarachical-nav .sf-tree__right-align:not(:empty):hover,
sf-app.sf-app .sf-tree.-sidebar-hiarachical-nav .sf-tree__right-align:not(:empty):focus {
  background-color: var(--sf-tree-sidebar-hover-bg-color);
}

sf-app.sf-app .sf-tree.-sidebar-hiarachical-nav .sf-tree__content {
  flex: auto;
  padding: 10px;
}

sf-app.sf-app .sf-tree.-sidebar-hiarachical-nav .sf-tree__right-align {
  margin-right: 0;
  padding: 6px;
  min-width: 38px;
  height: 100%;
}

sf-app.sf-app .sf-drag-handle,
sf-app.sf-app .-sf-drag-handle {
  width: 21px;
  font-size: var(--icon-size-m);
  color: var(--sf-tree-drag-icon-color);
  cursor: move;
}

sf-app.sf-app .sf-drag-handle:hover, sf-app.sf-app .sf-drag-handle:focus,
sf-app.sf-app .-sf-drag-handle:hover,
sf-app.sf-app .-sf-drag-handle:focus {
  color: #333;
}

sf-app.sf-app .-sf-tree-dragging .sf-sticky,
sf-app.sf-app .-sf-tree-dragging .sf-modal-window__buttons {
  display: none !important;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
sf-app.sf-app .sf-media {
  position: relative;
  z-index: 5;
}

sf-app.sf-app .sf-media:not(.-document), sf-app.sf-app .sf-media:not(.-album) {
  height: 100%;
}

sf-app.sf-app .sf-media:not(.-upload-progress):hover, sf-app.sf-app .sf-media:not(.-upload-progress):focus, sf-app.sf-app .sf-media:not(.-upload-progress):active {
  z-index: 100;
}

sf-app.sf-app .sf-media:not(.-upload-progress):hover .sf-media__details,
sf-app.sf-app .sf-media:not(.-upload-progress):hover .sf-media__selected-indicator, sf-app.sf-app .sf-media:not(.-upload-progress):focus .sf-media__details,
sf-app.sf-app .sf-media:not(.-upload-progress):focus .sf-media__selected-indicator, sf-app.sf-app .sf-media:not(.-upload-progress):active .sf-media__details,
sf-app.sf-app .sf-media:not(.-upload-progress):active .sf-media__selected-indicator {
  visibility: visible;
}

sf-app.sf-app .sf-media:not(:focus-within, :hover, .-remove-button-visible) .sf-media__remove .sf-button {
  padding: 0;
  position: absolute;
  height: 1px;
  width: 1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
  border: 0;
}

sf-app.sf-app .sf-media:not(.-selected) .sf-media__selected-indicator:not(:hover) {
  opacity: 0.5;
}

sf-app.sf-app .sf-media .sf-media__svg-wrapper {
  flex: 1;
}

sf-app.sf-app .sf-media:not(.sf-placeholder.-svg) .sf-media__svg-wrapper {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  max-height: 100%;
  overflow: hidden;
}

sf-app.sf-app .sf-media.-mvc::after {
  content: "mvc";
  position: absolute;
  bottom: 0;
  right: 0;
  padding: 2px 4px;
  font-size: 8px;
  color: #fff;
  background-color: var(--sf-color-info, #006cd9);
  text-transform: uppercase;
}

sf-app.sf-app .sf-media .-auto-height .sf-placeholder {
  height: auto;
}

sf-app.sf-app .sf-media img {
  max-width: 100%;
  max-height: 100%;
  height: auto;
  vertical-align: top;
}

sf-app.sf-app .sf-media__chip {
  max-width: calc(100% - 31px);
}

sf-app.sf-app .sf-media__chip:has(+ .sf-media__hidden-link) {
  max-width: calc(100% - 140px);
}

sf-app.sf-app .sf-media__chip .sf-chip {
  margin-bottom: 0;
}

sf-app.sf-app .sf-media.-empty {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 240px;
  height: 160px;
  color: #eee;
  border: 1px dashed var(--image-empty-border);
}

sf-app.sf-app .sf-media.-empty.-small {
  width: 150px;
  height: 100px;
}

sf-app.sf-app .sf-media.-no-zindex {
  z-index: auto;
}

sf-app.sf-app .sf-media.-no-zindex.-dimmed::after {
  z-index: auto;
}

sf-app.sf-app .sf-media.-smaller {
  width: 60px;
  height: 60px;
}

sf-app.sf-app .sf-media.-landscape {
  width: 82px;
  height: 58px;
  border: 1px solid #f5f5f5;
}

sf-app.sf-app .sf-media.-landscape-smaller {
  width: 42px;
  height: 39px;
}

sf-app.sf-app .sf-media.-cropped {
  overflow: hidden;
}

sf-app.sf-app .sf-media.-cropped img {
  max-height: none;
}

sf-app.sf-app .sf-media.-wide img {
  max-width: none;
  height: 100%;
  width: auto;
}

sf-app.sf-app .sf-media.-preview {
  height: auto;
  max-width: 100%;
}

sf-app.sf-app .sf-media.-preview video {
  min-height: min(354px, 100%);
}

sf-app.sf-app .sf-media.-preview.-document .sf-input-file {
  position: absolute;
  right: -6px;
  bottom: -37px;
}

sf-app.sf-app .sf-media.-preview.-document.-edit .sf-input-file {
  bottom: 6px;
}

sf-app.sf-app .sf-media.-no-placeholder video,
sf-app.sf-app .sf-media.-no-placeholder img {
  max-height: 150px;
  width: auto;
}

sf-app.sf-app .sf-media.-prepreview {
  height: 300px;
}

sf-app.sf-app .sf-media.-prepreview.-small {
  height: 150px;
}

sf-app.sf-app .sf-media.-selectable {
  cursor: pointer;
}

sf-app.sf-app .sf-media.-selectable:not(.-dimmed, .-selected):hover::after, sf-app.sf-app .sf-media.-selectable:not(.-dimmed, .-selected):focus::after, sf-app.sf-app .sf-media.-selectable:not(.-dimmed, .-selected):active::after {
  display: block;
  content: " ";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 1;
  background: linear-gradient(rgba(245, 245, 245, 0), rgba(245, 245, 245, 0.25));
  z-index: 1;
  pointer-events: none;
}

sf-app.sf-app .sf-media.-selected .sf-media__selected-indicator,
sf-app.sf-app .sf-media.-selected .sf-media__remove {
  visibility: visible;
}

sf-app.sf-app .sf-media.-selected::after {
  display: block;
  content: " ";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0.4;
  background: var(--sf-album-selected-background, var(--sf-color-info-bg, #dcecf5));
  z-index: 10;
}

sf-app.sf-app .sf-media.-dimmed .sf-media__no-selectable {
  visibility: visible;
}

sf-app.sf-app .sf-media.-dimmed::after {
  display: block;
  content: " ";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0.6;
  background: var(--sf-color-secondary, #ccc);
  z-index: 10;
}

sf-app.sf-app .sf-media.-dimmed-hover:hover .sf-media__properties-label {
  visibility: visible;
}

sf-app.sf-app .sf-media.-dimmed-hover:hover::after {
  display: block;
  content: " ";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0.6;
  background: var(--sf-color-secondary, #ccc);
  z-index: 10;
}

sf-app.sf-app .sf-media.-upload-progress {
  height: 100%;
}

sf-app.sf-app .sf-media.-upload-progress::after {
  display: block;
  content: " ";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0.5;
  background: var(--sf-color-info-bg, #dcecf5);
  z-index: 10;
  font-size: 0;
}

sf-app.sf-app .sf-media.-upload-progress:not(.-upload-image-preview)::after {
  background-color: transparent;
}

sf-app.sf-app .sf-media.-edit-meta .sf-media__details:not(.-video) {
  bottom: 60px;
}

sf-app.sf-app .sf-media.-edit-meta .sf-input {
  z-index: 1000;
}

sf-app.sf-app .sf-media.-edit-meta img {
  max-height: calc(100% - 55px);
}

sf-app.sf-app .sf-media.-stretched img {
  position: absolute;
  top: 0;
  left: 0;
  max-width: 100%;
  max-height: 100%;
  height: auto;
  vertical-align: top;
  width: 100%;
}

sf-app.sf-app .sf-media.-stretched.-centered img {
  position: relative;
}

sf-app.sf-app .sf-media.-document.-edit > sf-file-preview {
  position: relative;
  display: block;
}

sf-app.sf-app .sf-media.-document.-edit > sf-component-loader {
  flex: 1;
}

sf-app.sf-app .sf-media.-document.-edit .sf-media__thumbnail {
  display: flex;
  align-items: center;
  padding: 10px;
  background-color: var(--document-background);
  border: 1px solid var(--document-border-color);
  border-radius: 4px;
}

sf-app.sf-app .sf-media.-document:not(.-edit) {
  width: 200px;
  height: 260px;
  padding: 45px 20px;
  text-align: left;
  background-color: #fff;
  border: 1px solid #eee;
}

sf-app.sf-app .sf-media.-document:not(.-edit) > sf-component-loader {
  flex: 1;
}

sf-app.sf-app .sf-media.-document:not(.-edit) .sf-media__thumbnail {
  margin-left: -20px;
  margin-right: -20px;
  padding-bottom: 45px;
  text-align: center;
  border-bottom: 1px solid #eee;
}

sf-app.sf-app .sf-media.-document:not(.-edit) .sf-media__title {
  min-height: 42px;
}

sf-app.sf-app .sf-media.-document:not(.-edit) .sf-media__title,
sf-app.sf-app .sf-media.-document:not(.-edit) .sf-media__progress-status {
  position: relative;
}

sf-app.sf-app .sf-media.-document:not(.-edit) .sf-media__status {
  position: absolute;
  bottom: 20px;
}

sf-app.sf-app .sf-media.-document:not(.-edit) .sf-media__file-info.-right-align {
  position: absolute;
  right: 20px;
  bottom: 20px;
}

sf-app.sf-app .sf-media.-document:not(.-edit) .sf-media__file-info.-badge {
  bottom: calc(260px / 2);
}

sf-app.sf-app .sf-media.-document:not(.-edit) .sf-media__progress-status {
  z-index: 100;
}

sf-app.sf-app .sf-media.-document:not(.-edit) .sf-media__error-message {
  position: absolute;
  bottom: -37px;
  left: -20px;
  white-space: nowrap;
}

sf-app.sf-app .sf-media.-fade-in-effect img, sf-app.sf-app .sf-media.-fade-in-effect video {
  animation: 0.6s ease-in fadeIn;
}

sf-app.sf-app .sf-media__progress.-absolute {
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 1000;
}

sf-app.sf-app .sf-media__progress[value].-vertical.-document {
  height: 200px;
  width: 260px;
  transform: rotate(-90deg) translate(-246px, -21px);
  transform-origin: top left;
  background-color: transparent;
  opacity: 0.5;
}

sf-app.sf-app .sf-media__progress[value].-vertical.-document::after {
  display: none;
}

sf-app.sf-app .sf-media__progress[value].-vertical.-document::-webkit-progress-bar {
  background-color: transparent;
}

sf-app.sf-app .sf-media__progress[value].-vertical.-document::-webkit-progress-value {
  -webkit-transition: width 1s linear;
  transition: width 1s linear;
  background-color: var(--sf-color-success-bg, #caeed8);
  color: #fff;
}

sf-app.sf-app .sf-media__progress[value].-vertical.-document::-moz-progress-bar {
  background-color: var(--sf-color-success-bg, #caeed8);
}

sf-app.sf-app .sf-media__progress[value].-vertical.-document.-failure::-webkit-progress-value {
  background-color: var(--sf-color-error-bg, #fcc);
}

sf-app.sf-app .sf-media__progress[value].-vertical.-document.-failure::-moz-progress-bar {
  background-color: var(--sf-color-error-bg, #fcc);
}

sf-app.sf-app .sf-media__details {
  position: absolute;
  visibility: hidden;
  bottom: 5px;
  left: 5px;
  z-index: 10000;
}

sf-app.sf-app .sf-media__remove {
  position: absolute;
  top: 5px;
  right: 5px;
  z-index: 10000;
}

sf-app.sf-app .sf-media__labeled {
  padding-left: 2px;
  padding-right: 2px;
  font-size: var(--font-size-base);
  text-align: center;
  z-index: 10000;
  color: #fff;
  background-color: var(--not-translated-image-label-bg);
}

sf-app.sf-app .sf-media__labeled.-down {
  align-self: flex-end;
  margin-bottom: 15px;
}

sf-app.sf-app .sf-media__stretched {
  position: absolute;
  inset: 0;
}

sf-app.sf-app .sf-media__properties-label {
  visibility: hidden;
  z-index: 10000;
}

sf-app.sf-app .sf-media__selected-indicator, sf-app.sf-app .sf-media__no-selectable {
  margin-right: 0;
  position: absolute;
  visibility: hidden;
  top: 5px;
  right: 5px;
  z-index: 10000;
  color: #333;
}

sf-app.sf-app .sf-media__file-info.-right-align {
  position: absolute;
  right: 5px;
  bottom: 5px;
}

sf-app.sf-app .sf-media video {
  width: 100%;
  height: 100%;
  object-fit: contain;
  overflow: hidden;
}

sf-app.sf-app .sf-image__empty.-view-in-edit {
  min-height: 150px;
}

sf-app.sf-app .sf-image__empty.-video {
  width: 82px;
  height: 58px;
  border: 1px solid #f5f5f5;
}

sf-app.sf-app .sf-placeholder {
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #f5f5f5;
  height: 100%;
}

sf-app.sf-app .sf-placeholder.-upload-image-preview {
  height: calc(100% - 55px);
}

sf-app.sf-app .sf-placeholder.-video {
  background-color: #000;
}

sf-app.sf-app .sf-placeholder.-error {
  position: relative;
  z-index: 20;
}

sf-app.sf-app .sf-placeholder.-svg {
  flex: 1;
}

sf-app.sf-app .sf-placeholder.-svg sf-component-loader {
  flex: 1;
  width: 100%;
  text-align: center;
}

sf-app.sf-app .sf-placeholder.-no-background {
  background-color: transparent;
}

sf-app.sf-app .sf-flickr-gallery {
  position: relative;
  width: 100%;
}

sf-app.sf-app .sf-flickr-gallery__item {
  position: absolute;
  list-style-type: none;
}

sf-app.sf-app .sf-flickr-gallery__item.-static {
  position: static;
}

sf-app.sf-app .sf-flickr-gallery__item.-video sf-component-loader,
sf-app.sf-app .sf-flickr-gallery__item.-video sf-video-player,
sf-app.sf-app .sf-flickr-gallery__item.-video .sf-video {
  display: block;
  width: 100%;
  height: 100%;
}

sf-app.sf-app .sf-flickr-gallery__drop-wrapper {
  position: absolute;
  display: flex;
  top: 0;
  width: 2px;
  background-color: #333;
  z-index: 1000;
  pointer-events: none;
  align-items: center;
}

sf-app.sf-app .sf-flickr-gallery__drop-image {
  position: absolute;
  left: -30px;
  width: 60px;
  height: auto;
  outline: 4px solid var(--sf-color-warning-bg, #ffc);
  -webkit-user-select: none;
          user-select: none;
  background-color: #f5f5f5;
}

sf-app.sf-app .sf-flickr-gallery__drop-image.-wide {
  width: 90px;
  left: -45px;
}

sf-app.sf-app .sf-flickr-gallery__drop-image.-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 60px;
  background-color: #fff;
  border: 1px solid #eee;
}

sf-app.sf-app .sf-flickr-gallery__drag-zone {
  position: fixed;
  display: none;
  top: 0;
  left: 0;
  height: 110px;
  width: 100%;
  z-index: 100000;
}

sf-app.sf-app .sf-flickr-gallery__drag-zone.-bottom {
  top: auto;
  bottom: 0;
}

sf-app.sf-app .sf-flickr-gallery__drag-zone.-visible {
  display: block;
}

sf-app.sf-app .sf-field {
  position: relative;
}

sf-app.sf-app .sf-field.-size-xs .sf-field__content {
  width: 25%;
}

sf-app.sf-app .sf-field.-size-s .sf-field__content {
  width: 50%;
}

sf-app.sf-app .sf-field.-size-m .sf-field__content {
  width: 75%;
}

sf-app.sf-app .sf-field.-size-l .sf-field__content {
  width: 100%;
}

sf-app.sf-app .sf-field.-has-errors .sf-field__input,
sf-app.sf-app .sf-field.-has-errors .sf-field__input + .sf-input__unit,
sf-app.sf-app .sf-field.-has-errors .sf-field__input + .sf-input__unit::before,
sf-app.sf-app .sf-field.-has-errors .k-datepicker .k-picker-wrap,
sf-app.sf-app .sf-field.-has-errors .k-timepicker .k-picker-wrap {
  border-color: var(--sf-color-error, #ff4848);
}

sf-app.sf-app .sf-field.-filter {
  margin-top: 3px;
  margin-bottom: 0;
  padding-top: 10px;
  padding-bottom: 0;
  border-top: 1px solid var(--sf-color-secondary-lighter, #e4e4e4);
}

sf-app.sf-app .sf-field.-filter .sf-field__label {
  display: inline-block;
  font-weight: normal;
}

sf-app.sf-app .sf-field.-boolean-tooltip {
  display: flex;
}

sf-app.sf-app .sf-field.-boolean-tooltip .sf-field__tooltip {
  order: 2;
  align-self: center;
}

sf-app.sf-app .sf-field.-sequence {
  margin-bottom: 0;
  padding-top: 0;
  padding-bottom: 0;
}

sf-app.sf-app .sf-field.-group:not(.-first) {
  padding-top: 0;
}

sf-app.sf-app .sf-field.-group:not(.-last) {
  padding-bottom: 5px;
}

sf-app.sf-app .sf-field__label {
  display: inline-block;
  font-size: var(--field-label-font-size);
  font-weight: bold;
}

sf-app.sf-app .sf-field__label.-legend {
  float: left;
  margin-right: 5px;
  margin-bottom: 5px;
}

sf-app.sf-app .sf-field__content {
  display: block;
  clear: both;
  margin-top: 5px;
}

sf-app.sf-app .sf-field__error {
  font-size: var(--font-size-base);
  margin-top: 5px;
  color: var(--sf-color-error, #ff4848);
}

sf-app.sf-app .sf-field__error.-underline {
  padding-top: 5px;
  border-top: 1px solid var(--sf-color-error, #ff4848);
}

sf-app.sf-app .sf-field__hint {
  color: var(--sf-secondary-text-color);
}

sf-app.sf-app .sf-field__no-value {
  color: var(--sf-secondary-text-color);
}

sf-app.sf-app .sf-field__content, sf-app.sf-app .sf-field__no-value {
  font-size: var(--font-size-lg);
}

sf-app.sf-app .sf-field__table {
  width: var(--field-table-width, 100%);
  table-layout: fixed;
}

sf-app.sf-app .sf-field__table.-middle td {
  vertical-align: middle;
}

sf-app.sf-app .sf-field__table .sf-field {
  padding-top: 10px;
  padding-bottom: 10px;
}

sf-app.sf-app .sf-field__table.-has-hover tbody tr:hover {
  background-color: #f5f5f5;
}

sf-app.sf-app .sf-field__table.-top-align td {
  vertical-align: top;
}

sf-app.sf-app .sf-field__table.-top-align td:not(.-form-control) {
  padding-top: 15px;
}

sf-app.sf-app .sf-field__table.-top-align td.-form-control sf-choice {
  display: block;
  padding-top: 8px;
}

sf-app.sf-app .sf-field__table.-top-align td.-input-check {
  padding-top: 20px;
}

sf-app.sf-app .sf-field__table td {
  padding-top: 8px;
  padding-bottom: 8px;
  vertical-align: top;
}

sf-app.sf-app .sf-field__table td .sf-field {
  padding-top: 0;
  padding-bottom: 0;
  margin-bottom: 0;
}

sf-app.sf-app .sf-field__table td.-dragged {
  position: absolute;
  inset: 0;
  background-color: #f5f5f5;
}

sf-app.sf-app .sf-field__table .-col-size-4xs {
  width: 30px;
}

sf-app.sf-app .sf-field__table .-col-size-3xs {
  width: 50px;
}

sf-app.sf-app .sf-field__table .-col-size-2xs {
  width: 100px;
}

sf-app.sf-app .sf-field__table .-col-size-s {
  width: 150px;
}

sf-app.sf-app .sf-field__table .-col-size-sm {
  width: 180px;
}

sf-app.sf-app .sf-field__table .-col-size-m {
  width: 200px;
}

sf-app.sf-app .sf-field__table .-col-size-l {
  width: 250px;
}

sf-app.sf-app .sf-field__table .-col-size-lxl {
  width: 270px;
}

sf-app.sf-app .sf-field__table.-col-size-3xl {
  width: 400px;
}

sf-app.sf-app .sf-field td {
  vertical-align: top;
}

sf-app.sf-app .sf-field__table-header {
  font-size: var(--font-size-h5);
  font-weight: 400;
  text-transform: uppercase;
  text-align: left;
  color: var(--tree-common-head-color, var(--sf-color-secondary, #ccc));
  padding-top: var(--field-table-header-vertical-padding);
  padding-bottom: var(--field-table-header-padding-bottom);
}

sf-app.sf-app .sf-field__table-header.-first {
  width: 80px;
}

sf-app.sf-app .sf-field__table-header.-col-size-xs {
  width: 120px;
}

sf-app.sf-app .sf-field__table-header.-col-size-4xl {
  width: 450px;
}

sf-app.sf-app .sf-field__table-header.-col-size-xl {
  width: 300px;
}

sf-app.sf-app .sf-field__table-row {
  position: relative;
  height: 55px;
}

sf-app.sf-app .sf-field__table-row:not(.-additional) {
  border-bottom: 1px solid var(--tree-common-border-color, #eee);
}

sf-app.sf-app .sf-field__table-row.-additional {
  height: 47px;
}

sf-app.sf-app .sf-field__table-row.-additional td {
  padding-bottom: 0;
}

sf-app.sf-app .sf-field__table-row.-head {
  height: auto;
}

/* cyrillic-ext */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 300;
  src: local("Open Sans Light"), local("OpenSans-Light"), url("/assets/fonts/open-sans/OpenSans-Light.ttf") format("truetype");
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 300;
  src: local("Open Sans Light"), local("OpenSans-Light"), url("/assets/fonts/open-sans/OpenSans-Light.ttf") format("truetype");
  unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 300;
  src: local("Open Sans Light"), local("OpenSans-Light"), url("/assets/fonts/open-sans/OpenSans-Light.ttf") format("truetype");
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 300;
  src: local("Open Sans Light"), local("OpenSans-Light"), url("/assets/fonts/open-sans/OpenSans-Light.ttf") format("truetype");
  unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 300;
  src: local("Open Sans Light"), local("OpenSans-Light"), url("/assets/fonts/open-sans/OpenSans-Light.ttf") format("truetype");
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 300;
  src: local("Open Sans Light"), local("OpenSans-Light"), url("/assets/fonts/open-sans/OpenSans-Light.ttf") format("truetype");
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 300;
  src: local("Open Sans Light"), local("OpenSans-Light"), url("/assets/fonts/open-sans/OpenSans-Light.ttf") format("truetype");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 400;
  src: local("Open Sans Regular"), local("OpenSans-Regular"), url("/assets/fonts/open-sans/OpenSans-Regular.ttf") format("truetype");
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 400;
  src: local("Open Sans Regular"), local("OpenSans-Regular"), url("/assets/fonts/open-sans/OpenSans-Regular.ttf") format("truetype");
  unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 400;
  src: local("Open Sans Regular"), local("OpenSans-Regular"), url("/assets/fonts/open-sans/OpenSans-Regular.ttf") format("truetype");
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 400;
  src: local("Open Sans Regular"), local("OpenSans-Regular"), url("/assets/fonts/open-sans/OpenSans-Regular.ttf") format("truetype");
  unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 400;
  src: local("Open Sans Regular"), local("OpenSans-Regular"), url("/assets/fonts/open-sans/OpenSans-Regular.ttf") format("truetype");
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 400;
  src: local("Open Sans Regular"), local("OpenSans-Regular"), url("/assets/fonts/open-sans/OpenSans-Regular.ttf") format("truetype");
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 400;
  src: local("Open Sans Regular"), local("OpenSans-Regular"), url("/assets/fonts/open-sans/OpenSans-Regular.ttf") format("truetype");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 700;
  src: local("Open Sans Bold"), local("OpenSans-Bold"), url("/assets/fonts/open-sans/OpenSans-Bold.ttf") format("truetype");
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 700;
  src: local("Open Sans Bold"), local("OpenSans-Bold"), url("/assets/fonts/open-sans/OpenSans-Bold.ttf") format("truetype");
  unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 700;
  src: local("Open Sans Bold"), local("OpenSans-Bold"), url("/assets/fonts/open-sans/OpenSans-Bold.ttf") format("truetype");
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 700;
  src: local("Open Sans Bold"), local("OpenSans-Bold"), url("/assets/fonts/open-sans/OpenSans-Bold.ttf") format("truetype");
  unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 700;
  src: local("Open Sans Bold"), local("OpenSans-Bold"), url("/assets/fonts/open-sans/OpenSans-Bold.ttf") format("truetype");
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 700;
  src: local("Open Sans Bold"), local("OpenSans-Bold"), url("/assets/fonts/open-sans/OpenSans-Bold.ttf") format("truetype");
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 700;
  src: local("Open Sans Bold"), local("OpenSans-Bold"), url("/assets/fonts/open-sans/OpenSans-Bold.ttf") format("truetype");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: "Open Sans Condensed";
  font-style: normal;
  font-weight: 700;
  src: local("Open Sans Condensed Bold"), local("OpenSansCondensed-Bold"), url("/assets/fonts/open-sans/OpenSansCondensed-Bold.ttf") format("truetype");
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: "Open Sans Condensed";
  font-style: normal;
  font-weight: 700;
  src: local("Open Sans Condensed Bold"), local("OpenSansCondensed-Bold"), url("/assets/fonts/open-sans/OpenSansCondensed-Bold.ttf") format("truetype");
  unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: "Open Sans Condensed";
  font-style: normal;
  font-weight: 700;
  src: local("Open Sans Condensed Bold"), local("OpenSansCondensed-Bold"), url("/assets/fonts/open-sans/OpenSansCondensed-Bold.ttf") format("truetype");
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: "Open Sans Condensed";
  font-style: normal;
  font-weight: 700;
  src: local("Open Sans Condensed Bold"), local("OpenSansCondensed-Bold"), url("/assets/fonts/open-sans/OpenSansCondensed-Bold.ttf") format("truetype");
  unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
  font-family: "Open Sans Condensed";
  font-style: normal;
  font-weight: 700;
  src: local("Open Sans Condensed Bold"), local("OpenSansCondensed-Bold"), url("/assets/fonts/open-sans/OpenSansCondensed-Bold.ttf") format("truetype");
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: "Open Sans Condensed";
  font-style: normal;
  font-weight: 700;
  src: local("Open Sans Condensed Bold"), local("OpenSansCondensed-Bold"), url("/assets/fonts/open-sans/OpenSansCondensed-Bold.ttf") format("truetype");
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: "Open Sans Condensed";
  font-style: normal;
  font-weight: 700;
  src: local("Open Sans Condensed Bold"), local("OpenSansCondensed-Bold"), url("/assets/fonts/open-sans/OpenSansCondensed-Bold.ttf") format("truetype");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@keyframes floatingText {
  0% {
    transform: translate(0);
  }
  50% {
    transform: translate(calc(-100% + 26px / 2));
  }
  100% {
    transform: translate(0);
  }
}
@keyframes loader {
  40% {
    opacity: 1;
  }
}
@keyframes loadingProgressbar {
  0% {
    transform: scaleX(0);
  }
  50% {
    transform: scaleX(1);
  }
  100% {
    transform: translateX(100%);
  }
}
@keyframes loadingSkeleton {
  0% {
    opacity: 0.7;
  }
  50% {
    opacity: 0.8;
  }
  100% {
    opacity: 0.9;
  }
}
@keyframes pulsingColorLoading {
  0% {
    background-color: #f5f5f5;
  }
  50% {
    background-color: rgb(250.1, 250.1, 250.1);
  }
  100% {
    background-color: rgb(246.275, 246.275, 246.275);
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
sf-app.sf-app {
  --date-time-icon-border-color: var(--sf-color-secondary-lighter, #e4e4e4);
  --date-time-icon-color: var(--sf-color-secondary-dark, #777);
  --date-time-content-color: #656565;
}

sf-app.sf-app {
  --select-border-color: var(--sf-color-secondary-lighter, #e4e4e4);
}

body {
  --sf-footer-color: var(--sf-color-secondary, #ccc);
  --sf-topbar-color: var(--sf-color-secondary-dark, #999);
  --sf-h5-color: var(--sf-color-secondary-dark, #999);
  --sf-navigation-border-color: #e5e5e5;
  --sf-navigation-caret: var(--sf-color-secondary, #ccc);
  --sf-user-info-border-color: var(--sf-color-secondary-lighter, #e4e4e4);
  --sf-live-link: #4cb861;
  --sf-green-main: var(--sf-color-success, #38ab63);
}

sf-app.sf-app {
  /* hides input type="number" spinbox */
  /***
   * Album:
   */
  /**
   * Empty Album:
   * `.sf-album`
   *
   *     @example
   *	    <div class="sf-album">
   *		    <span class="sf-album__holder -empty"></span>
   *		    <span class="sf-album__holder -empty"></span>
   *		    <span class="sf-album__holder -empty"></span>
   *		    <span class="sf-album__holder -empty"></span>
   *	    </div>
   *
   */
  /**
   * Album with 3 images and no sub albums:
   * `.sf-album`
   *
   *     @example
   *	    <div class="sf-album">
   *	        <span class="sf-album__holder">
   *	            <img src="image.png" class="-landscape">
   *	        </span>
   *		    <span class="sf-album__holder">
   *	            <img src="image.png" class="-landscape">
   *	        </span>
   *		    <span class="sf-album__holder">
   *	            <img src="image.png" class="-landscape">
   *	        </span>
   *		    <span class="sf-album__holder -empty"></span>
   *	    </div>
   *
   */
  /**
   * Album width sub albums:
   * `.sf-album`
   *
   *     @example
   *	    <div class="sf-album">
   *	        <span class="sf-album__holder">
   *	            <span class="sf-album__folder"></span>
   *	        </span>
   *		    <span class="sf-album__holder">
   *	            <span class="sf-album__folder"></span>
   *	        </span>
   *		    <span class="sf-album__holder">
   *	            <span class="sf-album__folder"></span>
   *	        </span>
   *		    <span class="sf-album__holder -empty"></span>
   *	    </div>
   *
   */
}

sf-app.sf-app sf-home {
  display: block;
}

sf-app.sf-app sf-input {
  width: 100%;
}

sf-app.sf-app sf-input.-auto-width {
  width: auto;
}

sf-app.sf-app sf-icon {
  display: inline-flex;
}

sf-app.sf-app sf-video-player {
  display: flex;
}

sf-app.sf-app table {
  font-size: inherit;
}

@keyframes floatingText {
  0% {
    transform: translate(0);
  }
  50% {
    transform: translate(calc(-100% + 26px / 2));
  }
  100% {
    transform: translate(0);
  }
}
@keyframes loader {
  40% {
    opacity: 1;
  }
}
@keyframes loadingProgressbar {
  0% {
    transform: scaleX(0);
  }
  50% {
    transform: scaleX(1);
  }
  100% {
    transform: translateX(100%);
  }
}
@keyframes loadingSkeleton {
  0% {
    opacity: 0.7;
  }
  50% {
    opacity: 0.8;
  }
  100% {
    opacity: 0.9;
  }
}
@keyframes pulsingColorLoading {
  0% {
    background-color: #f5f5f5;
  }
  50% {
    background-color: rgb(250.1, 250.1, 250.1);
  }
  100% {
    background-color: rgb(246.275, 246.275, 246.275);
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
sf-app.sf-app progress[value] {
  -webkit-appearance: none;
          appearance: none;
  width: 100%;
  height: 7px;
  border: 0;
  background-color: var(--sf-color-secondary-light, var(--sf-color-secondary-lighter, #e4e4e4));
  color: var(--sf-color-success, #38ab63);
}

sf-app.sf-app progress[value]::-webkit-progress-bar {
  background-color: var(--sf-color-secondary-lighter, #e4e4e4);
}

sf-app.sf-app progress[value]::-webkit-progress-value {
  background-color: var(--sf-color-success, #38ab63);
}

sf-app.sf-app progress[value]::-moz-progress-bar {
  background-color: var(--sf-color-success, #38ab63);
}

sf-app.sf-app progress.-failure[value] {
  color: var(--sf-color-error, #ff4848);
}

sf-app.sf-app progress.-failure[value]::-webkit-progress-value {
  background-color: var(--sf-color-error, #ff4848);
}

sf-app.sf-app progress.-failure[value]::-moz-progress-bar {
  background-color: var(--sf-color-error, #ff4848);
}

sf-app.sf-app progress.-small {
  width: 80px;
}

@keyframes floatingText {
  0% {
    transform: translate(0);
  }
  50% {
    transform: translate(calc(-100% + 26px / 2));
  }
  100% {
    transform: translate(0);
  }
}
@keyframes loader {
  40% {
    opacity: 1;
  }
}
@keyframes loadingProgressbar {
  0% {
    transform: scaleX(0);
  }
  50% {
    transform: scaleX(1);
  }
  100% {
    transform: translateX(100%);
  }
}
@keyframes loadingSkeleton {
  0% {
    opacity: 0.7;
  }
  50% {
    opacity: 0.8;
  }
  100% {
    opacity: 0.9;
  }
}
@keyframes pulsingColorLoading {
  0% {
    background-color: #f5f5f5;
  }
  50% {
    background-color: rgb(250.1, 250.1, 250.1);
  }
  100% {
    background-color: rgb(246.275, 246.275, 246.275);
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
sf-app.sf-app hr {
  margin-top: 30px;
  margin-bottom: 30px;
  border: 0;
  height: 1px;
  background-color: var(--sf-color-secondary-lighter, #e4e4e4);
  overflow: hidden;
}

sf-app.sf-app input[type=number]::-webkit-outer-spin-button, sf-app.sf-app input[type=number]::-webkit-inner-spin-button {
  opacity: 1;
}

sf-app.sf-app video {
  max-width: 100%;
  height: auto;
}

@keyframes floatingText {
  0% {
    transform: translate(0);
  }
  50% {
    transform: translate(calc(-100% + 26px / 2));
  }
  100% {
    transform: translate(0);
  }
}
@keyframes loader {
  40% {
    opacity: 1;
  }
}
@keyframes loadingProgressbar {
  0% {
    transform: scaleX(0);
  }
  50% {
    transform: scaleX(1);
  }
  100% {
    transform: translateX(100%);
  }
}
@keyframes loadingSkeleton {
  0% {
    opacity: 0.7;
  }
  50% {
    opacity: 0.8;
  }
  100% {
    opacity: 0.9;
  }
}
@keyframes pulsingColorLoading {
  0% {
    background-color: #f5f5f5;
  }
  50% {
    background-color: rgb(250.1, 250.1, 250.1);
  }
  100% {
    background-color: rgb(246.275, 246.275, 246.275);
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
sf-app.sf-app select {
  padding-left: 5px;
  padding-right: 5px;
  border: 1px solid var(--select-border-color);
  background-color: #fff;
  line-height: 2;
}

sf-app.sf-app select:focus:focus, sf-app.sf-app select:active:focus {
  box-shadow: 0 0 2px var(--sf-input-box-shadow-focus);
}

@keyframes floatingText {
  0% {
    transform: translate(0);
  }
  50% {
    transform: translate(calc(-100% + 26px / 2));
  }
  100% {
    transform: translate(0);
  }
}
@keyframes loader {
  40% {
    opacity: 1;
  }
}
@keyframes loadingProgressbar {
  0% {
    transform: scaleX(0);
  }
  50% {
    transform: scaleX(1);
  }
  100% {
    transform: translateX(100%);
  }
}
@keyframes loadingSkeleton {
  0% {
    opacity: 0.7;
  }
  50% {
    opacity: 0.8;
  }
  100% {
    opacity: 0.9;
  }
}
@keyframes pulsingColorLoading {
  0% {
    background-color: #f5f5f5;
  }
  50% {
    background-color: rgb(250.1, 250.1, 250.1);
  }
  100% {
    background-color: rgb(246.275, 246.275, 246.275);
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
sf-app.sf-app .sf-flex-sub {
  position: relative;
  vertical-align: baseline;
  bottom: -0.5rem;
}

sf-app.sf-app .sf-flex-sup {
  position: relative;
  vertical-align: baseline;
  top: -0.5rem;
}

@keyframes floatingText {
  0% {
    transform: translate(0);
  }
  50% {
    transform: translate(calc(-100% + 26px / 2));
  }
  100% {
    transform: translate(0);
  }
}
@keyframes loader {
  40% {
    opacity: 1;
  }
}
@keyframes loadingProgressbar {
  0% {
    transform: scaleX(0);
  }
  50% {
    transform: scaleX(1);
  }
  100% {
    transform: translateX(100%);
  }
}
@keyframes loadingSkeleton {
  0% {
    opacity: 0.7;
  }
  50% {
    opacity: 0.8;
  }
  100% {
    opacity: 0.9;
  }
}
@keyframes pulsingColorLoading {
  0% {
    background-color: #f5f5f5;
  }
  50% {
    background-color: rgb(250.1, 250.1, 250.1);
  }
  100% {
    background-color: rgb(246.275, 246.275, 246.275);
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
sf-app.sf-app .sf-router-wrapper.-menu {
  position: absolute;
  z-index: 10000000;
  display: flex;
  width: calc(100vw - 20px);
  overflow-x: hidden;
}

sf-app.sf-app .sf-router-wrapper.-menu sf-home {
  order: 1;
  z-index: 10000;
}

sf-app.sf-app .sf-router-wrapper.-menu sf-content {
  order: 2;
  z-index: 10000;
}

sf-app.sf-app .sf-router-wrapper.-is-animating > ng-component {
  position: absolute;
  width: 100%;
}

sf-app.sf-app .sf-router-wrapper.-active:not(.-is-animating) ~ .sf-router-wrapper,
sf-app.sf-app sf-modal-window.-type-modal ~ .sf-router-wrapper {
  display: none !important;
}

sf-app.sf-app .sf-router-wrapper.-active.-is-animating ~ .sf-router-wrapper {
  width: calc(100vw - 20px);
  overflow-x: hidden;
}

sf-app.sf-app .ng-animating .sf-top-toolbar__nav-button {
  display: none;
}

@keyframes floatingText {
  0% {
    transform: translate(0);
  }
  50% {
    transform: translate(calc(-100% + 26px / 2));
  }
  100% {
    transform: translate(0);
  }
}
@keyframes loader {
  40% {
    opacity: 1;
  }
}
@keyframes loadingProgressbar {
  0% {
    transform: scaleX(0);
  }
  50% {
    transform: scaleX(1);
  }
  100% {
    transform: translateX(100%);
  }
}
@keyframes loadingSkeleton {
  0% {
    opacity: 0.7;
  }
  50% {
    opacity: 0.8;
  }
  100% {
    opacity: 0.9;
  }
}
@keyframes pulsingColorLoading {
  0% {
    background-color: #f5f5f5;
  }
  50% {
    background-color: rgb(250.1, 250.1, 250.1);
  }
  100% {
    background-color: rgb(246.275, 246.275, 246.275);
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
sf-app.sf-app .sf-wrapper {
  display: flex;
}

@keyframes floatingText {
  0% {
    transform: translate(0);
  }
  50% {
    transform: translate(calc(-100% + 26px / 2));
  }
  100% {
    transform: translate(0);
  }
}
@keyframes loader {
  40% {
    opacity: 1;
  }
}
@keyframes loadingProgressbar {
  0% {
    transform: scaleX(0);
  }
  50% {
    transform: scaleX(1);
  }
  100% {
    transform: translateX(100%);
  }
}
@keyframes loadingSkeleton {
  0% {
    opacity: 0.7;
  }
  50% {
    opacity: 0.8;
  }
  100% {
    opacity: 0.9;
  }
}
@keyframes pulsingColorLoading {
  0% {
    background-color: #f5f5f5;
  }
  50% {
    background-color: rgb(250.1, 250.1, 250.1);
  }
  100% {
    background-color: rgb(246.275, 246.275, 246.275);
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
sf-app.sf-app .sf-host {
  display: block;
  background-color: #fff;
}

sf-app.sf-app .sf-host.-animated {
  flex: none;
  width: calc(100vw - 20px);
  min-height: 100vh;
}

@keyframes floatingText {
  0% {
    transform: translate(0);
  }
  50% {
    transform: translate(calc(-100% + 26px / 2));
  }
  100% {
    transform: translate(0);
  }
}
@keyframes loader {
  40% {
    opacity: 1;
  }
}
@keyframes loadingProgressbar {
  0% {
    transform: scaleX(0);
  }
  50% {
    transform: scaleX(1);
  }
  100% {
    transform: translateX(100%);
  }
}
@keyframes loadingSkeleton {
  0% {
    opacity: 0.7;
  }
  50% {
    opacity: 0.8;
  }
  100% {
    opacity: 0.9;
  }
}
@keyframes pulsingColorLoading {
  0% {
    background-color: #f5f5f5;
  }
  50% {
    background-color: rgb(250.1, 250.1, 250.1);
  }
  100% {
    background-color: rgb(246.275, 246.275, 246.275);
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
sf-app.sf-app .sf-main {
  padding-bottom: 50px;
  transition: width 0.4s ease-out, padding-right 0.4s ease-out;
}

sf-app.sf-app .sf-main.-list {
  margin-left: auto;
  margin-right: auto;
  display: flex;
  flex-direction: column;
  padding-top: 122px;
  padding-left: 50px;
  padding-right: 50px;
  width: 100%;
}

sf-app.sf-app .sf-main.-list.-shrink {
  padding-right: 400px;
}

sf-app.sf-app .sf-main.-list.-shrink.-skip-animation {
  transition: none;
}

sf-app.sf-app .sf-main.-list.-shrink.-no-width-constraint .sf-main__header,
sf-app.sf-app .sf-main.-list.-shrink.-no-width-constraint .sf-main__paging {
  width: calc(100vw - 120px - 350px);
}

sf-app.sf-app .sf-main.-list.-shrink .sf-form-responses-wrapper {
  width: calc(100vw - 120px - 350px);
}

sf-app.sf-app .sf-main.-list.-shrink .sf-form-responses-wrapper .-form-responses {
  width: calc(100vw - 120px - 350px);
}

sf-app.sf-app .sf-main.-list.-no-width-constraint {
  width: auto;
}

sf-app.sf-app .sf-main.-list.-no-width-constraint .sf-main__header,
sf-app.sf-app .sf-main.-list.-no-width-constraint .sf-main__paging {
  transition: width 0.4s ease-out;
  max-width: none;
  width: calc(100vw - 120px);
}

sf-app.sf-app .sf-main.-details {
  padding-top: 117px;
  width: calc(100vw - 20px);
  min-height: 100vh;
}

sf-app.sf-app .sf-main.-details.-shrink, sf-app.sf-app .sf-main.-details.-shrink-reversed {
  width: calc(100vw - 350px);
}

sf-app.sf-app .sf-main.-details.-shrink.-narrow {
  width: calc(100vw - 400px);
}

sf-app.sf-app .sf-main.-details.-shrink-reversed {
  margin-left: 350px;
}

@keyframes floatingText {
  0% {
    transform: translate(0);
  }
  50% {
    transform: translate(calc(-100% + 26px / 2));
  }
  100% {
    transform: translate(0);
  }
}
@keyframes loader {
  40% {
    opacity: 1;
  }
}
@keyframes loadingProgressbar {
  0% {
    transform: scaleX(0);
  }
  50% {
    transform: scaleX(1);
  }
  100% {
    transform: translateX(100%);
  }
}
@keyframes loadingSkeleton {
  0% {
    opacity: 0.7;
  }
  50% {
    opacity: 0.8;
  }
  100% {
    opacity: 0.9;
  }
}
@keyframes pulsingColorLoading {
  0% {
    background-color: #f5f5f5;
  }
  50% {
    background-color: rgb(250.1, 250.1, 250.1);
  }
  100% {
    background-color: rgb(246.275, 246.275, 246.275);
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
sf-app.sf-app .sf-section-nav {
  position: fixed;
  top: 170px;
  bottom: 0;
  left: 20px;
  max-width: 140px;
  overflow: auto;
  animation: sectionNav 0.4s 1 ease-out;
  z-index: 10;
}

sf-app.sf-app .sf-section-nav.-in-form {
  position: absolute;
  top: 160px;
  left: calc(100% + 100px);
}

@media only screen and (max-width: 1365px) {
  sf-app.sf-app .sf-section-nav {
    display: none;
  }
}
@media only screen and (max-width: 1715px) {
  sf-app.sf-app .sf-main.-shrink + sf-content-section-menu .sf-section-nav {
    display: none;
  }
}
@media only screen and (max-width: 1765px) {
  sf-app.sf-app .sf-main.-narrow + sf-content-section-menu .sf-section-nav {
    display: none;
  }
}
@keyframes sectionNav {
  from {
    transform: translateX(calc(-100% - 20px));
  }
  to {
    transform: translateX(0);
  }
}
@keyframes floatingText {
  0% {
    transform: translate(0);
  }
  50% {
    transform: translate(calc(-100% + 26px / 2));
  }
  100% {
    transform: translate(0);
  }
}
@keyframes loader {
  40% {
    opacity: 1;
  }
}
@keyframes loadingProgressbar {
  0% {
    transform: scaleX(0);
  }
  50% {
    transform: scaleX(1);
  }
  100% {
    transform: translateX(100%);
  }
}
@keyframes loadingSkeleton {
  0% {
    opacity: 0.7;
  }
  50% {
    opacity: 0.8;
  }
  100% {
    opacity: 0.9;
  }
}
@keyframes pulsingColorLoading {
  0% {
    background-color: #f5f5f5;
  }
  50% {
    background-color: rgb(250.1, 250.1, 250.1);
  }
  100% {
    background-color: rgb(246.275, 246.275, 246.275);
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
sf-app.sf-app .sf-main-list-header {
  display: grid;
  grid-template-areas: "nav nav" "title buttons" "progress progress" "bulk bulk" "notification notification" "empty-message empty-message";
  grid-template-columns: minmax(100%, max-content) minmax(0, max-content);
  width: 100%;
}

sf-app.sf-app .sf-main-list-header.-media {
  grid-template-areas: "title buttons" "progress progress" "bulk bulk" "notification notification" "nav nav" "empty-message empty-message";
}

sf-app.sf-app .sf-main-list-header.-empty {
  grid-template-areas: "nav" "title" "notification" "progress" "empty-message" "buttons" "bulk";
  justify-items: center;
}

sf-app.sf-app .sf-main-list-header.-empty.-media {
  grid-template-areas: "title" "notification" "nav" "progress" "empty-message" "buttons" "bulk";
}

sf-app.sf-app .sf-main-list-header.-empty .sf-main-list-header__buttons sf-action-menu {
  display: flex;
}

sf-app.sf-app .sf-main-list-header.-empty .sf-main-list-header__buttons sf-action-menu sf-button {
  order: 2;
}

sf-app.sf-app .sf-main-list-header.-empty .sf-main-list-header__buttons sf-action-menu sf-button:has(.-action) {
  order: 1;
}

sf-app.sf-app .sf-main-list-header:not(.-empty) .sf-main-list-header__buttons {
  place-self: end end;
  white-space: nowrap;
}

sf-app.sf-app .sf-main-list-header__nav {
  grid-area: nav;
}

sf-app.sf-app .sf-main-list-header__title {
  grid-area: title;
  max-width: 70%;
}

sf-app.sf-app .sf-main-list-header__buttons {
  grid-area: buttons;
}

sf-app.sf-app .sf-main-list-header__bulk {
  grid-area: bulk;
}

sf-app.sf-app .sf-main-list-header__notification {
  grid-area: notification;
}

sf-app.sf-app .sf-main-list-header__empty-message {
  grid-area: empty-message;
}

sf-app.sf-app .sf-main-list-header__progress {
  grid-area: progress;
  width: 350px;
}

@media (height >= 540px) {
  sf-app.sf-app .sf-main-list-header__empty-message {
    margin-bottom: 60px;
    margin-top: 25px;
  }
}
@keyframes floatingText {
  0% {
    transform: translate(0);
  }
  50% {
    transform: translate(calc(-100% + 26px / 2));
  }
  100% {
    transform: translate(0);
  }
}
@keyframes loader {
  40% {
    opacity: 1;
  }
}
@keyframes loadingProgressbar {
  0% {
    transform: scaleX(0);
  }
  50% {
    transform: scaleX(1);
  }
  100% {
    transform: translateX(100%);
  }
}
@keyframes loadingSkeleton {
  0% {
    opacity: 0.7;
  }
  50% {
    opacity: 0.8;
  }
  100% {
    opacity: 0.9;
  }
}
@keyframes pulsingColorLoading {
  0% {
    background-color: #f5f5f5;
  }
  50% {
    background-color: rgb(250.1, 250.1, 250.1);
  }
  100% {
    background-color: rgb(246.275, 246.275, 246.275);
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
sf-app.sf-app .sf-menu {
  margin: 0;
  padding: 0;
  list-style-type: none;
}

sf-app.sf-app .sf-menu__sub-wrapper {
  padding-top: 315px;
  width: 1020px;
}

sf-app.sf-app .sf-menu__sub {
  margin-left: 20px;
  margin-right: 20px;
  margin-bottom: 60px;
  width: 300px;
}

sf-app.sf-app .sf-menu__sub.-two-columns {
  width: 640px;
}

sf-app.sf-app .sf-menu__sub.-two-columns .sf-menu {
  -moz-column-count: 2;
       column-count: 2;
  -moz-column-gap: 40px;
       column-gap: 40px;
}

sf-app.sf-app .sf-menu__sub.-three-columns {
  width: 980px;
}

sf-app.sf-app .sf-menu__sub.-three-columns .sf-menu {
  -moz-column-count: 3;
       column-count: 3;
  -moz-column-gap: 40px;
       column-gap: 40px;
}

sf-app.sf-app .sf-menu__sticky-title {
  width: 100%;
  position: fixed;
  top: 0;
}

sf-app.sf-app .sf-menu__sticky-title::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0.95) 80%, rgba(255, 255, 255, 0.2) 100%);
  z-index: auto;
}

sf-app.sf-app .sf-menu__sticky-title .sf-menu__back,
sf-app.sf-app .sf-menu__sticky-title .sf-menu__title {
  position: relative;
  z-index: 5;
}

sf-app.sf-app .sf-menu__back {
  display: inline-block;
  margin-top: 80px;
  margin-bottom: 10px;
}

sf-app.sf-app .sf-menu__title {
  margin-top: 10px;
  margin-bottom: 40px;
  font-family: "Open Sans Condensed", sans-serif;
  font-weight: bold;
  font-size: var(--font-size-h1-lg);
  line-height: 1.4;
  color: #333;
}

sf-app.sf-app .sf-menu__title.-sub {
  margin-top: 0;
  margin-bottom: 30px;
  font-size: var(--font-size-h2);
  color: var(--sf-color-secondary-dark, #999);
  border-bottom: 1px solid var(--sf-color-secondary-lighter, #e4e4e4);
}

sf-app.sf-app .sf-menu__item:not(.-vertical) {
  margin-left: 10px;
  margin-right: 10px;
}

sf-app.sf-app .sf-menu__link {
  display: block;
  cursor: pointer;
  font-size: var(--font-size-lg);
  color: #333;
}

sf-app.sf-app .sf-menu__link:hover, sf-app.sf-app .sf-menu__link:focus {
  color: #333;
}

sf-app.sf-app .sf-menu__link:hover .sf-menu__icon-box, sf-app.sf-app .sf-menu__link:focus .sf-menu__icon-box {
  background-color: #f5f5f5;
  box-shadow: 2px 2px 1px #f5f5f5;
}

sf-app.sf-app .sf-menu__link.-leaf {
  display: inline-block;
  padding: 3px 5px 2px;
  border-radius: 3px;
  overflow: hidden;
  text-overflow: ellipsis;
}

sf-app.sf-app .sf-menu__link.-leaf:hover, sf-app.sf-app .sf-menu__link.-leaf:focus, sf-app.sf-app .sf-menu__link.-leaf:active {
  background-color: var(--sf-color-secondary-lighter, #e4e4e4);
}

sf-app.sf-app .sf-menu__link.-disabled {
  pointer-events: none;
  cursor: default;
  color: var(--sf-color-secondary-lighter, #e4e4e4);
}

sf-app.sf-app .sf-menu__link.-disabled .sf-menu__icon-box {
  color: var(--sf-color-secondary-lighter, #e4e4e4);
}

sf-app.sf-app .sf-menu__icon-box {
  display: block;
  margin-bottom: 15px;
  width: 130px;
  height: 130px;
  line-height: 130px;
  font-size: var(--icon-menu-font-size);
  color: var(--sf-color-success, #38ab63);
  border: 1px solid var(--sf-color-secondary-lighter, #e4e4e4);
  border-radius: 3px;
}

sf-app.sf-app .sf-menu__logout {
  margin-top: 100px;
}

sf-app.sf-app .sf-menu__logout .sf-button {
  margin-right: 0;
}

@keyframes floatingText {
  0% {
    transform: translate(0);
  }
  50% {
    transform: translate(calc(-100% + 26px / 2));
  }
  100% {
    transform: translate(0);
  }
}
@keyframes loader {
  40% {
    opacity: 1;
  }
}
@keyframes loadingProgressbar {
  0% {
    transform: scaleX(0);
  }
  50% {
    transform: scaleX(1);
  }
  100% {
    transform: translateX(100%);
  }
}
@keyframes loadingSkeleton {
  0% {
    opacity: 0.7;
  }
  50% {
    opacity: 0.8;
  }
  100% {
    opacity: 0.9;
  }
}
@keyframes pulsingColorLoading {
  0% {
    background-color: #f5f5f5;
  }
  50% {
    background-color: rgb(250.1, 250.1, 250.1);
  }
  100% {
    background-color: rgb(246.275, 246.275, 246.275);
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
sf-app.sf-app .sf-logo {
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
  margin-left: auto;
  margin-right: auto;
  padding-top: 80px;
  width: 180px;
  height: 106px;
  background: transparent url(data:image/svg+xml;base64, ) no-repeat 0 80px;
}

sf-app.sf-app .sf-logo.-fixed {
  position: fixed;
  top: 0;
}

@keyframes floatingText {
  0% {
    transform: translate(0);
  }
  50% {
    transform: translate(calc(-100% + 26px / 2));
  }
  100% {
    transform: translate(0);
  }
}
@keyframes loader {
  40% {
    opacity: 1;
  }
}
@keyframes loadingProgressbar {
  0% {
    transform: scaleX(0);
  }
  50% {
    transform: scaleX(1);
  }
  100% {
    transform: translateX(100%);
  }
}
@keyframes loadingSkeleton {
  0% {
    opacity: 0.7;
  }
  50% {
    opacity: 0.8;
  }
  100% {
    opacity: 0.9;
  }
}
@keyframes pulsingColorLoading {
  0% {
    background-color: #f5f5f5;
  }
  50% {
    background-color: rgb(250.1, 250.1, 250.1);
  }
  100% {
    background-color: rgb(246.275, 246.275, 246.275);
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
sf-app.sf-app .sf-sticky {
  position: fixed;
  left: 0;
  right: 0;
  z-index: 100000;
  background-color: #fff;
}

sf-app.sf-app .sf-sticky.-top {
  top: 0;
  height: 46px;
}

sf-app.sf-app .sf-sticky.-bottom {
  bottom: 0;
}

sf-app.sf-app .sf-sticky.-left-indent {
  left: 50px;
  padding-right: 50px;
  padding-bottom: 0;
}

@keyframes floatingText {
  0% {
    transform: translate(0);
  }
  50% {
    transform: translate(calc(-100% + 26px / 2));
  }
  100% {
    transform: translate(0);
  }
}
@keyframes loader {
  40% {
    opacity: 1;
  }
}
@keyframes loadingProgressbar {
  0% {
    transform: scaleX(0);
  }
  50% {
    transform: scaleX(1);
  }
  100% {
    transform: translateX(100%);
  }
}
@keyframes loadingSkeleton {
  0% {
    opacity: 0.7;
  }
  50% {
    opacity: 0.8;
  }
  100% {
    opacity: 0.9;
  }
}
@keyframes pulsingColorLoading {
  0% {
    background-color: #f5f5f5;
  }
  50% {
    background-color: rgb(250.1, 250.1, 250.1);
  }
  100% {
    background-color: rgb(246.275, 246.275, 246.275);
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
sf-app.sf-app .sf-thumbnail {
  display: flex;
  justify-content: center;
  max-height: 100%;
}

sf-app.sf-app .sf-media:not(.-left-aligned) .sf-thumbnail sf-image {
  display: flex;
  justify-content: center;
  align-items: center;
}

@keyframes floatingText {
  0% {
    transform: translate(0);
  }
  50% {
    transform: translate(calc(-100% + 26px / 2));
  }
  100% {
    transform: translate(0);
  }
}
@keyframes loader {
  40% {
    opacity: 1;
  }
}
@keyframes loadingProgressbar {
  0% {
    transform: scaleX(0);
  }
  50% {
    transform: scaleX(1);
  }
  100% {
    transform: translateX(100%);
  }
}
@keyframes loadingSkeleton {
  0% {
    opacity: 0.7;
  }
  50% {
    opacity: 0.8;
  }
  100% {
    opacity: 0.9;
  }
}
@keyframes pulsingColorLoading {
  0% {
    background-color: #f5f5f5;
  }
  50% {
    background-color: rgb(250.1, 250.1, 250.1);
  }
  100% {
    background-color: rgb(246.275, 246.275, 246.275);
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
sf-app.sf-app .sf-album {
  display: flex;
  flex-wrap: wrap;
  height: 140px;
  overflow: hidden;
}

sf-app.sf-app .sf-album img {
  animation: 0.6s ease-in fadeIn;
}

sf-app.sf-app .sf-album:not(.-document) {
  padding: 7px;
  border: 1px solid var(--sf-color-secondary-lighter, #e4e4e4);
}

sf-app.sf-app .sf-album__holder {
  display: flex;
  justify-content: center;
  align-items: center;
  flex: auto;
  margin: 2px;
  width: 82px;
  height: 58px;
  overflow: hidden;
  background-color: #f5f5f5;
}

sf-app.sf-app .sf-album__holder.-transparent {
  background-color: transparent;
}

sf-app.sf-app .sf-album__folder {
  display: block;
  position: relative;
  width: 100%;
  height: 100%;
  background-color: var(--sf-color-info-bg, #dcecf5);
  z-index: 5;
  animation: 0.6s ease-in fadeIn;
}

sf-app.sf-app .sf-album__folder::before, sf-app.sf-app .sf-album__folder::after {
  display: block;
  content: " ";
  position: absolute;
  background-color: #fff;
  z-index: 10;
}

sf-app.sf-app .sf-album__folder::before {
  top: -7px;
  right: 27px;
  width: 12px;
  height: 9px;
  transform-origin: top left;
  transform: rotate(45deg);
  z-index: 100;
}

sf-app.sf-app .sf-album__folder::after {
  top: 0;
  right: 0;
  width: 36px;
  height: 9px;
}

@keyframes floatingText {
  0% {
    transform: translate(0);
  }
  50% {
    transform: translate(calc(-100% + 26px / 2));
  }
  100% {
    transform: translate(0);
  }
}
@keyframes loader {
  40% {
    opacity: 1;
  }
}
@keyframes loadingProgressbar {
  0% {
    transform: scaleX(0);
  }
  50% {
    transform: scaleX(1);
  }
  100% {
    transform: translateX(100%);
  }
}
@keyframes loadingSkeleton {
  0% {
    opacity: 0.7;
  }
  50% {
    opacity: 0.8;
  }
  100% {
    opacity: 0.9;
  }
}
@keyframes pulsingColorLoading {
  0% {
    background-color: #f5f5f5;
  }
  50% {
    background-color: rgb(250.1, 250.1, 250.1);
  }
  100% {
    background-color: rgb(246.275, 246.275, 246.275);
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
sf-app.sf-app .sf-form .sf-field:not(.-sequence):not(.-table):not(.-group) {
  margin-bottom: 5px;
  padding-top: 10px;
  padding-bottom: 15px;
}

sf-app.sf-app .sf-form .sf-field:not(.-sequence):not(.-table):not(.-group) .sf-input {
  margin-bottom: 0;
}

@keyframes floatingText {
  0% {
    transform: translate(0);
  }
  50% {
    transform: translate(calc(-100% + 26px / 2));
  }
  100% {
    transform: translate(0);
  }
}
@keyframes loader {
  40% {
    opacity: 1;
  }
}
@keyframes loadingProgressbar {
  0% {
    transform: scaleX(0);
  }
  50% {
    transform: scaleX(1);
  }
  100% {
    transform: translateX(100%);
  }
}
@keyframes loadingSkeleton {
  0% {
    opacity: 0.7;
  }
  50% {
    opacity: 0.8;
  }
  100% {
    opacity: 0.9;
  }
}
@keyframes pulsingColorLoading {
  0% {
    background-color: #f5f5f5;
  }
  50% {
    background-color: rgb(250.1, 250.1, 250.1);
  }
  100% {
    background-color: rgb(246.275, 246.275, 246.275);
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
sf-app.sf-app .sf-item {
  display: flex;
  align-items: center;
  height: 36px;
  font-size: var(--font-size-lg);
  border: 1px solid var(--input-border);
  border-radius: 0;
  background-color: #fff;
}

sf-app.sf-app .sf-item:hover .sf-item__right-align, sf-app.sf-app .sf-item:focus .sf-item__right-align, sf-app.sf-app .sf-item:focus-within .sf-item__right-align, sf-app.sf-app .sf-item.-loading .sf-item__right-align {
  visibility: visible;
}

sf-app.sf-app .sf-item.-error {
  border-color: var(--sf-color-error, #ff4848);
}

sf-app.sf-app .sf-item.-error .sf-item__unit::before {
  color: var(--sf-color-error, #ff4848);
}

sf-app.sf-app .sf-item.-loading .sf-item__right-align {
  min-width: 40px;
}

sf-app.sf-app .sf-item:has(.sf-item__unit.-in-tree) {
  border: 0;
}

sf-app.sf-app .sf-item__content {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex: 1;
  padding: 0 10px;
  width: 100%;
}

sf-app.sf-app .sf-item__right-align {
  position: relative;
  visibility: hidden;
  flex-shrink: 0;
  font-size: var(--font-size-base);
  margin-left: auto;
  margin-right: 10px;
}

sf-app.sf-app .sf-item__unit {
  text-decoration: none;
  text-align: center;
  vertical-align: middle;
  padding-left: 10px;
  padding-right: 10px;
  width: auto;
  height: 34px;
  line-height: 34px;
  background-color: #f5f5f5;
  outline: none;
  white-space: nowrap;
  animation-name: none !important;
}

sf-app.sf-app .sf-item__unit sup {
  position: relative;
  top: -0.4rem;
  vertical-align: baseline;
}

sf-app.sf-app .sf-item__unit.-in-tree {
  height: 36px;
  line-height: 36px;
}

sf-app.sf-app .sf-item__unit.-block {
  display: block;
}

sf-app.sf-app .sf-item:not(.-sf-just-added, .-sf-just-added-disabled, .-sf-highlighted) .sf-tree__inner {
  background-color: #fff;
}

@keyframes floatingText {
  0% {
    transform: translate(0);
  }
  50% {
    transform: translate(calc(-100% + 26px / 2));
  }
  100% {
    transform: translate(0);
  }
}
@keyframes loader {
  40% {
    opacity: 1;
  }
}
@keyframes loadingProgressbar {
  0% {
    transform: scaleX(0);
  }
  50% {
    transform: scaleX(1);
  }
  100% {
    transform: translateX(100%);
  }
}
@keyframes loadingSkeleton {
  0% {
    opacity: 0.7;
  }
  50% {
    opacity: 0.8;
  }
  100% {
    opacity: 0.9;
  }
}
@keyframes pulsingColorLoading {
  0% {
    background-color: #f5f5f5;
  }
  50% {
    background-color: rgb(250.1, 250.1, 250.1);
  }
  100% {
    background-color: rgb(246.275, 246.275, 246.275);
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
sf-app.sf-app .sf-filters-list {
  --alphabet-filter-rows: 100;
}

sf-app.sf-app .sf-filters-list.-alphabet {
  display: grid;
  grid-gap: 0;
  grid-template-rows: repeat(var(--alphabet-filter-rows), 1fr);
  grid-template-columns: 1fr 1fr;
  grid-auto-flow: column;
}

sf-app.sf-app .sf-filters-list .-secondary-group {
  margin-top: 20px;
}

sf-app.sf-app .sf-filters-list .-secondary-group + .-secondary-group {
  margin-top: 0;
}

@keyframes floatingText {
  0% {
    transform: translate(0);
  }
  50% {
    transform: translate(calc(-100% + 26px / 2));
  }
  100% {
    transform: translate(0);
  }
}
@keyframes loader {
  40% {
    opacity: 1;
  }
}
@keyframes loadingProgressbar {
  0% {
    transform: scaleX(0);
  }
  50% {
    transform: scaleX(1);
  }
  100% {
    transform: translateX(100%);
  }
}
@keyframes loadingSkeleton {
  0% {
    opacity: 0.7;
  }
  50% {
    opacity: 0.8;
  }
  100% {
    opacity: 0.9;
  }
}
@keyframes pulsingColorLoading {
  0% {
    background-color: #f5f5f5;
  }
  50% {
    background-color: rgb(250.1, 250.1, 250.1);
  }
  100% {
    background-color: rgb(246.275, 246.275, 246.275);
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
sf-app.sf-app .sf-help {
  white-space: normal;
}

sf-app.sf-app .sf-help__col1 {
  width: 195px;
}

sf-app.sf-app .sf-help__col2 {
  width: 150px;
}

@keyframes floatingText {
  0% {
    transform: translate(0);
  }
  50% {
    transform: translate(calc(-100% + 26px / 2));
  }
  100% {
    transform: translate(0);
  }
}
@keyframes loader {
  40% {
    opacity: 1;
  }
}
@keyframes loadingProgressbar {
  0% {
    transform: scaleX(0);
  }
  50% {
    transform: scaleX(1);
  }
  100% {
    transform: translateX(100%);
  }
}
@keyframes loadingSkeleton {
  0% {
    opacity: 0.7;
  }
  50% {
    opacity: 0.8;
  }
  100% {
    opacity: 0.9;
  }
}
@keyframes pulsingColorLoading {
  0% {
    background-color: #f5f5f5;
  }
  50% {
    background-color: rgb(250.1, 250.1, 250.1);
  }
  100% {
    background-color: rgb(246.275, 246.275, 246.275);
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
sf-app.sf-app .sf-card {
  position: relative;
  border: 1px solid #eee;
}

sf-app.sf-app .sf-card.-selected .sf-card__selected-indicator {
  visibility: visible;
}

sf-app.sf-app .sf-card.-selected::after {
  display: block;
  content: " ";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0.5;
  background: var(--sf-color-info-bg, #dcecf5);
  z-index: 10;
}

sf-app.sf-app .sf-card.-dashed {
  border-style: dashed;
}

sf-app.sf-app .sf-card.-darker {
  border-color: var(--sf-color-secondary, #ccc);
}

sf-app.sf-app .sf-card.-tooltip:hover {
  outline: 2px solid var(--sf-color-success-bg, #caeed8);
  outline-offset: -2px;
}

sf-app.sf-app .sf-card.-tooltip:hover .sf-card__label {
  display: block;
}

sf-app.sf-app .sf-card.-full-width {
  width: 100%;
}

sf-app.sf-app .sf-card.-full-height {
  height: 100%;
}

sf-app.sf-app .sf-card.-widget-selector {
  padding: 9px;
}

sf-app.sf-app .sf-card:not(.-selected):hover::after, sf-app.sf-app .sf-card:not(.-selected):focus::after, sf-app.sf-app .sf-card:not(.-selected):active::after {
  display: block;
  content: " ";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0.6;
  background: #f5f5f5;
  z-index: 1;
}

sf-app.sf-app .sf-card:not(:hover, :focus) .sf-card__overlay, sf-app.sf-app .sf-card.-selected .sf-card__overlay {
  display: none;
}

sf-app.sf-app .sf-card .sf-card__overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 5;
}

sf-app.sf-app .sf-card.-template {
  margin: 20px;
  padding: 20px;
  width: 260px;
  height: 320px;
}

sf-app.sf-app .sf-card.-template[data-framework=mvc]::before {
  position: absolute;
  top: 185px;
  right: 28px;
  padding: 6px 5px;
  font-size: 10px;
  text-transform: uppercase;
  content: attr(data-framework);
  color: #fff;
  background-color: var(--sf-color-info, #006cd9);
}

sf-app.sf-app .sf-card.-template[data-renderer=NetCore]::before {
  display: none;
}

sf-app.sf-app .sf-card.-template .sf-card__image {
  width: 220px;
  height: 200px;
}

sf-app.sf-app .sf-card__selected-indicator {
  margin-right: 0;
  position: absolute;
  visibility: hidden;
  top: 5px;
  right: 5px;
  z-index: 10000;
  color: #333;
}

sf-app.sf-app .sf-card__label {
  position: absolute;
  display: none;
  left: -1px;
  bottom: 100%;
  font-size: 10px;
  text-transform: uppercase;
  background-color: var(--sf-color-success-bg, #caeed8);
  padding: 0 8px;
  height: 24px;
  vertical-align: middle;
  line-height: 24px;
  color: var(--sf-color-secondary-dark, #999);
}

@keyframes floatingText {
  0% {
    transform: translate(0);
  }
  50% {
    transform: translate(calc(-100% + 26px / 2));
  }
  100% {
    transform: translate(0);
  }
}
@keyframes loader {
  40% {
    opacity: 1;
  }
}
@keyframes loadingProgressbar {
  0% {
    transform: scaleX(0);
  }
  50% {
    transform: scaleX(1);
  }
  100% {
    transform: translateX(100%);
  }
}
@keyframes loadingSkeleton {
  0% {
    opacity: 0.7;
  }
  50% {
    opacity: 0.8;
  }
  100% {
    opacity: 0.9;
  }
}
@keyframes pulsingColorLoading {
  0% {
    background-color: #f5f5f5;
  }
  50% {
    background-color: rgb(250.1, 250.1, 250.1);
  }
  100% {
    background-color: rgb(246.275, 246.275, 246.275);
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
sf-app.sf-app .sf-datepicker.-two-lines .sf-datepicker__date {
  display: block;
}

@keyframes floatingText {
  0% {
    transform: translate(0);
  }
  50% {
    transform: translate(calc(-100% + 26px / 2));
  }
  100% {
    transform: translate(0);
  }
}
@keyframes loader {
  40% {
    opacity: 1;
  }
}
@keyframes loadingProgressbar {
  0% {
    transform: scaleX(0);
  }
  50% {
    transform: scaleX(1);
  }
  100% {
    transform: translateX(100%);
  }
}
@keyframes loadingSkeleton {
  0% {
    opacity: 0.7;
  }
  50% {
    opacity: 0.8;
  }
  100% {
    opacity: 0.9;
  }
}
@keyframes pulsingColorLoading {
  0% {
    background-color: #f5f5f5;
  }
  50% {
    background-color: rgb(250.1, 250.1, 250.1);
  }
  100% {
    background-color: rgb(246.275, 246.275, 246.275);
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
sf-app.sf-app .sf-zone-toolset {
  display: inline-block;
  border-radius: 3px;
  background-color: #333;
  min-width: 320px;
  font-size: var(--font-size-base);
  color: #fff;
  overflow: hidden;
}

sf-app.sf-app .sf-zone-toolset__content {
  padding: 20px;
}

sf-app.sf-app .sf-zone-toolset__label {
  display: block;
  margin-bottom: 5px;
  text-transform: uppercase;
  color: #fff;
  font-size: 10px;
}

sf-app.sf-app .sf-zone-toolset__tab {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 15px;
  font-size: 13px;
  font-weight: bold;
  cursor: pointer;
  color: #fff;
  background: #4d4d4d;
}

sf-app.sf-app .sf-zone-toolset__tab.-selected {
  cursor: default;
  background: #333;
}

sf-app.sf-app .sf-zone-toolset .sf-expander {
  margin-bottom: 0;
}

sf-app.sf-app .sf-zone-toolset .sf-expander__header {
  display: inline-block !important;
}

sf-app.sf-app .sf-zone-toolset .sf-expander__icon {
  background: transparent;
  border: 0;
  margin-top: -5px;
}

sf-app.sf-app .sf-zone-toolset .sf-expander__icon .sf-button__icon {
  color: #fff;
}

sf-app.sf-app .sf-zone-toolset .sf-expander__icon:hover {
  background: transparent;
  border: 0;
  color: #fff;
  transition: none;
}

sf-app.sf-app .sf-zone-toolset .sf-expander__checkbox,
sf-app.sf-app .sf-zone-toolset .sf-checkbox__input,
sf-app.sf-app .sf-zone-toolset .sf-radio__input {
  display: inline-flex !important;
}

@keyframes floatingText {
  0% {
    transform: translate(0);
  }
  50% {
    transform: translate(calc(-100% + 26px / 2));
  }
  100% {
    transform: translate(0);
  }
}
@keyframes loader {
  40% {
    opacity: 1;
  }
}
@keyframes loadingProgressbar {
  0% {
    transform: scaleX(0);
  }
  50% {
    transform: scaleX(1);
  }
  100% {
    transform: translateX(100%);
  }
}
@keyframes loadingSkeleton {
  0% {
    opacity: 0.7;
  }
  50% {
    opacity: 0.8;
  }
  100% {
    opacity: 0.9;
  }
}
@keyframes pulsingColorLoading {
  0% {
    background-color: #f5f5f5;
  }
  50% {
    background-color: rgb(250.1, 250.1, 250.1);
  }
  100% {
    background-color: rgb(246.275, 246.275, 246.275);
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
sf-app.sf-app .sf-masonry__gutter {
  width: 20px;
}

sf-app.sf-app .sf-masonry__item {
  width: calc(25% - 15px);
}

sf-app.sf-app .sf-masonry__item img {
  margin-bottom: -4px;
}

@keyframes floatingText {
  0% {
    transform: translate(0);
  }
  50% {
    transform: translate(calc(-100% + 26px / 2));
  }
  100% {
    transform: translate(0);
  }
}
@keyframes loader {
  40% {
    opacity: 1;
  }
}
@keyframes loadingProgressbar {
  0% {
    transform: scaleX(0);
  }
  50% {
    transform: scaleX(1);
  }
  100% {
    transform: translateX(100%);
  }
}
@keyframes loadingSkeleton {
  0% {
    opacity: 0.7;
  }
  50% {
    opacity: 0.8;
  }
  100% {
    opacity: 0.9;
  }
}
@keyframes pulsingColorLoading {
  0% {
    background-color: #f5f5f5;
  }
  50% {
    background-color: rgb(250.1, 250.1, 250.1);
  }
  100% {
    background-color: rgb(246.275, 246.275, 246.275);
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
sf-app.sf-app .sf-ai-dropdown {
  width: 250px !important;
}

sf-app.sf-app .sf-ai-dropdown:has(.sf-ai-dropdown-error) {
  padding: 0 !important;
}

sf-app.sf-app .sf-ai-dropdown-error {
  height: inherit;
}

sf-app.sf-app .sf-ai-dropdown.k-context-menu .k-menu-link:hover, sf-app.sf-app .sf-ai-dropdown.k-context-menu .k-menu-link:focus {
  background-color: #f5f5f5;
}

sf-app.sf-app .sf-ai-dropdown.k-context-menu .k-menu-link i {
  color: var(--sf-color-secondary-dark, #777);
}

sf-app.sf-app .sf-ai-dropdown.k-context-menu .k-menu-item.k-disabled i {
  color: var(--sf-color-secondary, #ccc);
}

@keyframes floatingText {
  0% {
    transform: translate(0);
  }
  50% {
    transform: translate(calc(-100% + 26px / 2));
  }
  100% {
    transform: translate(0);
  }
}
@keyframes loader {
  40% {
    opacity: 1;
  }
}
@keyframes loadingProgressbar {
  0% {
    transform: scaleX(0);
  }
  50% {
    transform: scaleX(1);
  }
  100% {
    transform: translateX(100%);
  }
}
@keyframes loadingSkeleton {
  0% {
    opacity: 0.7;
  }
  50% {
    opacity: 0.8;
  }
  100% {
    opacity: 0.9;
  }
}
@keyframes pulsingColorLoading {
  0% {
    background-color: #f5f5f5;
  }
  50% {
    background-color: rgb(250.1, 250.1, 250.1);
  }
  100% {
    background-color: rgb(246.275, 246.275, 246.275);
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
sf-app.sf-app .sf-container-label {
  font-size: var(--font-size-h5);
  text-transform: uppercase;
  color: var(--sf-color-primary-invert, var(--sf-color-secondary-dark, #999));
  background: var(--sf-color-success-lighter, var(--sf-color-success-bg, #caeed8));
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: break-word;
  color: var(--sf-color-secondary-dark, #777);
  display: inline-flex;
  padding: 0 10px;
  height: 20px;
  align-items: center;
}

sf-app.sf-app .sf-container-label.-info {
  background: var(--sf-color-info-bg, #dcecf5);
}

@keyframes floatingText {
  0% {
    transform: translate(0);
  }
  50% {
    transform: translate(calc(-100% + 26px / 2));
  }
  100% {
    transform: translate(0);
  }
}
@keyframes loader {
  40% {
    opacity: 1;
  }
}
@keyframes loadingProgressbar {
  0% {
    transform: scaleX(0);
  }
  50% {
    transform: scaleX(1);
  }
  100% {
    transform: translateX(100%);
  }
}
@keyframes loadingSkeleton {
  0% {
    opacity: 0.7;
  }
  50% {
    opacity: 0.8;
  }
  100% {
    opacity: 0.9;
  }
}
@keyframes pulsingColorLoading {
  0% {
    background-color: #f5f5f5;
  }
  50% {
    background-color: rgb(250.1, 250.1, 250.1);
  }
  100% {
    background-color: rgb(246.275, 246.275, 246.275);
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
sf-app.sf-app .-sf-just-added {
  animation-name: justAdded;
  animation-duration: 1s;
  animation-iteration-count: 1;
}

sf-app.sf-app .-sf-just-added-disabled {
  animation-name: justAddedDisabled;
  animation-duration: 1s;
  animation-iteration-count: infinite;
}

sf-app.sf-app .-sf-highlighted:not(.-on-hover) {
  background-color: var(--sf-color-warning-bg, #ffc);
}

sf-app.sf-app .-sf-highlighted.-on-hover:hover {
  background-color: var(--sf-color-warning-bg, #ffc);
}

@keyframes justAdded {
  from {
    background-color: var(--sf-color-warning-bg, #ffc);
  }
  to {
    background-color: #fff;
  }
}
@keyframes justAddedDisabled {
  from {
    background-color: var(--sf-color-warning-bg, #ffc);
  }
  to {
    background-color: #f5f5f5;
  }
}
@keyframes floatingText {
  0% {
    transform: translate(0);
  }
  50% {
    transform: translate(calc(-100% + 26px / 2));
  }
  100% {
    transform: translate(0);
  }
}
@keyframes loader {
  40% {
    opacity: 1;
  }
}
@keyframes loadingProgressbar {
  0% {
    transform: scaleX(0);
  }
  50% {
    transform: scaleX(1);
  }
  100% {
    transform: translateX(100%);
  }
}
@keyframes loadingSkeleton {
  0% {
    opacity: 0.7;
  }
  50% {
    opacity: 0.8;
  }
  100% {
    opacity: 0.9;
  }
}
@keyframes pulsingColorLoading {
  0% {
    background-color: #f5f5f5;
  }
  50% {
    background-color: rgb(250.1, 250.1, 250.1);
  }
  100% {
    background-color: rgb(246.275, 246.275, 246.275);
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.sf-zone__frame {
  position: fixed;
  left: 0;
  border: 0;
  width: calc(100% - 15px);
  height: calc(100vh - 46px);
  top: 46px;
  z-index: 5;
  transition: 0.4s ease-out, padding-right 0.4s ease-out;
}

.sf-zone__frame.-shrink {
  padding-right: 335px;
}

.sf-zone__frame.-wide-shrink {
  padding-right: 385px;
}

.sf-zone__frame.-has-secondary-bar {
  top: 92px;
  padding-bottom: 92px;
}

.-sf-integrated-app .-sf-new-zone-editor:not(.sfPageEditor) {
  overflow: hidden auto;
}

.-sf-new-zone-editor .sfHeader {
  display: none;
}

.-sf-integrated-app .-sf-new-zone-editor:has(.sf-modal-window.-side-modal) {
  overflow-y: scroll;
}

@keyframes floatingText {
  0% {
    transform: translate(0);
  }
  50% {
    transform: translate(calc(-100% + 26px / 2));
  }
  100% {
    transform: translate(0);
  }
}
@keyframes loader {
  40% {
    opacity: 1;
  }
}
@keyframes loadingProgressbar {
  0% {
    transform: scaleX(0);
  }
  50% {
    transform: scaleX(1);
  }
  100% {
    transform: translateX(100%);
  }
}
@keyframes loadingSkeleton {
  0% {
    opacity: 0.7;
  }
  50% {
    opacity: 0.8;
  }
  100% {
    opacity: 0.9;
  }
}
@keyframes pulsingColorLoading {
  0% {
    background-color: #f5f5f5;
  }
  50% {
    background-color: rgb(250.1, 250.1, 250.1);
  }
  100% {
    background-color: rgb(246.275, 246.275, 246.275);
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* --- PAGE EDITOR --- */
.sfPageContainer,
.ZoneEditorToolboxContainer {
  height: calc(100vh - 92px);
}

.sf-app {
  display: block;
}

:root.-sf-integrated-app {
  /* Page editor modal overlay */
}

:root.-sf-integrated-app .sfPageEditor:not(.sfTemplateEditor) .sfMessagePane {
  position: relative;
  display: flex;
  padding: 45px 0 0 48px;
  height: 45px;
  background-color: #f5f5f5;
  border-bottom: 1px solid #eee;
  box-shadow: none;
}

:root.-sf-integrated-app .sfPageEditor:not(.sfTemplateEditor) .sfMessagePane::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  height: 46px;
  width: 100%;
  background-color: #fff;
}

:root.-sf-integrated-app .sfPageEditor:not(.sfTemplateEditor) .sfMessagePane .sfPagePersomalizationDdlWrp {
  margin-top: 15px;
  margin-left: 0;
  float: none;
  z-index: 999;
}

:root.-sf-integrated-app .sfPageEditor:not(.sfTemplateEditor) .RadToolBar.sfLayoutToolbar {
  display: block;
  width: 279px;
  margin-left: auto;
  visibility: visible;
  border-left: 1px solid #eee;
  background-color: transparent;
  position: relative;
  z-index: 999 !important;
}

:root.-sf-integrated-app .sfPageEditor:not(.sfTemplateEditor) .RadToolBar.sfLayoutToolbar .rtbOuter {
  padding: 0;
  background-image: none;
  background-color: #f5f5f5;
}

:root.-sf-integrated-app .sfPageEditor:not(.sfTemplateEditor) .RadToolBar.sfLayoutToolbar .rtbUL {
  display: flex !important;
  position: relative !important;
}

:root.-sf-integrated-app .sfPageEditor:not(.sfTemplateEditor) .RadToolBar.sfLayoutToolbar .rtbItem:last-child::after {
  content: "";
  display: block;
  position: absolute;
  left: 50%;
  bottom: -1px;
  width: 50%;
  height: 2px;
  background-color: #777;
  z-index: 1000 !important;
  transition: left 0.4s;
}

:root.-sf-integrated-app .sfPageEditor:not(.sfTemplateEditor) .RadToolBar.sfLayoutToolbar .rtbItem.rtbChecked + .rtbItem:last-child::after {
  left: 0;
}

:root.-sf-integrated-app .sfPageEditor:not(.sfTemplateEditor) .RadToolBar.sfLayoutToolbar .rtbItem {
  flex-basis: 50%;
}

:root.-sf-integrated-app .sfPageEditor:not(.sfTemplateEditor) .RadToolBar.sfLayoutToolbar .rtbItem .rtbWrap {
  width: 100% !important;
  height: 44px !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: center !important;
  vertical-align: bottom !important;
  line-height: 44px !important;
  border: 0 !important;
  border-bottom: 0 !important;
  color: #006cd9 !important;
  background-color: transparent !important;
  border-radius: 0 !important;
}

:root.-sf-integrated-app .sfPageEditor:not(.sfTemplateEditor) .RadToolBar.sfLayoutToolbar .rtbItemHovered .rtbWrap,
:root.-sf-integrated-app .sfPageEditor:not(.sfTemplateEditor) .RadToolBar.sfLayoutToolbar .rtbItem.rtbChecked .rtbWrap {
  color: #333 !important;
}

:root.-sf-integrated-app .sfPageEditor:not(.sfTemplateEditor) .RadToolBar.sfLayoutToolbar .rtbItem .rtbWrap::before {
  display: none;
}

:root.-sf-integrated-app .sfPageEditor:not(.sfTemplateEditor) .ZoneEditorToolboxContainer {
  background-color: #f5f5f5;
}

:root.-sf-integrated-app .sfPageEditor .sf-loading-wrapper {
  z-index: 1010 !important;
}

:root.-sf-integrated-app .sfPageEditor sf-app .sf-top-toolbar.-page-editor, :root.-sf-integrated-app .sfPageEditor sf-app .sf-top-toolbar.-form-editor {
  z-index: 1000 !important;
}

:root.-sf-integrated-app .sfPageEditor .k-popup .k-list-item-text {
  font-size: 13px;
}

:root.-sf-integrated-app .k-animation-container:has([id^=sf-ai-dropdown]) {
  z-index: 100000000 !important;
}

/* end of Page editor modal overlay */
.-sf-integrated-app {
  --font-size-base: 1.3rem;
  /* Copied from Sitefintiy */
  /* Forms Rules - hide classic page editor when form rules is opened */
  /* stylelint-disable */
  /* Header */
  /* User Links (Top Right) */
  /* Footer */
  /* Site selector */
  /* Centered page  */
  /*Loading*/
  /* Common */
  /* Clear */
  /* Spacing */
  /* Integration Override */
  /* Selector */
  /* Grid Pager */
  /* Override Iris Css */
  /* toolbar */
  /* list and details wrappers */
  /* TODO: Check if sf-notification-wrapper is needed and can be replaced with -fixed modifier only */
  /* Sidebar in List */
  /* Modal Window */
  /* Because of the negative margin of .sf-modal - 26px + 46px */
  /* Icon */
  /* Stand alone navigation */
  /* Hide jquery validation messages in Iris */
  /* Send for tranlation pane*/
  /* Modal window styles*/
  /* end of Modal window styles*/
  /* Kendo overrides */
}

.-sf-integrated-app,
.-sf-integrated-app body,
.-sf-integrated-app body > form {
  margin: 0;
  padding: 0;
  border: 0;
  height: 100%;
}

.-sf-integrated-app body {
  float: left;
  clear: both;
  min-width: 100%;
  /* this is fix for body getting content width when there is horizontal scroll */
  font-family: "Open Sans", Arial, Verdana, sans-serif;
}

.-sf-integrated-app body.sfAdminAppControl {
  overflow-y: auto !important;
}

.-sf-integrated-app body.sfAdminAppControl .sfMessagePane,
.-sf-integrated-app body.sfAdminAppControl .sfPageEditorToolbarWrapper,
.-sf-integrated-app body.sfAdminAppControl .sfPageWrapper,
.-sf-integrated-app body.sfAdminAppControl .sfWarningLangWrapper {
  display: none !important;
}

.-sf-integrated-app string, .-sf-integrated-app b {
  font-family: inherit;
}

.-sf-integrated-app #sfSkip {
  /* stylelint-enable */
  position: absolute;
  left: -1000px;
  top: -1000px;
}

.-sf-integrated-app .sfWrapper {
  min-height: 100%;
  min-width: 1250px;
}

.-sf-integrated-app .sfTopBar a,
.-sf-integrated-app .sfFooter a {
  color: #333;
}

.-sf-integrated-app .sfTopBar a:hover,
.-sf-integrated-app .sfTopBar a:focus,
.-sf-integrated-app .sfFooter a:hover,
.-sf-integrated-app .sfFooter a:focus {
  color: #000;
}

.-sf-integrated-app .sfTopBar {
  display: flex;
  position: absolute;
  top: 0;
  right: calc(100% - 100vw + 20px);
  line-height: 1.2;
  color: var(--sf-topbar-color);
  z-index: 10000;
}

.-sf-integrated-app .sfLogo {
  margin: 0;
  padding: 0;
  width: 142px;
  height: 19px;
  border-bottom: 0;
  position: relative;
  text-indent: -9999px;
  overflow: hidden;
  background: transparent url("/assets/images/ProgressSitefinityCms.min.svg") no-repeat 50% 0;
}

.-sf-integrated-app .sfTopBar .sfLogo {
  margin-top: 12px;
  order: 3;
}

.-sf-integrated-app .sfTopBar .sfInlineBlock {
  vertical-align: top;
}

.-sf-integrated-app div.sfTopBar a.sfLiveSite {
  display: inline-block;
  margin-top: 16px;
  margin-left: 20px;
  color: var(--sf-live-link);
  text-decoration: underline;
  order: 1;
  font-size: 13px;
}

.-sf-integrated-app div.sfTopBar a.sfLiveSite:hover,
.-sf-integrated-app div.sfTopBar a.sfLiveSite:focus {
  color: var(--sf-live-link);
  text-decoration: none;
}

.-sf-integrated-app .sfTopBar .sfHelpLnk {
  display: none;
}

.-sf-integrated-app .sfTopBar .sfLoggedUser {
  position: relative;
  margin-right: 15px;
  order: 2;
  border-right: 1px solid #ddd;
}

.-sf-integrated-app .sfTopBar .sfUserHeader {
  margin: 4px 15px;
  overflow: hidden;
  color: #333;
  text-align: right;
  cursor: pointer;
}

.-sf-integrated-app .sfTopBar .sfUserInfo {
  display: none;
  position: absolute;
  right: 9px;
  margin-top: 0;
  margin-right: -10px;
  margin-bottom: 0;
  padding: 15px 0;
  width: 280px;
  background-color: #fff;
  border: 1px solid var(--sf-user-info-border-color);
  box-shadow: 0 0 3px #e5e5e5;
  font-size: 13px;
}

.-sf-integrated-app .sfTopBar .sfUserHeader img {
  width: 36px;
  height: 36px;
  display: block;
}

.-sf-integrated-app .sfTopBar .sfUserInfo .sfShortInfo .sfProfileName {
  font-size: 16px;
  color: #333;
  margin-bottom: 5px;
}

.-sf-integrated-app .sfTopBar .sfUserInfo .sfShortInfo img {
  float: left;
  width: 64px;
  height: 64px;
  margin-right: 15px;
}

.-sf-integrated-app .sfTopBar .sfOpened .sfUserInfo {
  display: block;
}

.-sf-integrated-app .sfTopBar .sfUserInfo li {
  margin-top: 2px;
  list-style-type: none;
}

.-sf-integrated-app .sfUserInfoSwitchWrp {
  display: flex;
  margin-bottom: 8px;
  margin-top: 8px;
  padding: 8px 15px;
  align-items: center;
  cursor: pointer;
  color: #333;
  border-top: 1px solid #e5e5e5;
  border-bottom: 1px solid #e5e5e5;
}

.-sf-integrated-app .sfTopBar .sfUserInfo .sfUserInfoSwitch {
  color: #666;
  margin-left: auto;
  text-transform: uppercase;
}

.-sf-integrated-app .sfTopBar .sfUserInfoSwitch .sfUserInfoSwitchBtn {
  display: flex;
  align-items: center;
  justify-content: center;
}

.-sf-integrated-app .sfTopBar .sfUserInfoSwitch i {
  position: relative;
  top: -1px;
  font-size: 22px;
  margin-left: 3px;
}

.-sf-integrated-app .sfTopBar .sfUserInfo a {
  padding: 5px 15px;
  display: block;
  text-decoration: none;
}

.-sf-integrated-app .sfTopBar .sfUserInfo a:hover,
.-sf-integrated-app .sfTopBar .sfUserInfo a:focus {
  background-color: #f2f2f2;
}

.-sf-integrated-app .sfTopBar .sfUserHeader img,
.-sf-integrated-app .sfTopBar .sfUserInfo img {
  border-radius: 50%;
}

.-sf-integrated-app .sfFooter {
  display: flex;
  z-index: 2;
  justify-content: space-between;
  align-items: center;
  position: relative;
  margin-top: -35px;
  height: 34px;
  font-size: 12px;
  color: var(--sf-h5-color);
  background-color: #fff;
  border-top: 1px solid #e5e5e5;
  clear: both;
}

.-sf-integrated-app .sfFooter .sfCopy {
  margin-top: 0;
  margin-bottom: 0;
  padding-left: 20px;
}

.-sf-integrated-app .sfFooter .sfSupportLinks {
  margin-top: 0;
  margin-bottom: 0;
  display: inline-flex;
  padding-right: 20px;
}

.-sf-integrated-app .sfFooter .sfSupportLinks li {
  padding-left: 10px;
  padding-right: 10px;
  list-style-type: none;
}

.-sf-integrated-app .sfFooter .sfSupportLinks a {
  text-decoration: underline;
}

.-sf-integrated-app .sfFooter .sfSupportLinks a:hover,
.-sf-integrated-app .sfFooter .sfSupportLinks a:focus {
  text-decoration: none;
}

.-sf-integrated-app .sfSiteSelectorMenuWrp {
  display: inline-block;
  margin-left: -10px;
  height: 40px;
  position: relative;
  top: -2px;
  background-color: #fff;
  z-index: 2951 !important;
}

.-sf-integrated-app .sfSiteSelectorMenuWrp > ul {
  display: none;
}

.-sf-integrated-app div.sfSiteSelectorMenuWrp .clickMenu li.main::after {
  color: var(--sf-navigation-caret);
}

.-sf-integrated-app .sfSiteSelectorMenuWrp .clickMenu div.outerbox {
  border-color: var(--sf-navigation-border-color);
}

.-sf-integrated-app .sfSiteSelectorMenuWrp .clickMenu {
  margin-top: 9px;
}

.-sf-integrated-app a.sfBack {
  display: inline-block;
  vertical-align: top;
  margin-top: 20px;
}

.-sf-integrated-app a.sfBack::before {
  display: inline-block;
  margin-right: 8px;
  font-family: FontAwesome;
  vertical-align: middle;
  content: "\f0a8";
  font-size: 14px;
}

.-sf-integrated-app .sfHeader a.sfBack {
  margin-top: 14px;
  margin-left: 15px;
}

.-sf-integrated-app .sfContentCentered {
  margin-left: auto;
  margin-right: auto;
  padding-bottom: 45px;
  width: 620px;
}

.-sf-integrated-app .sfContentCentered h1.sfBreadCrumb {
  padding: 40px 0 24px;
  font-size: 34px;
  line-height: 1.1;
  font-weight: normal;
  white-space: normal;
}

.-sf-integrated-app h1.sfBreadCrumb .sfBeta {
  padding: 1px 5px;
  position: relative;
  background-color: #69f;
  color: #fff;
  top: -15px;
  font-size: 9px;
  font-family: "open_sanssemibold", Arial, Verdana, sans-serif;
}

.-sf-integrated-app div.RadAjax,
.-sf-integrated-app .k-loading-mask {
  position: fixed !important;
  width: 100% !important;
  height: 2px !important;
  left: 0 !important;
  top: 0 !important;
  text-align: left !important;
  z-index: 9006 !important;
  border-top: 0;
  border-bottom: 0;
  background-color: transparent !important;
  color: #cacfe6 !important;
  overflow: hidden;
}

.-sf-integrated-app .sfWhiteBgDiv {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 9005 !important;
  background-color: #fff !important;
  opacity: 0.1 !important;
  filter: alpha(opacity=10) !important;
}

.-sf-integrated-app div.RadAjax div.raColor,
.-sf-integrated-app .k-loading-mask .k-loading-color {
  position: absolute;
  width: 100%;
  height: 2px;
  background-color: #4cb861;
  background-color: #38ab63;
  animation: loadingAnimation 1s linear infinite;
  transform-origin: 0 0;
}

.-sf-integrated-app div.RadAjax div.raDiv,
.-sf-integrated-app .k-loading-mask .k-loading-text {
  display: none;
}

.-sf-integrated-app .sfGreenMain {
  color: var(--sf-green-main);
}

.-sf-integrated-app .sfMoreDetails {
  color: #666;
  text-decoration: underline;
}

.-sf-integrated-app .sfMoreDetails:hover,
.-sf-integrated-app .sfMoreDetails:focus {
  color: #666;
  text-decoration: none;
}

.-sf-integrated-app .sfOverflowHidden {
  overflow: hidden;
}

.-sf-integrated-app .sfTextEllipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.-sf-integrated-app .sfSuccessTxt {
  color: #4cb861;
}

.-sf-integrated-app .sfBiggerTxt {
  font-size: 15px;
}

.-sf-integrated-app .sfSecondaryTxt {
  color: #666;
}

.-sf-integrated-app .sfMBottom20 {
  margin-bottom: 20px;
}

.-sf-integrated-app .sfMTop35 {
  margin-top: 35px;
}

.-sf-integrated-app .sfBorderList li,
.-sf-integrated-app .sfIrisOnOff .sfBorderList li {
  margin-bottom: 0;
  padding-top: 3px;
  padding-bottom: 3px;
  border-bottom: 1px solid #e4e4e4;
}

.-sf-integrated-app .sfForm,
.-sf-integrated-app .sfIrisOnOff .sfForm {
  margin-top: 15px;
  padding: 20px 30px;
  border-width: 1px;
  border-style: solid;
  border-color: #e4e4e4;
  background-color: #fff;
}

.-sf-integrated-app .sfSimpleLoadingWrp {
  color: #105ab5;
  padding-top: 3px;
  padding-left: 30px;
  background: transparent url("/assets/images/sfLoadingData.gif") no-repeat 0 1px;
  font-family: "open_sanssemibold", Arial, Verdana, sans-serif;
}

.-sf-integrated-app .sfClearer {
  clear: both;
}

.-sf-integrated-app .sfClearfix::before,
.-sf-integrated-app .sfClearfix::after {
  content: "";
  display: table;
}

.-sf-integrated-app .sfClearfix::after {
  clear: both;
}

.-sf-integrated-app .sfMTop10 {
  margin-top: 10px;
}

.-sf-integrated-app .sfHeader {
  position: relative;
  margin-bottom: -46px;
  height: 46px !important;
  box-shadow: 0 3px 5px #eee;
  background-color: #fff;
  z-index: 1000;
}

.-sf-integrated-app .sfIrisOnOff {
  padding-top: 46px;
}

.-sf-integrated-app .sfIrisOnOff h1.sfBreadCrumb {
  font-family: "open_sansregular", Arial, Verdana, sans-serif;
}

.-sf-integrated-app .sfWrapper .sfIrisOnOff h2 {
  font-size: 18px;
  font-family: "open_sansregular", Arial, Verdana, sans-serif;
  color: #333;
}

.-sf-integrated-app .sfIrisOnOff .sfBorderList li {
  padding: 10px 4px;
  list-style-type: none;
}

.-sf-integrated-app .sfIrisOnOff .sfBorderList li:last-child {
  border-bottom: 0;
}

.-sf-integrated-app .sfIrisOnOff button.sf-button.-action {
  background-color: #4cb861;
  border: 0;
}

.-sf-integrated-app .sfIrisOnOff button.sf-button.-action:hover,
.-sf-integrated-app .sfIrisOnOff button.sf-button.-action:focus {
  background-color: #429f55;
}

.-sf-integrated-app .ui-dialog,
.-sf-integrated-app .ui-dialog * {
  box-sizing: content-box;
}

.-sf-integrated-app .sfSelectorDialog h1 {
  padding: 0 0 15px;
  font-size: 10px;
  font-family: "open_sansregular", Arial, Verdana, sans-serif;
  text-transform: uppercase;
  font-weight: normal;
  color: #666;
}

.-sf-integrated-app .sfSelectorDialog .sfSelectorFilters {
  padding: 9px 0 4px;
}

.-sf-integrated-app .sfSelectorDialog .sfSearchBoxSet {
  float: right;
  padding-right: 5px;
  z-index: 700009;
  position: relative;
}

.-sf-integrated-app .sfSelectorDialog.sfSiteSelectorDialog .sfSearchBoxSet {
  float: none;
  padding-right: 0;
}

.-sf-integrated-app .sfSearchBoxSet .sfSearchLbl {
  left: 5px;
  padding: 0;
  position: absolute;
  text-align: left;
  top: 6px;
  color: #999;
  font-style: italic;
  font-weight: normal;
}

.-sf-integrated-app .sfSelectorDialog .sfSelectorFilters .sfTxt {
  padding: 4px 5px;
  width: 190px;
  vertical-align: middle;
  font-family: "open_sansregular", Arial, Verdana, sans-serif;
  font-size: 13px;
  border: 1px solid #ccc;
  border-radius: 0;
}

.-sf-integrated-app .sfSelectorDialog.sfSiteSelectorDialog .sfSearchBoxSet .sfTxt {
  width: calc(100% - 12px);
}

.-sf-integrated-app .sfSelectorDialog .sfSelectorGridWrapper {
  margin-bottom: 10px;
  padding: 10px;
  height: 340px;
  overflow: auto;
  border-width: 1px;
  background-color: #fff;
  border-style: solid;
  border-color: #ccc;
}

.-sf-integrated-app div.RadGrid {
  background-color: transparent;
  font-family: "open_sansregular", Arial, Verdana, sans-serif;
  border: 0;
  color: #333;
  line-height: 16px;
}

.-sf-integrated-app .RadGrid tbody .rgRow,
.-sf-integrated-app .RadGrid tbody .rgAltRow {
  background-color: transparent;
}

.-sf-integrated-app .RadGrid tbody tr.rgHoveredRow:not(.rgSelectedRow),
.-sf-integrated-app .RadGrid tbody tr:hover:not(.rgSelectedRow) {
  background-color: #f9f9f9;
  background-image: none;
  color: #333;
}

.-sf-integrated-app .sfSelectorDialog .RadGrid tbody .rgRow td,
.-sf-integrated-app .sfSelectorDialog .RadGrid tbody .rgAltRow td {
  padding: 5px 7px 8px;
  border: 0;
}

.-sf-integrated-app .sfSelectorDialog .RadGrid tbody .rgRow td.sfCheckBoxCol {
  width: 18px;
}

.-sf-integrated-app .sfSelectorDialog .RadGrid .rgSelectedRow {
  background-image: none;
  background-color: #e6f2f8;
  color: #000;
}

.-sf-integrated-app .sfSelectorDialog .RadGrid .sfItemTitle {
  font-family: "open_sanssemibold", Arial, Verdana, sans-serif;
  font-weight: normal;
  display: block;
  margin-top: -3px;
  line-height: 1.2;
  font-size: 13px;
}

.-sf-integrated-app .sfSelectorDialog .sfSelectorBtns {
  margin-top: 30px;
  padding-top: 15px;
  border-top: 1px solid #e5e5e5;
  color: #666;
  min-height: 30px;
}

.-sf-integrated-app .sfButtonArea .sfLinkBtn {
  margin-right: 5px;
  padding-right: 10px;
  padding-left: 10px;
  display: inline-block;
  min-height: 28px;
  line-height: 27px;
  max-width: 470px;
  vertical-align: middle;
  text-decoration: none;
  border: 1px solid #ccc;
  border-radius: 3px;
  cursor: pointer;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #333;
  background-color: #fff;
  transition: background-color 0.2s;
  font-size: 13px;
}

.-sf-integrated-app .sfButtonArea .sfLinkBtnIn {
  font-weight: normal;
}

.-sf-integrated-app .sfSelectorDialog .sfSave {
  min-width: 50px;
  text-align: center;
  background-color: #4cb861;
  min-height: 30px;
  line-height: 29px;
  border: 0;
  color: #fff;
}

.-sf-integrated-app .sfSelectorDialog .sfCancel {
  padding-left: 3px;
  color: #f00;
}

.-sf-integrated-app div.RadGrid .rgMasterTable .rgPager,
.-sf-integrated-app div.RadGrid .rgMasterTable .rgPager tr:hover .rgPagerCell {
  background-color: #fff;
}

.-sf-integrated-app div.RadGrid .rgMasterTable .rgPager .rgPagerCell {
  border: 0;
}

.-sf-integrated-app div.RadGrid .NumericPages .rgNumPart {
  display: inline-block;
  margin-top: 20px;
  padding-left: 0;
  padding-right: 0;
  font-family: "open_sansregular", Arial, Verdana, sans-serif;
}

.-sf-integrated-app div.RadGrid .rgNumPart a {
  margin-right: 5px;
  padding: 3px 2px;
  min-width: 25px;
  background-image: none;
  text-align: center;
  border-radius: 15px;
  color: #105cb6;
}

.-sf-integrated-app div.RadGrid .rgNumPart a:first-child {
  margin-left: 5px;
}

.-sf-integrated-app div.RadGrid .rgNumPart a:hover {
  background-color: #e6f2f8;
  background-image: none;
  color: #00f;
}

.-sf-integrated-app div.RadGrid .rgNumPart span {
  float: none;
  padding-left: 0;
}

.-sf-integrated-app div.RadGrid.RadGrid .rgNumPart a.rgCurrentPage span,
.-sf-integrated-app div.RadGrid.RadGrid .rgNumPart a.rgCurrentPage:hover span,
.-sf-integrated-app div.RadGrid.RadGrid .rgNumPart a span:hover,
.-sf-integrated-app div.RadGrid.RadGrid .rgNumPart a:hover span {
  background-image: none;
}

.-sf-integrated-app div.RadGrid .rgNumPart a.rgCurrentPage {
  background-image: none;
  color: #000;
  border: 1px solid #d2d2d2;
  padding: 2px;
  background-color: transparent;
}

.-sf-integrated-app div.RadGrid .rgNumPart a.rgCurrentPage:hover {
  background-color: transparent;
}

.-sf-integrated-app div.RadGrid .rgInfoPart {
  margin-top: 23px;
  font-size: 13px;
  color: #656565;
}

.-sf-integrated-app div.RadGrid .rgInfoPart strong {
  color: #4c4e54;
  font-weight: 600;
}

.-sf-integrated-app .sfWrapper .sf-top-toolbar.-integration-list:not(.sf-sticky),
.-sf-integrated-app .-sf-search-centered {
  position: absolute;
  justify-content: center;
  top: 63px;
  left: 50vw;
  margin-left: -260px;
  width: 480px;
  background-color: transparent;
  box-shadow: none;
  z-index: 0;
  z-index: 1;
}

.-sf-integrated-app .sfWrapper .sf-main.-list {
  padding-top: 120px;
  padding-bottom: 270px;
}

.-sf-integrated-app .sfWrapper .sf-main.-backend-renderer {
  display: block;
  padding-top: 86px;
  padding-left: 35px;
  padding-right: 35px;
  transition: none;
}

.-sf-integrated-app .sfWrapper .sf-main.-sf-virtualized {
  padding-bottom: 50px;
}

.-sf-integrated-app .sfWrapper .sf-main.-details {
  position: relative;
  padding-top: 72px;
  min-height: 100vh;
  background-color: #fff;
  z-index: 5;
}

.-sf-integrated-app .sfWrapper .sf-main.-details::after {
  display: block;
  content: "";
  height: 35px;
  width: 100%;
  background-color: #fff;
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: -1;
}

.-sf-integrated-app .sfWrapper .sf-notification-wrapper,
.-sf-integrated-app .sfPageEditor .sf-notification-wrapper {
  top: 60px;
}

.-sf-integrated-app .sfPageEditor .sf-notification-wrapper {
  left: 50%;
  transform: translateX(-50%);
}

.-sf-integrated-app .sfWrapper .sf-wrapper.-list .sf-sidebar::before {
  display: block;
  content: "";
  position: absolute;
  top: -46px;
  right: 0;
  width: 350px;
  height: 46px;
  background-color: #f5f5f5;
  border-top: 1px solid #eee;
  border-left: 1px solid #eee;
  z-index: 100;
}

.-sf-integrated-app .sfWrapper .sf-modal {
  margin-top: -46px;
  width: 100%;
  min-height: 100vh;
}

.-sf-integrated-app .sfWrapper .-sf-centered-vertical-box {
  min-height: calc(100vh - 46px);
}

.-sf-integrated-app .sfWrapper .monaco-editor {
  margin-top: 72px;
}

.-sf-integrated-app .sf-icon.fa {
  display: inline-flex;
  /*font-size: 1.8rem;*/
}

.-sf-integrated-app .sf-menu__icon-box.fa {
  display: block;
  line-height: 130px;
  /*font-size: 4.2rem;*/
}

.-sf-integrated-app .sfWrapper .sf-host.-animated {
  position: relative;
  z-index: 1001;
}

.-sf-integrated-app sf-app .error[generated] {
  display: none !important;
}

.-sf-integrated-app .sfWarningLangWrapper .sfWarningField .sfWarningMsg {
  position: absolute;
  z-index: 100;
  top: 46px;
  margin-top: 11px;
  left: 190px; /* 48px + 50px + 85px */
  max-width: calc(100vw - 500px); /* 48px + 50px + 85px + 280px */
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.-sf-integrated-app.-sf-modal-window-open .modal-open {
  overflow: auto !important;
}

.-sf-integrated-app.-sf-modal-window-open .sfPageEditor {
  overflow: initial;
}

.-sf-integrated-app.-sf-modal-window-open .sfPageEditor .k-calendar .k-calendar-monthview,
.-sf-integrated-app.-sf-modal-window-open .sfPageEditor .k-calendar .k-calendar-view,
.-sf-integrated-app.-sf-modal-window-open .sfPageEditor .k-calendar .k-content.k-scrollable {
  box-sizing: content-box !important;
}

.-sf-integrated-app.-sf-modal-window-open .sfPageWrapper,
.-sf-integrated-app.-sf-modal-window-open .sfMessagePane,
.-sf-integrated-app.-sf-modal-window-open .sfWarningLangWrapper {
  display: none !important;
}

.-sf-integrated-app.-sf-modal-window-open .k-editor-toolbar > li,
.-sf-integrated-app.-sf-modal-window-open .k-colorpicker .k-tool-icon {
  margin: 0;
}

.-sf-integrated-app.-sf-modal-window-open .k-window-titlebar .k-spacer, .-sf-integrated-app.-sf-modal-window-open .k-window-titlebar .k-flex {
  display: none;
}

.-sf-integrated-app.-sf-modal-window-open .k-window-titlebar .k-window-actions {
  margin: 0;
}

.-sf-integrated-app.-sf-modal-window-open .k-picker-wrap .k-select {
  position: static;
}

.-sf-integrated-app.-sf-modal-window-open .sfFooter {
  visibility: hidden;
}

.-sf-integrated-app.-sf-modal-window-open .sf-upload a {
  font-weight: normal;
}

.-sf-integrated-app.-sf-modal-window-open .sf-expander__checkbox,
.-sf-integrated-app.-sf-modal-window-open .sf-checkbox__input,
.-sf-integrated-app.-sf-modal-window-open .sf-radio__input {
  display: inline-flex !important;
}

.-sf-integrated-app.-sf-modal-window-open .sf-expander__header {
  display: inline-block !important;
  padding: 10px 0 !important;
}

.-sf-integrated-app.-sf-modal-window-open .sf-checkbox__label {
  display: flex !important;
  padding: 0 !important;
}

.-sf-integrated-app.-sf-modal-window-open .sf-expander__header::after, .-sf-integrated-app.-sf-modal-window-open .sf-expander__header::before,
.-sf-integrated-app.-sf-modal-window-open .sf-checkbox__label::after,
.-sf-integrated-app.-sf-modal-window-open .sf-checkbox__label::before {
  display: none !important;
}

.-sf-integrated-app.-sf-modal-window-open .sfPageEditor:not(.sfTemplateEditor):not(.-sf-content-block-open) input[type=email]:hover, .-sf-integrated-app.-sf-modal-window-open .sfPageEditor:not(.sfTemplateEditor):not(.-sf-content-block-open) input[type=email]:focus, .-sf-integrated-app.-sf-modal-window-open .sfPageEditor:not(.sfTemplateEditor):not(.-sf-content-block-open) input[type=email]:active,
.-sf-integrated-app.-sf-modal-window-open .sfPageEditor:not(.sfTemplateEditor):not(.-sf-content-block-open) input[type=text]:hover,
.-sf-integrated-app.-sf-modal-window-open .sfPageEditor:not(.sfTemplateEditor):not(.-sf-content-block-open) input[type=text]:focus,
.-sf-integrated-app.-sf-modal-window-open .sfPageEditor:not(.sfTemplateEditor):not(.-sf-content-block-open) input[type=text]:active,
.-sf-integrated-app.-sf-modal-window-open .sfPageEditor:not(.sfTemplateEditor):not(.-sf-content-block-open) textarea:hover,
.-sf-integrated-app.-sf-modal-window-open .sfPageEditor:not(.sfTemplateEditor):not(.-sf-content-block-open) textarea:focus,
.-sf-integrated-app.-sf-modal-window-open .sfPageEditor:not(.sfTemplateEditor):not(.-sf-content-block-open) textarea:active,
.-sf-integrated-app.-sf-modal-window-open .sfPageEditor:not(.sfTemplateEditor):not(.-sf-content-block-open) input[type=tel]:hover,
.-sf-integrated-app.-sf-modal-window-open .sfPageEditor:not(.sfTemplateEditor):not(.-sf-content-block-open) input[type=tel]:focus,
.-sf-integrated-app.-sf-modal-window-open .sfPageEditor:not(.sfTemplateEditor):not(.-sf-content-block-open) input[type=tel]:active,
.-sf-integrated-app.-sf-modal-window-open .sfPageEditor:not(.sfTemplateEditor):not(.-sf-content-block-open) input[type=password]:hover,
.-sf-integrated-app.-sf-modal-window-open .sfPageEditor:not(.sfTemplateEditor):not(.-sf-content-block-open) input[type=password]:focus,
.-sf-integrated-app.-sf-modal-window-open .sfPageEditor:not(.sfTemplateEditor):not(.-sf-content-block-open) input[type=password]:active {
  border: 1px solid var(--input-border-hover) !important;
}

.-sf-integrated-app.-sf-modal-window-open .sfPageEditor:not(.sfTemplateEditor):not(.-sf-content-block-open) .k-editor-toolbar .k-combobox .k-input, .-sf-integrated-app.-sf-modal-window-open .sfPageEditor:not(.sfTemplateEditor):not(.-sf-content-block-open) .k-editor-toolbar .k-combobox .k-input:hover, .-sf-integrated-app.-sf-modal-window-open .sfPageEditor:not(.sfTemplateEditor):not(.-sf-content-block-open) .k-editor-toolbar .k-combobox .k-input:focus, .-sf-integrated-app.-sf-modal-window-open .sfPageEditor:not(.sfTemplateEditor):not(.-sf-content-block-open) .k-editor-toolbar .k-combobox .k-input:active {
  border: 0 !important;
}

.-sf-integrated-app footer.sf-modal-window__buttons.-bottom {
  z-index: 1000;
}

.-sf-integrated-app .k-context-menu *[data-command=tableCellProperties] {
  display: none;
}

.-sf-integrated-app .k-context-menu *[data-command=addRowAbove] {
  display: none;
}

.-sf-integrated-app .k-context-menu *[data-command=addRowBelow] {
  display: none;
}

.-sf-integrated-app .k-context-menu *[data-command=addColumnLeft] {
  display: none;
}

.-sf-integrated-app .k-context-menu *[data-command=addColumnRight] {
  display: none;
}

.-sf-integrated-app .k-context-menu *[data-command=deleteRow] {
  display: none;
}

.-sf-integrated-app .k-context-menu *[data-command=deleteColumn] {
  display: none;
}

.-sf-integrated-app .k-context-menu *[title="Table wizard"] {
  display: none;
}

.-sf-integrated-app .-sf-content-block-open:not(.-sf-new-zone-editor) .sf-editor_table-dialog .k-window-titlebar .k-window-titlebar-actions {
  position: absolute;
  top: -45px;
  right: -285px;
}

.-sf-integrated-app .k-widget.k-window.k-window-maximized {
  overflow: auto !important;
}

.-sf-integrated-app .k-widget.k-datepicker,
.-sf-integrated-app .k-widget .k-state-default > .k-select,
.-sf-integrated-app .k-widget .k-editor-dropdown .k-dropdown-wrap.k-state-default {
  background-color: transparent;
}

.-sf-integrated-app .k-widget.k-datepicker.-small, .-sf-integrated-app .k-widget.k-timepicker.-small {
  width: 105px !important;
}

.-sf-integrated-app .k-widget.k-datepicker.-medium, .-sf-integrated-app .k-widget.k-timepicker.-medium {
  width: 140px !important;
}

.-sf-integrated-app .k-widget .k-picker-wrap.k-state-default {
  background-color: transparent;
}

.-sf-integrated-app .k-widget .k-picker-wrap.k-state-focused, .-sf-integrated-app .k-widget .k-picker-wrap.k-state-active {
  border-radius: 0;
  box-shadow: none;
}

.-sf-integrated-app .k-widget .k-picker-wrap .k-input {
  padding: 0 10px;
}

.-sf-integrated-app .k-widget .k-colorpicker {
  display: inline-flex;
  align-items: center;
  box-shadow: none;
}

.-sf-integrated-app .k-widget .k-colorpicker .k-picker-wrap {
  padding: 0;
  height: 100%;
}

.-sf-integrated-app .k-widget .k-colorpicker .k-select {
  position: static;
}

.-sf-integrated-app .k-widget .k-colorpicker .k-icon {
  display: flex;
  align-items: center;
}

.-sf-integrated-app .k-widget .k-editor-dropdown .k-dropdown-wrap.k-state-default .k-input {
  color: inherit;
}

.-sf-integrated-app .k-widget .k-editor-dropdown .k-dropdown-wrap.k-state-active.k-state-border-down {
  box-shadow: none;
}

.-sf-integrated-app .k-widget .k-editor-dropdown .k-dropdown-wrap .k-input,
.-sf-integrated-app .k-widget .k-editor-dropdown .k-dropdown-wrap .k-select {
  display: flex;
}

.-sf-integrated-app .k-widget .k-editor-dropdown .k-dropdown-wrap .k-input,
.-sf-integrated-app .k-widget .k-editor-dropdown .k-numeric-wrap .k-input,
.-sf-integrated-app .k-widget .k-editor-dropdown .k-textbox,
.-sf-integrated-app .k-widget .k-editor-table-wizard-dialog .k-dropdown-wrap .k-input,
.-sf-integrated-app .k-widget .k-editor-table-wizard-dialog .k-numeric-wrap .k-input,
.-sf-integrated-app .k-widget .k-editor-table-wizard-dialog .k-textbox {
  padding: 4px 0 4px 8px !important;
}

.-sf-integrated-app .k-widget .k-editor-dropdown .k-checkbox,
.-sf-integrated-app .k-widget .k-editor-dropdown .k-checkbox-label,
.-sf-integrated-app .k-widget .k-editor-table-wizard-dialog .k-checkbox,
.-sf-integrated-app .k-widget .k-editor-table-wizard-dialog .k-checkbox-label {
  display: inline-flex !important;
}

.-sf-integrated-app .k-widget .k-editor-dropdown .k-checkbox-label::after,
.-sf-integrated-app .k-widget .k-editor-table-wizard-dialog .k-checkbox-label::after {
  display: none !important;
}

.-sf-integrated-app .k-widget .k-editor-toolbar > li {
  margin-right: 0;
}

.-sf-integrated-app .k-widget .k-editor-toolbar .k-state-selected {
  box-shadow: none;
  background-color: transparent !important;
}

.-sf-integrated-app .k-widget .k-editor-toolbar .k-tool:hover {
  cursor: pointer;
}

.-sf-integrated-app .k-widget .k-editor-table-wizard-dialog .k-window-action .k-icon {
  width: 32px;
  height: 32px;
}

.-sf-integrated-app .k-widget .k-editor-table-wizard-dialog .k-tabstrip-items-wrapper {
  justify-content: center;
}

.-sf-integrated-app .k-widget .k-editor-table-wizard-dialog .k-tabstrip-items-wrapper,
.-sf-integrated-app .k-widget .k-editor-table-wizard-dialog .k-tabstrip-items-wrapper .k-tabstrip-items {
  border: 0;
}

.-sf-integrated-app .k-widget .k-editor-table-wizard-dialog .k-tabstrip-items-wrapper .k-tabstrip {
  font-size: 13px;
}

.-sf-integrated-app .k-widget .k-editor-table-wizard-dialog .k-tabstrip-items-wrapper .k-item {
  background: none;
}

.-sf-integrated-app .k-widget .k-editor-table-wizard-dialog .k-tabstrip-items-wrapper .k-link {
  color: #006cd9;
}

.-sf-integrated-app .k-widget .k-editor-table-wizard-dialog .k-tabstrip-items .k-item.k-state-hover,
.-sf-integrated-app .k-widget .k-editor-table-wizard-dialog .k-dropdown-wrap.k-state-hover {
  background-color: transparent;
}

.-sf-integrated-app .k-widget .k-editor-table-wizard-dialog .k-edit-field .k-textbox,
.-sf-integrated-app .k-widget .k-editor-table-wizard-dialog .k-edit-field .k-dropdown {
  width: 100%;
}

.-sf-integrated-app .k-widget .k-editor-table-wizard-dialog .k-edit-field .k-textbox {
  font-family: "Open Sans", sans-serif;
  border-radius: 0;
}

.-sf-integrated-app .k-widget .k-editor-table-wizard-dialog .k-edit-field .k-numerictextbox + .k-dropdown {
  width: auto;
}

.-sf-integrated-app .k-widget .k-editor-table-wizard-dialog .k-edit-field .k-numeric-wrap,
.-sf-integrated-app .k-widget .k-editor-table-wizard-dialog .k-edit-field .k-dropdown-wrap,
.-sf-integrated-app .k-widget .k-editor-table-wizard-dialog .k-edit-field .k-picker-wrap {
  border-radius: 0;
}

.-sf-integrated-app .k-widget .k-editor-table-wizard-dialog .k-edit-field .k-dropdown-wrap {
  background-color: transparent;
}

.-sf-integrated-app .k-widget .k-editor-table-wizard-dialog .k-edit-field .k-dropdown-wrap.k-state-focused {
  background-color: transparent;
  box-shadow: 0 0 2px rgba(0, 108, 217, 0.8);
}

.-sf-integrated-app .k-widget .k-editor-table-wizard-dialog .k-edit-field .k-dropdown-wrap .k-select,
.-sf-integrated-app .k-widget .k-editor-table-wizard-dialog .k-edit-field .k-numeric-wrap .k-select,
.-sf-integrated-app .k-widget .k-editor-table-wizard-dialog .k-edit-field .k-picker-wrap .k-select {
  position: static;
}

.-sf-integrated-app .k-widget .k-editor-table-wizard-dialog .k-edit-buttons {
  background: transparent;
  border-top-color: var(--sf-color-secondary-lighter, #e4e4e4);
}

.-sf-integrated-app .k-widget .k-editor-table-wizard-dialog .k-tabstrip-wrapper .k-content {
  height: auto;
}

.-sf-integrated-app .k-animation-container .k-list-container.k-state-border-up .k-list .k-item {
  display: flex;
}

.-sf-integrated-app .k-animation-container .k-list-container.k-state-border-up .k-list .k-item:last-child {
  display: flex;
}

.-sf-integrated-app .k-animation-container .k-list-container.k-state-border-up .k-list .k-item.k-state-focused {
  background-color: transparent;
}

/* Outline styles */
body:not(.-sf-outline) :focus {
  outline: 0;
}

body:not(.-sf-outline) button::-moz-focus-inner,
body:not(.-sf-outline) input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

.-sf-outline .sf-checkbox__input:focus + label .sf-radio__icon,
.-sf-outline .sf-checkbox__input:focus + label .sf-checkbox__icon,
.-sf-outline .sf-radio__input:focus + label .sf-radio__icon,
.-sf-outline .sf-radio__input:focus + label .sf-checkbox__icon {
  outline: 1px auto #4d90fe;
}

.-sf-outline .sf-input-file input:focus + label .sf-button {
  outline: 1px auto #4d90fe;
}

.-sf-outline a.k-tool:focus,
.-sf-outline .k-dropdown.k-widget:focus {
  outline: 1px auto #4d90fe;
}

.-sf-outline.sfPageEditor:not(.sfTemplateEditor) .sf-input input:focus,
.-sf-outline.sfPageEditor:not(.sfTemplateEditor) .sf-input textarea:focus {
  box-shadow: 0 0 2px rgba(0, 108, 217, 0.8) !important;
}
@keyframes loadingAnimation {
  0% {
    transform: scaleX(0);
  }
  50% {
    transform: scaleX(1);
  }
  100% {
    transform: translateX(100%);
  }
}
.sfInitialAdminAppLoading .sf-loader.-home.-initial,
sf-app:empty + .sf-loader.-home.-initial {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #fff;
  z-index: 100000;
  opacity: 1;
}

.sf-loader.-home.-initial {
  display: none;
  opacity: 0;
}

.sf-loader.-home.-initial .sf-loader__content {
  display: flex;
  align-items: center;
  justify-content: center;
}

.sf-loader.-home.-initial .sf-loader__rect {
  margin-right: 1px;
  width: 10px;
  height: 10px;
  border-radius: 2px;
  background-color: #38ab63;
  opacity: 0;
  animation: indexLoader 1s infinite ease-in-out;
}

.sf-loader.-home.-initial .sf-loader__rect.-first {
  animation-delay: 2s;
}

.sf-loader.-home.-initial .sf-loader__rect.-second {
  animation-delay: 2.1s;
}

.sf-loader.-home.-initial .sf-loader__rect.-third {
  animation-delay: 2.1s;
}

@keyframes indexLoader {
  0% {
    opacity: 0.3;
  }
  40% {
    opacity: 1;
  }
  100% {
    opacity: 0.3;
  }
}
