/*
 * Notify v2.1 — Midnight AI / Premium Enterprise visual theme
 * Color-only skin on top of style.css. Existing layout, live AJAX,
 * APNs, device filters and transparent bell assets are unchanged.
 */
:root {
  color-scheme: dark;
  --n-bg: #0a1020;
  --n-panel: #151e31;
  --n-panel-top: #1a253b;
  --n-input: #10192a;
  --n-border: #304059;
  --n-border-soft: #263650;
  --n-ink: #f3f6ff;
  --n-secondary: #c3d0e4;
  --n-muted: #a4b5d0;
  --n-accent: #a69aff;
  --n-link: #aeb8ff;
  --n-indigo: #6354e9;
  --n-cyan: #77dfed;
  --n-green: #78e0b4;
  --n-warn: #ffd084;
  --n-danger: #ff94aa;
  font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  background: var(--n-bg);
  color: var(--n-ink);
}
html { min-height:100%; background:var(--n-bg); }
body {
  min-height:100vh;
  color:var(--n-ink);
  background:
    radial-gradient(ellipse 780px 490px at 11% -9%,rgba(99,84,233,.14),transparent 75%),
    radial-gradient(ellipse 760px 430px at 100% 8%,rgba(48,147,205,.09),transparent 72%),
    linear-gradient(180deg,#0d1425 0%,#0a1020 520px,#0a1020 100%);
}
a {color:var(--n-link)}
a:hover {color:#d7ddff}
h1,h2,h3,.heading h1,.panelhead h2 {color:var(--n-ink)}
.heading h1 {letter-spacing:-.75px;font-weight:780}
.muted,.panel p.muted,.panelhead .muted,.heading .muted {color:var(--n-secondary)}
.eyebrow {color:#aaa4ff}
.empty {color:var(--n-muted)}
.separator {background:var(--n-border-soft)}
/* Fixed glass-like navigation; no modification to PNG or favicon. */
.topbar {
  background:linear-gradient(103deg,rgba(16,23,43,.98),rgba(28,31,62,.96) 66%,rgba(16,37,59,.98));
  border-bottom:1px solid #35415c;
  box-shadow:0 8px 28px rgba(0,0,0,.22);
  -webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);
}
.brand b {color:#fff}
.brand small,.brand .brand-subtitle {color:#bdcafa}
.brand .brand-subtitle span {color:#e7edff}
.brand-icon,.login-brand-icon {
  object-fit:contain!important;background:transparent!important;
  border:0!important;box-shadow:none!important;
  border-radius:0!important;filter:none!important;
}
.top-right .signed,.signed {color:#d1daec}
.top-right .online,.online {
  background:rgba(42,160,124,.13);border:1px solid rgba(81,209,159,.32);color:#a3f5cf;
}
.online i {background:#66ddb0}
.top-right .ghost,.header-back,.portal-back {
  background:rgba(255,255,255,.045);border:1px solid #465476;color:#e7edff;
}
.top-right .ghost:hover,.header-back:hover,.portal-back:hover {background:rgba(165,151,255,.13);color:#fff}
.container {color:var(--n-ink)}
.version {background:#292c51;color:#d6d4ff}
/* Readable layered cards, not excessively glassy. */
.panel,.stat {
  background:linear-gradient(158deg,var(--n-panel-top) 0%,var(--n-panel) 75%);
  color:var(--n-ink);
  border:1px solid var(--n-border);
  box-shadow:0 15px 34px rgba(0,0,0,.18),inset 0 1px rgba(255,255,255,.025);
  border-radius:18px;
}
.stat {border-top:1px solid #3b476c;position:relative;overflow:hidden}
.stat::before {content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#7f72ff,#a6a1ff,transparent 95%)}
.stat:nth-child(2)::before{background:linear-gradient(90deg,#3bb8a8,#76e3c5,transparent 95%)}
.stat:nth-child(3)::before{background:linear-gradient(90deg,#6ab8ee,#af9eff,transparent 95%)}
.stat span,.stat small {color:var(--n-secondary)}
.stat strong {color:#fff;letter-spacing:-1px}
.panelhead h2 {color:#f8faff}
.panelhead .muted {color:var(--n-secondary)}
/* Controls: minimum 44px targets, clear borders and focus states. */
label,.panel label,.severity-picker legend {color:#dce6fa}
input,select,textarea,.device-search,
.panel input,.panel select,.panel textarea,.devices-filter-bar input,.devices-filter-bar select {
  background:var(--n-input);border:1px solid #455773;color:var(--n-ink);
  border-radius:11px;box-shadow:inset 0 1px 2px rgba(0,0,0,.11);
  outline:none;
}
input::placeholder,textarea::placeholder {color:#91a5c2;opacity:1}
input:focus,textarea:focus,select:focus,.device-search:focus {
  border-color:#a79aff;box-shadow:0 0 0 3px rgba(140,124,250,.21);outline:none;
}
select option {background:#182138;color:#f3f6ff}
button,.primary,.secondary,.ghost,.danger-outline {
  transition:background .16s,color .16s,border-color .16s,box-shadow .16s,transform .16s;
}
button:focus-visible,a:focus-visible,summary:focus-visible,
.severity-choice input:focus-visible+.severity-choice-content {
  outline:3px solid #b4a9ff;outline-offset:3px;
}
button.primary,.primary,.panel button.primary,.pager-link-primary {
  background:linear-gradient(125deg,#6054df 0%,#735dea 58%,#596fe8 100%);
  border-color:#8477f8;color:#fff;
  box-shadow:0 7px 20px rgba(82,71,212,.24);
}
button.primary:hover,.primary:hover,.pager-link-primary:hover {
  background:linear-gradient(125deg,#766af1 0%,#806bf5 58%,#637bef 100%);
  color:#fff;filter:none;
}
button.secondary,.secondary,.resend-all-form .secondary {
  background:#2b2750!important;color:#e2dcff!important;
  border:1px solid #554e94!important;box-shadow:none;
}
button.secondary:hover,.secondary:hover,.resend-all-form .secondary:hover {
  background:#393365!important;color:#fff!important;filter:none;
}
button.ghost,.ghost {
  background:#1a263b;border:1px solid #4b5a76;color:#e3edfc;
}
button.ghost:hover,.ghost:hover{background:#26344f;filter:none}
button.danger-outline,.danger-outline {
  background:rgba(134,37,68,.15);color:#ffadc1;border:1px solid #83455d;
}
button.danger-outline:hover,.danger-outline:hover {background:rgba(173,58,92,.25);color:#ffe0e8;filter:none}
.text-link,.devices-manage-link,.device-overview-footer a,
.detail-back,.fleet-view-link,.pager a,.pager-link {color:#bdc6ff}
.text-link:hover,.detail-back:hover{color:#ececff}
/* Categorization: calm blue, amber and rose, high contrast on dark surfaces. */
.severity,.severity.info,.severity.warning,.severity.critical{border-radius:9px}
.severity.info {color:#a8d7ff;background:#173450;border:1px solid #386a93}
.severity.warning {color:#ffda93;background:#47351a;border:1px solid #896839}
.severity.critical {color:#ffb0c0;background:#481e32;border:1px solid #97475f}
.status,.fleet-pill-active {color:#93efcb;background:#173f35;border:1px solid #296758}
.status.resolved,.fleet-pill {color:#c8d5e9;background:#263247;border:1px solid #46536b}
.fleet-pill-pending {color:#ffd89d;background:#49351c;border-color:#8c683c}
.severity-choice-content {
  background:#101a2b;border:1.5px solid #40506c;color:#a9d8ff;
}
.severity-choice-content small {color:#c1cce0}
.severity-choice-warning .severity-choice-content{color:#ffd08e}
.severity-choice-critical .severity-choice-content{color:#ffa4ba}
.severity-choice input:checked+.severity-choice-content {
  background:#1a2c4b;border-color:#6dabe9;box-shadow:0 0 0 2px rgba(105,174,250,.2);
}
.severity-choice-warning input:checked+.severity-choice-content {
  background:#35291b;border-color:#e1b15d;box-shadow:0 0 0 2px rgba(218,164,76,.16);
}
.severity-choice-critical input:checked+.severity-choice-content {
  background:#3b2032;border-color:#dc758e;box-shadow:0 0 0 2px rgba(216,109,140,.18);
}
.severity-choice:hover .severity-choice-content{border-color:#8b8fd8}
/* Notification and audit lists. */
.notice-row,.device,.audit,.activity-item,.device-overview-item {
  border-color:var(--n-border-soft);
}
.notice-title strong,.notice-content p,.device-text b,.audit b,.activity-title,
.device-overview-main strong,.fleet-device-copy strong {color:#edf3ff}
.notice-content p,.notice-content small,.audit small,
.device-text small,.device-overview-main small {color:var(--n-secondary)}
.activity-meta {color:#adbed6}
.activity-item summary:before {color:#ac9ffe}
.activity-detail,.device-editor {
  background:#111b2d;border:1px solid #384863;color:var(--n-ink);
}
.activity-detail dt,.fleet-details-box dt {color:#afbed3}
.activity-detail dd,.fleet-details-box dd {color:#edf3ff}
.empty {color:#adbed4}
.notice.info-msg,.info-msg {color:#c6d6ff;background:#202e50;border:1px solid #51649d}
.notice.error,.error {color:#ffc4cf;background:#482235;border:1px solid #92536a}
.errors-disclosure,.errors-disclosure summary {border-color:var(--n-border);color:#c5d6f4}
/* Compact 300+ device fleet interface. */
.device-manager-count {
  background:#19253a;border-top:1px solid var(--n-border);border-bottom:1px solid var(--n-border);
  color:#d2dff3;
}
.device-manager-count span {color:#b2c3dc}
.device-mini-stats span {
  background:#19243a;border:1px solid #3a4963;color:#cad9ee;
}
.device-mini-stats strong {color:#fff}
.devices-filter-bar label {color:#d6e1f1}
.fleet-table th {background:#1b2a40;color:#d1def1;border-bottom:1px solid #41516d}
.fleet-table td {border-bottom:1px solid #2c3b54;color:#e1ebf9}
.fleet-table tbody tr:hover {background:rgba(129,120,230,.085)}
.fleet-device-copy>span,.fleet-device-copy .device-id,.fleet-contact span,
.fleet-date,.fleet-push,.devices-pagination-label {color:#b2c4dc}
.fleet-contact strong {color:#edf2ff}
.fleet-push-ready {color:#89ebc4}
.fleet-push-missing {color:#ffcc8a}
.fleet-details summary,.fleet-view-link,.devices-manage-link,.pager-link,.pager a {
  background:#26254a;border:1px solid #504d85;color:#d5d3ff;text-decoration:none;
}
.fleet-details summary:hover,.fleet-view-link:hover,.devices-manage-link:hover,.pager-link:hover,.pager a:hover {
  background:#35315f;color:#fff;
}
.fleet-details-box {
  background:#1b2740;border:1px solid #4a5a77;
  box-shadow:0 18px 45px rgba(0,0,0,.35);
}
.fleet-edit-form,.fleet-revoke-form,.device-detail-hero,.device-detail-actions,
.device-overview-list,.devices-pagination,.device-detail-actions-grid {border-color:var(--n-border-soft)}
.device-mark,.device-icon {
  background:linear-gradient(155deg,#25365b,#25254c);
  color:#b1c8ff;border:1px solid #455581;
}
.push-dot-ready {background:#59ddb0;box-shadow:0 0 0 3px #1e483c}
.push-dot-missing {background:#e5b36d;box-shadow:0 0 0 3px #433722}
.device-detail-grid{background:#34435f;border:1px solid #34435f}
.detail-field {background:#18243a}
.detail-field span {color:#b4c5dd}
.detail-field strong {color:#f4f7ff}
.device-detail-hero h1 {color:#fff}
.device-detail-hero p,.detail-record {color:#b7c8df}
.device-detail-revoke {background:#2c1d2d;border:1px solid #654155;color:#f7e4e9}
.device-detail-edit label {color:#d4e0f4}
/* Secondary surfaces / pagination / activity controls. */
.code-card {background:#1c2c4a;border:1px dashed #5a78b2}
.code-card small,.code-card strong,.code-card p {color:#c5d9ff}
.pager-link-primary {color:#fff;background:linear-gradient(130deg,#6455e8,#7475ef);border-color:#9188ff}
.pager-link-primary:hover {color:#fff;background:#7b6af6}
.notify-live-status {background:transparent;color:#a0f3d3;border:0;box-shadow:none}
.notify-live-status[data-state="error"] {background:transparent;color:#ffd29a;border:0;box-shadow:none}
.notify-footer {border-top:1px solid var(--n-border-soft);color:#a7b6d0}
/* Login: same design language, not a separate outdated light page. */
.auth-page {
  background:
    radial-gradient(ellipse 640px 400px at 50% 7%,rgba(106,97,232,.22),transparent 74%),
    radial-gradient(ellipse 400px 330px at 87% 88%,rgba(52,172,222,.09),transparent 75%),
    #0a1020;
}
.login-card {
  background:linear-gradient(155deg,#1c2640 0%,#151d30 74%);
  border:1px solid #465372;box-shadow:0 26px 75px rgba(0,0,0,.38);
}
.login-card h1 {color:#fff}
.login-card .muted {color:#c0cee5}
.login-card .login-byline {color:#bcb8ff}
.login-card .notify-footer {border-color:#3b4963;color:#aebdd4}
.login-card .eyebrow {color:#c4bfff}
/* Maintain the mobile layout and large touch targets. */
@media(max-width:720px) {
  .fleet-table tr {border-bottom:1px solid var(--n-border)}
  .fleet-table td:before {color:#b9c8e0}
  .fleet-table td{color:#edf3ff}
}
@media(prefers-reduced-motion:reduce){
  button,.primary,.secondary,.ghost,.danger-outline {transition:none}
}