railsui 3.1.0

data/app/assets/builds/railsui/application.css

@@ -0,0 +1,742 @@
+.railsui {
+  --color-rails: #c2281c;
+}
+
+.railsui .static-header {
+  transform: matrix(1, -0.212557, 0, 1, 0, 0);
+  min-width: 1000px;
+  min-height: 1200px;
+  transform-origin: 170.4px 545.417px;
+  z-index: -1;
+  left: 0;
+  bottom: -350px;
+  width: 100%;
+  overflow: hidden;
+  position: absolute;
+}
+
+.railsui .config-loader {
+  opacity: 0;
+  visibility: invisible;
+  z-index: 0;
+  transition: all 0.3s ease-in-out;
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  width: 100%;
+  height: 100%;
+  background: #372aac;
+}
+.railsui .config-loader.config-loader--active {
+  visibility: visible;
+  opacity: 1;
+  z-index: 40;
+  transition: all 0.3s ease-in-out;
+}
+.railsui [x-cloak] {
+  display: none;
+}
+.railsui .rui-primary-nav {
+  position: relative;
+}
+.railsui .rui-primary-nav ul li a.nav-link-active,
+.railsui .rui-primary-nav ul li a:hover {
+  border-right-width: 2px !important;
+  border-color: #e5e5e5cc !important;
+  --tw-text-opacity: 1 !important;
+  color: rgb(38 38 38 / var(--tw-text-opacity)) !important;
+}
+@media (prefers-color-scheme: dark) {
+  .railsui .rui-primary-nav ul li a.nav-link-active,
+  .railsui .rui-primary-nav ul li a:hover {
+    --tw-border-opacity: 1 !important;
+    border-color: rgb(252 211 77 / var(--tw-border-opacity)) !important;
+    --tw-text-opacity: 1 !important;
+    color: rgb(229 229 229 / var(--tw-text-opacity)) !important;
+  }
+}
+.railsui .rui-primary-nav ul li a.nav-link-active:after {
+  content: "";
+  background: none;
+}
+@media (prefers-color-scheme: dark) {
+  .railsui .rui-primary-nav ul li a:hover {
+    --tw-bg-opacity: 1;
+    background-color: rgb(38 38 38 / var(--tw-bg-opacity));
+  }
+}
+.railsui .rui-primary-nav ul li a.nav-link-active {
+  --tw-bg-opacity: 1;
+  background-color: rgb(238 242 255 / var(--tw-bg-opacity));
+  font-weight: 600;
+}
+@media (prefers-color-scheme: dark) {
+  .railsui .rui-primary-nav ul li a.nav-link-active {
+    --tw-bg-opacity: 1;
+    background-color: rgb(38 38 38 / var(--tw-bg-opacity));
+    --tw-text-opacity: 1;
+    color: rgb(255 255 255 / var(--tw-text-opacity));
+  }
+}
+pre code.hljs {
+  display: block;
+  overflow: auto !important;
+  padding: 1em;
+  font-family: Fira Code, monospace;
+  --scrollbar-track: #0a0a0a;
+  --scrollbar-thumb: #737373;
+}
+code.hljs {
+  padding: 3px 5px;
+}
+.hljs,
+.hljs-attr,
+.hljs-tag {
+  color: #f5f5f5;
+}
+.hljs-keyword {
+  color: #c792ea;
+  font-style: italic;
+}
+.hljs-built_in {
+  color: #addb67;
+  font-style: italic;
+}
+.hljs-type {
+  color: #82aaff;
+}
+.hljs-literal {
+  color: #ff5874;
+}
+.hljs-number {
+  color: #f78c6c;
+}
+.hljs-regexp {
+  color: #5ca7e4;
+}
+.hljs-string {
+  color: #7dd3fc;
+}
+.hljs-class {
+  color: #ffcb8b;
+}
+.hljs-function {
+  color: #82aaff;
+}
+.hljs-title {
+  color: #dcdcaa;
+  font-style: italic;
+}
+.hljs-params {
+  color: #7fdbca;
+}
+.hljs-comment {
+  color: #637777;
+  font-style: italic;
+}
+.hljs-doctag {
+  color: #7fdbca;
+}
+.hljs-meta,
+.hljs-meta .hljs-keyword {
+  color: #82aaff;
+}
+.hljs-meta .hljs-string {
+  color: #ecc48d;
+}
+.hljs-section {
+  color: #82b1ff;
+}
+.hljs-name,
+.hljs-selector-tag,
+.hljs-subst,
+.hljs-symbol {
+  color: #f472b6;
+}
+.hljs-attribute {
+  color: #80cbc4;
+}
+.hljs-variable {
+  color: #2dd4bf;
+}
+.hljs-bullet {
+  color: #d9f5dd;
+}
+.hljs-code {
+  color: #80cbc4;
+}
+.hljs-emphasis {
+  color: #c792ea;
+  font-style: italic;
+}
+.hljs-strong {
+  color: #addb67;
+  font-weight: 700;
+}
+.hljs-formula {
+  color: #c792ea;
+}
+.hljs-link {
+  color: #ff869a;
+}
+.hljs-quote {
+  color: #697098;
+  font-style: italic;
+}
+.hljs-selector-id {
+  color: #fad430;
+}
+.hljs-selector-class {
+  color: #38bdf8;
+  font-style: italic;
+}
+.hljs-selector-attr,
+.hljs-selector-pseudo {
+  color: #c792ea;
+  font-style: italic;
+}
+.hljs-template-tag {
+  color: #c792ea;
+}
+.hljs-template-variable {
+  color: #2dd4bf;
+}
+.hljs-addition {
+  color: #addb67;
+  font-style: italic;
+}
+.hljs-deletion {
+  color: #ef535090;
+  font-style: italic;
+}
+.railsui [data-controller="anchor"] {
+  position: relative;
+  cursor: pointer;
+}
+.railsui [data-controller="anchor"]:before {
+  content: "#";
+  position: absolute;
+  left: -1rem;
+  top: 0;
+  font-family: Fira Code, monospace;
+  font-size: 1.25rem;
+  line-height: 1.75rem;
+  font-weight: 600;
+  --tw-text-opacity: 1;
+  color: rgb(163 163 163 / var(--tw-text-opacity));
+  opacity: 0;
+  transition-property: color, background-color, border-color,
+    text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter,
+    -webkit-backdrop-filter;
+  transition-property: color, background-color, border-color,
+    text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter,
+    backdrop-filter;
+  transition-property: color, background-color, border-color,
+    text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter,
+    backdrop-filter, -webkit-backdrop-filter;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 0.3s;
+}
+.railsui [data-controller="anchor"]:hover:before {
+  opacity: 1;
+}
+.railsui .rui-form-input {
+  width: 100%;
+  border-radius: 0.375rem;
+  border-width: 1px;
+  border-color: #d4d4d4cc;
+  --tw-bg-opacity: 1;
+  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
+  padding: 0.5rem 1rem;
+  font-family: ui-sans-serif, system-ui, sans-serif, Apple Color Emoji,
+    Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
+  font-weight: 400;
+  --tw-text-opacity: 1;
+  color: rgb(38 38 38 / var(--tw-text-opacity));
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+.railsui .rui-form-input::-moz-placeholder {
+  color: #73737399;
+}
+.railsui .rui-form-input::placeholder {
+  color: #73737399;
+}
+.railsui .rui-form-input:focus {
+  border-color: #737373cc;
+  --tw-shadow: 0 0 #0000;
+  --tw-shadow-colored: 0 0 #0000;
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000),
+    var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+  outline: 2px solid #0000;
+  outline-offset: 2px;
+  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0
+    var(--tw-ring-offset-width) var(--tw-ring-offset-color);
+  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0
+    calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color);
+  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow),
+    var(--tw-shadow, 0 0 #0000);
+  --tw-ring-color: #f5f5f5cc;
+}
+@media (prefers-color-scheme: dark) {
+  .railsui .rui-form-input {
+    border-color: #404040cc;
+    --tw-bg-opacity: 1;
+    background-color: rgb(38 38 38 / var(--tw-bg-opacity));
+    --tw-text-opacity: 1;
+    color: rgb(250 250 250 / var(--tw-text-opacity));
+  }
+  .railsui .rui-form-input::-moz-placeholder {
+    color: #d4d4d499;
+  }
+  .railsui .rui-form-input::placeholder {
+    color: #d4d4d499;
+  }
+  .railsui .rui-form-input:focus {
+    --tw-border-opacity: 1;
+    border-color: rgb(115 115 115 / var(--tw-border-opacity));
+    --tw-ring-color: #73737366;
+  }
+}
+.railsui .rui-form-label {
+  margin-bottom: 0.5rem;
+  display: block;
+  font-size: 14px;
+  font-weight: 500;
+}
+@media (prefers-color-scheme: dark) {
+  .railsui .rui-form-label {
+    --tw-text-opacity: 1;
+    color: rgb(255 255 255 / var(--tw-text-opacity));
+  }
+}
+.railsui .rui-form-input-switch {
+  display: none;
+}
+.railsui .rui-form-input-switch:disabled + label {
+  cursor: not-allowed;
+  opacity: 0.7;
+}
+.railsui .rui-form-input-switch:disabled + label:after {
+  --tw-shadow: 0 0 #0000 !important;
+  --tw-shadow-colored: 0 0 #0000 !important;
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000),
+    var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
+}
+.railsui .rui-form-input-switch:checked + label:before {
+  --tw-bg-opacity: 1;
+  background-color: rgb(var(--primary-500) / var(--tw-bg-opacity));
+}
+.railsui .rui-form-input-switch:checked + label:after {
+  transform: translate3d(16px, 0, 0);
+  background-size: 10px 10px;
+  --tw-bg-opacity: 1;
+  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
+  background-position: 50%;
+  background-repeat: no-repeat;
+}
+@media (prefers-color-scheme: dark) {
+  .railsui .rui-form-input-switch:checked + label:after {
+    --tw-bg-opacity: 1;
+    background-color: rgb(228 228 231 / var(--tw-bg-opacity));
+  }
+}
+.railsui .rui-form-input-switch + label {
+  position: relative;
+  display: inline-flex;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  user-select: none;
+  font-family: ui-sans-serif, system-ui, sans-serif, Apple Color Emoji,
+    Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
+  font-size: 1rem;
+  line-height: 1.5rem;
+}
+.railsui .rui-form-input-switch + label:before {
+  margin-right: 0.5rem;
+  display: block;
+  height: 1.5rem;
+  width: 2.5rem;
+  flex-shrink: 0;
+  border-radius: 9999px;
+  --tw-bg-opacity: 1;
+  background-color: rgb(212 212 216 / var(--tw-bg-opacity));
+  transition-property: color, background-color, border-color,
+    text-decoration-color, fill, stroke;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 0.15s;
+  transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
+  --tw-content: "";
+  content: var(--tw-content);
+}
+@media (prefers-color-scheme: dark) {
+  .railsui .rui-form-input-switch + label:before {
+    --tw-bg-opacity: 1;
+    background-color: rgb(82 82 91 / var(--tw-bg-opacity));
+  }
+}
+.railsui .rui-form-input-switch + label:after {
+  position: absolute;
+  top: 4px;
+  left: 4px;
+  display: block;
+  width: 1rem;
+  height: 1rem;
+  border-radius: 9999px;
+  --tw-bg-opacity: 1;
+  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
+  --tw-shadow: 0 1px 2px 0 #0000000d;
+  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000),
+    var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+  transition-property: transform;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 0.15s;
+  transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
+  --tw-content: "";
+  content: var(--tw-content);
+}
+.railsui .rui-form-input-color {
+  height: 2rem;
+  width: 2rem;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+  border-radius: 0.375rem;
+  border-width: 1px;
+  --tw-border-opacity: 1;
+  border-color: rgb(229 229 229 / var(--tw-border-opacity));
+  transition-property: color, background-color, border-color,
+    text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter,
+    -webkit-backdrop-filter;
+  transition-property: color, background-color, border-color,
+    text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter,
+    backdrop-filter;
+  transition-property: color, background-color, border-color,
+    text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter,
+    backdrop-filter, -webkit-backdrop-filter;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 0.15s;
+}
+.railsui .rui-form-input-color:focus {
+  --tw-border-opacity: 1;
+  border-color: rgb(163 163 163 / var(--tw-border-opacity));
+  --tw-shadow: 0 1px 3px 0 #0000001a, 0 1px 2px -1px #0000001a;
+  --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color),
+    0 1px 2px -1px var(--tw-shadow-color);
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000),
+    var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0
+    var(--tw-ring-offset-width) var(--tw-ring-offset-color);
+  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0
+    calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color);
+  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow),
+    var(--tw-shadow, 0 0 #0000);
+  --tw-ring-color: #7373731a;
+}
+@media (prefers-color-scheme: dark) {
+  .railsui .rui-form-input-color {
+    --tw-border-opacity: 1;
+    border-color: rgb(82 82 82 / var(--tw-border-opacity));
+  }
+}
+.railsui .rui-form-input-color::-webkit-color-swatch,
+.railsui .rui-form-input-color::-webkit-color-swatch-wrapper {
+  border-radius: 0.25rem;
+  border-width: 2px;
+  --tw-border-opacity: 1;
+  border-color: rgb(255 255 255 / var(--tw-border-opacity));
+  padding: 0;
+}
+@media (prefers-color-scheme: dark) {
+  .railsui .rui-form-input-color::-webkit-color-swatch,
+  .railsui .rui-form-input-color::-webkit-color-swatch-wrapper {
+    --tw-border-opacity: 1;
+    border-color: rgb(64 64 64 / var(--tw-border-opacity));
+  }
+}
+.railsui .rui-btn {
+  display: inline-block;
+  border-radius: 0.375rem;
+  border-width: 1px;
+  border-color: #0000;
+  padding: 5px 0.75rem;
+  text-align: center;
+  font-size: 1rem;
+  line-height: 1.5rem;
+  font-size: 14.5px;
+  font-weight: 600;
+  --tw-text-opacity: 1;
+  color: rgb(255 255 255 / var(--tw-text-opacity));
+  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0
+    var(--tw-ring-offset-width) var(--tw-ring-offset-color);
+  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0
+    calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color);
+  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow),
+    var(--tw-shadow, 0 0 #0000);
+  --tw-ring-color: #0000;
+  transition-property: color, background-color, border-color,
+    text-decoration-color, fill, stroke;
+  transition-duration: 0.3s;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+}
+.railsui .rui-btn:disabled {
+  pointer-events: none;
+  cursor: not-allowed;
+  opacity: 0.5;
+}
+.railsui .rui-btn.rui-btn-lg {
+  padding: 0.75rem 1.5rem;
+  font-size: 1.125rem;
+  line-height: 1.75rem;
+}
+.railsui .rui-btn.rui-btn-sm {
+  padding: 0.125rem 0.75rem;
+  font-size: 13.5px;
+}
+.railsui .rui-btn-white {
+  border-width: 1px;
+  border-color: #d4d4d4cc;
+  --tw-bg-opacity: 1;
+  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
+  color: #262626cc;
+  --tw-shadow: 0 1px 2px 0 #0000000d;
+  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
+  --tw-shadow-color: #d4d4d433;
+  --tw-shadow: var(--tw-shadow-colored);
+}
+.railsui .rui-btn-white,
+.railsui .rui-btn-white:hover {
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000),
+    var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}
+.railsui .rui-btn-white:hover {
+  border-color: #52525266;
+  background-color: #fafafa80;
+  --tw-shadow: 0 0 #0000;
+  --tw-shadow-colored: 0 0 #0000;
+}
+.railsui .rui-btn-white:focus {
+  border-color: #d4d4d4e6;
+  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0
+    var(--tw-ring-offset-width) var(--tw-ring-offset-color);
+  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0
+    calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color);
+  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow),
+    var(--tw-shadow, 0 0 #0000);
+  --tw-ring-color: #f5f5f5b3;
+}
+@media (prefers-color-scheme: dark) {
+  .railsui .rui-btn-white {
+    border-color: #7373734d;
+    background-color: #40404099;
+    --tw-text-opacity: 1;
+    color: rgb(255 255 255 / var(--tw-text-opacity));
+    --tw-shadow-color: #0a0a0a66;
+    --tw-shadow: var(--tw-shadow-colored);
+  }
+  .railsui .rui-btn-white:hover {
+    background-color: #262626e6;
+  }
+  .railsui .rui-btn-white:focus {
+    border-color: #737373cc;
+    --tw-ring-color: #404040cc;
+  }
+}
+.railsui .rui-btn-offwhite {
+  border-width: 1px;
+  border-color: #d4d4d4cc;
+  background-color: #e5e5e533;
+  color: #262626cc;
+  --tw-shadow: 0 1px 2px 0 #0000000d;
+  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
+  --tw-shadow-color: #d4d4d433;
+  --tw-shadow: var(--tw-shadow-colored);
+}
+.railsui .rui-btn-offwhite,
+.railsui .rui-btn-offwhite:hover {
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000),
+    var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}
+.railsui .rui-btn-offwhite:hover {
+  border-color: #52525266;
+  background-color: #fafafa80;
+  --tw-shadow: 0 0 #0000;
+  --tw-shadow-colored: 0 0 #0000;
+}
+.railsui .rui-btn-offwhite:focus {
+  border-color: #d4d4d4e6;
+  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0
+    var(--tw-ring-offset-width) var(--tw-ring-offset-color);
+  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0
+    calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color);
+  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow),
+    var(--tw-shadow, 0 0 #0000);
+  --tw-ring-color: #f5f5f5b3;
+}
+@media (prefers-color-scheme: dark) {
+  .railsui .rui-btn-offwhite {
+    border-color: #7373734d;
+    background-color: #40404099;
+    --tw-text-opacity: 1;
+    color: rgb(255 255 255 / var(--tw-text-opacity));
+    --tw-shadow-color: #0a0a0a66;
+    --tw-shadow: var(--tw-shadow-colored);
+  }
+  .railsui .rui-btn-offwhite:hover {
+    background-color: #262626e6;
+  }
+  .railsui .rui-btn-offwhite:focus {
+    border-color: #737373cc;
+    --tw-ring-color: #404040cc;
+  }
+}
+.railsui .rui-btn-transparent {
+  background-color: initial;
+  --tw-text-opacity: 1;
+  color: rgb(64 64 64 / var(--tw-text-opacity));
+}
+.railsui .rui-btn-transparent:hover {
+  background-color: #fafafab3;
+  --tw-text-opacity: 1;
+  color: rgb(38 38 38 / var(--tw-text-opacity));
+}
+.railsui .rui-btn-transparent:focus {
+  outline-style: solid;
+  outline-color: #e5e5e5cc;
+  --tw-ring-color: #f5f5f5b3;
+}
+@media (prefers-color-scheme: dark) {
+  .railsui .rui-btn-transparent {
+    --tw-text-opacity: 1;
+    color: rgb(229 229 229 / var(--tw-text-opacity));
+  }
+  .railsui .rui-btn-transparent:hover {
+    --tw-bg-opacity: 1;
+    background-color: rgb(23 23 23 / var(--tw-bg-opacity));
+  }
+  .railsui .rui-btn-transparent:focus {
+    outline-color: #404040cc;
+    --tw-ring-color: #525252cc;
+  }
+}
+.railsui .rui-btn-black {
+  --tw-bg-opacity: 1;
+  background-color: rgb(10 10 10 / var(--tw-bg-opacity));
+  --tw-text-opacity: 1;
+  color: rgb(245 245 245 / var(--tw-text-opacity));
+}
+.railsui .rui-btn-black:hover {
+  --tw-text-opacity: 1;
+  color: rgb(250 250 250 / var(--tw-text-opacity));
+  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0
+    var(--tw-ring-offset-width) var(--tw-ring-offset-color);
+  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0
+    calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color);
+  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow),
+    var(--tw-shadow, 0 0 #0000);
+  --tw-ring-color: #0000001a;
+}
+.railsui .rui-btn-black:focus {
+  outline-style: solid;
+  outline-color: #e5e5e5cc;
+  --tw-ring-color: #f5f5f5b3;
+}
+@media (prefers-color-scheme: dark) {
+  .railsui .rui-btn-black {
+    --tw-bg-opacity: 1;
+    background-color: rgb(250 250 250 / var(--tw-bg-opacity));
+  }
+  .railsui .rui-btn-black,
+  .railsui .rui-btn-black:hover {
+    --tw-text-opacity: 1;
+    color: rgb(10 10 10 / var(--tw-text-opacity));
+  }
+  .railsui .rui-btn-black:hover {
+    background-color: #f5f5f5cc;
+  }
+  .railsui .rui-btn-black:focus {
+    outline-color: #404040cc;
+    --tw-ring-color: #4040404d;
+  }
+}
+.tippy-box[data-animation="fade"][data-state="hidden"] {
+  opacity: 0;
+}
+[data-tippy-root] {
+  max-width: calc(100vw - 10px);
+}
+.tippy-box {
+  position: relative;
+  background-color: #333;
+  color: #fff;
+  border-radius: 4px;
+  font-size: 14px;
+  line-height: 1.4;
+  white-space: normal;
+  outline: 0;
+  transition-property: transform, visibility, opacity;
+}
+.tippy-box[data-placement^="top"] > .tippy-arrow {
+  bottom: 0;
+}
+.tippy-box[data-placement^="top"] > .tippy-arrow:before {
+  bottom: -7px;
+  left: 0;
+  border-width: 8px 8px 0;
+  border-top-color: initial;
+  transform-origin: center top;
+}
+.tippy-box[data-placement^="bottom"] > .tippy-arrow {
+  top: 0;
+}
+.tippy-box[data-placement^="bottom"] > .tippy-arrow:before {
+  top: -7px;
+  left: 0;
+  border-width: 0 8px 8px;
+  border-bottom-color: initial;
+  transform-origin: center bottom;
+}
+.tippy-box[data-placement^="left"] > .tippy-arrow {
+  right: 0;
+}
+.tippy-box[data-placement^="left"] > .tippy-arrow:before {
+  border-width: 8px 0 8px 8px;
+  border-left-color: initial;
+  right: -7px;
+  transform-origin: center left;
+}
+.tippy-box[data-placement^="right"] > .tippy-arrow {
+  left: 0;
+}
+.tippy-box[data-placement^="right"] > .tippy-arrow:before {
+  left: -7px;
+  border-width: 8px 8px 8px 0;
+  border-right-color: initial;
+  transform-origin: center right;
+}
+.tippy-box[data-inertia][data-state="visible"] {
+  transition-timing-function: cubic-bezier(0.54, 1.5, 0.38, 1.11);
+}
+.tippy-arrow {
+  width: 16px;
+  height: 16px;
+  color: #333;
+}
+.tippy-arrow:before {
+  content: "";
+  position: absolute;
+  border-color: #0000;
+  border-style: solid;
+}
+.tippy-content {
+  position: relative;
+  padding: 5px 9px;
+  z-index: 1;
+}
+.railsui .collapse {
+  visibility: visible !important;
+}