/**
 * assets/css/style.css
 * Global styles shared across the whole application.
 */

:root {
  --brand-navy: #0d3b66;
  --brand-navy-dark: #082741;
  --brand-gold: #f4a300;
  --brand-green: #2a9d8f;
  --brand-red: #e63946;
  --brand-gray-bg: #f4f6f9;
}

body {
  background-color: var(--brand-gray-bg);
  font-family: 'Segoe UI', Roboto, -apple-system, BlinkMacSystemFont, sans-serif;
  color: #1f2937;
  overflow-x: hidden;   /* belt-and-braces: no horizontal scroll ever */
}

a { color: var(--brand-navy); }
a:hover { color: var(--brand-gold); }

.btn-primary {
  background-color: var(--brand-navy);
  border-color: var(--brand-navy);
}
.btn-primary:hover, .btn-primary:focus {
  background-color: var(--brand-navy-dark);
  border-color: var(--brand-navy-dark);
}
.btn-outline-primary {
  color: var(--brand-navy);
  border-color: var(--brand-navy);
}
.btn-outline-primary:hover {
  background-color: var(--brand-navy);
  border-color: var(--brand-navy);
}

.card {
  border: none;
  border-radius: 12px;
  box-shadow: 0 2px 10px rgba(15, 23, 42, 0.06);
}
.card-header {
  background-color: #fff;
  border-bottom: 1px solid #eef1f5;
  font-weight: 600;
  border-top-left-radius: 12px !important;
  border-top-right-radius: 12px !important;
}

/* Status badges used across passenger/driver/admin trip & user tables */
.status-badge { font-weight: 600; padding: .4em .7em; }
.status-completed, .status-verified, .status-approved, .status-resolved { background-color: #d1f2eb; color: #0e6b5c; }
.status-ongoing, .status-pending, .status-in_review { background-color: #fff3cd; color: #8a6100; }
.status-insufficient_balance, .status-rejected, .status-suspended, .status-dismissed { background-color: #fde2e2; color: #a4232c; }
.status-cancelled, .status-inactive { background-color: #e9ecef; color: #495057; }

.admin-response {
  background-color: #eef3f8;
  border-left: 3px solid var(--brand-navy);
}

.role-badge {
  background-color: rgba(255,255,255,0.15);
  color: #fff;
  font-weight: 600;
  letter-spacing: .05em;
}
.sidebar-link {
  color: #4b5563;
  border-radius: 8px;
  padding: 0.65rem 0.9rem;
  margin-bottom: 2px;
  font-weight: 500;
}

/* ============================================================
   GLOBAL MOBILE: prevent overflow + improve readability
   ============================================================ */
@media (max-width: 575.98px) {
  body { font-size: .95rem; }

  h1, .h1 { font-size: 1.5rem; }
  h2, .h2 { font-size: 1.3rem; }
  h3, .h3 { font-size: 1.15rem; }
  h4, .h4 { font-size: 1.05rem; }

  .container, .container-fluid { padding-left: 12px; padding-right: 12px; }

  /* Tables always scroll horizontally rather than squish */
  .table-responsive { overflow-x: auto; }

  /* Stack btn-groups that would otherwise be too wide */
  .btn-group { flex-wrap: wrap; }
}