/* arenden.css — supportärenden: arenden.html, admin.html och kortet "Mina ärenden" i help.html. Tokens ur styles.css. */
.tk-app{min-height:100vh;background:var(--bg);color:var(--ink);font-family:"Geist","Geist Fallback",ui-sans-serif,system-ui,sans-serif}
.tk-top{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:12px;padding:12px 20px;background:rgba(10,15,24,.78);backdrop-filter:blur(20px) saturate(140%);-webkit-backdrop-filter:blur(20px) saturate(140%);border-bottom:1px solid var(--line)}
.tk-back{width:36px;height:36px;border-radius:10px;border:1px solid var(--line);display:inline-flex;align-items:center;justify-content:center;color:var(--ink-1);text-decoration:none;flex:none;background:transparent;cursor:pointer}
.tk-back svg{transform:rotate(180deg)}
.tk-top h1{margin:0;font-size:17px;font-weight:600;line-height:1.15}
.tk-top .sub{font-size:12.5px;color:var(--ink-3);margin-top:2px}
.tk-brand{font-family:Lora,Georgia,serif;font-weight:600;font-size:15px;color:var(--ink);padding-right:12px;border-right:1px solid var(--line-2);white-space:nowrap;display:flex;align-items:center;gap:8px;text-decoration:none}
.tk-brand img{width:28px;height:28px}
.tk-mode{margin-left:auto;font-size:10.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#1a1200;background:#FBBF24;border:0;border-radius:999px;padding:5px 10px;white-space:nowrap}
/* Demoläget som band (5/10): över hela bredden under toppfältet, omöjligt att missa. */
.tk-demo{background:#FBBF24;color:#1a1200;font-weight:700;font-size:13px;line-height:1.35;padding:9px 16px;text-align:center}
.tk-mono{font-family:"Geist Mono",ui-monospace,monospace;font-variant-numeric:tabular-nums}
.tk-code{letter-spacing:.16em;font-weight:500}
.tk-main{max-width:760px;margin:0 auto;padding:20px 16px 60px;display:flex;flex-direction:column;gap:14px;min-width:0}
.tk-card{background:var(--bg-1);border:1px solid var(--line);border-radius:16px;padding:16px 18px}
.tk-k{font-size:11.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3)}
.tk-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:38px;padding:0 14px;border-radius:12px;border:1px solid rgba(91,168,255,.4);background:rgba(91,168,255,.1);color:#BAE0FF;font:inherit;font-size:14px;font-weight:600;cursor:pointer;text-decoration:none;white-space:nowrap}
.tk-btn:hover{background:rgba(91,168,255,.18)}
.tk-btn.g{border-color:var(--line-2);background:transparent;color:var(--ink-1)}
.tk-btn.g:hover{background:rgba(255,255,255,.04)}
.tk-btn.ok{border-color:rgba(46,212,122,.5);background:rgba(46,212,122,.12);color:#A7F3D0}
.tk-btn.ok:hover{background:rgba(46,212,122,.2)}
.tk-btn.sm{height:34px;padding:0 12px;font-size:13px;border-radius:10px}
.tk-btn.w{width:100%}
.tk-btn:disabled{opacity:.45;cursor:default}
.tk-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 0;border-top:1px solid var(--line);font-size:14px;color:var(--ink);text-decoration:none}
.tk-row:first-child{border-top:0}
.tk-row .v{color:var(--ink-2);font-size:13px;margin-top:2px;display:block}
.tk-row-t{display:block;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tk-tag{font-size:11.5px;font-weight:600;padding:3px 8px;border-radius:999px;border:1px solid var(--line-2);color:var(--ink-1);white-space:nowrap;flex:none}
.tk-tag.new{border-color:rgba(251,191,36,.5);color:#FDE68A;background:rgba(251,191,36,.1)}
.tk-tag.mine{border-color:rgba(91,168,255,.5);color:#BAE0FF}
.tk-tag.wait{border-color:rgba(157,123,255,.5);color:#DDD6FE}
.tk-tag.done{color:var(--ink-3)}
.tk-tag.unread{border-color:rgba(91,168,255,.5);color:#BAE0FF;background:rgba(91,168,255,.12)}
.tk-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.tk-chip{font:inherit;font-size:12.5px;padding:6px 12px;border-radius:999px;border:1px solid var(--line-2);color:var(--ink-1);background:transparent;cursor:pointer}
.tk-chip.on{border-color:var(--blue);color:#E0F2FE;background:rgba(91,168,255,.12)}
.tk-ta{width:100%;min-height:110px;margin-top:10px;border:1px solid var(--line-2);border-radius:12px;background:rgba(10,15,24,.6);color:var(--ink);font:inherit;font-size:14px;line-height:1.5;padding:10px 12px;resize:vertical}
.tk-ta:focus,.tk-in:focus,.tk-sel:focus{outline:none;border-color:rgba(91,168,255,.6)}
.tk-thumbs{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.tk-thumb{position:relative;width:96px;height:72px;border-radius:8px;overflow:hidden;border:1px solid var(--line-2);background:var(--bg-2)}
.tk-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.tk-thumb button{position:absolute;top:4px;right:4px;width:20px;height:20px;border-radius:50%;border:0;background:rgba(0,0,0,.7);color:#fff;font-size:12px;cursor:pointer;line-height:20px;padding:0}
.tk-snap{border:1px solid var(--line);border-radius:14px;padding:14px 16px;background:rgba(255,255,255,.015)}
.tk-snap ul{margin:8px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:5px;font-size:13px;color:var(--ink-1)}
.tk-snap li::before{content:"✓ ";color:var(--c-sell)}
.tk-snap p{margin:10px 0 0;font-size:12px;line-height:1.5;color:var(--ink-3)}
.tk-hint{font-size:12.5px;color:var(--ink-3);line-height:1.5}
.tk-chat{display:flex;flex-direction:column;gap:8px}
.tk-msg{max-width:86%;padding:10px 13px;border-radius:14px;font-size:14.5px;line-height:1.5;overflow-wrap:anywhere;white-space:pre-line}
.tk-msg.me{align-self:flex-end;background:rgba(91,168,255,.15);border:1px solid rgba(91,168,255,.3);color:#E0F2FE;border-bottom-right-radius:4px}
.tk-msg.them{align-self:flex-start;background:var(--bg-2);border:1px solid var(--line-2);color:var(--ink);border-bottom-left-radius:4px}
.tk-msg.int{align-self:flex-end;background:rgba(251,191,36,.08);border:1px dashed rgba(251,191,36,.45);color:#FDE68A;border-bottom-right-radius:4px}
.tk-msg .who{font-size:11px;color:var(--ink-3);margin-bottom:3px;letter-spacing:.05em;text-transform:uppercase;white-space:normal}
/* v708: Ta bort står sist i rubrikraden med reserverad plats, i stället för över texten. */
.tk-msg .who.wd{display:flex;align-items:center;gap:12px}.tk-msg .who.wd>span{min-width:0}
.tk-msg{position:relative}.tk-msg-del{flex:none;margin:-3px -4px -3px auto;font:inherit;font-size:11px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:#FCA5A5;background:rgba(10,15,24,.85);border:1px solid rgba(252,165,165,.4);border-radius:6px;padding:2px 7px;cursor:pointer;opacity:0;transition:opacity .12s}.tk-msg:hover .tk-msg-del,.tk-msg-del:focus{opacity:1}
.tk-msg.deleted{opacity:.6;border-style:dashed}.tk-msg.deleted .txt{text-decoration:line-through;color:var(--ink-2)}.tk-msg .del-tag{display:block;color:#FCA5A5;margin-top:2px}
.tk-msg.int .who{color:rgba(253,230,138,.7)}
/* v711 (André 27/9): interna lappar i följd i en gul panel över hela bredden, namnband i skribentens färg (ingen initialbricka). Meddelanden till kund får samma band. Gult är bara internt. */
/* v713 (André 27/9: "igen skön gul och svårläst mot vit"): ljus gul lapp med mörk text i stället för mörkgul botten med vit text. */
/* v719 (André 27/9, mockupen Interna lappar fem färger: "Ramen och namnet som i 2 men texten och bakgrunden som i 3"): gul ram utan fyllning, helgult namnband, ljusgul text på trådens egen botten. */
.tk-ip{flex:none;align-self:stretch;border:1.5px solid #F2C14E;background:none;border-radius:12px;overflow:hidden}
.tk-band{display:flex;align-items:center;gap:8px;padding:6px 12px;font-size:13px;line-height:1.35;min-width:0}.tk-band b{font-weight:600;min-width:0;overflow-wrap:anywhere}
.tk-band .t,.tk-note .t{font-family:"Geist Mono",ui-monospace,monospace;font-size:11.5px;color:var(--ink-2);white-space:nowrap}
.tk-band .l{margin-left:auto;font-size:10.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}.tk-band .l.i{color:#FDE68A}.tk-band .l.k{color:var(--ink-2)}
.tk-band.int{background:#F2C14E}.tk-band.int b{color:#1F1A0E}.tk-band.int .t{color:#3D3212}.tk-band.int .l.i{color:#1F1A0E}.tk-band .dot{flex:none;width:9px;height:9px;border-radius:50%;box-shadow:0 0 0 1.5px #1F1A0E}
.tk-band .tk-msg-del{margin:-3px 0 -3px auto}.tk-band .tk-msg-del+.l{margin-left:0}
.tk-note{padding:8px 12px 10px;font-size:14.5px;line-height:1.5;overflow-wrap:anywhere;color:#FDE68A}.tk-note .t{color:#CDB76E}.tk-note .txt,.tk-bb .txt{white-space:pre-line}
.tk-nw+.tk-nw>.tk-band{border-top:1px solid rgba(146,104,0,.35)}
.tk-nw.nx>.tk-note{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:10px;border-top:1px dashed rgba(242,193,78,.25)}.tk-nw.nx .mt{display:flex;align-items:center;gap:8px;padding-top:2px}.tk-nw.nx .tk-msg-del{margin:-3px 0}
.tk-nw:hover .tk-msg-del{opacity:1}
.tk-note .del-tag,.tk-bb .del-tag{display:block;font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:#FCA5A5;margin-top:4px}
.tk-nw.deleted{opacity:.6}.tk-nw.deleted .txt{text-decoration:line-through;color:#C9BC8F}.tk-note .del-tag{color:#FCA5A5}
.tk-note img{display:block;max-width:220px;max-height:160px;border-radius:8px;margin-top:6px;cursor:zoom-in;border:1px solid rgba(255,255,255,.1)}
.ad-msgs .tk-msg.bd{flex:none;padding:0;overflow:hidden}.tk-bb{padding:8px 13px 10px}
.tk-msg img{display:block;max-width:100%;max-height:220px;border-radius:8px;margin-top:6px;cursor:zoom-in}
.tk-att-missing{height:56px;border-radius:8px;margin-top:6px;border:1px dashed var(--line-2);display:flex;align-items:center;justify-content:center;font-size:11px;color:var(--ink-3);padding:0 10px;text-align:center}
.tk-sys{align-self:center;font-size:12px;color:var(--ink-3);text-align:center;line-height:1.5;padding:2px 10px}
.tk-prop{align-self:flex-start;max-width:92%;border:1px solid rgba(46,212,122,.4);background:rgba(46,212,122,.08);border-radius:14px;padding:10px 12px;font-size:14px}
.tk-prop.sent{align-self:flex-end;border-style:dashed}
.tk-prop.declined{border-color:var(--line-2);border-style:solid;background:transparent;opacity:.75}
.tk-prop .k{color:#6EE7B7}
.tk-prop.declined .k{color:var(--ink-3)}
.tk-prop .note{margin-top:6px;color:var(--ink-1)}
.tk-prop .d{display:flex;justify-content:space-between;gap:12px;margin-top:6px;color:var(--ink)}
.tk-prop .d s{color:var(--ink-2)}
.tk-prop .btns{display:flex;gap:8px;margin-top:10px}
.tk-prop .btns .tk-btn{flex:1}
.tk-compose{display:flex;gap:8px;align-items:flex-end;padding:6px;border:1px solid var(--line-2);border-radius:14px;background:rgba(10,15,24,.6)}
.tk-compose textarea{flex:1;min-width:0;min-height:36px;max-height:160px;border:0;background:transparent;color:var(--ink);font:inherit;font-size:15px;line-height:1.4;padding:8px 6px;resize:none}
.tk-compose textarea:focus{outline:none}
.tk-icon{width:36px;height:36px;border-radius:10px;border:1px solid var(--line-2);background:transparent;color:var(--ink-1);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;flex:none}
.tk-send{width:36px;height:36px;border-radius:10px;border:0;background:var(--blue);color:#0A0F18;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;flex:none}
.tk-send:disabled{opacity:.35;cursor:default}
.tk-empty{padding:36px 20px;text-align:center;color:var(--ink-3);font-size:14px}
.tk-err{border:1px solid rgba(255,77,109,.4);background:rgba(255,77,109,.08);color:#FECDD3;border-radius:12px;padding:10px 12px;font-size:14px}
.tk-split{max-width:1040px;margin:0 auto;padding:20px 16px 60px;display:grid;grid-template-columns:340px minmax(0,1fr);gap:16px;align-items:start}
.tk-split .tk-main{padding:0;max-width:none}
.tk-side{position:sticky;top:76px}
.tk-list{padding:0;overflow:hidden}
.tk-list .tk-row{padding:12px 14px}
.tk-list a.tk-row:hover{background:rgba(255,255,255,.02)}
.tk-list a.tk-row.on{background:rgba(91,168,255,.08)}
.tk-lb{position:fixed;inset:0;z-index:100;background:rgba(0,0,0,.88);display:flex;align-items:center;justify-content:center;padding:30px;cursor:zoom-out}
.tk-lb img{max-width:100%;max-height:100%;border-radius:8px}
@media (max-width:899px){.tk-split{display:block;padding:16px 14px 60px;max-width:760px}.tk-side{position:static;margin-bottom:14px}.tk-hide-m{display:none!important}.tk-top{padding:10px 14px}.tk-msg{max-width:92%}}
@media (min-width:900px){.tk-hide-d{display:none!important}}
/* ---- admin ---- */
.ad-app{min-height:100vh;display:grid;grid-template-rows:52px minmax(0,1fr);background:var(--bg);color:var(--ink);font-family:"Geist","Geist Fallback",ui-sans-serif,system-ui,sans-serif}
.ad-top{grid-area:top}.ad-body{grid-area:body}
.ad-top{display:flex;align-items:center;gap:14px;padding:0 16px;border-bottom:1px solid var(--line);background:rgba(10,15,24,.8)}
.ad-top h1{margin:0;font-size:17px;font-weight:600;line-height:1.1}
.ad-top .sub{font-size:12.5px;color:var(--ink-3);margin-top:2px}
.ad-top .me{margin-left:auto;font-size:13px;color:var(--ink-2);display:flex;align-items:center;gap:8px}
.ad-top .me i{width:26px;height:26px;border-radius:50%;background:var(--bg-3);display:inline-flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;color:var(--ink);font-style:normal}
.ad-top .tk-mode{margin-left:0}
.ad-body{display:grid;grid-template-columns:clamp(280px,20vw,340px) minmax(0,1fr);height:calc(100vh - 52px);min-height:0;position:relative}
/* Sidopanelen är syskon till huvud + body och går från toppen till botten (André 23/9). */
.ad-app{grid-template-columns:minmax(0,1fr) clamp(340px,27vw,480px);grid-template-areas:"top side" "body side"}
.ad-app>.ad-side{grid-area:side;height:100vh;height:100dvh}
.ad-list{border-right:1px solid var(--line);display:flex;flex-direction:column;min-height:0;height:100%}
.ad-open{display:flex;gap:6px;padding:10px 10px 0}.ad-open .tk-in{flex:1;min-width:0;text-transform:uppercase;font-family:"Geist Mono",monospace;font-size:13px}.ad-open .tk-in::placeholder{text-transform:none;font-family:inherit}.ad-open .tk-btn{white-space:nowrap}
.ad-filt{display:flex;gap:4px;padding:10px;border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none}.ad-filt::-webkit-scrollbar{display:none}
.ad-filt button{flex:1 0 auto;font:inherit;font-size:12.5px;font-weight:600;padding:6px;border-radius:8px;color:var(--ink-2);background:transparent;border:0;cursor:pointer;white-space:nowrap}
.ad-filt button.on{background:rgba(91,168,255,.12);color:#E0F2FE}
.ad-filt em{font-style:normal;font-size:11px;margin-left:4px;color:var(--ink-3)}
.ad-scroll{overflow-y:auto;min-height:0;flex:1}
.ad-tk{display:flex;flex-direction:column;gap:3px;padding:10px 12px;border-bottom:1px solid var(--line);cursor:pointer;text-decoration:none;color:inherit}
.ad-tk:hover{background:rgba(255,255,255,.02)}
.ad-tk.on{background:rgba(91,168,255,.08)}
.ad-tk .h{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.ad-tk .age{font-size:12px;color:var(--ink-3);white-space:nowrap}
.ad-tk .s{font-size:13.5px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ad-tk .m{display:flex;gap:6px;align-items:center;font-size:12px;color:var(--ink-2);flex-wrap:wrap}
.ad-main{display:flex;flex-direction:column;min-height:0;min-width:0;height:100%}
.ad-head{display:flex;align-items:center;gap:8px;padding:10px 16px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.ad-head .code{font-size:22px}
.ad-head .t{flex:1;min-width:0}
.ad-acts{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
/* v740 (André 28/9, skärmbild 7UK-1: "Det blir dubbelt. Ta bara 1-3 första raderna och utan mellanslag"): ämnet i huvudet högst tre rader, radbrytningar och tomrader blir mellanslag. Hela texten står i första meddelandet. */
.ad-head .t b{font-size:15px;line-height:1.35;text-wrap:pretty;overflow-wrap:anywhere;white-space:normal;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3}
.ad-head .t small{font-size:12.5px;color:var(--ink-3)}
/* v709 (André 27/9): ärendehuvudet i två rader. Överst taggar och åtgärder (Föranalys klar, Hanteras av …, Flytta, Tagga, Avsluta) med hela bredden; under ärendenummer, ämne och tider. */
.ad-head.ad-tkh{flex-direction:column;align-items:stretch;flex-wrap:nowrap;gap:8px}
.ad-tkh-top{display:flex;align-items:center;gap:8px;min-width:0}.ad-tkh-top .ad-acts{flex:1 1 0;min-width:0}.ad-tkh-top .ad-side-btn{margin-left:auto}
.ad-tkh-id{display:flex;align-items:center;gap:12px;min-width:0}
.ad-msgs{flex:1;overflow-y:auto;padding:14px 16px;display:flex;flex-direction:column;gap:8px;min-height:0}
.ad-msgs .tk-msg.me{align-self:flex-start;background:var(--bg-2);border:1px solid var(--line-2);color:var(--ink);border-radius:14px 14px 14px 4px}
.ad-msgs .tk-msg.them{align-self:flex-end;background:rgba(91,168,255,.15);border:1px solid rgba(91,168,255,.3);color:#E0F2FE;border-radius:14px 14px 4px 14px}
.ad-comp{display:flex;flex-direction:column;gap:8px;padding:10px 16px;border-top:1px solid var(--line)}
.ad-mode{display:inline-flex;border:1px solid var(--line-2);border-radius:8px;overflow:hidden;align-self:flex-start}
.ad-mode button{font:inherit;font-size:12.5px;font-weight:600;padding:6px 10px;color:var(--ink-2);background:transparent;border:0;cursor:pointer}
.ad-mode button.on{background:rgba(91,168,255,.15);color:#E0F2FE}
.ad-mode button.int.on{background:rgba(251,191,36,.12);color:#FDE68A}
.ad-mode button.prop.on{background:rgba(46,212,122,.12);color:#A7F3D0}
.ad-draft{display:flex;flex-direction:column;gap:8px}
.ad-draft-row{display:grid;grid-template-columns:minmax(0,1fr) 150px 36px;gap:8px;align-items:center}
.ad-draft-row .l{font-size:13.5px;color:var(--ink);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ad-draft-row .l small{display:block;font-size:12px;color:var(--ink-3)}
.ad-pick{position:relative}
.ad-pick-panel{position:absolute;left:auto;right:0;width:min(100%,760px);bottom:calc(100% + 6px);max-height:min(60vh,560px);--fs:clamp(13.5px,0.5vw + 9px,16px);overflow-y:auto;background:var(--bg-2);border:1px solid var(--line-2);border-radius:12px;padding:6px;box-shadow:var(--shadow-card);z-index:30}
.ad-pick-g{font-size:calc(var(--fs) - 2px);font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);padding:10px 10px 4px}
.ad-pick-panel button{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 16px;width:100%;font-family:inherit;font-size:var(--fs);padding:8px 10px;border:0;border-radius:8px;background:none;color:var(--ink);cursor:pointer;text-align:left;align-items:start}
.ad-pick-panel button small{display:block;font-size:calc(var(--fs) - 1px);line-height:1.45;color:var(--ink-2);margin-top:2px;font-family:"Geist","Geist Fallback",system-ui,sans-serif;white-space:normal}
.ad-pick-panel button .v{text-align:right}.ad-pick-panel button .v b{font-weight:600;font-size:calc(var(--fs) + 1px)}
.ad-pick-panel button:hover:not(:disabled){background:rgba(91,168,255,.1)}
.ad-pick-panel button .l{min-width:0}
.ad-pick-panel button .v{color:var(--ink);white-space:nowrap}
.ad-pick-panel button:disabled{color:var(--ink-3);cursor:default}
.ad-pick-panel button:disabled .v{color:#6EE7B7}
.ad-n{font-style:normal;margin-left:6px;font-size:10px;padding:1px 6px;border-radius:999px;background:rgba(46,212,122,.25);color:#A7F3D0}
.ad-tools{display:flex;gap:6px;margin-top:8px}
.ad-tools .tk-in{flex:1;height:32px;font-size:13px}
.ad-tools .tk-chip{font-size:12px;padding:0 10px;height:32px}
.ad-grp{margin-top:6px}
.ad-grp{margin-top:10px;padding-top:6px;border-top:1px solid var(--line)}
.ad-grp:first-of-type{border-top:0}
.ad-grp-h{display:flex;align-items:center;gap:6px;width:100%;font-size:12.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#BAE0FF;padding:7px 10px 6px;margin:0 -10px 2px;border-radius:7px;background:rgba(91,168,255,.1);border-left:3px solid var(--blue);cursor:pointer;user-select:none}.ad-grp-h>svg{transform:rotate(90deg);transition:transform .15s;flex:none;opacity:.8}.ad-grp.shut .ad-grp-h>svg{transform:rotate(0)}.ad-grp-h:hover{background:rgba(91,168,255,.16)}
.ad-more{display:flex;align-items:center;gap:4px;font-family:inherit;font-size:12.5px;font-weight:600;color:var(--blue);background:none;border:0;padding:6px 0 2px;cursor:pointer}
.ad-more svg{transform:rotate(90deg)}
.ad-more:hover{text-decoration:underline}
.ad-grp-h em{font-style:normal;font-weight:400;letter-spacing:0;text-transform:none;color:var(--ink-3);margin-left:auto}
.kv.set{position:relative;align-items:center;transition:padding-right .12s}.kv.set:not(.hm):hover,.kv.set.indraft{padding-right:64px}
.kv.set .l .lbl{display:inline}
.ad-help{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;margin-left:6px;border-radius:50%;border:1px solid var(--line-2);background:transparent;color:var(--ink-3);font:600 10px/1 "Geist",system-ui,sans-serif;cursor:pointer;vertical-align:1px;padding:0}
.ad-help:hover{border-color:var(--blue);color:var(--blue)}
.kv.set .v{font-size:calc(var(--fs) - .5px);flex:none}
.kv.set .l{min-width:0}
.kv.set .l .help{display:block;font-size:calc(var(--fs) - 1.5px);line-height:1.45;color:var(--ink-1);margin-top:6px;padding:6px 10px;border-radius:8px;background:rgba(91,168,255,.08);border:1px solid rgba(91,168,255,.25)}
.kv.indraft{background:rgba(46,212,122,.06)}
.ad-prop-btn{position:absolute;right:0;top:50%;transform:translateY(-50%);font:inherit;font-size:11.5px;font-weight:600;padding:4px 8px;border-radius:7px;border:1px solid var(--line-2);background:transparent;color:var(--ink-2);cursor:pointer;opacity:0;transition:opacity .12s}
.kv.set:hover .ad-prop-btn,.kv.indraft .ad-prop-btn,.ad-prop-btn:focus{opacity:1}
.kv.indraft .ad-prop-btn{border-color:rgba(46,212,122,.5);color:#A7F3D0}
.ad-prop-btn:hover:not(:disabled){border-color:rgba(46,212,122,.5);color:#A7F3D0}
.ad-prop-btn:disabled{cursor:default}
@media (hover:none){.ad-prop-btn{opacity:1}}
.ad-side{border-left:1px solid var(--line);overflow-y:auto;min-height:0;height:100%;display:flex;flex-direction:column;container-type:inline-size;--fs:13.5px}
@container (min-width:380px){.ad-side{--fs:14.5px}}
.ad-side .kv{font-size:var(--fs)}
.ad-sec{padding:12px 14px;border-bottom:1px solid var(--line)}
.ad-sec .tk-k{display:flex;justify-content:space-between;align-items:center;gap:8px}
.ad-sec .tk-k button{font-family:inherit;font-size:12.5px;font-weight:600;color:#BAE0FF;background:rgba(91,168,255,.1);border:1px solid rgba(91,168,255,.4);border-radius:8px;cursor:pointer;letter-spacing:0;text-transform:none;padding:4px 10px}
.ad-sec .tk-k button:hover{background:rgba(91,168,255,.18)}
.kv{display:flex;justify-content:space-between;gap:8px;font-size:13.5px;padding:6px 0;border-top:1px solid var(--line)}
.kv:first-of-type{border-top:0}
.kv .l{color:var(--ink-2)}.kv .v{color:var(--ink);text-align:right}
.kv.dev .v{color:#FBBF24}
.kv.dev .fleet{color:var(--ink-1)}
.ad-grp .kv{padding:7px 0}
.kv .fleet{font-size:calc(var(--fs, 12.5px) - 1.5px);color:var(--ink-3);display:inline;margin-left:8px;white-space:nowrap}.kv.set .v{max-width:60%;text-wrap:balance}
.ad-log{font-size:12.5px;color:var(--ink-3);line-height:1.55}
.ad-log b{color:var(--ink-2);font-weight:500;font-family:"Geist Mono",monospace}
.tk-in,.tk-sel{height:36px;border:1px solid var(--line-2);border-radius:10px;background:rgba(10,15,24,.6);color:var(--ink);font:inherit;font-size:14px;padding:0 10px;min-width:0}
.ad-menu{position:absolute;right:0;z-index:20;margin-top:6px;min-width:230px;background:var(--bg-2);border:1px solid var(--line-2);border-radius:12px;padding:6px;box-shadow:var(--shadow-card)}
.ad-menu button{display:flex;justify-content:space-between;gap:10px;width:100%;font:inherit;font-size:13.5px;padding:8px 10px;border:0;border-radius:8px;background:none;color:var(--ink);cursor:pointer;text-align:left}
.ad-menu button:hover{background:rgba(255,255,255,.05)}
.ad-menu .hint{font-size:12px;color:var(--ink-3);padding:6px 10px 4px;line-height:1.45}
.ad-denied{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px;background:var(--bg);color:var(--ink);font-family:"Geist","Geist Fallback",system-ui,sans-serif}
.ad-side-btn,.ad-side-close{display:none}
@media (max-width:1099px){.ad-app{grid-template-columns:minmax(0,1fr);grid-template-areas:"top" "body"}.ad-app>.ad-side{height:auto}.ad-body{grid-template-columns:260px minmax(0,1fr)}.ad-side{position:fixed;right:0;top:52px;bottom:0;width:min(340px,100vw);background:var(--bg);transform:translateX(100%);transition:transform .2s;z-index:40;box-shadow:var(--shadow-card)}.ad-side.open{transform:none}.ad-side-btn{display:inline-flex}.ad-side-close{display:flex}.ad-acts{flex:1 1 100%}}
@media (max-width:719px){.ad-body{grid-template-columns:minmax(0,1fr)}.ad-list.hide,.ad-main.hide{display:none}.ad-draft-row{grid-template-columns:minmax(0,1fr) 110px 36px}.ad-head{padding:10px 12px}.ad-msgs,.ad-comp{padding-left:12px;padding-right:12px}}

/* Homey-mätvärden i sidopanelen */
.kv.hm{width:100%;font-family:inherit;font-size:12.5px;background:none;border:0;border-top:1px solid var(--line);cursor:pointer;padding-right:0;text-align:left}
.kv.hm:first-of-type{border-top:0}
.kv.hm{margin:0 -6px;padding-left:6px;padding-right:6px;border-radius:6px;transition:background .1s}
.kv.hm:hover{background:rgba(157,123,255,.22)}
.kv.hm:hover .l{color:#fff}
.kv.hm.on{background:color-mix(in srgb,var(--sel,var(--violet)) 22%,transparent);box-shadow:inset 3px 0 0 var(--sel,var(--violet))}
.kv.hm.on .l{color:#fff;font-weight:600}.kv.hm.on .v{font-weight:700}
.kv.hm.on+.kv.hm,.kv.hm:hover+.kv.hm{border-top-color:transparent}
.ad-range{display:flex;gap:6px;margin-top:8px}
.ad-range button{flex:1;font-family:inherit;font-size:13px;font-weight:600;padding:7px 0;border-radius:9px;border:1px solid var(--line-2);background:transparent;color:var(--ink-1);cursor:pointer;letter-spacing:0;text-transform:none;white-space:nowrap}
.ad-range button:hover{background:rgba(255,255,255,.04)}
.ad-range button.on{background:rgba(91,168,255,.18);border-color:rgba(91,168,255,.6);color:#fff}
.ad-spark{display:block;width:100%;height:72px;cursor:crosshair;touch-action:none;margin-top:8px;border:1px solid var(--line);border-radius:8px;background:rgba(10,15,24,.5)}
.ad-range-lbl{display:flex;justify-content:space-between;gap:8px;font-size:11.5px;color:var(--ink-3);margin-top:4px;font-family:"Geist Mono",monospace}
.ad-samples-wrap{position:relative;margin-top:8px;border:1px solid var(--line);border-radius:8px;overflow:hidden}
.ad-samples-band{position:absolute;left:0;right:0;top:0;height:29px;background:rgba(91,168,255,.18);pointer-events:none;z-index:0}
.ad-samples{position:relative;max-height:150px;overflow-y:auto;padding:0 8px;z-index:1}
.ad-samples .kv{font-size:12.5px;padding:5px 6px;margin:0 -6px;border-radius:6px;cursor:pointer;scroll-margin-top:0}
.ad-samples .kv.on{border-top-color:transparent}
.ad-samples .kv .l{color:var(--ink-1)}
.ad-samples .kv.on+.kv{border-top-color:transparent}
.ad-cur{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:10px;margin-top:6px;padding:6px 10px;border-radius:8px;background:rgba(91,168,255,.12);border:1px solid rgba(91,168,255,.4);font-size:13px;color:#E0F2FE}
.ad-cur b{font-size:15px;color:#fff;text-align:right;white-space:nowrap}
.ad-cur>span{white-space:nowrap}
.ad-cur{min-height:40px}.ad-cur .tk-btn{height:28px;padding:0 10px;font-size:12px}

/* Skala hela adminvyn med skärmen (André 23/9: "nästan all text är för liten"). */
/* Ingen zoom på skalet: zoom bryter 100vh-höjden så skrivfältet hamnar under kanten. Typen skalas via --fs och rem-lösa steg i stället. */
.ad-app{height:100vh;height:100dvh;overflow:hidden}
.ad-body{height:auto;min-height:0}
@media (min-width:1500px){.ad-side{--fs:14px}.ad-msgs .tk-msg{font-size:15px}.ad-tk .s{font-size:14px}.kv{font-size:14px}}
@media (min-width:1800px){.ad-side{--fs:14.5px}.ad-msgs .tk-msg{font-size:15.5px}.ad-tk .s{font-size:14.5px}.ad-tk .m,.ad-tk .age{font-size:12.5px}.kv{font-size:14.5px}.ad-head .t b{font-size:16px}.ad-head .t small{font-size:13px}.ad-top h1{font-size:18px}}
@media (min-width:2200px){.ad-side{--fs:15px}.ad-msgs .tk-msg{font-size:16px}.ad-tk .s{font-size:15px}.kv{font-size:15px}}
@media (min-width:1300px){.tk-app{zoom:1.06}}
@media (min-width:1700px){.tk-app{zoom:1.14}}

/* Beslut per dag */
.ad-date{display:flex;gap:6px;align-items:center;margin-top:8px}
.ad-date .tk-in{flex:1;min-width:0;color-scheme:dark}
.ad-date .tk-icon:first-child svg{transform:rotate(180deg)}
.ad-strip{display:grid;grid-template-columns:repeat(96,1fr);gap:1px;height:26px;cursor:crosshair;touch-action:none;user-select:none;margin-top:10px;border-radius:6px;overflow:hidden;border:1px solid var(--line)}
.ad-strip button{border:0;padding:0;cursor:inherit;min-width:0;pointer-events:none}
.ad-strip button.on{outline:2px solid #fff;outline-offset:-2px;z-index:1}
.ad-qsel{margin-top:8px;padding:8px 10px;border:1px solid var(--line-2);border-radius:8px;font-size:12.5px;color:var(--ink-1)}
.ad-qsel div{display:flex;flex-wrap:wrap;gap:10px;margin-top:4px}
.ad-qsel i,.ad-dot{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:5px;vertical-align:-1px;flex:none}
.ad-runs{max-height:174px;overflow-y:auto;margin-top:8px;border:1px solid var(--line);border-radius:8px;padding:0 8px}
.ad-runs .kv{font-size:12.5px;padding:5px 0}
.ad-runs .kv .l{color:var(--ink-2)}
/* Prognos-popup */
.ad-pop{position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.7);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;padding:24px}
.ad-pop-box{width:min(1100px,96vw);height:min(92vh,980px);background:#0a0f1a;border:1px solid var(--line-2);border-radius:16px;overflow:hidden;display:flex;flex-direction:column;box-shadow:var(--shadow-card)}
.ad-pop-h{display:flex;align-items:center;gap:12px;padding:10px 14px;border-bottom:1px solid var(--line);font-size:14px}
.ad-pop-h .tk-hint{flex:1}
.ad-pop-box iframe{flex:1;border:0;width:100%;background:#0a0f1a}
@media (max-width:719px){.ad-pop{padding:0}.ad-pop-box{width:100vw;height:100vh;border-radius:0}}
.ad-tip{margin-top:6px;font-size:13px;color:#FDE68A;background:rgba(251,191,36,.08);border:1px solid rgba(251,191,36,.35);border-radius:8px;padding:6px 10px}
.ad-cursor{margin-left:8px;margin-right:auto;font-size:12px;font-weight:600;letter-spacing:0;text-transform:none;color:#fff;background:rgba(157,123,255,.32);border-radius:6px;padding:2px 7px}
.ad-runs .kv{cursor:pointer;border-radius:6px;margin:0 -6px;padding-left:6px;padding-right:6px}
.ad-runs .kv.on{background:rgba(157,123,255,.32);box-shadow:inset 3px 0 0 var(--violet)}
.ad-runs .kv.on .l,.ad-runs .kv.on .v{color:#fff}
.ad-strip button.on{outline:2px solid #fff;outline-offset:-2px;z-index:1;box-shadow:0 0 0 2px var(--violet)}

/* Sidopanelen i två kolumner när skärmen är bred nog (André 23/9): kund + inställningar + logg till vänster, Homey + beslut till höger. */
.ad-cols{display:flex;flex-direction:column;min-height:0;flex:1}
.ad-col{display:flex;flex-direction:column;min-width:0}
.ad-sec-settings{flex:none}
@media (min-width:1400px){
  /* Sidopanelen går ända upp: huvudet spänner bara över lista + tråd, panelens två kolumner börjar vid toppen (André 23/9). */
  .ad-app{grid-template-columns:minmax(0,1fr) 46vw}
  .ad-body{grid-template-columns:clamp(260px,17vw,320px) minmax(420px,1fr)}
  .ad-side{overflow:hidden}
  .ad-cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:stretch;min-height:0;flex:1}
  .ad-col{border-left:1px solid var(--line);overflow-y:auto;min-height:0;height:100%}
  .ad-col:first-child{border-left:0}
  .ad-side{--fs:14px}
}
@media (min-width:1800px){.ad-side{--fs:14.5px}}
@media (min-width:2200px){.ad-side{--fs:15px}}
@media (min-width:1400px){.ad-samples{max-height:150px}.ad-runs{max-height:174px}.ad-spark{height:56px}.ad-cur{margin-top:4px;padding:4px 10px;min-height:38px}.ad-cur b{font-size:14px}}
.live-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--c-sell);margin:0 5px 0 2px;vertical-align:1px;animation:tkPing 1.2s ease-out 1}
@keyframes tkPing{0%{background:var(--blue);box-shadow:0 0 0 0 rgba(91,168,255,.7)}60%{box-shadow:0 0 0 6px rgba(91,168,255,0)}100%{background:var(--c-sell);box-shadow:0 0 0 0 rgba(91,168,255,0)}}
.ad-cur-vals{display:inline-flex;flex-wrap:wrap;gap:4px 12px;justify-content:flex-end}
.ad-samples .kv{align-items:flex-start}
.ad-cur .ad-cur-vals{text-align:right}
/* Adminchatt längst ner i listkolumnen */
.ad-chat{border-top:1px solid var(--line);display:flex;flex-direction:column;max-height:42%;min-height:0;flex:none;background:rgba(157,123,255,.04)}
.ad-chat.closed{max-height:none}
.ad-chat-h{display:flex;align-items:center;gap:6px;width:100%;font-family:inherit;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-1);background:none;border:0;padding:10px 12px 6px;cursor:pointer;text-align:left}
.ad-chat-h svg{transform:rotate(90deg);transition:transform .15s}
.ad-chat.closed .ad-chat-h svg{transform:none}
.ad-chat-h em{font-style:normal;font-weight:400;letter-spacing:0;text-transform:none;color:var(--ink-3);margin-left:auto;font-size:11.5px}
.ad-chat-msgs{flex:1;overflow-y:auto;min-height:0;padding:4px 12px 8px;display:flex;flex-direction:column;gap:6px}
.ad-chat-m{font-size:13px;line-height:1.45;color:var(--ink);padding:6px 10px;border-radius:10px;background:var(--bg-2);border:1px solid var(--line);align-self:flex-start;max-width:94%;overflow-wrap:anywhere}
.ad-chat-m.me{align-self:flex-end;background:rgba(157,123,255,.14);border-color:rgba(157,123,255,.35)}
.ad-chat-m .who{font-size:10.5px;color:var(--ink-3);margin-bottom:2px;letter-spacing:.04em;text-transform:uppercase}
.ad-chat-m a{color:#BAE0FF}
.ad-chat .tk-compose{margin:0 10px 10px;padding:4px}
.ad-chat .tk-compose textarea{font-size:13px;min-height:30px}
.ad-chat .tk-send{width:30px;height:30px}
.ad-chat-row{display:flex;align-items:center;gap:10px;padding:12px;border-top:1px solid var(--line);text-decoration:none;color:inherit;flex:none;background:rgba(157,123,255,.05)}
.ad-chat-row:hover{background:rgba(157,123,255,.1)}
.ad-chat-row.on{background:rgba(157,123,255,.18)}
.ad-chat-row b{display:block;font-size:13.5px}
.ad-chat-row small{display:block;font-size:12px;color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* v714 (André 27/9: "Större tydlig siffra med hur många olästa man har"): fylld räknare, syns bara när något är oläst. */
.ad-chat-row em{font-style:normal;font-size:11px;color:var(--ink-2);border:1px solid var(--line-2);border-radius:999px;padding:2px 7px}
.ad-chat-row:not(.ad-news-row) em{flex:none;font-size:14px;font-weight:700;line-height:24px;min-width:28px;height:24px;padding:0 8px;box-sizing:border-box;text-align:center;color:#fff;background:#6D4FE0;border:0;border-radius:999px;font-variant-numeric:tabular-nums}
.ad-msgs .tk-msg.them{background:rgba(157,123,255,.14);border-color:rgba(157,123,255,.35);color:var(--ink)}
.ad-ping-h{margin-top:10px;display:flex;align-items:center;gap:8px;justify-content:flex-start;height:30px}
.ad-ping-h button{height:26px;padding:0 10px;line-height:1;box-sizing:border-box}
.ad-ping-h .sp{flex:1}
.ad-sec .tk-k button.lnk{background:none;border:0;padding:0;color:var(--ink-3);font-weight:600;font-size:11.5px;letter-spacing:.06em;text-transform:uppercase}
.ad-sec .tk-k button.lnk:hover{color:#BAE0FF;background:none}
.ad-qsel{min-height:58px}
.ad-runs>.kv:first-child,.ad-samples>.kv:first-child,.ad-runs>*:first-child+.kv{border-top:0}
.tk-tag.tg{border-style:dashed}
.ad-colors{left:auto;right:0;min-width:220px}.ad-colors .sw{display:grid;gap:2px;padding:4px 6px 6px}.ad-colors .sw button{display:flex;align-items:center;gap:10px;width:100%;font:inherit;font-size:13px;color:var(--ink);background:none;border:0;border-radius:8px;padding:6px 8px;cursor:pointer;text-align:left}.ad-colors .sw button i{width:16px;height:16px;border-radius:50%;flex:none;border:2px solid transparent}.ad-colors .sw button.on i{border-color:#fff}.ad-colors .sw button.on span{font-weight:600}.ad-colors .sw button:hover:not(:disabled){background:rgba(255,255,255,.05)}.ad-colors .sw button:disabled{cursor:default;color:var(--ink-3)}.ad-colors .sw button:disabled i{opacity:.5}
.ad-msgs .tk-msg img{display:block;max-width:220px;max-height:160px;border-radius:8px;margin-top:6px;cursor:zoom-in;border:1px solid rgba(255,255,255,.1)}

/* @-lista i skrivfältet (adminchatt). Öppnas ovanför fältet. */
.tk-compose{position:relative}
.tk-mention{position:absolute;left:44px;bottom:calc(100% + 6px);min-width:200px;background:#0f172a;border:1px solid var(--line-2);border-radius:10px;padding:4px;box-shadow:0 12px 30px rgba(0,0,0,.5);z-index:20;display:flex;flex-direction:column}
.tk-mention button{display:flex;align-items:center;gap:8px;font:inherit;font-size:13.5px;color:var(--ink);background:transparent;border:0;border-radius:7px;padding:7px 10px;text-align:left;cursor:pointer}
.tk-mention button.on,.tk-mention button:hover{background:rgba(157,123,255,.18)}
.tk-mention .ad-dot{width:8px;height:8px;border-radius:50%;flex:none}
.tk-at{color:#C4B5FD;font-weight:600}
.tk-msg.mentioned{outline:1px solid rgba(196,181,253,.6);outline-offset:1px}
.ad-chat-row .at{font-size:11px;font-weight:700;color:#C4B5FD;border:1px solid rgba(196,181,253,.5);border-radius:999px;padding:1px 7px;margin-left:6px}

/* Kanalflikar över adminchattens tråd */
.ad-chans{display:flex;gap:6px;flex-wrap:wrap;padding:8px 16px;border-bottom:1px solid var(--line);background:rgba(10,15,24,.5)}
.ad-ch{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;border:1px solid var(--line-2);text-decoration:none;color:var(--ink-1);font-size:13px;background:rgba(255,255,255,.02)}
.ad-ch:hover{color:var(--ink);border-color:rgba(157,123,255,.5)}
.ad-ch.on{background:rgba(157,123,255,.16);border-color:rgba(157,123,255,.6);color:var(--ink)}
.ad-ch .ad-dot{width:8px;height:8px;border-radius:50%;flex:none}
.ad-ch b{font-weight:600}
.ad-ch em{font-style:normal;font-size:13px;font-weight:700;line-height:20px;color:#fff;background:#6D4FE0;border-radius:999px;padding:0 7px;min-width:22px;box-sizing:border-box;text-align:center;font-variant-numeric:tabular-nums}
.ad-ch .at{font-size:11px;font-weight:700;color:#C4B5FD;border:1px solid rgba(196,181,253,.5);border-radius:999px;padding:0 6px}
.tk-mention .hd{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);padding:6px 10px 2px}
.tk-mention button small{color:var(--ink-3);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:260px}

/* Föranalys (v544). Cyan skiljer den från Internt (amber) och Förslag (grön). */
.tk-occ{display:grid;gap:6px;margin-top:14px}.tk-occ .tk-in{color-scheme:dark;max-width:260px}
.tk-tag.an{border-color:rgba(34,211,238,.5);color:#A5F3FC;background:rgba(34,211,238,.1)}
.tk-tag.an-wait{border-style:dashed;border-color:rgba(34,211,238,.45);color:#A5F3FC}
.ad-mode{flex-wrap:wrap}.ad-mode button.an.on{background:rgba(34,211,238,.12);color:#A5F3FC}
.ad-an{display:flex;flex-direction:column;gap:8px}.ad-an-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.ad-an-row .ok{font-size:12.5px;font-weight:600;color:#A5F3FC}.ad-an .bad{color:#FCA5A5;font-size:12.5px}
.ad-msgs{min-height:min(160px,25vh)}
.ad-comp.an-mode{max-height:55%;overflow-y:auto;flex:none}
.ad-an-ta{margin-top:0;min-height:min(170px,10vh);max-height:min(42vh,360px);font-family:"Geist Mono",monospace;font-size:12.5px;resize:vertical}
.tk-an{align-self:stretch;flex:none;border:1px solid rgba(34,211,238,.35);background:rgba(34,211,238,.05);border-radius:12px;overflow:hidden}
.tk-an .hd{display:flex;align-items:center;gap:10px;width:100%;font:inherit;text-align:left;padding:9px 13px;background:transparent;border:0;color:#A5F3FC;cursor:pointer}
.tk-an .hd .k{flex:1;min-width:0;font-size:11px;font-weight:600;letter-spacing:.05em;text-transform:uppercase}
.tk-an .hd .n{font-size:11.5px;color:var(--ink-3);white-space:nowrap}
.tk-an .hd svg{transform:rotate(90deg);transition:transform .15s}.tk-an.open .hd svg{transform:rotate(-90deg)}
.tk-an .pv{padding:0 13px 10px;font-size:13.5px;color:var(--ink-2);line-height:1.5;cursor:pointer;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.tk-an .bd{padding:4px 16px 12px;border-top:1px solid rgba(34,211,238,.2)}
.tk-an .cc{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:8px;font-size:12px;color:var(--ink-3)}
.tk-an .cc button{font:inherit;font-size:12px;color:#A5F3FC;background:none;border:0;padding:0;cursor:pointer;text-decoration:underline}
.tk-an .ft{display:flex;align-items:center;gap:10px;padding:7px 13px;border-top:1px solid rgba(34,211,238,.15);font-size:11.5px;color:var(--ink-3)}
.tk-an .ft button{margin-left:auto;font:inherit;font-size:11px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:#FCA5A5;background:transparent;border:0;cursor:pointer}
.tk-an .del-tag{padding:0 13px 6px;font-size:11px;color:#FCA5A5}.tk-an.deleted{opacity:.6;border-style:dashed}
.tk-md{font-size:14px;line-height:1.55;color:var(--ink);overflow-wrap:anywhere}
.tk-md h3{font-size:16px;margin:14px 0 6px}.tk-md h4{font-size:14.5px;margin:14px 0 4px;color:#A5F3FC}.tk-md h5{font-size:12px;margin:12px 0 4px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-2)}
.tk-md p{margin:6px 0;text-wrap:pretty}.tk-md ul,.tk-md ol{margin:6px 0;padding-left:20px}.tk-md li{margin:2px 0}
.tk-md code{font-family:"Geist Mono",monospace;font-size:.9em;background:rgba(255,255,255,.06);padding:1px 5px;border-radius:4px}
.tk-md pre{background:rgba(0,0,0,.3);padding:10px;border-radius:8px;overflow:auto;font-family:"Geist Mono",monospace;font-size:12.5px}
.tk-md blockquote{margin:6px 0;padding-left:10px;border-left:2px solid var(--line-2);color:var(--ink-2)}
.tk-md hr{border:0;border-top:1px solid var(--line);margin:12px 0}
.tk-md-tbl{overflow-x:auto;margin:8px 0}.tk-md table{border-collapse:collapse;font-size:13px;font-variant-numeric:tabular-nums}
.tk-md th,.tk-md td{padding:5px 12px 5px 0;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap}.tk-md th{font-size:11.5px;color:var(--ink-3);font-weight:600}

.ad-ask{position:fixed;inset:0;z-index:250;background:rgba(0,0,0,.6);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;padding:20px}
.ad-ask-box{width:min(440px,100%);background:#0f1522;border:1px solid var(--line-2);border-radius:14px;padding:18px 18px 14px;box-shadow:var(--shadow-card);display:flex;flex-direction:column;gap:8px}
.ad-ask-h{font-size:16px;font-weight:700;color:var(--ink)}
.ad-ask-sub{font-size:13px;color:var(--ink-2)}
.ad-ask-pre{max-height:160px;overflow:auto;white-space:pre-wrap;font-size:13px;line-height:1.45;color:var(--ink);background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:10px;padding:10px 12px}
.ad-ask-f{display:flex;justify-content:flex-end;gap:8px;margin-top:6px}

/* Supporten, andra omgången (v616, backend 26/9) */
/* S1 fel eller förslag */
.tk-seg{display:flex;gap:3px;padding:3px;border:1px solid var(--line-2);border-radius:12px;background:rgba(10,15,24,.5)}
.tk-seg button{flex:1;min-width:0;font:inherit;font-size:13.5px;font-weight:600;line-height:1.25;padding:9px 8px;border:0;border-radius:9px;background:transparent;color:var(--ink-2);cursor:pointer}
.tk-seg button.on{background:rgba(91,168,255,.16);color:#E0F2FE;box-shadow:inset 0 0 0 1px rgba(91,168,255,.45)}
/* S3 Har du läst … */
.tk-helpq{display:flex;gap:8px;align-items:flex-start;margin-top:12px;padding:9px 12px;border-radius:10px;background:rgba(91,168,255,.06);border:1px solid rgba(91,168,255,.22);font-size:13px;line-height:1.45;color:var(--ink-1)}
.tk-helpq svg{margin-top:1px;color:#BAE0FF}
.tk-helpq a{color:#BAE0FF;font-weight:600;text-decoration:underline;text-underline-offset:2px}.tk-helpq a:hover{color:#E0F2FE}
/* S2 förslagets status: Mottaget neutral, Planerat blå, Byggt grön, Avböjt grå */
.tk-tags{display:flex;gap:6px;align-items:center;flex:none}
.tk-tag.idea.planerat{border-color:rgba(91,168,255,.5);color:#BAE0FF;background:rgba(91,168,255,.1)}
.tk-tag.idea.byggt{border-color:rgba(46,212,122,.5);color:#A7F3D0;background:rgba(46,212,122,.1)}
.tk-tag.idea.avbojt{color:var(--ink-3)}
/* S6 ålder och väntar */
.tk-tag.new.late{border-color:rgba(255,77,109,.55);color:#FECDD3;background:rgba(255,77,109,.12)}
.tk-tag.cw{border-style:dashed;border-color:rgba(251,191,36,.5);color:#FDE68A}
.ad-tk .age.late{color:#FF8FA3;font-weight:700}
/* S7 nyckeltal: i huvudet från 720 px, som remsa överst i listan på mobil */
.ad-top .sub{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ad-top .sub b,.ad-stats b{color:var(--ink-1);font-weight:600;font-variant-numeric:tabular-nums}
.ad-top .sub .late,.ad-stats .late{color:#FF8FA3}
.ad-stats{display:none;flex:none;padding:8px 12px;border-bottom:1px solid var(--line);font-size:12.5px;line-height:1.5;color:var(--ink-3)}
@media (max-width:719px){.ad-top .sub{display:none}.ad-stats{display:block}}
/* S5 sök och filter */
.ad-search{position:relative;flex:none;padding:8px 10px 0}
.ad-search .tk-in{width:100%;padding-left:34px;padding-right:36px}
.ad-search>svg{position:absolute;left:21px;top:18.5px;color:var(--ink-3);pointer-events:none}
.ad-search .x{position:absolute;right:14px;top:12px;width:28px;height:28px;border:0;border-radius:8px;background:none;color:var(--ink-3);cursor:pointer;display:flex;align-items:center;justify-content:center}
.ad-search .x:hover{color:var(--ink);background:rgba(255,255,255,.05)}
.ad-pills{display:flex;gap:6px;flex:none;padding:8px 10px 0;overflow-x:auto;scrollbar-width:none}
.ad-pills::-webkit-scrollbar{display:none}
.ad-pill{flex:none;height:30px;padding:0 11px;border-radius:999px;border:1px solid var(--line-2);background:transparent;color:var(--ink-2);font:inherit;font-size:12.5px;font-weight:600;white-space:nowrap;cursor:pointer}
.ad-pill:hover{color:var(--ink)}
.ad-pill.on{border-color:var(--blue);background:rgba(91,168,255,.14);color:#E0F2FE}
select.ad-pill{appearance:none;-webkit-appearance:none;padding-right:28px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;background-size:12px}
select.ad-pill.on{background-color:rgba(91,168,255,.14)}
select.ad-pill option{background:#0f172a;color:#e2e8f0}
.tk-empty .ad-more{display:flex}
/* S8 väljare för förslagets status */
.ad-idea-btn{display:inline-flex;align-items:center;gap:5px;padding:6px 10px;font:inherit;font-size:11.5px;font-weight:600;background:transparent;cursor:pointer}
.ad-idea-btn svg{transform:rotate(90deg)}
.ad-idea-btn+.ad-menu{left:0;right:auto}
.ad-menu button:disabled{cursor:default;opacity:.7}.ad-menu button:disabled:hover{background:none}
/* S9 svarsmallar */
.tk-icon.ad-tool{width:auto;padding:0 10px;font:inherit;font-size:13px;font-weight:600}
.tk-icon.ad-tool:disabled{opacity:.45;cursor:default}
.ad-tpl{width:min(560px,100%);max-height:min(82vh,720px);max-height:min(82dvh,720px);display:flex;flex-direction:column;overflow:hidden;background:#0f1522;border:1px solid var(--line-2);border-radius:14px;box-shadow:var(--shadow-card)}
.ad-tpl-h{display:flex;align-items:center;gap:10px;padding:12px 12px 10px 16px}
.ad-tpl-h b{font-size:16px;color:var(--ink)}
.ad-tpl-h small{flex:1;min-width:0;font-size:12.5px;color:var(--ink-3)}
.ad-tpl-q{padding:0 16px 10px}.ad-tpl-q .tk-in{width:100%}
.ad-tpl-list{flex:1;min-height:0;overflow-y:auto;border-top:1px solid var(--line)}
.ad-tpl-row{display:flex;align-items:stretch;border-bottom:1px solid var(--line)}
.ad-tpl-row .pick{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px;padding:10px 16px;text-align:left;font:inherit;color:var(--ink);background:none;border:0;cursor:pointer}
.ad-tpl-row .pick:hover{background:rgba(91,168,255,.08)}
.ad-tpl-row .pick b{font-size:14px;font-weight:600}
.ad-tpl-row .pick span{font-size:13px;line-height:1.45;color:var(--ink-2);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ad-tpl-row .pick small{font-size:11.5px;color:var(--ink-3)}
.ad-tpl-row .ed{flex:none;min-width:64px;padding:0 14px;font:inherit;font-size:12.5px;font-weight:600;color:#BAE0FF;background:none;border:0;border-left:1px solid var(--line);cursor:pointer}
.ad-tpl-row .ed:hover{background:rgba(91,168,255,.08)}
.ad-tpl-f{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:12px 16px;border-top:1px solid var(--line)}
.ad-tpl-f .sp{flex:1}
.ad-tpl-e{display:flex;flex-direction:column;gap:8px;padding:2px 16px 12px;overflow-y:auto;min-height:0}
.ad-tpl-e .tk-in{width:100%}
.ad-tpl-e .tk-ta{margin-top:0;min-height:170px}
.ad-tpl-e .cnt{margin-top:-4px;font-size:11.5px;color:var(--ink-3);text-align:right;font-variant-numeric:tabular-nums}
.tk-btn.bad{border-color:rgba(255,77,109,.45);background:rgba(255,77,109,.08);color:#FECDD3}.tk-btn.bad:hover{background:rgba(255,77,109,.16)}
/* S10 ihopfällda systemrader */
.tk-sys-g{align-self:center;display:inline-flex;align-items:center;gap:4px;padding:3px 10px 3px 12px;font:inherit;font-size:12px;color:var(--ink-3);background:transparent;border:1px dashed var(--line-2);border-radius:999px;cursor:pointer}
.tk-sys-g:hover{color:var(--ink-1);border-color:var(--ink-3)}
.tk-sys-g svg{transform:rotate(90deg);transition:transform .15s}.tk-sys-g.open svg{transform:rotate(-90deg)}
/* Dator (v617): filterpillren radbryts (inget dolt vågrätt spår med mus), standardvärdet i panelen får radbrytas,
   huvudet ger nyckeltalen plats genom att dölja ordmärket och "· admin" när det är smalt, kundens hem/plan/bygge står bara i sidopanelen. */
@media (min-width:720px){.ad-pills{flex-wrap:wrap;overflow:visible}}
.kv.set .fleet{white-space:normal}.kv.set .v{overflow-wrap:anywhere}
.ad-top{container:adtop/inline-size}
.ad-top .me{white-space:nowrap;flex:none}
@container adtop (max-width:1000px){.ad-top .tk-brand>span,.ad-top .ad-role{display:none}}
@media (min-width:1100px){.ad-head-cust{display:none}}
/* Adminchatt och tomt läge har ingen sidopanel: lista + mittspalt tar hela bredden i stället för en tom kolumn till höger. */
@media (min-width:1100px){.ad-app.no-side{grid-template-columns:minmax(0,1fr);grid-template-areas:"top" "body"}}
.ad-mode button{white-space:nowrap}
@media (min-width:900px){.ad-msgs .tk-msg{max-width:min(86%,760px)}}
/* Nyheter i Driftcentralen (v677): utkast godkänns av admin innan kunderna ser dem. */
.ad-news-row{background:rgba(46,212,122,.04)}.ad-news-row:hover{background:rgba(46,212,122,.09)}.ad-news-row.on{background:rgba(46,212,122,.15)}
.ad-news-row em{border-color:rgba(251,191,36,.5);color:#FDE68A}
.tk-tag.ok{border-color:rgba(46,212,122,.5);color:#A7F3D0;background:rgba(46,212,122,.1)}
.ad-news{gap:10px}
.ad-news-e{display:flex;flex-direction:column;gap:6px;padding:14px 16px}
.ad-news-e .h{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.ad-news-e .d{font-size:12.5px;color:var(--ink-2)}
.ad-news-e .ti{font-size:15px;color:#fff}
.ad-news-e ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:5px;font-size:13.5px;line-height:1.5;color:var(--ink-1)}
.ad-news-e li{display:flex;align-items:baseline;gap:8px}.ad-news-e li .tk-tag{font-size:10.5px;padding:1px 7px}.ad-news-e li.int{color:var(--ink-3)}
.tk-tag.cust{border-color:rgba(91,168,255,.5);color:#BAE0FF;background:rgba(91,168,255,.1)}
.ad-news-e .meta{font-size:11.5px;color:var(--ink-3)}
.ad-news-e .btns{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:4px}
.ad-news-e .okline{font-size:13px;font-weight:600;color:#A7F3D0}
.ad-news-e .q{font-size:13px;color:var(--ink-1)}
.ad-mark{font-family:inherit;cursor:pointer;background:transparent}.ad-mark:hover{border-color:var(--ink-2)}.ad-mark.cust{background:rgba(91,168,255,.1)}.ad-mark:disabled{opacity:.5;cursor:default}
/* Nytt i HEMS på Hjälp (v685) */
.tk-nytt{padding:0;margin-top:12px;overflow:hidden}
.tk-nytt-h{padding:14px 16px 10px;border-bottom:1px solid var(--line)}.tk-nytt-h b{font-size:15px;color:var(--ink)}
.tk-nytt-e{padding:12px 16px;display:flex;flex-direction:column;gap:6px}.tk-nytt-e+.tk-nytt-e{border-top:1px solid var(--line)}
.tk-nytt-e .h{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}.tk-nytt-e .d{font-size:12.5px;color:var(--ink-2)}.tk-nytt-e .ti{font-size:14.5px;color:var(--ink)}
.tk-nytt-e ul{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:3px;font-size:13.5px;line-height:1.5;color:var(--ink-1)}
.tk-nytt-more{margin:0;padding:10px 16px 12px;border-top:1px solid var(--line);width:100%;justify-content:center}
/* Nytt i HEMS v4 (v689): kundens kort (nv-, nytt-card.jsx) och Driftcentralens flik (an-, admin-news.jsx). */
.nv-h{display:flex;align-items:center;gap:8px}.nv-stg{border-color:rgba(251,191,36,.5);color:#FDE68A;background:rgba(251,191,36,.1)}
.nv-r{padding:8px 0 6px}.nv-r+.nv-r{border-top:1px solid var(--line)}
.nv-rh{display:flex;align-items:baseline;justify-content:space-between;gap:2px 10px;flex-wrap:wrap;padding:4px 16px}.nv-rh .t{font-size:12px;color:var(--ink-2)}.nv-rh .d{font-size:12px;color:var(--ink-3)}
.nv-ic{width:28px;height:28px;flex:none;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;background:rgba(255,255,255,.06);color:var(--ink-1)}
.nv-chev{flex:none;display:inline-flex;color:var(--ink-3)}
.nv-img{display:block;max-width:100%;height:auto;border-radius:10px;border:1px solid var(--line)}
.an-tabs{flex:none;display:flex;gap:4px;padding:8px 12px;border-bottom:1px solid var(--line)}
.an-tabs button{flex:1;min-height:38px;display:inline-flex;align-items:center;justify-content:center;gap:6px;font:inherit;font-size:13px;font-weight:600;color:var(--ink-2);background:transparent;border:1px solid transparent;border-radius:10px;cursor:pointer;white-space:nowrap}
.an-tabs button.on{color:var(--ink);background:rgba(255,255,255,.05);border-color:var(--line-2)}
.an-tabs em{font-style:normal;font-size:11.5px;line-height:18px;min-width:18px;padding:0 5px;border-radius:999px;background:rgba(91,168,255,.18);color:#BAE0FF}
.an-body{gap:10px}
.an-list{flex:none;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:14px;background:var(--bg-1);overflow:hidden}
.an-item{display:flex;align-items:stretch;min-width:0}.an-item+.an-item,.an-ask+.an-item{border-top:1px solid var(--line)}
.an-ck{flex:none;width:44px;display:flex;align-items:center;justify-content:center;cursor:pointer}.an-ck input{width:18px;height:18px;margin:0;accent-color:#5BA8FF;cursor:pointer}.an-ck input:disabled{opacity:.35;cursor:default}
.an-open{flex:1;min-width:0;display:flex;align-items:center;gap:10px;padding:10px 12px;border:0;background:transparent;color:var(--ink);font:inherit;text-align:left;cursor:pointer}
.an-ck+.an-open{padding-left:0}.an-open:hover{background:rgba(255,255,255,.03)}
.an-open .tx{flex:1;min-width:0}.an-open .s{display:block;font-size:14px;line-height:1.4;text-wrap:pretty}.an-open .m{display:block;margin-top:2px;font-size:12px;line-height:1.45;color:var(--ink-3)}.an-open .m b{font-weight:600;color:#FDE68A}
.an-open .chev{flex:none;display:inline-flex;color:var(--ink-3)}
.an-act{flex:none;display:flex;align-items:center;padding:0 10px 0 0}
.an-fold{align-self:flex-start;display:flex;align-items:center;gap:6px;font:inherit;font-size:11.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);background:none;border:0;padding:8px 0 2px;cursor:pointer}.an-fold svg{transition:transform .15s}.an-fold.open svg{transform:rotate(90deg)}
.an-foot{flex:none;display:flex;flex-direction:column;gap:8px;padding:10px 16px;border-top:1px solid var(--line)}
.an-ok{font-size:13px;font-weight:600;color:#A7F3D0}
.an-note{font-size:12.5px;color:#FDE68A}
.an-sec{font-size:11.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);margin-top:8px}
.an-seg{align-self:flex-start;display:inline-flex;border:1px solid var(--line-2);border-radius:10px;overflow:hidden;flex:none}.an-seg button{font:inherit;font-size:13px;font-weight:600;min-height:34px;padding:0 14px;color:var(--ink-2);background:transparent;border:0;cursor:pointer}.an-seg button+button{border-left:1px solid var(--line-2)}.an-seg button.on{background:rgba(91,168,255,.14);color:#BAE0FF}
.an-bar{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.an-rel{flex:none;display:flex;flex-direction:column;gap:6px;margin-top:4px}
.an-rel-h{display:flex;align-items:baseline;justify-content:space-between;gap:2px 10px;flex-wrap:wrap;font-size:12.5px;color:var(--ink-3)}.an-rel-h .t{color:var(--ink-1)}
.an-ask{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:10px 12px;border-top:1px solid var(--line);font-size:13px;line-height:1.45;color:var(--ink-1)}.an-ask>span{flex:1 1 180px}
.an-ask.box{border:1px solid var(--line-2);border-radius:12px}
.an-st{margin:0;display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 14px;font-size:13px;color:var(--ink-1)}.an-st dt{color:var(--ink-3)}.an-st dd{margin:0}
.an-f{flex:none;display:flex;flex-direction:column;gap:6px}.an-f>label,.an-f>.lb{display:flex;justify-content:space-between;gap:8px;font-size:12.5px;color:var(--ink-2)}
.an-f .n{font-family:"Geist Mono",monospace;font-variant-numeric:tabular-nums;color:var(--ink-3)}.an-f .n.over{color:#FCA5A5}
.an-f .tk-in,.an-f .tk-sel{width:100%;height:40px}.an-f .tk-ta{margin-top:0;min-height:140px}.an-f select option{background:#0f172a;color:#e2e8f0}
.an-btns{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.an-hist{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--ink-1)}.an-hist li{display:flex;gap:10px;align-items:baseline}.an-hist .t{flex:none;min-width:84px;font-size:12px;color:var(--ink-3)}
/* Nytt i HEMS som egen sida (v690). Ingång på Hjälp (nv-entry); sidan är modell A från v703 (nv-rs, nv-cc, nv-dp). */
.nv-entry{display:flex;flex-direction:column;gap:8px;padding:14px 16px;margin-top:12px;text-decoration:none;color:inherit;border-color:rgba(91,168,255,.28)}a.nv-entry:hover{border-color:rgba(91,168,255,.55)}
.nv-eh{display:flex;align-items:center;gap:8px}.nv-eh b{font-size:15px;color:var(--ink)}.nv-eh .nv-chev{margin-left:auto}
.nv-er{font-size:12px;color:var(--ink-2)}
.nv-el{display:flex;flex-direction:column;gap:6px}.nv-el>div{display:flex;align-items:center;gap:10px;font-size:13.5px;line-height:1.35;color:var(--ink-1)}
.nv-ef{font-size:12px;color:var(--ink-3)}
.nv-page{display:flex;flex-direction:column;gap:10px;width:100%;max-width:760px;margin:4px auto 0}
.nv-bl{flex:none;width:28px;display:flex;align-items:center;justify-content:center}.nv-bl::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--ink-3)}
.nv-envbar{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--ink-3)}
/* Modell A (v703, André 27/9: "Snyggt. Den kör vi på"): ett kort per ändring under sin release och en egen sida per ändring. Ikonen står i en neutral
   ruta och bara ikonen och områdets namn har färg (--c, dämpad i nytt-card.jsx), så ändringarna skiljs åt utan att lysa. */
.nv-ai{flex:none;width:36px;height:36px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;background:rgba(255,255,255,.05);color:var(--c,var(--ink-1))}
.nv-ai.s{width:28px;height:28px;border-radius:8px}.nv-ai.l{width:48px;height:48px;border-radius:13px}
.nv-al{font-size:10.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--c,var(--ink-3));white-space:nowrap}
.nv-rs{display:flex;flex-direction:column;gap:10px}.nv-rs+.nv-rs{margin-top:14px}
.nv-rt{display:flex;flex-direction:column;gap:3px;padding:0 2px}.nv-rt>div{display:flex;align-items:center;gap:8px}.nv-rt b{font-size:20px;font-weight:700;color:var(--ink)}.nv-rt>span{font-size:12.5px;color:var(--ink-3)}
.nv-cards{display:flex;flex-direction:column;gap:8px}
.nv-cc{display:flex;align-items:center;gap:12px;width:100%;padding:12px 12px 12px 14px;background:var(--bg-1);border:1px solid var(--line);border-radius:14px;color:var(--ink);font:inherit;text-align:left}
button.nv-cc{cursor:pointer}button.nv-cc:hover{border-color:var(--line-2);background:var(--bg-2)}button.nv-cc:focus-visible{outline:2px solid rgba(91,168,255,.6);outline-offset:2px}
.nv-cc .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}.nv-cc .s{font-size:14.5px;line-height:1.4;text-wrap:pretty}
.nv-nd{flex:none;width:8px;height:8px;border-radius:50%;background:var(--blue)}
.nv-older{align-self:flex-start;font:inherit;font-size:13px;font-weight:600;color:var(--blue);background:none;border:0;padding:6px 0;cursor:pointer}
.nv-dp{gap:14px}
.nv-dh{display:flex;align-items:center;gap:12px}.nv-dh .m{display:flex;flex-direction:column;gap:5px;font-size:12.5px;color:var(--ink-3)}
.nv-dt{margin:0;font-size:21px;line-height:1.3;font-weight:700;color:var(--ink);text-wrap:pretty}
.nv-lt{display:flex;flex-direction:column;gap:10px}.nv-lt p{margin:0;font-size:15px;line-height:1.6;color:var(--ink-1);text-wrap:pretty}
.nv-go{width:100%;height:46px;font-size:15px;text-decoration:none}
.nv-pn{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px;margin-top:10px}
.nv-pv{display:flex;flex-direction:column;align-items:flex-start;gap:6px;min-width:0;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:transparent;color:var(--ink-3);font:inherit;font-size:11.5px;text-align:left}
button.nv-pv{cursor:pointer}button.nv-pv:hover{border-color:var(--line-2)}.nv-pv.n{align-items:flex-end;text-align:right}.nv-pv.off{opacity:.5}
.nv-pv b{font-size:13px;line-height:1.35;font-weight:600;color:var(--ink-1);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.nv-pvw{display:flex;flex-direction:column;gap:10px}.nv-pvh{font-size:12px;color:var(--ink-3)}
.nv-pvb{align-self:flex-start;display:inline-flex;align-items:center;gap:4px;font:inherit;font-size:13px;font-weight:600;color:var(--blue);background:none;border:0;padding:4px 0;cursor:pointer}.nv-pvb .nv-chev{color:inherit}
.an-bar>.tk-hint{flex:1 1 260px}
.an-gh{display:flex;align-items:center;min-height:44px;background:rgba(255,255,255,.025)}.an-gh .tx{flex:1;min-width:0;padding:8px 12px 8px 0}.an-gh b{display:block;font-size:13px;font-weight:600;color:var(--ink-1)}.an-gh .tx span{display:block;font-size:11.5px;color:var(--ink-3);margin-top:1px}
.an-body>.an-list+.an-list{margin-top:2px}
.an-ex{flex:none;padding:8px 16px;font-size:12.5px;line-height:1.5;color:#FDE68A;background:rgba(251,191,36,.07);border-bottom:1px solid rgba(251,191,36,.25)}
.tk-tag.nv-ex{border-color:rgba(251,191,36,.5);color:#FDE68A;background:rgba(251,191,36,.08)}
/* v720 (backend 27/9, masteradmin): prods ärenden i stagings Driftcentral. Etiketten Prod står efter id:t i listan och först i ärendets huvud: neutral ljus med versaler, skild från adminfärgerna och från gult (internt). */
.tk-tag.env{font-size:11px;letter-spacing:.08em;text-transform:uppercase;padding:3px 7px;border-color:rgba(230,236,247,.55);color:#F1F5FB;background:rgba(230,236,247,.1)}
.ad-tk .idw{display:flex;align-items:baseline;gap:6px;min-width:0}
.ad-sec .tk-k .ad-k-note{margin-left:auto;font-size:11.5px;font-weight:600;color:var(--ink-3);letter-spacing:0;text-transform:none}
/* Fel om det öppna ärendet (hämtning, åtgärd) står i ärendet, också på mobil där listan är dold. */
.ad-terr{flex:none;margin:8px 16px 0;cursor:pointer}
.ad-terr-w{display:flex;align-items:flex-start;gap:8px;padding:16px}.ad-terr-w .tk-err{flex:1;min-width:0}
@media (max-width:719px){.ad-terr{margin:8px 12px 0}.ad-terr-w{padding:12px}}
/* v724 (André 28/9, variant B): ett fält för sök och kod med Filter bredvid. Filtren i en panel under knappen (dator) eller ett ark nerifrån (mobil); valda filter som etiketter. */
.ad-q{display:flex;gap:6px;align-items:center;padding:10px 10px 0;position:relative;flex:none}
.ad-q .ad-search{flex:1;min-width:0;padding:0}.ad-q .ad-search>svg{left:11px;top:10.5px}.ad-q .ad-search .x{right:4px;top:4px}
.ad-fbtn{flex:none;display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 11px;border-radius:10px;border:1px solid var(--line-2);background:transparent;color:var(--ink-1);font:inherit;font-size:13px;font-weight:600;white-space:nowrap;cursor:pointer}
.ad-fbtn:hover{color:var(--ink)}.ad-fbtn.on{border-color:var(--blue);color:#E0F2FE;background:rgba(91,168,255,.14)}
.ad-fbtn em{font-style:normal;font-size:11px;min-width:18px;height:18px;border-radius:9px;background:var(--blue);color:#0A0F18;display:inline-flex;align-items:center;justify-content:center;padding:0 5px}
.ad-chips{display:flex;flex-wrap:wrap;gap:6px;padding:8px 10px 0;flex:none}.ad-chips .ad-pill{display:inline-flex;align-items:center;gap:6px}
.ad-fdim{position:fixed;inset:0;z-index:30}
.ad-fpanel{position:absolute;left:10px;right:10px;top:calc(100% + 6px);z-index:31;background:var(--bg-2);border:1px solid var(--line-strong);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:14px;box-shadow:0 14px 34px rgba(0,0,0,.55)}
.ad-fpanel .grab{display:none}
.ad-fpanel .hd{display:flex;align-items:center;min-height:24px}.ad-fpanel .hd b{font-size:15px;font-weight:600}.ad-fpanel .lnk{margin-left:auto;font:inherit;font-size:13px;font-weight:600;color:var(--blue);background:none;border:0;padding:4px 0;cursor:pointer}
.ad-fpanel .g{display:flex;flex-direction:column;gap:8px}.ad-fpanel .gl{font-size:11.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2)}
.ad-fpanel .pp{display:flex;flex-wrap:wrap;gap:6px}.ad-fpanel select.ad-pill{align-self:flex-start}
.ad-fpanel .seg{display:flex;border:1px solid var(--line-2);border-radius:10px;overflow:hidden}.ad-fpanel .seg button{flex:1;height:32px;border:0;background:transparent;color:var(--ink-2);font:inherit;font-size:12.5px;font-weight:600;cursor:pointer}.ad-fpanel .seg button+button{border-left:1px solid var(--line-2)}.ad-fpanel .seg button.on{background:rgba(91,168,255,.14);color:#E0F2FE}
.ad-fpanel .show{width:100%}
.ad-sug{display:flex;align-items:center;gap:8px;padding:12px;border-bottom:1px solid var(--line);background:rgba(91,168,255,.1);color:inherit;text-decoration:none}.ad-sug:hover{background:rgba(91,168,255,.16)}
.ad-sug .l{font-size:13.5px;font-weight:600;color:#BAE0FF;white-space:nowrap}.ad-sug .tk-code{font-size:14px}.ad-sug .h{font-size:13px;color:var(--ink-2);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ad-sug svg{margin-left:auto;flex:none;color:#BAE0FF}
@media (max-width:719px){.ad-fdim{background:rgba(5,8,14,.62);z-index:60}.ad-fpanel{position:fixed;left:0;right:0;top:auto;bottom:0;z-index:61;border-radius:18px 18px 0 0;padding:10px 16px calc(20px + env(safe-area-inset-bottom));gap:16px;box-shadow:0 -12px 32px rgba(0,0,0,.5);max-height:85vh;overflow-y:auto}.ad-fpanel .grab{display:block;width:36px;height:4px;border-radius:2px;background:var(--line-strong);align-self:center}.ad-fpanel .hd b{font-size:16px}.ad-fpanel .lnk{font-size:13.5px;padding:10px 0}.ad-fpanel .pp{gap:8px}.ad-fpanel .ad-pill{height:44px;padding:0 16px;font-size:14px}.ad-fpanel select.ad-pill{padding-right:34px}.ad-fpanel .seg{border-radius:12px}.ad-fpanel .seg button{height:44px;font-size:14px}.ad-fpanel .show{height:44px}}
/* Smal listkolumn (260 px vid 720–1099 px, 260–268 px vid 1400–1579 px): Filter visar bara ikonen och antalet, och fältet tar plats för krysset först när något är skrivet, så "Sök eller skriv kod" syns hela. */
.ad-q .ad-search .tk-in:placeholder-shown{padding-right:10px}
@media (min-width:720px) and (max-width:1099px){.ad-fbtn .t{display:none}.ad-fbtn{min-width:36px;justify-content:center;padding:0 10px}}
/* v725 (André 28/9): ärendets huvud på mobil. "Lägg prod-24-m Överst och mindre än nu och förklaringen under med popdown." Id:t står överst mellan tillbaka och info, åtgärderna under, och ämnet visar två rader tills man trycker; då syns hela texten och raden med kategori och tider. Datorn oförändrad. */
.ad-tkh-mid,.ad-tkh-tg{display:none}
@media (max-width:719px){
  .ad-tkh-top{flex-wrap:wrap;row-gap:8px}
  .ad-tkh-top .tk-back{order:0}
  .ad-tkh-top .ad-tkh-mid{display:block;order:1;flex:1;min-width:0;font-size:16px;letter-spacing:.12em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .ad-tkh-top .ad-side-btn{order:2;margin-left:0}
  .ad-tkh-top .ad-acts{order:3;flex:1 1 100%}
  .ad-tkh-id{align-items:flex-start;gap:8px;cursor:pointer}
  .ad-tkh-id .code{display:none}
  .ad-tkh-id .t b{white-space:normal;max-height:none;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}
  .ad-tkh-id .t small{display:none}
  .ad-tkh-id.open .t b{display:block;-webkit-line-clamp:unset;white-space:normal;max-height:40vh;overflow-y:auto}
  .ad-tkh-id.open .t small{display:block;margin-top:4px}
  .ad-tkh-tg{display:flex;flex:none;width:36px;height:36px;align-items:center;justify-content:center;border-radius:10px;border:1px solid var(--line-2);background:transparent;color:var(--ink-2);transform:rotate(90deg);transition:transform .15s;cursor:pointer}
  .ad-tkh-id.open .ad-tkh-tg{transform:rotate(-90deg)}
  /* v725 (iOS): allt i ärendet går att nå. Höjden följer den synliga ytan, ärendet scrollar som helhet när skrivfältet inte får plats, och listan med inställningar i Föreslå ändring ligger i flödet under sökfältet i stället för att flyta ovanför. */
  .ad-app{height:var(--vvh,100dvh)}
  .ad-main{overflow-y:auto;overscroll-behavior:contain}
  .ad-pick-panel{position:static;width:auto;max-height:none;margin-top:6px;box-shadow:none}
}
/* v726 (André 28/9: "Tagga kollega. Gå igenom hela flödet det är mycket delar som döljs eller är fel storlek"). Menyer, inställningslistan och sidopanelen får plats på mobilen, och iOS zoomar inte när ett fält väljs. */
.ad-mdim,.ad-menu .sh-t,.ad-pick-sh,.ad-mode .sm{display:none}
.ad-fdim{cursor:pointer}
.ad-news-row em{flex:none;white-space:nowrap}
@media (max-width:719px){
  /* iOS förstorar sidan när ett fält under 16 px väljs; då hamnade delar utanför skärmen. */
  .ad-app input,.ad-app textarea,.ad-app select{font-size:16px!important}
  /* Flytta till, Tagga kollega och förslagets status: ark nerifrån i hela bredden i stället för en meny som öppnas utanför vänsterkanten. */
  .ad-mdim{display:block;position:fixed;inset:0;z-index:60;background:rgba(5,8,14,.62);cursor:pointer}
  .ad-menu:not(.ad-colors){position:fixed;left:0;right:0;top:auto;bottom:0;margin:0;min-width:0;z-index:61;border:0;border-top:1px solid var(--line-strong);border-radius:18px 18px 0 0;padding:12px 12px calc(16px + env(safe-area-inset-bottom));max-height:75dvh;overflow-y:auto;box-shadow:0 -12px 32px rgba(0,0,0,.5)}
  .ad-idea-btn+.ad-menu{left:0;right:0}
  .ad-menu .sh-t{display:block;font-size:16px;font-weight:600;color:var(--ink);padding:4px 12px 10px}
  .ad-menu:not(.ad-colors) button{min-height:48px;align-items:center;font-size:15px;padding:10px 12px}
  .ad-menu:not(.ad-colors) .hint{font-size:13px;padding:10px 12px 0}
  /* Föreslå ändring: listan med inställningar är ett helskärmsark med eget sökfält och Stäng (v725 lade 47 fält i flödet, över 3 000 px). */
  .ad-pick-panel{position:fixed;inset:0;width:auto;height:var(--vvh,100dvh);max-height:none;margin:0;border:0;border-radius:0;z-index:70;padding:0 8px calc(12px + env(safe-area-inset-bottom));overflow-y:auto;background:var(--bg);box-shadow:none}
  .ad-pick-sh{display:flex;gap:8px;align-items:center;position:sticky;top:0;z-index:1;background:var(--bg);margin:0 -8px 4px;padding:10px 12px;border-bottom:1px solid var(--line)}
  .ad-pick-sh .tk-in{flex:1;min-width:0;height:44px}
  .ad-pick-panel .ad-pick-sh button{display:inline-flex;align-items:center;justify-content:center;flex:none;width:auto;height:44px;padding:0 14px;border:1px solid var(--line-2);border-radius:10px;background:transparent;color:var(--ink-1);font-size:14px;font-weight:600}
  /* Sidopanelen Kund och inställningar i hela bredden (var 340 px med en remsa av tråden bredvid). */
  .ad-side{width:100vw}
  /* Skrivlägena på en rad: Internt, Till kund, Föreslå, Föranalys. */
  .ad-mode{flex-wrap:nowrap;align-self:stretch}.ad-mode button{flex:1 1 auto;padding:8px 6px}.ad-mode .lg{display:none}.ad-mode .sm{display:inline}
  /* Skrivfältet visar hela ledtexten (två rader). */
  .tk-compose textarea{min-height:64px}
  /* Min färg (avataren i toppraden): öppnas inom skärmen från avataren. Toppraden är containerfråga och kan inte bära ett ark. */
  .ad-colors{width:min(300px,calc(100vw - 24px));min-width:0;left:auto;right:0}
  /* Prognos-grafen och filtret mäts mot den synliga ytan (100vh är högre än skärmen på iOS). */
  .ad-pop-box{height:100dvh}
  .ad-fpanel{max-height:85dvh}
}
/* v727 (André 28/9: "Detta på 1 rad med en knapp som ger fler alternativ om det inte får plats"): ärendets etiketter och Ta ärendet på en rad på mobil, resten under ⋯. */
.ad-acts-x{display:contents}.ad-more-btn,.ad-menu .sh-g{display:none}
@media (max-width:719px){
  .ad-acts-x{display:none}
  .ad-tkh-top .ad-acts{order:3;flex:1 1 calc(100% - 52px);min-width:0;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .ad-tkh-top .ad-acts::-webkit-scrollbar{display:none}
  .ad-tkh-top .ad-acts>*{flex:none}
  .ad-more-btn{display:inline-flex;order:4;flex:none;width:44px;height:36px;padding:0;justify-content:center;align-items:center;font-size:20px;line-height:1;letter-spacing:.05em}
  .ad-menu .sh-g{display:block;font-size:11.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2);padding:12px 12px 4px}
  .ad-menu .sh-g:first-of-type{padding-top:2px}
}
/* v728: kanalraden i adminchatten på en rad. Gemensam med gruppikon och rundade hörn, ett streck, sedan de personliga kanalerna. Får raden inte plats scrollar den i sidled. */
.ad-chans{flex-wrap:nowrap;align-items:center;gap:4px;padding:8px 10px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.ad-chans::-webkit-scrollbar{display:none}
.ad-chans .ad-ch{flex:none;gap:5px;padding:5px 8px;font-size:12.5px}
.ad-ch.g{border-radius:10px}.ad-ch.g svg{color:#C4B5FD;flex:none;width:13px;height:13px}
.ad-chans .sep{flex:none;width:1px;height:20px;background:var(--line-strong);margin:0 4px}
/* v729 (André 28/9, skärmbild från drift på stor skärm): "de 2 fälten till höger skall börja ihopfällda och på dator skall vänstra fältet vara bredare så man kan se enklare".
   Från 1100 px börjar sidopanelen hopfälld till en 44 px remsa per kolumn; ett klick fäller ut, pilen i kolumnens rubrik fäller ihop. Listkolumnen är bredare. Under 1100 px oförändrat (panelen öppnas med info-knappen). */
.ad-side-strip,.ad-col-strip,.ad-col-hd{display:none}
.ad-side-strip,.ad-col-strip{flex-direction:column;align-items:center;gap:10px;width:44px;height:100%;padding:14px 0;border:0;background:rgba(255,255,255,.02);color:var(--ink-1);font:inherit;cursor:pointer}
.ad-side-strip span,.ad-col-strip span{writing-mode:vertical-rl;font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}
.ad-side-strip svg,.ad-col-strip svg{transform:rotate(180deg);flex:none;color:#BAE0FF}
.ad-side-strip:hover,.ad-col-strip:hover{background:rgba(91,168,255,.08);color:var(--ink)}
.ad-col-hd{align-items:center;justify-content:space-between;gap:8px;padding:8px 10px 8px 14px;border-bottom:1px solid var(--line);font-size:11.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2);flex:none}
.ad-col-hd button{width:30px;height:30px;border-radius:8px;border:1px solid var(--line-2);background:transparent;color:var(--ink-2);display:flex;align-items:center;justify-content:center;cursor:pointer}
.ad-col-hd button:hover{color:var(--ink);border-color:rgba(91,168,255,.5)}
@media (min-width:1100px){
  .ad-app{grid-template-columns:minmax(0,1fr) auto}
  .ad-body{grid-template-columns:clamp(300px,24vw,380px) minmax(0,1fr)}
  .ad-side{width:clamp(340px,27vw,480px)}
  .ad-side:not(.ca):not(.cb){width:44px;overflow:hidden}
  .ad-side:not(.ca):not(.cb)>*{display:none}
  .ad-side:not(.ca):not(.cb)>.ad-side-strip{display:flex}
  .ad-side.ca>.ad-side-close,.ad-side.cb>.ad-side-close{display:flex}
}
@media (min-width:1400px){
  .ad-app{grid-template-columns:minmax(0,1fr) auto}
  .ad-body{grid-template-columns:clamp(320px,22vw,440px) minmax(420px,1fr)}
  .ad-side,.ad-side:not(.ca):not(.cb){--ca:44px;--cb:44px;width:calc(var(--ca) + var(--cb));overflow:hidden}
  .ad-side.ca{--ca:23vw}.ad-side.cb{--cb:23vw}
  .ad-side>.ad-side-strip,.ad-side:not(.ca):not(.cb)>.ad-side-strip,.ad-side>.ad-side-close,.ad-side.ca>.ad-side-close,.ad-side.cb>.ad-side-close{display:none}
  .ad-side:not(.ca):not(.cb)>.ad-cols{display:grid}
  .ad-cols{grid-template-columns:var(--ca) var(--cb)}
  .ad-col-hd{display:flex}
  .ad-side:not(.ca) .ad-col:first-child>*,.ad-side:not(.cb) .ad-col-data>*{display:none}
  .ad-side:not(.ca) .ad-col:first-child>.ad-col-strip,.ad-side:not(.cb) .ad-col-data>.ad-col-strip{display:flex}
  .ad-side:not(.ca) .ad-col:first-child,.ad-side:not(.cb) .ad-col-data{overflow:hidden}
}
/* v730 (André 28/9: "Stage ska ha taggen stage som prod har på prod"): stagings ärenden märks Stage när listan också har prods ärenden. Samma form som Prod, tunnare kant och ingen fyllning så de går isär. */
.tk-tag.env.stg{border-color:rgba(230,236,247,.32);color:var(--ink-1);background:transparent}
/* v731 på mobil: Prod/Stage står vid id:t på översta raden, och åtgärdsraden visar bara namnen ("Lennie", "+ Andreas") med tätare etiketter, så raden får plats utan att något kapas. */
.ad-env-m{display:none}
@media (max-width:719px){
  .ad-tkh-top .ad-env-m{display:inline-flex;order:1;flex:none}
  .ad-tkh-top .ad-acts .ad-env-a,.ad-tkh-top .ad-acts .pre{display:none}
  .ad-tkh-top .ad-acts .tk-tag{padding:3px 8px!important}
}
/* v735 Varningar (André 28/9): raden över Nytt i HEMS och vyn med alla system som har varningar. Orange för varning och ingen data, rött för kritisk; gult är interna lappar. */
.ad-warn-row{background:rgba(251,146,60,.05)}.ad-warn-row:hover{background:rgba(251,146,60,.1)}.ad-warn-row.on{background:rgba(251,146,60,.16)}
.ad-warn-row .ad-dot{width:8px;height:8px;border-radius:50%;flex:none;background:#FB923C}.ad-warn-row.crit .ad-dot{background:#FF4D6D}
.ad-chat-row.ad-warn-row em{background:#C2410C}.ad-chat-row.ad-warn-row.crit em{background:#E11D48}
.ad-wv{display:flex;flex-direction:column;min-height:0;height:100%}
.ad-wv-f{display:flex;gap:6px;flex:none;padding:10px 16px;border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none}.ad-wv-f::-webkit-scrollbar{display:none}
.ad-wv-f .ad-pill{display:inline-flex;align-items:center;gap:6px}.ad-wv-f em{font-style:normal;font-weight:600;color:var(--ink-3)}.ad-wv-f .on em{color:#BAE0FF}
.ad-wv-l{gap:10px}
.ad-wc{flex:none;width:100%;max-width:760px;box-sizing:border-box;border:1px solid var(--line-2);border-radius:12px;background:var(--bg-1);padding:12px 14px;display:flex;flex-direction:column;gap:8px}
.ad-wc.crit{border-color:rgba(255,77,109,.45)}.ad-wc.off{border-color:rgba(251,146,60,.4)}
.ad-wc .h{display:flex;align-items:center;gap:8px;min-width:0}.ad-wc .h .tk-code{font-size:15px}
.ad-wc .h b{font-size:14.5px;font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ad-wc .h .age{margin-left:auto;flex:none;font-size:12.5px;color:var(--ink-2);white-space:nowrap}
.ad-wc .w{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:8px;align-items:baseline;font-size:14px;line-height:1.45}
.ad-wc .st{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px;align-items:baseline;font-size:14px;line-height:1.45;color:var(--ink-1)}
.ad-wc .tx{overflow-wrap:anywhere}.ad-wc .t{font-family:"Geist Mono",monospace;font-size:12px;color:var(--ink-2)}
.tk-tag.sev.crit{border-color:rgba(255,77,109,.55);color:#FECDD3;background:rgba(255,77,109,.12)}
.tk-tag.sev.warn,.tk-tag.sev.off{border-color:rgba(251,146,60,.55);color:#FED7AA;background:rgba(251,146,60,.1)}
.ad-wc .f{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:12.5px;color:var(--ink-3);border-top:1px solid var(--line);padding-top:8px}
.ad-wc .f a{margin-left:auto;font-size:13px;font-weight:600;color:#BAE0FF;text-decoration:none;padding:4px 0}.ad-wc .f a:hover{color:#fff}.ad-wc .f .note{margin-left:auto}
@media (max-width:719px){.ad-wv-f{padding:10px 12px}.ad-wc{padding:12px}.ad-wc .f a{padding:10px 0}}
/* v737 Notiser på den här enheten, längst ner i avatarmenyn (Min färg och notiser). */
.ad-colors{white-space:normal}
.ad-colors .hems-push{white-space:normal;border-top:1px solid var(--line);margin:4px 2px 0;padding:10px 8px 6px;display:grid;gap:8px}
.ad-colors .hems-push .k{font-size:11.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2)}
.ad-colors .hems-push .tx{font-size:12.5px;line-height:1.45;color:var(--ink-1)}
.ad-colors .hems-push .hems-push-btn{display:inline-flex;justify-content:center;align-items:center;justify-self:start;width:auto;min-height:36px;padding:0 14px;border:1px solid var(--line-2);border-radius:10px;background:transparent;color:var(--ink);font-size:13.5px;font-weight:600}
.ad-colors .hems-push .hems-push-btn:hover{border-color:rgba(91,168,255,.5);background:rgba(91,168,255,.08)}
.ad-colors .hems-push .hems-push-btn.pri{background:#5BA8FF;border-color:#5BA8FF;color:#06101F}
@media (max-width:719px){.ad-colors .hems-push .hems-push-btn{min-height:44px}}
.ad-colors .hems-push .q{font-size:12px;line-height:1.4;color:var(--ink-3)}
.ad-colors .hems-push .lnk{font-size:12.5px;font-weight:600;color:#BAE0FF;text-decoration:none;padding:4px 0}.ad-colors .hems-push .lnk:hover{color:#fff}
/* v741 Utred larm (André 28/9): Larm-etiketten och larmraden i orange som Varningar; gult är interna lappar. */
.tk-tag.larm{border-color:rgba(251,146,60,.55);color:#FED7AA;background:rgba(251,146,60,.1)}
.tk-tag.hid{border-color:var(--line-2);color:var(--ink-2);background:transparent}
.tk-alarm{align-self:stretch;max-width:760px;box-sizing:border-box;border:1px solid rgba(251,146,60,.4);border-radius:12px;background:rgba(251,146,60,.05);padding:10px 12px;display:grid;gap:6px}
.tk-alarm .h{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.tk-alarm .h b{font-size:13.5px;font-weight:600}.tk-alarm .h .t{margin-left:auto;font-size:12px;color:var(--ink-3)}
.tk-alarm .r{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px;align-items:baseline;font-size:14px;line-height:1.45;overflow-wrap:anywhere}
.tk-alarm .n{font-size:12px;color:var(--ink-3)}
.ad-wc .f a{margin-left:0}.ad-wc .f>span:first-child{margin-right:auto}
.ad-wc-u{display:flex;align-items:center;gap:8px}.ad-wc-u .note{font-size:12.5px;color:var(--ink-2)}.ad-wc-u .note.bad{color:#FF8FA3}
@media (max-width:719px){.ad-wc-u .tk-btn{min-height:44px}
  /* Mobil: "Syns inte för kunden" döljs på åtgärdsraden så Ta ärendet får plats; skrivfältet Till kund säger samma sak. */
  .ad-tkh-top .ad-acts .tk-tag.hid{display:none}}
/* v742 Föranalysens historik: bara den senaste i tråden, äldre under Visa tidigare versioner. */
.tk-an .ft{flex-wrap:wrap}
.tk-an .ft button.hist{margin-left:auto;color:#A5F3FC;text-transform:none;letter-spacing:0;font-size:12px;font-weight:600;padding:6px 0}
.tk-an .ft .hist+button{margin-left:14px}
.tk-an .hist-l{display:grid;gap:8px;padding:10px;border-top:1px solid rgba(34,211,238,.15);background:rgba(0,0,0,.14)}
.tk-an.old{border-style:dashed;border-color:rgba(34,211,238,.28);background:transparent}
.tk-an .ov{display:inline-block;margin-right:8px;padding:1px 6px;border:1px solid rgba(165,243,252,.45);border-radius:6px;font-size:10px;letter-spacing:.05em;vertical-align:1px}
/* v743 Skrivfältet ligger kvar (dolt) i Föreslå och Föranalys så texten inte försvinner. */
.ad-comp-w{display:contents}.ad-comp-w[hidden]{display:none}
/* v745 Fel i en del av ärendet (AdErr i admin.jsx). */
.ad-err{display:grid;gap:8px;margin:12px;padding:12px 14px;border:1px solid rgba(248,113,113,.45);border-radius:12px;background:rgba(248,113,113,.08);color:var(--ink);font-size:13.5px;line-height:1.45}
.ad-err .tk-mono{font-size:12px;color:#FCA5A5;word-break:break-word}
.ad-err .tk-btn{justify-self:start}

/* v747 (backend 28/9, E1–E5): kundens enheter i panelen Kund. Orange som Varningar; gult är reserverat för interna lappar. */
.ad-styr .tk-mono,.ad-dev .tk-mono{color:var(--ink-2);font-size:calc(var(--fs) - 1.5px)}
.ad-devs{display:grid;gap:5px;padding:6px 0;border-top:1px solid var(--line);font-size:var(--fs)}.ad-devs .h{color:var(--ink-2)}
.ad-dev{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:baseline;padding-left:10px}.ad-dev .n{color:var(--ink);overflow-wrap:anywhere}.ad-dev.off .n{color:#FED7AA}
.ad-dev .tg{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:4px}.ad-dev .tk-tag{font-size:11px;padding:1px 7px}
.tk-tag.ctl{border-color:rgba(91,168,255,.5);color:#BAE0FF;background:rgba(91,168,255,.1)}
.ad-dflag{margin-top:6px;font-size:calc(var(--fs) - .5px);line-height:1.45;color:#FED7AA;background:rgba(251,146,60,.08);border:1px solid rgba(251,146,60,.4);border-radius:8px;padding:6px 10px;overflow-wrap:anywhere}
/* v748 (André 29/9) */
/* "Larm skall om den är kritisk vara den kritiska färgen": rött som Kritisk i Varningar (.tk-tag.sev.crit, .ad-wc.crit). */
.tk-tag.larm.crit{border-color:rgba(255,77,109,.55);color:#FECDD3;background:rgba(255,77,109,.12)}
.tk-alarm.crit{border-color:rgba(255,77,109,.45);background:rgba(255,77,109,.05)}
/* "När intern är skall skrivfältet vara lite lite lätt åt det gula håller": svag gul ram och ton, samma gula som interna lappar. */
.ad-comp-w.int .tk-compose{border-color:rgba(251,191,36,.3);background:linear-gradient(rgba(251,191,36,.045),rgba(251,191,36,.045)) rgba(10,15,24,.6)}
/* "Ikonerna ligger konstigt": knapparna mitt för fältet vid lägsta höjd, nere vid sista raden när texten växt (tall sätts i TkComposer). */
.tk-compose{align-items:center}.tk-compose.tall{align-items:flex-end}
/* v749 (André 29/9): valt alternativ i "Skicka till kunden?" har en ring; piltangenterna flyttar den. */
.ad-ask-f .tk-btn:focus{outline:none}.ad-ask-f .tk-btn.sel{box-shadow:0 0 0 2px #0f1522,0 0 0 4px #E6ECF7}
/* v840 Nytt i HEMS med två texter: Driftcentralens två textrutor och flaggläget, och appens interna rader för admin. */
.an-tx{border:1px solid var(--line-2,#1e293b);border-radius:12px;padding:10px 12px;display:flex;flex-direction:column;gap:10px}.an-tx.int{border-color:rgba(251,191,36,.35);background:rgba(251,191,36,.05)}.an-tx.cust{border-color:rgba(91,168,255,.35);background:rgba(91,168,255,.05)}
.an-txh{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}.an-txh b{font-size:13px}.an-txh span{font-size:11.5px;color:var(--ink-2,#94a3b8)}.an-tx.int .an-txh b{color:#FDE68A}.an-tx.cust .an-txh b{color:#BAE0FF}
.an-sw{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;min-height:32px;cursor:pointer}
.an-fl{display:inline-block;margin-left:8px;font-size:11.5px;padding:1px 7px;border-radius:999px;border:1px solid var(--line-2,#334155);color:var(--ink-2,#94a3b8)}.an-fl.on{border-color:rgba(74,222,128,.5);color:#86efac}.an-fl.off{border-color:rgba(251,191,36,.5);color:#fcd34d}
.nv-int-s{display:block;margin-top:3px;font-size:12px;color:#fcd34d;line-height:1.4}.nv-int-s em,.nv-int-h em{font-style:normal;font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;margin-right:6px;padding:1px 6px;border-radius:999px;background:rgba(251,191,36,.14);color:#fcd34d}
.nv-int-box{border:1px dashed rgba(251,191,36,.45);border-radius:12px;padding:10px 12px;background:rgba(251,191,36,.05);display:flex;flex-direction:column;gap:6px}.nv-int-box b{font-size:14px}.nv-int-box p{margin:0;font-size:13.5px;line-height:1.55;color:var(--ink-1,#cbd5e1)}.nv-int-h{display:flex;align-items:center;gap:6px;font-size:11.5px;color:var(--ink-2,#94a3b8)}
.nv-int-row summary{display:flex;align-items:center;gap:10px;cursor:pointer;list-style:none}.nv-int-row summary::-webkit-details-marker{display:none}.nv-int-row .nv-lt{padding:8px 0 2px 40px}
/* v851: fliken Förslag, grupper per status (Byggt och Avböjt börjar hopfällda). */
.ad-fh{display:flex;align-items:center;gap:6px;width:100%;font-family:inherit;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#BAE0FF;padding:10px 12px 8px;background:rgba(255,255,255,.02);border:0;border-bottom:1px solid var(--line);cursor:pointer;text-align:left}
.ad-fh svg{transition:transform .15s}.ad-fh.open svg{transform:rotate(90deg)}
.ad-fh em{font-style:normal;font-weight:400;letter-spacing:0;text-transform:none;color:var(--ink-3);margin-left:auto}
/* v851: smal listkolumn (260 px på desktop): de fem flikarna får plats med antalet under namnet. */
.ad-list{container-type:inline-size}
@container (max-width:340px){.ad-filt{gap:2px;padding:10px 6px}.ad-filt button{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;align-items:center;gap:1px;font-size:11px;padding:5px 2px;line-height:1.2}.ad-filt em{margin-left:0;min-height:13px}}
/* v855: stega mellan kundens ärenden, inbyggt i ärendenumret överst: ‹ E8J-2 2/4 ›. */
.ad-step{display:inline-flex;align-items:stretch;height:40px;max-width:100%;border:1px solid var(--line-2);border-radius:10px;overflow:hidden;vertical-align:middle;background:rgba(255,255,255,.02)}
.ad-step .ar{display:flex;align-items:center;justify-content:center;width:38px;flex:none;color:var(--ink-1);text-decoration:none}
.ad-step a.ar:hover{background:rgba(91,168,255,.12);color:#E0F2FE}
.ad-step .ar.dis{color:var(--ink-3);opacity:.35}
.ad-step .ar.p{border-right:1px solid var(--line-2)}.ad-step .ar.n{border-left:1px solid var(--line-2)}
/* v857 (André 8/10: "Tillbaka ser samma ut som bläddra"): pilarna pekar upp och ned (föregående, nästa), så de inte liknar tillbaka-pilen. */
.ad-step .ar.p svg{transform:rotate(-90deg)}.ad-step .ar.n svg{transform:rotate(90deg)}
.ad-step .mid{display:flex;align-items:baseline;gap:7px;padding:0 11px;align-self:center;min-width:0;white-space:nowrap}
.ad-step .cd{color:var(--ink)}
.ad-step .of{font-family:"Geist Mono",monospace;font-size:11px;letter-spacing:0;color:var(--ink-3)}
.ad-tkh-id .ad-step-w{flex:none;font-size:14px;letter-spacing:.06em}
/* v858 (André 8/10: "Gör pil tillbaka tydligare … man ser den knappt, vit på svart"): Tillbaka har blå ton, tydligare ram och tjockare pil, så den skiljer sig från stegarens pilar. */
.tk-back{width:40px;height:40px;border-color:rgba(91,168,255,.55);background:rgba(91,168,255,.16);color:#E0F2FE}
.tk-back:hover{background:rgba(91,168,255,.26);border-color:rgba(91,168,255,.8)}
.tk-back svg,.tk-back svg *{stroke-width:2.6}