/* Notify 2.5.3 — compact, optimized hero and accessible colorful accents. Loaded LAST. */
/* Exactly one CSS background image is requested for the selected theme. */
html[data-notify-theme] main.container > .notify-hero {
  height:clamp(175px,17.2vw,230px)!important;
  min-height:0!important;
  margin-top:7px!important;
  overflow:hidden!important;
  padding:0!important;
  isolation:isolate;
  border-radius:19px!important;
  box-shadow:0 13px 34px rgba(11,28,66,.17)!important;
}
html[data-notify-theme] .notify-hero-art {
  display:block;position:absolute;inset:0;
  background-size:cover;
  background-position: left 32%;
  background-repeat:no-repeat;
  pointer-events:none;
}
html[data-notify-theme="dark"] .notify-hero-art {
  background-image:url('/notify-hero-dark-1600.webp?v=2.5.3');
}
html[data-notify-theme="light"] .notify-hero-art {
  background-image:url('/notify-hero-light-1600.webp?v=2.5.3');
}
/* Higher density banners retain sharp lettering; lower density & mobile save bandwidth. */
@media(min-resolution:1.5dppx) and (min-width:721px){
 html[data-notify-theme="dark"] .notify-hero-art {background-image:url('/notify-hero-dark.webp?v=2.5.3');}
 html[data-notify-theme="light"] .notify-hero-art {background-image:url('/notify-hero-light.webp?v=2.5.3');}
}
@media(max-width:720px){
 html[data-notify-theme] main.container > .notify-hero {height:156px!important;border-radius:16px!important;margin-top:0!important;}
 html[data-notify-theme] .notify-hero-art {background-position:3% center;}
 html[data-notify-theme="dark"] .notify-hero-art {background-image:url('/notify-hero-dark-960.webp?v=2.5.3');}
 html[data-notify-theme="light"] .notify-hero-art {background-image:url('/notify-hero-light-960.webp?v=2.5.3');}
}
@media(max-width:450px){
 html[data-notify-theme] main.container > .notify-hero {height:144px!important;}
}
/* Palette: deliberately stronger/darker ink for legibility than the image gradients. */
html[data-notify-theme="dark"] {
 --notify-ink1:#8deaff;--notify-ink2:#b9b4ff;--notify-ink3:#f5b1ff;
 --notify-link:#a7dfff;
}
html[data-notify-theme="light"] {
 --notify-ink1:#184da7;--notify-ink2:#5933ae;--notify-ink3:#087386;
 --notify-link:#254db1;
}
/* Brand & structural headings get vivid colors; paragraphs remain high contrast. */
html[data-notify-theme] :is(.brand b,.panelhead h2,.panelhead h3,.login-card h1,.heading h1,.device-detail-hero h1,.device-manager-header h1) {
  color:var(--notify-ink1)!important;
  background-image:linear-gradient(105deg,var(--notify-ink1),var(--notify-ink2) 54%,var(--notify-ink3));
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
html[data-notify-theme] .stat strong,html[data-notify-theme] .device-mini-stats strong {
  color:var(--notify-ink1)!important;
  background:linear-gradient(110deg,var(--notify-ink1),var(--notify-ink2));
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
html[data-notify-theme] :is(.panelhead h2,.panelhead h3) {letter-spacing:-.025em;}
html[data-notify-theme] :is(.text-link,.device-detail-top a,.device-overview-footer a,.pager-link) {
  color:var(--notify-link)!important;
}
html[data-notify-theme] .fleet-table thead th,
html[data-notify-theme] .activity-detail dt,
html[data-notify-theme] .device-detail-grid .detail-field span {
  color:var(--notify-link)!important;
}
html[data-notify-theme="dark"] .panelhead .muted,html[data-notify-theme="dark"] .heading .muted {
  color:#d1e0f6!important;
}
html[data-notify-theme="light"] .panelhead .muted,html[data-notify-theme="light"] .heading .muted {
  color:#445775!important;
}
/* Subtle colorful card rails – distinct without overriding status colors. */
html[data-notify-theme] .stat {position:relative;overflow:hidden;}
html[data-notify-theme] .stat::before {
 content:"";position:absolute;left:17px;right:17px;top:0;height:3px;border-radius:0 0 7px 7px;
 background:linear-gradient(90deg,#3fdcf0,#728cff,#bb6bff);opacity:.9;pointer-events:none;
}
html[data-notify-theme] .stat:nth-child(2)::before {background:linear-gradient(90deg,#2eced9,#69a8ff,#8e6cf3);}
html[data-notify-theme] .stat:nth-child(3)::before {background:linear-gradient(90deg,#8f79ef,#da75cc,#57cbd8);}
/* Keep rich gradient buttons accessible and body text fully opaque. */
html[data-notify-theme] :is(.panel p,.notice-content p,.fleet-table tbody td,.device-text small,.activity-meta, label) {
  -webkit-text-fill-color:initial;
}
html[data-notify-theme] .notify-hero-meta {margin-bottom:12px;padding-top:7px;}
@media(prefers-reduced-motion:reduce){
 html[data-notify-theme] .notify-hero-art {animation:none!important;transition:none!important;}
}

/* Notify v2.5.2 — light-theme Registered iPhones hero contrast fix.
   The hero has a dark purple/blue gradient in BOTH themes. In the light theme,
   generic gradient heading ink and dark supporting copy were difficult to read.
   Keep the desktop and dark-theme visuals unchanged. */
html[data-notify-theme="light"] main.container.device-management > .heading h1 {
  background: none !important;
  background-image: none !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-shadow: 0 2px 12px rgba(11, 16, 70, 0.38);
}
html[data-notify-theme="light"] main.container.device-management > .heading .muted {
  color: #f0f6ff !important;
  -webkit-text-fill-color: #f0f6ff !important;
  text-shadow: 0 1px 5px rgba(14, 21, 73, 0.28);
}
html[data-notify-theme="light"] main.container.device-management > .heading .eyebrow {
  color: #dff5ff !important;
  -webkit-text-fill-color: #dff5ff !important;
}