.note-board { margin: 12px 0 20px; }
.note-board[hidden], .side-box[hidden] { display: none !important; }
.qr-btn[hidden] { display: none !important; }
.act-form [hidden] { display: none !important; }
.composer2.note .mail-documents { display: none; }
.mail-documents label > span { min-width: 0; overflow-wrap: anywhere; }
.customer-tab-order { padding: 8px 0; font-size: 12px; }
.customer-tab-order summary { cursor: pointer; color: var(--muted); }
.tab-order-buttons { display: grid; grid-template-columns: repeat(auto-fit,minmax(210px,1fr)); gap: 8px; padding: 12px 0; }
.tab-order-buttons > div { display: flex; align-items: center; gap: 6px; }
.tab-order-buttons span { flex: 1; }
.note-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 10px; }
.note-head h4 { margin: 0 auto 0 0; }
.note-head label { font-size: 11px; color: var(--muted); }
.note-head select { display: block; padding: 6px; border: 1px solid var(--line); border-radius: 5px; background: var(--card); color: var(--text); }
.note-list { display: grid; gap: 8px; }
.note-card { display: flex; gap: 8px; justify-content: space-between; align-items: flex-start; width: 100%; padding: 12px; border: 1px solid var(--line); border-left: 3px solid #d5d5d0; border-radius: 7px; background: var(--card); color: var(--text); text-align: left; cursor: pointer; font: inherit; }
.note-card.urgent { border-left-color: var(--red); }
.note-card small { display: block; color: var(--muted); margin-top: 5px; font-size: 11px; }
.note-card > span:first-child { min-width: 0; overflow-wrap: anywhere; }
.note-card .badge { flex-shrink: 0; }
.workspace-form { display: grid; gap: 9px; margin: 12px 0; }
.workspace-form input:not([type=checkbox]), .workspace-form textarea, .note-rename input { width: 100%; box-sizing: border-box; padding: 10px; border: 1px solid var(--line); border-radius: 6px; color: var(--text); background: var(--card); font: inherit; }
.workspace-form label { font-size: 12px; font-weight: 600; }
.workspace-form > button { justify-self: start; }
.note-options { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.note-options label { display: inline-flex; gap: 6px; align-items: center; margin-right: 12px; }
.thread-message { background: var(--bg); padding: 12px; margin: 10px 0; border-radius: 6px; overflow-wrap: anywhere; }
.thread-message p { white-space: pre-wrap; margin-bottom: 0; }
.thread-message small { color: var(--muted); }
.note-rename { display: grid; gap: 8px; margin: 12px 0; }
.note-rename button { justify-self: start; }
.overview-link { border: 0; border-bottom: 1px solid var(--line); background: transparent; display: block; width: 100%; text-align: left; padding: 10px 0; color: var(--text); font: inherit; cursor: pointer; }
.overview-link small { display: block; color: var(--muted); }
.activity-history { padding: 10px; border-bottom: 1px solid var(--line); }
.activity-history summary { cursor: pointer; }
.act-item .ops { flex-wrap: wrap; }
.product-choices { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.product-choices label { display: flex; align-items: center; gap: 8px; padding: 14px; border: 1px solid var(--line); border-radius: 6px; background: var(--card); }
.product-choices label:has(:checked) { background: var(--yellow-soft); border-color: var(--yellow); }
.offer-drafts article { padding: 14px; border: 1px solid var(--line); border-radius: 6px; margin-bottom: 12px; overflow-wrap: anywhere; }
.ba-chip.vorhanden { background: #e2f2e9; color: #267043; }
.cstatus { grid-template-columns: repeat(3, minmax(0, 1fr)); }
/* Handy: Status und Termin nebeneinander, Aufgaben darunter über die volle Breite */
@media (max-width: 480px) { .cstatus { grid-template-columns: repeat(2, minmax(0, 1fr)); } .cstatus > :nth-child(3) { grid-column: 1 / -1; border-left: 0; border-top: 1px solid var(--line); } }
@media (max-width: 900px) { .product-choices { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 900px) { .comm-grid > aside { grid-row: 1; } .customer-overview { max-height: 320px; overflow-y: auto; } }
@media (max-width: 480px) { .product-choices { grid-template-columns: 1fr; } .note-card { flex-wrap: wrap; } .note-head label { flex: 1; } .note-head select { width: 100%; } .note-head h4 { width: 100%; } }
/* Notizthemen: aufklappen und direkt unter der Notiz antworten */
.note-item { border-radius: 7px; }
.note-item.expanded { border: 1px solid var(--line); background: var(--card); }
.note-item.expanded > .note-card { border: 0; border-left: 3px solid #d5d5d0; border-radius: 7px 7px 0 0; }
.note-item.expanded > .note-card.urgent { border-left-color: var(--red); }
.note-thread { padding: 0 12px 12px 15px; border-left: 3px solid #d5d5d0; border-radius: 0 0 0 7px; }
.note-item.expanded > .note-card.urgent + .note-thread { border-left-color: var(--red); }
.note-thread .thread-message { margin: 8px 0; }
.note-thread .thread-message.reply { margin-left: 16px; background: var(--yellow-soft); }
.note-reply { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: end; margin: 8px 0 4px; }
.note-reply textarea { width: 100%; box-sizing: border-box; padding: 8px 10px; border: 1px solid var(--line); border-radius: 6px; font: inherit; resize: vertical; background: var(--card); color: var(--text); }
.note-reply textarea:focus { outline: 0; border-color: var(--yellow); }
.note-history { font-size: 12px; color: var(--muted); }
.note-history summary { cursor: pointer; }
.note-thread .note-rename { margin: 8px 0; }
@media (max-width: 480px) { .note-reply { grid-template-columns: 1fr; } .note-reply .btn { justify-self: start; } .note-thread .thread-message.reply { margin-left: 8px; } }
/* Interne Notizen als Einträge im Gesamtverlauf */
.msg.note-off { display: none !important; }
.note-tools { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; margin: 8px 0 12px; font-size: 12px; color: var(--muted); }
.note-tools[hidden] { display: none !important; }
.note-tools select { margin-left: 4px; padding: 4px 6px; border: 1px solid var(--line); border-radius: 5px; background: var(--card); color: var(--text); font: inherit; }
.note-msg .note-main { min-width: 0; flex: 1; }
.note-msg .bubble.note.urgent { border-left: 3px solid var(--red); }
.note-title { display: block; margin-bottom: 2px; }
.note-body { white-space: pre-wrap; overflow-wrap: anywhere; }
.note-meta { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 8px; }
.note-toggle { margin-left: auto; border: 0; background: none; padding: 0; font: inherit; font-size: 12px; font-weight: 600; color: var(--yellow-text); cursor: pointer; }
.note-toggle:hover { text-decoration: underline; }
.note-msg .note-thread { border-left: 2px solid #f6dfa6; margin: 6px 0 0 8px; padding: 0 0 4px 12px; border-radius: 0; }
.note-msg .note-thread .thread-message.reply { margin-left: 0; }
.note-msg .note-options { margin: 6px 0; }
/* Notiz: „Kommentare anzeigen“ und „Antworten“ als getrennte Schaltflächen */
.note-actions { margin-left: auto; display: inline-flex; flex-wrap: wrap; gap: 4px 14px; }
.note-actions .note-toggle { margin-left: 0; }
.note-answer { color: var(--ink); }
.note-reply-btns { display: flex; gap: 6px; align-items: center; }
.note-msg .note-thread-reply { border-left-color: var(--yellow); }
@media (max-width: 480px) { .note-actions { margin-left: 0; width: 100%; } }
/* Notiz nachträglich bearbeiten */
.note-edit { display: grid; gap: 6px; }
.note-edit label { font-size: 11.5px; font-weight: 600; color: var(--yellow-text); }
.note-edit input, .note-edit textarea { width: 100%; box-sizing: border-box; padding: 8px 10px; border: 1px solid #f6dfa6; border-radius: 6px; background: #fffaf0; color: var(--text); font: inherit; }
.note-edit input { font-weight: 600; }
.note-edit input:focus, .note-edit textarea:focus { outline: 0; border-color: var(--yellow); }
.note-edit textarea { resize: vertical; }
.note-edited { display: block; margin-top: 4px; font-size: 11px; color: var(--muted); font-style: italic; }
.note-edit .note-options { margin: 2px 0; }
.offer-types { margin-bottom: 4px; } @media (max-width: 480px) { .offer-types { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* Angebote nach Kategorie filtern */
.offer-filter { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 18px 0 10px; }
.offer-filter h4 { margin: 0; }
.offer-filter .fp-chips { display: flex; flex-wrap: wrap; gap: 4px; }
.offer-filter .fp-chips button { border: 1px solid var(--line); background: var(--card); border-radius: 999px; padding: 3px 10px; font-size: 12px; font-weight: 600; color: var(--muted); display: inline-flex; align-items: center; gap: 5px; cursor: pointer; }
.offer-filter .fp-chips button.on { background: var(--ink); color: var(--yellow); border-color: var(--ink); }
.offer-filter .fp-chips .n { font-weight: 500; opacity: .75; }
.offer-drafts article[hidden], .offer-empty[hidden] { display: none; }
/* Kommunikation: Verlauf einklappbar (startet geschlossen) */
.feed-wrap { border: 1px solid var(--line); border-radius: var(--r); background: var(--card); margin-top: 12px; }
.feed-wrap > summary { list-style: none; cursor: pointer; display: flex; gap: 10px; align-items: center; padding: 10px 14px; background: #f1f0ec; border-radius: var(--r); font-size: 13.5px; }
.feed-wrap[open] > summary { border-bottom: 1px solid var(--line); border-radius: var(--r) var(--r) 0 0; }
.feed-wrap > summary::-webkit-details-marker { display: none; }
.feed-wrap > summary::before { content: ''; width: 7px; height: 7px; border-right: 2px solid var(--muted); border-bottom: 2px solid var(--muted); transform: rotate(-45deg); transition: transform .15s; flex: none; }
.feed-wrap[open] > summary::before { transform: rotate(45deg); }
.feed-wrap .feed-sum-meta { font-size: 12px; color: var(--muted); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.feed-wrap > #feed { padding: 4px 12px 10px; }