/* ========================================
   ConvoFrame - Platform-Specific Styles
   ======================================== */

/* ========================================
   Platform Icon Colors
   ======================================== */

.platform-icon.whatsapp {
  color: #25d366;
}
.platform-icon.imessage {
  color: #34c759;
}
.platform-icon.discord {
  color: #5865f2;
}
.platform-icon.slack {
  color: #4a154b;
}
.platform-icon.teams {
  color: #6264a7;
}
.platform-icon.twitter {
  color: #1da1f2;
}
.platform-icon.x {
  color: #000000;
}
[data-theme='dark'] .platform-icon.x {
  color: #ffffff;
}
.platform-icon.linkedin {
  color: #0a66c2;
}
.platform-icon.facebook {
  color: #1877f2;
}
.platform-icon.instagram {
  color: #e4405f;
}
.platform-icon.tiktok {
  color: #000000;
}
[data-theme='dark'] .platform-icon.tiktok {
  color: #ffffff;
}
.platform-icon.messenger {
  color: #0084ff;
}
.platform-icon.telegram {
  color: #0088cc;
}
.platform-icon.signal {
  color: #3a76f0;
}
.platform-icon.snapchat {
  color: #fffc00;
}
.platform-icon.line {
  color: #00c300;
}
.platform-icon.wechat {
  color: #07c160;
}
.platform-icon.reddit {
  color: #ff4500;
}
.platform-icon.tinder {
  color: #fe3c72;
}
.platform-icon.instagram_dm {
  color: #e4405f;
}
.platform-icon.linkedin_dm {
  color: #0a66c2;
}
.platform-icon.tiktok_dm {
  color: #000000;
}
[data-theme='dark'] .platform-icon.tiktok_dm {
  color: #ffffff;
}

/* ========================================
   WhatsApp Styles
   ======================================== */

.chat-whatsapp {
  --chat-bg: #ece5dd;
  --chat-header-bg: #075e54;
  --chat-header-text: #ffffff;
  --bubble-sent-bg: #dcf8c6;
  --bubble-sent-text: #000000;
  --bubble-received-bg: #ffffff;
  --bubble-received-text: #000000;
  --timestamp-color: #667781;
  --input-bg: #ffffff;
}

.chat-whatsapp.dark {
  --chat-bg: #0b141a;
  --chat-header-bg: #1f2c34;
  --chat-header-text: #ffffff;
  --bubble-sent-bg: #005c4b;
  --bubble-sent-text: #ffffff;
  --bubble-received-bg: #1f2c34;
  --bubble-received-text: #ffffff;
  --timestamp-color: #8696a0;
  --input-bg: #1f2c34;
}

/* ========================================
   iMessage Styles
   ======================================== */

.chat-imessage {
  --chat-bg: #ffffff;
  --chat-header-bg: #f6f6f6;
  --chat-header-text: #000000;
  --bubble-sent-bg: #007aff;
  --bubble-sent-text: #ffffff;
  --bubble-received-bg: #e9e9eb;
  --bubble-received-text: #000000;
  --timestamp-color: #8e8e93;
  --input-bg: #ffffff;
}

.chat-imessage.dark {
  --chat-bg: #000000;
  --chat-header-bg: #1c1c1e;
  --chat-header-text: #ffffff;
  --bubble-sent-bg: #0b84fe;
  --bubble-sent-text: #ffffff;
  --bubble-received-bg: #2c2c2e;
  --bubble-received-text: #ffffff;
  --timestamp-color: #8e8e93;
  --input-bg: #1c1c1e;
}

/* ========================================
   Discord Styles
   ======================================== */

.chat-discord {
  --chat-bg: #ffffff;
  --chat-header-bg: #ffffff;
  --chat-header-text: #060607;
  --chat-header-border: #e3e5e8;
  --bubble-sent-bg: transparent;
  --bubble-sent-text: #2e3338;
  --bubble-received-bg: transparent;
  --bubble-received-text: #2e3338;
  --timestamp-color: #747f8d;
  --input-bg: #ebedef;
  --username-color: #5865f2;
}

.chat-discord.dark {
  --chat-bg: #313338;
  --chat-header-bg: #313338;
  --chat-header-text: #f2f3f5;
  --chat-header-border: #3f4147;
  --bubble-sent-bg: transparent;
  --bubble-sent-text: #dbdee1;
  --bubble-received-bg: transparent;
  --bubble-received-text: #dbdee1;
  --timestamp-color: #949ba4;
  --input-bg: #383a40;
  --username-color: #5865f2;
}

/* ========================================
   Slack Styles
   ======================================== */

.chat-slack {
  --chat-bg: #ffffff;
  --chat-header-bg: #350d36;
  --chat-header-text: #ffffff;
  --bubble-sent-bg: transparent;
  --bubble-sent-text: #1d1c1d;
  --bubble-received-bg: transparent;
  --bubble-received-text: #1d1c1d;
  --timestamp-color: #616061;
  --input-bg: #ffffff;
  --input-border: #868686;
}

.chat-slack.dark {
  --chat-bg: #1a1d21;
  --chat-header-bg: #19171d;
  --chat-header-text: #d1d2d3;
  --bubble-sent-bg: transparent;
  --bubble-sent-text: #d1d2d3;
  --bubble-received-bg: transparent;
  --bubble-received-text: #d1d2d3;
  --timestamp-color: #9b9a9b;
  --input-bg: #222529;
  --input-border: #565856;
}

/* ========================================
   Microsoft Teams Styles
   ======================================== */

.chat-teams {
  --chat-bg: #f5f5f5;
  --chat-header-bg: #444791;
  --chat-header-text: #ffffff;
  --bubble-sent-bg: #e5e5f1;
  --bubble-sent-text: #252424;
  --bubble-received-bg: #ffffff;
  --bubble-received-text: #252424;
  --timestamp-color: #616161;
  --input-bg: #ffffff;
}

.chat-teams.dark {
  --chat-bg: #1f1f1f;
  --chat-header-bg: #444791;
  --chat-header-text: #ffffff;
  --bubble-sent-bg: #464775;
  --bubble-sent-text: #ffffff;
  --bubble-received-bg: #292929;
  --bubble-received-text: #ffffff;
  --timestamp-color: #a0a0a0;
  --input-bg: #292929;
}

/* ========================================
   Messenger Styles
   ======================================== */

.chat-messenger {
  --chat-bg: #ffffff;
  --chat-header-bg: #ffffff;
  --chat-header-text: #000000;
  --bubble-sent-bg: #0084ff;
  --bubble-sent-text: #ffffff;
  --bubble-received-bg: #e4e6eb;
  --bubble-received-text: #000000;
  --timestamp-color: #65676b;
  --input-bg: #f0f2f5;
}

.chat-messenger.dark {
  --chat-bg: #000000;
  --chat-header-bg: #000000;
  --chat-header-text: #ffffff;
  --bubble-sent-bg: #0084ff;
  --bubble-sent-text: #ffffff;
  --bubble-received-bg: #303030;
  --bubble-received-text: #ffffff;
  --timestamp-color: #b0b3b8;
  --input-bg: #3a3b3c;
}

/* ========================================
   Telegram Styles
   ======================================== */

.chat-telegram {
  --chat-bg: #ffffff;
  --chat-header-bg: #517da2;
  --chat-header-text: #ffffff;
  --bubble-sent-bg: #effdde;
  --bubble-sent-text: #000000;
  --bubble-received-bg: #ffffff;
  --bubble-received-text: #000000;
  --timestamp-color: #a0acb6;
  --input-bg: #ffffff;
}

.chat-telegram.dark {
  --chat-bg: #17212b;
  --chat-header-bg: #242f3d;
  --chat-header-text: #ffffff;
  --bubble-sent-bg: #2b5278;
  --bubble-sent-text: #ffffff;
  --bubble-received-bg: #182533;
  --bubble-received-text: #ffffff;
  --timestamp-color: #6d7f8f;
  --input-bg: #242f3d;
}

/* ========================================
   Signal Styles
   ======================================== */

.chat-signal {
  --chat-bg: #ffffff;
  --chat-header-bg: #3a76f0;
  --chat-header-text: #ffffff;
  --bubble-sent-bg: #3a76f0;
  --bubble-sent-text: #ffffff;
  --bubble-received-bg: #e9e9e9;
  --bubble-received-text: #000000;
  --timestamp-color: #8b8b8b;
  --input-bg: #f3f3f3;
}

.chat-signal.dark {
  --chat-bg: #121212;
  --chat-header-bg: #1c1c1c;
  --chat-header-text: #ffffff;
  --bubble-sent-bg: #3a76f0;
  --bubble-sent-text: #ffffff;
  --bubble-received-bg: #2d2d2d;
  --bubble-received-text: #ffffff;
  --timestamp-color: #8b8b8b;
  --input-bg: #1c1c1c;
}

/* ========================================
   Snapchat Styles
   ======================================== */

.chat-snapchat {
  --chat-bg: #ffffff;
  --chat-header-bg: #fffc00;
  --chat-header-text: #000000;
  --bubble-sent-bg: #0eadff;
  --bubble-sent-text: #ffffff;
  --bubble-received-bg: #e1e1e1;
  --bubble-received-text: #000000;
  --timestamp-color: #8e8e8e;
  --input-bg: #f1f1f1;
}

.chat-snapchat.dark {
  --chat-bg: #000000;
  --chat-header-bg: #fffc00;
  --chat-header-text: #000000;
  --bubble-sent-bg: #0eadff;
  --bubble-sent-text: #ffffff;
  --bubble-received-bg: #2c2c2c;
  --bubble-received-text: #ffffff;
  --timestamp-color: #8e8e8e;
  --input-bg: #1c1c1c;
}

/* ========================================
   LINE Styles
   ======================================== */

.chat-line {
  --chat-bg: #7494ab;
  --chat-header-bg: #00c300;
  --chat-header-text: #ffffff;
  --bubble-sent-bg: #00c300;
  --bubble-sent-text: #ffffff;
  --bubble-received-bg: #ffffff;
  --bubble-received-text: #000000;
  --timestamp-color: #4a6572;
  --input-bg: #ffffff;
}

.chat-line.dark {
  --chat-bg: #1a1a1a;
  --chat-header-bg: #00c300;
  --chat-header-text: #ffffff;
  --bubble-sent-bg: #00c300;
  --bubble-sent-text: #ffffff;
  --bubble-received-bg: #2c2c2c;
  --bubble-received-text: #ffffff;
  --timestamp-color: #8e8e8e;
  --input-bg: #2c2c2c;
}

/* ========================================
   WeChat Styles
   ======================================== */

.chat-wechat {
  --chat-bg: #ebebeb;
  --chat-header-bg: #2e2e2e;
  --chat-header-text: #ffffff;
  --bubble-sent-bg: #95ec69;
  --bubble-sent-text: #000000;
  --bubble-received-bg: #ffffff;
  --bubble-received-text: #000000;
  --timestamp-color: #8c8c8c;
  --input-bg: #f5f5f5;
}

.chat-wechat.dark {
  --chat-bg: #111111;
  --chat-header-bg: #2e2e2e;
  --chat-header-text: #ffffff;
  --bubble-sent-bg: #57ab53;
  --bubble-sent-text: #ffffff;
  --bubble-received-bg: #2c2c2c;
  --bubble-received-text: #ffffff;
  --timestamp-color: #6c6c6c;
  --input-bg: #1c1c1c;
}

/* ========================================
   Reddit Styles
   ======================================== */

.chat-reddit {
  --chat-bg: #ffffff;
  --chat-header-bg: #ff4500;
  --chat-header-text: #ffffff;
  --bubble-sent-bg: #0079d3;
  --bubble-sent-text: #ffffff;
  --bubble-received-bg: #f6f7f8;
  --bubble-received-text: #1a1a1b;
  --timestamp-color: #7c7c7c;
  --input-bg: #f6f7f8;
}

.chat-reddit.dark {
  --chat-bg: #1a1a1b;
  --chat-header-bg: #ff4500;
  --chat-header-text: #ffffff;
  --bubble-sent-bg: #0079d3;
  --bubble-sent-text: #ffffff;
  --bubble-received-bg: #272729;
  --bubble-received-text: #d7dadc;
  --timestamp-color: #818384;
  --input-bg: #272729;
}

/* ========================================
   Tinder Styles
   ======================================== */

.chat-tinder {
  --chat-bg: #ffffff;
  --chat-header-bg: linear-gradient(135deg, #fd267a 0%, #ff6036 100%);
  --chat-header-text: #ffffff;
  --bubble-sent-bg: linear-gradient(135deg, #fd267a 0%, #ff6036 100%);
  --bubble-sent-text: #ffffff;
  --bubble-received-bg: #f0f2f4;
  --bubble-received-text: #21262e;
  --timestamp-color: #8e8e8e;
  --input-bg: #f0f2f4;
}

.chat-tinder.dark {
  --chat-bg: #111418;
  --chat-header-bg: linear-gradient(135deg, #fd267a 0%, #ff6036 100%);
  --chat-header-text: #ffffff;
  --bubble-sent-bg: linear-gradient(135deg, #fd267a 0%, #ff6036 100%);
  --bubble-sent-text: #ffffff;
  --bubble-received-bg: #21262e;
  --bubble-received-text: #ffffff;
  --timestamp-color: #8e8e8e;
  --input-bg: #21262e;
}

/* ========================================
   Instagram DM Styles
   ======================================== */

.chat-instagram {
  --chat-bg: #ffffff;
  --chat-header-bg: #ffffff;
  --chat-header-text: #262626;
  --chat-header-border: #dbdbdb;
  --bubble-sent-bg: #3797f0;
  --bubble-sent-text: #ffffff;
  --bubble-received-bg: #efefef;
  --bubble-received-text: #262626;
  --timestamp-color: #8e8e8e;
  --input-bg: #ffffff;
}

.chat-instagram.dark {
  --chat-bg: #000000;
  --chat-header-bg: #000000;
  --chat-header-text: #f5f5f5;
  --chat-header-border: #262626;
  --bubble-sent-bg: #3797f0;
  --bubble-sent-text: #ffffff;
  --bubble-received-bg: #262626;
  --bubble-received-text: #f5f5f5;
  --timestamp-color: #a8a8a8;
  --input-bg: #121212;
}

/* ========================================
   LinkedIn DM Styles
   ======================================== */

.chat-linkedin {
  --chat-bg: #ffffff;
  --chat-header-bg: #ffffff;
  --chat-header-text: #000000;
  --chat-header-border: #e0e0e0;
  --bubble-sent-bg: #0a66c2;
  --bubble-sent-text: #ffffff;
  --bubble-received-bg: #f3f6f8;
  --bubble-received-text: #000000;
  --timestamp-color: #666666;
  --input-bg: #ffffff;
}

.chat-linkedin.dark {
  --chat-bg: #1d2226;
  --chat-header-bg: #1d2226;
  --chat-header-text: #ffffff;
  --chat-header-border: #38434f;
  --bubble-sent-bg: #71b7fb;
  --bubble-sent-text: #000000;
  --bubble-received-bg: #38434f;
  --bubble-received-text: #ffffff;
  --timestamp-color: #ffffffb3;
  --input-bg: #38434f;
}

/* ========================================
   TikTok DM Styles
   ======================================== */

.chat-tiktok {
  --chat-bg: #ffffff;
  --chat-header-bg: #ffffff;
  --chat-header-text: #161823;
  --chat-header-border: #e3e3e4;
  --bubble-sent-bg: #fe2c55;
  --bubble-sent-text: #ffffff;
  --bubble-received-bg: #f1f1f2;
  --bubble-received-text: #161823;
  --timestamp-color: #75767b;
  --input-bg: #f1f1f2;
}

.chat-tiktok.dark {
  --chat-bg: #121212;
  --chat-header-bg: #121212;
  --chat-header-text: #ffffff;
  --chat-header-border: #2f2f2f;
  --bubble-sent-bg: #fe2c55;
  --bubble-sent-text: #ffffff;
  --bubble-received-bg: #2f2f2f;
  --bubble-received-text: #ffffff;
  --timestamp-color: #a1a1a2;
  --input-bg: #2f2f2f;
}

/* ========================================
   Twitter/X Post Styles
   ======================================== */

.post-twitter,
.post-x {
  --post-bg: #ffffff;
  --post-text: #0f1419;
  --post-secondary: #536471;
  --post-border: #eff3f4;
  --post-link: #1d9bf0;
  --post-like: #f91880;
  --post-retweet: #00ba7c;
  --verified-color: #1d9bf0;
}

.post-twitter.dark,
.post-x.dark {
  --post-bg: #000000;
  --post-text: #e7e9ea;
  --post-secondary: #71767b;
  --post-border: #2f3336;
  --post-link: #1d9bf0;
  --post-like: #f91880;
  --post-retweet: #00ba7c;
  --verified-color: #1d9bf0;
}

/* ========================================
   LinkedIn Post Styles
   ======================================== */

.post-linkedin {
  --post-bg: #ffffff;
  --post-text: #000000;
  --post-secondary: #666666;
  --post-border: #e0e0e0;
  --post-link: #0a66c2;
  --post-like: #0a66c2;
  --verified-color: #0a66c2;
}

.post-linkedin.dark {
  --post-bg: #1d2226;
  --post-text: #ffffff;
  --post-secondary: #ffffffb3;
  --post-border: #38434f;
  --post-link: #71b7fb;
  --post-like: #71b7fb;
  --verified-color: #71b7fb;
}

/* ========================================
   Facebook Post Styles
   ======================================== */

.post-facebook {
  --post-bg: #ffffff;
  --post-text: #050505;
  --post-secondary: #65676b;
  --post-border: #ced0d4;
  --post-link: #216fdb;
  --post-like: #1877f2;
  --reaction-love: #f33e58;
  --reaction-haha: #f7b125;
}

.post-facebook.dark {
  --post-bg: #242526;
  --post-text: #e4e6eb;
  --post-secondary: #b0b3b8;
  --post-border: #3e4042;
  --post-link: #2d88ff;
  --post-like: #2d88ff;
  --reaction-love: #f33e58;
  --reaction-haha: #f7b125;
}

/* ========================================
   Instagram Post Styles
   ======================================== */

.post-instagram {
  --post-bg: #ffffff;
  --post-text: #262626;
  --post-secondary: #8e8e8e;
  --post-border: #dbdbdb;
  --post-link: #00376b;
  --post-like: #ed4956;
  --verified-color: #0095f6;
}

.post-instagram.dark {
  --post-bg: #000000;
  --post-text: #f5f5f5;
  --post-secondary: #a8a8a8;
  --post-border: #262626;
  --post-link: #e0f1ff;
  --post-like: #ed4956;
  --verified-color: #0095f6;
}

/* ========================================
   TikTok Post Styles
   ======================================== */

.post-tiktok {
  --post-bg: #ffffff;
  --post-text: #161823;
  --post-secondary: #75767b;
  --post-border: #e3e3e4;
  --post-link: #161823;
  --post-like: #fe2c55;
  --verified-color: #20d5ec;
}

.post-tiktok.dark {
  --post-bg: #121212;
  --post-text: #ffffff;
  --post-secondary: #a1a1a2;
  --post-border: #2f2f2f;
  --post-link: #ffffff;
  --post-like: #fe2c55;
  --verified-color: #20d5ec;
}

/* ========================================
   Chat Message Bubble Styles
   ======================================== */

/* WhatsApp Bubbles */
.chat-whatsapp .message-bubble {
  max-width: 65%;
  padding: 6px 12px 8px;
  border-radius: 7.5px;
  position: relative;
  margin: 2px 0;
}

.chat-whatsapp .message-bubble.sent {
  background-color: var(--bubble-sent-bg);
  color: var(--bubble-sent-text);
  margin-left: auto;
  border-top-right-radius: 0;
}

.chat-whatsapp .message-bubble.received {
  background-color: var(--bubble-received-bg);
  color: var(--bubble-received-text);
  margin-right: auto;
  border-top-left-radius: 0;
}

/* iMessage Bubbles */
.chat-imessage .message-bubble {
  max-width: 70%;
  padding: 8px 12px;
  border-radius: 18px;
  margin: 2px 0;
}

.chat-imessage .message-bubble.sent {
  background-color: var(--bubble-sent-bg);
  color: var(--bubble-sent-text);
  margin-left: auto;
  border-bottom-right-radius: 4px;
}

.chat-imessage .message-bubble.received {
  background-color: var(--bubble-received-bg);
  color: var(--bubble-received-text);
  margin-right: auto;
  border-bottom-left-radius: 4px;
}

/* Discord Messages (no bubbles) */
.chat-discord .message-bubble {
  max-width: 100%;
  padding: 2px 0;
  background: transparent;
}

.chat-discord .message-content {
  display: flex;
  gap: 16px;
  padding: 4px 16px;
}

.chat-discord .message-content:hover {
  background-color: rgba(0, 0, 0, 0.02);
}

.chat-discord.dark .message-content:hover {
  background-color: rgba(255, 255, 255, 0.02);
}

/* Slack Messages (no bubbles) */
.chat-slack .message-bubble {
  max-width: 100%;
  padding: 4px 0;
  background: transparent;
}

.chat-slack .message-content {
  display: flex;
  gap: 8px;
  padding: 8px 20px;
}

.chat-slack .message-content:hover {
  background-color: rgba(0, 0, 0, 0.04);
}

.chat-slack.dark .message-content:hover {
  background-color: rgba(255, 255, 255, 0.04);
}

/* Teams Bubbles */
.chat-teams .message-bubble {
  max-width: 60%;
  padding: 8px 12px;
  border-radius: 4px;
  margin: 8px 0;
}

.chat-teams .message-bubble.sent {
  background-color: var(--bubble-sent-bg);
  color: var(--bubble-sent-text);
  margin-left: auto;
}

.chat-teams .message-bubble.received {
  background-color: var(--bubble-received-bg);
  color: var(--bubble-received-text);
  margin-right: auto;
}

/* Messenger Bubbles */
.chat-messenger .message-bubble {
  max-width: 65%;
  padding: 8px 12px;
  border-radius: 18px;
  margin: 2px 0;
}

.chat-messenger .message-bubble.sent {
  background-color: var(--bubble-sent-bg);
  color: var(--bubble-sent-text);
  margin-left: auto;
  border-bottom-right-radius: 4px;
}

.chat-messenger .message-bubble.received {
  background-color: var(--bubble-received-bg);
  color: var(--bubble-received-text);
  margin-right: auto;
  border-bottom-left-radius: 4px;
}

/* Telegram Bubbles */
.chat-telegram .message-bubble {
  max-width: 65%;
  padding: 6px 12px 8px;
  border-radius: 12px;
  margin: 2px 0;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
}

.chat-telegram .message-bubble.sent {
  background-color: var(--bubble-sent-bg);
  color: var(--bubble-sent-text);
  margin-left: auto;
  border-bottom-right-radius: 4px;
}

.chat-telegram .message-bubble.received {
  background-color: var(--bubble-received-bg);
  color: var(--bubble-received-text);
  margin-right: auto;
  border-bottom-left-radius: 4px;
}

/* Signal Bubbles */
.chat-signal .message-bubble {
  max-width: 70%;
  padding: 10px 14px;
  border-radius: 18px;
  margin: 2px 0;
}

.chat-signal .message-bubble.sent {
  background-color: var(--bubble-sent-bg);
  color: var(--bubble-sent-text);
  margin-left: auto;
  border-bottom-right-radius: 4px;
}

.chat-signal .message-bubble.received {
  background-color: var(--bubble-received-bg);
  color: var(--bubble-received-text);
  margin-right: auto;
  border-bottom-left-radius: 4px;
}

/* Snapchat Bubbles */
.chat-snapchat .message-bubble {
  max-width: 70%;
  padding: 10px 14px;
  border-radius: 20px;
  margin: 2px 0;
}

.chat-snapchat .message-bubble.sent {
  background-color: var(--bubble-sent-bg);
  color: var(--bubble-sent-text);
  margin-left: auto;
}

.chat-snapchat .message-bubble.received {
  background-color: var(--bubble-received-bg);
  color: var(--bubble-received-text);
  margin-right: auto;
}

/* LINE Bubbles */
.chat-line .message-bubble {
  max-width: 65%;
  padding: 10px 14px;
  border-radius: 20px;
  margin: 4px 0;
}

.chat-line .message-bubble.sent {
  background-color: var(--bubble-sent-bg);
  color: var(--bubble-sent-text);
  margin-left: auto;
  border-bottom-right-radius: 4px;
}

.chat-line .message-bubble.received {
  background-color: var(--bubble-received-bg);
  color: var(--bubble-received-text);
  margin-right: auto;
  border-bottom-left-radius: 4px;
}

/* WeChat Bubbles */
.chat-wechat .message-bubble {
  max-width: 65%;
  padding: 10px 14px;
  border-radius: 4px;
  margin: 4px 0;
  position: relative;
}

.chat-wechat .message-bubble.sent {
  background-color: var(--bubble-sent-bg);
  color: var(--bubble-sent-text);
  margin-left: auto;
}

.chat-wechat .message-bubble.received {
  background-color: var(--bubble-received-bg);
  color: var(--bubble-received-text);
  margin-right: auto;
}

/* Reddit Messages */
.chat-reddit .message-bubble {
  max-width: 70%;
  padding: 10px 14px;
  border-radius: 20px;
  margin: 2px 0;
}

.chat-reddit .message-bubble.sent {
  background-color: var(--bubble-sent-bg);
  color: var(--bubble-sent-text);
  margin-left: auto;
}

.chat-reddit .message-bubble.received {
  background-color: var(--bubble-received-bg);
  color: var(--bubble-received-text);
  margin-right: auto;
}

/* Tinder Bubbles */
.chat-tinder .message-bubble {
  max-width: 70%;
  padding: 10px 16px;
  border-radius: 20px;
  margin: 2px 0;
}

.chat-tinder .message-bubble.sent {
  background: var(--bubble-sent-bg);
  color: var(--bubble-sent-text);
  margin-left: auto;
}

.chat-tinder .message-bubble.received {
  background-color: var(--bubble-received-bg);
  color: var(--bubble-received-text);
  margin-right: auto;
}

/* Instagram DM Bubbles */
.chat-instagram .message-bubble {
  max-width: 65%;
  padding: 10px 14px;
  border-radius: 22px;
  margin: 2px 0;
}

.chat-instagram .message-bubble.sent {
  background-color: var(--bubble-sent-bg);
  color: var(--bubble-sent-text);
  margin-left: auto;
}

.chat-instagram .message-bubble.received {
  background-color: var(--bubble-received-bg);
  color: var(--bubble-received-text);
  margin-right: auto;
}

/* LinkedIn DM Bubbles */
.chat-linkedin .message-bubble {
  max-width: 65%;
  padding: 10px 14px;
  border-radius: 8px;
  margin: 4px 0;
}

.chat-linkedin .message-bubble.sent {
  background-color: var(--bubble-sent-bg);
  color: var(--bubble-sent-text);
  margin-left: auto;
}

.chat-linkedin .message-bubble.received {
  background-color: var(--bubble-received-bg);
  color: var(--bubble-received-text);
  margin-right: auto;
}

/* TikTok DM Bubbles */
.chat-tiktok .message-bubble {
  max-width: 65%;
  padding: 10px 14px;
  border-radius: 18px;
  margin: 2px 0;
}

.chat-tiktok .message-bubble.sent {
  background-color: var(--bubble-sent-bg);
  color: var(--bubble-sent-text);
  margin-left: auto;
}

.chat-tiktok .message-bubble.received {
  background-color: var(--bubble-received-bg);
  color: var(--bubble-received-text);
  margin-right: auto;
}

/* ========================================
   Social Post Card Styles
   ======================================== */

.social-post-card {
  width: 100%;
  max-width: 550px;
  background-color: var(--post-bg);
  border: 1px solid var(--post-border);
  border-radius: 16px;
  overflow: hidden;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

/* Twitter/X Card */
.post-twitter .social-post-card,
.post-x .social-post-card {
  border-radius: 16px;
}

/* LinkedIn Card */
.post-linkedin .social-post-card {
  border-radius: 8px;
}

/* Facebook Card */
.post-facebook .social-post-card {
  border-radius: 8px;
}

/* Instagram Card */
.post-instagram .social-post-card {
  border-radius: 0;
  border-left: none;
  border-right: none;
}

/* TikTok Card */
.post-tiktok .social-post-card {
  border-radius: 0;
  border: none;
  max-width: 350px;
}

/* ========================================
   Verified Badge Styles
   ======================================== */

.verified-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  margin-left: 4px;
}

.verified-badge svg {
  width: 100%;
  height: 100%;
}

.post-twitter .verified-badge,
.post-x .verified-badge {
  color: var(--verified-color);
}

.post-linkedin .verified-badge {
  color: var(--verified-color);
}

.post-instagram .verified-badge {
  color: var(--verified-color);
}

.post-tiktok .verified-badge {
  color: var(--verified-color);
}

/* ========================================
   Engagement Button Styles
   ======================================== */

.engagement-actions {
  display: flex;
  justify-content: space-between;
  padding: 12px 16px;
  border-top: 1px solid var(--post-border);
}

.engagement-btn {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--post-secondary);
  font-size: 13px;
  transition: color 0.2s;
}

.engagement-btn svg {
  width: 18px;
  height: 18px;
}

.engagement-btn:hover {
  color: var(--post-link);
}

.engagement-btn.like:hover {
  color: var(--post-like);
}

.engagement-btn.retweet:hover,
.engagement-btn.share:hover {
  color: var(--post-retweet, var(--post-link));
}