html { font-size: 14px; }

:root { --ipwac-primary: #7a1b1b; }

body { background: #fff; }

.bg-ipwac { background-color: var(--ipwac-primary); }

.sidebar { background: #f6f6f8; min-height: calc(100vh - 56px); border-right: 1px solid #e3e3e8; }
.sidebar .nav-link { color: #333; border-radius: .375rem; padding: .45rem .75rem; }
.sidebar .nav-link:hover { background: #ececf1; }
.sidebar .nav-link.active { background: var(--ipwac-primary); color: #fff; }

.stat-card { border-left: 4px solid var(--ipwac-primary); }
.stat-card .value { font-size: 1.8rem; font-weight: 600; }

.table td, .table th { vertical-align: middle; }
.json-cell { max-width: 320px; font-family: Consolas, monospace; font-size: .8rem; word-break: break-all; }

.login-box { max-width: 380px; margin: 8vh auto; }
.password-box { max-width: 440px; margin: 4vh auto; }

.password-rules li { color: #6c757d; padding-left: 1.4em; position: relative; }
.password-rules li::before { content: "○"; position: absolute; left: 0; }
.password-rules li.met { color: #198754; }
.password-rules li.met::before { content: "✓"; }

.btn:focus, .btn:active:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #b44;
}

@media (max-width: 767.98px) {
  .sidebar { min-height: auto; border-right: 0; border-bottom: 1px solid #e3e3e8; }
}
