/* Providence Pro platform — payments widget styles (site-payments).
 *
 * Deliberately thin: buy buttons use the TENANT'S own button classes, so
 * they already look like the rest of the site. This sheet only covers the
 * widget-owned bits (status line, price, busy/disabled states), themed
 * through custom properties each tenant may override in its main stylesheet:
 *
 *   :root { --pay-error: #8c2f39; --pay-price-weight: 600; }
 *
 * Include versioned, after the tenant's main CSS:
 *   <link rel="stylesheet" href="/assets/pay.css?v=YYYYMMDD">
 */

[data-pay-sku][aria-busy="true"] {
  opacity: .6;
  pointer-events: none;
  cursor: progress;
}

[data-pay-sku][disabled],
[data-pay-sku][aria-disabled="true"] {
  opacity: .55;
  pointer-events: none;
}

.pay-msg {
  display: block;
  margin-top: .5rem;
  min-height: 1.2em;
  font: inherit;
  font-size: .9em;
  color: var(--pay-msg-color, inherit);
  opacity: .85;
}

.pay-msg[data-tone="error"] {
  color: var(--pay-error, #b00020);
  opacity: 1;
}

[data-pay-price] {
  font-weight: var(--pay-price-weight, 700);
}

[data-pay-compare] {
  text-decoration: line-through;
  opacity: .6;
  margin-right: .35em;
  font-weight: 400;
}
