@idds/styles 1.2.11 → 1.2.13

package/src/colors/product/index.css

@@ -1,205 +0,0 @@
-/* Base Colors - Light Mode (Default) */
-:root,
-[data-theme='light'] {
-  /* Base Colors */
-  --ina-white: var(--ina-neutral-25);
-  --ina-black: var(--ina-neutral-900);
-
-  /* Background Colors */
-  --ina-background-primary: var(--ina-neutral-25);
-  --ina-background-secondary: var(--ina-neutral-50);
-  --ina-background-tertiary: var(--ina-neutral-100);
-  --ina-background-overlay: var(--ina-overlay);
-
-  /* Content Colors */
-  --ina-content-primary: var(--ina-neutral-800);
-  --ina-content-secondary: var(--ina-neutral-600);
-  --ina-content-tertiary: var(--ina-neutral-400);
-  --ina-content-guide: var(--ina-blue-500);
-  --ina-content-negative: var(--ina-red-600);
-  --ina-content-positive: var(--ina-green-600);
-
-  /* Stroke Colors */
-  --ina-stroke-primary: var(--ina-neutral-200);
-  --ina-stroke-secondary: var(--ina-neutral-400);
-  --ina-stroke-tertiary: var(--ina-neutral-900);
-
-  /* Guide Colors */
-  --ina-guide-50: var(--ina-blue-50);
-  --ina-guide-100: var(--ina-blue-100);
-  --ina-guide-200: var(--ina-blue-200);
-  --ina-guide-300: var(--ina-blue-300);
-  --ina-guide-400: var(--ina-blue-400);
-  --ina-guide-500: var(--ina-blue-500);
-  --ina-guide-600: var(--ina-blue-600);
-  --ina-guide-700: var(--ina-blue-700);
-  --ina-guide-800: var(--ina-blue-800);
-  --ina-guide-900: var(--ina-blue-900);
-
-  /* Negative Colors */
-  --ina-negative-50: var(--ina-red-50);
-  --ina-negative-100: var(--ina-red-100);
-  --ina-negative-200: var(--ina-red-200);
-  --ina-negative-300: var(--ina-red-300);
-  --ina-negative-400: var(--ina-red-400);
-  --ina-negative-500: var(--ina-red-500);
-  --ina-negative-600: var(--ina-red-600);
-  --ina-negative-700: var(--ina-red-700);
-  --ina-negative-800: var(--ina-red-800);
-  --ina-negative-900: var(--ina-red-900);
-  --ina-sentiment-negative-50: var(--ina-red-50);
-  --ina-sentiment-negative-100: var(--ina-red-100);
-  --ina-sentiment-negative-200: var(--ina-red-200);
-  --ina-sentiment-negative-300: var(--ina-red-300);
-  --ina-sentiment-negative-400: var(--ina-red-400);
-  --ina-sentiment-negative-500: var(--ina-red-500);
-  --ina-sentiment-negative-600: var(--ina-red-600);
-  --ina-sentiment-negative-700: var(--ina-red-700);
-  --ina-sentiment-negative-800: var(--ina-red-800);
-  --ina-sentiment-negative-900: var(--ina-red-900);
-
-  /* Positive Colors */
-  --ina-positive-50: var(--ina-green-50);
-  --ina-positive-100: var(--ina-green-100);
-  --ina-positive-200: var(--ina-green-200);
-  --ina-positive-300: var(--ina-green-300);
-  --ina-positive-400: var(--ina-green-400);
-  --ina-positive-500: var(--ina-green-500);
-  --ina-positive-600: var(--ina-green-600);
-  --ina-positive-700: var(--ina-green-700);
-  --ina-positive-800: var(--ina-green-800);
-  --ina-positive-900: var(--ina-green-900);
-  --ina-sentiment-positive-50: var(--ina-green-50);
-  --ina-sentiment-positive-100: var(--ina-green-100);
-  --ina-sentiment-positive-200: var(--ina-green-200);
-  --ina-sentiment-positive-300: var(--ina-green-300);
-  --ina-sentiment-positive-400: var(--ina-green-400);
-  --ina-sentiment-positive-500: var(--ina-green-500);
-  --ina-sentiment-positive-600: var(--ina-green-600);
-  --ina-sentiment-positive-700: var(--ina-green-700);
-  --ina-sentiment-positive-800: var(--ina-green-800);
-
-  /* Warning Colors */
-  --ina-warning-50: var(--ina-orange-50);
-  --ina-warning-100: var(--ina-orange-100);
-  --ina-warning-200: var(--ina-orange-200);
-  --ina-warning-300: var(--ina-orange-300);
-  --ina-warning-400: var(--ina-orange-400);
-  --ina-warning-500: var(--ina-orange-500);
-  --ina-warning-600: var(--ina-orange-600);
-  --ina-warning-700: var(--ina-orange-700);
-  --ina-warning-800: var(--ina-orange-800);
-  --ina-warning-900: var(--ina-orange-900);
-  --ina-sentiment-warning-50: var(--ina-orange-50);
-  --ina-sentiment-warning-100: var(--ina-orange-100);
-  --ina-sentiment-warning-200: var(--ina-orange-200);
-  --ina-sentiment-warning-300: var(--ina-orange-300);
-  --ina-sentiment-warning-400: var(--ina-orange-400);
-  --ina-sentiment-warning-500: var(--ina-orange-500);
-  --ina-sentiment-warning-600: var(--ina-orange-600);
-  --ina-sentiment-warning-700: var(--ina-orange-700);
-  --ina-sentiment-warning-800: var(--ina-orange-800);
-}
-
-/* Base Colors - Dark Mode */
-[data-theme='dark'] {
-  /* Base Colors */
-  --ina-white: var(--ina-neutral-900);
-  --ina-black: var(--ina-neutral-25);
-
-  /* Background Colors */
-  --ina-background-primary: var(--ina-neutral-900);
-  --ina-background-secondary: var(--ina-neutral-800);
-  --ina-background-tertiary: var(--ina-neutral-700);
-  --ina-background-overlay: var(--ina-overlay);
-
-  /* Content Colors */
-  --ina-content-primary: var(--ina-neutral-25);
-  --ina-content-secondary: var(--ina-neutral-400);
-  --ina-content-tertiary: var(--ina-neutral-500);
-  --ina-content-guide: var(--ina-blue-400);
-  --ina-content-negative: var(--ina-red-400);
-  --ina-content-positive: var(--ina-green-400);
-
-  /* Stroke Colors */
-  --ina-stroke-primary: var(--ina-neutral-700);
-  --ina-stroke-secondary: var(--ina-neutral-400);
-  --ina-stroke-tertiary: var(--ina-neutral-200);
-
-  /* Guide Colors */
-  --ina-guide-50: var(--ina-blue-50);
-  --ina-guide-100: var(--ina-blue-100);
-  --ina-guide-200: var(--ina-blue-200);
-  --ina-guide-300: var(--ina-blue-300);
-  --ina-guide-400: var(--ina-blue-400);
-  --ina-guide-500: var(--ina-blue-500);
-  --ina-guide-600: var(--ina-blue-600);
-  --ina-guide-700: var(--ina-blue-700);
-  --ina-guide-800: var(--ina-blue-800);
-  --ina-guide-900: var(--ina-blue-900);
-
-  /* Negative Colors */
-  --ina-negative-50: var(--ina-red-50);
-  --ina-negative-100: var(--ina-red-100);
-  --ina-negative-200: var(--ina-red-200);
-  --ina-negative-300: var(--ina-red-300);
-  --ina-negative-400: var(--ina-red-400);
-  --ina-negative-500: var(--ina-red-500);
-  --ina-negative-600: var(--ina-red-600);
-  --ina-negative-700: var(--ina-red-700);
-  --ina-negative-800: var(--ina-red-800);
-  --ina-negative-900: var(--ina-red-900);
-  --ina-sentiment-negative-50: var(--ina-red-50);
-  --ina-sentiment-negative-100: var(--ina-red-100);
-  --ina-sentiment-negative-200: var(--ina-red-200);
-  --ina-sentiment-negative-300: var(--ina-red-300);
-  --ina-sentiment-negative-400: var(--ina-red-400);
-  --ina-sentiment-negative-500: var(--ina-red-500);
-  --ina-sentiment-negative-600: var(--ina-red-600);
-  --ina-sentiment-negative-700: var(--ina-red-700);
-  --ina-sentiment-negative-800: var(--ina-red-800);
-  --ina-sentiment-negative-900: var(--ina-red-900);
-
-  /* Positive Colors */
-  --ina-positive-50: var(--ina-green-50);
-  --ina-positive-100: var(--ina-green-100);
-  --ina-positive-200: var(--ina-green-200);
-  --ina-positive-300: var(--ina-green-300);
-  --ina-positive-400: var(--ina-green-400);
-  --ina-positive-500: var(--ina-green-500);
-  --ina-positive-600: var(--ina-green-600);
-  --ina-positive-700: var(--ina-green-700);
-  --ina-positive-800: var(--ina-green-800);
-  --ina-positive-900: var(--ina-green-900);
-  --ina-sentiment-positive-50: var(--ina-green-50);
-  --ina-sentiment-positive-100: var(--ina-green-100);
-  --ina-sentiment-positive-200: var(--ina-green-200);
-  --ina-sentiment-positive-300: var(--ina-green-300);
-  --ina-sentiment-positive-400: var(--ina-green-400);
-  --ina-sentiment-positive-500: var(--ina-green-500);
-  --ina-sentiment-positive-600: var(--ina-green-600);
-  --ina-sentiment-positive-700: var(--ina-green-700);
-  --ina-sentiment-positive-800: var(--ina-green-800);
-
-  /* Warning Colors */
-  --ina-warning-50: var(--ina-orange-50);
-  --ina-warning-100: var(--ina-orange-100);
-  --ina-warning-200: var(--ina-orange-200);
-  --ina-warning-300: var(--ina-orange-300);
-  --ina-warning-400: var(--ina-orange-400);
-  --ina-warning-500: var(--ina-orange-500);
-  --ina-warning-600: var(--ina-orange-600);
-  --ina-warning-700: var(--ina-orange-700);
-  --ina-warning-800: var(--ina-orange-800);
-  --ina-warning-900: var(--ina-orange-900);
-  --ina-sentiment-warning-50: var(--ina-orange-50);
-  --ina-sentiment-warning-100: var(--ina-orange-100);
-  --ina-sentiment-warning-200: var(--ina-orange-200);
-  --ina-sentiment-warning-300: var(--ina-orange-300);
-  --ina-sentiment-warning-400: var(--ina-orange-400);
-  --ina-sentiment-warning-500: var(--ina-orange-500);
-  --ina-sentiment-warning-600: var(--ina-orange-600);
-  --ina-sentiment-warning-700: var(--ina-orange-700);
-  --ina-sentiment-warning-800: var(--ina-orange-800);
-  --ina-sentiment-warning-900: var(--ina-orange-900);
-}

package/src/colors/utilities/index.css

@@ -1,77 +0,0 @@
-:root {
-  /* Font Sizes */
-  --ina-font-3xs: 0.5rem; /* 8px */
-  --ina-font-2xs: 0.625rem; /* 10px */
-  --ina-font-xs: 0.75rem; /* 12px */
-  --ina-font-sm: 0.875rem; /* 14px */
-  --ina-font-base: 1rem; /* 16px */
-  --ina-font-lg: 1.125rem; /* 18px */
-  --ina-font-xl: 1.25rem; /* 20px */
-  --ina-font-2xl: 1.5rem; /* 24px */
-  --ina-font-3xl: 1.875rem; /* 30px */
-  --ina-font-4xl: 2.25rem; /* 36px */
-
-  /* Line Heights */
-  --ina-line-height-xs: 1rem; /* 16px */
-  --ina-line-height-sm: 1.25rem; /* 20px */
-  --ina-line-height-base: 1.5rem; /* 24px */
-  --ina-line-height-lg: 1.75rem; /* 28px */
-  --ina-line-height-xl: 2rem; /* 32px */
-
-  /* Font Weights */
-  --ina-font-thin: 100;
-  --ina-font-extralight: 200;
-  --ina-font-light: 300;
-  --ina-font-normal: 400;
-  --ina-font-medium: 500;
-  --ina-font-semibold: 600;
-  --ina-font-bold: 700;
-  --ina-font-extrabold: 800;
-  --ina-font-black: 900;
-
-  /* Spacing */
-  --ina-spacing-1: 0.25rem; /* 4px */
-  --ina-spacing-2: 0.5rem; /* 8px */
-  --ina-spacing-3: 0.75rem; /* 12px */
-  --ina-spacing-3-5: 0.875rem; /* 14px */
-  --ina-spacing-4: 1rem; /* 16px */
-  --ina-spacing-5: 1.25rem; /* 20px */
-  --ina-spacing-6: 1.5rem; /* 24px */
-  --ina-spacing-8: 2rem; /* 32px */
-  --ina-spacing-10: 2.5rem; /* 40px */
-  --ina-spacing-12: 3rem; /* 48px */
-  --ina-spacing-16: 4rem; /* 64px */
-  --ina-spacing-20: 5rem; /* 80px */
-  --ina-spacing-24: 6rem; /* 96px */
-
-  /* Border Radius */
-  --ina-radius-sm: 0.125rem; /* 2px */
-  --ina-radius-base: 0.25rem; /* 4px */
-  --ina-radius-md: 0.375rem; /* 6px */
-  --ina-radius-lg: 0.5rem; /* 8px */
-  --ina-radius-xl: 0.75rem; /* 12px */
-  --ina-radius-2xl: 1rem; /* 16px */
-  --ina-radius-full: 9999px;
-
-  /* Shadows */
-  --ina-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
-  --ina-shadow-base: 0 1px 3px 0 rgba(0, 0, 0, 0.1),
-    0 1px 2px -1px rgba(0, 0, 0, 0.1);
-  --ina-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1),
-    0 2px 4px -2px rgba(0, 0, 0, 0.1);
-  --ina-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1),
-    0 4px 6px -4px rgba(0, 0, 0, 0.1);
-  --ina-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1),
-    0 8px 10px -6px rgba(0, 0, 0, 0.1);
-
-  /* Transition */
-  --ina-transition-fast: 150ms ease-in-out;
-  --ina-transition-base: 200ms ease-in-out;
-  --ina-transition-slow: 300ms ease-in-out;
-
-  /* Breakpoints untuk responsive design */
-  --ina-breakpoint-sm: 640px;
-  --ina-breakpoint-md: 768px;
-  --ina-breakpoint-lg: 1024px;
-  --ina-breakpoint-xl: 1280px;
-}

package/src/components/accordion-card.css

@@ -1,99 +0,0 @@
-/**
- * AccordionCard Component Styles
- * Menggunakan BEM naming convention dengan prefix "ina-"
- */
-
-.ina-accordion-card {
-  /* Root container accordion card */
-  border: 1px solid var(--ina-stroke-primary);
-  padding: var(--ina-spacing-4);
-  border-radius: var(--ina-radius-lg);
-  overflow: hidden;
-}
-
-.ina-accordion-card__header {
-  /* Header area yang dapat diklik untuk toggle */
-  cursor: pointer;
-  width: 100%;
-  display: flex;
-  align-items: center;
-  outline: none;
-  transition: var(--ina-transition-fast);
-}
-
-.ina-accordion-card__header:focus {
-  outline: 2px solid var(--ina-guide-500);
-  outline-offset: 2px;
-}
-
-.ina-accordion-card__icon {
-  /* Container untuk icon chevron */
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 2rem; /* 32px */
-  height: 2rem; /* 32px */
-  border-radius: var(--ina-radius-lg);
-  color: var(--ina-content-secondary);
-  background-color: var(--ina-background-secondary);
-  margin-right: var(--ina-spacing-4);
-}
-
-.ina-accordion-card__chevron {
-  /* Icon chevron dengan animasi rotation */
-  transition: transform 200ms ease;
-  transform: rotate(180deg);
-}
-
-.ina-accordion-card__chevron--open {
-  /* State terbuka: chevron menghadap atas */
-  transform: rotate(0deg);
-}
-.ina-accordion-card__title {
-  /* Judul accordion */
-  text-align: left;
-  font-weight: var(--ina-font-semibold);
-  font-size: var(--ina-font-sm);
-  color: var(--ina-content-primary);
-  width: 100%;
-}
-
-/* Responsive font size untuk title */
-@media (min-width: 640px) {
-  .ina-accordion-card__title {
-    font-size: var(--ina-font-base);
-  }
-}
-
-.ina-accordion-card__content {
-  /* Container untuk content dengan height animation */
-  height: 0px;
-  overflow: hidden;
-  transition: height 500ms ease;
-}
-
-.ina-accordion-card__content-body {
-  /* Body content dengan padding */
-  padding: 0.75rem var(--ina-spacing-4); /* py-3 px-4 equivalent */
-}
-
-/* Modifier untuk state terbuka */
-.ina-accordion-card--open .ina-accordion-card__content {
-  /* Height akan dikontrol melalui JavaScript inline style */
-}
-
-/* Focus styles untuk accessibility */
-.ina-accordion-card__header:focus-visible {
-  outline: 2px solid var(--ina-guide-500);
-  outline-offset: 2px;
-  border-radius: var(--ina-radius-base);
-}
-
-/* Hover effects */
-.ina-accordion-card__header:hover .ina-accordion-card__icon {
-  background-color: var(--ina-neutral-200);
-}
-
-.ina-accordion-card__header:hover .ina-accordion-card__title {
-  color: var(--ina-secondary);
-}

package/src/components/accordion.css

@@ -1,120 +0,0 @@
-/**
- * Accordion Component Styles
- * Menggunakan BEM naming convention dengan prefix "ina-"
- */
-
-.ina-accordion {
-  /* Root container accordion */
-  border-bottom: 1px solid var(--ina-stroke-primary);
-  background-color: inherit;
-  position: relative;
-}
-
-.ina-accordion__toggle {
-  /* Button untuk toggle accordion */
-  width: 100%;
-  font-size: var(--ina-font-sm);
-  font-weight: var(--ina-font-semibold);
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  padding: var(--ina-spacing-4) 0;
-  outline: none;
-  cursor: pointer;
-  background: none;
-  border: none;
-  transition: var(--ina-transition-fast);
-  position: relative;
-  z-index: 1;
-}
-
-/* .ina-accordion__toggle:focus {
-  outline: 2px solid var(--ina-guide-500);
-  outline-offset: 2px;
-} */
-
-/* Responsive font size */
-@media (min-width: 1024px) {
-  .ina-accordion__toggle {
-    font-size: var(--ina-font-base);
-  }
-}
-
-.ina-accordion__title {
-  /* Title section di sebelah kiri */
-  color: var(--ina-content-primary);
-  transition: var(--ina-transition-fast);
-}
-
-.ina-accordion__title:hover {
-  text-decoration: underline;
-  text-underline-offset: 4px;
-}
-
-.ina-accordion__toggler {
-  /* Toggler section di sebelah kanan */
-  flex-shrink: 0;
-  color: var(--ina-content-primary);
-  transition: var(--ina-transition-fast);
-}
-
-.ina-accordion__toggler:hover {
-  text-decoration: underline;
-  text-underline-offset: 4px;
-}
-
-.ina-accordion__icon {
-  transition: transform 200ms ease;
-  transform: rotate(0deg);
-  color: var(--ina-content-primary);
-}
-
-.ina-accordion__icon--open {
-  transform: rotate(180deg);
-}
-
-.ina-accordion__content {
-  /* Content container yang muncul/muncul */
-  overflow: hidden;
-  position: relative;
-  z-index: 0;
-  transition: max-height 0.3s ease, opacity 0.3s ease;
-  max-height: 0;
-  opacity: 0;
-}
-
-.ina-accordion__content--open {
-  max-height: 1000px;
-  opacity: 1;
-}
-
-.ina-accordion__body {
-  /* Body content yang muncul saat accordion terbuka */
-  padding-bottom: var(--ina-spacing-4);
-  color: var(--ina-content-primary);
-  font-size: var(--ina-font-xs);
-}
-
-/* Responsive font size untuk body */
-@media (min-width: 1024px) {
-  .ina-accordion__body {
-    font-size: var(--ina-font-sm);
-  }
-}
-
-/* Modifier untuk state terbuka */
-.ina-accordion--open .ina-accordion__toggle {
-  /* Style tambahan saat accordion terbuka jika diperlukan */
-}
-
-/* Group hover effect untuk seluruh accordion toggle */
-.ina-accordion__toggle:hover .ina-accordion__title,
-.ina-accordion__toggle:hover .ina-accordion__toggler {
-  /* Hover effect sudah dihandle masing-masing element */
-}
-
-/* Accordion Group */
-.ina-accordion-group {
-  display: flex;
-  flex-direction: column;
-}

package/src/components/action-dropdown.css

@@ -1,140 +0,0 @@
-/**
- * ActionDropdown Component Styles
- * Menggunakan BEM naming convention dengan prefix "ina-"
- */
-
-.ina-action-dropdown {
-  /* Root container dengan relative positioning */
-  position: relative;
-  display: inline-block;
-  text-align: left;
-}
-
-.ina-action-dropdown__trigger {
-  /* Default trigger button */
-  padding: var(--ina-spacing-1);
-  border-radius: var(--ina-radius-base);
-  outline: none;
-  cursor: pointer;
-  background: none;
-  border: none;
-  transition: var(--ina-transition-fast);
-}
-
-.ina-action-dropdown__trigger:hover {
-  background-color: var(--ina-neutral-100);
-}
-
-.ina-action-dropdown__trigger:focus {
-  outline: 2px solid var(--ina-guide-500);
-  outline-offset: 2px;
-}
-
-.ina-action-dropdown__trigger:focus-visible {
-  outline: 2px solid var(--ina-guide-500);
-  outline-offset: 2px;
-}
-
-.ina-action-dropdown__menu {
-  /* Positioned dropdown menu */
-  position: absolute;
-  width: 10rem; /* 160px */
-  background-color: var(--ina-neutral-25); /* white */
-  border: 1px solid var(--ina-stroke-primary);
-  border-radius: var(--ina-radius-lg);
-  box-shadow: var(--ina-shadow-lg);
-  z-index: 1000;
-}
-
-/* Vertical positioning */
-.ina-action-dropdown__menu--bottom {
-  top: calc(100% + 0.5rem); /* top-full mt-2 equivalent */
-}
-
-.ina-action-dropdown__menu--top {
-  bottom: calc(100% + 0.5rem); /* bottom-full mb-2 equivalent */
-}
-
-/* Horizontal positioning */
-.ina-action-dropdown__menu--left {
-  right: 0; /* right-0 equivalent */
-}
-
-.ina-action-dropdown__menu--right {
-  left: 0; /* left-0 equivalent */
-}
-
-.ina-action-dropdown__list {
-  /* List container untuk menu items */
-  padding: var(--ina-spacing-1) 0; /* py-1 equivalent */
-  margin: 0;
-  list-style: none;
-}
-
-.ina-action-dropdown__item {
-  /* Individual list item */
-  width: 100%;
-  text-align: left;
-  padding: var(--ina-spacing-2) var(--ina-spacing-4); /* px-4 py-2 equivalent */
-  font-size: var(--ina-font-sm);
-  user-select: none; /* select-none equivalent */
-  cursor: pointer;
-  transition: var(--ina-transition-fast);
-}
-
-.ina-action-dropdown__item:hover {
-  background-color: var(--ina-neutral-100);
-}
-
-.ina-action-dropdown__item:focus {
-  outline: none;
-  background-color: var(--ina-neutral-200);
-}
-
-/* Animation untuk dropdown appearance */
-.ina-action-dropdown__menu {
-  animation: fadeIn 150ms ease-in-out;
-}
-
-@keyframes fadeIn {
-  0% {
-    opacity: 0;
-    transform: scale(0.95);
-  }
-  100% {
-    opacity: 1;
-    transform: scale(1);
-  }
-}
-
-/* Focus styles untuk accessibility */
-.ina-action-dropdown__trigger[aria-expanded='true'] {
-  background-color: var(--ina-neutral-100);
-}
-
-/* Responsive adjustments */
-@media (max-width: 640px) {
-  .ina-action-dropdown__item {
-    font-size: var(--ina-font-xs); /* Turun dari sm ke xs */
-  }
-
-  .ina-action-dropdown__menu {
-    width: 9rem; /* Sedikit lebih kecil di mobile */
-  }
-}
-
-/* Dark mode support (future consideration) */
-/* @media (prefers-color-scheme: dark) {
-  .ina-action-dropdown__menu {
-    background-color: var(--ina-neutral-900);
-    border-color: var(--ina-neutral-700);
-  }
-
-  .ina-action-dropdown__item:hover {
-    background-color: var(--ina-neutral-800);
-  }
-
-  .ina-action-dropdown__trigger:hover {
-    background-color: var(--ina-neutral-800);
-  }
-} */