/* Braid portal theme. Dark is the default; the toggle in the header sets html[data-theme]. Light = each page's own styles. */
html[data-app=broker] body{font-family:'DM Sans',system-ui,sans-serif}
html[data-app=broker] h1,html[data-app=broker] h2,html[data-app=broker] h3{font-family:'Space Grotesk','DM Sans',system-ui,sans-serif;letter-spacing:-.01em}
html[data-app=broker] .btn,html[data-app=broker] .chip,html[data-app=broker] .fchip,html[data-app=broker] .st,html[data-app=broker] .stp,html[data-app=broker] .chs button,html[data-app=broker] .tabs button,html[data-app=broker] .pill{font-family:'DM Mono',ui-monospace,monospace;font-weight:500}
html[data-app=broker] .btn{letter-spacing:.01em}
html[data-app=broker] header strong{font-family:'Space Grotesk',sans-serif;font-weight:500;font-size:19px;letter-spacing:.01em}
html[data-app=broker] header strong small{font-weight:400;color:var(--soft);font-size:13px;margin-left:6px}
html[data-app=broker] .btn{background:var(--grad)}
#themebtn{margin-left:12px;border:1.5px solid #6A5EA0;background:transparent;color:#E9E1FF;border-radius:999px;min-height:32px;padding:0 12px;font:inherit;font-size:13px;cursor:pointer;white-space:nowrap}
html[data-theme=dark]{color-scheme:dark;--muted:#A39EBB;--ground:#0A0A0A;--bg:#0A0A0A;--card:#141022;--card2:#1B1530;--line:#2E2350;--line2:#4B3B86;--ink:#FFFFFF;--soft:#B1ABC8;--accent:#8B5CF6;--accent2:#B994FF;--grad:linear-gradient(90deg,#7C4DFF,#A855F7);--okbg:#12301F;--ok:#86E3AE;--badbg:#3C1722;--bad:#FFA89C;--warnbg:#3A2A10;--warn:#FFD9A0}
html[data-theme=dark] body{font-family:'DM Sans',system-ui,sans-serif;min-height:100vh;background:radial-gradient(1100px 520px at 50% 115%,#3A1A7A 0%,#1B1040 40%,transparent 72%),var(--bg) fixed;color:var(--ink)}
html[data-theme=dark] header{background:#0A0A0A;border-bottom:1px solid var(--line)}
html[data-theme=dark] a{color:var(--accent2)}
html[data-theme=dark] .card,html[data-theme=dark] .side{background:var(--card);border-color:var(--line)}
html[data-theme=dark] .tabs{background:#150E2E;border-color:var(--line)}
html[data-theme=dark] .tabs button{color:var(--soft)}
html[data-theme=dark] .tabs button.on{background:var(--card);color:#fff;border-bottom-color:var(--accent)}
html[data-theme=dark] .sendbar{background:var(--card);border-color:var(--line)}
html[data-theme=dark] .k{color:var(--soft)}
html[data-theme=dark] .topbar a,html[data-theme=dark] button.l{color:var(--accent2)}
html[data-theme=dark] .pill{background:var(--line);color:var(--ink)}
html[data-theme=dark] .chip,html[data-theme=dark] .fchip{background:var(--card2);border-color:var(--line2);color:var(--ink)}
html[data-theme=dark] .chip.on,html[data-theme=dark] .fchip.on{background:var(--grad);border-color:var(--accent);color:#fff}
html[data-theme=dark] .fchip .n{background:var(--line);color:#DCD3FF}
html[data-theme=dark] .fchip.on .n{background:#fff;color:var(--accent)}
html[data-theme=dark] .banner.act{background:linear-gradient(180deg,#8B5CF6,#5B3BC4);color:#fff;box-shadow:0 6px 24px #6D3FF055}
html[data-theme=dark] .banner.wait{background:#2A1F57;color:var(--ink)}
html[data-theme=dark] .banner.done{background:var(--okbg);color:var(--ok)}
html[data-theme=dark] .btn[disabled]{background:#4A3D82;color:#9C92C8}
html[data-theme=dark] .btn.ghost{background:transparent;color:#fff;border-color:#8B6CFF}
html[data-theme=dark] .btn.good{background:#1F8A52}
html[data-theme=dark] .btn.bad{background:transparent;color:var(--bad);border-color:#B8584C}
html[data-theme=dark] select,html[data-theme=dark] textarea,html[data-theme=dark] input[type=text],html[data-theme=dark] input[type=email],html[data-theme=dark] input[type=tel],html[data-theme=dark] input[type=search]{background:#120C2B;color:var(--ink);border-color:var(--line2)}
html[data-theme=dark] ::placeholder{color:#8277B4}
html[data-theme=dark] option{background:#120C2B;color:var(--ink)}
html[data-theme=dark] .drow{background:var(--card2);border-color:var(--line)}
html[data-theme=dark] .drow.s-received{border-color:var(--accent);box-shadow:0 0 0 2px #3B2A85}
html[data-theme=dark] .drow.s-rejected{border-color:#B8584C}
html[data-theme=dark] .drow.s-notreq{background:#150F2D;border-color:#54487F;color:#9A90C4}
html[data-theme=dark] .drow.s-waiting{border-left-color:#5B8DEF}
html[data-theme=dark] .drow.s-accepted,html[data-theme=dark] .drow.s-done{border-left-color:#3E9B66}
html[data-theme=dark] .st{background:var(--line);color:#DCD3FF}
html[data-theme=dark] .st.received{background:var(--accent);color:#fff}
html[data-theme=dark] .st.accepted,html[data-theme=dark] .st.done{background:#14402B;color:var(--ok)}
html[data-theme=dark] .st.rejected,html[data-theme=dark] .st.expired{background:#4A1B24;color:var(--bad)}
html[data-theme=dark] .st.skipped{background:#4A3A12;color:#FFD98A}
html[data-theme=dark] .st.notreq{background:transparent;color:#9A90C4;border-color:#6A5EA0}
html[data-theme=dark] .st.requested{background:#1E3A78;color:#BCD3FF}
html[data-theme=dark] .stp{background:#241A4A;color:#9A90C4}
html[data-theme=dark] .stp i{background:#4A3D82}
html[data-theme=dark] .stp.done{background:var(--okbg);color:var(--ok)}
html[data-theme=dark] .stp.done i{background:#2E8A57}
html[data-theme=dark] .stp.now{background:var(--grad);color:#fff}
html[data-theme=dark] .stp.now i{background:#fff;color:var(--accent)}
html[data-theme=dark] .addrow{background:#150F2D;border-color:#5A4A9A}
html[data-theme=dark] .addrow .chip{color:var(--accent2);border-color:#6A5EA0}
html[data-theme=dark] .addrow .chip:hover{background:var(--accent);color:#fff}
html[data-theme=dark] .panel{background:#150F2D;border-color:#5A4A9A}
html[data-theme=dark] .quick button{background:var(--card2);border-color:var(--line2);color:var(--ink)}
html[data-theme=dark] .notebox{background:var(--badbg);color:#FFC9C1}
html[data-theme=dark] .warnbox,html[data-theme=dark] .warn{background:var(--warnbg);color:var(--warn)}
html[data-theme=dark] .ok{background:var(--okbg);color:var(--ok)}
html[data-theme=dark] .bubble{background:#2F2674;color:var(--ink)}
html[data-theme=dark] .msg{border-color:var(--line)}
html[data-theme=dark] .chs button{background:var(--card2);border-color:var(--line2);color:var(--soft)}
html[data-theme=dark] .chs button.on{background:#33285F;border-color:var(--accent);color:var(--accent2)}
html[data-theme=dark] .tg{border-color:var(--line2)}
html[data-theme=dark] .tg.on{background:var(--line)}
html[data-theme=dark] details>summary{color:var(--soft)}
html[data-theme=dark] .thumb,html[data-theme=dark] .pdf iframe{border-color:var(--line2)}
html[data-theme=dark] td,html[data-theme=dark] th{border-bottom-color:#2D2357}
html[data-theme=dark] th{color:var(--soft)}
html[data-theme=dark] tr.go:hover td{background:#241A4A}
html[data-theme=dark] .sub td{background:#150F2D}
html[data-theme=dark] .indent{color:var(--soft)}
html[data-theme=dark] .nm{color:var(--ink)}
html[data-theme=dark] .nx.act{color:var(--accent2)}
html[data-theme=dark] .nx.wait{color:var(--soft)}
html[data-theme=dark] .nx.done{color:var(--ok)}
html[data-theme=dark] .bar{background:var(--line)}
html[data-theme=dark] .bar i{background:var(--accent)}
html[data-theme=dark] kbd{background:var(--card2);border-color:var(--line2);color:var(--ink)}
html[data-theme=dark] .docrow{border-color:var(--line)}
html[data-theme=dark] .shead .n{background:var(--accent)}
html[data-theme=dark] .facts{color:var(--soft)}
html[data-theme=dark] .facts b{color:var(--ink)}
html[data-theme=dark] #toast div{background:#0B0716!important;border:1px solid var(--line2)}
html[data-theme=dark] .drow.s-received{border-color:#8B5CF6}
html[data-theme=dark] .card{box-shadow:0 8px 30px #00000066}
html[data-theme=dark] h1{font-weight:600}
html[data-theme=dark] .bar i{background:var(--grad)}
html[data-theme=dark] main .card,html[data-theme=dark] .row,html[data-theme=dark] .chip{background:#141022}
html[data-theme=dark] .card,html[data-theme=dark] .row,html[data-theme=dark] .chip,html[data-theme=dark] .preview{border-color:var(--line)}
html[data-theme=dark] .row .s,html[data-theme=dark] .small,html[data-theme=dark] .placeholder,html[data-theme=dark] p{color:var(--soft)}
html[data-theme=dark] input.code,html[data-theme=dark] input[type=text],html[data-theme=dark] input[type=tel],html[data-theme=dark] textarea{background:#120C2B;color:var(--ink);border-color:var(--line2)}
html[data-theme=dark] .btn.alt{background:transparent;color:#fff;border-color:#8B6CFF}
html[data-theme=dark] .linkbtn,html[data-theme=dark] .back{color:var(--accent2)}
html[data-theme=dark] .chip[aria-pressed=true]{border-color:var(--accent);background:#2A1F57}
html[data-theme=dark] .preview{background:#1B1530;color:var(--soft)}
html[data-theme=dark] .badge{background:var(--line);color:#DCD3FF}
html[data-theme=dark] .badge.sent{background:#14402B;color:var(--ok)}
html[data-theme=dark] .badge.skipped{background:#4A3A12;color:#FFD98A}
html[data-theme=dark] .badge.rejected{background:#4A1B24;color:var(--bad)}
html[data-theme=dark] .fixnote{background:var(--badbg);color:#FFC9C1}
html[data-theme=dark] .err{background:var(--warnbg);color:var(--warn)}
html[data-theme=dark] .bar{background:var(--line)}
html[data-theme=dark] #toast{background:#0B0716;border:1px solid var(--line2)}
html[data-theme=dark] .logo{color:#fff}
html[data-theme=dark] #themebtn{background:#1B1530;color:#fff;border-color:#4B3B86}
html[data-theme=dark] .docbox,html[data-theme=dark] .docbox *{color:#2A2550}
html[data-theme=dark] .docbox a{color:#4B2FC0}
html[data-theme=dark] .addbar{background:linear-gradient(90deg,#2A1A66,#3B1F8F);border-color:#7C4DFF}
html[data-theme=dark] .addpanel{background:#150F2D;border-color:#8B5CF6;box-shadow:0 8px 28px #6D3FF055}
html[data-theme=dark] .addi:hover{background:#241A4A}
html[data-theme=dark] .addg{color:var(--soft)}
html[data-theme=dark] .dsec.act .dsech b{color:var(--accent2)}
@keyframes popd{from{box-shadow:0 0 0 4px #8B5CF6AA;background:#3B2A85}to{box-shadow:0 0 0 0 transparent}}
html[data-theme=dark] .drow.flash{animation:popd 2.5s ease-out}
html[data-theme=dark] .chip.prof{color:var(--accent2);border-color:#6A5EA0}
html[data-theme=dark] .chip.prof:hover{background:var(--accent);color:#fff}
html[data-theme=dark] .mailcard{border-color:var(--line2)}
html[data-theme=dark] .modalcard{background:var(--card)}
html[data-theme=dark] .msgbox.editing textarea,html[data-theme=dark] .msgbox.editing input{box-shadow:0 0 0 3px #8B5CF655}
html[data-theme=dark] .drow.s-reasked{border-left-color:#E8903A}
html[data-theme=dark] .st.reasked{background:#5A2E0A;color:#FFB27A}
html[data-theme=dark] .notebox.again{background:#3A2410;color:#FFD2A8}
html[data-theme=dark] .tools{background:var(--card)}
html[data-theme=dark] .tog[aria-pressed=true]{background:#2A1F57;border-color:var(--accent)}
/* Logo: white on dark, purple on light */
.logos{display:flex;align-items:center}
.logo-img{height:44px;width:auto;display:block}
.logo-p{display:none}
html[data-theme=light] .logo-w{display:none}
html[data-theme=light] .logo-p{display:block}
html[data-app=customer] header{padding-top:8px;padding-bottom:8px}
html[data-app=customer][data-theme=light] header{background:#fff;border-bottom:1px solid #D4CBF5}
html[data-app=customer][data-theme=light] header small{color:#4B4570}
html[data-theme=light] #themebtn{color:#3A2A8C;border-color:#9A8CD0}
/* Document icons */
.ico{display:inline-flex;flex:none;color:#6D3FF0}
.ico svg{fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.ico svg .f{fill:currentColor;fill-opacity:.18}
html[data-theme=dark] .ico{color:#B79CFF}
.hero{display:flex;justify-content:center;padding:4px 0}
.heroico{width:112px;height:112px;border-radius:50%;background:rgba(109,63,240,.10);display:flex;align-items:center;justify-content:center}
html[data-theme=dark] .heroico{background:rgba(183,156,255,.12)}
.pdots{display:flex;flex-wrap:wrap;gap:6px}
.pdot{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(109,63,240,.08);opacity:.55}
.pdot.cur{opacity:1;box-shadow:0 0 0 2px #6D3FF0;background:rgba(109,63,240,.16)}
.pdot.done{opacity:1;background:#6D3FF0;color:#fff}
.pdot.done .ico{color:#fff}
html[data-theme=dark] .pdot{background:rgba(183,156,255,.10)}
html[data-theme=dark] .pdot.cur{box-shadow:0 0 0 2px #B79CFF;background:rgba(183,156,255,.2)}
html[data-theme=dark] .pdot.done{background:#7C4DFF}
.ilist{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column;gap:10px}
.ilist li{display:flex;align-items:center;gap:12px}
.rowico{display:flex;align-items:center;gap:12px}
.sigthumb{display:block;height:64px;max-width:100%;background:#fff;border:1px solid #D4CBF5;border-radius:6px;margin-top:6px;padding:2px}
/* Light mode has no --grad, so plain buttons lost their background (white text on pale). Give them the solid purple. */
html[data-app=broker]:not([data-theme=dark]) .btn:not(.ghost):not(.bad):not(.good){background:var(--accent)}
