/* Guided tour (Driver.js), themed to match Excelergy. Additive; loaded after
 * driver.css so these overrides win on equal specificity. Colours reference the
 * site's CSS custom properties, so light/dark mode flow through automatically. */

.driver-popover.excelergy-tour {
  background: var(--card-solid);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 14px;
  box-shadow: var(--shadow-soft);
  min-width: 260px;
  max-width: 340px;
  padding: 18px 20px;
}

/* Undo Driver's forced font stack so the popover uses the site font. */
.driver-popover.excelergy-tour,
.driver-popover.excelergy-tour * { font-family: inherit; }

.driver-popover.excelergy-tour .driver-popover-title {
  font-family: inherit;
  font-size: 17px;
  font-weight: 700;
  letter-spacing: -0.015em;
  line-height: 1.25;
  color: var(--text);
  margin: 0 0 6px;
}

.driver-popover.excelergy-tour .driver-popover-description {
  font-family: inherit;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.55;
  color: var(--muted);
  margin: 0;
}

.driver-popover.excelergy-tour .driver-popover-close-btn {
  color: var(--muted);
  font-size: 20px;
  width: 34px;
  height: 30px;
}
.driver-popover.excelergy-tour .driver-popover-close-btn:hover,
.driver-popover.excelergy-tour .driver-popover-close-btn:focus { color: var(--text); }

.driver-popover.excelergy-tour .driver-popover-footer { margin-top: 16px; }

.driver-popover.excelergy-tour .driver-popover-progress-text {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--muted);
}

.driver-popover.excelergy-tour .driver-popover-footer button {
  font-family: inherit;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.3;
  padding: 7px 14px;
  border-radius: 9px;
  text-shadow: none;
  cursor: pointer;
  border: 1px solid var(--border);
  background: var(--card-solid);
  color: var(--text);
  transition: background .12s, border-color .12s, color .12s;
}
.driver-popover.excelergy-tour .driver-popover-footer button:hover,
.driver-popover.excelergy-tour .driver-popover-footer button:focus {
  background: var(--bg-soft);
  border-color: var(--border-strong);
}
.driver-popover.excelergy-tour .driver-popover-next-btn,
.driver-popover.excelergy-tour .driver-popover-next-btn:hover,
.driver-popover.excelergy-tour .driver-popover-next-btn:focus {
  background: var(--primary);
  border-color: var(--primary);
  color: #fff;
}
.driver-popover.excelergy-tour .driver-popover-next-btn:hover,
.driver-popover.excelergy-tour .driver-popover-next-btn:focus {
  background: var(--primary-dark);
  border-color: var(--primary-dark);
}
.driver-popover.excelergy-tour .driver-popover-footer .driver-popover-btn-disabled {
  opacity: .45;
}

/* Arrow: Driver hardcodes white; recolour the one visible border per side so it
 * matches the popover background in both themes. */
.driver-popover.excelergy-tour .driver-popover-arrow-side-left   { border-left-color:   var(--card-solid); }
.driver-popover.excelergy-tour .driver-popover-arrow-side-right  { border-right-color:  var(--card-solid); }
.driver-popover.excelergy-tour .driver-popover-arrow-side-top    { border-top-color:    var(--card-solid); }
.driver-popover.excelergy-tour .driver-popover-arrow-side-bottom { border-bottom-color: var(--card-solid); }

/* The "Take the tour" / "Clear example" controls in the hero action row. */
.tour-clear { color: var(--muted); }