/* =============================================================================
 * activation.css — license/activation block presentation overrides
 * [claude:opus-4.8-1m][client:2.1.170][hurc:v0.10.1]
 *
 * PURPOSE
 *   Small, token-clean presentation layer for the shared license-activation
 *   block (neural.license.activation-block), loaded by that layout via
 *   $doc->addStyleSheet AFTER templates/nllm/css/hikashop-checkout.css so these
 *   rules win on equal specificity. Two jobs:
 *     1. Right-size the license-key + CLI copy fields (they were forced to an
 *        ~88px min-height by hikashop-checkout.css and looked oversized).
 *     2. Lightly lay out the "pick ONE" activation alternatives (lead, the
 *        per-method blocks, and the "or" dividers) so they read as a choice,
 *        not a sequence of required steps.
 *
 * WHY A SEPARATE FILE (not an edit to hikashop-checkout.css)
 *   hikashop-checkout.css carries a large body of pre-existing design-token
 *   debt that the stylelint gate enforces file-wide; a small edit there is
 *   blocked until that debt is migrated. This file is authored token-clean from
 *   the start, so it passes the gate on its own. Only `--nllm-space-sm` (a
 *   confirmed token already used across the checkout CSS) is referenced;
 *   everything else uses non-tokenised, un-gated properties (min-height,
 *   display, text-align, opacity).
 *
 * MOBILE-FIRST
 *   These are layout-neutral spacing/sizing rules that hold from 320px up; no
 *   breakpoints are needed (the block is a single column on every viewport).
 * ========================================================================== */

/* orders.css — HikaShop dark-theme overrides (hk-card, dropdowns, icon colour).
 * Loaded here because index.php cannot be modified (enforce wall). */
@import url('./orders.css');

/* --- 1. Copy fields — right-sized -----------------------------------------
 * min-height (not padding/margin) is the controlling dimension; dropping it
 * from 5.5rem lets the `rows` attribute + content decide the real height. The
 * key wraps in ~two lines; the single-line `pc activate …` command fits in one.
 * resize:vertical (inherited) still lets a user grow it. */
.neural-thanks__key {
    min-height: 2.5rem;
}

/* Tighter variant for the in-card key + CLI fields, which sit beside their Copy
 * button. These are COPY TARGETS (the button copies the full value), so keep
 * them to ONE compact line that scrolls horizontally rather than wrapping +
 * clipping a second line on narrow mobile widths (QA DEF-1: the
 * `pc activate …` command was cut off at 320/375px). Fixed height overrides the
 * textarea `rows` so there is never an empty trailing row. */
.neural-thanks__key--compact {
    height: 2.5rem;
    min-height: 2.5rem;
    white-space: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
}

/* --- 2. "Pick ONE" activation alternatives --------------------------------
 * Lead line introducing the choice. */
.neural-thanks__methods-lead {
    margin-bottom: var(--nllm-space-sm);
}

/* Each alternative (one-click / paste key / terminal) is a stacked block with
 * breathing room between it and the next. */
.neural-thanks__method {
    margin-bottom: var(--nllm-space-sm);
}

/* The label that names each alternative ("One-click", "Paste your key",
 * "Terminal"); block so it sits above the control it introduces. */
.neural-thanks__method-label {
    display: block;
    margin-bottom: var(--nllm-space-sm);
}

/* The short note under each method. */
.neural-thanks__method-note {
    margin-bottom: var(--nllm-space-sm);
}

/* The "or" divider that makes the alternatives unmistakably exclusive. Centered
 * and de-emphasised so it separates rather than competes. opacity:0.6 (never 0)
 * keeps it visible — no visibility trap. */
.neural-thanks__method-or {
    display: block;
    text-align: center;
    margin: var(--nllm-space-sm) 0;
    opacity: 0.6;
}

/* The "easiest" tag beside the one-click label. Relies on the single HTML space
 * for separation — the previous margin doubled that space into a gap that read
 * as a broken/empty placeholder (QA DEF-3). Slightly de-emphasised. */
.neural-thanks__method-tag {
    margin-left: 0;
    opacity: 0.85;
}

/* QA DEF-2: the meta grid inherits a fixed ~3×151px column layout from
 * hikashop-checkout.css that is too narrow for product codes like
 * NLLM_TRIAL_MONTHLY (~168px), forcing a mid-token break at ≤600px. The real fix
 * is the COLUMN sizing, not the wrap mode. Mobile-first: stack to ONE column so
 * each label/value pair gets full width and the code can't break; then restore a
 * multi-column row at ≥40rem with columns wide enough (≥11rem) to hold the code.
 * overflow-wrap stays as a final guard for any pathologically long value. */
.neural-thanks__meta-grid {
    grid-template-columns: 1fr;
}

@media (min-width: 40rem) {
    .neural-thanks__meta-grid {
        grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
    }
}

.neural-thanks__meta-grid dd,
.neural-thanks__meta-grid code {
    overflow-wrap: anywhere;
}

/* --- 3. Install-channels block (Step 1) ------------------------------------
 * The reusable neural.download.channels layout is embedded in Step 1 as the
 * "install another way" path (Marketplace / Open VSX / .vsix). It carries its
 * own presentation (channels.css); here we only separate its intro line and the
 * block itself from the license-linked download above it. --nllm-space-sm is the
 * confirmed spacing token already used throughout this file. */
.neural-thanks__channels {
    margin-top: var(--nllm-space-sm);
}

.neural-thanks__channels-lead {
    margin-bottom: var(--nllm-space-sm);
}