/* Demo-appen inuti telefonramen (se assets/demo.js) */

.dm{position:absolute;inset:0;background:var(--paper);color:var(--ink);font-family:'Inter',sans-serif;font-size:14px;line-height:1.35;overflow:hidden;}
.dm *{box-sizing:border-box;}
.dm button{font:inherit;color:inherit;cursor:pointer;border:0;background:none;text-align:left;}
.dm input,.dm select{font:inherit;color:inherit;}
.dm .serif{font-family:'Fraunces',serif;}
.dm-i{width:20px;height:20px;flex:0 0 auto;}
.dm-app{position:absolute;inset:0;display:flex;flex-direction:column;}

/* header */
.dm-head{flex:0 0 auto;display:grid;grid-template-columns:76px 1fr 76px;align-items:center;height:54px;padding:0 10px;}
.dm-head-l{display:flex;gap:2px;}
.dm-title{text-align:center;font-family:'Fraunces',serif;font-weight:600;font-size:17px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.dm-ib{width:34px;height:34px;display:grid;place-items:center;border-radius:50%;}
.dm-ib:hover{background:var(--paper-deep);}
.dm-ib.red{color:var(--rust);}
.dm-avatar{justify-self:end;width:32px;height:32px;border-radius:50%;background:var(--forest)!important;color:#fff!important;font-family:'Fraunces',serif;font-weight:600;display:grid;place-items:center;text-align:center!important;}

/* scroll areas */
.dm-scroll{flex:1;min-height:0;overflow-y:auto;padding:8px 16px 20px;-webkit-overflow-scrolling:touch;}
.dm-scroll::-webkit-scrollbar{width:0;}
.dm-center{display:flex;flex-direction:column;justify-content:center;padding-bottom:60px;}
.dm-foot{flex:0 0 auto;padding:10px 16px 12px;border-top:1px solid var(--line-soft);background:var(--paper);}
.dm-foot.col{display:flex;flex-direction:column;gap:8px;}
.dm-2{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.dm-h1{font-family:'Fraunces',serif;font-weight:600;font-size:23px;text-align:center;margin:0 0 26px;letter-spacing:-0.3px;}
.dm-h1.small{font-size:21px;margin:14px 0 6px;}
.dm-stack{display:flex;flex-direction:column;gap:10px;}
.dm-hr{border:0;border-top:1px solid var(--line);margin:8px 0;width:100%;}
.dm-who{text-align:center;margin-bottom:22px;}
.dm-who small{color:var(--muted);font-size:13px;}
.dm-who h2{font-family:'Fraunces',serif;font-weight:600;font-size:21px;margin-top:4px;}

/* buttons */
.dm-btn{display:flex;align-items:center;gap:12px;width:100%;padding:13px 16px;border-radius:12px;border:1px solid var(--line)!important;background:#fff!important;}
.dm-btn b{display:block;font-weight:600;font-size:14.5px;}
.dm-btn small{display:block;font-size:12px;color:var(--ink-soft);margin-top:1px;font-weight:400;}
.dm-btn.primary{background:var(--forest)!important;border-color:var(--forest)!important;color:#fff;}
.dm-btn.primary small{color:rgba(255,255,255,0.85);}
.dm-btn.primary:hover{background:var(--forest-deep)!important;}
.dm-btn.outline .dm-i{color:var(--forest);}
.dm-btn.outline:hover{background:var(--paper-deep)!important;}
.dm-btn.center{justify-content:center;text-align:center;padding:12px 14px;}
.dm-btn.center b{font-size:14px;}
.dm-btn.disabled{opacity:.45;}

/* chips */
.dm-chips{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0 12px;}
.dm-chips.small{margin:8px 0 0;}
.dm-chip{padding:7px 14px;border-radius:20px;border:1px solid var(--line)!important;background:#fff!important;font-size:13px;font-weight:500;}
.dm-chip.on{background:var(--forest)!important;border-color:var(--forest)!important;color:#fff;}

/* lists */
.dm-list{border-top:1px solid var(--line-soft);}
.dm-list.mt{margin-top:18px;}
.dm-row{display:flex;align-items:center;gap:10px;width:100%;padding:13px 2px;border-bottom:1px solid var(--line-soft)!important;}
.dm-row:hover{background:var(--paper-deep);}
.dm-row-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;}
.dm-row-t{font-weight:500;font-size:14.5px;}
.dm-row-s{font-size:12px;color:var(--muted);display:flex;flex-wrap:wrap;gap:5px;align-items:center;}
.dm-row-r{color:var(--muted);flex:0 0 auto;}
.dm-amt{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:12.5px;color:var(--ink);white-space:nowrap;}
.dm-empty{padding:26px 4px;color:var(--muted);text-align:center;}
.dm-badge{display:inline-block;padding:1px 7px;border-radius:9px;font-size:10.5px;font-weight:600;background:var(--paper-deep);color:var(--ink-soft);}
.dm-badge.ok{background:var(--forest-pale);color:var(--forest-deep);}
.dm-badge.bad{background:var(--rust-pale);color:var(--rust);}
.dm-badge.warn{background:#F6EBC9;color:#7A5B0E;}
.dm-search{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:0 12px;margin-bottom:10px;}
.dm-search .dm-i{color:var(--ink-soft);}
.dm-search input{flex:1;border:0;outline:0;background:none;height:42px;}

/* forms & cards */
.dm-card{background:#fff;border:1px solid var(--line-soft);border-radius:14px;padding:12px 14px;margin-bottom:12px;}
.dm-card.nopad{padding:0;overflow:hidden;}
.dm-label,.dm-f>span{display:block;font-size:12px;color:var(--ink-soft);margin-bottom:4px;font-weight:500;}
.dm-f{display:block;margin-bottom:10px;}
.dm-f input,.dm-f select{width:100%;height:40px;border:1px solid var(--line);border-radius:10px;padding:0 10px;background:var(--paper);outline:0;}
.dm-f input:focus,.dm-f select:focus{border-color:var(--forest);background:#fff;}
.dm-f.inline{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:8px 0 0;}
.dm-f.inline>span{margin:0;}
.dm-f.inline input{width:auto;}
.dm-3{display:grid;grid-template-columns:.8fr 1.2fr 1fr;gap:8px;}
.dm-3 .dm-f{margin-bottom:0;}
.dm-cust{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:4px;}
.dm-cust b{font-family:'Fraunces',serif;font-weight:600;font-size:16px;}
.dm-link{color:var(--forest)!important;font-size:13px;white-space:nowrap;}
.dm-line-h{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px;}
.dm-line-h .dm-label{margin:0;}
.dm-sect{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:600;color:var(--ink-soft);letter-spacing:.5px;margin:14px 0 10px;}
.dm-sect .dm-i{width:16px;height:16px;}
.dm-hint{font-size:12px;color:var(--muted);margin:8px 0 0;}
.dm-live{background:var(--forest-pale);border-radius:14px;padding:12px 14px;margin:12px 0 4px;display:flex;flex-direction:column;gap:5px;font-size:13px;}
.dm-live div{display:flex;justify-content:space-between;}
.dm-live .tot{border-top:1px solid rgba(47,93,78,.25);padding-top:6px;margin-top:2px;font-size:15px;}

/* settings toggles */
.dm-tog{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;padding:13px 14px;border-bottom:1px solid var(--line-soft)!important;}
.dm-tog:last-child{border-bottom:0!important;}
.dm-tog-t b{display:block;font-weight:500;font-size:14px;}
.dm-tog-t small{display:block;font-size:12px;color:var(--muted);margin-top:1px;}
.dm-sw{flex:0 0 auto;width:42px;height:24px;border-radius:12px;background:var(--line);position:relative;transition:background .15s;}
.dm-sw i{position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:left .15s;}
.dm-sw.on{background:var(--forest);}
.dm-sw.on i{left:21px;}

/* sent */
.dm-sent{align-items:center;text-align:center;}
.dm-sent p{color:var(--ink-soft);margin:0 0 22px;font-size:13.5px;padding:0 10px;}
.dm-sent .dm-stack{width:100%;}
.dm-sent .dm-hint{margin-top:16px;}
.dm-ok{width:64px;height:64px;border-radius:50%;background:var(--forest-pale);color:var(--forest);display:grid;place-items:center;}
.dm-ok .dm-i{width:30px;height:30px;}

/* drawer */
.dm-drawer-bg{position:absolute;inset:0;background:rgba(30,42,37,.5);}
.dm-drawer{position:absolute;top:0;bottom:0;left:0;width:82%;background:var(--paper);padding:18px 8px 12px;overflow-y:auto;display:flex;flex-direction:column;animation:dmSlide .18s ease-out;}
@keyframes dmSlide{from{transform:translateX(-30px);opacity:.4;}to{transform:none;opacity:1;}}
.dm-drawer-t{font-weight:600;font-size:19px;padding:0 10px 12px;}
.dm-di{display:flex;align-items:center;gap:14px;padding:11px 10px;border-radius:10px;font-size:14.5px;}
.dm-di:hover{background:var(--paper-deep);}
.dm-di .dm-i{color:var(--forest);}
.dm-drawer-f{margin-top:auto;padding:14px 10px 0;border-top:1px solid var(--line);font-size:12px;font-weight:500;}
.dm-drawer-f span{color:var(--forest);}

/* toast + overlay */
.dm-toast{position:absolute;left:14px;right:14px;bottom:76px;background:#1E2A25;color:#fff;padding:11px 14px;border-radius:12px;font-size:13px;opacity:0;transform:translateY(8px);pointer-events:none;transition:opacity .2s,transform .2s;z-index:5;}
.dm-toast.on{opacity:1;transform:none;}
.dm-overlay{position:absolute;inset:0;background:rgba(30,42,37,.62);display:grid;place-items:center;padding:20px;z-index:9;}
.dm-overlay-card{background:var(--paper);border-radius:20px;padding:24px;text-align:center;width:100%;}
.dm-overlay-card h3{font-weight:600;font-size:20px;margin-bottom:10px;}
.dm-overlay-card p{margin-bottom:18px;color:var(--ink-soft);}
.dm-overlay-card a{color:var(--forest);font-weight:700;text-decoration:underline;}

/* invoice paper — mirrors lib/widgets/invoice_paper.dart at 794x1123 px, scaled to fit by demo.js */
.dm-paperwrap{background:var(--paper-deep);padding:12px;}
.dm-paper{position:relative;width:100%;background:#fff;box-shadow:0 2px 10px rgba(30,42,37,.12);overflow:hidden;}
.dm-paper .pg{position:absolute;top:0;left:0;width:794px;height:1123px;transform-origin:0 0;padding:64px 68px;display:flex;flex-direction:column;background:#fff;color:var(--ink);font-size:13px;}
.dm-paper .m{font-family:'IBM Plex Mono',ui-monospace,monospace;}
.dm-paper .lab{font-size:11px;letter-spacing:.6px;color:var(--muted);}
.dm-paper .sm{font-size:12.5px;color:var(--ink-soft);}
.dm-paper .sm.mt{margin-top:12px;}
.dm-paper .ph{display:flex;justify-content:space-between;align-items:flex-start;}
.dm-paper .pco{font-family:'Fraunces',serif;font-weight:600;font-size:22px;}
.dm-paper .ptitle{font-family:'Fraunces',serif;font-weight:600;font-size:30px;}
.dm-paper .pblock{margin-top:34px;padding-top:20px;border-top:1.5px solid var(--ink);display:flex;gap:20px;align-items:flex-start;}
.dm-paper .pl5{flex:5;}
.dm-paper .pl4{flex:4;display:flex;flex-direction:column;align-items:flex-end;}
.dm-paper .cn{font-size:15px;font-weight:600;margin-top:6px;}
.dm-paper .ca{font-size:13.5px;color:var(--ink-soft);line-height:1.6;}
.dm-paper .dedb{margin-top:12px;}
.dm-paper .dedb .lab{margin-bottom:4px;}
.dm-paper .mr{padding:4px 0;font-size:13.5px;text-align:right;}
.dm-paper .mr b{font-weight:700;color:var(--ink-soft);}
.dm-paper .paybox{margin-top:14px;padding-top:10px;border-top:1px solid var(--line-soft);display:flex;justify-content:flex-end;align-items:flex-start;gap:14px;}
.dm-paper .payl{text-align:right;}
.dm-paper .payl .lab{margin-bottom:4px;}
.dm-paper .pl{font-size:13px;}
.dm-paper .qrc{text-align:center;}
.dm-paper .qrc .lab{line-height:1.3;}
.dm-paper .qrc svg{margin-top:4px;display:block;}
.dm-paper .thead{margin-top:32px;padding-bottom:8px;border-bottom:2.5px solid var(--ink);display:flex;font-size:11px;font-weight:600;letter-spacing:.5px;color:#6B6559;}
.dm-paper .pr{display:flex;padding:10px 0;border-bottom:1px solid var(--line-soft);font-size:13px;}
.dm-paper .c1{flex:34;}
.dm-paper .c2{flex:10;text-align:right;}
.dm-paper .c3{flex:11;text-align:right;}
.dm-paper .c4{flex:6;text-align:right;}
.dm-paper .c5{flex:20;text-align:right;}
.dm-paper .spacer{flex:1;min-height:16px;}
.dm-paper .sumwrap{display:flex;justify-content:flex-end;}
.dm-paper .sum{width:420px;}
.dm-paper .tr{display:flex;justify-content:space-between;padding:3px 0;font-size:12.5px;color:var(--ink-soft);}
.dm-paper .tr.big{margin-top:8px;padding-top:12px;border-top:2.5px solid var(--ink);font-size:16px;font-weight:700;color:var(--ink);}
.dm-paper .tr.big span:first-child{font-family:'Inter',sans-serif;}
.dm-paper .pfoot{margin-top:24px;padding-top:16px;border-top:1.5px solid var(--ink);display:flex;font-size:12px;color:var(--ink-soft);}
.dm-paper .pfoot b{color:var(--ink);font-weight:600;display:block;}
.dm-paper .f11{flex:11;}
.dm-paper .f10{flex:10;}
.dm-paper .fs{margin-top:4px;}
.dm-paper .pcred{text-align:right;margin-top:8px;font-size:9px;color:#B9C4BD;}

/* Filer-skärmen: kort som visas hopfällda och inte går att fälla ut */
.dm-intro{font-size:13px;line-height:1.55;color:var(--ink-soft);margin:6px 0 16px;}
.dm-fcard{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px;margin-bottom:12px;cursor:default;}
.dm-fcard span{flex:1;font-size:14px;font-weight:600;color:var(--forest-deep);}
.dm-fcard .dm-i{width:17px;height:17px;color:var(--forest);}
.dm-fcard .dm-i:last-child{width:20px;height:20px;color:var(--muted);}
