.auth-wrapper{
    min-height:100vh;
    position:relative;
    font-family:Inter,system-ui,sans-serif;
    overflow:hidden;
}

/* BACKGROUND SIDANG */
.auth-bg{
    position:absolute;
    inset:0;
    background:
        radial-gradient(circle at top left, #e6efff, #f8fafc 60%),
        linear-gradient(135deg, #f8fafc, #eef4ff);
}

/* MAIN CARD */
.auth-box{
    max-width:740px;
    border-radius:14px;
    background:#fff;
    overflow:hidden;
    box-shadow:0 25px 60px rgba(15,23,42,.18);
}

/* LEFT PANEL */
.auth-info{
    background:linear-gradient(160deg,#2563eb,#1e40af);
    color:#fff;
}
.auth-info-inner{
    padding:28px;
    height:100%;
    display:flex;
    flex-direction:column;
}
.brand-logo{height:52px}

/* TIMELINE */
.timeline-item{
    display:flex;
    gap:14px;
    margin-bottom:14px;
}
.timeline-item span{
    width:28px;height:28px;
    border-radius:50%;
    background:rgba(255,255,255,.25);
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:13px;
    font-weight:700;
}
.timeline-item.active span{
    background:#fff;
    color:#2563eb;
}
.timeline-item small{
    display:block;
    font-size:12px;
    opacity:.85;
}

/* RIGHT FORM */
.auth-form-inner{padding:26px}
.form-control{
    background:#f8fafc;
    border:1px solid #e2e8f0;
}
.btn-primary{
    background:#2563eb;
    border:none;
}
.captcha-sm{transform:scale(.75)}



/* ===== FIX GLOBAL AUTH PAGE ===== */
.auth-wrapper{
    background:#f8fafc;
}

/* Background layer fix */
.auth-bg{
    z-index:0;
}

/* Container harus di atas background */
.auth-wrapper .container{
    position:relative;
    z-index:2;
}

/* Card universal (login + forgot + reset) */
.auth-box{
    margin:auto;
    background:#ffffff;
}

/* ===== KHUSUS FORGOT & RESET ===== */
.auth-box.simple{
    max-width:420px;
    padding:32px;
}

/* Tambah depth biar gak "kosong" */
.auth-box.simple{
    box-shadow:
        0 20px 50px rgba(15,23,42,.15),
        0 2px 8px rgba(15,23,42,.05);
}





/* ===== SIDANG SAFE GLASS LOOK ===== */
.auth-box{
    backdrop-filter: blur(6px);
    background: rgba(255,255,255,0.95);
}

/* Panel kiri lebih calm */
.auth-info{
    background: linear-gradient(160deg,#1e3a8a,#2563eb);
}

/* Judul form */
.auth-form-inner h4{
    letter-spacing:.5px;
}

/* Input lebih tinggi & nyaman */
.form-control{
    padding:10px 12px;
    border-radius:10px;
}

/* Button utama */
.btn-primary{
    padding:12px;
    border-radius:12px;
    font-size:15px;
}

/* Link bawah */
.auth-form-inner a{
    color:#2563eb;
    font-weight:500;
}


/* =============================
   KHUSUS HALAMAN REGISTER
   ============================= */

/* =============================
   KHUSUS HALAMAN REGISTER FULL FIX
   ============================= */

/* RESET GLOBAL (BIAR GA ADA GAP SAMA SEKALI) */
html, body{
    height:100%;
    margin:0;
    padding:0;
}

/* WRAPPER FULL LAYAR */
.auth-wrapper.register-page{
    width:100%;
    height:100vh;
    overflow-y:auto; /* 🔥 SCROLL AKTIF SAAT PERLU */
}

/* HILANGKAN BATAS CARD */
.register-page .auth-box{
    width:100% !important;
    max-width:100% !important;
    height:100vh;
    margin:0 !important;
    border-radius:0 !important;
}

/* ROW FULL */
.register-page .row{
    height:100%;
}

/* PANEL KIRI */
.register-page .auth-info{
    height:100%;
}

/* PANEL KANAN */
.register-page .register-form{
    height:100%;
     overflow:visible; /* 🔥 BIAR NGIKUT KONTEN */
    padding:16px 20px;
}

/* =============================
   RAPATKAN SEMUA BIAR MUAT 1 LAYAR
   ============================= */

/* JUDUL */
.register-form h4{
    font-size:18px;
    margin-bottom:2px;
}
.register-form p{
    font-size:13px;
    margin-bottom:8px;
}

/* GRID */
.register-form .row{
    row-gap:8px;
}

/* LABEL */
.register-form label{
    font-size:12px;
    margin-bottom:2px;
    font-weight:600;
}

/* INPUT */
.register-form .form-control{
    padding:7px 10px;
    font-size:13px;
    border-radius:8px;
}

/* TEXTAREA */
.register-form textarea{
    height:60px;
}

/* =============================
   UPLOAD
   ============================= */

.upload-card{
    padding:8px;
    border-radius:10px;
    background:#f8fafc;
    border:1px dashed #cbd5f5;
}

.upload-card h6{
    font-size:13px;
    margin-bottom:2px;
}

.upload-card small{
    font-size:11px;
}

/* =============================
   ALERT
   ============================= */

.register-page .alert {
    font-size: 10px;
    padding: 6px 8px;
    margin-bottom: 6px;
}

/* =============================
   BUTTON
   ============================= */

.register-form .btn{
    padding:10px;
    font-size:14px;
    border-radius:10px;
}

/* =============================
   LINK
   ============================= */

.register-form a{
    font-size:13px;
}

/* =============================
   FIX BOOTSTRAP CONTAINER GAP
   ============================= */

.container-fluid{
    padding-left:0 !important;
    padding-right:0 !important;
}

/* =============================
   EXTRA: HILANGKAN SPACE SISA
   ============================= */

body{
     overflow-y:auto; /* 🔥 BIAR BISA SCROLL */
}


/* =============================
   PERBESAR FONT TANPA OVERFLOW
   ============================= */

/* JUDUL */
.register-form h4{
    font-size:22px; /* naik */
    margin-bottom:4px;
}

/* DESKRIPSI */
.register-form p{
    font-size:14px;
    margin-bottom:10px;
}

/* LABEL */
.register-form label{
    font-size:13px; /* dari 12 → 13 */
    margin-bottom:2px;
}

/* INPUT */
.register-form .form-control{
    font-size:14px; /* dari 13 → 14 */
    padding:8px 10px;
}

/* TEXTAREA */
.register-form textarea{
    height:55px; /* sedikit dikurangi biar muat */
}

/* GRID (INI KUNCI BIAR MUAT) */
.register-form .row{
    row-gap:6px; /* diperkecil */
}

/* UPLOAD */
.upload-card h6{
    font-size:14px;
}
.upload-card small{
    font-size:12px;
}

/* ALERT */
.register-form .alert{
    font-size:13px;
    padding:6px 8px;
    margin-top:6px;
}

/* BUTTON */
.register-form .btn{
    font-size:15px;
    padding:10px;
}

/* LINK */
.register-form a{
    font-size:13px;
}



/* =============================
   HEADER FORM REGISTER
   ============================= */

.form-header{
    margin-bottom:12px;
    padding-bottom:10px;
    border-bottom:2px solid #e2e8f0; /* garis bawah */
}

/* JUDUL */
.form-header h3{
    font-size:22px;
    font-weight:700;
    margin:0;
    color:#1e293b;
}

/* DESKRIPSI */
.form-header p{
    margin:2px 0 0;
    font-size:14px;
    color:#64748b;
}


.form-header{
    position:relative;
    margin-bottom:14px;
    padding-bottom:12px;
}

.form-header::after{
    content:"";
    position:absolute;
    bottom:0;
    left:0;
    width:60px;
    height:3px;
    background:#2563eb;
    border-radius:10px;
}


/* =============================
   CSS KOTAK PREVIEW UPLOAD
   ============================= */

   .preview-box{
    height:90px;
    border:2px dashed #c7d2fe;
    border-radius:12px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#f8fafc;
    overflow:hidden;
}

.preview-box img{
    max-height:80px;
    border-radius:8px;
}

.preview-box span{
    font-size:12px;
    color:#64748b;
}


.upload-card{
    border:1px solid #e2e8f0;
    border-radius:14px;
    padding:14px;
    background:#f8fafc;
    gap:12px;
}

/* KIRI */
.upload-left{
    flex:1;
}

/* KANAN */
.upload-right{
    width:90px;
}

/* PREVIEW BOX */
.preview-box{
    width:90px;
    height:90px;
    border:2px dashed #c7d2fe;
    border-radius:12px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#eef2ff;
    overflow:hidden;
    text-align:center;
}

.preview-box img{
    max-width:100%;
    max-height:100%;
}

.preview-box span{
    font-size:11px;
    color:#64748b;
}


.back-login{
    display:inline-block;
    font-size: clamp(14px, 1.1vw, 18px); /* auto scale */
    font-weight:600;
    color:#2563eb;
    text-decoration:none;
    padding:6px 10px;
    border-radius:8px;
    transition:all .2s ease;
}

.back-login:hover{
    background:#eef2ff;
    color:#1e40af;
}



/* =============================
   
   ============================= *

/* FOOTER */
.register-page .auth-footer{
    margin-top:auto;
    font-size:11px;
    opacity:.7;
}

.register-page .form-container {
    padding: 14px 22px;
}

/* JUDUL */
.register-page .form-header h2 {
    font-size: 22px; /* sebelumnya 20px */
    margin-bottom: 4px;
}

/* DESKRIPSI */
.register-page .form-header p {
    font-size: 13px; /* sebelumnya 12px */
    margin-bottom: 8px;
}

/* INPUT */
.register-page .form-control {
    height: 36px; /* sebelumnya 32px */
    font-size: 13px; /* sebelumnya 12px */
    padding: 6px 10px;
}

/* TEXTAREA */
.register-page textarea.form-control {
    height: 36px;
    resize: none;
}

.register-page .auth-info{
    height:100vh;
    position:sticky;
    top:0;
}

.register-page .register-form{
    height:100vh;
    overflow-y:auto; /* 🔥 SCROLL DI FORM SAJA */
}


/* =============================
   SCALE UP TYPO (LEVEL 2)
============================= */

/* Judul */
.register-form h4{
    font-size:22px; /* dari 20 */
}

/* Deskripsi */
.register-form p{
    font-size:15px; /* dari 14 */
}

/* Label */
.register-form label{
    font-size:14px; /* dari 13 */
}

/* Input */
.register-form .form-control{
    font-size:15px; /* dari 14 */
    padding:6px 10px; /* tetap */
}

/* Placeholder */
.register-form .form-control::placeholder{
    font-size:14px;
}

/* Upload */
.upload-card h6{
    font-size:15px;
}
.upload-card small{
    font-size:13px;
}

/* Alert */
.register-form .alert{
    font-size:14px;
}

/* Button */
.register-form .btn{
    font-size:16px;
}

/* GRID LEBIH RAPAT */
.register-form .row{
    row-gap:4px; /* dari 5 → 4 */
}

/* TEXTAREA DIKURANGIN */
.register-form textarea{
    height:45px; /* dari 50 */
}

/* UPLOAD CARD DIPADATIN DIKIT */
.upload-card{
    padding:6px 8px;
}

/* ALERT JANGAN KEGEMUKAN */
.register-form .alert{
    padding:5px 8px;
}


.reset-page .btn-primary{
    background:#1e40af !important;
    border:none;
}

.reset-page .btn-primary,
.reset-page .btn-primary:disabled{
    background:#2563eb !important;
    border-color:#2563eb !important;
    color:#fff !important;
    opacity:1 !important;
}

/* =============================
   LEFT PANEL KHUSUS REGISTER
   ============================= */
/* =============================
   LEFT PANEL REGISTER - CLEAN BLUE
============================= */

/* =============================
   LEFT PANEL REGISTER - FIX LEGIBLE
============================= */

.register-page .auth-info{
    height:100vh;
    padding:0;
}

/* CONTAINER */
.register-page .left-panel{
    height:100%;
    display:flex;
    flex-direction:column;
    align-items:center;
    text-align:center;
    background:linear-gradient(180deg,#2563eb,#1e3a8a);
    color:#fff;
    padding:24px 20px;
}

/* ================= HEADER ================= */
.register-page .left-header{
    max-width:320px; /* 🔥 DIBESARKAN */
    margin-bottom:14px;
}

.register-page .wifi-icon{
    font-size:34px; /* 🔥 LEBIH BESAR */
    margin-bottom:8px;
}

.register-page .left-header h3{
    font-size:22px;
    font-weight:700;
    margin:0;
}

.register-page .left-header span{
    display:block;
    font-size:16px;
    letter-spacing:4px;
    margin-bottom:8px;
    font-weight:600;
}

.register-page .left-header p{
    font-size:14px; /* 🔥 DIBESARKAN */
    line-height:1.6;
    opacity:.95;
}

/* ================= IMAGE ================= */
.register-page .left-image{
    margin:18px 0;
}

.register-page .left-image img{
    width:100%;
    max-width:230px; /* sedikit lebih besar */
    border-radius:14px;
    box-shadow:0 10px 25px rgba(0,0,0,.2);
}

/* ================= INFO ================= */
.register-page .left-info{
    width:100%;
    max-width:320px; /* 🔥 DIBESARKAN BIAR TEKS PANJANG */
    text-align:left;
}

/* ITEM */
.register-page .left-info .item{
    display:flex;
    gap:12px;
    margin-bottom:16px;
}

/* ICON */
.register-page .left-info span{
    min-width:26px;
    height:26px;
    border-radius:50%;
    background:#fff;
    color:#2563eb;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:700;
    font-size:13px;
}

/* TEXT */
.register-page .left-info strong{
    font-size:15px; /* 🔥 DIBESARKAN */
    display:block;
}

.register-page .left-info small{
    font-size:13px; /* 🔥 DIBESARKAN */
    opacity:.95;
    line-height:1.5;
}

/* ================= FOOTER ================= */
.register-page .left-footer{
    margin-top:auto;
    font-size:12px;
    opacity:.8;
}

/* ================= RESPONSIVE ================= */
@media(max-width:992px){
    .register-page .auth-info{
        display:none;
    }
}


/* ===================================
   RESPONSIVE SPLIT SCREEN FIX
=================================== */

@media (max-width: 992px){

    /* CARD FULL */
    .register-page .auth-box{
        height:auto !important;
        min-height:100vh;
    }

    /* ROW JADI FLEX */
    .register-page .row{
        display:flex;
        flex-wrap:wrap;
        height:auto !important;
    }

    /* PANEL KIRI */
    .register-page .auth-info{
        display:block !important;
        position:relative;
        height:auto !important;
        min-height:300px;
    }

    /* PANEL KANAN */
    .register-page .register-form{
        height:auto !important;
        overflow:visible !important;
    }

    /* KONTEN KIRI */
    .register-page .left-panel{
        padding:20px 16px;
    }

    /* GAMBAR */
    .register-page .left-image img{
        max-width:180px;
    }
}


/* ===================================
   MOBILE KECIL
=================================== */

@media (max-width: 768px){

    /* FONT */
    .register-form h4{
        font-size:20px;
    }

    .register-form p,
    .register-form label,
    .register-form .form-control{
        font-size:13px;
    }

    /* INPUT */
    .register-form .form-control{
        padding:8px 10px;
    }

    /* UPLOAD */
    .upload-card{
        flex-direction:column;
        align-items:flex-start;
    }

    .upload-right{
        width:100%;
        display:flex;
        justify-content:center;
    }

    /* PREVIEW */
    .preview-box{
        width:80px;
        height:80px;
    }
}


/* ===================================
   SPLIT SCREEN HEIGHT FIX
=================================== */

@media (max-height:700px){

    .register-page .auth-info{
        position:relative;
        height:auto !important;
    }

    .register-page .register-form{
        height:auto !important;
    }

    .register-page .left-image img{
        max-width:150px;
    }
}