/* Bandejas del Cliente y la Agencia, adaptadas a los estilos compartidos. */
[data-premium] .messages-app { height: 100dvh; min-height: 0; overflow: hidden; }
.messages-app > .main { min-height: 0; overflow: hidden; }
[data-premium] .messages-app .topbar { height: 56px; min-height: 56px; padding: 8px 20px; }
[data-premium] .messages-app .topbar h1 { font-size: 17px; color: var(--foreground); }
[data-premium] .messages-page { max-width: none; padding: 12px 20px 44px; display: flex; flex: 1; min-height: 0; }
.messages-workspace { display: grid; grid-template-columns: 280px minmax(0, 1fr); grid-template-rows: minmax(0, 1fr); overflow: hidden; flex: 1; min-width: 0; min-height: 0; }
.messages-list { min-width: 0; min-height: 0; display: flex; flex-direction: column; border-right: 1px solid var(--border); background: var(--card); }
.messages-list-head { padding: 14px; border-bottom: 1px solid var(--border); flex-shrink: 0; }
.messages-list-title { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; }
.messages-list-title h3 { margin: 0; font-size: 15px; letter-spacing: -.02em; }
.messages-total { font-size: 11px; font-weight: 700; color: var(--muted-foreground); border: 1px solid var(--border); padding: 2px 7px; border-radius: 6px; }
.messages-list .searchbox { width: 100%; min-width: 0; background: var(--surface-2); border-color: transparent; }
.messages-list .searchbox input { width: 100%; min-width: 0; }
.messages-contacts { overflow-y: auto; padding: 8px; }
.conversation-row { display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; align-items: center; gap: 10px; width: 100%; text-align: left; color: var(--foreground); background: transparent; padding: 14px 10px; border: 1px solid transparent; border-radius: 12px; margin-bottom: 4px; }
.conversation-row:hover { background: var(--surface-2); }
.conversation-row:focus-visible, .messages-back:focus-visible, #reply-channel:focus-visible { outline: 2px solid var(--primary); outline-offset: -2px; }
.conversation-row + .conversation-row:not(.is-selected) { border-top-color: var(--border); }
.conversation-row.is-selected { background: var(--primary-soft); border-color: var(--border-strong); box-shadow: inset 3px 0 var(--primary); }
.conversation-row > .avatar { width: 36px; height: 36px; font-size: 11px; margin-top: 2px; }
.conversation-copy { min-width: 0; }
.conversation-name { display: block; font-size: 13px; font-weight: 700; }
.conversation-channels { display: block; font-size: 10px; color: var(--muted-foreground); margin-top: 4px; }
.conversation-unread { display: grid; place-items: center; min-width: 18px; height: 18px; padding: 0 4px; border-radius: 6px; font-size: 10px; background: var(--primary); color: var(--primary-foreground); }
.messages-empty { padding: 14px; color: var(--muted-foreground); font-size: 12px; }
.messages-contact-details { border-bottom: 1px solid var(--border); flex: none; max-height: 35%; overflow-y: auto; background: var(--card); }
.messages-contact-details summary { padding: 7px 20px; font-size: 11px; cursor: pointer; color: var(--muted-foreground); }
.messages-contact-details-body { padding: 4px 20px 14px; }
.messages-profile { margin-bottom: 12px; }
.messages-profile-fields { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 8px 16px; font-size: 12px; margin: 12px 0; }
.messages-profile-fields dt { color: var(--muted-foreground); }
.messages-profile-fields dd { margin: 0; overflow-wrap: anywhere; }
.messages-conversation { display: flex; flex-direction: column; min-width: 0; min-height: 0; }
.messages-thread-head { display: flex; align-items: center; gap: 10px; padding: 12px 20px; border-bottom: 1px solid var(--border); }
.messages-contact-heading { min-width: 0; }
.messages-contact-heading h2 { font-size: 14px; }
.messages-back { display: none; flex-shrink: 0; }
.messages-back svg { transform: rotate(180deg); }
.messages-thread-head > .avatar { width: 40px; height: 40px; flex-shrink: 0; }
.messages-thread-head .cell-sub { margin-top: 4px; font-size: 11px; }
.messages-takeover { flex-shrink: 0; }
.messages-thread-head > .spacer { flex: 1; }
.messages-thread-head, .messages-assistant, .messages-composer { flex-shrink: 0; }
.messages-assistant { display: flex; align-items: center; gap: 8px; padding: 7px 20px; background: var(--primary-soft); color: var(--foreground); font-size: 11px; border-bottom: 1px solid var(--border); }
.messages-status-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--success-strong); flex-shrink: 0; }
.messages-history { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 16px 24px; display: flex; flex-direction: column; gap: 16px; background: var(--surface-2); }
.messages-history .msg { width: 88%; max-width: 620px; gap: 8px; flex-shrink: 0; }
.messages-history .msg > div { min-width: 0; }
.messages-history .msg-user { flex-direction: row; align-self: flex-start; }
.messages-history .msg-agent { align-self: flex-end; flex-direction: row-reverse; }
.messages-history .message-author { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; font-size: 10px; font-weight: 600; color: var(--muted-foreground); margin: 0 2px 6px; }
.messages-history .msg-agent .message-author { justify-content: flex-end; }
.message-channel { display: inline-flex; align-items: center; gap: 4px; border: 1px solid var(--border-strong); border-radius: 5px; padding: 2px 5px; color: var(--foreground); background: var(--card); font-size: 10px; }
.message-channel svg { width: 12px; height: 12px; }
.channel-instagram svg { color: #c13584; }
.channel-whatsapp svg { color: #128c7e; }
.channel-facebook svg { color: #1877f2; }
.messages-history .bubble { font-size: 13px; line-height: 1.7; padding: 13px 16px; overflow-wrap: anywhere; box-shadow: 0 2px 3px rgb(0 0 0 / .02); }
[data-premium] .messages-history .msg-user .bubble { background: var(--card); color: var(--foreground); border: 1px solid var(--border); border-radius: 3px 15px 15px 15px; }
[data-premium] .messages-history .msg-agent .bubble { background: var(--primary-soft); color: var(--foreground); border: 1px solid var(--border-strong); border-radius: 15px 3px 15px 15px; }
.message-time { font-size: 10px; color: var(--muted-foreground); font-variant-numeric: tabular-nums; }
.messages-composer { padding: 10px 20px; border-top: 1px solid var(--border); background: var(--card); }
.messages-reply-channel { display: flex; align-items: center; gap: 8px; font-size: 11px; color: var(--muted-foreground); margin-bottom: 8px; }
#reply-channel { font: inherit; color: var(--foreground); background: var(--card); border: 1px solid var(--border-strong); border-radius: 6px; padding: 3px 6px; }
.messages-compose-box { display: flex; align-items: flex-end; gap: 12px; background: var(--surface-2); border: 1px solid var(--border-strong); border-radius: 12px; padding: 12px; }
.messages-compose-box:focus-within { outline: 2px solid var(--primary); outline-offset: 2px; }
.messages-compose-box textarea { border: 0; resize: none; background: transparent; font: inherit; font-size: 13px; line-height: 1.6; color: var(--foreground); flex: 1; min-width: 0; outline: none; height: 36px; }
.messages-compose-box textarea::placeholder { color: var(--muted-foreground); }
.messages-send { width: 36px; height: 36px; padding: 0; flex-shrink: 0; }
.messages-send .ic-sm { flex-shrink: 0; }
[data-ui="deco"] .messages-workspace, [data-ui="deco"] .conversation-row, [data-ui="deco"] .messages-compose-box { border-radius: 2px; }
[data-ui="retro"] .messages-workspace { border-radius: 24px; }
@media (max-width: 1150px) {
  [data-premium] [data-messages-context="agency"] .topbar { height: 96px; min-height: 96px; gap: 8px; }
  [data-messages-context="agency"] .topbar .ctx-switch { width: 100%; height: 30px; font-size: 11px; }
  .messages-workspace { grid-template-columns: 270px minmax(0, 1fr); }
  .messages-thread-head, .messages-composer { padding: 10px 14px; }
  .messages-history { padding: 18px 16px; }
  .messages-history .msg { width: 96%; }
}
@media (max-width: 850px) {
  .messages-workspace { grid-template-columns: minmax(0, 1fr); }
  .messages-workspace:not(.is-thread-open) .messages-conversation, .messages-workspace.is-thread-open .messages-list { display: none; }
  .messages-list { border: 0; }
  .messages-back { display: grid; }
  .messages-takeover { display: none; }
  [data-premium] .messages-page { padding: 8px 12px 40px; }
  .messages-assistant { padding: 6px 12px; font-size: 10px; }
  .messages-thread-head > .avatar { width: 30px; height: 30px; font-size: 11px; }
}
@media (max-width: 760px) {
  [data-premium] .messages-app { grid-template-rows: auto minmax(0, 1fr); }
  [data-premium] .messages-app > .sidebar { height: auto; min-height: 0; max-height: 132px; }
  [data-premium] .messages-app .topbar { height: 48px; min-height: 48px; padding-block: 4px; }
  [data-premium] [data-messages-context="agency"] .topbar { height: 96px; min-height: 96px; }
}