/* chat.palus.sk – administrácia */
body { background: #f5f6f8; }
.brand-mark { width: 28px; height: 28px; border-radius: 8px; background: #2563eb; color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 15px; }
.min-w-0 { min-width: 0; }

.avatar { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; flex-shrink: 0; }
.avatar-lg { width: 96px; height: 96px; }
.avatar-initials { display: inline-flex; align-items: center; justify-content: center; color: #fff; font-weight: 700; font-size: 1.1rem; }
.avatar-lg.avatar-initials { font-size: 2rem; }

.presence-dot { display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: #9ca3af; margin-right: 2px; vertical-align: 1px; }
.presence-dot.online { background: #22c55e; box-shadow: 0 0 0 3px rgba(34, 197, 94, .25); }
.presence-dot.away { background: #f59e0b; }

/* sprievodca */
.wizard-steps .nav-link { display: flex; align-items: center; gap: .4rem; color: #374151; }
.wizard-steps .step-no { width: 22px; height: 22px; border-radius: 50%; background: #e5e7eb; font-size: .75rem; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; }
.wizard-steps .nav-link.active .step-no { background: rgba(255, 255, 255, .3); }

.icon-grid { display: flex; flex-wrap: wrap; gap: .5rem; }
.icon-option { cursor: pointer; margin: 0; }
.icon-option input { position: absolute; opacity: 0; }
.icon-bubble { width: 48px; height: 48px; border-radius: 50%; background: var(--cp-color, #2563eb); color: #fff; display: inline-flex; align-items: center; justify-content: center; border: 3px solid transparent; transition: transform .15s; overflow: hidden; }
.icon-bubble svg { width: 24px; height: 24px; fill: currentColor; }
.icon-bubble img { width: 100%; height: 100%; object-fit: cover; }
.icon-bubble.icon-photo { background: #e5e7eb; color: #6b7280; }
.icon-option:hover .icon-bubble { transform: scale(1.06); }
.icon-option input:checked + .icon-bubble { border-color: #111827; box-shadow: 0 0 0 2px #fff inset; }
.icon-option input:disabled + .icon-bubble { opacity: .4; cursor: not-allowed; }

.preview-sticky { position: sticky; top: 1rem; }
.preview-frame { width: 100%; height: 620px; border: 1px solid #e5e7eb; border-radius: 12px; background: #f3f4f6; }
.preview-frame-tall { height: min(760px, calc(100vh - 220px)); }
.lang-tabs .nav-link { padding: .35rem .7rem; font-size: .9rem; }
.lang-tabs .nav-link .badge { font-weight: 500; }

pre.snippet { background: #111827; color: #e5e7eb; padding: 1rem; border-radius: 10px; font-size: .85rem; white-space: pre-wrap; word-break: break-all; }

/* inbox */
.inbox-page main.inbox-main { padding: 0; height: calc(100vh - 57px); }
.inbox { display: flex; height: 100%; }
.inbox-list { width: 340px; flex-shrink: 0; border-right: 1px solid #e5e7eb; background: #fff; display: flex; flex-direction: column; }
.inbox-filters { padding: .75rem; border-bottom: 1px solid #e5e7eb; }
.inbox-items { overflow-y: auto; flex: 1; }
.inbox-item { display: block; padding: .7rem .85rem; border-bottom: 1px solid #f3f4f6; color: inherit; text-decoration: none; cursor: pointer; }
.inbox-item:hover { background: #f9fafb; }
.inbox-item.active { background: #eff6ff; }
.inbox-item .name { font-weight: 600; font-size: .92rem; }
.inbox-item .preview { font-size: .84rem; color: #6b7280; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.inbox-item .when { font-size: .75rem; color: #9ca3af; white-space: nowrap; }
.inbox-item.unread .name { color: #1d4ed8; }
.inbox-item.unread .preview { color: #111827; font-weight: 500; }
.inbox-item .dot { width: 8px; height: 8px; border-radius: 50%; background: #2563eb; display: inline-block; margin-left: 6px; }
.inbox-detail { flex: 1; min-width: 0; display: flex; flex-direction: column; background: #f5f6f8; }
.inbox-empty { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.inbox-thread { flex: 1; display: flex; flex-direction: column; min-height: 0; }
.thread-header { display: flex; align-items: center; gap: 1rem; padding: .75rem 1rem; background: #fff; border-bottom: 1px solid #e5e7eb; }
.thread-messages { flex: 1; overflow-y: auto; padding: 1rem; display: flex; flex-direction: column; gap: .5rem; }
.msg { max-width: 72%; padding: .55rem .85rem; border-radius: 14px; font-size: .93rem; white-space: pre-wrap; word-wrap: break-word; position: relative; }
.msg.visitor { align-self: flex-start; background: #fff; border: 1px solid #e5e7eb; border-bottom-left-radius: 4px; }
.msg.agent { align-self: flex-end; background: #2563eb; color: #fff; border-bottom-right-radius: 4px; }
.msg.bot { align-self: flex-end; background: #dbeafe; color: #1e3a8a; border-bottom-right-radius: 4px; }
.msg.system { align-self: center; background: none; color: #6b7280; font-size: .8rem; max-width: 100%; text-align: center; }
.msg .meta { display: block; font-size: .7rem; opacity: .7; margin-top: .25rem; }
.msg .meta .ai { font-weight: 700; letter-spacing: .03em; }
.msg.error-msg { border: 1px dashed #f59e0b; }
.day-sep { align-self: center; font-size: .75rem; color: #9ca3af; margin: .5rem 0; }
.thread-reply { padding: .75rem 1rem; background: #fff; border-top: 1px solid #e5e7eb; }
.thread-reply textarea { resize: none; }
.msg .sources { font-size: .72rem; margin-top: .3rem; opacity: .8; }
.msg .sources a { color: inherit; }

@media (max-width: 991px) {
  .inbox-list { width: 100%; }
  .inbox.has-selected .inbox-list { display: none; }
  .inbox:not(.has-selected) .inbox-detail { display: none; }
  .inbox-page main.inbox-main { height: auto; min-height: calc(100vh - 57px); }
}
