/* OysKasir navigation — sidebar and topbar only. */
.sidebar {
  border-color: rgba(255,255,255,.92);
  background: rgba(255,255,255,.78);
  box-shadow: 0 22px 60px rgba(47,50,84,.10), inset 0 1px 0 #fff;
}
.sidebar-brand { padding-inline:18px; background:linear-gradient(145deg,rgba(255,255,255,.76),rgba(247,246,255,.56)); }
.sidebar-brand img { width:44px; height:44px; border:2px solid rgba(255,255,255,.92); }
.sidebar-brand strong { font-size:16px; }
.sidebar-brand small { color:#8993a6; }
.sidebar nav { min-height:0; padding-inline:10px; }
.nav-group { margin-top:18px; margin-bottom:19px; }
.nav-group-label { margin-bottom:9px; }
.nav-link {
  min-height:46px;
  margin-block:3px;
  padding:7px 10px;
  border:1px solid transparent;
  font-weight:650;
  transition:color .2s ease,background-color .2s ease,border-color .2s ease,transform .2s ease,box-shadow .2s ease;
}
.nav-link>.icon { width:32px; height:32px; flex-basis:32px; padding:7px; }
.nav-link.active {
  color:#514bc1;
  border-color:rgba(99,102,241,.12);
  background:linear-gradient(135deg,rgba(250,249,255,.98),rgba(238,237,255,.92));
  box-shadow:0 9px 24px rgba(99,102,241,.10),inset 0 1px 0 #fff;
}
.nav-link.active::after { width:4px; }
.sidebar-footer {
  position:relative;
  min-height:62px;
  align-items:center;
  gap:8px;
  padding:9px 10px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.18);
  border-radius:17px;
  background:
    radial-gradient(circle at 12% 0,rgba(255,255,255,.18),transparent 72px),
    linear-gradient(135deg,#5f67ef 0%,#7558ef 56%,#9250e9 100%);
  box-shadow:0 13px 30px rgba(92,76,218,.28),inset 0 1px 0 rgba(255,255,255,.2);
}
.sidebar-footer::after {
  content:'';
  position:absolute;
  width:68px;
  height:68px;
  right:-35px;
  top:-42px;
  border:12px solid rgba(255,255,255,.055);
  border-radius:50%;
  pointer-events:none;
}
.sidebar-footer-brand { display:flex; align-items:center; gap:8px; min-width:0; position:relative; z-index:1; }
.sidebar-footer-mark {
  display:grid;
  width:31px;
  height:31px;
  place-items:center;
  flex:0 0 31px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:10px;
  color:#fff;
  background:rgba(255,255,255,.13);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16);
}
.sidebar-footer-mark .icon { width:15px; height:15px; }
.sidebar-footer-copy { display:flex; flex-direction:column; min-width:0; color:#fff; font-family:"Plus Jakarta Sans",sans-serif; }
.sidebar-footer-copy strong { overflow:hidden; font-size:9px; font-weight:800; letter-spacing:.01em; text-overflow:ellipsis; white-space:nowrap; }
.sidebar-footer-copy small { margin-top:2px; color:rgba(255,255,255,.7); font-size:7.5px; font-weight:600; letter-spacing:.02em; white-space:nowrap; }
.sidebar-footer button {
  position:relative;
  z-index:1;
  display:grid;
  width:29px;
  height:29px;
  min-width:29px;
  place-items:center;
  margin-left:auto;
  padding:0;
  border:1px solid rgba(255,255,255,.15);
  border-radius:9px;
  color:#fff;
  background:rgba(255,255,255,.13);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.13);
  transition:transform .2s ease,background-color .2s ease,box-shadow .2s ease;
}
.sidebar-footer button .icon { width:13px; height:13px; }
.collapsed .sidebar-footer { padding:8px; }
.collapsed .sidebar-footer-brand { display:none; }
.collapsed .sidebar-footer button { margin-inline:auto; transform:rotate(180deg); }
.topbar {
  height:64px;
  border-color:rgba(255,255,255,.94);
  background:rgba(255,255,255,.72);
  box-shadow:0 13px 38px rgba(44,48,82,.075),inset 0 1px 0 #fff;
}
.topbar .menu-btn,.topbar .branch-select,.topbar .module,.account-btn { min-height:40px; border-radius:13px; background:rgba(255,255,255,.68); }
.topbar .menu-btn { width:40px; }
.account-btn { padding-right:12px; }
.avatar { border-radius:10px; }
.main { padding-top:98px; }
@media (hover:hover) and (pointer:fine) {
  .nav-link:hover { transform:translateX(2px); }
  .sidebar-footer button:hover { background:rgba(255,255,255,.24); box-shadow:0 6px 14px rgba(42,31,135,.15),inset 0 1px 0 rgba(255,255,255,.2); transform:translateX(-1px); }
  .collapsed .sidebar-footer button:hover { transform:rotate(180deg) translateX(-1px); }
}
@media (max-width:960px) {
  .sidebar-brand { padding-inline:13px; }
  .sidebar-brand img { width:40px; height:40px; }
  .nav-link { padding-inline:7px; }
  .nav-link>.icon { width:30px; height:30px; flex-basis:30px; }
}
@media (max-width:760px) {
  .main { padding-top:84px; }
  .sidebar-brand { padding-inline:18px; }
  .sidebar-brand img { width:42px; height:42px; }
  .nav-link { padding-inline:10px; }
  .nav-link>.icon { width:32px; height:32px; flex-basis:32px; }
  .collapsed .sidebar-footer { padding:9px 10px; }
  .collapsed .sidebar-footer-brand { display:flex; }
  .collapsed .sidebar-footer button { margin-left:auto; margin-right:0; transform:none; }
}
@media (prefers-reduced-motion:reduce) { .nav-link,.sidebar-footer button { transition:none; } }