/* Toronto Livings member features: hearts, save search, prompts, account pages.
   Loaded on every page, so everything is scoped and has colour fallbacks. */

/* ---------- Cards with a heart ---------- */
.tll-cardwrap { position: relative; display: flex; flex-direction: column; min-width: 0; }
.tll-cardwrap > .tll-cardlink { flex: 1; }
.tll-heart { position: absolute; top: 10px; right: 10px; z-index: 2; display: grid; place-items: center; width: 36px; height: 36px; margin: 0; padding: 0; border: 0; border-radius: 50%; background: rgba(255,255,255,.94); color: #1d1d1f; cursor: pointer; box-shadow: 0 2px 8px rgba(0,0,0,.18); transition: transform .15s; }
.tll-heart:hover { transform: scale(1.08); }
.tll-heart:focus-visible { outline: 2px solid var(--tll-accent, #1d8a8a); outline-offset: 2px; }
.tll-heart svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; }
.tll-heart.is-on { color: var(--tll-accent, #1d8a8a); }
.tll-heart.is-on svg { fill: currentColor; }

/* Heart in the listing page header: a pill like Share */
.tll .tll-head__links .tll-heart--text { position: static; display: inline-flex; align-items: center; gap: 6px; width: auto; height: auto; padding: 7px 12px; border: 1px solid var(--tll-line); border-radius: 999px; background: #fff; box-shadow: none; transform: none; }
.tll .tll-head__links .tll-heart--text svg { width: 14px; height: 14px; }
.tll .tll-head__links .tll-heart--text.is-on { border-color: var(--tll-accent); color: var(--tll-accent); }

/* ---------- Save search ---------- */
.tll-filters__bar { position: relative; }
.tll .tll-savesearch { display: inline-flex; align-items: center; gap: 6px; margin-left: auto; padding: 8px 14px; border: 1px solid var(--tll-accent); border-radius: 999px; background: #fff; color: var(--tll-accent); font: 600 14px/1 var(--tll-sans); cursor: pointer; }
.tll .tll-savesearch:hover, .tll .tll-savesearch.is-on { background: var(--tll-accent); color: #fff; }
.tll-pop { position: absolute; top: calc(100% + 8px); right: 0; z-index: 30; display: grid; gap: 12px; width: min(320px, calc(100vw - 32px)); padding: 18px; background: #fff; border: 1px solid var(--tll-line); border-radius: 12px; box-shadow: 0 12px 32px rgba(0,0,0,.14); }
.tll .tll-pop p.tll-pop__h { margin: 0; font-weight: 600; font-size: 15px; color: var(--tll-ink); }
.tll-pop label { display: grid; gap: 4px; font-size: 13px; font-weight: 500; color: var(--tll-muted); }
.tll .tll-pop input, .tll .tll-pop select { width: 100%; margin: 0; padding: 9px 10px; border: 1px solid var(--tll-line); border-radius: 8px; background: #fff; font: 14px var(--tll-sans); color: var(--tll-ink); }
.tll-pop__row { display: flex; gap: 10px; }
.tll .tll-pop__save { flex: 1; padding: 10px 14px; border: 0; border-radius: 8px; background: var(--tll-accent); color: #fff; font: 600 14px/1 var(--tll-sans); cursor: pointer; }
.tll .tll-pop__cancel { padding: 10px 12px; border: 0; background: none; color: var(--tll-muted); font: 500 14px/1 var(--tll-sans); cursor: pointer; }

/* ---------- Toast ---------- */
.tll-toast { position: fixed; left: 50%; bottom: 24px; z-index: 100000; max-width: calc(100vw - 32px); padding: 12px 18px; border-radius: 10px; background: #1d1d1f; color: #fff; font: 500 14px/1.4 -apple-system, "Segoe UI", Helvetica, Arial, sans-serif; box-shadow: 0 10px 30px rgba(0,0,0,.25); opacity: 0; transform: translate(-50%, 12px); transition: opacity .25s, transform .25s; }
.tll-toast.is-on { opacity: 1; transform: translate(-50%, 0); }
.tll-toast a { margin-left: 6px; color: #7fd6d6; font-weight: 600; }

/* ---------- Sign-up prompt ---------- */
.tll-modal { position: fixed; inset: 0; z-index: 100001; display: grid; place-items: center; padding: 16px; background: rgba(20,20,22,.55); }
.tll-modal__box { position: relative; width: min(420px, 100%); padding: 32px 28px 26px; border-radius: 14px; background: #fff; color: #1d1d1f; text-align: center; font-family: -apple-system, "Segoe UI", Helvetica, Arial, sans-serif; box-shadow: 0 20px 60px rgba(0,0,0,.3); }
.tll-modal__box p { margin: 0; padding: 0; }
.tll-modal__x { position: absolute; top: 8px; right: 10px; width: 36px; height: 36px; padding: 0; border: 0; background: none; color: #6b6b70; font-size: 26px; line-height: 1; cursor: pointer; }
.tll-modal__eyebrow { font-size: 12px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: #6b6b70; }
.tll-modal__h { margin-top: 6px !important; font-family: "Playfair Display", Georgia, serif; font-size: 26px; font-weight: 600; line-height: 1.2; }
.tll-modal__p { margin-top: 10px !important; font-size: 15px; line-height: 1.5; color: #4a4a4f; }
.tll-modal__cta { display: block; margin-top: 20px; padding: 13px 18px; border-radius: 8px; background: #1d8a8a; color: #fff !important; font-weight: 600; font-size: 15px; text-decoration: none; }
.tll-modal__cta:hover { filter: brightness(.92); }
.tll-modal__alt { margin-top: 14px !important; font-size: 14px; color: #6b6b70; }
.tll-modal__alt a { color: #1d8a8a; font-weight: 600; }

/* ---------- Sold-data gate ---------- */
.tll-gate { display: flex; gap: 14px; align-items: flex-start; padding: 18px 20px; border: 1px dashed var(--tll-accent, #1d8a8a); border-radius: var(--tll-radius, 10px); background: #f2f8f8; color: var(--tll-ink, #1d1d1f); }
.tll-gate svg { flex: none; margin-top: 2px; color: var(--tll-accent, #1d8a8a); }
.tll .tll-gate p { margin: 0; }
.tll .tll-gate__h { font-weight: 600; }
.tll .tll-gate__p { margin-top: 4px; font-size: 14px; color: var(--tll-muted); }
.tll .tll-gate__cta { margin-top: 12px; display: flex; flex-wrap: wrap; gap: 14px; align-items: center; }
.tll .tll-gate__alt { font-size: 14px; }

/* ---------- Account pages ---------- */
.tll-account { max-width: 1100px; }
.tll-account .tll-h1 { margin-bottom: 0; }
.tll .tll-note { margin: 0 0 18px; padding: 12px 16px; border-radius: 8px; font-size: 14px; }
.tll .tll-note--ok { background: #e9f5ef; color: #1e5b3a; }
.tll .tll-note--err { background: #fbeceb; color: #8a2a22; }
.tll .tll-note--info { background: #f2f8f8; color: var(--tll-ink); border: 1px solid #cfe5e5; }

/* Sign up / sign in */
.tll-auth { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 440px); gap: 56px; align-items: start; padding: 24px 0; }
.tll-auth__pitch { padding-top: 24px; }
.tll .tll-auth__perks { margin: 24px 0 18px; padding: 0; list-style: none; display: grid; gap: 14px; }
.tll .tll-auth__perks li { position: relative; margin: 0; padding-left: 30px; font-size: 16px; line-height: 1.5; }
.tll .tll-auth__perks li::before { content: ""; position: absolute; left: 0; top: 4px; width: 18px; height: 18px; border-radius: 50%; background: var(--tll-accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M9.5 16.2 5.3 12l-1.4 1.4 5.6 5.6 11-11-1.4-1.4z'/%3E%3C/svg%3E") center/12px no-repeat; }
.tll-auth__card { padding: 26px; border: 1px solid var(--tll-line); border-radius: 14px; background: #fff; box-shadow: 0 6px 24px rgba(0,0,0,.05); }
.tll-auth__switch { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; margin-bottom: 20px; padding: 4px; border-radius: 999px; background: var(--tll-soft); }
.tll .tll-auth__switch a { padding: 9px 10px; border-radius: 999px; color: var(--tll-muted); font-weight: 600; font-size: 14px; text-align: center; text-decoration: none; }
.tll .tll-auth__switch a.is-on { background: #fff; color: var(--tll-ink); box-shadow: 0 1px 4px rgba(0,0,0,.08); }

/* Forms */
.tll-form { display: grid; gap: 14px; }
.tll .tll-form > label, .tll .tll-form fieldset > label:not(.tll-check) { display: grid; gap: 5px; margin: 0; font-size: 14px; font-weight: 500; color: var(--tll-ink); }
.tll .tll-form input[type=text], .tll .tll-form input[type=email], .tll .tll-form input[type=tel], .tll .tll-form input[type=password] { width: 100%; margin: 0; padding: 11px 12px; border: 1px solid var(--tll-line); border-radius: 8px; background: #fff; font: 15px var(--tll-sans); color: var(--tll-ink); }
.tll .tll-form input:focus { outline: none; border-color: var(--tll-accent); box-shadow: 0 0 0 3px rgba(29,138,138,.15); }
.tll .tll-form input:disabled { background: var(--tll-soft); color: var(--tll-muted); }
.tll .tll-form fieldset { display: grid; gap: 10px; margin: 4px 0 0; padding: 0; border: 0; }
.tll .tll-form legend { margin-bottom: 6px; padding: 0; font-weight: 600; font-size: 14px; }
.tll .tll-opt, .tll .tll-hint { font-weight: 400; font-size: 12px; color: var(--tll-muted); }
.tll .tll-check, .tll .tll-form > label.tll-check, .tll .tll-form fieldset > label.tll-check { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; font-weight: 400; line-height: 1.45; cursor: pointer; }
.tll .tll-check input { flex: none; width: 18px; height: 18px; margin: 1px 0 0; accent-color: var(--tll-accent); }
.tll .tll-hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.tll .tll-form .tll-small { margin: 0; text-align: center; }
.tll .tll-btn--danger { background: #b3362b; }
.tll .tll-linkbtn { padding: 0; border: 0; background: none; color: var(--tll-muted); font: 500 14px var(--tll-sans); text-decoration: underline; cursor: pointer; }
.tll .tll-linkbtn:hover { color: #b3362b; }

/* Logged-in header and tabs */
.tll-account__head { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; padding: 8px 0 20px; }
.tll .tll-account__out { color: var(--tll-muted); font-size: 14px; }
.tll-tabs { display: flex; gap: 6px; margin-bottom: 24px; border-bottom: 1px solid var(--tll-line); overflow-x: auto; }
.tll .tll-tabs a { display: inline-flex; align-items: center; gap: 8px; padding: 12px 14px; border-bottom: 2px solid transparent; margin-bottom: -1px; color: var(--tll-muted); font-weight: 600; font-size: 15px; text-decoration: none; white-space: nowrap; }
.tll .tll-tabs a.is-on { color: var(--tll-ink); border-color: var(--tll-accent); }
.tll .tll-tabs em { font-style: normal; font-size: 12px; padding: 1px 8px; border-radius: 999px; background: var(--tll-soft); color: var(--tll-muted); }
.tll .tll-empty__h { font-family: var(--tll-serif); font-size: 22px; font-weight: 600; }
.tll .tll-empty .tll-btn { margin-top: 12px; }

/* Saved homes */
.tll-savedcard { position: relative; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.tll-savedcard > .tll-cardwrap { flex: 1; }
.tll .tll-savedcard__note { margin: 0; font-size: 13px; color: var(--tll-muted); }
.tll .tll-chg { font-weight: 600; }
.tll .tll-chg--down { color: var(--tll-accent); }
.tll .tll-chg--up { color: var(--tll-ink); }
.tll .tll-chg--off { color: #8a2a22; }
.tll-savedcard--gone .tll-cardlink { height: 100%; background: var(--tll-soft); }
.tll-savedcard--gone .tll-cardlink:hover { transform: none; box-shadow: none; }

/* Saved searches */
.tll .tll-searchlist { margin: 0; padding: 0; list-style: none; display: grid; gap: 12px; }
.tll .tll-searchrow { margin: 0; padding: 18px 20px; border: 1px solid var(--tll-line); border-radius: var(--tll-radius); background: #fff; }
.tll-searchrow form { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 14px 24px; align-items: center; }
.tll-searchrow__main { flex: 1 1 340px; min-width: 0; }
.tll .tll-searchrow__name { width: 100%; margin: 0 0 2px -8px; padding: 4px 8px; border: 1px solid transparent; border-radius: 6px; background: none; font: 600 17px var(--tll-sans); color: var(--tll-ink); }
.tll .tll-searchrow__name:hover, .tll .tll-searchrow__name:focus { border-color: var(--tll-line); outline: none; }
.tll .tll-searchrow__desc { margin: 0; font-size: 14px; color: var(--tll-muted); }
.tll .tll-searchrow__view { display: inline-block; margin-top: 6px; font-size: 14px; font-weight: 600; text-decoration: none; }
.tll-searchrow__side { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.tll .tll-searchrow__side label { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; color: var(--tll-muted); }
.tll .tll-searchrow__side select { margin: 0; padding: 8px 10px; border: 1px solid var(--tll-line); border-radius: 8px; background: #fff; font: 14px var(--tll-sans); color: var(--tll-ink); }
.tll .tll-searchrow__side .tll-btn { padding: 9px 16px; }

/* Settings */
.tll-settings { display: grid; gap: 0; max-width: 640px; }
.tll-settings > section { padding: 0 0 32px; margin: 0 0 32px; border-bottom: 1px solid var(--tll-line); }
.tll-settings > section:last-child { border-bottom: 0; }
.tll .tll-settings .tll-form .tll-btn { justify-self: start; }
.tll .tll-settings .tll-form .tll-small { text-align: left; }
.tll-terms { font-size: 15px; line-height: 1.65; }
.tll .tll-terms p { margin: 0 0 12px; }
.tll-terms--box { max-height: 240px; overflow-y: auto; margin-bottom: 14px; padding: 16px 18px; border: 1px solid var(--tll-line); border-radius: 8px; background: var(--tll-soft); font-size: 14px; }
.tll-account__narrow { max-width: 720px; }
.tll-account__narrow .tll-h1 { margin-bottom: 20px; }

@media (max-width: 860px) {
	.tll-auth { grid-template-columns: 1fr; gap: 24px; padding-top: 0; }
	.tll-auth__pitch { padding-top: 0; }
	.tll .tll-auth__perks { margin: 16px 0 8px; }
	.tll .tll-savesearch { margin-left: 0; }
	.tll-pop { left: 0; right: auto; }
}

/* Sale & listing history (members) */
.tll-histtable { width: 100%; border-collapse: collapse; font-size: 14px; }
.tll-histtable th { padding: 8px 10px 8px 0; border-bottom: 1px solid var(--tll-line); color: var(--tll-muted); font-weight: 500; font-size: 12px; text-transform: uppercase; letter-spacing: .06em; text-align: left; }
.tll-histtable td { padding: 10px 10px 10px 0; border-bottom: 1px solid var(--tll-line); vertical-align: top; }
.tll-histtable .tll-small { display: block; margin: 2px 0 0; }