/* ─── Bannière CTA "Devenir Partenaire / Annonceur" ─────────────────────────
   Fichier : gi-packs/assets/css/gi-packs.css  (append à la fin)
   ─────────────────────────────────────────────────────────────────────────── */

.gi-upgrade-banner {
    margin: var(--gi-space-4) 0;
}

/* ── Version normale (guest / upgrade) ────────────────────────────────────── */
.gi-upgrade-banner__inner {
    position: relative;
    overflow: hidden;
    background: linear-gradient(160deg, #1e2a45 0%, #1a2235 60%, #1c2d4a 100%);
    border-radius: var(--gi-radius-xl);
    padding: var(--gi-space-6) var(--gi-space-6);
    text-align: center;
    min-height: 130px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--gi-space-3);
}

/* Lignes ondulées SVG */
.gi-upgrade-banner__inner::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: var(--gi-radius-xl);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='800' height='200' viewBox='0 0 800 200'%3E%3Cg fill='none' stroke='%234a6080' stroke-width='1.2' opacity='0.45'%3E%3Cpath d='M-50 140 Q200 80 400 120 Q600 160 850 90'/%3E%3Cpath d='M-50 152 Q200 92 400 132 Q600 172 850 102'/%3E%3Cpath d='M-50 164 Q200 104 400 144 Q600 184 850 114'/%3E%3Cpath d='M-50 176 Q200 116 400 156 Q600 196 850 126'/%3E%3Cpath d='M-50 128 Q200 68 400 108 Q600 148 850 78'/%3E%3Cpath d='M-50 116 Q200 56 400 96 Q600 136 850 66'/%3E%3Cpath d='M-50 104 Q200 44 400 84 Q600 124 850 54'/%3E%3Cpath d='M-50 188 Q200 128 400 168 Q600 208 850 138'/%3E%3C/g%3E%3C/svg%3E");
    background-size: cover;
    background-position: center bottom;
    pointer-events: none;
}

/* Étoiles décoratives */
.gi-upgrade-banner__deco {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.gi-upgrade-banner__star {
    position: absolute;
    color: var(--gi-cyan);
    font-size: 1.4rem;
    line-height: 1;
    opacity: 0.85;
}

.gi-upgrade-banner__star--left  { top: 50%; left: var(--gi-space-5);  transform: translateY(-50%); }
.gi-upgrade-banner__star--right { top: 50%; right: var(--gi-space-5); transform: translateY(-50%); }

/* Titre */
.gi-upgrade-banner__title {
    color: var(--gi-white);
    font-size: var(--gi-font-size-xl);
    font-weight: 700;
    line-height: 1.2;
    margin: 0;
    position: relative; /* au dessus des étoiles */
}

/* Sous-titre (mode upgrade uniquement) */
.gi-upgrade-banner__sub {
    color: rgba(255, 255, 255, 0.65);
    font-size: var(--gi-font-size-sm);
    margin: 0;
    position: relative;
}

/* Bouton CTA */
.gi-upgrade-banner__btn {
    display: inline-flex;
    align-items: center;
    gap: var(--gi-space-2);
    background: var(--gi-white);
    color: var(--gi-dark);
    font-family: var(--gi-font);
    font-size: var(--gi-font-size-md);
    font-weight: 700;
    padding: var(--gi-space-3) var(--gi-space-6);
    border-radius: var(--gi-radius-full);
    text-decoration: none;
    transition: var(--gi-transition-fast);
    position: relative;
    white-space: nowrap;
}

.gi-upgrade-banner__btn:hover,
.gi-upgrade-banner__btn:focus-visible {
    background: var(--gi-cyan);
    color: var(--gi-dark);
    text-decoration: none;
    transform: translateY(-1px);
    box-shadow: var(--gi-shadow-cyan);
}

/* ── Version "pending" ─────────────────────────────────────────────────────── */
.gi-upgrade-banner__pending {
    display: flex;
    align-items: center;
    gap: var(--gi-space-3);
    background: rgba(243, 156, 18, 0.10);
    border: 1px solid rgba(243, 156, 18, 0.30);
    border-radius: var(--gi-radius-lg);
    padding: var(--gi-space-4) var(--gi-space-5);
}

.gi-upgrade-banner__pending-icon {
    font-size: 1.5rem;
    flex-shrink: 0;
    line-height: 1;
}

.gi-upgrade-banner__pending-title {
    color: var(--gi-warning);
    font-weight: 700;
    font-size: var(--gi-font-size-md);
    margin: 0 0 var(--gi-space-1) 0;
    text-transform: capitalize;
}

.gi-upgrade-banner__pending-sub {
    color: var(--gi-grey-500);
    font-size: var(--gi-font-size-sm);
    margin: 0;
}

/* ── Variante "actif" — compte déjà activé, lien vers dashboard ────────────── */
.gi-upgrade-banner--active .gi-upgrade-banner__inner {
    background: linear-gradient(160deg, #1a2d45 0%, #162338 60%, #1c3050 100%);
    border: 1.5px solid rgba(87, 225, 255, 0.20);
}

.gi-upgrade-banner--active .gi-upgrade-banner__btn {
    background: var(--gi-cyan);
    color: var(--gi-dark);
}

.gi-upgrade-banner--active .gi-upgrade-banner__btn:hover,
.gi-upgrade-banner--active .gi-upgrade-banner__btn:focus-visible {
    background: var(--gi-white);
    color: var(--gi-dark);
}