/* ===========================
   STUDENT CREATED MODAL
=========================== */

.student-created-overlay{

    position:fixed;

    inset:0;

    background:rgba(15,23,42,.55);

    backdrop-filter:blur(6px);

    display:flex;

    align-items:center;

    justify-content:center;

    opacity:0;

    visibility:hidden;

    transition:.25s;

    z-index:99999;

}

.student-created-overlay.show{

    opacity:1;

    visibility:visible;

}

.student-created-modal{

    width:760px;

    max-width:92%;

    background:#fff;

    border-radius:24px;

    overflow:hidden;

    box-shadow:0 30px 80px rgba(15,23,42,.30);

    animation:studentPopup .25s ease;

}

@keyframes studentPopup{

    from{

        opacity:0;

        transform:translateY(20px) scale(.96);

    }

    to{

        opacity:1;

        transform:translateY(0) scale(1);

    }

}

.student-created-header{

    display:flex;

    justify-content:space-between;

    align-items:flex-start;

    padding:28px 30px;

    border-bottom:1px solid #edf2f7;

}

.student-created-header h2{

    margin:0;

    font-size:28px;

    color:#0f172a;

}

.student-created-header p{

    margin-top:8px;

    color:#64748b;

}

.student-created-header button{

    width:44px;

    height:44px;

    border:none;

    border-radius:14px;

    background:#f1f5f9;

    cursor:pointer;

    font-size:20px;

    transition:.2s;

}

.student-created-header button:hover{

    background:#e2e8f0;

}

.student-created-body{

    padding:30px;

}

.student-info{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:18px;

    margin-bottom:30px;

}

.student-info div{

    background:#f8fafc;

    border:1px solid #e2e8f0;

    border-radius:18px;

    padding:18px;

}

.student-info span{

    display:block;

    font-size:13px;

    color:#64748b;

    margin-bottom:8px;

}

.student-info strong{

    font-size:17px;

    color:#0f172a;

}

.student-link-box,

.student-message-box{

    margin-bottom:24px;

}

.student-link-box label,

.student-message-box label{

    display:block;

    margin-bottom:10px;

    font-weight:700;

    color:#334155;

}

.student-link-box input{

    width:100%;

    padding:14px 16px;

    border:1px solid #dbe4ee;

    border-radius:14px;

    background:#f8fafc;

    font-size:15px;

}

.student-message-box textarea{

    width:100%;

    resize:none;

    padding:16px;

    border:1px solid #dbe4ee;

    border-radius:16px;

    background:#f8fafc;

    font-family:inherit;

    font-size:15px;

    line-height:1.7;

    color:#334155;

}

.student-message-box textarea:focus,

.student-link-box input:focus{

    outline:none;

    border-color:#2563eb;

    box-shadow:0 0 0 4px rgba(37,99,235,.10);

}

.student-created-actions{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:16px;

    margin-top:18px;

}

.student-created-actions .btn{

    width:100%;

    justify-content:center;

}

.btn-success{

    background:#16a34a;

    color:#fff;

}

.btn-success:hover{

    background:#15803d;

}

.btn-secondary{

    background:#f1f5f9;

    color:#0f172a;

}

.btn-secondary:hover{

    background:#e2e8f0;

}

.btn-danger{

    background:#dc2626;

    color:#fff;

}

.btn-danger:hover{

    background:#b91c1c;

}

@media(max-width:768px){

    .student-created-modal{

        width:95%;

        border-radius:22px;

    }

    .student-created-header{

        padding:22px;

    }

    .student-created-body{

        padding:22px;

    }

    .student-info{

        grid-template-columns:1fr;

    }

    .student-created-actions{

        grid-template-columns:1fr;

    }

    .student-created-header h2{

        font-size:22px;

    }

    .student-message-box textarea{

        min-height:220px;

    }

}

@media(max-width:480px){

    .student-created-header{

        flex-direction:column;

        gap:16px;

    }

    .student-created-header button{

        align-self:flex-end;

    }

}