/* =========================================================
   Safira.id v149.12 — Mobile Menu Ringkas CSS-Safe Fix
   Scope: CSS ONLY. No PHP/layout changes. Desktop/laptop untouched.
   Goal: force Konsep A mobile dashboard navigation:
   header + 4 quick actions + 1 clean "Lihat Semua Menu" row,
   hide duplicated old chip/sidebar menu on mobile.
   ========================================================= */
@media (min-width:981px){
  body.dashboard-context .sf-mobile-panel-bar,
  body.dashboard-context .sf-mobile-panel-compact-a,
  body.dashboard-context .sf-mobile-all-menu{display:none!important;}
}

@media (max-width:980px){
  html,body{max-width:100%!important;overflow-x:hidden!important;}
  body.dashboard-context{background:#eef3f8!important;padding:0!important;}
  body.dashboard-context>.topline,
  body.dashboard-context>.navbar{display:none!important;}

  body.dashboard-context .dashboard-layout{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-height:100dvh!important;
    padding:0!important;
    margin:0!important;
    overflow-x:hidden!important;
    background:#eef3f8!important;
  }

  /* Absolute hard-hide for every old desktop/sidebar chip menu on mobile. */
  body.dashboard-context aside.sidebar,
  body.dashboard-context aside.sidebar.sidebar-compact,
  body.dashboard-context aside.sf-desktop-sidebar,
  body.dashboard-context .sf-desktop-sidebar,
  body.dashboard-context .dashboard-layout > aside,
  body.dashboard-context .dashboard-layout > .sidebar,
  body.dashboard-context .sidebar:not(.sf-mobile-panel-bar),
  body.dashboard-context .sidebar.sidebar-compact,
  body.dashboard-context .sidebar-brand,
  body.dashboard-context .sidebar-title,
  body.dashboard-context .sidebar-menu,
  body.dashboard-context .sidebar-section,
  body.dashboard-context .sidebar-section-title,
  body.dashboard-context .sidebar-submenu,
  body.dashboard-context .sidebar-submenu-body,
  body.dashboard-context .sidebar-link,
  body.dashboard-context .sidebar-upgrade-card,
  body.dashboard-context .sidebar-help-card,
  body.dashboard-context .sidebar-logout-section{
    display:none!important;
    visibility:hidden!important;
    position:absolute!important;
    left:-99999px!important;
    top:auto!important;
    width:0!important;
    min-width:0!important;
    max-width:0!important;
    height:0!important;
    min-height:0!important;
    max-height:0!important;
    overflow:hidden!important;
    opacity:0!important;
    pointer-events:none!important;
    padding:0!important;
    margin:0!important;
    border:0!important;
    box-shadow:none!important;
  }

  /* Final compact mobile header. */
  body.dashboard-context .sf-mobile-panel-bar,
  body.dashboard-context .sf-mobile-panel-bar.sf-mobile-panel-compact-a{
    display:block!important;
    visibility:visible!important;
    position:sticky!important;
    top:0!important;
    z-index:999!important;
    width:100%!important;
    max-width:100%!important;
    padding:10px 10px 12px!important;
    margin:0!important;
    color:#fff!important;
    background:linear-gradient(135deg,#061932 0%,#0b315d 55%,#0f766e 100%)!important;
    border-radius:0 0 18px 18px!important;
    border-bottom:1px solid rgba(255,255,255,.14)!important;
    box-shadow:0 14px 34px rgba(7,24,45,.22)!important;
    overflow:visible!important;
  }

  body.dashboard-context .sf-mobile-panel-top{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:10px!important;
    margin:0 0 10px!important;
    padding:0!important;
  }
  body.dashboard-context .sf-mobile-panel-top b{
    display:block!important;
    color:#fff!important;
    font-size:16px!important;
    line-height:1.08!important;
    font-weight:950!important;
    letter-spacing:-.02em!important;
  }
  body.dashboard-context .sf-mobile-panel-top small{
    display:block!important;
    max-width:66vw!important;
    color:rgba(255,255,255,.80)!important;
    font-size:10.8px!important;
    line-height:1.25!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  body.dashboard-context .sf-mobile-logout{
    flex:0 0 auto!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-height:34px!important;
    padding:0 12px!important;
    border-radius:12px!important;
    background:#fff!important;
    color:#07182e!important;
    text-decoration:none!important;
    font-size:11.5px!important;
    font-weight:900!important;
    box-shadow:0 8px 20px rgba(0,0,0,.15)!important;
  }

  body.dashboard-context .sf-mobile-quick-actions{
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:7px!important;
    width:100%!important;
    padding:0!important;
    margin:0!important;
    overflow:visible!important;
  }
  body.dashboard-context .sf-mobile-quick-link{
    width:100%!important;
    min-width:0!important;
    min-height:50px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:4px!important;
    padding:7px 4px!important;
    border-radius:14px!important;
    border:1px solid rgba(255,255,255,.16)!important;
    background:rgba(255,255,255,.115)!important;
    color:#f4f8ff!important;
    text-decoration:none!important;
    text-align:center!important;
    font-size:10.6px!important;
    font-weight:900!important;
    line-height:1.1!important;
    white-space:normal!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.08)!important;
    overflow:hidden!important;
  }
  body.dashboard-context .sf-mobile-quick-link span{
    width:22px!important;
    height:22px!important;
    min-width:22px!important;
    min-height:22px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    border-radius:9px!important;
    background:rgba(255,255,255,.16)!important;
    color:inherit!important;
    font-size:11px!important;
    line-height:1!important;
  }
  body.dashboard-context .sf-mobile-quick-link.is-active{
    background:#fff!important;
    color:#07182e!important;
    border-color:#fff!important;
    box-shadow:0 8px 18px rgba(0,0,0,.14)!important;
  }
  body.dashboard-context .sf-mobile-quick-link.is-active span{
    background:#e9f7f4!important;
    color:#0f766e!important;
  }

  /* Konsep A: one clean menu row. */
  body.dashboard-context details.sf-mobile-all-menu,
  body.dashboard-context .sf-mobile-all-menu{
    display:block!important;
    visibility:visible!important;
    position:relative!important;
    left:auto!important;
    top:auto!important;
    width:100%!important;
    max-width:100%!important;
    height:auto!important;
    min-height:0!important;
    margin:12px 0 0!important;
    padding:0!important;
    border-radius:16px!important;
    overflow:hidden!important;
    background:rgba(255,255,255,.09)!important;
    border:1px solid rgba(255,255,255,.16)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.08)!important;
    opacity:1!important;
    pointer-events:auto!important;
  }
  body.dashboard-context details.sf-mobile-all-menu > summary,
  body.dashboard-context .sf-mobile-all-menu > summary{
    list-style:none!important;
    min-height:49px!important;
    padding:0 13px!important;
    display:grid!important;
    grid-template-columns:28px minmax(0,1fr) 22px!important;
    align-items:center!important;
    justify-content:normal!important;
    gap:10px!important;
    cursor:pointer!important;
    color:#fff!important;
    user-select:none!important;
    font-size:13px!important;
    font-weight:950!important;
  }
  body.dashboard-context details.sf-mobile-all-menu > summary::-webkit-details-marker{display:none!important;}
  body.dashboard-context .sf-mobile-all-menu-icon{
    width:28px!important;
    height:28px!important;
    min-width:28px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    border-radius:10px!important;
    background:rgba(255,255,255,.14)!important;
    color:#fff!important;
    font-size:14px!important;
    line-height:1!important;
  }
  body.dashboard-context details.sf-mobile-all-menu > summary b{
    min-width:0!important;
    color:#fff!important;
    font-size:13px!important;
    line-height:1!important;
    font-weight:950!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  body.dashboard-context details.sf-mobile-all-menu > summary i{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    font-style:normal!important;
    color:#fff!important;
    font-size:23px!important;
    line-height:1!important;
    opacity:.9!important;
    transform:rotate(0deg)!important;
    transition:transform .18s ease!important;
  }
  body.dashboard-context details.sf-mobile-all-menu[open] > summary i{transform:rotate(90deg)!important;}

  body.dashboard-context details.sf-mobile-all-menu:not([open]) > .sf-mobile-all-menu-list{
    display:none!important;
    height:0!important;
    max-height:0!important;
    overflow:hidden!important;
  }
  body.dashboard-context details.sf-mobile-all-menu[open] > .sf-mobile-all-menu-list{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:4px!important;
    padding:8px!important;
    background:#fff!important;
    border-top:1px solid rgba(255,255,255,.16)!important;
    height:auto!important;
    max-height:none!important;
    overflow:visible!important;
  }
  body.dashboard-context .sf-mobile-all-menu-link{
    min-height:44px!important;
    width:100%!important;
    display:grid!important;
    grid-template-columns:30px minmax(0,1fr) 18px!important;
    align-items:center!important;
    gap:10px!important;
    padding:0 10px!important;
    border-radius:12px!important;
    border:0!important;
    border-bottom:1px solid #eef2f7!important;
    background:#fff!important;
    color:#10233f!important;
    text-decoration:none!important;
    font-size:13px!important;
    font-weight:850!important;
    white-space:normal!important;
  }
  body.dashboard-context .sf-mobile-all-menu-link:last-child{border-bottom:0!important;}
  body.dashboard-context .sf-mobile-all-menu-link span{
    width:28px!important;
    height:28px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    border-radius:10px!important;
    background:#f1f6fb!important;
    color:#0b315d!important;
    font-size:12px!important;
  }
  body.dashboard-context .sf-mobile-all-menu-link b{
    min-width:0!important;
    color:#10233f!important;
    font-size:13px!important;
    font-weight:850!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  body.dashboard-context .sf-mobile-all-menu-link i{
    font-style:normal!important;
    color:#7b8ba2!important;
    font-size:18px!important;
    line-height:1!important;
    text-align:right!important;
  }
  body.dashboard-context .sf-mobile-all-menu-link.is-active{
    background:#eef7ff!important;
    color:#0b315d!important;
  }
  body.dashboard-context .sf-mobile-all-menu-link.is-active span{
    background:#dbeafe!important;
    color:#1d4ed8!important;
  }
  body.dashboard-context .sf-mobile-all-menu-logout{
    margin-top:6px!important;
    background:#fff7ed!important;
    color:#9a3412!important;
  }
  body.dashboard-context .sf-mobile-all-menu-logout span{
    background:#ffedd5!important;
    color:#9a3412!important;
  }

  body.dashboard-context .dashboard-main{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    padding:9px!important;
    margin:0!important;
    overflow:visible!important;
  }
  body.dashboard-context .dashboard-main > .panel{
    width:100%!important;
    max-width:100%!important;
    margin:8px 0 0!important;
    padding:15px!important;
    border-radius:20px!important;
    overflow:visible!important;
  }
}

@media (max-width:430px){
  body.dashboard-context .sf-mobile-panel-bar,
  body.dashboard-context .sf-mobile-panel-bar.sf-mobile-panel-compact-a{padding:10px 8px 11px!important;}
  body.dashboard-context .sf-mobile-quick-actions{gap:6px!important;}
  body.dashboard-context .sf-mobile-quick-link{min-height:50px!important;font-size:10px!important;border-radius:13px!important;}
  body.dashboard-context .sf-mobile-quick-link span{width:21px!important;height:21px!important;min-width:21px!important;min-height:21px!important;}
  body.dashboard-context details.sf-mobile-all-menu > summary{min-height:48px!important;padding:0 12px!important;}
  body.dashboard-context .dashboard-main{padding:8px!important;}
  body.dashboard-context .dashboard-main > .panel{padding:14px!important;border-radius:18px!important;}
}

/* =========================================================
   Safira.id v149.13 — Mobile Final Polish & Touch UX
   Scope: MOBILE ONLY. CSS safe patch. No PHP/layout changes.
   Desktop/laptop stays untouched.
   ========================================================= */
@media (max-width:980px){
  html,body{width:100%!important;max-width:100%!important;overflow-x:hidden!important;-webkit-text-size-adjust:100%!important;touch-action:manipulation!important;}
  body.dashboard-context{background:#edf3f8!important;overscroll-behavior-y:none!important;}
  body.dashboard-context *{-webkit-tap-highlight-color:rgba(15,118,110,.18)!important;}

  /* Mobile header polish */
  body.dashboard-context .sf-mobile-panel-bar,
  body.dashboard-context .sf-mobile-panel-bar.sf-mobile-panel-compact-a{
    padding:11px 10px 12px!important;
    border-radius:0 0 20px 20px!important;
    background:radial-gradient(circle at 88% 10%,rgba(20,184,166,.32) 0%,rgba(20,184,166,0) 35%),linear-gradient(135deg,#06162c 0%,#0b2d58 52%,#0f766e 100%)!important;
    box-shadow:0 14px 34px rgba(7,24,45,.20)!important;
  }
  body.dashboard-context .sf-mobile-panel-top{margin-bottom:10px!important;}
  body.dashboard-context .sf-mobile-panel-top b{font-size:15.5px!important;letter-spacing:-.025em!important;}
  body.dashboard-context .sf-mobile-panel-top small{font-size:10.5px!important;opacity:.92!important;}
  body.dashboard-context .sf-mobile-logout{
    min-height:36px!important;
    padding:0 14px!important;
    border-radius:14px!important;
    font-size:11.5px!important;
    box-shadow:0 8px 18px rgba(0,0,0,.13)!important;
  }

  /* Quick actions: more app-like, easier to tap */
  body.dashboard-context .sf-mobile-quick-actions{gap:8px!important;}
  body.dashboard-context .sf-mobile-quick-link{
    min-height:54px!important;
    padding:7px 3px!important;
    border-radius:15px!important;
    font-size:10.5px!important;
    letter-spacing:-.01em!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 7px 16px rgba(0,0,0,.06)!important;
  }
  body.dashboard-context .sf-mobile-quick-link span{
    width:24px!important;height:24px!important;min-width:24px!important;min-height:24px!important;
    border-radius:10px!important;
  }
  body.dashboard-context .sf-mobile-quick-link:active,
  body.dashboard-context .sf-mobile-logout:active,
  body.dashboard-context .sf-mobile-all-menu > summary:active,
  body.dashboard-context .sf-mobile-all-menu-link:active,
  body.dashboard-context button:active,
  body.dashboard-context .btn:active{transform:scale(.985)!important;}

  /* Konsep A menu row: cleaner single line + safe expanded list */
  body.dashboard-context details.sf-mobile-all-menu,
  body.dashboard-context .sf-mobile-all-menu{
    margin-top:10px!important;
    border-radius:17px!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 8px 18px rgba(0,0,0,.06)!important;
  }
  body.dashboard-context details.sf-mobile-all-menu > summary,
  body.dashboard-context .sf-mobile-all-menu > summary{
    min-height:50px!important;
    padding:0 14px!important;
    grid-template-columns:30px minmax(0,1fr) 24px!important;
    gap:10px!important;
  }
  body.dashboard-context .sf-mobile-all-menu-icon{width:30px!important;height:30px!important;min-width:30px!important;border-radius:11px!important;}
  body.dashboard-context details.sf-mobile-all-menu > summary b{font-size:13.2px!important;}
  body.dashboard-context details.sf-mobile-all-menu[open] > .sf-mobile-all-menu-list{
    max-height:58dvh!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
    padding:9px!important;
    gap:5px!important;
    border-radius:0 0 16px 16px!important;
  }
  body.dashboard-context .sf-mobile-all-menu-list::-webkit-scrollbar{width:4px!important;}
  body.dashboard-context .sf-mobile-all-menu-list::-webkit-scrollbar-thumb{background:#cbd5e1!important;border-radius:99px!important;}
  body.dashboard-context .sf-mobile-all-menu-link{
    min-height:47px!important;
    grid-template-columns:32px minmax(0,1fr) 18px!important;
    border-radius:13px!important;
    padding:0 11px!important;
  }
  body.dashboard-context .sf-mobile-all-menu-link span{width:30px!important;height:30px!important;border-radius:11px!important;}

  /* Main content spacing: content should start quickly and feel native */
  body.dashboard-context .dashboard-main{
    padding:9px 8px calc(34px + env(safe-area-inset-bottom))!important;
  }
  body.dashboard-context .dashboard-main > .panel,
  body.dashboard-context .panel,
  body.dashboard-context .su-panel-card,
  body.dashboard-context .sf-card,
  body.dashboard-context .card{
    border-radius:20px!important;
    box-shadow:0 12px 30px rgba(16,35,63,.065)!important;
  }
  body.dashboard-context .dashboard-main > .panel{margin-top:8px!important;padding:15px!important;}
  body.dashboard-context .panel > h1,
  body.dashboard-context .dashboard-main h1{
    font-size:22px!important;
    line-height:1.12!important;
    letter-spacing:-.035em!important;
    margin:0 0 14px!important;
  }
  body.dashboard-context .dashboard-main h2{font-size:18px!important;line-height:1.2!important;letter-spacing:-.025em!important;}
  body.dashboard-context .dashboard-main h3{font-size:16px!important;line-height:1.25!important;}

  /* Forms: touch-safe inputs, aligned checkboxes, full-width action buttons */
  body.dashboard-context .form-grid,
  body.dashboard-context .su-panel-form,
  body.dashboard-context form .grid,
  body.dashboard-context .grid.form-grid{
    grid-template-columns:1fr!important;
    gap:12px!important;
  }
  body.dashboard-context label{font-size:12.6px!important;line-height:1.25!important;}
  body.dashboard-context input:not([type="checkbox"]):not([type="radio"]),
  body.dashboard-context select,
  body.dashboard-context textarea{
    width:100%!important;
    max-width:100%!important;
    min-height:46px!important;
    border-radius:14px!important;
    font-size:14px!important;
    padding:11px 13px!important;
  }
  body.dashboard-context textarea{min-height:108px!important;line-height:1.45!important;}
  body.dashboard-context input[type="checkbox"],
  body.dashboard-context input[type="radio"]{
    width:22px!important;height:22px!important;min-width:22px!important;min-height:22px!important;
    margin:0 9px 0 0!important;
  }
  body.dashboard-context label.inline,
  body.dashboard-context .form-check,
  body.dashboard-context .checkbox-row{
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:8px!important;
    min-height:42px!important;
    width:100%!important;
  }
  body.dashboard-context .form-actions,
  body.dashboard-context .panel-actions,
  body.dashboard-context .actions{
    display:flex!important;
    flex-direction:column!important;
    gap:9px!important;
    width:100%!important;
    margin-top:14px!important;
  }
  body.dashboard-context .form-actions .btn,
  body.dashboard-context .panel-actions .btn,
  body.dashboard-context .actions .btn,
  body.dashboard-context button[type="submit"],
  body.dashboard-context input[type="submit"]{
    width:100%!important;
    min-height:46px!important;
    border-radius:15px!important;
    font-size:14px!important;
  }

  /* Filters and search blocks: no tiny controls */
  body.dashboard-context .filter-bar,
  body.dashboard-context .filters,
  body.dashboard-context .search-filter,
  body.dashboard-context .toolbar,
  body.dashboard-context .table-toolbar{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:9px!important;
    width:100%!important;
  }
  body.dashboard-context .filter-bar .btn,
  body.dashboard-context .filters .btn,
  body.dashboard-context .search-filter .btn,
  body.dashboard-context .toolbar .btn,
  body.dashboard-context .table-toolbar .btn{width:100%!important;min-height:44px!important;}

  /* Mobile tables/cards: safer reading, no accidental horizontal overflow */
  body.dashboard-context table{max-width:100%!important;}
  body.dashboard-context .table-responsive,
  body.dashboard-context .table-wrap{max-width:100%!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch!important;}
  body.dashboard-context .mobile-card,
  body.dashboard-context .sf-mobile-card,
  body.dashboard-context .admin-mobile-card{
    border-radius:17px!important;
    padding:13px!important;
    box-shadow:0 8px 22px rgba(16,35,63,.055)!important;
  }

  /* MFA setup polish on mobile */
  body.dashboard-context .mfa-grid,
  body.dashboard-context .security-grid{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:12px!important;
  }
  body.dashboard-context .mfa-qr,
  body.dashboard-context .qr-wrap,
  body.dashboard-context .qr-box{
    max-width:100%!important;
    margin-left:auto!important;
    margin-right:auto!important;
    overflow:hidden!important;
  }

  /* Public homepage mobile finishing, scoped so desktop stays safe */
  body.public-context .nav-inner{gap:8px!important;}
  body.public-context .nav-actions{gap:6px!important;}
  body.public-context .nav-actions .btn{min-height:38px!important;border-radius:13px!important;padding:0 11px!important;font-size:12px!important;}
  body.public-context .hero,
  body.public-context .section{padding-left:14px!important;padding-right:14px!important;}
}

@media (max-width:430px){
  body.dashboard-context .sf-mobile-panel-bar,
  body.dashboard-context .sf-mobile-panel-bar.sf-mobile-panel-compact-a{padding:10px 8px 11px!important;border-radius:0 0 18px 18px!important;}
  body.dashboard-context .sf-mobile-panel-top b{font-size:15px!important;}
  body.dashboard-context .sf-mobile-panel-top small{max-width:62vw!important;font-size:10.2px!important;}
  body.dashboard-context .sf-mobile-logout{min-height:34px!important;padding:0 12px!important;}
  body.dashboard-context .sf-mobile-quick-actions{gap:6px!important;}
  body.dashboard-context .sf-mobile-quick-link{min-height:51px!important;font-size:9.8px!important;border-radius:14px!important;}
  body.dashboard-context .sf-mobile-quick-link span{width:22px!important;height:22px!important;min-width:22px!important;min-height:22px!important;}
  body.dashboard-context details.sf-mobile-all-menu > summary{min-height:48px!important;padding:0 12px!important;}
  body.dashboard-context .dashboard-main{padding:8px 7px calc(32px + env(safe-area-inset-bottom))!important;}
  body.dashboard-context .dashboard-main > .panel{padding:14px!important;border-radius:18px!important;}
  body.dashboard-context .panel > h1,
  body.dashboard-context .dashboard-main h1{font-size:21px!important;}
}

/* =========================================================
   Safira.id v150.2 — Mobile Menu Touch Polish
   Keeps Konsep A menu clean, touch-friendly, and non-overlapping.
   ========================================================= */
@media (max-width: 768px) {
  body.dashboard-context {
    background: #eef4fb !important;
    overflow-x: hidden !important;
  }

  body.dashboard-context .dashboard-main,
  body.dashboard-context main,
  body.dashboard-context .main-content {
    padding-left: 10px !important;
    padding-right: 10px !important;
    padding-bottom: calc(24px + env(safe-area-inset-bottom, 0px)) !important;
  }

  body.dashboard-context .mobile-dashboard-head,
  body.dashboard-context .dashboard-mobile-head,
  body.dashboard-context .mobile-panel-head,
  body.dashboard-context .sf-mobile-head {
    border-radius: 0 0 22px 22px !important;
    box-shadow: 0 18px 40px rgba(2, 12, 27, .18) !important;
  }

  body.dashboard-context .mobile-quick-nav,
  body.dashboard-context .sf-mobile-quick-nav {
    gap: 8px !important;
    padding: 8px 8px 10px !important;
  }

  body.dashboard-context .mobile-quick-nav a,
  body.dashboard-context .sf-mobile-quick-nav a,
  body.dashboard-context .mobile-quick-nav .btn,
  body.dashboard-context .sf-mobile-quick-nav .btn {
    min-height: 48px !important;
    border-radius: 14px !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 10px 22px rgba(0,0,0,.12) !important;
  }

  body.dashboard-context .sf-mobile-menu-toggle,
  body.dashboard-context .mobile-menu-toggle,
  body.dashboard-context details.sf-mobile-menu summary,
  body.dashboard-context details.mobile-dashboard-menu summary {
    width: 100% !important;
    min-height: 48px !important;
    border-radius: 16px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    padding: 0 14px !important;
    background: rgba(255,255,255,.10) !important;
    border: 1px solid rgba(255,255,255,.14) !important;
    color: #fff !important;
    font-weight: 850 !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.12) !important;
  }

  body.dashboard-context .sf-mobile-menu-list,
  body.dashboard-context .mobile-dashboard-menu-list,
  body.dashboard-context details.sf-mobile-menu[open] .sf-mobile-menu-list,
  body.dashboard-context details.mobile-dashboard-menu[open] .mobile-dashboard-menu-list {
    margin-top: 8px !important;
    max-height: min(56dvh, 430px) !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    border-radius: 18px !important;
  }

  body.dashboard-context .sf-mobile-menu-list a,
  body.dashboard-context .mobile-dashboard-menu-list a,
  body.dashboard-context details.sf-mobile-menu a,
  body.dashboard-context details.mobile-dashboard-menu a {
    min-height: 46px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 0 14px !important;
    border-radius: 13px !important;
    font-size: 13px !important;
    font-weight: 760 !important;
    text-decoration: none !important;
  }

  body.dashboard-context .panel,
  body.dashboard-context .card,
  body.dashboard-context .dashboard-panel,
  body.dashboard-context .content-panel {
    border-radius: 20px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-shadow: 0 14px 32px rgba(15, 23, 42, .08) !important;
  }

  body.dashboard-context .panel h1,
  body.dashboard-context .panel h2,
  body.dashboard-context .dashboard-main h1,
  body.dashboard-context .dashboard-main h2 {
    line-height: 1.05 !important;
  }

  body.dashboard-context .filterbar,
  body.dashboard-context .advanced-filterbar,
  body.dashboard-context .sf937-filter,
  body.dashboard-context .form-grid {
    gap: 12px !important;
  }

  body.dashboard-context .btn,
  body.dashboard-context button[type="submit"],
  body.dashboard-context .form-actions .btn,
  body.dashboard-context .action-row .btn {
    min-height: 46px !important;
    border-radius: 14px !important;
  }
}