/* ============================================================
   BODYCAM IMS — STYLESHEET - REPORTS

   ============================================================ */

   /* ── Report-page-only additions ── */
    .report-tabs .nav-link {
      font-size: .82rem; font-weight: 600; color: var(--muted);
      border: none; border-bottom: 2px solid transparent;
      padding: .6rem 1rem; border-radius: 0;
      transition: color .15s, border-color .15s;
      background: none !important;
      text-decoration: none !important;
    }
    .report-tabs .nav-link:hover  { color: #1A2535; }
    .report-tabs .nav-link.active { color: var(--accent); border-bottom-color: var(--accent); }

    .chart-card {
      background: #fff; border-radius: 10px;
      border: 1px solid #E2E8F0; overflow: hidden;
      height: 100%;
    }
    .chart-card .ch-header {
      display: flex; align-items: center; justify-content: space-between;
      padding: .9rem 1.2rem; border-bottom: 1px solid #EEF2F7;
      flex-wrap: wrap; gap: .4rem;
    }
    .chart-card .ch-title {
      font-size: .9rem; font-weight: 700; color: #1A2535;
      display: flex; align-items: center; gap: .5rem;
    }
    .chart-card .ch-title i { color: var(--accent); }
    .chart-card .ch-body { padding: 1rem 1.2rem; }

    /* Stat summary strip */
    .stat-strip {
      display: flex; align-items: center; gap: .5rem;
      flex-wrap: wrap; padding: .5rem 1.2rem;
      border-top: 1px solid #EEF2F7; background: #FAFBFD;
    }
    .stat-item { font-size: .75rem; color: var(--muted); }
    .stat-item strong { color: #1A2535; }
    .stat-sep { color: #DDE3EA; }

    /* Mini legend dot */
    .leg-dot {
      display: inline-block; width: 9px; height: 9px;
      border-radius: 50%; margin-right: 4px; flex-shrink: 0;
    }
    .legend-row {
      display: flex; align-items: center; gap: .3rem;
      font-size: .75rem; color: #4A5568;
    }

    /* Donut center label */
    .donut-wrap { position: relative; display: inline-block; }
    .donut-center {
      position: absolute; top: 50%; left: 50%;
      transform: translate(-50%, -50%);
      text-align: center; pointer-events: none;
    }
    .donut-center .dc-val  { font-size: 1.5rem; font-weight: 800; color: #1A2535; line-height: 1; }
    .donut-center .dc-lbl  { font-size: .68rem; color: var(--muted); font-weight: 600; text-transform: uppercase; }

    /* Report table tweaks */
    .rep-table thead th {
      background: #F7FAFC; font-size: .72rem; font-weight: 700;
      text-transform: uppercase; letter-spacing: .07em;
      color: var(--muted); border-bottom: 1px solid #E2E8F0;
      padding: .6rem .9rem; white-space: nowrap;
    }
    .rep-table tbody td {
      padding: .6rem .9rem; vertical-align: middle;
      font-size: .83rem; border-color: #F0F4F8;
    }
    .rep-table tbody tr:hover td { background: #FAFCFF; }

    /* Progress bar rows */
    .prog-bar-wrap { min-width: 100px; }
    .prog-bar-bg {
      height: 6px; background: #E2E8F0; border-radius: 3px; overflow: hidden;
    }
    .prog-bar-fill { height: 100%; border-radius: 3px; }

    /* Score pill */
    .score-pill {
      display: inline-block; font-size: .72rem; font-weight: 700;
      padding: 2px 9px; border-radius: 20px;
    }
    .sc-green  { background: #E6F9EF; color: #1E8449; }
    .sc-yellow { background: #FEF9E7; color: #B7770D; }
    .sc-red    { background: #FDEDEC; color: #922B21; }

    /* Export bar */
    .export-bar {
      display: flex; align-items: center; gap: .5rem;
      flex-wrap: wrap;
    }
    .export-bar .btn {
      font-size: .78rem; padding: .3rem .75rem; border-radius: 6px;
      font-weight: 600;
    }

    /* Date range picker row */
    .date-range-row {
      display: flex; align-items: center; gap: .5rem; flex-wrap: wrap;
    }
    .date-range-row input[type=date],
    .date-range-row select {
      font-size: .82rem; border: 1px solid #DDE3EA; border-radius: 6px;
      padding: .3rem .65rem; color: #1A2535; background: #fff;
    }
    .date-range-row input[type=date]:focus,
    .date-range-row select:focus { outline: none; border-color: var(--accent); }

    /* Timeline bar chart manual */
    .tl-bar {
      display: flex; align-items: flex-end; gap: 6px;
      height: 120px; padding: 0 4px;
    }
    .tl-col { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 4px; }
    .tl-col .bar {
      width: 100%; border-radius: 4px 4px 0 0;
      transition: opacity .15s;
      min-height: 4px;
    }
    .tl-col .bar:hover { opacity: .8; }
    .tl-col .lbl { font-size: .62rem; color: var(--muted); white-space: nowrap; }
    .tl-col .val { font-size: .65rem; font-weight: 700; color: #4A5568; }

    /* Horizontal bar chart */
    .hbar-row {
      display: flex; align-items: center; gap: .6rem;
      margin-bottom: .6rem;
    }
    .hbar-label { font-size: .78rem; color: #4A5568; min-width: 110px; }
    .hbar-track { flex: 1; height: 8px; background: #E2E8F0; border-radius: 4px; overflow: hidden; }
    .hbar-fill  { height: 100%; border-radius: 4px; }
    .hbar-val   { font-size: .75rem; font-weight: 700; color: #1A2535; min-width: 32px; text-align: right; }

    /* Gauge-style circle */
    .gauge-ring { transform: rotate(-90deg); }

    /* Compliance heat cell */
    .heat-cell {
      display: inline-flex; align-items: center; justify-content: center;
      width: 32px; height: 24px; border-radius: 4px;
      font-size: .7rem; font-weight: 700;
    }

    /* Section toggle tabs */
    .tab-pane { display: none; }
    .tab-pane.active { display: block; }