/* ==========================================================
   INCEPTION V46
   LOGIN TYPOGRAPHY + STEP 3 CONFIRM CHECKBOX
   ========================================================== */


/* ==========================================================
   1. LOGIN RIGHT
   Skala typography disamakan dengan halaman Daftar.
   Layout/card tidak diubah.
   ========================================================== */

body.inc-login-v12
.inc-login-card
:is(h1, h2, h3) {
    font-size: 42px !important;
    line-height: 1.08 !important;
    font-weight: 800 !important;
}


body.inc-login-v12
.inc-login-card label {
    font-size: 13.5px !important;
    line-height: 1.4 !important;
    font-weight: 600 !important;
}


body.inc-login-v12
.inc-login-card
input:not([type="checkbox"]) {
    font-size: 15px !important;
    line-height: 1.4 !important;
}


body.inc-login-v12
.inc-login-card button {
    font-size: 13.5px !important;
    line-height: 1.3 !important;
    font-weight: 700 !important;
}


body.inc-login-v12
.inc-login-card a,

body.inc-login-v12
.inc-login-card p,

body.inc-login-v12
.inc-login-card span {
    font-size: 13px !important;
    line-height: 1.45 !important;
}


/* ==========================================================
   2. STEP 3 CONFIRMATION CONTAINER
   ========================================================== */

#inception-register-v50-host
.v50-card:has(.v50-proof-grid)
.v50-confirm,

#inception-register-v50-host
.v50-card:has(.v50-proof-grid)
.v15-confirm,

#inception-register-v50-host
.v50-card:has(.v50-proof-grid)
label:has(input[type="checkbox"]),

#inception-register-v50-host
.v50-card:has(.v50-proof-grid)
:is(label, div):has(> input[type="checkbox"]) {
    display: flex !important;

    align-items: flex-start !important;

    gap: 12px !important;

    cursor: pointer !important;
}


/* ==========================================================
   3. CHECKBOX ASLI
   Override V42/V44/V45 apa pun yang sebelumnya menyembunyikan
   input checkbox.

   Tidak pakai pseudo pada label.
   Yang terlihat ini adalah input checkbox existing.
   ========================================================== */

#inception-register-v50-host
.v50-card:has(.v50-proof-grid)
input[type="checkbox"] {
    -webkit-appearance: none !important;
    appearance: none !important;

    display: inline-grid !important;
    place-content: center !important;

    position: static !important;

    box-sizing: border-box !important;

    width: 22px !important;
    height: 22px !important;

    min-width: 22px !important;
    min-height: 22px !important;

    max-width: 22px !important;
    max-height: 22px !important;

    flex: 0 0 22px !important;

    margin: 1px 0 0 0 !important;
    padding: 0 !important;

    border: 2px solid #5871d8 !important;
    border-radius: 6px !important;

    background: #ffffff !important;

    opacity: 1 !important;
    visibility: visible !important;

    clip: auto !important;
    clip-path: none !important;

    overflow: visible !important;

    pointer-events: auto !important;

    transform: none !important;

    cursor: pointer !important;

    box-shadow: none !important;
}


/* CENTANG */

#inception-register-v50-host
.v50-card:has(.v50-proof-grid)
input[type="checkbox"]::before {
    content: "" !important;

    display: block !important;

    width: 10px !important;
    height: 6px !important;

    border-left:
        2.5px solid
        #ffffff !important;

    border-bottom:
        2.5px solid
        #ffffff !important;

    transform:
        translateY(-1px)
        rotate(-45deg)
        scale(0) !important;

    transform-origin:
        center !important;
}


/* CHECKED */

#inception-register-v50-host
.v50-card:has(.v50-proof-grid)
input[type="checkbox"]:checked {
    background:
        #5871d8 !important;

    border-color:
        #5871d8 !important;
}


#inception-register-v50-host
.v50-card:has(.v50-proof-grid)
input[type="checkbox"]:checked::before {
    transform:
        translateY(-1px)
        rotate(-45deg)
        scale(1) !important;
}


/* Neutralize pseudo lama */

#inception-register-v50-host
.v50-card:has(.v50-proof-grid)
input[type="checkbox"]::after {
    content: none !important;
    display: none !important;
}


/* Kalau V45 membuat kotak palsu pada label, matikan */

#inception-register-v50-host
.v50-card:has(.v50-proof-grid)
label:has(input[type="checkbox"])::before {
    content: none !important;
    display: none !important;
}


/* Keyboard focus */

#inception-register-v50-host
.v50-card:has(.v50-proof-grid)
input[type="checkbox"]:focus-visible {
    outline: none !important;

    box-shadow:
        0 0 0 4px
        rgba(
            88,
            113,
            216,
            .16
        ) !important;
}


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

@media (max-width: 760px) {

    body.inc-login-v12
    .inc-login-card
    :is(h1, h2, h3) {
        font-size:
            34px !important;
    }

}


/* ==========================================================
   END V46
   ========================================================== */