/* OpsHub Neo UI overrides (modern + futuristic). Load AFTER app.css */

:root{
  --radius:18px;
  --radius2:14px;
  --shadow: 0 20px 60px rgba(0,0,0,.45);
  --shadow2: 0 12px 32px rgba(0,0,0,.28);
}

html[data-theme="light"]{
  --bg:#f9fafb;
  --bg2:#f3f4f6;
  --card:rgba(255,255,255,.92);
  --card2:rgba(255,255,255,.98);
  --surface:rgba(15,23,42,.03);
  --surface2:rgba(15,23,42,.05);
  --shadow: 0 18px 50px rgba(2,6,23,.10);
  --shadow2: 0 10px 30px rgba(2,6,23,.10);
}

/* Background polish */
html[data-theme="light"] body{
  background: radial-gradient(900px 520px at 10% 0%, rgba(93,168,122,.20), transparent 62%),
              radial-gradient(900px 520px at 90% 0%, rgba(96,165,250,.16), transparent 62%),
              linear-gradient(180deg, var(--bg), var(--bg2));
}

/* Topbar: near-white in light mode */
.topbar{
  border-bottom:1px solid var(--line);
  box-shadow: 0 1px 0 rgba(255,255,255,.02);
}
html[data-theme="light"] .topbar{
  background: rgba(255,255,255,.92) !important;
  backdrop-filter: blur(10px);
}
html[data-theme="dark"] .topbar{
  background: rgba(8,12,22,.52) !important;
  backdrop-filter: blur(12px);
}

/* Sidebar: new glass card */
.sidebar{
  background: rgba(255,255,255,.035);
  border-right: 1px solid var(--line);
  border-radius: 0;
  padding:16px 14px;
}
html[data-theme="light"] .sidebar{
  background: rgba(255,255,255,.86);
  border-right:1px solid rgba(15,23,42,.10);
}

.brand{
  background: var(--card);
  border-color: var(--line);
}

/* Collapsible groups */
.nav{ gap:10px; }
.nav-section{ border:1px solid transparent; border-radius:16px; overflow:hidden; }
.nav-section[open]{ background: var(--surface); border-color: var(--line); }
.nav-section summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:10px 12px;
  cursor:pointer;
  user-select:none;
  color: var(--muted2);
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.12em;
}
.nav-section summary::-webkit-details-marker{ display:none; }
.nav-section summary .chev{ transition: transform .15s ease; opacity:.8; }
.nav-section[open] summary .chev{ transform: rotate(180deg); }
.nav-section-items{ padding:6px 6px 8px; display:flex; flex-direction:column; gap:6px; }

/* Links */
.nav-link{
  border-radius: 14px;
  background: transparent;
}
.nav-link:hover{ background: var(--card); }

/* Mini sidebar (icons only) */
.sidebar.is-mini{ width:86px; padding:14px 10px; }
.sidebar.is-mini .brand-meta{ display:none; }
.sidebar.is-mini .nav-section summary span:first-child{ display:none; }
.sidebar.is-mini .nav-link span:last-child{ display:none; }
.sidebar.is-mini .nav-link{ justify-content:center; padding:10px; }
.sidebar.is-mini .logout button{ padding:10px; font-size:0; }
.sidebar.is-mini .logout button::after{ content:"↩"; font-size:14px; }

/* Calendar readability in light mode */
html[data-theme="light"] .fc .fc-event,
html[data-theme="light"] .fc .fc-daygrid-event{
  background: rgba(93,168,122,.22) !important;
  border-color: rgba(93,168,122,.35) !important;
}
html[data-theme="light"] .fc .fc-event .fc-event-main,
html[data-theme="light"] .fc .fc-event-title,
html[data-theme="light"] .fc .fc-event-time{
  color: #0f172a !important;
  font-weight: 700;
}

/* Notification bell */
.notifs .iconbtn{ border-radius:999px; }


/* Calendar readability (FullCalendar) */
html[data-theme="light"] .fc .fc-event,
html[data-theme="light"] .fc .fc-event-main,
html[data-theme="light"] .fc .fc-event-title,
html[data-theme="light"] .fc .fc-event-time{
  color:#0f172a !important;
}
html[data-theme="light"] .fc .fc-daygrid-event,
html[data-theme="light"] .fc .fc-timegrid-event{
  background: rgba(93,168,122,.22) !important;
  border-color: rgba(93,168,122,.35) !important;
}
html[data-theme="light"] .fc .fc-daygrid-dot-event .fc-event-title{
  color:#0f172a !important;
}

/* Sidebar overflow: allow scrolling only when needed (expanded groups). */
.sidebar{ overflow-y:auto; height:100vh; }
