/* ── Operator panel ─────────────────────────────────────────────────────── */

.operator-panel {
  position: fixed;
  top: 2.8rem;
  right: 0.6rem;
  z-index: 200;
  background: oklch(var(--b2));
  border: 1px solid oklch(var(--bc) / 12%);
  border-radius: var(--radius-md, 0.5rem);
  box-shadow: 0 4px 24px oklch(var(--bc) / 15%);
  min-width: 200px;
  padding: 0.4rem 0;
  display: flex;
  flex-direction: column;
}

.operator-panel-header {
  font-size: 0.68rem;
  font-family: monospace;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: oklch(var(--bc) / 40%);
  padding: 0.3rem 0.9rem 0.5rem;
}

.operator-action {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.5rem 0.9rem;
  background: none;
  border: none;
  width: 100%;
  text-align: left;
  font-size: 0.82rem;
  color: oklch(var(--bc) / 85%);
  cursor: pointer;
  transition: background 0.12s;
}

.operator-action:hover:not(:disabled) {
  background: oklch(var(--bc) / 7%);
}

.operator-action:disabled {
  opacity: 0.4;
  cursor: default;
}

.operator-action svg {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  color: oklch(var(--p));
}

.operator-action-meta {
  margin-left: auto;
  font-size: 0.7rem;
  color: oklch(var(--bc) / 45%);
  font-family: monospace;
}

.operator-action-danger {
  color: oklch(var(--wa));
}

.operator-action-danger svg {
  color: oklch(var(--wa));
}

.operator-action-danger:hover:not(:disabled) {
  background: oklch(var(--wa) / 10%);
}

.operator-action-loading svg {
  animation: spin 1s linear infinite;
}

@keyframes spin {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

/* ── Todo panel ─────────────────────────────────────────────────────────────── */

.todo-card {
  padding: 0.4rem 0.9rem 0.3rem;
  border-top: 1px solid oklch(var(--bc) / 8%);
  background: oklch(var(--b2) / 60%);
}

.todo-panel-section {
  padding: 0.3rem 0.9rem 0.4rem;
  border-bottom: 1px solid oklch(var(--bc) / 8%);
  margin-bottom: 0.2rem;
}

.todo-panel-label {
  font-size: 0.68rem;
  font-family: monospace;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: oklch(var(--bc) / 40%);
  margin-bottom: 0.35rem;
}

.todo-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.todo-item {
  display: flex;
  align-items: baseline;
  gap: 0.4rem;
  font-size: 0.78rem;
  line-height: 1.3;
  padding: 0.15rem 0;
}

.todo-icon {
  flex-shrink: 0;
  font-size: 0.75rem;
  width: 1em;
  color: oklch(var(--bc) / 50%);
}

.todo-item--in_progress .todo-icon { color: oklch(var(--p)); }
.todo-item--completed .todo-icon   { color: oklch(var(--su, var(--p))); }

.todo-content {
  flex: 1;
  color: oklch(var(--bc) / 85%);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.todo-item--completed .todo-content {
  text-decoration: line-through;
  opacity: 0.5;
}

.todo-priority {
  flex-shrink: 0;
  font-size: 0.62rem;
  font-family: monospace;
  padding: 0.05rem 0.3rem;
  border-radius: 0.25rem;
  background: oklch(var(--bc) / 10%);
  color: oklch(var(--bc) / 50%);
}

.todo-priority--high   { background: oklch(var(--er) / 15%); color: oklch(var(--er)); }
.todo-priority--medium { background: oklch(var(--wa, var(--p)) / 15%); color: oklch(var(--wa, var(--p))); }

.session-tabs {
  display: flex;
  align-items: center;
  gap: 0.35rem;
}

.session-tab {
  display: flex;
  align-items: center;
  gap: 0.3rem;
  font-size: 0.75rem;
  font-family: monospace;
  color: oklch(var(--bc) / 50%);
  padding: 0.1rem 0.35rem;
  border-radius: var(--radius-sm);
  cursor: pointer;
  max-width: 7rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  transition: color 0.15s;
  user-select: none;
}

.session-tab.active {
  color: oklch(var(--bc) / 90%);
  background: oklch(var(--bc) / 8%);
}

.session-tab:hover:not(.active) {
  color: oklch(var(--bc) / 70%);
}

.session-tab-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: oklch(var(--bc) / 25%);
  flex-shrink: 0;
}
.session-tab-dot.idle       { background: oklch(var(--su)); }
.session-tab-dot.connecting { background: oklch(var(--wa)); animation: pulse 1.2s ease-in-out infinite; }
.session-tab-dot.busy       { background: oklch(var(--in)); animation: pulse 1.2s ease-in-out infinite; }
.session-tab-dot.error      { background: oklch(var(--er)); }

/* Auditor open button (+ pill next to tabs) */
.session-tab-add {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.3rem;
  height: 1.3rem;
  background: none;
  border: 1px solid oklch(var(--bc) / 20%);
  border-radius: 50%;
  cursor: pointer;
  color: oklch(var(--bc) / 45%);
  transition: color 0.15s, border-color 0.15s, background 0.15s;
  flex-shrink: 0;
}
.session-tab-add:hover:not(:disabled) {
  color: oklch(var(--bc) / 80%);
  border-color: oklch(var(--bc) / 45%);
  background: oklch(var(--bc) / 6%);
}
.session-tab-add:disabled {
  opacity: 0.35;
  cursor: not-allowed;
}
.session-tab-add.hidden {
  display: none;
}
.session-tab-add svg,
.session-tab-add .lucide {
  width: 0.65rem;
  height: 0.65rem;
}

/* Tab close button (auditor tabs only) */
.session-tab-close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 0.9rem;
  height: 0.9rem;
  font-size: 0.7rem;
  line-height: 1;
  border-radius: 50%;
  color: oklch(var(--bc) / 35%);
  transition: color 0.12s, background 0.12s;
  flex-shrink: 0;
  cursor: pointer;
}
.session-tab-close:hover {
  color: oklch(var(--bc) / 80%);
  background: oklch(var(--bc) / 12%);
}

/* Tab verdict tints */
.session-tab[data-verdict="approve"] { color: oklch(var(--su)); }
.session-tab[data-verdict="approve"].active { background: oklch(var(--su) / 12%); color: oklch(var(--su)); }
.session-tab[data-verdict="warn"] { color: oklch(var(--wa)); }
.session-tab[data-verdict="warn"].active { background: oklch(var(--wa) / 12%); color: oklch(var(--wa)); }
.session-tab[data-verdict="block"] { color: oklch(var(--er)); animation: pulse 1.8s ease-in-out infinite; }
.session-tab[data-verdict="block"].active { background: oklch(var(--er) / 12%); color: oklch(var(--er)); animation: pulse 1.8s ease-in-out infinite; }

/* On narrow screens, hide tab labels — leave only the status dot */
@media (max-width: 640px) {
  .session-tab-label { display: none; }
  .session-tab { max-width: none; padding: 0.1rem 0.25rem; }

  /* Tighten header and footer padding on small screens */
  header {
    padding: 0.5rem 0.6rem;
    padding-top: calc(0.5rem + var(--safe-top));
  }
  footer {
    padding: 0 0.5rem 0.4rem;
    padding-bottom: calc(0.4rem + var(--safe-bottom));
  }
  .input-row { gap: 0.3rem; }
  .footer-expand-btn { margin-left: -0.3rem; }

  /* Send/mic buttons: slightly smaller on mobile */
  .send-btn-base,
  .footer-icon-btn {
    width: 40px;
    height: 40px;
  }
}