/* Invoice payment workflow alignment and receipt/request dialogs — 20260802qa902 */

.premium-app .invoice-detail-actions{
  display:grid!important;
  grid-template-columns:repeat(4,76px) 132px 132px!important;
  gap:10px!important;
  align-items:center!important;
  justify-content:end!important;
}

.premium-app .invoice-round-action{
  width:76px!important;
  height:72px!important;
  min-height:72px!important;
  grid-template-rows:40px 24px!important;
  align-content:center!important;
  justify-items:center!important;
  gap:2px!important;
  padding:4px 3px!important;
}

.premium-app .invoice-round-action>svg{
  width:38px!important;
  height:38px!important;
  margin:0!important;
}

.premium-app .invoice-round-action>span{
  min-height:24px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#cbd5df;
  font-size:10.5px;
  font-weight:760;
  line-height:12px;
  text-align:center;
  text-wrap:balance;
}

.premium-app .invoice-round-action:hover>span,
.premium-app .invoice-round-action:focus-visible>span{
  color:#fff;
}

.premium-app .invoice-send-action,
.premium-app .record-management-menu.detail,
.premium-app .record-management-menu.detail>.record-management-trigger{
  width:132px!important;
  min-width:132px!important;
  height:50px!important;
  min-height:50px!important;
}

.premium-app .record-management-menu.detail>.record-management-trigger{
  justify-content:center;
}

.invoice-workflow-modal{
  position:fixed;
  inset:0;
  z-index:9800;
  display:grid;
  place-items:center;
  padding:18px;
  background:rgba(1,7,13,.82);
  backdrop-filter:blur(5px);
}

.invoice-workflow-modal.hidden{
  display:none!important;
}

.invoice-workflow-dialog{
  width:min(1020px,calc(100vw - 36px));
  max-height:calc(100vh - 36px);
  overflow:auto;
  border:1px solid #36536b;
  border-radius:14px;
  background:#07131f;
  color:#edf5fb;
  box-shadow:0 28px 80px rgba(0,0,0,.62);
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
}

.invoice-workflow-dialog>header{
  position:static!important;
  z-index:auto!important;
  display:grid!important;
  grid-template-columns:48px minmax(0,1fr) 38px!important;
  align-items:center!important;
  gap:13px!important;
  min-height:88px!important;
  padding:15px 18px!important;
  border:0!important;
  border-bottom:1px solid #29465f!important;
  background:#091a28!important;
}

.invoice-workflow-icon{
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  border:1.5px solid currentColor;
  border-radius:50%;
  background:#07131f;
}

.invoice-workflow-icon.green{color:#22c55e}
.invoice-workflow-icon.cyan{color:#22d3ee}
.invoice-workflow-icon svg{width:21px;height:21px}

.invoice-workflow-dialog>header p,
.invoice-workflow-dialog>header h3,
.invoice-workflow-dialog>header small{
  margin:0;
  text-shadow:none!important;
  filter:none!important;
}

.invoice-workflow-dialog>header p{
  color:#ff941f;
  font-size:11px;
  font-weight:820;
}

.invoice-workflow-dialog>header h3{
  margin-top:3px;
  color:#f8fafc!important;
  font-size:21px!important;
  line-height:27px;
}

.invoice-workflow-dialog>header small{
  display:block;
  margin-top:4px;
  color:#aebdca;
  font-size:12px;
  line-height:17px;
}

.invoice-workflow-dialog>header>button{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  padding:0;
  border:1px solid #3a5265;
  border-radius:50%;
  background:#0c1a26;
  color:#d8e3eb;
}

.invoice-workflow-dialog>header>button:hover,
.invoice-workflow-dialog>header>button:focus-visible{
  border-color:#ff7a00;
  color:#ff9b3d;
  outline:0;
}

.invoice-workflow-dialog>header>button svg{width:19px;height:19px}

.invoice-payment-workflow-form{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);
}

.invoice-payment-information,
.invoice-receipt-draft{
  display:grid;
  align-content:start;
  gap:13px;
  padding:20px;
}

.invoice-receipt-draft{
  border-left:1px solid #29465f;
  background:#081824;
}

.invoice-payment-information h4,
.invoice-receipt-draft h4{
  margin:0;
  color:#f5f8fb;
  font-size:16px;
}

.invoice-payment-information label,
.invoice-receipt-draft label,
.invoice-request-payment-dialog label{
  display:grid;
  gap:6px;
  color:#b6c4d0!important;
  font-size:11px!important;
  font-weight:760!important;
  text-transform:none!important;
}

.invoice-workflow-dialog input,
.invoice-workflow-dialog select,
.invoice-workflow-dialog textarea{
  width:100%;
  min-height:42px;
  padding:9px 11px;
  border:1px solid #3a5265!important;
  border-radius:8px;
  background:#06121c!important;
  color:#f5f8fb!important;
  font:inherit;
  font-size:13px;
  line-height:18px;
  box-shadow:none!important;
  text-shadow:none!important;
  filter:none!important;
}

.invoice-workflow-dialog textarea{resize:vertical}

.invoice-workflow-dialog input:focus,
.invoice-workflow-dialog select:focus,
.invoice-workflow-dialog textarea:focus{
  border-color:#22d3ee!important;
  outline:2px solid rgba(34,211,238,.16);
  outline-offset:1px;
}

.invoice-payment-field-grid,
.invoice-request-field-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}

.invoice-payment-balance-check{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:4px 16px;
  align-items:center;
  padding:13px 14px;
  border:1px solid #315069;
  border-left:3px solid #22c55e;
  border-radius:8px;
  background:#081824;
}

.invoice-payment-balance-check span,
.invoice-payment-balance-check small{color:#aebdca;font-size:11px}
.invoice-payment-balance-check strong{color:#ff941f;font-size:20px}
.invoice-payment-balance-check small{grid-column:1/-1}

.invoice-receipt-draft>header{
  position:static!important;
  display:flex!important;
  align-items:center!important;
  gap:11px!important;
  padding:0 0 12px!important;
  border:0!important;
  border-bottom:1px solid #29465f!important;
  background:transparent!important;
}

.invoice-receipt-draft>header>svg{width:27px;height:27px;color:#60a5fa}
.invoice-receipt-draft>header p{margin:3px 0 0;color:#aebdca;font-size:11px;line-height:16px}

.invoice-receipt-toggle{
  grid-template-columns:20px minmax(0,1fr)!important;
  align-items:start;
  padding:12px;
  border:1px solid #315069;
  border-radius:8px;
  background:rgba(37,99,235,.08);
}

.invoice-receipt-toggle input{
  width:18px!important;
  min-height:18px!important;
  height:18px;
  margin:2px 0 0;
  accent-color:#60a5fa;
}

.invoice-receipt-toggle span{display:grid;gap:3px}
.invoice-receipt-toggle strong{color:#e6f1f8;font-size:12px}
.invoice-receipt-toggle small{color:#aebdca;font-size:11px;font-weight:500;line-height:15px}

.invoice-payment-workflow-form>footer,
.invoice-request-payment-dialog form>footer{
  grid-column:1/-1;
  display:flex;
  justify-content:flex-end;
  gap:10px;
  padding:14px 18px;
  border-top:1px solid #29465f;
  background:#07121c;
}

.invoice-record-payment-submit,
.invoice-request-payment-submit{
  min-height:44px!important;
  padding:9px 17px!important;
  border:1px solid #22c55e!important;
  background:rgba(22,101,52,.28)!important;
  color:#baf7cf!important;
  box-shadow:none!important;
}

.invoice-request-payment-submit{
  border-color:#22d3ee!important;
  background:rgba(8,82,105,.30)!important;
  color:#c7f7ff!important;
}

.invoice-record-payment-submit:hover,
.invoice-record-payment-submit:focus-visible{
  border-color:#4ade80!important;
  background:rgba(22,101,52,.43)!important;
  outline:0;
}

.invoice-request-payment-submit:hover,
.invoice-request-payment-submit:focus-visible{
  border-color:#67e8f9!important;
  background:rgba(8,82,105,.46)!important;
  outline:0;
}

.invoice-request-payment-dialog{width:min(720px,calc(100vw - 36px))}

.invoice-request-payment-dialog form{
  display:grid;
  gap:13px;
  padding:20px 20px 0;
}

.invoice-request-summary{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:9px;
}

.invoice-request-summary>span{
  min-height:66px;
  display:grid;
  align-content:center;
  gap:5px;
  padding:10px 12px;
  border:1px solid #315069;
  border-radius:8px;
  background:#081824;
}

.invoice-request-summary small{color:#9fb0bd;font-size:10px}
.invoice-request-summary strong{color:#f4f8fb;font-size:13px;overflow-wrap:anywhere}
.invoice-request-summary>span:last-child strong{color:#ff941f;font-size:18px}

@media(max-width:1380px){
  .premium-app .invoice-detail-header{display:grid!important}
  .premium-app .invoice-detail-actions{justify-content:start!important}
}

@media(max-width:820px){
  .premium-app .invoice-detail-actions{
    grid-template-columns:repeat(4,minmax(64px,1fr))!important;
  }

  .premium-app .invoice-send-action,
  .premium-app .record-management-menu.detail{
    grid-column:span 2;
    width:100%!important;
    min-width:0!important;
  }

  .premium-app .record-management-menu.detail>.record-management-trigger{
    width:100%!important;
    min-width:0!important;
  }

  .invoice-payment-workflow-form{grid-template-columns:1fr}
  .invoice-receipt-draft{border-top:1px solid #29465f;border-left:0}
}

@media(max-width:580px){
  .invoice-workflow-modal{padding:8px}
  .invoice-workflow-dialog{width:calc(100vw - 16px);max-height:calc(100vh - 16px);border-radius:11px}
  .invoice-workflow-dialog>header{grid-template-columns:42px minmax(0,1fr) 34px!important;padding:13px!important}
  .invoice-workflow-icon{width:40px;height:40px}
  .invoice-workflow-dialog>header h3{font-size:18px!important;line-height:23px}
  .invoice-payment-information,.invoice-receipt-draft{padding:15px}
  .invoice-payment-field-grid,.invoice-request-field-grid,.invoice-request-summary{grid-template-columns:1fr}
  .invoice-request-payment-dialog form{padding:15px 15px 0}
  .invoice-payment-workflow-form>footer,.invoice-request-payment-dialog form>footer{display:grid;grid-template-columns:1fr;padding:12px 15px}
  .invoice-payment-workflow-form>footer>button,.invoice-request-payment-dialog form>footer>button{width:100%}
}

@media(max-width:480px){
  .premium-app .invoice-detail-actions{grid-template-columns:1fr 1fr!important}
  .premium-app .invoice-round-action{width:100%!important}
  .premium-app .invoice-send-action,.premium-app .record-management-menu.detail{grid-column:auto}
}