/* SecretGift V8.8.9 — Clients en petites cartes compactes et colorées */

.client-admin-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 9px !important;
    margin-top: 10px !important;
}

.client-admin-card {
    --client-bg: #e8e3dc;
    --client-border: #aa9c88;
    --client-text: #342d25;
    --client-muted: #70665a;
    --client-chip: rgba(255,255,255,.76);

    display: grid !important;
    grid-template-columns: 42px minmax(0, 1fr);
    grid-template-areas:
        "avatar identity"
        "avatar contact"
        "meta meta"
        "action action";
    gap: 5px 9px !important;
    align-items: center;
    min-width: 0;
    min-height: 0 !important;
    padding: 10px !important;
    border: 1px solid var(--client-border) !important;
    border-left: 7px solid var(--client-border) !important;
    border-radius: 11px !important;
    background: var(--client-bg) !important;
    color: var(--client-text) !important;
    box-shadow: 0 5px 12px rgba(35,28,20,.08) !important;
}

.client-admin-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 9px 17px rgba(35,28,20,.13) !important;
}

.client-admin-card__avatar {
    grid-area: avatar;
    display: grid !important;
    place-items: center;
    width: 42px !important;
    height: 42px !important;
    border-radius: 50% !important;
    background: var(--client-chip) !important;
    color: var(--client-text) !important;
    border: 1px solid rgba(0,0,0,.08) !important;
    font-size: .8rem !important;
    font-weight: 950 !important;
}

.client-admin-card__identity {
    grid-area: identity;
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 6px !important;
    min-width: 0;
}

.client-admin-card__identity h2 {
    margin: 0 !important;
    color: var(--client-text) !important;
    font-size: .93rem !important;
    line-height: 1.1 !important;
    overflow-wrap: anywhere;
}

.client-admin-card__contact {
    grid-area: contact;
    min-width: 0;
}

.client-admin-card__contact strong {
    display: block;
    color: var(--client-text) !important;
    font-size: .78rem !important;
    line-height: 1.15 !important;
    overflow-wrap: anywhere;
}

.client-admin-card__contact small {
    display: block;
    margin-top: 2px !important;
    color: var(--client-muted) !important;
    font-size: .7rem !important;
}

.client-admin-card__meta {
    grid-area: meta;
    display: flex !important;
    justify-content: space-between;
    gap: 8px !important;
    padding-top: 5px;
    border-top: 1px solid rgba(0,0,0,.08);
    color: var(--client-muted) !important;
    font-size: .68rem !important;
    line-height: 1.15 !important;
}

.client-admin-card__action {
    grid-area: action;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 6px !important;
    align-items: center;
    margin-top: 2px;
    min-width: 0;
}

.client-admin-card__action select {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 34px !important;
    height: 34px !important;
    padding: 5px 8px !important;
    border-radius: 8px !important;
    background: rgba(255,255,255,.82) !important;
    color: var(--client-text) !important;
    font-size: .75rem !important;
}

.client-admin-card__action button {
    min-height: 34px !important;
    height: 34px !important;
    padding: 5px 9px !important;
    border-radius: 8px !important;
    font-size: .72rem !important;
    white-space: nowrap;
}

.client-admin-card .badge {
    flex: 0 0 auto;
    min-height: 23px !important;
    padding: 4px 7px !important;
    border-radius: 999px !important;
    background: var(--client-chip) !important;
    color: var(--client-text) !important;
    border: 1px solid rgba(0,0,0,.08) !important;
    font-size: .65rem !important;
    font-weight: 900 !important;
}

/* ACTIF — toute la carte verte */
.client-admin-card.status-card--active {
    --client-bg: #b9e7ca;
    --client-border: #23864d;
    --client-text: #0b572e;
    --client-muted: #357252;
}

/* EN ATTENTE — toute la carte orange */
.client-admin-card.status-card--pending {
    --client-bg: #ffdda4;
    --client-border: #cf8118;
    --client-text: #693a00;
    --client-muted: #885d1c;
}

/* SUSPENDU — toute la carte rouge */
.client-admin-card.status-card--suspended {
    --client-bg: #f3cdd3;
    --client-border: #ac4150;
    --client-text: #771d2a;
    --client-muted: #94515c;
}

/* DÉSACTIVÉ — gris rouge foncé */
.client-admin-card.status-card--disabled {
    --client-bg: #ded7d7;
    --client-border: #76585d;
    --client-text: #4e3035;
    --client-muted: #735f63;
}

/* Recherche compacte */
body:has(.client-admin-grid) .filter-bar {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 7px !important;
    padding: 9px !important;
    border-radius: 10px !important;
}

body:has(.client-admin-grid) .filter-bar input,
body:has(.client-admin-grid) .filter-bar button {
    min-height: 36px !important;
    height: 36px !important;
}

@media (min-width: 1500px) {
    .client-admin-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 1150px) {
    .client-admin-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 650px) {
    .client-admin-grid {
        grid-template-columns: 1fr !important;
    }

    .client-admin-card {
        min-height: 0 !important;
    }
}