/* ==========================================================================
   LlaveCR — Owner Bookkeeping pages (bookkeeping, review, contador)
   Built on the tokens in styles.css; loaded after it.
   ========================================================================== */
[hidden]{display:none !important;}
.num{font-variant-numeric:tabular-nums;}
.bk-pill{font-family:'Work Sans', system-ui, sans-serif; vertical-align:middle; display:inline-flex; align-items:center; gap:.35rem; border-radius:999px; padding:.2rem .7rem; font-size:.78rem; font-weight:600; white-space:nowrap;}
.bk-pill::before{content:""; width:7px; height:7px; border-radius:50%; background:currentColor;}
.bk-good{background:var(--success-tint); color:var(--success);}
.bk-warn{background:var(--gold-tint); color:var(--gold-dark);}
.bk-info{background:var(--teal-tint); color:var(--teal);}
.bk-bad{background:var(--danger-tint); color:var(--danger);}

.bk-notice{border-radius:var(--radius-sm); padding:.8rem 1rem; font-size:.92rem; margin:0 0 1rem;}
.bk-notice.warn{background:var(--gold-tint);}
.bk-notice.bad{background:var(--danger-tint); color:var(--danger);}
.bk-notice.info{background:var(--teal-tint);}
.bk-notice.good{background:var(--success-tint);}

/* Enrollment */
.bk-plans{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:1rem; margin-bottom:1.2rem;}
@media (max-width:820px){ .bk-plans{grid-template-columns:1fr;} }
.bk-plan{border:1.5px solid var(--border); border-radius:var(--radius); padding:1rem 1.1rem; display:flex; gap:.7rem; align-items:flex-start; cursor:pointer; background:var(--surface);}
.bk-plan:has(input:checked){border-color:var(--teal); background:var(--teal-tint);}
.bk-plan input{margin-top:.25rem;}
.bk-plan strong{display:block; font-family:'Fraunces', serif; font-size:1.05rem; margin-bottom:.2rem;}
.bk-plan ul{margin:.3rem 0 0; padding-left:1.1rem; font-size:.9rem; color:var(--ink-soft); display:grid; gap:.2rem;}
.bk-plan ul ul{margin-top:.2rem; padding-left:1.1rem; list-style:circle;}
.bk-plan ul strong{display:inline; font-family:inherit; font-size:inherit; color:var(--ink); margin:0;}
.bk-consent{background:var(--surface-2); border-radius:var(--radius-sm); padding:.9rem 1rem; font-size:.88rem; display:flex; gap:.6rem; align-items:flex-start; margin:.4rem 0 1.2rem;}
.bk-consent input{margin-top:.2rem;}

/* Upload */
.bk-upload{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.3fr) auto; gap:1rem; align-items:end;}
@media (max-width:820px){ .bk-upload{grid-template-columns:1fr;} }
.bk-upload .field{margin-bottom:0;}
.bk-progress{display:flex; align-items:center; gap:.8rem; background:var(--teal-tint); border-radius:var(--radius-sm); padding:.8rem 1rem; margin-top:1rem; font-size:.92rem;}
.bk-spin{width:18px; height:18px; border-radius:50%; border:2.5px solid var(--teal); border-right-color:transparent; animation:bkspin .8s linear infinite; flex:none;}
@keyframes bkspin{to{transform:rotate(360deg);}}
@media (prefers-reduced-motion:reduce){ .bk-spin{animation:none;} }

/* Statement facts */
.bk-facts{display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:1px; background:var(--border); border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; margin-bottom:1rem;}
@media (max-width:700px){ .bk-facts{grid-template-columns:repeat(2, minmax(0,1fr));} }
.bk-fact{background:var(--surface); padding:.8rem 1rem; display:flex; flex-direction:column; gap:.15rem;}
.bk-fact .lbl{font-size:.72rem; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-faint);}
.bk-fact .val{font-weight:600;}

/* Review list */
.bk-toolbar{display:flex; flex-wrap:wrap; gap:.6rem; align-items:center; margin-bottom:.8rem;}
.bk-toolbar .spacer{flex:1;}
.bk-seg{display:inline-flex; border:1px solid var(--border); border-radius:var(--radius-sm); overflow:hidden;}
.bk-seg button{border:none; background:var(--surface); padding:.4rem .8rem; font-size:.85rem; color:var(--ink-soft);}
.bk-seg button + button{border-left:1px solid var(--border);}
.bk-seg button[aria-pressed="true"]{background:var(--teal-tint); color:var(--teal-dark); font-weight:600;}
.bk-bar{height:6px; border-radius:99px; background:var(--surface-2); overflow:hidden; margin-bottom:.8rem;}
.bk-bar i{display:block; height:100%; background:var(--success); transition:width .3s;}
.bk-list{border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; background:var(--surface);}
.bk-lhead, .bk-tx{display:grid; grid-template-columns:62px minmax(0,1.7fr) 130px minmax(0,1.2fr) minmax(0,1fr) 56px 112px; gap:.8rem; align-items:center; padding:.7rem 1rem;}
.bk-lhead{background:var(--surface-2); font-size:.72rem; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-faint);}
.bk-lhead .r{text-align:right;}
.bk-tx{border-top:1px solid var(--border); position:relative;}
.bk-tx::before{content:""; position:absolute; left:0; top:0; bottom:0; width:3px;}
.bk-tx.lo::before{background:var(--clay);} .bk-tx.mid::before{background:var(--gold);}
.bk-tx.ok{background:var(--bg);} .bk-tx.ok::before{background:var(--success);}
.bk-tx.adj::before{background:var(--teal);}
.bk-tx .d{font-size:.85rem; color:var(--ink-soft);}
.bk-tx .desc{font-weight:500; overflow-wrap:anywhere;}
.bk-tx .meta{font-size:.8rem; color:var(--ink-faint); overflow-wrap:anywhere;}
.bk-tx .meta .note{color:var(--clay);}
.bk-tx .meta .cnote{color:var(--teal-dark); font-weight:500;}
.bk-tx .amt{text-align:right; font-weight:600;}
.bk-tx .amt.in{color:var(--success);}
.bk-tx select{width:100%; border:1px solid var(--border); border-radius:var(--radius-sm); padding:.35rem .5rem; background:var(--surface); font-size:.86rem;}
.bk-tx select:disabled{background:transparent; border-color:transparent; color:var(--ink); appearance:none; padding-left:0; opacity:1;}
.bk-conf{display:inline-block; font-size:.74rem; font-weight:700; border-radius:6px; padding:.1rem .4rem; min-width:42px; text-align:center;}
.bk-conf.hi{background:var(--success-tint); color:var(--success);}
.bk-conf.mid{background:var(--gold-tint); color:var(--gold-dark);}
.bk-conf.lo{background:var(--clay-tint); color:var(--clay);}
.bk-conf.rule, .bk-conf.contador{background:var(--teal-tint); color:var(--teal);}
.bk-conf.owner{background:var(--surface-2); color:var(--ink-soft);}
.bk-tx .act{text-align:right;}
.bk-ok{border:none; background:none; color:var(--success); font-weight:600; font-size:.85rem; padding:.2rem;}
.bk-ok:hover:not(:disabled){text-decoration:underline;}
.bk-ok:disabled{cursor:default;}
.bk-inline{grid-column:2 / -1; display:flex; flex-wrap:wrap; gap:.6rem; align-items:center; background:var(--teal-tint); border-radius:var(--radius-sm); padding:.5rem .7rem; font-size:.86rem;}
.bk-inline input{flex:1; min-width:180px; border:1px solid var(--border); border-radius:var(--radius-sm); padding:.4rem .6rem;}
.bk-empty{padding:1.6rem; text-align:center; color:var(--ink-faint);}
@media (max-width:880px){
  .bk-lhead{display:none;}
  .bk-tx{grid-template-columns:1fr auto; grid-template-areas:"d amt" "desc desc" "cat cat" "prop prop" "conf act" "inl inl"; row-gap:.5rem;}
  .bk-tx .d{grid-area:d;} .bk-tx .descw{grid-area:desc;} .bk-tx .amt{grid-area:amt;} .bk-tx .catw{grid-area:cat;} .bk-tx .propw{grid-area:prop;} .bk-tx .confw{grid-area:conf;} .bk-tx .act{grid-area:act;} .bk-tx .bk-inline{grid-area:inl;}
}
.bk-actions{display:flex; flex-wrap:wrap; gap:.8rem; align-items:center; justify-content:space-between; border-top:1px solid var(--border); padding-top:1rem; margin-top:1rem;}
.bk-actions .row{display:flex; flex-wrap:wrap; gap:.6rem;}

/* P&L */
.bk-table-wrap{overflow-x:auto; border:1px solid var(--border); border-radius:var(--radius); background:var(--surface);}
table.bk-pl{width:100%; border-collapse:collapse; font-size:.92rem; font-variant-numeric:tabular-nums;}
table.bk-pl.multi{min-width:540px;}
.bk-pl th, .bk-pl td{padding:.5rem .9rem; text-align:right; white-space:nowrap;}
.bk-pl th:first-child, .bk-pl td:first-child{text-align:left; white-space:normal;}
.bk-pl thead th{background:var(--surface-2); font-size:.72rem; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-faint); font-weight:600;}
.bk-pl tr.grp td{font-family:'Fraunces', serif; font-weight:600; color:var(--teal-dark); padding-top:1rem;}
.bk-pl tr.sub td{border-top:1px solid var(--border); font-weight:600;}
.bk-pl tr.net td{border-top:2px solid var(--ink); font-weight:700; background:var(--teal-tint);}
.bk-pl tr.memo td{color:var(--ink-faint); font-size:.86rem;}
.bk-pl td.neg{color:var(--danger);}
.bk-pl-block{margin-bottom:1.4rem;}
.bk-pl-block h4{margin:0 0 .6rem; font-family:'Fraunces', serif;}

/* Small tables inside panels */
.bk-mini{width:100%; border-collapse:collapse; font-size:.9rem;}
.bk-mini th, .bk-mini td{text-align:left; padding:.55rem .6rem; border-bottom:1px solid var(--border); vertical-align:middle;}
.bk-mini th{color:var(--ink-faint); font-weight:600; font-size:.74rem; text-transform:uppercase; letter-spacing:.04em;}
.bk-mini tr:last-child td{border-bottom:none;}
.bk-mini td.r, .bk-mini th.r{text-align:right;}
.bk-inline-form{display:flex; flex-wrap:wrap; gap:.6rem; align-items:flex-end; margin-top:1rem;}
.bk-inline-form .field{margin-bottom:0; min-width:140px; flex:1;}
.bk-client{border:1px solid var(--border); border-radius:var(--radius); background:var(--surface); padding:1.2rem 1.4rem; margin-bottom:1.2rem;}
.bk-client-head{display:flex; flex-wrap:wrap; gap:.6rem 1rem; align-items:baseline; margin-bottom:.8rem;}
.bk-client-head h3{margin:0;}
.bk-sub-tabs{display:flex; gap:.4rem; flex-wrap:wrap; margin:.6rem 0 1rem;}
.bk-dl{display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; justify-content:flex-end; margin-top:.8rem; font-size:.88rem;}

/* Legal services */
.lg-service strong{margin-bottom:.4rem;}
.lg-matter h5, .lw-matter h5{margin:1rem 0 .4rem; font-size:.95rem; color:var(--teal-dark);}
.lw-matter{border-top:1px solid var(--border); padding-top:1rem; margin-top:1rem;}
.lw-matter:first-of-type{border-top:none; margin-top:0;}
.lw-matter textarea{min-height:80px;}
label.btn.disabled{opacity:.5; pointer-events:none;}

/* ---------- Owner <-> accountant / lawyer messages ---------- */
.tabs .msg-open{margin-left:auto; align-self:center; padding:.45rem .95rem; border:1.5px solid var(--teal); border-radius:999px; color:var(--teal-dark); font-weight:600; font-size:.9rem; background:#fff;}
.tabs .msg-open:hover, .tabs .msg-open.active{background:var(--teal); color:#fff; border-bottom-color:var(--teal);}
.lg-lawyer-row{display:flex; flex-wrap:wrap; align-items:center; gap:.5rem 1rem; margin:-.4rem 0 1rem;}
.bk-client-head .msg-staff-btn{margin-left:auto;}
.msg-thread{max-height:340px; overflow-y:auto; display:flex; flex-direction:column; gap:.55rem; padding:.2rem .1rem .6rem; margin-bottom:.6rem; border-bottom:1px solid var(--border);}
.msg{max-width:78%; padding:.55rem .8rem; border-radius:12px; font-size:.92rem;}
.msg-them{align-self:flex-start; background:#f1f3ef; border:1px solid var(--border);}
.msg-me{align-self:flex-end; background:#e6f2ef; border:1px solid #cfe5df;}
.msg-meta{font-size:.74rem; color:var(--ink-faint); margin-bottom:.15rem;}
.msg-body{white-space:pre-wrap; word-break:break-word;}
.msg-empty{margin:.2rem 0 .4rem;}
.msg-compose{display:flex; gap:.6rem; align-items:flex-end;}
.msg-compose textarea{flex:1; min-height:70px; resize:vertical;}
@media (max-width:640px){ .tabs{flex-wrap:wrap;} .tabs .msg-open{margin:.3rem 0 .3rem auto;} .msg{max-width:92%;} .msg-compose{flex-direction:column; align-items:stretch;} }
.msg-new{display:inline-block; margin-left:.35rem; padding:.05rem .45rem; border-radius:999px; background:#c0392b; color:#fff; font-size:.72rem; font-weight:700; vertical-align:1px;}
.msg-waiting-wrap{display:flex; flex-direction:column; gap:.5rem; align-items:flex-end;}
.msg-waiting-wrap:empty{display:none;}
.msg-waiting{display:flex; align-items:center; gap:.7rem; padding:.55rem .95rem; border:1.5px solid var(--teal); border-radius:12px; background:#fff; color:var(--ink); text-decoration:none; font-size:.85rem; line-height:1.25;}
.msg-waiting:hover{background:#e6f2ef;}
.msg-waiting-icon{position:relative; font-size:1.7rem; line-height:1; color:var(--teal-dark);}
.msg-waiting-dot{position:absolute; top:-.45rem; right:-.6rem; min-width:1.15rem; height:1.15rem; padding:0 .25rem; border-radius:999px; background:#c0392b; color:#fff; font-size:.7rem; font-weight:700; display:flex; align-items:center; justify-content:center;}
@media (max-width:640px){ .msg-waiting-wrap{align-items:stretch; width:100%;} }

/* ---------- Portfolio report (dashboard) ---------- */
.rp-filters{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:.2rem .8rem;}
.rp-preview{max-height:44vh; overflow:auto; border:1px solid var(--border); border-radius:10px;}
.rp-table{width:100%; border-collapse:collapse; font-size:.85rem;}
.rp-table th, .rp-table td{padding:.45rem .6rem; border-bottom:1px solid var(--border); text-align:left;}
.rp-table th{position:sticky; top:0; background:#f6f7f3; font-size:.74rem; text-transform:uppercase; letter-spacing:.03em; color:var(--ink-faint);}
.rp-table .r{text-align:right;}
.rp-total td{font-weight:700; background:#f6f7f3;}
@media (max-width:760px){ .rp-filters{grid-template-columns:1fr 1fr;} }

/* ---------- Mi panel: agent-area buttons share one width ---------- */
#toggleAddAgent, #openReport, [data-remove-agent]{width:180px; justify-content:center; text-align:center;}

/* ---------- Owners <-> Realtors (Mi panel) ---------- */
.agent-btns{display:flex; flex-direction:column; gap:1.2rem; align-items:flex-end;}
#toggleFindRealtor, [data-open-report], [data-remove-realtor], [data-remove-owner]{width:180px; justify-content:center; text-align:center;}
.rl-row{display:flex; flex-wrap:wrap; align-items:center; gap:.5rem 1rem; padding:.7rem 0; border-top:1px solid var(--border);}
.rl-row:first-child{border-top:none;}
.rl-row .info{flex:1; min-width:200px; display:flex; flex-direction:column; font-size:.88rem;}
.rl-row .info span{color:var(--ink-faint);}
.rl-row .acts{display:flex; gap:.5rem; flex-wrap:wrap; justify-content:flex-end;}
.rl-pill{display:inline-block; padding:.12rem .55rem; border-radius:999px; font-size:.74rem; font-weight:700;}
.rl-pending{background:#f7ecd2; color:#8a6412;} .rl-accepted{background:#dcefe6; color:#1f6b4c;} .rl-declined{background:#f6dcd8; color:#9b3a2c;}
#realtorResults{max-height:300px; overflow:auto; border:1px solid var(--border); border-radius:10px; padding:0 .9rem; margin-bottom:.4rem;}
#realtorResults:empty{display:none;}
.managed-by{font-size:.8rem; color:var(--ink-soft); margin:.25rem 0 0;}

/* ---------- Mi panel: property filters ---------- */
.lf-bar{margin-bottom:1.5rem; padding-top:1rem; padding-bottom:.4rem;}
.lf-grid{display:grid; grid-template-columns:repeat(4, minmax(0,1fr)) auto; gap:.2rem .9rem; align-items:end;}
.lf-grid select{padding:.45rem .6rem; font-size:.9rem;}
.lf-end{display:flex; align-items:center; gap:.6rem; white-space:nowrap; padding-bottom:1.1rem; font-size:.85rem;}
@media (max-width:860px){ .lf-grid{grid-template-columns:1fr 1fr;} .lf-end{grid-column:1 / -1; justify-content:space-between;} }

/* ---------- Owners landing page (owners.html) ---------- */
.ow-hero{background:linear-gradient(135deg, var(--teal-dark), var(--teal)); color:#fff; padding:4rem 0 3rem;}
.ow-hero .eyebrow{color:var(--gold);}
.ow-hero h1{color:#fff; max-width:780px; font-size:clamp(1.9rem, 4vw, 2.9rem); line-height:1.12; margin:.4rem 0 1rem;}
.ow-lead{max-width:640px; font-size:1.1rem; color:rgba(255,255,255,.85); margin:0 0 1.6rem;}
.ow-ctas{display:flex; flex-wrap:wrap; gap:.8rem;}
.ow-btn-light{border-color:rgba(255,255,255,.55) !important; color:#fff !important; background:transparent !important;}
.ow-btn-light:hover{background:rgba(255,255,255,.1) !important;}
.ow-jump{list-style:none; display:flex; flex-wrap:wrap; gap:.5rem; padding:0; margin:2rem 0 0;}
.ow-jump a{display:inline-block; padding:.35rem .9rem; border-radius:999px; background:rgba(255,255,255,.12); color:#fff; text-decoration:none; font-size:.88rem; font-weight:600;}
.ow-jump a:hover{background:rgba(255,255,255,.22);}
.ow-body{padding:2.5rem 0 4rem;}
.ow-service{display:grid; grid-template-columns:64px 1fr; gap:1.4rem; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg); padding:1.8rem 2rem; margin-bottom:1.2rem; scroll-margin-top:90px;}
.ow-service h2{margin:.1rem 0 .3rem; font-size:1.5rem;}
.ow-service .muted{margin:0 0 .8rem;}
.ow-icon{width:64px; height:64px; border-radius:16px; background:var(--teal-tint); color:var(--teal); display:flex; align-items:center; justify-content:center;}
.ow-icon svg{width:34px; height:34px;}
.ow-list{list-style:none; padding:0; margin:0; display:grid; grid-template-columns:1fr 1fr; gap:.45rem 1.6rem;}
.ow-list li{position:relative; padding-left:1.5rem; font-size:.95rem; color:var(--ink-soft);}
.ow-list li::before{content:"✓"; position:absolute; left:0; color:var(--success); font-weight:700;}
.ow-tag{display:inline-block; padding:.15rem .6rem; border-radius:999px; background:var(--gold-tint); color:var(--gold-dark); font-size:.74rem; font-weight:700; margin-bottom:.4rem;}
.ow-tag-free{background:var(--success-tint); color:var(--success);}
.ow-plans, .ow-steps{margin-top:2.6rem;}
.ow-plans > h2, .ow-steps > h2{margin-bottom:.3rem;}
.ow-plan-grid{display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:1rem; margin-top:1.2rem;}
.ow-plan{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:1.3rem 1.3rem 1rem;}
.ow-plan h3{font-size:1.08rem; margin:0 0 .6rem;}
.ow-plan ul{padding-left:1.1rem; margin:0; font-size:.9rem; color:var(--ink-soft);}
.ow-plan li{margin-bottom:.3rem;}
.ow-plan ul ul{margin-top:.3rem;}
.ow-plan-pop{border:2px solid var(--teal); box-shadow:var(--shadow);}
.ow-plan-free{background:var(--teal-tint); border-color:transparent;}
.ow-step-list{list-style:none; counter-reset:step; padding:0; display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:1rem; margin-top:1.2rem;}
.ow-step-list li{counter-increment:step; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:1.2rem 1.3rem; display:flex; flex-direction:column; gap:.3rem;}
.ow-step-list li::before{content:counter(step); width:32px; height:32px; border-radius:50%; background:var(--teal); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; margin-bottom:.3rem;}
.ow-step-list span{color:var(--ink-soft); font-size:.92rem;}
.ow-final{margin-top:2.6rem; background:linear-gradient(135deg, var(--teal-dark), var(--teal)); color:#fff; border-radius:var(--radius-lg); padding:2.4rem 2rem; text-align:center;}
.ow-final h2{color:#fff; margin:0 0 .4rem;}
.ow-final p{color:rgba(255,255,255,.85); margin:0 0 1.3rem;}
.ow-final .ow-ctas{justify-content:center;}
@media (max-width:980px){ .ow-plan-grid{grid-template-columns:1fr 1fr;} }
@media (max-width:700px){
  .ow-service{grid-template-columns:1fr; padding:1.4rem;}
  .ow-list, .ow-plan-grid, .ow-step-list{grid-template-columns:1fr;}
  .ow-hero{padding:2.6rem 0 2.2rem;}
}


/* ---------- Header on phones: short labels, long names truncated, wrap instead of overflow ---------- */
@media (max-width:600px){
  .header-actions{flex-wrap:wrap; justify-content:flex-end; row-gap:.4rem; flex-basis:100%;}
  .account-menu .acct-name{display:inline-block; max-width:96px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; vertical-align:middle;}
  .account-menu > button{white-space:nowrap;}
}
@media (max-width:400px){
  .header-actions{gap:.3rem;}
  .header-actions .btn{padding:.45rem .6rem; font-size:.8rem;}
  .account-menu > button{padding:.4rem .5rem; font-size:.8rem;}
  .account-menu .acct-name{max-width:56px;}
  .lang-btn{padding:.3rem .45rem;}
}