/* icon-finder.blade.php: Tailwind step 2. Utilities live in the markup; built by work/tw/build-tools.sh (content: icon-finder.classes). */

:root[data-theme="dark"] :where(.cmt) :is(.if-cell, #if-preview) svg[stroke="#101828"] {
  stroke: var(--ink, #F5F5F7)
}

/*! tw-utilities */

:where(.cmt) .tw-flex {
  display: flex
}

:where(.cmt) .tw-grid {
  display: grid
}

:where(.cmt) .tw-h-\[22px\] {
  height: 22px
}

:where(.cmt) .tw-w-\[22px\] {
  width: 22px
}

:where(.cmt) .tw-min-w-\[0\] {
  min-width: 0
}

:where(.cmt) .tw-cursor-pointer {
  cursor: pointer
}

:where(.cmt) .tw-grid-cols-\[repeat\(auto-fill\,_minmax\(92px\,_1fr\)\)\] {
  grid-template-columns: repeat(auto-fill, minmax(92px, 1fr))
}

:where(.cmt) .tw-flex-col {
  flex-direction: column
}

:where(.cmt) .tw-items-center {
  align-items: center
}

:where(.cmt) .tw-gap-\[8px\] {
  gap: 8px
}

:where(.cmt) .tw-rounded-\[14px\] {
  border-radius: 14px
}

:where(.cmt) .tw-rounded-\[6px\] {
  border-radius: 6px
}

:where(.cmt) .tw-p-\[0\] {
  padding: 0
}

:where(.cmt) .tw-p-\[16px_6px_10px\] {
  padding: 16px 6px 10px
}

:where(.cmt) .tw-css-border-\[0\] {
  border: 0
}

:where(.cmt) .tw-css-background-\[none\] {
  background: none
}

:where(.cmt) .tw-css-background-\[var\(--inset\,_\#F5F5F7\)\] {
  background: var(--inset, #F5F5F7)
}

:where(.cmt) .tw-css-color-\[var\(--ink\,_\#1D1D1F\)\] {
  color: var(--ink, #1D1D1F)
}

:where(.cmt) .\[\&\#if-preview_svg\]\:tw-h-\[48px\]#if-preview svg {
  height: 48px
}

:where(.cmt) .\[\&\#if-preview_svg\]\:tw-w-\[48px\]#if-preview svg {
  width: 48px
}

:where(.cmt) .\[\&\.is-active\]\:tw-css-box-shadow-\[0_0_0_2px_var\(--ink\2c _\#1D1D1F\)\].is-active {
  box-shadow: 0 0 0 2px var(--ink, #1D1D1F)
}

:where(.cmt) .\[\&\:\:-webkit-color-swatch-wrapper\]\:tw-p-\[0\]::-webkit-color-swatch-wrapper {
  padding: 0
}

:where(.cmt) .\[\&\:\:-webkit-color-swatch\]\:tw-rounded-\[6px\]::-webkit-color-swatch {
  border-radius: 6px
}

:where(.cmt) .\[\&\:\:-webkit-color-swatch\]\:tw-css-border-\[0\]::-webkit-color-swatch {
  border: 0
}

:where(.cmt) .\[\&\:\:-webkit-color-swatch\]\:tw-css-box-shadow-\[inset_0_0_0_1px_rgba\(0\2c _0\2c _0\2c _\.14\)\]::-webkit-color-swatch {
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .14)
}

:where(.cmt) .\[\&\:hover\]\:tw-css-background-\[var\(--hairline\2c _rgba\(0\2c _0\2c _0\2c _\.08\)\)\]:hover {
  background: var(--hairline, rgba(0, 0, 0, .08))
}

:where(.cmt) .\[\&_\>_\:is\(i\2c \.icon\2c svg\)\]\:tw-pointer-events-none > :is(i,.icon,svg) {
  pointer-events: none
}

:where(.cmt) .\[\&_\>_\:is\(i\2c \.icon\2c svg\)\]\:tw-absolute > :is(i,.icon,svg) {
  position: absolute
}

:where(.cmt) .\[\&_\>_\:is\(i\2c \.icon\2c svg\)\]\:tw-left-\[16px\] > :is(i,.icon,svg) {
  left: 16px
}

:where(.cmt) .\[\&_\>_\:is\(i\2c \.icon\2c svg\)\]\:tw-top-\[50\%\] > :is(i,.icon,svg) {
  top: 50%
}

:where(.cmt) .\[\&_\>_\:is\(i\2c \.icon\2c svg\)\]\:tw-css-color-\[var\(--ink-3\2c _\#A1A1A6\)\] > :is(i,.icon,svg) {
  color: var(--ink-3, #A1A1A6)
}

:where(.cmt) .\[\&_\>_\:is\(i\2c \.icon\2c svg\)\]\:tw-css-transform-\[translateY\(-50\%\)\] > :is(i,.icon,svg) {
  transform: translateY(-50%)
}

:where(.cmt) .\[\&_span\]\:tw-max-w-\[100\%\] span {
  max-width: 100%
}

:where(.cmt) .\[\&_span\]\:tw-overflow-hidden span {
  overflow: hidden
}

:where(.cmt) .\[\&_span\]\:tw-text-ellipsis span {
  text-overflow: ellipsis
}

:where(.cmt) .\[\&_span\]\:tw-whitespace-nowrap span {
  white-space: nowrap
}

:where(.cmt) .\[\&_span\]\:tw-text-\[13px\] span {
  font-size: 13px
}

:where(.cmt) .\[\&_span\]\:tw-css-color-\[var\(--ink-2\2c _\#6E6E73\)\] span {
  color: var(--ink-2, #6E6E73)
}

:where(.cmt) .\[\&_svg\]\:tw-h-\[28px\] svg {
  height: 28px
}

:where(.cmt) .\[\&_svg\]\:tw-w-\[28px\] svg {
  width: 28px
}