/* ATS K.I.S. Enterprise — Web 7.0 r4 unified shell
   One responsive navigation, one device layout, one theme system.
   Generator control logic remains in app.js. */

:root{
  --kis-nav-w:238px;
  --kis-radius:14px;
  --kis-page:#06111e;
  --kis-card:#0b1d31;
  --kis-card-2:#0d233a;
  --kis-text:#eaf4ff;
  --kis-muted:#8ca5bd;
  --kis-border:#1a4668;
  --kis-blue:#1687ff;
  --kis-green:#19d77c;
  --kis-amber:#ffad19;
  --kis-red:#ff4054;
  --kis-shadow:0 12px 34px rgba(0,0,0,.22);
}

*,
*::before,
*::after{box-sizing:border-box}

html,body{max-width:100%;overflow-x:hidden}

body.kis-r4{
  background:var(--kis-page)!important;
  color:var(--kis-text)!important;
}

body.kis-r4.light-theme{
  --kis-page:#edf3f8;
  --kis-card:#ffffff;
  --kis-card-2:#f3f7fb;
  --kis-text:#142238;
  --kis-muted:#60748b;
  --kis-border:#d2deea;
  --kis-shadow:0 10px 28px rgba(35,58,83,.08);
  background:var(--kis-page)!important;
  color:var(--kis-text)!important;
}

body.kis-r4 .app-main,
body.kis-r4 #pageContent,
body.kis-r4 #pageContent>*{
  min-width:0;
  max-width:none!important;
}

body.kis-r4 .app-main{
  width:100%;
  background:var(--kis-page)!important;
  color:var(--kis-text)!important;
}

body.kis-r4 #pageContent{
  width:100%!important;
  margin:0!important;
}

body.kis-r4 .page-top{color:var(--kis-text)!important}

body.kis-r4 .app-header{
  background:rgba(4,17,30,.97)!important;
  border-color:#17405f!important;
  color:#eaf5ff!important;
}

body.kis-r4 .app-header .brand,
body.kis-r4 .app-header strong{color:#eaf5ff!important}

body.kis-r4 .app-header .gold{color:#ffbd2e!important}
body.kis-r4 .app-header .muted,
body.kis-r4 .app-header .version{color:#86a6c1!important}

body.kis-r4 #breadcrumbs{
  background:#071827!important;
  color:#9fbed6!important;
  border-color:#173d5a!important;
}

body.kis-r4 .app-header .header-main{min-width:0;gap:10px!important}
body.kis-r4 .app-header .brand-wrap,
body.kis-r4 .app-header .system-strip,
body.kis-r4 .app-header .header-actions{min-width:0}

body.kis-r4 .app-header .header-actions{
  display:flex!important;
  align-items:center;
  justify-content:flex-end;
  gap:5px!important;
  flex-wrap:nowrap;
}

body.kis-r4 .app-header .icon-btn{
  flex:0 0 auto;
  width:37px!important;
  height:37px!important;
  border-radius:10px!important;
}

.kis-r4-search{position:relative;min-width:0;width:100%}

.kis-r4-search #globalSearch{
  width:100%!important;
  height:39px;
  margin:0!important;
  padding:0 12px!important;
  border:1px solid #1c4e74!important;
  border-radius:10px!important;
  background:#0a2239!important;
  color:#eef7ff!important;
}

.kis-r4-search #globalSearch::placeholder{color:#7898b5!important}

.kis-r4-search #globalSearchResults{
  position:absolute!important;
  z-index:5200;
  left:0;right:0;top:44px;
  max-height:420px;
  overflow:auto;
}

body.kis-r4 #drawer>.drawer-scroll{display:none!important}

#kisR4Nav{
  display:flex;
  flex-direction:column;
  min-height:0;
  height:calc(100dvh - 74px);
  padding:10px;
  color:#dcebf8;
}

.kis-r4-active-device{
  width:100%;
  display:grid;
  grid-template-columns:34px minmax(0,1fr) 18px;
  gap:9px;
  align-items:center;
  min-height:62px;
  margin-bottom:9px;
  padding:10px;
  text-align:left;
  border:1px solid #1d557c!important;
  border-radius:12px!important;
  background:linear-gradient(145deg,#0d2b48,#071a2c)!important;
  color:#eaf5ff!important;
}

.kis-r4-device-icon{
  width:34px;height:34px;
  display:grid;place-items:center;
  border-radius:9px;
  background:rgba(22,135,255,.14);
  border:1px solid rgba(22,135,255,.30);
  font-size:19px;
}

.kis-r4-device-copy{min-width:0}
.kis-r4-device-copy strong{
  display:block;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
  color:#eaf5ff!important;
  font-size:12px;
}
.kis-r4-device-copy small{
  display:flex;
  align-items:center;
  gap:6px;
  margin-top:3px;
  color:#82a9c6!important;
  font-size:9px;
}

.kis-r4-dot{
  width:7px;height:7px;border-radius:50%;
  background:#19d77c;
  box-shadow:0 0 9px rgba(25,215,124,.7);
}
.kis-r4-dot.muted{background:#6e8498;box-shadow:none}

.kis-r4-devices{
  display:none;
  padding:5px;
  margin:-2px 0 8px;
  border:1px solid #173f5f;
  border-radius:10px;
  background:#061522;
}
.kis-r4-devices.open{display:block}

.kis-r4-device-link{
  width:100%;
  min-height:36px;
  display:flex;
  align-items:center;
  gap:8px;
  margin:2px 0;
  padding:7px 8px;
  text-align:left;
  border:1px solid transparent!important;
  border-radius:8px!important;
  background:#0b2137!important;
  color:#c7d9e8!important;
  font-size:10px;
}
.kis-r4-device-link.active{
  border-color:#19d77c!important;
  background:rgba(16,88,72,.35)!important;
  color:#e9fff4!important;
}

.kis-r4-nav-scroll{
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  scrollbar-width:thin;
  scrollbar-color:#1c4d70 transparent;
}

.kis-r4-nav-group{
  margin:12px 8px 4px;
  color:#6387a7;
  font-size:8px;
  font-weight:900;
  letter-spacing:.1em;
  text-transform:uppercase;
}

.kis-r4-nav-item{
  width:100%;
  min-height:42px;
  display:grid;
  grid-template-columns:28px minmax(0,1fr) auto;
  align-items:center;
  gap:8px;
  margin:2px 0;
  padding:7px 9px;
  text-align:left;
  border:1px solid transparent!important;
  border-radius:9px!important;
  background:transparent!important;
  color:#bed0e3!important;
  box-shadow:none!important;
}

.kis-r4-nav-item.active{
  background:linear-gradient(90deg,#0a62ce,#0c4b9a)!important;
  border-color:#1687ff!important;
  color:#fff!important;
  box-shadow:0 0 20px rgba(22,135,255,.18)!important;
}

.kis-r4-nav-icon{width:28px;text-align:center;font-size:16px}
.kis-r4-nav-copy{min-width:0}
.kis-r4-nav-copy strong{display:block;color:inherit!important;font-size:11px}
.kis-r4-nav-copy small{display:block;margin-top:1px;color:#7394b2!important;font-size:8px}
.kis-r4-nav-item.active small{color:#b7dbff!important}

.kis-r4-badge{
  min-width:19px;height:19px;padding:0 5px;
  display:grid;place-items:center;
  border-radius:999px;
  background:#ec3348;
  color:#fff;
  font-size:9px;
  font-weight:900;
}

.kis-r4-nav-footer{
  margin-top:auto;
  padding:9px 8px 2px;
  border-top:1px solid #173b56;
  color:#62849f;
  font-size:8px;
  line-height:1.45;
}
.kis-r4-nav-footer strong{display:block;color:#79bfff!important;font-size:9px}

body.kis-r4 .card,
body.kis-r4 .dashboard-section-card,
body.kis-r4 .summary-item,
body.kis-r4 .settings-tabs,
body.kis-r4 .schedule-settings-card,
body.kis-r4 .kis-advanced-group{
  background:var(--kis-card)!important;
  color:var(--kis-text)!important;
  border-color:var(--kis-border)!important;
  box-shadow:var(--kis-shadow)!important;
}

body.kis-r4 .muted,
body.kis-r4 small,
body.kis-r4 .indicator-note{color:var(--kis-muted)!important}

body.kis-r4.device-view #deviceQuickNav{
  margin-bottom:9px!important;
  padding:6px!important;
  border:1px solid var(--kis-border)!important;
  border-radius:12px!important;
  background:var(--kis-card)!important;
}

body.kis-r4.device-view #deviceQuickNav .device-tab-button{
  min-height:34px!important;
  padding:7px 10px!important;
  border-radius:8px!important;
  background:transparent!important;
  border-color:transparent!important;
  color:var(--kis-muted)!important;
  font-size:10px!important;
}
body.kis-r4.device-view #deviceQuickNav .device-tab-button.active{
  background:rgba(22,135,255,.13)!important;
  border-color:#1687ff!important;
  color:var(--kis-blue)!important;
}

body.kis-r4.device-view #deviceStatusSection{margin-bottom:9px!important}
body.kis-r4.device-view #deviceStatusSection>.section-heading{display:none!important}

body.kis-r4.device-view #deviceStatusSection .device-hero{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 188px!important;
  gap:9px!important;
}

body.kis-r4.device-view #deviceStatusSection .hero-main{
  min-height:106px!important;
  padding:13px 16px!important;
  border:1px solid var(--kis-border)!important;
  border-radius:13px!important;
  background:var(--kis-card)!important;
  color:var(--kis-text)!important;
}

body.kis-r4.device-view #deviceStatusSection .hero-main>.muted:first-child{display:none}
body.kis-r4.device-view #deviceStatusSection .hero-state{
  font-size:clamp(22px,2vw,30px)!important;
  line-height:1.08!important;
}

body.kis-r4.device-view #deviceStatusSection .hero-meta{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:6px!important;
  margin-top:10px!important;
}

body.kis-r4.device-view #deviceStatusSection .hero-meta .status-badge{
  min-height:27px;
  padding:5px 8px!important;
  border-radius:8px!important;
  border:1px solid var(--kis-border)!important;
  background:var(--kis-card-2)!important;
  color:var(--kis-text)!important;
  font-size:9px!important;
}

body.kis-r4.device-view #readinessCard{
  min-height:106px!important;
  padding:10px!important;
  border:1px solid var(--kis-border)!important;
  border-radius:13px!important;
  background:var(--kis-card)!important;
  color:var(--kis-text)!important;
}

body.kis-r4.device-view #deviceMetricsSection{margin:0 0 9px!important}
body.kis-r4.device-view #deviceMetricsSection>.section-heading{display:none!important}

body.kis-r4.device-view #deviceMetricsSection .device-metrics-grid{
  display:grid!important;
  grid-template-columns:repeat(8,minmax(0,1fr))!important;
  gap:7px!important;
}

body.kis-r4.device-view #deviceMetricsSection .indicator{
  min-width:0;
  min-height:108px!important;
  padding:11px!important;
  border:1px solid var(--kis-border)!important;
  border-radius:12px!important;
  background:var(--kis-card)!important;
  color:var(--kis-text)!important;
  box-shadow:var(--kis-shadow)!important;
  overflow:hidden;
}

body.kis-r4.light-theme.device-view #deviceMetricsSection .indicator.good{background:#f2fbf6!important}
body.kis-r4.light-theme.device-view #deviceMetricsSection .indicator.warn{background:#fff8ea!important}
body.kis-r4.light-theme.device-view #deviceMetricsSection .indicator.bad{background:#fff1f2!important}

body.kis-r4.device-view #deviceMetricsSection .indicator-title{font-size:9px!important}
body.kis-r4.device-view #deviceMetricsSection .indicator-value{
  margin-top:8px!important;
  font-size:clamp(18px,1.6vw,25px)!important;
}
body.kis-r4.device-view #deviceMetricsSection .indicator-note{font-size:8px!important}

body.kis-r4.device-view .device-operations-row{
  display:grid!important;
  grid-template-columns:minmax(0,1.35fr) minmax(310px,.72fr) minmax(220px,.48fr)!important;
  gap:9px!important;
  align-items:start!important;
  margin:0 0 9px!important;
}

body.kis-r4.device-view #deviceMnemoSection,
body.kis-r4.device-view #deviceControlSection{
  min-width:0;
  margin:0!important;
}

body.kis-r4.device-view #deviceMnemoSection .mnemo-card,
body.kis-r4.device-view #deviceControlSection,
.kis-r4-quick-actions{
  min-width:0;
  border:1px solid var(--kis-border)!important;
  border-radius:13px!important;
  background:var(--kis-card)!important;
  color:var(--kis-text)!important;
  box-shadow:var(--kis-shadow)!important;
}

body.kis-r4.device-view #deviceMnemoSection .mnemo-card{padding:11px!important}
body.kis-r4.device-view #deviceMnemoSection .mnemo{
  min-width:0!important;
  overflow:hidden!important;
}

body.kis-r4.light-theme.device-view #deviceMnemoSection .mnemo{
  background:#071827!important;
  color:#eaf5ff!important;
  border-color:#16435f!important;
}

body.kis-r4.light-theme.device-view #deviceMnemoSection .mnemo *{color:inherit}

body.kis-r4.device-view #deviceControlSection{padding:11px!important}
body.kis-r4.device-view #autoModeCard{min-height:70px!important;margin-bottom:8px!important}
body.kis-r4.device-view .kis-r4-hidden-auto-command{display:none!important}

.kis-r4-quick-actions{
  display:block;
  padding:11px;
}

.kis-r4-panel-title{
  margin-bottom:7px;
  color:var(--kis-text);
  font-size:12px;
  font-weight:900;
}

.kis-r4-quick-actions button{
  width:100%;
  min-height:37px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:8px;
  margin:4px 0;
  padding:7px 9px;
  border:1px solid var(--kis-border)!important;
  border-radius:8px!important;
  background:var(--kis-card-2)!important;
  color:var(--kis-text)!important;
  font-size:9px;
}

body.kis-r4 .kis-schedule-focus-page>.notice.warn,
body.kis-r4 .kis-schedule-focus-page>.card:first-of-type{display:none!important}

body.kis-r4 .kis-schedule-focus-page>.settings-tabs{
  display:flex!important;
  width:100%;
  padding:5px!important;
  margin:0 0 9px!important;
}

body.kis-r4 .kis-schedule-focus-page>.settings-tabs .tab-button{display:none!important}
body.kis-r4 .kis-schedule-focus-page>.settings-tabs .tab-button[data-settings-v2="schedule"]{
  display:flex!important;
  flex:1 1 auto;
  justify-content:center;
}
body.kis-r4 .kis-schedule-focus-page>.tab-panel:not(#settings-v2-schedule){display:none!important}
body.kis-r4 .kis-schedule-focus-page #settings-v2-schedule{display:block!important}

body.kis-r4 .mode-schedule-action{margin:9px 0 2px}
body.kis-r4 .mode-schedule-button{
  width:100%;
  min-height:64px;
  display:grid;
  grid-template-columns:38px minmax(0,1fr) 18px;
  gap:9px;
  align-items:center;
  padding:10px 11px;
  text-align:left;
  border:1px solid rgba(22,135,255,.42)!important;
  border-radius:12px!important;
  background:rgba(22,135,255,.09)!important;
  color:var(--kis-text)!important;
}

.kis-r4-modal-overlay{
  position:fixed;
  inset:0;
  z-index:5000;
  display:grid;
  place-items:center;
  padding:18px;
  background:rgba(2,8,16,.68);
  backdrop-filter:blur(7px);
  opacity:0;
  transition:opacity .14s ease;
}
.kis-r4-modal-overlay.open{opacity:1}
.kis-r4-modal-overlay.kis-r4-modal-leave{opacity:0}

.kis-r4-modal{
  width:min(620px,100%);
  max-height:88dvh;
  overflow:auto;
  border:1px solid var(--kis-border);
  border-radius:18px;
  background:var(--kis-card);
  color:var(--kis-text);
  box-shadow:0 30px 90px rgba(0,0,0,.45);
}

.kis-r4-modal-header,
.kis-r4-modal-actions{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:13px 15px;
  border-bottom:1px solid var(--kis-border);
}

.kis-r4-modal-body{padding:15px}
.kis-r4-modal-actions{
  justify-content:flex-end;
  border-top:1px solid var(--kis-border);
  border-bottom:0;
}

.kis-r4-theme-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:9px;
}
.kis-r4-theme-grid button{
  min-height:88px;
  padding:11px;
  text-align:left;
  border:1px solid var(--kis-border)!important;
  border-radius:11px!important;
  background:var(--kis-card-2)!important;
  color:var(--kis-text)!important;
}
.kis-r4-theme-grid button.active{border-color:var(--kis-blue)!important}

body.kis-r4 #pageContent{transition:opacity .10s ease,transform .10s ease}
body.kis-r4 #pageContent.kis-r4-view-leave{opacity:.18;transform:translateY(3px)}
body.kis-r4 #pageContent.kis-r4-view-enter{animation:kisR4Enter .17s ease both}
@keyframes kisR4Enter{
  from{opacity:.2;transform:translateY(4px)}
  to{opacity:1;transform:translateY(0)}
}

@media(min-width:1050px){
  body.kis-r4:not(.wallboard) #drawer{
    display:block!important;
    position:fixed!important;
    z-index:1100!important;
    inset:0 auto 0 0!important;
    width:var(--kis-nav-w)!important;
    transform:none!important;
    background:linear-gradient(180deg,#061728,#04111d)!important;
    border-right:1px solid #16405f!important;
    box-shadow:10px 0 34px rgba(0,0,0,.18)!important;
  }

  body.kis-r4 #drawer #closeDrawerBtn{display:none!important}

  body.kis-r4:not(.wallboard) .app-header,
  body.kis-r4:not(.wallboard) .app-main,
  body.kis-r4:not(.wallboard) .app-footer{
    margin-left:var(--kis-nav-w)!important;
    width:calc(100% - var(--kis-nav-w))!important;
    max-width:none!important;
  }

  body.kis-r4:not(.wallboard) .app-main{padding:11px 14px 24px!important}
  body.kis-r4:not(.wallboard) .app-header .menu-btn{display:none!important}

  body.kis-r4 .app-header .header-main{
    display:grid!important;
    grid-template-columns:minmax(210px,auto) minmax(220px,1fr) auto auto!important;
    align-items:center;
    padding:8px 14px!important;
  }

  body.kis-r4 .app-header .brand{font-size:20px!important}
  body.kis-r4 .app-header .version{font-size:9px!important}
}

@media(max-width:1380px) and (min-width:1050px){
  :root{--kis-nav-w:218px}
  body.kis-r4.device-view #deviceMetricsSection .device-metrics-grid{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
  }
  body.kis-r4.device-view .device-operations-row{
    grid-template-columns:minmax(0,1.15fr) minmax(290px,.85fr)!important;
  }
  body.kis-r4.device-view #kisR4QuickActions{
    grid-column:1 / -1;
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:6px;
  }
  body.kis-r4 .app-header .system-strip{display:none!important}
}

@media(max-width:1049px){
  body.kis-r4 #drawer{
    display:block!important;
    position:fixed!important;
    z-index:1500!important;
    top:0!important;bottom:0!important;left:0!important;
    width:min(320px,88vw)!important;
    transform:translateX(-103%)!important;
    background:linear-gradient(180deg,#061728,#04111d)!important;
    border-right:1px solid #16405f!important;
    transition:transform .18s ease!important;
  }

  body.kis-r4 #drawer.open{transform:translateX(0)!important}
  body.kis-r4 #drawer #closeDrawerBtn{display:grid!important}

  body.kis-r4 .app-header,
  body.kis-r4 .app-main,
  body.kis-r4 .app-footer{
    margin-left:0!important;
    width:100%!important;
    max-width:none!important;
  }

  body.kis-r4 .app-main{padding:9px 9px 98px!important}

  body.kis-r4 .app-header .header-main{
    display:grid!important;
    grid-template-columns:auto minmax(0,1fr) auto!important;
    align-items:center;
    gap:7px!important;
    padding:6px 8px!important;
  }

  body.kis-r4 .app-header .brand{font-size:15px!important}
  body.kis-r4 .app-header .brand-wrap{min-width:0!important}

  body.kis-r4 .app-header .version,
  body.kis-r4 .app-header .system-strip,
  body.kis-r4 #kisR4Search,
  body.kis-r4 .app-header #serverClock,
  body.kis-r4 .app-header #wallboardBtn,
  body.kis-r4 .app-header #refreshBtn{
    display:none!important;
  }

  body.kis-r4 .app-header .header-actions{gap:3px!important}
  body.kis-r4 .app-header .icon-btn{width:34px!important;height:34px!important}

  body.kis-r4 .mobile-bottom-nav{
    display:grid!important;
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
    z-index:1400!important;
  }

  body.kis-r4.device-view #deviceStatusSection .device-hero{grid-template-columns:1fr!important}

  body.kis-r4.device-view #deviceMetricsSection .device-metrics-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px!important;
  }

  body.kis-r4.device-view .device-operations-row{
    grid-template-columns:1fr!important;
    gap:8px!important;
  }

  body.kis-r4.device-view #deviceMnemoSection,
  body.kis-r4.device-view #deviceControlSection,
  body.kis-r4.device-view #kisR4QuickActions{
    grid-column:auto!important;
    width:100%!important;
    max-width:100%!important;
  }

  body.kis-r4.device-view #deviceMnemoSection .mnemo-card{overflow:hidden!important}
  body.kis-r4.device-view #deviceMnemoSection .mnemo{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow-x:auto!important;
  }

  body.kis-r4.device-view #deviceControlSection{overflow:hidden!important}

  body.kis-r4.device-view #deviceQuickNav .device-tabs{
    overflow-x:auto!important;
    flex-wrap:nowrap!important;
    scrollbar-width:none;
  }
  body.kis-r4.device-view #deviceQuickNav .device-tab-button{flex:0 0 auto}
}

@media(max-width:700px){
  body.kis-r4 .page-top h1{font-size:17px!important}

  body.kis-r4.device-view #deviceStatusSection .hero-main{
    min-height:92px!important;
    padding:11px 12px!important;
  }
  body.kis-r4.device-view #deviceStatusSection .hero-state{font-size:21px!important}

  body.kis-r4.device-view #deviceMetricsSection .indicator{
    min-height:100px!important;
    padding:10px!important;
  }

  body.kis-r4.device-view #deviceMetricsSection .indicator-value{font-size:21px!important}

  .kis-r4-modal-overlay{place-items:end center;padding:0}
  .kis-r4-modal{
    width:100%;
    max-height:91dvh;
    border-radius:20px 20px 0 0;
    border-left:0;border-right:0;border-bottom:0;
  }
  .kis-r4-theme-grid{grid-template-columns:1fr}
}

@media(max-width:370px){
  body.kis-r4.device-view #deviceMetricsSection .device-metrics-grid{
    grid-template-columns:1fr!important;
  }
}

@media(prefers-reduced-motion:reduce){
  body.kis-r4 #pageContent,
  body.kis-r4 #drawer,
  .kis-r4-modal-overlay{
    transition:none!important;
    animation:none!important;
  }
}


/* ===== ATS K.I.S. Enterprise — Web 7.0 r4.1 light theme + sidebar polish ===== */

/* -----------------------------------------------------------------
   SIDEBAR
   Keep one internal scroll area if the viewport is short, but never
   show desktop/mobile browser scrollbars or horizontal overflow.
------------------------------------------------------------------ */
body.kis-r4 #drawer{
  overflow:hidden!important;
  overscroll-behavior:contain;
}

body.kis-r4 #drawer,
body.kis-r4 #drawer *,
body.kis-r4 #kisR4Nav,
body.kis-r4 #kisR4Nav *{
  max-width:100%;
}

body.kis-r4 #kisR4Nav{
  overflow:hidden!important;
}

body.kis-r4 .kis-r4-nav-scroll{
  overflow-y:auto!important;
  overflow-x:hidden!important;
  scrollbar-width:none!important;
  -ms-overflow-style:none!important;
}

body.kis-r4 .kis-r4-nav-scroll::-webkit-scrollbar{
  width:0!important;
  height:0!important;
  display:none!important;
}

body.kis-r4 #drawer::-webkit-scrollbar,
body.kis-r4 #kisR4Nav::-webkit-scrollbar{
  width:0!important;
  height:0!important;
  display:none!important;
}

/* The old drawer header stays dark in both themes. */
body.kis-r4 #drawer .drawer-head{
  background:transparent!important;
  border-color:#173d5a!important;
  color:#eaf5ff!important;
}

body.kis-r4 #drawer .drawer-head .brand,
body.kis-r4 #drawer .drawer-head .brand span:not(.gold),
body.kis-r4 #drawer .drawer-head strong{
  color:#eaf5ff!important;
}

body.kis-r4 #drawer .drawer-head .gold{
  color:#20b9ff!important;
}

body.kis-r4 #drawer .drawer-context,
body.kis-r4 #drawer .drawer-head small{
  color:#7f9db7!important;
}

/* Compact menu slightly on shorter desktop screens instead of exposing
   a scrollbar. Internal wheel/touch scrolling still works if required. */
@media (min-width:1050px) and (max-height:820px){
  body.kis-r4 .kis-r4-nav-item{
    min-height:38px;
    padding-top:5px;
    padding-bottom:5px;
  }

  body.kis-r4 .kis-r4-nav-group{
    margin-top:8px;
  }

  body.kis-r4 .kis-r4-active-device{
    min-height:56px;
    margin-bottom:6px;
    padding-top:8px;
    padding-bottom:8px;
  }

  body.kis-r4 .kis-r4-nav-footer{
    padding-top:6px;
  }
}

/* -----------------------------------------------------------------
   LIGHT THEME
   One light workspace. Header/sidebar deliberately remain dark.
------------------------------------------------------------------ */
body.kis-r4.light-theme,
body.kis-r4.kis-theme-light{
  background:#edf3f8!important;
  color:#142238!important;
}

body.kis-r4.light-theme .app-main,
body.kis-r4.light-theme #pageContent,
body.kis-r4.light-theme #pageContent > *,
body.kis-r4.light-theme .page-content,
body.kis-r4.light-theme .device-page,
body.kis-r4.light-theme #tab-overview,
body.kis-r4.light-theme #tab-charts,
body.kis-r4.light-theme #tab-details,
body.kis-r4.light-theme #tab-profile,
body.kis-r4.light-theme #tab-maintenance{
  background:#edf3f8!important;
  color:#142238!important;
}

/* Neutralize large legacy dark wrappers. */
body.kis-r4.light-theme.device-view #tab-overview,
body.kis-r4.light-theme.device-view #tab-overview > *,
body.kis-r4.light-theme.device-view .device-operations-row,
body.kis-r4.light-theme.device-view #deviceMetricsSection,
body.kis-r4.light-theme.device-view #deviceStatusSection{
  background:transparent!important;
}

/* Generic legacy cards/panels that were not covered by the r4 foundation. */
body.kis-r4.light-theme #pageContent :is(
  .card,
  .panel,
  .tile,
  .box,
  .summary-item,
  .indicator,
  .status-card,
  .metric-card,
  .info-card,
  .detail-card,
  .health-card,
  .hardware-card,
  .sensor-card,
  .telemetry-card,
  .network-card,
  .runtime-card,
  .resource-card,
  .schedule-settings-card,
  .kis-advanced-group
){
  background:#ffffff!important;
  color:#142238!important;
  border-color:#d2deea!important;
  box-shadow:0 8px 22px rgba(35,58,83,.07)!important;
}

/* Catch compound legacy component names without changing buttons. */
body.kis-r4.light-theme #pageContent [class*="-card"]:not(.mnemo-node),
body.kis-r4.light-theme #pageContent [class*="-panel"]:not(.tab-panel){
  color:#142238!important;
  border-color:#d2deea!important;
}

/* Top-level tab panels are workspace, not navy cards. */
body.kis-r4.light-theme #pageContent .tab-panel{
  background:transparent!important;
  color:#142238!important;
}

/* All ordinary headings and supporting text use theme tokens. */
body.kis-r4.light-theme #pageContent :is(
  h1,h2,h3,h4,h5,h6,
  .section-title,
  .section-heading,
  .indicator-title,
  .indicator-value,
  .card-title,
  strong
){
  color:#142238!important;
}

body.kis-r4.light-theme #pageContent :is(
  p,small,label,
  .muted,
  .hint,
  .subtitle,
  .caption,
  .indicator-note
){
  color:#60748b!important;
}

/* Device navigation */
body.kis-r4.light-theme.device-view #deviceQuickNav{
  background:#ffffff!important;
  border-color:#d2deea!important;
}

body.kis-r4.light-theme.device-view #deviceQuickNav .device-switcher,
body.kis-r4.light-theme.device-view #deviceQuickNav .device-tabs{
  background:#f3f7fb!important;
  color:#142238!important;
}

body.kis-r4.light-theme.device-view #deviceQuickNav .device-tab-button{
  color:#536b83!important;
}

body.kis-r4.light-theme.device-view #deviceQuickNav .device-tab-button.active{
  color:#0967c9!important;
  background:#e8f3ff!important;
  border-color:#1687ff!important;
}

/* Hero and readiness */
body.kis-r4.light-theme.device-view #deviceStatusSection .hero-main,
body.kis-r4.light-theme.device-view #readinessCard{
  background:#ffffff!important;
  color:#142238!important;
  border-color:#d2deea!important;
}

body.kis-r4.light-theme.device-view #deviceStatusSection .hero-state{
  color:#0bbf65!important;
  text-shadow:none!important;
}

body.kis-r4.light-theme.device-view #deviceStatusSection .hero-meta .status-badge{
  background:#f3f7fb!important;
  color:#294057!important;
  border-color:#d2deea!important;
}

/* Status tiles */
body.kis-r4.light-theme.device-view #deviceMetricsSection .indicator{
  background:#ffffff!important;
  color:#142238!important;
}

body.kis-r4.light-theme.device-view #deviceMetricsSection .indicator.good{
  background:#f1fbf6!important;
}

body.kis-r4.light-theme.device-view #deviceMetricsSection .indicator.warn{
  background:#fff8ea!important;
}

body.kis-r4.light-theme.device-view #deviceMetricsSection .indicator.bad{
  background:#fff1f2!important;
}

/* Mnemoscheme is also light in the light theme. */
body.kis-r4.light-theme.device-view #deviceMnemoSection .mnemo-card{
  background:#ffffff!important;
  color:#142238!important;
  border-color:#d2deea!important;
}

body.kis-r4.light-theme.device-view #deviceMnemoSection .section-title,
body.kis-r4.light-theme.device-view #deviceMnemoSection .section-title *{
  color:#142238!important;
}

body.kis-r4.light-theme.device-view #deviceMnemoSection .mnemo{
  background:#eef4f9!important;
  color:#142238!important;
  border-color:#d2deea!important;
}

body.kis-r4.light-theme.device-view #deviceMnemoSection .mnemo :is(
  span,strong,small,label,div
){
  color:#294057!important;
}

body.kis-r4.light-theme.device-view #deviceMnemoSection .mnemo-source,
body.kis-r4.light-theme.device-view #deviceMnemoSection .mnemo-gen,
body.kis-r4.light-theme.device-view #deviceMnemoSection .mnemo-ats{
  background:#ffffff!important;
  color:#142238!important;
  border-color:#aebfd0!important;
  box-shadow:0 5px 16px rgba(35,58,83,.08)!important;
}

body.kis-r4.light-theme.device-view #deviceMnemoSection .mnemo-ats{
  border-color:#f0a000!important;
}

body.kis-r4.light-theme.device-view #deviceMnemoSection .mnemo .muted{
  color:#667b91!important;
}

/* Control and quick actions */
body.kis-r4.light-theme.device-view #deviceControlSection,
body.kis-r4.light-theme.device-view #autoModeCard,
body.kis-r4.light-theme.device-view #kisR4QuickActions{
  background:#ffffff!important;
  color:#142238!important;
  border-color:#d2deea!important;
}

body.kis-r4.light-theme.device-view #autoModeCard{
  background:#f5f8fb!important;
}

body.kis-r4.light-theme .kis-r4-quick-actions button,
body.kis-r4.light-theme .kis-control-more,
body.kis-r4.light-theme .kis-control-mode-note{
  background:#f5f8fb!important;
  color:#294057!important;
  border-color:#d2deea!important;
}

/* Expanded controller / sensors / resources sections below the main row. */
body.kis-r4.light-theme.device-view #tab-overview details,
body.kis-r4.light-theme.device-view #tab-overview details > summary{
  background:#ffffff!important;
  color:#142238!important;
  border-color:#d2deea!important;
}

body.kis-r4.light-theme.device-view #tab-overview details[open] > *:not(summary){
  background:#f7fafc!important;
  color:#142238!important;
}

/* Inputs and schedule/settings editors */
body.kis-r4.light-theme :is(input,select,textarea){
  background:#ffffff!important;
  color:#142238!important;
  border-color:#c8d6e4!important;
}

body.kis-r4.light-theme .settings-tabs,
body.kis-r4.light-theme .schedule-settings-card,
body.kis-r4.light-theme .schedule-event-card{
  background:#ffffff!important;
  color:#142238!important;
  border-color:#d2deea!important;
}

body.kis-r4.light-theme .settings-tabs .tab-button{
  background:#f3f7fb!important;
  color:#405a72!important;
  border-color:#d2deea!important;
}

body.kis-r4.light-theme .settings-tabs .tab-button.active{
  background:#246ee9!important;
  color:#ffffff!important;
  border-color:#246ee9!important;
}

/* Modal / bottom sheet */
body.kis-r4.light-theme .kis-r4-modal{
  background:#ffffff!important;
  color:#142238!important;
  border-color:#c7d7e5!important;
}

body.kis-r4.light-theme .kis-r4-modal-header,
body.kis-r4.light-theme .kis-r4-modal-actions{
  border-color:#d2deea!important;
}

body.kis-r4.light-theme .kis-r4-theme-grid button{
  background:#f5f8fb!important;
  color:#142238!important;
  border-color:#d2deea!important;
}

/* Footer/header/sidebar are intentionally dark and readable. */
body.kis-r4.light-theme .app-footer{
  background:#061728!important;
  color:#dcebf8!important;
  border-color:#17405f!important;
}

body.kis-r4.light-theme .app-footer :is(strong,span,small,div){
  color:#b8cede!important;
}

/* Mobile uses exactly the same light workspace rules. */
@media(max-width:1049px){
  body.kis-r4.light-theme .app-main,
  body.kis-r4.light-theme #pageContent,
  body.kis-r4.light-theme #pageContent > *{
    background:#edf3f8!important;
  }

  body.kis-r4 #drawer{
    overflow:hidden!important;
  }

  body.kis-r4 .kis-r4-nav-scroll{
    scrollbar-width:none!important;
  }
}


/* ===== ATS K.I.S. Enterprise — Web 7.0 r4.2 light overlays + device tabs ===== */

/* -----------------------------------------------------------------
   LIGHT THEME: legacy floating components are part of the same theme.
   These widgets live outside #pageContent, so page-only selectors
   from r4.1 cannot reach them.
------------------------------------------------------------------ */

/* ATS action / AUTO mode / grid / generator dialogs */
body.kis-r4.light-theme #deviceActionModal .device-action-dialog,
body.kis-r4.light-theme .event-description-dialog.device-action-dialog{
  background:#ffffff!important;
  color:#142238!important;
  border:1px solid #c7d7e5!important;
  box-shadow:0 28px 80px rgba(28,48,70,.24)!important;
}

body.kis-r4.light-theme #deviceActionModal #deviceActionContent,
body.kis-r4.light-theme #deviceActionModal #deviceActionContent > *{
  color:#142238;
}

body.kis-r4.light-theme #deviceActionModal h3,
body.kis-r4.light-theme #deviceActionModal strong{
  color:#142238!important;
}

body.kis-r4.light-theme #deviceActionModal .muted,
body.kis-r4.light-theme #deviceActionModal small{
  color:#647a91!important;
}

body.kis-r4.light-theme #deviceActionModal .event-description-close{
  background:#f3f7fb!important;
  color:#20364c!important;
  border:1px solid #cbd8e5!important;
}

body.kis-r4.light-theme #deviceActionModal .event-description-icon{
  background:#e8f3ff!important;
  color:#0967c9!important;
  border-color:#b9d9f6!important;
}

body.kis-r4.light-theme #deviceActionModal .mode-choice{
  background:#f7f9fc!important;
  color:#20364c!important;
  border-color:#cbd8e5!important;
}

body.kis-r4.light-theme #deviceActionModal .mode-choice.selected{
  background:#e7f2ff!important;
  color:#142238!important;
  border-color:#1687ff!important;
  box-shadow:0 0 0 1px rgba(22,135,255,.12)!important;
}

body.kis-r4.light-theme #deviceActionModal .mode-choice strong{
  color:#183047!important;
}

body.kis-r4.light-theme #deviceActionModal .mode-choice small{
  color:#667c92!important;
}

body.kis-r4.light-theme #deviceActionModal .action-status-grid > div{
  background:#f5f8fb!important;
  color:#20364c!important;
  border-color:#d2deea!important;
}

body.kis-r4.light-theme #deviceActionModal .action-dialog-note{
  background:#f6f9fc!important;
  color:#526980!important;
  border-color:#d4e0eb!important;
}

body.kis-r4.light-theme #deviceActionModal .action-dialog-note.warn{
  background:#fff7e7!important;
  color:#7a5510!important;
  border-color:#e6c36d!important;
}

body.kis-r4.light-theme #deviceActionModal .mode-schedule-button{
  background:#edf6ff!important;
  color:#17344e!important;
  border-color:#8ec5f5!important;
}

body.kis-r4.light-theme #deviceActionModal .action-dialog-buttons button:not(.primary):not(.start):not(.stop){
  background:#f3f7fb!important;
  color:#20364c!important;
  border-color:#cbd8e5!important;
}

/* Readiness details popup is rendered inside the readiness card but uses
   its own legacy dark surface. */
body.kis-r4.light-theme #readinessDetails{
  background:#ffffff!important;
  color:#142238!important;
  border-color:#c7d7e5!important;
  box-shadow:0 18px 50px rgba(28,48,70,.20)!important;
}

body.kis-r4.light-theme #readinessDetails > *{
  background:#f5f8fb!important;
  color:#20364c!important;
  border-color:#d2deea!important;
}

body.kis-r4.light-theme #readinessDetails :is(strong,b,span,div){
  color:inherit;
}

body.kis-r4.light-theme #readinessDetails .good,
body.kis-r4.light-theme #readinessDetails [class*="good"]{
  background:#eefaf3!important;
  color:#096c3e!important;
  border-color:#bfe3cf!important;
}

body.kis-r4.light-theme #readinessDetails .warn,
body.kis-r4.light-theme #readinessDetails [class*="warn"]{
  background:#fff7e7!important;
  color:#8b5b00!important;
  border-color:#ead08d!important;
}

body.kis-r4.light-theme #readinessDetails .bad,
body.kis-r4.light-theme #readinessDetails [class*="bad"]{
  background:#fff0f2!important;
  color:#a92035!important;
  border-color:#efc1c9!important;
}

/* Toasts are global body children, not page-content children. */
body.kis-r4.light-theme .toast{
  background:rgba(255,255,255,.98)!important;
  color:#142238!important;
  border-color:#cbd8e5!important;
  box-shadow:0 16px 42px rgba(28,48,70,.20)!important;
}

body.kis-r4.light-theme .toast .toast-title{
  color:#142238!important;
}

body.kis-r4.light-theme .toast .toast-text{
  color:#60748b!important;
}

body.kis-r4.light-theme .toast .toast-close{
  background:#f3f7fb!important;
  color:#294057!important;
  border-color:#cbd8e5!important;
}

body.kis-r4.light-theme .toast.good{border-color:#8bd0ab!important}
body.kis-r4.light-theme .toast.warn{border-color:#dfbd6c!important}
body.kis-r4.light-theme .toast.bad{border-color:#e69aaa!important}

/* Right notification drawer also follows light theme. Sidebar is still
   intentionally dark. */
body.kis-r4.light-theme #notificationDrawer{
  background:#f6f9fc!important;
  color:#142238!important;
  border-color:#c7d7e5!important;
  box-shadow:-20px 0 55px rgba(28,48,70,.20)!important;
}

body.kis-r4.light-theme #notificationDrawer .drawer-head,
body.kis-r4.light-theme #notificationDrawer .notification-actions{
  background:#ffffff!important;
  color:#142238!important;
  border-color:#d2deea!important;
}

body.kis-r4.light-theme #notificationDrawer .notification-entry{
  background:#ffffff!important;
  color:#142238!important;
  border-color:#d2deea!important;
}

body.kis-r4.light-theme #notificationDrawer .notification-entry.unread{
  background:#eaf4ff!important;
  border-color:#8bc1f0!important;
}

body.kis-r4.light-theme #notificationDrawer .notification-entry :is(.n-text,.n-time){
  color:#60748b!important;
}

/* -----------------------------------------------------------------
   DEVICE TABS
   Prevent the right-most "Історія ТО" label from being clipped.
------------------------------------------------------------------ */
@media(min-width:1050px){
  body.kis-r4.device-view #deviceQuickNav .device-tabs{
    display:grid!important;
    grid-template-columns:repeat(auto-fit,minmax(118px,1fr))!important;
    gap:4px!important;
    width:100%!important;
    max-width:100%!important;
    overflow:visible!important;
  }

  body.kis-r4.device-view #deviceQuickNav .device-tab-button{
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    padding-left:6px!important;
    padding-right:6px!important;
    white-space:nowrap!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }
}

@media(max-width:1049px){
  body.kis-r4.device-view #deviceQuickNav .device-tabs{
    display:flex!important;
    flex-wrap:nowrap!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    scrollbar-width:none!important;
  }

  body.kis-r4.device-view #deviceQuickNav .device-tabs::-webkit-scrollbar{
    display:none!important;
  }

  body.kis-r4.device-view #deviceQuickNav .device-tab-button{
    flex:0 0 auto!important;
    min-width:max-content!important;
    white-space:nowrap!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }
}


/* ===== ATS K.I.S. Enterprise - Web 7.0 r4.3 full light shell + accordions ===== */

body.kis-r4.light-theme{
  background:#edf3f8!important;
  color:#142238!important;
}

/* Header */
body.kis-r4.light-theme .app-header{
  background:rgba(248,251,254,.98)!important;
  color:#142238!important;
  border-color:#c9d8e5!important;
  box-shadow:0 5px 18px rgba(35,58,83,.07)!important;
}
body.kis-r4.light-theme .app-header .brand,
body.kis-r4.light-theme .app-header .brand span:not(.gold),
body.kis-r4.light-theme .app-header strong{color:#142238!important}
body.kis-r4.light-theme .app-header .gold{color:#1678d4!important}
body.kis-r4.light-theme .app-header .muted,
body.kis-r4.light-theme .app-header .version{color:#6c8298!important}
body.kis-r4.light-theme #breadcrumbs{
  background:#f6f9fc!important;
  color:#587189!important;
  border-color:#d2deea!important;
}
body.kis-r4.light-theme .app-header .system-chip{
  background:#eef4f9!important;
  color:#20364c!important;
  border-color:#d0dce7!important;
}
body.kis-r4.light-theme .app-header .icon-btn{
  background:#fff!important;
  color:#294057!important;
  border-color:#cad8e4!important;
  box-shadow:0 3px 10px rgba(35,58,83,.06)!important;
}
body.kis-r4.light-theme .kis-r4-search #globalSearch{
  background:#fff!important;
  color:#142238!important;
  border-color:#bfd0df!important;
}
body.kis-r4.light-theme .kis-r4-search #globalSearch::placeholder{color:#8699aa!important}
body.kis-r4.light-theme .kis-r4-search #globalSearchResults{
  background:#fff!important;
  color:#142238!important;
  border-color:#cbd8e5!important;
  box-shadow:0 14px 38px rgba(35,58,83,.16)!important;
}

/* Sidebar */
body.kis-r4.light-theme #drawer{
  background:linear-gradient(180deg,#f8fbfd,#eef4f8)!important;
  color:#20364c!important;
  border-right-color:#c8d7e4!important;
  box-shadow:8px 0 24px rgba(35,58,83,.07)!important;
}
body.kis-r4.light-theme #drawer .drawer-head{
  background:transparent!important;
  color:#142238!important;
  border-color:#d2deea!important;
}
body.kis-r4.light-theme #drawer .drawer-head .brand,
body.kis-r4.light-theme #drawer .drawer-head .brand span:not(.gold),
body.kis-r4.light-theme #drawer .drawer-head strong{color:#142238!important}
body.kis-r4.light-theme #drawer .drawer-head .gold{color:#1678d4!important}
body.kis-r4.light-theme #drawer .drawer-context,
body.kis-r4.light-theme #drawer .drawer-head small{color:#6c8298!important}
body.kis-r4.light-theme #kisR4Nav{color:#20364c!important}
body.kis-r4.light-theme .kis-r4-active-device{
  background:#fff!important;
  color:#142238!important;
  border-color:#c4d5e3!important;
  box-shadow:0 6px 18px rgba(35,58,83,.06)!important;
}
body.kis-r4.light-theme .kis-r4-device-icon{
  background:#e8f3ff!important;
  border-color:#b9d9f6!important;
}
body.kis-r4.light-theme .kis-r4-device-copy strong{color:#142238!important}
body.kis-r4.light-theme .kis-r4-device-copy small{color:#687f95!important}
body.kis-r4.light-theme .kis-r4-devices{
  background:#f2f7fb!important;
  border-color:#cbd9e5!important;
}
body.kis-r4.light-theme .kis-r4-device-link{
  background:#fff!important;
  color:#294057!important;
  border-color:#d5e0ea!important;
}
body.kis-r4.light-theme .kis-r4-device-link.active{
  background:#eaf8f1!important;
  color:#125c3a!important;
  border-color:#58bc88!important;
}
body.kis-r4.light-theme .kis-r4-nav-group{color:#748ca2!important}
body.kis-r4.light-theme .kis-r4-nav-item{
  background:transparent!important;
  color:#344d65!important;
}
body.kis-r4.light-theme .kis-r4-nav-item:hover{
  background:#e9f3fb!important;
  color:#17344e!important;
  border-color:#c3d9eb!important;
}
body.kis-r4.light-theme .kis-r4-nav-item.active{
  background:linear-gradient(90deg,#187de4,#0965c2)!important;
  color:#fff!important;
  border-color:#1687ff!important;
  box-shadow:0 6px 17px rgba(22,135,255,.18)!important;
}
body.kis-r4.light-theme .kis-r4-nav-copy small{color:#6f879d!important}
body.kis-r4.light-theme .kis-r4-nav-item.active .kis-r4-nav-copy small{color:#d6ebff!important}
body.kis-r4.light-theme .kis-r4-nav-footer{
  color:#748ca2!important;
  border-color:#d2deea!important;
}
body.kis-r4.light-theme .kis-r4-nav-footer strong{color:#1678d4!important}

/* Dashboard device cards */
body.kis-r4.light-theme #cards .device-card{
  background:#fff!important;
  color:#142238!important;
  border-color:#d2deea!important;
}
body.kis-r4.light-theme #cards .device-card .status-badge{
  background:#eef4f9!important;
  color:#294057!important;
  border:1px solid #cbd8e5!important;
  box-shadow:none!important;
}
body.kis-r4.light-theme #cards .device-card .metric-mini{
  background:#f3f7fb!important;
  color:#142238!important;
  border-color:#d2deea!important;
}
body.kis-r4.light-theme #cards .device-card .favorite-btn{
  background:#f3f7fb!important;
  color:#294057!important;
  border-color:#d2deea!important;
}

/* Footer */
body.kis-r4.light-theme .app-footer{
  background:#f7fafc!important;
  color:#294057!important;
  border-color:#cbd8e5!important;
  box-shadow:0 -4px 16px rgba(35,58,83,.05)!important;
}
body.kis-r4.light-theme .app-footer :is(strong,span,small,div){color:#587189!important}
body.kis-r4.light-theme .app-footer strong{color:#20364c!important}
body.kis-r4.light-theme .app-footer .gold{color:#1678d4!important}

/* Mobile bottom nav */
body.kis-r4.light-theme .mobile-bottom-nav{
  background:rgba(250,252,254,.98)!important;
  color:#294057!important;
  border-color:#c7d7e5!important;
  box-shadow:0 -10px 28px rgba(35,58,83,.12)!important;
}
body.kis-r4.light-theme .mobile-bottom-nav button{
  background:transparent!important;
  color:#60788f!important;
  border-color:transparent!important;
}
body.kis-r4.light-theme .mobile-bottom-nav button.active{
  background:#e7f1ff!important;
  color:#0967c9!important;
}

/* Restored collapsible groups */
body.kis-r4.device-view .kis-r4-accordion-section{
  width:100%;
  margin:8px 0!important;
  padding:0!important;
  border:1px solid var(--kis-border)!important;
  border-radius:12px!important;
  background:var(--kis-card)!important;
  overflow:hidden;
  box-shadow:var(--kis-shadow)!important;
}
body.kis-r4.device-view .kis-r4-accordion-section > .kis-r4-accordion-head{
  position:relative;
  display:flex!important;
  align-items:center!important;
  gap:9px!important;
  width:100%;
  min-height:48px;
  margin:0!important;
  padding:9px 13px!important;
  cursor:pointer;
  user-select:none;
  background:var(--kis-card)!important;
  color:var(--kis-text)!important;
  border:0!important;
}
body.kis-r4.device-view .kis-r4-accordion-section > .kis-r4-accordion-head:hover{
  background:var(--kis-card-2)!important;
}
body.kis-r4.device-view .kis-r4-accordion-icon{
  flex:0 0 auto;
  width:24px;
  text-align:center;
  font-size:16px;
}
body.kis-r4.device-view .kis-r4-accordion-head > div{
  flex:1 1 auto;
  min-width:0;
}
body.kis-r4.device-view .kis-r4-accordion-head .section-kicker{display:none!important}
body.kis-r4.device-view .kis-r4-accordion-head h2{
  margin:0!important;
  color:var(--kis-text)!important;
  font-size:12px!important;
  line-height:1.3!important;
}
body.kis-r4.device-view .kis-r4-accordion-arrow{
  flex:0 0 auto;
  margin-left:auto;
  color:var(--kis-muted);
  font-size:18px;
  font-weight:800;
}
body.kis-r4.device-view .kis-r4-accordion-section.is-collapsed > :not(.kis-r4-accordion-head){
  display:none!important;
}
body.kis-r4.device-view .kis-r4-accordion-section:not(.is-collapsed) > :not(.kis-r4-accordion-head){
  margin-left:10px;
  margin-right:10px;
  margin-bottom:10px;
}
body.kis-r4.light-theme.device-view .kis-r4-accordion-section,
body.kis-r4.light-theme.device-view .kis-r4-accordion-section > .kis-r4-accordion-head{
  background:#fff!important;
  color:#142238!important;
  border-color:#d2deea!important;
  box-shadow:0 7px 20px rgba(35,58,83,.06)!important;
}
body.kis-r4.light-theme.device-view .kis-r4-accordion-section > .kis-r4-accordion-head:hover{
  background:#f2f7fb!important;
}
body.kis-r4.light-theme.device-view .kis-r4-accordion-head h2{color:#142238!important}
body.kis-r4.light-theme.device-view .kis-r4-accordion-arrow{color:#60788f!important}
body.kis-r4.device-view #deviceHealthSection .device-health-grid,
body.kis-r4.device-view #hardwareTelemetrySection .hardware-telemetry-grid,
body.kis-r4.device-view #deviceResourceSection .device-summary-strip{
  width:auto!important;
}

@media(max-width:1049px){
  body.kis-r4.light-theme #drawer{
    background:linear-gradient(180deg,#f8fbfd,#eef4f8)!important;
  }
  body.kis-r4.light-theme .mobile-bottom-nav{
    background:rgba(250,252,254,.98)!important;
  }
  body.kis-r4.device-view .kis-r4-accordion-section{
    margin:7px 0!important;
  }
}


/* ===== ATS K.I.S. Enterprise - Web 7.0 r4.4 unified container alignment ===== */

:root{
  --kis-shell-pad-x:14px;
  --kis-shell-pad-y:11px;
  --kis-shell-gap:10px;
}

/* One geometry model for the entire application. */
html,
body,
body.kis-r4,
body.kis-r4 .app-shell{
  width:100%;
  max-width:100%;
  overflow-x:hidden!important;
}

body.kis-r4 .app-header,
body.kis-r4 .app-main,
body.kis-r4 .app-footer,
body.kis-r4 #pageContent{
  min-width:0!important;
  max-width:none!important;
  box-sizing:border-box!important;
}

body.kis-r4 .app-main{
  padding:
    var(--kis-shell-pad-y)
    var(--kis-shell-pad-x)
    24px!important;
}

body.kis-r4 #pageContent{
  width:100%!important;
  max-width:100%!important;
  margin:0!important;
  padding:0!important;
}

body.kis-r4 #pageContent > *{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  margin-left:0!important;
  margin-right:0!important;
  box-sizing:border-box!important;
}

/* Align every primary page surface to the exact same left/right edges. */
body.kis-r4 :is(
  .page-top,
  #deviceQuickNav,
  #deviceStatusSection,
  #deviceMetricsSection,
  .device-operations-row,
  #deviceHealthSection,
  #hardwareTelemetrySection,
  #deviceResourceSection,
  .dashboard-section-card,
  .settings-tabs,
  .schedule-settings-card,
  .app-footer
){
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  margin-left:0!important;
  margin-right:0!important;
  box-sizing:border-box!important;
}

/* Sidebar and workspace use one shared boundary. */
@media(min-width:1050px){
  body.kis-r4:not(.wallboard) #drawer{
    left:0!important;
    width:var(--kis-nav-w)!important;
    max-width:var(--kis-nav-w)!important;
  }

  body.kis-r4:not(.wallboard) .app-header,
  body.kis-r4:not(.wallboard) .app-main,
  body.kis-r4:not(.wallboard) .app-footer{
    margin-left:var(--kis-nav-w)!important;
    width:calc(100vw - var(--kis-nav-w))!important;
    max-width:calc(100vw - var(--kis-nav-w))!important;
    right:auto!important;
  }

  body.kis-r4:not(.wallboard) .app-main{
    overflow-x:hidden!important;
  }
}

/* Device page: every row uses the same usable width. */
body.kis-r4.device-view #tab-overview{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  overflow-x:hidden!important;
}

body.kis-r4.device-view #deviceStatusSection .device-hero{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
}

body.kis-r4.device-view #deviceMetricsSection .device-metrics-grid{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  grid-template-columns:repeat(8,minmax(0,1fr))!important;
}

body.kis-r4.device-view #deviceMetricsSection .indicator{
  min-width:0!important;
  max-width:100%!important;
  overflow:hidden!important;
}

/* Long state values (e.g. ПРОСТРОЧЕНО) must stay inside their card. */
body.kis-r4.device-view #deviceMetricsSection .indicator-value{
  max-width:100%!important;
  font-size:clamp(16px,1.35vw,24px)!important;
  line-height:1.05!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
}

/* Keep main three-column operational row inside the workspace. */
body.kis-r4.device-view .device-operations-row{
  width:100%!important;
  max-width:100%!important;
  grid-template-columns:
    minmax(0,1.35fr)
    minmax(280px,.72fr)
    minmax(210px,.48fr)!important;
}

body.kis-r4.device-view #deviceMnemoSection,
body.kis-r4.device-view #deviceControlSection,
body.kis-r4.device-view #kisR4QuickActions{
  min-width:0!important;
  max-width:100%!important;
  width:100%!important;
}

body.kis-r4.device-view #deviceMnemoSection .mnemo-card,
body.kis-r4.device-view #deviceControlSection,
body.kis-r4.device-view #kisR4QuickActions{
  overflow:hidden!important;
}

/* Device tabs: same width as every other container, never stick out. */
body.kis-r4.device-view #deviceQuickNav{
  overflow:hidden!important;
}

body.kis-r4.device-view #deviceQuickNav .device-tabs{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
}

body.kis-r4.device-view #deviceQuickNav .device-tab-button{
  min-width:0!important;
  max-width:100%!important;
}

/* Dashboard cards must not create their own overflow geometry. */
body.kis-r4 #cards{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
}

body.kis-r4 #cards .device-card{
  min-width:0!important;
  max-width:100%!important;
}

/* Tablet */
@media(max-width:1380px) and (min-width:1050px){
  body.kis-r4.device-view #deviceMetricsSection .device-metrics-grid{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
  }

  body.kis-r4.device-view .device-operations-row{
    grid-template-columns:minmax(0,1fr) minmax(280px,.72fr)!important;
  }

  body.kis-r4.device-view #kisR4QuickActions{
    grid-column:1 / -1!important;
  }
}

/* Mobile: the exact same edges as desktop, only a smaller outer padding. */
@media(max-width:1049px){
  :root{
    --kis-shell-pad-x:9px;
    --kis-shell-pad-y:9px;
  }

  body.kis-r4 .app-header,
  body.kis-r4 .app-main,
  body.kis-r4 .app-footer{
    width:100vw!important;
    max-width:100vw!important;
    margin-left:0!important;
    margin-right:0!important;
  }

  body.kis-r4 .app-main{
    padding:
      var(--kis-shell-pad-y)
      var(--kis-shell-pad-x)
      98px!important;
    overflow-x:hidden!important;
  }

  body.kis-r4.device-view #deviceMetricsSection .device-metrics-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  body.kis-r4.device-view .device-operations-row{
    grid-template-columns:minmax(0,1fr)!important;
  }

  body.kis-r4.device-view #deviceQuickNav{
    overflow:hidden!important;
  }

  body.kis-r4.device-view #deviceQuickNav .device-tabs{
    overflow-x:auto!important;
    overflow-y:hidden!important;
    scrollbar-width:none!important;
  }

  body.kis-r4.device-view #deviceQuickNav .device-tabs::-webkit-scrollbar{
    display:none!important;
  }
}

/* Very narrow phones */
@media(max-width:370px){
  body.kis-r4.device-view #deviceMetricsSection .device-metrics-grid{
    grid-template-columns:minmax(0,1fr)!important;
  }
}


/* ===== ATS K.I.S. Enterprise - Web 7.0 r4.5 typography contrast ===== */

/*
   Light theme readability pass.
   No layout, navigation, API or generator-control logic is changed.
*/
body.kis-r4.light-theme{
  --kis-text:#122033;
  --kis-muted:#4f6277;
}

/* Global readable text in light workspace */
body.kis-r4.light-theme #pageContent{
  color:#122033!important;
}

body.kis-r4.light-theme #pageContent :is(
  p,
  small,
  label,
  .muted,
  .hint,
  .subtitle,
  .caption,
  .indicator-note
){
  color:#4f6277!important;
  font-weight:500;
}

body.kis-r4.light-theme #pageContent :is(
  h1,h2,h3,h4,h5,h6,
  strong,
  .section-title,
  .section-heading,
  .card-title,
  .indicator-title,
  .indicator-value
){
  color:#122033!important;
}

/* Left navigation */
body.kis-r4.light-theme .kis-r4-nav-item{
  color:#24384f!important;
  font-weight:600;
}

body.kis-r4.light-theme .kis-r4-nav-copy strong{
  color:inherit!important;
  font-weight:700!important;
  font-size:12px!important;
}

body.kis-r4.light-theme .kis-r4-nav-copy small{
  color:#53697f!important;
  font-weight:600!important;
  font-size:9px!important;
}

body.kis-r4.light-theme .kis-r4-nav-group{
  color:#5d7288!important;
  font-weight:800!important;
}

body.kis-r4.light-theme .kis-r4-device-copy strong{
  color:#17283b!important;
  font-weight:750!important;
}

body.kis-r4.light-theme .kis-r4-device-copy small{
  color:#52687d!important;
  font-weight:600!important;
}

body.kis-r4.light-theme .kis-r4-device-link{
  color:#253b52!important;
  font-weight:650!important;
}

/* Header and breadcrumbs */
body.kis-r4.light-theme #breadcrumbs{
  color:#455c73!important;
  font-weight:600!important;
}

body.kis-r4.light-theme .app-header .version,
body.kis-r4.light-theme .app-header .muted{
  color:#50667b!important;
  font-weight:600!important;
}

/* Device tabs */
body.kis-r4.light-theme.device-view #deviceQuickNav .device-tab-button{
  color:#465e75!important;
  font-weight:700!important;
}

body.kis-r4.light-theme.device-view #deviceQuickNav .device-tab-button.active{
  color:#075eae!important;
  font-weight:800!important;
}

/* Hero metadata */
body.kis-r4.light-theme.device-view #deviceStatusSection .hero-meta .status-badge{
  color:#263b50!important;
  font-weight:650!important;
}

body.kis-r4.light-theme.device-view #deviceStatusSection .hero-meta .status-badge strong{
  color:#122033!important;
}

/* Metric cards */
body.kis-r4.light-theme.device-view #deviceMetricsSection .indicator-title{
  color:#26384b!important;
  font-weight:800!important;
}

body.kis-r4.light-theme.device-view #deviceMetricsSection .indicator-value{
  color:#122033!important;
  font-weight:800!important;
}

body.kis-r4.light-theme.device-view #deviceMetricsSection .indicator-note{
  color:#4b6075!important;
  font-weight:600!important;
  font-size:9px!important;
}

/* Mnemoscheme outer labels */
body.kis-r4.light-theme.device-view #deviceMnemoSection .section-title,
body.kis-r4.light-theme.device-view #deviceMnemoSection .mnemo-card > p,
body.kis-r4.light-theme.device-view #deviceMnemoSection .mnemo-card > .muted{
  color:#31495f!important;
  font-weight:600!important;
}

/* Controls and quick actions */
body.kis-r4.light-theme.device-view #deviceControlSection,
body.kis-r4.light-theme.device-view #kisR4QuickActions{
  color:#122033!important;
}

body.kis-r4.light-theme.device-view #deviceControlSection :is(
  .muted,
  small,
  .kis-control-mode-note
){
  color:#4c6278!important;
  font-weight:600!important;
}

body.kis-r4.light-theme .kis-r4-quick-actions button{
  color:#253c52!important;
  font-weight:700!important;
}

/* Accordions */
body.kis-r4.light-theme.device-view .kis-r4-accordion-head h2{
  color:#1b2f43!important;
  font-weight:750!important;
}

body.kis-r4.light-theme.device-view .kis-r4-accordion-arrow{
  color:#445d73!important;
  font-weight:900!important;
}

/* Readiness details */
body.kis-r4.light-theme #readinessDetails{
  color:#122033!important;
}

body.kis-r4.light-theme #readinessDetails > *{
  color:#25384c!important;
  font-weight:650!important;
}

body.kis-r4.light-theme #readinessDetails :is(
  strong,b
){
  color:#122033!important;
  font-weight:800!important;
}

body.kis-r4.light-theme #readinessDetails small,
body.kis-r4.light-theme #readinessDetails .muted{
  color:#465d73!important;
  font-weight:600!important;
}

/* Dashboard device cards */
body.kis-r4.light-theme #cards .device-card{
  color:#122033!important;
}

body.kis-r4.light-theme #cards .device-card .status-badge{
  color:#263b50!important;
  font-weight:700!important;
}

body.kis-r4.light-theme #cards .device-card .metric-mini{
  color:#21374d!important;
}

body.kis-r4.light-theme #cards .device-card .metric-mini small{
  color:#53687e!important;
  font-weight:600!important;
}

/* Generic light buttons/menu controls */
body.kis-r4.light-theme :is(
  .settings-tabs .tab-button,
  .mode-schedule-button,
  .kis-r4-theme-grid button
){
  color:#263b50!important;
  font-weight:700!important;
}

/* Notification drawer */
body.kis-r4.light-theme #notificationDrawer{
  color:#122033!important;
}

body.kis-r4.light-theme #notificationDrawer .notification-entry{
  color:#1b3045!important;
  font-weight:600!important;
}

body.kis-r4.light-theme #notificationDrawer .notification-entry :is(.n-text,.n-time){
  color:#4c6278!important;
  font-weight:600!important;
}

/* Mobile bottom navigation: larger and darker labels */
@media(max-width:1049px){
  body.kis-r4.light-theme .mobile-bottom-nav button{
    color:#405970!important;
    font-weight:700!important;
  }

  body.kis-r4.light-theme .mobile-bottom-nav button span{
    color:inherit!important;
    font-size:13px!important;
    font-weight:750!important;
    line-height:1.15!important;
  }

  body.kis-r4.light-theme .mobile-bottom-nav button.active{
    color:#075fae!important;
  }

  body.kis-r4.light-theme.device-view #deviceQuickNav .device-tab-button{
    font-size:13px!important;
    font-weight:750!important;
  }

  body.kis-r4.light-theme.device-view #deviceMetricsSection .indicator-note{
    font-size:11px!important;
  }

  body.kis-r4.light-theme .kis-r4-nav-copy strong{
    font-size:14px!important;
  }

  body.kis-r4.light-theme .kis-r4-nav-copy small{
    font-size:11px!important;
  }
}

/* Very small screens: preserve readability, not tiny gray text */
@media(max-width:430px){
  body.kis-r4.light-theme #pageContent :is(
    small,
    .muted,
    .hint,
    .caption,
    .indicator-note
  ){
    font-size:12px!important;
  }
}