/* Extracted from inline <style> in navtoggle.php for CSP compliance */
.card-menu .nav-btn { display:flex; align-items:center; justify-content:flex-start; gap:.65rem; text-align:left; width:100%; }
.card-menu .nav-btn i { font-size:1rem; margin-right:.15rem; color:var(--nav-icon-color, currentColor); }
.card-menu .nav-btn span { display:inline-block; }
.card-menu .offcanvas-title { width: 100%; }
@media (max-width: 480px) { .card-menu .nav-btn { width: 100%; padding-top: .45rem; padding-bottom: .45rem; } }
.card-menu .section-label { width: 100%; text-align: left; }
#offcanvasNavbar { display: flex; flex-direction: column; max-height: 100vh; }
#offcanvasNavbar .offcanvas-body { flex: 1 1 auto; overflow-y: auto; -webkit-overflow-scrolling: touch; padding-bottom: .75rem; }
@media (min-width: 768px) {
  body { --sidebar-width: var(--bs-offcanvas-width, 280px); }
  body.nav-pinned { padding-left: var(--sidebar-width); }
  /* Rely on body padding for shift; avoid double-offset with main margins */
  #offcanvasNavbar.pinned-aside { position: fixed; top: var(--nav-height, 56px); left: 0; width: var(--sidebar-width); height: calc(100dvh - var(--nav-height, 56px)); transform:none!important; visibility:visible!important; pointer-events:auto!important; border-right:1px solid rgba(0,0,0,.1); z-index:1030; display:flex; flex-direction:column; }
  body.nav-pinned { overflow-y:auto; }
  #offcanvasNavbar.pinned-aside .btn-close { display:none; }
  body.nav-pinned .navbar .navbar-toggler[data-bs-target="#offcanvasNavbar"] { display:none; }
  body.nav-pinned .offcanvas-backdrop { display:none!important; }
  body { --sidebar-right-width: var(--bs-offcanvas-width, 280px); }
  body.nav-right-pinned { padding-right: var(--sidebar-right-width); }
  /* Normalize main layout; width auto respects body padding */
  body.nav-pinned main,
  body.nav-right-pinned main,
  body.nav-pinned.nav-right-pinned main { width:auto; margin:0; }
  #navbarRightAlignedMenu.pinned-aside-right { position:fixed; top:var(--nav-height,56px); right:0; width:var(--sidebar-right-width); height:calc(100dvh - var(--nav-height,56px)); transform:none!important; visibility:visible!important; pointer-events:auto!important; border-left:1px solid rgba(0,0,0,.1); z-index:1030; display:flex; flex-direction:column; }
  body.nav-right-pinned { overflow-y:auto; }
  #navbarRightAlignedMenu.pinned-aside-right .btn-close, #navbarRightAlignedMenu.pinned-aside-right .offcanvas-close-btn { display:none!important; }
  body.nav-right-pinned .navbar .navbar-toggler[data-bs-target="#navbarRightAlignedMenu"] { display:none; }
  body.nav-right-pinned .offcanvas-backdrop { display:none!important; }
}
[data-bs-theme='light'] .card-menu { --nav-icon-color:#1d4ed8; }
[data-bs-theme='dark'] .card-menu { --nav-icon-color:#60a5fa; }
[data-bs-theme='blue'] .card-menu { --nav-icon-color:#fbbf24; }
.card-menu .nav-btn:hover i { filter: brightness(1.05); }
/* 3D / Elevated nav buttons (applies across themes) */
/* Base (primary outline variant) */
/* Enhanced 3D style (stronger gradient + highlight) */
.card-menu .nav-btn {
  position:relative;
  font-weight:500;
  border-radius:.75rem;
  padding:.62rem .95rem;
  background:
    linear-gradient(160deg,
      color-mix(in oklab, var(--primary-color) 18%, var(--background-container) 82%) 0%,
      color-mix(in oklab, var(--primary-color) 6%, var(--background-container) 94%) 100%) !important;
  border:1px solid color-mix(in oklab, var(--primary-color) 55%, transparent 55%) !important;
  box-shadow:
    0 2px 4px -1px rgba(0,0,0,.16),
    0 3px 6px -2px color-mix(in oklab, var(--primary-color), transparent 80%),
    0 0 0 1px color-mix(in oklab, var(--primary-color) 35%, transparent 85%) !important;
  transition:background .45s, box-shadow .45s, transform .3s, color .3s, border-color .45s, filter .45s;
  backdrop-filter:saturate(140%) brightness(1.02);
}
.card-menu .nav-btn::before {
  content:"";
  position:absolute; inset:0; border-radius:inherit; pointer-events:none;
  background:linear-gradient(to bottom, rgba(255,255,255,.55), rgba(255,255,255,0));
  mix-blend-mode:overlay;
  opacity:.55; transition:opacity .45s;
}
/* Neutral (danger variant will override) */
.card-menu .nav-btn.btn-outline-primary { color:var(--navbar-link-color, var(--btn-text-color,#111827)); }
/* Hover / focus */
.card-menu .nav-btn:where(:hover,:focus-visible) {
  background:
    linear-gradient(155deg,
      color-mix(in oklab, var(--primary-color) 26%, var(--background-container) 74%) 0%,
      color-mix(in oklab, var(--primary-color) 10%, var(--background-container) 90%) 100%) !important;
  box-shadow:
    0 6px 16px -3px color-mix(in oklab, var(--primary-color), transparent 50%),
    0 3px 10px -2px rgba(0,0,0,.28),
    0 0 0 1px color-mix(in oklab, var(--primary-color) 55%, transparent 70%) !important;
  transform:translateY(-3px);
  text-decoration:none;
}
.card-menu .nav-btn:where(:hover,:focus-visible)::before { opacity:.75; }
/* Active state (mouse down) */
.card-menu .nav-btn:active { transform:translateY(-1px); box-shadow:0 3px 8px -2px color-mix(in oklab, var(--primary-color), transparent 60%), 0 2px 4px rgba(0,0,0,.25) !important; }
/* Current / active page */
.card-menu .nav-btn.active,
.card-menu .nav-btn[aria-current="page"] {
  background:linear-gradient(155deg, var(--primary-color) 0%, color-mix(in oklab, var(--primary-hover,#1e4fd1), var(--primary-color) 40%) 100%) !important;
  color:var(--btn-text-color,#fff)!important;
  border-color:color-mix(in oklab, var(--primary-hover,#1e4fd1), transparent 15%) !important;
  box-shadow:0 6px 16px -3px color-mix(in oklab, var(--primary-color), transparent 35%), 0 3px 10px -2px rgba(0,0,0,.35), 0 0 0 1px color-mix(in oklab, var(--primary-color) 65%, transparent 55%) !important;
}
/* Danger (logout etc.) */
.card-menu .nav-btn.btn-outline-danger {
  --danger-color: var(--bs-danger,#dc3545);
  color:var(--danger-color)!important;
  border-color:color-mix(in oklab, var(--danger-color) 70%, transparent) !important;
  background:linear-gradient(160deg,
    color-mix(in oklab, var(--danger-color) 20%, var(--background-container) 80%) 0%,
    color-mix(in oklab, var(--danger-color) 6%, var(--background-container) 94%) 100%) !important;
  box-shadow:0 2px 4px -1px rgba(0,0,0,.16), 0 3px 6px -2px color-mix(in oklab, var(--danger-color), transparent 80%), 0 0 0 1px color-mix(in oklab, var(--danger-color) 35%, transparent 85%) !important;
}
.card-menu .nav-btn.btn-outline-danger:where(:hover,:focus-visible) {
  background:linear-gradient(155deg,
    color-mix(in oklab, var(--danger-color) 32%, var(--background-container) 68%) 0%,
    color-mix(in oklab, var(--danger-color) 12%, var(--background-container) 88%) 100%) !important;
  box-shadow:0 6px 16px -3px color-mix(in oklab, var(--danger-color), transparent 50%), 0 3px 10px -2px rgba(0,0,0,.30), 0 0 0 1px color-mix(in oklab, var(--danger-color) 60%, transparent 65%) !important;
  transform:translateY(-3px);
  color:color-mix(in oklab, var(--danger-color) 88%, #fff 12%)!important;
}
.card-menu .nav-btn.btn-outline-danger.active,
.card-menu .nav-btn.btn-outline-danger[aria-current="page"] {
  background:linear-gradient(155deg, var(--danger-color) 0%, color-mix(in oklab, var(--danger-color) 70%, #000 12%) 100%) !important;
  color:#fff!important;
  border-color:color-mix(in oklab, var(--danger-color) 60%, transparent 15%) !important;
  box-shadow:0 6px 16px -3px color-mix(in oklab, var(--danger-color), transparent 35%), 0 3px 10px -2px rgba(0,0,0,.35), 0 0 0 1px color-mix(in oklab, var(--danger-color) 65%, transparent 55%) !important;
}
/* Theme tuning: darker bases increase shadow softness */
[data-bs-theme='dark'] .card-menu .nav-btn,
[data-bs-theme='blue'] .card-menu .nav-btn {
  box-shadow:0 2px 3px -1px rgba(0,0,0,.5), 0 1px 1px rgba(0,0,0,.35);
}
[data-bs-theme='dark'] .card-menu .nav-btn:where(:hover,:focus-visible),
[data-bs-theme='blue'] .card-menu .nav-btn:where(:hover,:focus-visible) {
  box-shadow:0 4px 12px -3px color-mix(in oklab, var(--primary-color), transparent 40%), 0 2px 6px rgba(0,0,0,.55);
}
[data-bs-theme='dark'] .card-menu .nav-btn.active,
[data-bs-theme='dark'] .card-menu .nav-btn[aria-current="page"],
[data-bs-theme='blue'] .card-menu .nav-btn.active,
[data-bs-theme='blue'] .card-menu .nav-btn[aria-current="page"] {
  box-shadow:0 4px 14px -2px color-mix(in oklab, var(--primary-color), transparent 45%), 0 2px 6px rgba(0,0,0,.6);
}
[data-bs-theme='dark'] .card-menu .nav-btn.btn-outline-danger:where(:hover,:focus-visible),
[data-bs-theme='blue'] .card-menu .nav-btn.btn-outline-danger:where(:hover,:focus-visible) {
  box-shadow:0 4px 12px -3px color-mix(in oklab, var(--danger-color,#dc3545), transparent 45%), 0 2px 6px rgba(0,0,0,.55);
}
[data-bs-theme='dark'] .card-menu .nav-btn.btn-outline-danger.active,
[data-bs-theme='dark'] .card-menu .nav-btn.btn-outline-danger[aria-current="page"],
[data-bs-theme='blue'] .card-menu .nav-btn.btn-outline-danger.active,
[data-bs-theme='blue'] .card-menu .nav-btn.btn-outline-danger[aria-current="page"] {
  box-shadow:0 4px 14px -2px color-mix(in oklab, var(--danger-color,#dc3545), transparent 45%), 0 2px 6px rgba(0,0,0,.6);
}

/* Right offcanvas parity: apply same styles */
[data-bs-theme] #navbarRightAlignedMenu .nav-btn { text-align:left; width:100%; }

/* Light theme: make pin buttons gray fill with dark text (improved contrast) */
[data-bs-theme='light'] #pin-sidebar-btn,
[data-bs-theme='light'] #pin-right-sidebar-btn {
  background:linear-gradient(145deg,#f1f5f9,#e2e8f0) !important;
  color:#334155 !important;
  border-color:#cbd5e1 !important;
  box-shadow:0 1px 2px rgba(0,0,0,.08);
  transition:background .3s, box-shadow .3s, color .25s, transform .25s;
}
[data-bs-theme='light'] #pin-sidebar-btn:hover,
[data-bs-theme='light'] #pin-right-sidebar-btn:hover,
[data-bs-theme='light'] #pin-sidebar-btn:focus-visible,
[data-bs-theme='light'] #pin-right-sidebar-btn:focus-visible {
  background:linear-gradient(145deg,#e2e8f0,#d9e0e8) !important;
  color:#0f172a !important;
  box-shadow:0 2px 5px rgba(0,0,0,.12), 0 0 0 2px rgba(148,163,184,.25);
  text-decoration:none;
  transform:translateY(-1px);
}
[data-bs-theme='light'] #pin-sidebar-btn:active,
[data-bs-theme='light'] #pin-right-sidebar-btn:active { transform:translateY(0); box-shadow:0 1px 3px rgba(0,0,0,.15); }
[data-bs-theme='light'] #pin-sidebar-btn[aria-pressed='true'],
[data-bs-theme='light'] #pin-right-sidebar-btn[aria-pressed='true'] {
  background:linear-gradient(140deg,#dbeafe,#bfdbfe) !important;
  border-color:#93c5fd !important;
  color:#1e3a8a !important;
  box-shadow:0 0 0 2px rgba(147,197,253,.55), 0 2px 6px -2px rgba(0,0,0,.15);
}

/* Subtle separators between section labels and groups */
.card-menu .section-label { position:relative; padding-top:.35rem; padding-bottom:.15rem; }
.card-menu .section-label:after { content:""; position:absolute; left:0; right:0; bottom:-2px; height:1px; background:linear-gradient(90deg, rgba(0,0,0,0.08), rgba(0,0,0,0)); }
[data-bs-theme='dark'] .card-menu .section-label:after { background:linear-gradient(90deg, rgba(255,255,255,0.12), rgba(255,255,255,0)); }
[data-bs-theme='blue'] .card-menu .section-label:after { background:linear-gradient(90deg, rgba(255,255,255,0.25), rgba(255,255,255,0)); }
.offcanvas .offcanvas-header .offcanvas-close-btn { --btn-bg:rgba(0,0,0,0.06); --btn-bg-hover:rgba(0,0,0,0.12); --btn-color:currentColor; --btn-ring:rgba(13,110,253,.25); border:none; background:transparent; text-align:center; border-radius:.5rem; padding:.25rem .5rem .35rem; color:var(--btn-color); transition:background-color .15s ease-in-out, box-shadow .15s ease-in-out, color .15s ease-in-out; }
.offcanvas .offcanvas-header .offcanvas-close-btn .icon-wrap { display:inline-flex; align-items:center; justify-content:center; width:2rem; height:2rem; border-radius:999px; background-color:var(--btn-bg); }
.offcanvas .offcanvas-header .offcanvas-close-btn i { font-size:1.1rem; line-height:1; }
.offcanvas .offcanvas-header .offcanvas-close-btn .label { font-size:.7rem; margin-top:.2rem; opacity:.9; }
.offcanvas .offcanvas-header .offcanvas-close-btn:hover, .offcanvas .offcanvas-header .offcanvas-close-btn:focus { outline:none; }
.offcanvas .offcanvas-header .offcanvas-close-btn:hover .icon-wrap, .offcanvas .offcanvas-header .offcanvas-close-btn:focus .icon-wrap { background-color:var(--btn-bg-hover); box-shadow:0 0 0 .15rem var(--btn-ring); }
[data-bs-theme='dark'] .offcanvas .offcanvas-header .offcanvas-close-btn, [data-bs-theme='blue'] .offcanvas .offcanvas-header .offcanvas-close-btn { --btn-bg:rgba(255,255,255,0.12); --btn-bg-hover:rgba(255,255,255,0.22); --btn-color:#fff; --btn-ring:rgba(59,130,246,.35); }
@media (min-width:768px){ #offcanvasNavbar.pinned-aside .offcanvas-close-btn, body.nav-pinned #offcanvasNavbar .offcanvas-close-btn { display:none!important; } }