:root {
  --panel-radius: 14px;
}

.card {
  border-radius: var(--panel-radius);
}

.icon-circle {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
}

.navbar-brand {
  letter-spacing: 0.2px;
}

.w-110 {
  width: 110px;
}

.task-row {
  padding: 10px 12px;
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 12px;
  background: rgba(255,255,255,0.03);
}
.bg-admin {
  background: #0b1220; /* темный, но не черный */
}
.chat-box {
  height: 520px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 6px;
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 12px;
  background: rgba(255,255,255,0.03);
}

.chat-msg {
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,0.08);
  background: rgba(0,0,0,0.15);
}

.chat-msg-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-bottom: 6px;
}

.chat-nick {
  border: none;
  background: transparent;
  padding: 0;
  color: #cfe2ff;
  font-weight: 700;
  cursor: pointer;
  text-align: left;
}

.chat-nick:hover {
  text-decoration: underline;
}

.chat-meta {
  color: rgba(255,255,255,0.55);
  font-size: 12px;
  white-space: nowrap;
}

.chat-body {
  font-weight: 700; /* пожирнее */
  color: rgba(255,255,255,0.92);
}

/* все сообщения админа красным */
.chat-msg-admin {
  border-color: rgba(220, 53, 69, 0.45);
  background: rgba(220, 53, 69, 0.12);
}

.chat-msg-admin .chat-nick {
  color: #ffb3bd;
}

/* сообщение, которое является ответом (reply_to заполнен) — зеленым */
.chat-msg-reply {
  border-color: rgba(25, 135, 84, 0.55);
  background: rgba(25, 135, 84, 0.10);
}

.reply-bar {
  border: 1px dashed rgba(255,255,255,0.18);
  border-radius: 12px;
  padding: 10px 12px;
  background: rgba(13, 110, 253, 0.08);
}
.reply-nick-highlight {
  color: #ffd966; /* золотистый */
  padding: 2px 6px;
  border-radius: 8px;
  background: rgba(255, 217, 102, 0.12);
}

.chat-admin-actions .dropdown-toggle {
  padding: 2px 8px;
  line-height: 1.2;
}
.badge-task {
  background: rgba(13, 110, 253, 0.16);
  border: 1px solid rgba(13, 110, 253, 0.35);
  color: rgba(255,255,255,0.92);
}

.badge-event {
  background: rgba(32, 201, 151, 0.14);
  border: 1px solid rgba(32, 201, 151, 0.35);
  color: rgba(255,255,255,0.92);
}

/* -------- Theme fixes for light mode (Bootstrap data-bs-theme) -------- */

html[data-bs-theme="light"] .task-row,
html[data-bs-theme="light"] .chat-box,
html[data-bs-theme="light"] .chat-msg,
html[data-bs-theme="light"] .reply-bar {
  border: 1px solid rgba(0,0,0,0.12);
  background: rgba(0,0,0,0.03);
}

html[data-bs-theme="light"] .chat-meta {
  color: rgba(0,0,0,0.55);
}

html[data-bs-theme="light"] .chat-body {
  color: rgba(0,0,0,0.85);
}

html[data-bs-theme="light"] .chat-nick {
  color: #0d6efd;
}

html[data-bs-theme="light"] .badge-task,
html[data-bs-theme="light"] .badge-event {
  color: rgba(0,0,0,0.85);
}

/* Pricing table adapts to theme */
html[data-bs-theme="dark"] .table-theme {
  /* приблизительный эквивалент table-dark */
  --bs-table-bg: #212529;
  --bs-table-color: #fff;
  --bs-table-border-color: rgba(255, 255, 255, 0.15);
  --bs-table-striped-bg: rgba(255, 255, 255, 0.05);
  --bs-table-striped-color: #fff;
  --bs-table-hover-bg: rgba(255, 255, 255, 0.075);
  --bs-table-hover-color: #fff;
}

/* Theme-adaptive tables: dark like table-dark, light like normal table */
html[data-bs-theme="dark"] .table-theme {
  --bs-table-bg: #212529;
  --bs-table-color: #fff;
  --bs-table-border-color: rgba(255, 255, 255, 0.15);
  --bs-table-striped-bg: rgba(255, 255, 255, 0.05);
  --bs-table-striped-color: #fff;
  --bs-table-hover-bg: rgba(255, 255, 255, 0.075);
  --bs-table-hover-color: #fff;
}

/* Theme-adaptive tables (replacement for table-dark / thead.table-dark) */
html[data-bs-theme="dark"] .table-theme {
  --bs-table-bg: #212529;
  --bs-table-color: #fff;
  --bs-table-border-color: rgba(255, 255, 255, 0.15);
  --bs-table-striped-bg: rgba(255, 255, 255, 0.05);
  --bs-table-striped-color: #fff;
  --bs-table-hover-bg: rgba(255, 255, 255, 0.075);
  --bs-table-hover-color: #fff;
}

/* Make header look "dark" too when theme is dark */
html[data-bs-theme="dark"] .table-theme thead th {
  background-color: rgba(255, 255, 255, 0.06);
  color: #fff;
  border-color: rgba(255, 255, 255, 0.15);
}

/* Theme-adaptive tables (replacement for table-dark / thead.table-dark) */
html[data-bs-theme="dark"] .table-theme {
  --bs-table-bg: #212529;
  --bs-table-color: #fff;
  --bs-table-border-color: rgba(255, 255, 255, 0.15);
  --bs-table-striped-bg: rgba(255, 255, 255, 0.05);
  --bs-table-striped-color: #fff;
  --bs-table-hover-bg: rgba(255, 255, 255, 0.075);
  --bs-table-hover-color: #fff;
}

html[data-bs-theme="dark"] .table-theme thead th {
  background-color: rgba(255, 255, 255, 0.06);
  color: #fff;
  border-color: rgba(255, 255, 255, 0.15);
}

.bb-content img.bb-img {
  border-radius: .5rem;
  border: 1px solid rgba(127,127,127,.25);
  margin: .25rem 0;
}

.bb-content .bb-quote {
  margin: .5rem 0;
  padding: .75rem 1rem;
  border-left: 4px solid rgba(13,110,253,.6);
  background: rgba(13,110,253,.08);
  border-radius: .5rem;
}

.bb-content .bb-code {
  margin: .5rem 0;
  padding: .75rem 1rem;
  border-radius: .5rem;
  overflow: auto;
  background: rgba(127,127,127,.12);
  border: 1px solid rgba(127,127,127,.25);
}

.bb-content .bb-spoiler {
  margin: .5rem 0;
  border-radius: .5rem;
  border: 1px solid rgba(127,127,127,.25);
  background: rgba(127,127,127,.08);
  padding: .5rem .75rem;
}

.bb-content .bb-spoiler > summary {
  cursor: pointer;
  user-select: none;
  font-weight: 600;
}

.bb-content .bb-spoiler-body {
  margin-top: .5rem;
}

.bb-content .bb-list {
  margin: .5rem 0 .5rem 1.25rem;
}