/* medicodera public code browser — minimal overrides on Bootstrap 5 */

/* ── Brand ────────────────────────────────────────────────────────────────── */

:root {
  --brand-blue: #1a6bb5;
  --brand-blue-dark: #145594;
  --brand-blue-light: #e8f1fb;
}

.bg-brand {
  background-color: var(--brand-blue) !important;
}

.btn-primary {
  background-color: var(--brand-blue);
  border-color: var(--brand-blue);
}
.btn-primary:hover,
.btn-primary:focus {
  background-color: var(--brand-blue-dark);
  border-color: var(--brand-blue-dark);
}
.btn-outline-primary {
  color: var(--brand-blue);
  border-color: var(--brand-blue);
}
.btn-outline-primary:hover {
  background-color: var(--brand-blue);
  border-color: var(--brand-blue);
}
a { color: var(--brand-blue); }
a:hover { color: var(--brand-blue-dark); }


/* ── Code display ─────────────────────────────────────────────────────────── */

.code-display {
  font-family: "SFMono-Regular", Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size: 1.75rem;
  font-weight: 700;
  color: #1a1a2e;
  letter-spacing: 0.05em;
}

.code-badge {
  display: inline-block;
  padding: 0.1em 0.45em;
  font-family: "SFMono-Regular", Menlo, Monaco, Consolas, monospace;
  font-size: 0.82rem;
  font-weight: 600;
  background: var(--brand-blue-light);
  color: var(--brand-blue);
  border: 1px solid #c2d8f0;
  border-radius: 4px;
  white-space: nowrap;
}
a .code-badge:hover {
  background: var(--brand-blue);
  color: #fff;
  border-color: var(--brand-blue);
}

/* ── Chapter / section number bubble ─────────────────────────────────────── */

.chapter-num {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  min-width: 2rem;
  border-radius: 50%;
  background: var(--brand-blue-light);
  color: var(--brand-blue);
  font-weight: 700;
  font-size: 0.8rem;
}

/* ── Cards ────────────────────────────────────────────────────────────────── */

.card-hover {
  transition: box-shadow 0.15s ease, transform 0.1s ease;
}
.card-hover:hover {
  box-shadow: 0 4px 16px rgba(26,107,181,0.14) !important;
  transform: translateY(-1px);
}

/* ── Note type alerts ─────────────────────────────────────────────────────── */

.note-block {
  border-left: 4px solid;
  border-radius: 4px;
  margin-bottom: 0.75rem;
}
.note-block.alert-info    { border-left-color: #0dcaf0; }
.note-block.alert-danger  { border-left-color: #dc3545; }
.note-block.alert-warning { border-left-color: #ffc107; }
.note-block.alert-success { border-left-color: #198754; }
.note-block.alert-primary { border-left-color: #0d6efd; }
.note-block.alert-secondary { border-left-color: #6c757d; }
.note-block.alert-light   { border-left-color: #ced4da; }

/* ── Child code rows ──────────────────────────────────────────────────────── */

.child-row {
  transition: background 0.1s;
}
.child-row:hover {
  background: var(--brand-blue-light);
}

/* ── Coverage card ────────────────────────────────────────────────────────── */

.coverage-card {
  border-width: 2px !important;
}

/* ── System badges on search results ─────────────────────────────────────── */

.badge-icd10cm {
  background-color: #d0e8ff;
  color: #0a4a8f;
}
.badge-icd10pcs {
  background-color: #d3f0e8;
  color: #0a5a3a;
}
.badge-hcpcs {
  background-color: #fff3cd;
  color: #7a5a00;
}

/* ── PCS 7-char breakdown table ───────────────────────────────────────────── */

.code-breakdown-table th,
.code-breakdown-table td {
  padding: 0.6rem 0.5rem;
}

.code-char-box {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.2rem;
  height: 2.2rem;
  background: var(--brand-blue-light);
  border: 2px solid var(--brand-blue);
  border-radius: 6px;
  font-family: monospace;
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--brand-blue);
}

/* ── Search bar in navbar ─────────────────────────────────────────────────── */

.nav-search-form {
  width: 100%;
  max-width: 480px;
}
.search-input {
  min-width: 0;   /* allow flex shrink */
}
.system-select {
  max-width: 120px;
  flex-shrink: 0;
}

/* ── Footer ───────────────────────────────────────────────────────────────── */

.footer {
  font-size: 0.82rem;
}

/* ── Responsive tweaks ────────────────────────────────────────────────────── */

@media (max-width: 991.98px) {
  /* When navbar is collapsed, search takes full width */
  .nav-search-form {
    max-width: 100%;
  }
}

@media (max-width: 575.98px) {
  .code-display { font-size: 1.3rem; }
  /* On tiny screens, child code grid stays single column */
  .row-cols-1 > .col { flex: 0 0 100%; max-width: 100%; }
}

@media (max-width: 768px) {
  .code-display { font-size: 1.4rem; }
  /* Coverage card rows become single column */
  .coverage-card .row-cols-md-2 > .col {
    flex: 0 0 100%;
    max-width: 100%;
  }
}

/* ── Chapter navigation strip ────────────────────────────────────────────── */

.chapter-nav-strip {
  scrollbar-width: thin;
  scrollbar-color: #dee2e6 transparent;
}
.chapter-nav-strip::-webkit-scrollbar { height: 4px; }
.chapter-nav-strip::-webkit-scrollbar-track { background: transparent; }
.chapter-nav-strip::-webkit-scrollbar-thumb { background: #dee2e6; border-radius: 2px; }

.chapter-nav-active {
  background: var(--brand-blue) !important;
  color: #fff !important;
}

/* ── Revision history (details/summary, no JS needed) ────────────────────── */

.rev-history-list { border: 1px solid #dee2e6; border-radius: 6px; overflow: hidden; }
.rev-history-item { border-bottom: 1px solid #dee2e6; }
.rev-history-item:last-child { border-bottom: none; }
.rev-history-summary {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 0.75rem;
  cursor: pointer;
  list-style: none;
  background: #f8f9fa;
  user-select: none;
}
.rev-history-summary::-webkit-details-marker { display: none; }
.rev-history-summary::after {
  content: "\F282";  /* bi-chevron-down */
  font-family: "bootstrap-icons";
  margin-left: auto;
  font-size: 0.8rem;
  color: #6c757d;
  transition: transform 0.15s;
}
details[open] > .rev-history-summary { background: var(--brand-blue-light); }
details[open] > .rev-history-summary::after { transform: rotate(180deg); }
.rev-history-body { padding: 0.5rem 0.75rem; background: #fff; }

/* ── Xref table ───────────────────────────────────────────────────────────── */

.xref-table td { vertical-align: middle; }
.xref-table td:last-child { max-width: 480px; }

/* ── Pro gate (paywall teaser) ────────────────────────────────────────────── */

.pro-gate-overlay {
  position: absolute;
  inset: 0;
  background: rgba(248, 250, 252, 0.92);
  backdrop-filter: blur(1px);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
  text-align: center;
  z-index: 5;
  border-radius: 0 0 var(--bs-border-radius) var(--bs-border-radius);
}
.pro-gate-blur {
  filter: blur(3px);
  pointer-events: none;
  user-select: none;
}