body { font-family: 'Inter', sans-serif; background-color: #070d1f; color: #dfe4fe; }
.material-symbols-outlined { font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24; }
.glass-card {
    background: rgba(28, 37, 62, 0.6);
    backdrop-filter: blur(12px);
    border-top: 1px solid rgba(105, 246, 184, 0.1);
}
.stats-glow-primary { text-shadow: 0 0 20px rgba(105, 246, 184, 0.3); }
.stats-glow-secondary { text-shadow: 0 0 20px rgba(248, 160, 16, 0.3); }
.stats-glow-error { text-shadow: 0 0 20px rgba(255, 113, 106, 0.3); }
::-webkit-scrollbar { width: 4px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #1c253e; border-radius: 10px; }

/* Laporan specific styles */
.glass-module {
    background: rgba(23, 31, 54, 0.6);
    backdrop-filter: blur(12px);
    border-top: 1px solid rgba(105, 246, 184, 0.2);
}
.matrix-table {
    border-collapse: separate;
    border-spacing: 0 0.25rem;
}
.status-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    display: inline-block;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
}
.custom-scrollbar::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}
.custom-scrollbar::-webkit-scrollbar-track {
    background: #070d1f;
}
.custom-scrollbar::-webkit-scrollbar-thumb {
    background: #1c253e;
    border-radius: 10px;
}
.no-scrollbar::-webkit-scrollbar {
    display: none;
}
.tonal-transition {
    background: linear-gradient(180deg, #070d1f 0%, #0c1326 100%);
}

/* ===== RFID Session Scanner Styles ===== */

/* Radar Ring Pulse Animation */
.radar-ring {
    animation: radarPulse 3s ease-out infinite;
    opacity: 0;
}
@keyframes radarPulse {
    0% { transform: scale(0.3); opacity: 0.6; }
    100% { transform: scale(1); opacity: 0; }
}

/* Scanner Idle Glow */
.scanner-idle {
    animation: idleGlow 3s ease-in-out infinite;
}
@keyframes idleGlow {
    0%, 100% { box-shadow: 0 0 20px rgba(105, 246, 184, 0.05); }
    50% { box-shadow: 0 0 40px rgba(105, 246, 184, 0.15); }
}

/* Scanner Scanning Pulse */
.scanner-scanning {
    animation: scanPulse 0.6s ease-in-out infinite;
}
@keyframes scanPulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.05); }
}

/* Scanner Flash Effects */
.scanner-flash-success {
    animation: flashSuccess 0.5s ease-out;
}
@keyframes flashSuccess {
    0% { box-shadow: inset 0 0 60px rgba(105, 246, 184, 0.3); }
    100% { box-shadow: inset 0 0 0px rgba(105, 246, 184, 0); }
}
.scanner-flash-warning {
    animation: flashWarning 0.5s ease-out;
}
@keyframes flashWarning {
    0% { box-shadow: inset 0 0 60px rgba(248, 160, 16, 0.3); }
    100% { box-shadow: inset 0 0 0px rgba(248, 160, 16, 0); }
}
.scanner-flash-error {
    animation: flashError 0.5s ease-out;
}
@keyframes flashError {
    0% { box-shadow: inset 0 0 60px rgba(255, 113, 106, 0.3); }
    100% { box-shadow: inset 0 0 0px rgba(255, 113, 106, 0); }
}

/* Log Row Slide-in Entry Animation */
.scan-row-enter {
    animation: rowSlideIn 0.4s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
@keyframes rowSlideIn {
    0% { opacity: 0; transform: translateY(-12px); background-color: rgba(105, 246, 184, 0.08); }
    60% { background-color: rgba(105, 246, 184, 0.04); }
    100% { opacity: 1; transform: translateY(0); background-color: transparent; }
}

/* Toast Notifications */
.toast-enter {
    animation: toastIn 0.35s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
@keyframes toastIn {
    0% { opacity: 0; transform: translateY(16px) scale(0.95); }
    100% { opacity: 1; transform: translateY(0) scale(1); }
}
.toast-exit {
    animation: toastOut 0.3s ease-in forwards;
}
@keyframes toastOut {
    0% { opacity: 1; transform: translateY(0) scale(1); }
    100% { opacity: 0; transform: translateY(8px) scale(0.95); }
}

/* Completion Pulse */
.completion-pulse {
    animation: completionPulse 2s ease-in-out infinite;
}
@keyframes completionPulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(105, 246, 184, 0.2); }
    50% { box-shadow: 0 0 0 16px rgba(105, 246, 184, 0); }
}

/* Glass Panel (shared utility) */
.glass-panel {
    background: rgba(23, 31, 54, 0.6);
    backdrop-filter: blur(12px);
}

/* Animate spin for loading states */
.animate-spin {
    animation: spin 1s linear infinite;
}
@keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* ===== Mobile Responsive Overrides ===== */
@media (max-width: 1023px) {
    /* Main content: remove sidebar margin, adjust padding */
    main {
        margin-left: 0 !important;
        padding-left: 1rem !important;
        padding-right: 1rem !important;
        padding-top: 5rem !important;
        padding-bottom: 6rem !important;
        max-width: 100% !important;
    }

    /* Prevent body scroll when sidebar is open */
    body.overflow-hidden {
        overflow: hidden;
    }
}

/* ===== Session Specific Styles ===== */
.step-number {
    background: linear-gradient(135deg, #69f6b8 0%, #06b77f 100%);
}
@keyframes scan-line {
    0% { top: 0; opacity: 0; }
    50% { opacity: 1; }
    100% { top: 100%; opacity: 0; }
}
.scanner-line {
    animation: scan-line 2s infinite ease-in-out;
}