/*=====================================================
 CM Event Registration System
 Author : OpenAI
 Version : 1.0
=====================================================*/

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap');

:root{
    --primary:#0d6efd;
    --secondary:#0a58ca;
    --success:#198754;
    --danger:#dc3545;
    --warning:#ffc107;
    --light:#f8f9fa;
    --dark:#212529;
    --white:#ffffff;
    --border:#dee2e6;
    --shadow:0 10px 30px rgba(0,0,0,.08);
}

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{
    font-family:'Poppins',sans-serif;
    background:#f5f7fb;
    color:#333;
}

/*==============================
    COMMON
==============================*/

.section-padding{
    padding:60px 0;
}

.title{
    font-size:36px;
    font-weight:700;
    color:var(--primary);
}

.subtitle{
    color:#666;
    font-size:16px;
}

.required{
    color:red;
}

/*==============================
    PARTICIPANT CARD
==============================*/

.participant-card{

    background:#fff;

    border-radius:16px;

    border:1px solid #eee;

    transition:.35s;

    cursor:pointer;

    padding:35px 20px;

    height:100%;

    text-align:center;

    box-shadow:0 4px 10px rgba(0,0,0,.03);

}

.participant-card:hover{

    transform:translateY(-8px);

    box-shadow:var(--shadow);

    border-color:var(--primary);

}

.participant-card img{

    width:70px;

    height:70px;

    object-fit:contain;

    margin-bottom:15px;

}

.participant-card h5{

    font-size:20px;

    font-weight:600;

}

.participant-card p{

    font-size:14px;

    color:#777;

}

/*==============================
    FORM
==============================*/

.form-box{

    background:#fff;

    padding:35px;

    border-radius:15px;

    box-shadow:var(--shadow);

}

.form-title{

    font-size:28px;

    font-weight:700;

    color:var(--primary);

    margin-bottom:30px;

}

.form-label{

    font-weight:600;

}

.form-control,

.form-select{

    min-height:48px;

    border-radius:10px;

}

.form-control:focus,

.form-select:focus{

    box-shadow:none;

    border-color:var(--primary);

}

textarea.form-control{

    min-height:120px;

}

/*==============================
    BUTTONS
==============================*/

.btn-primary{

    border-radius:10px;

    padding:12px 30px;

    font-weight:600;

}

.btn-success{

    border-radius:10px;

    padding:12px 30px;

    font-weight:600;

}

.btn-danger{

    border-radius:10px;

    padding:12px 30px;

    font-weight:600;

}

/*==============================
    ALERT
==============================*/

.alert{

    border-radius:10px;

}

/*==============================
    SUCCESS PAGE
==============================*/

.success-box{

    background:#fff;

    padding:60px;

    border-radius:20px;

    text-align:center;

    box-shadow:var(--shadow);

}

.success-icon{

    font-size:80px;

    color:var(--success);

}

/*==============================
    TABLE
==============================*/

.table{

    background:#fff;

}

.table thead{

    background:var(--primary);

    color:#fff;

}

/*==============================
    ADMIN
==============================*/

.dashboard-card{

    background:#fff;

    border-radius:15px;

    padding:30px;

    box-shadow:var(--shadow);

}

.dashboard-card h3{

    font-size:30px;

    font-weight:700;

}

.dashboard-card p{

    margin-bottom:0;

    color:#777;

}

/*==============================
    IMAGE PREVIEW
==============================*/

.preview-image{

    width:140px;

    height:140px;

    border-radius:10px;

    border:2px dashed #ccc;

    object-fit:cover;

}

/*==============================
    LOADER
==============================*/

.loader{

    display:none;

}

/*==============================
    RESPONSIVE
==============================*/

@media(max-width:991px){

.title{

font-size:28px;

}

}

@media(max-width:767px){

.form-box{

padding:20px;

}

.participant-card{

margin-bottom:20px;

}

.title{

font-size:24px;

}

}