/* EB2B login popup theme. CSS only: no change to UC_b2cLoginReg.ascx or its .cs file.
   Load AFTER common.css. Every rule is scoped to #signin-modal, so other pages are not affected. */
#signin-modal { --eb-orange:#FF6912; --eb-orange-dark:#E85D0C; --eb-navy:#122951; --eb-line:#C9D3E3; }

#signin-modal .modal-content { background:#fff; border:0; border-radius:20px; box-shadow:0 12px 40px rgba(18,41,81,.22); }
#signin-modal .modal-body { padding:22px 18px 18px !important; }
#signin-modal .modal-body::before { content:""; display:block; height:44px; margin:0 0 14px 4px; background:url(/content/img/logo-dark.png) left center/auto 100% no-repeat; }
#signin-modal .btn-close { margin-top:12px !important; padding-top:0 !important; }

#signin-modal .title_bold.h3 { font-size:24px; font-weight:800; color:var(--eb-navy); margin-bottom:14px; }
#signin-modal .form-label { font-size:13px; font-weight:600; color:var(--eb-navy) !important; }

/* phone row */
#signin-modal .phone-group { gap:10px; }
#signin-modal .phone-group .form-select,
#signin-modal .phone-group .form-control { height:52px; border:1.5px solid var(--eb-line); border-radius:12px !important; font-size:15px; background-color:#fff; }
#signin-modal .phone-group .form-control:focus,
#signin-modal .phone-group .form-select:focus { border-color:var(--eb-orange); box-shadow:0 0 0 3px rgba(255,105,18,.18); }

/* PIN / OTP boxes */
#signin-modal .otp-container { gap:12px; }
#signin-modal .otp-box { width:58px; height:58px; min-width:48px; min-height:48px; border:2px solid var(--eb-line); border-radius:12px; font-size:26px; font-weight:800; color:var(--eb-navy); background:#fff; }
#signin-modal .otp-box:focus { border-color:var(--eb-orange); box-shadow:0 0 0 3px rgba(255,105,18,.18); outline:none; }

/* buttons: navy text on orange keeps contrast readable */
#signin-modal .btn-primary { height:54px; border:0; border-radius:14px; background:var(--eb-orange); color:var(--eb-navy); font-size:16px; font-weight:800; }
#signin-modal .btn-primary:hover, #signin-modal .btn-primary:focus { background:var(--eb-orange-dark); color:var(--eb-navy); }

/* links */
#signin-modal a, #signin-modal .change-link { color:var(--eb-navy); font-weight:700; }
#signin-modal .change-link { font-size:13px; }
#signin-modal .mobile-wrapper .h2 { color:var(--eb-navy) !important; font-size:20px; }

/* phones: show the popup as a bottom sheet */
@media (max-width: 576px) {
  #signin-modal .modal-dialog { align-items:flex-end; min-height:100%; margin:0 auto !important; padding:0 !important; max-width:100% !important; }
  #signin-modal .modal-content { border-radius:24px 24px 0 0; width:100%; padding-bottom:env(safe-area-inset-bottom, 0); }
}