/* Shared payment controls and private customer quote. No external fonts or assets. */
.desk-payments, .customer-payment-page { --pay-navy: #08253a; --pay-deep: #051a2a; --pay-brass: #c6923e; --pay-ivory: #f8f4eb; --pay-ink: #14334c; --pay-muted: #526777; --pay-line: #d5dbdf; }
.desk-payments [hidden], .customer-payment-page [hidden] { display: none !important; }
.desk-payments { margin-top: 2rem; border-top: 2px solid var(--pay-brass); padding-top: 1.4rem; color: var(--pay-ink); }
.desk-payments h3 { margin: .4rem 0 .7rem; font-size: 1.5rem; }
.desk-payments > p:not(.eyebrow) { color: var(--pay-muted); line-height: 1.6; }
.desk-payments label { display: grid; gap: .43rem; color: var(--pay-ink); font-size: .84rem; font-weight: 750; }
.desk-payments input:not([type="checkbox"]), .desk-payments select, .desk-payments textarea { width: 100%; min-width: 0; border: 1px solid var(--pay-line); border-radius: .45rem; padding: .72rem .78rem; color: var(--pay-ink); background: #fff; font: inherit; }
.desk-payments textarea { min-height: 7rem; resize: vertical; }
.desk-payments fieldset { padding: 1.2rem; border: 1px solid var(--pay-line); margin: 1.3rem 0; border-radius: .65rem; }
.desk-payments legend { font-weight: 800; padding: 0 .4rem; }
.desk-payments fieldset:disabled { opacity: .75; }
.desk-payments .button-ghost { color: var(--pay-navy); background: #fff; border-color: var(--pay-muted); }
.desk-payments .button-ghost:hover:not(:disabled), .desk-payments .button-ghost:focus-visible { color: var(--pay-navy); background: #edf2f5; border-color: var(--pay-navy); }
.desk-payments .button-ghost:focus-visible { outline: 3px solid #23789d; outline-offset: 4px; }
.payment-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.payment-notice { color: #173950; background: #eef2f4; border-left: 3px solid #c6923e; padding: .9rem 1rem; font-size: .9rem; line-height: 1.55; overflow-wrap: anywhere; }
.payment-help { color: var(--pay-muted, #526777); font-size: .85rem; line-height: 1.55; }
.payment-environment { display: inline-block; background: #f4e4c6; border: 1px solid #c6923e; border-radius: 99px; padding: .4rem .7rem; color: #60420b; font-size: .7rem; font-weight: 800; letter-spacing: .04em; }
.payment-environment:empty { display: none; }
.payment-summary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; background: #edf2f5; border-radius: .65rem; padding: 1.2rem; }
.payment-summary > div { display: grid; gap: .3rem; overflow-wrap: anywhere; }
.payment-summary span { color: var(--pay-muted); font-size: .72rem; font-weight: 750; }
.payment-summary strong { color: var(--pay-ink); font-size: .92rem; line-height: 1.45; }
.desk-payments .payment-checkbox, .payment-checkbox { display: flex; align-items: flex-start; gap: .7rem; margin: 1.2rem 0; font-size: .92rem; font-weight: 500; line-height: 1.55; }
.payment-checkbox input { flex: 0 0 auto; width: 1.2rem; height: 1.2rem; margin: .15rem 0 0; accent-color: #08253a; }
.desk-payments .button:disabled, .quote-desk-page button:disabled, .payment-button:disabled { cursor: not-allowed; opacity: .55; }
.desk-payments .desk-written-preview > label { margin-top: 1.2rem; }
.desk-payments .desk-email-preview { min-height: 570px; }
.customer-payment-page, .customer-payment-page * { box-sizing: border-box; }
.customer-payment-page { margin: 0; background: var(--pay-ivory); color: var(--pay-ink); font: 16px/1.55 -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif; }
.customer-payment-page a { color: #0b4b70; text-underline-offset: .2em; }
.customer-payment-page button, .customer-payment-page input { font: inherit; }
.customer-payment-page button { cursor: pointer; }
.customer-payment-page :focus-visible, .desk-payments :focus-visible { outline: 3px solid #23789d; outline-offset: 4px; }
.payment-header { min-height: 104px; padding: 1.2rem max(1.2rem, calc((100% - 1100px) / 2)); background: var(--pay-deep); border-bottom: 3px solid var(--pay-brass); color: var(--pay-ivory); display: flex; gap: 2rem; align-items: center; justify-content: space-between; }
.payment-header a { width: min(350px, 65%); display: block; }
.payment-header img { display: block; width: 100%; height: auto; }
.payment-header > span { font-size: .78rem; font-weight: 750; letter-spacing: .12em; text-transform: uppercase; }
.payment-main { width: min(1100px, calc(100% - 2.4rem)); margin: 0 auto; }
.payment-intro { padding: clamp(2.3rem, 6vw, 5rem) 0 1.4rem; max-width: 760px; }
.payment-eyebrow { color: #866027; font-size: .74rem; font-weight: 850; letter-spacing: .15em; text-transform: uppercase; }
.payment-intro h1 { margin: .8rem 0 1rem; font-size: clamp(2.4rem, 5.7vw, 4.5rem); letter-spacing: -.045em; line-height: 1.03; color: var(--pay-navy); }
.payment-intro > p:last-child { max-width: 630px; color: var(--pay-muted); font-size: 1.08rem; }
.payment-message { padding: 1rem 1.2rem; border: 1px solid var(--pay-line); border-radius: .6rem; background: #fff; color: var(--pay-muted); line-height: 1.6; }
.payment-message[data-kind="error"] { background: #fff3ef; color: #862c25; border-color: #d8b4aa; }
.payment-message[data-kind="success"] { background: #eff8f2; color: #245940; border-color: #c2daca; }
.payment-section-header { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin: 2.4rem 0 1rem; }
.payment-section-header h2 { margin: .25rem 0; color: var(--pay-navy); font-size: clamp(1.7rem, 3vw, 2.25rem); letter-spacing: -.025em; }
.payment-section-header .payment-eyebrow { margin: 0; overflow-wrap: anywhere; }
.payment-customer-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.payment-card { background: #fffdfa; border: 1px solid var(--pay-line); border-radius: 1rem; padding: clamp(1.25rem, 3vw, 2rem); margin-bottom: 1rem; box-shadow: 0 10px 30px #051a2a06; min-width: 0; }
.payment-card h3 { margin: 0 0 1.3rem; font-size: 1.15rem; color: var(--pay-navy); }
.payment-details { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: .8rem 1rem; margin: 0 0 1rem; }
.payment-details dt { color: var(--pay-muted); font-size: .87rem; }
.payment-details dd { margin: 0; font-weight: 650; color: var(--pay-ink); overflow-wrap: anywhere; }
.payment-totals-card { border-top: 4px solid var(--pay-brass); }
.payment-total-label { margin: 0; font-size: .9rem; color: var(--pay-muted); }
.payment-total { display: block; font-size: clamp(2.4rem, 5vw, 3.5rem); letter-spacing: -.04em; color: var(--pay-navy); margin: .2rem 0 1.2rem; }
.payment-schedule { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.payment-schedule > div { border: 1px solid var(--pay-line); border-radius: .7rem; padding: 1rem 1.2rem; }
.payment-schedule h4 { margin: 0 0 .3rem; color: var(--pay-muted); font-size: .86rem; }
.payment-schedule strong { font-size: 1.6rem; color: var(--pay-navy); }
.payment-schedule p { margin: .35rem 0 0; font-size: .9rem; }
.payment-terms { white-space: pre-wrap; overflow-wrap: anywhere; margin: 0; }
.payment-checkout { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1.5rem; align-items: center; border-top: 4px solid var(--pay-brass); }
.payment-checkout h3 { margin-bottom: .5rem; }
.payment-checkout p { color: var(--pay-muted); }
.payment-checkout-actions { display: grid; gap: .8rem; }
.payment-button { display: inline-flex; align-items: center; justify-content: center; text-align: center; border: 1px solid var(--pay-brass); border-radius: .55rem; padding: .85rem 1.25rem; color: var(--pay-deep); background: var(--pay-brass); font-weight: 800 !important; line-height: 1.4; min-height: 48px; }
.payment-button:hover:not(:disabled) { background: #d6a756; }
.payment-button-secondary { border-color: var(--pay-line); color: var(--pay-navy); background: #fff; font-size: .9rem !important; }
.payment-button-secondary:hover:not(:disabled) { background: #eef2f4; }
.payment-receipts { display: flex; flex-wrap: wrap; gap: 1rem; }
.payment-help-card { margin: 2rem 0 3rem; background: var(--pay-navy); color: var(--pay-ivory); padding: clamp(1.3rem, 3vw, 2rem); border-radius: 1rem; }
.payment-help-card h2 { margin: 0; font-size: 1.4rem; }
.payment-help-card p { color: #c6d2db; }
.payment-help-card > div { display: flex; flex-wrap: wrap; gap: .7rem 2rem; }
.payment-help-card a { color: #f4d294; font-weight: 700; overflow-wrap: anywhere; }
.payment-footer { padding: 1.5rem; color: var(--pay-muted); border-top: 1px solid var(--pay-line); text-align: center; font-size: .8rem; }
.payment-footer p { margin: .3rem 0; }
@media (max-width: 740px) {
  .payment-customer-grid, .payment-checkout { grid-template-columns: 1fr; }
  .payment-section-header { align-items: flex-start; flex-direction: column; }
  .payment-header > span { display: none; }
  .payment-header a { width: min(320px, 100%); }
  .payment-header { min-height: 86px; }
  .payment-form-grid, .payment-summary { grid-template-columns: 1fr; }
  .payment-checkout .payment-button { width: 100%; }
}
@media (max-width: 430px) {
  .payment-schedule { grid-template-columns: 1fr; }
  .payment-main { width: calc(100% - 1.5rem); }
  .payment-details { grid-template-columns: 1fr; gap: .25rem; }
  .payment-details dd { margin-bottom: .8rem; }
  .desk-payments fieldset, .desk-payments .desk-written-preview { padding: .85rem; }
  .desk-payments .button { width: 100%; }
}