/* Tebligatçı — muhasebeci paneli: sabit kabuk (bant + header + tek sidebar), sadece içerik kayar */

:root{padding-top:0;padding-bottom:0}
html,body{height:100%;overflow:hidden}
#app{height:100%;display:flex;flex-direction:column;padding-top:env(safe-area-inset-top,0px)}

.demobar,.topbar{flex-shrink:0}
.topbar{position:static}

/* --- kabuk: sidebar sabit, sadece .main kayar --- */
.shell{flex:1 1 auto;min-height:0;display:flex;align-items:stretch}
.nav{
  position:static;
  align-self:stretch;
  width:236px;
  height:auto;
  min-height:0;
  padding:16px 12px calc(12px + env(safe-area-inset-bottom,0px));
  overflow-y:auto;
  scrollbar-width:thin;
  gap:2px;
}
.main{
  flex:1 1 auto;
  min-width:0;
  min-height:0;
  overflow-y:auto;
  overscroll-behavior:contain;
  padding:26px 32px calc(40px + env(safe-area-inset-bottom,0px));
}

/* --- sidebar görünümü --- */
.nav .navhead{
  display:flex;align-items:center;gap:10px;
  padding:6px 10px 14px;margin-bottom:8px;
  border-bottom:1px solid rgba(255,255,255,.08);
  color:#fff;
}
.nav .navhead i{width:30px;height:30px;border-radius:9px;background:var(--green-fill);flex-shrink:0;display:flex;align-items:center;justify-content:center}
.nav .navhead i svg{width:17px;height:17px}
.nav .navhead b{display:block;font-size:14px;font-weight:600;line-height:1.25}
.nav .navhead span{display:block;font-size:12px;color:#8f8c82}
.nav .navlabel{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#7d7a71;padding:12px 12px 6px}
.nav a{
  position:relative;
  gap:10px;
  padding:10px 12px;
  border-radius:9px;
  font-size:14px;
  transition:background .12s,color .12s;
}
.nav a .ico{width:18px;height:18px;flex-shrink:0;opacity:.75}
.nav a .txt{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nav a:hover{background:rgba(255,255,255,.06);color:#fff}
.nav a[aria-current="page"]{background:var(--nav-active);color:#fff}
.nav a[aria-current="page"] .ico{opacity:1}
.nav a[aria-current="page"]:before{
  content:"";position:absolute;left:-12px;top:50%;transform:translateY(-50%);
  width:3px;height:20px;border-radius:0 3px 3px 0;background:var(--green);
}
.nav .cnt{flex-shrink:0}
.nav .foot{margin-top:auto;padding:14px 12px 4px;border-top:1px solid rgba(255,255,255,.08)}

/* --- giriş ekranı da kabuk içinde kayar --- */
.auth-wrap{flex:1 1 auto;min-height:0;overflow-y:auto}

/* --- dar ekran: sidebar üstte yatay şerit, yine sabit --- */
@media (max-width:900px){
  .shell{flex-direction:column}
  .nav{
    width:auto;align-self:auto;flex-shrink:0;
    flex-direction:row;flex-wrap:nowrap;
    overflow-x:auto;overflow-y:hidden;
    padding:8px 10px;gap:6px;
    scrollbar-width:none;
  }
  .nav::-webkit-scrollbar{height:0}
  .nav a{white-space:nowrap;padding:9px 12px}
  .nav a[aria-current="page"]:before{display:none}
  .nav .navhead,.nav .navlabel,.nav .foot{display:none}
  .main{flex:1 1 auto;padding:16px 16px calc(28px + env(safe-area-inset-bottom,0px))}
}