/* Sage Intacct (on Radzen Blazor) — distilled theme for Production Units */
@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@100;300;400;500;600;700&display=swap');

:root {
  --rz-primary:         #007E45;
  --rz-primary-light:   #33986a;
  --rz-primary-lighter: rgba(0, 126, 69, 0.12);
  --rz-primary-dark:    #006537;
  --rz-primary-darker:  #00562f;

  --rz-secondary: #000000;
  --rz-info:    #2196f3;
  --rz-success: #4caf50;
  --rz-warning: #ffb500;
  --rz-danger:  #c7384f;

  --ves-danger-bg:   #c0392b;

  --rz-base-50:  #f2f5f6;
  --rz-base-100: #f2f5f6;
  --rz-base-200: #e3ebed;
  --rz-base-300: #e3ebed;
  --rz-base-400: #ccd6db;
  --rz-base-500: #acb9bc;
  --rz-base-600: #95a0a3;
  --rz-base-700: #668494;
  --rz-base-800: #666e70;
  --rz-base-900: #4f5557;

  --ves-card-border:    #cfd8dc;
  --ves-card-header-bg: #eceff1;
  --ves-text-strong:    #263238;
  --ves-text-body:      #37474f;
  --ves-text-muted:     #546e7a;

  --rz-text:           #000000;
  --rz-text-secondary: #668494;
  --rz-text-tertiary:  #95a0a3;
  --rz-text-disabled:  #acb9bc;

  --rz-shadow-1: 0 1px 2px rgba(0,0,0,.06), 0 1px 1px rgba(0,0,0,.04);
  --rz-shadow-3: 0 2px 6px rgba(0,0,0,.09), 0 4px 8px rgba(0,0,0,.05);
  --rz-shadow-4: 0 4px 10px rgba(0,0,0,.10), 0 6px 12px rgba(0,0,0,.06);
  --rz-shadow-7: 0 16px 32px rgba(0,0,0,.16);

  --rz-border-radius:   2px;
  --rz-border-radius-2: 4px;
  --rz-border-radius-4: 8px;
  --rz-border-radius-9: 999px;
}

.pu-shell * { box-sizing: border-box; }

.pu-shell {
  font-family: "Archivo", Arial, Helvetica, sans-serif;
  font-size: 13px;
  line-height: 1.42;
  color: #000;
  background: #f2f5f6;
  -webkit-font-smoothing: antialiased;
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
}

.pu-shell a { color: #007E45; text-decoration: none; }
.pu-shell a:hover { text-decoration: underline; color: #006537; }

/* ----- Buttons (Sage pill) ----- */
.pu-shell .btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 16px;
  font-size: 13px; font-weight: 400; line-height: 1.25rem;
  text-transform: capitalize;
  border-radius: 999px;
  border: none; cursor: pointer; color: #fff;
  font-family: inherit;
  background: #007E45;
  transition: background 0s linear;
  white-space: nowrap;
}
.pu-shell .btn:hover { background: #006537; }
.pu-shell .btn:active { background: #00562f; }
.pu-shell .btn-secondary { background: #000; }
.pu-shell .btn-secondary:hover { background: #333; }
.pu-shell .btn-success { background: #4caf50; }
.pu-shell .btn-warning { background: #ffb500; color: #000; }
.pu-shell .btn-danger { background: #c7384f; }
.pu-shell .btn-danger:hover { background: #9f2d3f; }

.pu-shell .btn-outline {
  background: #fff;
  color: #007E45;
  box-shadow: inset 0 0 0 2px #007E45;
}
.pu-shell .btn-outline:hover { color: #006537; box-shadow: inset 0 0 0 2px #006537; }
.pu-shell .btn-outline-black {
  background: #fff;
  color: #000;
  box-shadow: inset 0 0 0 2px #000;
}
.pu-shell .btn-outline-danger {
  background: #fff;
  color: #c7384f;
  box-shadow: inset 0 0 0 2px #c7384f;
}
.pu-shell .btn-text {
  background: transparent;
  color: #007E45;
}
.pu-shell .btn-text:hover { background: rgba(0,126,69,0.08); }
.pu-shell .btn-icon { padding: 6px; }
.pu-shell .btn-xs { padding: 3px 10px; font-size: 12px; }
.pu-shell .btn:disabled { opacity: 0.5; cursor: default; }

/* ----- Inputs ----- */
.pu-shell .input {
  display: block; width: 100%;
  height: 30px; padding: 3px 8px;
  font-size: 13px; line-height: 1.42;
  color: #000; background: #fff;
  border: 1px solid #ccd6db; border-radius: 2px;
  font-family: inherit;
}
.pu-shell .input:focus { outline: 0; border-color: #007E45; box-shadow: inset 0 0 0 1px #007E45; }
.pu-shell .input:hover:not(:focus) { border-color: #4f5557; }
.pu-shell .input.is-invalid { border-color: #c7384f; box-shadow: inset 0 0 0 1px #c7384f; }
.pu-shell .label { font-size: 12px; font-weight: 500; color: #000; display: block; margin-bottom: 3px; }
.pu-shell .help { font-size: 11px; color: #668494; }
.pu-shell .err  { font-size: 11px; color: #c7384f; font-weight: 500; }

/* ----- ves-card ----- */
.pu-shell .ves-card {
  background: #fff;
  border: 1px solid #cfd8dc;
  border-radius: 8px;
  overflow: hidden;
  margin-bottom: 0;
}
.pu-shell .ves-card-header {
  background: #eceff1;
  border-bottom: 1px solid #cfd8dc;
  padding: 8px 14px;
  display: flex; align-items: center; gap: 12px;
}
.pu-shell .ves-card-header-title { font-size: 14px; font-weight: 600; color: #263238; margin: 0; flex: 1; }
.pu-shell .ves-card-body { padding: 12px 14px; font-size: 13px; }

/* ----- Chips ----- */
.pu-shell .chip { display: inline-flex; align-items: center; padding: 2px 10px; border-radius: 999px; font-size: 11px; font-weight: 500; }
.pu-shell .chip-ok    { background: rgba(76,175,80,.16);  color: #347736; }
.pu-shell .chip-pend  { background: rgba(255,183,0,.2);   color: #a87900; }
.pu-shell .chip-err   { background: rgba(199,56,79,.2);   color: #872636; }
.pu-shell .chip-info  { background: rgba(33,150,243,.2);  color: #1666a5; }
.pu-shell .chip-prim  { background: rgba(0,126,69,.12);   color: #00562f; }
.pu-shell .chip-neutral { background: #e3ebed; color: #4f5557; }

/* ----- Data grid ----- */
.pu-shell .grid { width: 100%; border-collapse: collapse; background: #fff; font-size: 13px; }
.pu-shell .grid thead th {
  background: #fff;
  padding: 8px 12px;
  text-align: left;
  font-weight: 700;
  font-size: 13px;
  color: #000;
  border-bottom: 2px solid #ccd6db;
  white-space: nowrap;
  user-select: none;
}
.pu-shell .grid thead th:hover { color: #007E45; cursor: pointer; }
.pu-shell .grid tbody td { padding: 7px 12px; border-bottom: 1px solid #e3ebed; }
.pu-shell .grid tbody tr:last-child td { border-bottom: 0; }
.pu-shell .grid tbody tr:hover { background: rgba(0,0,0,.03); cursor: pointer; }
.pu-shell .grid tbody tr.selected td { background: rgba(0,126,69,0.12); }
.pu-shell .num { font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap; }
.pu-shell .neg { color: #c7384f; }

/* ----- Tabs ----- */
.pu-shell .tabs-nav { background: #fff; box-shadow: 0px 2px 2px -2px rgba(0,0,0,0.6); display: flex; padding: 0 12px; }
.pu-shell .tab { padding: 10px 18px; font-size: 13px; font-weight: 500; cursor: pointer; border-bottom: 4px solid transparent; color: #4f5557; }
.pu-shell .tab.selected { border-bottom-color: #007E45; color: #007E45; }
.pu-shell .tab:hover:not(.selected) { color: #000; }

/* ----- Modal ----- */
.pu-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.4); display: flex; align-items: center; justify-content: center; z-index: 1000; }
.pu-dialog { background: #fff; border-radius: 4px; box-shadow: var(--rz-shadow-7); width: 520px; max-width: 92vw; overflow: hidden; display: flex; flex-direction: column; }
.pu-dialog-h { padding: 12px 18px; border-bottom: 1px solid #ccd6db; display: flex; align-items: center; justify-content: space-between; font-size: 15px; font-weight: 600; color: #263238; }
.pu-dialog-b { padding: 16px 18px; display: flex; flex-direction: column; gap: 12px; }
.pu-dialog-f { padding: 10px 18px; border-top: 1px solid #ccd6db; display: flex; gap: 8px; justify-content: flex-end; }

/* ----- Misc ----- */
.pu-shell .row-flex { display: flex; align-items: center; gap: 8px; }
.pu-shell .spacer { flex: 1; }
.pu-shell .text-muted { color: #668494; }
.pu-shell .text-strong { color: #263238; }

/* ===== Page-specific: editable grid + animations ======================== */

/* editable input column tint */
.pu-grid thead th.inp-hdr { background: #fdeccd; color: #8a5a00; border-bottom-color: #e8b35e; }
.pu-grid td.inp-cell { background: #fff8ee; padding: 2px 6px; }
.pu-grid tbody tr:hover td.inp-cell { background: #fff3e0; }

.cellinput {
  width: 100%; height: 28px; border: 1px solid transparent; background: transparent;
  font-family: "Archivo", Arial, Helvetica, sans-serif; font-size: 13px; padding: 2px 6px;
  border-radius: 2px; color: #000;
  font-variant-numeric: tabular-nums;
}
.cellinput:hover:not(:focus) { border-color: #e0c79a; background: #fff; }
.cellinput:focus { outline: 0; border-color: #007E45; background: #fff; box-shadow: inset 0 0 0 1px #007E45; }
.cellinput::placeholder { color: #c4b89e; }
.cellinput.cell-err { border-color: #c7384f; background: #fdecea; box-shadow: inset 0 0 0 1px #c7384f; }
.cellinput.cell-err::placeholder { color: #e0a0aa; }

.pu-grid tbody tr:hover { background: rgba(0,0,0,.02); }
.pu-grid tbody td { padding: 6px 12px; }

/* animations */
@keyframes pu-toastIn { from { opacity: 0; transform: translateX(20px); } to { opacity: 1; transform: none; } }
@keyframes pu-slideIn { from { transform: translateX(40px); opacity: .6; } to { transform: none; opacity: 1; } }
@keyframes pu-fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes pu-spin { to { transform: rotate(360deg); } }
/* indeterminate progress: an all-or-nothing post has no meaningful percentage (#26786) */
@keyframes pu-indeterminate { 0% { left: -40%; } 100% { left: 100%; } }

.pu-toast-in { animation: pu-toastIn .18s ease-out; }
.pu-slide-in { animation: pu-slideIn .2s ease-out; }
.pu-fade-in { animation: pu-fadeIn .15s; }
.pu-spin { animation: pu-spin 1s linear infinite; }
.pu-progress-track { position: relative; height: 8px; background: #d4ead4; border-radius: 999px; overflow: hidden; }
.pu-progress-bar { position: absolute; top: 0; height: 100%; width: 40%; border-radius: 999px;
    background: linear-gradient(90deg, #007E45, #4caf50); animation: pu-indeterminate 1.1s ease-in-out infinite; }

/* scrollbar */
.pu-shell ::-webkit-scrollbar { width: 11px; height: 11px; }
.pu-shell ::-webkit-scrollbar-thumb { background: #ccd6db; border-radius: 99px; border: 3px solid #f2f5f6; }
.pu-shell ::-webkit-scrollbar-thumb:hover { background: #acb9bc; }