@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@300;400;500;700&display=swap');

body {
    font-family: 'Noto Sans TC', sans-serif;
}

/* 動畫效果 */
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

.fade-in {
    animation: fadeIn 0.5s ease-in;
}

/* 響應式表格 */
@media (max-width: 640px) {
    table {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
    }
}
/* 自定義滾動條 */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: #f1f1f1;
}

::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: #555;
}

/* 檢測結果表格 */
#detection-results tr:hover {
    background-color: #f8fafc;
}

/* 實時顯示區域 */
#real-time-display {
    transition: all 0.3s ease;
}

#detection-canvas {
    pointer-events: none;
}

/* 車輛類型標籤 */
.bg-blue-100 {
    background-color: #dbeafe;
}
.bg-green-100 {
    background-color: #d1fae5;
}
.bg-red-100 {
    background-color: #fee2e2;
}