/* NUGAN Plan V4.1.56 — reversible, presentation-only soft-blue/Excel theme.
   The dark-blue corporate logo/header branding stays unchanged.
   Desktop navigation rules are limited to >= 901px; mobile rail stays as-is. */
:root{
  --accent:#397ca2;
  --bg:#f7fafc;
  --line:#dce6ee;
  --text:#243746;
  --muted:#657989;
  --nugan-soft-green:#eaf2f8;
  --nugan-green-border:#cddfeb;
}
body{background:var(--bg)}
/* Recolor working surfaces only; never tint the corporate logo or auth screen. */
#app .content .panel,
#app .content .summary article,
#app .content .catalog-card{border-color:var(--line)}
#app .content table th{background:#eff5f9;border-bottom:1px solid #c4d9e7;color:#2a4960}
#app .content table td{border-bottom-color:#e6edf3}
#app .content .table-wrap{border-color:var(--line)}
#app .content .btn:not(.danger),#app .content button.btn:not(.danger){background:#397ca2;border-color:#397ca2;color:#fff}
#app .content .btn:not(.danger):hover{background:#2d688a}
#app .content .icon-btn:not(.danger){border-color:#cfdfeb;color:#315f7c}
#app .content .icon-btn:not(.danger):hover{background:#f1f7fb}
#app .content input:focus-visible,#app .content select:focus-visible,#app .content textarea:focus-visible,
#app .content button:focus-visible,.fixed-menu-rail .nav-item:focus-visible{
  outline:2px solid #76a8c7;outline-offset:2px;
}
#app .content .progress{background:#e6eff6}
#app .content .progress i{background:#6195b7}
#app .content .report-nav.active,#app .content .nav-item.active{background:#e6f1f8}
/* Active tabs in the monthly / ten-day report controls; specificity limited to work-area controls. */
#app .content .daily-ten-day-tab.active,
#app .content .ten-day-switch.active,
#app .content .ten-day-period.active,
#app .content .report-view-tab.active,
#app .content button[aria-selected="true"]{background:#397ca2;border-color:#397ca2;color:#fff}

@media(min-width:901px){
  :root{--nugan-side-width:232px}
  body.nugan-desktop-collapsed{--nugan-side-width:66px}
  /* Full-width work area, with space reserved for the actual (non-overlay) sidebar. */
  #app>header{position:relative;z-index:20;background:#fff;border-bottom:1px solid var(--line)}
  body .layout.fixed-rail-layout,
  body .layout.home-layout.fixed-rail-layout{
    display:grid!important;
    grid-template-columns:var(--nugan-side-width) minmax(0,1fr)!important;
    width:100%!important;max-width:none!important;
    margin:0!important;padding:0!important;gap:0!important;
  }
  body .fixed-rail-layout>.fixed-rail-content{
    grid-column:2!important;min-width:0!important;width:100%!important;
    padding:20px clamp(14px,2vw,30px) 30px!important;
  }
  body .fixed-menu-rail,
  body .fixed-menu-rail:hover,
  body .home-mini-aside.fixed-menu-rail:hover{
    position:fixed!important;
    top:62px!important;left:0!important;bottom:0!important;
    width:var(--nugan-side-width)!important;
    height:calc(100vh - 62px)!important;height:calc(100dvh - 62px)!important;
    max-height:none!important;
    overflow-x:hidden!important;overflow-y:auto!important;
    border:0!important;border-right:1px solid var(--line)!important;
    border-radius:0!important;
    background:#fff!important;
    box-shadow:none!important;z-index:30!important;
    transition:none!important;scrollbar-width:thin;
  }
  /* The rail is permanently expanded; hovering never changes its width. */
  body:not(.nugan-desktop-collapsed) .fixed-menu-rail .home-aside-title,
  body:not(.nugan-desktop-collapsed) .fixed-menu-rail:not(:hover) .home-aside-title{
    display:flex!important;justify-content:flex-start!important;align-items:center!important;
    min-height:54px!important;padding:9px 12px!important;gap:8px!important;
    background:#f9fbfd!important;border-bottom:1px solid var(--line)!important;
  }
  body:not(.nugan-desktop-collapsed) .fixed-menu-rail .home-menu-label,
  body:not(.nugan-desktop-collapsed) .fixed-menu-rail:not(:hover) .home-menu-label{
    display:block!important;flex:1!important;color:#526d81!important;white-space:nowrap;
  }
  body .fixed-menu-rail .home-menu-glyph{
    display:flex!important;align-items:center!important;justify-content:center!important;
    width:34px!important;height:34px!important;flex:0 0 34px!important;
    background:#eff5f9!important;border:1px solid #d8e6ef!important;
    color:#356c8d!important;border-radius:9px!important;cursor:pointer!important;
  }
  body .fixed-menu-rail .home-menu-glyph i{background:#3e779a!important}
  body .fixed-menu-rail .home-menu-glyph:focus-visible{outline:2px solid #5a96b9;outline-offset:2px}
  body:not(.nugan-desktop-collapsed) .fixed-menu-rail .nav-item,
  body:not(.nugan-desktop-collapsed) .fixed-menu-rail:hover .nav-item,
  body:not(.nugan-desktop-collapsed) .fixed-menu-rail:not(:hover) .nav-item{
    display:grid!important;
    grid-template-columns:30px minmax(0,1fr) auto!important;
    grid-template-rows:auto 2px!important;
    column-gap:8px!important;row-gap:3px!important;
    align-items:center!important;justify-items:stretch!important;
    min-height:0!important;padding:9px 10px!important;
    background:#fff;color:#253a4c;
  }
  body:not(.nugan-desktop-collapsed) .fixed-menu-rail .nav-item>.rail-icon,
  body:not(.nugan-desktop-collapsed) .fixed-menu-rail:not(:hover) .nav-item>.rail-icon{
    display:grid!important;grid-column:1!important;grid-row:1!important;
    place-items:center!important;width:30px!important;height:30px!important;margin:0!important;
    background:#eff5f9!important;border:1px solid #e2ebf1!important;color:#3b7494!important;
  }
  body:not(.nugan-desktop-collapsed) .fixed-menu-rail .nav-item>.rail-icon svg{width:18px!important;height:18px!important}
  body:not(.nugan-desktop-collapsed) .fixed-menu-rail .nav-item>span:not(.rail-icon),
  body:not(.nugan-desktop-collapsed) .fixed-menu-rail:not(:hover) .nav-item>span:not(.rail-icon){
    display:grid!important;grid-column:2!important;grid-row:1!important;gap:2px!important;
    min-width:0!important;line-height:1.18!important;text-align:left!important;
  }
  body:not(.nugan-desktop-collapsed) .fixed-menu-rail .nav-item>span b{font-size:12px!important;line-height:1.18!important}
  body:not(.nugan-desktop-collapsed) .fixed-menu-rail .nav-item>span small{font-size:9px!important;line-height:1.2!important;color:#6c8190}
  body:not(.nugan-desktop-collapsed) .fixed-menu-rail .nav-item>em,
  body:not(.nugan-desktop-collapsed) .fixed-menu-rail:not(:hover) .nav-item>em{
    display:block!important;grid-column:3!important;grid-row:1!important;justify-self:end!important;
    font-size:10px!important;white-space:nowrap;
  }
  body:not(.nugan-desktop-collapsed) .fixed-menu-rail .nav-item>i,
  body:not(.nugan-desktop-collapsed) .fixed-menu-rail:not(:hover) .nav-item>i{
    display:block!important;grid-column:1/-1!important;grid-row:2!important;
    width:100%!important;height:2px!important;margin:0!important;background:#edf2f6;
  }
  body .fixed-menu-rail .nav-item>i>u{background:#7fa9c5!important}
  body .fixed-menu-rail .nav-item:hover{background:#f3f8fb!important}
  body .fixed-menu-rail .nav-item.active,
  body .fixed-menu-rail .nav-item.active:hover{
    background:#e6f1f8!important;color:#2e6688!important;
    box-shadow:inset 3px 0 0 #397ca2;
  }
  body .fixed-menu-rail .nav-item.active .rail-icon{
    background:#dcecf6!important;border-color:#c7dfed!important;color:#397ca2!important;
  }
  /* Collapsed mode is explicit only: hover must NOT re-expand the overlay. */
  body.nugan-desktop-collapsed .fixed-menu-rail .home-aside-title,
  body.nugan-desktop-collapsed .fixed-menu-rail:hover .home-aside-title{
    display:flex!important;justify-content:center!important;min-height:54px!important;
    padding:9px 7px!important;background:#f9fbfd!important;
  }
  body.nugan-desktop-collapsed .fixed-menu-rail .home-menu-label,
  body.nugan-desktop-collapsed .fixed-menu-rail:hover .home-menu-label,
  body.nugan-desktop-collapsed .fixed-menu-rail .home-aside-title>button:not(.mobile-nav-close){display:none!important}
  body.nugan-desktop-collapsed .fixed-menu-rail .nav-item,
  body.nugan-desktop-collapsed .fixed-menu-rail:hover .nav-item{
    display:grid!important;grid-template-columns:1fr!important;grid-template-rows:auto!important;
    justify-items:center!important;align-items:center!important;min-height:47px!important;
    padding:7px!important;gap:0!important;
  }
  body.nugan-desktop-collapsed .fixed-menu-rail .nav-item>.rail-icon,
  body.nugan-desktop-collapsed .fixed-menu-rail:hover .nav-item>.rail-icon{
    display:grid!important;grid-column:1!important;grid-row:1!important;
    margin:0!important;width:34px!important;height:34px!important;
    place-items:center!important;background:#eff5f9!important;
  }
  body.nugan-desktop-collapsed .fixed-menu-rail .nav-item>span:not(.rail-icon),
  body.nugan-desktop-collapsed .fixed-menu-rail .nav-item>em,
  body.nugan-desktop-collapsed .fixed-menu-rail .nav-item>i,
  body.nugan-desktop-collapsed .fixed-menu-rail:hover .nav-item>span:not(.rail-icon),
  body.nugan-desktop-collapsed .fixed-menu-rail:hover .nav-item>em,
  body.nugan-desktop-collapsed .fixed-menu-rail:hover .nav-item>i{display:none!important}
  body.nugan-desktop-collapsed .fixed-menu-rail .staff-user-nav{display:none!important}
  /* Tooltip keeps menu accessible while icon-only. */
  body.nugan-desktop-collapsed .fixed-menu-rail .nav-item:hover::after{
    content:attr(data-nugan-label);position:fixed;left:69px;z-index:300;
    background:#27465e;color:#fff;border-radius:6px;padding:7px 10px;
    font-size:12px;white-space:nowrap;pointer-events:none;box-shadow:0 8px 18px #15394d1c;
  }
}
@media(prefers-reduced-motion:reduce){.fixed-menu-rail,.fixed-menu-rail:hover{transition:none!important}}
/* Newer read-only report components inject their own blue styling at runtime.
   These scoped color-only overrides keep them in the same soft-blue worksheet palette. */
#app .content .ten-day-report-fold #ten-day-view .ten-day-unified{
  background:#f4f8fb!important;border-color:#d8e6ee!important;color:#253a4b!important;
}
#app .content .ten-day-report-fold #ten-day-view .ten-day-unified-finding,
#app .content .ten-day-report-fold #ten-day-view .ten-day-unified-metrics>div{
  background:#fff!important;border-color:#d8e5ed!important;
}
#app .content .ten-day-report-fold #ten-day-view .ten-day-unified-finding h4{
  color:#326886!important;
}
#app .content .ten-day-report-fold #ten-day-view .ten-day-unified-lead{
  border-left-color:#3d86ad!important;
}
#app .content .ten-day-report-fold #ten-day-view .ten-day-work-group-grid article{
  background:#f3f8fb!important;border-color:#d9e6ee!important;
}
@media(max-width:900px){
  /* Mobile interaction/geometry remains the original; only the active tint follows the palette. */
  body .fixed-menu-rail .nav-item.active,
  body.mobile-nav-open .fixed-menu-rail .nav-item.active{background:#e6f1f8!important;color:#326d8e!important;}
  body .fixed-menu-rail .nav-item.active .rail-icon{background:#e0eff7!important;border-color:#cfdfeb!important;color:#397ca2!important;}
}
/* Pop-up tables keep the same clean worksheet header and borders. */
.modal table th{background:#eff5f9!important;border-bottom-color:#c4d9e7!important;color:#2a4960!important;}
.modal table td{border-bottom-color:#e6edf3!important;}
.modal .btn:not(.danger){background:#397ca2;border-color:#397ca2;color:#fff;}

/* V4.1.59 — Group headings use EXACTLY the same typography as ҮНДСЭН ЦЭС.
   Keep menu permissions, navigation and group layout unchanged. */
.fixed-menu-rail .home-menu-label,
.fixed-menu-rail > .nugan-nav-section{
  font-family:inherit;
  font-size:11px;
  font-weight:700;
  letter-spacing:.65px;
  color:#526d81;
  text-transform:uppercase;
}
.fixed-menu-rail > .nugan-nav-section{
  display:block;box-sizing:border-box;width:100%;
  padding:15px 12px 8px;
  line-height:normal;white-space:nowrap;
  border-top:1px solid #e4ecf2;
  background:#f7fafc;
}
.fixed-menu-rail > .nugan-nav-section:first-of-type{border-top:0}
@media(min-width:901px){
  body.nugan-desktop-collapsed .fixed-menu-rail > .nugan-nav-section{
    overflow:hidden;color:transparent;font-size:0;height:13px;
    padding:0 9px;background:#fff;border-top:1px solid #e4ecf2;
  }
}
@media(max-width:900px){
  .fixed-menu-rail > .nugan-nav-section{display:none!important}
  body.mobile-nav-open .fixed-menu-rail > .nugan-nav-section{
    display:block!important;padding:13px 13px 6px!important;
  }
}

/* V4.1.55 — daily action buttons sit over the draft-status end of daily card.
   Only the daily page; no changes to report state or submit handlers. */
#app .daily-main-actions{
  display:flex;justify-content:flex-end;align-items:center;
  flex-wrap:wrap;gap:8px;margin:0 0 12px;
}
#app .daily-main-actions .btn{
  display:inline-flex;align-items:center;justify-content:center;
  height:38px;min-height:38px;min-width:112px;
  width:auto!important;max-width:none;
  padding:0 13px!important;
  line-height:1.2;white-space:nowrap;
  font-size:12px;flex:0 0 auto;
  border-radius:9px;
}
#app .daily-title .daily-date-tools{flex-shrink:0;}
@media(max-width:620px){
  #app .daily-main-actions{justify-content:stretch;}
  #app .daily-main-actions #daily-add{display:none;}
  #app .daily-main-actions #daily-submit{width:100%!important;min-height:44px;height:44px;}
}

/* V4.1.60 — CRM-only toolbar layout, isolated from the table header.
   Search, region selection and live filtering retain their existing handlers. */
#app .content.customer-page .customer-library > .customer-territory-strip{
  position:static!important;inset:auto!important;transform:none!important;
  display:flex!important;flex-wrap:wrap;align-items:center;
  width:100%!important;margin:0!important;box-sizing:border-box;
}
#app .content.customer-page .customer-library > .customer-toolbar{
  position:static!important;inset:auto!important;transform:none!important;
  display:flex!important;flex-wrap:wrap;align-items:end;justify-content:flex-start;
  gap:10px 14px!important;width:100%!important;max-width:100%!important;
  margin:0!important;padding:12px 14px!important;box-sizing:border-box;
  min-height:0!important;clear:both!important;overflow:visible!important;
  background:#fbfdff!important;border-bottom:1px solid #dce6ee!important;
}
#app .content.customer-page .customer-library > .customer-toolbar label{
  position:static!important;display:flex!important;flex-direction:column;gap:5px!important;
  flex:1 1 225px;max-width:410px;min-width:0!important;
  margin:0!important;padding:0!important;line-height:1.35;
}
#app .content.customer-page .customer-library > .customer-toolbar input,
#app .content.customer-page .customer-library > .customer-toolbar select{
  position:static!important;display:block!important;width:100%!important;min-width:0!important;
  height:38px!important;max-width:100%!important;margin:0!important;
}
#app .content.customer-page .customer-library > .customer-toolbar .customer-count{
  position:static!important;align-self:center;justify-self:auto;margin-left:auto;
  white-space:nowrap;font-size:12px;
}
#app .content.customer-page .customer-library > .table-wrap{
  position:relative;clear:both;max-width:100%;overflow-x:auto;
}
@media(max-width:650px){
  #app .content.customer-page .customer-library > .customer-toolbar label{flex:1 1 100%;max-width:none;}
  #app .content.customer-page .customer-library > .customer-toolbar .customer-count{margin-left:0;}
}

/* 2026-10-21 — desktop rail: MANUAL open/close only.
   The hamburger button controls nugan-desktop-collapsed; hovering never changes
   the rail width, position, or row geometry. <=900px mobile logic is untouched. */
@media (min-width:901px){
  body .fixed-menu-rail,
  body .fixed-menu-rail:hover,
  body .home-mini-aside.fixed-menu-rail:hover{
    width:var(--nugan-side-width)!important;
    transition:none!important;
    transform:none!important;
    animation:none!important;
    box-shadow:none!important;
  }
  body .fixed-menu-rail .home-menu-glyph,
  body .fixed-menu-rail:hover .home-menu-glyph{
    display:flex!important;
    cursor:pointer!important;
  }
  body .fixed-menu-rail .nav-item,
  body .fixed-menu-rail .nav-item:hover{
    transition:none!important;
    transform:none!important;
    animation:none!important;
  }
  body .fixed-menu-rail .nav-item:hover:not(.active){
    background:#fff!important;
    box-shadow:none!important;
  }
  body .fixed-menu-rail .nav-item.active,
  body .fixed-menu-rail .nav-item.active:hover{
    background:#e6f1f8!important;
    box-shadow:inset 3px 0 0 #397ca2!important;
  }
}

/* 2026-10-21 — desktop only: never show the phone-only X close button.
   Legacy app.css reveals any title button on rail hover, which creates the
   unwanted X and a layout jump. Keep the manual hamburger toggle untouched. */
@media (min-width:901px){
  body .fixed-menu-rail .home-aside-title > button.mobile-nav-close,
  body .fixed-menu-rail:hover .home-aside-title > button.mobile-nav-close{
    display:none!important;
    visibility:hidden!important;
    flex:0 0 0!important;
    width:0!important;
    height:0!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    pointer-events:none!important;
  }
}

/* 2026-10-21: collapsed desktop rail — stable rows and readable icon tooltips.
   The legacy app.css changes report/footer row margins on ASIDE :hover,
   causing lower buttons to jump even when the rail width is fixed.
   These rules touch collapsed desktop state only; expanded/mobile stay intact. */
@media (min-width:901px){
  body.nugan-desktop-collapsed .fixed-menu-rail .nav-item,
  body.nugan-desktop-collapsed .fixed-menu-rail:hover .nav-item,
  body.nugan-desktop-collapsed .fixed-menu-rail .nav-item:hover{
    box-sizing:border-box!important;
    width:100%!important;
    height:50px!important;
    min-height:50px!important;
    max-height:50px!important;
    margin:0!important;
    padding:7px!important;
    border-top:0!important;
    border-bottom:1px solid #eef2f6!important;
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:35px!important;
    align-items:center!important;
    justify-items:center!important;
    column-gap:0!important;
    row-gap:0!important;
    transition:none!important;
    transform:none!important;
  }
  body.nugan-desktop-collapsed .fixed-menu-rail .nav-item>.rail-icon,
  body.nugan-desktop-collapsed .fixed-menu-rail:hover .nav-item>.rail-icon,
  body.nugan-desktop-collapsed .fixed-menu-rail .nav-item:hover>.rail-icon{
    width:34px!important;
    height:34px!important;
    margin:0!important;
    padding:0!important;
    align-self:center!important;
    justify-self:center!important;
    transition:none!important;
    transform:none!important;
  }
  /* No empty dark block. Label text is inserted by desktop_sidebar.js. */
  body.nugan-desktop-collapsed .fixed-menu-rail .nav-item:not([data-nugan-label])::after{
    content:none!important;
    display:none!important;
  }
  body.nugan-desktop-collapsed .fixed-menu-rail .nav-item[data-nugan-label]:is(:hover,:focus-visible)::after{
    content:attr(data-nugan-label)!important;
    display:block!important;
    position:fixed!important;
    left:72px!important;
    width:max-content!important;
    max-width:min(290px,calc(100vw - 88px))!important;
    padding:8px 11px!important;
    border-radius:7px!important;
    background:#243f56!important;
    color:#fff!important;
    font-size:12px!important;
    font-weight:600!important;
    line-height:1.3!important;
    text-align:left!important;
    white-space:normal!important;
    opacity:1!important;
    pointer-events:none!important;
    box-shadow:0 5px 16px rgba(18,49,75,.20)!important;
    z-index:300!important;
  }
}

/* Plan menu accordion — 2026-10-26, independent of KPI and user roles. */
body .fixed-menu-rail > button.nav-item.nugan-group-hidden{display:none!important}
.fixed-menu-rail > button.nugan-nav-section{
  position:relative;
  display:block;
  cursor:pointer;
  text-align:left;
  appearance:none;
  border-left:0;
  border-right:0;
  border-bottom:0;
  padding-right:28px;
}
.fixed-menu-rail > button.nugan-nav-section::after{
  content:'›';position:absolute;right:12px;top:50%;
  transform:translateY(-50%);font-size:18px;line-height:1;
  font-weight:500;color:#5a7892;
}
.fixed-menu-rail > button.nugan-nav-section.nugan-group-open::after{content:'⌄';}
.fixed-menu-rail > button.nugan-nav-section:focus-visible{
  outline:2px solid #4188b0;outline-offset:-2px
}
@media(min-width:901px){
  body.nugan-desktop-collapsed .fixed-menu-rail > button.nugan-nav-section{
    padding:0 9px!important;
  }
  body.nugan-desktop-collapsed .fixed-menu-rail > button.nugan-nav-section::after{display:none}
}
@media(max-width:900px){
  body.mobile-nav-open .fixed-menu-rail > button.nugan-nav-section{
    padding-right:28px!important;
  }
}

/* 2026-10-26: enforce actual accordion hiding in all desktop/mobile/hover states. */
#app main.layout > aside.fixed-menu-rail > button.nav-item.nugan-group-hidden,
#app main.layout > aside.fixed-menu-rail > button.nav-item.nugan-group-hidden:hover,
#app main.layout > aside.fixed-menu-rail > button.nav-item[hidden] {
  display:none!important;
}