/* Step 197 - Marketing Banner Manager public/admin polish */
.marketing-top-banner {
    margin: 0 0 .85rem;
    border: 1px solid rgba(241, 196, 75, .28);
    border-radius: 20px;
    background: linear-gradient(135deg, rgba(241,196,75,.18), rgba(16,36,88,.95));
    box-shadow: 0 20px 45px rgba(0, 0, 0, .22);
    overflow: hidden;
}

.marketing-top-banner-inner {
    display: flex;
    align-items: center;
    gap: .8rem;
    padding: .75rem .95rem;
}

.marketing-top-badge {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .42rem .7rem;
    border-radius: 999px;
    background: rgba(241, 196, 75, .95);
    color: #1a1a1a;
    font-weight: 900;
    font-size: .78rem;
    white-space: nowrap;
}

.marketing-top-copy {
    flex: 1;
    min-width: 0;
    display: grid;
    gap: .12rem;
}

.marketing-top-copy strong {
    color: var(--text, #eef4ff);
    font-weight: 900;
    line-height: 1.25;
}

.marketing-top-copy span {
    color: var(--muted, #9db0dd);
    line-height: 1.35;
    font-size: .92rem;
}

.marketing-top-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 36px;
    padding: .52rem .8rem;
    border-radius: 999px;
    background: var(--accent, #f1c44b);
    color: var(--accent-text, #1a1a1a);
    font-weight: 900;
    text-decoration: none;
    white-space: nowrap;
}

.marketing-dismiss,
.marketing-popup-close {
    border: 0;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.marketing-dismiss {
    width: 34px;
    height: 34px;
    border-radius: 999px;
    background: rgba(255,255,255,.08);
    color: var(--text, #eef4ff);
    flex: 0 0 auto;
}

.marketing-dismiss:hover,
.marketing-popup-close:hover {
    background: rgba(255,255,255,.16);
}

.marketing-popup-overlay {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: grid;
    place-items: center;
    padding: 1rem;
    background: rgba(3, 8, 24, .72);
    backdrop-filter: blur(6px);
}

.marketing-popup-overlay[hidden] {
    display: none !important;
}

.marketing-popup-card {
    width: min(520px, 100%);
    position: relative;
    border: 1px solid rgba(241, 196, 75, .28);
    border-radius: 28px;
    padding: 1.35rem;
    background: linear-gradient(145deg, rgba(16,36,88,.98), rgba(8,19,48,.98));
    box-shadow: 0 35px 80px rgba(0,0,0,.42);
}

.marketing-popup-card h2 {
    margin: .35rem 0 .55rem;
    color: var(--text, #eef4ff);
    font-size: clamp(1.45rem, 3vw, 2.05rem);
    line-height: 1.08;
}

.marketing-popup-card p {
    color: var(--muted, #9db0dd);
    line-height: 1.6;
    margin-bottom: 1rem;
}

.marketing-popup-close {
    position: absolute;
    top: .9rem;
    right: .9rem;
    width: 36px;
    height: 36px;
    border-radius: 999px;
    background: rgba(255,255,255,.08);
    color: var(--text, #eef4ff);
}

.marketing-popup-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .65rem;
}

.step197-home-campaign-strip {
    align-items: stretch;
}

.step197-home-campaign-card {
    min-height: 100%;
}

.step197-banner-type-guide {
    align-items: stretch;
}

.step197-banner-guide-card {
    display: grid;
    gap: .55rem;
    align-content: start;
}

.step197-banner-guide-card > i {
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 14px;
    background: rgba(241, 196, 75, .16);
    color: var(--accent, #f1c44b);
    font-size: 1.25rem;
}

.step197-banner-guide-card h3,
.step197-safe-rules-card h3 {
    margin: 0;
}

.step197-banner-guide-card p {
    color: var(--muted, #9db0dd);
    line-height: 1.55;
}

.step197-growth-grid {
    align-items: start;
}

.step197-rule-list {
    display: grid;
    gap: .75rem;
}

.step197-rule-list div {
    display: grid;
    gap: .15rem;
    padding: .85rem;
    border: 1px solid var(--border, rgba(255,255,255,.08));
    border-radius: 16px;
    background: rgba(255,255,255,.035);
}

.step197-rule-list strong {
    color: var(--text, #eef4ff);
}

.step197-rule-list span {
    color: var(--muted, #9db0dd);
    line-height: 1.45;
}

.step197-campaign-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
    min-width: 180px;
}

.step197-campaign-actions .btn {
    min-width: 74px;
    justify-content: center;
}

@media (max-width: 760px) {
    .marketing-top-banner-inner {
        display: grid;
        grid-template-columns: 1fr auto;
        gap: .55rem;
    }

    .marketing-top-badge,
    .marketing-top-copy,
    .marketing-top-cta {
        grid-column: 1 / -1;
    }

    .marketing-dismiss {
        grid-column: 2;
        grid-row: 1;
        justify-self: end;
    }

    .marketing-top-cta,
    .marketing-popup-actions .btn,
    .marketing-popup-actions a.btn {
        width: 100%;
    }

    .marketing-popup-card {
        padding: 1.15rem;
        border-radius: 22px;
    }

    .step197-campaign-actions {
        min-width: 0;
    }
}
