/* ==========================================================================
   Payment and upload forms.
   Carried over from the site custom CSS that was attached to the previous
   theme, with the rules for removed systems dropped and the colours
   pointed at the theme tokens.
   ========================================================================== */

.summaryform a,
#pay4quotation a{color:var(--c-link);text-decoration:underline;text-underline-offset:2px}
.summaryform a:hover,
#pay4quotation a:hover{color:var(--c-ink)}
.summaryform legend{font-weight:800;padding:0 10px}
.summaryform fieldset{border:1px solid var(--c-line);border-radius:var(--r-md)}

.form-help,
.formnotes{font-size:13.5px;color:var(--c-muted);padding-top:5px;line-height:1.6}
.dialog{cursor:help}

/* validation states */
.sicum_error{color:#c30e0e;font-size:80%;display:none}
input.error{background-color:#fff0f3;border-color:#d4455f}
label.error,span.error{color:#c30e0e;font-size:14px}
span.error{display:block}

/* the ASA purchase form on a summary page */
.asa_payment_form_group{margin-bottom:16px}
.asa_payment_form_input,
.pplccfk_wrapper_pay_field{background:#fff!important;border:1px solid #cfcedb!important}
.asa_validate_code_field{width:200px!important;-moz-appearance:textfield}
.asa_validate_code_field::-webkit-inner-spin-button,
.asa_validate_code_field::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
#next2validation:disabled,
button:disabled,[type=submit]:disabled{opacity:.55;cursor:not-allowed;background:#c9c8d4!important;color:#6b6a78!important}
.payment_form_bottons{margin-top:26px}
.pplccfk_wrapper_pay_prg{max-width:320px;margin:0 auto 15px}
.pplccfk_p_align_center{text-align:center}
.pplccfk_field_ltr{direction:ltr}
.pplccfk_field_100{width:100%}
.pplccfk_field_50{width:48%;display:inline-block}
#pplccfk_user_ID_Error{font-size:14px;color:#c30e0e}

/* progress line above a multi step form */
.progerssline{margin-bottom:10px;color:var(--c-muted);text-align:center;font-size:14px}
.progerssline .activestep{font-weight:700;color:var(--c-price)}

/* result and spinner boxes */
#spinnerBox,#answerBox{padding:16px 18px;border-radius:var(--r-md);background:#fff;
  box-shadow:var(--shadow-card);width:fit-content}
#spinnerBox{max-width:280px}
#answerBox{max-width:680px}
#answerBox h2,#answerBox h3,#answerBox h4{margin:1em 0}
#answerBox ol ol{list-style:auto}

.asa-spinner{display:inline-block;width:18px;height:18px;border:2px solid currentColor;
  border-top-color:transparent;border-radius:50%;animation:asaSpin .8s linear infinite;
  vertical-align:middle;margin-inline-start:6px}
@keyframes asaSpin{to{transform:rotate(360deg)}}

.order_details{margin:20px 0}
.order_details_label{font-size:90%;font-weight:700}
.order_details_value{font-size:90%}

.buybutton{margin-top:15px;text-align:left}
.link_button{color:var(--c-muted);font-weight:700;background:transparent;text-decoration:underline}
.link_button:hover{color:var(--c-ink);background:transparent;text-decoration:none}

/* pay4quotation, which stays on the site */
#pay4quotation label.p4q_long_Label{display:inline-block;margin-bottom:2px!important;width:auto;
  font-size:16px!important;font-weight:700!important}
#pay4quotation label.p4q_short_label{display:block;width:100%;font-weight:700}
#pay4quotation input[type=text],#pay4quotation input[type=email]{width:100%;margin-top:0}
#pay4quotation input[type=email]{margin-bottom:20px!important}
#pay4quotation input[type=checkbox]{margin:0 0 0 6px!important}
#pay4quotation .p4q-buybutton.p4q-textrt{margin-top:20px;width:100%;text-align:left}
span.p4q_PaymentSumSpan{display:inline-block;margin-bottom:20px}
#pay4quotation .p4q_button.p4q_bank_submit.p4q_button{background:transparent!important;color:var(--c-text);
  font-weight:400;text-decoration:underline;display:block;width:100%;text-align:right;margin:0;padding:0}
#pay4quotation .p4q_button.p4q_bank_submit.p4q_button:hover{color:var(--c-accent-dark)!important;background:transparent!important}

/* jQuery UI dialogs used by the help tooltips */
.ui-widget.ui-widget-content{font-family:var(--f-body);font-size:16px;border:1px solid var(--c-line);border-radius:var(--r-md)}
.ui-draggable .ui-dialog-titlebar{font-family:var(--f-head);font-weight:800;background:var(--c-soft);border:0}
.ui-dialog .ui-dialog-title{float:right;font-size:19px}
.ui-dialog .ui-dialog-titlebar-close{right:auto;left:14px;background:#fff!important;border-radius:50%!important;border:0!important}
.ui-dialog .ui-dialog-content a{text-decoration:underline;text-underline-offset:2px;color:var(--c-accent)}
.ui-dialog-buttonset{float:left!important}