/* ==========================================================================
   Mehrsun Gallery — sign-in with a mobile number (Digits).
   One design for the pop-up (.dig-box.dig_pgmdl_2, in the footer of every page, opened by login.php's script)
   and for the page /?login=true (.digits_login_form .dig_pgmdl_1, Digits' own template; this file is added
   to it on login_head).
   ========================================================================== */
:root {
	--mg-night: #0a1a18; --mg-ink: #13211f; --mg-text: #58625f; --mg-muted: #8b9491; --mg-teal: #088b87; --mg-teal-d: #0a4b4b;
	--mg-gold: #a67c2e; --mg-gold-l: #e2bf6e; --mg-ivory: #faf6ef; --mg-line: #e9e0cf;
	--mg-grad: linear-gradient(115deg, #a8782a 0%, #e6c373 26%, #fff1c6 44%, #d4ab52 62%, #a8782a 82%, #e6c373 100%);
	--mg-login-photo: url("/wp-content/uploads/2025/09/4-768x917.webp");
}

/* ---------- the form (pop-up and page) ---------- */
html .dig_lrf_box, html .dig_lrf_box * { font-family: iranyekan, Tahoma, sans-serif; box-sizing: border-box; }
html .dig_lrf_box .digloginpage, html .dig_lrf_box .dig_verify_mobile_otp { display: block; float: none; width: 100%; height: auto; min-height: 0; padding: 0; }
html .dig_lrf_box form.diglogsignup { padding: 0; width: 100%; text-align: right; direction: rtl; }
html .dig_lrf_box .dig_sml_box_msg_head, html .dig_lrf_box .dig_verify_code_head {
	display: block; margin: 0 0 8px; padding: 0; font-size: 24px; font-weight: 900; line-height: 1.5; color: var(--mg-ink); text-align: right;
}
html .dig_lrf_box .dig_sml_box_msg, html .dig_lrf_box .dig_verify_code_msg {
	display: block; margin: 0 0 6px; font-size: 14px; line-height: 1.9; color: var(--mg-muted); text-align: right; opacity: 1;
}
html .dig_lrf_box .minput { position: relative; margin: 22px 0 0; padding: 0; height: auto; border: 0; }
html .dig_lrf_box .minput .minput_inner { display: flex; flex-direction: column; position: relative; height: auto; }
html .dig_lrf_box .minput label {
	position: static; order: -1; transform: none; display: block; margin: 0 0 8px; padding: 0; font-size: 13px; font-weight: 700; line-height: 1.6;
	color: var(--mg-ink); text-align: right; opacity: 1; pointer-events: none; background: none;
}
html .dig_lrf_box .minput .bgdark, html .dig_lrf_box .minput span.bgdark { display: none; }
html .dig_lrf_box .minput .digits-input-wrapper { position: relative; width: 100%; }
html .dig_lrf_box .minput input[type="text"], html .dig_lrf_box .minput input[type="tel"], html .dig_lrf_box .minput input[type="number"],
html .dig_lrf_box .minput input[type="email"], html .dig_lrf_box .minput input[type="password"] {
	width: 100%; height: 56px; margin: 0; padding: 0 18px; border: 1px solid var(--mg-line) !important; border-radius: 16px !important;
	background: var(--mg-ivory) !important; color: var(--mg-ink) !important; font-size: 17px; font-weight: 700; letter-spacing: .04em; line-height: 56px;
	box-shadow: none !important; outline: 0; direction: ltr; text-align: left; transition: border-color .25s, box-shadow .25s, background-color .25s;
}
html .dig_lrf_box .minput input::placeholder { color: #a9b0ad; font-weight: 400; letter-spacing: 0; direction: rtl; text-align: right; }
html .dig_lrf_box .minput input:focus { border-color: var(--mg-gold-l) !important; background: #fff !important; box-shadow: 0 0 0 4px rgba(226, 191, 110, .2) !important; }
html .dig_lrf_box .minput input.mobile_field { padding-left: 96px !important; }
html .dig_lrf_box .countrycodecontainer {
	border: 0 !important; background: none !important; position: absolute; left: 7px; right: auto; top: auto; bottom: 7px; z-index: 2; height: 42px; width: 78px; margin: 0; display: flex !important; align-items: center;
}
html .dig_lrf_box .countrycodecontainer input.countrycode {
	width: 100%; height: 42px; padding: 0 6px; border: 0 !important; border-radius: 11px !important; background: #fff !important; box-shadow: 0 0 0 1px var(--mg-line) !important;
	text-align: center; font-size: 15px; font-weight: 800; letter-spacing: 0; line-height: 42px; color: var(--mg-ink) !important;
}
html .dig_lrf_box .countrycodecontainer::after {
	content: ""; position: absolute; right: -10px; top: 9px; bottom: 9px; width: 1px; background: var(--mg-line);
}
html .dig_lrf_box .dig_login_otp input, html .dig_lrf_box .dig_verify_otp_input, html .dig_lrf_box input[name="dig_otp"] {
	text-align: center !important; letter-spacing: .5em !important; font-size: 22px !important; padding: 0 12px !important;
}

/* remember me */
html .dig_lrf_box .digits-form_rememberme, html .dig_lrf_box .digits-form_rememberme .digits-form_input, html .dig_lrf_box .dig_opt_mult_con, html .dig_lrf_box .dig_opt_mult {
	display: flex; justify-content: flex-start; text-align: right; width: 100%; margin: 0; padding: 0;
}
html .dig_lrf_box .digits-form_rememberme { margin: 16px 0 0; }
html .dig_lrf_box .dig_opt_mult label { display: inline-flex; align-items: center; gap: 10px; margin: 0; cursor: pointer; font-size: 13.5px; font-weight: 600; color: var(--mg-text); }
html .dig_lrf_box .dig_opt_mult .dig_input_wrapper { display: inline-flex; align-items: center; gap: 10px; }
html .dig_lrf_box .dig_opt_mult .dig_input_wrapper > div { font-size: 13.5px; color: var(--mg-text); padding: 0; margin: 0; }
html .dig_lrf_box .dig_opt_mult input[type="checkbox"] {
	-webkit-appearance: none; appearance: none; position: relative; width: 20px; height: 20px; margin: 0; border-radius: 6px; border: 1.5px solid #cfc6b4; background: #fff; cursor: pointer; flex: none;
	transition: background-color .2s, border-color .2s; opacity: 1 !important; display: inline-block !important; visibility: visible !important; pointer-events: auto;
}
html .dig_lrf_box .dig_opt_mult input[type="checkbox"]:checked { background: var(--mg-night); border-color: var(--mg-night); }
html .dig_lrf_box .dig_opt_mult input[type="checkbox"]:checked::after {
	content: ""; position: absolute; left: 6px; top: 2px; width: 5px; height: 10px; border: solid var(--mg-gold-l); border-width: 0 2px 2px 0; transform: rotate(45deg);
}
html .dig_lrf_box .dig_opt_mult label::before, html .dig_lrf_box .dig_opt_mult label::after { display: none; }

/* buttons */
html .dig_lrf_box .button.loginviasms, html .dig_lrf_box .dig_login_va_otp, html .dig_lrf_box .dig_verify_otp_submit_button, html .dig_lrf_box .button.dig_verify_otp {
	display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; height: 56px; margin: 24px 0 0; padding: 0 20px; border: 0; border-radius: 999px;
	background: var(--mg-grad) !important; background-size: 200% auto !important; color: #1b1405 !important; font-size: 16px; font-weight: 800; line-height: 1; cursor: pointer;
	box-shadow: 0 16px 34px -18px rgba(166, 124, 46, .95); transition: background-position .5s, transform .25s; opacity: 1;
}
html .dig_lrf_box .button.loginviasms::after, html .dig_lrf_box .dig_login_va_otp::after { content: "←"; font-weight: 400; font-size: 18px; }
html .dig_lrf_box .button.loginviasms:hover, html .dig_lrf_box .dig_login_va_otp:hover, html .dig_lrf_box .dig_verify_otp_submit_button:hover { background-position: 100% center !important; transform: translateY(-2px); }
html .dig_lrf_box .dig_resendotp { margin: 16px 0 0; text-align: center; font-size: 13px; font-weight: 600; color: var(--mg-teal-d); cursor: pointer; }
html .dig_lrf_box .dig_resendotp[dis="1"] { color: var(--mg-muted); cursor: default; }
html .dig_lrf_box .dig_resendotp > span { display: inline-block; margin-inline-start: 4px; direction: ltr; unicode-bidi: isolate; }
html .dig_lrf_box .mg-login-perks {
	display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 16px; margin: 24px 0 0; padding: 16px 0 0; border-top: 1px dashed var(--mg-line); font-size: 12px; color: var(--mg-muted);
}
html .dig_lrf_box .mg-login-perks span { display: inline-flex; align-items: center; gap: 6px; }
html .dig_lrf_box .mg-login-perks span::before { content: ""; width: 6px; height: 6px; transform: rotate(45deg); background: var(--mg-gold-l); }

/* Digits' own messages and loader */
html .dig_popmessage {
	border-radius: 16px !important; font-family: iranyekan, Tahoma, sans-serif !important; box-shadow: 0 20px 50px -20px rgba(10, 26, 24, .5) !important;
}
html .dig_popmessage .dig_lase_message { font-size: 14px !important; line-height: 1.9 !important; }
html .dig_load_overlay { background: rgba(255, 255, 255, .6) !important; backdrop-filter: blur(2px); }
html .dig_load_overlay .dig_double-bounce1, html .dig_load_overlay .dig_double-bounce2 { background-color: var(--mg-gold) !important; }

/* ---------- pop-up ---------- */
html body .dig-box.dig_pgmdl_2 {
	position: fixed; inset: 0; z-index: 999999; width: auto; height: auto; margin: 0; padding: 0; overflow: auto;
	background: rgba(10, 26, 24, .62) !important; -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px);
}
html body .dig-box.dig_pgmdl_2 .dig-content.dig-modal-con {
	position: relative; top: auto; left: auto; right: auto; transform: none; display: flex; width: min(900px, 94vw); height: auto !important; min-height: 540px; max-height: none;
	margin: max(4vh, 24px) auto; padding: 0; border: 0; border-radius: 30px; overflow: hidden; background: #fff !important; box-shadow: 0 40px 100px -30px rgba(0, 0, 0, .6);
	animation: mg-dig-in .45s cubic-bezier(.2, .8, .2, 1);
}
@keyframes mg-dig-in { from { opacity: 0; transform: translateY(24px) scale(.98); } to { opacity: 1; transform: none; } }
html body .dig-box.dig_pgmdl_2 .dig_ul_left_side {
	order: 2; position: relative; display: block; flex: 0 0 42%; min-height: 100%; margin: 0; padding: 0; border-radius: 0;
	background: linear-gradient(180deg, rgba(10, 26, 24, .05) 30%, rgba(10, 26, 24, .92) 100%), var(--mg-login-photo) center / cover no-repeat !important;
}
html body .dig-box.dig_pgmdl_2 .dig_ul_left_side::before {
	content: ""; position: absolute; inset: 16px; border-radius: 20px; border: 1px solid rgba(226, 191, 110, .35); pointer-events: none;
}
html body .dig-box.dig_pgmdl_2 .dig_ul_left_side::after {
	content: "گالری طلا و جواهر مهرسان\A بدون رمز عبور؛ فقط با شماره موبایل وارد شوید یا حساب بسازید.";
	white-space: pre-line; position: absolute; right: 34px; left: 34px; bottom: 36px; color: rgba(255, 255, 255, .78); font-size: 13.5px; line-height: 2; text-align: right;
}
html body .dig-box.dig_pgmdl_2 .dig-bgleft-arrow-right { display: none; }
html body .dig-box.dig_pgmdl_2 .digits_bx_cred_frm_container {
	position: relative; display: flex; flex-direction: column; justify-content: center; flex: 1 1 auto; width: auto; height: auto; min-height: 540px; padding: 56px 46px 40px; float: none;
}
html body .dig-box.dig_pgmdl_2 .digits_bx_cred_frm_container::before {
	content: ""; display: block; width: 150px; height: 58px; margin: 0 0 26px auto;
	background: url("/wp-content/uploads/2026/10/mehrsun-logo.png.webp") right center / contain no-repeat;
}
html body .dig-box.dig_pgmdl_2 .digits_bx_head { position: static; height: 0; padding: 0; margin: 0; border: 0; }
html body .dig-box.dig_pgmdl_2 .dig-box-login-title { display: none; }
html body .dig-box.dig_pgmdl_2 .dig-cont-close {
	position: absolute; top: 20px; left: 20px; right: auto; z-index: 5; width: 40px; height: 40px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center;
	background: var(--mg-ivory); color: var(--mg-ink); font-size: 22px; line-height: 1; cursor: pointer; transition: background-color .2s, color .2s; opacity: 1;
}
html body .dig-box.dig_pgmdl_2 .dig-cont-close:hover { background: var(--mg-night); color: var(--mg-gold-l); }
html body .dig-box.dig_pgmdl_2 .digits_bx_cred_frm, html body .dig-box.dig_pgmdl_2 .dig_bx_cnt_mdl { height: auto; padding: 0; margin: 0; overflow: visible; }
html body .dig-box.dig_pgmdl_2 .digloginpage { min-height: 0 !important; padding: 0 !important; display: block !important; }
html body .dig-box.dig_pgmdl_2 .digoneclickls .diglogsignup { padding-top: 0 !important; }
@media (max-width: 767px) {
	html body .dig-box.dig_pgmdl_2 { overflow: hidden; }
	html body .dig-box.dig_pgmdl_2 .dig-content.dig-modal-con {
		position: absolute; left: 0; right: 0; bottom: 0; width: 100%; min-height: 0; max-height: 92vh; margin: 0; overflow: auto; border-radius: 28px 28px 0 0; flex-direction: column;
		animation-name: mg-dig-up;
	}
	@keyframes mg-dig-up { from { transform: translateY(100%); } to { transform: none; } }
	html body .dig-box.dig_pgmdl_2 .dig_ul_left_side { display: none; }
	html body .dig-box.dig_pgmdl_2 .digits_bx_cred_frm_container { min-height: 0; padding: 30px 22px calc(26px + env(safe-area-inset-bottom)); }
	html body .dig-box.dig_pgmdl_2 .digits_bx_cred_frm_container::before { width: 124px; height: 48px; margin-bottom: 18px; }
	html body .dig-box.dig_pgmdl_2 .dig-content.dig-modal-con::before {
		content: ""; position: absolute; top: 10px; left: 50%; width: 44px; height: 5px; margin-left: -22px; border-radius: 5px; background: var(--mg-line);
	}
	html body .dig-box.dig_pgmdl_2 .dig-cont-close { top: 22px; left: 18px; }
	html .dig_lrf_box .dig_sml_box_msg_head { font-size: 21px; }
}

/* "opening…" state while the sign-in scripts load (login.php) */
.mg-login-wait {
	position: fixed; inset: 0; z-index: 999998; display: flex; align-items: center; justify-content: center; background: rgba(10, 26, 24, .45);
	-webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); animation: mg-fade .2s ease;
}
.mg-login-wait span { width: 46px; height: 46px; border-radius: 50%; border: 3px solid rgba(255, 255, 255, .25); border-top-color: var(--mg-gold-l); animation: mg-spin .8s linear infinite; }
@keyframes mg-spin { to { transform: rotate(360deg); } }
@keyframes mg-fade { from { opacity: 0; } }

/* ---------- page /?login=true (html.mg-dig-page: set by login.php; the pop-up's wrapper is a .digits_login_form too) ---------- */
html.mg-dig-page body { background: var(--mg-ivory) !important; }
html.mg-dig-page .digits_login_form { position: relative; min-height: 100vh; width: 100%; margin: 0; padding: 0; background: var(--mg-ivory) !important; }
html.mg-dig-page .digits_login_form::before {
	content: ""; position: fixed; top: 0; bottom: 0; left: 0; width: 46%;
	background: linear-gradient(180deg, rgba(10, 26, 24, .1) 35%, rgba(10, 26, 24, .9) 100%), var(--mg-login-photo) center / cover no-repeat;
}
html.mg-dig-page .digits_login_form::after {
	content: "مهرسان؛ جایی که طلا با مهر آمیخته می‌شود\A ورود سریع و امن با شماره موبایل — بدون نیاز به رمز عبور.";
	white-space: pre-line; position: fixed; left: 4%; width: 38%; bottom: 7vh; color: rgba(255, 255, 255, .8); font: 600 15px/2.1 iranyekan, Tahoma, sans-serif; text-align: right; direction: rtl;
}
html.mg-dig-page .digits_login_form .dig_bdy_container { position: relative; width: 54%; min-height: 100vh; margin: 0 0 0 auto; padding: 0; display: flex; align-items: center; justify-content: center; background: none !important; float: none; }
html.mg-dig-page .digits_login_form .dig_lrf_box.dig_pgmdl_1 {
	position: relative; top: auto; left: auto; right: auto; width: min(460px, 100%); height: auto; margin: 0 auto; padding: 96px 24px 60px; background: none !important;
	box-shadow: none !important; transform: none; display: block;
}
html.mg-dig-page .digits_login_form .dig_pgmdl_1 .header { position: absolute; top: 28px; right: 24px; left: auto; height: auto; margin: 0; padding: 0; background: none !important; }
html.mg-dig-page .digits_login_form .dig_pgmdl_1 .header a {
	display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 16px; border-radius: 999px; border: 1px solid var(--mg-line); background: #fff;
	font-size: 13px; font-weight: 700; color: var(--mg-ink) !important; text-decoration: none;
}
html.mg-dig-page .digits_login_form .dig_pgmdl_1 .header a::before { content: "→"; font-size: 15px; }
html.mg-dig-page .digits_login_form .dig_pgmdl_1 .header a span { font-size: 0; }
html.mg-dig-page .digits_login_form .dig_pgmdl_1 .header a span::after { content: "بازگشت به فروشگاه"; font-size: 13px; }
html.mg-dig-page .digits_login_form .dig_pgmdl_1 .logocontainer {
	position: static !important; top: auto !important; opacity: 1 !important; height: auto; margin: 0 0 26px; padding: 0; text-align: right; transform: none;
}
html.mg-dig-page .digits_login_form .dig_pgmdl_1 .logocontainer img.logo { width: 170px; height: auto; max-width: 100%; }
html.mg-dig-page .digits_login_form .dig_pgmdl_1 .dig_clg_bx { position: static !important; top: auto !important; opacity: 1 !important; width: 100%; margin: 0; padding: 0; transform: none; }
html.mg-dig-page .digits_login_form .dig_pgmdl_1 .dig-container {
	position: relative; width: 100%; height: auto !important; min-height: 0; margin: 0; padding: 36px 32px 30px; border-radius: 26px;
	background: #fff !important; border: 1px solid var(--mg-line); box-shadow: 0 40px 90px -50px rgba(19, 33, 31, .55) !important; overflow: visible;
}
html.mg-dig-page .digits_login_form .dig_pgmdl_1 .dig-container::before {
	content: ""; position: absolute; top: 0; left: 28px; right: 28px; height: 3px; border-radius: 0 0 3px 3px; background: var(--mg-grad);
}
html.mg-dig-page .digits_login_form .dig_pgmdl_1 .dig-container .digloginpage { height: auto !important; min-height: 0 !important; display: block !important; padding: 0 !important; }
@media (max-width: 900px) {
	html.mg-dig-page .digits_login_form::before { position: absolute; width: 100%; height: 250px; bottom: auto; border-radius: 0 0 32px 32px; background-position: center 30%; }
	html.mg-dig-page .digits_login_form::after { display: none; }
	html.mg-dig-page .digits_login_form .dig_bdy_container { width: 100%; min-height: 0; display: block; }
	html.mg-dig-page .digits_login_form .dig_lrf_box.dig_pgmdl_1 { padding: 88px 16px 40px; width: 100%; max-width: 480px; }
	html.mg-dig-page .digits_login_form .dig_pgmdl_1 .header { top: 18px; right: 16px; }
	html.mg-dig-page .digits_login_form .dig_pgmdl_1 .header a { background: rgba(255, 255, 255, .92); border-color: transparent; }
	html.mg-dig-page .digits_login_form .dig_pgmdl_1 .logocontainer {
		display: inline-block; margin: 0 0 16px; padding: 10px 16px; border-radius: 18px; background: rgba(255, 255, 255, .92);
		-webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
	}
	html.mg-dig-page .digits_login_form .dig_pgmdl_1 .logocontainer img.logo { width: 128px; }
	html.mg-dig-page .digits_login_form .dig_pgmdl_1 .dig-container { padding: 28px 20px 24px; border-radius: 24px; }
}

/* Digits' colour settings print "color: rgba(0,0,0,0) !important" for the pop-up's inputs with a long selector:
   :not(#mg-z) adds id-level weight so the text and the labels stay visible */
html .dig_lrf_box .minput input:not(#mg-z), html .dig_lrf_box .minput input:not(#mg-z):focus { color: var(--mg-ink) !important; -webkit-text-fill-color: var(--mg-ink) !important; }
html .dig_lrf_box .minput input:not(#mg-z)::placeholder { color: #a9b0ad !important; -webkit-text-fill-color: #a9b0ad !important; opacity: 1; }
html .dig_lrf_box .minput label:not(#mg-z) { display: block !important; color: var(--mg-ink) !important; visibility: visible !important; opacity: 1 !important; }
html .dig_lrf_box .dig_sml_box_msg_head:not(#mg-z), html .dig_lrf_box .dig_verify_code_head:not(#mg-z) { color: var(--mg-ink) !important; }
html .dig_lrf_box .dig_sml_box_msg:not(#mg-z), html .dig_lrf_box .dig_verify_code_msg:not(#mg-z) { color: var(--mg-muted) !important; }
html body .dig-box.dig_pgmdl_2 .dig-cont-close > span { position: static; display: block; line-height: 1; margin: 0; padding: 0; font-size: 22px; transform: none; }
