.q-context-card-trigger {
  display: inline-flex;
  flex: 0 1 auto;
  cursor: pointer;
  overflow: hidden;
}
.q-context-card {
  position: fixed;
  z-index: 1000000;
  pointer-events: none;
  width: max-content;
  overflow: visible;
  box-sizing: border-box;
  color: #171717;
  font:
    16px/24px QuoterGeist,
    Arial,
    sans-serif;
  opacity: 1;
  transition:
    opacity 150ms cubic-bezier(0.3, 0.57, 0.07, 0.95),
    transform 250ms cubic-bezier(0.29, 0.31, 0.05, 0.96);
}
.q-context-card[data-state='closed'] {
  opacity: 0;
}
.q-context-card[data-state='closed'] .q-context-card__body {
  pointer-events: none;
}
.q-context-card__body {
  position: absolute;
  top: 0;
  left: 0;
  padding: 12px;
  max-width: max-content;
  width: max-content;
  pointer-events: auto;
}
.q-context-card__content {
  min-width: max-content;
}
.q-context-card__arrow {
  position: absolute;
  display: grid;
  place-content: center;
  width: 14px;
  height: 7px;
  pointer-events: none;
}
.q-context-card__arrow svg {
  overflow: hidden;
}
.q-context-card__arrow path {
  fill: var(--q-material-fill);
  stroke: #dbdbdb;
  stroke-width: 1;
}
.q-context-card[data-side='top'] .q-context-card__arrow {
  top: 100%;
  left: var(--q-card-arrow-x);
  transform: translateX(-50%);
}
.q-context-card[data-side='bottom'] .q-context-card__arrow {
  bottom: 100%;
  left: var(--q-card-arrow-x);
  transform: translateX(-50%) rotate(180deg);
}
.q-context-card[data-side='left'] .q-context-card__arrow {
  left: 100%;
  top: var(--q-card-arrow-y);
  transform: translate(-3.5px, -50%) rotate(-90deg);
}
.q-context-card[data-side='right'] .q-context-card__arrow {
  right: 100%;
  top: var(--q-card-arrow-y);
  transform: translate(3.5px, -50%) rotate(90deg);
}
[data-theme='dark'] .q-context-card {
  color: #ededed;
}
[data-theme='dark'] .q-context-card__arrow path {
  stroke: #252525;
}

.q-context-card[data-skip-transition='true'] {
  transition: opacity 150ms cubic-bezier(0.3, 0.57, 0.07, 0.95);
}
@media (prefers-reduced-motion: reduce) {
  .q-context-card,
  .q-context-card[data-skip-transition='true'] {
    transition: none;
  }
}

.q-context-card.q-material-tooltip {
  box-shadow:
    var(--q-material-stroke),
    0 1px 1px rgba(0, 0, 0, 0.02),
    0 4px 8px rgba(0, 0, 0, 0.04),
    var(--q-material-backdrop),
    0 0 0 1px var(--q-material-fill);
}

.q-context-card__arrow {
  transition: transform 250ms cubic-bezier(0.29, 0.31, 0.05, 0.96);
}
.q-context-card[data-skip-transition='true'] .q-context-card__arrow {
  transition: none;
}
@media (prefers-reduced-motion: reduce) {
  .q-context-card__arrow {
    transition: none;
  }
}