
/* v171 Premium App Navigation */
:root{
  --nav-bg: rgba(255,255,255,.97);
  --nav-line: rgba(15,23,42,.08);
  --nav-shadow: 0 28px 80px rgba(15,23,42,.20);
  --nav-red: #dc2626;
  --nav-red-dark: #991b1b;
  --nav-text: #0f172a;
  --nav-muted: #64748b;
}

.drawer,
.side-menu,
.sidebar,
.mobile-menu,
#sideMenu,
#menuPanel,
[class*="drawer"],
[class*="side"],
[class*="menu"]{
  background: var(--nav-bg) !important;
  backdrop-filter: blur(22px) saturate(155%) !important;
  -webkit-backdrop-filter: blur(22px) saturate(155%) !important;
  box-shadow: var(--nav-shadow) !important;
}

.drawer,
.side-menu,
.sidebar,
.mobile-menu,
#sideMenu,
#menuPanel{
  border: 1px solid var(--nav-line) !important;
  border-radius: 26px 0 0 26px !important;
  padding: 18px !important;
}

.drawer::before,
.side-menu::before,
.sidebar::before,
.mobile-menu::before,
#sideMenu::before,
#menuPanel::before{
  content: "סדש SmartOps";
  display: block;
  font-size: 18px;
  font-weight: 950;
  color: var(--nav-text);
  margin: 2px 4px 14px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--nav-line);
  letter-spacing: -.03em;
}

.drawer button,
.side-menu button,
.sidebar button,
.mobile-menu button,
#sideMenu button,
#menuPanel button,
.drawer a,
.side-menu a,
.sidebar a,
.mobile-menu a,
#sideMenu a,
#menuPanel a{
  position: relative !important;
  min-height: 52px !important;
  width: 100% !important;
  border-radius: 18px !important;
  border: 1px solid rgba(148,163,184,.16) !important;
  background: linear-gradient(180deg,rgba(255,255,255,.98),rgba(248,250,252,.92)) !important;
  color: var(--nav-text) !important;
  font-size: 15px !important;
  font-weight: 850 !important;
  letter-spacing: -.015em !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 12px !important;
  padding: 12px 16px !important;
  margin: 7px 0 !important;
  box-shadow: 0 10px 24px rgba(15,23,42,.055) !important;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease !important;
  text-align: right !important;
}

.drawer button::after,
.side-menu button::after,
.sidebar button::after,
.mobile-menu button::after,
#sideMenu button::after,
#menuPanel button::after,
.drawer a::after,
.side-menu a::after,
.sidebar a::after,
.mobile-menu a::after,
#sideMenu a::after,
#menuPanel a::after{
  content: "›";
  margin-inline-start: auto;
  color: var(--nav-muted);
  font-size: 22px;
  font-weight: 700;
  transform: rotate(180deg);
}

.drawer button:hover,
.side-menu button:hover,
.sidebar button:hover,
.mobile-menu button:hover,
#sideMenu button:hover,
#menuPanel button:hover,
.drawer a:hover,
.side-menu a:hover,
.sidebar a:hover,
.mobile-menu a:hover,
#sideMenu a:hover,
#menuPanel a:hover{
  transform: translateY(-1px) scale(1.005) !important;
  border-color: rgba(220,38,38,.24) !important;
  background: linear-gradient(180deg,rgba(254,242,242,.98),rgba(255,255,255,.96)) !important;
  box-shadow: 0 16px 34px rgba(15,23,42,.10) !important;
}

.drawer button.active,
.side-menu button.active,
.sidebar button.active,
.mobile-menu button.active,
#sideMenu button.active,
#menuPanel button.active,
.drawer [aria-current="page"],
.side-menu [aria-current="page"],
.sidebar [aria-current="page"],
.mobile-menu [aria-current="page"]{
  color: #fff !important;
  background: linear-gradient(135deg,var(--nav-red),var(--nav-red-dark)) !important;
  border-color: transparent !important;
  box-shadow: 0 18px 38px rgba(220,38,38,.26) !important;
}

.drawer button.active::after,
.side-menu button.active::after,
.sidebar button.active::after,
.mobile-menu button.active::after,
#sideMenu button.active::after,
#menuPanel button.active::after{
  color: rgba(255,255,255,.78) !important;
}

/* Hamburger premium */
.menu-btn,
button[aria-label*="תפריט"],
button[title*="תפריט"]{
  width: 48px !important;
  height: 48px !important;
  border-radius: 17px !important;
  background: linear-gradient(180deg,#fff,#f8fafc) !important;
  border: 1px solid rgba(148,163,184,.20) !important;
  box-shadow: 0 12px 28px rgba(15,23,42,.10) !important;
  font-size: 31px !important;
  font-weight: 1000 !important;
}

.menu-btn:active,
button[aria-label*="תפריט"]:active,
button[title*="תפריט"]:active{
  transform: scale(.96) !important;
}

@media (max-width: 720px){
  .drawer,
  .side-menu,
  .sidebar,
  .mobile-menu,
  #sideMenu,
  #menuPanel{
    width: min(90vw, 370px) !important;
    padding: 18px !important;
  }
}


/* v171 Premium screen titles */
.sec-title,
.section-title,
h1,
h2{
  letter-spacing: -.035em;
}

.screen-title,
.page-title,
.main-title,
.sec-title{
  font-weight: 950 !important;
  color: #0f172a !important;
}

.sec-title{
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 6px 10px !important;
  border-radius: 14px !important;
  background: linear-gradient(180deg,rgba(255,255,255,.92),rgba(248,250,252,.82)) !important;
  border: 1px solid rgba(148,163,184,.14) !important;
  box-shadow: 0 8px 20px rgba(15,23,42,.045) !important;
}
