/* TUNNEL GO Layout Consistency - Frontend Stage 11 */
:root{--layout-bottom-safe:calc(72px + env(safe-area-inset-bottom));}
.admin-sidebar,.user-sidebar,.tg-sidebar{scrollbar-width:thin;scrollbar-color:rgba(56,189,248,.35) transparent;}
.admin-nav-link,.nav-item,.tg-nav a{min-height:44px;}
.admin-nav-link.active,.nav-item.active,.tg-nav a.active{position:relative;}
.admin-nav-link.active:before,.nav-item.active:before,.tg-nav a.active:before{content:"";position:absolute;left:0;top:50%;width:3px;height:50%;transform:translateY(-50%);border-radius:999px;background:linear-gradient(180deg,var(--tg-blue,#38bdf8),var(--tg-violet,#8b5cf6));}
.admin-topbar,.user-topbar,.tg-topbar{box-shadow:0 16px 44px rgba(0,0,0,.18);}
.admin-main,.user-main,.tg-main{min-width:0;}
.admin-content,.dashboard-content,.vpn-content,.ppob-content,.smm-content{max-width:1480px;width:100%;margin:0 auto;}
.sidebar-backdrop,.drawer-backdrop{display:none;}
body.menu-open .sidebar-backdrop,body.tg-menu-open .sidebar-backdrop,body.tg-menu-open .drawer-backdrop{display:block;}
.bottom-nav,.tg-bottom-nav{position:fixed;left:0;right:0;bottom:0;z-index:65;display:none;background:rgba(2,6,23,.91);border-top:1px solid rgba(148,163,184,.18);backdrop-filter:blur(18px);padding:7px 8px calc(7px + env(safe-area-inset-bottom));grid-template-columns:repeat(5,minmax(0,1fr));}
.bottom-nav a,.tg-bottom-nav a{min-width:0;display:flex;flex-direction:column;align-items:center;gap:3px;color:#94a3b8;font-size:10px;font-weight:900;border-radius:14px;padding:7px 5px;text-decoration:none;}
.bottom-nav a.active,.tg-bottom-nav a.active{color:#fff;background:linear-gradient(135deg,rgba(56,189,248,.14),rgba(139,92,246,.13));}
.bottom-nav span,.tg-bottom-nav span{font-size:18px;line-height:1;}
.tg-nav button[data-logout]{width:100%;margin-top:8px;border:1px solid rgba(239,68,68,.25);background:rgba(239,68,68,.10);color:#fecaca;border-radius:16px;padding:11px 12px;font-weight:950;}
.tg-nav a{display:flex;align-items:center;gap:10px;border-radius:17px;padding:12px 13px;color:#94a3b8;font-weight:900;font-size:14px;transition:.18s ease;position:relative;}
.tg-nav a:hover{background:rgba(255,255,255,.06);color:#fff;}
.tg-nav a.active{color:#fff;background:linear-gradient(135deg,rgba(56,189,248,.16),rgba(139,92,246,.18));border:1px solid rgba(56,189,248,.24);}
@media(max-width:1120px){
  .admin-sidebar{will-change:transform;}
  .admin-content{padding-bottom:var(--layout-bottom-safe);}
}
@media(max-width:1040px){
  body.is-user-page .bottom-nav,body.is-user-page .tg-bottom-nav{display:grid;}
  .user-main,.tg-main{padding-bottom:var(--layout-bottom-safe)!important;}
  .tg-sidebar{position:fixed!important;inset:0 auto 0 0;width:286px;transform:translateX(-105%);transition:.18s;z-index:80;height:100vh;overflow:auto;background:linear-gradient(180deg,rgba(2,6,23,.96),rgba(15,23,42,.92));border-right:1px solid rgba(148,163,184,.18);padding:18px 14px;}
  body.tg-menu-open .tg-sidebar,body.menu-open .tg-sidebar{transform:translateX(0);}
  .tg-layout{grid-template-columns:1fr!important;}
}
@media(max-width:760px){
  .admin-topbar,.user-topbar,.tg-topbar{gap:10px;}
  .admin-topbar h1,.page-title{font-size:clamp(24px,8vw,34px);}
  .admin-topbar p,.page-subtitle,.page-sub{font-size:13px;line-height:1.6;}
  .admin-nav-link,.nav-item,.tg-nav a{min-height:46px;}
  .card,.admin-card{border-radius:22px;}
}