/* 1.0.165: palette applies only while the login form is mounted. */

@media screen {
:root:has(#loginForm),
html.dark:has(#loginForm),
.dark:has(#loginForm) {
    color-scheme: dark;
    --ssp-base: #080d17;
    --ssp-panel: #111625;
    --ssp-raised: #171d30;
    --ssp-line: #2b354d;
    --ssp-ink: #eff5ff;
    --ssp-muted: #a4b3c9;
    --ssp-cyan: #00d6ed;
    --glass-bg: #111625;
    --glass-border: #2b354d;
    --glass-shadow: 0 8px 28px rgb(0 0 0 / 22%);
    --bg-color: #080d17;
    --text-color: #eff5ff;
  }
html.dark:has(#loginForm) { --ssp-base: #060b13; --ssp-panel: #0e1421; --glass-bg: #0e1421; --bg-color: #060b13; }
:root:has(#loginForm) body { background: var(--ssp-base) !important; color: var(--ssp-ink) !important; }
:root:has(#loginForm) #app { color: var(--ssp-ink); }
:root:has(#loginForm) #app .min-h-screen { background-color: var(--ssp-base) !important; }
:root:has(#loginForm) :is(div,section,thead,tr,td)[class*="bg-[#"] { background-color: var(--ssp-panel) !important; }
:root:has(#loginForm) :is(div,span,td,th,p,h1,h2,h3)[class*="text-[#0"] { color: var(--ssp-ink) !important; }
:root:has(#loginForm) #loginForm button[type="submit"] {
    background-image: linear-gradient(105deg,#2959ec,#00c9e7) !important;
    color: #fff !important;
    box-shadow: 0 0 20px rgb(0 201 231 / 18%) !important;
  }
:root:has(#loginForm) .glass-panel { background: var(--glass-bg) !important; border-color: var(--ssp-line) !important; }
:root:has(#loginForm) :is(.bg-white,.bg-slate-50,.bg-gray-50,.bg-zinc-50,.bg-slate-100,.bg-gray-100,.bg-slate-900,.bg-slate-950) {
    background-color: var(--ssp-panel) !important;
  }
:root:has(#loginForm) :is(.bg-slate-200,.bg-gray-200,.bg-slate-800,.bg-gray-800) { background-color: var(--ssp-raised) !important; }
:root:has(#loginForm) :is([class~="bg-white/50"],[class~="bg-white/80"],[class~="bg-slate-50/50"],[class~="bg-slate-100/50"],[class~="dark:bg-slate-900/50"]) { background-color: var(--ssp-panel) !important; }
:root:has(#loginForm) :is(.text-black,.text-slate-950,.text-slate-900,.text-slate-800,.text-slate-700,.text-gray-900,.text-gray-800,.text-gray-700) { color: var(--ssp-ink) !important; }
:root:has(#loginForm) :is(.text-slate-600,.text-slate-500,.text-slate-400,.text-gray-600,.text-gray-500,.text-gray-400) { color: var(--ssp-muted) !important; }
:root:has(#loginForm) :is(.border-slate-100,.border-slate-200,.border-slate-300,.border-slate-700,.border-slate-800,.border-gray-200,.border-gray-300) { border-color: var(--ssp-line) !important; }
:root:has(#loginForm) :is(.divide-slate-100,.divide-slate-200,.divide-gray-200) > :not([hidden]) ~ :not([hidden]) { border-color: var(--ssp-line) !important; }
:root:has(#loginForm) :is(.text-blue-600,.text-blue-500,.text-cyan-600,.text-cyan-700,.text-indigo-600,.text-indigo-700,.text-sky-600) { color: var(--ssp-cyan) !important; }
:root:has(#loginForm) :is(.bg-blue-50,.bg-blue-100,.bg-cyan-50,.bg-cyan-100,.bg-sky-50,.bg-indigo-50,.bg-indigo-100) { background-color: #102936 !important; }
:root:has(#loginForm) :is(.border-blue-200,.border-cyan-200,.border-indigo-200,.border-sky-200) { border-color: #195569 !important; }
:root:has(#loginForm) :is(button,a)[class*="bg-blue-6"],
:root:has(#loginForm) :is(button,a)[class*="bg-indigo-6"] {
    background-color: #3157ed !important;
    background-image: linear-gradient(115deg,#245dec,#5136d2) !important;
    color: #fff !important;
  }
:root:has(#loginForm) :is(button,a)[class*="bg-blue-6"]:hover,
:root:has(#loginForm) :is(button,a)[class*="bg-indigo-6"]:hover { background-image: linear-gradient(115deg,#3475ff,#6651e6) !important; }
:root:has(#loginForm) :is(.bg-emerald-50,.bg-green-50,.bg-teal-50,.bg-emerald-100,.bg-green-100) { background-color: #0d302c !important; }
:root:has(#loginForm) :is(.text-emerald-600,.text-emerald-700,.text-green-600,.text-green-700,.text-teal-700) { color: #3be3b0 !important; }
:root:has(#loginForm) :is(.bg-amber-50,.bg-amber-100,.bg-yellow-50,.bg-yellow-100) { background-color: #352b17 !important; }
:root:has(#loginForm) :is(.text-amber-600,.text-amber-700,.text-amber-800,.text-yellow-600) { color: #ffcf61 !important; }
:root:has(#loginForm) :is(.bg-red-50,.bg-red-100,.bg-rose-50,.bg-rose-100) { background-color: #351d2a !important; }
:root:has(#loginForm) :is(.text-red-600,.text-red-700,.text-rose-600,.text-rose-700) { color: #ff8c9c !important; }
:root:has(#loginForm) input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
:root:has(#loginForm) select,
:root:has(#loginForm) textarea {
    background-color: #0b111e !important; color: var(--ssp-ink) !important; border-color: var(--ssp-line) !important;
  }
:root:has(#loginForm) input::placeholder,
:root:has(#loginForm) textarea::placeholder { color: #92a2ba !important; opacity: 1; }
:root:has(#loginForm) option { background-color: #111625; color: #eff5ff; }
:root:has(#loginForm) input:autofill { box-shadow: 0 0 0 1000px #0b111e inset !important; -webkit-text-fill-color: #eff5ff !important; }
:root:has(#loginForm) :is(button,a,input,select,textarea):focus-visible { outline-color: #00d6ed !important; }
:root:has(#loginForm) :is(input[type="checkbox"],input[type="radio"]) { accent-color: #00c8e6; }
:root:has(#loginForm) :is(button,input,select,textarea):disabled { color: #8390a7 !important; }
:root:has(#loginForm) :is([class~="hover:bg-slate-50"],[class~="hover:bg-slate-100"],[class~="hover:bg-slate-800/50"]):hover { background-color: #1b2840 !important; }
:root:has(#loginForm) .leaflet-popup-content-wrapper,
:root:has(#loginForm) .leaflet-popup-tip { background-color: #111625; color: #eff5ff; }
:root:has(#loginForm) .leaflet-control a { background-color: #111625 !important; color: #eff5ff !important; }
:root:has(#loginForm) ::selection { background-color: #165c80; color: #fff; }
}