/* Roaming4You Premium v26 — Mobile Menu Refinements for Admin + Account */
:root{
  --r4-premium-font:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Arial,sans-serif;
  --r4-mobile-nav-height:84px;
  --r4-mobile-safe-bottom:max(12px, env(safe-area-inset-bottom));
  --r4-mobile-safe-top:max(12px, env(safe-area-inset-top));
  --r4-mobile-safe-left:max(12px, env(safe-area-inset-left));
  --r4-mobile-safe-right:max(12px, env(safe-area-inset-right));
  --r4-real-vh:100dvh;
}
html,body{overflow-x:hidden}
body.admin-v22,body.account-v22{font-family:var(--r4-premium-font)!important;-webkit-text-size-adjust:100%}
body.account-v22, body.account-v22 *{box-sizing:border-box}
body.account-v22{overflow-x:hidden!important}
.account-v22 .account-v22-main{min-width:0!important;overflow-x:hidden!important}

/* Admin desktop tuning */
body.admin-v22{grid-template-columns:332px minmax(0,1fr)!important}
.admin-v22-sidebar{width:332px!important;min-width:332px!important}
.admin-v22-nav-group h3,.admin-v22-mobile-topbar strong,.traffic-kicker,.traffic-toolbar>div>span{font-weight:900!important;letter-spacing:.14em!important}
.admin-v22-nav-link{font-weight:750!important}
.admin-v22-nav-link>span:last-child{letter-spacing:-.01em}
.admin-v22-sidebar-footer a{font-weight:800!important}
@media(max-width:1360px){body.admin-v22{grid-template-columns:304px minmax(0,1fr)!important}.admin-v22-sidebar{width:304px!important;min-width:304px!important}}
@media(max-width:1180px){body.admin-v22{grid-template-columns:286px minmax(0,1fr)!important}.admin-v22-sidebar{width:286px!important;min-width:286px!important}}

/* Admin mobile premium topbar and drawer */
@media(max-width:900px){
  body.admin-v22{min-height:var(--r4-real-vh)!important;overflow-x:hidden!important;background:linear-gradient(180deg,#f4f8fc 0%,#eef3f8 100%)!important}
  .admin-v22-mobile-topbar{
    position:sticky!important;top:0!important;z-index:92!important;
    display:grid!important;grid-template-columns:50px minmax(0,1fr) auto!important;
    align-items:center!important;gap:12px!important;
    min-height:74px!important;
    padding:calc(var(--r4-mobile-safe-top) + 2px) var(--r4-mobile-safe-right) 12px var(--r4-mobile-safe-left)!important;
    background:rgba(255,255,255,.96)!important;backdrop-filter:blur(18px)!important;
    border-bottom:1px solid #dfe7f2!important;box-shadow:0 10px 24px rgba(7,31,73,.055)!important;
  }
  .admin-v22-mobile-topbar button{
    width:46px!important;height:46px!important;border-radius:16px!important;
    border:1px solid #dbe5f0!important;background:linear-gradient(180deg,#ffffff,#f5f8fd)!important;
    color:#1e497f!important;box-shadow:0 10px 22px rgba(7,31,73,.06)!important;
  }
  .admin-v22-mobile-topbar a{gap:10px!important}
  .admin-v22-mobile-topbar a span{
    width:38px!important;height:38px!important;border-radius:13px!important;font-size:13px!important;
    box-shadow:0 10px 24px rgba(19,88,232,.2)!important;
  }
  .admin-v22-mobile-topbar a b{font-size:15px!important;letter-spacing:-.02em!important}
  .admin-v22-mobile-topbar strong{font-size:11px!important;max-width:104px!important;color:#607389!important}

  .admin-v22-backdrop{position:fixed!important;inset:0!important;z-index:109!important;height:var(--r4-real-vh)!important;background:rgba(6,22,47,.55)!important;backdrop-filter:blur(4px)!important}
  .admin-v22-sidebar{
    position:fixed!important;inset:0 auto 0 0!important;z-index:110!important;
    width:min(calc(100vw - 18px),376px)!important;max-width:calc(100vw - 18px)!important;min-width:0!important;
    height:var(--r4-real-vh)!important;max-height:var(--r4-real-vh)!important;
    display:flex!important;flex-direction:column!important;
    padding:calc(var(--r4-mobile-safe-top) + 4px) 12px calc(var(--r4-mobile-safe-bottom) + 8px) max(12px, env(safe-area-inset-left))!important;
    border-radius:0 30px 30px 0!important;
    box-shadow:28px 0 64px rgba(0,0,0,.28)!important;
    overflow:hidden!important;overscroll-behavior:contain!important;
    transform:translate3d(-108%,0,0)!important;transition:transform .28s cubic-bezier(.2,.7,.2,1)!important;
  }
  .admin-v22-menu-open .admin-v22-sidebar{transform:translate3d(0,0,0)!important}
  .admin-v22-brand-row{padding:0 2px 10px!important;min-height:58px!important}
  .admin-v22-brand{padding:6px 4px!important;gap:12px!important}
  .admin-v22-brand b{font-size:17px!important}
  .admin-v22-brand small{font-size:9px!important}
  .admin-v22-context{margin:2px 4px 12px!important;padding:11px 14px!important;border-radius:15px!important;font-size:11px!important}
  .admin-v22-close{
    display:grid!important;place-items:center!important;width:46px!important;height:46px!important;flex:0 0 46px!important;
    border-radius:15px!important;background:rgba(255,255,255,.1)!important;border:1px solid rgba(255,255,255,.08)!important;
  }
  .admin-v22-nav-scroll{
    flex:1 1 auto!important;min-height:0!important;display:flex!important;flex-direction:column!important;gap:10px!important;
    padding:0 2px 12px 0!important;overflow-y:auto!important;overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;scrollbar-width:thin!important;scrollbar-gutter:stable!important;
  }
  .admin-v22-nav-group{margin:0!important;padding:10px 8px!important;border-radius:18px!important}
  .admin-v22-nav-group h3{margin:0 8px 8px!important;font-size:10px!important;color:#8cadd7!important}
  .admin-v22-nav-link{
    min-height:52px!important;padding:10px 12px!important;border-radius:15px!important;
    font-size:14px!important;line-height:1.28!important;margin:0 0 4px!important;
  }
  .admin-v22-nav-link:last-child{margin-bottom:0!important}
  .admin-v22-nav-icon{width:32px!important;height:32px!important;flex:0 0 32px!important;border-radius:11px!important}
  .admin-v22-nav-icon svg{width:18px!important;height:18px!important}
  .admin-v22-nav-link>span:last-child{white-space:normal!important;word-break:break-word!important}
  .admin-v22-sidebar-footer{
    flex:0 0 auto!important;display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important;
    padding:12px 2px 0!important;margin-top:2px!important;
    border-top:1px solid rgba(255,255,255,.08)!important;background:linear-gradient(180deg,rgba(7,31,73,0),rgba(7,31,73,.92) 28%)!important;
  }
  .admin-v22-sidebar-footer a{
    min-height:48px!important;padding:10px 8px!important;border-radius:15px!important;font-size:11px!important;font-weight:800!important;
    box-shadow:0 8px 22px rgba(0,0,0,.08)!important;
  }

  .admin-v22 main.admin-main,body.admin-v22>.admin-main{
    padding:18px 12px calc(var(--r4-mobile-nav-height) + var(--r4-mobile-safe-bottom) + 24px)!important;min-width:0!important;
  }
  .admin-v22 .admin-hero,.admin-v22 .admin-box,.admin-v22 .aff-admin-top,.admin-v22 .diag-head{border-radius:22px!important}
  .admin-v22 .admin-hero{padding:22px!important}
  .admin-v22 .admin-hero h1{font-size:28px!important;line-height:1.08!important}
  .admin-v22 .admin-kpis{grid-template-columns:1fr 1fr!important;gap:10px!important}
  .admin-v22 .admin-box{padding:16px!important}

  .admin-v22-mobile-bottom{
    display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;align-items:center!important;gap:8px!important;
    position:fixed!important;z-index:89!important;left:12px!important;right:12px!important;
    bottom:var(--r4-mobile-safe-bottom)!important;min-height:76px!important;padding:8px!important;
    border-radius:24px!important;border:1px solid #dbe4ef!important;background:rgba(255,255,255,.97)!important;
    backdrop-filter:blur(18px)!important;box-shadow:0 18px 46px rgba(7,31,73,.16)!important;
  }
  .admin-v22-mobile-bottom a,.admin-v22-mobile-bottom button{
    min-width:0!important;min-height:60px!important;padding:7px 4px!important;border-radius:16px!important;
    display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:6px!important;
    color:#6f7f93!important;font:inherit!important;font-weight:800!important;box-shadow:none!important;cursor:pointer!important;
  }
  .admin-v22-mobile-bottom span{
    display:grid!important;place-items:center!important;width:38px!important;height:38px!important;border-radius:13px!important;
    background:#f4f7fc!important;color:currentColor!important;transition:.18s ease!important;
  }
  .admin-v22-mobile-bottom svg{width:19px!important;height:19px!important}
  .admin-v22-mobile-bottom b{display:block!important;font-size:10px!important;line-height:1.1!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;max-width:100%!important}
  .admin-v22-mobile-bottom .active,.admin-v22-mobile-bottom button:active{background:#eef4ff!important;color:#1358e8!important;box-shadow:inset 0 0 0 1px rgba(19,88,232,.08)!important}
  .admin-v22-mobile-bottom .active span{background:#dfeaff!important;color:#1358e8!important;box-shadow:0 8px 18px rgba(19,88,232,.12)!important}
}
@media(max-width:430px){
  .admin-v22-sidebar{width:min(calc(100vw - 14px),368px)!important;max-width:calc(100vw - 14px)!important;border-radius:0 24px 24px 0!important}
  .admin-v22-mobile-topbar{grid-template-columns:46px minmax(0,1fr) auto!important;gap:10px!important}
  .admin-v22-mobile-topbar strong{max-width:86px!important}
  .admin-v22 .admin-kpis{grid-template-columns:1fr!important}
  .admin-v22 .diag-summary,.admin-v22 .aff-admin-kpis{grid-template-columns:1fr 1fr!important}
}

/* Account desktop touch-up */
.account-v22 .account-head-actions a,.account-v22 .account-hero-actions a,.account-v22 .account-mobile-bottom a{font-weight:800!important}
.account-v22 .account-section-head h2,.account-v22 .account-order-head-v22 h3,.account-v22 .account-item-v22 h4{font-weight:760!important}
.account-v22 .account-order-card-v22,.account-v22 .account-v22-stats article{overflow:hidden!important}

/* Account mobile fix: no clipping, premium bottom nav */
@media(max-width:760px){
  body.account-v22{min-height:var(--r4-real-vh)!important;background:linear-gradient(180deg,#f6f9fd 0,#ffffff 360px)!important}
  .account-v22 .account-header-v22{
    gap:10px!important;min-height:74px!important;
    padding:calc(var(--r4-mobile-safe-top) + 2px) var(--r4-mobile-safe-right) 12px var(--r4-mobile-safe-left)!important;
    background:rgba(255,255,255,.96)!important;border-bottom:1px solid #dfe7f1!important;backdrop-filter:blur(18px)!important;
  }
  .account-v22 .account-brand-v22{min-width:0!important;gap:10px!important}
  .account-v22 .account-brand-v22 .mark{width:40px!important;height:40px!important;border-radius:14px!important;font-size:15px!important}
  .account-v22 .account-brand-v22 b{font-size:15px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  .account-v22 .account-head-actions{display:flex!important;align-items:center!important;gap:8px!important;flex:0 0 auto!important}
  .account-v22 .account-head-actions a{min-height:42px!important;padding:0 14px!important;border-radius:14px!important;font-size:11px!important}
  .account-v22 .account-head-actions .ghost{display:none!important}
  .account-v22 .account-head-actions .primary{box-shadow:0 12px 26px rgba(255,197,38,.22)!important}

  .account-v22 .account-v22-main{padding:18px 12px calc(var(--r4-mobile-nav-height) + var(--r4-mobile-safe-bottom) + 26px)!important}
  .account-v22 .account-dashboard-hero{
    grid-template-columns:1fr!important;gap:14px!important;padding:18px!important;border-radius:26px!important;
    overflow:hidden!important;align-items:start!important;
  }
  .account-v22 .account-dashboard-hero:after{display:none!important}
  .account-v22 .account-hero-copy,.account-v22 .account-hero-panel{position:relative!important;z-index:1!important;min-width:0!important;max-width:100%!important;width:100%!important}
  .account-v22 .account-hero-copy h1{max-width:none!important;font-size:31px!important;line-height:1.08!important;margin:14px 0 9px!important}
  .account-v22 .account-hero-copy p{max-width:none!important;font-size:14px!important;line-height:1.6!important}
  .account-v22 .account-hero-actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important;margin-top:18px!important}
  .account-v22 .account-hero-actions a{min-height:44px!important;padding:0 10px!important;font-size:11px!important}
  .account-v22 .account-lookup-v22{margin-top:16px!important;padding:14px!important;border-radius:18px!important}
  .account-v22 .account-lookup-row{grid-template-columns:1fr!important}
  .account-v22 .account-lookup-row input,.account-v22 .account-lookup-row button{height:46px!important}
  .account-v22 .account-hero-panel{
    display:grid!important;grid-template-columns:1fr!important;gap:8px!important;align-content:start!important;
    padding:12px!important;border-radius:20px!important;background:rgba(4,26,66,.26)!important;
    border:1px solid rgba(255,255,255,.16)!important;backdrop-filter:blur(10px)!important;
  }
  .account-v22 .account-hero-panel article{
    display:grid!important;grid-template-columns:44px minmax(0,1fr)!important;align-items:center!important;gap:12px!important;
    min-width:0!important;padding:11px!important;border-radius:16px!important;background:rgba(255,255,255,.09)!important;
  }
  .account-v22 .account-hero-panel .icon{width:40px!important;height:40px!important;border-radius:13px!important;font-size:18px!important}
  .account-v22 .account-hero-panel b{font-size:13px!important;line-height:1.2!important}
  .account-v22 .account-hero-panel small{font-size:12px!important;line-height:1.45!important;word-break:break-word!important}
  .account-v22 .account-v22-stats{grid-template-columns:1fr!important;gap:10px!important;margin:14px 0 20px!important}
  .account-v22 .account-v22-stats article{padding:14px 15px!important;border-radius:18px!important}
  .account-v22 .account-section-head{align-items:flex-start!important;flex-direction:column!important;gap:8px!important}
  .account-v22 .account-section-head .outline-btn{width:100%!important;text-align:center!important}
  .account-v22 .account-order-body{padding:15px!important}
  .account-v22 .account-order-head-v22{align-items:flex-start!important;flex-direction:column!important;gap:10px!important}
  .account-v22 .account-order-meta-v22{grid-template-columns:1fr!important;gap:8px!important}
  .account-v22 .account-item-v22{grid-template-columns:90px minmax(0,1fr)!important;gap:10px!important;padding:9px!important}
  .account-v22 .account-item-v22 img,.account-v22 .account-item-v22 .visual{width:90px!important;height:68px!important}
  .account-v22 .account-delivery-v22{padding:11px!important;border-radius:18px!important}

  .account-v22 .account-mobile-bottom{
    display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;align-items:center!important;gap:8px!important;
    position:fixed!important;z-index:72!important;left:12px!important;right:12px!important;bottom:var(--r4-mobile-safe-bottom)!important;
    min-height:78px!important;padding:8px!important;border-radius:24px!important;border:1px solid #dbe5f0!important;
    background:rgba(255,255,255,.97)!important;backdrop-filter:blur(18px)!important;box-shadow:0 18px 46px rgba(7,31,73,.16)!important;
  }
  .account-v22 .account-mobile-bottom a{
    display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:6px!important;
    min-width:0!important;min-height:62px!important;padding:7px 4px!important;border-radius:16px!important;
    text-decoration:none!important;color:#6b7b91!important;font-size:10px!important;font-weight:800!important;
  }
  .account-v22 .account-mobile-bottom .nav-ic{
    display:grid!important;place-items:center!important;width:38px!important;height:38px!important;border-radius:13px!important;
    background:#f5f8fd!important;color:currentColor!important;transition:.18s ease!important;
  }
  .account-v22 .account-mobile-bottom .nav-ic svg{width:19px!important;height:19px!important;display:block!important}
  .account-v22 .account-mobile-bottom .nav-label{display:block!important;max-width:100%!important;line-height:1.1!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  .account-v22 .account-mobile-bottom a.primary,.account-v22 .account-mobile-bottom a.active{
    background:#eef4ff!important;color:#1358e8!important;box-shadow:inset 0 0 0 1px rgba(19,88,232,.08)!important;
  }
  .account-v22 .account-mobile-bottom a.primary .nav-ic,.account-v22 .account-mobile-bottom a.active .nav-ic{
    background:#dfeaff!important;color:#1358e8!important;box-shadow:0 8px 18px rgba(19,88,232,.12)!important;
  }
  .account-v22 .esim-delivery{display:grid!important;grid-template-columns:1fr!important}
  .account-v22 .qr-panel{max-width:220px!important;margin:0 auto!important}
  .account-v22 .esim-ready-actions{display:grid!important;grid-template-columns:1fr!important;gap:8px!important}
  .account-v22 .esim-ready-actions a,.account-v22 .esim-ready-actions button{width:100%!important}
}
@media(max-width:430px){
  .account-v22 .account-dashboard-hero{padding:16px!important;border-radius:22px!important}
  .account-v22 .account-hero-copy h1{font-size:28px!important}
  .account-v22 .account-hero-actions{grid-template-columns:1fr!important}
  .account-v22 .account-item-v22{grid-template-columns:82px minmax(0,1fr)!important}
  .account-v22 .account-item-v22 img,.account-v22 .account-item-v22 .visual{width:82px!important;height:64px!important}
}