/* =========================================================================
   PORTAL CLIENTE
   ========================================================================= */
.cp-app { background: var(--bg-app); min-height: 100%; display: flex; flex-direction: column; }
.cp-top { background: var(--revin-black); color: #fff; height: 72px; display: flex; align-items: center; padding: 0 32px; gap: 24px; border-bottom: 1px solid #000; }
.cp-top .brand { display: flex; align-items: center; gap: 12px; }
.cp-top .brand img { height: 26px; }
.cp-top .brand .div { width: 1px; height: 24px; background: var(--neutral-700); }
.cp-top .brand .label { font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--neutral-400); }
.cp-top .nav { display: flex; gap: 4px; margin-left: 32px; }
.cp-top .nav a { padding: 10px 14px; font-size: 13px; color: var(--neutral-300); border-radius: 2px; cursor: pointer; }
.cp-top .nav a.active { background: var(--neutral-700); color: #fff; }
.cp-top .right { margin-left: auto; display: flex; align-items: center; gap: 16px; }
.cp-top .who { display: flex; align-items: center; gap: 10px; font-size: 13px; }
.cp-top .who .ava { width: 32px; height: 32px; border-radius: 999px; background: var(--revin-red); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700; }
.cp-top .who .name { line-height: 1.2; }
.cp-top .who .role { font-size: 10px; color: var(--neutral-400); letter-spacing: .08em; text-transform: uppercase; }

/* Hero */
.cp-hero { background: var(--revin-black); color: #fff; padding: 0; position: relative; overflow: hidden; }
.cp-hero-inner { max-width: 1080px; margin: 0 auto; padding: 48px 32px 60px; display: grid; grid-template-columns: 1fr 1fr; gap: 32px; align-items: center; }
.cp-hero .eyebrow { color: var(--red-200); font-size: 11px; letter-spacing: .12em; font-weight: 700; text-transform: uppercase; }
.cp-hero h1 { font-family: var(--font-display); font-size: 48px; line-height: 1.05; letter-spacing: .02em; margin: 12px 0 8px; color: #fff; text-transform: uppercase; }
.cp-hero h1 .red { color: var(--revin-red); }
.cp-hero .addr { font-size: 16px; color: var(--neutral-300); }
.cp-hero .id { font-family: var(--font-mono); font-size: 11px; color: var(--neutral-400); margin-top: 16px; letter-spacing: .04em; }
.cp-hero .photo-frame { aspect-ratio: 4/3; background: linear-gradient(135deg, var(--neutral-600), var(--neutral-800)); position: relative; border: 1px solid var(--neutral-700); display: flex; align-items: center; justify-content: center; color: rgba(255,255,255,.18); font-family: var(--font-display); font-size: 14px; text-transform: uppercase; letter-spacing: .1em; }
.cp-hero .photo-frame::before { content: ""; position: absolute; top: -8px; left: -8px; right: 24px; bottom: 24px; border: 2px solid var(--revin-red); z-index: 1; pointer-events: none; }
.cp-hero::after { content: ""; position: absolute; right: -100px; bottom: -100px; width: 300px; height: 300px; background: radial-gradient(circle, var(--revin-red) 0%, transparent 70%); opacity: .25; }

/* Content area */
.cp-body { max-width: 1080px; margin: 0 auto; padding: 40px 32px; display: grid; grid-template-columns: 2fr 1fr; gap: 32px; }

/* Progress milestones */
.cp-milestones { background: var(--bg-surface); border: 1px solid var(--border-1); border-radius: 8px; overflow: hidden; }
.cp-milestones-h { padding: 20px 24px; border-bottom: 1px solid var(--border-1); }
.cp-milestones-h h2 { margin: 0; font-family: var(--font-display); font-size: 18px; letter-spacing: .02em; text-transform: uppercase; }
.cp-milestones-h .sub { font-size: 13px; color: var(--fg-2); margin-top: 4px; }
.cp-mile-row { display: grid; grid-template-columns: 64px 1fr; gap: 16px; padding: 18px 24px; border-bottom: 1px solid var(--border-3); position: relative; }
.cp-mile-row:last-child { border-bottom: none; }
.cp-mile-num { width: 48px; height: 48px; border-radius: 999px; background: var(--bg-inset); border: 2px solid var(--border-2); display: flex; align-items: center; justify-content: center; font-family: var(--font-display); font-size: 16px; color: var(--fg-3); letter-spacing: .02em; flex-shrink: 0; position: relative; z-index: 2; background-clip: padding-box; }
.cp-mile-row.done .cp-mile-num { background: var(--success); color: #fff; border-color: var(--success); }
.cp-mile-row.active .cp-mile-num { background: var(--revin-red); color: #fff; border-color: var(--revin-red); }
.cp-mile-row::before { content: ""; position: absolute; left: 47.5px; top: 60px; bottom: -10px; width: 2px; background: var(--border-1); }
.cp-mile-row.done::before { background: var(--success); }
.cp-mile-row:last-child::before { display: none; }
.cp-mile-h { display: flex; align-items: center; gap: 12px; margin-bottom: 4px; }
.cp-mile-title { font-size: 16px; font-weight: 600; color: var(--fg-1); }
.cp-mile-row.done .cp-mile-title { color: var(--fg-3); }
.cp-mile-text { font-size: 13px; color: var(--fg-2); line-height: 1.5; max-width: 540px; }
.cp-mile-date { font-family: var(--font-mono); font-size: 11px; color: var(--fg-3); margin-top: 6px; letter-spacing: .02em; }

/* Side cards */
.cp-side { display: flex; flex-direction: column; gap: 20px; }
.cp-card { background: var(--bg-surface); border: 1px solid var(--border-1); border-radius: 8px; overflow: hidden; }
.cp-card-h { padding: 16px 20px; border-bottom: 1px solid var(--border-1); }
.cp-card-h h3 { margin: 0; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--fg-2); }
.cp-card-b { padding: 16px 20px; }

/* Contact card */
.cp-agent { display: flex; gap: 14px; align-items: center; padding-bottom: 14px; border-bottom: 1px solid var(--border-3); margin-bottom: 14px; }
.cp-agent .ava { width: 56px; height: 56px; border-radius: 999px; background: var(--revin-black); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 18px; font-weight: 700; }
.cp-agent .info { flex: 1; }
.cp-agent .name { font-size: 16px; font-weight: 700; }
.cp-agent .role { font-size: 11px; color: var(--fg-3); letter-spacing: .08em; text-transform: uppercase; margin-top: 2px; }
.cp-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.cp-actions .btn { justify-content: center; padding: 10px 12px; font-size: 12px; }
.cp-actions .btn.wa { background: #25D366; color: #fff; border-color: #25D366; grid-column: 1 / -1; }
.cp-actions .btn.wa:hover { background: #1DA851; border-color: #1DA851; }

/* Doc list portal */
.cp-doc { display: flex; align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--border-3); cursor: pointer; }
.cp-doc:last-child { border-bottom: none; }
.cp-doc:hover { background: var(--bg-inset); margin: 0 -20px; padding-left: 20px; padding-right: 20px; }
.cp-doc .ico { width: 36px; height: 44px; background: var(--bg-inset); border: 1px solid var(--border-1); border-radius: 2px; display: flex; align-items: flex-end; justify-content: center; padding-bottom: 4px; font-family: var(--font-mono); font-size: 9px; font-weight: 700; color: var(--revin-red); flex-shrink: 0; }
.cp-doc .info { flex: 1; min-width: 0; }
.cp-doc .name { font-family: var(--font-mono); font-size: 10px; color: var(--fg-1); text-transform: uppercase; letter-spacing: .02em; word-break: break-all; line-height: 1.3; }
.cp-doc .sub { font-size: 11px; color: var(--fg-3); margin-top: 3px; }
.cp-doc .dl { color: var(--fg-3); }
.cp-doc:hover .dl { color: var(--revin-red); }

/* Stats strip on portal */
.cp-strip { background: var(--bg-surface-2); border-top: 1px solid var(--border-1); border-bottom: 1px solid var(--border-1); padding: 16px 0; }
.cp-strip-inner { max-width: 1080px; margin: 0 auto; padding: 0 32px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.cp-stat { padding: 0 4px; }
.cp-stat .lbl { font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--fg-3); }
.cp-stat .val { font-family: var(--font-display); font-size: 22px; letter-spacing: .02em; margin-top: 4px; }

/* =========================================================================
   ADMIN extra bits
   ========================================================================= */
.adm-tabs { display: flex; border-bottom: 1px solid var(--border-1); margin-bottom: 24px; gap: 0; }
.adm-tab { padding: 12px 16px; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--fg-3); background: transparent; border: none; border-bottom: 2px solid transparent; cursor: pointer; }
.adm-tab.active { color: var(--fg-1); border-bottom-color: var(--revin-red); }
.adm-tab:hover { color: var(--fg-1); }

.leader-row { display: grid; grid-template-columns: 32px 1fr 100px 100px 120px; align-items: center; gap: 12px; padding: 12px 16px; border-bottom: 1px solid var(--border-3); }
.leader-row .pos { font-family: var(--font-display); font-size: 18px; color: var(--fg-3); letter-spacing: .02em; }
.leader-row.top1 .pos { color: var(--revin-red); }
.leader-row .who { display: flex; align-items: center; gap: 10px; }
.leader-row .who .ava { width: 28px; height: 28px; border-radius: 999px; background: var(--neutral-700); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 700; }
.leader-row .name { font-size: 13px; font-weight: 600; }
.leader-row .role { font-size: 10px; color: var(--fg-3); letter-spacing: .06em; text-transform: uppercase; }
.leader-row .num { font-family: var(--font-mono); font-size: 13px; font-weight: 600; text-align: right; }
.leader-row .target-bar { display: flex; align-items: center; gap: 8px; }
.leader-row .target-bar .bar { flex: 1; height: 6px; background: var(--bg-inset); border-radius: 2px; overflow: hidden; }
.leader-row .target-bar .bar > span { display: block; height: 100%; background: var(--revin-red); }
.leader-row .target-bar .pct { font-family: var(--font-mono); font-size: 11px; color: var(--fg-2); width: 36px; text-align: right; }

/* Visit feedback */
.visit-feed { display: flex; flex-direction: column; gap: 0; }
.visit-row { padding: 14px 16px; border-bottom: 1px solid var(--border-3); }
.visit-row:last-child { border-bottom: none; }
.visit-h { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 8px; }
.visit-info { flex: 1; }
.visit-prop { font-size: 13px; font-weight: 600; color: var(--fg-1); }
.visit-meta { font-size: 11px; color: var(--fg-2); margin-top: 2px; display: flex; gap: 8px; }
.visit-rating { display: flex; gap: 2px; flex-shrink: 0; }
.visit-rating .star { width: 14px; height: 14px; }
.visit-text { font-size: 12px; color: var(--fg-2); line-height: 1.5; padding: 8px 12px; background: var(--bg-inset); border-radius: 2px; border-left: 2px solid var(--border-2); margin-top: 6px; }
.visit-objection { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 8px; }
.visit-obj-chip { font-size: 10px; padding: 2px 8px; background: var(--warning-bg); color: var(--warning-fg); border-radius: 999px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; }

/* Commission ledger */
.comm-list { display: flex; flex-direction: column; }
.comm-row { display: grid; grid-template-columns: 1fr 80px 80px 110px 110px; gap: 12px; align-items: center; padding: 12px 16px; border-bottom: 1px solid var(--border-3); font-size: 12px; }
.comm-row:last-child { border-bottom: none; }
.comm-row .prop { font-weight: 600; color: var(--fg-1); }
.comm-row .ref { font-family: var(--font-mono); font-size: 10px; color: var(--fg-3); margin-top: 2px; }
.comm-row .split { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; }
.comm-row .split .ava { width: 18px; height: 18px; border-radius: 999px; background: var(--neutral-700); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 8px; font-weight: 700; }
.comm-row .amount { font-family: var(--font-mono); font-weight: 700; text-align: right; }
