@mirantes-micro/foundation-design-system 1.2.94 → 1.2.95

package/src/components/tiptap-ui-primitive/button/button.css

@@ -1,336 +0,0 @@
-.tiptap-button {
-  font-size: 0.875rem;
-  font-weight: 500;
-  font-feature-settings:
-    "salt" on,
-    "cv01" on;
-  line-height: 1.15;
-  height: 2rem;
-  min-width: 2rem;
-  border: none;
-  padding: 0.5rem;
-  gap: 0.25rem;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  border-radius: var(--tt-radius-lg, 0.75rem);
-  transition-property: background, color, opacity;
-  transition-duration: var(--tt-transition-duration-default);
-  transition-timing-function: var(--tt-transition-easing-default);
-}
-
-/* focus-visible */
-.tiptap-button:focus-visible {
-  outline: none;
-}
-
-.tiptap-button[data-highlighted="true"],
-.tiptap-button[data-focus-visible="true"] {
-  background-color: var(--tt-button-hover-bg-color);
-  color: var(--tt-button-hover-text-color);
-  /* outline: 2px solid var(--tt-button-active-icon-color); */
-}
-
-.tiptap-button[data-weight="small"] {
-  width: 1.5rem;
-  min-width: 1.5rem;
-  padding-right: 0;
-  padding-left: 0;
-}
-
-/* button size large */
-.tiptap-button[data-size="large"] {
-  font-size: 0.9375rem;
-  height: 2.375rem;
-  min-width: 2.375rem;
-  padding: 0.625rem;
-}
-
-/* button size small */
-.tiptap-button[data-size="small"] {
-  font-size: 0.75rem;
-  line-height: 1.2;
-  height: 1.5rem;
-  min-width: 1.5rem;
-  padding: 0.3125rem;
-  border-radius: var(--tt-radius-md, 0.5rem);
-}
-
-/* trim / expand text of the button */
-.tiptap-button-text {
-  padding: 0 0.125rem;
-  flex-grow: 1;
-  text-align: left;
-  line-height: 1.5rem;
-}
-
-.tiptap-button[data-text-trim="on"] .tiptap-button-text {
-  text-overflow: ellipsis;
-  overflow: hidden;
-}
-
-/* global icon settings */
-.tiptap-button .tiptap-button-icon,
-.tiptap-button .tiptap-button-icon-sub,
-.tiptap-button .tiptap-button-dropdown-arrows,
-.tiptap-button .tiptap-button-dropdown-small {
-  flex-shrink: 0;
-}
-
-/* standard icon, what is used */
-.tiptap-button .tiptap-button-icon {
-  width: 1rem;
-  height: 1rem;
-}
-
-.tiptap-button[data-size="large"] .tiptap-button-icon {
-  width: 1.125rem;
-  height: 1.125rem;
-}
-
-.tiptap-button[data-size="small"] .tiptap-button-icon {
-  width: 0.875rem;
-  height: 0.875rem;
-}
-
-/* if 2 icons are used and this icon should be more subtle */
-.tiptap-button .tiptap-button-icon-sub {
-  width: 1rem;
-  height: 1rem;
-}
-
-.tiptap-button[data-size="large"] .tiptap-button-icon-sub {
-  width: 1.125rem;
-  height: 1.125rem;
-}
-
-.tiptap-button[data-size="small"] .tiptap-button-icon-sub {
-  width: 0.875rem;
-  height: 0.875rem;
-}
-
-/* dropdown menus or arrows that are slightly smaller */
-.tiptap-button .tiptap-button-dropdown-arrows {
-  width: 0.75rem;
-  height: 0.75rem;
-}
-
-.tiptap-button[data-size="large"] .tiptap-button-dropdown-arrows {
-  width: 0.875rem;
-  height: 0.875rem;
-}
-
-.tiptap-button[data-size="small"] .tiptap-button-dropdown-arrows {
-  width: 0.625rem;
-  height: 0.625rem;
-}
-
-/* dropdown menu for icon buttons only */
-.tiptap-button .tiptap-button-dropdown-small {
-  width: 0.625rem;
-  height: 0.625rem;
-}
-
-.tiptap-button[data-size="large"] .tiptap-button-dropdown-small {
-  width: 0.75rem;
-  height: 0.75rem;
-}
-
-.tiptap-button[data-size="small"] .tiptap-button-dropdown-small {
-  width: 0.5rem;
-  height: 0.5rem;
-}
-
-/* button only has icons */
-.tiptap-button:has(> svg):not(:has(> :not(svg))) {
-  gap: 0.125rem;
-}
-
-.tiptap-button:has(> svg):not(:has(> :not(svg)))[data-size="large"],
-.tiptap-button:has(> svg):not(:has(> :not(svg)))[data-size="small"] {
-  gap: 0.125rem;
-}
-
-/* button only has 2 icons and one of them is dropdown small */
-.tiptap-button:has(> svg:nth-of-type(2)):has(> .tiptap-button-dropdown-small):not( :has(> svg:nth-of-type(3))):not(:has(> .tiptap-button-text)) {
-  gap: 0;
-  padding-right: 0.25rem;
-}
-
-.tiptap-button:has(> svg:nth-of-type(2)):has(> .tiptap-button-dropdown-small):not( :has(> svg:nth-of-type(3))):not(:has(> .tiptap-button-text))[data-size="large"] {
-  padding-right: 0.375rem;
-}
-
-.tiptap-button:has(> svg:nth-of-type(2)):has(> .tiptap-button-dropdown-small):not( :has(> svg:nth-of-type(3))):not(:has(> .tiptap-button-text))[data-size="small"] {
-  padding-right: 0.25rem;
-}
-
-/* Emoji is used in a button */
-.tiptap-button .tiptap-button-emoji {
-  width: 1rem;
-  display: flex;
-  justify-content: center;
-}
-
-.tiptap-button[data-size="large"] .tiptap-button-emoji {
-  width: 1.125rem;
-}
-
-.tiptap-button[data-size="small"] .tiptap-button-emoji {
-  width: 0.875rem;
-}
-
-/* --------------------------------------------
------------ BUTTON COLOR SETTINGS -------------
--------------------------------------------- */
-
-.tiptap-button {
-  background-color: var(--tt-button-default-bg-color);
-  color: var(--tt-button-default-text-color);
-}
-
-.tiptap-button .tiptap-button-icon {
-  color: var(--tt-button-default-icon-color);
-}
-
-.tiptap-button .tiptap-button-icon-sub {
-  color: var(--tt-button-default-icon-sub-color);
-}
-
-.tiptap-button .tiptap-button-dropdown-arrows {
-  color: var(--tt-button-default-dropdown-arrows-color);
-}
-
-.tiptap-button .tiptap-button-dropdown-small {
-  color: var(--tt-button-default-dropdown-arrows-color);
-}
-
-/* hover state of a button */
-.tiptap-button:hover:not([data-active-item="true"]):not([disabled]),
-.tiptap-button[data-active-item="true"]:not([disabled]),
-.tiptap-button[data-highlighted]:not([disabled]):not([data-highlighted="false"]) {
-  background-color: var(--tt-button-hover-bg-color);
-  color: var(--tt-button-hover-text-color);
-}
-
-.tiptap-button:hover:not([data-active-item="true"]):not([disabled]) .tiptap-button-icon,
-.tiptap-button[data-active-item="true"]:not([disabled]) .tiptap-button-icon,
-.tiptap-button[data-highlighted]:not([disabled]):not([data-highlighted="false"]) .tiptap-button-icon {
-  color: var(--tt-button-hover-icon-color);
-}
-
-.tiptap-button:hover:not([data-active-item="true"]):not([disabled]) .tiptap-button-icon-sub,
-.tiptap-button[data-active-item="true"]:not([disabled]) .tiptap-button-icon-sub,
-.tiptap-button[data-highlighted]:not([disabled]):not([data-highlighted="false"]) .tiptap-button-icon-sub {
-  color: var(--tt-button-hover-icon-sub-color);
-}
-
-.tiptap-button:hover:not([data-active-item="true"]):not([disabled]) .tiptap-button-dropdown-arrows,
-.tiptap-button:hover:not([data-active-item="true"]):not([disabled]) .tiptap-button-dropdown-small,
-.tiptap-button[data-active-item="true"]:not([disabled]) .tiptap-button-dropdown-arrows,
-.tiptap-button[data-active-item="true"]:not([disabled]) .tiptap-button-dropdown-small,
-.tiptap-button[data-highlighted]:not([disabled]):not([data-highlighted="false"]) .tiptap-button-dropdown-arrows,
-.tiptap-button[data-highlighted]:not([disabled]):not([data-highlighted="false"]) .tiptap-button-dropdown-small {
-  color: var(--tt-button-hover-dropdown-arrows-color);
-}
-
-/* Active state of a button */
-.tiptap-button[data-active-state="on"]:not([disabled]),
-.tiptap-button[data-state="open"]:not([disabled]) {
-  background-color: var(--tt-button-active-bg-color);
-  color: var(--tt-button-active-text-color);
-}
-
-.tiptap-button[data-active-state="on"]:not([disabled]) .tiptap-button-icon,
-.tiptap-button[data-state="open"]:not([disabled]) .tiptap-button-icon {
-  color: var(--tt-button-active-icon-color);
-}
-
-.tiptap-button[data-active-state="on"]:not([disabled]) .tiptap-button-icon-sub,
-.tiptap-button[data-state="open"]:not([disabled]) .tiptap-button-icon-sub {
-  color: var(--tt-button-active-icon-sub-color);
-}
-
-.tiptap-button[data-active-state="on"]:not([disabled]) .tiptap-button-dropdown-arrows,
-.tiptap-button[data-active-state="on"]:not([disabled]) .tiptap-button-dropdown-small,
-.tiptap-button[data-state="open"]:not([disabled]) .tiptap-button-dropdown-arrows,
-.tiptap-button[data-state="open"]:not([disabled]) .tiptap-button-dropdown-small {
-  color: var(--tt-button-active-dropdown-arrows-color);
-}
-
-.tiptap-button[data-active-state="on"]:not([disabled]):hover,
-.tiptap-button[data-state="open"]:not([disabled]):hover {
-  background-color: var(--tt-button-active-hover-bg-color);
-}
-
-/* Emphasized */
-.tiptap-button[data-active-state="on"]:not([disabled])[data-appearance="emphasized"],
-.tiptap-button[data-state="open"]:not([disabled])[data-appearance="emphasized"] {
-  background-color: var(--tt-button-active-bg-color-emphasized);
-  color: var(--tt-button-active-text-color-emphasized);
-}
-
-.tiptap-button[data-active-state="on"]:not([disabled])[data-appearance="emphasized"] .tiptap-button-icon,
-.tiptap-button[data-state="open"]:not([disabled])[data-appearance="emphasized"] .tiptap-button-icon {
-  color: var(--tt-button-active-icon-color-emphasized);
-}
-
-.tiptap-button[data-active-state="on"]:not([disabled])[data-appearance="emphasized"] .tiptap-button-icon-sub,
-.tiptap-button[data-state="open"]:not([disabled])[data-appearance="emphasized"] .tiptap-button-icon-sub {
-  color: var(--tt-button-active-icon-sub-color-emphasized);
-}
-
-.tiptap-button[data-active-state="on"]:not([disabled])[data-appearance="emphasized"] .tiptap-button-dropdown-arrows,
-.tiptap-button[data-active-state="on"]:not([disabled])[data-appearance="emphasized"] .tiptap-button-dropdown-small,
-.tiptap-button[data-state="open"]:not([disabled])[data-appearance="emphasized"] .tiptap-button-dropdown-arrows,
-.tiptap-button[data-state="open"]:not([disabled])[data-appearance="emphasized"] .tiptap-button-dropdown-small {
-  color: var(--tt-button-active-dropdown-arrows-color-emphasized);
-}
-
-.tiptap-button[data-active-state="on"]:not([disabled])[data-appearance="emphasized"]:hover,
-.tiptap-button[data-state="open"]:not([disabled])[data-appearance="emphasized"]:hover {
-  background-color: var(--tt-button-active-hover-bg-color-emphasized);
-}
-
-/* Subdued */
-.tiptap-button[data-active-state="on"]:not([disabled])[data-appearance="subdued"],
-.tiptap-button[data-state="open"]:not([disabled])[data-appearance="subdued"] {
-  background-color: var(--tt-button-active-bg-color-subdued);
-  color: var(--tt-button-active-text-color-subdued);
-}
-
-.tiptap-button[data-active-state="on"]:not([disabled])[data-appearance="subdued"] .tiptap-button-icon,
-.tiptap-button[data-state="open"]:not([disabled])[data-appearance="subdued"] .tiptap-button-icon {
-  color: var(--tt-button-active-icon-color-subdued);
-}
-
-.tiptap-button[data-active-state="on"]:not([disabled])[data-appearance="subdued"] .tiptap-button-icon-sub,
-.tiptap-button[data-state="open"]:not([disabled])[data-appearance="subdued"] .tiptap-button-icon-sub {
-  color: var(--tt-button-active-icon-sub-color-subdued);
-}
-
-.tiptap-button[data-active-state="on"]:not([disabled])[data-appearance="subdued"] .tiptap-button-dropdown-arrows,
-.tiptap-button[data-active-state="on"]:not([disabled])[data-appearance="subdued"] .tiptap-button-dropdown-small,
-.tiptap-button[data-state="open"]:not([disabled])[data-appearance="subdued"] .tiptap-button-dropdown-arrows,
-.tiptap-button[data-state="open"]:not([disabled])[data-appearance="subdued"] .tiptap-button-dropdown-small {
-  color: var(--tt-button-active-dropdown-arrows-color-subdued);
-}
-
-.tiptap-button[data-active-state="on"]:not([disabled])[data-appearance="subdued"]:hover,
-.tiptap-button[data-state="open"]:not([disabled])[data-appearance="subdued"]:hover {
-  background-color: var(--tt-button-active-hover-bg-color-subdued);
-}
-
-.tiptap-button[data-active-state="on"]:not([disabled])[data-appearance="subdued"]:hover .tiptap-button-icon,
-.tiptap-button[data-state="open"]:not([disabled])[data-appearance="subdued"]:hover .tiptap-button-icon {
-  color: var(--tt-button-active-icon-color-subdued);
-}
-
-.tiptap-button:disabled {
-  background-color: var(--tt-button-disabled-bg-color);
-  color: var(--tt-button-disabled-text-color);
-}
-
-.tiptap-button:disabled .tiptap-button-icon {
-  color: var(--tt-button-disabled-icon-color);
-}

package/src/components/tiptap-ui-primitive/card/card.css

@@ -1,76 +0,0 @@
-:root {
-  --tiptap-card-bg-color: var(--white);
-  --tiptap-card-border-color: var(--tt-gray-light-a-100);
-  --tiptap-card-group-label-color: var(--tt-gray-light-a-800);
-}
-
-.dark {
-  --tiptap-card-bg-color: var(--tt-gray-dark-50);
-  --tiptap-card-border-color: var(--tt-gray-dark-a-100);
-  --tiptap-card-group-label-color: var(--tt-gray-dark-a-800);
-}
-
-.tiptap-card {
-  --padding: 0.375rem;
-  --border-width: 1px;
-
-  border-radius: calc(var(--padding) + var(--tt-radius-lg));
-  box-shadow: var(--tt-shadow-elevated-md);
-  background-color: var(--tiptap-card-bg-color);
-  border: 1px solid var(--tiptap-card-border-color);
-  display: flex;
-  flex-direction: column;
-  outline: none;
-  align-items: center;
-
-  position: relative;
-  min-width: 0;
-  word-wrap: break-word;
-  background-clip: border-box;
-}
-
-.tiptap-card-header {
-  padding: 0.375rem;
-  flex: 0 0 auto;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  width: 100%;
-  border-bottom: var(--border-width) solid var(--tiptap-card-border-color);
-}
-
-.tiptap-card-body {
-  padding: 0.375rem;
-  flex: 1 1 auto;
-  overflow-y: auto;
-}
-
-.tiptap-card-item-group {
-  position: relative;
-  display: flex;
-  vertical-align: middle;
-  min-width: max-content;
-}
-
-.tiptap-card-item-group[data-orientation="vertical"] {
-  flex-direction: column;
-  justify-content: center;
-}
-
-.tiptap-card-item-group[data-orientation="horizontal"] {
-  gap: 0.25rem;
-  flex-direction: row;
-  align-items: center;
-}
-
-.tiptap-card-group-label {
-  padding-top: 0.75rem;
-  padding-left: 0.5rem;
-  padding-right: 0.5rem;
-  padding-bottom: 0.25rem;
-  line-height: normal;
-  font-size: 0.75rem;
-  font-weight: 600;
-  text-transform: capitalize;
-  color: var(--tiptap-card-group-label-color);
-}

package/src/components/tiptap-ui-primitive/dropdown-menu/dropdown-menu.css

@@ -1,63 +0,0 @@
-.tiptap-dropdown-menu {
-  --tt-dropdown-menu-bg-color: var(--white);
-  --tt-dropdown-menu-border-color: var(--tt-gray-light-a-100);
-  --tt-dropdown-menu-text-color: var(--tt-gray-light-a-600);
-}
-
-.dark .tiptap-dropdown-menu {
-  --tt-dropdown-menu-border-color: var(--tt-gray-dark-a-50);
-  --tt-dropdown-menu-bg-color: var(--tt-gray-dark-50);
-  --tt-dropdown-menu-text-color: var(--tt-gray-dark-a-600);
-}
-
-/* --------------------------------------------
-    --------- DROPDOWN MENU STYLING SETTINGS ---------
-    -------------------------------------------- */
-.tiptap-dropdown-menu {
-  z-index: 50;
-  outline: none;
-  transform-origin: var(--radix-dropdown-menu-content-transform-origin);
-  max-height: var(--radix-dropdown-menu-content-available-height);
-}
-
-.tiptap-dropdown-menu>* {
-  max-height: var(--radix-dropdown-menu-content-available-height);
-}
-
-/* Animation states */
-.tiptap-dropdown-menu[data-state="open"] {
-  animation:
-    fadeIn 150ms cubic-bezier(0.16, 1, 0.3, 1),
-    zoomIn 150ms cubic-bezier(0.16, 1, 0.3, 1);
-}
-
-.tiptap-dropdown-menu[data-state="closed"] {
-  animation:
-    fadeOut 150ms cubic-bezier(0.16, 1, 0.3, 1),
-    zoomOut 150ms cubic-bezier(0.16, 1, 0.3, 1);
-}
-
-/* Position-based animations */
-.tiptap-dropdown-menu[data-side="top"],
-.tiptap-dropdown-menu[data-side="top-start"],
-.tiptap-dropdown-menu[data-side="top-end"] {
-  animation: slideFromBottom 150ms cubic-bezier(0.16, 1, 0.3, 1);
-}
-
-.tiptap-dropdown-menu[data-side="right"],
-.tiptap-dropdown-menu[data-side="right-start"],
-.tiptap-dropdown-menu[data-side="right-end"] {
-  animation: slideFromLeft 150ms cubic-bezier(0.16, 1, 0.3, 1);
-}
-
-.tiptap-dropdown-menu[data-side="bottom"],
-.tiptap-dropdown-menu[data-side="bottom-start"],
-.tiptap-dropdown-menu[data-side="bottom-end"] {
-  animation: slideFromTop 150ms cubic-bezier(0.16, 1, 0.3, 1);
-}
-
-.tiptap-dropdown-menu[data-side="left"],
-.tiptap-dropdown-menu[data-side="left-start"],
-.tiptap-dropdown-menu[data-side="left-end"] {
-  animation: slideFromRight 150ms cubic-bezier(0.16, 1, 0.3, 1);
-}

package/src/components/tiptap-ui-primitive/input/input.css

@@ -1,44 +0,0 @@
-:root {
-  --tiptap-input-placeholder: var(--tt-gray-light-a-400);
-}
-
-.dark {
-  --tiptap-input-placeholder: var(--tt-gray-dark-a-400);
-}
-
-.tiptap-input {
-  display: block;
-  width: 100%;
-  height: 2rem;
-  font-size: 0.875rem;
-  font-weight: 400;
-  line-height: 1.5;
-  padding: 0.375rem 0.5rem;
-  border-radius: 0.375rem;
-  background: none;
-  appearance: none;
-  outline: none;
-}
-
-.tiptap-input::placeholder {
-  color: var(--tiptap-input-placeholder);
-}
-
-.tiptap-input-clamp {
-  min-width: 12rem;
-  padding-right: 0;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-.tiptap-input-clamp:focus {
-  text-overflow: clip;
-  overflow: visible;
-}
-
-.tiptap-input-group {
-  position: relative;
-  display: flex;
-  flex-wrap: wrap;
-  align-items: stretch;
-}

package/src/components/tiptap-ui-primitive/popover/popover.css

@@ -1,63 +0,0 @@
-.tiptap-popover {
-  --tt-popover-bg-color: var(--white);
-  --tt-popover-border-color: var(--tt-gray-light-a-100);
-  --tt-popover-text-color: var(--tt-gray-light-a-600);
-}
-
-.dark .tiptap-popover {
-  --tt-popover-border-color: var(--tt-gray-dark-a-50);
-  --tt-popover-bg-color: var(--tt-gray-dark-50);
-  --tt-popover-text-color: var(--tt-gray-dark-a-600);
-}
-
-/* --------------------------------------------
-    --------- POPOVER STYLING SETTINGS ---------
-    -------------------------------------------- */
-.tiptap-popover {
-  z-index: 50;
-  outline: none;
-  transform-origin: var(--radix-popover-content-transform-origin);
-  max-height: var(--radix-popover-content-available-height);
-}
-
-.tiptap-popover>* {
-  max-height: var(--radix-popover-content-available-height);
-}
-
-/* Animation states */
-.tiptap-popover[data-state="open"] {
-  animation:
-    fadeIn 150ms cubic-bezier(0.16, 1, 0.3, 1),
-    zoomIn 150ms cubic-bezier(0.16, 1, 0.3, 1);
-}
-
-.tiptap-popover[data-state="closed"] {
-  animation:
-    fadeOut 150ms cubic-bezier(0.16, 1, 0.3, 1),
-    zoomOut 150ms cubic-bezier(0.16, 1, 0.3, 1);
-}
-
-/* Position-based animations */
-.tiptap-popover[data-side="top"],
-.tiptap-popover[data-side="top-start"],
-.tiptap-popover[data-side="top-end"] {
-  animation: slideFromBottom 150ms cubic-bezier(0.16, 1, 0.3, 1);
-}
-
-.tiptap-popover[data-side="right"],
-.tiptap-popover[data-side="right-start"],
-.tiptap-popover[data-side="right-end"] {
-  animation: slideFromLeft 150ms cubic-bezier(0.16, 1, 0.3, 1);
-}
-
-.tiptap-popover[data-side="bottom"],
-.tiptap-popover[data-side="bottom-start"],
-.tiptap-popover[data-side="bottom-end"] {
-  animation: slideFromTop 150ms cubic-bezier(0.16, 1, 0.3, 1);
-}
-
-.tiptap-popover[data-side="left"],
-.tiptap-popover[data-side="left-start"],
-.tiptap-popover[data-side="left-end"] {
-  animation: slideFromRight 150ms cubic-bezier(0.16, 1, 0.3, 1);
-}

package/src/components/tiptap-ui-primitive/separator/separator.css

@@ -1,23 +0,0 @@
-.tiptap-separator {
-  --tt-link-border-color: var(--tt-gray-light-a-200);
-}
-
-.dark .tiptap-separator {
-  --tt-link-border-color: var(--tt-gray-dark-a-200);
-}
-
-.tiptap-separator {
-  flex-shrink: 0;
-  background-color: var(--tt-link-border-color);
-}
-
-.tiptap-separator[data-orientation="horizontal"] {
-  height: 1px;
-  width: 100%;
-  margin: 0.5rem 0;
-}
-
-.tiptap-separator[data-orientation="vertical"] {
-  height: 1.5rem;
-  width: 1px;
-}

package/src/components/tiptap-ui-primitive/toolbar/toolbar.css

@@ -1,101 +0,0 @@
-:root {
-  --tt-toolbar-height: 2.75rem;
-  --tt-safe-area-bottom: env(safe-area-inset-bottom, 0px);
-  --tt-toolbar-bg-color: var(--white);
-  --tt-toolbar-border-color: var(--tt-gray-light-a-100);
-}
-
-.dark {
-  --tt-toolbar-bg-color: var(--black);
-  --tt-toolbar-border-color: var(--tt-gray-dark-a-50);
-}
-
-.tiptap-toolbar {
-  display: flex;
-  align-items: center;
-  gap: 0.25rem;
-}
-
-.tiptap-toolbar-group {
-  display: flex;
-  align-items: center;
-  gap: 0.125rem;
-}
-
-.tiptap-toolbar-group:empty {
-  display: none;
-}
-
-.tiptap-toolbar-group:empty+.tiptap-separator,
-.tiptap-separator+.tiptap-toolbar-group:empty {
-  display: none;
-}
-
-/* VARIANT: FIXED */
-.tiptap-toolbar[data-variant="fixed"] {
-  position: sticky;
-  top: 0;
-  z-index: 10;
-  width: 100%;
-  min-height: var(--tt-toolbar-height);
-  background: var(--tt-toolbar-bg-color);
-  border-bottom: 1px solid var(--tt-toolbar-border-color);
-  padding: 0 0.5rem;
-  overflow-x: auto;
-  overscroll-behavior-x: contain;
-  -webkit-overflow-scrolling: touch;
-  scrollbar-width: none;
-  -ms-overflow-style: none;
-}
-
-.tiptap-toolbar[data-variant="fixed"]::-webkit-scrollbar {
-  display: none;
-}
-
-@media (max-width: 480px) {
-  .tiptap-toolbar[data-variant="fixed"] {
-    position: absolute;
-    top: auto;
-    height: calc(var(--tt-toolbar-height) + var(--tt-safe-area-bottom));
-    border-top: 1px solid var(--tt-toolbar-border-color);
-    border-bottom: none;
-    padding: 0 0.5rem var(--tt-safe-area-bottom);
-    flex-wrap: nowrap;
-    justify-content: flex-start;
-  }
-
-  .tiptap-toolbar[data-variant="fixed"] .tiptap-toolbar-group {
-    flex: 0 0 auto;
-  }
-}
-
-/* VARIANT: FLOATING */
-.tiptap-toolbar[data-variant="floating"] {
-  --tt-toolbar-padding: 0.125rem;
-  --tt-toolbar-border-width: 1px;
-
-  padding: 0.188rem;
-  border-radius: calc(var(--tt-toolbar-padding) + var(--tt-radius-lg) + var(--tt-toolbar-border-width));
-  border: var(--tt-toolbar-border-width) solid var(--tt-toolbar-border-color);
-  background-color: var(--tt-toolbar-bg-color);
-  box-shadow: var(--tt-shadow-elevated-md);
-  outline: none;
-  overflow: hidden;
-}
-
-.tiptap-toolbar[data-variant="floating"][data-plain="true"] {
-  padding: 0;
-  border-radius: 0;
-  border: none;
-  box-shadow: none;
-  background-color: transparent;
-}
-
-@media screen and (max-width: 480px) {
-  .tiptap-toolbar[data-variant="floating"] {
-    width: 100%;
-    border-radius: 0;
-    border: none;
-    box-shadow: none;
-  }
-}