/*
 * RJY Sample Request — Astra Child theme adapter.
 * Mirrors the engineering-first visual language used by the RJY product pages.
 */

:root {
	--rjy-sample-ink: var(--rjy-industrial-ink, #071426);
	--rjy-sample-text: var(--rjy-industrial-text, #24344a);
	--rjy-sample-muted: var(--rjy-industrial-muted, #66758a);
	--rjy-sample-blue: var(--rjy-industrial-blue, #064fc4);
	--rjy-sample-blue-dark: var(--rjy-industrial-blue-dark, #003c9d);
	--rjy-sample-blue-soft: var(--rjy-industrial-blue-soft, #eef5ff);
	--rjy-sample-line: var(--rjy-industrial-line, #d9e2ee);
	--rjy-sample-line-strong: var(--rjy-industrial-line-strong, #c5d1df);
	--rjy-sample-panel: var(--rjy-industrial-panel, #f7f9fc);
	--rjy-sample-radius: var(--rjy-industrial-radius, 8px);
	--rjy-sample-shadow: var(--rjy-industrial-shadow, 0 18px 42px rgba(21, 42, 76, 0.08));
}

.rjy-sample-app {
	--rjy-blue: var(--rjy-sample-blue);
	--rjy-blue-hover: var(--rjy-sample-blue-dark);
	--rjy-navy: var(--rjy-sample-blue-dark);
	--rjy-text-primary: var(--rjy-sample-ink);
	--rjy-text-secondary: var(--rjy-sample-text);
	--rjy-bg-soft: var(--rjy-sample-panel);
	--rjy-bg-blue-soft: var(--rjy-sample-blue-soft);
	--rjy-border: var(--rjy-sample-line);
	--rjy-border-strong: var(--rjy-sample-line-strong);
	--rjy-radius: var(--rjy-sample-radius);
	--rjy-shadow: var(--rjy-sample-shadow);
	color: var(--rjy-sample-ink);
	font-family: var(--font-body, inherit);
}

.rjy-sample-request-page {
	width: min(calc(100% - 64px), 1180px) !important;
	margin: 48px auto 88px;
}

.rjy-sample-complete-page {
	width: min(calc(100% - 64px), 900px) !important;
	margin: 48px auto 88px;
}

.rjy-sample-app__header {
	max-width: 820px;
	margin-bottom: 34px;
}

.rjy-sample-request-page > .rjy-sample-app__header .rjy-sample-kicker {
	display: block;
}

.rjy-sample-kicker {
	margin: 0 0 10px !important;
	color: var(--rjy-sample-blue) !important;
	font: 800 11px/1.4 var(--font-heading, var(--font-body, inherit)) !important;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.rjy-sample-app__header h2 {
	max-width: 760px;
	margin-bottom: 12px;
	color: var(--rjy-sample-ink);
	font-size: clamp(34px, 4vw, 48px);
	font-weight: 800;
	line-height: 1.04;
	letter-spacing: 0;
}

.rjy-sample-app__header > p:last-child {
	max-width: 760px;
	color: var(--rjy-sample-text);
	font-size: 15px;
	line-height: 1.62;
}

.rjy-sample-progress {
	margin-bottom: 20px;
	padding: 0;
	border: 1px solid var(--rjy-sample-line);
	border-radius: var(--rjy-sample-radius);
	background: #fff;
	overflow: hidden;
}

.rjy-sample-progress ol {
	gap: 0;
}

.rjy-sample-progress li {
	position: relative;
	min-height: 52px;
	border-radius: 0;
	background: #fff;
	color: var(--rjy-sample-muted);
	font-size: 13px;
	font-weight: 700;
}

.rjy-sample-progress li + li {
	border-left: 1px solid var(--rjy-sample-line);
}

.rjy-sample-progress li span {
	width: 24px;
	height: 24px;
	border-color: var(--rjy-sample-line-strong);
	border-radius: 4px;
	font-size: 11px;
	font-weight: 800;
}

.rjy-sample-progress li.is-active {
	background: var(--rjy-sample-blue-soft);
	box-shadow: inset 0 -3px 0 var(--rjy-sample-blue);
	color: var(--rjy-sample-blue);
}

.rjy-sample-progress li.is-active span {
	border-color: var(--rjy-sample-blue);
	background: var(--rjy-sample-blue);
}

.rjy-sample-step {
	padding: clamp(28px, 4vw, 44px);
	border-color: var(--rjy-sample-line);
	border-radius: var(--rjy-sample-radius);
	box-shadow: var(--rjy-sample-shadow);
}

.rjy-sample-step h2 {
	color: var(--rjy-sample-blue);
	font-size: clamp(25px, 2.8vw, 32px);
	font-weight: 800;
	line-height: 1.16;
	letter-spacing: 0;
}

.rjy-sample-step > p:not(.rjy-sample-summary):not(.rjy-sample-privacy) {
	color: var(--rjy-sample-text);
	font-size: 14px;
}

.rjy-sample-step fieldset {
	border-color: var(--rjy-sample-line);
	background: var(--rjy-sample-panel);
}

.rjy-sample-step legend {
	color: var(--rjy-sample-blue);
	font-size: 13px;
	font-weight: 800;
	letter-spacing: 0.02em;
}

.rjy-sample-fields label {
	color: var(--rjy-sample-ink);
	font-size: 13px;
	font-weight: 700;
}

.rjy-sample-fields input,
.rjy-sample-fields select,
.rjy-sample-fields textarea {
	min-height: 48px;
	border-color: var(--rjy-sample-line-strong);
	border-radius: 4px;
	background: #fff;
	color: var(--rjy-sample-ink);
	font-size: 14px;
}

.rjy-sample-fields input:focus,
.rjy-sample-fields select:focus,
.rjy-sample-fields textarea:focus {
	border-color: var(--rjy-sample-blue);
	box-shadow: 0 0 0 3px rgba(6, 79, 196, 0.15);
}

.rjy-sample-check-grid label,
.rjy-sample-product,
[data-rjy-review] section {
	border-color: var(--rjy-sample-line);
	border-radius: var(--rjy-sample-radius);
}

.rjy-sample-product {
	box-shadow: 0 8px 24px rgba(21, 42, 76, 0.05);
}

.rjy-sample-product h3,
.rjy-sample-summary,
[data-rjy-review] h3 {
	color: var(--rjy-sample-ink) !important;
}

.rjy-sample-status {
	color: var(--rjy-sample-blue) !important;
}

.rjy-sample-primary,
.rjy-sample-secondary,
.rjy-sample-button {
	min-height: 48px;
	border-radius: 4px;
	border-color: var(--rjy-sample-blue) !important;
	background: var(--rjy-sample-blue) !important;
	font-size: 14px;
	font-weight: 800;
	letter-spacing: 0.01em;
	transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease, transform 160ms ease;
}

.rjy-sample-primary:hover,
.rjy-sample-button:hover {
	border-color: var(--rjy-sample-blue-dark) !important;
	background: var(--rjy-sample-blue-dark) !important;
	box-shadow: none;
}

.rjy-sample-secondary {
	background: #fff !important;
	color: var(--rjy-sample-blue) !important;
}

.rjy-sample-secondary:hover {
	background: var(--rjy-sample-blue-soft) !important;
	color: var(--rjy-sample-blue-dark) !important;
}

.rjy-sample-primary:focus-visible,
.rjy-sample-secondary:focus-visible,
.rjy-sample-button:focus-visible,
.rjy-sample-app input:focus-visible,
.rjy-sample-app select:focus-visible,
.rjy-sample-app textarea:focus-visible {
	outline: 3px solid rgba(6, 79, 196, 0.24);
	outline-offset: 3px;
}

.rjy-sample-empty,
[data-rjy-review] section {
	background: var(--rjy-sample-panel);
}

.rjy-sample-alert {
	border-radius: 4px;
}

.rjy-sample-success {
	position: relative;
	padding: clamp(38px, 6vw, 64px);
	border-color: var(--rjy-sample-line);
	border-radius: var(--rjy-sample-radius);
	box-shadow: var(--rjy-sample-shadow);
}

.rjy-sample-success::before {
	display: block;
	width: 48px;
	height: 48px;
	margin-bottom: 24px;
	border-radius: 8px;
	background:
		linear-gradient(135deg, transparent 45%, #fff 45% 55%, transparent 55%) 15px 23px / 12px 12px no-repeat,
		linear-gradient(45deg, transparent 45%, #fff 45% 55%, transparent 55%) 23px 19px / 18px 18px no-repeat,
		var(--rjy-sample-blue);
	content: "";
}

.rjy-sample-success h1,
.rjy-sample-success h2 {
	color: var(--rjy-sample-ink);
	font-size: clamp(34px, 5vw, 46px);
	font-weight: 800;
	line-height: 1.05;
	letter-spacing: 0;
}

.rjy-sample-success > strong {
	border-color: #bed2f2;
	border-radius: 4px;
	background: var(--rjy-sample-blue-soft);
	color: var(--rjy-sample-blue);
}

@media (max-width: 767.98px) {
	.rjy-sample-request-page,
	.rjy-sample-complete-page {
		width: min(calc(100% - 32px), 1180px) !important;
		margin: 32px auto 64px;
	}

	.rjy-sample-progress > p {
		border-color: #bed2f2;
		border-radius: 4px;
		background: var(--rjy-sample-blue-soft);
		color: var(--rjy-sample-blue);
	}

	.rjy-sample-step {
		padding: 26px 20px;
	}

	.rjy-sample-success {
		padding: 32px 22px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.rjy-sample-app *,
	.rjy-sample-app *::before,
	.rjy-sample-app *::after {
		scroll-behavior: auto !important;
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
	}
}

/* Active-theme typography bridge.
 * The plugin deliberately owns layout and weight, while the theme owns typefaces.
 */
.rjy-sample-app,
.rjy-sample-drawer,
.rjy-sample-indicator {
	font-family: var(--font-body, inherit);
}

.rjy-sample-app button,
.rjy-sample-app input,
.rjy-sample-app select,
.rjy-sample-app textarea,
.rjy-sample-drawer button,
.rjy-sample-drawer input,
.rjy-sample-drawer select,
.rjy-sample-drawer textarea {
	font-family: inherit;
}

.rjy-sample-app h1,
.rjy-sample-app h2,
.rjy-sample-app h3,
.rjy-sample-drawer h1,
.rjy-sample-drawer h2,
.rjy-sample-drawer h3,
.rjy-sample-kicker {
	font-family: var(--font-heading, var(--font-body, inherit)) !important;
}

.rjy-sample-success > strong {
	font-family: inherit;
}