/* ABFI Books look, matched to the approved "ABFI Books Messages" sample (2 Nov 2026): navy rail, cream page, burnt orange buttons, gold markers, Georgia headings. Light and dark. Loaded after books.css. */
html,html[data-theme="light"]{
  --navy:#071D36;--navy2:#0E2B4C;--orange:#C96B35;--hot:#C96B35;--accent:#C96B35;--accent-ink:#ffffff;--gold:#EDC862;
  --bg:#F8F3E8;--cream:#F8F3E8;--card:#FFFFFF;--panel2:#EEF2F7;--soft:#EEF2F7;--line:#D5DDE7;--ink:#14243A;--muted:#5D6F86;--heading:#071D36;--link:#071D36;
  --field:#FFFFFF;--th:#F3F5F9;--mine:#E3EBF5;--theirs:#FFFFFF;--note:#FFF6DA;--noteline:#E9CF7A;
  --ok:#2E7D5B;--okbg:#E3F1EA;--bad:#B4413F;--badbg:#F8E6E5;--warn:#9A5B14;--warnbg:#FBEBD6;--tagbg:#EEF2F7;
  --shadow:0 1px 2px rgba(7,29,54,.05),0 6px 18px rgba(7,29,54,.05);color-scheme:light}
html[data-theme="dark"]{
  --navy:#E6ECF4;--navy2:#182B44;--link:#EDC862;--heading:#F2F5F9;
  --bg:#0B1626;--cream:#0B1626;--card:#122238;--panel2:#182B44;--soft:#182B44;--line:#24384F;--ink:#E6ECF4;--muted:#9FB0C4;
  --field:#0F1D31;--th:#152841;--mine:#1C3557;--theirs:#152841;--note:#3A3015;--noteline:#7A6522;
  --ok:#6CC59B;--okbg:#173A2B;--bad:#F08A86;--badbg:#3D1C1C;--warn:#F0B470;--warnbg:#3D2A14;--tagbg:#182B44;
  --shadow:0 1px 2px rgba(0,0,0,.3),0 6px 18px rgba(0,0,0,.2);color-scheme:dark}
html{background:var(--bg);color:var(--ink)}
body{background:var(--bg);color:var(--ink)}
h1,h2,h3{font-family:Georgia,"Times New Roman",serif;color:var(--heading)}
.hint,.sub{color:var(--muted)}

/* navy rail in both themes, white logo, gold marker on the open page */
.side{background:#071D36;color:#C9D4E2;border-right:0}
html[data-theme="dark"] .side{background:#06121F;border-right:1px solid var(--line)}
.logo{border-bottom-color:rgba(255,255,255,.12)}
.logo .lg-light{display:none}.logo .lg-dark{display:block}
.side nav a{color:#C9D4E2;font-weight:600}
.side nav a:hover{background:#0E2B4C;color:#fff}
.side nav a.on{background:#0E2B4C;color:#fff;box-shadow:inset 3px 0 #EDC862}
.side nav a .dot{background:#C96B35;color:#fff}
.side-foot{border-top-color:rgba(255,255,255,.12)}
.side-foot .crm{color:#EDC862;border-color:rgba(237,200,98,.45)}
.me small,.side .bwu{color:#8FA3BA}.side .link,.side-foot .link{color:#C9D4E2;opacity:1}.me strong,.me b{color:#fff}
.thm{display:inline-flex;align-items:center;gap:8px;background:none;border:1px solid rgba(255,255,255,.25);color:#C9D4E2;border-radius:999px;padding:6px 12px;font:600 13px inherit;cursor:pointer;margin:0 12px;width:max-content}
.thm .sun{display:none}html[data-theme="dark"] .thm .sun{display:inline}html[data-theme="dark"] .thm .moon{display:none}
/* the menu never scrolls inside itself: on short screens the whole sidebar scrolls with the page */
.side nav{overflow:visible}
@media(max-height:900px){.side{position:relative;height:auto;min-height:100vh}}

/* page header: navy band, gold eyebrow, serif title (as in the sample) */
.main>.top{background:#071D36;color:#fff;border-radius:12px;padding:16px 20px;box-shadow:none;border:0;align-items:center}
html[data-theme="dark"] .main>.top{background:#0E2B4C}
.main>.top h1{color:#fff;font-size:clamp(22px,2.4vw,28px);line-height:1.15}
.main>.top .eyebrow{color:#EDC862}.main>.top .sub{color:#C9D4E2}.main>.top .eyebrow a,.main>.top .sub a{color:#fff}
.main>.top .btn{background:transparent;border-color:rgba(255,255,255,.3);color:#fff}
.main>.top .btn.alt{background:#EDC862;border-color:#EDC862;color:#071D36}

/* surfaces */
.card,.stat,.tablewrap,.inbox,.empty{background:var(--card);border-color:var(--line)}
.stats .stat strong{color:var(--heading)}
input,select,textarea{background:var(--field);color:var(--ink);border-color:var(--line)}
.btn{background:var(--card);border-color:var(--line);color:var(--ink)}.btn:hover{background:var(--panel2)}
.btn.alt{background:#C96B35;border-color:#C96B35;color:#fff}.btn.alt:hover{background:#B85D2A}
.btn.ghost{background:var(--card);color:var(--ink);border-color:var(--line)}
.iconbtn{background:var(--card);border-color:var(--line);color:var(--ink)}
.tag{background:var(--tagbg);color:var(--muted)}.tag.ok{background:var(--okbg);color:var(--ok)}.tag.bad{background:var(--badbg);color:var(--bad)}.tag.warn{background:var(--warnbg);color:var(--warn)}
.flash{background:var(--okbg);border-color:transparent;color:var(--ok)}.flash.bad{background:var(--badbg);color:var(--bad)}
th{background:var(--th);color:var(--muted)}td,th{border-color:var(--line)}
a{color:var(--link)}.side a,.btn,a.stat,.convs a,.feed a.name{color:inherit}
.feed li,.convs a,.ilist,.ipanel,.ihead{border-color:var(--line)}
.chip.on,.picks input:checked+span,.replist a.on{background:#071D36;border-color:#071D36;color:#fff}
html[data-theme="dark"] .chip.on,html[data-theme="dark"] .picks input:checked+span,html[data-theme="dark"] .replist a.on{background:#EDC862;border-color:#EDC862;color:#071D36}
.auth,.bulk,.ibulk,.aibub,.aipanel header{background:#071D36!important;color:#fff}
.auth .box,.popf{background:var(--card);border-color:var(--line);color:var(--ink)}
html[data-theme="dark"] .tablewrap tr.hl,html[data-theme="dark"] .tablewrap tr.hl td{background:var(--panel2)}
html[data-theme="dark"] .chart .b.docs,html[data-theme="dark"] .lgd .docs,html[data-theme="dark"] i.docs{background:#8cc4ff!important}

/* ---------- Messages: three-pane messenger as in the sample ---------- */
.inbox{display:grid;grid-template-columns:290px minmax(0,1fr);height:calc(100vh - 170px);min-height:560px;border-radius:12px;overflow:hidden;box-shadow:none}
.inbox.with-panel{grid-template-columns:290px minmax(0,1fr) 280px}
.inbox.has-conv .ilist,.inbox:not(.has-conv) .iview{display:flex}
.ilist{border-right:1px solid var(--line);display:flex;flex-direction:column;min-height:0}
.newc{padding:12px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center;border-bottom:1px solid var(--line)}
.newc .chips{grid-column:1/-1}
.lsearch{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:8px;padding:0 10px;color:var(--muted);background:var(--field)}
.lsearch input{border:0;background:transparent;padding:8px 0;min-width:0;flex:1;outline:0}
.lsearch:focus-within{outline:2px solid var(--orange);outline-offset:1px}
.newbtn{background:#C96B35;border-color:#C96B35;color:#fff}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.chip{border:1px solid var(--line);color:var(--muted);border-radius:999px;padding:4px 10px;font:600 12px/1.4 inherit;text-decoration:none;background:transparent}
.convs{overflow:auto;flex:1;min-height:0}
.convs li>input{display:none}.convs li>a{padding-left:12px}.ilist.sel .convs li>input{display:block}.ilist.sel .convs li>a{padding-left:36px}
.selrow{padding:6px 12px}
.convs a{padding:11px 12px}
.convs li.on a{background:var(--soft);box-shadow:none}
.convs .av,.hav{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;font:700 13px/1 inherit;color:#fff;background:#0E2B4C;flex:none}
html[data-theme="dark"] .convs .av,html[data-theme="dark"] .hav{background:#24384F}
.convs .dot{background:#C96B35;color:#fff}
.pill{display:inline-block;font-weight:700;font-size:11px;line-height:1;padding:4px 8px;border-radius:999px;white-space:nowrap}.pill.wait{background:var(--warnbg);color:var(--warn)}.pill.ok{background:var(--okbg);color:var(--ok)}.pill.us{background:var(--soft);color:var(--muted)}
.iview{padding:0;display:flex;flex-direction:column;min-width:0;min-height:0}
.iview>.empty{margin:16px;border:0}
.ihead{display:flex;align-items:center;gap:10px;padding:10px 14px;margin:0;border-bottom:1px solid var(--line);flex-wrap:nowrap}
.ihead .ititle{flex:1;min-width:0}.ihead h2{font-size:17px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ihead .hsub{margin:2px 0 0;font-size:13px;color:var(--muted)}.ihead .hint{margin:2px 0 0;font-size:12px}
.ihead .acts{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.ihead .back{display:none}
.tsearch{margin:8px 14px 0;width:auto}
.thread.stream{flex:1;min-height:0;overflow:auto;margin:0;padding:16px;display:flex;flex-direction:column;gap:10px;background:var(--bg)}
.stream li.day{align-self:center}.stream li.day span{display:inline-block;font-weight:700;font-size:11px;line-height:1;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);background:var(--card);border:1px solid var(--line);border-radius:999px;padding:5px 10px}
.stream li.ev{align-self:center;font-size:12px}
.stream li.msg{max-width:min(78%,520px);display:flex;flex-direction:column;gap:3px;align-self:flex-start;background:none!important;border:0!important;padding:0}
.stream li.msg.mine{align-self:flex-end;align-items:flex-end}
.stream .bub{background:var(--theirs);border:1px solid var(--line);border-radius:12px 12px 12px 4px;padding:9px 12px;max-width:100%}
.stream .mine .bub{background:var(--mine);border-color:transparent;border-radius:12px 12px 4px 12px}
.stream .hascard .bub{background:none;border:0;padding:0}
.stream li.msg.internal{align-self:stretch;max-width:none;align-items:stretch}
.stream .internal .bub{background:var(--note);border:1px dashed var(--noteline);border-radius:10px}
.stream .ntag{font:700 11px/1.3 inherit;letter-spacing:.06em;text-transform:uppercase;color:var(--warn);margin-bottom:3px}
.stream .bot .bub{background:var(--note);border-color:var(--noteline)}
.stream .who{display:flex;gap:6px;align-items:center;font-size:11px;color:var(--muted);margin:0}
.stream .who strong{font-weight:600;color:var(--muted)}.stream .who small{color:var(--muted)}
.stream .seen{color:var(--ok);font-weight:700}.stream .sent{color:var(--muted)}
.stream .macts summary{width:22px;height:22px;font-size:13px;border:0;background:none}
.stream .quote{display:block;border-left:3px solid var(--orange);padding:4px 8px;margin-bottom:6px;font-size:12px;color:var(--muted);background:var(--soft);border-radius:4px;text-decoration:none}
.compose{border-top:1px solid var(--line);padding:10px 12px;display:flex;flex-direction:column;gap:8px;background:var(--card)}
.compose .ctools{display:flex;gap:6px;flex-wrap:wrap;margin:0}
.compose .ctools .btn{padding:6px 9px;font-size:12px;border-radius:8px;gap:6px}
.compose .ctools .btn.off{opacity:.55;cursor:not-allowed}
.compose .ctools .btn.on,.compose .notetog.on{background:var(--note);border-color:var(--noteline);color:var(--warn)}
.cfile input,.notetog input{position:absolute;opacity:0;width:1px;height:1px}
.compose .pop{position:relative}
.compose .pop.up .popf{top:auto;bottom:calc(100% + 6px);left:0;right:auto;width:min(340px,86vw);max-height:min(60vh,520px);overflow:auto}
.compose .pop.wide.up .popf{width:min(460px,90vw)}
.compose .emo.up .popf{left:auto;right:0;width:auto}
.sreps .link{display:grid;gap:2px;text-align:left;padding:8px 10px;width:100%}.sreps small{color:var(--muted);font-weight:400}
.compose .reply{border:0;padding:0;gap:6px;display:grid}
.compose .reply.noting textarea{background:var(--note);border-color:var(--noteline)}
.inrow{display:flex;gap:8px;align-items:flex-end}
.inrow textarea{flex:1;min-width:0;resize:vertical;border:1px solid var(--line);border-radius:10px;padding:10px 12px;background:var(--bg);min-height:44px;max-height:40vh}
.inrow .btn.alt{height:44px}
.ipanel{border-left:1px solid var(--line);overflow:auto;padding:14px;min-height:0}
.ipanel h3{font:700 15px/1.3 Georgia,serif}
.ipanel .facts dt{text-transform:none;letter-spacing:0;font-weight:400}
.mcard .mk{color:var(--orange)}
@media(max-width:1200px){.inbox.with-panel{grid-template-columns:270px minmax(0,1fr)}.ipanel{display:none}}
@media(max-width:960px){.inbox,.inbox.with-panel{grid-template-columns:minmax(0,1fr);height:auto;min-height:0}
  .inbox.has-conv .ilist{display:none}.inbox:not(.has-conv) .iview{display:none}.ihead .back{display:inline-grid}
  .thread.stream{overflow:visible}.stream li.msg{max-width:92%}.ihead{flex-wrap:wrap}.ihead .acts{width:100%;justify-content:flex-start}}
.moreacts .popf{width:min(300px,86vw);display:grid;gap:4px}
.moreacts .popf>form,.moreacts .popf>details{display:block}
.moreacts .popf>form .iconbtn,.moreacts .popf>details>summary.iconbtn{width:100%;justify-content:flex-start;gap:8px;padding:8px 10px;height:auto;border:0;background:none;display:flex}
.moreacts .popf>form .iconbtn::after{content:attr(title);font:600 13px/1.2 inherit}
.moreacts .popf>details>summary.iconbtn::after{content:attr(title);font:600 13px/1.2 inherit}
.moreacts .popf details .popf{position:static;box-shadow:none;border:0;padding:6px 0 0;width:auto}
/* documents table fits its box: actions wrap instead of a sideways scroll */
@media(min-width:641px){table.docs{min-width:0;width:100%}table.docs .acts{flex-wrap:wrap;justify-content:flex-end;margin-left:auto}table.docs td:last-child{width:150px;min-width:150px}table.docs td:nth-last-child(2){min-width:0}}
@media(min-width:641px) and (max-width:1360px){table.docs th:nth-child(5),table.docs td:nth-child(5){display:none}}
@media(min-width:641px) and (max-width:1200px){table.docs th:nth-child(4),table.docs td:nth-child(4),table.docs th:nth-child(6),table.docs td:nth-child(6){display:none}}
@media(min-width:641px) and (max-width:960px){table.docs th:nth-child(3),table.docs td:nth-child(3){display:none}}
/* dark mode: report section rows were cream with light text */
html[data-theme="dark"] table.rep tr.section td{background:#13243D;color:#E6ECF4;border-color:#22324A}html[data-theme="dark"] table.rep tr.total td{border-top-color:#7F93AA}html[data-theme="dark"] table.rep td,html[data-theme="dark"] table.rep th{color:#E6ECF4}
/* phone: report list + table stay inside the screen */
.repgrid>*{min-width:0}.report header .facts{flex-wrap:wrap}

/* m2: one chat per client, People and Topics filters, "Suggested from Books" with what each suggestion pulled */
.pchips{display:flex;flex-wrap:wrap;gap:6px;align-items:center;padding:8px 14px;border-bottom:1px solid var(--line);background:var(--card)}
.pchips .pl{font-weight:700;font-size:11px;line-height:1;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-right:2px}
.pchips .pl+.chip{margin-left:0}.pchips .chip+.pl{margin-left:10px}
.pchips .chip{cursor:pointer;display:inline-flex;align-items:center;gap:5px}
.pchips .chip small{font-weight:500;opacity:.75}
.pchips .pd{width:7px;height:7px;border-radius:50%;display:inline-block}.pchips .pd.cl{background:#C96B35}.pchips .pd.tm{background:#071D36}
html[data-theme="dark"] .pchips .pd.tm{background:#EDC862}
.sugg{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.sugg .sl{display:inline-flex;align-items:center;gap:5px;font-weight:700;font-size:11px;line-height:1;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-right:2px}
.sugg .hint{font-size:12px}
.sugg .pr{display:flex;flex-direction:column;align-items:flex-start;gap:1px;border:1px solid var(--line);background:var(--field);color:var(--ink);border-radius:10px;padding:5px 10px;cursor:pointer;text-align:left;max-width:100%}
.sugg .pr b{font-size:12.5px}.sugg .pr small{font-size:11px;color:var(--muted)}
.sugg .pr:hover{border-color:var(--orange)}.sugg .pr.on{border-color:var(--orange);box-shadow:0 0 0 2px rgba(201,107,53,.18)}
.sdrawer{border:1px solid var(--line);border-radius:12px;background:var(--field);padding:10px 12px;display:grid;gap:8px;max-height:min(40vh,340px);overflow:auto}
.compose:has(.sdrawer:not([hidden])) .ctools,.compose:has(.sdrawer:not([hidden])) .reply{display:none}
.iview .thread.stream{min-height:140px}
.sdrawer .hd{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.sdrawer .hd b{display:block;font-size:14px}.sdrawer .hd small{color:var(--muted);font-size:12px}
.sdrawer .pull{display:grid;gap:4px}
.sdrawer .pick{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:8px;padding:6px 8px;background:var(--card)}
.sdrawer .pick span:not(.amt){flex:1;min-width:0}.sdrawer .pick b{display:block;font-size:13px}.sdrawer .pick small{display:block;color:var(--muted);font-size:11.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sdrawer .pick .amt{font-variant-numeric:tabular-nums;font-weight:700;font-size:13px}
.sdrawer .pv>span{display:block;font-weight:700;font-size:11px;line-height:1.4;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-bottom:4px}
.sdrawer .pv .body{border:1px solid var(--line);border-radius:10px;padding:8px 10px;background:var(--card);font-size:13px}
.sdrawer .pv .mcard{margin:0}
.sdrawer .dact{display:flex;gap:8px;justify-content:flex-end}
.inbox.oneclient.has-conv{grid-template-columns:minmax(0,1fr) 300px}.inbox.oneclient.has-conv:not(.with-panel){grid-template-columns:minmax(0,1fr)}.inbox.oneclient.has-conv .ilist{display:none}.inbox.oneclient .ihead .back{display:none}
@media(max-width:1200px){.inbox.oneclient.has-conv{grid-template-columns:minmax(0,1fr)}}
.firstmsg{max-width:520px;margin:40px auto;text-align:left;display:grid;gap:8px}.firstmsg form{display:grid;gap:8px}
@media(max-width:960px){.inbox.auto .ilist{display:flex}.inbox.auto .iview,.inbox.auto .ipanel{display:none}
  .pchips{padding:6px 10px}.pchips .chip small{display:none}.sugg .pr{flex:1 1 140px}}