/* Standalone backoffice page: do not inherit the headquarters sidebar grid. */
body {
  display: block;
  background: #f4f6f2;
  color: #183a36;
  min-width: 0;
}
.invoice-shell {
  width: 100%;
  max-width: 1320px;
  min-width: 0;
  margin: 0 auto;
  padding: 28px 32px 60px;
}
.invoice-shell > .detail-head { margin-bottom: 20px; }
.invoice-shell h1 { margin: 12px 0 6px; font-size: 30px; }
.invoice-shell h2 { margin: 0 0 8px; font-size: 21px; }
.invoice-shell h3 { font-size: 18px; line-height: 1.5; }
.invoice-shell .meta { line-height: 1.7; }
.invoice-shell a { color: #286b5e; }
/* Navigation to the separate grocery receipt review page. */
.invoice-shell .grocery-receipts-entry {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 48px;
  max-width: 100%;
  margin: 10px 0 2px;
  padding: 11px 16px;
  border: 1px solid #9cbbb0;
  border-radius: 10px;
  background: #e7f1eb;
  color: #20584d;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.5;
  text-decoration: none;
  touch-action: manipulation;
}
.invoice-shell .grocery-receipts-entry span { min-width: 0; overflow-wrap: anywhere; }
.invoice-shell .grocery-receipts-entry svg { flex: none; }
.invoice-shell .grocery-receipts-entry:hover { background: #d9e9df; border-color: #669780; color: #20584d; }
.invoice-shell .grocery-receipts-entry:active { background: #ccdfd3; }
.invoice-shell .grocery-receipts-entry:focus-visible { outline: 3px solid #2586c7; outline-offset: 3px; }
@media (max-width: 600px) {
  .invoice-shell > .detail-head { grid-template-columns: minmax(0, 1fr); }
  .invoice-shell > .detail-head > div { width: 100%; }
  .invoice-shell .grocery-receipts-entry { width: 100%; }
}
.invoice-shell [hidden] { display: none !important; }
#invoice-message:empty { display: none; }
#invoice-message { padding: 12px 16px; background: #fff; border-radius: 10px; }
#invoice-upload-view { display: grid; gap: 24px; min-width: 0; }
.invoice-shell .panel {
  width: 100%;
  max-width: none;
  min-width: 0;
  margin: 0;
  padding: 28px;
  border: 1px solid #dfe7e1;
  border-radius: 18px;
}
.invoice-shell .scanned-invoice-upload-panel {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(280px, 1fr);
  gap: 24px 32px;
  align-items: start;
}
.invoice-shell .scanned-invoice-upload-panel > .detail-head { grid-column: 1 / -1; margin: 0; }
.invoice-shell .detail-head { gap: 16px; flex-wrap: wrap; }
.invoice-shell .detail-head > div { min-width: 0; }
.invoice-shell .scanned-invoice-form { min-width: 0; }
.invoice-shell .invoice-file-drop { min-height: 230px; padding: 24px; align-content: center; }
.invoice-shell .invoice-file-drop strong { font-size: 17px; }
.invoice-shell .invoice-file-drop small { max-width: 480px; font-size: 13px; line-height: 1.7; font-weight: 400; }
.invoice-shell input[type=file] { min-width: 0; max-width: 100%; }
.invoice-shell input[type=file]::file-selector-button {
  margin-right: 12px; padding: 8px 14px; border: 1px solid #cbd8d1;
  border-radius: 7px; background: #fff; color: #183a36; cursor: pointer;
}
.invoice-shell button { min-height: 44px; max-width: 100%; line-height: 1.5; }
.invoice-shell .primary { background: #286b5e; border-color: #286b5e; font-weight: 700; }
.invoice-shell .windows-scanner-setup {
  display: flex; flex-direction: column; align-items: stretch;
  min-width: 0; margin: 0; padding: 24px; gap: 20px;
  border-color: #d4e2d9; background: #f3f8f4;
}
.invoice-shell .windows-scanner-setup > div { min-width: 0; }
.invoice-shell .windows-scanner-setup h3 { margin: 0 0 12px; }
.invoice-shell .windows-scanner-setup .meta { margin: 0 0 12px; }
.invoice-shell .windows-scanner-setup button { width: 100%; white-space: normal; }
.invoice-shell .scanned-invoice-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.invoice-shell .scanned-invoice-list > .meta:only-child { grid-column: 1 / -1; padding: 24px 0; text-align: center; }
.invoice-shell .scanned-invoice-card { min-width: 0; }
.invoice-shell .scanned-invoice-file-link { max-width: 100%; overflow-wrap: anywhere; }
.invoice-shell .scanned-invoice-page-item { min-width: 0; }
@media (max-width: 900px) {
  .invoice-shell { padding: 24px 20px 48px; }
  .invoice-shell .scanned-invoice-upload-panel { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .invoice-shell .scanned-invoice-list { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
  .invoice-shell { padding: 18px 12px 40px; }
  .invoice-shell h1 { font-size: 26px; }
  .invoice-shell .panel { padding: 18px; border-radius: 14px; }
  .invoice-shell .invoice-file-drop { min-height: 220px; padding: 20px 12px; }
  .invoice-shell .windows-scanner-setup { padding: 18px; }
  .invoice-shell .scanned-invoice-draft-actions { flex-direction: column; }
}

/* Match headquarters folder navigation while retaining the store upload form. */
.invoice-shell #store-scanned-invoice-list { display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px; }
.store-invoice-summary { display: flex; flex-wrap: wrap; gap: 24px; padding: 12px 4px; }
.invoice-shell .invoice-browser-toolbar { flex-wrap: wrap; }
.invoice-shell .invoice-browser-grid { grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); }
.invoice-shell .invoice-browser-folder { width: 100%; min-height: 180px; }
.invoice-shell .invoice-folder-icon { display: block; position: relative; width: 76px; height: 58px; margin: 12px 0; border: 2px solid #159bce; border-radius: 10px; background: linear-gradient(#58cdf1,#28a8db); box-shadow: 0 8px 14px #247e9e22; }
.invoice-shell .invoice-folder-icon::before { content: ''; position: absolute; top: -12px; left: 4px; width: 32px; height: 14px; background: #51c4ec; border: 2px solid #159bce; border-bottom: 0; border-radius: 8px 8px 0 0; }
.invoice-shell .invoice-folder-icon::after { content: ''; position: absolute; top: 7px; left: 5px; right: 5px; height: 4px; border-radius: 5px; background: #b5edff; }
@media(max-width:600px) {
 .invoice-shell .invoice-browser-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; padding: 10px; }
 .invoice-shell .invoice-browser-folder { min-height: 160px; }
 .invoice-shell .invoice-browser-back { width: 100%; }
}

/* Automatic scanning is the primary workflow; manual tools stay collapsed. */
.invoice-shell .compact-upload-panel { display: flex; flex-wrap: wrap; gap: 14px 24px; align-items: center; padding: 16px 20px; }
.invoice-shell .compact-upload-panel .windows-scanner-setup { order: 0; flex: 1 1 340px; flex-direction: row; align-items: center; justify-content: space-between; margin: 0; padding: 0; border: 0; background: transparent; gap: 16px; }
.invoice-shell .compact-upload-panel .windows-scanner-setup h3 { margin: 0 0 3px; font-size: 16px; }
.invoice-shell .compact-upload-panel .windows-scanner-setup .meta { margin: 0; font-size: 13px; }
.invoice-shell .compact-upload-panel .windows-scanner-setup > div > .meta:first-of-type { display: none; }
.invoice-shell .manual-invoice-upload { order: 1; flex: 0 1 220px; min-width: 0; }
.invoice-shell .manual-invoice-upload[open] { flex: 1 0 100%; padding-top: 12px; border-top: 1px solid #dfe7e1; }
.invoice-shell .manual-invoice-upload summary,
.invoice-shell .scanner-installer-options summary { cursor: pointer; padding: 10px 12px; border: 1px solid #d4ded7; border-radius: 9px; font-size: 14px; background: #fff; color: #286b5e; }
.invoice-shell .manual-invoice-upload .scanned-invoice-form { max-width: 720px; margin: 16px auto 4px; }
.invoice-shell .manual-invoice-upload .invoice-file-drop { min-height: 130px; padding: 16px; gap: 6px; }
.invoice-shell .manual-invoice-upload .invoice-file-icon { font-size: 24px; }
.invoice-shell .scanner-installer-options { flex: 0 0 auto; max-width: 100%; }
.invoice-shell .scanner-installer-options button { margin-top: 10px; }
@media(max-width:600px) {
 .invoice-shell .compact-upload-panel { padding: 14px; gap: 12px; }
 .invoice-shell .compact-upload-panel .windows-scanner-setup { flex-basis: 100%; flex-wrap: wrap; gap: 10px; }
 .invoice-shell .manual-invoice-upload { flex-basis: 100%; }
}

.invoice-shell .store-invoice-filters { display: grid; grid-template-columns: minmax(130px,1fr) minmax(200px,2fr) minmax(160px,1fr); gap: 12px; margin: 16px 0; }
.invoice-shell .store-invoice-filters label { display: grid; gap: 6px; min-width: 0; font-size: 13px; }
.invoice-shell .store-invoice-filters :is(input,select) { width: 100%; min-width: 0; height: 44px; }
.invoice-shell .store-invoice-meta { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; margin-bottom: 16px; }
.invoice-shell :is(.store-invoice-order,.store-invoice-card-actions) { display:flex; align-items:center; flex-wrap:wrap; gap:8px; }
.invoice-shell :is(.store-invoice-departments,.store-invoice-initials) { display:flex; flex-flow:row nowrap; align-items:center; gap:6px; width:100%; min-width:0; overflow-x:auto; padding-bottom:6px; }
.invoice-shell :is(.store-invoice-departments,.store-invoice-initials) > * { flex:0 0 auto; width:auto; white-space:nowrap; }
.invoice-shell .store-invoice-initials button { min-width:32px; min-height:34px; padding:6px 9px; font-size:13px; }
.invoice-shell [aria-pressed="true"] { background:#286b5e; color:#fff; border-color:#286b5e; }
.invoice-shell .store-invoice-initials button:disabled { opacity:.35; }
.invoice-shell .invoice-browser-toolbar { padding:8px 0; border:0; background:transparent; }
.invoice-shell .invoice-browser-grid { background:transparent; border:0; padding:0; }
.invoice-shell .invoice-browser-folder { background:#fff; border:1px solid #dfe7e1; min-height:140px; }
@media(max-width:600px) {
 .invoice-shell .store-invoice-filters { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .invoice-shell .store-invoice-filters label:nth-child(2) { grid-column:span 2; grid-row:2; }
 .invoice-shell .store-invoice-order { flex-wrap:nowrap; font-size:13px; }
 .invoice-shell .store-invoice-order button { font-size:13px; padding:8px; }
}

.invoice-shell .store-invoice-controls { display: flex; align-items: flex-end; gap: 14px; min-width: 0; width: 100%; overflow-x: auto; margin: 16px 0; padding-bottom: 12px; border-bottom: 1px solid #dfe7e1; }
.invoice-shell .store-invoice-controls .store-invoice-filters { flex: 1 0 480px; width: auto; grid-template-columns: 120px minmax(180px, 1fr) 156px; gap: 12px; margin: 0; }
.invoice-shell .store-invoice-controls .store-invoice-filters label { grid-column: auto; grid-row: auto; }
.invoice-shell .store-invoice-controls .store-invoice-meta { flex: 0 0 auto; flex-wrap: nowrap; align-items: flex-end; gap: 12px; margin: 0; }
.invoice-shell .store-invoice-controls .store-invoice-order { display: grid; grid-template-columns: repeat(2, auto); gap: 6px; }
.invoice-shell .store-invoice-controls .store-invoice-order > span { grid-column: 1 / -1; font-size: 13px; }
.invoice-shell .store-invoice-controls .store-invoice-order > button { white-space: nowrap; font-size: 13px; height: 44px; }
.invoice-shell .store-invoice-controls #store-invoice-summary { display: flex; align-items: center; height: 44px; margin: 0; font-size: 13px; white-space: nowrap; }

.invoice-shell .store-invoice-controls .store-invoice-filters { flex: 0 0 auto; grid-template-columns: 150px 260px 180px; }


.invoice-shell .compact-upload-panel details.windows-scanner-setup{display:block;flex:0 1 auto}
.invoice-shell .windows-scanner-setup>summary{cursor:pointer;display:inline-flex;align-items:center;min-height:42px;padding:8px 14px;box-sizing:border-box;border:1px solid #d4ded7;border-radius:9px;background:#fff;color:#286b5e;font-size:14px;font-weight:600}
.invoice-shell .windows-scanner-options{padding:12px 0;max-width:420px}
@media(max-width:700px){
 .invoice-shell .store-invoice-controls{display:flex;flex-direction:column;align-items:stretch;overflow:visible;gap:12px}
 .invoice-shell .store-invoice-controls .store-invoice-filters{flex:initial;width:100%;grid-template-columns:repeat(2,minmax(0,1fr))}
 .invoice-shell .store-invoice-controls .store-invoice-filters label:nth-child(2){grid-column:1/-1;grid-row:2}
 .invoice-shell .store-invoice-controls .store-invoice-meta{flex:initial;flex-wrap:wrap;align-items:center;width:100%}
 .invoice-shell .store-invoice-controls .store-invoice-order{width:100%;grid-template-columns:repeat(2,minmax(0,1fr))}
 .invoice-shell .store-invoice-controls #store-invoice-summary{white-space:normal;height:auto}
}