/**
 * Frontend submission form — Rev Exotics gold-on-ink visual language, but
 * standalone (doesn't depend on the theme's Tailwind so the form works on
 * any theme during development).
 */
.rs-form, .rs-form-gate {
	--ink: #0A0A0B;
	--bone: #F4F1EA;
	--gold: #D4AF37;
	--bronze: #8C6A2B;
	--smoke: #1A1A1C;
	max-width: 920px;
	margin: 80px auto;
	padding: 48px;
	background: var(--ink);
	color: var(--bone);
	border-radius: 4px;
	font-family: "Inter Tight", system-ui, sans-serif;
	border: 1px solid rgba(244,241,234,0.08);
}

.rs-form-gate { text-align: center; }
.rs-form-gate h2 { font-size: 32px; font-weight: 200; letter-spacing: -0.02em; margin: 0 0 16px; }
.rs-form-gate p { color: rgba(244,241,234,0.65); margin: 0 0 24px; }

.rs-form-header { margin-bottom: 40px; }
.rs-eyebrow { font-size: 11px; text-transform: uppercase; letter-spacing: 0.32em; color: var(--gold); margin-bottom: 12px; }
.rs-form-header h1 { font-size: 48px; font-weight: 200; letter-spacing: -0.03em; margin: 0 0 12px; line-height: 1; }
.rs-form-header p { color: rgba(244,241,234,0.65); margin: 0; max-width: 540px; }

.rs-flash { padding: 14px 18px; border-radius: 2px; margin-bottom: 24px; font-size: 14px; }
.rs-flash-success { background: rgba(212,175,55,0.12); border: 1px solid rgba(212,175,55,0.35); color: #f5e6b0; }
.rs-flash-error { background: rgba(209,68,47,0.12); border: 1px solid rgba(209,68,47,0.4); color: #f0c2bb; }

.rs-fieldset { border: 0; padding: 0; margin: 0 0 40px; }
.rs-fieldset legend { font-size: 11px; text-transform: uppercase; letter-spacing: 0.32em; color: var(--gold); padding: 0 0 20px; border-bottom: 1px solid rgba(244,241,234,0.08); width: 100%; margin-bottom: 24px; }

.rs-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 24px; }
.rs-field { display: flex; flex-direction: column; gap: 6px; }
.rs-field-full { grid-column: 1 / -1; }
.rs-label { font-size: 10px; text-transform: uppercase; letter-spacing: 0.24em; color: rgba(244,241,234,0.55); }
.rs-label em { color: var(--gold); font-style: normal; margin-left: 4px; }

.rs-field input, .rs-field select, .rs-field textarea {
	background: var(--smoke);
	border: 1px solid rgba(244,241,234,0.08);
	color: var(--bone);
	padding: 12px 14px;
	font-size: 15px;
	font-family: inherit;
	border-radius: 2px;
	transition: border-color 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
.rs-field input:focus, .rs-field select:focus, .rs-field textarea:focus {
	outline: none;
	border-color: var(--gold);
}
.rs-field textarea { resize: vertical; min-height: 88px; }

.rs-uploader { position: relative; }
.rs-uploader input[type=file] { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.rs-uploader-label {
	display: flex;
	flex-direction: column;
	gap: 8px;
	align-items: center;
	justify-content: center;
	padding: 56px 24px;
	border: 2px dashed rgba(244,241,234,0.18);
	border-radius: 2px;
	background: rgba(244,241,234,0.02);
	cursor: pointer;
	transition: border-color 0.3s cubic-bezier(0.16, 1, 0.3, 1), background 0.3s;
}
.rs-uploader-label:hover, .rs-uploader[data-dragover] .rs-uploader-label {
	border-color: var(--gold);
	background: rgba(212,175,55,0.04);
}
.rs-uploader-cta { font-size: 16px; font-weight: 500; }
.rs-uploader-hint { font-size: 12px; color: rgba(244,241,234,0.5); text-transform: uppercase; letter-spacing: 0.16em; }
.rs-uploader-preview { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 10px; margin-top: 16px; }
.rs-uploader-preview img { width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: 2px; }

.rs-actions { margin-top: 32px; padding-top: 24px; border-top: 1px solid rgba(244,241,234,0.08); }
.rs-btn { display: inline-flex; align-items: center; gap: 10px; padding: 14px 28px; border: 0; cursor: pointer; font-family: inherit; font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.32em; border-radius: 999px; transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), background 0.4s; text-decoration: none; }
.rs-btn-primary { background: var(--bone); color: var(--ink); }
.rs-btn-primary:hover { transform: scale(1.02); background: linear-gradient(135deg, var(--gold), var(--bronze)); color: var(--ink); }
.rs-fineprint { margin-top: 14px; font-size: 12px; color: rgba(244,241,234,0.45); }

@media (max-width: 640px) {
	.rs-form, .rs-form-gate { padding: 28px; margin: 32px 16px; }
	.rs-grid { grid-template-columns: 1fr; }
	.rs-form-header h1 { font-size: 32px; }
}
