/* brand/assets/auth.css — صفحات الدخول وإنشاء الحساب وإتمام البيانات في النسخة البراندية.
   منقولة من تصميم منصة Brand Card الجديدة (login2 / CompleteOnboarding / OnboardingPicker) بنفس
   القيم: الخط Cairo (عادي وعريض)، صورة خلفية بملء الشاشة، أزرار بيضاء دائرية، والأحمر للإجراء
   الأساسي فقط والذهبي للروابط. كل القواعد تحت بادئات bxa- / bxo- / bxp- فلا تمس أي صفحة أخرى. */

/* ══ شاشة الدخول وإنشاء الحساب (login2) ══ */
.bxa{
  --bxa-primary:#ed2939;--bxa-gold:#f4b71b;--bxa-ink:#1a1a1a;--bxa-ink-soft:rgba(26,26,26,.55);
  --bxa-shadow-text:0 1px 3px rgba(0,0,0,.7),0 1px 12px rgba(0,0,0,.5);
  --bxa-font:'BX Cairo','Cairo',Tahoma,sans-serif;
}
html.bxa-html,body.bxa{height:100%;overflow:hidden;margin:0;background:#0b0d14}
body.bxa{padding-bottom:0!important}
body.bxa .site-bottom-nav{display:none!important}
body.bxa #pwa-bar{top:calc(16px + env(safe-area-inset-top))!important}

.bxa-screen{position:fixed;inset:0;width:100%;height:100dvh;overflow:hidden;touch-action:manipulation;display:flex;flex-direction:column;
  background:#0b0d14;z-index:50;font-family:var(--bxa-font);color:#fff;-webkit-tap-highlight-color:transparent}
.bxa-screen *,.bxa-screen *::before,.bxa-screen *::after{box-sizing:border-box}
.bxa-screen button,.bxa-screen input{font-family:inherit}

.bxa-bg{position:absolute;inset:0;z-index:0;overflow:hidden;background-color:#0b0d14;background-size:cover;background-position:center;
  animation:bxa-bg-drift 26s ease-in-out infinite alternate;transition:background-image .2s}
.bxa-bg::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(62% 58% at 50% 54%,rgba(4,6,12,.6),rgba(4,6,12,.32) 55%,rgba(4,6,12,0) 82%),linear-gradient(to top,rgba(0,0,0,.7),rgba(0,0,0,0) 26%)}
.bxa-bg-root{background-image:url('img/login-bg.jpg')}
.bxa-bg-inner{background-image:url('img/login-inner-bg.jpg')}
@keyframes bxa-bg-drift{from{transform:scale(1.06) translate3d(0,0,0)}to{transform:scale(1.16) translate3d(-1.5%,-1.5%,0)}}

.bxa-scroll{position:relative;z-index:1;flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;display:flex;flex-direction:column;
  padding:max(clamp(16px,3vh,24px),env(safe-area-inset-top)) 24px max(clamp(16px,3vh,24px),env(safe-area-inset-bottom));
  scrollbar-width:none;overflow-anchor:none}
.bxa-scroll::-webkit-scrollbar{display:none;width:0;height:0}
.bxa-content{display:flex;flex-direction:column;margin-block:auto;gap:clamp(14px,2.6dvh,24px)}

.bxa-identity{display:flex;flex-direction:column;align-items:center;gap:clamp(6px,1vh,10px)}
/* الشعار في منتصف الشاشة تماما: الرابط نفسه يتوسط (كان max-width بالنسبة المئوية يصغر الصورة داخل رابط بعرضها
   الأصلي فتلتصق بطرفه وتنزاح ~50px لليمين)، والصورة تتحدد بأقصى عرض وارتفاع معا فيناسب الشعار العريض والمربع */
.bxa-logo-link{display:flex;justify-content:center;max-width:100%;margin-bottom:clamp(4px,1.6vh,14px)}
.bxa-logo{display:block;width:auto;height:auto;max-width:min(280px,72vw);max-height:min(clamp(72px,14vh,108px),16dvh);object-fit:contain}
/* شاشة طرق الدخول (مثل موقع الشحن): الشعار ثم الطرق مباشرة تحته، والكتلة كلها في منتصف الشاشة بلا فراغ بينهما */
.bxa-content.bxa-root{gap:clamp(20px,3.6dvh,32px)}
.bxa-root .bxa-error-slot:not(:has(.bxa-error)){display:none}
.bxa-note{display:flex;align-items:flex-start;gap:8px;margin:0;padding:10px 12px;border-radius:14px;border:1px solid rgba(255,255,255,.16);background:rgba(10,12,20,.55);
  color:rgba(255,255,255,.9);font-size:12.5px;font-weight:500;line-height:1.7}
.bxa-note svg{flex-shrink:0;margin-top:3px;color:var(--bxa-gold)}
.bxa-logo-text{font-size:clamp(20px,5.6vw,24px);font-weight:700;color:#fff;text-shadow:var(--bxa-shadow-text)}
.bxa-title{margin:0;width:100%;text-align:center;font-size:clamp(20px,5.6vw,24px);font-weight:700;line-height:1.3;color:#fff;text-shadow:var(--bxa-shadow-text)}
.bxa-subtitle{margin:0;width:100%;text-align:center;font-size:14px;line-height:1.5;font-weight:400;color:#fff;text-shadow:var(--bxa-shadow-text)}
.bxa-sr{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

.bxa-methods{display:flex;flex-direction:column;width:100%;max-width:320px;margin-inline:auto;gap:clamp(6px,1.1dvh,10px)}
.bxa-methods-label{display:flex;align-items:center;gap:12px;margin:0;font-size:13px;font-weight:500;line-height:1.4;color:rgba(255,255,255,.78)}
.bxa-methods-label::before,.bxa-methods-label::after{content:"";flex:1;height:1px;background:currentColor;opacity:.35}

.bxa-social{width:100%;display:grid;grid-template-columns:24px 1fr 24px;align-items:center;gap:0;min-height:44px;padding:0 18px;border-radius:999px;
  border:1px solid rgba(0,0,0,.12);background:#fff;color:var(--bxa-ink);font-weight:600;font-size:15px;line-height:1.2;cursor:pointer;text-decoration:none;
  box-shadow:0 2px 8px -2px rgba(0,0,0,.18);transition:background-color .16s,border-color .16s,transform .16s,box-shadow .16s}
.bxa-social>svg:first-child,.bxa-social>.bxa-glyph{grid-column:1;justify-self:start}
.bxa-social>span:not(.bxa-glyph){grid-column:2;justify-self:center;white-space:nowrap}
.bxa-glyph{display:grid;place-items:center;width:24px;height:24px;color:#1f2937}
.bxa-social:hover{background:#f5f5f5;border-color:rgba(0,0,0,.2);box-shadow:0 6px 16px -6px rgba(0,0,0,.18)}
.bxa-social:active{transform:scale(.98);box-shadow:0 1px 2px rgba(0,0,0,.08)}
.bxa-social:focus-visible{outline:2px solid var(--bxa-primary);outline-offset:2px}

/* خطوة البريد: رأس بزر رجوع دائري وعنوان في المنتصف */
.bxa-step-head{display:grid;grid-template-columns:40px 1fr 40px;align-items:center;gap:10px}
.bxa-step-head::after{content:""}
.bxa-back{width:40px;height:40px;display:grid;place-items:center;padding:0;text-decoration:none;border-radius:50%;border:1px solid rgba(0,0,0,.12);background:#fff;color:var(--bxa-ink);cursor:pointer}
.bxa-back:focus-visible{outline:2px solid var(--bxa-primary);outline-offset:2px}
.bxa-step-title{grid-column:2;min-width:0;margin:0;text-align:center;font-family:var(--bxa-font);font-size:clamp(1rem,3.6vw,1.15rem);font-weight:700;line-height:1.35;color:#fff;text-shadow:var(--bxa-shadow-text)}

.bxa-form{display:grid;gap:10px}
.bxa-field{display:flex;flex-direction:column;gap:4px;min-width:0}
.bxa-label{display:block;font-size:14px;font-weight:500;line-height:20px;text-align:right;color:#fff;text-shadow:var(--bxa-shadow-text)}
.bxa-label.req::after{content:"*";margin-inline-start:2px}
.bxa-label small{font-size:12px;font-weight:400;opacity:.8}
.bxa-group{display:flex;align-items:center;min-height:38px;border-radius:14.4px;border:1px solid rgba(0,0,0,.12);background:#fff;color:var(--bxa-ink);
  box-shadow:0 2px 4px rgba(0,0,0,.04),0 1px 2px rgba(0,0,0,.06),0 0 1px rgba(0,0,0,.06);transition:border-color .15s,box-shadow .15s}
.bxa-group:focus-within{border-color:rgba(0,0,0,.35);box-shadow:0 0 0 3px rgba(255,255,255,.28)}
.bxa-ic{flex-shrink:0;width:42px;height:36px;display:grid;place-items:center;color:var(--bxa-ink-soft)}
.bxa-input{flex:1;min-width:0;height:36px;padding:8px 0 8px 12px;border:0;outline:0;background:transparent;color:var(--bxa-ink);font-size:14px;line-height:20px;text-align:right}
.bxa-input::placeholder{color:var(--bxa-ink-soft)}
.bxa-input:-webkit-autofill,.bxa-input:-webkit-autofill:hover,.bxa-input:-webkit-autofill:focus{-webkit-text-fill-color:var(--bxa-ink);caret-color:var(--bxa-ink);-webkit-box-shadow:0 0 0 40px #fff inset}
.bxa-input[dir="ltr"]{text-align:left;padding:8px 12px 8px 0}
.bxa-input[dir="ltr"]:last-child{padding:8px 14px}
.bxa-eye{flex-shrink:0;width:48px;height:36px;display:grid;place-items:center;border:0;background:transparent;color:var(--bxa-ink-soft);cursor:pointer;border-radius:0 14.4px 14.4px 0}
html[dir="rtl"] .bxa-eye{border-radius:14.4px 0 0 14.4px}
.bxa-eye:focus-visible{outline:2px solid var(--bxa-primary);outline-offset:-2px}

/* حقل اختيار (البلد/العملة) بنفس شكل الحقل */
.bxa-select{width:100%;display:flex;align-items:center;gap:8px;min-height:38px;padding:0 12px;border-radius:14.4px;border:1px solid rgba(0,0,0,.12);
  background:#fff;color:var(--bxa-ink);font-size:14px;cursor:pointer;text-align:right;
  box-shadow:0 2px 4px rgba(0,0,0,.04),0 1px 2px rgba(0,0,0,.06),0 0 1px rgba(0,0,0,.06)}
.bxa-select:focus-visible{outline:none;border-color:rgba(0,0,0,.35);box-shadow:0 0 0 3px rgba(255,255,255,.28)}
.bxa-select-value{flex:1;min-width:0;display:flex;align-items:center;gap:8px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.bxa-select-ph{color:var(--bxa-ink-soft)}
.bxa-select-code{flex-shrink:0;font-size:12px;font-weight:600;color:var(--bxa-ink-soft);direction:ltr}
.bxa-select-chev{flex-shrink:0;color:var(--bxa-ink-soft)}
.bxa-stack{display:grid;gap:10px}

.bxa-flag{flex-shrink:0;width:20px;height:20px;border-radius:999px;object-fit:cover;box-shadow:0 0 0 1px rgba(0,0,0,.08)}
.bxa-flag-txt{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:999px;background:rgba(0,0,0,.06);font-size:10px;font-weight:700;color:var(--bxa-ink-soft)}

.bxa-reqs{display:grid;gap:4px;margin:-4px 0 0;padding:0;list-style:none}
.bxa-req{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:500;line-height:1.55;color:rgba(255,255,255,.85);text-shadow:var(--bxa-shadow-text)}
.bxa-req .on{display:none}
.bxa-req.is-met{color:#6ee7a8}
.bxa-req.is-met .on{display:block}.bxa-req.is-met .off{display:none}

.bxa-error-slot{min-height:20px}
.bxa-error{display:flex;align-items:center;gap:6px;margin:0;padding:8px 12px;border-radius:12px;border:1px solid rgba(248,113,113,.7);background:rgba(127,29,29,.62);
  color:#ffe4e4;font-size:12px;font-weight:600;line-height:1.6;box-shadow:0 6px 18px rgba(0,0,0,.28);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.bxa-error svg{flex-shrink:0;color:#ff8a8a}

.bxa-submit{width:100%;display:flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:999px;min-height:52px;padding:12px;
  background:var(--bxa-primary);color:#fff;font-weight:600;font-size:.88rem;cursor:pointer;text-decoration:none;
  box-shadow:0 8px 16px -10px rgba(237,41,57,.4);transition:opacity .16s,transform .16s,box-shadow .16s}
.bxa-submit:hover{opacity:.92;box-shadow:0 10px 18px -9px rgba(237,41,57,.45)}
.bxa-submit:active{transform:scale(.98);box-shadow:0 6px 14px -8px rgba(237,41,57,.65)}
.bxa-submit:focus-visible{outline:2px solid #fff;outline-offset:2px}

.bxa-foot{margin:0;text-align:center;font-size:14px;line-height:1.55;color:#fff;text-shadow:var(--bxa-shadow-text)}
.bxa-foot a{color:#fff;text-decoration:none}
.bxa-foot a:hover{text-decoration:underline}

/* صورة الحساب (اختيارية) في إنشاء الحساب: دائرة بيضاء هادئة */
.bxa-ava-wrap{display:flex;justify-content:center}
.bxa-ava{position:relative;width:64px;height:64px;border-radius:50%;cursor:pointer;display:block}
.bxa-ava-face{width:100%;height:100%;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:#fff;color:var(--bxa-ink);
  font-size:1.4rem;font-weight:700;box-shadow:0 2px 8px -2px rgba(0,0,0,.18)}
.bxa-ava-face img{width:100%;height:100%;object-fit:cover;display:block}
.bxa-ava-badge{position:absolute;bottom:-2px;inset-inline-end:-2px;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;
  background:var(--bxa-ink);color:#fff;border:2px solid #fff}
.bxa-ava input{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer}


/* ══ خطوة رمز البريد (brand/_email_code_page.php — VerifyEmail في المرجع) ══ */
.bxa-code-head{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;margin-bottom:6px}
.bxa-code-ic{display:grid;place-items:center;width:58px;height:58px;margin-bottom:4px;border-radius:50%;background:#fff;color:var(--bxa-ink);box-shadow:0 6px 18px -8px rgba(0,0,0,.5)}
.bxa-code-lead{margin:0;font-size:14px;line-height:1.6;color:#fff;text-shadow:var(--bxa-shadow-text)}
.bxa-code-target{margin:0;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:15px;font-weight:700;color:var(--bxa-gold);text-shadow:var(--bxa-shadow-text)}
.bxa-otp{position:relative;display:grid;grid-template-columns:repeat(6,1fr);gap:8px;direction:ltr;cursor:text}
.bxa-otp-input{position:absolute;inset:0;width:100%;height:100%;opacity:0;border:0;padding:0;font-size:16px;color:transparent;caret-color:transparent;background:transparent;z-index:2}
.bxa-otp-box{display:grid;place-items:center;height:54px;border-radius:14px;border:1.5px solid rgba(0,0,0,.12);background:#fff;color:var(--bxa-ink);
  font-family:Arial,sans-serif;font-size:24px;font-weight:700;box-shadow:0 2px 6px rgba(0,0,0,.08);transition:border-color .15s,box-shadow .15s,transform .15s}
.bxa-otp-box.is-filled{border-color:rgba(0,0,0,.35)}
.bxa-otp-box.is-active{border-color:var(--bxa-primary);box-shadow:0 0 0 3px rgba(237,41,57,.28)}
.bxa-ok{display:flex;align-items:center;gap:6px;margin:0;padding:8px 12px;border-radius:12px;border:1px solid rgba(110,231,168,.6);background:rgba(6,78,59,.6);
  color:#d1fae5;font-size:12px;font-weight:600;line-height:1.6}
.bxa-resend{display:flex;align-items:center;justify-content:center;gap:6px;margin:4px 0 0;font-size:13px;color:rgba(255,255,255,.85);text-shadow:var(--bxa-shadow-text)}
.bxa-resend button{padding:4px 6px;border:0;background:none;color:var(--bxa-gold);font-family:inherit;font-size:13px;font-weight:700;cursor:pointer;text-shadow:var(--bxa-shadow-text)}
.bxa-resend button:disabled{color:rgba(255,255,255,.55);cursor:default}
.bxa-code-hint{margin:0;text-align:center;font-size:11.5px;line-height:1.7;color:rgba(255,255,255,.7);text-shadow:var(--bxa-shadow-text)}
.bxa-forgot{display:flex;justify-content:flex-end;margin-top:-4px}
.bxa-forgot a{font-size:12.5px;font-weight:600;color:#fff;text-decoration:none;text-shadow:var(--bxa-shadow-text)}
.bxa-forgot a:hover{text-decoration:underline}

@media (min-width:640px){
  .bxa-scroll{width:100%;max-width:400px;margin:0 auto;padding:32px 0 max(32px,env(safe-area-inset-bottom))}
}
@media (max-height:680px){
  .bxa-content{gap:14px}
  .bxa-scroll{padding-top:12px}
}
@media (max-height:600px){
  .bxa-logo{height:56px}
  .bxa-identity{gap:4px}
  .bxa-methods{gap:6px}
  .bxa-content{gap:10px}
  .bxa-title{font-size:1.05rem}
  .bxa-social{min-height:40px}
  .bxa-submit{min-height:42px;padding:8px}
}
@media (prefers-reduced-motion:reduce){
  .bxa-bg{animation:none}
  .bxa-social,.bxa-submit{transition:none}
}

/* ══ إتمام البيانات بعد جوجل (CompleteOnboarding) — يتبع الوضع الليلي/النهاري للموقع ══ */
.bxo-page{
  --bxo-bg:#18181c;--bxo-text:#f2f2f3;--bxo-muted:#98989f;--bxo-line:#34343b;--bxo-line-strong:#4c4c55;--bxo-field:#1e1e23;
  --bxo-soft:rgba(255,255,255,.06);--bxo-ring:rgba(255,255,255,.18);--bxo-primary:#ff4d5e;--bxo-danger:#ff5c5c;--bxo-success:#2ed47a;
  position:fixed;inset-inline:0;top:0;height:100vh;height:100dvh;z-index:50;display:flex;flex-direction:column;overflow:hidden;
  background:var(--bxo-bg);color:var(--bxo-text);font-family:'BX Cairo','Cairo',Tahoma,sans-serif;-webkit-tap-highlight-color:transparent
}
html[data-bc-theme="light"] .bxo-page{
  --bxo-bg:#ffffff;--bxo-text:#1a1a1a;--bxo-muted:#8a8a8e;--bxo-line:#dcdce1;--bxo-line-strong:#b9b9c1;--bxo-field:#ffffff;
  --bxo-soft:rgba(17,17,20,.05);--bxo-ring:rgba(17,17,20,.14);--bxo-primary:#ed2939;--bxo-danger:#e53935;--bxo-success:#18b868
}
html.bxo-html,body.bxo{height:100%;overflow:hidden;margin:0;background:#18181c}
html[data-bc-theme="light"] body.bxo{background:#fff}
body.bxo{padding-bottom:0!important}
body.bxo .site-bottom-nav{display:none!important}
.bxo-page *,.bxo-page *::before,.bxo-page *::after{box-sizing:border-box}
.bxo-page button,.bxo-page input{font-family:inherit}

.bxo-bar{flex-shrink:0;display:grid;grid-template-columns:48px minmax(0,1fr) 48px;align-items:center;height:60px;padding:env(safe-area-inset-top,0px) 8px 0;box-sizing:content-box!important}
.bxo-bar-side{display:flex;align-items:center;justify-content:center}
.bxo-back{width:44px;height:44px;display:grid;place-items:center;border:0;border-radius:999px;background:transparent;color:var(--bxo-text);cursor:pointer}
.bxo-back:hover{background:var(--bxo-soft)}
.bxo-back:focus-visible{outline:2px solid var(--bxo-text);outline-offset:1px}
.bxo-back[hidden]{display:none}
.bxo-brand{justify-self:center;display:flex;align-items:center;justify-content:center;height:32px;max-width:100%}
.bxo-brand img{display:block;height:100%;width:auto;max-width:100%;object-fit:contain}
.bxo-brand span{font-size:16px;font-weight:700;color:var(--bxo-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.bxo-scroll{flex:1;min-height:0;display:flex;flex-direction:column;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;margin:0}
.bxo-column{width:100%;max-width:440px;margin-inline:auto;padding-inline:clamp(16px,5.4vw,24px)}
.bxo-main{flex:1 0 auto;padding-top:12px;padding-bottom:24px}

.bxo-progress{display:flex;flex-direction:column;gap:8px;margin-bottom:18px}
.bxo-progress-text{font-size:13px;font-weight:700;line-height:1.4;color:var(--bxo-muted)}
.bxo-progress-track{display:flex;gap:6px;width:100%}
.bxo-progress-seg{flex:1 1 0;height:6px;overflow:hidden;border-radius:999px;background:var(--bxo-line)}
.bxo-progress-seg i{display:block;height:100%;border-radius:inherit;transform:scaleX(0);transform-origin:right center;
  background:linear-gradient(270deg,color-mix(in srgb,var(--bxo-primary) 78%,#fff),var(--bxo-primary));transition:transform 420ms cubic-bezier(.22,1,.36,1)}
html[dir="ltr"] .bxo-progress-seg i{transform-origin:left center;background:linear-gradient(90deg,color-mix(in srgb,var(--bxo-primary) 78%,#fff),var(--bxo-primary))}
.bxo-progress-seg i.is-on{transform:scaleX(1)}

.bxo-pane{animation:bxo-pane-in 200ms cubic-bezier(.22,1,.36,1) both}
.bxo-pane[hidden]{display:none}
.bxo-pane.is-back{--bxo-shift:18px}
.bxo-pane{--bxo-shift:-18px}
@keyframes bxo-pane-in{from{opacity:0;transform:translateX(var(--bxo-shift))}to{opacity:1;transform:none}}
.bxo-title{margin:0 0 6px;font-size:23px;font-weight:700;line-height:1.35;color:var(--bxo-text);outline:none}
.bxo-lead{margin:0 0 24px;font-size:15px;font-weight:500;line-height:1.6;color:var(--bxo-muted)}
.bxo-fields{display:flex;flex-direction:column;gap:20px}
.bxo-field{min-width:0}
.bxo-label{display:block;margin-bottom:8px;font-size:14px;font-weight:700;line-height:1.4;color:var(--bxo-text)}

.bxo-select,.bxo-input,.bxo-phone{width:100%;height:50px;border:1px solid var(--bxo-line);border-radius:12px;background:var(--bxo-field);color:var(--bxo-text);
  transition:border-color 140ms ease,box-shadow 140ms ease}
.bxo-select{display:flex;align-items:center;gap:10px;padding-inline:14px 12px;font-size:15px;font-weight:600;text-align:start;cursor:pointer}
.bxo-select:hover,.bxo-input:hover,.bxo-phone:hover{border-color:var(--bxo-line-strong)}
.bxo-select:focus-visible,.bxo-input:focus,.bxo-phone:focus-within{outline:none;border-color:var(--bxo-text);box-shadow:0 0 0 3px var(--bxo-ring)}
.bxo-select.is-invalid,.bxo-phone.is-invalid{border-color:var(--bxo-danger)}
.bxo-select-value{flex:1;min-width:0;display:flex;align-items:center;gap:10px}
.bxo-select-text{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bxo-placeholder{font-weight:500;color:var(--bxo-muted)}
.bxo-select-chev{flex-shrink:0;color:var(--bxo-muted)}
.bxo-code{flex-shrink:0;margin-inline-start:auto;font-size:13px;font-weight:700;letter-spacing:.04em;color:var(--bxo-muted);direction:ltr}
.bxo-flag{flex-shrink:0;width:22px;height:22px;border-radius:999px;object-fit:cover;box-shadow:0 0 0 1px rgba(0,0,0,.08)}
.bxo-flag-txt{display:inline-grid;place-items:center;background:var(--bxo-soft);color:var(--bxo-muted);font-size:9px;font-weight:700;box-shadow:none}
.bxo-input{padding-inline:14px;font-size:16px;font-weight:600}
.bxo-phone{display:flex;align-items:stretch;overflow:hidden}
.bxo-dial{flex-shrink:0;display:flex;align-items:center;gap:7px;padding:0 10px 0 12px;border:0;border-right:1px solid var(--bxo-line);background:transparent;
  color:var(--bxo-text);font-size:15px;font-weight:700;cursor:pointer}
.bxo-dial:hover,.bxo-dial:focus-visible{outline:none;background:var(--bxo-soft)}
.bxo-dial-code{font-variant-numeric:tabular-nums}
.bxo-phone-input{flex:1;min-width:0;padding:0 14px;border:0;background:transparent;color:var(--bxo-text);font-size:16px;font-weight:600;letter-spacing:.03em;
  font-variant-numeric:tabular-nums;outline:none}
.bxo-note{margin:8px 0 0;font-size:13px;font-weight:500;line-height:1.5;color:var(--bxo-muted)}
.bxo-error{display:flex;align-items:center;gap:6px;margin:8px 0 0;font-size:13px;font-weight:600;line-height:1.5;color:var(--bxo-danger)}
.bxo-error[hidden]{display:none}

/* حساب جوجل: الصورة (قابلة للتغيير) والبريد في صف هادئ */
.bxo-account{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid var(--bxo-line);border-radius:14px;background:var(--bxo-field)}
.bxo-ava{position:relative;flex-shrink:0;width:46px;height:46px;border-radius:50%;cursor:pointer;display:block}
.bxo-ava-face{width:100%;height:100%;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:var(--bxo-soft);color:var(--bxo-text);font-size:1.1rem;font-weight:700}
.bxo-ava-face img{width:100%;height:100%;object-fit:cover;display:block}
.bxo-ava-badge{position:absolute;bottom:-2px;inset-inline-end:-2px;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;
  background:var(--bxo-text);color:var(--bxo-bg);border:2px solid var(--bxo-field)}
.bxo-ava input{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer}
.bxo-account-info{flex:1;min-width:0}
.bxo-account-label{font-size:12px;font-weight:600;color:var(--bxo-muted)}
.bxo-account-email{display:flex;align-items:center;gap:6px;font-size:14px;font-weight:700;color:var(--bxo-text);direction:ltr;justify-content:flex-end;
  overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.bxo-account-email svg{flex-shrink:0}

.bxo-actions{position:sticky;bottom:0;z-index:1;padding-block:12px max(16px,env(safe-area-inset-bottom,0px));background:var(--bxo-bg)}
.bxo-alert{display:flex;align-items:flex-start;gap:8px;margin:0 0 10px;padding:10px 12px;border-radius:10px;
  background:color-mix(in srgb,var(--bxo-danger) 10%,transparent);color:var(--bxo-danger);font-size:13.5px;font-weight:600;line-height:1.5}
.bxo-alert svg{flex-shrink:0;margin-top:2px}
.bxo-primary{position:relative;width:100%;height:52px;display:flex;align-items:center;justify-content:center;border:0;border-radius:999px;
  background:var(--bxo-primary);color:#fff;font-size:16px;font-weight:700;cursor:pointer;transition:filter 140ms ease,transform 140ms ease}
.bxo-primary:hover{filter:brightness(.95)}
.bxo-primary:active{transform:scale(.985)}
.bxo-primary:focus-visible{outline:2px solid var(--bxo-text);outline-offset:3px}
.bxo-text-btn{display:block;margin:10px auto 0;padding:4px 8px;border:0;background:none;color:var(--bxo-muted);font-size:13px;font-weight:600;text-align:center;text-decoration:none}
.bxo-text-btn:hover{color:var(--bxo-text)}

@media (max-width:359px){
  .bxo-title{font-size:21px}
  .bxo-lead{font-size:14px;margin-bottom:20px}
}
@media (min-width:720px){
  .bxo-bar{height:76px;padding-inline:24px}
  .bxo-brand{height:36px}
  .bxo-scroll{justify-content:center;padding-bottom:76px}
  .bxo-main{flex:0 0 auto;padding-top:0;padding-bottom:28px}
  .bxo-actions{position:static;padding-block:0 24px}
}
@media (prefers-reduced-motion:reduce){.bxo-pane{animation:none}}

/* ══ نافذة الاختيار (البلد/العملة/كود الاتصال) — ورقة سفلية على الموبايل ونافذة في المنتصف على الكمبيوتر ══ */
.bxp{
  --bxp-surface:#18181c;--bxp-text:#f2f2f3;--bxp-muted:#98989f;--bxp-field:#222228;--bxp-soft:rgba(255,255,255,.06);--bxp-primary:#ff4d5e;
  position:fixed;inset:0;z-index:1100;display:flex;align-items:flex-end;justify-content:center;background:rgba(0,0,0,.62);
  font-family:'BX Cairo','Cairo',Tahoma,sans-serif;animation:bxp-fade 180ms ease-out;-webkit-tap-highlight-color:transparent
}
html[data-bc-theme="light"] body.bxo .bxp{
  --bxp-surface:#ffffff;--bxp-text:#1a1a1a;--bxp-muted:#8a8a8e;--bxp-field:#f4f4f6;--bxp-soft:rgba(17,17,20,.05);--bxp-primary:#ed2939;
  background:rgba(10,10,12,.48)
}
.bxp[hidden]{display:none}
.bxp *,.bxp *::before,.bxp *::after{box-sizing:border-box}
.bxp button,.bxp input{font-family:inherit}
.bxp-panel{width:100%;height:min(600px,calc(100% - 40px));display:flex;flex-direction:column;overflow:hidden;padding-bottom:env(safe-area-inset-bottom,0px);
  border-radius:20px 20px 0 0;background:var(--bxp-surface);color:var(--bxp-text);box-shadow:0 -10px 32px rgba(0,0,0,.16);outline:none;
  animation:bxp-up 240ms cubic-bezier(.22,1,.36,1)}
.bxp-panel.is-short{height:auto;max-height:calc(100% - 40px)}
.bxp-head{flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 12px 8px;padding-inline-start:20px}
.bxp-title{margin:0;font-size:17px;font-weight:700;line-height:1.4}
.bxp-close{flex-shrink:0;width:36px;height:36px;display:grid;place-items:center;border:0;border-radius:999px;background:var(--bxp-soft);color:var(--bxp-text);cursor:pointer}
.bxp-close:focus-visible{outline:2px solid var(--bxp-text);outline-offset:2px}
.bxp-search{flex-shrink:0;position:relative;margin:2px 16px 8px}
.bxp-search svg{position:absolute;top:50%;inset-inline-start:14px;transform:translateY(-50%);color:var(--bxp-muted);pointer-events:none}
.bxp-search input{width:100%;height:44px;padding-inline:42px 14px;border:1px solid transparent;border-radius:12px;background:var(--bxp-field);color:var(--bxp-text);
  font-size:16px;font-weight:500;outline:none;-webkit-appearance:none;appearance:none}
.bxp-search input::placeholder{color:var(--bxp-muted)}
.bxp-search input:focus{border-color:var(--bxp-text)}
.bxp-list{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:2px 8px 12px}
.bxp-group{margin:12px 12px 4px;font-size:12.5px;font-weight:700;color:var(--bxp-muted)}
.bxp-group:first-child{margin-top:6px}
.bxp-option{width:100%;min-height:52px;display:flex;align-items:center;gap:12px;padding:8px 12px;border:0;border-radius:12px;background:transparent;
  color:var(--bxp-text);font-size:15.5px;font-weight:500;text-align:start;cursor:pointer}
.bxp-option:hover{background:var(--bxp-soft)}
.bxp-option:focus-visible{outline:2px solid var(--bxp-text);outline-offset:-2px;background:var(--bxp-soft)}
.bxp-option.is-selected{font-weight:700}
.bxp-option .bxa-flag,.bxp-option .bxo-flag{width:24px;height:24px}
.bxp-option-text{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.35}
.bxp-option-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bxp-option-note{font-size:12px;font-weight:600;color:var(--bxp-muted)}
.bxp-option-detail{flex-shrink:0;font-size:14px;font-weight:600;letter-spacing:.02em;color:var(--bxp-muted);font-variant-numeric:tabular-nums;direction:ltr}
.bxp-option-check{flex-shrink:0;width:20px;display:inline-flex;justify-content:center;color:var(--bxp-primary);visibility:hidden}
.bxp-option.is-selected .bxp-option-check{visibility:visible}
.bxp-option[hidden],.bxp-group[hidden]{display:none}
.bxp-empty{margin:0;padding:28px 12px;text-align:center;font-size:14px;color:var(--bxp-muted)}
.bxp-empty[hidden]{display:none}
@keyframes bxp-fade{from{opacity:0}}
@keyframes bxp-up{from{transform:translateY(24px);opacity:.6}}
@keyframes bxp-pop{from{transform:translateY(8px) scale(.98);opacity:0}}
@media (min-width:720px){
  .bxp{align-items:center;padding:24px}
  .bxp-panel{width:min(440px,100%);height:min(560px,100%);border-radius:18px;padding-bottom:0;box-shadow:0 24px 60px rgba(0,0,0,.22);animation-name:bxp-pop;animation-duration:180ms}
  .bxp-panel.is-short{height:auto;max-height:min(560px,100%)}
}
@media (prefers-reduced-motion:reduce){.bxp,.bxp-panel{animation:none}}
