/* Pay first: renew page + renew form (theme inc/sh-pay-first.php) */
.sh-paid-note { margin: 0 0 24px; padding: 14px 18px; border-left: 4px solid #3318d8; border-radius: 4px 10px 10px 4px; background: #f3f1fe;
	color: #292d34; font-family: "Inter", Helvetica, Arial, sans-serif; font-size: 15px; font-weight: 500; line-height: 1.5; }
.sh-paid-note strong { font-family: "Inter", Helvetica, Arial, sans-serif; font-weight: 700; color: #3318d8; }
.sh-paid-note a { color: #3318d8; font-weight: 600; }
.sh-renew__group { margin: 28px 0 12px; font-size: 20px; }
.sh-renew__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.sh-renew__pack { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; padding: 14px 16px; border: 1px solid #d9dde3; border-radius: 8px; background: #fff; }
.sh-renew__name { flex: 1 1 220px; font-weight: 600; }
.sh-renew__price { white-space: nowrap; }
.sh-renew__go { display: inline-block; padding: 10px 18px; border-radius: 6px; background: #111; color: #fff; text-decoration: none; font-weight: 600; }
.sh-renew__go:hover, .sh-renew__go:focus { background: #333; color: #fff; }
.sh-renew__help { margin-top: 28px; font-size: 14px; color: #5b6470; }
input[readonly] { background: #f3f4f6; color: #374151; }

/* Requirements form: the error message under Submit (owner 2026-10-23: right under the button, easy to read, warning sign).
   Beats the theme's .submission__form .wpcf7-response-output (!important) with a more specific selector. */
.submission__form .wpcf7 form .wpcf7-spinner { display: none; }                       /* no empty gap under the button */
.submission__form .wpcf7 form.submitting .wpcf7-spinner { display: block; }
.submission__form .wpcf7 form.invalid .wpcf7-response-output,
.submission__form .wpcf7 form.unaccepted .wpcf7-response-output,
.submission__form .wpcf7 form.failed .wpcf7-response-output,
.submission__form .wpcf7 form.aborted .wpcf7-response-output,
.submission__form .wpcf7 form.spam .wpcf7-response-output {
	position: relative !important; margin: 12px 0 50px !important; padding: 14px 16px 14px 48px !important;
	background: #fff4f2 !important; border: 1px solid #f3c2bc !important; border-left: 4px solid #d93025 !important;
	border-radius: 8px !important; color: #8a1c13 !important;
	font-family: "Inter", Helvetica, Arial, sans-serif; font-size: 15px !important; font-weight: 600; line-height: 1.5;
}
.submission__form .wpcf7 form.invalid .wpcf7-response-output::before,
.submission__form .wpcf7 form.unaccepted .wpcf7-response-output::before,
.submission__form .wpcf7 form.failed .wpcf7-response-output::before,
.submission__form .wpcf7 form.aborted .wpcf7-response-output::before,
.submission__form .wpcf7 form.spam .wpcf7-response-output::before {
	content: "⚠️"; position: absolute; left: 16px; top: 13px; font-size: 18px; line-height: 1.4;
}
.submission__form .wpcf7 form .wpcf7-response-output a { color: inherit !important; text-decoration: underline; font-weight: 700; }
.submission__form input[readonly] { background: #f3f4f6 !important; color: #6b7280 !important; cursor: not-allowed; }
/* the locked fields' pop-up: shown on hover, or while the field is tapped/focused (phones); the theme makes every
   <span> in the form display:block, so these rules win with !important */
.submission__form [class*=uacf7-form-] span.wpcf7-form-control-wrap:has(> .sh-help__pop) { position: relative; }
.submission__form [class*=uacf7-form-] span.sh-help__pop { display: none !important; position: absolute; z-index: 30; left: 0; right: 0;
	bottom: calc(100% + 8px); padding: 10px 12px; background: #1f2330; color: #fff; border-radius: 8px;
	box-shadow: 0 8px 24px rgba(17, 20, 40, .25); font: 500 12.5px/1.5 "Inter", Helvetica, Arial, sans-serif; text-align: left; }
.submission__form [class*=uacf7-form-] span.sh-help__pop::after { content: ""; position: absolute; left: 18px; top: 100%;
	border: 6px solid transparent; border-top-color: #1f2330; }
.submission__form [class*=uacf7-form-] span.sh-help__pop::before { content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 10px; }
.submission__form [class*=uacf7-form-] span.wpcf7-form-control-wrap:hover > span.sh-help__pop,
.submission__form [class*=uacf7-form-] span.wpcf7-form-control-wrap:focus-within > span.sh-help__pop { display: block !important; }
.submission__form [class*=uacf7-form-] span.sh-help__pop a { color: #c9c2ff; font-weight: 700; text-decoration: underline; }
.submission__form input[readonly] { -webkit-tap-highlight-color: transparent; }

/* Renew form: "Same as my last brief" as a light row under a thin divider, no card (owner 2026-10-23). The theme styles
   every input, label and <span> in the form (big bordered fields, display:block, label margins with !important), so
   these rules carry the form wrapper's class and use !important. */
.submission__form [class*=uacf7-form-] .sh-same-as-last { flex: 0 0 100%; width: 100%; max-width: 100%; box-sizing: border-box;
	margin: 8px 0 24px; padding: 18px 0 0; border-top: 1px solid #e5e7eb; }  /* the form is a wrapping row: take the whole line */
.submission__form [class*=uacf7-form-] .sh-same-as-last .wpcf7-form-control-wrap,
.submission__form [class*=uacf7-form-] .sh-same-as-last .wpcf7-form-control,
.submission__form [class*=uacf7-form-] .sh-same-as-last .wpcf7-list-item { display: block !important; margin: 0 !important; padding: 0 !important; }
.submission__form [class*=uacf7-form-] .sh-same-as-last label { display: flex !important; align-items: center; gap: 12px; margin: 0 !important;
	padding: 0 !important; cursor: pointer; font: 600 15px/1.3 "Inter", Helvetica, Arial, sans-serif; color: #111827; }
.submission__form [class*=uacf7-form-] .sh-same-as-last input[type=checkbox] { -webkit-appearance: none; appearance: none; flex: 0 0 auto;
	width: 20px !important; height: 20px !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important;
	border: 1.5px solid #c4c8d0 !important; border-radius: 5px !important; background: #fff !important; box-shadow: none !important;
	display: grid !important; place-content: center; cursor: pointer; transition: background .15s, border-color .15s; }
.submission__form [class*=uacf7-form-] .sh-same-as-last input[type=checkbox]::after { content: ""; width: 9px; height: 5px; margin-top: -2px;
	border: solid #fff; border-width: 0 0 2px 2px; transform: rotate(-45deg); opacity: 0; }
.submission__form [class*=uacf7-form-] .sh-same-as-last input[type=checkbox]:hover { border-color: #3318d8 !important; }
.submission__form [class*=uacf7-form-] .sh-same-as-last input[type=checkbox]:checked { background: #3318d8 !important; border-color: #3318d8 !important; }
.submission__form [class*=uacf7-form-] .sh-same-as-last input[type=checkbox]:checked::after { opacity: 1; }
.submission__form [class*=uacf7-form-] .sh-same-as-last input[type=checkbox]:focus-visible { outline: 3px solid rgba(51, 24, 216, .2); outline-offset: 2px; }
.submission__form [class*=uacf7-form-] .sh-same-as-last .wpcf7-list-item-label { display: inline !important; margin: 0 !important; }
.submission__form [class*=uacf7-form-] .sh-same-as-last .sh-same-as-last__hint { margin: 4px 0 0 32px !important; font: 400 13.5px/1.45 "Inter",
	Helvetica, Arial, sans-serif; color: #6b7280; }

/* Requirements forms: the form plugin nests its wrapper several times (each a flex row with 12px top/bottom margin),
   which made a big gap under the note and let the inner rows shrink (owner 2026-10-23: tighter, full width). */
.submission__form [class*=uacf7-form-] [class*=uacf7-form-] { margin: 0 !important; flex: 0 0 100%; width: 100%; max-width: 100%; }
.submission__form .sh-paid-note { margin-bottom: 8px !important; }
