/* coordination result — نفس أسلوب بطاقة الطالب rn351 */
.rn-coord-page{
    --rn-coord-navy:#17215a;
    --rn-coord-blue:#2c3494;
    --rn-coord-portal:#1689c6;
    --rn-coord-orange:#f15a2a;
    --rn-coord-ink:#14213d;
    --rn-coord-muted:#75819a;
    --rn-coord-line:#e3e8f1;
    --rn-coord-soft:#f7f9fc;
    --rn-coord-green:#12a66a;
    --rn-coord-green-soft:#eafaf2;
    --rn-coord-wait:#fff8eb;
    --rn-coord-wait-line:#f0ddb2;
    font:inherit;
}

.rn-coord-result{
    margin-top:18px;
}

.rn-coord-shell{
    overflow:hidden;
    border:1px solid rgba(44,52,148,.15);
    border-radius:28px;
    background:#fff;
    box-shadow:
        0 24px 66px rgba(16,24,40,.10),
        0 4px 12px rgba(16,24,40,.04);
}

.rn-coord-shell:before{
    content:"";
    display:block;
    height:7px;
    background:linear-gradient(
        90deg,
        var(--rn-coord-orange),
        var(--rn-coord-blue),
        var(--rn-coord-navy)
    );
}

.rn-coord-main{
    display:grid;
    grid-template-columns:minmax(0,1fr) 280px;
    gap:24px;
    direction:ltr;
    padding:28px 28px 22px;
    background:
        linear-gradient(135deg,rgba(44,52,148,.025),transparent 48%),
        #fff;
}

.rn-coord-student,
.rn-coord-score-card{
    direction:rtl;
}

.rn-coord-name{
    margin:0 0 18px;
    color:var(--rn-coord-ink);
    font-size:clamp(24px,3.6vw,38px);
    line-height:1.38;
    font-weight:950;
    letter-spacing:-.35px;
}

.rn-coord-tags{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-bottom:18px;
}

.rn-coord-tag{
    display:inline-flex;
    align-items:center;
    min-height:34px;
    padding:6px 12px;
    border-radius:999px;
    font-size:12px;
    font-weight:800;
}

.rn-coord-tag.is-success{
    color:#098952;
    background:var(--rn-coord-green-soft);
}

.rn-coord-tag.is-branch{
    color:#1769e0;
    background:#edf0ff;
}

.rn-coord-tag.is-round{
    color:var(--rn-coord-blue);
    background:#eef0ff;
}

.rn-coord-info-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
}

.rn-coord-info-wide{
    grid-column:1 / -1;
}

.rn-coord-info{
    min-height:88px;
    padding:14px 16px;
    border:1px solid var(--rn-coord-line);
    border-radius:16px;
    background:var(--rn-coord-soft);
}

.rn-coord-info span{
    display:block;
    margin-bottom:7px;
    color:var(--rn-coord-muted);
    font-size:12px;
    font-weight:800;
}

.rn-coord-info strong{
    display:block;
    overflow-wrap:anywhere;
    color:var(--rn-coord-ink);
    font-size:16px;
    line-height:1.45;
    font-weight:950;
}

.rn-coord-score-card{
    display:grid;
    align-content:start;
    min-height:280px;
    padding:18px 20px 20px;
    border:1px solid var(--rn-coord-line);
    border-radius:22px;
    background:#fff;
    box-shadow:0 16px 38px rgba(16,24,40,.08);
}

.rn-coord-ring{
    --rn-coord-value:0;
    position:relative;
    display:grid;
    place-items:center;
    width:156px;
    height:156px;
    margin:8px auto 0;
    border-radius:50%;
    background:conic-gradient(
        var(--rn-coord-green) calc(var(--rn-coord-value) * 1%),
        #e9edf4 0
    );
}

.rn-coord-ring:before{
    content:"";
    position:absolute;
    inset:12px;
    border-radius:50%;
    background:#fff;
}

.rn-coord-ring-content{
    position:relative;
    z-index:1;
    display:grid;
    text-align:center;
}

.rn-coord-ring-content strong{
    color:var(--rn-coord-ink);
    font-size:28px;
    line-height:1.1;
    font-weight:950;
}

.rn-coord-ring-content span{
    margin-top:4px;
    color:var(--rn-coord-muted);
    font-size:12px;
    font-weight:800;
}

.rn-coord-section{
    border-top:1px solid var(--rn-coord-line);
    background:#fbfcfe;
}

.rn-coord-section-head{
    padding:16px 28px 0;
}

.rn-coord-section-head span{
    display:block;
    color:var(--rn-coord-muted);
    font-size:12px;
    font-weight:800;
}

.rn-coord-section-head h3{
    margin:6px 0 0;
    color:var(--rn-coord-ink);
    font-size:20px;
    font-weight:950;
}

.rn-coord-section-body{
    padding:14px 28px 22px;
}

.rn-coord-college-box{
    padding:18px 20px;
    border:1px solid rgba(23,33,90,.12);
    border-radius:18px;
    background:var(--rn-coord-navy);
    color:#fff;
}

.rn-coord-college-box strong{
    display:block;
    font-size:clamp(20px,3.4vw,28px);
    line-height:1.5;
    font-weight:950;
}

.rn-coord-college-box span{
    display:block;
    margin-top:6px;
    color:rgba(255,255,255,.82);
    font-size:12px;
    font-weight:800;
}

.rn-coord-wait-box{
    padding:16px 18px;
    border:1px solid var(--rn-coord-wait-line);
    border-radius:16px;
    background:var(--rn-coord-wait);
}

.rn-coord-wait-box p{
    margin:0;
    color:#80530b;
    font-size:14px;
    line-height:1.75;
    font-weight:700;
}

.rn-coord-stages{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:14px;
}

.rn-coord-stages span{
    min-height:34px;
    display:inline-flex;
    align-items:center;
    padding:0 12px;
    border:1px solid var(--rn-coord-line);
    border-radius:999px;
    background:#fff;
    color:var(--rn-coord-muted);
    font-size:11px;
    font-weight:800;
}

.rn-coord-stages .is-done{
    color:#098952;
    background:var(--rn-coord-green-soft);
    border-color:#abefc6;
}

.rn-coord-stages .is-soon{
    color:#9a6700;
    background:#fff8eb;
    border-color:#fde68a;
}

.rn-coord-services{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
    padding:18px 28px 22px;
    border-top:1px solid var(--rn-coord-line);
    background:#fbfcfe;
}

.rn-coord-service{
    display:grid;
    grid-template-columns:48px minmax(0,1fr);
    gap:12px;
    align-items:center;
    min-height:84px;
    padding:14px;
    border:1px solid var(--rn-coord-line);
    border-radius:16px;
    background:#fff;
    color:inherit;
    text-decoration:none;
}

.rn-coord-service.is-active{
    border-color:rgba(44,52,148,.28);
    background:#f7f9ff;
    box-shadow:inset 3px 0 0 var(--rn-coord-blue);
}

.rn-coord-service-icon{
    display:grid;
    place-items:center;
    width:44px;
    height:44px;
    border-radius:13px;
    color:var(--rn-coord-blue);
    background:#eef0ff;
}

.rn-coord-service-icon svg{
    width:22px;
    height:22px;
    fill:none;
    stroke:currentColor;
    stroke-width:2;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.rn-coord-service-icon.is-result{
    color:#1769e0;
    background:#edf8fd;
}

.rn-coord-service-icon.is-rank{
    color:#c27803;
    background:#fff6da;
}

.rn-coord-service-icon.is-predict{
    color:#079455;
    background:#eafaf2;
}

.rn-coord-service strong{
    display:block;
    margin-bottom:3px;
    color:var(--rn-coord-ink);
    font-size:15px;
    line-height:1.4;
    font-weight:950;
}

.rn-coord-service small{
    display:block;
    color:var(--rn-coord-muted);
    font-size:12px;
    line-height:1.45;
    font-weight:750;
}

.rn-coord-foot-links{
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    gap:12px;
    padding:0 28px 24px;
}

.rn-coord-foot-link{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:46px;
    padding:0 18px;
    border:1px solid var(--rn-coord-line);
    border-radius:12px;
    background:#fff;
    color:var(--rn-coord-ink);
    text-decoration:none;
    font-size:13px;
    font-weight:800;
}

.rn-coord-foot-link.is-primary{
    border-color:var(--rn-coord-blue);
    background:var(--rn-coord-blue);
    color:#fff;
}

.rn-coord-note{
    margin:12px 2px 0;
    color:var(--rn-coord-muted);
    font-size:12px;
    line-height:1.7;
    text-align:center;
    font-weight:700;
}

@media(max-width:900px){
    .rn-coord-main{
        grid-template-columns:1fr;
        padding:22px 18px 16px;
    }

    .rn-coord-score-card{
        min-height:0;
    }

    .rn-coord-section-head,
    .rn-coord-section-body,
    .rn-coord-services,
    .rn-coord-foot-links{
        padding-right:18px;
        padding-left:18px;
    }
}

@media(max-width:700px){
    .rn-coord-shell{
        border-radius:20px;
    }

    .rn-coord-info-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .rn-coord-services{
        grid-template-columns:1fr;
    }

    .rn-coord-foot-links{
        flex-direction:column;
    }

    .rn-coord-foot-link{
        width:100%;
    }
}