/* =====================================================
   DETAIL PANEL
===================================================== */

.rb-detail-panel{

    background:#fff;

    border-radius:16px;

    padding:18px;

    box-shadow:0 4px 15px rgba(0,0,0,.08);

    width:380px;

    flex-shrink:0;

    height:fit-content;
}

/* =====================================================
   PANEL TITLE
===================================================== */

.rb-detail-panel h3{

    font-size:18px;
    font-weight:700;

    margin-bottom:20px;

    color:#1f2d50;
}

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

.rb-detail-header{

    display:flex;

    align-items:center;

    gap:18px;

    padding-bottom:18px;

    margin-bottom:20px;

    border-bottom:1px solid #eee;
}

.rb-detail-header-info{

    flex:1;
}

.rb-detail-header-info h4{

    margin:0;

    font-size:18px;
    font-weight:700;

    color:#1f2d50;

    line-height:1.3;
}

.rb-detail-header-info p{

    margin:4px 0 0;

    font-size:13px;

    color:#666;
}

/* =====================================================
   BADGE GRANDE
===================================================== */

.rb-group-badge-lg{

    width:56px;
    height:56px;

    display:flex;

    align-items:center;
    justify-content:center;

    border-radius:50%;

    background:#dbeafe;

    color:#2563eb;

    font-size:22px;
    font-weight:700;

    flex-shrink:0;
}

/* =====================================================
   DETALLE
===================================================== */

.rb-detail-list{

    display:flex;

    flex-direction:column;

    gap:16px;
}

.rb-detail-item{

    display:grid;

    grid-template-columns:18px 90px 1fr;

    gap:10px;

    align-items:start;
}

.rb-detail-item i{

    color:#6b7280;

    margin-top:2px;
}

.rb-detail-item span{

    color:#666;

    font-size:14px;
}

.rb-detail-item strong{

    color:#1f2d50;

    font-size:14px;

    font-weight:600;
}

/* =====================================================
   DIVIDER
===================================================== */

.rb-detail-divider{

    border:none;

    border-top:1px solid #eee;

    margin:24px 0;
}

/* =====================================================
   LISTAS
===================================================== */

.rb-detail-panel ul{

    margin:0;

    padding-left:20px;
}

.rb-detail-panel li{

    margin-bottom:10px;

    color:#555;
}

/* =====================================================
   ESTUDIANTES
===================================================== */

.rb-detail-students-title{

    margin-top:0;
    margin-bottom:15px;

    color:#1f2d50;

    font-size:16px;

    font-weight:700;
}

.rb-detail-students{

    list-style:none;

    padding:0;
    margin:0;
}

.rb-detail-students li{

    display:flex;

    align-items:center;

    gap:10px;

    margin-bottom:12px;
}

.rb-detail-students img{

    width:28px;
    height:28px;

    border-radius:50%;

    object-fit:cover;
}

.rb-detail-students span{

    color:#333;

    font-size:14px;
}

/* =====================================================
   LINKS
===================================================== */

.rb-detail-link{

    display:inline-block;

    margin-top:10px;

    color:#2563eb;

    text-decoration:none;

    font-weight:600;
}

.rb-detail-link:hover{

    text-decoration:underline;
}