/* Payslashes mobile-native 2026 — dedicated phone layout */
:root{--psm-blue:#075fe4;--psm-blue-dark:#0448ad;--psm-ink:#101828;--psm-muted:#667085;--psm-line:#e5eaf1;--psm-bg:#f4f7fb;--psm-surface:#fff;--psm-safe-bottom:env(safe-area-inset-bottom,0px)}
.psm-mobile-shell,.psm-drawer,.psm-drawer-backdrop{display:none}
@media(max-width:767.98px){
 html{scroll-padding-top:130px;background:var(--psm-bg)}
 body.mobile-ux-shell{padding:0 0 calc(76px + var(--psm-safe-bottom))!important;background:var(--psm-bg)!important;font-size:15px;line-height:1.5}
 body.mobile-ux-shell>.ps-app-shell{min-height:100dvh}
 body.mobile-ux-shell #header{display:none!important}
 .psm-mobile-shell{display:block;position:sticky;top:0;z-index:1035;background:rgba(255,255,255,.96);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom:1px solid rgba(16,24,40,.08);box-shadow:0 8px 24px rgba(16,24,40,.06)}
 .psm-topbar{height:58px;padding:max(7px,env(safe-area-inset-top)) 12px 7px;display:grid;grid-template-columns:44px 1fr auto;align-items:center;gap:8px}
 .psm-brand{display:flex;justify-content:center;min-width:0}.psm-brand img{display:block;width:auto;max-width:145px;height:34px;object-fit:contain}
 .psm-topbar-actions{display:flex;align-items:center;gap:4px}.psm-icon-btn{position:relative;width:42px;height:42px;min-height:42px;padding:0;border:0;border-radius:14px;background:#f1f5fb;color:#263b5c;display:inline-flex;align-items:center;justify-content:center;font-size:17px;box-shadow:none!important;text-decoration:none!important}
 .psm-icon-btn:active{transform:scale(.95);background:#e4ecf8}.psm-badge{position:absolute;right:-2px;top:-3px;min-width:18px;height:18px;padding:0 4px;border:2px solid #fff;border-radius:999px;background:#e5484d;color:#fff;font-size:9px;font-weight:800;display:flex;align-items:center;justify-content:center}
 .psm-search{margin:0 12px 9px;height:46px;display:grid;grid-template-columns:20px 1fr auto;align-items:center;gap:8px;padding-left:14px;border:1px solid #d9e2ef;border-radius:15px;background:#f6f8fc;box-shadow:inset 0 1px 2px rgba(16,24,40,.03)}
 .psm-search i{color:#667085}.psm-search input{height:44px!important;min-height:44px!important;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important;font-size:14px!important;min-width:0}.psm-search button{height:36px;min-height:36px;margin-right:5px;padding:0 13px;border:0;border-radius:11px;background:var(--psm-blue);color:#fff;font-size:12px;font-weight:800}
 .psm-context-row{display:flex;gap:8px;padding:0 12px 10px;overflow-x:auto;scrollbar-width:none}.psm-context-row::-webkit-scrollbar{display:none}.psm-context-row a{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;padding:7px 11px;border:1px solid var(--psm-line);border-radius:999px;background:#fff;color:#344054;font-size:11px;font-weight:750;text-decoration:none;white-space:nowrap}.psm-context-row a:active{background:#eef4ff;color:var(--psm-blue)}
 .ps-app-switcher-strip{display:none!important}
 body.mobile-ux-shell .container,body.mobile-ux-shell .container-fluid{padding-left:12px!important;padding-right:12px!important;max-width:100%!important}
 body.mobile-ux-shell .row{margin-left:-6px!important;margin-right:-6px!important}body.mobile-ux-shell .row>[class*=col-]{padding-left:6px!important;padding-right:6px!important}
 body.mobile-ux-shell h1{font-size:1.65rem!important;line-height:1.16;margin-bottom:.75rem}body.mobile-ux-shell h2{font-size:1.35rem!important;line-height:1.22}body.mobile-ux-shell h3{font-size:1.12rem!important}
 body.mobile-ux-shell .card,body.mobile-ux-shell .product-item,body.mobile-ux-shell .product-card,body.mobile-ux-shell .jumia-product-card{border-radius:17px!important;border-color:#e3e8ef!important;box-shadow:0 5px 18px rgba(16,24,40,.07)!important;overflow:hidden}
 body.mobile-ux-shell .card-body{padding:14px!important}body.mobile-ux-shell .card-header{padding:13px 14px!important}
 body.mobile-ux-shell .btn{min-height:46px;border-radius:13px;font-size:14px;font-weight:800}body.mobile-ux-shell .btn-sm{min-height:40px}
 body.mobile-ux-shell input:not([type=checkbox]):not([type=radio]):not([type=hidden]),body.mobile-ux-shell select,body.mobile-ux-shell textarea{font-size:16px!important;border-radius:13px!important;min-height:48px!important}body.mobile-ux-shell textarea{min-height:116px!important}
 body.mobile-ux-shell form .btn[type=submit]{width:100%}
 body.mobile-ux-shell .breadcrumb{padding:8px 0!important;margin-bottom:10px!important;background:transparent!important;font-size:11px;white-space:nowrap;overflow-x:auto;flex-wrap:nowrap}
 body.mobile-ux-shell .products-grid,body.mobile-ux-shell [class*=products-grid]{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
 body.mobile-ux-shell .product-item .product-item__body,body.mobile-ux-shell .jumia-product-card__body{padding:10px!important}body.mobile-ux-shell .product-item img,body.mobile-ux-shell .jumia-product-card img{aspect-ratio:1/1;object-fit:contain}
 body.mobile-ux-shell .product-item h5,body.mobile-ux-shell .product-title,body.mobile-ux-shell .jumia-product-card__title{font-size:12px!important;line-height:1.35!important;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:32px}
 body.mobile-ux-shell .product-price,body.mobile-ux-shell [class*=price]{font-weight:850}
 body.mobile-ux-shell .table-responsive{border:1px solid var(--psm-line);border-radius:15px;background:#fff;box-shadow:0 4px 14px rgba(16,24,40,.05)}body.mobile-ux-shell table{font-size:12px}body.mobile-ux-shell .table td,body.mobile-ux-shell .table th{padding:11px 10px!important;white-space:nowrap}
 body.mobile-ux-shell .modal{padding:0!important}body.mobile-ux-shell .modal-dialog{position:absolute;left:0;right:0;bottom:0;margin:0!important;max-width:none!important}body.mobile-ux-shell .modal-content{border-radius:24px 24px 0 0!important;max-height:90dvh!important;padding-bottom:var(--psm-safe-bottom)}
 body.mobile-ux-shell .dropdown-menu{border-radius:16px!important;box-shadow:0 18px 50px rgba(16,24,40,.18)!important}
 body.mobile-ux-shell footer,body.mobile-ux-shell .premium-site-footer{margin-top:22px!important;padding-bottom:18px!important}body.mobile-ux-shell .premium-footer-main{padding:22px 0 8px!important}body.mobile-ux-shell .premium-footer-main .row>[class*=col-]{margin-bottom:10px!important}body.mobile-ux-shell .premium-footer-shell{border-radius:22px 22px 0 0!important}
 .ps-mobile-bottom-nav{left:8px!important;right:8px!important;bottom:max(7px,var(--psm-safe-bottom))!important;width:auto!important;height:68px!important;transform:none!important;padding:6px 8px!important;border-radius:21px!important;background:rgba(255,255,255,.97)!important;border:1px solid rgba(16,24,40,.09)!important;box-shadow:0 14px 38px rgba(16,24,40,.18)!important}
 .ps-mobile-bottom-nav__item{gap:3px!important;font-size:9px!important}.ps-mobile-bottom-nav__icon{width:34px!important;height:34px!important;border-radius:12px!important;font-size:16px!important}.ps-mobile-bottom-nav__item--cta .ps-mobile-bottom-nav__icon{width:46px!important;height:46px!important;border-radius:15px!important;transform:translateY(-9px)!important}.ps-mobile-bottom-nav__item--cta .ps-mobile-bottom-nav__label{margin-top:-7px!important}
 .ps-mobile-quick-search{display:none!important}
 #chatbot-floating-btn{right:14px!important;bottom:86px!important}#chatbot-widget{left:8px!important;right:8px!important;bottom:82px!important;width:auto!important;height:min(72dvh,560px)!important;border-radius:20px!important}
 .psm-drawer-backdrop{display:block;position:fixed;inset:0;z-index:1060;background:rgba(15,23,42,.48);opacity:0;transition:opacity .22s ease}.psm-drawer-backdrop[hidden]{display:none}.psm-drawer-backdrop.is-open{opacity:1}
 .psm-drawer{display:flex;position:fixed;inset:0 auto 0 0;z-index:1061;width:min(86vw,340px);padding:calc(16px + env(safe-area-inset-top)) 14px calc(16px + var(--psm-safe-bottom));flex-direction:column;background:#fff;box-shadow:22px 0 60px rgba(15,23,42,.22);transform:translateX(-105%);transition:transform .24s cubic-bezier(.2,.8,.2,1)}.psm-drawer.is-open{transform:translateX(0)}
 .psm-drawer-head{display:flex;align-items:center;justify-content:space-between;padding:2px 2px 14px;border-bottom:1px solid var(--psm-line)}.psm-drawer-head>div{display:flex;flex-direction:column}.psm-drawer-kicker{text-transform:uppercase;letter-spacing:.12em;color:var(--psm-blue);font-size:9px;font-weight:850}.psm-drawer-head strong{font-size:20px}
 .psm-drawer-nav{display:grid;gap:4px;padding-top:12px;overflow-y:auto}.psm-drawer-nav a{display:grid;grid-template-columns:40px 1fr;align-items:center;min-height:50px;padding:5px 10px;border-radius:14px;color:#24324a;font-size:14px;font-weight:750;text-decoration:none}.psm-drawer-nav a i{width:36px;height:36px;border-radius:11px;background:#f2f5fa;color:#476080;display:flex;align-items:center;justify-content:center}.psm-drawer-nav a:active,.psm-drawer-nav a.is-active{background:#edf4ff;color:var(--psm-blue)}.psm-drawer-nav a.is-active i{background:#dbeaff;color:var(--psm-blue)}.psm-drawer-nav .psm-danger-link{color:#b42318}.psm-drawer-nav .psm-danger-link i{background:#fef3f2;color:#d92d20}
 body.psm-menu-open{overflow:hidden;touch-action:none}
 .psm-sticky-actions{position:sticky;bottom:76px;z-index:20;margin:12px -12px -12px;padding:10px 12px calc(10px + var(--psm-safe-bottom));background:rgba(255,255,255,.96);border-top:1px solid var(--psm-line);backdrop-filter:blur(14px)}
}
@media(max-width:360px){.psm-brand img{max-width:120px}.psm-topbar{grid-template-columns:40px 1fr auto;padding-left:8px;padding-right:8px}.psm-icon-btn{width:38px;height:38px;min-height:38px}.psm-search{margin-left:8px;margin-right:8px}.psm-context-row{padding-left:8px;padding-right:8px}body.mobile-ux-shell .container,body.mobile-ux-shell .container-fluid{padding-left:9px!important;padding-right:9px!important}}

/* 2026-07-26: icon-font independent mobile header and drawer */
.psm-svg{width:21px;height:21px;display:block;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}
.ps-brand-mark>.psm-svg{width:20px;height:20px;color:#fff}
.psm-search>.psm-svg{width:19px;height:19px;color:#64748b}
.psm-context-row .psm-svg,.psm-drawer-nav .psm-svg{width:19px;height:19px}
.psm-icon-btn .psm-svg{pointer-events:none}
@media(max-width:767.98px){
  .premium-site-header{display:none!important}
  .psm-mobile-shell{display:block!important}
  .psm-topbar{grid-template-columns:42px minmax(0,1fr) auto!important}
  .psm-brand-copy strong{white-space:nowrap}
  .psm-search{grid-template-columns:22px minmax(0,1fr) auto!important}
  .psm-search input{min-width:0!important}
}
