/* StackJack dark theme for driver.js
   Uses the app's oklch design tokens for consistent appearance. */

/* Popover container */
.driver-popover.sj-tour {
    background-color: oklch(0.205 0 0);
    color: oklch(0.985 0 0);
    border: 1px solid oklch(0.269 0 0);
    border-radius: 0.625rem;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5);
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    max-width: 360px;
    padding: 20px;
}

/* Title */
.driver-popover.sj-tour .driver-popover-title {
    color: oklch(0.985 0 0);
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 8px;
}

/* Description */
.driver-popover.sj-tour .driver-popover-description {
    color: oklch(0.708 0 0);
    font-size: 0.875rem;
    line-height: 1.6;
}

/* Progress text */
.driver-popover.sj-tour .driver-popover-progress-text {
    color: oklch(0.556 0 0);
    font-size: 0.75rem;
}

/* Footer (button area) */
.driver-popover.sj-tour footer {
    margin-top: 16px;
}

/* All buttons base */
.driver-popover.sj-tour footer button {
    border-radius: calc(0.625rem - 2px);
    font-size: 0.8125rem;
    font-weight: 500;
    padding: 0.4rem 0.875rem;
    text-shadow: none;
    cursor: pointer;
    transition: opacity 0.15s ease;
}

/* Next / Done button — blue accent */
.driver-popover.sj-tour .driver-popover-next-btn {
    background-color: oklch(0.488 0.243 264.376) !important;
    color: oklch(0.985 0 0) !important;
    border: none !important;
}

.driver-popover.sj-tour .driver-popover-next-btn:hover {
    opacity: 0.9;
}

/* Previous button — outline style */
.driver-popover.sj-tour .driver-popover-prev-btn {
    background-color: transparent !important;
    border: 1px solid oklch(0.269 0 0) !important;
    color: oklch(0.985 0 0) !important;
}

.driver-popover.sj-tour .driver-popover-prev-btn:hover {
    background-color: oklch(0.269 0 0) !important;
}

/* Close button */
.driver-popover.sj-tour .driver-popover-close-btn {
    color: oklch(0.556 0 0);
    width: 28px;
    height: 28px;
}

.driver-popover.sj-tour .driver-popover-close-btn:hover {
    color: oklch(0.985 0 0);
}

/* Arrow — match popover background */
.driver-popover.sj-tour.driver-popover-arrow-side-top .driver-popover-arrow {
    border-top-color: oklch(0.205 0 0);
}

.driver-popover.sj-tour.driver-popover-arrow-side-bottom .driver-popover-arrow {
    border-bottom-color: oklch(0.205 0 0);
}

.driver-popover.sj-tour.driver-popover-arrow-side-left .driver-popover-arrow {
    border-left-color: oklch(0.205 0 0);
}

.driver-popover.sj-tour.driver-popover-arrow-side-right .driver-popover-arrow {
    border-right-color: oklch(0.205 0 0);
}

/* Arrow border side for contrast */
.driver-popover.sj-tour.driver-popover-arrow-side-top .driver-popover-arrow-side {
    border-top-color: oklch(0.269 0 0);
}

.driver-popover.sj-tour.driver-popover-arrow-side-bottom .driver-popover-arrow-side {
    border-bottom-color: oklch(0.269 0 0);
}

.driver-popover.sj-tour.driver-popover-arrow-side-left .driver-popover-arrow-side {
    border-left-color: oklch(0.269 0 0);
}

.driver-popover.sj-tour.driver-popover-arrow-side-right .driver-popover-arrow-side {
    border-right-color: oklch(0.269 0 0);
}