/* HeBi Support v1.0 — end-of-post support panel and affiliate disclosure.
   Only ever loaded on single posts (see hebi-support.php). */

/* ============================== */
/* 1. Support panel               */
/* ============================== */
.hebi-support {
    margin: 3rem 0 1rem;
    padding: 18px 20px 20px;
    background: #0a0a0a;
    border: 1px solid rgba(255, 0, 51, 0.3);
    border-radius: 2px;
    box-shadow: 0 0 24px rgba(255, 0, 51, 0.06), inset 0 0 24px rgba(0, 0, 0, 0.4);
    font-family: 'Geist Mono', 'Courier New', monospace;
}

.hebi-support-prompt {
    display: flex;
    align-items: center;
    gap: 2px;
    font-size: 0.9rem;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(255, 0, 51, 0.12);
}

.hebi-support-user   { color: #00ff41; font-weight: 700; }
.hebi-support-sep    { color: rgba(224, 224, 224, 0.5); }
.hebi-support-path   { color: #ff0033; font-weight: 700; }
.hebi-support-dollar { color: rgba(224, 224, 224, 0.6); margin: 0 8px 0 2px; }
.hebi-support-cmd    { color: rgba(224, 224, 224, 0.75); }

.hebi-support-blurb {
    margin: 14px 0 16px !important;
    color: rgba(224, 224, 224, 0.6) !important;
    font-size: 0.9rem;
    line-height: 1.7;
}

/* ============================== */
/* 2. Action chips                */
/* ============================== */
.hebi-support-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

/* Each chip is a two-line block, so min-width keeps the note from wrapping
   into a ragged column on mid-width screens. flex:1 lets them share the row
   evenly however many are configured — the sponsor entry ships empty, so
   this has to look right with two chips as well as three. */
.hebi-support-chip {
    flex: 1 1 200px;
    min-width: 200px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    padding: 11px 14px;
    border: 1px solid rgba(0, 255, 65, 0.35);
    background: rgba(0, 255, 65, 0.04);
    text-decoration: none !important;
    transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
}

.hebi-support-label {
    color: #00ff41;
    font-size: 0.86rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.hebi-support-label::before {
    content: "> ";
    opacity: 0.6;
}

.hebi-support-note {
    color: rgba(224, 224, 224, 0.45);
    font-size: 0.78rem;
    letter-spacing: 0.04em;
}

.hebi-support-chip:hover,
.hebi-support-chip:focus-visible {
    border-color: rgba(255, 0, 51, 0.6);
    background: rgba(255, 0, 51, 0.06);
    box-shadow: 0 0 16px rgba(255, 0, 51, 0.18);
}

.hebi-support-chip:hover .hebi-support-label,
.hebi-support-chip:focus-visible .hebi-support-label {
    color: #ff0033;
}

/* ============================== */
/* 3. Affiliate disclosure        */
/* ============================== */

/* Sits above the post body. Deliberately quiet — it is a legal/ethical
   notice, not a promotion — but still meets contrast on the dark ground. */
.hebi-disclosure {
    margin: 0 0 2rem !important;
    padding: 10px 14px;
    background: rgba(255, 0, 51, 0.04);
    border-left: 2px solid rgba(255, 0, 51, 0.45);
    color: rgba(224, 224, 224, 0.6) !important;
    font-family: 'Geist Mono', 'Courier New', monospace;
    font-size: 0.82rem !important;
    line-height: 1.65;
}

.hebi-disclosure-tag {
    display: block;
    margin-bottom: 3px;
    color: #ff0033;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

/* ============================== */
/* 4. Responsive                  */
/* ============================== */
@media (max-width: 600px) {
    .hebi-support {
        padding: 14px 15px 16px;
        margin-top: 2.25rem;
    }
    .hebi-support-prompt {
        flex-wrap: wrap;
        font-size: 0.85rem;
    }
    .hebi-support-chip {
        flex: 1 1 100%;
        min-width: 0;
    }
}

/* ============================== */
/* 5. Reduced motion              */
/* ============================== */
@media (prefers-reduced-motion: reduce) {
    .hebi-support-chip {
        transition: none !important;
    }
}