/* Driver.js Base styles */
.driver-active .driver-overlay, .driver-active * { pointer-events: none; }
.driver-active .driver-active-element, .driver-active .driver-active-element *, .driver-popover, .driver-popover * { pointer-events: auto; }
@keyframes animate-fade-in { 0% { opacity: 0; } to { opacity: 1; } }
.driver-fade .driver-overlay { animation: animate-fade-in .2s ease-in-out; }
.driver-fade .driver-popover { animation: animate-fade-in .2s; }

/* Custom Modern Kan-anansabaybay Popover Theme */
.driver-popover {
    all: unset;
    box-sizing: border-box;
    color: #18181b;
    margin: 0;
    padding: 20px 22px;
    border-radius: 24px;
    min-width: 280px;
    max-width: 360px;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25), 0 0 0 1px rgba(0, 0, 0, 0.05);
    z-index: 1000000000;
    position: fixed;
    top: 0;
    right: 0;
    background-color: #ffffff;
    border: 1px solid rgba(228, 228, 231, 0.9);
}
.driver-popover * {
    font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, sans-serif;
}
.driver-popover-title {
    font-size: 16px;
    font-weight: 800;
    color: #09090b;
    display: block;
    position: relative;
    line-height: 1.35;
    margin: 0;
    letter-spacing: -0.01em;
}
.driver-popover-close-btn {
    all: unset;
    position: absolute;
    top: 14px;
    right: 14px;
    width: 28px;
    height: 28px;
    cursor: pointer;
    font-size: 20px;
    font-weight: 500;
    color: #a1a1aa;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 9999px;
    transition: all 0.2s;
}
.driver-popover-close-btn:hover, .driver-popover-close-btn:focus {
    color: #18181b;
    background-color: #f4f4f5;
}
.driver-popover-title[style*="block"] + .driver-popover-description {
    margin-top: 8px;
}
.driver-popover-description {
    margin-bottom: 0;
    font-size: 13px;
    line-height: 1.55;
    font-weight: 500;
    color: #52525b;
}
.driver-popover-footer {
    margin-top: 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.driver-popover-progress-text {
    font-size: 11px;
    font-weight: 700;
    color: #00a398;
    background: rgba(0, 163, 152, 0.1);
    padding: 3px 10px;
    border-radius: 9999px;
}
.driver-popover-footer button {
    all: unset;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    cursor: pointer;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    transition: all 0.2s;
    user-select: none;
}
.driver-popover-next-btn {
    background-color: #00a398 !important;
    color: #ffffff !important;
    padding: 8px 16px !important;
    border-radius: 9999px !important;
    box-shadow: 0 4px 12px rgba(0, 163, 152, 0.3) !important;
}
.driver-popover-next-btn:hover {
    background-color: #008f85 !important;
    transform: translateY(-1px);
    box-shadow: 0 6px 16px rgba(0, 163, 152, 0.4) !important;
}
.driver-popover-prev-btn {
    background-color: #f4f4f5 !important;
    color: #52525b !important;
    padding: 8px 14px !important;
    border-radius: 9999px !important;
    margin-right: 6px !important;
}
.driver-popover-prev-btn:hover {
    background-color: #e4e4e7 !important;
    color: #18181b !important;
}
.driver-popover-footer .driver-popover-btn-disabled {
    opacity: 0.4;
    pointer-events: none;
}
:not(body):has(> .driver-active-element) { overflow: hidden !important; }
.driver-no-interaction, .driver-no-interaction * { pointer-events: none !important; }
.driver-popover-navigation-btns {
    display: flex;
    flex-grow: 1;
    justify-content: flex-end;
    align-items: center;
}
.driver-popover-arrow {
    content: "";
    position: absolute;
    border: 6px solid #fff;
}
.driver-popover-arrow-side-over { display: none; }
.driver-popover-arrow-side-left { left: 100%; border-right-color: transparent; border-bottom-color: transparent; border-top-color: transparent; }
.driver-popover-arrow-side-right { right: 100%; border-left-color: transparent; border-bottom-color: transparent; border-top-color: transparent; }
.driver-popover-arrow-side-top { top: 100%; border-right-color: transparent; border-bottom-color: transparent; border-left-color: transparent; }
.driver-popover-arrow-side-bottom { bottom: 100%; border-left-color: transparent; border-top-color: transparent; border-right-color: transparent; }
.driver-popover-arrow-side-center { display: none; }
.driver-popover-arrow-align-start { left: 24px; top: 24px; }
.driver-popover-arrow-align-end { right: 24px; bottom: 24px; }
.driver-popover-arrow-align-center { top: 50%; left: 50%; margin-top: -6px; margin-left: -6px; }
.driver-popover-arrow-none { display: none; }
