/* =========================================================
	Ray’s Contact Form — Style: Cupertino Glass
	Frosted · Minimal · Premium
	========================================================= */

.rayscontact-form {
	--rc-font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", system-ui, sans-serif;
	--rc-font-size: 14px;

	--rc-bg: rgba(255, 255, 255, 0.75);
	--rc-text: #111827;
	--rc-border: rgba(255, 255, 255, 0.4);

	--rc-primary: #007aff;             /* iOS blue */
	--rc-primary-soft: rgba(0, 122, 255, 0.25);

	--rc-error: #ff3b30;
	--rc-success: #34c759;

	--rc-radius: 16px;
	--rc-gap: 20px;

	background: transparent;
	font-size: var(--rc-font-size);
	color: var(--rc-text);
}

/* ---------------------------------------------------------
	Form shell
--------------------------------------------------------- */

.rayscontact-form form {
	background: rgba(255, 255, 255, 0.7);
	backdrop-filter: blur(18px) saturate(180%);
	-webkit-backdrop-filter: blur(18px) saturate(180%);
	padding: 32px;
	border-radius: var(--rc-radius);
	border: 1px solid var(--rc-border);
	box-shadow:
	0 30px 60px rgba(0, 0, 0, 0.12);
}

/* ---------------------------------------------------------
	Labels & help
--------------------------------------------------------- */

.rayscontact-label {
	font-weight: 500;
	color: #111827;
}

.rayscontact-help {
	font-size: 12px;
	color: #6b7280;
}

.rayscontact-error {
	font-size: 12px;
	color: var(--rc-error);
}

.rayscontact-success {
	font-size: 12px;
	color: var(--rc-success);
}

/* ---------------------------------------------------------
	Inputs (text, email, number, url, password)
--------------------------------------------------------- */

.rayscontact-form .rayscontact-input,
.rayscontact-form .rayscontact-textarea,
.rayscontact-form .rayscontact-select {
	background: rgba(255, 255, 255, 0.85);
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: calc(var(--rc-radius) - 6px);
	padding: 12px 14px;
	color: var(--rc-text);
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.rayscontact-form .rayscontact-input::placeholder,
.rayscontact-form .rayscontact-textarea::placeholder {
	color: #9ca3af;
}

.rayscontact-form .rayscontact-input:focus,
.rayscontact-form .rayscontact-textarea:focus,
.rayscontact-form .rayscontact-select:focus {
	outline: none;
	border-color: var(--rc-primary);
	box-shadow:
	0 0 0 3px var(--rc-primary-soft);
}

/* Error state */
.rayscontact-form .rayscontact-field--error .rayscontact-input,
.rayscontact-form .rayscontact-field--error .rayscontact-textarea,
.rayscontact-form .rayscontact-field--error .rayscontact-select {
	border-color: var(--rc-error);
	box-shadow:
	0 0 0 3px rgba(255, 59, 48, 0.25);
}

/* Disabled */
.rayscontact-form .rayscontact-input:disabled,
.rayscontact-form .rayscontact-textarea:disabled,
.rayscontact-form .rayscontact-select:disabled {
	background: rgba(255, 255, 255, 0.6);
	color: #9ca3af;
	cursor: not-allowed;
}

/* ---------------------------------------------------------
	Textarea
--------------------------------------------------------- */

.rayscontact-form .rayscontact-textarea {
	resize: vertical;
	min-height: 140px;
}

/* ---------------------------------------------------------
	Choice controls (checkbox, radio, multiple choice)
--------------------------------------------------------- */

.rayscontact-choice-group {
	gap: 14px;
}

.rayscontact-choice-item {
	font-size: 14px;
	color: var(--rc-text);
}

.rayscontact-choice-item input {
	accent-color: var(--rc-primary);
}

/* ---------------------------------------------------------
	Terms / GDPR
--------------------------------------------------------- */

.rayscontact-field--terms,
.rayscontact-field--gdpr {
	background: rgba(255, 255, 255, 0.75);
	border: 1px solid rgba(0, 0, 0, 0.08);
	padding: 18px;
	border-radius: var(--rc-radius);
}

/* ---------------------------------------------------------
	Section / Structural
--------------------------------------------------------- */

.rayscontact-section {
	padding: 28px 0;
	border-top: 1px solid rgba(0, 0, 0, 0.08);
}

.rayscontact-accordion,
.rayscontact-tabs {
	background: rgba(255, 255, 255, 0.75);
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: var(--rc-radius);
}

/* ---------------------------------------------------------
	CAPTCHA
--------------------------------------------------------- */

.rayscontact-captcha {
	margin-top: 22px;
}

/* ---------------------------------------------------------
	Actions / Submit
--------------------------------------------------------- */

.rayscontact-submit {
	background: var(--rc-primary);
	color: #ffffff;
	font-weight: 600;
	border-radius: calc(var(--rc-radius) + 4px);
	padding: 18px 32px;
	box-shadow:
	0 12px 30px rgba(0, 122, 255, 0.45);
	transition: box-shadow 0.15s ease, transform 0.05s ease;
}

.rayscontact-submit:hover {
	box-shadow:
	0 16px 40px rgba(0, 122, 255, 0.6);
}

.rayscontact-submit:active {
	transform: translateY(1px);
}

.rayscontact-submit--secondary {
	background: transparent;
	color: var(--rc-primary);
	border: 1px solid rgba(0, 0, 0, 0.15);
}

/* ---------------------------------------------------------
	Messages
--------------------------------------------------------- */

.rayscontact-message--success {
	background: rgba(52, 199, 89, 0.12);
	border: 1px solid rgba(52, 199, 89, 0.3);
}

.rayscontact-message--error {
	background: rgba(255, 59, 48, 0.12);
	border: 1px solid rgba(255, 59, 48, 0.3);
}
