/* Transport Complaints Manager – clean, modern UI */
:root{
  --tcm-bg:#f6f7fb;
  --tcm-border:#e5e7eb;
  --tcm-card:#ffffff;
  --tcm-text:#111827;
  --tcm-muted:#6b7280;
  --tcm-primary:#059669;
  --tcm-primary-600:#059669;
  --tcm-primary-700:#047857;
  --tcm-ring: rgba(5,150,105,.15);
}

.tcm-card{
  background:var(--tcm-card);
  border:1px solid var(--tcm-border);
  border-radius:16px;
  padding:18px;
  box-shadow:0 1px 2px rgba(0,0,0,.04);
  margin-bottom:16px;
}

.tcm-title{
  margin:0 0 8px;
  font-size:18px;
  font-weight:700;
  color:var(--tcm-text);
}

.tcm-form .tcm-field,
.tcm-field{ display:block; }

.tcm-label{
  display:block;
  font-size:13px;
  color:var(--tcm-muted);
  margin:0 0 6px;
}

.tcm-form select, .tcm-form input[type="text"], .tcm-form textarea,
.tcm-form-inline input[type="text"],
.tcm-form-inline select {
  width:100%;
  border:1px solid var(--tcm-border);
  border-radius:12px;
  padding:10px 12px;
  font-size:14px;
  outline:0;
  background:#fff;
  transition:border .15s, box-shadow .15s;
}

.tcm-form select:focus, .tcm-form input[type="text"]:focus, .tcm-form textarea:focus,
.tcm-form-inline input[type="text"]:focus, .tcm-form-inline select:focus{
  border-color:var(--tcm-primary-600);
  box-shadow:0 0 0 4px var(--tcm-ring);
}

.tcm-form textarea{ resize:vertical; }

.tcm-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  background:var(--tcm-primary);
  color:#fff;
  border:1px solid var(--tcm-primary-700);
  border-radius:12px;
  padding:10px 14px;
  font-weight:600;
  cursor:pointer;
  transition:background .15s, transform .05s;
}
.tcm-btn:hover{ background:var(--tcm-primary-700); }
.tcm-btn:active{ transform:translateY(1px); }

.tcm-btn-outline{
  background:#fff;
  color:var(--tcm-text);
  border:1px solid var(--tcm-border);
}

.tcm-response{ margin-top:10px; font-size:14px; color:var(--tcm-text); }

.tcm-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap:12px;
  margin-bottom:12px;
}
.tcm-grid-2{
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap:12px;
  margin:12px 0;
}
@media (max-width: 640px){
  .tcm-grid, .tcm-grid-2{ grid-template-columns: 1fr; }
}

.tcm-consent{ font-size:12px; color:var(--tcm-muted); }

/* Dashboard */
.tcm-dashboard{ background:var(--tcm-bg); border-radius:16px; padding:8px; }
.tcm-stats{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap:12px;
  margin-bottom:12px;
}
.tcm-stat{
  background:linear-gradient(180deg,#fff, #f9fafb);
  border:1px solid var(--tcm-border);
  border-radius:16px;
  padding:14px;
  box-shadow:0 1px 2px rgba(0,0,0,.04);
}
.tcm-stat-n{ font-size:26px; font-weight:800; line-height:1; margin-bottom:4px; }
.tcm-stat-l{ font-size:12px; color:var(--tcm-muted); }

.tcm-list{ list-style:none; padding:0; margin:6px 0 0; }
.tcm-list li{
  display:flex; align-items:center; justify-content:space-between;
  border:1px solid var(--tcm-border);
  border-radius:12px; padding:10px 12px; margin:6px 0;
  background:#fff;
}

/* Inline form (track) */
.tcm-form-inline{ display:flex; gap:8px; align-items:center; }
.tcm-form-inline input[type="text"]{ max-width:260px; }

/* Subtle badges (optional) */
.tcm-badge{ display:inline-block; border:1px solid var(--tcm-border); padding:2px 8px; border-radius:999px; font-size:12px; color:var(--tcm-muted); }