/* Phase 2: Tickets */
.nav-count{margin-left:auto;font-size:.7rem;font-weight:700;background:var(--accent-subtle);color:var(--accent-dark);padding:.05rem .45rem;border-radius:99px}
.nav-count.red{background:#fee2e2;color:#b91c1c}
.tabs{display:flex;gap:.3rem;flex-wrap:wrap;margin-bottom:.8rem;max-width:1000px}
.tab{padding:.35rem .8rem;border-radius:99px;border:1.5px solid var(--border);background:#fff;font-size:.82rem;font-weight:600;color:var(--text-2)}
.tab.active{background:var(--accent);border-color:var(--accent-dark);color:#fff}
.tab .cnt{opacity:.8;margin-left:.2rem}

.prio{width:10px;height:10px;border-radius:50%;flex-shrink:0;display:inline-block}
.prio-niedrig{background:#3b82f6}.prio-normal{background:#9ca3af}.prio-hoch{background:#f59e0b}.prio-dringend{background:#dc2626}
.card.prio-card-dringend{border-left:5px solid #dc2626}
.card.prio-card-hoch{border-left:5px solid #f59e0b}
.tno{font-family:ui-monospace,Consolas,monospace;font-size:.78rem;color:var(--muted)}
.st{font-size:.7rem;font-weight:700;padding:.1rem .5rem;border-radius:99px;white-space:nowrap}
.st-neu{background:#fee2e2;color:#b91c1c}
.st-in_arbeit{background:#dbeafe;color:#1d4ed8}
.st-termin{background:#ede9fe;color:#6d28d9}
.st-wartet_kunde,.st-wartet_teile,.st-wartet_dritte{background:#fef3c7;color:#92400e}
.st-erledigt{background:#dcfce7;color:#15803d}
.st-geschlossen{background:#e5e7eb;color:#4b5563}
.warn-box{background:#fef3c7;border:1.5px solid #f59e0b;border-radius:var(--r-md);padding:.7rem 1rem;margin-bottom:1rem;max-width:1000px;display:flex;gap:.6rem;align-items:center;flex-wrap:wrap}
.warn-box span{flex:1;min-width:200px}

.detail-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:.6rem 1rem}
.detail-grid label{display:block;font-size:.72rem;color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:.04em;margin-bottom:.15rem}
.detail-grid select,.detail-grid input{padding:.35rem .55rem}

/* Verlauf */
.timeline{display:flex;flex-direction:column;gap:.6rem}
.entry{border:1.5px solid var(--border);border-radius:var(--r-md);background:#fff;overflow:hidden}
.entry-head{display:flex;gap:.5rem;align-items:center;padding:.4rem .8rem;font-size:.8rem;color:var(--text-2);background:var(--bg-surface);flex-wrap:wrap}
.entry-head .who{font-weight:700;flex:1;min-width:150px;word-break:break-all}
.entry-head .when{color:var(--muted);white-space:nowrap}
.entry-body{padding:.6rem .8rem;white-space:pre-wrap;word-break:break-word;font-size:.9rem}
.entry.mail_ein{border-color:#93c5fd}.entry.mail_ein .entry-head{background:#eff6ff}
.entry.mail_aus{border-color:#86efac}.entry.mail_aus .entry-head{background:#f0fdf4}
.entry.notiz{border-color:var(--card-border)}.entry.notiz .entry-head{background:var(--card-bg)}
.entry.status{border:none;background:none}
.entry.status .entry-head{background:none;color:var(--muted);font-size:.78rem;padding:.1rem .4rem;justify-content:center}
.entry-body.collapsed{max-height:16em;overflow:hidden;position:relative}
.entry-body.collapsed::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3em;background:linear-gradient(transparent,#fff)}
.more{font-size:.78rem;padding:.2rem .8rem .5rem;color:var(--accent-dark);font-weight:600}
.att-list{display:flex;flex-wrap:wrap;gap:.4rem;padding:0 .8rem .6rem}
.att{display:inline-flex;align-items:center;gap:.3rem;border:1.5px solid var(--border);border-radius:99px;padding:.15rem .6rem;font-size:.78rem;background:#fff;max-width:100%}
.att a{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.att button{color:var(--muted);font-size:.75rem}

/* Antworten / Notiz */
.composer-tabs{display:flex;gap:.3rem;margin-bottom:.6rem}
.composer textarea{min-height:140px}
.composer .row{display:flex;gap:.6rem;flex-wrap:wrap;align-items:center;margin-top:.6rem}
.composer .row label{font-size:.8rem;color:var(--text-2)}
.pick-att{display:flex;flex-wrap:wrap;gap:.3rem .9rem;font-size:.82rem;margin-top:.4rem}
.pick-att label{display:flex;align-items:center;gap:.3rem}
.pick-att input{width:auto}

@media (max-width:800px){
  .detail-grid{grid-template-columns:1fr 1fr}
}
