/* ── cosy.marketing QR Tool — Custom Styles ─────────────────────────────── */

:root {
  --brand:       #3BAA35;   /* cosy green */
  --brand-light: #45C23E;
  --brand-rgb:   59, 170, 53;
}

/* ── Brand colour utilities ────────────────────────────────────────────── */
.bg-brand     { background-color: var(--brand) !important; }
.text-brand   { color: var(--brand) !important; }
.btn-brand {
  background-color: var(--brand);
  border-color:     var(--brand);
  color:            #fff;
}
.btn-brand:hover,
.btn-brand:focus {
  background-color: var(--brand-light);
  border-color:     var(--brand-light);
  color:            #fff;
}
.badge.bg-brand { background-color: var(--brand) !important; }

/* ── Body ──────────────────────────────────────────────────────────────── */
body {
  background-color: #f5f9f5;
  font-family: "Inter", system-ui, -apple-system, sans-serif;
}

/* ── Navbar logo ──────────────────────────────────────────────────────── */
.navbar-logo {
  height: 32px;
  width: auto;
  margin-right: 8px;
  border-radius: 4px;
}

/* ── Navbar ────────────────────────────────────────────────────────────── */
.navbar-brand {
  letter-spacing: .5px;
  font-size: 1.1rem;
}

/* ── Card polish ───────────────────────────────────────────────────────── */
.card {
  border-radius: 12px;
}
.card-header {
  border-radius: 12px 12px 0 0 !important;
}

/* ── QR Preview ────────────────────────────────────────────────────────── */
.qr-preview {
  max-width: 200px;
  border-radius: 8px;
  padding: 8px;
  background: #fff;
}

/* ── Table row hover cursor ────────────────────────────────────────────── */
.table-hover tbody tr {
  transition: background-color .12s;
}

/* ── Links table destination truncation ────────────────────────────────── */
.text-truncate { max-width: 100%; }

/* ── Sidebar active state ──────────────────────────────────────────────── */
.list-group-item.active,
.link-sidebar-item.active {
  background-color: rgba(var(--brand-rgb), .08);
  border-left: 3px solid var(--brand);
  color: var(--brand);
}
.link-sidebar-item.active .text-brand { color: var(--brand) !important; }

/* ── Stat cards ────────────────────────────────────────────────────────── */
#statCards .card { border-radius: 12px; }
#statCards .display-6 { font-size: 2rem; }

/* ── Font mono override ────────────────────────────────────────────────── */
.font-monospace { font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace; }

/* ── Responsive tweaks ─────────────────────────────────────────────────── */
@media (max-width: 576px) {
  .qr-preview { max-width: 160px; }
  #statCards .display-6 { font-size: 1.5rem; }
}

/* ── Product QR grid cards ─────────────────────────────────────────────── */
.product-card .qr-thumb {
  max-width: 140px;
  width: 100%;
  margin: 0 auto;
  display: block;
  border-radius: 8px;
  padding: 4px;
  background: #fff;
}

.product-card h6 {
  font-size: .85rem;
}

/* ── Links table compact layout ────────────────────────────────────────── */
.link-table th,
.link-table td {
  font-size: .85rem;
  padding: .5rem .75rem;
  white-space: nowrap;
}
.link-table td.text-muted.small {
  font-size: .8rem;
}
.link-table .text-truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}