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

/* docara-shell-source: runtime/utility/border-radius/default/css/default.css */
@layer sf.utilities {
  .radius-0 {
    border-radius: var(--sf-radius-0);
  }
  .radius-1\/3 {
    border-radius: var(--sf-radius-1\/3);
  }
  .radius-1\/2 {
    border-radius: var(--sf-radius-1\/2);
  }
  .radius-1 {
    border-radius: var(--sf-radius-1);
  }
  .radius-2 {
    border-radius: var(--sf-radius-2);
  }
  .radius-3 {
    border-radius: var(--sf-radius-3);
  }
  .radius-4 {
    border-radius: var(--sf-radius-4);
  }
  .radius-default {
    border-radius: var(--sf-radius-default);
  }
  .radius-ui {
    border-radius: var(--sf-radius--ui);
  }
  .radius-surface {
    border-radius: var(--sf-radius--surface);
  }
  .radius-square {
    border-radius: var(--sf-radius-square);
  }
  .radius-rounded {
    border-radius: var(--sf-radius-rounded);
  }
  .radius-round {
    border-radius: var(--sf-radius-round);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-0 {
    border-top-left-radius: var(--sf-radius-0);
  }
  @supports not (border-start-start-radius: initial) {
  html:not([dir="rtl"]) .radius-top-0 {
    border-top-left-radius: var(--sf-radius-0);
    }
  }
  .radius-top-0:where(:dir(ltr)) {
    border-top-left-radius: var(--sf-radius-0);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-0 {
    border-top-right-radius: var(--sf-radius-0);
  }
  @supports not (border-start-start-radius: initial) {
  [dir="rtl"] .radius-top-0 {
    border-top-right-radius: var(--sf-radius-0);
    }
  }
  .radius-top-0:where(:dir(rtl)) {
    border-top-right-radius: var(--sf-radius-0);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-0 {
    border-top-right-radius: var(--sf-radius-0);
  }
  @supports not (border-start-end-radius: initial) {
  html:not([dir="rtl"]) .radius-top-0 {
    border-top-right-radius: var(--sf-radius-0);
    }
  }
  .radius-top-0:where(:dir(ltr)) {
    border-top-right-radius: var(--sf-radius-0);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-0 {
    border-top-left-radius: var(--sf-radius-0);
  }
  @supports not (border-start-end-radius: initial) {
  [dir="rtl"] .radius-top-0 {
    border-top-left-radius: var(--sf-radius-0);
    }
  }
  .radius-top-0:where(:dir(rtl)) {
    border-top-left-radius: var(--sf-radius-0);
  }
  .radius-top-0 {
    border-start-start-radius: var(--sf-radius-0);
    border-start-end-radius: var(--sf-radius-0);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-0 {
    border-bottom-left-radius: var(--sf-radius-0);
  }
  @supports not (border-end-start-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-0 {
    border-bottom-left-radius: var(--sf-radius-0);
    }
  }
  .radius-bottom-0:where(:dir(ltr)) {
    border-bottom-left-radius: var(--sf-radius-0);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-0 {
    border-bottom-right-radius: var(--sf-radius-0);
  }
  @supports not (border-end-start-radius: initial) {
  [dir="rtl"] .radius-bottom-0 {
    border-bottom-right-radius: var(--sf-radius-0);
    }
  }
  .radius-bottom-0:where(:dir(rtl)) {
    border-bottom-right-radius: var(--sf-radius-0);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-0 {
    border-bottom-right-radius: var(--sf-radius-0);
  }
  @supports not (border-end-end-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-0 {
    border-bottom-right-radius: var(--sf-radius-0);
    }
  }
  .radius-bottom-0:where(:dir(ltr)) {
    border-bottom-right-radius: var(--sf-radius-0);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-0 {
    border-bottom-left-radius: var(--sf-radius-0);
  }
  @supports not (border-end-end-radius: initial) {
  [dir="rtl"] .radius-bottom-0 {
    border-bottom-left-radius: var(--sf-radius-0);
    }
  }
  .radius-bottom-0:where(:dir(rtl)) {
    border-bottom-left-radius: var(--sf-radius-0);
  }
  .radius-bottom-0 {
    border-end-start-radius: var(--sf-radius-0);
    border-end-end-radius: var(--sf-radius-0);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-start-0 {
    border-top-left-radius: var(--sf-radius-0);
  }
  @supports not (border-start-start-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-start-0 {
    border-top-left-radius: var(--sf-radius-0);
    }
  }
  .radius-inline-start-0:where(:dir(ltr)) {
    border-top-left-radius: var(--sf-radius-0);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-start-0 {
    border-top-right-radius: var(--sf-radius-0);
  }
  @supports not (border-start-start-radius: initial) {
  [dir="rtl"] .radius-inline-start-0 {
    border-top-right-radius: var(--sf-radius-0);
    }
  }
  .radius-inline-start-0:where(:dir(rtl)) {
    border-top-right-radius: var(--sf-radius-0);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-start-0 {
    border-bottom-left-radius: var(--sf-radius-0);
  }
  @supports not (border-end-start-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-start-0 {
    border-bottom-left-radius: var(--sf-radius-0);
    }
  }
  .radius-inline-start-0:where(:dir(ltr)) {
    border-bottom-left-radius: var(--sf-radius-0);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-start-0 {
    border-bottom-right-radius: var(--sf-radius-0);
  }
  @supports not (border-end-start-radius: initial) {
  [dir="rtl"] .radius-inline-start-0 {
    border-bottom-right-radius: var(--sf-radius-0);
    }
  }
  .radius-inline-start-0:where(:dir(rtl)) {
    border-bottom-right-radius: var(--sf-radius-0);
  }
  .radius-inline-start-0 {
    border-start-start-radius: var(--sf-radius-0);
    border-end-start-radius: var(--sf-radius-0);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-end-0 {
    border-top-right-radius: var(--sf-radius-0);
  }
  @supports not (border-start-end-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-end-0 {
    border-top-right-radius: var(--sf-radius-0);
    }
  }
  .radius-inline-end-0:where(:dir(ltr)) {
    border-top-right-radius: var(--sf-radius-0);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-end-0 {
    border-top-left-radius: var(--sf-radius-0);
  }
  @supports not (border-start-end-radius: initial) {
  [dir="rtl"] .radius-inline-end-0 {
    border-top-left-radius: var(--sf-radius-0);
    }
  }
  .radius-inline-end-0:where(:dir(rtl)) {
    border-top-left-radius: var(--sf-radius-0);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-end-0 {
    border-bottom-right-radius: var(--sf-radius-0);
  }
  @supports not (border-end-end-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-end-0 {
    border-bottom-right-radius: var(--sf-radius-0);
    }
  }
  .radius-inline-end-0:where(:dir(ltr)) {
    border-bottom-right-radius: var(--sf-radius-0);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-end-0 {
    border-bottom-left-radius: var(--sf-radius-0);
  }
  @supports not (border-end-end-radius: initial) {
  [dir="rtl"] .radius-inline-end-0 {
    border-bottom-left-radius: var(--sf-radius-0);
    }
  }
  .radius-inline-end-0:where(:dir(rtl)) {
    border-bottom-left-radius: var(--sf-radius-0);
  }
  .radius-inline-end-0 {
    border-start-end-radius: var(--sf-radius-0);
    border-end-end-radius: var(--sf-radius-0);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-inline-start-0 {
    border-top-left-radius: var(--sf-radius-0);
  }
  @supports not (border-start-start-radius: initial) {
  html:not([dir="rtl"]) .radius-top-inline-start-0 {
    border-top-left-radius: var(--sf-radius-0);
    }
  }
  .radius-top-inline-start-0:where(:dir(ltr)) {
    border-top-left-radius: var(--sf-radius-0);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-inline-start-0 {
    border-top-right-radius: var(--sf-radius-0);
  }
  @supports not (border-start-start-radius: initial) {
  [dir="rtl"] .radius-top-inline-start-0 {
    border-top-right-radius: var(--sf-radius-0);
    }
  }
  .radius-top-inline-start-0:where(:dir(rtl)) {
    border-top-right-radius: var(--sf-radius-0);
  }
  .radius-top-inline-start-0 {
    border-start-start-radius: var(--sf-radius-0);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-inline-end-0 {
    border-top-right-radius: var(--sf-radius-0);
  }
  @supports not (border-start-end-radius: initial) {
  html:not([dir="rtl"]) .radius-top-inline-end-0 {
    border-top-right-radius: var(--sf-radius-0);
    }
  }
  .radius-top-inline-end-0:where(:dir(ltr)) {
    border-top-right-radius: var(--sf-radius-0);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-inline-end-0 {
    border-top-left-radius: var(--sf-radius-0);
  }
  @supports not (border-start-end-radius: initial) {
  [dir="rtl"] .radius-top-inline-end-0 {
    border-top-left-radius: var(--sf-radius-0);
    }
  }
  .radius-top-inline-end-0:where(:dir(rtl)) {
    border-top-left-radius: var(--sf-radius-0);
  }
  .radius-top-inline-end-0 {
    border-start-end-radius: var(--sf-radius-0);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-inline-start-0 {
    border-bottom-left-radius: var(--sf-radius-0);
  }
  @supports not (border-end-start-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-inline-start-0 {
    border-bottom-left-radius: var(--sf-radius-0);
    }
  }
  .radius-bottom-inline-start-0:where(:dir(ltr)) {
    border-bottom-left-radius: var(--sf-radius-0);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-inline-start-0 {
    border-bottom-right-radius: var(--sf-radius-0);
  }
  @supports not (border-end-start-radius: initial) {
  [dir="rtl"] .radius-bottom-inline-start-0 {
    border-bottom-right-radius: var(--sf-radius-0);
    }
  }
  .radius-bottom-inline-start-0:where(:dir(rtl)) {
    border-bottom-right-radius: var(--sf-radius-0);
  }
  .radius-bottom-inline-start-0 {
    border-end-start-radius: var(--sf-radius-0);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-inline-end-0 {
    border-bottom-right-radius: var(--sf-radius-0);
  }
  @supports not (border-end-end-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-inline-end-0 {
    border-bottom-right-radius: var(--sf-radius-0);
    }
  }
  .radius-bottom-inline-end-0:where(:dir(ltr)) {
    border-bottom-right-radius: var(--sf-radius-0);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-inline-end-0 {
    border-bottom-left-radius: var(--sf-radius-0);
  }
  @supports not (border-end-end-radius: initial) {
  [dir="rtl"] .radius-bottom-inline-end-0 {
    border-bottom-left-radius: var(--sf-radius-0);
    }
  }
  .radius-bottom-inline-end-0:where(:dir(rtl)) {
    border-bottom-left-radius: var(--sf-radius-0);
  }
  .radius-bottom-inline-end-0 {
    border-end-end-radius: var(--sf-radius-0);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-1\/3 {
    border-top-left-radius: var(--sf-radius-1\/3);
  }
  @supports not (border-start-start-radius: initial) {
  html:not([dir="rtl"]) .radius-top-1\/3 {
    border-top-left-radius: var(--sf-radius-1\/3);
    }
  }
  .radius-top-1\/3:where(:dir(ltr)) {
    border-top-left-radius: var(--sf-radius-1\/3);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-1\/3 {
    border-top-right-radius: var(--sf-radius-1\/3);
  }
  @supports not (border-start-start-radius: initial) {
  [dir="rtl"] .radius-top-1\/3 {
    border-top-right-radius: var(--sf-radius-1\/3);
    }
  }
  .radius-top-1\/3:where(:dir(rtl)) {
    border-top-right-radius: var(--sf-radius-1\/3);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-1\/3 {
    border-top-right-radius: var(--sf-radius-1\/3);
  }
  @supports not (border-start-end-radius: initial) {
  html:not([dir="rtl"]) .radius-top-1\/3 {
    border-top-right-radius: var(--sf-radius-1\/3);
    }
  }
  .radius-top-1\/3:where(:dir(ltr)) {
    border-top-right-radius: var(--sf-radius-1\/3);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-1\/3 {
    border-top-left-radius: var(--sf-radius-1\/3);
  }
  @supports not (border-start-end-radius: initial) {
  [dir="rtl"] .radius-top-1\/3 {
    border-top-left-radius: var(--sf-radius-1\/3);
    }
  }
  .radius-top-1\/3:where(:dir(rtl)) {
    border-top-left-radius: var(--sf-radius-1\/3);
  }
  .radius-top-1\/3 {
    border-start-start-radius: var(--sf-radius-1\/3);
    border-start-end-radius: var(--sf-radius-1\/3);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-1\/3 {
    border-bottom-left-radius: var(--sf-radius-1\/3);
  }
  @supports not (border-end-start-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-1\/3 {
    border-bottom-left-radius: var(--sf-radius-1\/3);
    }
  }
  .radius-bottom-1\/3:where(:dir(ltr)) {
    border-bottom-left-radius: var(--sf-radius-1\/3);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-1\/3 {
    border-bottom-right-radius: var(--sf-radius-1\/3);
  }
  @supports not (border-end-start-radius: initial) {
  [dir="rtl"] .radius-bottom-1\/3 {
    border-bottom-right-radius: var(--sf-radius-1\/3);
    }
  }
  .radius-bottom-1\/3:where(:dir(rtl)) {
    border-bottom-right-radius: var(--sf-radius-1\/3);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-1\/3 {
    border-bottom-right-radius: var(--sf-radius-1\/3);
  }
  @supports not (border-end-end-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-1\/3 {
    border-bottom-right-radius: var(--sf-radius-1\/3);
    }
  }
  .radius-bottom-1\/3:where(:dir(ltr)) {
    border-bottom-right-radius: var(--sf-radius-1\/3);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-1\/3 {
    border-bottom-left-radius: var(--sf-radius-1\/3);
  }
  @supports not (border-end-end-radius: initial) {
  [dir="rtl"] .radius-bottom-1\/3 {
    border-bottom-left-radius: var(--sf-radius-1\/3);
    }
  }
  .radius-bottom-1\/3:where(:dir(rtl)) {
    border-bottom-left-radius: var(--sf-radius-1\/3);
  }
  .radius-bottom-1\/3 {
    border-end-start-radius: var(--sf-radius-1\/3);
    border-end-end-radius: var(--sf-radius-1\/3);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-start-1\/3 {
    border-top-left-radius: var(--sf-radius-1\/3);
  }
  @supports not (border-start-start-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-start-1\/3 {
    border-top-left-radius: var(--sf-radius-1\/3);
    }
  }
  .radius-inline-start-1\/3:where(:dir(ltr)) {
    border-top-left-radius: var(--sf-radius-1\/3);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-start-1\/3 {
    border-top-right-radius: var(--sf-radius-1\/3);
  }
  @supports not (border-start-start-radius: initial) {
  [dir="rtl"] .radius-inline-start-1\/3 {
    border-top-right-radius: var(--sf-radius-1\/3);
    }
  }
  .radius-inline-start-1\/3:where(:dir(rtl)) {
    border-top-right-radius: var(--sf-radius-1\/3);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-start-1\/3 {
    border-bottom-left-radius: var(--sf-radius-1\/3);
  }
  @supports not (border-end-start-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-start-1\/3 {
    border-bottom-left-radius: var(--sf-radius-1\/3);
    }
  }
  .radius-inline-start-1\/3:where(:dir(ltr)) {
    border-bottom-left-radius: var(--sf-radius-1\/3);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-start-1\/3 {
    border-bottom-right-radius: var(--sf-radius-1\/3);
  }
  @supports not (border-end-start-radius: initial) {
  [dir="rtl"] .radius-inline-start-1\/3 {
    border-bottom-right-radius: var(--sf-radius-1\/3);
    }
  }
  .radius-inline-start-1\/3:where(:dir(rtl)) {
    border-bottom-right-radius: var(--sf-radius-1\/3);
  }
  .radius-inline-start-1\/3 {
    border-start-start-radius: var(--sf-radius-1\/3);
    border-end-start-radius: var(--sf-radius-1\/3);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-end-1\/3 {
    border-top-right-radius: var(--sf-radius-1\/3);
  }
  @supports not (border-start-end-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-end-1\/3 {
    border-top-right-radius: var(--sf-radius-1\/3);
    }
  }
  .radius-inline-end-1\/3:where(:dir(ltr)) {
    border-top-right-radius: var(--sf-radius-1\/3);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-end-1\/3 {
    border-top-left-radius: var(--sf-radius-1\/3);
  }
  @supports not (border-start-end-radius: initial) {
  [dir="rtl"] .radius-inline-end-1\/3 {
    border-top-left-radius: var(--sf-radius-1\/3);
    }
  }
  .radius-inline-end-1\/3:where(:dir(rtl)) {
    border-top-left-radius: var(--sf-radius-1\/3);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-end-1\/3 {
    border-bottom-right-radius: var(--sf-radius-1\/3);
  }
  @supports not (border-end-end-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-end-1\/3 {
    border-bottom-right-radius: var(--sf-radius-1\/3);
    }
  }
  .radius-inline-end-1\/3:where(:dir(ltr)) {
    border-bottom-right-radius: var(--sf-radius-1\/3);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-end-1\/3 {
    border-bottom-left-radius: var(--sf-radius-1\/3);
  }
  @supports not (border-end-end-radius: initial) {
  [dir="rtl"] .radius-inline-end-1\/3 {
    border-bottom-left-radius: var(--sf-radius-1\/3);
    }
  }
  .radius-inline-end-1\/3:where(:dir(rtl)) {
    border-bottom-left-radius: var(--sf-radius-1\/3);
  }
  .radius-inline-end-1\/3 {
    border-start-end-radius: var(--sf-radius-1\/3);
    border-end-end-radius: var(--sf-radius-1\/3);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-inline-start-1\/3 {
    border-top-left-radius: var(--sf-radius-1\/3);
  }
  @supports not (border-start-start-radius: initial) {
  html:not([dir="rtl"]) .radius-top-inline-start-1\/3 {
    border-top-left-radius: var(--sf-radius-1\/3);
    }
  }
  .radius-top-inline-start-1\/3:where(:dir(ltr)) {
    border-top-left-radius: var(--sf-radius-1\/3);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-inline-start-1\/3 {
    border-top-right-radius: var(--sf-radius-1\/3);
  }
  @supports not (border-start-start-radius: initial) {
  [dir="rtl"] .radius-top-inline-start-1\/3 {
    border-top-right-radius: var(--sf-radius-1\/3);
    }
  }
  .radius-top-inline-start-1\/3:where(:dir(rtl)) {
    border-top-right-radius: var(--sf-radius-1\/3);
  }
  .radius-top-inline-start-1\/3 {
    border-start-start-radius: var(--sf-radius-1\/3);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-inline-end-1\/3 {
    border-top-right-radius: var(--sf-radius-1\/3);
  }
  @supports not (border-start-end-radius: initial) {
  html:not([dir="rtl"]) .radius-top-inline-end-1\/3 {
    border-top-right-radius: var(--sf-radius-1\/3);
    }
  }
  .radius-top-inline-end-1\/3:where(:dir(ltr)) {
    border-top-right-radius: var(--sf-radius-1\/3);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-inline-end-1\/3 {
    border-top-left-radius: var(--sf-radius-1\/3);
  }
  @supports not (border-start-end-radius: initial) {
  [dir="rtl"] .radius-top-inline-end-1\/3 {
    border-top-left-radius: var(--sf-radius-1\/3);
    }
  }
  .radius-top-inline-end-1\/3:where(:dir(rtl)) {
    border-top-left-radius: var(--sf-radius-1\/3);
  }
  .radius-top-inline-end-1\/3 {
    border-start-end-radius: var(--sf-radius-1\/3);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-inline-start-1\/3 {
    border-bottom-left-radius: var(--sf-radius-1\/3);
  }
  @supports not (border-end-start-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-inline-start-1\/3 {
    border-bottom-left-radius: var(--sf-radius-1\/3);
    }
  }
  .radius-bottom-inline-start-1\/3:where(:dir(ltr)) {
    border-bottom-left-radius: var(--sf-radius-1\/3);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-inline-start-1\/3 {
    border-bottom-right-radius: var(--sf-radius-1\/3);
  }
  @supports not (border-end-start-radius: initial) {
  [dir="rtl"] .radius-bottom-inline-start-1\/3 {
    border-bottom-right-radius: var(--sf-radius-1\/3);
    }
  }
  .radius-bottom-inline-start-1\/3:where(:dir(rtl)) {
    border-bottom-right-radius: var(--sf-radius-1\/3);
  }
  .radius-bottom-inline-start-1\/3 {
    border-end-start-radius: var(--sf-radius-1\/3);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-inline-end-1\/3 {
    border-bottom-right-radius: var(--sf-radius-1\/3);
  }
  @supports not (border-end-end-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-inline-end-1\/3 {
    border-bottom-right-radius: var(--sf-radius-1\/3);
    }
  }
  .radius-bottom-inline-end-1\/3:where(:dir(ltr)) {
    border-bottom-right-radius: var(--sf-radius-1\/3);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-inline-end-1\/3 {
    border-bottom-left-radius: var(--sf-radius-1\/3);
  }
  @supports not (border-end-end-radius: initial) {
  [dir="rtl"] .radius-bottom-inline-end-1\/3 {
    border-bottom-left-radius: var(--sf-radius-1\/3);
    }
  }
  .radius-bottom-inline-end-1\/3:where(:dir(rtl)) {
    border-bottom-left-radius: var(--sf-radius-1\/3);
  }
  .radius-bottom-inline-end-1\/3 {
    border-end-end-radius: var(--sf-radius-1\/3);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-1\/2 {
    border-top-left-radius: var(--sf-radius-1\/2);
  }
  @supports not (border-start-start-radius: initial) {
  html:not([dir="rtl"]) .radius-top-1\/2 {
    border-top-left-radius: var(--sf-radius-1\/2);
    }
  }
  .radius-top-1\/2:where(:dir(ltr)) {
    border-top-left-radius: var(--sf-radius-1\/2);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-1\/2 {
    border-top-right-radius: var(--sf-radius-1\/2);
  }
  @supports not (border-start-start-radius: initial) {
  [dir="rtl"] .radius-top-1\/2 {
    border-top-right-radius: var(--sf-radius-1\/2);
    }
  }
  .radius-top-1\/2:where(:dir(rtl)) {
    border-top-right-radius: var(--sf-radius-1\/2);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-1\/2 {
    border-top-right-radius: var(--sf-radius-1\/2);
  }
  @supports not (border-start-end-radius: initial) {
  html:not([dir="rtl"]) .radius-top-1\/2 {
    border-top-right-radius: var(--sf-radius-1\/2);
    }
  }
  .radius-top-1\/2:where(:dir(ltr)) {
    border-top-right-radius: var(--sf-radius-1\/2);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-1\/2 {
    border-top-left-radius: var(--sf-radius-1\/2);
  }
  @supports not (border-start-end-radius: initial) {
  [dir="rtl"] .radius-top-1\/2 {
    border-top-left-radius: var(--sf-radius-1\/2);
    }
  }
  .radius-top-1\/2:where(:dir(rtl)) {
    border-top-left-radius: var(--sf-radius-1\/2);
  }
  .radius-top-1\/2 {
    border-start-start-radius: var(--sf-radius-1\/2);
    border-start-end-radius: var(--sf-radius-1\/2);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-1\/2 {
    border-bottom-left-radius: var(--sf-radius-1\/2);
  }
  @supports not (border-end-start-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-1\/2 {
    border-bottom-left-radius: var(--sf-radius-1\/2);
    }
  }
  .radius-bottom-1\/2:where(:dir(ltr)) {
    border-bottom-left-radius: var(--sf-radius-1\/2);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-1\/2 {
    border-bottom-right-radius: var(--sf-radius-1\/2);
  }
  @supports not (border-end-start-radius: initial) {
  [dir="rtl"] .radius-bottom-1\/2 {
    border-bottom-right-radius: var(--sf-radius-1\/2);
    }
  }
  .radius-bottom-1\/2:where(:dir(rtl)) {
    border-bottom-right-radius: var(--sf-radius-1\/2);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-1\/2 {
    border-bottom-right-radius: var(--sf-radius-1\/2);
  }
  @supports not (border-end-end-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-1\/2 {
    border-bottom-right-radius: var(--sf-radius-1\/2);
    }
  }
  .radius-bottom-1\/2:where(:dir(ltr)) {
    border-bottom-right-radius: var(--sf-radius-1\/2);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-1\/2 {
    border-bottom-left-radius: var(--sf-radius-1\/2);
  }
  @supports not (border-end-end-radius: initial) {
  [dir="rtl"] .radius-bottom-1\/2 {
    border-bottom-left-radius: var(--sf-radius-1\/2);
    }
  }
  .radius-bottom-1\/2:where(:dir(rtl)) {
    border-bottom-left-radius: var(--sf-radius-1\/2);
  }
  .radius-bottom-1\/2 {
    border-end-start-radius: var(--sf-radius-1\/2);
    border-end-end-radius: var(--sf-radius-1\/2);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-start-1\/2 {
    border-top-left-radius: var(--sf-radius-1\/2);
  }
  @supports not (border-start-start-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-start-1\/2 {
    border-top-left-radius: var(--sf-radius-1\/2);
    }
  }
  .radius-inline-start-1\/2:where(:dir(ltr)) {
    border-top-left-radius: var(--sf-radius-1\/2);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-start-1\/2 {
    border-top-right-radius: var(--sf-radius-1\/2);
  }
  @supports not (border-start-start-radius: initial) {
  [dir="rtl"] .radius-inline-start-1\/2 {
    border-top-right-radius: var(--sf-radius-1\/2);
    }
  }
  .radius-inline-start-1\/2:where(:dir(rtl)) {
    border-top-right-radius: var(--sf-radius-1\/2);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-start-1\/2 {
    border-bottom-left-radius: var(--sf-radius-1\/2);
  }
  @supports not (border-end-start-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-start-1\/2 {
    border-bottom-left-radius: var(--sf-radius-1\/2);
    }
  }
  .radius-inline-start-1\/2:where(:dir(ltr)) {
    border-bottom-left-radius: var(--sf-radius-1\/2);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-start-1\/2 {
    border-bottom-right-radius: var(--sf-radius-1\/2);
  }
  @supports not (border-end-start-radius: initial) {
  [dir="rtl"] .radius-inline-start-1\/2 {
    border-bottom-right-radius: var(--sf-radius-1\/2);
    }
  }
  .radius-inline-start-1\/2:where(:dir(rtl)) {
    border-bottom-right-radius: var(--sf-radius-1\/2);
  }
  .radius-inline-start-1\/2 {
    border-start-start-radius: var(--sf-radius-1\/2);
    border-end-start-radius: var(--sf-radius-1\/2);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-end-1\/2 {
    border-top-right-radius: var(--sf-radius-1\/2);
  }
  @supports not (border-start-end-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-end-1\/2 {
    border-top-right-radius: var(--sf-radius-1\/2);
    }
  }
  .radius-inline-end-1\/2:where(:dir(ltr)) {
    border-top-right-radius: var(--sf-radius-1\/2);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-end-1\/2 {
    border-top-left-radius: var(--sf-radius-1\/2);
  }
  @supports not (border-start-end-radius: initial) {
  [dir="rtl"] .radius-inline-end-1\/2 {
    border-top-left-radius: var(--sf-radius-1\/2);
    }
  }
  .radius-inline-end-1\/2:where(:dir(rtl)) {
    border-top-left-radius: var(--sf-radius-1\/2);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-end-1\/2 {
    border-bottom-right-radius: var(--sf-radius-1\/2);
  }
  @supports not (border-end-end-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-end-1\/2 {
    border-bottom-right-radius: var(--sf-radius-1\/2);
    }
  }
  .radius-inline-end-1\/2:where(:dir(ltr)) {
    border-bottom-right-radius: var(--sf-radius-1\/2);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-end-1\/2 {
    border-bottom-left-radius: var(--sf-radius-1\/2);
  }
  @supports not (border-end-end-radius: initial) {
  [dir="rtl"] .radius-inline-end-1\/2 {
    border-bottom-left-radius: var(--sf-radius-1\/2);
    }
  }
  .radius-inline-end-1\/2:where(:dir(rtl)) {
    border-bottom-left-radius: var(--sf-radius-1\/2);
  }
  .radius-inline-end-1\/2 {
    border-start-end-radius: var(--sf-radius-1\/2);
    border-end-end-radius: var(--sf-radius-1\/2);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-inline-start-1\/2 {
    border-top-left-radius: var(--sf-radius-1\/2);
  }
  @supports not (border-start-start-radius: initial) {
  html:not([dir="rtl"]) .radius-top-inline-start-1\/2 {
    border-top-left-radius: var(--sf-radius-1\/2);
    }
  }
  .radius-top-inline-start-1\/2:where(:dir(ltr)) {
    border-top-left-radius: var(--sf-radius-1\/2);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-inline-start-1\/2 {
    border-top-right-radius: var(--sf-radius-1\/2);
  }
  @supports not (border-start-start-radius: initial) {
  [dir="rtl"] .radius-top-inline-start-1\/2 {
    border-top-right-radius: var(--sf-radius-1\/2);
    }
  }
  .radius-top-inline-start-1\/2:where(:dir(rtl)) {
    border-top-right-radius: var(--sf-radius-1\/2);
  }
  .radius-top-inline-start-1\/2 {
    border-start-start-radius: var(--sf-radius-1\/2);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-inline-end-1\/2 {
    border-top-right-radius: var(--sf-radius-1\/2);
  }
  @supports not (border-start-end-radius: initial) {
  html:not([dir="rtl"]) .radius-top-inline-end-1\/2 {
    border-top-right-radius: var(--sf-radius-1\/2);
    }
  }
  .radius-top-inline-end-1\/2:where(:dir(ltr)) {
    border-top-right-radius: var(--sf-radius-1\/2);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-inline-end-1\/2 {
    border-top-left-radius: var(--sf-radius-1\/2);
  }
  @supports not (border-start-end-radius: initial) {
  [dir="rtl"] .radius-top-inline-end-1\/2 {
    border-top-left-radius: var(--sf-radius-1\/2);
    }
  }
  .radius-top-inline-end-1\/2:where(:dir(rtl)) {
    border-top-left-radius: var(--sf-radius-1\/2);
  }
  .radius-top-inline-end-1\/2 {
    border-start-end-radius: var(--sf-radius-1\/2);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-inline-start-1\/2 {
    border-bottom-left-radius: var(--sf-radius-1\/2);
  }
  @supports not (border-end-start-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-inline-start-1\/2 {
    border-bottom-left-radius: var(--sf-radius-1\/2);
    }
  }
  .radius-bottom-inline-start-1\/2:where(:dir(ltr)) {
    border-bottom-left-radius: var(--sf-radius-1\/2);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-inline-start-1\/2 {
    border-bottom-right-radius: var(--sf-radius-1\/2);
  }
  @supports not (border-end-start-radius: initial) {
  [dir="rtl"] .radius-bottom-inline-start-1\/2 {
    border-bottom-right-radius: var(--sf-radius-1\/2);
    }
  }
  .radius-bottom-inline-start-1\/2:where(:dir(rtl)) {
    border-bottom-right-radius: var(--sf-radius-1\/2);
  }
  .radius-bottom-inline-start-1\/2 {
    border-end-start-radius: var(--sf-radius-1\/2);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-inline-end-1\/2 {
    border-bottom-right-radius: var(--sf-radius-1\/2);
  }
  @supports not (border-end-end-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-inline-end-1\/2 {
    border-bottom-right-radius: var(--sf-radius-1\/2);
    }
  }
  .radius-bottom-inline-end-1\/2:where(:dir(ltr)) {
    border-bottom-right-radius: var(--sf-radius-1\/2);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-inline-end-1\/2 {
    border-bottom-left-radius: var(--sf-radius-1\/2);
  }
  @supports not (border-end-end-radius: initial) {
  [dir="rtl"] .radius-bottom-inline-end-1\/2 {
    border-bottom-left-radius: var(--sf-radius-1\/2);
    }
  }
  .radius-bottom-inline-end-1\/2:where(:dir(rtl)) {
    border-bottom-left-radius: var(--sf-radius-1\/2);
  }
  .radius-bottom-inline-end-1\/2 {
    border-end-end-radius: var(--sf-radius-1\/2);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-1 {
    border-top-left-radius: var(--sf-radius-1);
  }
  @supports not (border-start-start-radius: initial) {
  html:not([dir="rtl"]) .radius-top-1 {
    border-top-left-radius: var(--sf-radius-1);
    }
  }
  .radius-top-1:where(:dir(ltr)) {
    border-top-left-radius: var(--sf-radius-1);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-1 {
    border-top-right-radius: var(--sf-radius-1);
  }
  @supports not (border-start-start-radius: initial) {
  [dir="rtl"] .radius-top-1 {
    border-top-right-radius: var(--sf-radius-1);
    }
  }
  .radius-top-1:where(:dir(rtl)) {
    border-top-right-radius: var(--sf-radius-1);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-1 {
    border-top-right-radius: var(--sf-radius-1);
  }
  @supports not (border-start-end-radius: initial) {
  html:not([dir="rtl"]) .radius-top-1 {
    border-top-right-radius: var(--sf-radius-1);
    }
  }
  .radius-top-1:where(:dir(ltr)) {
    border-top-right-radius: var(--sf-radius-1);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-1 {
    border-top-left-radius: var(--sf-radius-1);
  }
  @supports not (border-start-end-radius: initial) {
  [dir="rtl"] .radius-top-1 {
    border-top-left-radius: var(--sf-radius-1);
    }
  }
  .radius-top-1:where(:dir(rtl)) {
    border-top-left-radius: var(--sf-radius-1);
  }
  .radius-top-1 {
    border-start-start-radius: var(--sf-radius-1);
    border-start-end-radius: var(--sf-radius-1);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-1 {
    border-bottom-left-radius: var(--sf-radius-1);
  }
  @supports not (border-end-start-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-1 {
    border-bottom-left-radius: var(--sf-radius-1);
    }
  }
  .radius-bottom-1:where(:dir(ltr)) {
    border-bottom-left-radius: var(--sf-radius-1);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-1 {
    border-bottom-right-radius: var(--sf-radius-1);
  }
  @supports not (border-end-start-radius: initial) {
  [dir="rtl"] .radius-bottom-1 {
    border-bottom-right-radius: var(--sf-radius-1);
    }
  }
  .radius-bottom-1:where(:dir(rtl)) {
    border-bottom-right-radius: var(--sf-radius-1);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-1 {
    border-bottom-right-radius: var(--sf-radius-1);
  }
  @supports not (border-end-end-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-1 {
    border-bottom-right-radius: var(--sf-radius-1);
    }
  }
  .radius-bottom-1:where(:dir(ltr)) {
    border-bottom-right-radius: var(--sf-radius-1);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-1 {
    border-bottom-left-radius: var(--sf-radius-1);
  }
  @supports not (border-end-end-radius: initial) {
  [dir="rtl"] .radius-bottom-1 {
    border-bottom-left-radius: var(--sf-radius-1);
    }
  }
  .radius-bottom-1:where(:dir(rtl)) {
    border-bottom-left-radius: var(--sf-radius-1);
  }
  .radius-bottom-1 {
    border-end-start-radius: var(--sf-radius-1);
    border-end-end-radius: var(--sf-radius-1);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-start-1 {
    border-top-left-radius: var(--sf-radius-1);
  }
  @supports not (border-start-start-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-start-1 {
    border-top-left-radius: var(--sf-radius-1);
    }
  }
  .radius-inline-start-1:where(:dir(ltr)) {
    border-top-left-radius: var(--sf-radius-1);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-start-1 {
    border-top-right-radius: var(--sf-radius-1);
  }
  @supports not (border-start-start-radius: initial) {
  [dir="rtl"] .radius-inline-start-1 {
    border-top-right-radius: var(--sf-radius-1);
    }
  }
  .radius-inline-start-1:where(:dir(rtl)) {
    border-top-right-radius: var(--sf-radius-1);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-start-1 {
    border-bottom-left-radius: var(--sf-radius-1);
  }
  @supports not (border-end-start-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-start-1 {
    border-bottom-left-radius: var(--sf-radius-1);
    }
  }
  .radius-inline-start-1:where(:dir(ltr)) {
    border-bottom-left-radius: var(--sf-radius-1);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-start-1 {
    border-bottom-right-radius: var(--sf-radius-1);
  }
  @supports not (border-end-start-radius: initial) {
  [dir="rtl"] .radius-inline-start-1 {
    border-bottom-right-radius: var(--sf-radius-1);
    }
  }
  .radius-inline-start-1:where(:dir(rtl)) {
    border-bottom-right-radius: var(--sf-radius-1);
  }
  .radius-inline-start-1 {
    border-start-start-radius: var(--sf-radius-1);
    border-end-start-radius: var(--sf-radius-1);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-end-1 {
    border-top-right-radius: var(--sf-radius-1);
  }
  @supports not (border-start-end-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-end-1 {
    border-top-right-radius: var(--sf-radius-1);
    }
  }
  .radius-inline-end-1:where(:dir(ltr)) {
    border-top-right-radius: var(--sf-radius-1);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-end-1 {
    border-top-left-radius: var(--sf-radius-1);
  }
  @supports not (border-start-end-radius: initial) {
  [dir="rtl"] .radius-inline-end-1 {
    border-top-left-radius: var(--sf-radius-1);
    }
  }
  .radius-inline-end-1:where(:dir(rtl)) {
    border-top-left-radius: var(--sf-radius-1);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-end-1 {
    border-bottom-right-radius: var(--sf-radius-1);
  }
  @supports not (border-end-end-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-end-1 {
    border-bottom-right-radius: var(--sf-radius-1);
    }
  }
  .radius-inline-end-1:where(:dir(ltr)) {
    border-bottom-right-radius: var(--sf-radius-1);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-end-1 {
    border-bottom-left-radius: var(--sf-radius-1);
  }
  @supports not (border-end-end-radius: initial) {
  [dir="rtl"] .radius-inline-end-1 {
    border-bottom-left-radius: var(--sf-radius-1);
    }
  }
  .radius-inline-end-1:where(:dir(rtl)) {
    border-bottom-left-radius: var(--sf-radius-1);
  }
  .radius-inline-end-1 {
    border-start-end-radius: var(--sf-radius-1);
    border-end-end-radius: var(--sf-radius-1);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-inline-start-1 {
    border-top-left-radius: var(--sf-radius-1);
  }
  @supports not (border-start-start-radius: initial) {
  html:not([dir="rtl"]) .radius-top-inline-start-1 {
    border-top-left-radius: var(--sf-radius-1);
    }
  }
  .radius-top-inline-start-1:where(:dir(ltr)) {
    border-top-left-radius: var(--sf-radius-1);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-inline-start-1 {
    border-top-right-radius: var(--sf-radius-1);
  }
  @supports not (border-start-start-radius: initial) {
  [dir="rtl"] .radius-top-inline-start-1 {
    border-top-right-radius: var(--sf-radius-1);
    }
  }
  .radius-top-inline-start-1:where(:dir(rtl)) {
    border-top-right-radius: var(--sf-radius-1);
  }
  .radius-top-inline-start-1 {
    border-start-start-radius: var(--sf-radius-1);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-inline-end-1 {
    border-top-right-radius: var(--sf-radius-1);
  }
  @supports not (border-start-end-radius: initial) {
  html:not([dir="rtl"]) .radius-top-inline-end-1 {
    border-top-right-radius: var(--sf-radius-1);
    }
  }
  .radius-top-inline-end-1:where(:dir(ltr)) {
    border-top-right-radius: var(--sf-radius-1);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-inline-end-1 {
    border-top-left-radius: var(--sf-radius-1);
  }
  @supports not (border-start-end-radius: initial) {
  [dir="rtl"] .radius-top-inline-end-1 {
    border-top-left-radius: var(--sf-radius-1);
    }
  }
  .radius-top-inline-end-1:where(:dir(rtl)) {
    border-top-left-radius: var(--sf-radius-1);
  }
  .radius-top-inline-end-1 {
    border-start-end-radius: var(--sf-radius-1);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-inline-start-1 {
    border-bottom-left-radius: var(--sf-radius-1);
  }
  @supports not (border-end-start-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-inline-start-1 {
    border-bottom-left-radius: var(--sf-radius-1);
    }
  }
  .radius-bottom-inline-start-1:where(:dir(ltr)) {
    border-bottom-left-radius: var(--sf-radius-1);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-inline-start-1 {
    border-bottom-right-radius: var(--sf-radius-1);
  }
  @supports not (border-end-start-radius: initial) {
  [dir="rtl"] .radius-bottom-inline-start-1 {
    border-bottom-right-radius: var(--sf-radius-1);
    }
  }
  .radius-bottom-inline-start-1:where(:dir(rtl)) {
    border-bottom-right-radius: var(--sf-radius-1);
  }
  .radius-bottom-inline-start-1 {
    border-end-start-radius: var(--sf-radius-1);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-inline-end-1 {
    border-bottom-right-radius: var(--sf-radius-1);
  }
  @supports not (border-end-end-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-inline-end-1 {
    border-bottom-right-radius: var(--sf-radius-1);
    }
  }
  .radius-bottom-inline-end-1:where(:dir(ltr)) {
    border-bottom-right-radius: var(--sf-radius-1);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-inline-end-1 {
    border-bottom-left-radius: var(--sf-radius-1);
  }
  @supports not (border-end-end-radius: initial) {
  [dir="rtl"] .radius-bottom-inline-end-1 {
    border-bottom-left-radius: var(--sf-radius-1);
    }
  }
  .radius-bottom-inline-end-1:where(:dir(rtl)) {
    border-bottom-left-radius: var(--sf-radius-1);
  }
  .radius-bottom-inline-end-1 {
    border-end-end-radius: var(--sf-radius-1);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-2 {
    border-top-left-radius: var(--sf-radius-2);
  }
  @supports not (border-start-start-radius: initial) {
  html:not([dir="rtl"]) .radius-top-2 {
    border-top-left-radius: var(--sf-radius-2);
    }
  }
  .radius-top-2:where(:dir(ltr)) {
    border-top-left-radius: var(--sf-radius-2);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-2 {
    border-top-right-radius: var(--sf-radius-2);
  }
  @supports not (border-start-start-radius: initial) {
  [dir="rtl"] .radius-top-2 {
    border-top-right-radius: var(--sf-radius-2);
    }
  }
  .radius-top-2:where(:dir(rtl)) {
    border-top-right-radius: var(--sf-radius-2);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-2 {
    border-top-right-radius: var(--sf-radius-2);
  }
  @supports not (border-start-end-radius: initial) {
  html:not([dir="rtl"]) .radius-top-2 {
    border-top-right-radius: var(--sf-radius-2);
    }
  }
  .radius-top-2:where(:dir(ltr)) {
    border-top-right-radius: var(--sf-radius-2);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-2 {
    border-top-left-radius: var(--sf-radius-2);
  }
  @supports not (border-start-end-radius: initial) {
  [dir="rtl"] .radius-top-2 {
    border-top-left-radius: var(--sf-radius-2);
    }
  }
  .radius-top-2:where(:dir(rtl)) {
    border-top-left-radius: var(--sf-radius-2);
  }
  .radius-top-2 {
    border-start-start-radius: var(--sf-radius-2);
    border-start-end-radius: var(--sf-radius-2);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-2 {
    border-bottom-left-radius: var(--sf-radius-2);
  }
  @supports not (border-end-start-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-2 {
    border-bottom-left-radius: var(--sf-radius-2);
    }
  }
  .radius-bottom-2:where(:dir(ltr)) {
    border-bottom-left-radius: var(--sf-radius-2);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-2 {
    border-bottom-right-radius: var(--sf-radius-2);
  }
  @supports not (border-end-start-radius: initial) {
  [dir="rtl"] .radius-bottom-2 {
    border-bottom-right-radius: var(--sf-radius-2);
    }
  }
  .radius-bottom-2:where(:dir(rtl)) {
    border-bottom-right-radius: var(--sf-radius-2);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-2 {
    border-bottom-right-radius: var(--sf-radius-2);
  }
  @supports not (border-end-end-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-2 {
    border-bottom-right-radius: var(--sf-radius-2);
    }
  }
  .radius-bottom-2:where(:dir(ltr)) {
    border-bottom-right-radius: var(--sf-radius-2);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-2 {
    border-bottom-left-radius: var(--sf-radius-2);
  }
  @supports not (border-end-end-radius: initial) {
  [dir="rtl"] .radius-bottom-2 {
    border-bottom-left-radius: var(--sf-radius-2);
    }
  }
  .radius-bottom-2:where(:dir(rtl)) {
    border-bottom-left-radius: var(--sf-radius-2);
  }
  .radius-bottom-2 {
    border-end-start-radius: var(--sf-radius-2);
    border-end-end-radius: var(--sf-radius-2);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-start-2 {
    border-top-left-radius: var(--sf-radius-2);
  }
  @supports not (border-start-start-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-start-2 {
    border-top-left-radius: var(--sf-radius-2);
    }
  }
  .radius-inline-start-2:where(:dir(ltr)) {
    border-top-left-radius: var(--sf-radius-2);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-start-2 {
    border-top-right-radius: var(--sf-radius-2);
  }
  @supports not (border-start-start-radius: initial) {
  [dir="rtl"] .radius-inline-start-2 {
    border-top-right-radius: var(--sf-radius-2);
    }
  }
  .radius-inline-start-2:where(:dir(rtl)) {
    border-top-right-radius: var(--sf-radius-2);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-start-2 {
    border-bottom-left-radius: var(--sf-radius-2);
  }
  @supports not (border-end-start-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-start-2 {
    border-bottom-left-radius: var(--sf-radius-2);
    }
  }
  .radius-inline-start-2:where(:dir(ltr)) {
    border-bottom-left-radius: var(--sf-radius-2);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-start-2 {
    border-bottom-right-radius: var(--sf-radius-2);
  }
  @supports not (border-end-start-radius: initial) {
  [dir="rtl"] .radius-inline-start-2 {
    border-bottom-right-radius: var(--sf-radius-2);
    }
  }
  .radius-inline-start-2:where(:dir(rtl)) {
    border-bottom-right-radius: var(--sf-radius-2);
  }
  .radius-inline-start-2 {
    border-start-start-radius: var(--sf-radius-2);
    border-end-start-radius: var(--sf-radius-2);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-end-2 {
    border-top-right-radius: var(--sf-radius-2);
  }
  @supports not (border-start-end-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-end-2 {
    border-top-right-radius: var(--sf-radius-2);
    }
  }
  .radius-inline-end-2:where(:dir(ltr)) {
    border-top-right-radius: var(--sf-radius-2);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-end-2 {
    border-top-left-radius: var(--sf-radius-2);
  }
  @supports not (border-start-end-radius: initial) {
  [dir="rtl"] .radius-inline-end-2 {
    border-top-left-radius: var(--sf-radius-2);
    }
  }
  .radius-inline-end-2:where(:dir(rtl)) {
    border-top-left-radius: var(--sf-radius-2);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-end-2 {
    border-bottom-right-radius: var(--sf-radius-2);
  }
  @supports not (border-end-end-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-end-2 {
    border-bottom-right-radius: var(--sf-radius-2);
    }
  }
  .radius-inline-end-2:where(:dir(ltr)) {
    border-bottom-right-radius: var(--sf-radius-2);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-end-2 {
    border-bottom-left-radius: var(--sf-radius-2);
  }
  @supports not (border-end-end-radius: initial) {
  [dir="rtl"] .radius-inline-end-2 {
    border-bottom-left-radius: var(--sf-radius-2);
    }
  }
  .radius-inline-end-2:where(:dir(rtl)) {
    border-bottom-left-radius: var(--sf-radius-2);
  }
  .radius-inline-end-2 {
    border-start-end-radius: var(--sf-radius-2);
    border-end-end-radius: var(--sf-radius-2);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-inline-start-2 {
    border-top-left-radius: var(--sf-radius-2);
  }
  @supports not (border-start-start-radius: initial) {
  html:not([dir="rtl"]) .radius-top-inline-start-2 {
    border-top-left-radius: var(--sf-radius-2);
    }
  }
  .radius-top-inline-start-2:where(:dir(ltr)) {
    border-top-left-radius: var(--sf-radius-2);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-inline-start-2 {
    border-top-right-radius: var(--sf-radius-2);
  }
  @supports not (border-start-start-radius: initial) {
  [dir="rtl"] .radius-top-inline-start-2 {
    border-top-right-radius: var(--sf-radius-2);
    }
  }
  .radius-top-inline-start-2:where(:dir(rtl)) {
    border-top-right-radius: var(--sf-radius-2);
  }
  .radius-top-inline-start-2 {
    border-start-start-radius: var(--sf-radius-2);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-inline-end-2 {
    border-top-right-radius: var(--sf-radius-2);
  }
  @supports not (border-start-end-radius: initial) {
  html:not([dir="rtl"]) .radius-top-inline-end-2 {
    border-top-right-radius: var(--sf-radius-2);
    }
  }
  .radius-top-inline-end-2:where(:dir(ltr)) {
    border-top-right-radius: var(--sf-radius-2);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-inline-end-2 {
    border-top-left-radius: var(--sf-radius-2);
  }
  @supports not (border-start-end-radius: initial) {
  [dir="rtl"] .radius-top-inline-end-2 {
    border-top-left-radius: var(--sf-radius-2);
    }
  }
  .radius-top-inline-end-2:where(:dir(rtl)) {
    border-top-left-radius: var(--sf-radius-2);
  }
  .radius-top-inline-end-2 {
    border-start-end-radius: var(--sf-radius-2);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-inline-start-2 {
    border-bottom-left-radius: var(--sf-radius-2);
  }
  @supports not (border-end-start-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-inline-start-2 {
    border-bottom-left-radius: var(--sf-radius-2);
    }
  }
  .radius-bottom-inline-start-2:where(:dir(ltr)) {
    border-bottom-left-radius: var(--sf-radius-2);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-inline-start-2 {
    border-bottom-right-radius: var(--sf-radius-2);
  }
  @supports not (border-end-start-radius: initial) {
  [dir="rtl"] .radius-bottom-inline-start-2 {
    border-bottom-right-radius: var(--sf-radius-2);
    }
  }
  .radius-bottom-inline-start-2:where(:dir(rtl)) {
    border-bottom-right-radius: var(--sf-radius-2);
  }
  .radius-bottom-inline-start-2 {
    border-end-start-radius: var(--sf-radius-2);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-inline-end-2 {
    border-bottom-right-radius: var(--sf-radius-2);
  }
  @supports not (border-end-end-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-inline-end-2 {
    border-bottom-right-radius: var(--sf-radius-2);
    }
  }
  .radius-bottom-inline-end-2:where(:dir(ltr)) {
    border-bottom-right-radius: var(--sf-radius-2);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-inline-end-2 {
    border-bottom-left-radius: var(--sf-radius-2);
  }
  @supports not (border-end-end-radius: initial) {
  [dir="rtl"] .radius-bottom-inline-end-2 {
    border-bottom-left-radius: var(--sf-radius-2);
    }
  }
  .radius-bottom-inline-end-2:where(:dir(rtl)) {
    border-bottom-left-radius: var(--sf-radius-2);
  }
  .radius-bottom-inline-end-2 {
    border-end-end-radius: var(--sf-radius-2);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-3 {
    border-top-left-radius: var(--sf-radius-3);
  }
  @supports not (border-start-start-radius: initial) {
  html:not([dir="rtl"]) .radius-top-3 {
    border-top-left-radius: var(--sf-radius-3);
    }
  }
  .radius-top-3:where(:dir(ltr)) {
    border-top-left-radius: var(--sf-radius-3);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-3 {
    border-top-right-radius: var(--sf-radius-3);
  }
  @supports not (border-start-start-radius: initial) {
  [dir="rtl"] .radius-top-3 {
    border-top-right-radius: var(--sf-radius-3);
    }
  }
  .radius-top-3:where(:dir(rtl)) {
    border-top-right-radius: var(--sf-radius-3);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-3 {
    border-top-right-radius: var(--sf-radius-3);
  }
  @supports not (border-start-end-radius: initial) {
  html:not([dir="rtl"]) .radius-top-3 {
    border-top-right-radius: var(--sf-radius-3);
    }
  }
  .radius-top-3:where(:dir(ltr)) {
    border-top-right-radius: var(--sf-radius-3);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-3 {
    border-top-left-radius: var(--sf-radius-3);
  }
  @supports not (border-start-end-radius: initial) {
  [dir="rtl"] .radius-top-3 {
    border-top-left-radius: var(--sf-radius-3);
    }
  }
  .radius-top-3:where(:dir(rtl)) {
    border-top-left-radius: var(--sf-radius-3);
  }
  .radius-top-3 {
    border-start-start-radius: var(--sf-radius-3);
    border-start-end-radius: var(--sf-radius-3);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-3 {
    border-bottom-left-radius: var(--sf-radius-3);
  }
  @supports not (border-end-start-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-3 {
    border-bottom-left-radius: var(--sf-radius-3);
    }
  }
  .radius-bottom-3:where(:dir(ltr)) {
    border-bottom-left-radius: var(--sf-radius-3);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-3 {
    border-bottom-right-radius: var(--sf-radius-3);
  }
  @supports not (border-end-start-radius: initial) {
  [dir="rtl"] .radius-bottom-3 {
    border-bottom-right-radius: var(--sf-radius-3);
    }
  }
  .radius-bottom-3:where(:dir(rtl)) {
    border-bottom-right-radius: var(--sf-radius-3);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-3 {
    border-bottom-right-radius: var(--sf-radius-3);
  }
  @supports not (border-end-end-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-3 {
    border-bottom-right-radius: var(--sf-radius-3);
    }
  }
  .radius-bottom-3:where(:dir(ltr)) {
    border-bottom-right-radius: var(--sf-radius-3);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-3 {
    border-bottom-left-radius: var(--sf-radius-3);
  }
  @supports not (border-end-end-radius: initial) {
  [dir="rtl"] .radius-bottom-3 {
    border-bottom-left-radius: var(--sf-radius-3);
    }
  }
  .radius-bottom-3:where(:dir(rtl)) {
    border-bottom-left-radius: var(--sf-radius-3);
  }
  .radius-bottom-3 {
    border-end-start-radius: var(--sf-radius-3);
    border-end-end-radius: var(--sf-radius-3);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-start-3 {
    border-top-left-radius: var(--sf-radius-3);
  }
  @supports not (border-start-start-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-start-3 {
    border-top-left-radius: var(--sf-radius-3);
    }
  }
  .radius-inline-start-3:where(:dir(ltr)) {
    border-top-left-radius: var(--sf-radius-3);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-start-3 {
    border-top-right-radius: var(--sf-radius-3);
  }
  @supports not (border-start-start-radius: initial) {
  [dir="rtl"] .radius-inline-start-3 {
    border-top-right-radius: var(--sf-radius-3);
    }
  }
  .radius-inline-start-3:where(:dir(rtl)) {
    border-top-right-radius: var(--sf-radius-3);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-start-3 {
    border-bottom-left-radius: var(--sf-radius-3);
  }
  @supports not (border-end-start-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-start-3 {
    border-bottom-left-radius: var(--sf-radius-3);
    }
  }
  .radius-inline-start-3:where(:dir(ltr)) {
    border-bottom-left-radius: var(--sf-radius-3);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-start-3 {
    border-bottom-right-radius: var(--sf-radius-3);
  }
  @supports not (border-end-start-radius: initial) {
  [dir="rtl"] .radius-inline-start-3 {
    border-bottom-right-radius: var(--sf-radius-3);
    }
  }
  .radius-inline-start-3:where(:dir(rtl)) {
    border-bottom-right-radius: var(--sf-radius-3);
  }
  .radius-inline-start-3 {
    border-start-start-radius: var(--sf-radius-3);
    border-end-start-radius: var(--sf-radius-3);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-end-3 {
    border-top-right-radius: var(--sf-radius-3);
  }
  @supports not (border-start-end-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-end-3 {
    border-top-right-radius: var(--sf-radius-3);
    }
  }
  .radius-inline-end-3:where(:dir(ltr)) {
    border-top-right-radius: var(--sf-radius-3);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-end-3 {
    border-top-left-radius: var(--sf-radius-3);
  }
  @supports not (border-start-end-radius: initial) {
  [dir="rtl"] .radius-inline-end-3 {
    border-top-left-radius: var(--sf-radius-3);
    }
  }
  .radius-inline-end-3:where(:dir(rtl)) {
    border-top-left-radius: var(--sf-radius-3);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-end-3 {
    border-bottom-right-radius: var(--sf-radius-3);
  }
  @supports not (border-end-end-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-end-3 {
    border-bottom-right-radius: var(--sf-radius-3);
    }
  }
  .radius-inline-end-3:where(:dir(ltr)) {
    border-bottom-right-radius: var(--sf-radius-3);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-end-3 {
    border-bottom-left-radius: var(--sf-radius-3);
  }
  @supports not (border-end-end-radius: initial) {
  [dir="rtl"] .radius-inline-end-3 {
    border-bottom-left-radius: var(--sf-radius-3);
    }
  }
  .radius-inline-end-3:where(:dir(rtl)) {
    border-bottom-left-radius: var(--sf-radius-3);
  }
  .radius-inline-end-3 {
    border-start-end-radius: var(--sf-radius-3);
    border-end-end-radius: var(--sf-radius-3);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-inline-start-3 {
    border-top-left-radius: var(--sf-radius-3);
  }
  @supports not (border-start-start-radius: initial) {
  html:not([dir="rtl"]) .radius-top-inline-start-3 {
    border-top-left-radius: var(--sf-radius-3);
    }
  }
  .radius-top-inline-start-3:where(:dir(ltr)) {
    border-top-left-radius: var(--sf-radius-3);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-inline-start-3 {
    border-top-right-radius: var(--sf-radius-3);
  }
  @supports not (border-start-start-radius: initial) {
  [dir="rtl"] .radius-top-inline-start-3 {
    border-top-right-radius: var(--sf-radius-3);
    }
  }
  .radius-top-inline-start-3:where(:dir(rtl)) {
    border-top-right-radius: var(--sf-radius-3);
  }
  .radius-top-inline-start-3 {
    border-start-start-radius: var(--sf-radius-3);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-inline-end-3 {
    border-top-right-radius: var(--sf-radius-3);
  }
  @supports not (border-start-end-radius: initial) {
  html:not([dir="rtl"]) .radius-top-inline-end-3 {
    border-top-right-radius: var(--sf-radius-3);
    }
  }
  .radius-top-inline-end-3:where(:dir(ltr)) {
    border-top-right-radius: var(--sf-radius-3);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-inline-end-3 {
    border-top-left-radius: var(--sf-radius-3);
  }
  @supports not (border-start-end-radius: initial) {
  [dir="rtl"] .radius-top-inline-end-3 {
    border-top-left-radius: var(--sf-radius-3);
    }
  }
  .radius-top-inline-end-3:where(:dir(rtl)) {
    border-top-left-radius: var(--sf-radius-3);
  }
  .radius-top-inline-end-3 {
    border-start-end-radius: var(--sf-radius-3);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-inline-start-3 {
    border-bottom-left-radius: var(--sf-radius-3);
  }
  @supports not (border-end-start-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-inline-start-3 {
    border-bottom-left-radius: var(--sf-radius-3);
    }
  }
  .radius-bottom-inline-start-3:where(:dir(ltr)) {
    border-bottom-left-radius: var(--sf-radius-3);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-inline-start-3 {
    border-bottom-right-radius: var(--sf-radius-3);
  }
  @supports not (border-end-start-radius: initial) {
  [dir="rtl"] .radius-bottom-inline-start-3 {
    border-bottom-right-radius: var(--sf-radius-3);
    }
  }
  .radius-bottom-inline-start-3:where(:dir(rtl)) {
    border-bottom-right-radius: var(--sf-radius-3);
  }
  .radius-bottom-inline-start-3 {
    border-end-start-radius: var(--sf-radius-3);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-inline-end-3 {
    border-bottom-right-radius: var(--sf-radius-3);
  }
  @supports not (border-end-end-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-inline-end-3 {
    border-bottom-right-radius: var(--sf-radius-3);
    }
  }
  .radius-bottom-inline-end-3:where(:dir(ltr)) {
    border-bottom-right-radius: var(--sf-radius-3);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-inline-end-3 {
    border-bottom-left-radius: var(--sf-radius-3);
  }
  @supports not (border-end-end-radius: initial) {
  [dir="rtl"] .radius-bottom-inline-end-3 {
    border-bottom-left-radius: var(--sf-radius-3);
    }
  }
  .radius-bottom-inline-end-3:where(:dir(rtl)) {
    border-bottom-left-radius: var(--sf-radius-3);
  }
  .radius-bottom-inline-end-3 {
    border-end-end-radius: var(--sf-radius-3);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-4 {
    border-top-left-radius: var(--sf-radius-4);
  }
  @supports not (border-start-start-radius: initial) {
  html:not([dir="rtl"]) .radius-top-4 {
    border-top-left-radius: var(--sf-radius-4);
    }
  }
  .radius-top-4:where(:dir(ltr)) {
    border-top-left-radius: var(--sf-radius-4);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-4 {
    border-top-right-radius: var(--sf-radius-4);
  }
  @supports not (border-start-start-radius: initial) {
  [dir="rtl"] .radius-top-4 {
    border-top-right-radius: var(--sf-radius-4);
    }
  }
  .radius-top-4:where(:dir(rtl)) {
    border-top-right-radius: var(--sf-radius-4);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-4 {
    border-top-right-radius: var(--sf-radius-4);
  }
  @supports not (border-start-end-radius: initial) {
  html:not([dir="rtl"]) .radius-top-4 {
    border-top-right-radius: var(--sf-radius-4);
    }
  }
  .radius-top-4:where(:dir(ltr)) {
    border-top-right-radius: var(--sf-radius-4);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-4 {
    border-top-left-radius: var(--sf-radius-4);
  }
  @supports not (border-start-end-radius: initial) {
  [dir="rtl"] .radius-top-4 {
    border-top-left-radius: var(--sf-radius-4);
    }
  }
  .radius-top-4:where(:dir(rtl)) {
    border-top-left-radius: var(--sf-radius-4);
  }
  .radius-top-4 {
    border-start-start-radius: var(--sf-radius-4);
    border-start-end-radius: var(--sf-radius-4);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-4 {
    border-bottom-left-radius: var(--sf-radius-4);
  }
  @supports not (border-end-start-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-4 {
    border-bottom-left-radius: var(--sf-radius-4);
    }
  }
  .radius-bottom-4:where(:dir(ltr)) {
    border-bottom-left-radius: var(--sf-radius-4);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-4 {
    border-bottom-right-radius: var(--sf-radius-4);
  }
  @supports not (border-end-start-radius: initial) {
  [dir="rtl"] .radius-bottom-4 {
    border-bottom-right-radius: var(--sf-radius-4);
    }
  }
  .radius-bottom-4:where(:dir(rtl)) {
    border-bottom-right-radius: var(--sf-radius-4);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-4 {
    border-bottom-right-radius: var(--sf-radius-4);
  }
  @supports not (border-end-end-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-4 {
    border-bottom-right-radius: var(--sf-radius-4);
    }
  }
  .radius-bottom-4:where(:dir(ltr)) {
    border-bottom-right-radius: var(--sf-radius-4);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-4 {
    border-bottom-left-radius: var(--sf-radius-4);
  }
  @supports not (border-end-end-radius: initial) {
  [dir="rtl"] .radius-bottom-4 {
    border-bottom-left-radius: var(--sf-radius-4);
    }
  }
  .radius-bottom-4:where(:dir(rtl)) {
    border-bottom-left-radius: var(--sf-radius-4);
  }
  .radius-bottom-4 {
    border-end-start-radius: var(--sf-radius-4);
    border-end-end-radius: var(--sf-radius-4);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-start-4 {
    border-top-left-radius: var(--sf-radius-4);
  }
  @supports not (border-start-start-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-start-4 {
    border-top-left-radius: var(--sf-radius-4);
    }
  }
  .radius-inline-start-4:where(:dir(ltr)) {
    border-top-left-radius: var(--sf-radius-4);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-start-4 {
    border-top-right-radius: var(--sf-radius-4);
  }
  @supports not (border-start-start-radius: initial) {
  [dir="rtl"] .radius-inline-start-4 {
    border-top-right-radius: var(--sf-radius-4);
    }
  }
  .radius-inline-start-4:where(:dir(rtl)) {
    border-top-right-radius: var(--sf-radius-4);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-start-4 {
    border-bottom-left-radius: var(--sf-radius-4);
  }
  @supports not (border-end-start-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-start-4 {
    border-bottom-left-radius: var(--sf-radius-4);
    }
  }
  .radius-inline-start-4:where(:dir(ltr)) {
    border-bottom-left-radius: var(--sf-radius-4);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-start-4 {
    border-bottom-right-radius: var(--sf-radius-4);
  }
  @supports not (border-end-start-radius: initial) {
  [dir="rtl"] .radius-inline-start-4 {
    border-bottom-right-radius: var(--sf-radius-4);
    }
  }
  .radius-inline-start-4:where(:dir(rtl)) {
    border-bottom-right-radius: var(--sf-radius-4);
  }
  .radius-inline-start-4 {
    border-start-start-radius: var(--sf-radius-4);
    border-end-start-radius: var(--sf-radius-4);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-end-4 {
    border-top-right-radius: var(--sf-radius-4);
  }
  @supports not (border-start-end-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-end-4 {
    border-top-right-radius: var(--sf-radius-4);
    }
  }
  .radius-inline-end-4:where(:dir(ltr)) {
    border-top-right-radius: var(--sf-radius-4);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-end-4 {
    border-top-left-radius: var(--sf-radius-4);
  }
  @supports not (border-start-end-radius: initial) {
  [dir="rtl"] .radius-inline-end-4 {
    border-top-left-radius: var(--sf-radius-4);
    }
  }
  .radius-inline-end-4:where(:dir(rtl)) {
    border-top-left-radius: var(--sf-radius-4);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-end-4 {
    border-bottom-right-radius: var(--sf-radius-4);
  }
  @supports not (border-end-end-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-end-4 {
    border-bottom-right-radius: var(--sf-radius-4);
    }
  }
  .radius-inline-end-4:where(:dir(ltr)) {
    border-bottom-right-radius: var(--sf-radius-4);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-end-4 {
    border-bottom-left-radius: var(--sf-radius-4);
  }
  @supports not (border-end-end-radius: initial) {
  [dir="rtl"] .radius-inline-end-4 {
    border-bottom-left-radius: var(--sf-radius-4);
    }
  }
  .radius-inline-end-4:where(:dir(rtl)) {
    border-bottom-left-radius: var(--sf-radius-4);
  }
  .radius-inline-end-4 {
    border-start-end-radius: var(--sf-radius-4);
    border-end-end-radius: var(--sf-radius-4);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-inline-start-4 {
    border-top-left-radius: var(--sf-radius-4);
  }
  @supports not (border-start-start-radius: initial) {
  html:not([dir="rtl"]) .radius-top-inline-start-4 {
    border-top-left-radius: var(--sf-radius-4);
    }
  }
  .radius-top-inline-start-4:where(:dir(ltr)) {
    border-top-left-radius: var(--sf-radius-4);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-inline-start-4 {
    border-top-right-radius: var(--sf-radius-4);
  }
  @supports not (border-start-start-radius: initial) {
  [dir="rtl"] .radius-top-inline-start-4 {
    border-top-right-radius: var(--sf-radius-4);
    }
  }
  .radius-top-inline-start-4:where(:dir(rtl)) {
    border-top-right-radius: var(--sf-radius-4);
  }
  .radius-top-inline-start-4 {
    border-start-start-radius: var(--sf-radius-4);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-inline-end-4 {
    border-top-right-radius: var(--sf-radius-4);
  }
  @supports not (border-start-end-radius: initial) {
  html:not([dir="rtl"]) .radius-top-inline-end-4 {
    border-top-right-radius: var(--sf-radius-4);
    }
  }
  .radius-top-inline-end-4:where(:dir(ltr)) {
    border-top-right-radius: var(--sf-radius-4);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-inline-end-4 {
    border-top-left-radius: var(--sf-radius-4);
  }
  @supports not (border-start-end-radius: initial) {
  [dir="rtl"] .radius-top-inline-end-4 {
    border-top-left-radius: var(--sf-radius-4);
    }
  }
  .radius-top-inline-end-4:where(:dir(rtl)) {
    border-top-left-radius: var(--sf-radius-4);
  }
  .radius-top-inline-end-4 {
    border-start-end-radius: var(--sf-radius-4);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-inline-start-4 {
    border-bottom-left-radius: var(--sf-radius-4);
  }
  @supports not (border-end-start-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-inline-start-4 {
    border-bottom-left-radius: var(--sf-radius-4);
    }
  }
  .radius-bottom-inline-start-4:where(:dir(ltr)) {
    border-bottom-left-radius: var(--sf-radius-4);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-inline-start-4 {
    border-bottom-right-radius: var(--sf-radius-4);
  }
  @supports not (border-end-start-radius: initial) {
  [dir="rtl"] .radius-bottom-inline-start-4 {
    border-bottom-right-radius: var(--sf-radius-4);
    }
  }
  .radius-bottom-inline-start-4:where(:dir(rtl)) {
    border-bottom-right-radius: var(--sf-radius-4);
  }
  .radius-bottom-inline-start-4 {
    border-end-start-radius: var(--sf-radius-4);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-inline-end-4 {
    border-bottom-right-radius: var(--sf-radius-4);
  }
  @supports not (border-end-end-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-inline-end-4 {
    border-bottom-right-radius: var(--sf-radius-4);
    }
  }
  .radius-bottom-inline-end-4:where(:dir(ltr)) {
    border-bottom-right-radius: var(--sf-radius-4);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-inline-end-4 {
    border-bottom-left-radius: var(--sf-radius-4);
  }
  @supports not (border-end-end-radius: initial) {
  [dir="rtl"] .radius-bottom-inline-end-4 {
    border-bottom-left-radius: var(--sf-radius-4);
    }
  }
  .radius-bottom-inline-end-4:where(:dir(rtl)) {
    border-bottom-left-radius: var(--sf-radius-4);
  }
  .radius-bottom-inline-end-4 {
    border-end-end-radius: var(--sf-radius-4);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-default {
    border-top-left-radius: var(--sf-radius-default);
  }
  @supports not (border-start-start-radius: initial) {
  html:not([dir="rtl"]) .radius-top-default {
    border-top-left-radius: var(--sf-radius-default);
    }
  }
  .radius-top-default:where(:dir(ltr)) {
    border-top-left-radius: var(--sf-radius-default);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-default {
    border-top-right-radius: var(--sf-radius-default);
  }
  @supports not (border-start-start-radius: initial) {
  [dir="rtl"] .radius-top-default {
    border-top-right-radius: var(--sf-radius-default);
    }
  }
  .radius-top-default:where(:dir(rtl)) {
    border-top-right-radius: var(--sf-radius-default);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-default {
    border-top-right-radius: var(--sf-radius-default);
  }
  @supports not (border-start-end-radius: initial) {
  html:not([dir="rtl"]) .radius-top-default {
    border-top-right-radius: var(--sf-radius-default);
    }
  }
  .radius-top-default:where(:dir(ltr)) {
    border-top-right-radius: var(--sf-radius-default);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-default {
    border-top-left-radius: var(--sf-radius-default);
  }
  @supports not (border-start-end-radius: initial) {
  [dir="rtl"] .radius-top-default {
    border-top-left-radius: var(--sf-radius-default);
    }
  }
  .radius-top-default:where(:dir(rtl)) {
    border-top-left-radius: var(--sf-radius-default);
  }
  .radius-top-default {
    border-start-start-radius: var(--sf-radius-default);
    border-start-end-radius: var(--sf-radius-default);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-default {
    border-bottom-left-radius: var(--sf-radius-default);
  }
  @supports not (border-end-start-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-default {
    border-bottom-left-radius: var(--sf-radius-default);
    }
  }
  .radius-bottom-default:where(:dir(ltr)) {
    border-bottom-left-radius: var(--sf-radius-default);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-default {
    border-bottom-right-radius: var(--sf-radius-default);
  }
  @supports not (border-end-start-radius: initial) {
  [dir="rtl"] .radius-bottom-default {
    border-bottom-right-radius: var(--sf-radius-default);
    }
  }
  .radius-bottom-default:where(:dir(rtl)) {
    border-bottom-right-radius: var(--sf-radius-default);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-default {
    border-bottom-right-radius: var(--sf-radius-default);
  }
  @supports not (border-end-end-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-default {
    border-bottom-right-radius: var(--sf-radius-default);
    }
  }
  .radius-bottom-default:where(:dir(ltr)) {
    border-bottom-right-radius: var(--sf-radius-default);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-default {
    border-bottom-left-radius: var(--sf-radius-default);
  }
  @supports not (border-end-end-radius: initial) {
  [dir="rtl"] .radius-bottom-default {
    border-bottom-left-radius: var(--sf-radius-default);
    }
  }
  .radius-bottom-default:where(:dir(rtl)) {
    border-bottom-left-radius: var(--sf-radius-default);
  }
  .radius-bottom-default {
    border-end-start-radius: var(--sf-radius-default);
    border-end-end-radius: var(--sf-radius-default);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-start-default {
    border-top-left-radius: var(--sf-radius-default);
  }
  @supports not (border-start-start-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-start-default {
    border-top-left-radius: var(--sf-radius-default);
    }
  }
  .radius-inline-start-default:where(:dir(ltr)) {
    border-top-left-radius: var(--sf-radius-default);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-start-default {
    border-top-right-radius: var(--sf-radius-default);
  }
  @supports not (border-start-start-radius: initial) {
  [dir="rtl"] .radius-inline-start-default {
    border-top-right-radius: var(--sf-radius-default);
    }
  }
  .radius-inline-start-default:where(:dir(rtl)) {
    border-top-right-radius: var(--sf-radius-default);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-start-default {
    border-bottom-left-radius: var(--sf-radius-default);
  }
  @supports not (border-end-start-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-start-default {
    border-bottom-left-radius: var(--sf-radius-default);
    }
  }
  .radius-inline-start-default:where(:dir(ltr)) {
    border-bottom-left-radius: var(--sf-radius-default);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-start-default {
    border-bottom-right-radius: var(--sf-radius-default);
  }
  @supports not (border-end-start-radius: initial) {
  [dir="rtl"] .radius-inline-start-default {
    border-bottom-right-radius: var(--sf-radius-default);
    }
  }
  .radius-inline-start-default:where(:dir(rtl)) {
    border-bottom-right-radius: var(--sf-radius-default);
  }
  .radius-inline-start-default {
    border-start-start-radius: var(--sf-radius-default);
    border-end-start-radius: var(--sf-radius-default);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-end-default {
    border-top-right-radius: var(--sf-radius-default);
  }
  @supports not (border-start-end-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-end-default {
    border-top-right-radius: var(--sf-radius-default);
    }
  }
  .radius-inline-end-default:where(:dir(ltr)) {
    border-top-right-radius: var(--sf-radius-default);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-end-default {
    border-top-left-radius: var(--sf-radius-default);
  }
  @supports not (border-start-end-radius: initial) {
  [dir="rtl"] .radius-inline-end-default {
    border-top-left-radius: var(--sf-radius-default);
    }
  }
  .radius-inline-end-default:where(:dir(rtl)) {
    border-top-left-radius: var(--sf-radius-default);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-end-default {
    border-bottom-right-radius: var(--sf-radius-default);
  }
  @supports not (border-end-end-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-end-default {
    border-bottom-right-radius: var(--sf-radius-default);
    }
  }
  .radius-inline-end-default:where(:dir(ltr)) {
    border-bottom-right-radius: var(--sf-radius-default);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-end-default {
    border-bottom-left-radius: var(--sf-radius-default);
  }
  @supports not (border-end-end-radius: initial) {
  [dir="rtl"] .radius-inline-end-default {
    border-bottom-left-radius: var(--sf-radius-default);
    }
  }
  .radius-inline-end-default:where(:dir(rtl)) {
    border-bottom-left-radius: var(--sf-radius-default);
  }
  .radius-inline-end-default {
    border-start-end-radius: var(--sf-radius-default);
    border-end-end-radius: var(--sf-radius-default);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-inline-start-default {
    border-top-left-radius: var(--sf-radius-default);
  }
  @supports not (border-start-start-radius: initial) {
  html:not([dir="rtl"]) .radius-top-inline-start-default {
    border-top-left-radius: var(--sf-radius-default);
    }
  }
  .radius-top-inline-start-default:where(:dir(ltr)) {
    border-top-left-radius: var(--sf-radius-default);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-inline-start-default {
    border-top-right-radius: var(--sf-radius-default);
  }
  @supports not (border-start-start-radius: initial) {
  [dir="rtl"] .radius-top-inline-start-default {
    border-top-right-radius: var(--sf-radius-default);
    }
  }
  .radius-top-inline-start-default:where(:dir(rtl)) {
    border-top-right-radius: var(--sf-radius-default);
  }
  .radius-top-inline-start-default {
    border-start-start-radius: var(--sf-radius-default);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-inline-end-default {
    border-top-right-radius: var(--sf-radius-default);
  }
  @supports not (border-start-end-radius: initial) {
  html:not([dir="rtl"]) .radius-top-inline-end-default {
    border-top-right-radius: var(--sf-radius-default);
    }
  }
  .radius-top-inline-end-default:where(:dir(ltr)) {
    border-top-right-radius: var(--sf-radius-default);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-inline-end-default {
    border-top-left-radius: var(--sf-radius-default);
  }
  @supports not (border-start-end-radius: initial) {
  [dir="rtl"] .radius-top-inline-end-default {
    border-top-left-radius: var(--sf-radius-default);
    }
  }
  .radius-top-inline-end-default:where(:dir(rtl)) {
    border-top-left-radius: var(--sf-radius-default);
  }
  .radius-top-inline-end-default {
    border-start-end-radius: var(--sf-radius-default);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-inline-start-default {
    border-bottom-left-radius: var(--sf-radius-default);
  }
  @supports not (border-end-start-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-inline-start-default {
    border-bottom-left-radius: var(--sf-radius-default);
    }
  }
  .radius-bottom-inline-start-default:where(:dir(ltr)) {
    border-bottom-left-radius: var(--sf-radius-default);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-inline-start-default {
    border-bottom-right-radius: var(--sf-radius-default);
  }
  @supports not (border-end-start-radius: initial) {
  [dir="rtl"] .radius-bottom-inline-start-default {
    border-bottom-right-radius: var(--sf-radius-default);
    }
  }
  .radius-bottom-inline-start-default:where(:dir(rtl)) {
    border-bottom-right-radius: var(--sf-radius-default);
  }
  .radius-bottom-inline-start-default {
    border-end-start-radius: var(--sf-radius-default);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-inline-end-default {
    border-bottom-right-radius: var(--sf-radius-default);
  }
  @supports not (border-end-end-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-inline-end-default {
    border-bottom-right-radius: var(--sf-radius-default);
    }
  }
  .radius-bottom-inline-end-default:where(:dir(ltr)) {
    border-bottom-right-radius: var(--sf-radius-default);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-inline-end-default {
    border-bottom-left-radius: var(--sf-radius-default);
  }
  @supports not (border-end-end-radius: initial) {
  [dir="rtl"] .radius-bottom-inline-end-default {
    border-bottom-left-radius: var(--sf-radius-default);
    }
  }
  .radius-bottom-inline-end-default:where(:dir(rtl)) {
    border-bottom-left-radius: var(--sf-radius-default);
  }
  .radius-bottom-inline-end-default {
    border-end-end-radius: var(--sf-radius-default);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-ui {
    border-top-left-radius: var(--sf-radius--ui);
  }
  @supports not (border-start-start-radius: initial) {
  html:not([dir="rtl"]) .radius-top-ui {
    border-top-left-radius: var(--sf-radius--ui);
    }
  }
  .radius-top-ui:where(:dir(ltr)) {
    border-top-left-radius: var(--sf-radius--ui);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-ui {
    border-top-right-radius: var(--sf-radius--ui);
  }
  @supports not (border-start-start-radius: initial) {
  [dir="rtl"] .radius-top-ui {
    border-top-right-radius: var(--sf-radius--ui);
    }
  }
  .radius-top-ui:where(:dir(rtl)) {
    border-top-right-radius: var(--sf-radius--ui);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-ui {
    border-top-right-radius: var(--sf-radius--ui);
  }
  @supports not (border-start-end-radius: initial) {
  html:not([dir="rtl"]) .radius-top-ui {
    border-top-right-radius: var(--sf-radius--ui);
    }
  }
  .radius-top-ui:where(:dir(ltr)) {
    border-top-right-radius: var(--sf-radius--ui);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-ui {
    border-top-left-radius: var(--sf-radius--ui);
  }
  @supports not (border-start-end-radius: initial) {
  [dir="rtl"] .radius-top-ui {
    border-top-left-radius: var(--sf-radius--ui);
    }
  }
  .radius-top-ui:where(:dir(rtl)) {
    border-top-left-radius: var(--sf-radius--ui);
  }
  .radius-top-ui {
    border-start-start-radius: var(--sf-radius--ui);
    border-start-end-radius: var(--sf-radius--ui);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-ui {
    border-bottom-left-radius: var(--sf-radius--ui);
  }
  @supports not (border-end-start-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-ui {
    border-bottom-left-radius: var(--sf-radius--ui);
    }
  }
  .radius-bottom-ui:where(:dir(ltr)) {
    border-bottom-left-radius: var(--sf-radius--ui);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-ui {
    border-bottom-right-radius: var(--sf-radius--ui);
  }
  @supports not (border-end-start-radius: initial) {
  [dir="rtl"] .radius-bottom-ui {
    border-bottom-right-radius: var(--sf-radius--ui);
    }
  }
  .radius-bottom-ui:where(:dir(rtl)) {
    border-bottom-right-radius: var(--sf-radius--ui);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-ui {
    border-bottom-right-radius: var(--sf-radius--ui);
  }
  @supports not (border-end-end-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-ui {
    border-bottom-right-radius: var(--sf-radius--ui);
    }
  }
  .radius-bottom-ui:where(:dir(ltr)) {
    border-bottom-right-radius: var(--sf-radius--ui);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-ui {
    border-bottom-left-radius: var(--sf-radius--ui);
  }
  @supports not (border-end-end-radius: initial) {
  [dir="rtl"] .radius-bottom-ui {
    border-bottom-left-radius: var(--sf-radius--ui);
    }
  }
  .radius-bottom-ui:where(:dir(rtl)) {
    border-bottom-left-radius: var(--sf-radius--ui);
  }
  .radius-bottom-ui {
    border-end-start-radius: var(--sf-radius--ui);
    border-end-end-radius: var(--sf-radius--ui);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-start-ui {
    border-top-left-radius: var(--sf-radius--ui);
  }
  @supports not (border-start-start-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-start-ui {
    border-top-left-radius: var(--sf-radius--ui);
    }
  }
  .radius-inline-start-ui:where(:dir(ltr)) {
    border-top-left-radius: var(--sf-radius--ui);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-start-ui {
    border-top-right-radius: var(--sf-radius--ui);
  }
  @supports not (border-start-start-radius: initial) {
  [dir="rtl"] .radius-inline-start-ui {
    border-top-right-radius: var(--sf-radius--ui);
    }
  }
  .radius-inline-start-ui:where(:dir(rtl)) {
    border-top-right-radius: var(--sf-radius--ui);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-start-ui {
    border-bottom-left-radius: var(--sf-radius--ui);
  }
  @supports not (border-end-start-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-start-ui {
    border-bottom-left-radius: var(--sf-radius--ui);
    }
  }
  .radius-inline-start-ui:where(:dir(ltr)) {
    border-bottom-left-radius: var(--sf-radius--ui);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-start-ui {
    border-bottom-right-radius: var(--sf-radius--ui);
  }
  @supports not (border-end-start-radius: initial) {
  [dir="rtl"] .radius-inline-start-ui {
    border-bottom-right-radius: var(--sf-radius--ui);
    }
  }
  .radius-inline-start-ui:where(:dir(rtl)) {
    border-bottom-right-radius: var(--sf-radius--ui);
  }
  .radius-inline-start-ui {
    border-start-start-radius: var(--sf-radius--ui);
    border-end-start-radius: var(--sf-radius--ui);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-end-ui {
    border-top-right-radius: var(--sf-radius--ui);
  }
  @supports not (border-start-end-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-end-ui {
    border-top-right-radius: var(--sf-radius--ui);
    }
  }
  .radius-inline-end-ui:where(:dir(ltr)) {
    border-top-right-radius: var(--sf-radius--ui);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-end-ui {
    border-top-left-radius: var(--sf-radius--ui);
  }
  @supports not (border-start-end-radius: initial) {
  [dir="rtl"] .radius-inline-end-ui {
    border-top-left-radius: var(--sf-radius--ui);
    }
  }
  .radius-inline-end-ui:where(:dir(rtl)) {
    border-top-left-radius: var(--sf-radius--ui);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-end-ui {
    border-bottom-right-radius: var(--sf-radius--ui);
  }
  @supports not (border-end-end-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-end-ui {
    border-bottom-right-radius: var(--sf-radius--ui);
    }
  }
  .radius-inline-end-ui:where(:dir(ltr)) {
    border-bottom-right-radius: var(--sf-radius--ui);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-end-ui {
    border-bottom-left-radius: var(--sf-radius--ui);
  }
  @supports not (border-end-end-radius: initial) {
  [dir="rtl"] .radius-inline-end-ui {
    border-bottom-left-radius: var(--sf-radius--ui);
    }
  }
  .radius-inline-end-ui:where(:dir(rtl)) {
    border-bottom-left-radius: var(--sf-radius--ui);
  }
  .radius-inline-end-ui {
    border-start-end-radius: var(--sf-radius--ui);
    border-end-end-radius: var(--sf-radius--ui);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-inline-start-ui {
    border-top-left-radius: var(--sf-radius--ui);
  }
  @supports not (border-start-start-radius: initial) {
  html:not([dir="rtl"]) .radius-top-inline-start-ui {
    border-top-left-radius: var(--sf-radius--ui);
    }
  }
  .radius-top-inline-start-ui:where(:dir(ltr)) {
    border-top-left-radius: var(--sf-radius--ui);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-inline-start-ui {
    border-top-right-radius: var(--sf-radius--ui);
  }
  @supports not (border-start-start-radius: initial) {
  [dir="rtl"] .radius-top-inline-start-ui {
    border-top-right-radius: var(--sf-radius--ui);
    }
  }
  .radius-top-inline-start-ui:where(:dir(rtl)) {
    border-top-right-radius: var(--sf-radius--ui);
  }
  .radius-top-inline-start-ui {
    border-start-start-radius: var(--sf-radius--ui);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-inline-end-ui {
    border-top-right-radius: var(--sf-radius--ui);
  }
  @supports not (border-start-end-radius: initial) {
  html:not([dir="rtl"]) .radius-top-inline-end-ui {
    border-top-right-radius: var(--sf-radius--ui);
    }
  }
  .radius-top-inline-end-ui:where(:dir(ltr)) {
    border-top-right-radius: var(--sf-radius--ui);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-inline-end-ui {
    border-top-left-radius: var(--sf-radius--ui);
  }
  @supports not (border-start-end-radius: initial) {
  [dir="rtl"] .radius-top-inline-end-ui {
    border-top-left-radius: var(--sf-radius--ui);
    }
  }
  .radius-top-inline-end-ui:where(:dir(rtl)) {
    border-top-left-radius: var(--sf-radius--ui);
  }
  .radius-top-inline-end-ui {
    border-start-end-radius: var(--sf-radius--ui);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-inline-start-ui {
    border-bottom-left-radius: var(--sf-radius--ui);
  }
  @supports not (border-end-start-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-inline-start-ui {
    border-bottom-left-radius: var(--sf-radius--ui);
    }
  }
  .radius-bottom-inline-start-ui:where(:dir(ltr)) {
    border-bottom-left-radius: var(--sf-radius--ui);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-inline-start-ui {
    border-bottom-right-radius: var(--sf-radius--ui);
  }
  @supports not (border-end-start-radius: initial) {
  [dir="rtl"] .radius-bottom-inline-start-ui {
    border-bottom-right-radius: var(--sf-radius--ui);
    }
  }
  .radius-bottom-inline-start-ui:where(:dir(rtl)) {
    border-bottom-right-radius: var(--sf-radius--ui);
  }
  .radius-bottom-inline-start-ui {
    border-end-start-radius: var(--sf-radius--ui);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-inline-end-ui {
    border-bottom-right-radius: var(--sf-radius--ui);
  }
  @supports not (border-end-end-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-inline-end-ui {
    border-bottom-right-radius: var(--sf-radius--ui);
    }
  }
  .radius-bottom-inline-end-ui:where(:dir(ltr)) {
    border-bottom-right-radius: var(--sf-radius--ui);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-inline-end-ui {
    border-bottom-left-radius: var(--sf-radius--ui);
  }
  @supports not (border-end-end-radius: initial) {
  [dir="rtl"] .radius-bottom-inline-end-ui {
    border-bottom-left-radius: var(--sf-radius--ui);
    }
  }
  .radius-bottom-inline-end-ui:where(:dir(rtl)) {
    border-bottom-left-radius: var(--sf-radius--ui);
  }
  .radius-bottom-inline-end-ui {
    border-end-end-radius: var(--sf-radius--ui);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-surface {
    border-top-left-radius: var(--sf-radius--surface);
  }
  @supports not (border-start-start-radius: initial) {
  html:not([dir="rtl"]) .radius-top-surface {
    border-top-left-radius: var(--sf-radius--surface);
    }
  }
  .radius-top-surface:where(:dir(ltr)) {
    border-top-left-radius: var(--sf-radius--surface);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-surface {
    border-top-right-radius: var(--sf-radius--surface);
  }
  @supports not (border-start-start-radius: initial) {
  [dir="rtl"] .radius-top-surface {
    border-top-right-radius: var(--sf-radius--surface);
    }
  }
  .radius-top-surface:where(:dir(rtl)) {
    border-top-right-radius: var(--sf-radius--surface);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-surface {
    border-top-right-radius: var(--sf-radius--surface);
  }
  @supports not (border-start-end-radius: initial) {
  html:not([dir="rtl"]) .radius-top-surface {
    border-top-right-radius: var(--sf-radius--surface);
    }
  }
  .radius-top-surface:where(:dir(ltr)) {
    border-top-right-radius: var(--sf-radius--surface);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-surface {
    border-top-left-radius: var(--sf-radius--surface);
  }
  @supports not (border-start-end-radius: initial) {
  [dir="rtl"] .radius-top-surface {
    border-top-left-radius: var(--sf-radius--surface);
    }
  }
  .radius-top-surface:where(:dir(rtl)) {
    border-top-left-radius: var(--sf-radius--surface);
  }
  .radius-top-surface {
    border-start-start-radius: var(--sf-radius--surface);
    border-start-end-radius: var(--sf-radius--surface);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-surface {
    border-bottom-left-radius: var(--sf-radius--surface);
  }
  @supports not (border-end-start-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-surface {
    border-bottom-left-radius: var(--sf-radius--surface);
    }
  }
  .radius-bottom-surface:where(:dir(ltr)) {
    border-bottom-left-radius: var(--sf-radius--surface);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-surface {
    border-bottom-right-radius: var(--sf-radius--surface);
  }
  @supports not (border-end-start-radius: initial) {
  [dir="rtl"] .radius-bottom-surface {
    border-bottom-right-radius: var(--sf-radius--surface);
    }
  }
  .radius-bottom-surface:where(:dir(rtl)) {
    border-bottom-right-radius: var(--sf-radius--surface);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-surface {
    border-bottom-right-radius: var(--sf-radius--surface);
  }
  @supports not (border-end-end-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-surface {
    border-bottom-right-radius: var(--sf-radius--surface);
    }
  }
  .radius-bottom-surface:where(:dir(ltr)) {
    border-bottom-right-radius: var(--sf-radius--surface);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-surface {
    border-bottom-left-radius: var(--sf-radius--surface);
  }
  @supports not (border-end-end-radius: initial) {
  [dir="rtl"] .radius-bottom-surface {
    border-bottom-left-radius: var(--sf-radius--surface);
    }
  }
  .radius-bottom-surface:where(:dir(rtl)) {
    border-bottom-left-radius: var(--sf-radius--surface);
  }
  .radius-bottom-surface {
    border-end-start-radius: var(--sf-radius--surface);
    border-end-end-radius: var(--sf-radius--surface);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-start-surface {
    border-top-left-radius: var(--sf-radius--surface);
  }
  @supports not (border-start-start-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-start-surface {
    border-top-left-radius: var(--sf-radius--surface);
    }
  }
  .radius-inline-start-surface:where(:dir(ltr)) {
    border-top-left-radius: var(--sf-radius--surface);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-start-surface {
    border-top-right-radius: var(--sf-radius--surface);
  }
  @supports not (border-start-start-radius: initial) {
  [dir="rtl"] .radius-inline-start-surface {
    border-top-right-radius: var(--sf-radius--surface);
    }
  }
  .radius-inline-start-surface:where(:dir(rtl)) {
    border-top-right-radius: var(--sf-radius--surface);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-start-surface {
    border-bottom-left-radius: var(--sf-radius--surface);
  }
  @supports not (border-end-start-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-start-surface {
    border-bottom-left-radius: var(--sf-radius--surface);
    }
  }
  .radius-inline-start-surface:where(:dir(ltr)) {
    border-bottom-left-radius: var(--sf-radius--surface);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-start-surface {
    border-bottom-right-radius: var(--sf-radius--surface);
  }
  @supports not (border-end-start-radius: initial) {
  [dir="rtl"] .radius-inline-start-surface {
    border-bottom-right-radius: var(--sf-radius--surface);
    }
  }
  .radius-inline-start-surface:where(:dir(rtl)) {
    border-bottom-right-radius: var(--sf-radius--surface);
  }
  .radius-inline-start-surface {
    border-start-start-radius: var(--sf-radius--surface);
    border-end-start-radius: var(--sf-radius--surface);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-end-surface {
    border-top-right-radius: var(--sf-radius--surface);
  }
  @supports not (border-start-end-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-end-surface {
    border-top-right-radius: var(--sf-radius--surface);
    }
  }
  .radius-inline-end-surface:where(:dir(ltr)) {
    border-top-right-radius: var(--sf-radius--surface);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-end-surface {
    border-top-left-radius: var(--sf-radius--surface);
  }
  @supports not (border-start-end-radius: initial) {
  [dir="rtl"] .radius-inline-end-surface {
    border-top-left-radius: var(--sf-radius--surface);
    }
  }
  .radius-inline-end-surface:where(:dir(rtl)) {
    border-top-left-radius: var(--sf-radius--surface);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-end-surface {
    border-bottom-right-radius: var(--sf-radius--surface);
  }
  @supports not (border-end-end-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-end-surface {
    border-bottom-right-radius: var(--sf-radius--surface);
    }
  }
  .radius-inline-end-surface:where(:dir(ltr)) {
    border-bottom-right-radius: var(--sf-radius--surface);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-end-surface {
    border-bottom-left-radius: var(--sf-radius--surface);
  }
  @supports not (border-end-end-radius: initial) {
  [dir="rtl"] .radius-inline-end-surface {
    border-bottom-left-radius: var(--sf-radius--surface);
    }
  }
  .radius-inline-end-surface:where(:dir(rtl)) {
    border-bottom-left-radius: var(--sf-radius--surface);
  }
  .radius-inline-end-surface {
    border-start-end-radius: var(--sf-radius--surface);
    border-end-end-radius: var(--sf-radius--surface);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-inline-start-surface {
    border-top-left-radius: var(--sf-radius--surface);
  }
  @supports not (border-start-start-radius: initial) {
  html:not([dir="rtl"]) .radius-top-inline-start-surface {
    border-top-left-radius: var(--sf-radius--surface);
    }
  }
  .radius-top-inline-start-surface:where(:dir(ltr)) {
    border-top-left-radius: var(--sf-radius--surface);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-inline-start-surface {
    border-top-right-radius: var(--sf-radius--surface);
  }
  @supports not (border-start-start-radius: initial) {
  [dir="rtl"] .radius-top-inline-start-surface {
    border-top-right-radius: var(--sf-radius--surface);
    }
  }
  .radius-top-inline-start-surface:where(:dir(rtl)) {
    border-top-right-radius: var(--sf-radius--surface);
  }
  .radius-top-inline-start-surface {
    border-start-start-radius: var(--sf-radius--surface);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-inline-end-surface {
    border-top-right-radius: var(--sf-radius--surface);
  }
  @supports not (border-start-end-radius: initial) {
  html:not([dir="rtl"]) .radius-top-inline-end-surface {
    border-top-right-radius: var(--sf-radius--surface);
    }
  }
  .radius-top-inline-end-surface:where(:dir(ltr)) {
    border-top-right-radius: var(--sf-radius--surface);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-inline-end-surface {
    border-top-left-radius: var(--sf-radius--surface);
  }
  @supports not (border-start-end-radius: initial) {
  [dir="rtl"] .radius-top-inline-end-surface {
    border-top-left-radius: var(--sf-radius--surface);
    }
  }
  .radius-top-inline-end-surface:where(:dir(rtl)) {
    border-top-left-radius: var(--sf-radius--surface);
  }
  .radius-top-inline-end-surface {
    border-start-end-radius: var(--sf-radius--surface);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-inline-start-surface {
    border-bottom-left-radius: var(--sf-radius--surface);
  }
  @supports not (border-end-start-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-inline-start-surface {
    border-bottom-left-radius: var(--sf-radius--surface);
    }
  }
  .radius-bottom-inline-start-surface:where(:dir(ltr)) {
    border-bottom-left-radius: var(--sf-radius--surface);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-inline-start-surface {
    border-bottom-right-radius: var(--sf-radius--surface);
  }
  @supports not (border-end-start-radius: initial) {
  [dir="rtl"] .radius-bottom-inline-start-surface {
    border-bottom-right-radius: var(--sf-radius--surface);
    }
  }
  .radius-bottom-inline-start-surface:where(:dir(rtl)) {
    border-bottom-right-radius: var(--sf-radius--surface);
  }
  .radius-bottom-inline-start-surface {
    border-end-start-radius: var(--sf-radius--surface);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-inline-end-surface {
    border-bottom-right-radius: var(--sf-radius--surface);
  }
  @supports not (border-end-end-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-inline-end-surface {
    border-bottom-right-radius: var(--sf-radius--surface);
    }
  }
  .radius-bottom-inline-end-surface:where(:dir(ltr)) {
    border-bottom-right-radius: var(--sf-radius--surface);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-inline-end-surface {
    border-bottom-left-radius: var(--sf-radius--surface);
  }
  @supports not (border-end-end-radius: initial) {
  [dir="rtl"] .radius-bottom-inline-end-surface {
    border-bottom-left-radius: var(--sf-radius--surface);
    }
  }
  .radius-bottom-inline-end-surface:where(:dir(rtl)) {
    border-bottom-left-radius: var(--sf-radius--surface);
  }
  .radius-bottom-inline-end-surface {
    border-end-end-radius: var(--sf-radius--surface);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-square {
    border-top-left-radius: var(--sf-radius-square);
  }
  @supports not (border-start-start-radius: initial) {
  html:not([dir="rtl"]) .radius-top-square {
    border-top-left-radius: var(--sf-radius-square);
    }
  }
  .radius-top-square:where(:dir(ltr)) {
    border-top-left-radius: var(--sf-radius-square);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-square {
    border-top-right-radius: var(--sf-radius-square);
  }
  @supports not (border-start-start-radius: initial) {
  [dir="rtl"] .radius-top-square {
    border-top-right-radius: var(--sf-radius-square);
    }
  }
  .radius-top-square:where(:dir(rtl)) {
    border-top-right-radius: var(--sf-radius-square);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-square {
    border-top-right-radius: var(--sf-radius-square);
  }
  @supports not (border-start-end-radius: initial) {
  html:not([dir="rtl"]) .radius-top-square {
    border-top-right-radius: var(--sf-radius-square);
    }
  }
  .radius-top-square:where(:dir(ltr)) {
    border-top-right-radius: var(--sf-radius-square);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-square {
    border-top-left-radius: var(--sf-radius-square);
  }
  @supports not (border-start-end-radius: initial) {
  [dir="rtl"] .radius-top-square {
    border-top-left-radius: var(--sf-radius-square);
    }
  }
  .radius-top-square:where(:dir(rtl)) {
    border-top-left-radius: var(--sf-radius-square);
  }
  .radius-top-square {
    border-start-start-radius: var(--sf-radius-square);
    border-start-end-radius: var(--sf-radius-square);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-square {
    border-bottom-left-radius: var(--sf-radius-square);
  }
  @supports not (border-end-start-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-square {
    border-bottom-left-radius: var(--sf-radius-square);
    }
  }
  .radius-bottom-square:where(:dir(ltr)) {
    border-bottom-left-radius: var(--sf-radius-square);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-square {
    border-bottom-right-radius: var(--sf-radius-square);
  }
  @supports not (border-end-start-radius: initial) {
  [dir="rtl"] .radius-bottom-square {
    border-bottom-right-radius: var(--sf-radius-square);
    }
  }
  .radius-bottom-square:where(:dir(rtl)) {
    border-bottom-right-radius: var(--sf-radius-square);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-square {
    border-bottom-right-radius: var(--sf-radius-square);
  }
  @supports not (border-end-end-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-square {
    border-bottom-right-radius: var(--sf-radius-square);
    }
  }
  .radius-bottom-square:where(:dir(ltr)) {
    border-bottom-right-radius: var(--sf-radius-square);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-square {
    border-bottom-left-radius: var(--sf-radius-square);
  }
  @supports not (border-end-end-radius: initial) {
  [dir="rtl"] .radius-bottom-square {
    border-bottom-left-radius: var(--sf-radius-square);
    }
  }
  .radius-bottom-square:where(:dir(rtl)) {
    border-bottom-left-radius: var(--sf-radius-square);
  }
  .radius-bottom-square {
    border-end-start-radius: var(--sf-radius-square);
    border-end-end-radius: var(--sf-radius-square);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-start-square {
    border-top-left-radius: var(--sf-radius-square);
  }
  @supports not (border-start-start-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-start-square {
    border-top-left-radius: var(--sf-radius-square);
    }
  }
  .radius-inline-start-square:where(:dir(ltr)) {
    border-top-left-radius: var(--sf-radius-square);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-start-square {
    border-top-right-radius: var(--sf-radius-square);
  }
  @supports not (border-start-start-radius: initial) {
  [dir="rtl"] .radius-inline-start-square {
    border-top-right-radius: var(--sf-radius-square);
    }
  }
  .radius-inline-start-square:where(:dir(rtl)) {
    border-top-right-radius: var(--sf-radius-square);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-start-square {
    border-bottom-left-radius: var(--sf-radius-square);
  }
  @supports not (border-end-start-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-start-square {
    border-bottom-left-radius: var(--sf-radius-square);
    }
  }
  .radius-inline-start-square:where(:dir(ltr)) {
    border-bottom-left-radius: var(--sf-radius-square);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-start-square {
    border-bottom-right-radius: var(--sf-radius-square);
  }
  @supports not (border-end-start-radius: initial) {
  [dir="rtl"] .radius-inline-start-square {
    border-bottom-right-radius: var(--sf-radius-square);
    }
  }
  .radius-inline-start-square:where(:dir(rtl)) {
    border-bottom-right-radius: var(--sf-radius-square);
  }
  .radius-inline-start-square {
    border-start-start-radius: var(--sf-radius-square);
    border-end-start-radius: var(--sf-radius-square);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-end-square {
    border-top-right-radius: var(--sf-radius-square);
  }
  @supports not (border-start-end-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-end-square {
    border-top-right-radius: var(--sf-radius-square);
    }
  }
  .radius-inline-end-square:where(:dir(ltr)) {
    border-top-right-radius: var(--sf-radius-square);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-end-square {
    border-top-left-radius: var(--sf-radius-square);
  }
  @supports not (border-start-end-radius: initial) {
  [dir="rtl"] .radius-inline-end-square {
    border-top-left-radius: var(--sf-radius-square);
    }
  }
  .radius-inline-end-square:where(:dir(rtl)) {
    border-top-left-radius: var(--sf-radius-square);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-end-square {
    border-bottom-right-radius: var(--sf-radius-square);
  }
  @supports not (border-end-end-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-end-square {
    border-bottom-right-radius: var(--sf-radius-square);
    }
  }
  .radius-inline-end-square:where(:dir(ltr)) {
    border-bottom-right-radius: var(--sf-radius-square);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-end-square {
    border-bottom-left-radius: var(--sf-radius-square);
  }
  @supports not (border-end-end-radius: initial) {
  [dir="rtl"] .radius-inline-end-square {
    border-bottom-left-radius: var(--sf-radius-square);
    }
  }
  .radius-inline-end-square:where(:dir(rtl)) {
    border-bottom-left-radius: var(--sf-radius-square);
  }
  .radius-inline-end-square {
    border-start-end-radius: var(--sf-radius-square);
    border-end-end-radius: var(--sf-radius-square);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-inline-start-square {
    border-top-left-radius: var(--sf-radius-square);
  }
  @supports not (border-start-start-radius: initial) {
  html:not([dir="rtl"]) .radius-top-inline-start-square {
    border-top-left-radius: var(--sf-radius-square);
    }
  }
  .radius-top-inline-start-square:where(:dir(ltr)) {
    border-top-left-radius: var(--sf-radius-square);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-inline-start-square {
    border-top-right-radius: var(--sf-radius-square);
  }
  @supports not (border-start-start-radius: initial) {
  [dir="rtl"] .radius-top-inline-start-square {
    border-top-right-radius: var(--sf-radius-square);
    }
  }
  .radius-top-inline-start-square:where(:dir(rtl)) {
    border-top-right-radius: var(--sf-radius-square);
  }
  .radius-top-inline-start-square {
    border-start-start-radius: var(--sf-radius-square);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-inline-end-square {
    border-top-right-radius: var(--sf-radius-square);
  }
  @supports not (border-start-end-radius: initial) {
  html:not([dir="rtl"]) .radius-top-inline-end-square {
    border-top-right-radius: var(--sf-radius-square);
    }
  }
  .radius-top-inline-end-square:where(:dir(ltr)) {
    border-top-right-radius: var(--sf-radius-square);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-inline-end-square {
    border-top-left-radius: var(--sf-radius-square);
  }
  @supports not (border-start-end-radius: initial) {
  [dir="rtl"] .radius-top-inline-end-square {
    border-top-left-radius: var(--sf-radius-square);
    }
  }
  .radius-top-inline-end-square:where(:dir(rtl)) {
    border-top-left-radius: var(--sf-radius-square);
  }
  .radius-top-inline-end-square {
    border-start-end-radius: var(--sf-radius-square);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-inline-start-square {
    border-bottom-left-radius: var(--sf-radius-square);
  }
  @supports not (border-end-start-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-inline-start-square {
    border-bottom-left-radius: var(--sf-radius-square);
    }
  }
  .radius-bottom-inline-start-square:where(:dir(ltr)) {
    border-bottom-left-radius: var(--sf-radius-square);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-inline-start-square {
    border-bottom-right-radius: var(--sf-radius-square);
  }
  @supports not (border-end-start-radius: initial) {
  [dir="rtl"] .radius-bottom-inline-start-square {
    border-bottom-right-radius: var(--sf-radius-square);
    }
  }
  .radius-bottom-inline-start-square:where(:dir(rtl)) {
    border-bottom-right-radius: var(--sf-radius-square);
  }
  .radius-bottom-inline-start-square {
    border-end-start-radius: var(--sf-radius-square);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-inline-end-square {
    border-bottom-right-radius: var(--sf-radius-square);
  }
  @supports not (border-end-end-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-inline-end-square {
    border-bottom-right-radius: var(--sf-radius-square);
    }
  }
  .radius-bottom-inline-end-square:where(:dir(ltr)) {
    border-bottom-right-radius: var(--sf-radius-square);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-inline-end-square {
    border-bottom-left-radius: var(--sf-radius-square);
  }
  @supports not (border-end-end-radius: initial) {
  [dir="rtl"] .radius-bottom-inline-end-square {
    border-bottom-left-radius: var(--sf-radius-square);
    }
  }
  .radius-bottom-inline-end-square:where(:dir(rtl)) {
    border-bottom-left-radius: var(--sf-radius-square);
  }
  .radius-bottom-inline-end-square {
    border-end-end-radius: var(--sf-radius-square);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-rounded {
    border-top-left-radius: var(--sf-radius-rounded);
  }
  @supports not (border-start-start-radius: initial) {
  html:not([dir="rtl"]) .radius-top-rounded {
    border-top-left-radius: var(--sf-radius-rounded);
    }
  }
  .radius-top-rounded:where(:dir(ltr)) {
    border-top-left-radius: var(--sf-radius-rounded);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-rounded {
    border-top-right-radius: var(--sf-radius-rounded);
  }
  @supports not (border-start-start-radius: initial) {
  [dir="rtl"] .radius-top-rounded {
    border-top-right-radius: var(--sf-radius-rounded);
    }
  }
  .radius-top-rounded:where(:dir(rtl)) {
    border-top-right-radius: var(--sf-radius-rounded);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-rounded {
    border-top-right-radius: var(--sf-radius-rounded);
  }
  @supports not (border-start-end-radius: initial) {
  html:not([dir="rtl"]) .radius-top-rounded {
    border-top-right-radius: var(--sf-radius-rounded);
    }
  }
  .radius-top-rounded:where(:dir(ltr)) {
    border-top-right-radius: var(--sf-radius-rounded);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-rounded {
    border-top-left-radius: var(--sf-radius-rounded);
  }
  @supports not (border-start-end-radius: initial) {
  [dir="rtl"] .radius-top-rounded {
    border-top-left-radius: var(--sf-radius-rounded);
    }
  }
  .radius-top-rounded:where(:dir(rtl)) {
    border-top-left-radius: var(--sf-radius-rounded);
  }
  .radius-top-rounded {
    border-start-start-radius: var(--sf-radius-rounded);
    border-start-end-radius: var(--sf-radius-rounded);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-rounded {
    border-bottom-left-radius: var(--sf-radius-rounded);
  }
  @supports not (border-end-start-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-rounded {
    border-bottom-left-radius: var(--sf-radius-rounded);
    }
  }
  .radius-bottom-rounded:where(:dir(ltr)) {
    border-bottom-left-radius: var(--sf-radius-rounded);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-rounded {
    border-bottom-right-radius: var(--sf-radius-rounded);
  }
  @supports not (border-end-start-radius: initial) {
  [dir="rtl"] .radius-bottom-rounded {
    border-bottom-right-radius: var(--sf-radius-rounded);
    }
  }
  .radius-bottom-rounded:where(:dir(rtl)) {
    border-bottom-right-radius: var(--sf-radius-rounded);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-rounded {
    border-bottom-right-radius: var(--sf-radius-rounded);
  }
  @supports not (border-end-end-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-rounded {
    border-bottom-right-radius: var(--sf-radius-rounded);
    }
  }
  .radius-bottom-rounded:where(:dir(ltr)) {
    border-bottom-right-radius: var(--sf-radius-rounded);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-rounded {
    border-bottom-left-radius: var(--sf-radius-rounded);
  }
  @supports not (border-end-end-radius: initial) {
  [dir="rtl"] .radius-bottom-rounded {
    border-bottom-left-radius: var(--sf-radius-rounded);
    }
  }
  .radius-bottom-rounded:where(:dir(rtl)) {
    border-bottom-left-radius: var(--sf-radius-rounded);
  }
  .radius-bottom-rounded {
    border-end-start-radius: var(--sf-radius-rounded);
    border-end-end-radius: var(--sf-radius-rounded);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-start-rounded {
    border-top-left-radius: var(--sf-radius-rounded);
  }
  @supports not (border-start-start-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-start-rounded {
    border-top-left-radius: var(--sf-radius-rounded);
    }
  }
  .radius-inline-start-rounded:where(:dir(ltr)) {
    border-top-left-radius: var(--sf-radius-rounded);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-start-rounded {
    border-top-right-radius: var(--sf-radius-rounded);
  }
  @supports not (border-start-start-radius: initial) {
  [dir="rtl"] .radius-inline-start-rounded {
    border-top-right-radius: var(--sf-radius-rounded);
    }
  }
  .radius-inline-start-rounded:where(:dir(rtl)) {
    border-top-right-radius: var(--sf-radius-rounded);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-start-rounded {
    border-bottom-left-radius: var(--sf-radius-rounded);
  }
  @supports not (border-end-start-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-start-rounded {
    border-bottom-left-radius: var(--sf-radius-rounded);
    }
  }
  .radius-inline-start-rounded:where(:dir(ltr)) {
    border-bottom-left-radius: var(--sf-radius-rounded);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-start-rounded {
    border-bottom-right-radius: var(--sf-radius-rounded);
  }
  @supports not (border-end-start-radius: initial) {
  [dir="rtl"] .radius-inline-start-rounded {
    border-bottom-right-radius: var(--sf-radius-rounded);
    }
  }
  .radius-inline-start-rounded:where(:dir(rtl)) {
    border-bottom-right-radius: var(--sf-radius-rounded);
  }
  .radius-inline-start-rounded {
    border-start-start-radius: var(--sf-radius-rounded);
    border-end-start-radius: var(--sf-radius-rounded);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-end-rounded {
    border-top-right-radius: var(--sf-radius-rounded);
  }
  @supports not (border-start-end-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-end-rounded {
    border-top-right-radius: var(--sf-radius-rounded);
    }
  }
  .radius-inline-end-rounded:where(:dir(ltr)) {
    border-top-right-radius: var(--sf-radius-rounded);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-end-rounded {
    border-top-left-radius: var(--sf-radius-rounded);
  }
  @supports not (border-start-end-radius: initial) {
  [dir="rtl"] .radius-inline-end-rounded {
    border-top-left-radius: var(--sf-radius-rounded);
    }
  }
  .radius-inline-end-rounded:where(:dir(rtl)) {
    border-top-left-radius: var(--sf-radius-rounded);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-end-rounded {
    border-bottom-right-radius: var(--sf-radius-rounded);
  }
  @supports not (border-end-end-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-end-rounded {
    border-bottom-right-radius: var(--sf-radius-rounded);
    }
  }
  .radius-inline-end-rounded:where(:dir(ltr)) {
    border-bottom-right-radius: var(--sf-radius-rounded);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-end-rounded {
    border-bottom-left-radius: var(--sf-radius-rounded);
  }
  @supports not (border-end-end-radius: initial) {
  [dir="rtl"] .radius-inline-end-rounded {
    border-bottom-left-radius: var(--sf-radius-rounded);
    }
  }
  .radius-inline-end-rounded:where(:dir(rtl)) {
    border-bottom-left-radius: var(--sf-radius-rounded);
  }
  .radius-inline-end-rounded {
    border-start-end-radius: var(--sf-radius-rounded);
    border-end-end-radius: var(--sf-radius-rounded);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-inline-start-rounded {
    border-top-left-radius: var(--sf-radius-rounded);
  }
  @supports not (border-start-start-radius: initial) {
  html:not([dir="rtl"]) .radius-top-inline-start-rounded {
    border-top-left-radius: var(--sf-radius-rounded);
    }
  }
  .radius-top-inline-start-rounded:where(:dir(ltr)) {
    border-top-left-radius: var(--sf-radius-rounded);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-inline-start-rounded {
    border-top-right-radius: var(--sf-radius-rounded);
  }
  @supports not (border-start-start-radius: initial) {
  [dir="rtl"] .radius-top-inline-start-rounded {
    border-top-right-radius: var(--sf-radius-rounded);
    }
  }
  .radius-top-inline-start-rounded:where(:dir(rtl)) {
    border-top-right-radius: var(--sf-radius-rounded);
  }
  .radius-top-inline-start-rounded {
    border-start-start-radius: var(--sf-radius-rounded);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-inline-end-rounded {
    border-top-right-radius: var(--sf-radius-rounded);
  }
  @supports not (border-start-end-radius: initial) {
  html:not([dir="rtl"]) .radius-top-inline-end-rounded {
    border-top-right-radius: var(--sf-radius-rounded);
    }
  }
  .radius-top-inline-end-rounded:where(:dir(ltr)) {
    border-top-right-radius: var(--sf-radius-rounded);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-inline-end-rounded {
    border-top-left-radius: var(--sf-radius-rounded);
  }
  @supports not (border-start-end-radius: initial) {
  [dir="rtl"] .radius-top-inline-end-rounded {
    border-top-left-radius: var(--sf-radius-rounded);
    }
  }
  .radius-top-inline-end-rounded:where(:dir(rtl)) {
    border-top-left-radius: var(--sf-radius-rounded);
  }
  .radius-top-inline-end-rounded {
    border-start-end-radius: var(--sf-radius-rounded);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-inline-start-rounded {
    border-bottom-left-radius: var(--sf-radius-rounded);
  }
  @supports not (border-end-start-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-inline-start-rounded {
    border-bottom-left-radius: var(--sf-radius-rounded);
    }
  }
  .radius-bottom-inline-start-rounded:where(:dir(ltr)) {
    border-bottom-left-radius: var(--sf-radius-rounded);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-inline-start-rounded {
    border-bottom-right-radius: var(--sf-radius-rounded);
  }
  @supports not (border-end-start-radius: initial) {
  [dir="rtl"] .radius-bottom-inline-start-rounded {
    border-bottom-right-radius: var(--sf-radius-rounded);
    }
  }
  .radius-bottom-inline-start-rounded:where(:dir(rtl)) {
    border-bottom-right-radius: var(--sf-radius-rounded);
  }
  .radius-bottom-inline-start-rounded {
    border-end-start-radius: var(--sf-radius-rounded);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-inline-end-rounded {
    border-bottom-right-radius: var(--sf-radius-rounded);
  }
  @supports not (border-end-end-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-inline-end-rounded {
    border-bottom-right-radius: var(--sf-radius-rounded);
    }
  }
  .radius-bottom-inline-end-rounded:where(:dir(ltr)) {
    border-bottom-right-radius: var(--sf-radius-rounded);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-inline-end-rounded {
    border-bottom-left-radius: var(--sf-radius-rounded);
  }
  @supports not (border-end-end-radius: initial) {
  [dir="rtl"] .radius-bottom-inline-end-rounded {
    border-bottom-left-radius: var(--sf-radius-rounded);
    }
  }
  .radius-bottom-inline-end-rounded:where(:dir(rtl)) {
    border-bottom-left-radius: var(--sf-radius-rounded);
  }
  .radius-bottom-inline-end-rounded {
    border-end-end-radius: var(--sf-radius-rounded);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-round {
    border-top-left-radius: var(--sf-radius-round);
  }
  @supports not (border-start-start-radius: initial) {
  html:not([dir="rtl"]) .radius-top-round {
    border-top-left-radius: var(--sf-radius-round);
    }
  }
  .radius-top-round:where(:dir(ltr)) {
    border-top-left-radius: var(--sf-radius-round);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-round {
    border-top-right-radius: var(--sf-radius-round);
  }
  @supports not (border-start-start-radius: initial) {
  [dir="rtl"] .radius-top-round {
    border-top-right-radius: var(--sf-radius-round);
    }
  }
  .radius-top-round:where(:dir(rtl)) {
    border-top-right-radius: var(--sf-radius-round);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-round {
    border-top-right-radius: var(--sf-radius-round);
  }
  @supports not (border-start-end-radius: initial) {
  html:not([dir="rtl"]) .radius-top-round {
    border-top-right-radius: var(--sf-radius-round);
    }
  }
  .radius-top-round:where(:dir(ltr)) {
    border-top-right-radius: var(--sf-radius-round);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-round {
    border-top-left-radius: var(--sf-radius-round);
  }
  @supports not (border-start-end-radius: initial) {
  [dir="rtl"] .radius-top-round {
    border-top-left-radius: var(--sf-radius-round);
    }
  }
  .radius-top-round:where(:dir(rtl)) {
    border-top-left-radius: var(--sf-radius-round);
  }
  .radius-top-round {
    border-start-start-radius: var(--sf-radius-round);
    border-start-end-radius: var(--sf-radius-round);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-round {
    border-bottom-left-radius: var(--sf-radius-round);
  }
  @supports not (border-end-start-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-round {
    border-bottom-left-radius: var(--sf-radius-round);
    }
  }
  .radius-bottom-round:where(:dir(ltr)) {
    border-bottom-left-radius: var(--sf-radius-round);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-round {
    border-bottom-right-radius: var(--sf-radius-round);
  }
  @supports not (border-end-start-radius: initial) {
  [dir="rtl"] .radius-bottom-round {
    border-bottom-right-radius: var(--sf-radius-round);
    }
  }
  .radius-bottom-round:where(:dir(rtl)) {
    border-bottom-right-radius: var(--sf-radius-round);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-round {
    border-bottom-right-radius: var(--sf-radius-round);
  }
  @supports not (border-end-end-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-round {
    border-bottom-right-radius: var(--sf-radius-round);
    }
  }
  .radius-bottom-round:where(:dir(ltr)) {
    border-bottom-right-radius: var(--sf-radius-round);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-round {
    border-bottom-left-radius: var(--sf-radius-round);
  }
  @supports not (border-end-end-radius: initial) {
  [dir="rtl"] .radius-bottom-round {
    border-bottom-left-radius: var(--sf-radius-round);
    }
  }
  .radius-bottom-round:where(:dir(rtl)) {
    border-bottom-left-radius: var(--sf-radius-round);
  }
  .radius-bottom-round {
    border-end-start-radius: var(--sf-radius-round);
    border-end-end-radius: var(--sf-radius-round);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-start-round {
    border-top-left-radius: var(--sf-radius-round);
  }
  @supports not (border-start-start-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-start-round {
    border-top-left-radius: var(--sf-radius-round);
    }
  }
  .radius-inline-start-round:where(:dir(ltr)) {
    border-top-left-radius: var(--sf-radius-round);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-start-round {
    border-top-right-radius: var(--sf-radius-round);
  }
  @supports not (border-start-start-radius: initial) {
  [dir="rtl"] .radius-inline-start-round {
    border-top-right-radius: var(--sf-radius-round);
    }
  }
  .radius-inline-start-round:where(:dir(rtl)) {
    border-top-right-radius: var(--sf-radius-round);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-start-round {
    border-bottom-left-radius: var(--sf-radius-round);
  }
  @supports not (border-end-start-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-start-round {
    border-bottom-left-radius: var(--sf-radius-round);
    }
  }
  .radius-inline-start-round:where(:dir(ltr)) {
    border-bottom-left-radius: var(--sf-radius-round);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-start-round {
    border-bottom-right-radius: var(--sf-radius-round);
  }
  @supports not (border-end-start-radius: initial) {
  [dir="rtl"] .radius-inline-start-round {
    border-bottom-right-radius: var(--sf-radius-round);
    }
  }
  .radius-inline-start-round:where(:dir(rtl)) {
    border-bottom-right-radius: var(--sf-radius-round);
  }
  .radius-inline-start-round {
    border-start-start-radius: var(--sf-radius-round);
    border-end-start-radius: var(--sf-radius-round);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-end-round {
    border-top-right-radius: var(--sf-radius-round);
  }
  @supports not (border-start-end-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-end-round {
    border-top-right-radius: var(--sf-radius-round);
    }
  }
  .radius-inline-end-round:where(:dir(ltr)) {
    border-top-right-radius: var(--sf-radius-round);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-end-round {
    border-top-left-radius: var(--sf-radius-round);
  }
  @supports not (border-start-end-radius: initial) {
  [dir="rtl"] .radius-inline-end-round {
    border-top-left-radius: var(--sf-radius-round);
    }
  }
  .radius-inline-end-round:where(:dir(rtl)) {
    border-top-left-radius: var(--sf-radius-round);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-inline-end-round {
    border-bottom-right-radius: var(--sf-radius-round);
  }
  @supports not (border-end-end-radius: initial) {
  html:not([dir="rtl"]) .radius-inline-end-round {
    border-bottom-right-radius: var(--sf-radius-round);
    }
  }
  .radius-inline-end-round:where(:dir(ltr)) {
    border-bottom-right-radius: var(--sf-radius-round);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-inline-end-round {
    border-bottom-left-radius: var(--sf-radius-round);
  }
  @supports not (border-end-end-radius: initial) {
  [dir="rtl"] .radius-inline-end-round {
    border-bottom-left-radius: var(--sf-radius-round);
    }
  }
  .radius-inline-end-round:where(:dir(rtl)) {
    border-bottom-left-radius: var(--sf-radius-round);
  }
  .radius-inline-end-round {
    border-start-end-radius: var(--sf-radius-round);
    border-end-end-radius: var(--sf-radius-round);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-inline-start-round {
    border-top-left-radius: var(--sf-radius-round);
  }
  @supports not (border-start-start-radius: initial) {
  html:not([dir="rtl"]) .radius-top-inline-start-round {
    border-top-left-radius: var(--sf-radius-round);
    }
  }
  .radius-top-inline-start-round:where(:dir(ltr)) {
    border-top-left-radius: var(--sf-radius-round);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-inline-start-round {
    border-top-right-radius: var(--sf-radius-round);
  }
  @supports not (border-start-start-radius: initial) {
  [dir="rtl"] .radius-top-inline-start-round {
    border-top-right-radius: var(--sf-radius-round);
    }
  }
  .radius-top-inline-start-round:where(:dir(rtl)) {
    border-top-right-radius: var(--sf-radius-round);
  }
  .radius-top-inline-start-round {
    border-start-start-radius: var(--sf-radius-round);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-top-inline-end-round {
    border-top-right-radius: var(--sf-radius-round);
  }
  @supports not (border-start-end-radius: initial) {
  html:not([dir="rtl"]) .radius-top-inline-end-round {
    border-top-right-radius: var(--sf-radius-round);
    }
  }
  .radius-top-inline-end-round:where(:dir(ltr)) {
    border-top-right-radius: var(--sf-radius-round);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-top-inline-end-round {
    border-top-left-radius: var(--sf-radius-round);
  }
  @supports not (border-start-end-radius: initial) {
  [dir="rtl"] .radius-top-inline-end-round {
    border-top-left-radius: var(--sf-radius-round);
    }
  }
  .radius-top-inline-end-round:where(:dir(rtl)) {
    border-top-left-radius: var(--sf-radius-round);
  }
  .radius-top-inline-end-round {
    border-start-end-radius: var(--sf-radius-round);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-inline-start-round {
    border-bottom-left-radius: var(--sf-radius-round);
  }
  @supports not (border-end-start-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-inline-start-round {
    border-bottom-left-radius: var(--sf-radius-round);
    }
  }
  .radius-bottom-inline-start-round:where(:dir(ltr)) {
    border-bottom-left-radius: var(--sf-radius-round);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-inline-start-round {
    border-bottom-right-radius: var(--sf-radius-round);
  }
  @supports not (border-end-start-radius: initial) {
  [dir="rtl"] .radius-bottom-inline-start-round {
    border-bottom-right-radius: var(--sf-radius-round);
    }
  }
  .radius-bottom-inline-start-round:where(:dir(rtl)) {
    border-bottom-right-radius: var(--sf-radius-round);
  }
  .radius-bottom-inline-start-round {
    border-end-start-radius: var(--sf-radius-round);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .radius-bottom-inline-end-round {
    border-bottom-right-radius: var(--sf-radius-round);
  }
  @supports not (border-end-end-radius: initial) {
  html:not([dir="rtl"]) .radius-bottom-inline-end-round {
    border-bottom-right-radius: var(--sf-radius-round);
    }
  }
  .radius-bottom-inline-end-round:where(:dir(ltr)) {
    border-bottom-right-radius: var(--sf-radius-round);
  }
  _:-ms-input-placeholder, [dir="rtl"] .radius-bottom-inline-end-round {
    border-bottom-left-radius: var(--sf-radius-round);
  }
  @supports not (border-end-end-radius: initial) {
  [dir="rtl"] .radius-bottom-inline-end-round {
    border-bottom-left-radius: var(--sf-radius-round);
    }
  }
  .radius-bottom-inline-end-round:where(:dir(rtl)) {
    border-bottom-left-radius: var(--sf-radius-round);
  }
  .radius-bottom-inline-end-round {
    border-end-end-radius: var(--sf-radius-round);
  }
}

/* docara-shell-source: runtime/utility/border-width/default/css/default.css */
@layer sf.utilities {
  .border-1 {
    border-width: var(--sf-a1);
  }
  .border-2 {
    border-width: var(--sf-a2);
  }
  .border-3 {
    border-width: var(--sf-a3);
  }
  .border-4 {
    border-width: var(--sf-a4);
  }
  .border-5 {
    border-width: var(--sf-a5);
  }
  .border-6 {
    border-width: var(--sf-a6);
  }
  .border-7 {
    border-width: var(--sf-a7);
  }
  .border-8 {
    border-width: var(--sf-a8);
  }
  .border-9 {
    border-width: var(--sf-a9);
  }
  .border-10 {
    border-width: var(--sf-b0);
  }
  .border-0 {
    border-width: var(--sf-0);
  }
  .border-top-1 {
    border-top-width: var(--sf-a1);
  }
  .border-top-2 {
    border-top-width: var(--sf-a2);
  }
  .border-top-3 {
    border-top-width: var(--sf-a3);
  }
  .border-top-4 {
    border-top-width: var(--sf-a4);
  }
  .border-top-5 {
    border-top-width: var(--sf-a5);
  }
  .border-top-6 {
    border-top-width: var(--sf-a6);
  }
  .border-top-7 {
    border-top-width: var(--sf-a7);
  }
  .border-top-8 {
    border-top-width: var(--sf-a8);
  }
  .border-top-9 {
    border-top-width: var(--sf-a9);
  }
  .border-top-10 {
    border-top-width: var(--sf-b0);
  }
  .border-top-0 {
    border-top-width: var(--sf-0);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-inline-end-1 {
    border-right-width: var(--sf-a1);
  }
  @supports not (border-inline-end-width: initial) {
  html:not([dir="rtl"]) .border-inline-end-1 {
    border-right-width: var(--sf-a1);
    }
  }
  .border-inline-end-1:where(:dir(ltr)) {
    border-right-width: var(--sf-a1);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-inline-end-1 {
    border-left-width: var(--sf-a1);
  }
  @supports not (border-inline-end-width: initial) {
  [dir="rtl"] .border-inline-end-1 {
    border-left-width: var(--sf-a1);
    }
  }
  .border-inline-end-1:where(:dir(rtl)) {
    border-left-width: var(--sf-a1);
  }
  .border-inline-end-1 {
    border-inline-end-width: var(--sf-a1);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-inline-end-2 {
    border-right-width: var(--sf-a2);
  }
  @supports not (border-inline-end-width: initial) {
  html:not([dir="rtl"]) .border-inline-end-2 {
    border-right-width: var(--sf-a2);
    }
  }
  .border-inline-end-2:where(:dir(ltr)) {
    border-right-width: var(--sf-a2);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-inline-end-2 {
    border-left-width: var(--sf-a2);
  }
  @supports not (border-inline-end-width: initial) {
  [dir="rtl"] .border-inline-end-2 {
    border-left-width: var(--sf-a2);
    }
  }
  .border-inline-end-2:where(:dir(rtl)) {
    border-left-width: var(--sf-a2);
  }
  .border-inline-end-2 {
    border-inline-end-width: var(--sf-a2);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-inline-end-3 {
    border-right-width: var(--sf-a3);
  }
  @supports not (border-inline-end-width: initial) {
  html:not([dir="rtl"]) .border-inline-end-3 {
    border-right-width: var(--sf-a3);
    }
  }
  .border-inline-end-3:where(:dir(ltr)) {
    border-right-width: var(--sf-a3);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-inline-end-3 {
    border-left-width: var(--sf-a3);
  }
  @supports not (border-inline-end-width: initial) {
  [dir="rtl"] .border-inline-end-3 {
    border-left-width: var(--sf-a3);
    }
  }
  .border-inline-end-3:where(:dir(rtl)) {
    border-left-width: var(--sf-a3);
  }
  .border-inline-end-3 {
    border-inline-end-width: var(--sf-a3);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-inline-end-4 {
    border-right-width: var(--sf-a4);
  }
  @supports not (border-inline-end-width: initial) {
  html:not([dir="rtl"]) .border-inline-end-4 {
    border-right-width: var(--sf-a4);
    }
  }
  .border-inline-end-4:where(:dir(ltr)) {
    border-right-width: var(--sf-a4);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-inline-end-4 {
    border-left-width: var(--sf-a4);
  }
  @supports not (border-inline-end-width: initial) {
  [dir="rtl"] .border-inline-end-4 {
    border-left-width: var(--sf-a4);
    }
  }
  .border-inline-end-4:where(:dir(rtl)) {
    border-left-width: var(--sf-a4);
  }
  .border-inline-end-4 {
    border-inline-end-width: var(--sf-a4);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-inline-end-5 {
    border-right-width: var(--sf-a5);
  }
  @supports not (border-inline-end-width: initial) {
  html:not([dir="rtl"]) .border-inline-end-5 {
    border-right-width: var(--sf-a5);
    }
  }
  .border-inline-end-5:where(:dir(ltr)) {
    border-right-width: var(--sf-a5);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-inline-end-5 {
    border-left-width: var(--sf-a5);
  }
  @supports not (border-inline-end-width: initial) {
  [dir="rtl"] .border-inline-end-5 {
    border-left-width: var(--sf-a5);
    }
  }
  .border-inline-end-5:where(:dir(rtl)) {
    border-left-width: var(--sf-a5);
  }
  .border-inline-end-5 {
    border-inline-end-width: var(--sf-a5);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-inline-end-6 {
    border-right-width: var(--sf-a6);
  }
  @supports not (border-inline-end-width: initial) {
  html:not([dir="rtl"]) .border-inline-end-6 {
    border-right-width: var(--sf-a6);
    }
  }
  .border-inline-end-6:where(:dir(ltr)) {
    border-right-width: var(--sf-a6);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-inline-end-6 {
    border-left-width: var(--sf-a6);
  }
  @supports not (border-inline-end-width: initial) {
  [dir="rtl"] .border-inline-end-6 {
    border-left-width: var(--sf-a6);
    }
  }
  .border-inline-end-6:where(:dir(rtl)) {
    border-left-width: var(--sf-a6);
  }
  .border-inline-end-6 {
    border-inline-end-width: var(--sf-a6);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-inline-end-7 {
    border-right-width: var(--sf-a7);
  }
  @supports not (border-inline-end-width: initial) {
  html:not([dir="rtl"]) .border-inline-end-7 {
    border-right-width: var(--sf-a7);
    }
  }
  .border-inline-end-7:where(:dir(ltr)) {
    border-right-width: var(--sf-a7);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-inline-end-7 {
    border-left-width: var(--sf-a7);
  }
  @supports not (border-inline-end-width: initial) {
  [dir="rtl"] .border-inline-end-7 {
    border-left-width: var(--sf-a7);
    }
  }
  .border-inline-end-7:where(:dir(rtl)) {
    border-left-width: var(--sf-a7);
  }
  .border-inline-end-7 {
    border-inline-end-width: var(--sf-a7);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-inline-end-8 {
    border-right-width: var(--sf-a8);
  }
  @supports not (border-inline-end-width: initial) {
  html:not([dir="rtl"]) .border-inline-end-8 {
    border-right-width: var(--sf-a8);
    }
  }
  .border-inline-end-8:where(:dir(ltr)) {
    border-right-width: var(--sf-a8);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-inline-end-8 {
    border-left-width: var(--sf-a8);
  }
  @supports not (border-inline-end-width: initial) {
  [dir="rtl"] .border-inline-end-8 {
    border-left-width: var(--sf-a8);
    }
  }
  .border-inline-end-8:where(:dir(rtl)) {
    border-left-width: var(--sf-a8);
  }
  .border-inline-end-8 {
    border-inline-end-width: var(--sf-a8);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-inline-end-9 {
    border-right-width: var(--sf-a9);
  }
  @supports not (border-inline-end-width: initial) {
  html:not([dir="rtl"]) .border-inline-end-9 {
    border-right-width: var(--sf-a9);
    }
  }
  .border-inline-end-9:where(:dir(ltr)) {
    border-right-width: var(--sf-a9);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-inline-end-9 {
    border-left-width: var(--sf-a9);
  }
  @supports not (border-inline-end-width: initial) {
  [dir="rtl"] .border-inline-end-9 {
    border-left-width: var(--sf-a9);
    }
  }
  .border-inline-end-9:where(:dir(rtl)) {
    border-left-width: var(--sf-a9);
  }
  .border-inline-end-9 {
    border-inline-end-width: var(--sf-a9);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-inline-end-10 {
    border-right-width: var(--sf-b0);
  }
  @supports not (border-inline-end-width: initial) {
  html:not([dir="rtl"]) .border-inline-end-10 {
    border-right-width: var(--sf-b0);
    }
  }
  .border-inline-end-10:where(:dir(ltr)) {
    border-right-width: var(--sf-b0);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-inline-end-10 {
    border-left-width: var(--sf-b0);
  }
  @supports not (border-inline-end-width: initial) {
  [dir="rtl"] .border-inline-end-10 {
    border-left-width: var(--sf-b0);
    }
  }
  .border-inline-end-10:where(:dir(rtl)) {
    border-left-width: var(--sf-b0);
  }
  .border-inline-end-10 {
    border-inline-end-width: var(--sf-b0);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-inline-end-0 {
    border-right-width: var(--sf-0);
  }
  @supports not (border-inline-end-width: initial) {
  html:not([dir="rtl"]) .border-inline-end-0 {
    border-right-width: var(--sf-0);
    }
  }
  .border-inline-end-0:where(:dir(ltr)) {
    border-right-width: var(--sf-0);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-inline-end-0 {
    border-left-width: var(--sf-0);
  }
  @supports not (border-inline-end-width: initial) {
  [dir="rtl"] .border-inline-end-0 {
    border-left-width: var(--sf-0);
    }
  }
  .border-inline-end-0:where(:dir(rtl)) {
    border-left-width: var(--sf-0);
  }
  .border-inline-end-0 {
    border-inline-end-width: var(--sf-0);
  }
  .border-bottom-1 {
    border-bottom-width: var(--sf-a1);
  }
  .border-bottom-2 {
    border-bottom-width: var(--sf-a2);
  }
  .border-bottom-3 {
    border-bottom-width: var(--sf-a3);
  }
  .border-bottom-4 {
    border-bottom-width: var(--sf-a4);
  }
  .border-bottom-5 {
    border-bottom-width: var(--sf-a5);
  }
  .border-bottom-6 {
    border-bottom-width: var(--sf-a6);
  }
  .border-bottom-7 {
    border-bottom-width: var(--sf-a7);
  }
  .border-bottom-8 {
    border-bottom-width: var(--sf-a8);
  }
  .border-bottom-9 {
    border-bottom-width: var(--sf-a9);
  }
  .border-bottom-10 {
    border-bottom-width: var(--sf-b0);
  }
  .border-bottom-0 {
    border-bottom-width: var(--sf-0);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-inline-start-1 {
    border-left-width: var(--sf-a1);
  }
  @supports not (border-inline-start-width: initial) {
  html:not([dir="rtl"]) .border-inline-start-1 {
    border-left-width: var(--sf-a1);
    }
  }
  .border-inline-start-1:where(:dir(ltr)) {
    border-left-width: var(--sf-a1);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-inline-start-1 {
    border-right-width: var(--sf-a1);
  }
  @supports not (border-inline-start-width: initial) {
  [dir="rtl"] .border-inline-start-1 {
    border-right-width: var(--sf-a1);
    }
  }
  .border-inline-start-1:where(:dir(rtl)) {
    border-right-width: var(--sf-a1);
  }
  .border-inline-start-1 {
    border-inline-start-width: var(--sf-a1);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-inline-start-2 {
    border-left-width: var(--sf-a2);
  }
  @supports not (border-inline-start-width: initial) {
  html:not([dir="rtl"]) .border-inline-start-2 {
    border-left-width: var(--sf-a2);
    }
  }
  .border-inline-start-2:where(:dir(ltr)) {
    border-left-width: var(--sf-a2);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-inline-start-2 {
    border-right-width: var(--sf-a2);
  }
  @supports not (border-inline-start-width: initial) {
  [dir="rtl"] .border-inline-start-2 {
    border-right-width: var(--sf-a2);
    }
  }
  .border-inline-start-2:where(:dir(rtl)) {
    border-right-width: var(--sf-a2);
  }
  .border-inline-start-2 {
    border-inline-start-width: var(--sf-a2);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-inline-start-3 {
    border-left-width: var(--sf-a3);
  }
  @supports not (border-inline-start-width: initial) {
  html:not([dir="rtl"]) .border-inline-start-3 {
    border-left-width: var(--sf-a3);
    }
  }
  .border-inline-start-3:where(:dir(ltr)) {
    border-left-width: var(--sf-a3);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-inline-start-3 {
    border-right-width: var(--sf-a3);
  }
  @supports not (border-inline-start-width: initial) {
  [dir="rtl"] .border-inline-start-3 {
    border-right-width: var(--sf-a3);
    }
  }
  .border-inline-start-3:where(:dir(rtl)) {
    border-right-width: var(--sf-a3);
  }
  .border-inline-start-3 {
    border-inline-start-width: var(--sf-a3);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-inline-start-4 {
    border-left-width: var(--sf-a4);
  }
  @supports not (border-inline-start-width: initial) {
  html:not([dir="rtl"]) .border-inline-start-4 {
    border-left-width: var(--sf-a4);
    }
  }
  .border-inline-start-4:where(:dir(ltr)) {
    border-left-width: var(--sf-a4);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-inline-start-4 {
    border-right-width: var(--sf-a4);
  }
  @supports not (border-inline-start-width: initial) {
  [dir="rtl"] .border-inline-start-4 {
    border-right-width: var(--sf-a4);
    }
  }
  .border-inline-start-4:where(:dir(rtl)) {
    border-right-width: var(--sf-a4);
  }
  .border-inline-start-4 {
    border-inline-start-width: var(--sf-a4);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-inline-start-5 {
    border-left-width: var(--sf-a5);
  }
  @supports not (border-inline-start-width: initial) {
  html:not([dir="rtl"]) .border-inline-start-5 {
    border-left-width: var(--sf-a5);
    }
  }
  .border-inline-start-5:where(:dir(ltr)) {
    border-left-width: var(--sf-a5);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-inline-start-5 {
    border-right-width: var(--sf-a5);
  }
  @supports not (border-inline-start-width: initial) {
  [dir="rtl"] .border-inline-start-5 {
    border-right-width: var(--sf-a5);
    }
  }
  .border-inline-start-5:where(:dir(rtl)) {
    border-right-width: var(--sf-a5);
  }
  .border-inline-start-5 {
    border-inline-start-width: var(--sf-a5);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-inline-start-6 {
    border-left-width: var(--sf-a6);
  }
  @supports not (border-inline-start-width: initial) {
  html:not([dir="rtl"]) .border-inline-start-6 {
    border-left-width: var(--sf-a6);
    }
  }
  .border-inline-start-6:where(:dir(ltr)) {
    border-left-width: var(--sf-a6);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-inline-start-6 {
    border-right-width: var(--sf-a6);
  }
  @supports not (border-inline-start-width: initial) {
  [dir="rtl"] .border-inline-start-6 {
    border-right-width: var(--sf-a6);
    }
  }
  .border-inline-start-6:where(:dir(rtl)) {
    border-right-width: var(--sf-a6);
  }
  .border-inline-start-6 {
    border-inline-start-width: var(--sf-a6);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-inline-start-7 {
    border-left-width: var(--sf-a7);
  }
  @supports not (border-inline-start-width: initial) {
  html:not([dir="rtl"]) .border-inline-start-7 {
    border-left-width: var(--sf-a7);
    }
  }
  .border-inline-start-7:where(:dir(ltr)) {
    border-left-width: var(--sf-a7);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-inline-start-7 {
    border-right-width: var(--sf-a7);
  }
  @supports not (border-inline-start-width: initial) {
  [dir="rtl"] .border-inline-start-7 {
    border-right-width: var(--sf-a7);
    }
  }
  .border-inline-start-7:where(:dir(rtl)) {
    border-right-width: var(--sf-a7);
  }
  .border-inline-start-7 {
    border-inline-start-width: var(--sf-a7);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-inline-start-8 {
    border-left-width: var(--sf-a8);
  }
  @supports not (border-inline-start-width: initial) {
  html:not([dir="rtl"]) .border-inline-start-8 {
    border-left-width: var(--sf-a8);
    }
  }
  .border-inline-start-8:where(:dir(ltr)) {
    border-left-width: var(--sf-a8);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-inline-start-8 {
    border-right-width: var(--sf-a8);
  }
  @supports not (border-inline-start-width: initial) {
  [dir="rtl"] .border-inline-start-8 {
    border-right-width: var(--sf-a8);
    }
  }
  .border-inline-start-8:where(:dir(rtl)) {
    border-right-width: var(--sf-a8);
  }
  .border-inline-start-8 {
    border-inline-start-width: var(--sf-a8);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-inline-start-9 {
    border-left-width: var(--sf-a9);
  }
  @supports not (border-inline-start-width: initial) {
  html:not([dir="rtl"]) .border-inline-start-9 {
    border-left-width: var(--sf-a9);
    }
  }
  .border-inline-start-9:where(:dir(ltr)) {
    border-left-width: var(--sf-a9);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-inline-start-9 {
    border-right-width: var(--sf-a9);
  }
  @supports not (border-inline-start-width: initial) {
  [dir="rtl"] .border-inline-start-9 {
    border-right-width: var(--sf-a9);
    }
  }
  .border-inline-start-9:where(:dir(rtl)) {
    border-right-width: var(--sf-a9);
  }
  .border-inline-start-9 {
    border-inline-start-width: var(--sf-a9);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-inline-start-10 {
    border-left-width: var(--sf-b0);
  }
  @supports not (border-inline-start-width: initial) {
  html:not([dir="rtl"]) .border-inline-start-10 {
    border-left-width: var(--sf-b0);
    }
  }
  .border-inline-start-10:where(:dir(ltr)) {
    border-left-width: var(--sf-b0);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-inline-start-10 {
    border-right-width: var(--sf-b0);
  }
  @supports not (border-inline-start-width: initial) {
  [dir="rtl"] .border-inline-start-10 {
    border-right-width: var(--sf-b0);
    }
  }
  .border-inline-start-10:where(:dir(rtl)) {
    border-right-width: var(--sf-b0);
  }
  .border-inline-start-10 {
    border-inline-start-width: var(--sf-b0);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-inline-start-0 {
    border-left-width: var(--sf-0);
  }
  @supports not (border-inline-start-width: initial) {
  html:not([dir="rtl"]) .border-inline-start-0 {
    border-left-width: var(--sf-0);
    }
  }
  .border-inline-start-0:where(:dir(ltr)) {
    border-left-width: var(--sf-0);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-inline-start-0 {
    border-right-width: var(--sf-0);
  }
  @supports not (border-inline-start-width: initial) {
  [dir="rtl"] .border-inline-start-0 {
    border-right-width: var(--sf-0);
    }
  }
  .border-inline-start-0:where(:dir(rtl)) {
    border-right-width: var(--sf-0);
  }
  .border-inline-start-0 {
    border-inline-start-width: var(--sf-0);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-x-1 {
    border-right-width: var(--sf-a1);
  }
  @supports not (border-inline-end-width: initial) {
  html:not([dir="rtl"]) .border-x-1 {
    border-right-width: var(--sf-a1);
    }
  }
  .border-x-1:where(:dir(ltr)) {
    border-right-width: var(--sf-a1);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-x-1 {
    border-left-width: var(--sf-a1);
  }
  @supports not (border-inline-end-width: initial) {
  [dir="rtl"] .border-x-1 {
    border-left-width: var(--sf-a1);
    }
  }
  .border-x-1:where(:dir(rtl)) {
    border-left-width: var(--sf-a1);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-x-1 {
    border-left-width: var(--sf-a1);
  }
  @supports not (border-inline-start-width: initial) {
  html:not([dir="rtl"]) .border-x-1 {
    border-left-width: var(--sf-a1);
    }
  }
  .border-x-1:where(:dir(ltr)) {
    border-left-width: var(--sf-a1);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-x-1 {
    border-right-width: var(--sf-a1);
  }
  @supports not (border-inline-start-width: initial) {
  [dir="rtl"] .border-x-1 {
    border-right-width: var(--sf-a1);
    }
  }
  .border-x-1:where(:dir(rtl)) {
    border-right-width: var(--sf-a1);
  }
  .border-x-1 {
    border-inline-end-width: var(--sf-a1);
    border-inline-start-width: var(--sf-a1);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-x-2 {
    border-right-width: var(--sf-a2);
  }
  @supports not (border-inline-end-width: initial) {
  html:not([dir="rtl"]) .border-x-2 {
    border-right-width: var(--sf-a2);
    }
  }
  .border-x-2:where(:dir(ltr)) {
    border-right-width: var(--sf-a2);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-x-2 {
    border-left-width: var(--sf-a2);
  }
  @supports not (border-inline-end-width: initial) {
  [dir="rtl"] .border-x-2 {
    border-left-width: var(--sf-a2);
    }
  }
  .border-x-2:where(:dir(rtl)) {
    border-left-width: var(--sf-a2);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-x-2 {
    border-left-width: var(--sf-a2);
  }
  @supports not (border-inline-start-width: initial) {
  html:not([dir="rtl"]) .border-x-2 {
    border-left-width: var(--sf-a2);
    }
  }
  .border-x-2:where(:dir(ltr)) {
    border-left-width: var(--sf-a2);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-x-2 {
    border-right-width: var(--sf-a2);
  }
  @supports not (border-inline-start-width: initial) {
  [dir="rtl"] .border-x-2 {
    border-right-width: var(--sf-a2);
    }
  }
  .border-x-2:where(:dir(rtl)) {
    border-right-width: var(--sf-a2);
  }
  .border-x-2 {
    border-inline-end-width: var(--sf-a2);
    border-inline-start-width: var(--sf-a2);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-x-3 {
    border-right-width: var(--sf-a3);
  }
  @supports not (border-inline-end-width: initial) {
  html:not([dir="rtl"]) .border-x-3 {
    border-right-width: var(--sf-a3);
    }
  }
  .border-x-3:where(:dir(ltr)) {
    border-right-width: var(--sf-a3);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-x-3 {
    border-left-width: var(--sf-a3);
  }
  @supports not (border-inline-end-width: initial) {
  [dir="rtl"] .border-x-3 {
    border-left-width: var(--sf-a3);
    }
  }
  .border-x-3:where(:dir(rtl)) {
    border-left-width: var(--sf-a3);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-x-3 {
    border-left-width: var(--sf-a3);
  }
  @supports not (border-inline-start-width: initial) {
  html:not([dir="rtl"]) .border-x-3 {
    border-left-width: var(--sf-a3);
    }
  }
  .border-x-3:where(:dir(ltr)) {
    border-left-width: var(--sf-a3);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-x-3 {
    border-right-width: var(--sf-a3);
  }
  @supports not (border-inline-start-width: initial) {
  [dir="rtl"] .border-x-3 {
    border-right-width: var(--sf-a3);
    }
  }
  .border-x-3:where(:dir(rtl)) {
    border-right-width: var(--sf-a3);
  }
  .border-x-3 {
    border-inline-end-width: var(--sf-a3);
    border-inline-start-width: var(--sf-a3);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-x-4 {
    border-right-width: var(--sf-a4);
  }
  @supports not (border-inline-end-width: initial) {
  html:not([dir="rtl"]) .border-x-4 {
    border-right-width: var(--sf-a4);
    }
  }
  .border-x-4:where(:dir(ltr)) {
    border-right-width: var(--sf-a4);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-x-4 {
    border-left-width: var(--sf-a4);
  }
  @supports not (border-inline-end-width: initial) {
  [dir="rtl"] .border-x-4 {
    border-left-width: var(--sf-a4);
    }
  }
  .border-x-4:where(:dir(rtl)) {
    border-left-width: var(--sf-a4);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-x-4 {
    border-left-width: var(--sf-a4);
  }
  @supports not (border-inline-start-width: initial) {
  html:not([dir="rtl"]) .border-x-4 {
    border-left-width: var(--sf-a4);
    }
  }
  .border-x-4:where(:dir(ltr)) {
    border-left-width: var(--sf-a4);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-x-4 {
    border-right-width: var(--sf-a4);
  }
  @supports not (border-inline-start-width: initial) {
  [dir="rtl"] .border-x-4 {
    border-right-width: var(--sf-a4);
    }
  }
  .border-x-4:where(:dir(rtl)) {
    border-right-width: var(--sf-a4);
  }
  .border-x-4 {
    border-inline-end-width: var(--sf-a4);
    border-inline-start-width: var(--sf-a4);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-x-5 {
    border-right-width: var(--sf-a5);
  }
  @supports not (border-inline-end-width: initial) {
  html:not([dir="rtl"]) .border-x-5 {
    border-right-width: var(--sf-a5);
    }
  }
  .border-x-5:where(:dir(ltr)) {
    border-right-width: var(--sf-a5);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-x-5 {
    border-left-width: var(--sf-a5);
  }
  @supports not (border-inline-end-width: initial) {
  [dir="rtl"] .border-x-5 {
    border-left-width: var(--sf-a5);
    }
  }
  .border-x-5:where(:dir(rtl)) {
    border-left-width: var(--sf-a5);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-x-5 {
    border-left-width: var(--sf-a5);
  }
  @supports not (border-inline-start-width: initial) {
  html:not([dir="rtl"]) .border-x-5 {
    border-left-width: var(--sf-a5);
    }
  }
  .border-x-5:where(:dir(ltr)) {
    border-left-width: var(--sf-a5);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-x-5 {
    border-right-width: var(--sf-a5);
  }
  @supports not (border-inline-start-width: initial) {
  [dir="rtl"] .border-x-5 {
    border-right-width: var(--sf-a5);
    }
  }
  .border-x-5:where(:dir(rtl)) {
    border-right-width: var(--sf-a5);
  }
  .border-x-5 {
    border-inline-end-width: var(--sf-a5);
    border-inline-start-width: var(--sf-a5);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-x-6 {
    border-right-width: var(--sf-a6);
  }
  @supports not (border-inline-end-width: initial) {
  html:not([dir="rtl"]) .border-x-6 {
    border-right-width: var(--sf-a6);
    }
  }
  .border-x-6:where(:dir(ltr)) {
    border-right-width: var(--sf-a6);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-x-6 {
    border-left-width: var(--sf-a6);
  }
  @supports not (border-inline-end-width: initial) {
  [dir="rtl"] .border-x-6 {
    border-left-width: var(--sf-a6);
    }
  }
  .border-x-6:where(:dir(rtl)) {
    border-left-width: var(--sf-a6);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-x-6 {
    border-left-width: var(--sf-a6);
  }
  @supports not (border-inline-start-width: initial) {
  html:not([dir="rtl"]) .border-x-6 {
    border-left-width: var(--sf-a6);
    }
  }
  .border-x-6:where(:dir(ltr)) {
    border-left-width: var(--sf-a6);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-x-6 {
    border-right-width: var(--sf-a6);
  }
  @supports not (border-inline-start-width: initial) {
  [dir="rtl"] .border-x-6 {
    border-right-width: var(--sf-a6);
    }
  }
  .border-x-6:where(:dir(rtl)) {
    border-right-width: var(--sf-a6);
  }
  .border-x-6 {
    border-inline-end-width: var(--sf-a6);
    border-inline-start-width: var(--sf-a6);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-x-7 {
    border-right-width: var(--sf-a7);
  }
  @supports not (border-inline-end-width: initial) {
  html:not([dir="rtl"]) .border-x-7 {
    border-right-width: var(--sf-a7);
    }
  }
  .border-x-7:where(:dir(ltr)) {
    border-right-width: var(--sf-a7);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-x-7 {
    border-left-width: var(--sf-a7);
  }
  @supports not (border-inline-end-width: initial) {
  [dir="rtl"] .border-x-7 {
    border-left-width: var(--sf-a7);
    }
  }
  .border-x-7:where(:dir(rtl)) {
    border-left-width: var(--sf-a7);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-x-7 {
    border-left-width: var(--sf-a7);
  }
  @supports not (border-inline-start-width: initial) {
  html:not([dir="rtl"]) .border-x-7 {
    border-left-width: var(--sf-a7);
    }
  }
  .border-x-7:where(:dir(ltr)) {
    border-left-width: var(--sf-a7);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-x-7 {
    border-right-width: var(--sf-a7);
  }
  @supports not (border-inline-start-width: initial) {
  [dir="rtl"] .border-x-7 {
    border-right-width: var(--sf-a7);
    }
  }
  .border-x-7:where(:dir(rtl)) {
    border-right-width: var(--sf-a7);
  }
  .border-x-7 {
    border-inline-end-width: var(--sf-a7);
    border-inline-start-width: var(--sf-a7);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-x-8 {
    border-right-width: var(--sf-a8);
  }
  @supports not (border-inline-end-width: initial) {
  html:not([dir="rtl"]) .border-x-8 {
    border-right-width: var(--sf-a8);
    }
  }
  .border-x-8:where(:dir(ltr)) {
    border-right-width: var(--sf-a8);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-x-8 {
    border-left-width: var(--sf-a8);
  }
  @supports not (border-inline-end-width: initial) {
  [dir="rtl"] .border-x-8 {
    border-left-width: var(--sf-a8);
    }
  }
  .border-x-8:where(:dir(rtl)) {
    border-left-width: var(--sf-a8);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-x-8 {
    border-left-width: var(--sf-a8);
  }
  @supports not (border-inline-start-width: initial) {
  html:not([dir="rtl"]) .border-x-8 {
    border-left-width: var(--sf-a8);
    }
  }
  .border-x-8:where(:dir(ltr)) {
    border-left-width: var(--sf-a8);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-x-8 {
    border-right-width: var(--sf-a8);
  }
  @supports not (border-inline-start-width: initial) {
  [dir="rtl"] .border-x-8 {
    border-right-width: var(--sf-a8);
    }
  }
  .border-x-8:where(:dir(rtl)) {
    border-right-width: var(--sf-a8);
  }
  .border-x-8 {
    border-inline-end-width: var(--sf-a8);
    border-inline-start-width: var(--sf-a8);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-x-9 {
    border-right-width: var(--sf-a9);
  }
  @supports not (border-inline-end-width: initial) {
  html:not([dir="rtl"]) .border-x-9 {
    border-right-width: var(--sf-a9);
    }
  }
  .border-x-9:where(:dir(ltr)) {
    border-right-width: var(--sf-a9);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-x-9 {
    border-left-width: var(--sf-a9);
  }
  @supports not (border-inline-end-width: initial) {
  [dir="rtl"] .border-x-9 {
    border-left-width: var(--sf-a9);
    }
  }
  .border-x-9:where(:dir(rtl)) {
    border-left-width: var(--sf-a9);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-x-9 {
    border-left-width: var(--sf-a9);
  }
  @supports not (border-inline-start-width: initial) {
  html:not([dir="rtl"]) .border-x-9 {
    border-left-width: var(--sf-a9);
    }
  }
  .border-x-9:where(:dir(ltr)) {
    border-left-width: var(--sf-a9);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-x-9 {
    border-right-width: var(--sf-a9);
  }
  @supports not (border-inline-start-width: initial) {
  [dir="rtl"] .border-x-9 {
    border-right-width: var(--sf-a9);
    }
  }
  .border-x-9:where(:dir(rtl)) {
    border-right-width: var(--sf-a9);
  }
  .border-x-9 {
    border-inline-end-width: var(--sf-a9);
    border-inline-start-width: var(--sf-a9);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-x-10 {
    border-right-width: var(--sf-b0);
  }
  @supports not (border-inline-end-width: initial) {
  html:not([dir="rtl"]) .border-x-10 {
    border-right-width: var(--sf-b0);
    }
  }
  .border-x-10:where(:dir(ltr)) {
    border-right-width: var(--sf-b0);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-x-10 {
    border-left-width: var(--sf-b0);
  }
  @supports not (border-inline-end-width: initial) {
  [dir="rtl"] .border-x-10 {
    border-left-width: var(--sf-b0);
    }
  }
  .border-x-10:where(:dir(rtl)) {
    border-left-width: var(--sf-b0);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-x-10 {
    border-left-width: var(--sf-b0);
  }
  @supports not (border-inline-start-width: initial) {
  html:not([dir="rtl"]) .border-x-10 {
    border-left-width: var(--sf-b0);
    }
  }
  .border-x-10:where(:dir(ltr)) {
    border-left-width: var(--sf-b0);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-x-10 {
    border-right-width: var(--sf-b0);
  }
  @supports not (border-inline-start-width: initial) {
  [dir="rtl"] .border-x-10 {
    border-right-width: var(--sf-b0);
    }
  }
  .border-x-10:where(:dir(rtl)) {
    border-right-width: var(--sf-b0);
  }
  .border-x-10 {
    border-inline-end-width: var(--sf-b0);
    border-inline-start-width: var(--sf-b0);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-x-0 {
    border-right-width: var(--sf-0);
  }
  @supports not (border-inline-end-width: initial) {
  html:not([dir="rtl"]) .border-x-0 {
    border-right-width: var(--sf-0);
    }
  }
  .border-x-0:where(:dir(ltr)) {
    border-right-width: var(--sf-0);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-x-0 {
    border-left-width: var(--sf-0);
  }
  @supports not (border-inline-end-width: initial) {
  [dir="rtl"] .border-x-0 {
    border-left-width: var(--sf-0);
    }
  }
  .border-x-0:where(:dir(rtl)) {
    border-left-width: var(--sf-0);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .border-x-0 {
    border-left-width: var(--sf-0);
  }
  @supports not (border-inline-start-width: initial) {
  html:not([dir="rtl"]) .border-x-0 {
    border-left-width: var(--sf-0);
    }
  }
  .border-x-0:where(:dir(ltr)) {
    border-left-width: var(--sf-0);
  }
  _:-ms-input-placeholder, [dir="rtl"] .border-x-0 {
    border-right-width: var(--sf-0);
  }
  @supports not (border-inline-start-width: initial) {
  [dir="rtl"] .border-x-0 {
    border-right-width: var(--sf-0);
    }
  }
  .border-x-0:where(:dir(rtl)) {
    border-right-width: var(--sf-0);
  }
  .border-x-0 {
    border-inline-end-width: var(--sf-0);
    border-inline-start-width: var(--sf-0);
  }
  .border-y-1 {
    border-top-width: var(--sf-a1);
    border-bottom-width: var(--sf-a1);
  }
  .border-y-2 {
    border-top-width: var(--sf-a2);
    border-bottom-width: var(--sf-a2);
  }
  .border-y-3 {
    border-top-width: var(--sf-a3);
    border-bottom-width: var(--sf-a3);
  }
  .border-y-4 {
    border-top-width: var(--sf-a4);
    border-bottom-width: var(--sf-a4);
  }
  .border-y-5 {
    border-top-width: var(--sf-a5);
    border-bottom-width: var(--sf-a5);
  }
  .border-y-6 {
    border-top-width: var(--sf-a6);
    border-bottom-width: var(--sf-a6);
  }
  .border-y-7 {
    border-top-width: var(--sf-a7);
    border-bottom-width: var(--sf-a7);
  }
  .border-y-8 {
    border-top-width: var(--sf-a8);
    border-bottom-width: var(--sf-a8);
  }
  .border-y-9 {
    border-top-width: var(--sf-a9);
    border-bottom-width: var(--sf-a9);
  }
  .border-y-10 {
    border-top-width: var(--sf-b0);
    border-bottom-width: var(--sf-b0);
  }
  .border-y-0 {
    border-top-width: var(--sf-0);
    border-bottom-width: var(--sf-0);
  }
}

/* docara-shell-source: runtime/component/breadcrumbs/css/breadcrumbs.css */
/*
* Main SCSS file for including styles for component.
*
* Imports:
* - Styling variables (_var__component_name.scss)
* - Base styles (_css__component_name.scss)
*
*/
/*
* _var__component_name.scss
* 
* SCSS file containing variables for component styling.
* 
* Used to define default parameters (color, size, etc.)
* that can be overridden in other parts of the project.
* 
* Example usage:
* --sf-icon--fill: 0; // Fill for icon
*/
@layer sf.components {
  /* utility-hint: display/flex (.flex) flex-direction/row (.flex-row) flex-wrap/nowrap (.flex-nowrap) justify-content/flex-start (.justify-start) align-items/center (.items-center) */
  .sf-breadcrumbs-item {
    min-width: -webkit-min-content;
    min-width: -moz-min-content;
    min-width: min-content;
    min-inline-size: -webkit-min-content;
    min-inline-size: -moz-min-content;
    min-inline-size: min-content;
    background-color: var(--sf-breadcrumbs-item--background-color);
    box-shadow: var(--sf-breadcrumbs-item--box-shadow);
    --sf-breadcrumbs-item--background-color: transparent;
    --sf-breadcrumbs-item--box-shadow: none;
  }
  .sf-breadcrumbs-item.sf-breadcrumbs-item--separator {
    flex: 0 0 auto;
  }
  /* utility-hint: display/flex (.flex) flex-direction/row (.flex-row) flex-wrap/nowrap (.flex-nowrap) gap/var(--sf-breadcrumbs-item-container--gap) justify-content/flex-start (.justify-start) align-items/center (.items-center) */
  .sf-breadcrumbs-item .sf-breadcrumbs-item-container {
    min-width: 0;
    min-inline-size: 0;
    word-wrap: anywhere;
    --sf-breadcrumbs-item-container--background-color: transparent;
    --sf-breadcrumbs-item-container--color: var(--sf-on-surface-variant);
    --sf-breadcrumbs-item-container--font-family: var(--sf-text--family);
    --sf-breadcrumbs-item-container--font-size: var(--sf-text-size-1\/2);
    --sf-breadcrumbs-item-container--font-weight: var(--sf-font-weight-regular);
    --sf-breadcrumbs-item-container--gap: var(--sf-space-1\/4);
    --sf-breadcrumbs-item-container--line-height: var(--sf-text-height-1\/2);
    background-color: var(--sf-breadcrumbs-item-container--background-color);
    color: var(--sf-breadcrumbs-item-container--color);
    font-family: var(--sf-breadcrumbs-item-container--font-family);
    font-size: var(--sf-breadcrumbs-item-container--font-size);
    font-weight: var(--sf-breadcrumbs-item-container--font-weight);
    gap: var(--sf-breadcrumbs-item-container--gap);
    line-height: var(--sf-breadcrumbs-item-container--line-height);
  }
  .sf-breadcrumbs-item .sf-breadcrumbs-item-container > .sf-icon, .sf-breadcrumbs-item .sf-breadcrumbs-item-container > sf-icon > .sf-icon {
    flex-shrink: 0;
    --sf-icon--font-size: var(--sf-text-height-1\/2);
    --sf-icon--height: var(--sf-text-height-1\/2);
    --sf-icon--width: var(--sf-text-height-1\/2);
    color: var(--sf-on-surface-variant);
    color: var(--sf-icon--color, var(--sf-on-surface-variant));
    font-size: var(--sf-icon--font-size);
    height: var(--sf-icon--height);
    width: var(--sf-icon--width);
  }
  .sf-breadcrumbs-item.sf-breadcrumbs-item--link .sf-breadcrumbs-item-container {
    --sf-breadcrumbs-item-container--color: var(--sf-primary);
  }
  .sf-breadcrumbs-item[aria-current=page] .sf-breadcrumbs-item-container,
  .sf-breadcrumbs-item .sf-breadcrumbs-item-container[aria-current=page] {
    --sf-breadcrumbs-item-container--color: var(--sf-on-surface);
    --sf-breadcrumbs-item-container--font-weight: var(--sf-font-weight-medium);
  }
}
@layer sf.states {
  .sf-breadcrumbs-item.sf-breadcrumbs-item--link:not(:disabled):not(.disabled):hover > .sf-breadcrumbs-item-container > .sf-icon, .sf-breadcrumbs-item.sf-breadcrumbs-item--link:not(:disabled):not(.disabled):hover > .sf-breadcrumbs-item-container > sf-icon > .sf-icon {
    --sf-icon--color: var(--sf-primary-hover);
  }
  .sf-breadcrumbs-item.sf-breadcrumbs-item--link:not(:disabled):not(.disabled):hover .sf-breadcrumbs-item-container {
    --sf-breadcrumbs-item-container--color: var(--sf-primary-hover);
  }
  .sf-breadcrumbs-item:not(:disabled):not(.disabled):active.sf-breadcrumbs-item--link > .sf-breadcrumbs-item-container > .sf-icon, .sf-breadcrumbs-item:not(:disabled):not(.disabled):active.sf-breadcrumbs-item--link > .sf-breadcrumbs-item-container > sf-icon > .sf-icon, .sf-breadcrumbs-item.active.sf-breadcrumbs-item--link > .sf-breadcrumbs-item-container > .sf-icon, .sf-breadcrumbs-item.active.sf-breadcrumbs-item--link > .sf-breadcrumbs-item-container > sf-icon > .sf-icon {
    --sf-icon--color: var(--sf-primary-active);
  }
  .sf-breadcrumbs-item:not(:disabled):not(.disabled):active.sf-breadcrumbs-item--link .sf-breadcrumbs-item-container, .sf-breadcrumbs-item.active.sf-breadcrumbs-item--link .sf-breadcrumbs-item-container {
    --sf-breadcrumbs-item-container--color: var(--sf-primary-active);
  }
  .sf-breadcrumbs-item.sf-breadcrumbs-item--link:not(:disabled):not(.disabled):not([aria-disabled=true]).focus-visible {
    --sf-breadcrumbs-item--background-color: var(--sf-transparent-for-focus);
    outline: var(--sf-focus--width) var(--sf-focus--style) var(--sf-focus--color);
    outline-offset: var(--sf-focus--offset);
  }
  .sf-breadcrumbs-item.sf-breadcrumbs-item--link:not(:disabled):not(.disabled):not([aria-disabled=true]):focus-visible {
    --sf-breadcrumbs-item--background-color: var(--sf-transparent-for-focus);
    outline: var(--sf-focus--width) var(--sf-focus--style) var(--sf-focus--color);
    outline-offset: var(--sf-focus--offset);
  }
  @media (forced-colors: active) {
    .sf-breadcrumbs-item.sf-breadcrumbs-item--link:not(:disabled):not(.disabled):not([aria-disabled=true]).focus-visible {
      outline: var(--sf-focus-outline-width) solid currentColor;
      outline-offset: var(--sf-focus-outline-width);
      --sf-breadcrumbs-item--box-shadow: none;
    }
    .sf-breadcrumbs-item.sf-breadcrumbs-item--link:not(:disabled):not(.disabled):not([aria-disabled=true]):focus-visible {
      outline: var(--sf-focus-outline-width) solid currentColor;
      outline-offset: var(--sf-focus-outline-width);
      --sf-breadcrumbs-item--box-shadow: none;
    }
  }
}
@layer sf.components {
  /* utility-hint: display/flex (.flex) flex-direction/row (.flex-row) flex-wrap/wrap (.flex-wrap) gap/var(--sf-space-1\/3) justify-content/flex-start (.justify-start) align-items/center (.items-center) */
  .sf-breadcrumbs {
    min-width: 0;
    min-inline-size: 0;
    max-width: 100%;
    max-inline-size: 100%;
    flex-wrap: wrap;
    background-color: transparent;
    background-color: var(--sf-breadcrumbs--background-color, transparent);
    gap: var(--sf-space-1\/3);
    gap: var(--sf-breadcrumbs--gap, var(--sf-space-1\/3));
    overscroll-behavior-inline: contain;
  }
  .sf-breadcrumbs-item[hidden] {
    display: none;
  }
  [dir=rtl] .sf-breadcrumbs .sf-breadcrumbs-item--separator .sf-icon,
  .sf-breadcrumbs[dir=rtl] .sf-breadcrumbs-item--separator .sf-icon {
    -webkit-transform: scaleX(-1);
            transform: scaleX(-1);
  }
}