/* Rarefolio Certificates — additive styling only
   Safe: does not override site-wide nav/footer styles. */

:root{
  --qd-cert-border: rgba(255,255,255,.10);
  --qd-cert-bg: rgba(255,255,255,.04);
  --qd-cert-bg2: rgba(0,0,0,.12);
}

#qd-cert-root{ width:100%; }
#qd-cert-status{ margin: 6px 0 12px; opacity: .9; }

.qd-cert-card{
  border: 1px solid var(--qd-cert-border);
  background: var(--qd-cert-bg);
  border-radius: 18px;
  padding: 16px;
}

.qd-cert-grid{
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 14px;
  align-items: start;
}
@media (max-width: 900px){
  .qd-cert-grid{ grid-template-columns: 1fr; }
}

.qd-cert-box{
  border: 1px solid var(--qd-cert-border);
  background: var(--qd-cert-bg2);
  border-radius: 16px;
  padding: 14px;
}

.qd-cert-kv{
  display:grid;
  grid-template-columns: 150px 1fr;
  gap: 8px 10px;
  font-size: 14px;
}
.qd-cert-kv .k{
  opacity:.70;
  font-weight: 800;
  letter-spacing:.02em;
}
.qd-cert-kv .v{
  font-weight: 800;
  word-break: break-word;
}

.qd-cert-actions{
  display:flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 12px;
}

.qd-cert-pill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid var(--qd-cert-border);
  background: rgba(255,255,255,.06);
  font-weight: 900;
  letter-spacing:.02em;
  font-size: 12px;
}

.qd-cert-pill.ok{ }
.qd-cert-pill.bad{ opacity:.95; }

.qd-cert-mono{
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: 12px;
  opacity: .9;
}