:root{
  /* Dark: deep navy + cyan-blue accent */
  --app-primary:#22c1ff;
  --app-sidebar-bg:#0b1220;
  --app-body-bg:#0f172a;
  --app-card-bg:#111827;
  --app-text:#e5e7eb;
}
html[data-bs-theme="dark"]{
  --bs-primary: var(--app-primary);
  --bs-link-color: var(--app-primary);
  --bs-link-hover-color: color-mix(in srgb, var(--app-primary) 85%, #fff);
  --bs-body-bg: var(--app-body-bg);
  --bs-body-color: var(--app-text);
  --bs-tertiary-bg: var(--app-card-bg);
  --bs-border-color: #334155;
}
body{background:var(--app-body-bg);color:var(--app-text);}
.sidebar{background:var(--app-sidebar-bg);}
.card,.table,.modal-content{background:var(--app-card-bg);color:var(--app-text);}
.table{color:var(--app-text);}
.table-light{--bs-table-bg:#1f2937;--bs-table-color:var(--app-text);}
a{color:var(--app-primary);}
.btn-primary{background-color:var(--app-primary);border-color:var(--app-primary);}
.form-control,.form-select,textarea{background:#0b1220;color:var(--app-text);border-color:#334155;}

/* Map common utility classes to dark tokens */
html[data-bs-theme="dark"] .bg-light,
html[data-bs-theme="dark"] .bg-body{ background-color: var(--bs-body-bg) !important; }
html[data-bs-theme="dark"] .bg-white,
html[data-bs-theme="dark"] .bg-body-tertiary{ background-color: var(--bs-tertiary-bg) !important; }
html[data-bs-theme="dark"] .text-dark{ color: var(--bs-body-color) !important; }

/* Aqua-style buttons (macOS Aqua-inspired), tuned for dark */
html[data-bs-theme="dark"] .btn{
  border-radius: 999px !important;
  position: relative;
  overflow: hidden;
  box-shadow:
    0 1px 0 rgba(255,255,255,.18) inset,
    0 10px 18px rgba(0,0,0,.45);
  transition: transform .05s ease, box-shadow .15s ease, filter .15s ease;
}
html[data-bs-theme="dark"] .btn::before{
  content:"";
  position:absolute;
  left:0; right:0; top:0;
  height:56%;
  background: linear-gradient(to bottom, rgba(255,255,255,.22), rgba(255,255,255,0));
  pointer-events:none;
}
html[data-bs-theme="dark"] .btn::after{
  content:"";
  position:absolute;
  left:-20%; top:-70%;
  width:140%; height:160%;
  background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.18), rgba(255,255,255,0) 60%);
  transform: rotate(-8deg);
  pointer-events:none;
}
html[data-bs-theme="dark"] .btn-primary{
  background-color: var(--app-primary);
  background-image: linear-gradient(to bottom,
    color-mix(in srgb, var(--app-primary) 65%, #fff),
    color-mix(in srgb, var(--app-primary) 95%, #000));
  border-color: color-mix(in srgb, var(--app-primary) 70%, #000);
  color: #001018;
}
html[data-bs-theme="dark"] .btn-outline-primary{
  background: color-mix(in srgb, var(--app-primary) 14%, transparent);
  border-color: color-mix(in srgb, var(--app-primary) 60%, #000);
  color: var(--app-primary);
}
html[data-bs-theme="dark"] .btn-outline-primary:hover{
  color:#001018;
  background-color: var(--app-primary);
  background-image: linear-gradient(to bottom,
    color-mix(in srgb, var(--app-primary) 65%, #fff),
    color-mix(in srgb, var(--app-primary) 95%, #000));
  border-color: color-mix(in srgb, var(--app-primary) 70%, #000);
}
html[data-bs-theme="dark"] .btn:active{
  transform: translateY(1px);
  box-shadow:
    0 1px 0 rgba(255,255,255,.10) inset,
    0 6px 10px rgba(0,0,0,.55);
}
html[data-bs-theme="dark"] .btn:focus-visible{
  outline:none;
  box-shadow:
    0 0 0 .2rem color-mix(in srgb, var(--app-primary) 45%, transparent),
    0 1px 0 rgba(255,255,255,.18) inset,
    0 10px 18px rgba(0,0,0,.45);
}