/* ─────────────────────────────────────────────
   NIR ICT Validation – Custom Stylesheet
   ──────────────────────────────────────────── */

/* Base */
body {
  background-color: #f0f4f8;
  font-size: 0.875rem;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
.container-fluid { flex: 1; }
.footer { font-size: 0.78rem; }

/* Navbar */
.navbar-brand { font-size: 0.95rem; letter-spacing: 0.02em; }

/* Cards */
.card { border-radius: 0.75rem; }
.card-header { border-radius: 0.75rem 0.75rem 0 0 !important; font-size: 0.875rem; }

/* ── Stat cards ── */
.stat-card .card-body { padding: 1rem; }
.icon-box {
  width: 42px;
  height: 42px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ── Status badges ── */
.badge-connected,
.badge-unserved,
.badge-underserved,
.badge-forvalidation,
.badge-other,
.badge-nonfunc {
  display: inline-block;
  padding: 0.2em 0.55em;
  border-radius: 0.375rem;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  white-space: nowrap;
}
.badge-connected    { background: #d1fae5; color: #065f46; }
.badge-unserved     { background: #fee2e2; color: #991b1b; }
.badge-underserved  { background: #fef3c7; color: #92400e; }
.badge-forvalidation{ background: #dbeafe; color: #1e40af; }
.badge-nonfunc      { background: #e5e7eb; color: #374151; }
.badge-other        { background: #ede9fe; color: #4c1d95; }

/* SDO summary table pills */
.badge-connected-pill    { background: #d1fae5; color: #065f46; padding: 0.15em 0.5em; border-radius: 9999px; font-size: 0.72rem; font-weight: 600; }
.badge-unserved-pill     { background: #fee2e2; color: #991b1b; padding: 0.15em 0.5em; border-radius: 9999px; font-size: 0.72rem; font-weight: 600; }
.badge-underserved-pill  { background: #fef3c7; color: #92400e; padding: 0.15em 0.5em; border-radius: 9999px; font-size: 0.72rem; font-weight: 600; }

/* ── DataTables ── */
.dataTables_wrapper .dataTables_filter input {
  border: 1px solid #ced4da;
  border-radius: 0.375rem;
  padding: 0.25rem 0.5rem;
  font-size: 0.8rem;
}
.dataTables_wrapper .dataTables_length select {
  border: 1px solid #ced4da;
  border-radius: 0.375rem;
  padding: 0.2rem 0.4rem;
  font-size: 0.8rem;
}
.dataTables_wrapper .dataTables_info { font-size: 0.8rem; }
.dataTables_wrapper .dataTables_paginate .paginate_button { font-size: 0.8rem; }
table.dataTable > tbody > tr > td { vertical-align: middle; }
table.dataTable > thead > tr > th { font-size: 0.78rem; white-space: nowrap; }

/* Action buttons in table */
.btn-xs { font-size: 0.72rem !important; }

/* Modal */
.modal-header { border-radius: 0.5rem 0.5rem 0 0; }
.modal .form-label { font-size: 0.8rem; margin-bottom: 0.25rem; }
.modal .form-control-sm,
.modal .form-select-sm { font-size: 0.8rem; }

/* Chart canvas */
canvas { max-width: 100%; }

/* Import log */
#importLog div { border-bottom: 1px solid #e5e7eb; padding: 2px 0; }
#importLog div:last-child { border-bottom: none; }

/* Progress bar rounded */
.progress { border-radius: 0.5rem; }

/* teal / indigo helpers (not in Bootstrap 5) */
.text-teal   { color: #0d9488 !important; }
.text-indigo { color: #4f46e5 !important; }
.bg-teal     { background-color: #0d9488 !important; }
.bg-indigo   { background-color: #4f46e5 !important; }
.bg-teal.bg-opacity-10   { background-color: rgba(13,148,136,.1)  !important; }
.bg-indigo.bg-opacity-10 { background-color: rgba(79,70,229,.1)   !important; }