#lang-switch {padding: 3px;}

/* ========== Admin Panel Styles (refreshed light theme) ========== */
#tbl-users td { vertical-align: middle; padding:4px 6px; }
.ophoto-wrap { display:flex; align-items:center; gap:6px; }
.ophoto-img { width:32px; height:32px; border-radius:50%; object-fit:cover; background:#f2f2f2; border:1px solid #ddd; }
.ophoto-actions { display:flex; align-items:center; gap:4px; }
.ophoto-actions input[type=file] { width:90px; font-size:11px; }
.ophoto-del { background:#f44336; color:#fff; border:none; width:24px; height:24px; border-radius:4px; cursor:pointer; line-height:20px; font-size:18px; padding:0; }
.ophoto-del:disabled { opacity:.4; cursor:default; }
button.danger-btn {
	margin-left: 6px;
	background-color: #c23434;
	color: #fff;
	border: 1px solid #a32121;
}
button.danger-btn:disabled {
	opacity: 0.6;
}
.chat-delete-btn {
	margin: 6px 0px 3px 3px !important;
    width: 23px;
    height: 23px;
	padding: 0;
	line-height: 1;
	font-size: 12px !important;
	border-radius: 50% !important;
	background-color: #d23a3a !important;
	border: 1px solid #a41b1b !important;
	color: #fff;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.chat-delete-btn:hover {
	background-color: #c02d2d;
}
.chat-delete-btn:focus {
	outline: none;
	box-shadow: 0 0 0 2px rgba(210, 58, 58, 0.35);
}
.avatar-sm { width:32px; height:32px; border-radius:50%; object-fit:cover; vertical-align:middle; margin-right:4px; border:1px solid #ddd; background:#f2f2f2; }
.inp-opname { width:120px; }
.col-id { width:50px; }
.col-login { width:180px; }
.col-domain { width:220px; }
.col-role { width:80px; }
.col-opname { width:140px; }
.col-ophoto { width:100px; }

/* Users table: increase readability (font-size) */
#tbl-users { font-size:13px; table-layout:fixed; }
#tbl-users th, #tbl-users td { font-size:13px !important; overflow:hidden; }
#tbl-users input, #tbl-users select, #tbl-users button { font-size:13px !important; }
/* В режиме редактирования инпуты и селекты вписываются в ширину ячейки */
#tbl-users td input, #tbl-users td select { width:100% !important; box-sizing:border-box; max-width:100%; }
/* Ячейка действий: не переносить кнопки, чтобы высота строки не росла */
#tbl-users td.iflex.flex-wrap { flex-wrap:nowrap !important; }
/* Ячейка Фото (6-й столбец): упаковать элементы и разрешить перенос внутри, чтобы не расползалось */
#tbl-users td:nth-child(6) .iflex { display:flex !important; flex-wrap:wrap; gap:6px; align-items:center; }
#tbl-users td:nth-child(6) input[type="text"] { flex:1 1 100%; min-width:0; }
#tbl-users td:nth-child(6) input[type="file"] { flex:1 1 auto; max-width:100%; }
#tbl-users td:nth-child(6) .btn-icon { flex:0 0 auto; }
/* Override utility classes that shrink font inside Users table */
#tbl-users .small-11 { font-size:13px !important; }
#tbl-users .small { font-size:13px !important; }
#tbl-users .mono-11 { font-size:13px !important; }
#tbl-users .badge { font-size:13px !important; }

/* FAQ table layout & resizable columns */
.faq-table { width:100%; table-layout:fixed; border-collapse:collapse; }
.faq-table th, .faq-table td { border:1px solid #cfd5dc; padding:4px 6px; vertical-align:top; position:relative; }
.faq-table textarea { width:100%; min-height:60px; resize:vertical; font:12px/1.3 monospace; box-sizing:border-box; }
.faq-table textarea.faq-textarea {
	font:12px/1.35 monospace;
	padding:8px 10px;
	border-radius:8px;
	border:1px solid #c7d2e2;
	background:#fff;
	box-shadow:inset 0 1px 0 rgba(255,255,255,.6);
}
.faq-table textarea.faq-textarea:focus {
	border-color:#4a90e2;
	box-shadow:0 0 0 2px rgba(74,144,226,.18);
}
.faq-table textarea.faq-question { min-height:160px; }
.faq-table textarea.faq-answer { min-height:369px; }
.faq-table textarea.faq-meta { min-height:369px; white-space:pre-wrap; word-break:break-word; }
.faq-table input[type=text] { width:100%; box-sizing:border-box; font:12px monospace; }
.faq-table col { transition:width .15s ease; }
.col-resize { position:absolute; top:0; right:0; width:6px; cursor:col-resize; user-select:none; height:100%; }
.faq-table th { background:#2f3542; font-weight:600; color:#fff; }
.faq-table tr:nth-child(even){ background:#effbff; }
.faq-table tr:nth-child(odd){ background:#fffff1; }
.faq-table tr:hover td { background:#e9f2ff; }
.faq-table td { background:inherit; }
.faq-table td:focus-within { outline:2px solid #4a90e2; }

/* Admin login overlay + containment */
body { margin:0; font-family: system-ui, Arial, sans-serif; background:#f5f7fb; color:#222; -webkit-font-smoothing:antialiased; }
.login-overlay { position:fixed; inset:0; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg,#0e1014,#1c2733); padding:24px; z-index:1000; }
.login-card { width:100%; max-width:420px; background:#fff; border-radius:14px; padding:32px 28px 36px; box-shadow:0 8px 32px -4px rgba(0,0,0,.4); position:relative; }
.login-card h1 { font-size:20px; margin:0 0 22px; }
.login-card .form-control { border-radius:8px; padding:10px 12px; }
.login-card button.btn-primary { border-radius:10px; font-weight:600; letter-spacing:.3px; }

/* Hide admin app before auth */
#admin-app.hidden { display:none !important; }
#admin-login-overlay.hidden { display:none !important; }

/* Basic layout */
.admin-header { display:flex; align-items:center; gap:18px; padding:12px 18px; background:linear-gradient(90deg,#1f2530,#2c3644); color:#fff; box-shadow:0 2px 4px rgba(0,0,0,.18); }
.admin-header h1 { font-size:18px; margin:0; }
.main-nav button { background:#3a4250; border:none; color:#e6ebf1; padding:6px 10px; border-radius:6px; cursor:pointer; font-size:13px; }
.main-nav button:hover { background:#455061; color:#fff; }
.main-nav.hidden { display:none; }
/* Dropdown in main nav */
.nav-dropdown { position:relative; display:inline-block; }
.nav-dropdown > button { display:inline-flex; align-items:center; gap:6px; }
.nav-dropdown-menu { position:absolute; top:100%; left:0; min-width:180px; background:#2c3441; color:#e6ebf1; border:1px solid #3a4250; border-radius:8px; padding:6px; display:none; z-index:50; box-shadow:0 8px 20px rgba(0,0,0,.35); }
.nav-dropdown-menu.open { display:block; }
.nav-dropdown-menu button { display:block; width:100%; text-align:left; background:transparent; color:#e6ebf1; border:none; border-radius:6px; padding:6px 8px; }
.nav-dropdown-menu button:hover { background:#455061; color:#fff; }
.nav-dropdown-menu hr { border:none; border-top:1px solid #465264; margin:6px 4px; }

.views { padding:18px; min-height:calc(100vh - 60px); box-sizing:border-box; }

/* Utility */
.panel { background:#eaeaea; border:1px solid #e1e6ec; border-radius:12px; padding:18px 20px 22px; box-shadow:0 1px 3px rgba(0,0,0,.06),0 4px 18px -6px rgba(0,0,0,.08); backdrop-filter:saturate(140%) blur(3px); }
.panel h2, .panel h3, .panel h4 { margin-top:0; font-weight:600; letter-spacing:.3px; }
.panel h2 { font-size:19px; color:#2a3b4f; }
.panel h3 { font-size:16px; color:#31475e; }
.panel h4 { font-size:14px; color:#3c556d; }
.panel fieldset { border:1px solid #d9e1e8; border-radius:8px; padding:12px; background:#f9fbfd; }
.panel fieldset + fieldset { margin-top:12px; }
.panel fieldset legend { font-size:13px; color:#3c556d; padding:0 6px; }
.panel details { margin-top:8px; }
.panel details > summary { cursor:pointer; user-select:none; font-size:13px; color:#374151; }
.panel details > summary::marker { color:#6b7280; }
.row { display:flex; }
.row.gap { gap:8px; }
.row.gap.wrap { flex-wrap:wrap; }
.mt { margin-top:12px; }
.mono { font:12px/1.4 monospace; }
button { cursor:pointer; }
button[data-action], #admin-nav button { font-family:inherit; }
select, input, textarea, button { font-family:inherit; }
.btn-primary { background:#2563eb !important; color:#fff !important; }

/* Utility helpers extracted from inline styles */
.hidden { display:none !important; }
.mb-0 { margin-bottom:0 !important; }
.mb-2 { margin-bottom:2px !important; }
.mb-2 .badge {margin-right: 9px;}
.mb-2 .bg-secondary {background-color: #ff9a9a !important;}
.mb-4 { margin-bottom:4px !important; }
.mb-6 { margin-bottom:6px !important; }
.mb-8 { margin-bottom:8px !important; }
.mb-10 { margin-bottom:10px !important; }
.mb-6 { margin-bottom:6px !important; }
.mt-0 { margin-top:0 !important; }
.mt-4 { margin-top:4px !important; }
.mt-6 { margin-top:6px !important; }
.mt-8 { margin-top:8px !important; }
.mt-10 { margin-top:10px !important; }
.mt-12 { margin-top:12px !important; }
.mt-14 { margin-top:14px !important; }
.mt-14 { margin-top:14px !important; }
.mt-16 { margin-top:16px !important; }
.mt-18 { margin-top:18px !important; }
.mt-20 { margin-top:20px !important; }
.mt-24 { margin-top:24px !important; }
.mt-28 { margin-top:28px !important; }
.mt-32 { margin-top:32px !important; }
.mt-34 { margin-top:34px !important; }
.ml-auto { margin-left:auto !important; }
.ml-6 { margin-left:6px !important; }
.ml-8 { margin-left:8px !important; }
.ml-12 { margin-left:12px !important; }
.w-60 { width:60px !important; }
.w-70 { width:70px !important; }
.w-80 { width:80px !important; }
.w-90 { width:90px !important; }
.w-100 { width:100px !important; }
.w-110 { width:110px !important; }
.w-120 { width:120px !important; }
.w-130 { width:130px !important; }
.w-140 { width:140px !important; }
.w-150 { width:150px !important; }
.w-160 { width:160px !important; }
.w-170 { width:170px !important; }
.w-180 { width:180px !important; }
.w-190 { width:190px !important; }
.w-200 { width:200px !important; }
.w-210 { width:210px !important; }
.w-220 { width:220px !important; }
.w-230 { width:230px !important; }
.w-240 { width:240px !important; }
.w-250 { width:250px !important; }
.w-260 { width:260px !important; }
.w-270 { width:270px !important; }
.w-280 { width:280px !important; }
.w-290 { width:290px !important; }
.w-300 { width:300px !important; }
.w-310 { width:310px !important; }
.w-320 { width:320px !important; }
.w-330 { width:330px !important; }
.w-340 { width:340px !important; }
.w-350 { width:350px !important; }
.w-360 { width:360px !important; }
.w-370 { width:370px !important; }
.w-380 { width:380px !important; }
.w-390 { width:390px !important; }
.w-400 { width:400px !important; }
.w-220 { width:220px !important; }
.w-260 { width:260px !important; }
.minw-160 { min-width:160px !important; }
.minw-240 { min-width:240px !important; }
.minw-260 { min-width:260px !important; }
.minw-300 { min-width:300px !important; }
.minw-320 { min-width:320px !important; }
/* extras for users table inputs */
.minw-120 { min-width:120px !important; }
.minw-180 { min-width:180px !important; }
.maxw-360 { max-width:360px !important; }
.break-words { word-break:break-word !important; }
.grid-auto-160 { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:10px; }
.flex-col { display:flex; flex-direction:column; }
.flex-wrap { flex-wrap:wrap; }
.align-center { align-items:center; }
.align-end { align-items:flex-end; }
.align-stretch { align-items:stretch; }
.gap-4 { gap:4px; }
.gap-6 { gap:6px; }
.gap-8 { gap:8px; }
.gap-10 { gap:10px; }
.gap-12 { gap:12px; }
.gap-14 { gap:14px; }
.gap-18 { gap:18px; }
.justify-between { justify-content:space-between; }
.inline-block { display:inline-block !important; }
.mono-11 { font:11px/1.35 monospace !important; }
.mono-12 { font:12px/1.4 monospace !important; }
.mono-10 { font:10px/1.35 monospace !important; }
.small { font-size:12px !important; }
.small-11 { font-size:11px !important; }
.fs-13 { font-size:13px !important; }
.fs-15 { font-size:15px !important; }
.fw-600 { font-weight:600 !important; }
.c-555 { color:#555 !important; }
.c-333 { color:#333 !important; }
.c-666 { color:#666 !important; }
.c-888 { color:#888 !important; }
.c-777 { color:#777 !important; }
.c-c00 { color:#c00 !important; }
.c-eee { color:#eee !important; }
.c-7fd { color:#7fd !important; }
.c-222 { color:#222 !important; }
.c-ccc { color:#ccc !important; }
.c-ddd { color:#ddd !important; }
.c-c66 { color:#c66 !important; }
/* extra colors mapped from inline runtime */
.c-c33 { color:#c33 !important; }
.c-3a3 { color:#3a3 !important; }
.bg-111 { background:#111 !important; }
.bg-181818 { background:#181818 !important; }
.bg-101010 { background:#101010 !important; }
.bg-2f6d3a { background:#2f6d3a !important; color:#fff !important; }
.bg-danger { background:#b91d1d !important; color:#fff !important; }
.btn-dark { background:#555 !important; color:#fff !important; }
.btn-primary-600 { background:#2563eb !important; color:#fff !important; }
.badge-ev { display:inline-block; padding:1px 6px; border-radius:4px; font:10px/1.3 monospace; }
.ev-auth { background:#e6f7e9; color:#1d5e2d; border:1px solid #b2e0bd; }
.ev-llm { background:#ffe6e6; color:#8a1010; border:1px solid #ffb3b3; }
.ev-db { background:#ffe6e6; color:#8a1010; border:1px solid #ffb3b3; }
.ev-rate { background:#fff8e6; color:#7a5a00; border:1px solid #ffe1a3; }
.rounded-4 { border-radius:4px !important; }
.rounded-6 { border-radius:6px !important; }
.rounded-8 { border-radius:8px !important; }
.p-3 {color: #000;padding: 16px !important; font-size: 13pt !important; }
.p-4 { padding:4px !important; }
.p-6 { padding:6px !important; }
.p-8 { padding:8px !important; }
.px-4 { padding-left:4px !important; padding-right:4px !important; }
.px-6 { padding-left:6px !important; padding-right:6px !important; }
.py-1 { padding-top:1px !important; padding-bottom:1px !important; }
.py-2 { padding-top:2px !important; padding-bottom:2px !important; }
.mb-4 { margin-bottom:4px !important; }
.mb-6 { margin-bottom:6px !important; }
.mb-8 { margin-bottom:8px !important; }
.mr-6 { margin-right:6px !important; }
.my-4 { margin-top:4px !important; margin-bottom:4px !important; }
.mt-6 { margin-top:6px !important; }
.mt-8 { margin-top:8px !important; }
.mt-10 { margin-top:10px !important; }
.border { border:1px solid #ddd !important; }
.border-top { border-top:1px solid #ddd !important; }
.overflow-auto { overflow:auto !important; }
.maxh-190 { max-height:190px !important; }
.maxw-420 { max-width:420px !important; }
.fixed-br { position:fixed !important; right:8px !important; bottom:8px !important; }
.z-9999 { z-index:9999 !important; }
.shadow-md { box-shadow:0 2px 6px rgba(0,0,0,.4) !important; }
.h-6 { height:6px !important; }
.h-10 { height:10px !important; }
.w-0 { width:0 !important; }
.open { display:block !important; }
.cursor-col-resize { cursor: col-resize !important; }
.col-span-all, .span-all { grid-column:1/-1 !important; }
.pre-wrap { white-space:pre-wrap !important; }
.lh-14 { line-height:1.4 !important; }
.ml-8 { margin-left:8px !important; }
.mr-8 { margin-right:8px !important; }
.gap-8 { gap:8px !important; }
.flex-wrap { flex-wrap:wrap !important; }
.collapse { border-collapse:collapse !important; }
.iflex { display:inline-flex !important; }
.muted { opacity:.7 !important; }

/* Specific element rules migrated from inline */
#sys-metrics-alert-dot { width:10px; height:10px; background:#d9534f; border-radius:50%; vertical-align:middle; box-shadow:0 0 0 2px #fff; display:none; }
.hidden { display:none !important; }

/* Users panel */
#form-add-user { margin-bottom:10px; }
#users-add-status { font-size:11px; color:#666; }
#users-filter-text { min-width:240px; }
#users-sort { width:170px; }
#users-filter-reset { background:#555; color:#fff; }
#users-summary { font-size:11px; color:#555; }

/* FAQ panel */
#form-faq-load input[name=source_url]{ min-width:320px; }
#form-faq-load input#enrich-limit { width:70px; }
#form-faq-load input#enrich-chunk { width:70px; }
#faq-import-file { display:none; }
button[data-action="faq-user-reset"]{ margin-left:12px; background:#b91d1d; color:#fff; }
#faq-status { margin:6px 0 10px; font:12px/1.3 monospace; color:#6cf; }
#faq-log { max-height:200px; overflow:auto; background:#111; color:#8f8; padding:8px; }
#faq-pending-wrap { margin-top:32px; }
.faq-prompt-block { width:100%; }
#faq-source-text-counter.over { color:#b91d1d !important; }
.faq-source-textarea {
	width:100%;
	min-width:0;
	box-sizing:border-box;
	resize:vertical;
	font:13px/1.45 "IBM Plex Mono", "JetBrains Mono", "Fira Code", monospace;
	padding:12px 14px;
	border-radius:10px;
	border:1px solid #b8c5d6;
	background:#fff;
	box-shadow:inset 0 1px 0 rgba(255,255,255,.75);
	transition:border-color .2s ease, box-shadow .2s ease;
}
.faq-source-textarea:focus {
	border-color:#4a90e2;
	box-shadow:0 0 0 3px rgba(74,144,226,.18);
}
.faq-source-meta {
	display:flex;
	justify-content:space-between;
	align-items:center;
	gap:8px;
	flex-wrap:wrap;
	margin-top:6px;
}
#faq-prompt-template,
.faq-prompt-textarea {
	width:100%;
	max-width:100%;
	min-width:0;
	box-sizing:border-box;
}
.faq-prompt-textarea {
	min-height:220px;
	font:13px/1.45 "IBM Plex Mono", "JetBrains Mono", "Fira Code", monospace;
	resize:vertical;
	padding:12px 14px;
	border-radius:10px;
	border:1px solid #b8c5d6;
	background:#fff;
	box-shadow:inset 0 1px 0 rgba(255,255,255,.75);
	transition:border-color .2s ease, box-shadow .2s ease;
}
.faq-prompt-textarea.is-default {
	background:#f5f7ff;
	border-style:dashed;
	color:#31475e;
}
.faq-prompt-textarea:focus {
	border-color:#4a90e2;
	box-shadow:0 0 0 3px rgba(74,144,226,.18);
}
#user-faq-editor { margin-top:28px; }
#faq-analysis-inline { margin-top:34px; }
#faq-analysis-inline h3 { margin:0 0 8px; }
#faq-analysis-inline .row { margin-bottom:8px; }
#faq-analysis-user { width:120px; }
#faq-analysis-hide { background:#555; color:#fff; }
#faq-analysis-status { font-size:11px; color:#888; }
#faq-analysis-result { white-space:pre-wrap; background:#111; color:#8f8; padding:10px; border-radius:4px; max-height:320px; overflow:auto; }

/* Sysmetrics */
#sys-metrics-content { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:10px; margin-bottom:12px; }
#sys-metrics-error { font-size:12px; color:#c33; margin-top:8px; }
#sys-unified-health { margin-top:14px; }

/* Security */
#sec-filter { margin-bottom:10px; }
#sec-event { min-width:150px; }
#sec-filter input[name=chat_id]{ width:100px; }
#sec-filter input[name=ip]{ width:130px; }
#sec-filter input[name=fp]{ width:160px; }
#sec-filter input[name=q]{ width:160px; }
#sec-filter input[name=limit]{ width:80px; }
#sec-reset { background:#666; color:#fff; }
#sec-agg { font-size:12px; margin:4px 0 10px; color:#444; }
.table-scroll.medium { max-height:420px; }
#sec-pager { margin-top:8px; }
#sec-page-info { font-size:12px; }
/* Security top cards */
.sec-top-card { background:#f5f7fa; border:1px solid #e1e6eb; border-radius:8px; padding:10px 12px; min-width:220px; flex:0 0 auto; }
.sec-top-card h4 { margin:0 0 6px; font-size:14px; }
/* Keep controls compact in Security toolbar */
#sec-filter > * { flex:0 0 auto !important; }
/* Security: row coloring by event type */
tr.row-ev-auth td { background:#f6fff6; }
tr.row-ev-llm td { background:#fff6f6; }
tr.row-ev-db td { background:#fff6f6; }
tr.row-ev-rate td { background:#fffaf0; }

/* Appearance */
#appearance-user-id { width:130px; }
#appearance-load-status { font-size:11px; color:#666; }
#ai-prompt-block { margin-top:24px; }
#ai_prompt { width:100%; resize:vertical; }
#ai_prompt_history_wrap { margin-top:6px; }
#ai_prompt_hist_btn { font-size:11px; }
#ai_prompt_history { display:none; margin-top:6px; background:#111; color:#9f9; padding:8px; font:11px/1.4 monospace; max-height:200px; overflow:auto; border-radius:4px; }
#ai_prompt_status { font-size:11px; margin-top:4px; color:#555; font-family:monospace; }
#appearance-save-btn { background:#2563eb; color:#fff; padding:8px 18px; border-radius:6px; border:none; cursor:pointer; }
#appearance-save-status { font-size:12px; color:#555; }
#appearance-timing-extra { margin-top:20px; border-top:1px solid #ddd; padding-top:12px; max-width:420px; }
#chat-notify-sound, #chat-bot-sound { width:220px; margin-top:2px; }
#chat-notify-preview, #chat-bot-preview { margin-left:6px; }
#chat-invite-delay, #chat-auto-open-delay, #chat-close-ttl { width:160px; margin-top:2px; }
#chat-button-side { width:160px; margin-top:2px; }
#main-color { width:80px; height:32px; padding:0; }
#chat-header-color, #chat-bg-color, #chat-invite-bg, #chat-invite-text-color { width:80px; height:32px; padding:0; }
#main-color-hex, #chat-header-color-hex, #chat-bg-color-hex, #chat-invite-bg-hex, #chat-invite-text-color-hex { width:120px; font:12px monospace; padding:6px 8px; }
#chat-button-offset-x, #chat-button-offset-y { width:120px; margin-top:2px; }
#chat-invite-offset-y { width:120px; margin-top:2px; }
#chat-invite-offset-left, #chat-invite-offset-right, #chat-invite-offset-bottom { width:110px; margin-top:2px; }
#chat-button-size { width:120px; margin-top:2px; }
#chat-button-label { width:220px; margin-top:2px; }
#powered-by-url { width:260px; margin-top:2px; }
#mobile-inset { width:120px; margin-top:2px; }
/* Appearance timing labels */
#appearance-timing-extra label { display:block; margin-bottom:8px; font-size:13px; }

/* Limits */
/* removed empty rule placeholder */

/* minor utilities */
.ml-4 { margin-left:4px !important; }
.maxw-760 { max-width:760px !important; }
.minh-70 { min-height:70px !important; }
.sysmetrics-note { margin-top:-4px !important; }
.lh-135 { line-height:1.35 !important; }
.lh-13 { line-height:1.3 !important; }
.iflex { display:inline-flex !important; }

/* FAQ table column widths migrated from inline <col style> */
.faq-table col[data-col="idx"]{ width:42px; }
.faq-table col[data-col="qru"]{ width:340px; }
.faq-table col[data-col="aru"]{ width:380px; }
.faq-table col[data-col="weight"]{ width:70px; }
.faq-table col[data-col="imp"]{ width:60px; }
.faq-table col[data-col="tags"]{ width:140px; }
.faq-table col[data-col="syn"]{ width:140px; }
.faq-table col[data-col="ukq"]{ width:340px; }
.faq-table col[data-col="uka"]{ width:380px; }
.faq-table col[data-col="ukt"]{ width:140px; }
.faq-table col[data-col="uks"]{ width:140px; }
.faq-table col[data-col="act"]{ width:44px; }

.faq-table td.faq-col-question-ru textarea,
.faq-table td.faq-col-answer-ru textarea,
.faq-table td.faq-col-tags-ru textarea,
.faq-table td.faq-col-synonyms-ru textarea,
.faq-table td.faq-col-question-uk textarea,
.faq-table td.faq-col-answer-uk textarea,
.faq-table td.faq-col-tags-uk textarea,
.faq-table td.faq-col-synonyms-uk textarea { width:100%; }

/* Legend badges for sysmetrics */
.legend-badge { display:inline-block; width:10px; height:10px; background:#fff; border:2px solid #ccc; margin-right:2px; }
.legend-badge.warn { border-color:#d7a500; }
.legend-badge.alert { border-color:#d9534f; }

/* Appearance section fieldsets and summaries */
.appearance-section fieldset { border:1px solid #ddd; padding:10px 12px; border-radius:6px; display:flex; flex-wrap:wrap; gap:14px; max-width:760px; }
.appearance-section { width:100%; }
.appearance-section fieldset { border:1px solid #ddd; padding:10px 12px; border-radius:6px; display:flex; flex-wrap:wrap; gap:14px; width:100%; box-sizing:border-box; }
.appearance-section legend { font-size:12px; padding:0 6px; color:#555; }
.appearance-section details { margin-top:10px; }
.appearance-section details > summary { cursor:pointer; font-size:13px; }
/* Make appearance textareas span full available width */
.appearance-section textarea { width:100%; box-sizing:border-box; }
/* CTA phrases side-by-side should still allow growing */
#cta_phrases_ru, #cta_phrases_uk { flex:1 1 360px; min-width:320px; }
/* Placeholders row textareas: full width on small screens */
#chat_greeting_placeholder_ru, #chat_greeting_placeholder_uk,
#chat_cta_placeholder_ru, #chat_cta_placeholder_uk { flex:1 1 300px; min-width:260px; }
/* Custom CSS area wider */
#widget-custom-css { width:100%; min-width:320px; }
#appearance-timing-extra { margin-top:20px; border-top:1px solid #ddd; padding-top:12px; max-width:none; width:100%; box-sizing:border-box; }

/* Chats */
#form-chat-filter { margin-bottom:8px; }
#form-chat-filter input[name=user_id]{ width:110px; }
#form-chat-filter input[name=ip]{ width:120px; }
#form-chat-filter input[name=fp]{ width:130px; }
#form-chat-filter input[name=from]{ width:150px; }
#form-chat-filter input[name=to]{ width:150px; }
#form-chat-filter input[name=q]{ min-width:160px; }
#chat-export-contacts { background:#2f6d3a; color:#fff; }
#chat-stats-bar { margin:4px 0 10px; font-size:13px; padding:6px 10px; background:#f5f7fa; border:1px solid #e1e6eb; border-radius:6px; display:flex; gap:20px; flex-wrap:wrap; }
#chat-stats-bar .muted { opacity:.7; }
#cleanup-days { width:60px; margin:0 4px; }
#cleanup-run { background:#b91d1d; color:#fff; }
#chat-pager-admin { margin-top:6px; }
#chat-page-info { font-size:12px; }
#chat-messages-wrap { margin-top:16px; }
#quick-replies-panel { display:none; }

/* Quick view */
#form-add-quick input[name=user_id]{ width:130px; }

/* Buttons */
.panel button { background:#3a4250; color:#eee; border:none; border-radius:6px; padding:6px 10px; font-size:13px; }
.panel button:hover { background:#455061; }
.panel button:disabled { opacity:.55; cursor:default; }
/* Compact icon-only button for tight spaces */
.panel button.btn-icon { width:28px; min-width:28px; height:28px; padding:0; display:inline-flex; align-items:center; justify-content:center; font-size:16px; line-height:1; }

/* Override Bootstrap's .row > * default width:100% to avoid full-width stretching in admin UI */
.panel .row > * { width:auto !important; max-width:none !important; flex:0 0 auto !important; }
/* Keep inputs/selects naturally sized; explicit width utility classes still apply */
.panel .row input, .panel .row select, .panel .row textarea, .panel .row button, .panel .row label, .panel .row span {
	width:auto; max-width:none; flex:0 0 auto;
}
/* Avoid vertically stretched buttons in flex rows */
.panel .row button { align-self:center; }
/* But in appearance main form, allow full width stacking for content blocks */
[data-view="appearance"] .flex-col, [data-view="appearance"] .appearance-section, [data-view="appearance"] fieldset, [data-view="appearance"] .iflex, [data-view="appearance"] .row {
  width:100%;
}
/* Prevent the Save button from stretching vertically */
#appearance-save-btn { display:inline-block; }
/* Ensure pagers and small toolbars remain compact */
#sec-pager button, #dash-period-form button, #usage-refresh, #usage-export { width:auto !important; min-width:unset; }

/* Pager (Чаты): компактные кнопки, без растягивания на всю ширину) */
#chat-pager-admin { display:flex; align-items:center; gap:10px; }
#chat-pager-admin button { display:inline-flex; align-items:center; justify-content:center; width:auto !important; min-width:unset; flex:0 0 auto; }

/* FAQ form controls */
#form-faq-load { display:flex; flex-wrap:wrap; gap:8px; align-items:flex-start; }
#form-faq-load input[name=source_url]{ flex:1 1 320px; }
#form-faq-load button, #form-faq-load label { flex:0 0 auto; white-space:nowrap; }
#form-faq-load > * { flex:0 0 auto; }
#form-faq-load input[name=user_id]{ width:110px; flex:0 0 110px; }
#form-faq-load input[name=batch_size]{ width:70px; flex:0 0 70px; }
#form-faq-load button { display:inline-flex; align-items:center; width:auto !important; min-width:unset; }
#form-faq-load label { display:inline-flex; align-items:center; padding:4px 6px; background:#3a4250; color:#eee; border-radius:6px; font-size:12px; cursor:pointer; }
#form-faq-load label input{ margin-right:4px; }
#form-faq-load #faq-gen-btn-all, #form-faq-load #faq-gen-btn-reset { background:#505a69; }

/* Toast */
.toast { position:fixed; left:50%; top:12px; transform:translateX(-50%); background:#222; color:#fff; padding:10px 16px; border-radius:8px; font-size:13px; box-shadow:0 6px 20px -4px rgba(0,0,0,.45); }
.toast.hidden { display:none; }

/* Progress bar */
.progress { background:#e5e7eb; border-radius:4px; overflow:hidden; }
.progress.h-10 { height:10px; }
.progress.h-6 { height:6px; }
.progress-bar { height:100%; background:linear-gradient(90deg,#2dd4bf,#0ea5e9); transition:width .3s ease; }
/* Color variants for progress levels */
.progress-bar.progress-ok { background:linear-gradient(90deg,#22c55e,#16a34a); }
.progress-bar.progress-semi { background:linear-gradient(90deg,#06b6d4,#0ea5e9); }
.progress-bar.progress-warn { background:linear-gradient(90deg,#f59e0b,#d97706); }
.progress-bar.progress-alert { background:linear-gradient(90deg,#ef4444,#dc2626); }
/* width presets for progress bars/meter without inline styles */
.progress-bar[class*="w-p"]{ width:0; }
.progress-bar.w-p0{ width:0%; }
.progress-bar.w-p5{ width:5%; }
.progress-bar.w-p10{ width:10%; }
.progress-bar.w-p15{ width:15%; }
.progress-bar.w-p20{ width:20%; }
.progress-bar.w-p25{ width:25%; }
.progress-bar.w-p30{ width:30%; }
.progress-bar.w-p35{ width:35%; }
.progress-bar.w-p40{ width:40%; }
.progress-bar.w-p45{ width:45%; }
.progress-bar.w-p50{ width:50%; }
.progress-bar.w-p55{ width:55%; }
.progress-bar.w-p60{ width:60%; }
.progress-bar.w-p65{ width:65%; }
.progress-bar.w-p70{ width:70%; }
.progress-bar.w-p75{ width:75%; }
.progress-bar.w-p80{ width:80%; }
.progress-bar.w-p85{ width:85%; }
.progress-bar.w-p90{ width:90%; }
.progress-bar.w-p95{ width:95%; }
.progress-bar.w-p100{ width:100%; }

/* Generic card */
.card { background:#fff; border:1px solid #ddd; border-radius:6px; padding:10px; box-shadow:0 1px 2px rgba(0,0,0,.04); }
/* alert/warn states for cards (used by sysmetrics thresholds) */
.card.card-warn { border-color:#d7a500; box-shadow:0 0 0 1px #d7a500; }
.card.card-alert { border-color:#d9534f; box-shadow:0 0 0 1px #d9534f; }

/* Status badges */
.badge { display:inline-block; padding:2px 8px; border-radius:12px; color:#fff; font-size:11px; }
.badge-ok { background:#2d8; }
.badge-degraded { background:#d7a500; }
.badge-alert { background:#d9534f; }
.badge-nd { background:#888; }
.badge-run { background:#2563eb; }

/* Table status cells */
.status-ok { color:#7f7 !important; background:#1d3a1d !important; }
.status-degraded { color:#ffb347 !important; background:#432 !important; }
.status-alert { color:#f55 !important; background:#401 !important; }

/* Alert box */
.alert-box { padding:4px 6px; border-left:3px solid #d9534f; background:#fdeceb; border-radius:4px; }

/* Columns narrow tweaks */
.faq-table td input[type=number]{ width:60px; }
.faq-table td input[type=checkbox]{ transform:scale(1.1); }

/* Inputs */
input, select, textarea { border:1px solid #ccd3db; border-radius:6px; padding:6px 8px; background:#fff; }
input:focus, select:focus, textarea:focus { outline:none; border-color:#4a90e2; box-shadow:0 0 0 2px rgba(74,144,226,.25); }

/* Sticky header for large FAQ */
#tbl-faq-edit thead th { position:sticky; top:0; z-index:2; box-shadow:0 2px 0 rgba(0,0,0,.08); }

/* Pre blocks */
pre { background:#1e2227; color:#d4dce5; }
pre#faq-log { background:#101417; color:#8f8; }

/* Links */
a { color:#2563eb; text-decoration:none; }
a:hover { text-decoration:underline; }
code { background:#eef2f6; padding:2px 5px; border-radius:4px; font-size:12px; }

/* Dashboard grid */
.grid-2 { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:20px; align-items:start; margin-top:18px; }
.summary { font:14px/1.4 system-ui,Arial; background:#f0f4f8; padding:10px 14px; border:1px solid #d7e0e9; border-radius:8px; margin-bottom:14px; }
#dashboard-chart { max-width:760px; width:100%; display:block; margin:0 0 14px; }
.panel table.tbl { width:100%; border-collapse:collapse; }
.panel table.tbl th, .panel table.tbl td { border:1px solid #d9e1e8; padding:4px 6px; font-size:12px; }
.panel table.tbl th { background:#fcffd4; font-weight:600; }
table.tbl.faq-table thead th { background:#243245; color:#fff; }
/* Usage section tweaks */
#tbl-usage th, #tbl-usage td { text-align:center; }

/* Dashboard refined layout */
.dash-header { display:flex; flex-wrap:wrap; align-items:flex-end; gap:14px; justify-content:space-between; margin-bottom:14px; }
.dash-period { display:flex; flex-wrap:wrap; gap:8px; align-items:flex-end; }
.dash-period label { font-size:12px; display:flex; flex-direction:column; gap:4px; color:#44515f; }
.dash-period input[type=date]{ padding:4px 6px; font-size:12px; }
.dash-period button { background:#2f3946; }
.dash-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:18px; }
.dash-block { background:#f9fbfd; border:1px solid #dbe3ea; border-radius:10px; padding:14px 16px 16px; position:relative; display:flex; flex-direction:column; min-height:120px; }
.dash-block h3, .dash-block h4 { margin-top:0; }
.dash-block.span-2 { grid-column:span 2; }
@media (max-width:900px){ .dash-block.span-2 { grid-column:span 1; } }
.table-scroll { overflow:auto; border:1px solid #e0e7ed; border-radius:6px; background:#fff; }
.table-scroll.small { max-height:260px; }
.table-scroll.medium { max-height:340px; }
.table-scroll table { margin:0; }
.w-120 { width:120px !important; }
.w-140 { width:140px !important; }
.flex-1 { flex:1 1 auto; }
.mb-12 { margin-bottom:12px !important; }
.mt-6 { margin-top:6px !important; }
.usage-filters button, #usage-export, #usage-refresh { background:#2f3946; }
.ip-line button { background:#3a4250; }
.ip-line input { min-width:130px; }

/* Chats view (light theme + accordion) */
.chat-flex { display:flex; gap:16px; align-items:stretch; }
.chat-main { flex:1 1 auto; min-width:0; }
.chat-msg-list { max-height:360px; overflow:auto; background:#fff; color:#222; padding:10px; border:1px solid #e1e6ec; border-radius:8px; font-size:13px; line-height:1.45; }
.chat-msg-list .msg { margin-bottom:6px; }
.chat-msg-list .msg-operator .s { color:#2563eb!important; }
.chat-msg-list .msg-bot .s { color:#2f855a!important; }
.chat-msg-list .msg-user .s { color:#b45309!important; }
.chat-msg-list .t { color:#666; font-size:11px; margin-right:6px; }
.chat-reply { display:flex; gap:8px; margin-top:10px; }
.chat-reply input { flex:1 1 auto; }
.quick-panel { width:260px; background:#ffffff; color:#1f2937; border:1px solid #e1e6ec; border-radius:8px; padding:10px 10px 14px; font-size:12px; display:flex; flex-direction:column; }
.qp-head { font-weight:600; font-size:13px; margin-bottom:8px; display:flex; justify-content:space-between; align-items:center; }
.qp-close { background:#e5e7eb; color:#374151; border:none; border-radius:4px; padding:2px 6px; font-size:14px; line-height:1; }
.qp-close:hover { background:#d1d5db; color:#111827; }
.qp-list { display:flex; flex-direction:column; gap:6px; overflow:auto; }
.qr-btn {width: 100% !important; text-align:left; background:#f3f4f6; color:#111827; border:1px solid #e5e7eb; border-radius:6px; padding:6px 8px; font-size:12px; cursor:pointer; }
.qr-btn:hover { background:#eef2f7; }
.qr-btn:active { background:#e6ebf2; }
.blink-dot { display:inline-block; width:10px; height:10px; background:#2ea8ff; border-radius:50%; box-shadow:0 0 6px 2px rgba(46,168,255,.5); animation:blinkDot 1s linear infinite; }
@keyframes blinkDot { 0%,60%{ opacity:1;} 61%,100%{ opacity:.15;} }
tr.active-chat td { background:#fffdf2 !important; }
tr.active-chat:hover td { background:#fff8d9 !important; }
/* Accordion-like rows: alternate backgrounds */
#tbl-admin-chats tbody tr:nth-child(odd) td { background:#f9fbfd; }
#tbl-admin-chats tbody tr:nth-child(even) td { background:#ffffff; }
#tbl-admin-chats tbody tr:hover td { background:#eef5ff; }
/* make rows feel clickable */
#tbl-admin-chats tbody tr { cursor: pointer; }
.open-chat-btn { background:#2563eb; color:#fff; border:none; border-radius:6px; padding:4px 8px; font-size:12px; }
.open-chat-btn:hover { background:#1e40af; }
/* Align delete cell contents vertically centered and keep full row background */
#tbl-admin-chats td { vertical-align: middle; }

/* Contact flag icon and row tint */
.contact-flag { color:#1d4ed8; filter: drop-shadow(0 0 1px rgba(29,78,216,.25)); }
.contact-badge { display:inline-flex; align-items:center; justify-content:center; width:18px; height:18px; border-radius:50%; background:#1d4ed8; color:#fff; font-size:12px; line-height:1; }
tr.contact-row td { background:#f0fbff !important; }
tr.contact-row:hover td { background:#e6f6ff !important; }