/**
 * Mobile push menu — eye-catching + interactive.
 * Scoped to the slide-out .navbar drawer on small screens.
 */
@media (max-width:767px){
  :root{
    --mpm-navy:#2e4056;
    --mpm-blue:#2f94d7;
    --mpm-pink:#ff4d9a;
  }

  /* Overlay */
  .overlay-pushy.overlay-active{
    background:rgba(21,32,48,.55)!important;
    backdrop-filter:blur(3px);
    -webkit-backdrop-filter:blur(3px);
    animation:mpmFadeIn .28s ease both!important;
  }
  @keyframes mpmFadeIn{
    from{opacity:0}
    to{opacity:1}
  }

  /* Drawer panel */
  .navbar{
    width:min(86vw,320px)!important;
    right:calc(-1 * min(86vw,320px))!important;
    max-height:100vh;
    overflow-x:hidden;
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    background:
      radial-gradient(ellipse 90% 50% at 100% 0%, rgba(255,77,154,.14), transparent 55%),
      linear-gradient(180deg,#f7f9fc 0%,#eef3f9 100%)!important;
    box-shadow:-12px 0 40px rgba(21,40,70,.22)!important;
    border-left:1px solid rgba(255,255,255,.35);
  }
  .navbar.pushmenu-open{
    right:0!important;
  }
  .navbar.pushmenu-open .navbar-collapse > *{
    animation:mpmItemIn .38s ease both;
  }
  .navbar.pushmenu-open .navbar-nav > li:nth-child(1){animation-delay:.04s}
  .navbar.pushmenu-open .navbar-nav > li:nth-child(2){animation-delay:.08s}
  .navbar.pushmenu-open .navbar-nav > li:nth-child(3){animation-delay:.12s}
  .navbar.pushmenu-open .navbar-nav > li:nth-child(4){animation-delay:.16s}
  .navbar.pushmenu-open .navbar-nav > li:nth-child(5){animation-delay:.2s}
  .navbar.pushmenu-open .mobile-links-user{animation-delay:.24s}
  @keyframes mpmItemIn{
    from{opacity:0;transform:translateX(14px)}
    to{opacity:1;transform:none}
  }

  /* Header bar */
  .mobile-logo-bar{
    position:sticky;
    top:0;
    z-index:3;
    display:flex!important;
    align-items:center;
    justify-content:space-between;
    gap:.75rem;
    padding:1rem 1rem 1rem 1.1rem!important;
    font-size:1rem!important;
    font-weight:700!important;
    letter-spacing:.02em;
    color:#fff!important;
    background:linear-gradient(135deg,#236BA2 0%,#2f94d7 48%,#2e4056 100%)!important;
    box-shadow:0 10px 24px rgba(21,40,70,.18)!important;
  }
  .mobile-logo-bar:before{
    content:"";
    position:absolute;
    inset:0;
    background:radial-gradient(ellipse at 90% 0%, rgba(255,77,154,.35), transparent 55%);
    pointer-events:none;
  }
  .mobile-logo-bar__title,
  .mobile-logo-bar__close{
    position:relative;
    z-index:1;
  }
  .mobile-logo-bar__title{
    display:flex;
    align-items:center;
    gap:.55rem;
  }
  .mobile-logo-bar__mark{
    width:28px;
    height:28px;
    border-radius:9px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    background:rgba(255,255,255,.16);
    border:1px solid rgba(255,255,255,.28);
    font-size:.85rem;
    font-weight:800;
  }
  .mobile-logo-bar__close{
    width:36px;
    height:36px;
    border:0;
    border-radius:10px;
    background:rgba(255,255,255,.14);
    color:#fff;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    transition:background .2s, transform .2s;
  }
  .mobile-logo-bar__close:hover,
  .mobile-logo-bar__close:focus{
    background:rgba(255,77,154,.45);
    outline:none;
    transform:scale(1.04);
  }
  .mobile-logo-bar__close span,
  .mobile-logo-bar__close span:before,
  .mobile-logo-bar__close span:after{
    display:block;
    width:14px;
    height:2px;
    background:#fff;
    border-radius:2px;
  }
  .mobile-logo-bar__close span{
    position:relative;
    transform:rotate(45deg);
  }
  .mobile-logo-bar__close span:before{
    content:"";
    position:absolute;
    inset:0;
    transform:rotate(90deg);
  }

  /* Nav links */
  .navbar .navbar-collapse{
    padding:0 0 1.25rem;
  }
  ul.navbar-nav{
    margin:0!important;
    padding:.35rem .7rem .2rem!important;
  }
  ul.navbar-nav > li{
    position:relative;
    border:0!important;
    margin:.2rem 0!important;
    border-radius:12px!important;
    overflow:hidden;
    background:rgba(255,255,255,.72);
    box-shadow:0 1px 0 rgba(46,64,86,.04);
    transition:transform .2s, box-shadow .2s, background .2s;
  }
  ul.navbar-nav > li:active{
    transform:scale(.985);
  }
  ul.navbar-nav > li > a{
    display:flex!important;
    align-items:center;
    gap:.55rem;
    padding:.85rem 1rem!important;
    font-size:.92rem!important;
    font-weight:600!important;
    letter-spacing:.04em!important;
    color:var(--mpm-navy)!important;
    text-transform:none!important;
    transition:color .2s, background .2s, padding-left .2s;
  }
  ul.navbar-nav > li > a:hover,
  ul.navbar-nav > li > a:focus{
    color:var(--mpm-blue)!important;
    background:rgba(47,148,215,.08)!important;
    padding-left:1.15rem!important;
  }
  ul.navbar-nav > li > a .far,
  ul.navbar-nav > li > a .fa,
  ul.navbar-nav > li > a .fas{
    width:1.25rem;
    text-align:center;
    color:var(--mpm-blue);
  }

  /* Accordion trigger */
  .child-trigger{
    max-width:48px!important;
    height:100%!important;
    min-height:48px;
    border-left:1px solid rgba(46,64,86,.08)!important;
    border-radius:0 12px 12px 0;
    transition:background .2s;
  }
  .child-trigger:hover,
  .child-trigger.activate{
    background:rgba(255,77,154,.1);
  }
  .child-trigger i,
  .child-trigger i:after{
    background:linear-gradient(90deg,var(--mpm-pink),var(--mpm-blue))!important;
    height:2px!important;
    width:12px!important;
  }
  .child-trigger.activate i:after{
    background:var(--mpm-pink)!important;
  }

  /* Submenu */
  .navbar .sub-menu{
    border:0!important;
    border-top:1px solid rgba(47,148,215,.15)!important;
    background:rgba(247,249,252,.95)!important;
    padding:.35rem .45rem .55rem!important;
  }
  .navbar .sub-menu a{
    border:0!important;
    border-radius:10px!important;
    margin:.15rem 0!important;
    padding:.65rem .85rem!important;
    color:var(--mpm-navy)!important;
    font-weight:500!important;
    font-size:.88rem!important;
    transition:background .2s, color .2s, transform .2s;
  }
  .navbar .sub-menu a:hover,
  .navbar .sub-menu a:focus{
    background:linear-gradient(135deg,rgba(255,77,154,.12),rgba(47,148,215,.14))!important;
    color:var(--mpm-navy)!important;
    transform:translateX(3px);
  }

  /* Bottom action links */
  .mobile-links-user{
    margin:.85rem .7rem 0!important;
    padding:0!important;
  }
  .mobile-links-user ul{
    list-style:none;
    margin:0;
    padding:0;
    display:flex;
    flex-direction:column;
    gap:.55rem;
  }
  .mobile-links-user li{
    display:block!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:14px;
    overflow:hidden;
    background:#fff;
    box-shadow:0 8px 20px rgba(21,40,70,.08);
    transition:transform .2s, box-shadow .2s;
  }
  .mobile-links-user li:active{
    transform:translateY(1px);
  }
  .mobile-links-user li a{
    display:flex!important;
    align-items:center;
    gap:.8rem;
    padding:.85rem 1rem!important;
    text-decoration:none;
  }
  .mobile-links-user li span{
    width:40px!important;
    height:40px!important;
    border-radius:12px!important;
    background:linear-gradient(135deg,#2e4056 0%,#3a3f6b 70%,#4a3560 100%)!important;
    display:inline-flex!important;
    align-items:center;
    justify-content:center;
    box-shadow:0 6px 14px rgba(46,64,86,.22);
    transition:transform .2s, background .2s;
  }
  .mobile-links-user li:nth-child(2) span{
    background:linear-gradient(135deg,#2f94d7 0%,#5b8fd9 100%)!important;
  }
  .mobile-links-user li:nth-child(3) span{
    background:linear-gradient(135deg,#ff4d9a 0%,#e83d7f 100%)!important;
  }
  .mobile-links-user li a:hover span{
    transform:scale(1.06);
  }
  .mobile-links-user li label{
    margin:0!important;
    padding:0!important;
    font-size:.95rem!important;
    font-weight:700!important;
    color:var(--mpm-navy)!important;
    letter-spacing:.02em;
    text-transform:none!important;
  }
  .mobile-links-user li span i,
  .mobile-links-user li span img{
    filter:brightness(0) invert(1);
  }
  .mobile-links-user li span i{
    color:#fff!important;
    font-size:1.05rem!important;
  }
}