/* StampIt Dashboard CSS */

/* Dark mode toggle */
.dark body {
    color-scheme: dark;
}

/* QR Station fullscreen */
#qr-station {
    min-height: 100vh;
    min-height: 100dvh;
}

/* Scan success animation */
.scan-success {
    animation: scanPop 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}

@keyframes scanPop {
    0% { transform: scale(0.8); opacity: 0; }
    100% { transform: scale(1); opacity: 1; }
}

/* Toast animations */
.toast-enter {
    animation: toastIn 0.3s ease-out;
}

.toast-exit {
    animation: toastOut 0.3s ease-in forwards;
}

@keyframes toastIn {
    0% { transform: translateX(100%); opacity: 0; }
    100% { transform: translateX(0); opacity: 1; }
}

@keyframes toastOut {
    0% { transform: translateX(0); opacity: 1; }
    100% { transform: translateX(100%); opacity: 0; }
}

/* Line clamp */
.line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Smooth page transitions */
main {
    animation: fadeIn 0.15s ease-out;
}

@keyframes fadeIn {
    0% { opacity: 0; transform: translateY(4px); }
    100% { opacity: 1; transform: translateY(0); }
}

/* Stat card hover */
.stat-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

/* Fix html5-qrcode styling */
#reader video {
    border-radius: 0 !important;
    object-fit: cover !important;
}

#reader {
    border: none !important;
}

#reader__scan_region {
    min-height: 0 !important;
}

#reader__dashboard {
    display: none !important;
}

/* Scrollbar styling for dark mode */
.dark ::-webkit-scrollbar {
    width: 8px;
}
.dark ::-webkit-scrollbar-track {
    background: rgb(31, 41, 55);
}
.dark ::-webkit-scrollbar-thumb {
    background: rgb(75, 85, 99);
    border-radius: 4px;
}

/* Print styles for QR Station */
@media print {
    #qr-station .absolute { display: none !important; }
    #qr-station { background: white !important; }
    #qr-station * { color: black !important; }
    #daily-pin { color: #4338ca !important; }
}
