118 lines
2.0 KiB
CSS
118 lines
2.0 KiB
CSS
:root {
|
|
--bg: #f6f7f9;
|
|
--surface: #ffffff;
|
|
--border: #e5e7eb;
|
|
--muted: #6b7280;
|
|
--text: #111827;
|
|
--primary: #2563eb;
|
|
--primary-soft: #dbeafe;
|
|
--success: #16a34a;
|
|
--warning: #f59e0b;
|
|
--danger: #dc2626;
|
|
--radius-sm: 6px;
|
|
--radius-md: 10px;
|
|
--radius-lg: 14px;
|
|
}
|
|
|
|
body {
|
|
font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
|
|
background: var(--bg);
|
|
color: var(--text);
|
|
}
|
|
|
|
.app-nav .navbar-brand {
|
|
letter-spacing: -0.02em;
|
|
}
|
|
|
|
.card {
|
|
border: 1px solid var(--border);
|
|
border-radius: var(--radius-lg);
|
|
box-shadow: none;
|
|
}
|
|
|
|
.card-header {
|
|
background: var(--surface);
|
|
border-bottom: 1px solid var(--border);
|
|
}
|
|
|
|
.stat-card {
|
|
background: var(--surface);
|
|
border: 1px solid var(--border);
|
|
border-radius: var(--radius-lg);
|
|
padding: 1.25rem;
|
|
}
|
|
|
|
.stat-label {
|
|
color: var(--muted);
|
|
font-size: 0.85rem;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.08em;
|
|
}
|
|
|
|
.stat-value {
|
|
font-size: 1.8rem;
|
|
font-weight: 600;
|
|
}
|
|
|
|
.table {
|
|
--bs-table-bg: transparent;
|
|
}
|
|
|
|
.table thead th {
|
|
font-size: 0.85rem;
|
|
color: var(--muted);
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.05em;
|
|
border-bottom: 1px solid var(--border);
|
|
}
|
|
|
|
.table tbody tr {
|
|
border-bottom: 1px solid var(--border);
|
|
}
|
|
|
|
.badge-soft {
|
|
background: var(--primary-soft);
|
|
color: var(--primary);
|
|
border-radius: 999px;
|
|
padding: 0.35rem 0.6rem;
|
|
font-weight: 500;
|
|
}
|
|
|
|
.form-control, .form-select {
|
|
border-radius: var(--radius-sm);
|
|
border-color: var(--border);
|
|
}
|
|
|
|
.btn-primary {
|
|
background: var(--primary);
|
|
border-color: var(--primary);
|
|
border-radius: var(--radius-sm);
|
|
}
|
|
|
|
.btn-outline-primary {
|
|
border-radius: var(--radius-sm);
|
|
}
|
|
|
|
.section-title {
|
|
font-size: 1.2rem;
|
|
font-weight: 600;
|
|
}
|
|
|
|
.small-muted {
|
|
color: var(--muted);
|
|
font-size: 0.9rem;
|
|
}
|
|
|
|
.alert {
|
|
border-radius: var(--radius-md);
|
|
}
|
|
|
|
.empty-state {
|
|
border: 1px dashed var(--border);
|
|
border-radius: var(--radius-lg);
|
|
padding: 1.5rem;
|
|
text-align: center;
|
|
color: var(--muted);
|
|
background: #fafafa;
|
|
}
|