body {
    background-image: url('/assets/images/bg.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    height: 100vh;
    margin: 0;
}

/* konteyneri (iti) full width yap */
.intl-tel-input,    /* eski versiyon class adı */
.iti {               /* yeni versiyon class adı */
    width: 100% !important;
}

/* içteki input’u kutu modeline göre %100 genişlik yap */
.iti input,
.intl-tel-input input {
    width: 100%;
    box-sizing: border-box;
}

/* e-postayla gelen doğrulama kodunun girildiği input; e-postadaki kod kutusuyla aynı görünür */
.otp-input,
.otp-input:focus {
    background-color: #DEF3E8;
    border: 2px dashed #23A884;
    border-radius: 8px;
    color: #1FB88E;
}
.otp-input {
    /* Tabler'ın büyük input (.form-control-lg) yüksekliğinde kalsın: kalın çerçevenin fazladan 1px'i dikey
       padding'den düşülür, sol padding'e eklenen 6px ise letter-spacing'in son karakterin sağına eklediği boşluğu dengeler */
    padding: calc(.6875rem - 1px) 1.5rem calc(.6875rem - 1px) calc(1.5rem + 6px);
    font-family: 'Courier New', Courier, monospace;
    font-size: 1.25rem;
    line-height: 1.4285714286;
    font-weight: bold;
    letter-spacing: 6px;
    text-align: center;
}
.otp-input:focus {
    box-shadow: 0 0 0 0.25rem rgba(35, 168, 132, 0.2);
}
.otp-input::placeholder {
    color: #1FB88E;
    opacity: 0.25;
}

/* İYS'nin gönderdiği e-postadaki ticari ileti (ETK) onay kodu kutusuyla aynı görünür */
.otp-input-blue,
.otp-input-blue:focus {
    background-color: #DBEBFB;
    border-color: #0B57D0;
    color: #0B57D0;
}
.otp-input-blue:focus {
    box-shadow: 0 0 0 0.25rem rgba(11, 87, 208, 0.2);
}
.otp-input-blue::placeholder {
    color: #0B57D0;
}