/* Control Inmobiliario — portal del inquilino (página independiente del tema) */
:root { --ci-p1:#E8720C; --ci-p2:#3B3B3B; }
.ci-app {
	--bg:#f4f4f5; --surface:#ffffff; --fg:#1f2024; --muted:#6b6d74; --line:#e4e4e7; --soft:#f6f6f7;
	--ok:#15803d; --ok-bg:#e8f6ec; --bad:#c62828; --bad-bg:#fdecec; --warn:#b45309; --warn-bg:#fef3e2; --info:#1d4ed8; --info-bg:#e8effd;
	margin:0; background:var(--bg); color:var(--fg);
	font:16px/1.55 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	-webkit-font-smoothing:antialiased; min-height:100vh; display:flex; flex-direction:column;
}
@media (prefers-color-scheme: dark) {
	.ci-app { --bg:#141518; --surface:#1d1f23; --fg:#ececee; --muted:#a3a5ac; --line:#30323a; --soft:#25272c;
		--ok:#5cc58a; --ok-bg:#173326; --bad:#f08080; --bad-bg:#3a1c1c; --warn:#f0b35a; --warn-bg:#3a2b14; --info:#8fb0ff; --info-bg:#1b2742; color-scheme:dark; }
}
.ci-app *, .ci-app *::before, .ci-app *::after { box-sizing:border-box; }
.ci-app a { color:var(--ci-p1); }
.ci-app h1 { font-size:24px; line-height:1.25; margin:0 0 6px; letter-spacing:-.01em; }
.ci-app h2 { font-size:20px; line-height:1.3; margin:0 0 4px; }
.ci-app h3 { font-size:17px; margin:0; }
.ci-app h4 { margin:22px 0 8px; font-size:12.5px; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); }

/* Barra superior */
.ci-app-bar { background:var(--surface); border-bottom:3px solid var(--ci-p1); }
.ci-app-in { max-width:960px; margin:0 auto; padding:12px max(16px, env(safe-area-inset-left)); display:flex; align-items:center; justify-content:space-between; gap:12px; }
.ci-brand { display:flex; align-items:center; gap:12px; text-decoration:none; color:var(--fg) !important; min-width:0; }
.ci-brand img { max-height:40px; max-width:180px; width:auto; height:auto; display:block; }
.ci-brand-name { font-weight:700; font-size:16px; }
.ci-brand-sub { font-size:13px; color:var(--muted); border-left:1px solid var(--line); padding-left:12px; white-space:nowrap; }
@media (max-width:420px) { .ci-brand-sub { display:none; } }

/* Contenido */
.ci-app-main { width:100%; margin:0 auto; padding:28px max(16px, env(safe-area-inset-left)) 40px; flex:1; }
.ci-narrow { max-width:460px; }
.ci-wide { max-width:960px; }
.ci-app-foot { text-align:center; font-size:12.5px; color:var(--muted); padding:18px 16px calc(18px + env(safe-area-inset-bottom)); }

.ci-box { background:var(--surface); border:1px solid var(--line); border-radius:16px; padding:26px 24px; box-shadow:0 1px 3px rgba(0,0,0,.04); }
.ci-box.ci-ok { border-top:5px solid var(--ok); } .ci-box.ci-ok h1 { color:var(--ok); }
.ci-box.ci-bad { border-top:5px solid var(--bad); } .ci-box.ci-bad h1 { color:var(--bad); }
.ci-muted { color:var(--muted); margin:0 0 18px; font-size:15px; }
.ci-small { font-size:13.5px; color:var(--muted); margin:4px 0 0; }
.ci-center { text-align:center; margin-top:16px; }

/* Formularios */
.ci-form { display:grid; gap:6px; }
.ci-form label { font-weight:600; font-size:14px; margin-top:8px; }
.ci-form input[type=text], .ci-form input[type=email], .ci-form input[type=password] {
	width:100%; font:inherit; font-size:16px; padding:12px 13px; border:1px solid var(--line); border-radius:10px; background:var(--surface); color:var(--fg);
}
.ci-form input:focus { outline:none; border-color:var(--ci-p1); box-shadow:0 0 0 3px color-mix(in srgb, var(--ci-p1) 22%, transparent); }
.ci-readonly { background:var(--soft) !important; color:var(--muted) !important; }
.ci-pass { position:relative; }
.ci-pass input { padding-right:84px !important; }
.ci-pass-btn { position:absolute; right:6px; top:50%; transform:translateY(-50%); border:0; background:var(--soft); color:var(--fg); font-family:inherit; font-weight:600; font-size:13px; line-height:1; padding:8px 10px; border-radius:7px; cursor:pointer; }
.ci-check { display:flex !important; align-items:center; gap:8px; font-weight:400 !important; font-size:14px !important; margin:10px 0 4px !important; }
.ci-check input { width:18px; height:18px; accent-color:var(--ci-p1); }

.ci-btn { display:inline-flex; align-items:center; justify-content:center; background:var(--ci-p1); color:#fff !important; padding:10px 16px; border-radius:10px; text-decoration:none !important; font-family:inherit; font-weight:600; font-size:15px; line-height:1.2; border:1px solid var(--ci-p1); cursor:pointer; }
.ci-btn:hover { filter:brightness(.95); }
.ci-btn-block { width:100%; padding:14px 16px; font-size:16px; margin-top:12px; }
.ci-btn-ghost { background:transparent; color:var(--fg) !important; border-color:var(--line); }
.ci-btn-sm { padding:7px 12px; font-size:13.5px; }

.ci-alert { border-radius:10px; padding:12px 14px; font-size:14.5px; margin:0 0 16px; }
.ci-alert-ok { background:var(--ok-bg); color:var(--ok); }
.ci-alert-bad { background:var(--bad-bg); color:var(--bad); }
.ci-tip { margin-top:14px; font-size:13.5px; color:var(--muted); padding:0 4px; }
.ci-help-box { margin-top:16px; background:var(--soft); border-radius:14px; padding:18px 20px; }
.ci-help-box h2 { font-size:16px; margin:0 0 10px; }
.ci-help-box ul { margin:0; padding-left:18px; display:grid; gap:10px; font-size:14.5px; }

.ci-kv { width:100%; border-collapse:collapse; margin-top:8px; }
.ci-kv th, .ci-kv td { text-align:left; padding:9px 0; border-bottom:1px solid var(--line); font-size:15px; }
.ci-kv th { color:var(--muted); font-weight:500; width:42%; }

/* Cuenta */
.ci-portal-head { margin-bottom:18px; }
.ci-card { background:var(--surface); border:1px solid var(--line); border-radius:16px; padding:20px; margin-bottom:20px; box-shadow:0 1px 3px rgba(0,0,0,.04); }
.ci-card-head { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; flex-wrap:wrap; margin-bottom:16px; }
.ci-card-head > div { min-width:0; }
.ci-kpis { display:grid; grid-template-columns:repeat(auto-fit, minmax(160px, 1fr)); gap:10px; }
.ci-kpis > div { background:var(--soft); border-radius:12px; padding:12px 14px; min-width:0; }
.ci-kpis span { display:block; font-size:12.5px; color:var(--muted); }
.ci-kpis strong { display:block; font-size:19px; margin-top:4px; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.ci-neg { color:var(--bad); }
.ci-bank { margin-top:12px; background:color-mix(in srgb, var(--ci-p1) 9%, var(--surface)); border:1px solid color-mix(in srgb, var(--ci-p1) 25%, var(--surface)); border-radius:12px; padding:12px 14px; font-size:14.5px; }
.ci-table-wrap { overflow-x:auto; -webkit-overflow-scrolling:touch; }
.ci-table { width:100%; border-collapse:collapse; font-size:14px; min-width:520px; }
.ci-table th { text-align:left; font-size:12px; color:var(--muted); font-weight:600; padding:8px; border-bottom:1px solid var(--line); }
.ci-table td { padding:10px 8px; border-bottom:1px solid var(--line); font-variant-numeric:tabular-nums; }
.ci-table tr:last-child td { border-bottom:0; }
.ci-table .r { text-align:right; }
.ci-table a { font-weight:600; }
.ci-badge { display:inline-block; padding:2px 9px; border-radius:999px; font-size:12px; font-weight:600; white-space:nowrap; }
.ci-badge-ok { background:var(--ok-bg); color:var(--ok); }
.ci-badge-bad { background:var(--bad-bg); color:var(--bad); }
.ci-badge-warn { background:var(--warn-bg); color:var(--warn); }
.ci-badge-info { background:var(--info-bg); color:var(--info); }
.ci-badge-muted { background:var(--soft); color:var(--muted); }
@media (max-width:600px) {
	.ci-kpis { grid-template-columns:1fr 1fr; }
	.ci-kpis strong { font-size:16px; }
	.ci-card { padding:16px; }
	.ci-box { padding:22px 18px; }
	.ci-card-head .ci-btn { width:100%; }
}

.ci-login-logo { text-align:center; margin:2px 0 18px; }
.ci-login-logo img { max-height:72px; max-width:min(240px, 80%); width:auto; height:auto; display:inline-block; }

/* Passkeys */
.ci-btn-pk { gap:10px; background:var(--fg); border-color:var(--fg); color:var(--surface) !important; margin-top:4px; }
.ci-btn-pk svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.ci-or { display:flex; align-items:center; gap:10px; color:var(--muted); font-size:13px; margin:18px 0 4px; }
.ci-or::before, .ci-or::after { content:""; flex:1; height:1px; background:var(--line); }
.ci-pk-msg { font-size:13.5px; margin:8px 0 0; color:var(--muted); min-height:0; }
.ci-pk-msg:empty { display:none; }
.ci-pk-msg.bad { color:var(--bad); }
.ci-pk-card h3 { font-size:17px; margin:0 0 6px; }
.ci-pk-card .ci-small { margin:0 0 12px; line-height:1.5; }
.ci-pk-list { list-style:none; margin:0 0 12px; padding:0; border:1px solid var(--line); border-radius:12px; overflow:hidden; }
.ci-pk-list li { display:flex; justify-content:space-between; align-items:center; gap:10px; padding:12px 14px; border-bottom:1px solid var(--line); }
.ci-pk-list li:last-child { border-bottom:0; }
.ci-pk-list span { display:grid; } .ci-pk-list small { color:var(--muted); font-size:12.5px; }
.ci-pk-list a { color:var(--bad); font-weight:600; text-decoration:none; font-size:14px; }
.ci-pk-invite { display:grid; gap:6px; background:var(--surface); border:1px solid var(--line); border-left:4px solid var(--ci-p1); border-radius:14px; padding:14px 16px; margin:0 0 16px; }
.ci-pk-invite span { color:var(--muted); font-size:14px; }
.ci-pk-invite .ci-btn { justify-self:start; margin-top:4px; }
