/* AVP V5.57 — restrained invoice-page refinement
   Keeps the V5.55 linear document-first layout; improves density, hierarchy and polish only. */

/* Keep the invoice as the visual hero, but at a comfortable document width. */
body.app-shell .invoice-layout.invoice-layout-linear{
  max-width:1120px!important;
}
body.app-shell .invoice-layout.invoice-layout-linear>.invoice-paper{
  max-width:980px!important;
  margin:0 auto!important;
  border:1px solid #d7e0da!important;
  border-radius:12px!important;
  box-shadow:0 10px 28px rgba(22,54,37,.045)!important;
}
body.app-shell .invoice-layout.invoice-layout-linear>.invoice-editor-linear{
  max-width:980px!important;
  margin:18px auto 0!important;
}

/* A quieter hand-off from the document to administration. */
body.app-shell .invoice-management-head{
  display:grid!important;
  grid-template-columns:auto 1fr!important;
  align-items:end!important;
  gap:3px 14px!important;
  padding:17px 0 12px!important;
  border-top:1px solid #d8e2db!important;
  border-bottom:0!important;
}
body.app-shell .invoice-management-head>span{
  grid-column:1/-1!important;
  font-size:9px!important;
}
body.app-shell .invoice-management-head>h2{
  font-size:18px!important;
}
body.app-shell .invoice-management-head>p{
  max-width:none!important;
  margin:0!important;
  font-size:10.5px!important;
  text-align:left!important;
}

/* Live account status is important, but should not dominate the page. */
body.app-shell .invoice-editor-linear>.invoice-current-account{
  min-height:48px!important;
  margin:0!important;
  padding:11px 14px!important;
  border-radius:8px!important;
}
body.app-shell .invoice-editor-linear>.invoice-current-account strong{font-size:13px!important}
body.app-shell .invoice-editor-linear>.invoice-current-account span{font-size:11px!important}

/* All operational sections share one rhythm instead of looking like separate cards. */
body.app-shell .invoice-editor-linear>.invoice-admin-section,
body.app-shell .invoice-editor-linear>.panel{
  padding:15px 0!important;
  border-bottom:1px solid #e2e8e4!important;
}
body.app-shell .invoice-editor-linear>.invoice-admin-section>.panel-heading,
body.app-shell .invoice-editor-linear>.panel>.panel-heading{
  margin-bottom:10px!important;
}
body.app-shell .invoice-editor-linear>.invoice-admin-section>.panel-heading h2,
body.app-shell .invoice-editor-linear>.panel>.panel-heading h2{
  font-size:13.5px!important;
}
body.app-shell .invoice-editor-linear>.invoice-admin-section>.panel-heading p,
body.app-shell .invoice-editor-linear>.panel>.panel-heading p{
  max-width:760px!important;
  font-size:10.5px!important;
  line-height:1.4!important;
}

/* History and paid-state information become compact rows. */
body.app-shell .invoice-history-section .helper-note{
  display:inline-flex!important;
  align-items:center!important;
  width:auto!important;
  margin:0 10px 0 0!important;
  padding:7px 10px!important;
}
body.app-shell .invoice-history-section .invoice-revise-disclosure{
  margin-top:10px!important;
}
body.app-shell .invoice-payment-section>.notice{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:18px!important;
  margin:0!important;
  padding:10px 12px!important;
}
body.app-shell .invoice-payment-section>.notice p{
  margin:0!important;
  font-size:10.5px!important;
}

/* Sharing controls are clean operational rows, not coloured blocks. */
body.app-shell .invoice-editor-linear>.invoice-sharing{
  min-height:64px!important;
  padding:13px 0!important;
  border-bottom:1px solid #e2e8e4!important;
}
body.app-shell .invoice-editor-linear>.invoice-sharing>strong{font-size:12.5px!important}
body.app-shell .invoice-editor-linear>.invoice-sharing>p{font-size:10.5px!important}
body.app-shell .invoice-editor-linear>.invoice-sharing>form{min-width:200px!important}
body.app-shell .invoice-editor-linear>.invoice-sharing .btn{min-height:36px!important;padding:8px 12px!important}

/* Credits remain visible but much less bulky. */
body.app-shell .invoice-credit-section .metric-grid{
  margin-bottom:10px!important;
}
body.app-shell .invoice-credit-section .metric-grid>.metric{
  min-height:68px!important;
  padding:10px 12px!important;
}
body.app-shell .invoice-credit-section .metric-grid>.metric strong{font-size:16px!important}
body.app-shell .invoice-credit-section .metric-grid>.metric small{font-size:9px!important}
body.app-shell .invoice-credit-section .ledger-list{margin-top:8px!important}
body.app-shell .invoice-credit-section .credit-route-picker{margin-top:10px!important}

/* Payment forms should feel deliberate, not oversized. */
body.app-shell .invoice-payment-section .form-stack{max-width:720px!important}
body.app-shell .invoice-balance-section .inline-form{display:inline-flex!important;margin:0 6px 0 0!important}

/* Destructive controls stay separated and quiet until opened. */
body.app-shell .invoice-editor-linear>.danger-disclosure{
  margin-top:6px!important;
  padding:13px 0 0!important;
  border-top:0!important;
  border-bottom:0!important;
}
body.app-shell .invoice-editor-linear>.danger-disclosure>summary{
  color:#8a3b3b!important;
  font-size:11px!important;
}

/* Slight document polish without changing its structure. */
body.app-shell .invoice-paper-simple .invoice-simple-head{align-items:center!important}
body.app-shell .invoice-paper-simple .invoice-simple-title small{color:#718178!important}
body.app-shell .invoice-paper-simple .invoice-simple-rule{margin:20px 0 22px!important}
body.app-shell .invoice-paper-simple .invoice-table-simple th{font-size:9.5px!important}
body.app-shell .invoice-paper-simple .invoice-table-simple td{padding-top:12px!important;padding-bottom:12px!important}
body.app-shell .invoice-paper-simple .invoice-simple-payment{margin-top:22px!important}
body.app-shell .invoice-paper-simple .invoice-foot{margin-top:42px!important}

@media(max-width:760px){
  body.app-shell .invoice-layout.invoice-layout-linear>.invoice-paper,
  body.app-shell .invoice-layout.invoice-layout-linear>.invoice-editor-linear{max-width:none!important}
  body.app-shell .invoice-management-head{grid-template-columns:1fr!important}
  body.app-shell .invoice-management-head>*{grid-column:1!important}
  body.app-shell .invoice-payment-section>.notice{align-items:flex-start!important;flex-direction:column!important;gap:4px!important}
}

@media print{
  body.app-shell .invoice-layout.invoice-layout-linear>.invoice-paper{max-width:none!important;box-shadow:none!important}
}
