/* =========================================================
   JIDOps Enterprise Operations Platform — Theme CSS
   Brand: #1677ff (blue) → #25a8f2 → #2fd39a (teal/green)
   Loaded by _Layout.cshtml over app.css to apply brand colours
   ========================================================= */

@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=Inter:wght@400;500;600;700&display=swap');

:root {
  --jidops-primary:        #1677ff;
  --jidops-primary-hover:  #0f5eea;
  --jidops-primary-active: #0b4fcc;
  --jidops-secondary:      #2fd39a;
  --jidops-secondary-hover:#20bd87;
  --jidops-accent:         #25a8f2;
  --jidops-navy:           #0b1f45;
  --jidops-deep-navy:      #071536;

  --jidops-brand-gradient: linear-gradient(135deg, #1677ff 0%, #25a8f2 48%, #2fd39a 100%);
  --jidops-hero-gradient:  linear-gradient(135deg, #0b1f45 0%, #1677ff 58%, #2fd39a 100%);
  --jidops-soft-gradient:  linear-gradient(135deg, rgba(22,119,255,.1), rgba(47,211,154,.1));

  --jidops-font-heading:   "Space Grotesk", "Inter", sans-serif;
  --jidops-font-body:      "Inter", system-ui, sans-serif;

  --jidops-radius-sm:      8px;
  --jidops-radius-md:      10px;
  --jidops-radius-lg:      12px;
  --jidops-radius-xl:      16px;
  --jidops-radius-full:    999px;

  --jidops-shadow-sm:      0 2px 8px rgba(15,23,42,.06);
  --jidops-shadow-md:      0 8px 30px rgba(15,94,234,.08);
  --jidops-shadow-lg:      0 20px 60px rgba(15,94,234,.12);

  --jidops-transition-fast:150ms ease-out;
  --jidops-transition:     180ms ease-out;
}

/* ── Override all theme accents to JIDOps brand blue ───── */
:root,
[data-theme="midnight"],
[data-theme="slate"],
[data-theme="glass"],
[data-theme="ocean"],
[data-theme="graphite"] {
  --accent:       #1677ff !important;
  --accent-hover: #0f5eea !important;
  --accent-light: rgba(22,119,255,.12) !important;
  --accent-text:  #60a5fa !important;
}

[data-theme="corporate"],
[data-theme="arctic"] {
  --accent:       #1677ff !important;
  --accent-hover: #0f5eea !important;
  --accent-light: #eff6ff !important;
  --accent-text:  #0f5eea !important;
}

/* Keep forest/ember/ocean with their own accent colours
   — they are intentionally different palette themes */

/* ── Sidebar logo ──────────────────────────────────────── */
.sidebar-logo img {
  border-radius: 6px;
  object-fit: contain;
  flex-shrink: 0;
}

.logo-brand {
  font-family: var(--jidops-font-heading) !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
}

/* ── Active nav — brand blue ───────────────────────────── */
.nav-item.active {
  background: rgba(22,119,255,.15) !important;
  color: #60a5fa !important;
}

.nav-item.active .nav-icon { color: #1677ff !important; }

.nav-sub-item.active {
  background: rgba(22,119,255,.15) !important;
  color: #60a5fa !important;
  border-left-color: #1677ff !important;
}

/* ── Buttons ───────────────────────────────────────────── */
.btn-primary {
  background: #1677ff !important;
}

.btn-primary:hover {
  background: #0f5eea !important;
  box-shadow: 0 4px 16px rgba(22,119,255,.3) !important;
}

/* ── Focus ring ────────────────────────────────────────── */
:focus-visible { outline-color: #1677ff !important; }

/* ── Login page — use logo image ───────────────────────── */
.login-logo {
  gap: 14px !important;
}

.login-logo .logo-mark {
  display: none; /* replaced by image below */
}

.login-logo-img {
  height: 44px;
  object-fit: contain;
}

/* ── Scrollbar ─────────────────────────────────────────── */
::-webkit-scrollbar-thumb {
  background: rgba(22,119,255,.2) !important;
}
::-webkit-scrollbar-thumb:hover {
  background: rgba(22,119,255,.4) !important;
}

/* ── Brand gradient utilities ──────────────────────────── */
.jidops-gradient-text {
  background: var(--jidops-brand-gradient);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.jidops-gradient-bg {
  background: var(--jidops-brand-gradient);
}

/* ── Notification badge ────────────────────────────────── */
#notif-badge {
  background: #ef4444 !important;
}