/* BlueMartWorld clone — custom styles */

/* ---- 7-position tree (spec §22) ---- */
.tree-7 { display: flex; flex-direction: column; gap: 18px; padding: 8px 4px; }
.tree-7 .tree-row { display: flex; justify-content: center; gap: 14px; flex-wrap: wrap; }
.tree-7 .tree-row.l1 { gap: 90px; }
.tree-7 .tree-row.l2 { gap: 26px; }
.tree-7 .tree-cell { display: flex; justify-content: center; }
.tree-node {
  display: inline-block;
  border: 1px solid #ced4da;
  border-radius: 10px;
  padding: 8px 12px;
  background: #fff;
  min-width: 140px;
  text-align: center;
  line-height: 1.35;
  text-decoration: none;
  color: inherit;
}
.tree-node strong { display: block; font-size: .9rem; }
.tree-node small { display: block; font-size: .72rem; color: #6c757d; }
.tree-node.active { border-color: #198754; background: #f0fdf4; }
.tree-node.inactive { border-color: #adb5bd; background: #f8f9fa; opacity: .8; }
.tree-node.blank { border-style: dashed; border-color: #0d6efd; background: #f0f6ff; cursor: pointer; }
.tree-node.blank:hover { background: #dbeafe; }

/* ---- responsive ---- */
@media (max-width: 768px) {
  .tree-7 .tree-row.l1 { gap: 12px; }
  .tree-node { min-width: 96px; padding: 6px 8px; }
}

/* ---- misc ---- */
.stat-card { border: 0; border-radius: 12px; color: #fff; }
.stat-card .card-title { font-size: .8rem; text-transform: uppercase; opacity: .85; }
.stat-card .card-text { font-size: 1.35rem; font-weight: 700; }

.table thead th { font-size: .78rem; text-transform: uppercase; letter-spacing: .03em; }