/* css/app.css */

/* Upload Zone */
.upload-section {
    max-width: 600px; margin: 40px auto; padding: 60px 20px;
    text-align: center; border: 2px dashed #cbd5e1;
    transition: all 0.3s ease; cursor: pointer;
}
.upload-section:hover, .upload-section.drag-active {
    border-color: #2563EB; background: rgba(37, 99, 235, 0.05); transform: scale(1.01);
}
.icon-circle {
    width: 80px; height: 80px; background: #eff6ff;
    border-radius: 50%; display: flex; align-items: center; justify-content: center;
    margin: 0 auto 20px; color: #2563EB; font-size: 32px;
}
.upload-section h2 { font-size: 24px; margin-bottom: 10px; color: #0f172a; }
.upload-section p { color: #64748b; }

/* Dashboard Layout */
#dashboard { display: grid; grid-template-columns: 1fr; gap: 24px; padding: 0 20px; }

/* Charts */
.chart-card { padding: 20px; min-height: auto !important; padding-bottom: 40px; }
.chart-wrapper { position: relative; height: 350px; width: 100%; margin-top: 20px; }
.controls { padding: 20px; display: flex; align-items: center; gap: 15px; }
select {
    padding: 8px 12px; border-radius: 8px; border: 1px solid #cbd5e1;
    font-family: 'Plus Jakarta Sans', sans-serif; color: #0f172a; outline: none;
}

/* History Table */
.history-card { padding: 0; overflow: hidden; }
.card-header { padding: 20px; background: rgba(255,255,255,0.5); border-bottom: 1px solid #e2e8f0; }
.card-header h3 { font-size: 16px; color: #0f172a; display: flex; align-items: center; gap: 8px; }
.table-responsive { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th, td { padding: 16px 24px; text-align: left; font-size: 14px; }
th { background: #f8fafc; color: #64748b; font-weight: 600; }
td { border-bottom: 1px solid #f1f5f9; }
tr:last-child td { border-bottom: none; }