:root {
  --cv-brand: #1E82C8;
  --cv-brand-deep: #135E93;
  --cv-ink: #16232E;
  --cv-slate: #5A6A77;
  --cv-rule: #D9E1E8;
  --cv-paper: #F4F7FA;
  --cv-out: #B4531B;
  --bs-primary: #1E82C8;
  --bs-primary-rgb: 30, 130, 200;
  --bs-link-color: #135E93;
  --bs-link-color-rgb: 19, 94, 147;
  --bs-body-color: #16232E;
  --bs-body-font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans", "Helvetica Neue", Arial, sans-serif;
}

body { background: var(--cv-paper); font-size: 0.9375rem; }

.btn-primary {
  --bs-btn-bg: var(--cv-brand); --bs-btn-border-color: var(--cv-brand);
  --bs-btn-hover-bg: var(--cv-brand-deep); --bs-btn-hover-border-color: var(--cv-brand-deep);
  --bs-btn-active-bg: var(--cv-brand-deep); --bs-btn-active-border-color: var(--cv-brand-deep);
}
.btn-outline-primary {
  --bs-btn-color: var(--cv-brand-deep); --bs-btn-border-color: var(--cv-brand);
  --bs-btn-hover-bg: var(--cv-brand); --bs-btn-hover-border-color: var(--cv-brand);
}
:focus-visible { outline: 3px solid rgba(30, 130, 200, .45); outline-offset: 2px; }

/* Top bar */
.cv-bar { background: var(--cv-brand); color: #fff; }
.cv-bar .navbar-brand { color: #fff; font-weight: 700; letter-spacing: -0.01em; }
.cv-bar .navbar-brand small { font-weight: 400; opacity: .8; margin-left: .35rem; }
.cv-bar .nav-link { color: rgba(255, 255, 255, .82); padding: .9rem .75rem !important; border-bottom: 3px solid transparent; }
.cv-bar .nav-link:hover { color: #fff; }
.cv-bar .nav-link.active { color: #fff; border-bottom-color: #fff; }
.cv-bar .navbar-toggler { border-color: rgba(255,255,255,.5); }
.cv-bar .navbar-toggler-icon { filter: invert(1); }

.cv-page { max-width: 1320px; }
.cv-title { font-size: 1.375rem; font-weight: 700; margin: 0; }
.cv-sub { color: var(--cv-slate); margin: 0; }

.cv-panel { background: #fff; border: 1px solid var(--cv-rule); border-radius: 8px; }

/* Filters */
.cv-filters .form-label { font-size: .8125rem; color: var(--cv-slate); margin-bottom: .2rem; }

/* Recordings table */
.cv-table { margin: 0; }
.cv-table th { font-size: .8125rem; font-weight: 600; color: var(--cv-slate); background: #fff; border-bottom: 2px solid var(--cv-rule); white-space: nowrap; }
.cv-table td { vertical-align: middle; border-color: var(--cv-rule); }
.cv-when { font-variant-numeric: tabular-nums; white-space: nowrap; }
.cv-when .cv-dur { color: var(--cv-slate); font-size: .8125rem; }
.cv-plant { font-weight: 600; }
.cv-muted { color: var(--cv-slate); font-size: .8125rem; }
.cv-dir { display: inline-flex; align-items: center; gap: .25rem; font-size: .8125rem; font-weight: 600; }
.cv-dir.in { color: var(--cv-brand-deep); }
.cv-dir.out { color: var(--cv-out); }
.cv-dir svg { width: 14px; height: 14px; }
.cv-table audio { height: 34px; width: 240px; max-width: 100%; }
.cv-remarks { max-width: 260px; }

.cv-empty { padding: 3rem 1rem; text-align: center; color: var(--cv-slate); }

/* Login */
.cv-login { min-height: 100vh; display: grid; place-items: center; padding: 1rem; }
.cv-login .cv-panel { width: 100%; max-width: 380px; }
.cv-login-head { background: var(--cv-brand); color: #fff; border-radius: 8px 8px 0 0; padding: 1.25rem 1.5rem; }
.cv-login-head h1 { font-size: 1.25rem; font-weight: 700; margin: 0; }
.cv-login-head p { margin: .25rem 0 0; opacity: .85; font-size: .875rem; }
.cv-app-download { display: flex; align-items: center; justify-content: space-between; gap: .75rem; border-top: 1px solid var(--cv-rule); }

.badge-inactive { background: #E6EBEF; color: var(--cv-slate); font-weight: 500; }

@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }