/*
 * Dashboard + auth styles, aligned to the site's Elementor global tokens.
 *
 * Brand palette (extracted from Elementor kit):
 *   --e-global-color-primary    : #AA8D42  (gold)
 *   --e-global-color-secondary  : #424242  (dark grey, used for headings)
 *   --e-global-color-text       : #515158  (body text)
 *   --e-global-color-accent     : #921A0E  (brand red)
 *   --e-global-color-background : #FFFFFF
 *   --e-global-color-backgroundAccent : #E4E4F1
 *
 * Typography:
 *   Headings: Poppins
 *   Body:     Figtree
 */

:root {
	--cm-color-text: var(--e-global-color-text, #515158);
	--cm-color-heading: var(--e-global-color-secondary, #424242);
	--cm-color-accent: var(--e-global-color-accent, #921A0E);
	/* RGB triplet of the brand accent — used to derive translucent tints
	   (focus rings, hover washes, icon backgrounds) without hardcoding rgba.
	   If the brand palette changes, update both --cm-color-accent and this. */
	--cm-color-accent-rgb: 146, 26, 14;
	--cm-color-accent-dark: #7a160b;
	--cm-color-bg: var(--e-global-color-background, #ffffff);
	--cm-color-bg-soft: #f7f5f0;
	--cm-color-border: #e6e3dc;
	--cm-color-muted: #8a8a90;
	--cm-color-placeholder: #b5b3aa;

	--cm-font-heading: var(--e-global-typography-primary-font-family, "Poppins"), system-ui, sans-serif;
	--cm-font-body: var(--e-global-typography-text-font-family, "Figtree"), system-ui, sans-serif;

	--cm-radius: 6px;
	--cm-radius-lg: 10px;
}

/* ---------- Hide page title on dashboard pages (match Elementor pages) ---------- */

body.cm-has-dashboard .page-header,
body.cm-has-dashboard .entry-header,
body.cm-has-dashboard h1.entry-title,
body.cm-has-dashboard h1.page-title,
body.cm-has-dashboard .elementor-page-title {
	display: none !important;
}

/* ============================================================
 * ROLE-SECTION CARDS — applied to the three role widgets so
 * tracker, favourites and visits all read as a coherent set of
 * card-bound sections on /painel/, with their headings styled
 * the same way and their empty states framed in a soft tint.
 * ============================================================ */

.cm-track,
.cm-fav-list,
.cm-visits {
	background: var(--cm-color-bg);
	border: 1px solid var(--cm-color-border);
	border-radius: 10px;
	padding: 1.5rem 1.5rem 1.6rem;
	margin: 0;
	box-shadow: 0 1px 2px rgba(20, 20, 20, 0.03);
}

.cm-track__heading,
.cm-fav-list__heading,
.cm-visits__heading {
	margin: 0 0 1rem;
	font-family: var(--cm-font-heading);
	font-size: 1.15rem;
	font-weight: 600;
	color: var(--cm-color-heading);
	letter-spacing: -0.005em;
}

/* Empty state: dashed-border tint inside the card so it reads as
   "this section exists but is empty" without making the card itself
   feel broken. */
.cm-track .cm-section__body--placeholder,
.cm-fav-list .cm-section__body--placeholder,
.cm-visits .cm-section__body--placeholder {
	background: var(--cm-color-bg-soft);
	border: 1px dashed var(--cm-color-border);
	border-radius: var(--cm-radius);
	padding: 1.1rem 1.25rem;
}

.cm-track .cm-section__body--placeholder p,
.cm-fav-list .cm-section__body--placeholder p,
.cm-visits .cm-section__body--placeholder p {
	margin: 0;
	color: var(--cm-color-muted);
	font-size: 0.95rem;
	line-height: 1.55;
}

/* ============================================================
 * NEXT STEPS WIDGET (cm_next_steps) — top-of-painel summary of
 * what currently needs the client's attention.
 * ============================================================ */

.cm-next {
	background: var(--cm-color-bg);
	border: 1px solid var(--cm-color-border);
	border-radius: 10px;
	padding: 1.4rem 1.5rem 1.5rem;
	box-shadow: 0 1px 2px rgba(20, 20, 20, 0.03);
}

/* When there's at least one aguarda item, lift the card with the brand
   accent so the eye lands here first on page load. */
.cm-next--has-attention {
	border-color: rgba(var(--cm-color-accent-rgb), 0.3);
	box-shadow: 0 1px 2px rgba(var(--cm-color-accent-rgb), 0.06),
	            0 4px 14px -8px rgba(var(--cm-color-accent-rgb), 0.15);
}

.cm-next__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 0.85rem;
}

.cm-next__heading {
	margin: 0;
	font-family: var(--cm-font-heading);
	font-size: 1.15rem;
	font-weight: 600;
	color: var(--cm-color-heading);
	letter-spacing: -0.005em;
}

.cm-next__all-clear {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	color: #0a6627;
}

.cm-next__all-clear svg { color: #0a8a35; flex-shrink: 0; }
.cm-next__all-clear p { margin: 0; font-size: 0.95rem; color: var(--cm-color-text); }

.cm-next__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.55rem;
}

.cm-next__item {
	display: flex;
	align-items: center;
	gap: 0.85rem;
	padding: 0.75rem 0.95rem;
	border: 1px solid var(--cm-color-border);
	border-radius: var(--cm-radius);
	background: var(--cm-color-bg);
}
.cm-next__item--aguarda {
	background: rgba(var(--cm-color-accent-rgb), 0.04);
	border-color: rgba(var(--cm-color-accent-rgb), 0.25);
}
.cm-next__item--em_curso {
	background: var(--cm-color-bg-soft);
}

.cm-next__item-icon {
	flex-shrink: 0;
	width: 32px;
	height: 32px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
}
.cm-next__item--aguarda .cm-next__item-icon { color: var(--cm-color-accent); background: rgba(var(--cm-color-accent-rgb), 0.1); }
.cm-next__item--em_curso .cm-next__item-icon { color: #1d4ed8; background: #e8eef9; }

.cm-next__item-body { flex: 1; min-width: 0; }
.cm-next__item-title {
	font-weight: 600;
	color: var(--cm-color-heading);
	font-size: 0.96rem;
}
.cm-next__item-status {
	font-size: 0.85rem;
	color: var(--cm-color-muted);
	margin-top: 1px;
}

.cm-next__item-cta {
	flex-shrink: 0;
	color: var(--cm-color-accent);
	text-decoration: none !important;
	font-size: 0.9rem;
	font-weight: 600;
	white-space: nowrap;
	border-bottom: 1px solid transparent;
	transition: border-color 0.15s ease;
}
.cm-next__item-cta:hover { border-bottom-color: currentColor; }

@media (max-width: 540px) {
	.cm-next__item { flex-wrap: wrap; }
	.cm-next__item-cta { margin-left: 47px; margin-top: 4px; }
}

/* ============================================================
 * COLLAPSED CONCLUDED STAGES — when 3+ stages at the start of a
 * property timeline are concluded, group them into a click-to-expand
 * details so the visible timeline focuses on current/upcoming work.
 * ============================================================ */

.cm-track__step--collapsed-wrap {
	padding-left: 0;
}
.cm-track__step--collapsed-wrap .cm-track__collapsed {
	margin-left: 36px;
	margin-top: 4px;
}
.cm-track__collapsed-summary {
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.4rem 0.85rem;
	background: var(--cm-color-bg-soft);
	border: 1px dashed var(--cm-color-border);
	border-radius: 999px;
	font-size: 0.85rem;
	color: var(--cm-color-muted);
	font-weight: 500;
	user-select: none;
	list-style: none;
}
.cm-track__collapsed-summary::-webkit-details-marker { display: none; }
.cm-track__collapsed-summary:hover {
	color: var(--cm-color-heading);
	border-color: var(--cm-color-muted);
}
.cm-track__collapsed-toggle {
	color: var(--cm-color-accent);
	font-weight: 600;
}
.cm-track__collapsed[open] .cm-track__collapsed-toggle::after { content: ""; }
.cm-track__collapsed[open] .cm-track__collapsed-summary {
	margin-bottom: 0.6rem;
}

.cm-track__steps--inner {
	margin: 0.6rem 0 0;
	padding-left: 0;
}

/* ============================================================
 * ONBOARDING BANNER (cm_onboarding)
 * ============================================================ */

.cm-onboarding {
	display: flex;
	gap: 1rem;
	align-items: flex-start;
	padding: 1.1rem 1.25rem;
	margin: 0;
	background: rgba(var(--cm-color-accent-rgb), 0.06);
	border: 1px solid rgba(var(--cm-color-accent-rgb), 0.2);
	border-radius: 10px;
	position: relative;
}

.cm-onboarding__icon {
	flex-shrink: 0;
	color: var(--cm-color-accent);
	display: flex;
	align-items: center;
	padding-top: 4px;
}

.cm-onboarding__body { flex: 1; min-width: 0; }

.cm-onboarding__heading {
	margin: 0 0 0.4rem;
	font-family: var(--cm-font-heading);
	font-size: 1.05rem;
	font-weight: 600;
	color: var(--cm-color-heading);
}

.cm-onboarding__text {
	margin: 0 0 0.85rem;
	font-size: 0.93rem;
	line-height: 1.55;
	color: var(--cm-color-text);
}
.cm-onboarding__text p { margin: 0 0 0.5rem; }
.cm-onboarding__text p:last-child { margin-bottom: 0; }

.cm-onboarding__dismiss {
	background: transparent;
	border: 1px solid var(--cm-color-accent);
	color: var(--cm-color-accent);
	padding: 0.45rem 0.95rem;
	border-radius: 4px;
	font: inherit;
	font-size: 0.88rem;
	font-weight: 500;
	cursor: pointer;
	transition: background 0.15s ease, color 0.15s ease;
}
.cm-onboarding__dismiss:hover {
	background: var(--cm-color-accent);
	color: #fff;
}

.cm-onboarding__close {
	position: absolute;
	top: 8px;
	right: 10px;
	background: transparent;
	border: 0;
	color: var(--cm-color-muted);
	font-size: 22px;
	line-height: 1;
	cursor: pointer;
	padding: 4px 8px;
	border-radius: 4px;
}
.cm-onboarding__close:hover { color: var(--cm-color-accent); }

/* ============================================================
 * SELLER VISITS LIST (cm_seller_visits) — visit cards
 * ============================================================ */

.cm-visits__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.65rem;
}

.cm-visits__item {
	display: flex;
	gap: 1rem;
	align-items: stretch;
	padding: 0.85rem 1rem;
	border: 1px solid var(--cm-color-border);
	border-radius: var(--cm-radius);
	background: var(--cm-color-bg);
	transition: border-color 0.15s ease;
}
.cm-visits__item--confirmada { border-left: 3px solid #0a8a35; }
.cm-visits__item--solicitada { border-left: 3px solid #d97a00; }
.cm-visits__item--recusada,
.cm-visits__item--cancelada  { border-left: 3px solid var(--cm-color-muted); opacity: 0.75; }
.cm-visits__item--realizada  { border-left: 3px solid #1d4ed8; }

.cm-visits__date-block {
	flex-shrink: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	min-width: 64px;
	padding: 0.3rem 0;
	border-right: 1px solid var(--cm-color-border);
	padding-right: 0.95rem;
	font-family: var(--cm-font-heading);
}
.cm-visits__date-day {
	font-size: 1.55rem;
	font-weight: 600;
	color: var(--cm-color-heading);
	line-height: 1;
}
.cm-visits__date-month {
	font-size: 0.78rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--cm-color-muted);
	margin-top: 0.15rem;
}
.cm-visits__date-time {
	margin-top: 0.4rem;
	font-size: 0.82rem;
	color: var(--cm-color-accent);
	font-weight: 600;
}

.cm-visits__info { flex: 1; min-width: 0; }
.cm-visits__title {
	font-weight: 600;
	color: var(--cm-color-heading);
	font-size: 0.98rem;
}
.cm-visits__meta {
	font-size: 0.85rem;
	color: var(--cm-color-muted);
	margin-top: 2px;
}
.cm-visits__status {
	display: inline-block;
	padding: 1px 8px;
	border-radius: 999px;
	font-size: 0.7rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}
.cm-visits__status--confirmada { background: #e8f5ee; color: #0a6627; }
.cm-visits__status--solicitada { background: #fff5e6; color: #8a4a00; }
.cm-visits__status--recusada,
.cm-visits__status--cancelada  { background: #f4f4f5; color: #666; }
.cm-visits__status--realizada  { background: #e8eef9; color: #1d4ed8; }

.cm-visits__msg {
	margin-top: 0.3rem;
	font-size: 0.85rem;
	color: var(--cm-color-text);
	font-style: italic;
}

/* ============================================================
 * PROFILE EDIT WIDGET (cm_profile_edit) — accordion: closed by
 * default, opens to a full edit form. Keeps the painel focused on
 * active deals while keeping account management always reachable.
 * ============================================================ */

.cm-profile {
	background: var(--cm-color-bg);
	border: 1px solid var(--cm-color-border);
	border-radius: 10px;
	margin: 0;
	box-shadow: 0 1px 2px rgba(20, 20, 20, 0.03);
	overflow: hidden;
}

.cm-profile__summary {
	cursor: pointer;
	list-style: none;
	display: flex;
	align-items: center;
	gap: 0.85rem;
	padding: 1rem 1.5rem;
	user-select: none;
	transition: background 0.15s ease;
}
.cm-profile__summary::-webkit-details-marker { display: none; }
.cm-profile__summary:hover { background: var(--cm-color-bg-soft); }

.cm-profile__summary-icon {
	flex-shrink: 0;
	width: 34px;
	height: 34px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: var(--cm-color-bg-soft);
	color: var(--cm-color-muted);
}

.cm-profile__summary-text {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
}

.cm-profile__summary-title {
	font-family: var(--cm-font-heading);
	font-size: 1rem;
	font-weight: 600;
	color: var(--cm-color-heading);
}

.cm-profile__summary-sub {
	font-size: 0.85rem;
	color: var(--cm-color-muted);
	margin-top: 1px;
}

.cm-profile__summary-toggle {
	color: var(--cm-color-muted);
	transition: transform 0.2s ease, color 0.15s ease;
}
.cm-profile[open] .cm-profile__summary-toggle { transform: rotate(180deg); color: var(--cm-color-accent); }

.cm-profile__body {
	padding: 0.5rem 1.5rem 1.5rem;
	border-top: 1px solid var(--cm-color-border);
}

.cm-profile__form { max-width: 520px; padding-top: 1rem; }

.cm-profile__pwd {
	margin-top: 0.4rem;
	padding: 0;
}

.cm-profile__pwd > summary {
	cursor: pointer;
	padding: 0.5rem 0;
	font-size: 0.92rem;
	font-weight: 500;
	color: var(--cm-color-accent);
	list-style: none;
}
.cm-profile__pwd > summary::-webkit-details-marker { display: none; }
.cm-profile__pwd > summary::before {
	content: "▸";
	display: inline-block;
	margin-right: 0.4em;
	transition: transform 0.15s ease;
}
.cm-profile__pwd[open] > summary::before { transform: rotate(90deg); }

.cm-profile__notice {
	padding: 0.7rem 0.95rem;
	border-radius: var(--cm-radius);
	font-size: 0.9rem;
	margin-bottom: 1rem;
}
.cm-profile__notice--ok {
	background: #e8f5ee;
	border: 1px solid #b8dcc6;
	color: #08612e;
}
.cm-profile__notice--err {
	background: #fdecec;
	border: 1px solid #f3c2c2;
	color: #7a160b;
}

/* ============================================================
 * SELLER UPLOAD form inside the property tracker — drop-zone
 * style upload area + list of previously-uploaded files with
 * per-file delete affordance.
 * ============================================================ */

.cm-track__upload {
	margin: 1.2rem 0 0;
	padding: 1.2rem 1.3rem;
	background: var(--cm-color-bg);
	border: 1px solid var(--cm-color-border);
	border-radius: var(--cm-radius);
}

.cm-track__upload .cm-track__shared-heading {
	margin-bottom: 0.85rem;
}

/* List of files already uploaded by the seller. */
.cm-track__uploaded-list {
	list-style: none;
	margin: 0 0 1rem;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}

.cm-track__uploaded-item {
	display: flex;
	align-items: center;
	gap: 0.85rem;
	padding: 0.6rem 0.85rem;
	background: var(--cm-color-bg-soft);
	border: 1px solid var(--cm-color-border);
	border-radius: var(--cm-radius);
}

.cm-track__uploaded-icon {
	flex-shrink: 0;
	color: var(--cm-color-accent);
}

.cm-track__uploaded-info {
	flex: 1;
	min-width: 0;
}

.cm-track__uploaded-name {
	font-weight: 600;
	color: var(--cm-color-heading);
	font-size: 0.95rem;
}

.cm-track__uploaded-meta {
	display: flex;
	gap: 0.7rem;
	flex-wrap: wrap;
	font-size: 0.78rem;
	color: var(--cm-color-muted);
	margin-top: 2px;
}

.cm-track__uploaded-delete-form {
	margin: 0;
	flex-shrink: 0;
}

.cm-track__uploaded-delete {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	padding: 0;
	border: 1px solid var(--cm-color-border);
	border-radius: 6px;
	background: transparent;
	color: var(--cm-color-muted);
	cursor: pointer;
	transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease;
}
.cm-track__uploaded-delete:hover,
.cm-track__uploaded-delete:focus-visible {
	color: var(--cm-color-accent);
	border-color: var(--cm-color-accent);
	background: rgba(var(--cm-color-accent-rgb), 0.06);
	outline: none;
}

/* Drop-zone: a label that wraps the file input. The input is visually
   hidden but still clickable through the label. */
.cm-track__upload-dropzone {
	display: block;
	position: relative;
	padding: 1.4rem 1rem;
	text-align: center;
	background: var(--cm-color-bg-soft);
	border: 2px dashed var(--cm-color-border);
	border-radius: var(--cm-radius);
	cursor: pointer;
	transition: border-color 0.15s ease, background 0.15s ease;
	margin-bottom: 0.85rem;
}
.cm-track__upload-dropzone:hover,
.cm-track__upload-dropzone.is-dragover {
	border-color: var(--cm-color-accent);
	background: rgba(var(--cm-color-accent-rgb), 0.04);
}
.cm-track__upload-dropzone svg {
	color: var(--cm-color-accent);
	display: block;
	margin: 0 auto 0.35rem;
}
.cm-track__upload-dropzone p {
	margin: 0;
	font-size: 0.92rem;
	color: var(--cm-color-text);
}
.cm-track__upload-dropzone strong {
	color: var(--cm-color-heading);
}
.cm-track__upload-dropzone--demo {
	cursor: default;
	opacity: 0.7;
}

.cm-track__upload-filename {
	display: block;
	margin-top: 0.5rem;
	font-size: 0.85rem;
	color: var(--cm-color-accent);
	font-weight: 600;
	min-height: 1.1em;
}

/* Hide the native input visually but keep it clickable through the
   wrapping label. */
.cm-track__upload-dropzone input[type="file"] {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.cm-track__upload-row {
	display: flex;
	flex-wrap: wrap;
	gap: 0.6rem;
	align-items: center;
}

.cm-track__upload-row input[type="text"] {
	flex: 1 1 200px;
	padding: 0.6rem 0.85rem;
	border: 1px solid var(--cm-color-border);
	border-radius: var(--cm-radius);
	font: inherit;
	min-width: 0;
}

.cm-track__upload-submit {
	padding: 0.6rem 1.4rem;
	background: var(--cm-color-accent);
	color: #fff;
	border: 1px solid var(--cm-color-accent);
	border-radius: var(--cm-radius);
	font: inherit;
	font-weight: 600;
	cursor: pointer;
	transition: background 0.15s ease;
}
.cm-track__upload-submit:hover {
	background: var(--cm-color-accent-dark);
}

.cm-track__upload-hint {
	margin: 0.7rem 0 0;
	font-size: 0.8rem;
	color: var(--cm-color-muted);
	line-height: 1.45;
}

/* "Substituir documento existente" inline checkbox shared by both
   the per-property upload and the standalone user-documents widget. */
.cm-user-docs__replace {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	margin-top: 0.55rem;
	font-size: 0.84rem;
	color: var(--cm-color-muted);
	cursor: pointer;
}
.cm-user-docs__replace input[type="checkbox"] {
	accent-color: var(--cm-color-accent);
	width: 14px;
	height: 14px;
	cursor: pointer;
}

/* User-documents widget shell — uses the same .cm-track__upload* internals
   for the dropzone + list, just with its own outer card. */
.cm-user-docs {
	background: var(--cm-color-bg);
	border: 1px solid var(--cm-color-border);
	border-radius: 10px;
	padding: 1.5rem 1.5rem 1.6rem;
	box-shadow: 0 1px 2px rgba(20, 20, 20, 0.03);
}
.cm-user-docs__heading {
	margin: 0 0 0.4rem;
	font-family: var(--cm-font-heading);
	font-size: 1.15rem;
	font-weight: 600;
	color: var(--cm-color-heading);
	letter-spacing: -0.005em;
}
.cm-user-docs__sub {
	margin: 0 0 1.1rem;
	color: var(--cm-color-muted);
	font-size: 0.92rem;
	line-height: 1.5;
}

/* ============================================================
 * SHARED DOCUMENTS — files the agency uploads on a property,
 * rendered at the bottom of each property's tracker for the seller.
 * ============================================================ */

.cm-track__shared {
	margin: 1.5rem 0 0;
	padding: 1.1rem 1.25rem;
	background: var(--cm-color-bg-soft);
	border: 1px solid var(--cm-color-border);
	border-radius: var(--cm-radius);
}

.cm-track__shared-heading {
	margin: 0 0 0.85rem;
	font-family: var(--cm-font-heading);
	font-size: 0.95rem;
	font-weight: 600;
	color: var(--cm-color-heading);
	display: flex;
	align-items: center;
}

.cm-track__shared-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.45rem;
}

.cm-track__shared-link {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: 0.6rem 0.85rem;
	background: var(--cm-color-bg);
	border: 1px solid var(--cm-color-border);
	border-radius: var(--cm-radius);
	color: var(--cm-color-text);
	text-decoration: none !important;
	transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease;
}

.cm-track__shared-link:hover,
.cm-track__shared-link:focus-visible {
	border-color: var(--cm-color-accent);
	color: var(--cm-color-accent);
	background: rgba(var(--cm-color-accent-rgb), 0.03);
	outline: none;
}

.cm-track__shared-name {
	font-weight: 500;
	font-size: 0.95rem;
}

.cm-track__shared-meta {
	display: inline-flex;
	align-items: center;
	gap: 0.7rem;
	font-size: 0.8rem;
	color: var(--cm-color-muted);
}

.cm-track__shared-meta svg {
	flex-shrink: 0;
}

/* ============================================================
 * DEMO PILL — small "Demo" inline tag attached to widget headings
 * when admin is viewing preview/demo data (no real records). Lets
 * admin see what the experience looks like without seeding test rows.
 * ============================================================ */

.cm-demo-pill {
	display: inline-block;
	margin-left: 0.65rem;
	padding: 0.1rem 0.55rem;
	font-family: var(--cm-font-body);
	font-size: 0.65rem;
	font-weight: 600;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var(--cm-color-muted);
	background: var(--cm-color-bg-soft);
	border: 1px dashed var(--cm-color-border);
	border-radius: 999px;
	vertical-align: middle;
	cursor: help;
}

.cm-track--demo,
.cm-fav-list--demo,
.cm-visits--demo {
	position: relative;
}

/* ============================================================
 * ADMIN BADGE WIDGET (cm_admin_badge)
 * ============================================================ */

.cm-admin-badge {
	display: inline-block;
	padding: 0.18rem 0.65rem;
	font-family: var(--cm-font-body);
	font-size: 0.72rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	border: 1px solid rgba(var(--cm-color-accent-rgb), 0.25);
	border-radius: 999px;
	cursor: help;
}

/* ============================================================
 * GREETING WIDGET (cm_dashboard_greeting)
 * ============================================================ */

.cm-greeting {
	margin: 0 0 1rem;
}

.cm-greeting__title {
	margin: 0 0 0.4rem;
	font-family: var(--cm-font-heading);
	font-size: clamp(1.75rem, 3vw, 2.4rem);
	font-weight: 600;
	color: var(--cm-color-heading);
	letter-spacing: -0.01em;
	line-height: 1.2;
}

.cm-greeting__subtitle {
	margin: 0;
	color: var(--cm-color-muted);
	font-size: 1rem;
}

/* ============================================================
 * LOGOUT WIDGET (cm_logout_button)
 * ============================================================ */

.cm-logout {
	display: flex;
	justify-content: flex-end;
}

.cm-logout__btn {
	display: inline-flex;
	align-items: center;
	gap: 0.4em;
	padding: 8px 16px;
	border: 1px solid var(--cm-color-border);
	border-radius: 4px;
	font-family: var(--e-global-typography-accent-font-family, var(--cm-font-body));
	font-size: var(--e-global-typography-accent-font-size, 16px);
	font-weight: 500;
	line-height: 1.5em;
	color: var(--cm-color-muted);
	background: transparent;
	text-decoration: none !important;
	transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease;
}

.cm-logout__btn:hover,
.cm-logout__btn:focus-visible {
	color: var(--cm-color-accent);
	border-color: var(--cm-color-accent);
	background: rgba(var(--cm-color-accent-rgb), 0.04);
	outline: none;
}

.cm-logout__btn:focus-visible {
	box-shadow: 0 0 0 3px rgba(var(--cm-color-accent-rgb), 0.15);
}

.cm-logout__icon {
	flex-shrink: 0;
}

/* ============================================================
 * DASHBOARD (logged in)
 * Card-based layout. Each role section (tracker, favourites,
 * visits, generic placeholder) is wrapped in a .cm-section
 * card so the page feels consistent regardless of which
 * attributes the user has.
 * ============================================================ */

.cm-dashboard {
	max-width: 960px;
	margin: 0 auto;
	padding: 3rem 1.25rem 4rem;
	font-family: var(--cm-font-body);
	color: var(--cm-color-text);
}

.cm-dashboard__header {
	margin-bottom: 2rem;
}

.cm-dashboard h1 {
	margin: 0 0 0.4rem;
	font-family: var(--cm-font-heading);
	font-size: clamp(1.75rem, 3vw, 2.4rem);
	font-weight: 600;
	color: var(--cm-color-heading);
	letter-spacing: -0.01em;
}

.cm-dashboard__subtitle {
	margin: 0;
	color: var(--cm-color-muted);
	font-size: 1rem;
}

.cm-dashboard__badge {
	display: inline-block;
	margin: 0 0 0.85rem;
	padding: 0.18rem 0.65rem;
	font-family: var(--cm-font-body);
	font-size: 0.72rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--cm-color-accent);
	background: rgba(var(--cm-color-accent-rgb), 0.08);
	border: 1px solid rgba(var(--cm-color-accent-rgb), 0.25);
	border-radius: 999px;
	cursor: help;
}

/* ---------- Section cards ---------- */

.cm-section {
	background: var(--cm-color-bg);
	border: 1px solid var(--cm-color-border);
	border-radius: 10px;
	padding: 1.5rem 1.5rem 1.6rem;
	margin: 0 0 1.25rem;
	box-shadow: 0 1px 2px rgba(20, 20, 20, 0.03);
}

.cm-section + .cm-section {
	margin-top: 1.25rem;
}

.cm-section__heading {
	margin: 0 0 1rem;
	font-family: var(--cm-font-heading);
	font-size: 1.15rem;
	font-weight: 600;
	color: var(--cm-color-heading);
	letter-spacing: -0.005em;
}

.cm-section__body {
	margin: 0;
	color: var(--cm-color-text);
}

.cm-section__body p {
	margin: 0;
}

.cm-section__body p + p {
	margin-top: 0.6rem;
}

/* Placeholder/empty-state variant — softer, dashed border, soft tint. */
.cm-section--placeholder {
	background: var(--cm-color-bg-soft);
	border-style: dashed;
	border-color: var(--cm-color-border);
}

.cm-section__body--placeholder p {
	color: var(--cm-color-muted);
	font-size: 0.95rem;
	line-height: 1.55;
}

/* ---------- Footer / logout ---------- */

.cm-dashboard__footer {
	margin-top: 2rem;
	display: flex;
	justify-content: flex-end;
}

.cm-dashboard__logout {
	display: inline-flex;
	align-items: center;
	padding: 0.55rem 1rem;
	font-family: var(--cm-font-body);
	font-size: 0.9rem;
	font-weight: 500;
	color: var(--cm-color-muted);
	background: transparent;
	border: 1px solid var(--cm-color-border);
	border-radius: 4px;
	text-decoration: none !important;
	transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease;
}

.cm-dashboard__logout:hover,
.cm-dashboard__logout:focus-visible {
	color: var(--cm-color-accent);
	border-color: var(--cm-color-accent);
	background: rgba(var(--cm-color-accent-rgb), 0.04);
	outline: none;
}

.cm-dashboard__logout:focus-visible {
	box-shadow: 0 0 0 3px rgba(var(--cm-color-accent-rgb), 0.15);
}

/* ---------- Auth (login + signup) ---------- */

.cm-auth {
	min-height: 60vh;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 3rem 1rem;
	font-family: var(--cm-font-body);
	color: var(--cm-color-text);
}

.cm-auth__card {
	width: 100%;
	max-width: 460px;
	background: var(--cm-color-bg);
	border: 1px solid var(--cm-color-border);
	border-radius: var(--cm-radius-lg);
	padding: 2rem;
	box-shadow: 0 2px 16px rgba(66, 66, 66, 0.04);
}

.cm-auth__tabs {
	display: flex;
	gap: 0;
	margin-bottom: 1.75rem;
	border-bottom: 1px solid var(--cm-color-border);
}

.cm-auth__tab {
	flex: 1;
	text-align: center;
	padding: 0.85rem 0.5rem;
	font-family: var(--cm-font-heading);
	font-size: 0.95rem;
	font-weight: 500;
	color: var(--cm-color-muted);
	text-decoration: none;
	border-bottom: 2px solid transparent;
	margin-bottom: -1px;
	transition: color 0.15s ease, border-color 0.15s ease;
}

.cm-auth__tab:hover {
	color: var(--cm-color-heading);
}

.cm-auth__tab.is-active {
	color: var(--cm-color-accent);
	border-bottom-color: var(--cm-color-accent);
}

.cm-auth__error {
	background: #fdecec;
	border: 1px solid #f3c2c2;
	color: var(--cm-color-accent-dark);
	padding: 0.7rem 0.9rem;
	border-radius: var(--cm-radius);
	font-size: 0.9rem;
	margin-bottom: 1.25rem;
}

.cm-auth__form {
	display: flex;
	flex-direction: column;
	gap: 1.1rem;
}

.cm-auth__row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0.75rem;
}

.cm-auth__field {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
}

.cm-auth__label {
	font-family: var(--cm-font-heading);
	font-size: 0.85rem;
	font-weight: 500;
	color: var(--cm-color-heading);
}

.cm-auth__field input[type="text"],
.cm-auth__field input[type="email"],
.cm-auth__field input[type="password"] {
	width: 100%;
	box-sizing: border-box;
	padding: 0.75rem 0.9rem;
	font-family: var(--cm-font-body);
	font-size: 1rem;
	color: var(--cm-color-text);
	background: var(--cm-color-bg);
	border: 1px solid var(--cm-color-border);
	border-radius: var(--cm-radius);
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.cm-auth__field input:focus {
	outline: none;
	border-color: var(--cm-color-accent);
	box-shadow: 0 0 0 3px rgba(var(--cm-color-accent-rgb), 0.1);
}

.cm-auth__hint {
	font-size: 0.8rem;
	color: var(--cm-color-muted);
}

.cm-auth__checkbox {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	font-size: 0.9rem;
	color: var(--cm-color-text);
	cursor: pointer;
}

.cm-auth__submit {
	margin-top: 0.5rem;
	padding: 0.85rem 1rem;
	font-family: var(--cm-font-heading);
	font-size: 0.95rem;
	font-weight: 600;
	letter-spacing: 0.01em;
	color: #fff;
	background: var(--cm-color-accent);
	border: none;
	border-radius: var(--cm-radius);
	cursor: pointer;
	transition: background 0.15s ease, transform 0.05s ease;
}

.cm-auth__submit:hover {
	background: var(--cm-color-accent-dark);
}

.cm-auth__submit:active {
	transform: translateY(1px);
}

.cm-auth__small {
	margin: 0.4rem 0 0;
	font-size: 0.85rem;
	color: var(--cm-color-muted);
	text-align: center;
}

.cm-auth__small a {
	color: var(--cm-color-accent);
	text-decoration: none;
}

.cm-auth__small a:hover {
	text-decoration: underline;
}

.cm-auth__terms {
	margin-top: 0.75rem;
}

@media ( max-width: 480px ) {
	.cm-auth__card {
		padding: 1.5rem;
	}
	.cm-auth__row {
		grid-template-columns: 1fr;
	}
}

/* ---------- Property tracker timeline ---------- */

.cm-track {
	margin: 0 0 2rem;
}

.cm-track__heading {
	margin: 0 0 1.5rem;
	font-family: var(--cm-font-heading);
	font-size: 1.4rem;
	font-weight: 600;
	color: var(--cm-color-heading);
}

.cm-track__property {
	background: var(--cm-color-bg);
	border: 1px solid var(--cm-color-border);
	border-radius: var(--cm-radius-lg);
	padding: 1.5rem 1.5rem 1rem;
	margin-bottom: 1.5rem;
}

.cm-track__property-header {
	margin-bottom: 1.25rem;
	padding-bottom: 1rem;
	border-bottom: 1px solid var(--cm-color-border);
}

.cm-track__property-title {
	margin: 0 0 0.25rem;
	font-family: var(--cm-font-heading);
	font-size: 1.15rem;
	font-weight: 600;
	color: var(--cm-color-heading);
}

.cm-track__property-meta {
	margin: 0;
	font-size: 0.9rem;
	color: var(--cm-color-muted);
}

.cm-track__steps {
	list-style: none;
	margin: 0;
	padding: 0;
}

.cm-track__step {
	position: relative;
	padding: 0 0 1.25rem 2.5rem;
}

.cm-track__step:last-child {
	padding-bottom: 0;
}

.cm-track__connector {
	position: absolute;
	left: 0.85rem;
	top: 1.25rem;
	bottom: -0.25rem;
	width: 2px;
	background: var(--cm-color-border);
	z-index: 0;
}

.cm-track__step:last-child .cm-track__connector {
	display: none;
}

.cm-track__dot {
	position: absolute;
	left: 0.4rem;
	top: 0.15rem;
	width: 1rem;
	height: 1rem;
	border-radius: 50%;
	background: #fff;
	border: 2px solid var(--cm-color-border);
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	z-index: 1;
}

.cm-track__step.is-done .cm-track__dot {
	background: var(--cm-color-accent);
	border-color: var(--cm-color-accent);
}

.cm-track__step.is-current .cm-track__dot {
	background: #fff;
	border-color: var(--cm-color-accent);
	box-shadow: 0 0 0 4px rgba(var(--cm-color-accent-rgb), 0.12);
}

.cm-track__step.is-waiting .cm-track__dot {
	background: #fff;
	border-color: #d97706;
	box-shadow: 0 0 0 4px rgba(217, 119, 6, 0.12);
}

.cm-track__row {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 0.75rem;
	flex-wrap: wrap;
}

.cm-track__title {
	margin: 0;
	font-family: var(--cm-font-heading);
	font-size: 1rem;
	font-weight: 600;
	color: var(--cm-color-heading);
}

.cm-track__step.is-pending .cm-track__title {
	color: var(--cm-color-muted);
	font-weight: 500;
}

.cm-track__status {
	font-size: 0.75rem;
	font-weight: 500;
	padding: 0.15rem 0.55rem;
	border-radius: 999px;
	background: #f0eee9;
	color: var(--cm-color-muted);
	white-space: nowrap;
}

.cm-track__status--concluido {
	background: #e6f4ea;
	color: #1e7a3d;
}

.cm-track__status--em_curso {
	background: rgba(var(--cm-color-accent-rgb), 0.1);
	color: var(--cm-color-accent);
}

.cm-track__status--aguarda {
	background: #fef3c7;
	color: #92400e;
}

.cm-track__date {
	margin: 0.2rem 0 0;
	font-size: 0.8rem;
	color: var(--cm-color-muted);
}

.cm-track__description {
	margin: 0.4rem 0 0;
	font-size: 0.9rem;
	color: var(--cm-color-text);
}

.cm-track__notes {
	margin: 0.65rem 0 0;
	padding: 0.7rem 0.9rem;
	background: var(--cm-color-bg-soft);
	border-left: 3px solid var(--cm-color-accent);
	border-radius: 0 var(--cm-radius) var(--cm-radius) 0;
	font-size: 0.9rem;
}

.cm-track__notes p:last-child {
	margin-bottom: 0;
}

/* Documents checklist */

.cm-track__docs {
	list-style: none;
	margin: 0.65rem 0 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat( auto-fit, minmax( 220px, 1fr ) );
	gap: 0.5rem 1rem;
}

.cm-track__doc {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	font-size: 0.9rem;
}

.cm-track__doc-mark {
	display: inline-block;
	width: 1rem;
	height: 1rem;
	border-radius: 50%;
	border: 2px solid var(--cm-color-border);
	flex-shrink: 0;
	position: relative;
}

.cm-track__doc.is-received .cm-track__doc-mark {
	background: #e6f4ea;
	border-color: #1e7a3d;
}

.cm-track__doc.is-received .cm-track__doc-mark::after {
	content: "";
	position: absolute;
	left: 3px; top: 1px;
	width: 4px; height: 8px;
	border: solid #1e7a3d;
	border-width: 0 2px 2px 0;
	transform: rotate(45deg);
}

.cm-track__doc.is-missing {
	color: var(--cm-color-muted);
}

/* Visits */

.cm-track__visits {
	list-style: none;
	margin: 0.65rem 0 0;
	padding: 0;
}

.cm-track__visit {
	padding: 0.4rem 0;
	font-size: 0.9rem;
	border-bottom: 1px dashed var(--cm-color-border);
}

.cm-track__visit:last-child {
	border-bottom: 0;
}

.cm-track__visit--cancelada {
	color: var(--cm-color-muted);
	text-decoration: line-through;
}

.cm-track__amount,
.cm-track__location {
	margin: 0.5rem 0 0;
	font-size: 0.9rem;
	color: var(--cm-color-text);
}

/* ---------- Favourite button ---------- */

.cm-fav {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.55rem 0.9rem;
	background: #fff;
	border: 1.5px solid var(--cm-color-border);
	border-radius: 999px;
	font-family: var(--cm-font-body);
	font-size: 0.9rem;
	font-weight: 500;
	color: var(--cm-color-text);
	cursor: pointer;
	transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease;
	text-decoration: none;
}

.cm-fav:hover {
	border-color: var(--cm-color-accent);
	color: var(--cm-color-accent);
}

.cm-fav.is-on {
	color: var(--cm-color-accent);
	border-color: var(--cm-color-accent);
	background: rgba(var(--cm-color-accent-rgb), 0.05);
}

.cm-fav.is-on .cm-fav__icon {
	fill: var(--cm-color-accent);
}

.cm-fav__icon {
	flex-shrink: 0;
}

.cm-fav[disabled] {
	opacity: 0.6;
	cursor: wait;
}

/* ---------- Visit request form ---------- */

.cm-visit-request {
	background: var(--cm-color-bg);
	border: 1px solid var(--cm-color-border);
	border-radius: var(--cm-radius-lg);
	padding: 1.5rem;
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

.cm-visit-request__heading {
	margin: 0 0 0.25rem;
	font-family: var(--cm-font-heading);
	font-size: 1.15rem;
	font-weight: 600;
	color: var(--cm-color-heading);
}

.cm-visit-request input[type="datetime-local"],
.cm-visit-request textarea {
	width: 100%;
	box-sizing: border-box;
	padding: 0.7rem 0.85rem;
	font-family: var(--cm-font-body);
	font-size: 1rem;
	color: var(--cm-color-text);
	background: var(--cm-color-bg);
	border: 1px solid var(--cm-color-border);
	border-radius: var(--cm-radius);
}

.cm-visit-request input:focus,
.cm-visit-request textarea:focus {
	outline: none;
	border-color: var(--cm-color-accent);
	box-shadow: 0 0 0 3px rgba(var(--cm-color-accent-rgb), 0.1);
}

.cm-visit-request__feedback {
	font-size: 0.9rem;
	min-height: 1.25rem;
}

.cm-visit-request__feedback.is-success {
	color: #1e7a3d;
}

.cm-visit-request__feedback.is-error {
	color: var(--cm-color-accent-dark);
}

.cm-visit-request--locked {
	text-align: center;
}

/* ---------- Buyer dashboard: favourites list ---------- */

.cm-fav-list__items {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat( auto-fill, minmax( 260px, 1fr ) );
	gap: 1rem;
}

.cm-fav-list__link {
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid var(--cm-color-border);
	border-radius: var(--cm-radius-lg);
	overflow: hidden;
	text-decoration: none;
	color: inherit;
	transition: border-color 0.15s ease, transform 0.1s ease;
}

.cm-fav-list__link:hover {
	border-color: var(--cm-color-accent);
	transform: translateY(-2px);
}

.cm-fav-list__thumb {
	display: block;
	aspect-ratio: 4 / 3;
	background-size: cover;
	background-position: center;
	background-color: var(--cm-color-bg-soft);
}

.cm-fav-list__body {
	display: block;
	padding: 0.75rem 0.9rem 1rem;
}

.cm-fav-list__title {
	display: block;
	font-family: var(--cm-font-heading);
	font-size: 1rem;
	font-weight: 600;
	color: var(--cm-color-heading);
	margin-bottom: 0.2rem;
}

.cm-fav-list__meta {
	display: block;
	font-size: 0.85rem;
	color: var(--cm-color-muted);
}

/* ---------- Buyer dashboard: visits list ---------- */

.cm-visits__items {
	list-style: none;
	margin: 0;
	padding: 0;
}

.cm-visits__item {
	background: #fff;
	border: 1px solid var(--cm-color-border);
	border-radius: var(--cm-radius-lg);
	padding: 1rem 1.25rem;
	margin-bottom: 0.75rem;
}

.cm-visits__row {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 0.75rem;
	flex-wrap: wrap;
}

.cm-visits__title {
	font-family: var(--cm-font-heading);
	font-weight: 600;
	color: var(--cm-color-heading);
}

.cm-visits__title a {
	color: inherit;
	text-decoration: none;
}

.cm-visits__title a:hover {
	color: var(--cm-color-accent);
}

.cm-visits__date {
	margin: 0.4rem 0 0;
	font-size: 0.9rem;
	color: var(--cm-color-muted);
}

/* ============================================================
 * ACCOUNT BUTTONS WIDGET (CM Botões de Conta)
 * Default visual layer. Each property is overridable through the
 * Elementor sidebar — the widget renders selector-scoped style
 * controls that take precedence over these.
 * ============================================================ */

.cm-account-buttons {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: flex-end;
	gap: 9px;
	flex-wrap: wrap;
	font-family: var(--cm-font-body);
	margin: 0;
	padding: 0;
	list-style: none;
}

/* Visual language deliberately mirrors the site's existing Elementor
   buttons (12/24 padding, 4px radius, Figtree 16/400, 1.5em line-height,
   1px border the same colour as the fill). Hover lifts subtly. */
.cm-account-buttons__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5em;
	padding: 12px 24px;
	border: 1px solid transparent;
	border-radius: 4px;
	font-family: var(--e-global-typography-accent-font-family, var(--cm-font-body));
	font-size: var(--e-global-typography-accent-font-size, 16px);
	font-weight: var(--e-global-typography-accent-font-weight, 400);
	line-height: 1.5em;
	letter-spacing: 0;
	text-decoration: none !important;
	white-space: nowrap;
	cursor: pointer;
	transition: background-color 0.18s ease, color 0.18s ease, border-color 0.18s ease;
}

/* Ghost — logged-out "Entrar". Inherits text colour from heading. */
.cm-account-buttons__btn--login {
	color: var(--cm-color-heading);
	background: transparent;
}
.cm-account-buttons__btn--login:hover,
.cm-account-buttons__btn--login:focus-visible {
	color: var(--cm-color-accent);
	background: rgba(var(--cm-color-accent-rgb), 0.06);
}

/* Solid accent — logged-out "Criar conta". */
.cm-account-buttons__btn--signup {
	color: #ffffff;
	background: var(--cm-color-accent);
	border-color: var(--cm-color-accent);
	box-shadow: 0 1px 2px rgba(var(--cm-color-accent-rgb), 0.18);
}
.cm-account-buttons__btn--signup:hover,
.cm-account-buttons__btn--signup:focus-visible {
	background: var(--cm-color-accent-dark);
	border-color: var(--cm-color-accent-dark);
	color: #ffffff;
	transform: translateY(-1px);
	box-shadow: 0 6px 14px rgba(var(--cm-color-accent-rgb), 0.28);
}

/* Outlined — logged-in "{first name}". */
.cm-account-buttons__btn--account {
	color: var(--cm-color-accent);
	background: transparent;
	border-color: var(--cm-color-accent);
}
.cm-account-buttons__btn--account:hover,
.cm-account-buttons__btn--account:focus-visible {
	background: var(--cm-color-accent);
	color: #ffffff;
}

.cm-account-buttons__btn:focus-visible {
	outline: 2px solid var(--cm-color-accent);
	outline-offset: 2px;
}

.cm-account-buttons__icon {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
}

.cm-account-buttons__icon svg {
	display: block;
}

/* Some nav widgets (Elementor's WP Menu, Hello Elementor) inject link
   underline / colour rules on descendants. Defang for our buttons. */
.cm-account-buttons a,
.cm-account-buttons a:visited {
	text-decoration: none !important;
}

/* ============================================================
 * AUTH PAGE  — /painel/ logged out
 * Hero + tabbed card with login & signup forms.
 * ============================================================ */

.cm-auth-page {
	max-width: 1040px;
	margin: 0 auto;
	padding: 3rem 1.25rem 5rem;
	font-family: var(--cm-font-body);
	color: var(--cm-color-text);
	display: grid;
	grid-template-columns: 1fr;
	gap: 2.5rem;
	align-items: start;
}

/* Mobile-first stacking order: form first (action), hero second (reassurance).
   This puts the auth card right below the page heading area instead of forcing
   visitors to scroll past three benefit bullets to reach the form. */
.cm-auth-page > .cm-auth-card { order: 1; }
.cm-auth-page > .cm-auth-hero { order: 2; }

@media (min-width: 920px) {
	.cm-auth-page {
		grid-template-columns: 1.05fr 1fr;
		gap: 4rem;
		padding-top: 4rem;
	}
	/* Desktop: hero on the left, card on the right. */
	.cm-auth-page > .cm-auth-hero { order: 1; }
	.cm-auth-page > .cm-auth-card { order: 2; }
}

/* ---------- Hero ---------- */

.cm-auth-hero {
	max-width: 520px;
}

.cm-auth-hero__title {
	margin: 0 0 0.75rem;
	font-family: var(--cm-font-heading);
	font-size: clamp(1.85rem, 3.2vw, 2.6rem);
	font-weight: 600;
	letter-spacing: -0.015em;
	color: var(--cm-color-heading);
	line-height: 1.15;
}

.cm-auth-hero__subtitle {
	margin: 0 0 2rem;
	font-size: 1.05rem;
	line-height: 1.55;
	color: var(--cm-color-text);
	max-width: 46ch;
}

.cm-auth-hero__benefits {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 1.1rem;
}

.cm-auth-hero__benefit {
	display: flex;
	align-items: flex-start;
	gap: 0.85rem;
	color: var(--cm-color-text);
}

.cm-auth-hero__benefit-icon {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: 10px;
	background: rgba(var(--cm-color-accent-rgb), 0.08);
	color: var(--cm-color-accent);
}

.cm-auth-hero__benefit > div {
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
}

.cm-auth-hero__benefit strong {
	font-family: var(--cm-font-heading);
	font-size: 1rem;
	font-weight: 600;
	color: var(--cm-color-heading);
	letter-spacing: -0.005em;
}

.cm-auth-hero__benefit span {
	font-size: 0.93rem;
	line-height: 1.45;
	color: var(--cm-color-muted);
}

/* ---------- Card ---------- */

.cm-auth-card {
	background: var(--cm-color-bg);
	border: 1px solid var(--cm-color-border);
	border-radius: 16px;
	box-shadow:
		0 1px 2px rgba(20, 20, 20, 0.04),
		0 12px 32px -12px rgba(20, 20, 20, 0.10);
	padding: 1.75rem 1.75rem 2rem;
	max-width: 460px;
	width: 100%;
	justify-self: stretch;
}

@media (min-width: 920px) {
	.cm-auth-card {
		justify-self: end;
		padding: 2rem 2.25rem 2.25rem;
	}
}

.cm-auth-card__alert {
	display: flex;
	align-items: center;
	gap: 0.55rem;
	background: #fdecec;
	border: 1px solid #f3c2c2;
	color: #7a160b;
	padding: 0.7rem 0.85rem;
	border-radius: var(--cm-radius);
	font-size: 0.9rem;
	margin-bottom: 1.25rem;
}

.cm-auth-card__alert svg {
	flex-shrink: 0;
}

.cm-auth-card__tabs {
	position: relative;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0;
	margin-bottom: 1.5rem;
	background: var(--cm-color-bg-soft);
	border-radius: 999px;
	padding: 4px;
}

.cm-auth-card__tab {
	position: relative;
	z-index: 1;
	padding: 0.65rem 0.5rem;
	font-family: var(--cm-font-heading);
	font-size: 0.92rem;
	font-weight: 600;
	letter-spacing: 0.005em;
	color: var(--cm-color-muted);
	background: transparent;
	border: 0;
	border-radius: 999px;
	cursor: pointer;
	transition: color 0.2s ease;
}

.cm-auth-card__tab:hover {
	color: var(--cm-color-heading);
}

.cm-auth-card__tab.is-active {
	color: var(--cm-color-heading);
}

.cm-auth-card__tab:focus-visible {
	outline: 2px solid var(--cm-color-accent);
	outline-offset: 2px;
}

.cm-auth-card__tab-indicator {
	position: absolute;
	z-index: 0;
	top: 4px;
	bottom: 4px;
	left: 4px;
	width: calc(50% - 4px);
	background: var(--cm-color-bg);
	border-radius: 999px;
	box-shadow: 0 1px 3px rgba(20, 20, 20, 0.08);
	transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Indicator follows the active tab. Driven by data-active-view on the page
   wrapper so we don't need :has() support. */
.cm-auth-page[data-active-view="signup"] .cm-auth-card__tab-indicator {
	transform: translateX(100%);
}

.cm-auth-card__panel {
	display: none;
}

.cm-auth-card__panel.is-active {
	display: block;
	animation: cm-fade-in 0.25s ease;
}

@keyframes cm-fade-in {
	from { opacity: 0; transform: translateY(4px); }
	to   { opacity: 1; transform: none; }
}

/* ============================================================
 * FORM PRIMITIVES — used inside the auth card
 * ============================================================ */

.cm-form {
	display: flex;
	flex-direction: column;
	gap: 1.05rem;
}

.cm-form__field {
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
}

.cm-form__label {
	font-family: var(--cm-font-heading);
	font-size: 0.82rem;
	font-weight: 600;
	letter-spacing: 0.02em;
	color: var(--cm-color-heading);
}

.cm-form__input {
	width: 100%;
	box-sizing: border-box;
	padding: 0.78rem 0.95rem;
	font-family: var(--cm-font-body);
	font-size: 1rem;
	color: var(--cm-color-text);
	background: var(--cm-color-bg);
	border: 1px solid var(--cm-color-border);
	border-radius: var(--cm-radius);
	transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
	-webkit-appearance: none;
	appearance: none;
}

.cm-form__input::placeholder {
	color: var(--cm-color-placeholder);
}

/* Override Chrome's autofill yellow so inputs keep their card-coloured fill. */
.cm-form__input:-webkit-autofill,
.cm-form__input:-webkit-autofill:hover,
.cm-form__input:-webkit-autofill:focus {
	-webkit-box-shadow: 0 0 0 1000px var(--cm-color-bg) inset;
	-webkit-text-fill-color: var(--cm-color-text);
	transition: background-color 5000s ease-in-out 0s;
}

.cm-form__input:hover {
	border-color: #c8c5bb;
}

.cm-form__input:focus {
	outline: none;
	border-color: var(--cm-color-accent);
	box-shadow: 0 0 0 3px rgba(var(--cm-color-accent-rgb), 0.12);
}

.cm-form__input:invalid:not(:placeholder-shown):not(:focus) {
	border-color: #d97a73;
}

.cm-form__input-wrap {
	position: relative;
}

.cm-form__input-wrap .cm-form__input {
	padding-right: 2.85rem;
}

.cm-form__toggle {
	position: absolute;
	top: 50%;
	right: 0.5rem;
	transform: translateY(-50%);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	padding: 0;
	background: transparent;
	border: 0;
	border-radius: 6px;
	color: var(--cm-color-muted);
	cursor: pointer;
	transition: color 0.15s ease, background 0.15s ease;
}

.cm-form__toggle:hover {
	color: var(--cm-color-heading);
	background: rgba(0, 0, 0, 0.04);
}

.cm-form__toggle:focus-visible {
	outline: 2px solid var(--cm-color-accent);
	outline-offset: 1px;
}

.cm-form__hint {
	font-size: 0.82rem;
	color: var(--cm-color-muted);
}

.cm-form__row {
	display: grid;
	gap: 0.75rem;
}

.cm-form__row--two {
	grid-template-columns: 1fr 1fr;
}

@media (max-width: 480px) {
	.cm-form__row--two {
		grid-template-columns: 1fr;
	}
}

.cm-form__row--split {
	grid-template-columns: 1fr auto;
	align-items: center;
	gap: 1rem;
}

.cm-form__checkbox {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	font-size: 0.9rem;
	color: var(--cm-color-text);
	cursor: pointer;
}

.cm-form__checkbox input {
	accent-color: var(--cm-color-accent);
	width: 16px;
	height: 16px;
}

.cm-form__link {
	background: transparent;
	border: 0;
	padding: 0;
	font: inherit;
	color: var(--cm-color-accent);
	cursor: pointer;
	text-decoration: none;
	border-bottom: 1px solid transparent;
	transition: border-color 0.15s ease, color 0.15s ease;
}

.cm-form__link:hover,
.cm-form__link:focus-visible {
	color: var(--cm-color-accent-dark);
	border-bottom-color: currentColor;
	outline: none;
}

.cm-form__submit {
	margin-top: 0.4rem;
	padding: 0.95rem 1rem;
	font-family: var(--cm-font-heading);
	font-size: 0.98rem;
	font-weight: 600;
	letter-spacing: 0.01em;
	color: #ffffff;
	background: var(--cm-color-accent);
	border: 1px solid var(--cm-color-accent);
	border-radius: var(--cm-radius);
	cursor: pointer;
	box-shadow: 0 1px 2px rgba(var(--cm-color-accent-rgb), 0.18);
	transition: background 0.18s ease, border-color 0.18s ease, transform 0.05s ease, box-shadow 0.18s ease;
}

.cm-form__submit:hover {
	background: var(--cm-color-accent-dark);
	border-color: var(--cm-color-accent-dark);
	box-shadow: 0 6px 14px rgba(var(--cm-color-accent-rgb), 0.25);
}

.cm-form__submit:active {
	transform: translateY(1px);
	box-shadow: 0 1px 2px rgba(var(--cm-color-accent-rgb), 0.18);
}

.cm-form__submit:focus-visible {
	outline: 2px solid var(--cm-color-accent);
	outline-offset: 2px;
}

.cm-form__terms {
	margin: 0.25rem 0 0;
	font-size: 0.82rem;
	line-height: 1.5;
	color: var(--cm-color-muted);
	text-align: center;
}

.cm-form__switch {
	margin: 0.5rem 0 0;
	font-size: 0.9rem;
	color: var(--cm-color-muted);
	text-align: center;
}

.cm-form__switch .cm-form__link {
	font-weight: 600;
	margin-left: 0.25rem;
}

/* Mobile tightening for the auth card. */
@media (max-width: 540px) {
	.cm-auth-page {
		padding: 1.75rem 1rem 3.5rem;
		gap: 1.75rem;
	}
	.cm-auth-card {
		padding: 1.5rem 1.25rem 1.75rem;
		border-radius: 14px;
	}
	.cm-auth-hero__benefit-icon {
		width: 34px;
		height: 34px;
	}
}

/* ============================================================
 * SUBMIT LOADING STATE
 * The form auth handlers redirect on completion, so the visible
 * "submitting" window is short — but on slow connections it's
 * 1–2 seconds where the button looks dead. JS adds .is-loading
 * on submit; CSS turns the label into a spinner.
 * ============================================================ */

.cm-form__submit.is-loading {
	color: transparent !important;
	pointer-events: none;
	position: relative;
}

.cm-form__submit.is-loading::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 18px;
	height: 18px;
	margin: -9px 0 0 -9px;
	border-radius: 50%;
	border: 2px solid rgba(255, 255, 255, 0.4);
	border-top-color: #ffffff;
	animation: cm-spin 0.7s linear infinite;
}

@keyframes cm-spin {
	to { transform: rotate(360deg); }
}

/* ============================================================
 * REDUCED MOTION
 * Respect users who prefer minimal animation. Strip transitions,
 * indicator slide, fade-ins, hover translates, and the spinner
 * (which becomes a static disc).
 * ============================================================ */

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.001ms !important;
		scroll-behavior: auto !important;
	}

	.cm-auth-card__panel.is-active {
		animation: none;
	}

	.cm-account-buttons__btn:hover,
	.cm-form__submit:hover {
		transform: none;
	}

	.cm-form__submit.is-loading::after {
		animation: none;
		border-top-color: rgba(255, 255, 255, 0.4);
	}
}


/* ============================================================
 * IMÓVEIS LIST — public property grid rendered by [lista_imoveis].
 * ============================================================ */

.cm-imoveis-list {
	display: grid;
	grid-template-columns: repeat(var(--cm-imoveis-cols, 3), 1fr);
	gap: 1.5rem;
	font-family: var(--cm-font-body);
}
.cm-imoveis-list[data-cols="1"] { --cm-imoveis-cols: 1; }
.cm-imoveis-list[data-cols="2"] { --cm-imoveis-cols: 2; }
.cm-imoveis-list[data-cols="3"] { --cm-imoveis-cols: 3; }
.cm-imoveis-list[data-cols="4"] { --cm-imoveis-cols: 4; }

@media (max-width: 980px) { .cm-imoveis-list { --cm-imoveis-cols: 2; } }
@media (max-width: 600px) { .cm-imoveis-list { --cm-imoveis-cols: 1; } }

.cm-imoveis-list__empty {
	padding: 2rem;
	text-align: center;
	color: var(--cm-color-muted);
	font-style: italic;
	background: var(--cm-color-bg-soft);
	border: 1px dashed var(--cm-color-border);
	border-radius: var(--cm-radius-lg);
}

.cm-imovel-card {
	position: relative;
	display: flex;
	flex-direction: column;
	background: var(--cm-color-bg);
	border: 1px solid var(--cm-color-border);
	border-radius: 12px;
	overflow: hidden;
	transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
	box-shadow: 0 1px 2px rgba(20, 20, 20, 0.04);
}
.cm-imovel-card:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 24px -10px rgba(20, 20, 20, 0.14);
	border-color: rgba(var(--cm-color-accent-rgb), 0.3);
}

.cm-imovel-card__media {
	position: relative;
	display: block;
	aspect-ratio: 4 / 3;
	background: var(--cm-color-bg-soft);
	overflow: hidden;
	text-decoration: none !important;
}
.cm-imovel-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.4s ease;
}
.cm-imovel-card:hover .cm-imovel-card__media img { transform: scale(1.04); }

.cm-imovel-card__no-image {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--cm-color-muted);
}

.cm-imovel-card__badge {
	position: absolute;
	top: 12px;
	left: 12px;
	padding: 4px 10px;
	background: var(--cm-color-accent);
	color: #ffffff;
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	border-radius: 4px;
}

.cm-imovel-card__fav {
	position: absolute;
	top: 12px;
	right: 12px;
	width: 38px;
	height: 38px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: rgba(255, 255, 255, 0.94);
	border: 1px solid rgba(255, 255, 255, 0.8);
	color: var(--cm-color-muted);
	border-radius: 999px;
	cursor: pointer;
	transition: color 0.15s ease, transform 0.1s ease, background 0.15s ease;
	box-shadow: 0 1px 4px rgba(20, 20, 20, 0.12);
	z-index: 1;
}
.cm-imovel-card__fav:hover { color: var(--cm-color-accent); transform: scale(1.06); }
.cm-imovel-card__fav.is-on { color: var(--cm-color-accent); }
.cm-imovel-card__fav.is-on svg { fill: currentColor; }

.cm-imovel-card__body {
	padding: 1rem 1.1rem 1.2rem;
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
}

.cm-imovel-card__title {
	margin: 0;
	font-family: var(--cm-font-heading);
	font-size: 1.05rem;
	font-weight: 600;
	color: var(--cm-color-heading);
	line-height: 1.3;
}
.cm-imovel-card__title a {
	color: inherit;
	text-decoration: none !important;
}
.cm-imovel-card__title a:hover { color: var(--cm-color-accent); }

.cm-imovel-card__loc {
	margin: 0;
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	font-size: 0.85rem;
	color: var(--cm-color-muted);
}

.cm-imovel-card__meta {
	margin: 0;
	font-size: 0.85rem;
	color: var(--cm-color-text);
}

.cm-imovel-card__price {
	margin: 0.3rem 0 0;
	font-family: var(--cm-font-heading);
	font-size: 1.15rem;
	font-weight: 600;
	color: var(--cm-color-accent);
}

.cm-imovel-card__price-suffix {
	font-size: 0.8rem;
	color: var(--cm-color-muted);
	font-weight: 500;
	margin-left: 4px;
}