/* =========================================================
   RADYO32 PROGRAMCILAR V52
   Referans görsele göre kompakt yatay kartlar
   ========================================================= */

.r52-djs{
    width:100%;
    padding:38px 0 46px;
    background:#09111d;
}

.r52-djs .wrap{
    width:min(1240px,calc(100% - 34px))!important;
}

.r52-djs-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    margin-bottom:14px;
}

.r52-djs-head h2{
    margin:0;
    color:#fff;
    font-size:13px;
    font-weight:900;
    letter-spacing:.2px;
}

.r52-djs-head a{
    color:#4b8bd2;
    text-decoration:none;
    font-size:7px;
}


/* GRID */

.r52-dj-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
}


/* KART */

.r52-dj-card{
    min-width:0;
    min-height:115px;

    display:grid;
    grid-template-columns:74px minmax(0,1fr);
    align-items:center;
    gap:12px;

    padding:11px 12px;

    border:1px solid rgba(255,255,255,.08);
    border-radius:13px;

    background:
        linear-gradient(145deg,#0d1726,#0b1422);

    box-shadow:0 10px 26px rgba(0,0,0,.15);

    transition:.18s ease;
}

.r52-dj-card:hover{
    transform:translateY(-2px);
    border-color:rgba(132,71,243,.28);
}


/* AVATAR */

.r52-dj-avatar{
    width:68px;
    height:68px;

    display:grid;
    place-items:center;

    overflow:hidden;

    border:2px solid #d7e0ec;
    border-radius:16px;

    background:#182337;

    box-shadow:
        0 0 0 2px rgba(130,70,241,.28);
}

.r52-dj-avatar img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.r52-dj-avatar span{
    color:#fff;
    font-size:23px;
}


/* BILGI */

.r52-dj-content{
    min-width:0;
}

.r52-dj-content strong,
.r52-dj-content span,
.r52-dj-content small{
    display:block;

    overflow:hidden;

    white-space:nowrap;
    text-overflow:ellipsis;
}

.r52-dj-content strong{
    color:#fff;
    font-size:10px;
    font-weight:800;
}

.r52-dj-content>span{
    margin-top:3px;

    color:#929fb1;

    font-size:7px;
}

.r52-dj-content>small{
    margin-top:6px;

    color:#c0c8d4;

    font-size:7px;
}


/* ALT DURUM */

.r52-dj-status{
    display:flex;
    align-items:center;
    gap:8px;

    margin-top:10px;
}

.r52-dj-status i{
    position:relative;

    width:42px;
    height:3px;

    display:block;

    border-radius:999px;

    background:
        linear-gradient(
            90deg,
            #ff315f 0%,
            #ff315f 20%,
            #d931c8 55%,
            #7748ef 100%
        );
}

.r52-dj-status i:before{
    content:"";

    position:absolute;

    left:0;
    top:50%;

    width:7px;
    height:7px;

    transform:translate(-1px,-50%);

    border-radius:50%;

    background:#ff533d;
}

.r52-dj-status b{
    color:#d6dce7;

    font-size:6px;
    font-weight:900;

    letter-spacing:.4px;
}


/* TABLET */

@media(max-width:1000px){

    .r52-dj-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}


/* MOBILE */

@media(max-width:650px){

    .r52-djs{
        padding:30px 0;
    }

    .r52-djs .wrap{
        width:calc(100% - 16px)!important;
    }

    .r52-djs-head{
        align-items:flex-start;
    }

    .r52-dj-grid{
        grid-template-columns:1fr;
    }

    .r52-dj-card{
        min-height:105px;
        grid-template-columns:64px minmax(0,1fr);
    }

    .r52-dj-avatar{
        width:60px;
        height:60px;
    }
}

/* END PROGRAMCILAR V52 */

/* ===== PROGRAMCILAR DIS CERCEVE ===== */

.r52-dj-grid{
    position:relative;
    padding:18px;

    border:1px solid rgba(113,87,255,.75);
    border-radius:20px;

    background:
        linear-gradient(#0a1321,#0a1321) padding-box,
        linear-gradient(
            90deg,
            #3d7cff,
            #7b4cff,
            #d82bd2,
            #ff2f79
        ) border-box;

    box-shadow:
        0 0 0 1px rgba(255,255,255,.025),
        0 14px 40px rgba(0,0,0,.22),
        0 0 28px rgba(109,67,245,.08);
}

/* hafif ust parlama */
.r52-dj-grid:before{
    content:"";
    position:absolute;
    left:22px;
    right:22px;
    top:-1px;
    height:1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(74,128,255,.8),
            rgba(220,45,205,.8),
            transparent
        );

    pointer-events:none;
}

/* mobilde cerceve biraz daha dar */
@media(max-width:650px){
    .r52-dj-grid{
        padding:10px;
        border-radius:16px;
    }
}

/* ===== END ===== */