/* ========================================
   BADGES DE STATUT — VESTIAIRE PREMIUM
======================================== */

.vestiaire-status-badge {
    position: relative;
    width: fit-content;
    max-width: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 5px 9px;
    overflow: hidden;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: 0.61rem;
    font-weight: 900;
    letter-spacing: 0.055em;
    line-height: 1;
    text-transform: uppercase;
    white-space: nowrap;
    box-shadow: 0 7px 18px rgba(0, 0, 0, 0.16);
}

.vestiaire-status-badge::before {
    content: "";
    position: absolute;
    inset: 0;
    opacity: 0.42;
    pointer-events: none;
}

.vestiaire-status-badge > i,
.vestiaire-status-badge > span {
    position: relative;
    z-index: 1;
}

.vestiaire-status-badge > i {
    font-size: 0.72em;
}

.vestiaire-status-badge.is-admin {
    border-color: rgba(96, 165, 250, 0.32);
    background: rgba(37, 99, 235, 0.13);
    color: #bfdbfe;
}

.vestiaire-status-badge.is-admin::before {
    background: linear-gradient(110deg, rgba(96, 165, 250, 0.25), transparent 62%);
}

.vestiaire-status-badge.is-founder {
    border-color: rgba(192, 132, 252, 0.34);
    background: rgba(126, 34, 206, 0.14);
    color: #e9d5ff;
}

.vestiaire-status-badge.is-founder::before {
    background: linear-gradient(110deg, rgba(192, 132, 252, 0.28), transparent 62%);
}

.vestiaire-status-badge.is-founder-premium {
    border-color: rgba(250, 204, 21, 0.38);
    background: linear-gradient(115deg, rgba(161, 98, 7, 0.22), rgba(107, 33, 168, 0.19));
    color: #fef3c7;
}

.vestiaire-status-badge.is-founder-premium::before {
    background: linear-gradient(105deg, rgba(250, 204, 21, 0.3), rgba(192, 132, 252, 0.2), transparent 75%);
}

.vestiaire-status-badge.is-premium {
    border-color: rgba(250, 204, 21, 0.36);
    background: rgba(161, 98, 7, 0.17);
    color: #fde68a;
}

.vestiaire-status-badge.is-premium::before {
    background: linear-gradient(110deg, rgba(250, 204, 21, 0.28), transparent 65%);
}

.vestiaire-status-badge.is-compact {
    gap: 5px;
    padding: 4px 7px;
    font-size: 0.53rem;
}

.vestiaire-status-badge.is-profile {
    gap: 7px;
    padding: 7px 11px;
    font-size: 0.66rem;
}

@media screen and (max-width: 520px) {
    .vestiaire-status-badge {
        white-space: normal;
        text-align: center;
    }
}