/* v1.396: responsive light workspace, compact renewals and symmetric card motion. */

/* Offer fields share column widths with their captions. Keep the native controls
   and all pricing handlers; only the presentation changes. */
body.angel-ui-refresh .offerWizard {
  --offer-columns:24px minmax(150px,2.2fr) 108px 64px minmax(84px,.85fr) 64px minmax(84px,.85fr) minmax(100px,1fr) minmax(84px,.8fr);
  --offer-custom-columns:minmax(150px,2.2fr) 132px 64px minmax(84px,.85fr) 64px minmax(84px,.85fr) minmax(100px,1fr) minmax(84px,.8fr) 34px;
}
body.angel-ui-refresh .offerWizard .offerSetupCard:has(.offerOsField) {
  overflow:visible!important;
  position:relative;
}
body.angel-ui-refresh .offerWizard .offerSetupCard:has(.osMultiMenu:not([hidden])) { z-index:3; }
body.angel-ui-refresh .offerWizard .offerSetupCardHead { border-radius:inherit; border-bottom-left-radius:0; border-bottom-right-radius:0; }
body.angel-ui-refresh .offerWizard :is(.offerProductList,.offerServiceList) {
  max-height:min(480px,60vh)!important;
  min-height:0!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain!important;
  scrollbar-gutter:stable!important;
  scrollbar-width:thin;
  padding:8px 10px!important;
}
body.angel-ui-refresh .offerWizard .offerColumnsHeader {
  display:grid;
  grid-template-columns:var(--offer-columns);
  gap:8px;
  align-items:center;
  padding:9px 26px 9px 18px;
  background:var(--panel2);
  border-bottom:1px solid var(--line);
  color:var(--muted);
  font-size:10px;
  line-height:1.4;
  font-weight:600;
}
body.angel-ui-refresh .offerWizard .offerCustomColumnsHeader { grid-template-columns:var(--offer-custom-columns); padding-right:18px; }
body.angel-ui-refresh .offerWizard :is(.offerProductRow,.offerServiceRow,.offerCustomRow) {
  display:grid!important;
  grid-template-columns:var(--offer-columns)!important;
  min-width:0!important;
  max-width:100%!important;
  width:100%!important;
  gap:8px!important;
  padding:10px 8px!important;
  align-items:center;
  border-radius:8px!important;
}
body.angel-ui-refresh .offerWizard :is(.offerProductRow,.offerServiceRow) { min-height:90px; }
body.angel-ui-refresh .offerWizard :is(.offerProductRow,.offerServiceRow).offerSearchHidden { display:none!important; }
body.angel-ui-refresh .offerWizard .offerCustomRow { grid-template-columns:var(--offer-custom-columns)!important; }
body.angel-ui-refresh .offerWizard :is(.offerProductRow,.offerServiceRow,.offerCustomRow) > * {
  min-width:0!important;
  grid-column:auto!important;
  grid-row:auto!important;
}
body.angel-ui-refresh .offerWizard .offerCell { display:block; min-width:0; }
body.angel-ui-refresh .offerWizard .offerCellCaption { display:none; }
body.angel-ui-refresh .offerWizard .offerCell :is(input,select,.styledSelect) {
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  box-sizing:border-box;
}
body.angel-ui-refresh .offerWizard .offerCell :is(.offerLineTotal,.offerServiceTotal,.customTotal) {
  display:block;
  min-width:0!important;
  overflow-wrap:anywhere;
  white-space:normal!important;
  text-align:right;
}
body.angel-ui-refresh .offerWizard .offerCustomRow .styledSelect button {
  width:100%!important;
  height:auto!important;
  min-height:38px!important;
  background:var(--panel)!important;
  color:var(--text)!important;
  font:inherit!important;
  text-align:left;
  grid-column:auto!important;
  grid-row:auto!important;
}
body.angel-ui-refresh .offerWizard .offerCustomRow .styledSelect button:hover { outline:none!important; background:var(--panel2)!important; }
body.angel-ui-refresh .offerWizard .offerCustomRow .styledSelectMenu button.selected { color:var(--av-blue-text)!important; background:var(--blue2)!important; }
body.angel-ui-refresh .offerWizard .customUnitCell { min-width:132px!important; }
body.angel-ui-refresh .offerWizard .offerCustomRow > button { grid-column:-2!important; justify-self:end; }
body.angel-ui-refresh .offerWizard .offerProductTitle,
body.angel-ui-refresh .offerWizard .offerServiceTitle { min-width:0; overflow-wrap:anywhere; }

@media(max-width:1180px) {
  body.angel-ui-refresh .offerWizard .offerColumnsHeader { display:none; }
  body.angel-ui-refresh .offerWizard :is(.offerProductRow,.offerServiceRow,.offerCustomRow) {
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:12px!important;
    padding:14px 10px!important;
    border-bottom:1px solid var(--line)!important;
  }
  body.angel-ui-refresh .offerWizard :is(.offerProductRow,.offerServiceRow) > input[type=checkbox] { grid-column:1!important; grid-row:1!important; }
  body.angel-ui-refresh .offerWizard :is(.offerProductTitle,.offerServiceTitle) { grid-column:1/-1!important; grid-row:1!important; padding-left:32px; }
  body.angel-ui-refresh .offerWizard .customNameCell { grid-column:1/-1!important; grid-row:1!important; padding-right:44px; }
  body.angel-ui-refresh .offerWizard .offerCustomRow > button { grid-column:4!important; grid-row:1!important; }
  body.angel-ui-refresh .offerWizard .offerCellCaption { display:block; font-size:10px; line-height:1.4; color:var(--muted); margin-bottom:5px; font-weight:500; }
  body.angel-ui-refresh .offerWizard .customUnitCell { min-width:0!important; }
  body.angel-ui-refresh .offerWizard .offerCell :is(.offerLineTotal,.offerServiceTotal,.customTotal) { text-align:left; }
}
@media(max-width:580px) {
  body.angel-ui-refresh .offerWizard :is(.offerProductRow,.offerServiceRow,.offerCustomRow) { grid-template-columns:repeat(2,minmax(0,1fr))!important; }
  body.angel-ui-refresh .offerWizard .offerCustomRow > button { grid-column:2!important; }
  body.angel-ui-refresh .offerWizard :is(.offerVatCell,.offerServiceVatCell,.customVatCell) { grid-column:1/-1!important; }
}

/* Hide only the rail; the menu remains a native wheel, touch and keyboard scroller. */
body.angel-ui-refresh .side .nav {
  scrollbar-width:none!important;
  -ms-overflow-style:none;
  scrollbar-gutter:auto!important;
}
body.angel-ui-refresh .side .nav::-webkit-scrollbar {
  display:none!important;
  width:0!important;
  height:0!important;
}

body.angel-ui-refresh :is(.workspace,#content,#viewArea) {
  min-width:0!important;
  max-width:100%!important;
}
body.angel-ui-refresh #viewArea > :is(.pipelineBoard,.tablePanel) {
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
}

/* Let existing column percentages and wrapped text determine the table size.
   Wide data remains scrollable inside its own table, without moving the page. */
body.angel-ui-refresh:not(.mobileMode) #viewArea .tablePanel:not(.organizationListTable) > .dataTable {
  min-width:0!important;
  width:100%!important;
}
body.angel-ui-refresh #viewArea .tablePanel {
  overflow-x:auto!important;
  scrollbar-gutter:auto!important;
}
body.angel-ui-refresh .smartFilters > * {
  min-width:0!important;
  max-width:100%!important;
}

@media (min-width:761px) {
  body.angel-ui-refresh:not(.mobileMode) #viewArea .pipelineBoard {
    display:grid!important;
    grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr))!important;
    gap:12px!important;
    padding:3px 2px 8px!important;
    align-items:stretch;
    overflow:visible!important;
  }
  body.angel-ui-refresh:not(.mobileMode) #viewArea .pipelineBoard > .pcol {
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    min-height:320px!important;
    flex:auto!important;
  }
  body.angel-ui-refresh .pipelineBoard :is(.phead,.pCard,.pTitle,.pMeta,.pFoot) {
    min-width:0!important;
    overflow-wrap:anywhere;
  }
  body.angel-ui-refresh .pipelineBoard .phead {
    gap:8px;
  }
  body.angel-ui-refresh .pipelineBoard .phead > span {
    flex-shrink:0;
  }
}

@media (min-width:1180px) {
  body.angel-ui-refresh:not(.mobileMode) #viewArea .pipelineBoard {
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
  }
}
@media (min-width:761px) and (max-width:1450px) {
  body.angel-ui-refresh .dashKpiGrid { grid-template-columns:repeat(3,minmax(0,1fr))!important; }
}

/* Preserve a card's position when switching its tabs or returning to a parent.
   Only changing .open moves the drawer; width changes still support fullscreen. */
html body.angel-ui-refresh #drawer.drawer {
  right:0!important;
  left:auto!important;
  transform:translate3d(100%,0,0)!important;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:transform .24s cubic-bezier(.22,.61,.36,1),opacity .18s ease,
    visibility 0s linear .24s,width .28s cubic-bezier(.22,.61,.36,1),
    max-width .28s cubic-bezier(.22,.61,.36,1),border-radius .24s ease!important;
  will-change:auto;
}
html body.angel-ui-refresh #drawer.drawer.open {
  transform:translate3d(0,0,0)!important;
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transition-delay:0s!important;
}
html body.angel-ui-refresh #drawer.drawer.drawerResizing {
  transition:none!important;
}
@media (min-width:981px) {
  html body.angel-ui-refresh #drawer.drawer:not(.fullscreen) {
    width:var(--drawer-user-width,820px)!important;
    max-width:calc(100vw - 42px)!important;
  }
}
@media (prefers-reduced-motion:reduce) {
  html body.angel-ui-refresh #drawer.drawer {
    transition:none!important;
  }
}

/* A quiet summary, with all year, factory and detail controls retained. */
body.angel-ui-refresh .renewalStatsPanel,
body.angel-ui-refresh .renewalStatsPanel :is(button,input,select,table,h2,b,small,em,span,p) {
  font-family:inherit!important;
}
body.angel-ui-refresh .renewalStatsPanel {
  background:var(--panel)!important;
  box-shadow:none!important;
  min-height:0!important;
}
body.angel-ui-refresh .renewalStatsPanel .panelHead {
  padding:12px 16px!important;
  gap:12px!important;
  align-items:center!important;
  background:var(--panel)!important;
}
body.angel-ui-refresh .renewalStatsHeading { gap:9px!important; }
body.angel-ui-refresh .renewalStatsHeading h2 {
  font-size:13px!important;
  line-height:1.4!important;
  font-weight:600!important;
  letter-spacing:0!important;
}
body.angel-ui-refresh .renewalStatsHeading p {
  margin-top:2px!important;
  font-size:10px!important;
  font-weight:400!important;
  line-height:1.4!important;
}
body.angel-ui-refresh .renewalStatsIcon {
  width:28px!important;
  height:28px!important;
  flex:0 0 28px!important;
  border-radius:7px!important;
  background:var(--blue2)!important;
  color:var(--av-blue-text)!important;
  box-shadow:none!important;
  font-size:18px!important;
  font-weight:500!important;
}
body.angel-ui-refresh .renewalStatsActions {
  gap:7px!important;
  align-items:center!important;
  flex-wrap:wrap!important;
}
body.angel-ui-refresh .renewalStatsActions label {
  display:flex!important;
  align-items:center!important;
  gap:6px!important;
  width:auto!important;
}
body.angel-ui-refresh .renewalStatsActions label > span {
  margin:0!important;
  font-size:10px!important;
  font-weight:500!important;
  letter-spacing:0!important;
  text-transform:none!important;
}
body.angel-ui-refresh .renewalStatsActions :is(select,.styledSelect) {
  min-width:76px!important;
  width:76px!important;
}
body.angel-ui-refresh .renewalStatsActions :is(select,.styledSelectButton,.renewalFactoryBtn,.renewalDetailsBtn) {
  height:30px!important;
  min-height:30px!important;
  width:auto;
  padding:5px 10px!important;
  border:1px solid var(--line)!important;
  border-radius:7px!important;
  background:var(--panel)!important;
  color:var(--av-blue-text)!important;
  box-shadow:none!important;
  font-size:10px!important;
  font-weight:550!important;
  line-height:1.3!important;
}
body.angel-ui-refresh .renewalStatsActions select {
  padding-right:24px!important;
  color:var(--text)!important;
}
body.angel-ui-refresh .renewalStatsActions .renewalDetailsBtn {
  width:auto!important;
  background:var(--blue2)!important;
  border-color:var(--blue2)!important;
}
body.angel-ui-refresh .renewalStatsActions button:hover {
  background:var(--av-hover)!important;
  border-color:var(--av-control)!important;
}
body.angel-ui-refresh .renewalKpiGrid {
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  padding:12px 16px 8px!important;
  gap:0!important;
}
body.angel-ui-refresh .renewalKpi {
  padding:0 14px!important;
  gap:8px!important;
  background:transparent!important;
  border:0!important;
  border-left:1px solid var(--line)!important;
  border-radius:0!important;
}
body.angel-ui-refresh .renewalKpi:first-child {
  padding-left:0!important;
  border-left:0!important;
}
body.angel-ui-refresh .renewalKpi:last-child { padding-right:0!important; }
body.angel-ui-refresh .renewalKpiIcon { display:none!important; }
body.angel-ui-refresh .renewalKpi small {
  font-size:10px!important;
  font-weight:500!important;
  color:var(--muted)!important;
  white-space:normal!important;
  line-height:1.35!important;
}
body.angel-ui-refresh .renewalKpi b {
  margin:4px 0 2px!important;
  font-size:18px!important;
  line-height:1.2!important;
  font-weight:600!important;
  font-variant-numeric:tabular-nums;
  letter-spacing:-.025em!important;
  color:var(--text)!important;
  white-space:normal!important;
  overflow-wrap:anywhere;
}
body.angel-ui-refresh .renewalKpi.success b { color:var(--av-green-text)!important; }
body.angel-ui-refresh .renewalKpi.danger b { color:var(--av-red-text)!important; }
body.angel-ui-refresh .renewalKpi.pending b { color:var(--av-amber-text)!important; }
body.angel-ui-refresh .renewalKpi em { font-size:9px!important; font-weight:400!important; }
body.angel-ui-refresh .renewalProgressBlock { padding:3px 16px 10px!important; }
body.angel-ui-refresh .renewalProgressLabels { display:none!important; }
body.angel-ui-refresh .renewalProgress { height:3px!important; }
body.angel-ui-refresh .renewalEmployeeSection {
  margin:0 16px 12px!important;
  border-radius:7px!important;
  border-color:var(--line)!important;
}
body.angel-ui-refresh .renewalEmployeeHead { padding:8px 10px!important; }
body.angel-ui-refresh .renewalEmployeeHead b { font-size:11px!important; font-weight:550!important; }
body.angel-ui-refresh .renewalTable :is(th,td) {
  padding:7px 10px!important;
  font-size:10px!important;
  font-weight:450!important;
}
body.angel-ui-refresh .renewalTable th {
  font-size:9px!important;
  font-weight:500!important;
  letter-spacing:0!important;
  text-transform:none!important;
  background:var(--panel2)!important;
}
body.angel-ui-refresh .renewalTable tbody tr:last-child td { border-bottom:0!important; }
body.angel-ui-refresh .renewalEmployeeSection:has(.renewalEmptyRow) :is(.renewalEmployeeHead,thead) {
  display:none!important;
}
body.angel-ui-refresh .renewalEmptyRow td { padding:9px 10px!important; }
body.angel-ui-refresh .renewalEmptyState {
  margin:12px 16px!important;
  padding:12px!important;
  font-size:11px!important;
  border-radius:7px!important;
}
@media (max-width:1100px) {
  body.angel-ui-refresh .renewalStatsPanel .panelHead {
    flex-wrap:wrap!important;
    flex-direction:row!important;
  }
  body.angel-ui-refresh .renewalStatsActions {
    width:auto!important;
    justify-content:flex-start!important;
  }
}
@media (max-width:600px) {
  body.angel-ui-refresh .renewalStatsPanel .panelHead { padding:12px!important; }
  body.angel-ui-refresh .renewalKpiGrid {
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    padding:10px 12px 8px!important;
    row-gap:14px!important;
  }
  body.angel-ui-refresh .renewalKpi:nth-child(odd) {
    padding-left:0!important;
    border-left:0!important;
  }
  body.angel-ui-refresh .renewalKpi:nth-child(even) { padding-right:0!important; }
  body.angel-ui-refresh .renewalStatsActions { gap:6px!important; }
  body.angel-ui-refresh .renewalStatsActions :is(.renewalFactoryBtn,.renewalDetailsBtn) {
    min-height:36px!important;
    height:auto!important;
  }
  body.angel-ui-refresh .renewalProgressBlock { padding:3px 12px 10px!important; }
  body.angel-ui-refresh .renewalEmployeeSection { margin:0 12px 12px!important; }
}

/* The month remains navigable while its events are being requested. */
.calendarLoadStatus{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:10px 14px;margin-bottom:12px;border:1px solid #dce6f5;border-radius:12px;background:#f2f6ff;color:#46628c;font-size:13px}