/* ════════════════════════════════════════════════════════════
   onlytap – schmale Kopfleiste
   Für Seiten, auf denen die volle Navigation nur ablenken würde:
   Checkout, Design Studio. Eine Quelle für beide, damit sie nicht
   auseinanderlaufen.
   ════════════════════════════════════════════════════════════ */
.co-topbar {
  background: #fff; border-bottom: 1px solid var(--tile-border);
  position: sticky; top: 0; z-index: 20;
}
.co-topbar-in {
  max-width: 1180px; margin: 0 auto; padding: 0 24px; height: 64px;
  display: flex; align-items: center; gap: 16px;
}
.co-topbar .logo-img { height: 26px; }
.co-back {
  display: inline-flex; align-items: center; gap: 7px;
  font-size: 14px; font-weight: 700; color: var(--ink-soft);
  text-decoration: none;
}
.co-back:hover { color: var(--blue); }
.co-back svg { width: 17px; height: 17px; }
.co-secure {
  margin-left: auto; display: inline-flex; align-items: center; gap: 7px;
  font-size: 13px; font-weight: 700; color: var(--ink);
}
.co-secure svg { width: 16px; height: 16px; }
.co-secure .co-lock { height: 17px; width: auto; display: block; }

/* Warenkorb in der schmalen Leiste (Design Studio): der einzige Weg zum
   Korb, wenn die große Navigation fehlt. */
.co-cart {
  display: inline-flex; align-items: center; gap: 8px; position: relative;
  background: none; border: none; cursor: pointer; padding: 8px 4px 8px 10px;
  color: var(--ink); font: inherit; font-size: 13px; font-weight: 700;
}
.co-cart:hover { color: var(--blue); }
.co-cart svg { width: 19px; height: 19px; }
/* header.js blendet den Zähler über die Klasse .show ein, sobald etwas
   im Korb liegt – deshalb hier nicht über [hidden] steuern. */
.co-cart-zahl {
  position: static; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px;
  background: var(--blue); color: #fff; font-size: 11px; font-weight: 800;
  display: none; align-items: center; justify-content: center;
}
.co-cart-zahl.show { display: inline-flex; }

@media (max-width: 520px) {
  .co-topbar-in { padding: 0 16px; }
  .co-secure-text { display: none; }
}
