/* ============================================================
   RIWAJ AUTH PRO — v1.0.0
   Brand-tier polish for /login/ and /register/ (choice page).
   Loads ONLY on those pages. Layered on top of registration.css
   and riwaj-darkom.css so it wins specificity ties without !important.
   ============================================================ */

/* ─── DESIGN TOKENS (scoped to auth pages) ──────────────── */
body.riwajfood .rf-register-page,
body.riwajfood .rf-register-choice-page {
  --rf-brand:        #D4511E;
  --rf-brand-deep:   #B33E14;
  --rf-brand-soft:   #FFF0E5;
  --rf-brand-tint:   rgba(212, 81, 30, 0.08);

  --rf-ink-900:      #1A0F08;
  --rf-ink-800:      #2A1A0F;
  --rf-ink-700:      #4A2E20;
  --rf-ink-500:      #6B5043;
  --rf-ink-400:      #8E7367;
  --rf-ink-300:      #BFB0A6;
  --rf-paper-50:     #FFFBF6;
  --rf-paper-100:    #FAF3EA;
  --rf-paper-200:    #F1E6D6;

  --rf-r-sm: 10px;  --rf-r-md: 16px;  --rf-r-lg: 22px;  --rf-r-xl: 28px;

  --rf-sh-1: 0 1px 2px rgba(26, 15, 8, 0.04), 0 2px 6px rgba(26, 15, 8, 0.04);
  --rf-sh-2: 0 4px 12px rgba(26, 15, 8, 0.06), 0 12px 32px rgba(26, 15, 8, 0.05);
  --rf-sh-3: 0 12px 24px rgba(26, 15, 8, 0.08), 0 28px 64px rgba(26, 15, 8, 0.10);
  --rf-sh-card: 0 1px 3px rgba(26, 15, 8, 0.05), 0 24px 64px -12px rgba(26, 15, 8, 0.18);
  --rf-sh-brand: 0 8px 24px rgba(212, 81, 30, 0.22);

  --rf-ease:         cubic-bezier(0.32, 0.72, 0, 1);
  --rf-ease-out:     cubic-bezier(0.16, 1, 0.3, 1);
  --rf-fast:         180ms;
  --rf-base:         260ms;
  --rf-slow:         600ms;
}

/* ============================================================
   NEUTRALISE LEGACY CONSTRAINTS
   v1.0.15 darkom set .rf-login-page { max-width: 480px } which
   would shrink our full-bleed background. Reset it here.
   ============================================================ */
body.riwajfood.riwajfood .rf-login-page,
body.riwajfood.riwajfood .rf-register-page,
body.riwajfood.riwajfood .rf-register-choice-page {
  max-width: none;
  margin: 0;
}

/* ============================================================
   SHARED PAGE BACKGROUND
   Warm cream base + soft radial brand glows + subtle moroccan
   geometric grid (pure CSS, no image asset).
   ============================================================ */
body.riwajfood .rf-register-page,
body.riwajfood .rf-register-choice-page {
  position: relative;
  min-height: 100vh;
  padding: clamp(40px, 8vh, 80px) 0;
  background:
    radial-gradient(ellipse at 20% 0%, rgba(212, 81, 30, 0.10), transparent 50%),
    radial-gradient(ellipse at 100% 100%, rgba(255, 171, 102, 0.08), transparent 55%),
    linear-gradient(180deg, var(--rf-paper-50) 0%, var(--rf-paper-100) 100%);
  overflow: hidden;
  isolation: isolate;
}
/* Subtle Moroccan-inspired diamond pattern, very low opacity. */
body.riwajfood .rf-register-page::before,
body.riwajfood .rf-register-choice-page::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background-image:
    linear-gradient(45deg, var(--rf-brand-tint) 25%, transparent 25%),
    linear-gradient(-45deg, var(--rf-brand-tint) 25%, transparent 25%);
  background-size: 56px 56px;
  background-position: 0 0, 28px 28px;
  opacity: 0.35;
  mask-image: radial-gradient(ellipse at center, #000 0%, transparent 70%);
  -webkit-mask-image: radial-gradient(ellipse at center, #000 0%, transparent 70%);
}

/* Container — keep narrow on login, wider on choice */
body.riwajfood .rf-register-page .rf-container {
  width: min(480px, 92%);
  margin: 0 auto;
  position: relative;
  z-index: 1;
}
body.riwajfood .rf-register-choice-page .rf-container {
  width: min(960px, 92%);
  margin: 0 auto;
  position: relative;
  z-index: 1;
}

/* ============================================================
   FORM HEADER (back link, title, subtitle)
   ============================================================ */
body.riwajfood .rf-form-header {
  text-align: center;
  margin-bottom: 28px;
  animation: rfAuthRise 700ms var(--rf-ease-out) both;
}
body.riwajfood .rf-back-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--rf-ink-500);
  text-decoration: none;
  font-size: 0.875rem;
  font-weight: 500;
  margin-bottom: 18px;
  padding: 6px 14px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.6);
  backdrop-filter: blur(6px);
  border: 1px solid rgba(212, 81, 30, 0.12);
  transition: color var(--rf-fast) ease,
              background var(--rf-fast) ease,
              transform var(--rf-fast) var(--rf-ease-out);
}
body.riwajfood .rf-back-link:hover {
  color: var(--rf-brand);
  background: #fff;
  transform: translateY(-1px);
}
body.riwajfood .rf-form-header h1 {
  font-size: clamp(1.6rem, 1.2rem + 1.2vw, 2.1rem);
  font-weight: 800;
  letter-spacing: -0.015em;
  color: var(--rf-ink-900);
  margin: 0 0 8px;
  line-height: 1.15;
}
body.riwajfood .rf-form-header p {
  color: var(--rf-ink-500);
  margin: 0;
  font-size: 1rem;
}

/* Choice page header */
body.riwajfood .rf-choice-header {
  text-align: center;
  margin-bottom: clamp(28px, 4vh, 44px);
  animation: rfAuthRise 700ms var(--rf-ease-out) both;
}
body.riwajfood .rf-choice-header h1 {
  font-size: clamp(1.8rem, 1.4rem + 1.6vw, 2.6rem);
  font-weight: 800;
  letter-spacing: -0.015em;
  color: var(--rf-ink-900);
  margin: 0 0 10px;
  line-height: 1.15;
}
body.riwajfood .rf-choice-header p {
  color: var(--rf-ink-500);
  font-size: 1.05rem;
  margin: 0;
}

@keyframes rfAuthRise {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  body.riwajfood .rf-form-header,
  body.riwajfood .rf-choice-header,
  body.riwajfood .rf-form,
  body.riwajfood .rf-choice-cards { animation: none; }
}

/* ============================================================
   LOGIN — refined card form
   ============================================================ */
body.riwajfood .rf-login-page .rf-form,
body.riwajfood .rf-login-page > .rf-container > #rf-login-form {
  background: #fff;
  border-radius: var(--rf-r-xl);
  padding: clamp(28px, 4vw, 40px);
  box-shadow: var(--rf-sh-card);
  border: 1px solid rgba(26, 15, 8, 0.04);
  animation: rfAuthRise 800ms var(--rf-ease-out) both;
  animation-delay: 100ms;
}

/* Field rhythm */
body.riwajfood .rf-login-page .rf-field,
body.riwajfood .rf-login-page .rf-field + .rf-field { margin-bottom: 18px; }

body.riwajfood .rf-login-page .rf-field label {
  display: block;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--rf-ink-800);
  margin-bottom: 8px;
  letter-spacing: 0.005em;
}
body.riwajfood .rf-required { color: var(--rf-brand); margin-inline-start: 2px; }

/* Inputs — taller, softer, real focus ring */
body.riwajfood .rf-login-page input[type="text"],
body.riwajfood .rf-login-page input[type="email"],
body.riwajfood .rf-login-page input[type="password"],
body.riwajfood .rf-login-page .rf-pwd-wrap input {
  width: 100%;
  height: 52px;
  padding: 0 18px;
  border: 1.5px solid var(--rf-paper-200);
  border-radius: 14px;
  background: var(--rf-paper-50);
  font-size: 1rem;
  color: var(--rf-ink-900);
  outline: none;
  transition: border-color var(--rf-fast) ease,
              background var(--rf-fast) ease,
              box-shadow var(--rf-fast) ease;
  font-family: inherit;
}
body.riwajfood .rf-login-page input::placeholder { color: var(--rf-ink-400); }

body.riwajfood .rf-login-page input:hover:not(:focus) {
  border-color: var(--rf-ink-300);
  background: #fff;
}
body.riwajfood .rf-login-page input:focus {
  border-color: var(--rf-brand);
  background: #fff;
  box-shadow: 0 0 0 4px rgba(212, 81, 30, 0.12);
}

/* Password wrapper sized to match the new input height */
body.riwajfood .rf-login-page .rf-pwd-wrap {
  position: relative;
}
body.riwajfood .rf-login-page .rf-pwd-wrap input {
  padding-inline-end: 52px;
}
body.riwajfood .rf-login-page .rf-pwd-toggle {
  position: absolute;
  inset-inline-end: 8px;
  top: 50%;
  transform: translateY(-50%);
  width: 38px;
  height: 38px;
  border: 0;
  background: transparent;
  color: var(--rf-ink-400);
  cursor: pointer;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: color var(--rf-fast) ease, background var(--rf-fast) ease;
}
body.riwajfood .rf-login-page .rf-pwd-toggle:hover {
  color: var(--rf-brand);
  background: var(--rf-brand-tint);
}

/* Field error visual */
body.riwajfood .rf-login-page .rf-field-error {
  display: none;
  color: #B91C1C;
  font-size: 0.825rem;
  margin-top: 6px;
}
body.riwajfood .rf-login-page .rf-field.rf-field-has-error input {
  border-color: #B91C1C;
  background: #FEF2F2;
}
body.riwajfood .rf-login-page .rf-field.rf-field-has-error input:focus {
  box-shadow: 0 0 0 4px rgba(185, 28, 28, 0.12);
}

/* Remember-me + forgot password row */
body.riwajfood .rf-login-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 4px 0 22px;
  flex-wrap: wrap;
}
body.riwajfood .rf-checkbox-inline {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  font-size: 0.9rem;
  color: var(--rf-ink-700);
  user-select: none;
}
body.riwajfood .rf-checkbox-inline input[type="checkbox"] {
  width: 18px;
  height: 18px;
  margin: 0;
  accent-color: var(--rf-brand);
  cursor: pointer;
}
body.riwajfood .rf-login-forgot {
  color: var(--rf-brand);
  font-size: 0.9rem;
  text-decoration: none;
  font-weight: 600;
  transition: color var(--rf-fast) ease;
}
body.riwajfood .rf-login-forgot:hover { color: var(--rf-brand-deep); text-decoration: underline; }

/* Primary submit button — gradient pill matching homepage CTA */
body.riwajfood .rf-login-page .rf-btn-primary,
body.riwajfood .rf-login-page #rf-login-submit {
  width: 100%;
  height: 54px;
  border: 0;
  border-radius: 14px;
  background: linear-gradient(135deg, var(--rf-brand) 0%, var(--rf-brand-deep) 100%);
  color: #fff;
  font-size: 1.05rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  cursor: pointer;
  box-shadow: var(--rf-sh-brand);
  transition: transform var(--rf-fast) var(--rf-ease-out),
              box-shadow var(--rf-fast) var(--rf-ease-out),
              filter var(--rf-fast) ease;
  position: relative;
  overflow: hidden;
}
body.riwajfood .rf-login-page #rf-login-submit::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, transparent 30%, rgba(255, 255, 255, 0.18) 50%, transparent 70%);
  transform: translateX(-100%);
  transition: transform 600ms ease;
}
body.riwajfood .rf-login-page #rf-login-submit:hover:not(:disabled) {
  transform: translateY(-1px);
  filter: brightness(1.06);
  box-shadow: 0 12px 32px rgba(212, 81, 30, 0.35);
}
body.riwajfood .rf-login-page #rf-login-submit:hover:not(:disabled)::before {
  transform: translateX(100%);
}
body.riwajfood .rf-login-page #rf-login-submit:active { transform: translateY(0); }
body.riwajfood .rf-login-page #rf-login-submit:disabled {
  opacity: 0.7;
  cursor: not-allowed;
}

/* Alert (above the form) */
body.riwajfood .rf-login-page #rf-login-alert {
  margin: 0 0 18px;
  padding: 14px 16px;
  border-radius: 12px;
  font-size: 0.9rem;
  line-height: 1.5;
  animation: rfAuthRise 360ms var(--rf-ease-out) both;
}
body.riwajfood .rf-login-page .rf-alert-error {
  background: #FEF2F2;
  color: #991B1B;
  border: 1px solid #FECACA;
}
body.riwajfood .rf-login-page .rf-alert-success {
  background: #ECFDF5;
  color: #065F46;
  border: 1px solid #A7F3D0;
}

/* Footer "create account" link — refined divider */
body.riwajfood .rf-login-page .rf-form-footer {
  text-align: center;
  margin-top: 28px;
  padding: 18px 0 0;
  border-top: 1px solid var(--rf-paper-200);
}
body.riwajfood .rf-login-page .rf-form-footer p {
  margin: 0;
  color: var(--rf-ink-500);
  font-size: 0.95rem;
}
body.riwajfood .rf-login-page .rf-form-footer a {
  color: var(--rf-brand);
  font-weight: 700;
  text-decoration: none;
  margin-inline-start: 4px;
}
body.riwajfood .rf-login-page .rf-form-footer a:hover {
  color: var(--rf-brand-deep);
  text-decoration: underline;
}

/* ============================================================
   REGISTRATION CHOICE — two elevated cards, brand-tier hover
   ============================================================ */
body.riwajfood .rf-choice-cards {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(16px, 2vw, 28px);
  animation: rfAuthRise 800ms var(--rf-ease-out) both;
  animation-delay: 100ms;
}
@media (max-width: 720px) {
  body.riwajfood .rf-choice-cards { grid-template-columns: 1fr; }
}

body.riwajfood .rf-choice-card {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 14px;
  padding: clamp(28px, 4vw, 40px) clamp(20px, 3vw, 32px);
  background: #fff;
  border-radius: var(--rf-r-xl);
  border: 1px solid rgba(26, 15, 8, 0.05);
  box-shadow: var(--rf-sh-card);
  text-decoration: none;
  color: inherit;
  overflow: hidden;
  isolation: isolate;
  transition: transform var(--rf-base) var(--rf-ease-out),
              box-shadow var(--rf-base) var(--rf-ease-out),
              border-color var(--rf-base) ease;
}
/* Decorative gradient halo behind icon — fades in on hover */
body.riwajfood .rf-choice-card::before {
  content: "";
  position: absolute;
  top: -60px;
  inset-inline-end: -60px;
  width: 220px;
  height: 220px;
  background: radial-gradient(circle, rgba(212, 81, 30, 0.16), transparent 65%);
  z-index: -1;
  opacity: 0;
  transition: opacity var(--rf-base) ease;
}
/* Bottom accent bar — slides in on hover.
   Origin uses logical inline-end so it grows from the start
   of the reading direction in both RTL and LTR. */
body.riwajfood .rf-choice-card::after {
  content: "";
  position: absolute;
  inset-block-end: 0;
  inset-inline-start: 0;
  inset-inline-end: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--rf-brand), var(--rf-brand-deep));
  transform: scaleX(0);
  transform-origin: right; /* RTL — grows right→left toward content start */
  transition: transform var(--rf-base) var(--rf-ease-out);
}
[dir="ltr"] body.riwajfood .rf-choice-card::after,
body[dir="ltr"].riwajfood .rf-choice-card::after { transform-origin: left; }
body.riwajfood .rf-choice-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 16px 40px rgba(26, 15, 8, 0.08), 0 40px 80px -16px rgba(212, 81, 30, 0.18);
  border-color: rgba(212, 81, 30, 0.18);
}
body.riwajfood .rf-choice-card:hover::before { opacity: 1; }
body.riwajfood .rf-choice-card:hover::after  { transform: scaleX(1); }

/* Icon container */
body.riwajfood .rf-choice-icon {
  width: 96px;
  height: 96px;
  border-radius: 50%;
  background: var(--rf-brand-soft);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 4px;
  transition: transform var(--rf-base) var(--rf-ease-out),
              background var(--rf-base) ease;
  box-shadow: 0 0 0 8px rgba(212, 81, 30, 0.05);
}
body.riwajfood .rf-choice-card:hover .rf-choice-icon {
  transform: rotate(-4deg) scale(1.06);
  background: #FFE4D1;
}
body.riwajfood .rf-choice-icon svg { width: 56px; height: 56px; }

body.riwajfood .rf-choice-card h2 {
  font-size: 1.4rem;
  font-weight: 800;
  color: var(--rf-ink-900);
  margin: 0;
  letter-spacing: -0.01em;
}
body.riwajfood .rf-choice-card > p {
  color: var(--rf-ink-500);
  font-size: 0.95rem;
  line-height: 1.6;
  margin: 0;
  max-width: 300px;
}

/* "سجل كزبون / كطباخ" pill button at the bottom of the card */
body.riwajfood .rf-choice-btn {
  margin-top: 12px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 24px;
  background: var(--rf-brand-tint);
  color: var(--rf-brand);
  font-weight: 700;
  font-size: 0.95rem;
  border-radius: 999px;
  border: 1.5px solid transparent;
  transition: all var(--rf-base) var(--rf-ease-out);
}
body.riwajfood .rf-choice-card:hover .rf-choice-btn {
  background: linear-gradient(135deg, var(--rf-brand) 0%, var(--rf-brand-deep) 100%);
  color: #fff;
  transform: translateY(-1px);
  box-shadow: var(--rf-sh-brand);
}

/* ============================================================
   CHOICE FOOTER — login button (already redesigned in v1.0.14;
   this just polishes the placement on the new background).
   ============================================================ */
body.riwajfood .rf-register-choice-page .rf-choice-footer {
  margin-top: clamp(28px, 5vh, 44px);
  background: rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(10px);
  border: 1px dashed rgba(212, 81, 30, 0.28);
  animation: rfAuthRise 900ms var(--rf-ease-out) both;
  animation-delay: 200ms;
}

/* ============================================================
   SMALL SCREEN POLISH
   ============================================================ */
@media (max-width: 480px) {
  body.riwajfood .rf-register-page .rf-form,
  body.riwajfood .rf-login-page > .rf-container > #rf-login-form {
    padding: 24px 20px;
    border-radius: var(--rf-r-lg);
  }
  body.riwajfood .rf-login-row {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }
  body.riwajfood .rf-login-forgot { align-self: flex-end; }
}

/* ============================================================
   AUTH PRO v2 — Combined login + register-choice layout
   Scope: body.riwajfood .rf-auth-v2 (template/customer-login.php)
   Hero (card + art) → "Don't have an account?" → trust bar.
   Wins old `.rf-login-page` rules by source order at equal spec.
   ============================================================ */

body.riwajfood .rf-auth-v2 {
  --rfa-bg-1:        #FFFBF6;
  --rfa-bg-2:        #FAF2E5;
  --rfa-cream:       #FAF3EA;
  --rfa-cream-line:  #ECDDC6;
  --rfa-ink:         #1A0F08;
  --rfa-ink-2:       #3D2A1F;
  --rfa-ink-3:       #6B5043;
  --rfa-ink-4:       #8E7367;
  --rfa-brand:       #D4511E;
  --rfa-brand-deep:  #9F3B12;
  --rfa-gold:        #C9A14B;
  --rfa-gold-2:      #E8C16A;
  --rfa-gold-deep:   #9F7321;
  --rfa-gold-tint:   rgba(201, 161, 75, 0.10);
  --rfa-dark-cta:    #0F0A07;
  --rfa-dark-cta-2:  #25180E;

  --rfa-r-sm:  10px;
  --rfa-r-md:  16px;
  --rfa-r-lg:  22px;
  --rfa-r-xl:  28px;
  --rfa-r-2xl: 36px;

  --rfa-sh-card: 0 1px 3px rgba(26,15,8,0.05), 0 20px 50px -20px rgba(26,15,8,0.22);
  --rfa-sh-soft: 0 1px 2px rgba(26,15,8,0.04), 0 10px 24px rgba(26,15,8,0.06);
  --rfa-sh-cta:  0 14px 30px -10px rgba(15,10,7,0.55);

  --rfa-ease:    cubic-bezier(0.16, 1, 0.3, 1);

  position: relative;
  min-height: 100vh;
  padding: clamp(28px, 5vh, 64px) 0 clamp(40px, 6vh, 72px);
  background:
    radial-gradient(ellipse 1100px 600px at 100% 0%, rgba(232, 193, 106, 0.18), transparent 60%),
    radial-gradient(ellipse 900px 700px at 0% 100%, rgba(212, 81, 30, 0.10), transparent 55%),
    linear-gradient(180deg, var(--rfa-bg-1) 0%, var(--rfa-bg-2) 100%);
  overflow: hidden;
  isolation: isolate;
}
/* Drop the legacy .rf-register-page diamond pattern from contaminating
   any nested .rf-register-page styles — and add our own soft wave glow */
body.riwajfood .rf-auth-v2::before,
body.riwajfood .rf-auth-v2::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
}
body.riwajfood .rf-auth-v2::before {
  background:
    radial-gradient(circle at 8% 35%, rgba(201, 161, 75, 0.14), transparent 22%),
    radial-gradient(circle at 92% 65%, rgba(201, 161, 75, 0.10), transparent 26%);
}
body.riwajfood .rf-auth-v2::after {
  background:
    repeating-linear-gradient(125deg,
      transparent 0 120px,
      rgba(201, 161, 75, 0.05) 120px 121px,
      transparent 121px 240px);
  mask-image: radial-gradient(ellipse at center, #000 0%, transparent 75%);
  -webkit-mask-image: radial-gradient(ellipse at center, #000 0%, transparent 75%);
}

/* Shell width */
body.riwajfood .rf-auth-v2 .rfa-shell {
  width: min(1240px, 94%);
  margin: 0 auto;
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: clamp(28px, 4vh, 56px);
}

/* ════════════════════ HERO ════════════════════ */
body.riwajfood .rf-auth-v2 .rfa-hero {
  display: grid;
  grid-template-columns: 1.05fr 1fr;
  gap: clamp(20px, 3vw, 56px);
  align-items: center;
}
@media (max-width: 960px) {
  body.riwajfood .rf-auth-v2 .rfa-hero {
    grid-template-columns: 1fr;
    gap: clamp(20px, 3vh, 32px);
  }
}

/* ─── Login card ─── */
body.riwajfood .rf-auth-v2 .rfa-card {
  background: #fff;
  border-radius: var(--rfa-r-2xl);
  padding: clamp(26px, 4vw, 44px);
  box-shadow: var(--rfa-sh-card);
  border: 1px solid rgba(26, 15, 8, 0.05);
  position: relative;
  animation: rfaRise 700ms var(--rfa-ease) both;
}
@keyframes rfaRise {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  body.riwajfood .rf-auth-v2 .rfa-card,
  body.riwajfood .rf-auth-v2 .rfa-art,
  body.riwajfood .rf-auth-v2 .rfa-cc { animation: none; }
}

body.riwajfood .rf-auth-v2 .rfa-card-head {
  text-align: center;
  margin-bottom: 22px;
}
body.riwajfood .rf-auth-v2 .rfa-card-title {
  font-size: clamp(1.6rem, 1.2rem + 1vw, 2rem);
  font-weight: 800;
  color: var(--rfa-ink);
  margin: 0 0 10px;
  letter-spacing: -0.01em;
  line-height: 1.15;
}
body.riwajfood .rf-auth-v2 .rfa-card-rule {
  display: block;
  width: 48px;
  height: 3px;
  margin: 0 auto;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--rfa-gold-2), var(--rfa-gold));
}

/* Alert */
body.riwajfood .rf-auth-v2 #rf-login-alert {
  margin: 0 0 16px;
  padding: 12px 14px;
  border-radius: 12px;
  font-size: 0.9rem;
  line-height: 1.55;
  background: #FEF2F2;
  color: #991B1B;
  border: 1px solid #FECACA;
}
body.riwajfood .rf-auth-v2 #rf-login-alert.rf-alert-success {
  background: #ECFDF5;
  color: #065F46;
  border-color: #A7F3D0;
}

/* Field */
body.riwajfood .rf-auth-v2 .rfa-field {
  margin-bottom: 14px;
}
body.riwajfood .rf-auth-v2 .rfa-field label {
  display: block;
  font-size: 0.84rem;
  font-weight: 600;
  color: var(--rfa-ink-3);
  margin-bottom: 6px;
  text-align: start;
}

/* Input — flat outlined pill with passive icon on the inline-end */
body.riwajfood .rf-auth-v2 .rfa-input {
  position: relative;
}
body.riwajfood.riwajfood .rf-auth-v2 .rfa-input input[type="email"],
body.riwajfood.riwajfood .rf-auth-v2 .rfa-input input[type="password"],
body.riwajfood.riwajfood .rf-auth-v2 .rfa-input input[type="text"] {
  width: 100%;
  height: 48px;
  padding: 0 44px 0 16px;       /* extra inline-end space for icon */
  border: 1.5px solid var(--rfa-cream-line);
  border-radius: 14px;
  background: #fff;
  font-size: 0.95rem;
  color: var(--rfa-ink);
  outline: none;
  font-family: inherit;
  transition: border-color 180ms ease, box-shadow 180ms ease, background 180ms ease;
}
/* RTL — icon sits at inline-end (left in RTL) */
body.riwajfood .rf-auth-v2 .rfa-input-ico {
  position: absolute;
  inset-inline-end: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--rfa-ink-4);
  pointer-events: none;
  line-height: 0;
}
body.riwajfood.riwajfood .rf-auth-v2 .rfa-input input::placeholder {
  color: #B7A89C;
  font-weight: 500;
}
body.riwajfood.riwajfood .rf-auth-v2 .rfa-input input:hover {
  border-color: #DCC8AA;
}
body.riwajfood.riwajfood .rf-auth-v2 .rfa-input input:focus {
  border-color: var(--rfa-gold);
  box-shadow: 0 0 0 4px rgba(201, 161, 75, 0.16);
  background: #fff;
}

/* Password toggle — beats the legacy auth-pro selector */
body.riwajfood.riwajfood .rf-auth-v2 .rfa-input--pwd input {
  padding-inline-end: 48px;
}
body.riwajfood.riwajfood .rf-auth-v2 .rfa-input--pwd .rfa-pwd-toggle {
  position: absolute;
  inset-inline-end: 8px;
  top: 50%;
  transform: translateY(-50%);
  width: 34px;
  height: 34px;
  border: 0;
  background: transparent;
  color: var(--rfa-ink-4);
  cursor: pointer;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: color 180ms ease, background 180ms ease;
  padding: 0;
  box-shadow: none;
}
body.riwajfood.riwajfood .rf-auth-v2 .rfa-input--pwd .rfa-pwd-toggle:hover {
  color: var(--rfa-gold-deep);
  background: var(--rfa-gold-tint);
}

/* Per-field error text */
body.riwajfood .rf-auth-v2 .rfa-field-error {
  display: none;
  color: #B91C1C;
  font-size: 0.78rem;
  margin-top: 5px;
}
body.riwajfood .rf-auth-v2 .rfa-field.rf-field-has-error input {
  border-color: #B91C1C !important;
  background: #FEF2F2 !important;
}
body.riwajfood .rf-auth-v2 .rfa-field.rf-field-has-error input:focus {
  box-shadow: 0 0 0 4px rgba(185, 28, 28, 0.12) !important;
}
body.riwajfood .rf-auth-v2 .rfa-field.rf-field-has-error .rfa-field-error { display: block; }

/* Forgot link — gold, end-aligned */
body.riwajfood.riwajfood .rf-auth-v2 .rfa-forgot {
  display: inline-block;
  margin: 6px 0 14px;
  color: var(--rfa-gold-deep);
  font-size: 0.82rem;
  font-weight: 600;
  text-decoration: none;
  text-align: start;
}
body.riwajfood.riwajfood .rf-auth-v2 .rfa-forgot:hover {
  color: var(--rfa-brand);
  text-decoration: underline;
}

/* ─── Primary CTA (BLACK pill with arrow) — overrides legacy gradient ─── */
body.riwajfood.riwajfood .rf-auth-v2 #rf-login-submit,
body.riwajfood.riwajfood .rf-auth-v2 .rfa-cta {
  width: 100%;
  height: 52px;
  padding: 0 18px;
  border: 0;
  border-radius: 14px;
  background: linear-gradient(180deg, var(--rfa-dark-cta-2) 0%, var(--rfa-dark-cta) 100%);
  color: #fff;
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  cursor: pointer;
  box-shadow: var(--rfa-sh-cta);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  transition: transform 180ms var(--rfa-ease), filter 180ms ease, box-shadow 180ms ease;
  position: relative;
  overflow: hidden;
  font-family: inherit;
  filter: none;
  text-shadow: none;
}
body.riwajfood.riwajfood .rf-auth-v2 #rf-login-submit::before {
  display: none;   /* kill legacy shimmer */
}
body.riwajfood.riwajfood .rf-auth-v2 #rf-login-submit:hover:not(:disabled),
body.riwajfood.riwajfood .rf-auth-v2 .rfa-cta:hover:not(:disabled) {
  transform: translateY(-1px);
  filter: brightness(1.12);
  box-shadow: 0 18px 36px -10px rgba(15,10,7,0.65);
}
body.riwajfood.riwajfood .rf-auth-v2 #rf-login-submit:active,
body.riwajfood.riwajfood .rf-auth-v2 .rfa-cta:active {
  transform: translateY(0) scale(0.99);
}
body.riwajfood.riwajfood .rf-auth-v2 #rf-login-submit:focus-visible {
  outline: 3px solid rgba(201, 161, 75, 0.55);
  outline-offset: 3px;
}
body.riwajfood .rf-auth-v2 .rfa-cta-arrow {
  flex-shrink: 0;
  opacity: 0.85;
  transform: translateX(2px);
  transition: transform 180ms var(--rfa-ease);
}
body.riwajfood .rf-auth-v2 #rf-login-submit:hover .rfa-cta-arrow {
  transform: translateX(-2px);   /* arrow slides toward inline-end in RTL */
}
[dir="ltr"] body.riwajfood .rf-auth-v2 .rfa-cta-arrow,
body[dir="ltr"].riwajfood .rf-auth-v2 .rfa-cta-arrow { transform: scaleX(-1); }
body.riwajfood .rf-auth-v2 .rf-btn-loader {
  font-weight: 600;
}

/* Divider "أو" */
body.riwajfood .rf-auth-v2 .rfa-divider {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 18px 0 14px;
  color: var(--rfa-ink-4);
  font-size: 0.85rem;
  font-weight: 600;
}
body.riwajfood .rf-auth-v2 .rfa-divider::before,
body.riwajfood .rf-auth-v2 .rfa-divider::after {
  content: "";
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--rfa-cream-line), transparent);
}

/* Socials */
body.riwajfood .rf-auth-v2 .rfa-socials {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin-bottom: 18px;
}
body.riwajfood.riwajfood .rf-auth-v2 .rfa-social {
  height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  border: 1.5px solid var(--rfa-cream-line);
  border-radius: 14px;
  color: var(--rfa-ink-2);
  cursor: pointer;
  text-decoration: none;
  transition: border-color 180ms ease, background 180ms ease, transform 180ms var(--rfa-ease), box-shadow 180ms ease;
  padding: 0;
  font-family: inherit;
}
body.riwajfood.riwajfood .rf-auth-v2 .rfa-social:hover {
  border-color: var(--rfa-gold);
  background: #FFFBF1;
  transform: translateY(-1px);
  box-shadow: 0 6px 14px rgba(201, 161, 75, 0.16);
}
body.riwajfood.riwajfood .rf-auth-v2 .rfa-social:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}

/* ToS line */
body.riwajfood .rf-auth-v2 .rfa-tos {
  text-align: center;
  margin: 0;
  font-size: 0.78rem;
  line-height: 1.65;
  color: var(--rfa-ink-4);
}
body.riwajfood.riwajfood .rf-auth-v2 .rfa-tos a {
  color: var(--rfa-gold-deep);
  font-weight: 600;
  text-decoration: none;
}
body.riwajfood.riwajfood .rf-auth-v2 .rfa-tos a:hover {
  text-decoration: underline;
  color: var(--rfa-brand);
}

/* ─── Brand art ─── */
body.riwajfood .rf-auth-v2 .rfa-art {
  position: relative;
  animation: rfaRise 800ms var(--rfa-ease) both;
  animation-delay: 80ms;
  text-align: start;
}
body.riwajfood .rf-auth-v2 .rfa-art-stage {
  position: relative;
  width: 100%;
  max-width: 460px;
  aspect-ratio: 1 / 1;
  margin-inline-start: 0;
  margin-inline-end: auto;
}
body.riwajfood .rf-auth-v2 .rfa-art-svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
  filter: drop-shadow(0 24px 36px rgba(26, 15, 8, 0.12));
}
body.riwajfood .rf-auth-v2 .rfa-art-blob {
  position: absolute;
  border-radius: 50%;
  z-index: 1;
  filter: blur(0.5px);
}
body.riwajfood .rf-auth-v2 .rfa-art-blob--1 {
  width: 78%; height: 78%;
  inset-inline-start: -6%;
  top: 4%;
  background: radial-gradient(circle at 30% 30%, #FCE9C9 0%, #F1DAB1 55%, transparent 70%);
  opacity: 0.85;
}
body.riwajfood .rf-auth-v2 .rfa-art-blob--2 {
  width: 38%; height: 38%;
  inset-inline-end: 0;
  bottom: 12%;
  background: radial-gradient(circle, rgba(201,161,75,0.34), transparent 70%);
}
body.riwajfood .rf-auth-v2 .rfa-art-orb {
  position: absolute;
  width: 14px; height: 14px;
  border-radius: 50%;
  z-index: 3;
}
body.riwajfood .rf-auth-v2 .rfa-art-orb--gold {
  background: radial-gradient(circle at 30% 30%, #FFE8B0, #C9A14B 60%, #8B5E16);
  top: 18%;
  inset-inline-end: 22%;
  box-shadow: 0 6px 12px rgba(201,161,75,0.4);
}
body.riwajfood .rf-auth-v2 .rfa-art-leaf {
  position: absolute;
  z-index: 3;
  line-height: 0;
}
body.riwajfood .rf-auth-v2 .rfa-art-leaf--1 {
  inset-inline-end: -4%;
  bottom: 28%;
  transform: rotate(-12deg);
}
body.riwajfood .rf-auth-v2 .rfa-art-leaf--2 {
  inset-inline-start: 10%;
  top: 22%;
  transform: rotate(20deg);
  opacity: 0.85;
}

/* Caption beside / under the stage */
body.riwajfood .rf-auth-v2 .rfa-art-caption {
  margin-top: 18px;
  max-width: 460px;
}
body.riwajfood .rf-auth-v2 .rfa-art-caption h2 {
  font-size: clamp(1.5rem, 1rem + 1.4vw, 2rem);
  font-weight: 800;
  color: var(--rfa-ink);
  margin: 0;
  letter-spacing: -0.01em;
  line-height: 1.1;
}
body.riwajfood .rf-auth-v2 .rfa-art-caption h3 {
  font-size: clamp(1.4rem, 1rem + 1.3vw, 1.9rem);
  font-weight: 800;
  color: var(--rfa-gold-deep);
  margin: 2px 0 10px;
  letter-spacing: -0.01em;
}
body.riwajfood .rf-auth-v2 .rfa-art-caption p {
  margin: 0 0 16px;
  color: var(--rfa-ink-3);
  font-size: 0.95rem;
  line-height: 1.7;
  max-width: 38ch;
}
body.riwajfood .rf-auth-v2 .rfa-art-pills {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 10px;
}
body.riwajfood .rf-auth-v2 .rfa-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 14px;
  border-radius: 999px;
  background: rgba(201, 161, 75, 0.10);
  color: var(--rfa-gold-deep);
  font-weight: 700;
  font-size: 0.8rem;
  border: 1px solid rgba(201, 161, 75, 0.22);
}

/* ════════════════════ CHOICE ════════════════════ */
body.riwajfood .rf-auth-v2 .rfa-choice {
  margin-top: clamp(8px, 2vh, 16px);
  animation: rfaRise 800ms var(--rfa-ease) both;
  animation-delay: 120ms;
}
body.riwajfood .rf-auth-v2 .rfa-choice-head {
  text-align: center;
  margin-bottom: clamp(20px, 3vh, 36px);
}
body.riwajfood .rf-auth-v2 .rfa-choice-head h2 {
  font-size: clamp(1.4rem, 1rem + 1.3vw, 2rem);
  font-weight: 800;
  color: var(--rfa-ink);
  margin: 0 0 12px;
  letter-spacing: -0.01em;
}
body.riwajfood .rf-auth-v2 .rfa-choice-rule {
  display: block;
  width: 56px;
  height: 3px;
  margin: 0 auto;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--rfa-gold-2), var(--rfa-gold));
}

body.riwajfood .rf-auth-v2 .rfa-choice-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(16px, 2.4vw, 28px);
}
@media (max-width: 720px) {
  body.riwajfood .rf-auth-v2 .rfa-choice-grid {
    grid-template-columns: 1fr;
  }
}

body.riwajfood.riwajfood .rf-auth-v2 .rfa-cc {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 10px;
  padding: clamp(20px, 3vw, 32px) clamp(18px, 2.5vw, 30px) clamp(20px, 3vw, 30px);
  background: #fff;
  border-radius: var(--rfa-r-xl);
  border: 1px solid rgba(26, 15, 8, 0.05);
  box-shadow: var(--rfa-sh-card);
  text-decoration: none;
  color: inherit;
  overflow: hidden;
  isolation: isolate;
  transition: transform 260ms var(--rfa-ease), box-shadow 260ms var(--rfa-ease), border-color 260ms ease;
}
body.riwajfood .rf-auth-v2 .rfa-cc::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: radial-gradient(circle at 50% 0%, rgba(201, 161, 75, 0.18), transparent 55%);
  opacity: 0;
  transition: opacity 260ms ease;
}
body.riwajfood.riwajfood .rf-auth-v2 .rfa-cc:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 40px -14px rgba(201, 161, 75, 0.40), 0 12px 28px rgba(26,15,8,0.06);
  border-color: rgba(201, 161, 75, 0.35);
}
body.riwajfood .rf-auth-v2 .rfa-cc:hover::before { opacity: 1; }

body.riwajfood .rf-auth-v2 .rfa-cc-badge {
  position: absolute;
  top: 14px;
  inset-inline-start: 14px;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--rfa-gold-2), var(--rfa-gold-deep));
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 6px 14px rgba(201, 161, 75, 0.35);
  z-index: 2;
}
body.riwajfood .rf-auth-v2 .rfa-cc-art {
  width: 100%;
  max-width: 280px;
  margin: 6px auto 4px;
  line-height: 0;
}
body.riwajfood .rf-auth-v2 .rfa-cc-art svg {
  width: 100%;
  height: auto;
  filter: drop-shadow(0 18px 24px rgba(26, 15, 8, 0.10));
}
body.riwajfood .rf-auth-v2 .rfa-cc-title {
  font-size: 1.25rem;
  font-weight: 800;
  color: var(--rfa-ink);
  margin: 4px 0 0;
  letter-spacing: -0.01em;
}
body.riwajfood .rf-auth-v2 .rfa-cc-desc {
  margin: 0 0 14px;
  color: var(--rfa-ink-3);
  font-size: 0.92rem;
  line-height: 1.7;
  max-width: 36ch;
}
body.riwajfood.riwajfood .rf-auth-v2 .rfa-cc-cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 11px 28px;
  border-radius: 999px;
  background: linear-gradient(180deg, var(--rfa-gold-2) 0%, var(--rfa-gold) 100%);
  color: #fff;
  font-weight: 700;
  font-size: 0.92rem;
  text-decoration: none;
  letter-spacing: 0.01em;
  box-shadow: 0 8px 18px rgba(201, 161, 75, 0.40);
  transition: transform 200ms var(--rfa-ease), filter 200ms ease, box-shadow 200ms ease;
  margin-top: auto;
}
body.riwajfood.riwajfood .rf-auth-v2 .rfa-cc:hover .rfa-cc-cta {
  transform: translateY(-1px);
  filter: brightness(1.06);
  box-shadow: 0 14px 28px rgba(201, 161, 75, 0.50);
}
[dir="ltr"] body.riwajfood .rf-auth-v2 .rfa-cc-cta svg,
body[dir="ltr"].riwajfood .rf-auth-v2 .rfa-cc-cta svg { transform: scaleX(-1); }

/* ════════════════════ FEATURES (trust bar) ════════════════════ */
body.riwajfood .rf-auth-v2 .rfa-features {
  background: rgba(255, 255, 255, 0.72);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(201, 161, 75, 0.22);
  border-radius: var(--rfa-r-xl);
  padding: clamp(16px, 2.4vw, 22px) clamp(16px, 2.4vw, 28px);
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: clamp(12px, 2vw, 28px);
  box-shadow: var(--rfa-sh-soft);
  animation: rfaRise 900ms var(--rfa-ease) both;
  animation-delay: 160ms;
}
@media (max-width: 880px) {
  body.riwajfood .rf-auth-v2 .rfa-features { grid-template-columns: repeat(2, 1fr); gap: 18px; }
}
@media (max-width: 460px) {
  body.riwajfood .rf-auth-v2 .rfa-features { grid-template-columns: 1fr; }
}
body.riwajfood .rf-auth-v2 .rfa-feat {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}
body.riwajfood .rf-auth-v2 .rfa-feat-ico {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: var(--rfa-gold-tint);
  color: var(--rfa-gold-deep);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  border: 1px solid rgba(201, 161, 75, 0.22);
}
body.riwajfood .rf-auth-v2 .rfa-feat-text {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
body.riwajfood .rf-auth-v2 .rfa-feat-text strong {
  color: var(--rfa-ink);
  font-size: 0.92rem;
  font-weight: 700;
  line-height: 1.3;
}
body.riwajfood .rf-auth-v2 .rfa-feat-text span {
  color: var(--rfa-ink-4);
  font-size: 0.78rem;
  line-height: 1.4;
  margin-top: 2px;
}

/* ════════════════════ TABLET ════════════════════ */
@media (max-width: 960px) {
  body.riwajfood .rf-auth-v2 .rfa-card {
    order: 1;     /* form first on stacked layout */
  }
  body.riwajfood .rf-auth-v2 .rfa-art {
    order: 2;
    text-align: center;
  }
  body.riwajfood .rf-auth-v2 .rfa-art-stage {
    max-width: 320px;
    margin-inline: auto;
  }
  body.riwajfood .rf-auth-v2 .rfa-art-caption {
    margin-inline: auto;
  }
  body.riwajfood .rf-auth-v2 .rfa-art-caption p {
    margin-inline: auto;
  }
  body.riwajfood .rf-auth-v2 .rfa-art-pills {
    justify-content: center;
  }
}

/* ════════════════════ MOBILE ════════════════════ */
@media (max-width: 640px) {
  body.riwajfood .rf-auth-v2 {
    padding: clamp(20px, 4vh, 36px) 0 clamp(28px, 4vh, 48px);
  }
  body.riwajfood .rf-auth-v2 .rfa-card {
    padding: 22px 18px;
    border-radius: var(--rfa-r-lg);
  }
  body.riwajfood.riwajfood .rf-auth-v2 .rfa-input input[type="email"],
  body.riwajfood.riwajfood .rf-auth-v2 .rfa-input input[type="password"],
  body.riwajfood.riwajfood .rf-auth-v2 .rfa-input input[type="text"] {
    height: 46px;
    font-size: 0.95rem;
  }
  body.riwajfood.riwajfood .rf-auth-v2 #rf-login-submit {
    height: 50px;
    font-size: 0.95rem;
  }
  body.riwajfood .rf-auth-v2 .rfa-socials { gap: 8px; }
  body.riwajfood.riwajfood .rf-auth-v2 .rfa-social { height: 44px; }

  body.riwajfood .rf-auth-v2 .rfa-art-stage { max-width: 240px; }
  body.riwajfood .rf-auth-v2 .rfa-art-caption h2,
  body.riwajfood .rf-auth-v2 .rfa-art-caption h3 { line-height: 1.15; }
  body.riwajfood .rf-auth-v2 .rfa-art-caption p { font-size: 0.9rem; }

  body.riwajfood .rf-auth-v2 .rfa-cc { border-radius: var(--rfa-r-lg); }
  body.riwajfood .rf-auth-v2 .rfa-cc-badge {
    width: 38px; height: 38px;
    top: 12px;
    inset-inline-start: 12px;
  }
  body.riwajfood .rf-auth-v2 .rfa-cc-art { max-width: 220px; }

  body.riwajfood .rf-auth-v2 .rfa-features {
    border-radius: var(--rfa-r-lg);
    padding: 16px;
  }
}

@media (max-width: 380px) {
  body.riwajfood .rf-auth-v2 .rfa-card { padding: 20px 16px; }
  body.riwajfood .rf-auth-v2 .rfa-card-title { font-size: 1.45rem; }
  body.riwajfood .rf-auth-v2 .rfa-cc-title { font-size: 1.1rem; }
  body.riwajfood .rf-auth-v2 .rfa-cc-desc { font-size: 0.88rem; }
  body.riwajfood.riwajfood .rf-auth-v2 .rfa-cc-cta {
    padding: 10px 22px;
    font-size: 0.88rem;
  }
}

/* ============================================================
   [RF-LOGIN-UX 2026-05-28] — Above-the-fold register prompt.
   Adds the "ليس لديك حساب؟ سجل الآن" line directly under the
   login title so registration is discoverable without scrolling.
   Clicking the link smooth-scrolls to the existing .rfa-choice
   section (now id="rfa-register-now") via the inline script in
   templates/customer-login.php.

   Scoped under .rf-auth-v2 so it cannot affect any non-auth page.
   No layout changes, no new flex/grid, no global rules.
   Reverse by deleting this block.
   ============================================================ */

/* Prompt line under the title — visually a quiet second beat */
body.riwajfood .rf-auth-v2 .rfa-card-prompt {
  margin: 14px 0 0;
  font-size: 0.95rem;
  font-weight: 500;
  color: var(--rfa-ink, #6B5043);
  text-align: center;
  line-height: 1.45;
}

body.riwajfood .rf-auth-v2 .rfa-card-prompt-q {
  color: var(--rfa-ink, #6B5043);
  opacity: 0.85;
  margin-inline-end: 4px;
}

body.riwajfood .rf-auth-v2 .rfa-card-prompt-link {
  color: var(--rfa-brand, #D4511E);
  font-weight: 700;
  text-decoration: none;
  border-bottom: 1.5px solid currentColor;
  padding-bottom: 1px;
  transition: color 0.15s ease, opacity 0.15s ease;
}

body.riwajfood .rf-auth-v2 .rfa-card-prompt-link:hover,
body.riwajfood .rf-auth-v2 .rfa-card-prompt-link:focus-visible {
  color: var(--rfa-brand-deep, #B33E14);
  opacity: 1;
}

/* Anchor target — give the scroll a little breathing room from
   the top so the section header isn't flush against the navbar. */
body.riwajfood .rf-auth-v2 #rfa-register-now {
  scroll-margin-top: 24px;
}

/* Brief flash highlight on the registration section when the
   prompt link is clicked — gives the user a visual confirmation
   of where they landed. Pure CSS animation triggered by the
   inline JS adding/removing .rfa-flash. */
@keyframes rfa-flash-pulse {
  0%   { box-shadow: 0 0 0 0 rgba(212, 81, 30, 0.0); }
  20%  { box-shadow: 0 0 0 6px rgba(212, 81, 30, 0.18); }
  100% { box-shadow: 0 0 0 0 rgba(212, 81, 30, 0.0); }
}

body.riwajfood .rf-auth-v2 .rfa-choice.rfa-flash {
  animation: rfa-flash-pulse 1.2s ease-out;
  border-radius: var(--rfa-r-lg, 22px);
}

/* Respect reduced-motion preference — no pulse for users who
   asked the OS to minimize animation. */
@media (prefers-reduced-motion: reduce) {
  body.riwajfood .rf-auth-v2 .rfa-choice.rfa-flash {
    animation: none;
  }
}

/* ========== END [RF-LOGIN-UX 2026-05-28] ========== */

/* ========== END AUTH PRO ========== */
