/* style.css v1.1 - 2026-11-08 - push settings.
   style.css v1.0 - 2026-11-07 - RSH RMM mobile. Portal blue, large touch targets, safe areas. */
:root{--blue:#414fb0;--blue-d:#323d8c;--ink:#1f2433;--muted:#6b7080;--line:#e3e5ef;--bg:#f4f5fb;--card:#fff;--ok:#1f9d55;--warn:#c47f00;--bad:#c62f3a;
 font-family:"Segoe UI",system-ui,-apple-system,Roboto,sans-serif;color:var(--ink);-webkit-text-size-adjust:100%}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--ink:#e8eaf3;--muted:#9aa0b4;--line:#2c3142;--bg:#12151f;--card:#1b1f2c}}:root[data-theme=dark]{--ink:#e8eaf3;--muted:#9aa0b4;--line:#2c3142;--bg:#12151f;--card:#1b1f2c}
*{box-sizing:border-box}[hidden]{display:none!important}
body{margin:0;background:var(--bg);padding-bottom:calc(64px + env(safe-area-inset-bottom))}
body.noscroll{overflow:hidden}
.top{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:10px;padding:calc(10px + env(safe-area-inset-top)) 16px 10px;background:var(--blue);color:#fff}
.logo{width:30px;height:30px;border-radius:7px;background:#fff;object-fit:contain}
.title{flex:1;display:flex;flex-direction:column;line-height:1.15}.title span{font-size:12px;opacity:.85}
.icon{background:none;border:0;color:#fff;font-size:22px;width:44px;height:44px}
main{padding:12px 12px 24px}
.card{background:var(--card);border-radius:14px;padding:18px;border:1px solid var(--line)}
.msg h2{margin:0 0 8px;font-size:20px}.msg p{line-height:1.45}
.msg label{display:flex;flex-direction:column;gap:6px;margin:12px 0;font-weight:600}
input{font:inherit;font-size:16px;padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--ink);width:100%}
button,.button{font:inherit;font-size:16px;min-height:46px;padding:10px 16px;border-radius:10px;border:1px solid var(--line);background:var(--card);color:var(--ink);display:inline-flex;align-items:center;justify-content:center;text-decoration:none;cursor:pointer}
.primary{background:var(--blue);border-color:var(--blue);color:#fff;font-weight:600}.primary:disabled{opacity:.55}
.ghost{background:none}
.muted{color:var(--muted)}.small{font-size:13px}.center{text-align:center;padding:24px}.bad{color:var(--bad)}
.search{position:sticky;top:calc(56px + env(safe-area-inset-top));z-index:4;background:var(--bg);padding:2px 0 8px}
.chips{display:flex;gap:8px;overflow-x:auto;padding-bottom:6px}
.chip{min-height:36px;padding:6px 14px;border-radius:999px;font-size:14px;white-space:nowrap}.chip.on{background:var(--blue);color:#fff;border-color:var(--blue)}
.group{display:flex;justify-content:space-between;margin:18px 4px 6px;font-size:13px;color:var(--muted);font-weight:600}
.row{width:100%;display:flex;align-items:center;gap:12px;text-align:left;margin:0 0 6px;padding:12px 14px;border-radius:12px;background:var(--card)}
.row .main{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.row strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.row small{font-size:13px;color:var(--muted);overflow:hidden;text-overflow:ellipsis}
.dot{width:10px;height:10px;border-radius:50%;background:#a3a8b8;flex:none;display:inline-block}.dot.on{background:var(--ok)}
.count{background:var(--bad);color:#fff;border-radius:999px;min-width:26px;height:26px;padding:0 8px;display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:13px}
.meter{font-size:13px;color:var(--muted)}
.incident{align-items:flex-start;border-left:5px solid var(--muted)}.incident.critical{border-left-color:var(--bad)}.incident.warning{border-left-color:var(--warn)}
.sev{font-size:12px;font-weight:700;text-transform:none;color:var(--muted);flex:none;width:76px}.critical .sev,.sev.critical{color:var(--bad)}.warning .sev,.sev.warning{color:var(--warn)}
.tabs{position:fixed;bottom:0;left:0;right:0;z-index:6;display:flex;background:var(--card);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom)}
.tabs button{flex:1;border:0;border-radius:0;min-height:58px;background:none;color:var(--muted);font-weight:600;gap:6px}.tabs button.on{color:var(--blue);box-shadow:inset 0 3px 0 var(--blue)}
.badge{background:var(--warn);color:#fff;border-radius:999px;padding:1px 7px;font-size:12px}.badge.crit{background:var(--bad)}
.sheet{position:fixed;inset:0;z-index:10;background:rgba(10,12,20,.45);display:flex;align-items:flex-end}
.sheet-body{position:relative;background:var(--bg);width:100%;max-height:88vh;overflow:auto;border-radius:18px 18px 0 0;padding:20px 16px calc(24px + env(safe-area-inset-bottom))}
.sheet h2{margin:0 36px 6px 0;font-size:20px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}.sheet h3{margin:20px 0 8px;font-size:15px}
.close{position:absolute;top:10px;right:10px;width:44px;height:44px;min-height:0;padding:0;border:0;background:none;font-size:20px}
dl{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;margin:14px 0;background:var(--card);padding:14px;border-radius:12px}dt{color:var(--muted)}dd{margin:0;overflow-wrap:anywhere}
.bar{margin:10px 0}.bar-head{display:flex;justify-content:space-between;font-size:14px;margin-bottom:4px}.bar-head span:last-child{color:var(--muted)}
.track{height:8px;background:var(--line);border-radius:4px;overflow:hidden}.track i{display:block;height:100%;width:0;background:var(--ok);transition:width .3s}.track i.mid{background:var(--warn)}.track i.hi{background:var(--bad)}
.plain{list-style:none;padding:0;margin:0}.plain li{display:flex;align-items:center;gap:8px;padding:6px 0}
.actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:14px 0}.actions p{grid-column:1/-1}
.toast{position:fixed;left:16px;right:16px;bottom:calc(76px + env(safe-area-inset-bottom));z-index:20;background:var(--ink);color:var(--bg);padding:12px 16px;border-radius:12px;text-align:center}.toast.bad{background:var(--bad);color:#fff}
@media (prefers-reduced-motion:reduce){.track i{transition:none}}
.foot a{color:var(--blue)}.link{min-height:0;padding:4px;border:0;font-size:13px;color:var(--blue)}
/* v1.1 - 2026-11-08 - 0.62.05: push settings. */
#push:not(.on){opacity:.6}
.sheet .field{display:flex;flex-direction:column;gap:6px;margin:14px 0;font-weight:600}
select{font:inherit;font-size:16px;padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--ink)}
.check{display:flex;align-items:center;gap:10px;margin:10px 0;min-height:44px}.check input{width:22px;height:22px;flex:none}
.stack{display:grid;gap:8px;margin:16px 0 8px}.sheet-body button:not(.close):not(.row){width:100%}
/* 0.62.13: offline expected. */
.dot.expected{background:#a4acb6}
/* 0.62.15: everything fits the width of the phone, no sideways scrolling. The four filters share the width;
   long names and buttons wrap or are cut off with an ellipsis instead of widening the page. */
#screen{overflow-x:clip;max-width:100%}
.chips{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr));gap:6px;overflow:visible}
.chip{padding:6px 4px;font-size:13.5px;overflow:hidden;text-overflow:ellipsis;text-align:center}
.row small{overflow-wrap:anywhere}
.actions{grid-template-columns:repeat(2,minmax(0,1fr))}.actions button{white-space:normal;overflow-wrap:anywhere}
.sheet-body{overflow-x:hidden}.sheet p{overflow-wrap:anywhere}

@media(max-width:350px){.chip{font-size:12.5px;padding:6px 2px}.chips{gap:4px}}
.count.handled{background:#5d6470}
/* 0.62.18: tighter layout; notifications stacked so a large font does not push text over each other. */
main{padding:10px 10px 20px}
.row{padding:10px 12px;margin:0 0 5px;gap:10px;border-radius:10px}
.group{margin:14px 4px 5px}
.sheet-body{padding:16px 14px calc(20px + env(safe-area-inset-bottom))}
dl{grid-template-columns:minmax(0,max-content) minmax(0,1fr);gap:4px 12px;padding:12px;margin:10px 0}
@media(max-width:380px){dl{grid-template-columns:1fr}dt{margin-top:6px;font-size:13px}dd{font-weight:500}}
.bar{margin:8px 0}
h3{margin:16px 0 6px}
h3.with-action{display:flex;align-items:center;justify-content:space-between;gap:10px}
.sheet-body h3.with-action button.small{width:auto;min-height:32px;padding:4px 12px;font-size:13px}
.inc-list{display:grid;gap:6px}
.inc{display:grid;grid-template-columns:minmax(0,1fr);justify-items:stretch;gap:4px;width:100%;text-align:left;padding:10px 12px;border-radius:10px;background:var(--card);border:1px solid var(--line);border-left:4px solid var(--muted)}
.inc.critical{border-left-color:var(--bad)}.inc.warning{border-left-color:var(--warn)}
.inc-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-size:13px}
.inc-head .sev{width:auto}
.inc-text{font-size:14.5px;line-height:1.35;overflow-wrap:anywhere;color:var(--ink)}
.sev.critical{color:var(--bad)}.sev.warning{color:var(--warn)}.sev.unknown,.sev.low{color:var(--muted)}
/* 0.62.19: settings sheet and the choice of appearance. */
.row.setting{text-decoration:none;color:var(--ink)}.row.setting .chev{color:var(--muted);font-size:20px}
.row.setting.disabled{opacity:.6}.row.setting.danger strong{color:var(--bad)}
.segmented{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;padding:4px;border-radius:12px;background:var(--card);border:1px solid var(--line)}
.sheet-body .segmented button{width:auto;min-height:40px;border:0;border-radius:9px;background:transparent;color:var(--ink);font-weight:600}
.sheet-body .segmented button.on{background:var(--blue);color:#fff}
:root[data-theme=dark]{color-scheme:dark}:root[data-theme=light]{color-scheme:light}
