/* cw-shared.css — shared visual language for /, /register and /admin */

body {
    background: radial-gradient(circle at top, #1c2331 0%, #0b0f17 70%);
    min-height: 100vh;
}

/* Centred-card layout used by index + register */
.cw-shell { max-width: 840px; }
.cw-card  { background: var(--bs-body-bg); border-radius: 1rem; }

/* Compact card header — icon next to title, vertically centred.
   Replaces the old full-width hero banner. */
.cw-header {
    display: flex; align-items: center; gap: 1rem;
    padding: 1rem 1.25rem;
    background: var(--bs-body-tertiary-bg, var(--bs-tertiary-bg));
    border-bottom: 1px solid var(--bs-border-color-translucent);
    border-radius: 1rem 1rem 0 0;
}
.cw-header.icon-right { flex-direction: row-reverse; text-align: right; }
.cw-header img {
    width: 56px; height: 56px; flex: 0 0 56px;
    border-radius: .5rem; object-fit: contain;
}
.cw-header .cw-title  { font-size: 1.25rem; font-weight: 600; line-height: 1.1; margin: 0; }
.cw-header .cw-sub    { font-size: .85rem; color: var(--bs-secondary-color); margin: .15rem 0 0 0; }

.cw-body  { padding: 1.5rem; }
.cw-cta   { min-width: 12rem; }

.cw-footer {
    background: var(--bs-tertiary-bg);
    color: var(--bs-secondary-color);
    font-size: .85rem;
    text-align: center;
    padding: .75rem 1rem;
    border-top: 1px solid var(--bs-border-color-translucent);
}
.cw-footer a { color: var(--bs-secondary-color); text-decoration: none; }
.cw-footer a:hover { color: var(--bs-body-color); }

/* Honeypot — used on the registration form */
.honeypot {
    position: absolute;
    left: -10000px; top: auto;
    width: 1px; height: 1px;
    overflow: hidden;
}

/* ---- Admin-only extensions (wider, dashboard look) ---- */

.cw-admin-shell { max-width: 1280px; padding-left: 1rem; padding-right: 1rem; }

.cw-navbar {
    background: var(--bs-body-tertiary-bg, var(--bs-tertiary-bg));
    border-bottom: 1px solid var(--bs-border-color-translucent);
}
.cw-navbar .navbar-brand img { height: 32px; width: auto; }

.stat-card .display-6 { font-weight: 600; }

.table code        { color: #7dd3fc; background: transparent; padding: 0; }
.status-pill       { font-size: .75rem; padding: .25em .55em; }
tr.revoked td      { color: #fda4af; }
tr.expired td      { color: #9ca3af; }
.sticky-header th  { position: sticky; top: 0; background: var(--bs-tertiary-bg); z-index: 1; }
.card-header       { font-weight: 500; }
.truncate-key      {
    max-width: 14rem; overflow: hidden; text-overflow: ellipsis;
    white-space: nowrap; display: inline-block; vertical-align: middle;
}
.key-cell          { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .85em; }
.copy-btn          { padding: 0 .35rem; }

/* Login page (admin) */
.cw-login-shell { display: flex; align-items: center; min-height: 100vh; }
.cw-login-shell .container { max-width: 420px; }
.cw-brand-img   { width: 96px; height: auto; opacity: .92; }

/* ---- Language switcher (NL | EN) — top-right of the card header ---- */
.cw-header .cw-lang-switch { margin-left: auto; align-self: flex-start; }
.cw-lang-switch {
    display: inline-flex; align-items: center; gap: .15rem;
    font-size: .8rem; font-weight: 600; line-height: 1;
}
.cw-lang {
    color: var(--bs-secondary-color);
    text-decoration: none;
    padding: .15rem .35rem;
    border-radius: .35rem;
}
.cw-lang:hover { color: var(--bs-body-color); }
.cw-lang-active {
    color: var(--bs-body-color);
    background: var(--bs-border-color-translucent);
}
.cw-lang-sep { color: var(--bs-secondary-color); opacity: .5; }