/**
 * Login / register — Bakala markup, Dorseh white theme.
 * Selectors start with #login-register so they beat parent bakala.css / ltr.css.
 */

:root {
	--dorseh-login-bg: #f5f5f5;
	--dorseh-login-surface: #ffffff;
	--dorseh-login-ink: #222222;
	--dorseh-login-muted: #666666;
	--dorseh-login-line: #eeeeee;
	--dorseh-login-field: #f5f5f5;
	--dorseh-login-accent: var(--accent_color2, var(--m_accent_color2, #44516A));
	--dorseh-login-accent-2: var(--accent_color2, var(--m_accent_color2, #44516A));
	--dorseh-login-btn-solid: var(--accent_color2, var(--m_accent_color2, #44516A));
	--dorseh-login-radius: 22px;
	--dorseh-login-btn-radius: 16px;
	--dorseh-login-control: 14px;
	--dorseh-login-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);
}

body.bk_myaccount,
body.bk_myaccount #page,
body.bk_myaccount #wrapper,
body.bk_myaccount .wrapper,
body.bk_myaccount .main-warp {
	background: var(--dorseh-login-bg) !important;
	min-height: 100vh;
}

body.bk_myaccount {
	margin: 0;
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	justify-content: center !important;
	padding: 32px 16px 48px !important;
	box-sizing: border-box;
}

body.bk_myaccount .ar-cart,
body.bk_myaccount .ar-cartbox,
body.bk_myaccount .widget_shopping_cart_live_region,
body.bk_myaccount #js-jump-to-top,
body.bk_myaccount .dorseh-bnav,
body.bk_myaccount .mobile-bottom-nav,
body.bk_myaccount .bakala-jump-to-top,
body.bk_myaccount .remodal-overlay,
body.bk_myaccount .remodal-wrapper,
body.bk_myaccount .cart-empty,
body.bk_myaccount .cart-empty-div,
body.bk_myaccount .return-to-shop,
body.bk_myaccount .mini-cart-dropdown,
body.bk_myaccount .woocommerce-mini-cart {
	display: none !important;
}

div#login-register {
	width: 100% !important;
	max-width: 512px !important;
	height: auto !important;
	margin: 0 auto !important;
	padding: 0 !important;
	background: transparent !important;
}

#login-register .lr-box {
	position: relative !important;
	display: flex !important;
	flex-direction: column !important;
	align-items: stretch !important;
	width: 100% !important;
	max-width: 512px !important;
	margin: 0 auto !important;
	padding: 0 0 20px !important;
	box-sizing: border-box !important;
	background: var(--dorseh-login-surface) !important;
	border: 1px solid var(--dorseh-login-line) !important;
	border-radius: var(--dorseh-login-radius) !important;
	box-shadow: var(--dorseh-login-shadow) !important;
	overflow: visible !important;
}

#bakala_login #login-register .lr-box {
	max-width: none !important;
	border: 0 !important;
	box-shadow: none !important;
}

#login-register .lr-form,
#login-register form#lr-send-form,
#login-register form#lr-submit-form,
#login-register form#lr-password-form,
#login-register form#lr-complete-form {
	flex-direction: column !important;
	align-items: stretch !important;
	width: 100% !important;
	max-width: none !important;
	height: auto !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	background: transparent !important;
}

#login-register .lr-form[style*="display:none"],
#login-register .lr-form[style*="display: none"] {
	display: none !important;
}

#login-register .lr-form[style*="flex"],
#login-register .lr-form[style*="block"] {
	display: flex !important;
	flex-direction: column !important;
}

#login-register .auth__container {
	display: flex !important;
	flex: 0 0 auto !important;
	flex-direction: column !important;
	align-items: stretch !important;
	width: 100% !important;
	margin: 0 !important;
	padding: 8px 24px 0 !important;
}

#login-register .auth-footer {
	display: flex !important;
	flex-direction: column !important;
	width: 100% !important;
	margin: 12px 0 0 !important;
	padding: 0 24px !important;
	box-sizing: border-box !important;
}

/* Logo: contain, no crop. Account page already has .white-logo — hide extra mobile figure */
#login-register .white-logo,
#login-register .header-logo,
#login-register .o-mobile__icon {
	display: flex !important;
	justify-content: center !important;
	align-items: center !important;
	width: 100% !important;
	height: auto !important;
	max-height: 56px !important;
	margin: 8px 0 16px !important;
	overflow: hidden !important;
}

#login-register .white-logo img,
#login-register .header-logo img,
#login-register .o-mobile__icon img {
	display: block !important;
	width: auto !important;
	height: auto !important;
	max-width: 160px !important;
	max-height: 52px !important;
	margin: 0 auto !important;
	object-fit: contain !important;
}

#login-register .white-logo + .o-mobile__icon,
#login-register .header-logo + .o-mobile__icon {
	display: none !important;
}

#login-register .auth-modal__title,
#login-register h4.auth-modal__title {
	display: block !important;
	width: 100% !important;
	margin: 0 0 6px !important;
	padding: 0 !important;
	color: var(--dorseh-login-ink) !important;
	font-size: 1.2rem !important;
	font-weight: 800 !important;
	line-height: 1.6 !important;
	text-align: right !important;
}

#login-register p.lr-description,
#login-register .lr-description {
	display: block !important;
	width: 100% !important;
	margin: 0 0 16px !important;
	color: var(--dorseh-login-muted) !important;
	font-size: 13px !important;
	line-height: 1.8 !important;
	text-align: right !important;
}

#login-register .lr-box .input-box {
	width: 100% !important;
	margin: 0 0 12px !important;
	direction: rtl !important;
	flex-direction: column !important;
}

#login-register .input-field {
	position: relative !important;
	width: 100% !important;
	height: auto !important;
	min-height: 50px !important;
	display: block !important;
}

/* Parent puts the glyph at left:-8px (ltr.css) which sits on the placeholder */
#login-register .lr-box .input-icon,
#login-register .lr-box .icon-profile-input-login,
#login-register .lr-box .icon-password-input-login,
#login-register .lr-box .icon-email,
#bakala_login #login-register .input-icon,
#bakala_login #login-register .font-icon {
	position: absolute !important;
	top: 0 !important;
	right: 0 !important;
	left: auto !important;
	width: 48px !important;
	height: 50px !important;
	margin: 0 !important;
	padding: 0 !important;
	transform: none !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	z-index: 2;
	pointer-events: none;
	line-height: 1 !important;
}

#login-register .lr-box .input-icon::before,
#login-register .lr-box .font-icon::before,
#login-register .lr-box .icon-profile-input-login::before,
#login-register .lr-box .icon-password-input-login::before,
#login-register .lr-box .icon-email::before,
#login-register .icon-profile-input-login::before,
#bakala_login #login-register .icon-profile-input-login::before,
#bakala_login #login-register .icon-password-input-login::before,
#bakala_login #login-register .font-icon::before {
	position: static !important;
	top: auto !important;
	left: auto !important;
	right: auto !important;
	margin: 0 !important;
	transform: none !important;
	font-size: 20px !important;
	line-height: 1 !important;
	color: #9aa0ae !important;
}

#login-register input:not([type="checkbox"]):not(.token-input):not(.lr-phone-number),
#login-register .input-box:not(.token) input,
#login-register input#phone,
#login-register input#password,
#login-register input#pass,
#login-register input#complete_name,
#login-register input#complete_email,
#login-register input#complete_password,
#bakala_login #login-register input#phone,
#bakala_login #login-register input#pass,
#bakala_login #login-register input#password {
	width: 100% !important;
	height: 50px !important;
	min-height: 50px !important;
	margin: 0 !important;
	padding: 0 48px 0 16px !important;
	direction: rtl !important;
	text-align: right !important;
	line-height: 50px !important;
	background: var(--dorseh-login-field) !important;
	border: 1px solid transparent !important;
	border-radius: var(--dorseh-login-control) !important;
	box-shadow: none !important;
	color: var(--dorseh-login-ink) !important;
	font-size: 14px !important;
	box-sizing: border-box !important;
}

#login-register input#pass,
#login-register input#password,
#login-register input#complete_password {
	padding-left: 40px !important;
}

#login-register input:not([type="checkbox"]):focus {
	border-color: var(--dorseh-login-accent) !important;
	background: #fff !important;
	outline: none !important;
}

#login-register input::placeholder {
	color: #9aa0ae !important;
	opacity: 1 !important;
	font-size: 14px !important;
	font-weight: 400 !important;
	line-height: inherit !important;
}

#login-register input#phone::placeholder,
#login-register input.phone_number::placeholder,
#bakala_login #login-register input#phone::placeholder,
#bakala_login #login-register input.phone_number::placeholder {
	font-size: 14px !important;
}

#login-register .lr-error {
	margin: 6px 2px 0 !important;
	color: #d32f2f !important;
	font-size: 12.5px !important;
	text-align: right !important;
}

#login-register p:not(.lr-description) {
	text-align: right !important;
}

/* Privacy: Bootstrap custom-control (input hidden; one box on the label) */
#login-register .lr-box .user-privacy.custom-control,
#login-register .lr-box .user-privacy {
	position: relative !important;
	display: block !important;
	width: 100% !important;
	min-height: 24px !important;
	margin: 8px 0 4px !important;
	padding: 0 32px 0 0 !important;
	padding-left: 0 !important;
	line-height: 2.14 !important;
	cursor: pointer;
}

#login-register .lr-box .user-privacy .custom-control-input,
#login-register .lr-box .user-privacy input[type="checkbox"] {
	position: absolute !important;
	top: 2px !important;
	right: 0 !important;
	left: auto !important;
	z-index: 5 !important;
	opacity: 0 !important;
	width: 24px !important;
	height: 24px !important;
	margin: 0 !important;
	padding: 0 !important;
	cursor: pointer !important;
	pointer-events: auto !important;
	-webkit-appearance: none !important;
	appearance: none !important;
	background: none !important;
	border: 0 !important;
	box-shadow: none !important;
}

#login-register .lr-box .user-privacy .custom-control-label {
	position: relative !important;
	display: block !important;
	padding: 0 !important;
	padding-left: 0 !important;
	margin: 0 !important;
	margin-top: 0 !important;
	color: var(--dorseh-login-muted) !important;
	font-size: 12.5px !important;
	line-height: 1.8 !important;
	white-space: normal !important;
	cursor: pointer;
	pointer-events: auto;
}

#login-register .lr-box .user-privacy .custom-control-label::before,
#login-register .lr-box .user-privacy .custom-control-label::after {
	content: "" !important;
	position: absolute !important;
	top: 4px !important;
	right: -32px !important;
	left: auto !important;
	width: 18px !important;
	height: 18px !important;
	display: block !important;
	box-sizing: border-box !important;
	pointer-events: none !important;
	border-radius: 4px !important;
}

#login-register .lr-box .user-privacy .custom-control-label::before {
	border: 1.5px solid #c8c8c8 !important;
	background-color: #fff !important;
	background-image: none !important;
	box-shadow: none !important;
}

#login-register .lr-box .user-privacy .custom-control-label::after {
	border: 0 !important;
	background-color: transparent !important;
	background-image: none !important;
}

#login-register .lr-box .user-privacy .custom-control-input:checked ~ .custom-control-label::before,
#login-register .lr-box .user-privacy input:checked + .custom-control-label::before {
	background-color: var(--dorseh-login-accent) !important;
	border-color: var(--dorseh-login-accent) !important;
}

#login-register .lr-box .user-privacy .custom-control-input:checked ~ .custom-control-label::after,
#login-register .lr-box .user-privacy input:checked + .custom-control-label::after {
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E") !important;
	background-repeat: no-repeat !important;
	background-position: center !important;
	background-size: 10px 10px !important;
	background-color: transparent !important;
}

#login-register .lr-box .user-privacy a {
	color: var(--dorseh-login-accent) !important;
	font-weight: 700 !important;
	text-decoration: none !important;
	border-bottom: 0 !important;
}

#login-register .lr_btn_wrap {
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	width: 100% !important;
	margin: 0 !important;
}

#login-register #send:not([style*="none"]),
#login-register #lr-btn:not([style*="none"]),
#login-register #lr-submit:not([style*="none"]),
#login-register button#lr-submit:not([style*="none"]),
#login-register #lr-password:not([style*="none"]),
#login-register #lr-complete-submit:not([style*="none"]),
html body #login-register #send:not([style*="none"]),
html body #login-register #lr-btn:not([style*="none"]),
html body #login-register #lr-submit:not([style*="none"]),
html body #login-register button#lr-submit:not([style*="none"]),
html body #login-register #lr-password:not([style*="none"]),
html body #login-register #lr-complete-submit:not([style*="none"]) {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 100% !important;
	max-width: 100% !important;
	min-width: 0 !important;
	height: 52px !important;
	min-height: 52px !important;
	margin: 8px 0 0 !important;
	padding: 0 24px !important;
	background: var(--accent_color2, var(--m_accent_color2, #44516A)) !important;
	background-color: var(--accent_color2, var(--m_accent_color2, #44516A)) !important;
	background-image: none !important;
	border: 0 !important;
	border-radius: var(--dorseh-login-btn-radius) !important;
	box-shadow: none !important;
	color: #fff !important;
	font-size: 15px !important;
	font-weight: 700 !important;
	line-height: 1.4 !important;
	cursor: pointer;
}

#login-register #send[style*="none"],
#login-register #lr-btn[style*="none"],
#login-register #otp-recode[style*="none"],
#login-register #show-pass[style*="none"],
#login-register #show-code[style*="none"],
#login-register #lr-password-field[style*="none"],
#login-register .forget.btn[style*="none"] {
	display: none !important;
}

#login-register #otp-recode:not([style*="none"]),
#login-register .auth-footer button#show-pass:not([style*="none"]),
#login-register .auth-footer button#show-code:not([style*="none"]),
html body #login-register #otp-recode:not([style*="none"]),
html body #login-register .auth-footer button#show-pass:not([style*="none"]),
html body #login-register .auth-footer button#show-code:not([style*="none"]) {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 100% !important;
	min-width: 0 !important;
	height: auto !important;
	min-height: 0 !important;
	margin: 12px 0 0 !important;
	padding: 8px 12px !important;
	background: transparent !important;
	background-color: transparent !important;
	background-image: none !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	color: var(--dorseh-login-ink) !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	line-height: 1.4 !important;
	cursor: pointer;
}

#login-register .forget.btn:not([style*="none"]) {
	display: block !important;
	justify-content: center !important;
	width: 100% !important;
	margin: 10px 0 0 !important;
	padding: 0 !important;
	background: none !important;
	border: 0 !important;
	color: var(--dorseh-login-muted) !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	text-align: center !important;
}

#login-register .auth-footer-btns {
	display: flex !important;
	flex-direction: column !important;
	align-items: stretch !important;
	justify-content: center !important;
	width: 100% !important;
	margin: 8px 0 0 !important;
	gap: 0 !important;
}

#login-register .auth-footer {
	display: flex !important;
	flex-direction: column !important;
	align-items: stretch !important;
	justify-content: center !important;
	width: 100% !important;
}

#login-register #lr-generate-password {
	background: none !important;
	border: 0 !important;
	padding: 0 !important;
	color: var(--dorseh-login-accent) !important;
	font-size: 12px !important;
	cursor: pointer;
}

#login-register #lr-complete-skip {
	font-size: 13px !important;
	color: var(--dorseh-login-muted) !important;
	text-decoration: none !important;
}

/* Close / back: Bakala header bar, icon font, float left — do not stack CSS shapes on top */
#login-register .lr-box .header,
#login-register .lr-box header.header {
	position: relative !important;
	width: 100% !important;
	height: 58px !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	box-shadow: none !important;
	background-color: #fff !important;
	overflow: visible !important;
}

body.bk_myaccount #login-register #lr-send-form header.header,
.woocommerce-account #login-register button.header__button.close-icon {
	display: none !important;
}

#login-register .lr-box button.header__button,
#login-register .lr-box button.header__button.close-icon,
#login-register .lr-box button.header__button.back-icon,
#login-register button:not(#edit-phone-number).header__button {
	float: left !important;
	position: relative !important;
	top: auto !important;
	left: auto !important;
	right: auto !important;
	inset: auto !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: auto !important;
	max-width: none !important;
	min-width: 56px !important;
	height: 58px !important;
	min-height: 58px !important;
	margin: 0 !important;
	padding: 0 20px !important;
	background: transparent !important;
	background-image: none !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	color: #213743 !important;
	font-size: 0 !important;
	line-height: 1 !important;
	cursor: pointer !important;
	-webkit-tap-highlight-color: transparent !important;
}

#login-register .lr-box button.header__button.close-icon::before,
#login-register .lr-box button.header__button.close-icon::after {
	content: "" !important;
	position: absolute !important;
	left: 50% !important;
	top: 50% !important;
	right: auto !important;
	width: 16px !important;
	height: 2px !important;
	margin: 0 !important;
	padding: 0 !important;
	display: block !important;
	background: #213743 !important;
	background-image: none !important;
	border: 0 !important;
	border-radius: 0 !important;
	font-size: 0 !important;
	box-shadow: none !important;
}

#login-register .lr-box button.header__button.close-icon::before {
	transform: translate(-50%, -50%) rotate(45deg) !important;
}

#login-register .lr-box button.header__button.close-icon::after {
	transform: translate(-50%, -50%) rotate(-45deg) !important;
}

#login-register .lr-box button.header__button.back-icon::after {
	content: none !important;
	display: none !important;
}

#login-register .lr-box button.header__button.back-icon::before {
	content: "" !important;
	position: absolute !important;
	left: 50% !important;
	top: 50% !important;
	right: auto !important;
	width: 12px !important;
	height: 12px !important;
	margin: 0 0 0 4px !important;
	padding: 0 !important;
	display: block !important;
	background: none !important;
	background-image: none !important;
	border: 0 !important;
	border-top: 2px solid #213743 !important;
	border-right: 2px solid #213743 !important;
	border-radius: 0 !important;
	font-size: 0 !important;
	box-shadow: none !important;
	transform: translate(-50%, -50%) rotate(-135deg) !important;
}

/* OTP: theme uses ONE #autofill-input (class hidden-autofill is for SMS autofill, not hiding) */
#login-register .c-input {
	width: 100% !important;
	margin: 0 0 12px !important;
}

#login-register .c-input__container {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	width: 100% !important;
	min-height: 48px !important;
	padding: 8px 14px !important;
	background: var(--dorseh-login-field) !important;
	border: 0 !important;
	border-radius: var(--dorseh-login-control) !important;
}

#login-register #edit-phone-number,
#login-register .otp-form__mobile {
	color: var(--dorseh-login-accent) !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	background: none !important;
	border: 0 !important;
	height: auto !important;
	width: auto !important;
	min-height: 0 !important;
}

#login-register input.lr-phone-number,
#login-register .lr-phone-number {
	background: none !important;
	border: 0 !important;
	height: auto !important;
	min-height: 0 !important;
	padding: 0 !important;
	direction: ltr !important;
	text-align: left !important;
	width: auto !important;
	flex: 1 1 auto !important;
}

#login-register .lr-box #lr-token,
#login-register div#lr-token,
#login-register .lr-box .input-box.token {
	display: flex !important;
	flex-direction: column !important;
	flex-wrap: nowrap !important;
	align-items: stretch !important;
	justify-content: flex-start !important;
	gap: 8px !important;
	width: 100% !important;
	margin: 12px 0 8px !important;
	position: relative !important;
	direction: rtl !important;
}

#login-register .dorseh-otp-label {
	display: block !important;
	width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	color: var(--dorseh-login-ink) !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	text-align: right !important;
	line-height: 1.4 !important;
}

#login-register .dorseh-otp-fields {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: nowrap !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 8px !important;
	width: 100% !important;
	direction: ltr !important;
}

#login-register .lr-box #autofill-input,
#login-register .lr-box input.hidden-autofill {
	position: absolute !important;
	left: 0 !important;
	top: 0 !important;
	width: 1px !important;
	height: 1px !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	opacity: 0 !important;
	overflow: hidden !important;
	border: 0 !important;
	pointer-events: none !important;
}

#login-register #dorseh-otp-boxes,
#login-register .dorseh-otp-boxes {
	display: flex !important;
	flex: 0 1 auto !important;
	align-items: center !important;
	justify-content: flex-start !important;
	gap: 6px !important;
	min-width: 0 !important;
	margin: 0 !important;
	order: 2 !important;
	direction: ltr !important;
}

#login-register #dorseh-otp-boxes .dorseh-otp-digit,
#login-register .dorseh-otp-digit {
	position: static !important;
	flex: 1 1 0 !important;
	width: auto !important;
	max-width: 48px !important;
	min-width: 32px !important;
	height: 48px !important;
	min-height: 48px !important;
	margin: 0 !important;
	padding: 0 !important;
	opacity: 1 !important;
	visibility: visible !important;
	pointer-events: auto !important;
	text-align: center !important;
	letter-spacing: 0 !important;
	font-size: 20px !important;
	font-weight: 700 !important;
	line-height: 48px !important;
	background: var(--dorseh-login-field) !important;
	border: 1px solid var(--dorseh-login-line) !important;
	border-radius: 12px !important;
	color: var(--dorseh-login-ink) !important;
	box-sizing: border-box !important;
	direction: ltr !important;
}

#login-register #lr-countdown,
#login-register div#lr-countdown {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	flex: 0 0 auto !important;
	width: auto !important;
	min-width: 52px !important;
	max-width: 88px !important;
	height: 48px !important;
	margin: 0 !important;
	padding: 0 6px !important;
	order: 1 !important;
	background: transparent !important;
	border: 0 !important;
	color: var(--dorseh-login-muted) !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	text-align: center !important;
	white-space: nowrap !important;
}

#login-register #lr-countdown .otp-inputs__timer {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 4px !important;
	width: auto !important;
	margin: 0 !important;
	padding: 0 !important;
	background: transparent !important;
	color: inherit !important;
	font-size: 13px !important;
}

#login-register #lr-countdown #otp-recode,
#login-register #lr-countdown .otp-inputs__resend {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: auto !important;
	height: auto !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 6px !important;
	background: transparent !important;
	border: 0 !important;
	color: var(--dorseh-login-accent) !important;
}

#login-register .password-toggle-eye {
	color: #9aa0ae !important;
}

#bakala_login.modal:not(.show) {
	display: none !important;
	pointer-events: none !important;
}

#bakala_login.modal.show {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	padding: 16px !important;
	background: transparent !important;
	background-image: none !important;
	pointer-events: auto !important;
}

#bakala_login .modal-dialog,
#bakala_login.bakala_login_style_two .modal-dialog {
	display: block !important;
	width: 100% !important;
	max-width: 512px !important;
	min-width: 0 !important;
	margin: 0 auto !important;
	flex-grow: 0 !important;
}

#bakala_login .modal-content,
#bakala_login.bakala_login_style_two .modal-content,
#bakala_login .modal-content[style] {
	display: flex !important;
	flex-direction: column !important;
	align-items: stretch !important;
	width: 100% !important;
	max-width: 512px !important;
	min-width: 0 !important;
	min-height: 0 !important;
	margin: 0 auto !important;
	padding: 12px 8px 20px !important;
	overflow: visible !important;
	background: var(--dorseh-login-surface) !important;
	background-color: var(--dorseh-login-surface) !important;
	background-image: none !important;
	border: 0 !important;
	border-radius: var(--dorseh-login-radius) !important;
	box-shadow: var(--dorseh-login-shadow) !important;
}

/* Style two: white-on-white logo in .bs-logo; keep branding on the form, not a second huge mark */
#bakala_login .modal-content > .bs-logo {
	display: none !important;
}

#bakala_login .auth-modal-side .bs-logo {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	padding: 24px !important;
}

#bakala_login .auth-modal-side .bs-logo img {
	max-width: 180px !important;
	max-height: 64px !important;
	object-fit: contain !important;
	margin: 0 auto !important;
}

#bakala_login.bakala_login_style_two #login-register {
	max-width: none !important;
	margin: 0 !important;
}

#bakala_login.bakala_login_style_two .lr-box header.header {
	height: 0 !important;
}

#bakala_login.bakala_login_style_two .lr-box button.header__button {
	position: absolute !important;
	top: 4px !important;
	left: 4px !important;
	float: none !important;
	z-index: 8;
}

@media (max-width: 768px) {
	body.bk_myaccount {
		padding: 0 !important;
		align-items: stretch !important;
		justify-content: flex-start !important;
		min-height: 100dvh !important;
		background: var(--dorseh-login-surface) !important;
	}

	body.bk_myaccount div#login-register,
	body.bk_myaccount #login-register .lr-box {
		max-width: none !important;
		width: 100% !important;
		min-height: 100dvh !important;
		height: auto !important;
		border: 0 !important;
		border-radius: 0 !important;
		box-shadow: none !important;
		padding: 0 0 24px !important;
	}

	body.bk_myaccount #login-register form#lr-send-form,
	body.bk_myaccount #login-register form#lr-submit-form,
	body.bk_myaccount #login-register form#lr-password-form,
	body.bk_myaccount #login-register .lr-form[style*="flex"],
	body.bk_myaccount #login-register .lr-form[style*="block"] {
		flex: 1 1 auto !important;
		min-height: calc(100dvh - 8px) !important;
		height: auto !important;
		justify-content: space-between !important;
	}

	#login-register .auth__container {
		flex: 1 1 auto !important;
		padding: 8px 20px 0 !important;
	}

	#login-register .auth-footer {
		margin-top: auto !important;
		padding: 16px 20px 8px !important;
	}

	#login-register .lr-box .header {
		height: 58px !important;
	}

	#login-register .o-mobile__icon {
		margin: 12px auto 20px !important;
		max-height: none !important;
	}

	#login-register .o-mobile__icon img {
		max-width: 80px !important;
		max-height: 50px !important;
	}

	#login-register .white-logo,
	#login-register .header-logo {
		margin: 8px auto 16px !important;
		max-height: none !important;
		overflow: visible !important;
	}

	#login-register button#lr-submit,
	#login-register #lr-submit {
		width: 100% !important;
		max-width: none !important;
		margin: 0.3125em 0 !important;
	}

	#login-register #send:not([style*="none"]),
	#login-register #lr-btn:not([style*="none"]),
	#login-register #lr-submit:not([style*="none"]),
	#login-register #lr-password:not([style*="none"]),
	#login-register #lr-complete-submit:not([style*="none"]),
	#login-register #otp-recode:not([style*="none"]),
	#login-register .auth-footer button#show-pass:not([style*="none"]),
	#login-register .auth-footer button#show-code:not([style*="none"]) {
		width: 100% !important;
		display: flex !important;
	}

	/* Force same desktop button colors on mobile (beat parent front-style-mobile gradient) */
	html body #bakala_login #login-register #send:not([style*="none"]),
	html body #bakala_login #login-register #lr-btn:not([style*="none"]),
	html body #bakala_login #login-register #lr-submit:not([style*="none"]),
	html body #bakala_login #login-register button#lr-submit:not([style*="none"]),
	html body #bakala_login #login-register #lr-password:not([style*="none"]),
	html body #bakala_login #login-register #lr-complete-submit:not([style*="none"]),
	html body #login-register #send:not([style*="none"]),
	html body #login-register #lr-btn:not([style*="none"]),
	html body #login-register #lr-submit:not([style*="none"]),
	html body #login-register button#lr-submit:not([style*="none"]),
	html body #login-register #lr-password:not([style*="none"]),
	html body #login-register #lr-complete-submit:not([style*="none"]),
	html body #bakala_login #login-register button#send:not([style*="none"]),
	html body #bakala_login #login-register button#send:hover:not([style*="none"]),
	html body #bakala_login #login-register button#lr-btn:not([style*="none"]),
	html body #bakala_login #login-register button#lr-submit:not([style*="none"]) {
		background: var(--accent_color2, var(--m_accent_color2, #44516A)) !important;
		background-color: var(--accent_color2, var(--m_accent_color2, #44516A)) !important;
		background-image: none !important;
		border: 0 !important;
		border-radius: var(--dorseh-login-btn-radius) !important;
		box-shadow: none !important;
		color: #fff !important;
	}

	html body #bakala_login #login-register #otp-recode:not([style*="none"]),
	html body #bakala_login #login-register .auth-footer button#show-pass:not([style*="none"]),
	html body #bakala_login #login-register .auth-footer button#show-code:not([style*="none"]),
	html body #login-register #otp-recode:not([style*="none"]),
	html body #login-register .auth-footer button#show-pass:not([style*="none"]),
	html body #login-register .auth-footer button#show-code:not([style*="none"]) {
		background: transparent !important;
		background-color: transparent !important;
		background-image: none !important;
		border: 0 !important;
		box-shadow: none !important;
		color: var(--dorseh-login-ink) !important;
	}

	#login-register .auth-footer-btns {
		flex-direction: column !important;
		align-items: stretch !important;
	}
}

@media (max-width: 768px) {
	body.dorseh-mobile-layout #bakala_login.modal.show {
		display: flex !important;
		align-items: flex-end !important;
		justify-content: center !important;
		padding: 0 !important;
		background: transparent !important;
		z-index: 100060 !important;
	}

	/* Bottom nav sits at the same edge as sheet actions — hide while login is open */
	body.dorseh-mobile-layout:has(#bakala_login.modal.show) .mobile-bottom-nav.dorseh-bottom-nav,
	body.dorseh-mobile-layout.modal-open:has(#bakala_login.modal.show) .mobile-bottom-nav.dorseh-bottom-nav {
		visibility: hidden !important;
		pointer-events: none !important;
	}

	body.dorseh-mobile-layout #bakala_login .modal-content,
	body.dorseh-mobile-layout #bakala_login.bakala_login_style_two .modal-content,
	body.dorseh-mobile-layout #bakala_login .modal-content[style] {
		padding: 0 !important;
		background: #fff !important;
		background-image: none !important;
		border-radius: 32px 32px 0 0 !important;
		overflow: hidden !important;
		display: flex !important;
		flex-direction: column !important;
		max-height: 88vh !important;
	}

	body.dorseh-mobile-layout #bakala_login #login-register,
	body.dorseh-mobile-layout #bakala_login #login-register .lr-box {
		min-height: 0 !important;
		height: auto !important;
		max-height: 88vh !important;
		max-width: none !important;
		border: 0 !important;
		border-radius: 0 !important;
		box-shadow: none !important;
		padding: 0 !important;
		display: flex !important;
		flex-direction: column !important;
		overflow: hidden !important;
		flex: 1 1 auto !important;
	}

	body.dorseh-mobile-layout #bakala_login .lr-box header.header {
		height: 56px !important;
		flex: 0 0 auto !important;
		border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important;
		background: #fff !important;
	}

	body.dorseh-mobile-layout #bakala_login .lr-box button.header__button {
		height: 56px !important;
		min-height: 56px !important;
		top: 0 !important;
		left: 4px !important;
	}

	body.dorseh-mobile-layout #bakala_login #lr-send-form,
	body.dorseh-mobile-layout #bakala_login #lr-submit-form,
	body.dorseh-mobile-layout #bakala_login #lr-password-form {
		flex: 1 1 auto !important;
		min-height: 0 !important;
		max-height: 100% !important;
		overflow: hidden !important;
		flex-direction: column !important;
	}

	body.dorseh-mobile-layout #bakala_login #lr-send-form[style*="flex"],
	body.dorseh-mobile-layout #bakala_login #lr-send-form[style*="block"],
	body.dorseh-mobile-layout #bakala_login #lr-submit-form[style*="flex"],
	body.dorseh-mobile-layout #bakala_login #lr-submit-form[style*="block"],
	body.dorseh-mobile-layout #bakala_login #lr-password-form[style*="flex"],
	body.dorseh-mobile-layout #bakala_login #lr-password-form[style*="block"] {
		display: flex !important;
	}

	body.dorseh-mobile-layout #bakala_login #lr-send-form[style*="none"],
	body.dorseh-mobile-layout #bakala_login #lr-submit-form[style*="none"],
	body.dorseh-mobile-layout #bakala_login #lr-password-form[style*="none"],
	body.dorseh-mobile-layout #bakala_login #login-register #lr-send-form[style*="none"],
	body.dorseh-mobile-layout #bakala_login #login-register #lr-submit-form[style*="none"],
	body.dorseh-mobile-layout #bakala_login #login-register #lr-password-form[style*="none"] {
		display: none !important;
	}

	body.dorseh-mobile-layout #bakala_login .auth__container {
		padding: 16px !important;
		flex: 1 1 auto !important;
		min-height: 0 !important;
		overflow-y: auto !important;
		-webkit-overflow-scrolling: touch !important;
	}

	body.dorseh-mobile-layout #bakala_login .auth-footer,
	body.dorseh-mobile-layout #bakala_login #login-register .auth-footer {
		display: flex !important;
		flex-direction: column !important;
		flex: 0 0 auto !important;
		visibility: visible !important;
		opacity: 1 !important;
		margin: 0 !important;
		padding: 12px 16px calc(16px + env(safe-area-inset-bottom, 0px)) !important;
		border-top: 1px solid rgba(0, 0, 0, 0.08) !important;
		background: #fff !important;
		position: relative !important;
		z-index: 5 !important;
	}

	body.dorseh-mobile-layout #bakala_login .auth-footer-btns,
	body.dorseh-mobile-layout #bakala_login .lr_btn_wrap,
	body.dorseh-mobile-layout #bakala_login .auth-footer .input-box {
		display: flex !important;
		flex-direction: column !important;
		align-items: stretch !important;
		width: 100% !important;
		visibility: visible !important;
		opacity: 1 !important;
	}

	body.dorseh-mobile-layout #bakala_login .o-mobile__icon {
		display: none !important;
	}

	body.dorseh-mobile-layout #bakala_login #login-register #send:not([style*="none"]),
	body.dorseh-mobile-layout #bakala_login #login-register #lr-btn:not([style*="none"]),
	body.dorseh-mobile-layout #bakala_login #login-register #lr-submit:not([style*="none"]),
	body.dorseh-mobile-layout #bakala_login #login-register button#lr-submit:not([style*="none"]),
	body.dorseh-mobile-layout #bakala_login #login-register #lr-password:not([style*="none"]),
	body.dorseh-mobile-layout #bakala_login #login-register #lr-complete-submit:not([style*="none"]),
	body.dorseh-mobile-layout #bakala_login #login-register button#send:not([style*="none"]),
	body.dorseh-mobile-layout #bakala_login #login-register button#send:hover:not([style*="none"]) {
		display: flex !important;
		visibility: visible !important;
		opacity: 1 !important;
		width: 100% !important;
		height: 52px !important;
		min-height: 52px !important;
		background: var(--accent_color2, var(--m_accent_color2, #44516A)) !important;
		background-color: var(--accent_color2, var(--m_accent_color2, #44516A)) !important;
		background-image: none !important;
		border: 0 !important;
		border-radius: var(--dorseh-login-btn-radius) !important;
		box-shadow: none !important;
		color: #fff !important;
		font-size: 15px !important;
		font-weight: 700 !important;
		line-height: 1.4 !important;
		z-index: 6 !important;
	}

	body.dorseh-mobile-layout #bakala_login #login-register #otp-recode:not([style*="none"]),
	body.dorseh-mobile-layout #bakala_login #login-register .auth-footer button#show-pass:not([style*="none"]),
	body.dorseh-mobile-layout #bakala_login #login-register .auth-footer button#show-code:not([style*="none"]),
	body.dorseh-mobile-layout #bakala_login #login-register button#show-pass:not([style*="none"]),
	body.dorseh-mobile-layout #bakala_login #login-register button#show-code:not([style*="none"]) {
		display: flex !important;
		visibility: visible !important;
		opacity: 1 !important;
		background: transparent !important;
		background-color: transparent !important;
		background-image: none !important;
		border: 0 !important;
		color: var(--dorseh-login-ink) !important;
		font-size: 14px !important;
	}

	html body.dorseh-mobile-layout #bakala_login #login-register input#phone,
	html body.dorseh-mobile-layout #bakala_login #login-register input.phone_number,
	html body #login-register input#phone,
	html body #login-register input.phone_number {
		font-size: 14px !important;
	}

	html body.dorseh-mobile-layout #bakala_login #login-register input#phone::placeholder,
	html body.dorseh-mobile-layout #bakala_login #login-register input.phone_number::placeholder,
	html body.dorseh-mobile-layout #bakala_login #login-register input#phone::-webkit-input-placeholder,
	html body #login-register input#phone::placeholder,
	html body #login-register input.phone_number::placeholder,
	html body #login-register input#phone::-webkit-input-placeholder {
		font-size: 14px !important;
		line-height: 1.4 !important;
		opacity: 1 !important;
	}
}

/* Desktop login card: same soft radius + theme-colored buttons as reference popup */
@media (min-width: 769px) {
	#bakala_login .modal-content,
	#bakala_login.bakala_login_style_two .modal-content,
	#bakala_login .modal-content[style],
	#login-register .lr-box {
		border-radius: var(--dorseh-login-radius) !important;
	}

	#login-register #send:not([style*="none"]),
	#login-register #lr-btn:not([style*="none"]),
	#login-register #lr-submit:not([style*="none"]),
	#login-register button#lr-submit:not([style*="none"]),
	#login-register #lr-password:not([style*="none"]),
	#login-register #lr-complete-submit:not([style*="none"]) {
		width: 100% !important;
		height: 52px !important;
		min-height: 52px !important;
		margin: 8px 0 0 !important;
		padding: 0 24px !important;
		border-radius: var(--dorseh-login-btn-radius) !important;
		background: var(--accent_color2) !important;
		background-color: var(--accent_color2) !important;
		background-image: none !important;
		color: #fff !important;
		font-size: 15px !important;
		font-weight: 700 !important;
	}

	#login-register .auth-footer button#show-pass:not([style*="none"]),
	#login-register .auth-footer button#show-code:not([style*="none"]),
	#login-register #otp-recode:not([style*="none"]) {
		width: 100% !important;
		height: auto !important;
		min-height: 0 !important;
		margin: 12px 0 0 !important;
		padding: 8px 12px !important;
		background: transparent !important;
		border: 0 !important;
		border-radius: 0 !important;
		color: var(--dorseh-login-ink) !important;
		font-size: 14px !important;
		font-weight: 600 !important;
	}

	#login-register .auth-footer-btns {
		flex-direction: column !important;
		align-items: stretch !important;
		justify-content: center !important;
		gap: 0 !important;
	}
}