/* ============================================================
   V7 Wave 22 — THE LOGIN PAGE (owner Login Decision, SYSTEM
   §21). Enqueued ONLY on the guest account page and the guest
   checkout (the hint line) — every other surface is untouched.
   Tokens are the DS's own (rasid.css :root); nothing here
   redefines identity.
   ============================================================ */

/* ——— Focus mode (clause E17): while the guest flow runs, the
   chrome, footer, bottom nav and the one permitted floater
   retire completely — a focused screen until the login
   completes or is cancelled. ——— */
body.rn7-auth-focus .rn7-announce,
body.rn7-auth-focus .rn7-chrome,
body.rn7-auth-focus .rn7-footer,
body.rn7-auth-focus .rn5-bottomnav,
body.rn7-auth-focus .rn7-wa-float { display: none !important; }
body.rn7-auth-focus { padding-bottom: 0 !important; }

/* ——— The page's own header cluster (clause D12): official
   logo + a compact identity/trust header. This is NOT a
   second trust strip — the marks row stays in the footer
   (§18.3 exception recorded in the strategy doc). ——— */
.rn7-auth-top {
	display: flex; align-items: center; justify-content: space-between;
	gap: 12px; min-height: 44px; margin-block-end: 10px;
}
.rn7-auth-brand { display: inline-flex; align-items: center; gap: 10px; }
.rn7-auth-brand img { width: 36px; height: 36px; display: block; }
.rn7-auth-brand .rn5-logo-word { font-size: 18px; }
.rn7-auth-trust { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.rn7-auth-trust-item {
	display: inline-flex; align-items: center; gap: 6px;
	font-size: 12.5px; font-weight: 700; color: var(--ink);
	background: var(--surface); border: 1px solid var(--line);
	border-radius: 999px; padding: 5px 10px; white-space: nowrap;
}
.rn7-auth-trust-item svg { color: var(--accent); flex: none; }

/* ——— Card + value line (clause D11: assets, no greeting) ——— */
.rn7-auth-value { font-size: 15px; line-height: 1.7; color: var(--ink); margin: 0 0 14px; }
.rn7-auth-title { font-size: 20px; font-weight: 900; margin: 0 0 8px; }
.rn7-auth-sub { font-size: 14px; line-height: 1.7; color: var(--ink-2); margin: 0 0 14px; }
.rn7-auth-sub bdi { color: var(--ink); font-weight: 700; }

.rn7-auth-notice {
	border-radius: var(--radius-s); padding: 12px 14px; font-size: 14px;
	line-height: 1.7; margin: 0 0 14px; border: 1px solid var(--line);
	background: var(--bg); color: var(--ink);
}
.rn7-auth-notice--err { border-color: var(--danger); color: var(--ink); }
.rn7-auth-notice--info { border-color: var(--accent-deep, #00a2d9); }
.rn7-auth-notice--ok { border-color: var(--save); }

/* ——— Fields + the primary action. Specificity note: the
   content frame paints submits grey at (0,2,1) — every
   primary anchor below is scoped at (0,3,1)+ so the DS
   primary (accent ground, on-accent ink) always wins. ——— */
.rn7-field-label { display: block; font-size: 14px; font-weight: 700; margin-block-end: 8px; }
/* Specificity note: the content frame's generic submit rule
 * (rasid.css, (0,3,2)) sets a 44px min-height and outranks a
 * plain (0,3,1) component anchor — the auth family's own
 * submits are 52px (the .woocommerce-form-login pattern), so
 * these anchors are scoped one class deeper, (0,4,1). */
body.rn5 .rn7-logincard .rn7-idform .rn7-text-input,
body.rn5 .rn7-logincard .rn7-codeform .rn7-code-input {
	width: 100%; min-height: 52px; box-sizing: border-box;
	background: var(--surface-2); color: var(--ink);
	border: 1px solid var(--line); border-radius: var(--radius-s);
	padding: 10px 14px; font-size: 16px; font-family: inherit;
}
body.rn5 .rn7-logincard .rn7-idform .rn7-text-input:focus,
body.rn5 .rn7-logincard .rn7-codeform .rn7-code-input:focus {
	outline: 2px solid var(--accent-light); outline-offset: 1px; border-color: var(--accent);
}
body.rn5 .rn7-logincard .rn7-codeform .rn7-code-input {
	text-align: center; direction: ltr; font-size: 26px; font-weight: 900;
	letter-spacing: 10px; padding-inline-end: 4px;
}
body.rn5 .rn7-logincard .rn7-idform .rn7-auth-primary,
body.rn5 .rn7-logincard .rn7-codeform .rn7-auth-primary {
	width: 100%; min-height: 52px; margin-block-start: 12px;
	background: var(--accent); color: var(--on-accent);
	border: 0; border-radius: var(--radius-s);
	font-weight: 800; font-size: 16px; font-family: inherit; cursor: pointer;
}
.rn7-idform-note, .rn7-code-hint { font-size: 13px; line-height: 1.7; color: var(--ink-2); margin: 10px 0 0; }

/* ——— The code step's escape row (clause A3: no dead end) ——— */
.rn7-code-alt {
	display: flex; align-items: center; flex-wrap: wrap; gap: 12px;
	margin-block-start: 14px;
}
.rn7-resend-form { margin: 0; }
body.rn5 .rn7-logincard .rn7-textbtn {
	display: inline-flex; align-items: center; min-height: 44px;
	background: transparent; border: 0; padding: 0 2px;
	color: var(--accent); font-size: 14px; font-weight: 700;
	font-family: inherit; cursor: pointer; text-decoration: none;
}
body.rn5 .rn7-logincard .rn7-textbtn[disabled] { color: var(--ink-2); cursor: default; }

/* ——— «أو» divider ——— */
.rn7-or {
	display: flex; align-items: center; gap: 12px;
	margin: 18px 0 14px; color: var(--ink-2); font-size: 13px;
}
.rn7-or::before, .rn7-or::after { content: ""; flex: 1; height: 1px; background: var(--line); }

/* ——— Social components + the WhatsApp socket: ONE row
   system, one height (52px), a fixed 12px gap (§12's
   action-spacing measure reads this block). ——— */
.rn7-social { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
body.rn5 .rn7-logincard .rn7-social-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 10px;
	white-space: nowrap;
	min-height: 52px; box-sizing: border-box; padding: 8px 10px;
	background: var(--surface-2); color: var(--ink);
	border: 1px solid var(--line); border-radius: var(--radius-s);
	font-size: 14.5px; font-weight: 700; text-decoration: none;
}
.rn7-wa-socket {
	display: flex; align-items: center; justify-content: space-between; gap: 12px;
	flex-wrap: nowrap;
	min-height: 52px; box-sizing: border-box; padding: 8px 14px; margin-block-start: 12px;
	background: var(--bg); border: 1px dashed var(--line); border-radius: var(--radius-s);
	color: var(--ink-2);
}
.rn7-wa-socket-label { display: inline-flex; align-items: center; gap: 10px; font-size: 14.5px; font-weight: 700; white-space: nowrap; }
.rn7-socket-chip {
	font-size: 11.5px; font-weight: 700; color: var(--ink-2);
	border: 1px solid var(--line); border-radius: 999px; padding: 3px 8px; white-space: nowrap;
}

/* ——— The quiet tracking entry (clause D14) ——— */
.rn7-track-entry {
	margin: 18px 0 0; text-align: center; font-size: 13.5px; color: var(--ink-2);
}
.rn7-track-entry a { color: var(--accent); }

/* ——— The checkout hint line (clause E18) ——— */
.rn7-checkout-login-hint {
	margin: 0 0 14px; padding: 10px 14px; font-size: 14px; line-height: 1.7;
	color: var(--ink-2); background: var(--surface);
	border: 1px solid var(--line); border-radius: var(--radius-s);
}
.rn7-checkout-login-hint a { color: var(--accent); font-weight: 700; }