/* Login follows the supplied reference: credentials on the left, brand panel on the right. */
.login-page { direction: ltr; grid-template-columns: 1.1fr 1fr; }
.login-panel, .login-card, .login-brand { direction: rtl; }
.captcha-row { display: grid; grid-template-columns: 54px 1fr; gap: 10px; direction: ltr; align-items: stretch; }
.captcha-image { display: block; width: 100%; height: 78px; object-fit: cover; border: 1px solid #dbe0e8; border-radius: 8px; background: #f3f6fb; }
.captcha-refresh { display: grid; place-items: center; width: 54px; height: 78px; border: 1px solid #dbe0e8; border-radius: 8px; background: #f5f7fb; color: #2265ed; cursor: pointer; }
.captcha-refresh:hover, .captcha-refresh:focus { background: #eaf0ff; }
.captcha-refresh .ui-icon { width: 21px; height: 21px; }
.captcha-field input { text-align: left; direction: ltr; }
.captcha-field input::placeholder { text-align: right; direction: rtl; }
.brand-logo { width: 43px; height: 43px; object-fit: contain; display: block; flex: 0 0 auto; }
.login-logo-wrap { display: grid; place-items: center; width: 96px; height: 96px; margin: auto; }
.login-logo-image { width: 100%; height: 100%; object-fit: contain; display: block; }
.input-with-icon { background: #fff; transition: border-color .2s, box-shadow .2s; }
.input-with-icon:focus-within { border-color: #9db6e9; box-shadow: 0 0 0 3px #2265ed1a; }
.input-with-icon input, .input-with-icon input:focus { outline: 0 !important; border: 0 !important; box-shadow: none !important; background: transparent !important; }
@media (max-width: 650px) { .login-page { direction: ltr; } }