/* =========================================================
   CDV EXACT REPLAY CARD STYLE V1
   Les cartes supérieures utilisent exactement
   la surface des cartes replay inférieures.
========================================================= */

/* ---------------------------------------------------------
   SURFACE PRINCIPALE IDENTIQUE
--------------------------------------------------------- */

.player-v2 .player-v2-grid .pv-card {
    position: relative !important;
    isolation: isolate !important;
    overflow: hidden !important;

    border:
        1px solid
        rgba(235, 220, 184, .09)
        !important;

    border-radius:
        16px
        !important;

    background:
        linear-gradient(
            145deg,
            rgba(21, 22, 36, .93),
            rgba(10, 12, 24, .94)
        )
        !important;

    box-shadow:
        inset 0 1px 0
        rgba(255, 255, 255, .035),

        0 16px 35px
        rgba(0, 0, 0, .20)
        !important;

    -webkit-backdrop-filter:
        blur(18px)
        saturate(115%)
        !important;

    backdrop-filter:
        blur(18px)
        saturate(115%)
        !important;

    transition:
        transform .25s ease,
        border-color .25s ease,
        box-shadow .25s ease,
        background .25s ease
        !important;
}


/* ---------------------------------------------------------
   LUMIÈRE INTERNE IDENTIQUE
--------------------------------------------------------- */

.player-v2 .player-v2-grid .pv-card::before {
    content: "" !important;

    position: absolute !important;
    z-index: -1 !important;

    inset: auto !important;

    top: -145px !important;
    right: -105px !important;
    left: auto !important;
    bottom: auto !important;

    width: 230px !important;
    height: 230px !important;

    border-radius: 50% !important;

    pointer-events: none !important;

    background:
        rgba(133, 96, 255, .08)
        !important;

    filter:
        blur(35px)
        !important;

    opacity: 1 !important;

    transform: none !important;

    transition:
        opacity .3s ease,
        transform .35s ease
        !important;
}


/* ---------------------------------------------------------
   REFLET SUPÉRIEUR IDENTIQUE
--------------------------------------------------------- */

.player-v2 .player-v2-grid .pv-card::after {
    content: "" !important;

    position: absolute !important;
    z-index: 0 !important;

    top: 0 !important;
    left: 10% !important;
    right: 10% !important;
    bottom: auto !important;

    width: auto !important;
    height: 1px !important;

    pointer-events: none !important;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(213, 197, 255, .34),
            rgba(239, 199, 123, .18),
            transparent
        )
        !important;

    opacity: .72 !important;
}


/* Le contenu reste au-dessus des effets */

.player-v2 .player-v2-grid .pv-card > * {
    position: relative;
    z-index: 1;
}


/* ---------------------------------------------------------
   SURVOL IDENTIQUE AUX CARTES DU BAS
--------------------------------------------------------- */

.player-v2 .player-v2-grid .pv-card:hover {
    transform:
        translateY(-3px)
        !important;

    border-color:
        rgba(160, 134, 255, .22)
        !important;

    background:
        linear-gradient(
            145deg,
            rgba(23, 23, 40, .95),
            rgba(11, 13, 27, .96)
        )
        !important;

    box-shadow:
        inset 0 1px 0
        rgba(255, 255, 255, .05),

        0 21px 43px
        rgba(0, 0, 0, .26),

        0 0 24px
        rgba(112, 78, 255, .045)
        !important;
}

.player-v2 .player-v2-grid .pv-card:hover::before {
    opacity: 1 !important;

    transform:
        translate(-12px, 10px)
        scale(1.08)
        !important;
}


/* ---------------------------------------------------------
   SOUS-VIGNETTES INTERNES
--------------------------------------------------------- */

.player-v2 .pv-record-stat {
    border:
        1px solid
        rgba(192, 174, 240, .085)
        !important;

    border-radius:
        11px
        !important;

    background:
        linear-gradient(
            135deg,
            rgba(255, 255, 255, .032),
            rgba(105, 78, 188, .018)
        )
        !important;

    box-shadow:
        inset 0 1px 0
        rgba(255, 255, 255, .025)
        !important;
}


/* ---------------------------------------------------------
   SUPPRESSION DES ANCIENNES COULEURS SPÉCIFIQUES
--------------------------------------------------------- */

.player-v2 .pv-winrate,
.player-v2 .pv-rank,
.player-v2 .pv-games,
.player-v2 .pv-performance,
.player-v2 .pv-record,
.player-v2 .pv-impact,
.player-v2 .pv-identity,
.player-v2 .pv-chart,
.player-v2 .pv18-rank-card,
.player-v2 .pv18-statistics {
    background:
        linear-gradient(
            145deg,
            rgba(21, 22, 36, .93),
            rgba(10, 12, 24, .94)
        )
        !important;

    border-color:
        rgba(235, 220, 184, .09)
        !important;
}


/* Les cartes replay gardent exactement cette même base */

.player-v2 .replay-metric-card,
.player-v2 .replay-panel {
    border:
        1px solid
        rgba(235, 220, 184, .09)
        !important;

    background:
        linear-gradient(
            145deg,
            rgba(21, 22, 36, .93),
            rgba(10, 12, 24, .94)
        )
        !important;

    box-shadow:
        inset 0 1px 0
        rgba(255, 255, 255, .035),

        0 16px 35px
        rgba(0, 0, 0, .20)
        !important;
}


/* La carte KDA conserve uniquement son accent doré */

.player-v2 .replay-metric-card.accent {
    border-color:
        rgba(227, 181, 100, .24)
        !important;

    background:
        radial-gradient(
            circle at 18% 0%,
            rgba(227, 181, 100, .08),
            transparent 43%
        ),
        linear-gradient(
            145deg,
            rgba(21, 22, 36, .93),
            rgba(10, 12, 24, .94)
        )
        !important;
}


/* ---------------------------------------------------------
   ANIMATION COMMUNE
--------------------------------------------------------- */

.player-v2 .player-v2-grid .pv-card {
    animation:
        cdv-exact-card-entry
        .52s ease both
        !important;
}

@keyframes cdv-exact-card-entry {
    from {
        opacity: 0;

        transform:
            translateY(8px)
            scale(.994);
    }

    to {
        opacity: 1;

        transform:
            translateY(0)
            scale(1);
    }
}

@media (prefers-reduced-motion: reduce) {
    .player-v2 .player-v2-grid .pv-card {
        animation: none !important;
        transition: none !important;
    }
}
