/* =========================================================
   SHAHAZ.COM — Login / Register page
   All tunable values live in :root so you can adjust exact
   pixel sizes without hunting through the file.

   ✦ 3D UPDATE ✦
   - Primary/secondary buttons now use the pink→magenta
     "add to cart" gradient + a solid extruded edge under
     them (classic app-button 3D). On :active they sink
     down into that edge — press-in feel on every button.
   - The outer card (.shahaz-auth-card) got a 4-layer shadow
     stack so it visually floats above the whole page.
   - Small controls (segment tabs, method tabs, avatar
     button, password-eye button) were shrunk to a
     caption-size footprint and given the same lift/press
     treatment, just scaled down.
   ========================================================= */
:root{
	/* ⚠️ Color Harmonization (২০২৬-০৮-১৮, ব্যবহারকারীর নির্দেশে,
	   "Design → Keep" নীতির আওতায় শুধু রং-টোকেন align করা হলো, কোনো
	   layout/spacing/component পরিবর্তন হয়নি): এই পেজের প্রধান
	   ম্যাজেন্টা টোকেন এখন Luxe Profile পেজের (assets/css/
	   existing site-wide luxury token system) ঠিক একই --magenta মান ব্যবহার করে, যাতে
	   Login → Profile ফ্লোতে (এখন Google/WebAuthn লগইনের পরে এই
	   redirect আরও ঘন ঘন ঘটে) ব্র্যান্ড অ্যাকসেন্ট কালার ধারাবাহিক
	   থাকে। CTA গ্র্যাডিয়েন্ট/গোল্ড/ক্রিম টোকেন ইচ্ছাকৃতভাবে
	   অপরিবর্তিত রাখা হয়েছে (আগে থেকেই যথেষ্ট কাছাকাছি, এবং বাটনের
	   বিদ্যমান 3D গ্র্যাডিয়েন্ট ডিজাইন ভাঙার ঝুঁকি এড়াতে)। */
	--gv-magenta:        #C2185B;
	--gv-magenta-dark:   #7A0F3D;
	--gv-magenta-light:  #E6337F;
	--gv-gold:           #D4AF37;
	--gv-gold-light:     #F3D77A;
	--gv-dark-yellow:    #B8860B;
	--gv-red:            #C0392B;
	--gv-cream:          #FFF7EF;
	--gv-text:           #3A1030;
	--gv-muted:          #8A6E82;

	/* "Add to cart" reference button — pink → magenta gradient,
	   solid maroon edge underneath for the 3D extrusion,
	   soft pink glow shadow further out. Matched to the
	   screenshot's button. */
	--gv-cta-top:        #FF5FA8;
	--gv-cta-mid:        #E6337F;
	--gv-cta-bot:        #C6116B;
	--gv-cta-edge:       #8C0E52;
	--gv-cta-glow:       rgba(198,17,107,.45);

	--gv-gold-edge:      #9C7318;
	--gv-white-edge:     #E3D2AE;

	--gv-radius-card:    32px;
	--gv-radius-field:   18px;
	--gv-radius-pill:    999px;

	--gv-border-w:       1px;      /* "সকল বক্সের বর্ডার হবে ১ পিক্সেল, গোল্ড কালার" */
	--gv-section-gap:    6px;      /* "এক সেকশন থেকে আরেক সেকশনের গ্যাপ হবে ৬ পিক্সেল" */

	/* Requested tab-button box: 50px wide / 17px tall.
	   Kept exactly as specified — used as a min box, with
	   padding auto-expanding so Bengali labels still fit.
	   Tune these two lines if you want the literal 50x17 box. */
	--gv-tab-min-w:      50px;
	--gv-tab-min-h:      17px;

	/* Caption size for the small utility buttons */
	--gv-caption-size:   10.5px;

	/* 3D lift/press amounts — big CTAs vs small chips */
	--gv-lift-lg:        6px;
	--gv-lift-sm:        3px;
}

.shahaz-auth-vault-page{
	min-height:100vh;
	display:flex;
	align-items:center;
	justify-content:center;
	padding:8px 16px;
	background:
		radial-gradient(circle at 15% 10%, rgba(255,255,255,.15) 0, transparent 3%),
		radial-gradient(circle at 85% 20%, rgba(255,255,255,.12) 0, transparent 3%),
		radial-gradient(circle at 10% 90%, rgba(255,255,255,.10) 0, transparent 3%),
		linear-gradient(160deg, #E6127A 0%, #A3105C 55%, #7A0E4E 100%);
	font-family:"Hind Siliguri","Noto Sans Bengali",system-ui,sans-serif;
}

/* ---------- Outer card: 4-layer 3D stack so it reads as the
   top-most surface on the page, per request. ---------- */
.shahaz-auth-card{
	width:100%;
	max-width:460px;
	background:var(--gv-cream);
	border-radius:var(--gv-radius-card);
	border:2px solid #FF1493;
	box-shadow:
		0 1px 0 rgba(255,255,255,.75) inset,          /* layer 1: glassy top rim   */
		0 16px 14px -10px rgba(122,14,78,.55),        /* layer 2: contact shadow  */
		0 40px 34px -18px rgba(122,14,78,.42),        /* layer 3: lift shadow     */
		0 75px 60px -28px rgba(40,4,26,.45);          /* layer 4: floating shadow */
	overflow:hidden;
	position:relative;
	z-index:2;
}

/* ---------- Header ---------- */
.shahaz-auth-header{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:12px;
	padding:22px 24px;
	border-bottom:1px solid rgba(212,175,55,.35);
}
.shahaz-auth-brand{display:flex;align-items:center;gap:12px;}
.shahaz-auth-logo{
	position:relative;
	width:54px;height:54px;flex:0 0 54px;
	display:inline-flex;align-items:center;justify-content:center;
	box-sizing:border-box;
	border:2px solid #D4AF37;
	border-radius:50%;
	background:radial-gradient(circle at 35% 25%, #fff8d6 0%, #f4d77a 24%, #c99725 68%, #8d6519 100%);
	box-shadow:
		0 2px 0 #8f681b,
		0 4px 8px rgba(82, 48, 0, 0.32),
		inset 0 1px 0 rgba(255,255,255,0.95),
		inset 0 -2px 4px rgba(112, 72, 8, 0.32);
	overflow:hidden;
	line-height:0;
	flex:none;
}
.shahaz-auth-logo::after{
	content:"";
	position:absolute;
	inset:2px;
	border-radius:50%;
	border:1px solid rgba(255, 247, 190, 0.72);
	box-shadow:inset 0 1px 2px rgba(255,255,255,0.45);
	pointer-events:none;
}
.shahaz-auth-logo img{
	display:block;
	width:46px;height:46px;
	max-width:none;
	object-fit:cover;
	border-radius:50%;
	filter:saturate(1.04) contrast(1.03);
}
.shahaz-auth-brand-name{font-weight:700;font-size:18px;color:var(--gv-text);line-height:1.2;}
.shahaz-auth-brand-sub{font-size:12px;color:var(--gv-muted);}

/* Login/Register segmented pill (top right) — small "chip"
   buttons: caption size + light 3D lift/press. */
.shahaz-auth-segment{
	display:flex;
	background:#FBE9F1;
	border:var(--gv-border-w) solid var(--gv-gold);
	border-radius:var(--gv-radius-pill);
	padding:3px;
	flex:none;
	box-shadow:inset 0 1px 3px rgba(122,14,78,.15);
}
.shahaz-auth-segment a{
	display:flex;align-items:center;justify-content:center;
	min-width:var(--gv-tab-min-w);
	min-height:var(--gv-tab-min-h);
	padding:6px 14px;
	border-radius:var(--gv-radius-pill);
	font-size:var(--gv-caption-size);font-weight:700;
	letter-spacing:.2px;
	color:var(--gv-magenta-dark);
	text-decoration:none;
	white-space:nowrap;
	transition:background .25s ease,color .25s ease,transform .12s ease,box-shadow .12s ease;
	transform:translateY(0);
	/* 3D finishing only — size, spacing and layout remain unchanged. */
	box-shadow:inset 0 1px 0 rgba(255,255,255,.92), inset 0 -2px 0 rgba(122,14,78,.16), 0 2px 0 rgba(183,139,32,.30), 0 4px 8px rgba(122,14,78,.12);
}
.shahaz-auth-segment a.is-active{
	background:linear-gradient(180deg, var(--gv-cta-top) 0%, var(--gv-cta-mid) 55%, var(--gv-cta-bot) 100%);
	color:#fff;
	box-shadow:inset 0 1px 0 rgba(255,255,255,.45), inset 0 -2px 0 rgba(122,14,78,.28), 0 var(--gv-lift-sm) 0 var(--gv-cta-edge), 0 6px 10px var(--gv-cta-glow);
}
.shahaz-auth-segment a:hover:not(.is-active){
	background:var(--gv-gold);
	color:var(--gv-red);
	box-shadow:inset 0 1px 0 rgba(255,255,255,.8), inset 0 -2px 0 rgba(122,14,78,.18), 0 3px 0 rgba(183,139,32,.38), 0 5px 9px rgba(122,14,78,.14);
}
.shahaz-auth-segment a:active{
	transform:translateY(var(--gv-lift-sm));
	box-shadow:0 0 0 var(--gv-cta-edge), 0 2px 4px var(--gv-cta-glow);
}

/* ---------- Method tabs: পাসওয়ার্ড / ওটিপি / বায়োমেট্রিক ----------
   Small chip buttons — shrunk to caption size, same lift/press
   language as every other button on the page. */
.shahaz-auth-methods{
	display:flex;
	gap:8px;
	padding:20px 24px;
	border-bottom:1px solid rgba(212,175,55,.35);
	margin-bottom:var(--gv-section-gap);
}
.shahaz-auth-method{
	flex:1;
	display:flex;flex-direction:column;align-items:center;gap:5px;
	padding:10px 6px;
	border:var(--gv-border-w) solid var(--gv-gold);
	border-radius:16px;
	background:#fff;
	color:var(--gv-muted);
	font-size:var(--gv-caption-size);font-weight:700;
	letter-spacing:.15px;
	cursor:pointer;
	transition:background .25s ease,color .25s ease,border-color .25s ease,transform .12s ease,box-shadow .12s ease;
	transform:translateY(0);
	box-shadow:0 var(--gv-lift-sm) 0 var(--gv-white-edge), 0 5px 8px rgba(122,14,78,.12);
}
.shahaz-auth-method svg{width:16px;height:16px;}
.shahaz-auth-method.is-active{
	background:linear-gradient(180deg, var(--gv-cta-top) 0%, var(--gv-cta-mid) 55%, var(--gv-cta-bot) 100%);
	color:#fff;border-color:var(--gv-cta-edge);
	box-shadow:0 var(--gv-lift-sm) 0 var(--gv-cta-edge), 0 6px 10px var(--gv-cta-glow);
}
.shahaz-auth-method:hover:not(.is-active){
	background:var(--gv-gold);
	color:var(--gv-red);
	border-color:var(--gv-gold);
}
.shahaz-auth-method:active{
	transform:translateY(var(--gv-lift-sm));
	box-shadow:0 0 0 var(--gv-cta-edge), 0 2px 4px rgba(122,14,78,.25);
}

/* ---------- Body / form sections ---------- */
.shahaz-auth-body{padding:8px 24px 28px;}
.shahaz-auth-title{
	font-size:28px;font-weight:700;color:var(--gv-text);
	margin:10px 0 var(--gv-section-gap);
	display:flex;align-items:center;gap:8px;
}
.shahaz-auth-title .spark{color:var(--gv-gold);}

/* ---------- Profile photo upload (register) ---------- */
.shahaz-auth-avatar-field{display:flex;flex-direction:column;align-items:center;}
.shahaz-auth-avatar-upload{display:flex;flex-direction:column;align-items:center;gap:10px;}
.shahaz-auth-avatar-preview{
	width:84px;height:84px;border-radius:50%;
	border:var(--gv-border-w) solid var(--gv-gold);
	background:#fff;
	display:flex;align-items:center;justify-content:center;
	color:var(--gv-muted);
	cursor:pointer;overflow:hidden;
	box-shadow:0 4px 0 var(--gv-white-edge), 0 8px 14px rgba(122,14,78,.2);
	transition:transform .12s ease, box-shadow .12s ease;
}
.shahaz-auth-avatar-preview:active{
	transform:translateY(4px);
	box-shadow:0 0 0 var(--gv-white-edge), 0 3px 6px rgba(122,14,78,.15);
}
.shahaz-auth-avatar-preview svg{width:34px;height:34px;}
.shahaz-auth-avatar-preview img{width:100%;height:100%;object-fit:cover;}
.shahaz-auth-avatar-btn{
	font-size:var(--gv-caption-size);font-weight:700;color:#fff;
	border:none;
	border-radius:var(--gv-radius-pill);
	padding:5px 14px;cursor:pointer;
	background:linear-gradient(180deg, var(--gv-cta-top) 0%, var(--gv-cta-mid) 55%, var(--gv-cta-bot) 100%);
	box-shadow:0 var(--gv-lift-sm) 0 var(--gv-cta-edge), 0 5px 8px var(--gv-cta-glow);
	transition:background .25s ease,color .25s ease,transform .12s ease,box-shadow .12s ease;
	transform:translateY(0);
}
.shahaz-auth-avatar-btn:hover{filter:brightness(1.05);}
.shahaz-auth-avatar-btn:active{
	transform:translateY(var(--gv-lift-sm));
	box-shadow:0 0 0 var(--gv-cta-edge), 0 2px 4px var(--gv-cta-glow);
}

.shahaz-auth-field{margin-bottom:var(--gv-section-gap);}
.shahaz-auth-field label{
	display:block;font-size:13px;font-weight:600;
	color:var(--gv-text);margin-bottom:8px;
}
.shahaz-auth-input-wrap{position:relative;}
.shahaz-auth-input-wrap input{
	width:100%;
	padding:16px 44px 16px 18px;
	border:var(--gv-border-w) solid var(--gv-gold);
	border-radius:var(--gv-radius-field);
	background:#fff;
	font-size:15px;color:var(--gv-text);
	outline:none;
	box-shadow:inset 0 2px 4px rgba(122,14,78,.08);
	transition:border-color .2s ease, box-shadow .2s ease;
}
.shahaz-auth-input-wrap input::placeholder{color:#B9A6B4;}
.shahaz-auth-input-wrap input:focus{
	border-color:var(--gv-magenta);
	box-shadow:inset 0 2px 4px rgba(122,14,78,.08), 0 0 0 3px rgba(198,17,107,.12);
}
.shahaz-auth-input-wrap .icon-left{
	position:absolute;left:14px;top:50%;transform:translateY(-50%);
	color:var(--gv-magenta);
}
.shahaz-auth-input-wrap .icon-left ~ input{padding-left:42px;}

/* Small icon button (show/hide password) — caption-scale 3D chip */
.shahaz-auth-toggle-pass{
	position:absolute;right:10px;top:50%;transform:translateY(-50%);
	background:#fff;
	border:1px solid var(--gv-gold);
	border-radius:50%;
	cursor:pointer;color:var(--gv-muted);
	width:26px;height:26px;
	display:flex;align-items:center;justify-content:center;
	padding:0;
	box-shadow:0 2px 0 var(--gv-white-edge), 0 4px 6px rgba(122,14,78,.15);
	transition:transform .12s ease, box-shadow .12s ease, color .2s ease;
}
.shahaz-auth-toggle-pass svg{width:14px;height:14px;}
.shahaz-auth-toggle-pass:active{
	transform:translateY(-50%) translateY(2px);
	box-shadow:0 0 0 var(--gv-white-edge), 0 2px 3px rgba(122,14,78,.12);
}
.shahaz-auth-toggle-pass.is-visible{color:var(--gv-magenta);border-color:var(--gv-magenta);}

.shahaz-auth-row-between{
	display:flex;align-items:center;justify-content:space-between;
	margin-bottom:var(--gv-section-gap);
	font-size:13px;
}
.shahaz-auth-remember{display:flex;align-items:center;gap:8px;color:var(--gv-text);}
.shahaz-auth-remember input[type="checkbox"]{
	appearance:none;width:18px;height:18px;border-radius:50%;
	border:var(--gv-border-w) solid var(--gv-gold);
	display:inline-block;position:relative;cursor:pointer;flex:0 0 18px;
	background:#fff;box-shadow:inset 0 2px 3px rgba(122,14,78,.15);
	transition:background .15s ease,border-color .15s ease,box-shadow .15s ease,transform .12s ease;
}
.shahaz-auth-remember input[type="checkbox"]::after{
	content:'✓';position:absolute;left:50%;top:50%;
	transform:translate(-50%,-54%) scale(0);
	font-size:12px;line-height:1;font-weight:900;color:#fff;
	opacity:0;transition:transform .14s ease,opacity .14s ease;
}
.shahaz-auth-remember input[type="checkbox"]:checked{
	background:var(--gv-magenta);border-color:var(--gv-magenta);
	box-shadow:0 2px 5px rgba(217,20,126,.28),inset 0 1px 2px rgba(0,0,0,.2);
}
.shahaz-auth-remember input[type="checkbox"]:checked::after{
	transform:translate(-50%,-54%) scale(1);opacity:1;
}
.shahaz-auth-remember input[type="checkbox"]:focus-visible{
	outline:2px solid var(--gv-magenta);outline-offset:2px;
}
.shahaz-auth-link{color:var(--gv-magenta);text-decoration:none;font-weight:600;}
.shahaz-auth-link:hover{color:var(--gv-red);}

/* Password strength meter (register page) */
.shahaz-auth-strength{display:flex;align-items:center;gap:6px;margin:-2px 0 var(--gv-section-gap);}
.shahaz-auth-strength i{flex:1;height:4px;border-radius:2px;background:#EADCE3;}
.shahaz-auth-strength span{font-size:12px;color:var(--gv-muted);}

/* ---------- Primary CTA ----------
   Matched to the "+ কার্টে যোগ" screenshot: pink → magenta
   vertical gradient, bold white label, a solid maroon "edge"
   directly under it for the extruded 3D block, plus a soft
   colored glow further out. Presses flush into the edge. */
.shahaz-auth-btn-primary{
	position:relative;
	display:flex;align-items:center;justify-content:center;gap:8px;
	width:100%;
	padding:16px 24px;
	border:none;
	border-radius:var(--gv-radius-pill);
	background:linear-gradient(180deg, var(--gv-cta-top) 0%, var(--gv-cta-mid) 55%, var(--gv-cta-bot) 100%);
	color:#fff;
	font-size:16px;font-weight:700;
	letter-spacing:.2px;
	cursor:pointer;
	box-shadow:
		0 var(--gv-lift-lg) 0 var(--gv-cta-edge),
		0 16px 22px var(--gv-cta-glow),
		inset 0 1px 0 rgba(255,255,255,.5);
	transform:translateY(0);
	transition:transform .12s ease, box-shadow .12s ease, filter .15s ease;
	margin-bottom:var(--gv-section-gap);
}
.shahaz-auth-btn-primary:hover{
	filter:brightness(1.06);
}
.shahaz-auth-btn-primary:active{
	transform:translateY(var(--gv-lift-lg));
	box-shadow:
		0 0 0 var(--gv-cta-edge),
		0 6px 10px var(--gv-cta-glow),
		inset 0 1px 0 rgba(255,255,255,.35);
}
.shahaz-auth-btn-primary:disabled{opacity:.6;cursor:not-allowed;}

/* ---------- Generic secondary buttons ---------- */
.shahaz-auth-btn-secondary{
	display:flex;align-items:center;justify-content:center;gap:10px;
	width:100%;
	padding:14px 20px;
	border:none;
	border-radius:var(--gv-radius-pill);
	background:linear-gradient(180deg, var(--gv-magenta-light) 0%, var(--gv-magenta) 100%);
	color:#fff;
	font-size:15px;font-weight:700;
	cursor:pointer;
	box-shadow:0 var(--gv-lift-lg) 0 var(--gv-cta-edge), 0 12px 18px var(--gv-cta-glow);
	transform:translateY(0);
	transition:background .25s ease,color .25s ease,transform .12s ease,box-shadow .12s ease;
	margin-bottom:var(--gv-section-gap);
}
.shahaz-auth-btn-secondary:hover{ filter:brightness(1.05); }
.shahaz-auth-btn-secondary:active{
	transform:translateY(var(--gv-lift-lg));
	box-shadow:0 0 0 var(--gv-cta-edge), 0 5px 8px var(--gv-cta-glow);
}

/* Google button stays neutral/white per the brand mark, border gold —
   still gets the same lift/press language, just in a gold key. */
.shahaz-auth-btn-google{
	display:flex;align-items:center;justify-content:center;gap:10px;
	width:100%;
	padding:14px 20px;
	border:var(--gv-border-w) solid var(--gv-gold);
	border-radius:var(--gv-radius-pill);
	background:#fff;
	color:var(--gv-text);
	font-size:15px;font-weight:600;
	cursor:pointer;
	box-shadow:0 var(--gv-lift-sm) 0 var(--gv-white-edge), 0 10px 16px rgba(122,14,78,.18);
	transform:translateY(0);
	transition:background .25s ease,border-color .25s ease,transform .12s ease,box-shadow .12s ease;
}
.shahaz-auth-btn-google:hover{background:#FFF3D6;border-color:var(--gv-gold);}
.shahaz-auth-btn-google:active{
	transform:translateY(var(--gv-lift-sm));
	box-shadow:0 0 0 var(--gv-white-edge), 0 4px 8px rgba(122,14,78,.14);
}
.shahaz-auth-btn-google svg{width:20px;height:20px;}

.shahaz-auth-divider{
	display:flex;align-items:center;gap:12px;
	color:var(--gv-muted);font-size:13px;
	margin:var(--gv-section-gap) 0;
}
.shahaz-auth-divider::before,.shahaz-auth-divider::after{
	content:"";flex:1;height:1px;background:rgba(212,175,55,.4);
}

.shahaz-auth-footnote{
	text-align:center;font-size:11px;color:var(--gv-muted);
	margin-top:var(--gv-section-gap);
	display:flex;align-items:center;justify-content:center;gap:6px;flex-wrap:wrap;
}
.shahaz-auth-footnote svg{width:14px;height:14px;color:var(--gv-gold);}

/* ---------- OTP-only view ---------- */
.shahaz-auth-otp-pad{
	border:var(--gv-border-w) solid var(--gv-gold);
	border-radius:var(--gv-radius-field);
	padding:26px;
	text-align:center;
	margin-bottom:var(--gv-section-gap);
	background:#FFF3F8;
	box-shadow:0 10px 18px -8px rgba(122,14,78,.25), inset 0 1px 0 rgba(255,255,255,.6);
}
.shahaz-auth-otp-inputs{display:flex;gap:8px;justify-content:center;margin:14px 0;}
.shahaz-auth-otp-inputs input{
	width:42px;height:52px;text-align:center;font-size:20px;
	border:var(--gv-border-w) solid var(--gv-gold);border-radius:10px;
	box-shadow:inset 0 2px 4px rgba(122,14,78,.15);
}
.shahaz-auth-otp-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:12px;color:var(--gv-muted);margin:0 0 var(--gv-section-gap);}
.shahaz-auth-otp-meta button{background:none;border:0;padding:0;font:inherit;cursor:pointer;}
.shahaz-auth-otp-meta button:disabled{opacity:.5;cursor:not-allowed;}
.shahaz-auth-panel-reset .shahaz-auth-title{margin-bottom:var(--gv-section-gap);}

/* ---------- Biometric-only view ---------- */
.shahaz-auth-biometric-pad{
	border:var(--gv-border-w) solid var(--gv-gold);
	border-radius:var(--gv-radius-field);
	padding:32px;
	text-align:center;
	margin-bottom:var(--gv-section-gap);
	background:#FFF3F8;
	cursor:pointer;
	font-size:var(--gv-caption-size);font-weight:700;color:var(--gv-muted);
	box-shadow:0 10px 18px -8px rgba(122,14,78,.25), inset 0 1px 0 rgba(255,255,255,.6);
	transition:transform .12s ease, box-shadow .12s ease;
}
.shahaz-auth-biometric-pad:active{
	transform:translateY(3px);
	box-shadow:0 4px 8px -4px rgba(122,14,78,.2), inset 0 1px 0 rgba(255,255,255,.5);
}
.shahaz-auth-fingerprint-btn{
	width:90px;height:90px;border-radius:50%;
	margin:0 auto 14px;
	display:flex;align-items:center;justify-content:center;
	background:linear-gradient(180deg, var(--gv-cta-top) 0%, var(--gv-cta-mid) 55%, var(--gv-cta-bot) 100%);
	color:#fff;
	box-shadow:0 var(--gv-lift-lg) 0 var(--gv-cta-edge), 0 0 0 8px rgba(198,17,107,.12), 0 14px 20px var(--gv-cta-glow);
	transition:transform .12s ease, box-shadow .12s ease;
}
.shahaz-auth-biometric-pad:active .shahaz-auth-fingerprint-btn{
	transform:translateY(var(--gv-lift-lg));
	box-shadow:0 0 0 var(--gv-cta-edge), 0 0 0 8px rgba(198,17,107,.12), 0 6px 10px var(--gv-cta-glow);
}
.shahaz-auth-fingerprint-btn svg{width:34px;height:34px;}

/* ---------- Errors / notices ---------- */
.shahaz-auth-notice{
	border:var(--gv-border-w) solid var(--gv-red);
	background:#FBEAE8;color:var(--gv-red);
	border-radius:var(--gv-radius-field);
	padding:12px 16px;font-size:13px;
	margin-bottom:var(--gv-section-gap);
}

@media (max-width:480px){
	.shahaz-auth-header{padding:18px;}
	.shahaz-auth-body{padding:6px 18px 22px;}
	.shahaz-auth-title{font-size:24px;}
}

/* =========================================================
   BUTTON FINISHING PASS — Login / Create Account
   Visual-only polish. No functionality, markup or spacing
   logic is changed. All controls keep the existing behavior.
   ========================================================= */

/* Shared premium button language */
.shahaz-auth-segment a,
.shahaz-auth-method,
.shahaz-auth-toggle-pass,
.shahaz-auth-btn-primary,
.shahaz-auth-btn-secondary,
.shahaz-auth-btn-google,
.shahaz-auth-fingerprint-btn,
.shahaz-auth-avatar-btn{
	-webkit-tap-highlight-color:transparent;
	user-select:none;
}

/* Premium highlight + cleaner edge on large CTA buttons */
.shahaz-auth-btn-primary,
.shahaz-auth-btn-secondary{
	border:1px solid rgba(255,255,255,.32);
	position:relative;
	overflow:hidden;
	isolation:isolate;
}

.shahaz-auth-btn-primary::before,
.shahaz-auth-btn-secondary::before{
	content:"";
	position:absolute;
	inset:1px 1px auto;
	height:42%;
	border-radius:inherit;
	background:linear-gradient(180deg,rgba(255,255,255,.26),rgba(255,255,255,0));
	pointer-events:none;
	z-index:-1;
}

.shahaz-auth-btn-primary:hover,
.shahaz-auth-btn-secondary:hover{
	filter:brightness(1.07) saturate(1.06);
	box-shadow:
		0 var(--gv-lift-lg) 0 var(--gv-cta-edge),
		0 18px 26px var(--gv-cta-glow),
		inset 0 1px 0 rgba(255,255,255,.65),
		inset 0 -1px 0 rgba(122,14,78,.18);
}

.shahaz-auth-btn-primary:focus-visible,
.shahaz-auth-btn-secondary:focus-visible,
.shahaz-auth-btn-google:focus-visible,
.shahaz-auth-avatar-btn:focus-visible{
	outline:2px solid #FF1493;
	outline-offset:3px;
}

/* Google: premium white/glass finish without changing its neutral identity */
.shahaz-auth-btn-google{
	position:relative;
	overflow:hidden;
	border-width:1.5px;
	box-shadow:
		0 var(--gv-lift-sm) 0 var(--gv-white-edge),
		0 10px 18px rgba(122,14,78,.16),
		inset 0 1px 0 rgba(255,255,255,.95);
}
.shahaz-auth-btn-google::before{
	content:"";
	position:absolute;
	left:-120%;
	top:0;
	width:70%;
	height:100%;
	transform:skewX(-20deg);
	background:linear-gradient(90deg,transparent,rgba(255,255,255,.62),transparent);
	transition:left .55s ease;
	pointer-events:none;
}
.shahaz-auth-btn-google:hover::before{left:140%;}
.shahaz-auth-btn-google:hover{
	background:linear-gradient(180deg,#fff,#FFF9EF);
	border-color:var(--gv-gold);
	transform:translateY(-1px);
	box-shadow:
		0 calc(var(--gv-lift-sm) + 1px) 0 var(--gv-white-edge),
		0 13px 20px rgba(122,14,78,.18),
		inset 0 1px 0 rgba(255,255,255,1);
}
.shahaz-auth-btn-google:active{
	transform:translateY(var(--gv-lift-sm));
}

/* Top Login/Register switch: sharper premium active state */
.shahaz-auth-segment{
	border-width:1.5px;
	box-shadow:
		inset 0 1px 3px rgba(122,14,78,.13),
		0 2px 6px rgba(122,14,78,.08);
}
.shahaz-auth-segment a.is-active{
	box-shadow:
		0 var(--gv-lift-sm) 0 var(--gv-cta-edge),
		0 7px 12px var(--gv-cta-glow),
		inset 0 1px 0 rgba(255,255,255,.5);
}
.shahaz-auth-segment a:hover:not(.is-active){
	background:linear-gradient(180deg,#F8E7B5,#D4AF37);
	color:var(--gv-red);
	transform:translateY(-1px);
}

/* Password / OTP / Biometric method cards */
.shahaz-auth-method{
	position:relative;
	overflow:hidden;
	border-width:1.5px;
	box-shadow:
		0 var(--gv-lift-sm) 0 var(--gv-white-edge),
		0 7px 12px rgba(122,14,78,.10),
		inset 0 1px 0 rgba(255,255,255,.9);
}
.shahaz-auth-method::after{
	content:"";
	position:absolute;
	inset:1px;
	border-radius:inherit;
	border:1px solid rgba(255,255,255,.42);
	pointer-events:none;
}
.shahaz-auth-method:hover:not(.is-active){
	background:linear-gradient(180deg,#FFFDF7,#F5E5B9);
	color:var(--gv-magenta-dark);
	border-color:var(--gv-gold);
	transform:translateY(-1px);
	box-shadow:
		0 calc(var(--gv-lift-sm) + 1px) 0 var(--gv-white-edge),
		0 9px 14px rgba(122,14,78,.13),
		inset 0 1px 0 rgba(255,255,255,.95);
}
.shahaz-auth-method.is-active{
	border-color:#FF1493;
	box-shadow:
		0 var(--gv-lift-sm) 0 var(--gv-cta-edge),
		0 8px 13px var(--gv-cta-glow),
		inset 0 1px 0 rgba(255,255,255,.55);
}
.shahaz-auth-method:focus-visible{
	outline:2px solid #FF1493;
	outline-offset:2px;
}

/* Password visibility icon: tiny luxury control */
.shahaz-auth-toggle-pass{
	border-width:1.5px;
	border-color:var(--gv-gold);
	background:linear-gradient(180deg,#fff,#FFF9EF);
	box-shadow:
		0 2px 0 var(--gv-white-edge),
		0 5px 8px rgba(122,14,78,.13),
		inset 0 1px 0 rgba(255,255,255,.95);
}
.shahaz-auth-toggle-pass:hover{
	color:var(--gv-magenta);
	border-color:#FF1493;
	transform:translateY(-50%) translateY(-1px);
	box-shadow:
		0 3px 0 var(--gv-white-edge),
		0 6px 10px rgba(198,17,107,.18),
		inset 0 1px 0 rgba(255,255,255,1);
}
.shahaz-auth-toggle-pass:focus-visible{
	outline:2px solid #FF1493;
	outline-offset:2px;
}

/* Fingerprint action gets the same polished magenta/gold language */
.shahaz-auth-fingerprint-btn{
	position:relative;
	overflow:hidden;
	border:1px solid rgba(255,255,255,.35);
}
.shahaz-auth-fingerprint-btn::after{
	content:"";
	position:absolute;
	inset:4px;
	border-radius:50%;
	border:1px solid rgba(255,255,255,.28);
	pointer-events:none;
}
.shahaz-auth-biometric-pad:hover .shahaz-auth-fingerprint-btn{
	transform:translateY(-2px);
	box-shadow:
		0 calc(var(--gv-lift-lg) + 2px) 0 var(--gv-cta-edge),
		0 0 0 8px rgba(198,17,107,.12),
		0 18px 24px var(--gv-cta-glow),
		inset 0 1px 0 rgba(255,255,255,.55);
}

/* Register profile-upload button */
.shahaz-auth-avatar-btn{
	border:1px solid rgba(255,255,255,.35);
	box-shadow:
		0 var(--gv-lift-sm) 0 var(--gv-cta-edge),
		0 7px 11px var(--gv-cta-glow),
		inset 0 1px 0 rgba(255,255,255,.5);
}
.shahaz-auth-avatar-btn:hover{
	filter:brightness(1.07) saturate(1.05);
	transform:translateY(-1px);
	box-shadow:
		0 calc(var(--gv-lift-sm) + 1px) 0 var(--gv-cta-edge),
		0 9px 13px var(--gv-cta-glow),
		inset 0 1px 0 rgba(255,255,255,.6);
}

/* Consistent disabled appearance */
.shahaz-auth-btn-primary:disabled,
.shahaz-auth-btn-secondary:disabled,
.shahaz-auth-btn-google:disabled,
.shahaz-auth-method:disabled{
	filter:grayscale(.15);
	box-shadow:0 2px 0 rgba(122,14,78,.18);
	transform:none;
}

@media (prefers-reduced-motion:reduce){
	.shahaz-auth-segment a,
	.shahaz-auth-method,
	.shahaz-auth-toggle-pass,
	.shahaz-auth-btn-primary,
	.shahaz-auth-btn-secondary,
	.shahaz-auth-btn-google,
	.shahaz-auth-fingerprint-btn,
	.shahaz-auth-avatar-btn,
	.shahaz-auth-btn-google::before{
		transition:none;
	}
}

/* =========================================================
   BIOMETRIC FINGERPRINT BUTTON — FLAT MOBILE-STYLE FINISH
   Design-only refinement. WebAuthn trigger/functionality unchanged.
   ========================================================= */
.shahaz-auth-biometric-pad{
	border:2px solid #FF1493;
	border-radius:18px;
	padding:14px;
	background:#FFF7FB;
	box-shadow:none;
	transform:none;
	transition:border-color .18s ease, background-color .18s ease;
}
.shahaz-auth-biometric-pad:hover{
	border-color:#FF1493;
	background:#FFF1F8;
	box-shadow:none;
	transform:none;
}
.shahaz-auth-biometric-pad:active{
	transform:none;
	box-shadow:none;
	background:#FFE8F3;
}
.shahaz-auth-fingerprint-btn{
	width:86px;
	height:86px;
	min-width:86px;
	padding:0;
	margin:0 auto 12px;
	border-radius:50%;
	display:flex;
	align-items:center;
	justify-content:center;
	background:#FF1493;
	color:#fff;
	border:2px solid rgba(255,255,255,.95);
	box-shadow:0 0 0 2px rgba(255,20,147,.18);
	transform:none;
	transition:background-color .18s ease, box-shadow .18s ease, transform .18s ease;
	appearance:none;
}
.shahaz-auth-fingerprint-btn::after{
	inset:3px;
	border:1px solid rgba(255,255,255,.28);
	border-radius:50%;
}
.shahaz-auth-fingerprint-btn svg{
	width:52px;
	height:52px;
	stroke-width:1.7;
	filter:none;
}
.shahaz-auth-biometric-pad:hover .shahaz-auth-fingerprint-btn,
.shahaz-auth-biometric-pad:active .shahaz-auth-fingerprint-btn{
	transform:none;
	box-shadow:none;
}
.shahaz-auth-biometric-pad > :not(.shahaz-auth-fingerprint-btn){
	position:relative;
	z-index:1;
}
@media (max-width:480px){
	.shahaz-auth-fingerprint-btn{width:82px;height:82px;min-width:82px;}
	.shahaz-auth-fingerprint-btn svg{width:50px;height:50px;}
}


/* =========================================================
   FINAL VISUAL REFINEMENT — TOP SWITCH + LOGIN CTA + BRAND
   Only the three requested visual areas are adjusted.
   Existing functionality/markup behavior remains unchanged.
   ========================================================= */

/* 1) Main Login CTA: Hot Magenta → Hot Orange gradient */
.shahaz-auth-btn-primary{
	background:linear-gradient(90deg,#FF1493 0%,#FF0F87 42%,#FF5A00 100%);
	color:#fff;
}
.shahaz-auth-btn-primary:hover{
	filter:brightness(1.05) saturate(1.05);
}

/* 2) Top Login / Register: two independent slim capsules,
      gold 2px borders, kept comfortably inside the card. */
.shahaz-auth-segment{
	background:transparent;
	border:0;
	border-radius:0;
	padding:0;
	gap:6px;
	margin-right:6px;
	box-shadow:none;
	display:flex;
	align-items:center;
	flex:none;
}
.shahaz-auth-segment a{
	min-width:0;
	min-height:0;
	padding:6px 13px;
	border:2px solid #D4AF37;
	border-radius:999px;
	background:#FFFDF8;
	color:var(--gv-magenta-dark);
	box-shadow:none;
	transform:none;
}
.shahaz-auth-segment a.is-active{
	background:linear-gradient(90deg,#FF1493 0%,#FF0F87 60%,#FF5A00 100%);
	color:#fff;
	border-color:#D4AF37;
	box-shadow:inset 0 1px 0 rgba(255,255,255,.45);
}
.shahaz-auth-segment a:hover:not(.is-active){
	background:#FFF7DF;
	color:var(--gv-magenta-dark);
	border-color:#D4AF37;
	transform:none;
}
.shahaz-auth-segment a:active{
	transform:scale(.98);
	box-shadow:none;
}

/* 3) Brand: remove subtitle and place SHAHAZ.COM lower + centered
      within the brand text area. */
.shahaz-auth-brand > div{
	text-align:center;
}
.shahaz-auth-brand-name{
	margin-top:8px;
	line-height:1.15;
	text-align:center;
}

@media (max-width:480px){
	.shahaz-auth-segment{
		gap:4px;
		margin-right:2px;
	}
	.shahaz-auth-segment a{
		padding:5px 10px;
		font-size:12px;
	}
}

/* =========================================================
   PHASE 129 — PROFILE LOGIN CONTROL REFINEMENT
   Visual-only refinement requested after PHASE 128.
   No markup, authentication, AJAX/REST, nonce, redirect or
   form behaviour is changed.
   ========================================================= */

/* Top-right LOGIN / REGISTER: compact luxury capsules.
   Keep both controls independent so the active state is clear. */
.shahaz-auth-segment{
	gap:5px;
	align-items:center;
	margin-right:0;
}
.shahaz-auth-segment a{
	min-width:0;
	min-height:0;
	height:36px;
	padding:0 14px;
	box-sizing:border-box;
	border:1.5px solid var(--gv-gold);
	border-radius:999px;
	background:#FFFDF8;
	color:var(--gv-magenta-dark);
	font-size:13px;
	font-weight:700;
	line-height:1;
	box-shadow:
		0 2px 0 var(--gv-gold-edge),
		0 4px 8px rgba(122,14,78,.12),
		inset 0 1px 0 rgba(255,255,255,.95);
	transform:translateY(0);
	transition:filter .15s ease,box-shadow .15s ease;
}
.shahaz-auth-segment a.is-active{
	background:linear-gradient(180deg,#FF3FA0 0%,#E91682 62%,#C6116B 100%);
	color:#fff;
	border-color:#D4AF37;
	box-shadow:
		0 2px 0 #9C7318,
		0 5px 10px rgba(198,17,107,.22),
		inset 0 1px 0 rgba(255,255,255,.42);
}
.shahaz-auth-segment a:hover:not(.is-active){
	background:#FFF8E8;
	color:var(--gv-magenta-dark);
	transform:none;
	filter:brightness(1.02);
	box-shadow:
		0 2px 0 var(--gv-gold-edge),
		0 5px 9px rgba(122,14,78,.14),
		inset 0 1px 0 rgba(255,255,255,1);
}
.shahaz-auth-segment a.is-active:hover{
	filter:brightness(1.04);
}
.shahaz-auth-segment a:active{
	transform:translateY(2px);
	box-shadow:
		0 0 0 var(--gv-gold-edge),
		0 2px 4px rgba(122,14,78,.16),
		inset 0 1px 0 rgba(255,255,255,.3);
}

/* PASSWORD / OTP / BIOMETRIC: compact utility tabs rather than
   large cards. They remain easy to tap while consuming less space. */
.shahaz-auth-methods{
	gap:8px;
	padding:12px 18px;
	margin-bottom:var(--gv-section-gap);
}
.shahaz-auth-method{
	min-height:48px;
	padding:7px 5px;
	box-sizing:border-box;
	gap:3px;
	border-width:1.5px;
	border-radius:14px;
	font-size:12px;
	line-height:1.15;
	box-shadow:
		0 2px 0 var(--gv-white-edge),
		0 4px 8px rgba(122,14,78,.09),
		inset 0 1px 0 rgba(255,255,255,.95);
}
.shahaz-auth-method svg{width:15px;height:15px;}
.shahaz-auth-method::after{inset:1px;}
.shahaz-auth-method.is-active{
	box-shadow:
		0 2px 0 var(--gv-cta-edge),
		0 5px 9px rgba(198,17,107,.20),
		inset 0 1px 0 rgba(255,255,255,.5);
}
.shahaz-auth-method:active{
	transform:translateY(2px);
	box-shadow:
		0 0 0 var(--gv-cta-edge),
		0 2px 4px rgba(122,14,78,.18);
}

/* Main LOGIN CTA: shorter, cleaner and more dimensional.
   The small lower edge gives a real button depth without the
   oversized 3D extrusion seen previously. */
.shahaz-auth-btn-primary{
	min-height:52px;
	padding:11px 20px;
	border:1px solid rgba(255,255,255,.35);
	border-radius:999px;
	background:linear-gradient(90deg,#FF1493 0%,#F20B86 48%,#FF5A00 100%);
	box-shadow:
		0 4px 0 #8C0E52,
		0 10px 16px rgba(198,17,107,.25),
		inset 0 1px 0 rgba(255,255,255,.52),
		inset 0 -1px 0 rgba(122,14,78,.16);
	transform:translateY(0);
	transition:filter .15s ease,box-shadow .12s ease,transform .12s ease;
	margin-bottom:var(--gv-section-gap);
}
.shahaz-auth-btn-primary::before{
	inset:1px 1px auto;
	height:38%;
	border-radius:inherit;
	background:linear-gradient(180deg,rgba(255,255,255,.28),rgba(255,255,255,0));
}
.shahaz-auth-btn-primary:hover{
	filter:brightness(1.05) saturate(1.03);
	box-shadow:
		0 4px 0 #8C0E52,
		0 12px 18px rgba(198,17,107,.28),
		inset 0 1px 0 rgba(255,255,255,.6),
		inset 0 -1px 0 rgba(122,14,78,.16);
}
.shahaz-auth-btn-primary:active{
	transform:translateY(4px);
	box-shadow:
		0 0 0 #8C0E52,
		0 4px 8px rgba(198,17,107,.20),
		inset 0 1px 0 rgba(255,255,255,.35);
}

@media (max-width:480px){
	.shahaz-auth-header{gap:6px;padding:16px 14px;}
	.shahaz-auth-brand{gap:8px;min-width:0;}
	.shahaz-auth-logo{width:48px;height:48px;flex-basis:48px;}
	.shahaz-auth-logo img{width:40px;height:40px;}
	.shahaz-auth-brand-name{font-size:16px;white-space:nowrap;}
	.shahaz-auth-segment{gap:4px;flex-shrink:0;}
	.shahaz-auth-segment a{height:32px;padding:0 10px;font-size:11.5px;}
	.shahaz-auth-methods{padding:10px 14px;gap:6px;}
	.shahaz-auth-method{min-height:44px;padding:6px 4px;font-size:11px;border-radius:12px;}
	.shahaz-auth-method svg{width:14px;height:14px;}
	.shahaz-auth-btn-primary{min-height:50px;padding:10px 18px;font-size:16px;}
}


/* =========================================================
   PHASE 157 — AUTH PAGE IDENTITY + MOBILE QA SAFEGUARDS
   Scoped only to the Login & Create Account page.
   ========================================================= */
.shahaz-auth-page-name{
	margin-top:2px;
	font-size:11px;
	font-weight:800;
	line-height:1.15;
	letter-spacing:.01em;
	color:var(--gv-gold);
	text-align:center;
	white-space:nowrap;
}
@media (max-width:480px){
	.shahaz-auth-page-name{font-size:9.5px;line-height:1.1;}
}


/* ========================================================================
   PHASE 164 — Login & Create Account one-layer surface + functional tabs
   Scope: ONLY the dedicated Login & Create Account template.
   ======================================================================== */
body:has(.shahaz-auth-vault-page){
	background:var(--gv-cream) !important;
	margin:0 !important;
}
.shahaz-auth-vault-page{
	min-height:calc(100vh - 58px);
	padding:0;
	background:var(--gv-cream);
	align-items:stretch;
}
.shahaz-auth-card{
	width:100%;
	max-width:none;
	min-height:calc(100vh - 58px);
	border:0;
	border-radius:0;
	box-shadow:none;
	background:var(--gv-cream);
}
.shahaz-auth-header{
	background:var(--gv-cream);
}
/* Main-header brand language: SHAHAZ hot magenta + .COM gold, 3D only. */
.shahaz-auth-brand-copy{
	display:flex;
	flex-direction:column;
	align-items:flex-start;
	gap:3px;
}
.shahaz-auth-brand-line{
	display:flex;
	align-items:baseline;
	gap:2px;
	line-height:.86;
	white-space:nowrap;
}
.shahaz-auth-brand-name,
.shahaz-auth-brand-dot{
	font-family:Georgia,"Times New Roman",serif;
	font-weight:900;
	line-height:.86;
	letter-spacing:-.045em;
}
.shahaz-auth-brand-name{
	font-size:clamp(24px,7vw,36px);
	color:#f9007f !important;
	text-shadow:0 1px 0 rgba(123,0,72,.95),0 2px 0 rgba(105,0,61,.88),0 3px 0 rgba(86,0,51,.72),0 4px 7px rgba(64,0,38,.24);
}
.shahaz-auth-brand-dot{
	font-size:clamp(18px,5.3vw,28px);
	color:#ffe26a !important;
	text-shadow:0 1px 0 rgba(151,91,0,.95),0 2px 0 rgba(126,72,0,.86),0 3px 0 rgba(102,57,0,.70),0 4px 7px rgba(64,38,0,.22);
}
.shahaz-auth-page-name{
	font-size:12px;
	font-weight:800;
	color:var(--gv-text);
	line-height:1.1;
}

/* Touch-safe semantic method buttons. */
.shahaz-auth-method{
	appearance:none;
	-webkit-appearance:none;
	font-family:inherit;
	text-align:center;
	touch-action:manipulation;
}
.shahaz-auth-method.is-active{
	background:linear-gradient(180deg,var(--gv-cta-top) 0%,var(--gv-cta-mid) 55%,var(--gv-cta-bot) 100%) !important;
	color:#fff !important;
	border-color:var(--gv-gold) !important;
	box-shadow:0 var(--gv-lift-sm) 0 var(--gv-cta-edge),0 7px 12px var(--gv-cta-glow),inset 0 1px 0 rgba(255,255,255,.48) !important;
}
.shahaz-auth-method:focus-visible{
	outline:2px solid var(--gv-gold);
	outline-offset:2px;
}

/* Raised password-eye jewel: visibly above the field instead of recessed. */
.shahaz-auth-toggle-pass{
	width:32px;
	height:32px;
	right:8px;
	background:linear-gradient(180deg,#fffdf7 0%,#fff7e7 100%);
	border:2px solid var(--gv-gold);
	box-shadow:0 3px 0 var(--gv-gold-edge),0 6px 10px rgba(122,14,78,.18),inset 0 1px 0 rgba(255,255,255,.95);
	color:var(--gv-magenta);
}
.shahaz-auth-toggle-pass:hover{
	color:var(--gv-magenta);
	transform:translateY(-50%) translateY(-1px);
}
.shahaz-auth-toggle-pass.is-visible{
	background:linear-gradient(180deg,#ff5fa8 0%,#e6337f 60%,#c6116b 100%);
	border-color:var(--gv-gold);
	color:#fff;
	box-shadow:0 3px 0 var(--gv-cta-edge),0 7px 12px var(--gv-cta-glow),inset 0 1px 0 rgba(255,255,255,.42);
}
.shahaz-auth-toggle-pass .shahaz-eye-icon{display:none;}
.shahaz-auth-toggle-pass .shahaz-eye-off{display:block;}
.shahaz-auth-toggle-pass.is-visible .shahaz-eye-off{display:none;}
.shahaz-auth-toggle-pass.is-visible .shahaz-eye-on{display:block;}

@media(max-width:480px){
	.shahaz-auth-vault-page,
	.shahaz-auth-card{min-height:calc(100vh - 58px);}
	.shahaz-auth-header{padding:16px 18px;}
}

/* ========================================================================
   PHASE 165 — PASSWORD EYE: SINGLE ICON + REAL VISIBILITY TOGGLE
   Scoped only to Login & Create Account. No 3D background/jewel.
   ======================================================================== */
.shahaz-auth-vault-page .shahaz-auth-toggle-pass{
	appearance:none!important;
	-webkit-appearance:none!important;
	position:absolute!important;
	right:10px!important;
	top:50%!important;
	transform:translateY(-50%)!important;
	width:34px!important;
	height:34px!important;
	margin:0!important;
	padding:0!important;
	border:0!important;
	border-radius:0!important;
	background:transparent!important;
	box-shadow:none!important;
	color:var(--gv-muted)!important;
	cursor:pointer!important;
	display:flex!important;
	align-items:center!important;
	justify-content:center!important;
	z-index:5!important;
	touch-action:manipulation!important;
	-webkit-tap-highlight-color:transparent!important;
}
.shahaz-auth-vault-page .shahaz-auth-toggle-pass:hover,
.shahaz-auth-vault-page .shahaz-auth-toggle-pass:active,
.shahaz-auth-vault-page .shahaz-auth-toggle-pass.is-visible{
	background:transparent!important;
	border:0!important;
	box-shadow:none!important;
	color:var(--gv-magenta)!important;
	transform:translateY(-50%)!important;
}
.shahaz-auth-vault-page .shahaz-auth-toggle-pass .shahaz-eye-icon{
	display:block!important;
	width:20px!important;
	height:20px!important;
	pointer-events:none!important;
}
.shahaz-auth-vault-page .shahaz-auth-toggle-pass:focus-visible{
	outline:2px solid var(--gv-magenta)!important;
	outline-offset:2px!important;
	border-radius:6px!important;
}
@media (max-width:480px){
	.shahaz-auth-vault-page .shahaz-auth-toggle-pass{
		right:9px!important;
		width:34px!important;
		height:34px!important;
	}
}
@media (min-width:481px){
	.shahaz-auth-vault-page .shahaz-auth-toggle-pass{
		right:10px!important;
		width:36px!important;
		height:36px!important;
	}
}

/* ========================================================================
   PHASE 166 — LOGIN PRECISION FIX
   Scope: dedicated authentication page only.
   ======================================================================== */
.shahaz-auth-vault-page .shahaz-auth-segment a{
	touch-action:manipulation;
	-webkit-tap-highlight-color:transparent;
}
.shahaz-auth-vault-page .shahaz-auth-method{
	touch-action:manipulation;
	-webkit-tap-highlight-color:transparent;
	user-select:none;
}
.shahaz-auth-vault-page .shahaz-auth-input-wrap input{
	min-width:0;
}
.shahaz-auth-vault-page .shahaz-auth-toggle-pass .shahaz-eye-icon{
	width:22px!important;
	height:22px!important;
	pointer-events:none!important;
	display:block!important;
}

/* ZIP-130 — functional auth feedback */
.shahaz-auth-method{touch-action:manipulation;}
.shahaz-auth-biometric-pad{touch-action:manipulation;}
.shahaz-auth-password-match{min-height:18px;margin-top:7px;font-size:12px;font-weight:800;line-height:1.3;}
.shahaz-auth-password-match.is-match{color:#2E7D32;}
.shahaz-auth-password-match.is-mismatch{color:#C0392B;}

/* ZIP-132 — final visibility guarantee for password eye controls. */
.shahaz-auth-vault-page .shahaz-auth-input-wrap .shahaz-auth-toggle-pass{
	visibility:visible!important;
	opacity:1!important;
	display:flex!important;
	pointer-events:auto!important;
}
.shahaz-auth-vault-page .shahaz-auth-input-wrap .shahaz-auth-toggle-pass .shahaz-eye-icon{
	display:block!important;
	visibility:visible!important;
	opacity:1!important;
	stroke:currentColor!important;
	fill:none!important;
	overflow:visible!important;
}


/* ZIP-134 — OTP mobile alignment hardening.
 * Six cells always stay inside the OTP pad; no horizontal drift/overflow. */
.shahaz-auth-otp-pad{
	overflow:hidden;
	box-sizing:border-box;
}
.shahaz-auth-otp-inputs{
	display:grid!important;
	grid-template-columns:repeat(6,minmax(0,1fr));
	gap:clamp(4px,2vw,8px);
	width:100%;
	max-width:360px;
	margin:14px auto!important;
	padding:0!important;
	box-sizing:border-box;
}
.shahaz-auth-otp-inputs input{
	display:block!important;
	width:100%!important;
	min-width:0!important;
	max-width:none!important;
	height:52px;
	margin:0!important;
	box-sizing:border-box!important;
	padding:0!important;
	text-align:center;
}
.shahaz-auth-otp-inputs input:focus{
	outline:2px solid var(--gv-magenta,#ff1493);
	outline-offset:1px;
}
.shahaz-auth-biometric-pad{
	cursor:pointer;
	touch-action:manipulation;
	user-select:none;
	-webkit-user-select:none;
}
.shahaz-auth-biometric-pad.is-busy{
	opacity:.78;
	cursor:wait;
}
.shahaz-auth-biometric-pad.is-ready{
	border-color:var(--gv-gold);
}
.shahaz-auth-biometric-pad .shahaz-auth-biometric-status{
	display:block;
	margin-top:8px;
	font-size:12px;
	font-weight:700;
	color:var(--gv-muted);
}
@media(max-width:480px){
	.shahaz-auth-otp-pad{padding-left:14px;padding-right:14px}
	.shahaz-auth-otp-inputs{max-width:100%;gap:clamp(4px,1.7vw,7px)}
	.shahaz-auth-otp-inputs input{height:50px}
}

/* ZIP-135 — remove the browser-default blue tap-highlight rectangle on OTP
 * cells and the biometric pad. Size/layout of the OTP boxes is untouched
 * (no width/height/gap/border rule above is modified); this only removes
 * -webkit-tap-highlight-color, which several of the other interactive
 * controls in this file already set but these two never did, and replaces
 * it with the same SHAHAZ focus-visible treatment already used elsewhere
 * (so keyboard accessibility is preserved, not removed). */
.shahaz-auth-otp-inputs input{
	-webkit-tap-highlight-color:transparent;
	touch-action:manipulation;
}
.shahaz-auth-otp-inputs input:focus{outline:none;}
.shahaz-auth-otp-inputs input:focus-visible{
	outline:2px solid var(--gv-magenta,#ff1493);
	outline-offset:1px;
}
.shahaz-auth-biometric-pad{
	-webkit-tap-highlight-color:transparent;
}
.shahaz-auth-biometric-pad:focus{outline:none;}
.shahaz-auth-biometric-pad:focus-visible{
	outline:2px solid var(--gv-gold);
	outline-offset:2px;
}
