/* The walkthrough popover, in CollabIQ's own design tokens. Loaded after
   driver.css, and scoped to the tour's popover class so nothing else changes. */

.driver-popover.collabiq-tour {
  background: var(--white, #fff);
  color: var(--text-prose, #3a3a4a);
  border: 1px solid var(--border-card, #e6e4ef);
  border-radius: var(--radius-3xl, 16px);
  box-shadow: 0 18px 48px rgba(20, 18, 50, 0.22);
  padding: 20px 22px 16px;
  max-width: 380px;
  font-family: var(--font-sans, system-ui, sans-serif);
}

.driver-popover.collabiq-tour .driver-popover-title {
  font-family: var(--font-display, Georgia, serif);
  font-size: var(--display-sm, 22px);
  font-weight: 400;
  line-height: 1.2;
  color: var(--text-display, #16152b);
  margin-bottom: 8px;
}

.driver-popover.collabiq-tour .driver-popover-description {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: var(--body-sm, 14px);
  line-height: var(--leading-prose, 1.6);
  color: var(--text-prose, #3a3a4a);
}

.driver-popover.collabiq-tour .driver-popover-description strong {
  color: var(--text-body, #22213a);
  font-weight: 600;
}

.driver-popover.collabiq-tour .driver-popover-footer {
  margin-top: 16px;
  align-items: center;
}

.driver-popover.collabiq-tour .driver-popover-progress-text {
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: var(--mono-xs, 12px);
  color: var(--text-faint, #8a88a0);
}

.driver-popover.collabiq-tour .driver-popover-footer-btn {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: var(--body-xs, 13px);
  text-shadow: none;
  border-radius: var(--radius-xl, 8px);
  padding: 7px 14px;
  background: var(--white, #fff);
  color: var(--accent-primary, #4b3fd6);
  border: 1px solid var(--indigo-150, #d9d6f2);
}

.driver-popover.collabiq-tour .driver-popover-footer-btn:hover,
.driver-popover.collabiq-tour .driver-popover-footer-btn:focus {
  background: var(--accent-pill-bg, #efedfc);
}

/* "Next" / "Done" is the primary action. */
.driver-popover.collabiq-tour .driver-popover-next-btn,
.driver-popover.collabiq-tour .driver-popover-done-btn {
  background: var(--accent-primary, #4b3fd6);
  color: var(--white, #fff);
  border-color: var(--accent-primary, #4b3fd6);
}

.driver-popover.collabiq-tour .driver-popover-next-btn:hover,
.driver-popover.collabiq-tour .driver-popover-next-btn:focus {
  background: var(--indigo-600, #3b31b3);
}

.driver-popover.collabiq-tour .driver-popover-close-btn {
  color: var(--text-faint, #8a88a0);
}

.driver-popover.collabiq-tour .driver-popover-close-btn:hover {
  color: var(--accent-primary, #4b3fd6);
}
