@propbinder/mobile-design 0.3.2 → 0.3.32

package/fesm2022/propbinder-mobile-design.mjs

@@ -9729,6 +9729,14 @@ class DsMobileMessageBubbleComponent {
      * Sender's name (for display purposes)
      */
     senderName = input('', ...(ngDevMode ? [{ debugName: "senderName" }] : []));
+    /**
+     * Whether the message is an internal message
+     */
+    isInternal = input(false, ...(ngDevMode ? [{ debugName: "isInternal" }] : []));
+    /**
+     * Text for the internal message badge
+     */
+    internalMessageBadgeText = input('Intern besked', ...(ngDevMode ? [{ debugName: "internalMessageBadgeText" }] : []));
     /**
      * Timestamp text (e.g., "12:34", "08-12-2025 13:18")
      */
@@ -9900,7 +9908,7 @@ class DsMobileMessageBubbleComponent {
         this.longPress.emit();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: DsMobileMessageBubbleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: DsMobileMessageBubbleComponent, isStandalone: true, selector: "ds-mobile-message-bubble", inputs: { content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: true, transformFunction: null }, isOwnMessage: { classPropertyName: "isOwnMessage", publicName: "isOwnMessage", isSignal: true, isRequired: false, transformFunction: null }, senderName: { classPropertyName: "senderName", publicName: "senderName", isSignal: true, isRequired: false, transformFunction: null }, timestamp: { classPropertyName: "timestamp", publicName: "timestamp", isSignal: true, isRequired: true, transformFunction: null }, showTimestamp: { classPropertyName: "showTimestamp", publicName: "showTimestamp", isSignal: true, isRequired: false, transformFunction: null }, avatarInitials: { classPropertyName: "avatarInitials", publicName: "avatarInitials", isSignal: true, isRequired: false, transformFunction: null }, avatarType: { classPropertyName: "avatarType", publicName: "avatarType", isSignal: true, isRequired: false, transformFunction: null }, avatarSrc: { classPropertyName: "avatarSrc", publicName: "avatarSrc", isSignal: true, isRequired: false, transformFunction: null }, showAvatar: { classPropertyName: "showAvatar", publicName: "showAvatar", isSignal: true, isRequired: false, transformFunction: null }, clusterPosition: { classPropertyName: "clusterPosition", publicName: "clusterPosition", isSignal: true, isRequired: false, transformFunction: null }, attachments: { classPropertyName: "attachments", publicName: "attachments", isSignal: true, isRequired: false, transformFunction: null }, clickable: { classPropertyName: "clickable", publicName: "clickable", isSignal: true, isRequired: false, transformFunction: null }, isNewMessage: { classPropertyName: "isNewMessage", publicName: "isNewMessage", isSignal: true, isRequired: false, transformFunction: null }, isDeleted: { classPropertyName: "isDeleted", publicName: "isDeleted", isSignal: true, isRequired: false, transformFunction: null }, showEditedHint: { classPropertyName: "showEditedHint", publicName: "showEditedHint", isSignal: true, isRequired: false, transformFunction: null }, editedHintText: { classPropertyName: "editedHintText", publicName: "editedHintText", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { attachmentClick: "attachmentClick", longPress: "longPress", messageClick: "messageClick" }, host: { listeners: { "touchstart": "handleTouchStart($event)", "touchend": "handleTouchEnd($event)", "touchmove": "handleTouchMove($event)", "contextmenu": "handleContextMenu($event)" }, properties: { "class.is-own-message": "isOwnMessage()", "class.has-attachments": "attachments() && attachments()!.length > 0", "class.cluster-single": "clusterPosition() === \"single\"", "class.cluster-first": "clusterPosition() === \"first\"", "class.cluster-middle": "clusterPosition() === \"middle\"", "class.cluster-last": "clusterPosition() === \"last\"", "class.tapped": "isTapped", "class.is-new-message": "isNewMessage()", "class.is-deleted": "isDeleted()" } }, ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: DsMobileMessageBubbleComponent, isStandalone: true, selector: "ds-mobile-message-bubble", inputs: { content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: true, transformFunction: null }, isOwnMessage: { classPropertyName: "isOwnMessage", publicName: "isOwnMessage", isSignal: true, isRequired: false, transformFunction: null }, senderName: { classPropertyName: "senderName", publicName: "senderName", isSignal: true, isRequired: false, transformFunction: null }, isInternal: { classPropertyName: "isInternal", publicName: "isInternal", isSignal: true, isRequired: false, transformFunction: null }, internalMessageBadgeText: { classPropertyName: "internalMessageBadgeText", publicName: "internalMessageBadgeText", isSignal: true, isRequired: false, transformFunction: null }, timestamp: { classPropertyName: "timestamp", publicName: "timestamp", isSignal: true, isRequired: true, transformFunction: null }, showTimestamp: { classPropertyName: "showTimestamp", publicName: "showTimestamp", isSignal: true, isRequired: false, transformFunction: null }, avatarInitials: { classPropertyName: "avatarInitials", publicName: "avatarInitials", isSignal: true, isRequired: false, transformFunction: null }, avatarType: { classPropertyName: "avatarType", publicName: "avatarType", isSignal: true, isRequired: false, transformFunction: null }, avatarSrc: { classPropertyName: "avatarSrc", publicName: "avatarSrc", isSignal: true, isRequired: false, transformFunction: null }, showAvatar: { classPropertyName: "showAvatar", publicName: "showAvatar", isSignal: true, isRequired: false, transformFunction: null }, clusterPosition: { classPropertyName: "clusterPosition", publicName: "clusterPosition", isSignal: true, isRequired: false, transformFunction: null }, attachments: { classPropertyName: "attachments", publicName: "attachments", isSignal: true, isRequired: false, transformFunction: null }, clickable: { classPropertyName: "clickable", publicName: "clickable", isSignal: true, isRequired: false, transformFunction: null }, isNewMessage: { classPropertyName: "isNewMessage", publicName: "isNewMessage", isSignal: true, isRequired: false, transformFunction: null }, isDeleted: { classPropertyName: "isDeleted", publicName: "isDeleted", isSignal: true, isRequired: false, transformFunction: null }, showEditedHint: { classPropertyName: "showEditedHint", publicName: "showEditedHint", isSignal: true, isRequired: false, transformFunction: null }, editedHintText: { classPropertyName: "editedHintText", publicName: "editedHintText", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { attachmentClick: "attachmentClick", longPress: "longPress", messageClick: "messageClick" }, host: { listeners: { "touchstart": "handleTouchStart($event)", "touchend": "handleTouchEnd($event)", "touchmove": "handleTouchMove($event)", "contextmenu": "handleContextMenu($event)" }, properties: { "class.is-own-message": "isOwnMessage()", "class.has-attachments": "attachments() && attachments()!.length > 0", "class.cluster-single": "clusterPosition() === \"single\"", "class.cluster-first": "clusterPosition() === \"first\"", "class.cluster-middle": "clusterPosition() === \"middle\"", "class.cluster-last": "clusterPosition() === \"last\"", "class.tapped": "isTapped", "class.is-new-message": "isNewMessage()", "class.is-deleted": "isDeleted()" } }, ngImport: i0, template: `
     @if (!isOwnMessage()) {
       <div class="avatar-wrapper" [class.hidden]="!showAvatar()">
         <ds-avatar
@@ -9912,7 +9920,13 @@ class DsMobileMessageBubbleComponent {
     }
     
     <div class="message-content-wrapper" (click)="handleClick($event)">
-      <div class="message-bubble">
+      @if (isInternal()) {
+        <div class="internal-message-badge">
+          <ds-icon name="remixLockLine" size="12px"></ds-icon>
+          <span>{{ internalMessageBadgeText() }}</span>
+        </div>
+      }
+      <div class="message-bubble" [class.is-internal]="isInternal()">
         <!-- Only show text if content is not empty -->
         @if (content().trim()) {
           <p class="message-text">{{ content() }}</p>
@@ -9949,7 +9963,7 @@ class DsMobileMessageBubbleComponent {
         </div>
       </div>
     </div>
-  `, isInline: true, styles: [":host{display:flex;gap:8px;margin-bottom:4px;width:100%;align-items:flex-end;box-sizing:border-box}:host.cluster-single{margin-bottom:12px}:host.cluster-first{margin-bottom:2px}:host.cluster-middle{margin-bottom:2px}:host.cluster-last{margin-bottom:12px}:host:not(.is-own-message){justify-content:flex-start!important;flex-direction:row!important}:host.is-own-message{justify-content:flex-end!important;flex-direction:row-reverse!important;margin-left:auto!important;margin-right:0!important}.avatar-wrapper{flex-shrink:0;display:flex;align-items:flex-end;width:32px}.avatar-wrapper.hidden{visibility:hidden}.message-content-wrapper{display:flex;flex-direction:column;gap:0;max-width:75%;min-width:0}:host:not(.is-own-message) .message-content-wrapper{align-items:flex-start}:host.is-own-message .message-content-wrapper{align-items:flex-end!important;margin-left:auto!important;margin-right:0!important}.message-bubble{padding:8px 12px;border-radius:20px;position:relative;word-wrap:break-word;white-space:pre-wrap;max-width:100%;display:flex;flex-direction:column;transition:transform var(--spring-bouncy),border-radius var(--spring-bouncy);will-change:transform,border-radius}:host:active .message-bubble{transform:scale(.98);transition:transform .1s ease-out,border-radius .1s ease-out}:host.is-own-message.cluster-first .message-bubble{border-radius:20px 20px 4px}:host.is-own-message.cluster-middle .message-bubble{border-radius:20px 4px 4px 20px}:host.is-own-message.cluster-last .message-bubble{border-radius:20px 4px 20px 20px}:host:not(.is-own-message).cluster-first .message-bubble{border-radius:20px 20px 20px 4px}:host:not(.is-own-message).cluster-middle .message-bubble{border-radius:4px 20px 20px 4px}:host:not(.is-own-message).cluster-last .message-bubble{border-radius:4px 20px 20px}:host:not(.is-own-message) .message-bubble{background:var(--color-background-neutral-secondary, #f5f5f5)}:host.is-own-message .message-bubble{background:var(--color-accent, var(--color-accent, #6B5FF5));color:var(--color-on-accent, #ffffff)}.message-text{font-family:Brockmann,sans-serif;font-size:var(--font-size-sm);font-weight:400;line-height:20px;letter-spacing:-.3px;margin:0}:host:not(.is-own-message) .message-text{color:var(--color-text-primary, #1a1a1a)}:host.is-own-message .message-text{color:var(--color-on-accent, #ffffff)}:host.is-deleted .message-bubble{background:var(--color-background-neutral-secondary, #f5f5f5)!important}:host.is-deleted.is-own-message .message-bubble{background:var(--color-background-neutral-tertiary, #e8e8e8)!important}:host.is-deleted .message-text{font-style:italic;color:var(--text-color-default-tertiary, #737373)!important}:host.is-deleted.is-own-message .message-text{color:var(--text-color-default-secondary, #545b66)!important}.edited-hint{font-family:Brockmann,sans-serif;font-size:10px;font-weight:400;opacity:.75;margin:4px 0 0;align-self:flex-end}:host:not(.is-own-message) .edited-hint{align-self:flex-start;color:var(--text-color-default-tertiary, #737373)}:host.is-own-message .edited-hint{color:var(--color-on-accent, #ffffff)}.attachments{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}:host:not(.is-own-message) .attachments{justify-content:flex-start}:host.is-own-message .attachments{justify-content:flex-end}.attachment-item{display:flex;align-items:center;gap:8px;padding:8px 12px;background:var(--color-background-neutral-secondary, #f5f5f5);border-radius:8px;border:1px solid var(--border-color-default, #e5e5e5);cursor:pointer;transition:background .2s ease}:host.is-own-message .attachment-item{background:#fff3;border-color:#ffffff4d}.attachment-item:active{background:var(--color-background-neutral-secondary-hover, #ebebeb)}:host.is-own-message .attachment-item:active{background:#ffffff4d}.attachment-icon{flex-shrink:0;width:24px;height:24px;display:flex;align-items:center;justify-content:center;border-radius:4px;background:var(--color-background-neutral-primary, #ffffff)}:host.is-own-message .attachment-icon{background:#ffffff4d}.attachment-name{font-family:Brockmann,sans-serif;font-size:var(--font-size-xs);font-weight:500;line-height:16px;color:var(--color-text-primary, #1a1a1a);max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host.is-own-message .attachment-name{color:var(--color-text-on-brand, #ffffff)}.message-footer{display:flex;align-items:center;gap:4px;align-self:flex-end;height:0;margin-top:0;opacity:0;overflow:hidden;transform:scale(.95);transition:height var(--spring-bouncy),margin-top var(--spring-bouncy),opacity var(--spring-bouncy),transform var(--spring-bouncy)}.message-footer.visible{height:14px;margin-top:4px;opacity:1;transform:scale(1)}:host:not(.is-own-message) .message-footer{align-self:flex-end}.timestamp{font-family:Brockmann,sans-serif;font-size:11px;font-weight:400;line-height:14px;white-space:nowrap}:host:not(.is-own-message) .timestamp{color:var(--color-text-tertiary, #a0a0a0)}:host.is-own-message .timestamp{color:var(--color-on-accent, #ffffff);opacity:.7}:host{-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}:host.is-new-message{animation:message-appear var(--spring-bouncy) forwards}@keyframes message-appear{0%{opacity:0;transform:translateY(20px) scale(.92)}to{opacity:1;transform:translateY(0) scale(1)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: DsAvatarComponent, selector: "ds-avatar", inputs: ["type", "size", "initials", "src", "alt", "iconName", "iconColor"] }, { kind: "component", type: DsIconComponent, selector: "ds-icon", inputs: ["name", "size", "color", "interactive"] }] });
+  `, isInline: true, styles: [":host{display:flex;gap:8px;margin-bottom:4px;width:100%;align-items:flex-end;box-sizing:border-box}:host.cluster-single{margin-bottom:12px}:host.cluster-first{margin-bottom:2px}:host.cluster-middle{margin-bottom:2px}:host.cluster-last{margin-bottom:12px}:host:not(.is-own-message){justify-content:flex-start!important;flex-direction:row!important}:host.is-own-message{justify-content:flex-end!important;flex-direction:row-reverse!important;margin-left:auto!important;margin-right:0!important}.avatar-wrapper{flex-shrink:0;display:flex;align-items:flex-end;width:32px}.avatar-wrapper.hidden{visibility:hidden}.message-content-wrapper{display:flex;flex-direction:column;gap:0;max-width:75%;min-width:0}:host:not(.is-own-message) .message-content-wrapper{align-items:flex-start}:host.is-own-message .message-content-wrapper{align-items:flex-end!important;margin-left:auto!important;margin-right:0!important}.message-bubble{padding:8px 12px;border-radius:20px;position:relative;word-wrap:break-word;white-space:pre-wrap;max-width:100%;display:flex;flex-direction:column;transition:transform var(--spring-bouncy),border-radius var(--spring-bouncy);will-change:transform,border-radius}:host:active .message-bubble{transform:scale(.98);transition:transform .1s ease-out,border-radius .1s ease-out}:host.is-own-message.cluster-first .message-bubble{border-radius:20px 20px 4px}:host.is-own-message.cluster-middle .message-bubble{border-radius:20px 4px 4px 20px}:host.is-own-message.cluster-last .message-bubble{border-radius:20px 4px 20px 20px}:host:not(.is-own-message).cluster-first .message-bubble{border-radius:20px 20px 20px 4px}:host:not(.is-own-message).cluster-middle .message-bubble{border-radius:4px 20px 20px 4px}:host:not(.is-own-message).cluster-last .message-bubble{border-radius:4px 20px 20px}:host:not(.is-own-message) .message-bubble{background:var(--color-background-neutral-secondary, #f5f5f5)}:host.is-own-message .message-bubble{background:var(--color-accent, var(--color-accent, #6B5FF5));color:var(--color-on-accent, #ffffff)}.message-text{font-family:Brockmann,sans-serif;font-size:var(--font-size-sm);font-weight:400;line-height:20px;letter-spacing:-.3px;margin:0}:host:not(.is-own-message) .message-text{color:var(--color-text-primary, #1a1a1a)}:host.is-own-message .message-text{color:var(--color-on-accent, #ffffff)}:host.is-deleted .message-bubble{background:var(--color-background-neutral-secondary, #f5f5f5)!important}:host.is-deleted.is-own-message .message-bubble{background:var(--color-background-neutral-tertiary, #e8e8e8)!important}:host.is-deleted .message-text{font-style:italic;color:var(--text-color-default-tertiary, #737373)!important}:host.is-deleted.is-own-message .message-text{color:var(--text-color-default-secondary, #545b66)!important}.edited-hint{font-family:Brockmann,sans-serif;font-size:10px;font-weight:400;opacity:.75;margin:4px 0 0;align-self:flex-end}:host:not(.is-own-message) .edited-hint{align-self:flex-start;color:var(--text-color-default-tertiary, #737373)}:host.is-own-message .edited-hint{color:var(--color-on-accent, #ffffff)}.attachments{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}:host:not(.is-own-message) .attachments{justify-content:flex-start}:host.is-own-message .attachments{justify-content:flex-end}.attachment-item{display:flex;align-items:center;gap:8px;padding:8px 12px;background:var(--color-background-neutral-secondary, #f5f5f5);border-radius:8px;border:1px solid var(--border-color-default, #e5e5e5);cursor:pointer;transition:background .2s ease}:host.is-own-message .attachment-item{background:#fff3;border-color:#ffffff4d}.attachment-item:active{background:var(--color-background-neutral-secondary-hover, #ebebeb)}:host.is-own-message .attachment-item:active{background:#ffffff4d}.attachment-icon{flex-shrink:0;width:24px;height:24px;display:flex;align-items:center;justify-content:center;border-radius:4px;background:var(--color-background-neutral-primary, #ffffff)}:host.is-own-message .attachment-icon{background:#ffffff4d}.attachment-name{font-family:Brockmann,sans-serif;font-size:var(--font-size-xs);font-weight:500;line-height:16px;color:var(--color-text-primary, #1a1a1a);max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host.is-own-message .attachment-name{color:var(--color-text-on-brand, #ffffff)}.message-footer{display:flex;align-items:center;gap:4px;align-self:flex-end;height:0;margin-top:0;opacity:0;overflow:hidden;transform:scale(.95);transition:height var(--spring-bouncy),margin-top var(--spring-bouncy),opacity var(--spring-bouncy),transform var(--spring-bouncy)}.message-footer.visible{height:14px;margin-top:4px;opacity:1;transform:scale(1)}:host:not(.is-own-message) .message-footer{align-self:flex-end}.timestamp{font-family:Brockmann,sans-serif;font-size:11px;font-weight:400;line-height:14px;white-space:nowrap}:host:not(.is-own-message) .timestamp{color:var(--color-text-tertiary, #a0a0a0)}:host.is-own-message .timestamp{color:var(--color-on-accent, #ffffff);opacity:.7}:host{-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}:host.is-new-message{animation:message-appear var(--spring-bouncy) forwards}@keyframes message-appear{0%{opacity:0;transform:translateY(20px) scale(.92)}to{opacity:1;transform:translateY(0) scale(1)}}.message-bubble.is-internal{background:var(--color-background-warning-subtle, #fefce8)!important;border:1px solid var(--color-border-warning-muted, #fde047)}:host.is-own-message .message-bubble.is-internal{background:var(--color-background-warning-subtle, #fefce8)!important;color:var(--color-text-primary, #1a1a1a)}:host.is-own-message .message-bubble.is-internal .message-text{color:var(--color-text-primary, #1a1a1a)}.internal-message-badge{display:flex;align-items:center;gap:4px;font-family:Brockmann,sans-serif;font-size:11px;font-weight:500;color:var(--color-text-warning, #eab308);margin-bottom:4px;padding-left:12px}:host.is-own-message .internal-message-badge{align-self:flex-end;padding-left:0;padding-right:12px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: DsAvatarComponent, selector: "ds-avatar", inputs: ["type", "size", "initials", "src", "alt", "iconName", "iconColor"] }, { kind: "component", type: DsIconComponent, selector: "ds-icon", inputs: ["name", "size", "color", "interactive"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: DsMobileMessageBubbleComponent, decorators: [{
             type: Component,
@@ -9979,7 +9993,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
     }
     
     <div class="message-content-wrapper" (click)="handleClick($event)">
-      <div class="message-bubble">
+      @if (isInternal()) {
+        <div class="internal-message-badge">
+          <ds-icon name="remixLockLine" size="12px"></ds-icon>
+          <span>{{ internalMessageBadgeText() }}</span>
+        </div>
+      }
+      <div class="message-bubble" [class.is-internal]="isInternal()">
         <!-- Only show text if content is not empty -->
         @if (content().trim()) {
           <p class="message-text">{{ content() }}</p>
@@ -10016,8 +10036,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
         </div>
       </div>
     </div>
-  `, styles: [":host{display:flex;gap:8px;margin-bottom:4px;width:100%;align-items:flex-end;box-sizing:border-box}:host.cluster-single{margin-bottom:12px}:host.cluster-first{margin-bottom:2px}:host.cluster-middle{margin-bottom:2px}:host.cluster-last{margin-bottom:12px}:host:not(.is-own-message){justify-content:flex-start!important;flex-direction:row!important}:host.is-own-message{justify-content:flex-end!important;flex-direction:row-reverse!important;margin-left:auto!important;margin-right:0!important}.avatar-wrapper{flex-shrink:0;display:flex;align-items:flex-end;width:32px}.avatar-wrapper.hidden{visibility:hidden}.message-content-wrapper{display:flex;flex-direction:column;gap:0;max-width:75%;min-width:0}:host:not(.is-own-message) .message-content-wrapper{align-items:flex-start}:host.is-own-message .message-content-wrapper{align-items:flex-end!important;margin-left:auto!important;margin-right:0!important}.message-bubble{padding:8px 12px;border-radius:20px;position:relative;word-wrap:break-word;white-space:pre-wrap;max-width:100%;display:flex;flex-direction:column;transition:transform var(--spring-bouncy),border-radius var(--spring-bouncy);will-change:transform,border-radius}:host:active .message-bubble{transform:scale(.98);transition:transform .1s ease-out,border-radius .1s ease-out}:host.is-own-message.cluster-first .message-bubble{border-radius:20px 20px 4px}:host.is-own-message.cluster-middle .message-bubble{border-radius:20px 4px 4px 20px}:host.is-own-message.cluster-last .message-bubble{border-radius:20px 4px 20px 20px}:host:not(.is-own-message).cluster-first .message-bubble{border-radius:20px 20px 20px 4px}:host:not(.is-own-message).cluster-middle .message-bubble{border-radius:4px 20px 20px 4px}:host:not(.is-own-message).cluster-last .message-bubble{border-radius:4px 20px 20px}:host:not(.is-own-message) .message-bubble{background:var(--color-background-neutral-secondary, #f5f5f5)}:host.is-own-message .message-bubble{background:var(--color-accent, var(--color-accent, #6B5FF5));color:var(--color-on-accent, #ffffff)}.message-text{font-family:Brockmann,sans-serif;font-size:var(--font-size-sm);font-weight:400;line-height:20px;letter-spacing:-.3px;margin:0}:host:not(.is-own-message) .message-text{color:var(--color-text-primary, #1a1a1a)}:host.is-own-message .message-text{color:var(--color-on-accent, #ffffff)}:host.is-deleted .message-bubble{background:var(--color-background-neutral-secondary, #f5f5f5)!important}:host.is-deleted.is-own-message .message-bubble{background:var(--color-background-neutral-tertiary, #e8e8e8)!important}:host.is-deleted .message-text{font-style:italic;color:var(--text-color-default-tertiary, #737373)!important}:host.is-deleted.is-own-message .message-text{color:var(--text-color-default-secondary, #545b66)!important}.edited-hint{font-family:Brockmann,sans-serif;font-size:10px;font-weight:400;opacity:.75;margin:4px 0 0;align-self:flex-end}:host:not(.is-own-message) .edited-hint{align-self:flex-start;color:var(--text-color-default-tertiary, #737373)}:host.is-own-message .edited-hint{color:var(--color-on-accent, #ffffff)}.attachments{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}:host:not(.is-own-message) .attachments{justify-content:flex-start}:host.is-own-message .attachments{justify-content:flex-end}.attachment-item{display:flex;align-items:center;gap:8px;padding:8px 12px;background:var(--color-background-neutral-secondary, #f5f5f5);border-radius:8px;border:1px solid var(--border-color-default, #e5e5e5);cursor:pointer;transition:background .2s ease}:host.is-own-message .attachment-item{background:#fff3;border-color:#ffffff4d}.attachment-item:active{background:var(--color-background-neutral-secondary-hover, #ebebeb)}:host.is-own-message .attachment-item:active{background:#ffffff4d}.attachment-icon{flex-shrink:0;width:24px;height:24px;display:flex;align-items:center;justify-content:center;border-radius:4px;background:var(--color-background-neutral-primary, #ffffff)}:host.is-own-message .attachment-icon{background:#ffffff4d}.attachment-name{font-family:Brockmann,sans-serif;font-size:var(--font-size-xs);font-weight:500;line-height:16px;color:var(--color-text-primary, #1a1a1a);max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host.is-own-message .attachment-name{color:var(--color-text-on-brand, #ffffff)}.message-footer{display:flex;align-items:center;gap:4px;align-self:flex-end;height:0;margin-top:0;opacity:0;overflow:hidden;transform:scale(.95);transition:height var(--spring-bouncy),margin-top var(--spring-bouncy),opacity var(--spring-bouncy),transform var(--spring-bouncy)}.message-footer.visible{height:14px;margin-top:4px;opacity:1;transform:scale(1)}:host:not(.is-own-message) .message-footer{align-self:flex-end}.timestamp{font-family:Brockmann,sans-serif;font-size:11px;font-weight:400;line-height:14px;white-space:nowrap}:host:not(.is-own-message) .timestamp{color:var(--color-text-tertiary, #a0a0a0)}:host.is-own-message .timestamp{color:var(--color-on-accent, #ffffff);opacity:.7}:host{-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}:host.is-new-message{animation:message-appear var(--spring-bouncy) forwards}@keyframes message-appear{0%{opacity:0;transform:translateY(20px) scale(.92)}to{opacity:1;transform:translateY(0) scale(1)}}\n"] }]
-        }], propDecorators: { content: [{ type: i0.Input, args: [{ isSignal: true, alias: "content", required: true }] }], isOwnMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "isOwnMessage", required: false }] }], senderName: [{ type: i0.Input, args: [{ isSignal: true, alias: "senderName", required: false }] }], timestamp: [{ type: i0.Input, args: [{ isSignal: true, alias: "timestamp", required: true }] }], showTimestamp: [{ type: i0.Input, args: [{ isSignal: true, alias: "showTimestamp", required: false }] }], avatarInitials: [{ type: i0.Input, args: [{ isSignal: true, alias: "avatarInitials", required: false }] }], avatarType: [{ type: i0.Input, args: [{ isSignal: true, alias: "avatarType", required: false }] }], avatarSrc: [{ type: i0.Input, args: [{ isSignal: true, alias: "avatarSrc", required: false }] }], showAvatar: [{ type: i0.Input, args: [{ isSignal: true, alias: "showAvatar", required: false }] }], clusterPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "clusterPosition", required: false }] }], attachments: [{ type: i0.Input, args: [{ isSignal: true, alias: "attachments", required: false }] }], clickable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clickable", required: false }] }], isNewMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "isNewMessage", required: false }] }], isDeleted: [{ type: i0.Input, args: [{ isSignal: true, alias: "isDeleted", required: false }] }], showEditedHint: [{ type: i0.Input, args: [{ isSignal: true, alias: "showEditedHint", required: false }] }], editedHintText: [{ type: i0.Input, args: [{ isSignal: true, alias: "editedHintText", required: false }] }], attachmentClick: [{ type: i0.Output, args: ["attachmentClick"] }], longPress: [{ type: i0.Output, args: ["longPress"] }], messageClick: [{ type: i0.Output, args: ["messageClick"] }] } });
+  `, styles: [":host{display:flex;gap:8px;margin-bottom:4px;width:100%;align-items:flex-end;box-sizing:border-box}:host.cluster-single{margin-bottom:12px}:host.cluster-first{margin-bottom:2px}:host.cluster-middle{margin-bottom:2px}:host.cluster-last{margin-bottom:12px}:host:not(.is-own-message){justify-content:flex-start!important;flex-direction:row!important}:host.is-own-message{justify-content:flex-end!important;flex-direction:row-reverse!important;margin-left:auto!important;margin-right:0!important}.avatar-wrapper{flex-shrink:0;display:flex;align-items:flex-end;width:32px}.avatar-wrapper.hidden{visibility:hidden}.message-content-wrapper{display:flex;flex-direction:column;gap:0;max-width:75%;min-width:0}:host:not(.is-own-message) .message-content-wrapper{align-items:flex-start}:host.is-own-message .message-content-wrapper{align-items:flex-end!important;margin-left:auto!important;margin-right:0!important}.message-bubble{padding:8px 12px;border-radius:20px;position:relative;word-wrap:break-word;white-space:pre-wrap;max-width:100%;display:flex;flex-direction:column;transition:transform var(--spring-bouncy),border-radius var(--spring-bouncy);will-change:transform,border-radius}:host:active .message-bubble{transform:scale(.98);transition:transform .1s ease-out,border-radius .1s ease-out}:host.is-own-message.cluster-first .message-bubble{border-radius:20px 20px 4px}:host.is-own-message.cluster-middle .message-bubble{border-radius:20px 4px 4px 20px}:host.is-own-message.cluster-last .message-bubble{border-radius:20px 4px 20px 20px}:host:not(.is-own-message).cluster-first .message-bubble{border-radius:20px 20px 20px 4px}:host:not(.is-own-message).cluster-middle .message-bubble{border-radius:4px 20px 20px 4px}:host:not(.is-own-message).cluster-last .message-bubble{border-radius:4px 20px 20px}:host:not(.is-own-message) .message-bubble{background:var(--color-background-neutral-secondary, #f5f5f5)}:host.is-own-message .message-bubble{background:var(--color-accent, var(--color-accent, #6B5FF5));color:var(--color-on-accent, #ffffff)}.message-text{font-family:Brockmann,sans-serif;font-size:var(--font-size-sm);font-weight:400;line-height:20px;letter-spacing:-.3px;margin:0}:host:not(.is-own-message) .message-text{color:var(--color-text-primary, #1a1a1a)}:host.is-own-message .message-text{color:var(--color-on-accent, #ffffff)}:host.is-deleted .message-bubble{background:var(--color-background-neutral-secondary, #f5f5f5)!important}:host.is-deleted.is-own-message .message-bubble{background:var(--color-background-neutral-tertiary, #e8e8e8)!important}:host.is-deleted .message-text{font-style:italic;color:var(--text-color-default-tertiary, #737373)!important}:host.is-deleted.is-own-message .message-text{color:var(--text-color-default-secondary, #545b66)!important}.edited-hint{font-family:Brockmann,sans-serif;font-size:10px;font-weight:400;opacity:.75;margin:4px 0 0;align-self:flex-end}:host:not(.is-own-message) .edited-hint{align-self:flex-start;color:var(--text-color-default-tertiary, #737373)}:host.is-own-message .edited-hint{color:var(--color-on-accent, #ffffff)}.attachments{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}:host:not(.is-own-message) .attachments{justify-content:flex-start}:host.is-own-message .attachments{justify-content:flex-end}.attachment-item{display:flex;align-items:center;gap:8px;padding:8px 12px;background:var(--color-background-neutral-secondary, #f5f5f5);border-radius:8px;border:1px solid var(--border-color-default, #e5e5e5);cursor:pointer;transition:background .2s ease}:host.is-own-message .attachment-item{background:#fff3;border-color:#ffffff4d}.attachment-item:active{background:var(--color-background-neutral-secondary-hover, #ebebeb)}:host.is-own-message .attachment-item:active{background:#ffffff4d}.attachment-icon{flex-shrink:0;width:24px;height:24px;display:flex;align-items:center;justify-content:center;border-radius:4px;background:var(--color-background-neutral-primary, #ffffff)}:host.is-own-message .attachment-icon{background:#ffffff4d}.attachment-name{font-family:Brockmann,sans-serif;font-size:var(--font-size-xs);font-weight:500;line-height:16px;color:var(--color-text-primary, #1a1a1a);max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host.is-own-message .attachment-name{color:var(--color-text-on-brand, #ffffff)}.message-footer{display:flex;align-items:center;gap:4px;align-self:flex-end;height:0;margin-top:0;opacity:0;overflow:hidden;transform:scale(.95);transition:height var(--spring-bouncy),margin-top var(--spring-bouncy),opacity var(--spring-bouncy),transform var(--spring-bouncy)}.message-footer.visible{height:14px;margin-top:4px;opacity:1;transform:scale(1)}:host:not(.is-own-message) .message-footer{align-self:flex-end}.timestamp{font-family:Brockmann,sans-serif;font-size:11px;font-weight:400;line-height:14px;white-space:nowrap}:host:not(.is-own-message) .timestamp{color:var(--color-text-tertiary, #a0a0a0)}:host.is-own-message .timestamp{color:var(--color-on-accent, #ffffff);opacity:.7}:host{-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}:host.is-new-message{animation:message-appear var(--spring-bouncy) forwards}@keyframes message-appear{0%{opacity:0;transform:translateY(20px) scale(.92)}to{opacity:1;transform:translateY(0) scale(1)}}.message-bubble.is-internal{background:var(--color-background-warning-subtle, #fefce8)!important;border:1px solid var(--color-border-warning-muted, #fde047)}:host.is-own-message .message-bubble.is-internal{background:var(--color-background-warning-subtle, #fefce8)!important;color:var(--color-text-primary, #1a1a1a)}:host.is-own-message .message-bubble.is-internal .message-text{color:var(--color-text-primary, #1a1a1a)}.internal-message-badge{display:flex;align-items:center;gap:4px;font-family:Brockmann,sans-serif;font-size:11px;font-weight:500;color:var(--color-text-warning, #eab308);margin-bottom:4px;padding-left:12px}:host.is-own-message .internal-message-badge{align-self:flex-end;padding-left:0;padding-right:12px}\n"] }]
+        }], propDecorators: { content: [{ type: i0.Input, args: [{ isSignal: true, alias: "content", required: true }] }], isOwnMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "isOwnMessage", required: false }] }], senderName: [{ type: i0.Input, args: [{ isSignal: true, alias: "senderName", required: false }] }], isInternal: [{ type: i0.Input, args: [{ isSignal: true, alias: "isInternal", required: false }] }], internalMessageBadgeText: [{ type: i0.Input, args: [{ isSignal: true, alias: "internalMessageBadgeText", required: false }] }], timestamp: [{ type: i0.Input, args: [{ isSignal: true, alias: "timestamp", required: true }] }], showTimestamp: [{ type: i0.Input, args: [{ isSignal: true, alias: "showTimestamp", required: false }] }], avatarInitials: [{ type: i0.Input, args: [{ isSignal: true, alias: "avatarInitials", required: false }] }], avatarType: [{ type: i0.Input, args: [{ isSignal: true, alias: "avatarType", required: false }] }], avatarSrc: [{ type: i0.Input, args: [{ isSignal: true, alias: "avatarSrc", required: false }] }], showAvatar: [{ type: i0.Input, args: [{ isSignal: true, alias: "showAvatar", required: false }] }], clusterPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "clusterPosition", required: false }] }], attachments: [{ type: i0.Input, args: [{ isSignal: true, alias: "attachments", required: false }] }], clickable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clickable", required: false }] }], isNewMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "isNewMessage", required: false }] }], isDeleted: [{ type: i0.Input, args: [{ isSignal: true, alias: "isDeleted", required: false }] }], showEditedHint: [{ type: i0.Input, args: [{ isSignal: true, alias: "showEditedHint", required: false }] }], editedHintText: [{ type: i0.Input, args: [{ isSignal: true, alias: "editedHintText", required: false }] }], attachmentClick: [{ type: i0.Output, args: ["attachmentClick"] }], longPress: [{ type: i0.Output, args: ["longPress"] }], messageClick: [{ type: i0.Output, args: ["messageClick"] }] } });
 
 /**
  * DsMobileListItemStaticComponent
@@ -16040,6 +16060,7 @@ const DEFAULT_CHAT_LABELS = {
     internalToggleLabel: 'Intern besked',
     replyLabel: 'Besvar',
     internalMessageDescription: 'Interne beskeder er kun synlige for interne brugere. Lejeren kan ikke se denne besked.',
+    internalMessageBadge: 'Intern besked',
     addMembersTitle: 'Tilføj beboere',
     youSenderName: 'You',
     actionCopy: 'Kopiér',
@@ -16134,7 +16155,7 @@ class DsMobileChatModalComponent {
         const uid = this.chatData?.currentUserId;
         if (!uid)
             return members;
-        return members.filter(m => m.id !== uid);
+        return members.filter((m) => m.id !== uid);
     }, ...(ngDevMode ? [{ debugName: "groupMembersForStack" }] : []));
     isGroupAdmin = computed(() => {
         const g = this.group();
@@ -16334,7 +16355,8 @@ class DsMobileChatModalComponent {
             avatarType: this.currentUserAvatarType(),
             avatarSrc: this.currentUserAvatarSrc(),
             fileAttachments: event.attachments || [],
-            isNewMessage: true, // Mark as new message to trigger animation
+            isNewMessage: true,
+            isInternal: event.isInternal,
         };
         // Add message to list
         const updatedMessages = [...this.messages(), newMessage];
@@ -16550,9 +16572,7 @@ class DsMobileChatModalComponent {
                 ],
             },
         ];
-        const canEdit = message.isOwnMessage &&
-            !message.fileAttachments?.length &&
-            message.content.trim().length > 0;
+        const canEdit = message.isOwnMessage && !message.fileAttachments?.length && message.content.trim().length > 0;
         const canDelete = message.isOwnMessage;
         if (canEdit) {
             groups[0].actions.push({
@@ -16633,13 +16653,13 @@ class DsMobileChatModalComponent {
         if (!this.chatData.onEditMessage)
             return;
         await this.chatData.onEditMessage(messageId, newContent);
-        this.messages.update(msgs => msgs.map(m => m.id === messageId ? { ...m, content: newContent, editedAt: new Date() } : m));
+        this.messages.update((msgs) => msgs.map((m) => (m.id === messageId ? { ...m, content: newContent, editedAt: new Date() } : m)));
     }
     async applyMessageDelete(messageId) {
         if (!this.chatData.onDeleteMessage)
             return;
         await this.chatData.onDeleteMessage(messageId);
-        this.messages.update(msgs => msgs.map(m => m.id === messageId ? { ...m, deletedAt: new Date(), content: '' } : m));
+        this.messages.update((msgs) => msgs.map((m) => (m.id === messageId ? { ...m, deletedAt: new Date(), content: '' } : m)));
     }
     deletePlaceholder(message) {
         return message.isOwnMessage ? this.lbl.deletePlaceholderOwn : this.lbl.deletePlaceholderOther;
@@ -16648,21 +16668,13 @@ class DsMobileChatModalComponent {
         const m = message.systemMeta;
         switch (message.systemKind) {
             case 'member_added':
-                return m?.actorName && m?.targetName
-                    ? this.lbl.activityMemberAddedWithNames(m.actorName, m.targetName)
-                    : this.lbl.activityMemberAdded;
+                return m?.actorName && m?.targetName ? this.lbl.activityMemberAddedWithNames(m.actorName, m.targetName) : this.lbl.activityMemberAdded;
             case 'member_removed':
-                return m?.actorName && m?.targetName
-                    ? this.lbl.activityMemberRemovedWithNames(m.actorName, m.targetName)
-                    : this.lbl.activityMemberRemoved;
+                return m?.actorName && m?.targetName ? this.lbl.activityMemberRemovedWithNames(m.actorName, m.targetName) : this.lbl.activityMemberRemoved;
             case 'renamed':
-                return m?.newTitle
-                    ? this.lbl.activityRenamed(m.newTitle)
-                    : this.lbl.activityRenamedFallback;
+                return m?.newTitle ? this.lbl.activityRenamed(m.newTitle) : this.lbl.activityRenamedFallback;
             case 'left_group':
-                return m?.actorName
-                    ? this.lbl.activityLeftGroup(m.actorName)
-                    : this.lbl.activityLeftGroupFallback;
+                return m?.actorName ? this.lbl.activityLeftGroup(m.actorName) : this.lbl.activityLeftGroupFallback;
             default:
                 return '';
         }
@@ -16694,32 +16706,30 @@ class DsMobileChatModalComponent {
         if (!data?.onRenameGroup)
             return;
         await data.onRenameGroup(title);
-        this.participant.update(p => ({ ...p, name: title }));
-        this.group.update(gr => (gr ? { ...gr, title } : gr));
+        this.participant.update((p) => ({ ...p, name: title }));
+        this.group.update((gr) => (gr ? { ...gr, title } : gr));
     }
     async handleAvatarUrlFromPanel(url) {
         const data = this.chatData;
         if (!data?.onSetGroupCustomAvatarUrl)
             return;
         await data.onSetGroupCustomAvatarUrl(url);
-        this.group.update(gr => gr ? { ...gr, customAvatarUrl: url || undefined } : gr);
+        this.group.update((gr) => (gr ? { ...gr, customAvatarUrl: url || undefined } : gr));
     }
     async handleAddMembersFromPanel(ids) {
         const data = this.chatData;
         if (!data?.onAddMembers)
             return;
         await data.onAddMembers(ids);
-        this.group.update(gr => {
+        this.group.update((gr) => {
             if (!gr)
                 return gr;
-            const existing = new Set(gr.members.map(m => m.id));
+            const existing = new Set(gr.members.map((m) => m.id));
             const newMembers = ids
-                .filter(id => !existing.has(id))
-                .map(id => data.allTenantsForPicker.find(x => x.id === id))
+                .filter((id) => !existing.has(id))
+                .map((id) => data.allTenantsForPicker.find((x) => x.id === id))
                 .filter((t) => !!t);
-            return newMembers.length > 0
-                ? { ...gr, members: [...gr.members, ...newMembers] }
-                : gr;
+            return newMembers.length > 0 ? { ...gr, members: [...gr.members, ...newMembers] } : gr;
         });
     }
     async handleRemoveMemberFromPanel(userId) {
@@ -16727,7 +16737,7 @@ class DsMobileChatModalComponent {
         if (!data?.onRemoveMember)
             return;
         await data.onRemoveMember(userId);
-        this.group.update(g => g ? { ...g, members: g.members.filter(x => x.id !== userId) } : g);
+        this.group.update((g) => (g ? { ...g, members: g.members.filter((x) => x.id !== userId) } : g));
     }
     async handleMessageMemberFromPanel(userId) {
         if (this.chatData?.onMessageMember) {
@@ -16953,10 +16963,7 @@ class DsMobileChatModalComponent {
             />
           }
         } @else if (participant().avatarShape === 'squircle') {
-          <ds-mobile-vendor-avatar
-            [name]="participant().name"
-            [logo]="participant().avatarSrc || ''"
-            size="md" />
+          <ds-mobile-vendor-avatar [name]="participant().name" [logo]="participant().avatarSrc || ''" size="md" />
         } @else {
           <ds-avatar-with-badge
             [initials]="participant().avatarInitials || ''"
@@ -17006,155 +17013,153 @@ class DsMobileChatModalComponent {
           (leaveGroup)="handleLeaveGroupFromPanel()"
         />
       } @else {
-      <!-- Messages Section -->
-      <ds-mobile-section>
-        <div class="chat-messages-container" (click)="handleContentClick()">
-          <!-- Centered avatar section at top of messages -->
-          <div class="chat-avatar-section">
-            @if (threadKind() === 'group' && group()) {
-              <ds-mobile-group-avatar-stack
-                [members]="groupMembersForStack()"
-                [customAvatarUrl]="group()!.customAvatarUrl || ''"
-                layout="list"
-                size="xl"
-                style="cursor: pointer"
-                (click)="onGroupTitleClick(); $event.stopPropagation()"
-              />
-            } @else if (participant().avatarShape === 'squircle') {
-              <ds-mobile-vendor-avatar
-                [name]="participant().name"
-                [logo]="participant().avatarSrc || ''"
-                size="xl" />
-            } @else {
-              <ds-avatar-with-badge
-                [initials]="participant().avatarInitials || ''"
-                [type]="participant().avatarType || 'initials'"
-                [src]="participant().avatarSrc || ''"
-                [badge]="participant().badge"
-                [showBadge]="threadContext() === 'inquiry'"
-                size="xl"
-              />
-            }
-            <div class="chat-avatar-info">
-              <div class="chat-avatar-name">
-                {{ participant().name }}
-                @if (participant().verified) {
-                  <ds-icon name="remixCheckboxCircleFill" size="24px" [style.color]="'var(--color-primary-base)'"></ds-icon>
+        <!-- Messages Section -->
+        <ds-mobile-section>
+          <div class="chat-messages-container" (click)="handleContentClick()">
+            <!-- Centered avatar section at top of messages -->
+            <div class="chat-avatar-section">
+              @if (threadKind() === 'group' && group()) {
+                <ds-mobile-group-avatar-stack
+                  [members]="groupMembersForStack()"
+                  [customAvatarUrl]="group()!.customAvatarUrl || ''"
+                  layout="list"
+                  size="xl"
+                  style="cursor: pointer"
+                  (click)="onGroupTitleClick(); $event.stopPropagation()"
+                />
+              } @else if (participant().avatarShape === 'squircle') {
+                <ds-mobile-vendor-avatar [name]="participant().name" [logo]="participant().avatarSrc || ''" size="xl" />
+              } @else {
+                <ds-avatar-with-badge
+                  [initials]="participant().avatarInitials || ''"
+                  [type]="participant().avatarType || 'initials'"
+                  [src]="participant().avatarSrc || ''"
+                  [badge]="participant().badge"
+                  [showBadge]="threadContext() === 'inquiry'"
+                  size="xl"
+                />
+              }
+              <div class="chat-avatar-info">
+                <div class="chat-avatar-name">
+                  {{ participant().name }}
+                  @if (participant().verified) {
+                    <ds-icon name="remixCheckboxCircleFill" size="24px" [style.color]="'var(--color-primary-base)'"></ds-icon>
+                  }
+                </div>
+                @if (participant().role) {
+                  <div class="chat-avatar-role">{{ participant().role }}</div>
+                }
+                @if (participant().lastActive) {
+                  <div class="chat-avatar-meta">{{ participant().lastActive }}</div>
                 }
               </div>
-              @if (participant().role) {
-                <div class="chat-avatar-role">{{ participant().role }}</div>
-              }
-              @if (participant().lastActive) {
-                <div class="chat-avatar-meta">{{ participant().lastActive }}</div>
-              }
             </div>
-          </div>
-
-          <div class="messages-list">
-            @if (messages().length === 0) {
-              <!-- Empty State - Timestamp and optional inquiry system message -->
-              <div class="timestamp-header">
-                <span class="timestamp-text">{{ getInitialTimestamp() }}</span>
-              </div>
 
-              @if (threadContext() === 'inquiry') {
-                <ds-mobile-system-message-banner [message]="participant().name + ' har overtaget din henvendelse og vil kontakte dig snart.'" [afterTimestamp]="true">
-                </ds-mobile-system-message-banner>
-              }
-            } @else {
-              @for (group of messagesWithDisplay(); track group.timestamp) {
-                <!-- Timestamp Header -->
+            <div class="messages-list">
+              @if (messages().length === 0) {
+                <!-- Empty State - Timestamp and optional inquiry system message -->
                 <div class="timestamp-header">
-                  <span class="timestamp-text">{{ group.displayTimestamp }}</span>
+                  <span class="timestamp-text">{{ getInitialTimestamp() }}</span>
                 </div>
 
-                @if ($first && threadContext() === 'inquiry') {
+                @if (threadContext() === 'inquiry') {
                   <ds-mobile-system-message-banner [message]="participant().name + ' har overtaget din henvendelse og vil kontakte dig snart.'" [afterTimestamp]="true">
                   </ds-mobile-system-message-banner>
                 }
-                @for (message of group.messages; track message.id) {
-                  @if (message.systemKind) {
-                    <p class="chat-system-line">{{ formatActivityLine(message) }}</p>
-                  } @else if (message.senderId === 'system' && message.content.trim()) {
-                    <p class="chat-system-line">{{ message.content }}</p>
-                  } @else if (message.deletedAt) {
-                    <ds-mobile-message-bubble
-                      [content]="deletePlaceholder(message)"
-                      [isOwnMessage]="message.isOwnMessage"
-                      [timestamp]="formatMessageTimestamp(message.timestamp)"
-                      [showTimestamp]="selectedMessageId() === message.id"
-                      [avatarInitials]="message.avatarInitials || ''"
-                      [avatarType]="message.avatarType || 'initials'"
-                      [avatarSrc]="message.avatarSrc || ''"
-                      [showAvatar]="message.showAvatar"
-                      [clusterPosition]="message.clusterPosition"
-                      [attachments]="message.attachments"
-                      [clickable]="false"
-                      [isDeleted]="true"
-                      [isNewMessage]="false"
-                    >
-                    </ds-mobile-message-bubble>
-                  } @else if (message.content.trim()) {
-                    <ds-mobile-message-bubble
-                      [content]="message.content"
-                      [isOwnMessage]="message.isOwnMessage"
-                      [timestamp]="formatMessageTimestamp(message.timestamp)"
-                      [showTimestamp]="selectedMessageId() === message.id"
-                      [avatarInitials]="message.avatarInitials || ''"
-                      [avatarType]="message.avatarType || 'initials'"
-                      [avatarSrc]="message.avatarSrc || ''"
-                      [showAvatar]="message.showAvatar && !(message.fileAttachments && message.fileAttachments.length > 0)"
-                      [clusterPosition]="(message.fileAttachments && message.fileAttachments.length > 0) ? 'first' : message.clusterPosition"
-                      [attachments]="message.attachments"
-                      [clickable]="true"
-                      [isNewMessage]="message.isNewMessage || false"
-                      [showEditedHint]="!!message.editedAt"
-                      [editedHintText]="lbl.editedHint"
-                      (messageClick)="handleMessageClick(message.id)"
-                      (attachmentClick)="handleAttachmentClick($event)"
-                      (longPress)="handleMessageLongPress(message)"
-                    >
-                    </ds-mobile-message-bubble>
+              } @else {
+                @for (group of messagesWithDisplay(); track group.timestamp) {
+                  <!-- Timestamp Header -->
+                  <div class="timestamp-header">
+                    <span class="timestamp-text">{{ group.displayTimestamp }}</span>
+                  </div>
+
+                  @if ($first && threadContext() === 'inquiry') {
+                    <ds-mobile-system-message-banner [message]="participant().name + ' har overtaget din henvendelse og vil kontakte dig snart.'" [afterTimestamp]="true">
+                    </ds-mobile-system-message-banner>
                   }
+                  @for (message of group.messages; track message.id) {
+                    @if (message.systemKind) {
+                      <p class="chat-system-line">{{ formatActivityLine(message) }}</p>
+                    } @else if (message.senderId === 'system' && message.content.trim()) {
+                      <p class="chat-system-line">{{ message.content }}</p>
+                    } @else if (message.deletedAt) {
+                      <ds-mobile-message-bubble
+                        [content]="deletePlaceholder(message)"
+                        [isOwnMessage]="message.isOwnMessage"
+                        [isInternal]="message.isInternal || false"
+                        [internalMessageBadgeText]="lbl.internalMessageBadge"
+                        [timestamp]="formatMessageTimestamp(message.timestamp)"
+                        [showTimestamp]="selectedMessageId() === message.id"
+                        [avatarInitials]="message.avatarInitials || ''"
+                        [avatarType]="message.avatarType || 'initials'"
+                        [avatarSrc]="message.avatarSrc || ''"
+                        [showAvatar]="message.showAvatar"
+                        [clusterPosition]="message.clusterPosition"
+                        [attachments]="message.attachments"
+                        [clickable]="false"
+                        [isDeleted]="true"
+                        [isNewMessage]="false"
+                      >
+                      </ds-mobile-message-bubble>
+                    } @else if (message.content.trim()) {
+                      <ds-mobile-message-bubble
+                        [content]="message.content"
+                        [isOwnMessage]="message.isOwnMessage"
+                        [isInternal]="message.isInternal || false"
+                        [internalMessageBadgeText]="lbl.internalMessageBadge"
+                        [timestamp]="formatMessageTimestamp(message.timestamp)"
+                        [showTimestamp]="selectedMessageId() === message.id"
+                        [avatarInitials]="message.avatarInitials || ''"
+                        [avatarType]="message.avatarType || 'initials'"
+                        [avatarSrc]="message.avatarSrc || ''"
+                        [showAvatar]="message.showAvatar && !(message.fileAttachments && message.fileAttachments.length > 0)"
+                        [clusterPosition]="message.fileAttachments && message.fileAttachments.length > 0 ? 'first' : message.clusterPosition"
+                        [attachments]="message.attachments"
+                        [clickable]="true"
+                        [isNewMessage]="message.isNewMessage || false"
+                        [showEditedHint]="!!message.editedAt"
+                        [editedHintText]="lbl.editedHint"
+                        (messageClick)="handleMessageClick(message.id)"
+                        (attachmentClick)="handleAttachmentClick($event)"
+                        (longPress)="handleMessageLongPress(message)"
+                      >
+                      </ds-mobile-message-bubble>
+                    }
 
-                  @if (!message.deletedAt && message.fileAttachments && message.fileAttachments.length > 0) {
-                    <div
-                      class="message-file-attachments"
-                      [class.own-message]="message.isOwnMessage"
-                      [class.attachment-only]="!message.content.trim()"
-                      (click)="handleMessageClick(message.id)"
-                      (touchstart)="startAttachmentLongPress(message)"
-                      (touchend)="cancelAttachmentLongPress()"
-                      (touchcancel)="cancelAttachmentLongPress()"
-                    >
-                      @for (fileAttachment of message.fileAttachments; track fileAttachment.id) {
-                        @if (fileAttachment.type === 'image') {
-                          <div
-                            class="message-image-attachment"
-                            (click)="handleImageClick(fileAttachment, message); $event.stopPropagation()"
-                          >
-                            <img [src]="fileAttachment.src" [alt]="fileAttachment.name || 'Image'" class="inline-image" />
-                          </div>
-                        } @else {
-                          <ds-mobile-card-inline-file
-                            [fileName]="fileAttachment.name || 'Unknown file'"
-                            [fileSize]="fileAttachment.size || ''"
-                            [variant]="getFileVariant(fileAttachment.type)"
-                            [layout]="'compact'"
-                            (fileClick)="handleFileAttachmentClick(fileAttachment)"
-                          >
-                          </ds-mobile-card-inline-file>
+                    @if (!message.deletedAt && message.fileAttachments && message.fileAttachments.length > 0) {
+                      <div
+                        class="message-file-attachments"
+                        [class.own-message]="message.isOwnMessage"
+                        [class.attachment-only]="!message.content.trim()"
+                        (click)="handleMessageClick(message.id)"
+                        (touchstart)="startAttachmentLongPress(message)"
+                        (touchend)="cancelAttachmentLongPress()"
+                        (touchcancel)="cancelAttachmentLongPress()"
+                      >
+                        @for (fileAttachment of message.fileAttachments; track fileAttachment.id) {
+                          @if (fileAttachment.type === 'image') {
+                            <div class="message-image-attachment" (click)="handleImageClick(fileAttachment, message); $event.stopPropagation()">
+                              <img [src]="fileAttachment.src" [alt]="fileAttachment.name || 'Image'" class="inline-image" />
+                            </div>
+                          } @else {
+                            <ds-mobile-card-inline-file
+                              [fileName]="fileAttachment.name || 'Unknown file'"
+                              [fileSize]="fileAttachment.size || ''"
+                              [variant]="getFileVariant(fileAttachment.type)"
+                              [layout]="'compact'"
+                              (fileClick)="handleFileAttachmentClick(fileAttachment)"
+                            >
+                            </ds-mobile-card-inline-file>
+                          }
                         }
-                      }
-                    </div>
+                      </div>
+                    }
                   }
                 }
               }
-            }
+            </div>
           </div>
-        </div>
-      </ds-mobile-section>
+        </ds-mobile-section>
       }
 
       <!-- Fixed message composer -->
@@ -17182,7 +17187,7 @@ class DsMobileChatModalComponent {
         </ds-mobile-message-composer>
       </div>
     </ds-mobile-modal-base>
-  `, isInline: true, styles: [".author-details{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}.author-name{font-family:Brockmann,sans-serif;font-size:var(--font-size-sm);font-weight:600;line-height:20px;letter-spacing:-.3px;color:var(--color-text-primary, #1a1a1a);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.author-meta{font-family:Brockmann,sans-serif;font-size:var(--font-size-xs);font-weight:400;line-height:1.2;letter-spacing:-.26px;color:var(--color-text-tertiary, #737373);display:flex;align-items:center;gap:6px}.author-meta .separator{color:var(--color-text-tertiary, #a0a0a0)}.lightbox-context .author-name,.overlay-context .author-name{color:#fffffff2}.lightbox-context .author-meta,.overlay-context .author-meta{color:#ffffffb3}.lightbox-context .author-meta .separator,.overlay-context .author-meta .separator{color:#ffffff80}.section-headline{font-size:var(--font-size-base);font-weight:600;color:var(--text-color-default-primary);padding:16px 0;margin:0;letter-spacing:-.2px;display:flex;align-items:center;gap:6px}.empty-state-title{font-family:Brockmann,sans-serif;font-size:var(--font-size-base);font-weight:600;line-height:1.3;color:var(--text-color-default-primary, #202227);margin:0 0 8px}.empty-state-description{font-family:Brockmann,sans-serif;font-size:var(--font-size-sm);font-weight:400;line-height:1.4;color:var(--text-color-default-secondary, #545B66);margin:0}.ghost-input-clean ::ng-deep .ds-input,.ghost-input-clean ::ng-deep .ds-textarea,.ghost-input-clean ::ng-deep .textarea-container{outline:none!important;border:none!important;padding:0!important}:host ::ng-deep ds-textarea.ghost-input-clean .textarea-container{padding:0!important}.ghost-input-clean ::ng-deep .ds-input:hover,.ghost-input-clean ::ng-deep .ds-textarea:hover,.ghost-input-clean ::ng-deep .textarea-container:hover,.ghost-input-clean ::ng-deep .ds-input:focus,.ghost-input-clean ::ng-deep .ds-textarea:focus,.ghost-input-clean ::ng-deep .textarea-container:focus,.ghost-input-clean ::ng-deep .ds-input:focus-within,.ghost-input-clean ::ng-deep .ds-textarea:focus-within,.ghost-input-clean ::ng-deep .textarea-container:focus-within{outline:none!important;border:none!important;box-shadow:none!important}.ghost-input-clean ::ng-deep textarea{outline:none!important;border:none!important;box-shadow:none!important;resize:none!important}.ghost-input-clean ::ng-deep textarea:hover,.ghost-input-clean ::ng-deep textarea:focus{outline:none!important;border:none!important;box-shadow:none!important}\n", ":host ::ng-deep .modal-content-container{padding-top:0}:host-context(.chat-modal--settings) ::ng-deep .modal-header{border-bottom:none}:host-context(.chat-modal--add-members) ::ng-deep .modal-header{border-bottom:1px solid var(--border-color-default)}.chat-messages-container{display:flex;flex-direction:column;width:100%}.chat-system-line{font-family:Brockmann,sans-serif;font-size:var(--font-size-xs, 12px);font-weight:400;line-height:1.35;color:var(--text-color-default-tertiary, #737373);text-align:center;margin:8px 24px}.chat-avatar-section{display:flex;flex-direction:column;align-items:center;gap:12px;padding:48px 0 0;background:var(--color-background-neutral-primary, #ffffff)}.chat-avatar-info{display:flex;flex-direction:column;align-items:center;gap:4px}.chat-avatar-name{display:flex;align-items:center;gap:6px;font-family:Brockmann,sans-serif;font-size:var(--font-size-base);font-weight:600;line-height:1.3;color:var(--color-text-primary, #1a1a1a)}.chat-avatar-role{font-family:Brockmann,sans-serif;font-size:var(--font-size-xs);font-weight:400;line-height:1.2;color:var(--color-text-secondary, #666666)}.chat-avatar-meta{font-family:Brockmann,sans-serif;font-size:var(--font-size-xs);font-weight:400;line-height:1.2;color:var(--color-text-tertiary, #737373);display:flex;align-items:center;gap:4px}.messages-list{display:flex;flex-direction:column;width:100%;padding:16px 0 0;align-items:stretch}.messages-list ds-mobile-message-bubble{width:100%;display:flex}.timestamp-header{display:flex;justify-content:center;margin:16px 0 8px}.timestamp-text{font-family:Brockmann,sans-serif;font-size:12px;font-weight:400;color:var(--color-text-secondary);padding:4px 12px}.message-file-attachments{display:flex;flex-direction:column;gap:8px;margin-bottom:12px;padding:0 20px 0 60px;max-width:100%}.message-file-attachments.own-message{padding:0 0 0 96px;align-items:flex-end}.message-file-attachments ds-mobile-card-inline-file{max-width:280px;width:100%}.message-image-attachment{width:96px;height:96px;cursor:pointer;border-radius:12px;overflow:hidden;position:relative;transition:transform .2s ease;border:1px solid var(--border-color-default, #e5e5e5)}.message-image-attachment:active{transform:scale(.98)}.message-image-attachment .inline-image{width:100%;height:100%;display:block;-o-object-fit:cover;object-fit:cover}.group-settings-back-btn{flex-shrink:0;border-radius:50%}.group-settings-back-btn::ng-deep button{border-radius:50%!important;width:36px!important;height:36px!important;min-width:36px!important;min-height:36px!important;padding:0!important;display:flex!important;align-items:center!important;justify-content:center!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: DsAvatarWithBadgeComponent, selector: "ds-avatar-with-badge", inputs: ["type", "size", "initials", "src", "iconName", "showBadge", "badgePosition"] }, { kind: "component", type: DsMobileVendorAvatarComponent, selector: "ds-mobile-vendor-avatar", inputs: ["name", "logo", "size"] }, { kind: "component", type: DsMobileMessageComposerComponent, selector: "ds-mobile-message-composer", inputs: ["avatarInitials", "avatarType", "avatarSrc", "placeholder", "sendButtonLabel", "attachmentButtonLabel", "showAttachmentButton", "showAiButton", "editIndicatorText", "replyIndicatorText", "enableMentions", "mentionUsers", "showInternalToggle", "internalToggleLabel", "replyLabel", "internalMessageDescription", "autoFocus"], outputs: ["messageSent", "editCancelled", "replyCancelled", "mentionSelected", "attachmentClicked", "attachmentsChanged", "aiClick"] }, { kind: "component", type: DsMobileMessageBubbleComponent, selector: "ds-mobile-message-bubble", inputs: ["content", "isOwnMessage", "senderName", "timestamp", "showTimestamp", "avatarInitials", "avatarType", "avatarSrc", "showAvatar", "clusterPosition", "attachments", "clickable", "isNewMessage", "isDeleted", "showEditedHint", "editedHintText"], outputs: ["attachmentClick", "longPress", "messageClick"] }, { kind: "component", type: DsMobileModalBaseComponent, selector: "ds-mobile-modal-base", inputs: ["headerTitleInteractive", "textLoading", "textErrorTitle", "showHeader"], outputs: ["titleClick"] }, { kind: "component", type: DsMobileCardInlineFileComponent, selector: "ds-mobile-card-inline-file", inputs: ["fileName", "fileSize", "variant", "layout", "fileUrl"], outputs: ["fileClick"] }, { kind: "component", type: DsMobileSystemMessageBannerComponent, selector: "ds-mobile-system-message-banner", inputs: ["message", "iconName", "afterTimestamp"] }, { kind: "component", type: DsIconComponent, selector: "ds-icon", inputs: ["name", "size", "color", "interactive"] }, { kind: "component", type: DsIconButtonComponent, selector: "ds-icon-button", inputs: ["variant", "size", "icon", "disabled", "loading", "pressed", "expanded", "ariaLabel", "tooltip", "tooltipDisabled", "tooltipPlacement"], outputs: ["clicked", "focused", "blurred"] }, { kind: "component", type: DsMobileSectionComponent, selector: "ds-mobile-section", inputs: ["headline", "icon", "linkText", "padding", "paddingDesktop", "gap", "contentGap", "showBorder", "overflow"], outputs: ["linkClick"] }, { kind: "component", type: DsMobileGroupAvatarStackComponent, selector: "ds-mobile-group-avatar-stack", inputs: ["members", "customAvatarUrl", "size", "layout", "currentUserId"] }, { kind: "component", type: DsMobileListSearchComponent, selector: "ds-mobile-list-search", inputs: ["placeholder", "ariaLabel", "value", "showDivider"], outputs: ["valueChange"] }, { kind: "component", type: DsMobileChatGroupPanelsComponent, selector: "ds-mobile-chat-group-panels", inputs: ["panelView", "group", "membersForStack", "participantName", "currentUserId", "isAdmin", "canEditGroupDetails", "canAddGroupMembers", "canLeaveGroup", "canRemoveMember", "canMessageMember", "allTenantsForPicker", "searchQuery", "labels"], outputs: ["navigateTo", "renameGroup", "setGroupAvatarUrl", "addMembers", "removeMember", "messageMember", "leaveGroup"] }] });
+  `, isInline: true, styles: [".author-details{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}.author-name{font-family:Brockmann,sans-serif;font-size:var(--font-size-sm);font-weight:600;line-height:20px;letter-spacing:-.3px;color:var(--color-text-primary, #1a1a1a);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.author-meta{font-family:Brockmann,sans-serif;font-size:var(--font-size-xs);font-weight:400;line-height:1.2;letter-spacing:-.26px;color:var(--color-text-tertiary, #737373);display:flex;align-items:center;gap:6px}.author-meta .separator{color:var(--color-text-tertiary, #a0a0a0)}.lightbox-context .author-name,.overlay-context .author-name{color:#fffffff2}.lightbox-context .author-meta,.overlay-context .author-meta{color:#ffffffb3}.lightbox-context .author-meta .separator,.overlay-context .author-meta .separator{color:#ffffff80}.section-headline{font-size:var(--font-size-base);font-weight:600;color:var(--text-color-default-primary);padding:16px 0;margin:0;letter-spacing:-.2px;display:flex;align-items:center;gap:6px}.empty-state-title{font-family:Brockmann,sans-serif;font-size:var(--font-size-base);font-weight:600;line-height:1.3;color:var(--text-color-default-primary, #202227);margin:0 0 8px}.empty-state-description{font-family:Brockmann,sans-serif;font-size:var(--font-size-sm);font-weight:400;line-height:1.4;color:var(--text-color-default-secondary, #545B66);margin:0}.ghost-input-clean ::ng-deep .ds-input,.ghost-input-clean ::ng-deep .ds-textarea,.ghost-input-clean ::ng-deep .textarea-container{outline:none!important;border:none!important;padding:0!important}:host ::ng-deep ds-textarea.ghost-input-clean .textarea-container{padding:0!important}.ghost-input-clean ::ng-deep .ds-input:hover,.ghost-input-clean ::ng-deep .ds-textarea:hover,.ghost-input-clean ::ng-deep .textarea-container:hover,.ghost-input-clean ::ng-deep .ds-input:focus,.ghost-input-clean ::ng-deep .ds-textarea:focus,.ghost-input-clean ::ng-deep .textarea-container:focus,.ghost-input-clean ::ng-deep .ds-input:focus-within,.ghost-input-clean ::ng-deep .ds-textarea:focus-within,.ghost-input-clean ::ng-deep .textarea-container:focus-within{outline:none!important;border:none!important;box-shadow:none!important}.ghost-input-clean ::ng-deep textarea{outline:none!important;border:none!important;box-shadow:none!important;resize:none!important}.ghost-input-clean ::ng-deep textarea:hover,.ghost-input-clean ::ng-deep textarea:focus{outline:none!important;border:none!important;box-shadow:none!important}\n", ":host ::ng-deep .modal-content-container{padding-top:0}:host-context(.chat-modal--settings) ::ng-deep .modal-header{border-bottom:none}:host-context(.chat-modal--add-members) ::ng-deep .modal-header{border-bottom:1px solid var(--border-color-default)}.chat-messages-container{display:flex;flex-direction:column;width:100%}.chat-system-line{font-family:Brockmann,sans-serif;font-size:var(--font-size-xs, 12px);font-weight:400;line-height:1.35;color:var(--text-color-default-tertiary, #737373);text-align:center;margin:8px 24px}.chat-avatar-section{display:flex;flex-direction:column;align-items:center;gap:12px;padding:48px 0 0;background:var(--color-background-neutral-primary, #ffffff)}.chat-avatar-info{display:flex;flex-direction:column;align-items:center;gap:4px}.chat-avatar-name{display:flex;align-items:center;gap:6px;font-family:Brockmann,sans-serif;font-size:var(--font-size-base);font-weight:600;line-height:1.3;color:var(--color-text-primary, #1a1a1a)}.chat-avatar-role{font-family:Brockmann,sans-serif;font-size:var(--font-size-xs);font-weight:400;line-height:1.2;color:var(--color-text-secondary, #666666)}.chat-avatar-meta{font-family:Brockmann,sans-serif;font-size:var(--font-size-xs);font-weight:400;line-height:1.2;color:var(--color-text-tertiary, #737373);display:flex;align-items:center;gap:4px}.messages-list{display:flex;flex-direction:column;width:100%;padding:16px 0 0;align-items:stretch}.messages-list ds-mobile-message-bubble{width:100%;display:flex}.timestamp-header{display:flex;justify-content:center;margin:16px 0 8px}.timestamp-text{font-family:Brockmann,sans-serif;font-size:12px;font-weight:400;color:var(--color-text-secondary);padding:4px 12px}.message-file-attachments{display:flex;flex-direction:column;gap:8px;margin-bottom:12px;padding:0 20px 0 60px;max-width:100%}.message-file-attachments.own-message{padding:0 0 0 96px;align-items:flex-end}.message-file-attachments ds-mobile-card-inline-file{max-width:280px;width:100%}.message-image-attachment{width:96px;height:96px;cursor:pointer;border-radius:12px;overflow:hidden;position:relative;transition:transform .2s ease;border:1px solid var(--border-color-default, #e5e5e5)}.message-image-attachment:active{transform:scale(.98)}.message-image-attachment .inline-image{width:100%;height:100%;display:block;-o-object-fit:cover;object-fit:cover}.group-settings-back-btn{flex-shrink:0;border-radius:50%}.group-settings-back-btn::ng-deep button{border-radius:50%!important;width:36px!important;height:36px!important;min-width:36px!important;min-height:36px!important;padding:0!important;display:flex!important;align-items:center!important;justify-content:center!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: DsAvatarWithBadgeComponent, selector: "ds-avatar-with-badge", inputs: ["type", "size", "initials", "src", "iconName", "showBadge", "badgePosition"] }, { kind: "component", type: DsMobileVendorAvatarComponent, selector: "ds-mobile-vendor-avatar", inputs: ["name", "logo", "size"] }, { kind: "component", type: DsMobileMessageComposerComponent, selector: "ds-mobile-message-composer", inputs: ["avatarInitials", "avatarType", "avatarSrc", "placeholder", "sendButtonLabel", "attachmentButtonLabel", "showAttachmentButton", "showAiButton", "editIndicatorText", "replyIndicatorText", "enableMentions", "mentionUsers", "showInternalToggle", "internalToggleLabel", "replyLabel", "internalMessageDescription", "autoFocus"], outputs: ["messageSent", "editCancelled", "replyCancelled", "mentionSelected", "attachmentClicked", "attachmentsChanged", "aiClick"] }, { kind: "component", type: DsMobileMessageBubbleComponent, selector: "ds-mobile-message-bubble", inputs: ["content", "isOwnMessage", "senderName", "isInternal", "internalMessageBadgeText", "timestamp", "showTimestamp", "avatarInitials", "avatarType", "avatarSrc", "showAvatar", "clusterPosition", "attachments", "clickable", "isNewMessage", "isDeleted", "showEditedHint", "editedHintText"], outputs: ["attachmentClick", "longPress", "messageClick"] }, { kind: "component", type: DsMobileModalBaseComponent, selector: "ds-mobile-modal-base", inputs: ["headerTitleInteractive", "textLoading", "textErrorTitle", "showHeader"], outputs: ["titleClick"] }, { kind: "component", type: DsMobileCardInlineFileComponent, selector: "ds-mobile-card-inline-file", inputs: ["fileName", "fileSize", "variant", "layout", "fileUrl"], outputs: ["fileClick"] }, { kind: "component", type: DsMobileSystemMessageBannerComponent, selector: "ds-mobile-system-message-banner", inputs: ["message", "iconName", "afterTimestamp"] }, { kind: "component", type: DsIconComponent, selector: "ds-icon", inputs: ["name", "size", "color", "interactive"] }, { kind: "component", type: DsIconButtonComponent, selector: "ds-icon-button", inputs: ["variant", "size", "icon", "disabled", "loading", "pressed", "expanded", "ariaLabel", "tooltip", "tooltipDisabled", "tooltipPlacement"], outputs: ["clicked", "focused", "blurred"] }, { kind: "component", type: DsMobileSectionComponent, selector: "ds-mobile-section", inputs: ["headline", "icon", "linkText", "padding", "paddingDesktop", "gap", "contentGap", "showBorder", "overflow"], outputs: ["linkClick"] }, { kind: "component", type: DsMobileGroupAvatarStackComponent, selector: "ds-mobile-group-avatar-stack", inputs: ["members", "customAvatarUrl", "size", "layout", "currentUserId"] }, { kind: "component", type: DsMobileListSearchComponent, selector: "ds-mobile-list-search", inputs: ["placeholder", "ariaLabel", "value", "showDivider"], outputs: ["valueChange"] }, { kind: "component", type: DsMobileChatGroupPanelsComponent, selector: "ds-mobile-chat-group-panels", inputs: ["panelView", "group", "membersForStack", "participantName", "currentUserId", "isAdmin", "canEditGroupDetails", "canAddGroupMembers", "canLeaveGroup", "canRemoveMember", "canMessageMember", "allTenantsForPicker", "searchQuery", "labels"], outputs: ["navigateTo", "renameGroup", "setGroupAvatarUrl", "addMembers", "removeMember", "messageMember", "leaveGroup"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: DsMobileChatModalComponent, decorators: [{
             type: Component,
@@ -17241,10 +17246,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
             />
           }
         } @else if (participant().avatarShape === 'squircle') {
-          <ds-mobile-vendor-avatar
-            [name]="participant().name"
-            [logo]="participant().avatarSrc || ''"
-            size="md" />
+          <ds-mobile-vendor-avatar [name]="participant().name" [logo]="participant().avatarSrc || ''" size="md" />
         } @else {
           <ds-avatar-with-badge
             [initials]="participant().avatarInitials || ''"
@@ -17294,155 +17296,153 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
           (leaveGroup)="handleLeaveGroupFromPanel()"
         />
       } @else {
-      <!-- Messages Section -->
-      <ds-mobile-section>
-        <div class="chat-messages-container" (click)="handleContentClick()">
-          <!-- Centered avatar section at top of messages -->
-          <div class="chat-avatar-section">
-            @if (threadKind() === 'group' && group()) {
-              <ds-mobile-group-avatar-stack
-                [members]="groupMembersForStack()"
-                [customAvatarUrl]="group()!.customAvatarUrl || ''"
-                layout="list"
-                size="xl"
-                style="cursor: pointer"
-                (click)="onGroupTitleClick(); $event.stopPropagation()"
-              />
-            } @else if (participant().avatarShape === 'squircle') {
-              <ds-mobile-vendor-avatar
-                [name]="participant().name"
-                [logo]="participant().avatarSrc || ''"
-                size="xl" />
-            } @else {
-              <ds-avatar-with-badge
-                [initials]="participant().avatarInitials || ''"
-                [type]="participant().avatarType || 'initials'"
-                [src]="participant().avatarSrc || ''"
-                [badge]="participant().badge"
-                [showBadge]="threadContext() === 'inquiry'"
-                size="xl"
-              />
-            }
-            <div class="chat-avatar-info">
-              <div class="chat-avatar-name">
-                {{ participant().name }}
-                @if (participant().verified) {
-                  <ds-icon name="remixCheckboxCircleFill" size="24px" [style.color]="'var(--color-primary-base)'"></ds-icon>
+        <!-- Messages Section -->
+        <ds-mobile-section>
+          <div class="chat-messages-container" (click)="handleContentClick()">
+            <!-- Centered avatar section at top of messages -->
+            <div class="chat-avatar-section">
+              @if (threadKind() === 'group' && group()) {
+                <ds-mobile-group-avatar-stack
+                  [members]="groupMembersForStack()"
+                  [customAvatarUrl]="group()!.customAvatarUrl || ''"
+                  layout="list"
+                  size="xl"
+                  style="cursor: pointer"
+                  (click)="onGroupTitleClick(); $event.stopPropagation()"
+                />
+              } @else if (participant().avatarShape === 'squircle') {
+                <ds-mobile-vendor-avatar [name]="participant().name" [logo]="participant().avatarSrc || ''" size="xl" />
+              } @else {
+                <ds-avatar-with-badge
+                  [initials]="participant().avatarInitials || ''"
+                  [type]="participant().avatarType || 'initials'"
+                  [src]="participant().avatarSrc || ''"
+                  [badge]="participant().badge"
+                  [showBadge]="threadContext() === 'inquiry'"
+                  size="xl"
+                />
+              }
+              <div class="chat-avatar-info">
+                <div class="chat-avatar-name">
+                  {{ participant().name }}
+                  @if (participant().verified) {
+                    <ds-icon name="remixCheckboxCircleFill" size="24px" [style.color]="'var(--color-primary-base)'"></ds-icon>
+                  }
+                </div>
+                @if (participant().role) {
+                  <div class="chat-avatar-role">{{ participant().role }}</div>
+                }
+                @if (participant().lastActive) {
+                  <div class="chat-avatar-meta">{{ participant().lastActive }}</div>
                 }
               </div>
-              @if (participant().role) {
-                <div class="chat-avatar-role">{{ participant().role }}</div>
-              }
-              @if (participant().lastActive) {
-                <div class="chat-avatar-meta">{{ participant().lastActive }}</div>
-              }
             </div>
-          </div>
 
-          <div class="messages-list">
-            @if (messages().length === 0) {
-              <!-- Empty State - Timestamp and optional inquiry system message -->
-              <div class="timestamp-header">
-                <span class="timestamp-text">{{ getInitialTimestamp() }}</span>
-              </div>
-
-              @if (threadContext() === 'inquiry') {
-                <ds-mobile-system-message-banner [message]="participant().name + ' har overtaget din henvendelse og vil kontakte dig snart.'" [afterTimestamp]="true">
-                </ds-mobile-system-message-banner>
-              }
-            } @else {
-              @for (group of messagesWithDisplay(); track group.timestamp) {
-                <!-- Timestamp Header -->
+            <div class="messages-list">
+              @if (messages().length === 0) {
+                <!-- Empty State - Timestamp and optional inquiry system message -->
                 <div class="timestamp-header">
-                  <span class="timestamp-text">{{ group.displayTimestamp }}</span>
+                  <span class="timestamp-text">{{ getInitialTimestamp() }}</span>
                 </div>
 
-                @if ($first && threadContext() === 'inquiry') {
+                @if (threadContext() === 'inquiry') {
                   <ds-mobile-system-message-banner [message]="participant().name + ' har overtaget din henvendelse og vil kontakte dig snart.'" [afterTimestamp]="true">
                   </ds-mobile-system-message-banner>
                 }
-                @for (message of group.messages; track message.id) {
-                  @if (message.systemKind) {
-                    <p class="chat-system-line">{{ formatActivityLine(message) }}</p>
-                  } @else if (message.senderId === 'system' && message.content.trim()) {
-                    <p class="chat-system-line">{{ message.content }}</p>
-                  } @else if (message.deletedAt) {
-                    <ds-mobile-message-bubble
-                      [content]="deletePlaceholder(message)"
-                      [isOwnMessage]="message.isOwnMessage"
-                      [timestamp]="formatMessageTimestamp(message.timestamp)"
-                      [showTimestamp]="selectedMessageId() === message.id"
-                      [avatarInitials]="message.avatarInitials || ''"
-                      [avatarType]="message.avatarType || 'initials'"
-                      [avatarSrc]="message.avatarSrc || ''"
-                      [showAvatar]="message.showAvatar"
-                      [clusterPosition]="message.clusterPosition"
-                      [attachments]="message.attachments"
-                      [clickable]="false"
-                      [isDeleted]="true"
-                      [isNewMessage]="false"
-                    >
-                    </ds-mobile-message-bubble>
-                  } @else if (message.content.trim()) {
-                    <ds-mobile-message-bubble
-                      [content]="message.content"
-                      [isOwnMessage]="message.isOwnMessage"
-                      [timestamp]="formatMessageTimestamp(message.timestamp)"
-                      [showTimestamp]="selectedMessageId() === message.id"
-                      [avatarInitials]="message.avatarInitials || ''"
-                      [avatarType]="message.avatarType || 'initials'"
-                      [avatarSrc]="message.avatarSrc || ''"
-                      [showAvatar]="message.showAvatar && !(message.fileAttachments && message.fileAttachments.length > 0)"
-                      [clusterPosition]="(message.fileAttachments && message.fileAttachments.length > 0) ? 'first' : message.clusterPosition"
-                      [attachments]="message.attachments"
-                      [clickable]="true"
-                      [isNewMessage]="message.isNewMessage || false"
-                      [showEditedHint]="!!message.editedAt"
-                      [editedHintText]="lbl.editedHint"
-                      (messageClick)="handleMessageClick(message.id)"
-                      (attachmentClick)="handleAttachmentClick($event)"
-                      (longPress)="handleMessageLongPress(message)"
-                    >
-                    </ds-mobile-message-bubble>
+              } @else {
+                @for (group of messagesWithDisplay(); track group.timestamp) {
+                  <!-- Timestamp Header -->
+                  <div class="timestamp-header">
+                    <span class="timestamp-text">{{ group.displayTimestamp }}</span>
+                  </div>
+
+                  @if ($first && threadContext() === 'inquiry') {
+                    <ds-mobile-system-message-banner [message]="participant().name + ' har overtaget din henvendelse og vil kontakte dig snart.'" [afterTimestamp]="true">
+                    </ds-mobile-system-message-banner>
                   }
+                  @for (message of group.messages; track message.id) {
+                    @if (message.systemKind) {
+                      <p class="chat-system-line">{{ formatActivityLine(message) }}</p>
+                    } @else if (message.senderId === 'system' && message.content.trim()) {
+                      <p class="chat-system-line">{{ message.content }}</p>
+                    } @else if (message.deletedAt) {
+                      <ds-mobile-message-bubble
+                        [content]="deletePlaceholder(message)"
+                        [isOwnMessage]="message.isOwnMessage"
+                        [isInternal]="message.isInternal || false"
+                        [internalMessageBadgeText]="lbl.internalMessageBadge"
+                        [timestamp]="formatMessageTimestamp(message.timestamp)"
+                        [showTimestamp]="selectedMessageId() === message.id"
+                        [avatarInitials]="message.avatarInitials || ''"
+                        [avatarType]="message.avatarType || 'initials'"
+                        [avatarSrc]="message.avatarSrc || ''"
+                        [showAvatar]="message.showAvatar"
+                        [clusterPosition]="message.clusterPosition"
+                        [attachments]="message.attachments"
+                        [clickable]="false"
+                        [isDeleted]="true"
+                        [isNewMessage]="false"
+                      >
+                      </ds-mobile-message-bubble>
+                    } @else if (message.content.trim()) {
+                      <ds-mobile-message-bubble
+                        [content]="message.content"
+                        [isOwnMessage]="message.isOwnMessage"
+                        [isInternal]="message.isInternal || false"
+                        [internalMessageBadgeText]="lbl.internalMessageBadge"
+                        [timestamp]="formatMessageTimestamp(message.timestamp)"
+                        [showTimestamp]="selectedMessageId() === message.id"
+                        [avatarInitials]="message.avatarInitials || ''"
+                        [avatarType]="message.avatarType || 'initials'"
+                        [avatarSrc]="message.avatarSrc || ''"
+                        [showAvatar]="message.showAvatar && !(message.fileAttachments && message.fileAttachments.length > 0)"
+                        [clusterPosition]="message.fileAttachments && message.fileAttachments.length > 0 ? 'first' : message.clusterPosition"
+                        [attachments]="message.attachments"
+                        [clickable]="true"
+                        [isNewMessage]="message.isNewMessage || false"
+                        [showEditedHint]="!!message.editedAt"
+                        [editedHintText]="lbl.editedHint"
+                        (messageClick)="handleMessageClick(message.id)"
+                        (attachmentClick)="handleAttachmentClick($event)"
+                        (longPress)="handleMessageLongPress(message)"
+                      >
+                      </ds-mobile-message-bubble>
+                    }
 
-                  @if (!message.deletedAt && message.fileAttachments && message.fileAttachments.length > 0) {
-                    <div
-                      class="message-file-attachments"
-                      [class.own-message]="message.isOwnMessage"
-                      [class.attachment-only]="!message.content.trim()"
-                      (click)="handleMessageClick(message.id)"
-                      (touchstart)="startAttachmentLongPress(message)"
-                      (touchend)="cancelAttachmentLongPress()"
-                      (touchcancel)="cancelAttachmentLongPress()"
-                    >
-                      @for (fileAttachment of message.fileAttachments; track fileAttachment.id) {
-                        @if (fileAttachment.type === 'image') {
-                          <div
-                            class="message-image-attachment"
-                            (click)="handleImageClick(fileAttachment, message); $event.stopPropagation()"
-                          >
-                            <img [src]="fileAttachment.src" [alt]="fileAttachment.name || 'Image'" class="inline-image" />
-                          </div>
-                        } @else {
-                          <ds-mobile-card-inline-file
-                            [fileName]="fileAttachment.name || 'Unknown file'"
-                            [fileSize]="fileAttachment.size || ''"
-                            [variant]="getFileVariant(fileAttachment.type)"
-                            [layout]="'compact'"
-                            (fileClick)="handleFileAttachmentClick(fileAttachment)"
-                          >
-                          </ds-mobile-card-inline-file>
+                    @if (!message.deletedAt && message.fileAttachments && message.fileAttachments.length > 0) {
+                      <div
+                        class="message-file-attachments"
+                        [class.own-message]="message.isOwnMessage"
+                        [class.attachment-only]="!message.content.trim()"
+                        (click)="handleMessageClick(message.id)"
+                        (touchstart)="startAttachmentLongPress(message)"
+                        (touchend)="cancelAttachmentLongPress()"
+                        (touchcancel)="cancelAttachmentLongPress()"
+                      >
+                        @for (fileAttachment of message.fileAttachments; track fileAttachment.id) {
+                          @if (fileAttachment.type === 'image') {
+                            <div class="message-image-attachment" (click)="handleImageClick(fileAttachment, message); $event.stopPropagation()">
+                              <img [src]="fileAttachment.src" [alt]="fileAttachment.name || 'Image'" class="inline-image" />
+                            </div>
+                          } @else {
+                            <ds-mobile-card-inline-file
+                              [fileName]="fileAttachment.name || 'Unknown file'"
+                              [fileSize]="fileAttachment.size || ''"
+                              [variant]="getFileVariant(fileAttachment.type)"
+                              [layout]="'compact'"
+                              (fileClick)="handleFileAttachmentClick(fileAttachment)"
+                            >
+                            </ds-mobile-card-inline-file>
+                          }
                         }
-                      }
-                    </div>
+                      </div>
+                    }
                   }
                 }
               }
-            }
+            </div>
           </div>
-        </div>
-      </ds-mobile-section>
+        </ds-mobile-section>
       }
 
       <!-- Fixed message composer -->
@@ -33642,6 +33642,29 @@ class MobileInquiryDetailPageComponent {
                     isOwnMessage: false,
                     avatarInitials: messageThread.senderInitials,
                     avatarType: 'initials',
+                },
+                {
+                    id: '11',
+                    content: 'Note til intern brug: Tjek også om ventilationen skal renses under besøget.',
+                    senderId: 'current-user',
+                    senderName: 'You',
+                    timestamp: new Date(Date.now() - 30000),
+                    isOwnMessage: true,
+                    isInternal: true,
+                    avatarInitials: this.userService.avatarInitials(),
+                    avatarType: 'initials',
+                },
+                {
+                    id: '12',
+                    content: 'Modtaget, jeg tager udstyr med til ventilationen også.',
+                    senderId: messageId,
+                    senderName: messageThread.senderName,
+                    senderRole: messageThread.role,
+                    timestamp: new Date(Date.now() - 10000),
+                    isOwnMessage: false,
+                    isInternal: true,
+                    avatarInitials: messageThread.senderInitials,
+                    avatarType: 'initials',
                 }
             ],
             currentUserId: 'current-user',