/*
 * Header app-download badge (replaces the legacy appid2.png).
 * Desktop = scan-to-get QR; mobile = tap-to-install button(s).
 * Loaded site-wide. Colors assume the dark header top bar (#383d40) — and
 * stay legible during the Evil Dead takeover (fiery-dark bar) too.
 */

.kvik-app {
    display: flex;
    align-items: center;
    font-family: "Open Sans", Arial, sans-serif;
}

/* ── Desktop: scan-to-get ───────────────────────────────────────── */
.kvik-app__scan {
    display: inline-flex;
    align-items: center;
    gap: 11px;
    text-decoration: none;
    padding: 4px;
    border-radius: 10px;
    transition: background .15s ease;
}
.kvik-app__scan:hover { background: rgba(255, 255, 255, .07); }

.kvik-app__qr {
    flex: 0 0 auto;
    display: block;
    width: 66px;
    height: 66px;
    background: #fff;
    border-radius: 9px;
    padding: 5px;
    box-shadow: 0 2px 7px rgba(0, 0, 0, .28);
}
.kvik-app__qr img { display: block; width: 100%; height: 100%; }

.kvik-app__text { display: flex; flex-direction: column; line-height: 1.25; }
.kvik-app__title {
    font-weight: 800;
    font-size: .92rem;
    color: #fff;
    letter-spacing: .01em;
}
.kvik-app__hint { font-size: .72rem; color: rgba(255, 255, 255, .82); margin-top: 2px; }
.kvik-app__sub {
    font-size: .62rem;
    text-transform: uppercase;
    letter-spacing: .09em;
    color: rgba(255, 255, 255, .55);
    margin-top: 3px;
}

/* Mobile store buttons hidden on desktop */
.kvik-app__stores { display: none; }

/* ── Mobile: tap-to-install ─────────────────────────────────────── */
@media (max-width: 768px) {
    .kvik-app__scan { display: none; }
    .kvik-app__stores { display: flex; gap: 7px; flex-wrap: wrap; align-items: center; }
    .kvik-app__store {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        padding: 8px 13px;
        border-radius: 8px;
        background: #000;
        color: #fff;
        text-decoration: none;
        font-size: .8rem;
        font-weight: 700;
        line-height: 1;
    }
    .kvik-app__store svg { width: 15px; height: 15px; fill: currentColor; flex: 0 0 auto; }
}