:root{--p:#0B4F63;--pd:#083847;--a:#F97316;--bg:#F7F9FB;--b:#E2E8EC;--text:#17252B;--muted:#66757D}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--text)}
.ogsms-card{background:#fff;border:1px solid var(--b);border-radius:10px;box-shadow:0 2px 10px rgba(16,50,61,.035)}
.ogsms-input{width:100%;border:1px solid #CFD9DE;border-radius:8px;padding:12px 14px;outline:none;background:#fff;transition:border-color .18s,box-shadow .18s}
.ogsms-input:focus{border-color:var(--p);box-shadow:0 0 0 3px rgba(11,79,99,.07)}
.ogsms-primary-btn{background:var(--p);color:#fff;border-radius:8px;font-weight:700;transition:.18s}.ogsms-primary-btn:hover{background:var(--pd)}
.ogsms-accent-btn{background:var(--a);color:#fff;border-radius:8px;font-weight:700;transition:.18s}.ogsms-accent-btn:hover{background:#EA580C}
.ogsms-sidebar{background:#fff;border-right:1px solid var(--b)}
.ogsms-sidebar-link{display:flex;align-items:center;padding:10px 12px;border-radius:7px;color:#52636B;font-size:14px;font-weight:600;transition:.18s}.ogsms-sidebar-link:hover{background:#F4F7F8;color:var(--p)}.ogsms-sidebar-link.active{background:#EDF4F6;color:var(--p);font-weight:700}
.ogsms-sidebar-link svg,.ogsms-icon,.auth-badge{display:none!important}
.ogsms-section-label{font-size:10px;text-transform:uppercase;letter-spacing:.14em;font-weight:800;color:#97A4AA;margin:18px 10px 7px}
.ogsms-topbar{background:#fff;border-bottom:1px solid var(--b)}
.ogsms-stat{background:#fff;border:1px solid var(--b);border-radius:10px;padding:18px}
.ogsms-pill{display:inline-flex;align-items:center;border-radius:6px;padding:4px 8px;font-size:11px;font-weight:700}
.ogsms-divider{border-color:var(--b)}
.mobile-drawer{box-shadow:12px 0 35px rgba(0,0,0,.10)}
.auth-page{min-height:100vh;background:#fff;display:flex;align-items:center;justify-content:center;padding:28px 18px}
.auth-shell{width:100%;max-width:420px}
.auth-logo{display:inline-flex;align-items:center;color:var(--p);font-weight:800;font-size:25px;letter-spacing:-.025em}
.auth-logo-mark{display:none!important}
.auth-card{background:#fff;border:1px solid #DDE5E8;border-radius:10px;box-shadow:0 10px 28px rgba(15,45,55,.055);padding:34px}
.auth-foot{color:#7C8B92;font-size:13px}
@media(max-width:767px){.auth-card{padding:26px 21px}.ogsms-card{border-radius:9px}.ogsms-stat{padding:16px}}

/* Mobile navigation: simple functional hamburger, no decorative iconography */
.hamburger-button{width:42px;height:42px;border:1px solid var(--b);border-radius:8px;background:#fff;display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;flex:none}
.hamburger-button span{display:block;width:18px;height:2px;background:var(--p);border-radius:2px}
.hamburger-button:hover{background:#F7FAFB}
.mobile-drawer{transform:translateX(-110%);transition:transform .22s ease;will-change:transform;overflow-y:auto;overflow-x:hidden}
.mobile-drawer.is-open{transform:translateX(0)}
body.menu-open{overflow:hidden}
@media(min-width:768px){.mobile-drawer{transform:translateX(0)!important}}
@media(max-width:767px){.ogsms-topbar{padding-left:14px!important;padding-right:14px!important}.ogsms-topbar .ogsms-accent-btn{padding:9px 11px!important}.mobile-drawer{width:min(280px,88vw)!important}.ogsms-card{overflow:hidden}.wallet-transaction-row{gap:10px}.wallet-transaction-meta{min-width:0}.wallet-transaction-amount{white-space:nowrap}}


/* OGSMS fintech sidebar refresh */
.ogsms-sidebar{background:#0B4F63!important;border-right:1px solid #083847!important;color:#fff!important}
.ogsms-sidebar > div:first-child a span{color:#fff!important}
.ogsms-sidebar .ogsms-section-label{color:#A9C5CE!important}
.ogsms-sidebar .ogsms-sidebar-link{color:#E5F0F3!important;background:transparent;}
.ogsms-sidebar .ogsms-sidebar-link:hover{background:#176579!important;color:#fff!important}
.ogsms-sidebar .ogsms-sidebar-link.active{background:#fff!important;color:#0B4F63!important;border-left:3px solid #F97316;padding-left:9px;font-weight:800}
.ogsms-sidebar .ogsms-sidebar-link.active span{color:#0B4F63!important}
.ogsms-sidebar .ogsms-sidebar-link svg{display:block!important}
.ogsms-sidebar .ogsms-help-card{background:rgba(255,255,255,.08)!important;border-color:rgba(255,255,255,.12)!important}
.ogsms-sidebar .ogsms-help-card p:first-child{color:#fff!important}
.ogsms-sidebar .ogsms-help-card p:nth-child(2){color:#D0E0E5!important}
.ogsms-sidebar .ogsms-help-card a{color:#FDBA74!important}
.ogsms-sidebar #logoutBtn{background:#F97316!important;color:#fff!important;border:0!important}
.ogsms-sidebar #logoutBtn span{color:#fff!important}
.ogsms-sidebar #logoutBtn:hover{background:#EA580C!important;color:#fff!important}
.ogsms-sidebar #closeMenu{color:#D5E6EB!important}
.country-shortcut{display:flex;min-height:94px;flex-direction:column;align-items:center;justify-content:center;gap:8px;border:1px solid #E2E8EC;border-radius:12px;background:#fff;padding:12px;transition:border-color .18s,transform .18s,box-shadow .18s;cursor:pointer}
.country-shortcut:hover{border-color:#0B4F63;box-shadow:0 5px 16px rgba(11,79,99,.08);transform:translateY(-1px)}
.country-flag{font-size:30px;line-height:1}
.country-row{display:flex;align-items:center;gap:12px;min-width:0}
.country-row-flag{font-size:30px;line-height:1;flex:none}
@media(max-width:767px){.country-shortcut{min-height:78px}.country-flag{font-size:27px}.country-row-flag{font-size:27px}}


/* Social-service brand icons: explicit SVG sizing prevents mobile browsers
   from applying the SVG default 300x150 intrinsic dimensions. */
.service-brand-icon{
  width:36px!important;
  height:36px!important;
  min-width:36px!important;
  min-height:36px!important;
  flex:0 0 36px!important;
  padding:6px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:visible!important;
  line-height:1!important;
}
.service-brand-icon .service-brand-svg{
  display:block!important;
  width:24px!important;
  height:24px!important;
  min-width:24px!important;
  min-height:24px!important;
  max-width:24px!important;
  max-height:24px!important;
  flex:none!important;
  visibility:visible!important;
  opacity:1!important;
}
.service-choice{min-width:0;max-width:100%}
.service-choice > span:last-child{min-width:0;overflow-wrap:anywhere}
@media(max-width:767px){
  .service-brand-icon{width:36px!important;height:36px!important;flex-basis:36px!important}
  .service-brand-icon .service-brand-svg{width:24px!important;height:24px!important}
}