/* Brodex messenger — scoped to the existing friend/DM modal. */
.ws-modal.messenger-mode {
  --dm-bg0: #101719;
  --dm-bg1: #182124;
  --dm-surface: #222e32;
  --dm-ink: #edf4f4;
  --dm-ink-soft: #a8bbc1;
  --dm-ink-dim: #96a9b0;
  --dm-accent: #08bdd1;
  --dm-hair: #2c393e;
  --messenger-selected: color-mix(in srgb, var(--dm-accent) 12%, var(--dm-bg1));
  width: 100%; max-width: 100%; height: var(--messenger-height, 100dvh);
  max-height: var(--messenger-height, 100dvh); padding: 0; margin: 0;
  border: 0; border-radius: 0; box-shadow: none; overflow: hidden;
  background: var(--dm-bg0); color: var(--dm-ink);
  font-family: 'DM Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 16px; line-height: 1.45;
}
.messenger-mode *, .messenger-mode *::before, .messenger-mode *::after { box-sizing: border-box; }
.messenger-mode button, .messenger-mode input, .messenger-mode textarea { font-family: inherit; }
.messenger-mode button { cursor: pointer; }
.messenger-mode button:focus-visible, .messenger-mode [role=button]:focus-visible,
.messenger-mode summary:focus-visible { outline: 2px solid var(--dm-accent); outline-offset: -2px; }
.messenger-mode input:focus-visible, .messenger-mode textarea:focus-visible { outline: none; }
.messenger-mode .af-search:focus-within, .messenger-mode .dm-input-wrap:focus-within { border-color: var(--dm-accent); }
.messenger-mode > .ws-modal-close { display: none !important; }
.messenger-mode #ws-modal-content { height: 100%; min-height: 0; }
.messenger-mode .af-workspace {
  display: grid; grid-template-columns: clamp(300px, 29vw, 370px) minmax(0, 1fr);
  width: 100%; height: 100%; min-height: 0;
}
.messenger-mode .af-shell {
  min-width: 0; background: var(--dm-bg1); border-right: 1px solid var(--dm-hair);
}
.messenger-mode .af-head { max-width: none; padding: calc(18px + env(safe-area-inset-top)) 18px 4px; }
.messenger-mode .af-toolbar { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.messenger-mode .af-toolbar h1 { margin: 0; flex: 1; color: var(--dm-ink); font-size: 24px; font-weight: 650; letter-spacing: -.6px; line-height: 1.3; }
.messenger-mode .af-close { width: 44px; height: 44px; border: 0; border-radius: 12px; color: var(--dm-ink-soft); background: transparent; font-size: 25px; }
.messenger-mode .af-close:hover { background: var(--dm-surface); color: var(--dm-ink); }
.messenger-mode .af-quick { margin-bottom: 12px; border: 1px solid var(--dm-hair); border-radius: 12px; background: var(--dm-bg0); }
.messenger-mode .af-quick summary { display: flex; align-items: center; gap: 9px; min-height: 44px; padding: 10px 12px; list-style: none; color: var(--dm-accent); font-size: 12px; font-weight: 600; cursor: pointer; letter-spacing: .04em; }
.messenger-mode .af-quick summary::-webkit-details-marker { display: none; }
.messenger-mode .af-quick summary::after { content: '+'; margin-left: auto; font-size: 20px; line-height: 1; }
.messenger-mode .af-quick[open] summary::after { content: '−'; }
.messenger-mode .af-quick .qi-block { padding: 0 10px 12px !important; margin: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }
.messenger-mode .qi-label { display: none !important; }
.messenger-mode .qi-hint { color: var(--dm-ink-soft) !important; font-size: 12px !important; }
.messenger-mode .qi-textarea { font-size: 16px !important; color: var(--dm-ink) !important; }
.messenger-mode .qi-chip { max-width: 46% !important; font-size: 12px !important; padding: 6px 8px !important; }
.messenger-mode .qi-send { width: 44px !important; height: 44px !important; }
.messenger-mode .af-head > .af-search { margin-right: 0; }
.messenger-mode .af-search { background: var(--dm-bg0); border-radius: 11px; box-shadow: none; padding: 10px 12px; margin-bottom: 13px; min-height: 44px; }
.messenger-mode .af-search input { font-size: 16px; }
.messenger-mode .af-search svg { color: var(--dm-ink-soft); }
.messenger-mode .af-sec { margin: 3px 0 8px; }
.messenger-mode .af-sec-lbl { font-size: 12px; font-weight: 500; color: var(--dm-ink-soft); letter-spacing: .04em; }
.messenger-mode .af-sec-rule { display: none; }
.messenger-mode .af-sort { margin-left: auto; border: 0; background: transparent; width: 44px; height: 44px; border-radius: 10px; }
.messenger-mode .af-list { max-width: none; padding: 0 8px 14px; overscroll-behavior: contain; }
.ws-modal.messenger-mode .wsf-row {
  display: flex; align-items: center; gap: 12px; margin: 0 0 3px; padding: 13px 10px;
  min-height: 76px; border: 0; border-radius: 11px; box-shadow: none;
  background: transparent !important; filter: none;
}
.ws-modal.messenger-mode .wsf-row:hover { background: color-mix(in srgb, var(--dm-ink) 4%, var(--dm-bg1)) !important; filter: none; }
.ws-modal.messenger-mode .wsf-row.af-selected { background: var(--messenger-selected) !important; }
.messenger-mode .wsf-mid { flex: 1; min-width: 0; }
.messenger-mode .wsf-top { gap: 8px; }
.messenger-mode .wsf-name { font-size: 15px; font-weight: 600; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.messenger-mode .wsf-msg { font-size: 13px; }
.messenger-mode .wsf-time { font-size: 12px; white-space: nowrap; }
.messenger-mode .wsf-prev { gap: 6px; }
.messenger-mode .wsf-badge { background: var(--dm-accent); color: var(--dm-bg0); font-size: 12px; font-weight: 600; min-width: 20px; height: 20px; }
.messenger-mode .wsf-tick { color: var(--dm-accent); }
.messenger-mode #af-cards .wsf-actions { display: none; }
.messenger-mode .af-kisi-row { flex-wrap: wrap; }
.messenger-mode .af-kisi-row .wsf-actions { display: flex; opacity: 1; }
.messenger-mode .af-kisi-row .wsf-actions button { width: 44px; height: 44px; }
.messenger-mode .af-kisi-row .ws-list-item-action { min-height: 44px; font-size: 13px; }
.messenger-mode .af-kisi-row .wsf-name { white-space: normal; overflow-wrap: anywhere; }
.messenger-mode .af-list > .af-sec { margin: 14px 10px 5px; }
.messenger-mode .af-navwrap { padding: 9px 12px calc(9px + env(safe-area-inset-bottom)); background: var(--dm-bg1); box-shadow: none; }
.messenger-mode .af-nav { gap: 6px; }
.messenger-mode .af-nav-btn { flex: 1; min-height: 54px; padding: 6px 8px; gap: 3px; color: var(--dm-ink-soft); }
.messenger-mode .af-nav-btn.active { color: var(--dm-accent); background: var(--messenger-selected); border-radius: 11px; }
.messenger-mode .af-nav-lbl { font-size: 12px; letter-spacing: 0; font-weight: 500; }
.messenger-mode .af-fab { width: 46px; height: 46px; background: var(--dm-accent); color: var(--dm-bg0); box-shadow: none; }
.messenger-mode .af-nav-badge { color: var(--dm-bg0); font-size: 11px; }
.messenger-mode .af-empty, .messenger-mode .af-loading, .messenger-mode .dm-history-status { color: var(--dm-ink-soft); font-size: 14px; padding: 24px 14px; text-align: center; }
.messenger-mode .af-empty[hidden] { display: none; }
.messenger-mode .af-retry { display: block; margin: 12px auto 0; min-height: 44px; border: 1px solid var(--dm-hair); border-radius: 10px; padding: 8px 14px; color: var(--dm-ink); background: var(--dm-surface); font-size: 14px; }
.messenger-mode .af-conversation { height: 100%; min-width: 0; min-height: 0; overflow: hidden; background: var(--dm-bg0); }
.messenger-mode .af-welcome { height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 24px; text-align: center; }
.messenger-mode .af-welcome-icon { display: grid; place-items: center; width: 68px; height: 68px; color: var(--dm-accent); background: var(--messenger-selected); border-radius: 23px; margin-bottom: 18px; }
.messenger-mode .af-welcome h2 { font-size: 21px; font-weight: 500; margin: 0 0 8px; color: var(--dm-ink); }
.messenger-mode .af-welcome p { font-size: 14px; color: var(--dm-ink-soft); margin: 0; }
.messenger-mode .dm-chat { background: var(--dm-bg0); min-height: 0; }
.messenger-mode .dm-header { flex-shrink: 0; padding: calc(16px + env(safe-area-inset-top)) 24px 16px; min-height: 80px; gap: 12px; background: var(--dm-bg1); backdrop-filter: none; }
.messenger-mode .dm-user-name { font-size: 16px; line-height: 1.35; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.messenger-mode .dm-avatar { background: var(--messenger-selected); box-shadow: none; font-weight: 500; }
.messenger-mode .dm-back { width: 44px; min-height: 44px; flex-shrink: 0; color: var(--dm-ink-soft); }
.messenger-mode .dm-hdr-icon { width: 44px; height: 44px; flex-shrink: 0; border-radius: 12px; }
.messenger-mode .dm-header-actions { gap: 2px; }
.messenger-mode #dm-messages { flex: 1; min-height: 0; padding: 22px clamp(20px, 5vw, 80px); overscroll-behavior: contain; }
.messenger-mode .dm-msg-group { max-width: min(78%, 620px); }
.messenger-mode .dm-msg-bubble { font-size: 15px; line-height: 1.5; padding: 11px 15px; white-space: pre-wrap; overflow-wrap: anywhere; border: 0; box-shadow: none; }
.messenger-mode .dm-msg-group.other .dm-msg-bubble { background: var(--dm-surface); color: var(--dm-ink); border-radius: 15px 15px 15px 4px; border: 0; box-shadow: none; }
.messenger-mode .dm-msg-group.me .dm-msg-bubble { background: color-mix(in srgb, var(--dm-accent) 21%, var(--dm-bg1)); color: var(--dm-ink); border-radius: 15px 15px 4px 15px; border: 0; box-shadow: none; }
.messenger-mode .dm-msg-bubble.emoji-only { font-size: 38px; padding: 4px 2px; background: transparent !important; }
.messenger-mode .dm-msg-time { color: var(--dm-ink-soft) !important; font-size: 12px; }
.messenger-mode .dm-read-thumb { color: var(--dm-ink-soft); filter: none; }
.messenger-mode .dm-read-thumb.read { color: var(--dm-accent); filter: none; }
.messenger-mode .dm-read-thumb svg { width: 19px; height: 16px; fill: none; }
.messenger-mode .dm-date-sep { margin: 12px 0 20px; }
.messenger-mode .dm-date-sep span { background: transparent; color: var(--dm-ink-soft); font-size: 12px; border: 0; box-shadow: none; }
.messenger-mode .dm-input-area { flex-shrink: 0; padding: 14px 24px calc(14px + env(safe-area-inset-bottom)); gap: 10px; background: var(--dm-bg1); align-items: flex-end; }
.messenger-mode .dm-input-wrap { min-width: 0; padding: 0 15px; border-radius: 15px; background: var(--dm-bg0); }
.messenger-mode .dm-input-wrap textarea { width: 100%; min-width: 0; min-height: 44px; max-height: 140px; padding: 10px 0; border: 0; color: var(--dm-ink); background: transparent; resize: none; font: inherit; font-size: 16px; line-height: 1.5; }
.messenger-mode .dm-input-wrap textarea::placeholder { color: var(--dm-ink-soft); }
.messenger-mode .dm-send-btn { width: 46px; height: 46px; background: var(--dm-accent); color: var(--dm-bg0); box-shadow: none; }
.messenger-mode .dm-attach-btn { width: 44px; height: 46px; }
.messenger-mode .dm-kebab-menu { top: calc(68px + env(safe-area-inset-top, 0px)); right: 18px; width: min(280px, calc(100vw - 24px)); background: var(--dm-surface); color: var(--dm-ink); border: 1px solid var(--dm-hair); border-radius: 14px; }
.messenger-mode .dm-kebab-menu:not(.open) { visibility: hidden; }
.messenger-mode .dm-kebab-menu.open { visibility: visible; }
.messenger-mode .dm-kebab-row:focus-visible { outline: 2px solid var(--dm-accent); outline-offset: -3px; }
.messenger-mode .dm-kebab-row { min-height: 48px; }
.messenger-mode .dm-kebab-lbl .t { font-size: 14px; }
.messenger-mode .dm-lang-dropdown { z-index: 40; top: calc(75px + env(safe-area-inset-top, 0px)); max-height: min(320px, 50dvh); background: var(--dm-surface); }
.messenger-mode .dm-lang-dropdown div { min-height: 44px; }
.messenger-mode .dm-media-img, .messenger-mode .dm-media-video { max-width: 100%; max-height: 340px; }
@media (min-width: 761px) {
  .messenger-mode .dm-back { display: none; }
}
@media (max-width: 760px) {
  .ws-modal.messenger-mode { position: absolute; top: var(--messenger-top, 0px); left: 0; }
  .messenger-mode .af-workspace { display: block; }
  .messenger-mode .af-shell { border: 0; }
  .messenger-mode .af-conversation { display: none; }
  .messenger-mode.dm-open .af-shell { display: none; }
  .messenger-mode.dm-open .af-conversation { display: block; }
  .messenger-mode .af-head { padding: calc(12px + env(safe-area-inset-top)) 16px 0; }
  .messenger-mode .af-toolbar { margin-bottom: 10px; }
  .messenger-mode .af-list { padding: 0 7px 12px; }
  .messenger-mode .dm-header { padding: calc(10px + env(safe-area-inset-top)) 8px 10px; min-height: 66px; gap: 7px; }
  .messenger-mode .dm-avatar { width: 34px; height: 34px; font-size: 13px; }
  .messenger-mode .dm-user-name { font-size: 15px; }
  .messenger-mode .dm-back { display: block; }
  .messenger-mode #dm-messages { padding: 16px 14px; }
  .messenger-mode .dm-msg-group { max-width: 87%; }
  .messenger-mode .dm-input-area { padding: 9px 8px calc(9px + env(safe-area-inset-bottom)); gap: 5px; }
  /* 7 Eyl iPhone çentik vakası (index.html .dm-lang-dropdown notu): başlık safe-area ile büyür, menüler de onunla insin. */
  .messenger-mode .dm-kebab-menu { top: calc(60px + env(safe-area-inset-top, 0px)); right: 10px; }
  .messenger-mode .dm-lang-dropdown { top: calc(65px + env(safe-area-inset-top, 0px)); right: 10px; }
  .messenger-mode .wsf-row.af-selected { background: transparent !important; }
}
@media (prefers-reduced-motion: reduce) {
  .messenger-mode *, .messenger-mode *::before, .messenger-mode *::after { transition: none !important; animation: none !important; }
}