/* Mini Bootstrap-like styles (offline stub) */
:root {
  --bs-primary: #0d6efd;
  --bs-secondary: #6c757d;
  --bs-success: #198754;
  --bs-danger: #dc3545;
  --bs-light: #f8f9fa;
  --bs-dark: #212529;
  --bs-body-font-family: 'Arial', sans-serif;
}
* { box-sizing: border-box; }
body { margin:0; font-family: var(--bs-body-font-family); background: #eef2f7; }
a { color: var(--bs-primary); text-decoration: none; }
a:hover { text-decoration: underline; }
.container { width: 90%; max-width: 1140px; margin: 0 auto; }
.row { display: flex; flex-wrap: wrap; margin: 0 -12px; }
.col-md-4, .col-md-5, .col-md-6, .col-md-8, .col-md-12 { padding: 0 12px; flex: 1 0 0; }
.col-md-4 { flex-basis: 33.333%; }
.col-md-5 { flex-basis: 41.666%; }
.col-md-6 { flex-basis: 50%; }
.col-md-8 { flex-basis: 66.666%; }
.col-md-12 { flex-basis: 100%; }
@media (max-width: 768px) {
  .col-md-4, .col-md-5, .col-md-6, .col-md-8 { flex-basis: 100%; }
}
.navbar { display: flex; align-items: center; padding: 12px; }
.navbar-dark { background: var(--bs-primary); color: white; }
.navbar-brand { font-weight: bold; color: white; margin-right: 16px; }
.navbar-nav { list-style: none; display: flex; gap: 12px; margin: 0; padding: 0; }
.nav-link { color: white; }
.navbar-text { color: #e9ecef; margin-right: 10px; }
.btn { display: inline-block; padding: 10px 14px; border: none; border-radius: 6px; cursor: pointer; font-weight: 600; text-align: center; }
.btn:focus { outline: 2px solid rgba(0,0,0,0.2); }
.btn-primary { background: var(--bs-primary); color: white; }
.btn-outline-primary { background: transparent; border: 1px solid var(--bs-primary); color: var(--bs-primary); }
.btn-outline-secondary { background: transparent; border: 1px solid var(--bs-secondary); color: var(--bs-secondary); }
.btn-secondary { background: var(--bs-secondary); color: white; }
.btn-danger { background: var(--bs-danger); color: white; }
.btn-success { background: var(--bs-success); color: white; }
.btn-lg { padding: 14px 18px; font-size: 1.1rem; }
.btn-sm { padding: 6px 10px; font-size: .9rem; }
.btn w-100, .btn.w-100 { width: 100%; }
.card { background: white; border-radius: 10px; border: 1px solid #ddd; }
.card-body { padding: 16px; }
.card-title { margin-top: 0; margin-bottom: 12px; }
.shadow, .shadow-sm { box-shadow: 0 10px 30px rgba(0,0,0,0.05); }
.table { width: 100%; border-collapse: collapse; }
.table th, .table td { border: 1px solid #dee2e6; padding: 8px; }
.table-striped tbody tr:nth-child(odd) { background: #f8f9fa; }
.table-bordered { border: 1px solid #dee2e6; }
.form-control, textarea, input[type="text"], input[type="email"], input[type="password"], input[type="number"], input[type="file"] { width: 100%; padding: 10px; border: 1px solid #ced4da; border-radius: 6px; }
.form-label { font-weight: 600; display: block; margin-bottom: 6px; }
.alert { padding: 10px 14px; border-radius: 6px; margin-bottom: 12px; }
.alert-danger { background: #f8d7da; color: #842029; }
.alert-success { background: #d1e7dd; color: #0f5132; }
.alert-info { background: #cff4fc; color: #055160; }
.badge { display: inline-block; padding: 6px 10px; border-radius: 10px; font-size: .9rem; }
.bg-success { background: var(--bs-success); color: white; }
.bg-primary { background: var(--bs-primary); color: white; }
.bg-light { background: var(--bs-light); }
.text-danger { color: var(--bs-danger); }
.text-muted { color: #6c757d; }
.mb-2 { margin-bottom: 8px; }
.mb-3 { margin-bottom: 12px; }
.mb-5 { margin-bottom: 20px; }
.mt-2 { margin-top: 8px; }
.mt-3 { margin-top: 12px; }
.mt-5 { margin-top: 20px; }
.me-2 { margin-right: 8px; }
.ms-auto { margin-left: auto; }
.d-flex { display: flex; }
.justify-content-between { justify-content: space-between; }
.justify-content-center { justify-content: center; }
.align-items-center { align-items: center; }
.w-100 { width: 100%; }
.list-group { list-style: none; padding: 0; margin: 0; }
.list-group-item { padding: 10px 12px; border: 1px solid #ddd; border-radius: 6px; margin-bottom: 8px; background: white; }
hr { border: none; border-top: 1px solid #eee; margin: 16px 0; }
.small { font-size: .9rem; }
.card.shadow-sm, .card.shadow { overflow: hidden; }
.navbar-toggler { background: white; border: none; padding: 6px 10px; border-radius: 4px; }
.collapse { display: flex; flex: 1; }
@media (max-width: 768px) {
  .navbar-nav { flex-direction: column; }
  .collapse { flex-direction: column; }
}