/**
 * CTS Brief — minimal, function-first styling.
 *
 * @package CTS
 */

/* x-cloak: hide Alpine-only controls until Alpine boots (no-JS users never see
   the step nav, so the single-form fallback stays clean). */
[x-cloak] { display: none !important; }

.cts-brief-wrap { max-width: 720px; margin: 0 auto; }

.cts-brief fieldset {
	border: 1px solid #d9dce1;
	border-radius: 8px;
	padding: 1.25rem 1.25rem 0.5rem;
	margin: 0 0 1rem;
}
.cts-brief legend { font-weight: 600; padding: 0 0.4rem; }

.cts-brief p { margin: 0 0 1rem; }
.cts-brief label { display: block; font-weight: 600; margin-bottom: 0.3rem; }

.cts-brief input[type="text"],
.cts-brief input[type="email"],
.cts-brief input[type="tel"],
.cts-brief input[type="number"],
.cts-brief input[type="date"],
.cts-brief select,
.cts-brief textarea {
	width: 100%;
	padding: 0.6rem 0.7rem;
	border: 1px solid #c4c9d1;
	border-radius: 6px;
	font: inherit;
	box-sizing: border-box;
}

.cts-brief .cts-invalid { border-color: #c0392b; box-shadow: 0 0 0 2px rgba( 192, 57, 43, 0.15 ); }

/* Honeypot — visually + AT hidden, still in the DOM for bots. */
.cts-hp {
	position: absolute !important;
	left: -9999px !important;
	top: auto;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* Checkbox groups */
.cts-checks { display: grid; grid-template-columns: repeat( auto-fill, minmax( 200px, 1fr ) ); gap: 0.4rem 1rem; }
.cts-check { font-weight: 400; display: flex; align-items: flex-start; gap: 0.5rem; }
.cts-check input { width: auto; margin-top: 0.2rem; }
.cts-consent .cts-check { font-weight: 400; }

/* Step progress */
.cts-steps { list-style: none; display: flex; gap: 0.5rem; padding: 0; margin: 0 0 1rem; font-size: 0.85rem; }
.cts-steps li { flex: 1; padding: 0.5rem; text-align: center; border-radius: 6px; background: #eef0f3; color: #555; }
.cts-steps li.is-active { background: #1f3a5f; color: #fff; font-weight: 600; }

/* Buttons */
.cts-actions { display: flex; gap: 0.75rem; align-items: center; }
.cts-btn {
	display: inline-block;
	padding: 0.7rem 1.3rem;
	border: 0;
	border-radius: 6px;
	background: #1f3a5f;
	color: #fff;
	font: inherit;
	font-weight: 600;
	cursor: pointer;
	text-decoration: none;
}
.cts-btn:hover { background: #16294480; }
.cts-btn-primary { background: #1a7f4b; }
.cts-btn-ghost { background: transparent; color: #1f3a5f; border: 1px solid #1f3a5f; }

/* Notices */
.cts-note { padding: 0.85rem 1rem; border-radius: 6px; margin: 0 0 1rem; }
.cts-note.cts-error { background: #fcebea; border: 1px solid #e3b1ad; color: #7a221c; }
.cts-note.cts-success { background: #e9f7ef; border: 1px solid #a9d9bd; color: #1d5f3c; }
.cts-note.cts-info { background: #eaf2fb; border: 1px solid #aecbe8; color: #1f3a5f; }
.cts-note.cts-leasing { background: #fff6e6; border: 1px solid #e6c78c; color: #7a5a14; }

/* Confirmation shortlist */
.cts-shortlist { list-style: none; padding: 0; margin: 0 0 1rem; }
.cts-shortlist-item {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	padding: 0.75rem 1rem;
	border: 1px solid #e1e4e8;
	border-radius: 6px;
	margin-bottom: 0.5rem;
}
.cts-sl-name { font-weight: 600; }
.cts-sl-region { color: #555; font-size: 0.9rem; }
.cts-badge { font-size: 0.72rem; padding: 0.15rem 0.5rem; border-radius: 999px; }
.cts-badge-verified { background: #1a7f4b; color: #fff; }
.cts-muted { color: #555; font-size: 0.9rem; }

/* Claim form reuse */
.cts-claim { max-width: 480px; margin: 0 auto; }
.cts-form input { width: 100%; padding: 0.6rem 0.7rem; border: 1px solid #c4c9d1; border-radius: 6px; box-sizing: border-box; }
