/* =========================================================
RANKING
========================================================= */

.pm-ranking{

    width:100%;

    background:
    linear-gradient(
        180deg,
        #0f172a,
        #020617
    );

    border-radius:28px;

    overflow:hidden;

    border:
    1px solid rgba(255,255,255,.06);

}

/* =========================================================
HEADER
========================================================= */

.pm-ranking-header {
    display: grid !important;
    grid-template-columns: 50px 1fr 120px !important;
    align-items: center;
    padding: 20px;
    gap: 15px;
    background: rgba(255, 255, 255, .04);
    color: #94a3b8;
    font-weight: 800;
}

/* =========================================================
ROWS
========================================================= */

.pm-ranking-row {
    display: grid !important;
    grid-template-columns: 50px 1fr 100px !important;
    align-items: center;
    text-align: center;
    gap: 15px;
    padding: 12px 10px;
    border-top: 1px solid rgba(255, 255, 255, .06);
    transition: .2s ease;
}

.pm-ranking-row:hover{

    background:
    rgba(255,255,255,.03);

}

/* =========================================================
POSITION
========================================================= */

.pm-rank-pos{

    font-size:18px;

    font-weight:800;

    color:#ffcc00;

}

/* =========================================================
USER
========================================================= */

.pm-rank-user{

    color:#fff;

    font-size:16px;

    font-weight:700;

}

/* =========================================================
POINTS
========================================================= */

.pm-rank-points{

    color:#00ff99;

    font-size:20px;

    font-weight:800;

}

/* =========================================================
CURRENT USER GLOW
========================================================= */

.pm-ranking-current-user{

    position:relative;

    background:
    linear-gradient(
        135deg,
        rgba(255,204,0,.10),
        rgba(255,170,0,.04)
    );

    border:
    1px solid rgba(255,204,0,.35);

    box-shadow:

    inset 0 0 0 1px rgba(255,255,255,.04),

    0 0 20px rgba(255,204,0,.10),

    0 0 40px rgba(255,204,0,.08);

    overflow:hidden;

}

/* =========================================================
GLOW OVERLAY
========================================================= */

.pm-ranking-current-user::before{

    content:"";

    position:absolute;

    inset:0;

    background:
    linear-gradient(
        90deg,
        rgba(255,204,0,.08),
        transparent 35%,
        transparent 65%,
        rgba(255,170,0,.05)
    );

    pointer-events:none;

}

/* =========================================================
LEFT GOLD BAR
========================================================= */

.pm-ranking-current-user::after{

    content:"";

    position:absolute;

    left:0;
    top:0;

    width:4px;
    height:100%;

    background:
    linear-gradient(
        180deg,
        #ffcc00,
        #ff8800
    );

    box-shadow:
    0 0 18px rgba(255,204,0,.55);

}