/**
 * Personel Sohbet — global light/dark theme integration (Oyuncakhobi Panel).
 * Consumes html[data-theme] from app_theme_ui.js; no separate chat theme state.
 */

:root {
  --chat-bg: #e5ddd5;
  --chat-sidebar-bg: #f8fafc;
  --chat-sidebar-head-bg: #ffffff;
  --chat-body-head-bg: #ffffff;
  --chat-message-incoming-bg: #ffffff;
  --chat-message-incoming-border: transparent;
  --chat-message-outgoing-bg: #dcf8c6;
  --chat-message-outgoing-text: #0f172a;
  --chat-message-text: #0f172a;
  --chat-message-meta: #64748b;
  --chat-input-bg: #ffffff;
  --chat-compose-bg: #f0f2f5;
  --chat-border: #e8edf3;
  --chat-text-primary: #0f172a;
  --chat-text-secondary: #64748b;
  --chat-surface: #ffffff;
  --chat-surface-hover: #f8fafc;
  --chat-card-bg: #ffffff;
  --chat-card-hover-bg: #ffffff;
  --chat-card-active-bg: #f8fbff;
  --chat-card-active-border: #bfdbfe;
  --chat-date-sep-bg: rgba(255, 255, 255, 0.92);
  --chat-date-sep-text: #475569;
  --chat-mention-bg: #eff6ff;
  --chat-mention-text: #1d4ed8;
  --chat-meta-pill-bg: #f1f5f9;
  --chat-meta-pill-text: #64748b;
  --chat-attachment-bg: #ffffff;
  --chat-img-placeholder: #e2e8f0;
  --chat-action-bg: #ffffff;
  --chat-action-hover: #e2e8f0;
  --chat-picker-bg: #ffffff;
  --chat-picker-hover: #f1f5f9;
  --chat-scrollbar-thumb: #cbd5e1;
  --chat-dot-ring: #ffffff;
  --chat-tick-sent: #94a3b8;
  --chat-tick-read: #3b82f6;
}

[data-theme='dark'] {
  --chat-bg: #0f1729;
  --chat-sidebar-bg: #111c2e;
  --chat-sidebar-head-bg: #162238;
  --chat-body-head-bg: #162238;
  --chat-message-incoming-bg: #162238;
  --chat-message-incoming-border: rgba(148, 163, 184, 0.18);
  --chat-message-outgoing-bg: #1a3d4a;
  --chat-message-outgoing-text: #d1fae5;
  --chat-message-text: #f8fafc;
  --chat-message-meta: #94a3b8;
  --chat-input-bg: #0f1729;
  --chat-compose-bg: #111c2e;
  --chat-border: rgba(148, 163, 184, 0.18);
  --chat-text-primary: #f8fafc;
  --chat-text-secondary: #94a3b8;
  --chat-surface: #111c2e;
  --chat-surface-hover: #1a2842;
  --chat-card-bg: #162238;
  --chat-card-hover-bg: #1a2842;
  --chat-card-active-bg: #1e3a5f;
  --chat-card-active-border: rgba(59, 130, 246, 0.45);
  --chat-date-sep-bg: rgba(22, 34, 56, 0.92);
  --chat-date-sep-text: #94a3b8;
  --chat-mention-bg: rgba(59, 130, 246, 0.18);
  --chat-mention-text: #93c5fd;
  --chat-meta-pill-bg: rgba(148, 163, 184, 0.12);
  --chat-meta-pill-text: #94a3b8;
  --chat-attachment-bg: #162238;
  --chat-img-placeholder: #1a2842;
  --chat-action-bg: #162238;
  --chat-action-hover: #1a2842;
  --chat-picker-bg: #162238;
  --chat-picker-hover: #1a2842;
  --chat-scrollbar-thumb: #334155;
  --chat-dot-ring: #162238;
  --chat-tick-sent: #64748b;
  --chat-tick-read: #60a5fa;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme='light']) {
    --chat-bg: #0f1729;
    --chat-sidebar-bg: #111c2e;
    --chat-sidebar-head-bg: #162238;
    --chat-body-head-bg: #162238;
    --chat-message-incoming-bg: #162238;
    --chat-message-incoming-border: rgba(148, 163, 184, 0.18);
    --chat-message-outgoing-bg: #1a3d4a;
    --chat-message-outgoing-text: #d1fae5;
    --chat-message-text: #f8fafc;
    --chat-message-meta: #94a3b8;
    --chat-input-bg: #0f1729;
    --chat-compose-bg: #111c2e;
    --chat-border: rgba(148, 163, 184, 0.18);
    --chat-text-primary: #f8fafc;
    --chat-text-secondary: #94a3b8;
    --chat-surface: #111c2e;
    --chat-surface-hover: #1a2842;
    --chat-card-bg: #162238;
    --chat-card-hover-bg: #1a2842;
    --chat-card-active-bg: #1e3a5f;
    --chat-card-active-border: rgba(59, 130, 246, 0.45);
    --chat-date-sep-bg: rgba(22, 34, 56, 0.92);
    --chat-date-sep-text: #94a3b8;
    --chat-mention-bg: rgba(59, 130, 246, 0.18);
    --chat-mention-text: #93c5fd;
    --chat-meta-pill-bg: rgba(148, 163, 184, 0.12);
    --chat-meta-pill-text: #94a3b8;
    --chat-attachment-bg: #162238;
    --chat-img-placeholder: #1a2842;
    --chat-action-bg: #162238;
    --chat-action-hover: #1a2842;
    --chat-picker-bg: #162238;
    --chat-picker-hover: #1a2842;
    --chat-scrollbar-thumb: #334155;
    --chat-dot-ring: #162238;
    --chat-tick-sent: #64748b;
    --chat-tick-read: #60a5fa;
  }
}

/* —— Sidebar —— */
.pch-side {
  border-right-color: var(--chat-border);
  background: var(--chat-sidebar-bg);
}

.pch-sidehead {
  border-bottom-color: var(--chat-border);
  color: var(--chat-text-secondary);
  background: var(--chat-sidebar-head-bg);
}

.pch-users {
  scrollbar-color: var(--chat-scrollbar-thumb) transparent;
}

.pch-users::-webkit-scrollbar-thumb {
  background: var(--chat-scrollbar-thumb);
}

.pch-user-card {
  border-color: var(--chat-border);
  background: var(--chat-card-bg);
  color: var(--chat-text-primary);
}

.pch-user-card:hover {
  background: var(--chat-card-hover-bg);
  border-color: var(--chat-border);
}

.pch-user-card.active {
  background: var(--chat-card-active-bg);
  border-color: var(--chat-card-active-border);
  box-shadow: 0 0 0 1px rgba(59, 130, 246, 0.12), inset 3px 0 0 #60a5fa;
}

[data-theme='dark'] .pch-user-card.active {
  box-shadow: 0 0 0 1px rgba(59, 130, 246, 0.2), inset 3px 0 0 #60a5fa;
}

.pch-user-genel {
  border-color: var(--chat-border);
  background: linear-gradient(135deg, #fafbff, #f0f7ff);
}

.pch-user-genel.active {
  background: linear-gradient(135deg, #eff6ff, #e0ecff);
  border-color: #93c5fd;
}

[data-theme='dark'] .pch-user-genel {
  background: linear-gradient(135deg, #162238, #1a2842);
  border-color: rgba(99, 102, 241, 0.28);
}

[data-theme='dark'] .pch-user-genel.active {
  background: linear-gradient(135deg, #1e3a5f, #1a2842);
  border-color: rgba(99, 102, 241, 0.45);
  box-shadow: 0 0 0 1px rgba(99, 102, 241, 0.15), inset 3px 0 0 #6366f1;
}

.pch-user-arda {
  border-color: #e9d5ff;
  background: linear-gradient(135deg, #fdfcff, #f5f3ff);
}

.pch-user-arda.active {
  background: linear-gradient(135deg, #f5f3ff, #ede9fe);
  border-color: #c4b5fd;
}

[data-theme='dark'] .pch-user-arda {
  background: linear-gradient(135deg, #1f1a2e, #1a1628);
  border-color: rgba(139, 92, 246, 0.32);
}

[data-theme='dark'] .pch-user-arda.active {
  background: linear-gradient(135deg, #2e1065, #1f1a2e);
  border-color: rgba(139, 92, 246, 0.45);
  box-shadow: 0 0 0 1px rgba(139, 92, 246, 0.15), inset 3px 0 0 #8b5cf6;
}

.pch-user-avatar-wrap .pch-dot {
  border-color: var(--chat-dot-ring);
}

.pch-user-avatar {
  background: linear-gradient(135deg, #e8eef5, #f8fafc);
  color: var(--chat-text-secondary);
}

[data-theme='dark'] .pch-user-avatar {
  background: linear-gradient(135deg, #1a2842, #243044);
  color: var(--chat-text-secondary);
}

.pch-user-avatar-genel {
  background: linear-gradient(135deg, #dbeafe, #eff6ff);
}

[data-theme='dark'] .pch-user-avatar-genel {
  background: linear-gradient(135deg, #1e3a5f, #162238);
}

.pch-user-name-text {
  color: var(--chat-text-primary);
}

.pch-meta-pill {
  background: var(--chat-meta-pill-bg);
  color: var(--chat-meta-pill-text);
}

.pch-meta-pill.ai {
  color: #c4b5fd;
  background: rgba(139, 92, 246, 0.16);
  border-color: rgba(139, 92, 246, 0.32);
}

[data-theme='dark'] .pch-meta-pill.ai {
  color: #ddd6fe;
}

.pch-meta-pill.org {
  color: var(--chat-text-secondary);
  background: rgba(148, 163, 184, 0.1);
  border-color: var(--chat-border);
}

.pch-side-error {
  background: #fef2f2;
  color: #b91c1c;
  border-color: #fecaca;
}

[data-theme='dark'] .pch-side-error {
  background: #2a1212;
  color: #fca5a5;
  border-color: #991b1b;
}

.pch-side-loading {
  background: var(--chat-surface);
  color: var(--chat-text-secondary);
  border-color: var(--chat-border);
}

[data-theme='dark'] .pch-dot.on {
  box-shadow: 0 0 0 2px rgba(34, 197, 94, 0.25);
}

[data-theme='dark'] .pch-dot.off {
  background: #475569;
}

.pch-user-perf-slot .user-perf {
  background: rgba(59, 130, 246, 0.12);
  color: #1d4ed8;
}

[data-theme='dark'] .pch-user-perf-slot .user-perf {
  background: rgba(59, 130, 246, 0.18);
  color: #93c5fd;
}

/* —— Chat body —— */
.pch-head {
  border-bottom-color: var(--chat-border);
  background: var(--chat-body-head-bg);
  color: var(--chat-text-primary);
}

.pch-head small {
  color: var(--chat-text-secondary);
}

.pch-msgs {
  background: var(--chat-bg);
  color: var(--chat-text-primary);
  scrollbar-color: var(--chat-scrollbar-thumb) transparent;
}

.pch-msgs::-webkit-scrollbar {
  width: 8px;
}

.pch-msgs::-webkit-scrollbar-thumb {
  background: var(--chat-scrollbar-thumb);
  border-radius: 999px;
}

.pch-msg {
  color: var(--chat-message-text);
}

.pch-msg.me {
  background: var(--chat-message-outgoing-bg);
  color: var(--chat-message-outgoing-text);
}

.pch-msg.other {
  background: var(--chat-message-incoming-bg);
  border: 1px solid var(--chat-message-incoming-border);
  color: var(--chat-message-text);
}

.pch-msg small {
  color: var(--chat-message-meta);
}

.pch-date-sep span {
  background: var(--chat-date-sep-bg);
  color: var(--chat-date-sep-text);
}

.pch-mention {
  color: var(--chat-mention-text);
  background: var(--chat-mention-bg);
}

.pch-img {
  background: var(--chat-img-placeholder);
}

.pch-img.pch-img-error {
  background: #fee2e2;
}

[data-theme='dark'] .pch-img.pch-img-error {
  background: #2a1212;
  color: #fca5a5;
}

.pch-img-missing {
  background: var(--chat-surface);
  color: var(--chat-text-secondary);
}

.pch-msg-dikkat {
  background: linear-gradient(135deg, #fef3c7, #fde68a) !important;
  border-color: #f59e0b !important;
  color: #92400e !important;
}

[data-theme='dark'] .pch-msg-dikkat {
  background: linear-gradient(135deg, #2a2410, #422006) !important;
  border-color: #854d0e !important;
  color: #fde68a !important;
}

.pch-tick.sent {
  color: var(--chat-tick-sent);
}

.pch-tick.read {
  color: var(--chat-tick-read);
}

.pch-load-older,
.pch-eski-hint,
.pch-empty {
  color: var(--chat-text-secondary);
}

/* —— Compose / input —— */
.pch-compose {
  border-top-color: var(--chat-border);
  background: var(--chat-compose-bg);
}

.pch-input input {
  background: var(--chat-input-bg);
  color: var(--chat-text-primary);
  border-color: var(--chat-border);
}

.pch-input input::placeholder {
  color: var(--chat-text-secondary);
  opacity: 0.85;
}

.pch-input input:focus {
  border-color: #3b82f6;
  outline: none;
  box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.25);
}

.pch-emoji-btn,
.pch-dikkat-btn,
.pch-attach-btn {
  background: var(--chat-action-bg);
  color: var(--chat-text-primary);
}

.pch-attach-btn:hover,
.pch-emoji-btn:hover {
  background: var(--chat-action-hover);
}

[data-theme='dark'] .pch-dikkat-btn:not(:disabled):hover {
  background: rgba(251, 191, 36, 0.16);
}

.pch-emoji-picker,
.pch-mention-list {
  background: var(--chat-picker-bg);
  border-color: var(--chat-border);
  color: var(--chat-text-primary);
}

.pch-emoji-item:hover,
.pch-mention-item:hover {
  background: var(--chat-picker-hover);
}

.pch-mention-item {
  color: var(--chat-text-primary);
}

.pch-gorsel-onizleme img,
.pch-gorsel-onizleme .pch-preview-video {
  border-color: var(--chat-border);
  background: var(--chat-attachment-bg);
}

.pch-gorsel-kaldir {
  background: #fee2e2;
  color: #b91c1c;
}

[data-theme='dark'] .pch-gorsel-kaldir {
  background: rgba(239, 68, 68, 0.16);
  color: #fca5a5;
}

.pch-drop-active {
  background: rgba(37, 99, 235, 0.08) !important;
}

[data-theme='dark'] .pch-drop-active {
  background: rgba(59, 130, 246, 0.12) !important;
}

/* —— Modal chrome —— */
.pch-min-btn {
  color: var(--chat-text-secondary);
}

.pch-min-btn:hover {
  background: var(--chat-action-hover);
  color: var(--chat-text-primary);
}

[data-theme='dark'] .pch-modal .modalhead .pch-min-btn {
  color: #93c5fd;
}

[data-theme='dark'] .pch-modal .modalhead .pch-min-btn:hover {
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
}

.pch-lightbox-close {
  background: var(--chat-surface);
  color: var(--chat-text-primary);
}

.pch-lightbox img {
  background: var(--chat-attachment-bg);
}

@media (max-width: 720px) {
  [data-theme='dark'] .pch-side,
  .pch-side {
    border-bottom-color: var(--chat-border);
  }
}
