/* Mevcut panelle aynı görünüm (Tailwind CDN yerine yerel CSS) */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; }
body { font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; line-height: 1.5; color: #111827; }
button, input, select { font: inherit; color: inherit; }
button { cursor: pointer; background: none; border: 0; padding: 0; }
h2, h3, p { margin: 0; }

.bg-gray-100 { background: #f3f4f6; }
.h-screen { height: 100vh; }
.h-full { height: 100%; }
.flex { display: flex; }
.flex-col { flex-direction: column; }
.flex-1 { flex: 1 1 0%; }
.items-center { align-items: center; }
.justify-center { justify-content: center; }
.justify-between { justify-content: space-between; }
.hidden { display: none !important; }
.w-full { width: 100%; }
.gap-2 { gap: .5rem; }
.gap-4 { gap: 1rem; }
.p-4 { padding: 1rem; }
.p-6 { padding: 1.5rem; }
.mb-4 { margin-bottom: 1rem; }
.mb-6 { margin-bottom: 1.5rem; }
.mt-2 { margin-top: .5rem; }
.mt-4 { margin-top: 1rem; }
.border-b { border-bottom: 1px solid #e5e7eb; }
.border-t { border-top: 1px solid #e5e7eb; }
.overflow-y-auto { overflow-y: auto; }
.text-center { text-align: center; }
.text-xs { font-size: .75rem; line-height: 1rem; }
.text-sm { font-size: .875rem; line-height: 1.25rem; }
.text-lg { font-size: 1.125rem; line-height: 1.75rem; }
.font-bold { font-weight: 700; }
.font-medium { font-weight: 500; }
.text-gray-400 { color: #9ca3af; }
.text-gray-500 { color: #6b7280; }
.text-gray-700 { color: #374151; }
.text-gray-800 { color: #1f2937; }
.text-red-500 { color: #ef4444; }
.hover\:text-red-700:hover { color: #b91c1c; }
.truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.space-y-2 > * + * { margin-top: .5rem; }

/* Giriş kartı */
.login-card { background: #fff; padding: 2rem; border-radius: .75rem; width: 24rem; max-width: 92vw; box-shadow: 0 4px 6px -1px rgba(0,0,0,.1), 0 2px 4px -2px rgba(0,0,0,.1); }
.login-title { font-size: 1.5rem; line-height: 2rem; font-weight: 700; margin-bottom: 1.5rem; text-align: center; color: #1f2937; }
.step-text { font-size: .875rem; color: #4b5563; margin-bottom: 1rem; }
.secret-box { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: .85rem; background: #f3f4f6; border-radius: .5rem; padding: .75rem; margin-bottom: 1rem; word-break: break-all; user-select: all; }
.field { display: block; width: 100%; padding: .75rem; border: 1px solid #d1d5db; border-radius: .5rem; background: #fff; }
.field:focus, .field-sm:focus { outline: none; box-shadow: 0 0 0 2px #3b82f6; }
.field-sm { display: block; width: 100%; padding: .5rem; border: 1px solid #d1d5db; border-radius: .5rem; font-size: .875rem; }
.btn-primary { width: 100%; background: #2563eb; color: #fff; padding: .75rem; border-radius: .5rem; font-weight: 600; }
.btn-primary:hover { background: #1d4ed8; }
.btn-primary:disabled { opacity: .6; cursor: default; }

/* Kenar çubuğu / ana alan */
.sidebar { width: 25%; background: #fff; height: 100%; border-right: 1px solid #e5e7eb; display: flex; flex-direction: column; }
.main { width: 75%; display: flex; flex-direction: column; }
.btn-search { width: 100%; background: #f3f4f6; color: #374151; padding: .5rem; border-radius: .5rem; font-size: .875rem; font-weight: 500; transition: background .15s; }
.btn-search:hover { background: #e5e7eb; }
.btn-search-go { flex: 1 1 0%; background: #2563eb; color: #fff; padding: .5rem; border-radius: .5rem; font-size: .875rem; }
.btn-search-go:hover { background: #1d4ed8; }
.btn-search-close { background: #e5e7eb; color: #374151; padding: .5rem 1rem; border-radius: .5rem; font-size: .875rem; }
.btn-search-close:hover { background: #d1d5db; }
.btn-more { width: 100%; background: #eff6ff; color: #1d4ed8; padding: .5rem; border-radius: .5rem; font-size: .875rem; font-weight: 500; }
.btn-more:hover { background: #dbeafe; }
.user-row { padding: 1rem; border-bottom: 1px solid #e5e7eb; cursor: pointer; }
.user-row:hover { background: #f3f4f6; }
.user-row.selected { background: #eff6ff; }
.badge-off { display: inline-block; margin-left: .5rem; font-size: .7rem; background: #fee2e2; color: #b91c1c; padding: 0 .4rem; border-radius: .25rem; }

.tab-btn { background: #dbeafe; color: #1d4ed8; padding: .25rem .75rem; border-radius: .25rem; font-size: .875rem; font-weight: 500; }
.tab-btn.red { background: #fee2e2; color: #b91c1c; }
.tab-btn.gray { background: #e5e7eb; color: #374151; }
.chat-row { padding: .75rem; background: #fff; border-radius: .25rem; box-shadow: 0 1px 2px rgba(0,0,0,.05); cursor: pointer; transition: box-shadow .15s; }
.chat-row:hover { box-shadow: 0 4px 6px -1px rgba(0,0,0,.1); }
.link-back { margin-bottom: 1rem; font-size: .875rem; color: #2563eb; }
.link-back:hover { text-decoration: underline; }
.msg-box { background: #f9fafb; padding: 1rem; border-radius: .5rem; }
.chat-bubble { max-width: 80%; padding: 10px 15px; border-radius: 15px; margin-bottom: 8px; width: fit-content; }
.chat-bubble-user { background: #2563eb; color: #fff; margin-left: auto; }
.chat-bubble-ai { background: #f3f4f6; color: #111827; margin-right: auto; }
.bubble-text { font-size: .875rem; white-space: pre-wrap; overflow-wrap: anywhere; }
.media-btn { display: block; font-size: .75rem; margin-top: .5rem; text-decoration: underline; opacity: .75; }
.media-btn:hover { opacity: 1; }
.chat-head { font-size: .8rem; font-weight: 600; color: #374151; margin: 1rem 0 .5rem; }
.user-head { display: flex; align-items: center; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.user-head .email { font-weight: 700; color: #1f2937; }
.reason-line { font-size: .75rem; color: #6b7280; margin-bottom: 1rem; }

/* Neden penceresi */
.modal-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.4); display: flex; align-items: center; justify-content: center; z-index: 50; }
.modal-card { background: #fff; padding: 1.5rem; border-radius: .75rem; width: 26rem; max-width: 92vw; box-shadow: 0 10px 15px -3px rgba(0,0,0,.2); }