/*
==================================================
PORTAL EMAIL POLTESA
FILE : assets/css/daftar.css
==================================================
*/

/* ==================================================
HEADER PAGE
================================================== */

.page-header{

    background:#f8fafc;

    border-bottom:1px solid #e5e7eb;

    padding:70px 0 50px;

}

.page-header h1{

    font-size:42px;

    font-weight:700;

    color:#1e293b;

}

.page-header p{

    font-size:17px;

    color:#64748b;

    max-width:700px;

}

/* ==================================================
PROGRESS
================================================== */

.progress{

    height:10px;

    border-radius:50px;

}

.progress-bar{

    border-radius:50px;

}

/* ==================================================
FORM CARD
================================================== */

.form-card{

    border:none;

    border-radius:20px;

    box-shadow:0 15px 35px rgba(15,23,42,.08);

}

.form-card .card-body{

    padding:45px;

}

/* ==================================================
PILIHAN USER
================================================== */

.pilihan-user{

    cursor:pointer;

    border:2px solid #e5e7eb;

    border-radius:18px;

    transition:.25s;

}

.pilihan-user:hover{

    transform:translateY(-6px);

    border-color:#2563eb;

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

}

.btn-check:checked + .pilihan-user{

    border-color:#2563eb;

    background:#eff6ff;

    box-shadow:0 20px 35px rgba(37,99,235,.18);

}

.pilihan-user h5{

    margin-top:10px;

    margin-bottom:10px;

    font-weight:700;

}

.pilihan-user small{

    color:#64748b;

}

.jenis-item{
    cursor:pointer;
}

.jenis-item input[type=radio]{
    pointer-events:none;
}

/* ==================================================
SECTION TITLE
================================================== */

.section-title{

    margin-bottom:30px;

}

.section-title h4{

    font-weight:700;

    margin-bottom:8px;

}

.section-title p{

    color:#64748b;

    margin:0;

}

/* ==================================================
FORM
================================================== */

.form-label{

    font-weight:600;

}

.form-control,

.form-select{

    border-radius:12px;

    min-height:48px;

}

textarea.form-control{

    min-height:120px;

}

/* ==================================================
RESPONSIVE
================================================== */

@media(max-width:768px){

.form-card .card-body{

    padding:25px;

}

.page-header{

    padding:50px 0;

}

.page-header h1{

    font-size:32px;

}

}