/* ========================================
   Giants — Dashboard & Internal Pages
   ======================================== */

/* Page Header */
.page-header { margin-bottom: 32px; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 16px; }
.page-header h1 { font-size: 28px; font-weight: 800; letter-spacing: -0.02em; }
.page-header__sub { font-size: 15px; color: var(--color-text-secondary); margin-top: 4px; }
.page-header__actions { display: flex; gap: 12px; }

/* Metric Cards */
.metrics-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 20px; margin-bottom: 32px; }
.metric-card {
  background: var(--color-bg-card); border: 1px solid var(--color-border); border-radius: var(--radius-lg);
  padding: 24px; transition: all var(--transition-normal);
}
.metric-card:hover { border-color: var(--color-primary); box-shadow: var(--shadow-glow); }
.metric-card__label { font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em; color: var(--color-text-muted); margin-bottom: 8px; }
.metric-card__value {
  font-size: 32px; font-weight: 900; letter-spacing: -0.02em;
  background: linear-gradient(135deg, var(--color-primary), var(--color-accent));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.metric-card__value--green { background: linear-gradient(135deg, var(--color-success), var(--color-green)); -webkit-background-clip: text; background-clip: text; }
.metric-card__value--orange { background: linear-gradient(135deg, var(--color-orange), var(--color-warning)); -webkit-background-clip: text; background-clip: text; }
.metric-card__value--danger { background: linear-gradient(135deg, var(--color-danger), var(--color-orange)); -webkit-background-clip: text; background-clip: text; }
.metric-card__change { font-size: 13px; color: var(--color-text-muted); margin-top: 4px; }
.metric-card__change--up { color: var(--color-success); }
.metric-card__change--down { color: var(--color-danger); }

/* Cards */
.card {
  background: var(--color-bg-card); border: 1px solid var(--color-border); border-radius: var(--radius-lg);
  padding: 24px; transition: all var(--transition-normal);
}
.card:hover { border-color: var(--color-border-light); }
.card__header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
.card__title { font-size: 18px; font-weight: 700; }
.card__subtitle { font-size: 14px; color: var(--color-text-muted); }

/* Grid layouts */
.grid-2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; margin-bottom: 32px; }
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-bottom: 32px; }
.grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; margin-bottom: 32px; }
@media (max-width: 1024px) { .grid-3, .grid-4 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 768px) { .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; } }

/* Tables */
.table-card { overflow-x: auto; }
.data-table { width: 100%; border-collapse: collapse; }
.data-table th {
  text-align: left; padding: 12px 16px; font-size: 12px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.08em; color: var(--color-text-muted);
  border-bottom: 1px solid var(--color-border);
}
.data-table td { padding: 14px 16px; font-size: 14px; border-bottom: 1px solid var(--color-border); color: var(--color-text-secondary); }
.data-table tr:hover td { background: var(--color-bg-elevated); }
.data-table td a { color: var(--color-primary-light); font-weight: 600; }
.data-table td a:hover { color: var(--color-text); }

/* Badges/Tags */
.badge {
  display: inline-flex; align-items: center; padding: 4px 12px; border-radius: var(--radius-full);
  font-size: 12px; font-weight: 600;
}
.badge--active { background: rgba(0,184,148,0.15); color: var(--color-success); }
.badge--paused { background: rgba(253,203,110,0.15); color: var(--color-warning); }
.badge--draft { background: rgba(110,110,138,0.15); color: var(--color-text-muted); }
.badge--error { background: rgba(255,107,107,0.15); color: var(--color-danger); }
.badge--closed { background: rgba(110,110,138,0.15); color: var(--color-text-muted); }
.badge--human { background: rgba(255,159,67,0.15); color: var(--color-orange); }
.badge--bot { background: rgba(108,92,231,0.15); color: var(--color-primary-light); }
.badge--whatsapp { background: rgba(37,211,102,0.15); color: #25D366; }
.badge--instagram { background: rgba(225,48,108,0.15); color: #E1306C; }
.badge--facebook { background: rgba(66,103,178,0.15); color: #4267B2; }
.badge--connected { background: rgba(0,184,148,0.15); color: var(--color-success); }
.badge--disconnected { background: rgba(255,107,107,0.15); color: var(--color-danger); }
.badge--confirmed { background: rgba(0,255,136,0.15); color: var(--color-green); }
.badge--pending { background: rgba(253,203,110,0.15); color: var(--color-warning); }

/* Agent Card */
.agent-card {
  background: var(--color-bg-card); border: 1px solid var(--color-border); border-radius: var(--radius-lg);
  padding: 28px; transition: all var(--transition-normal); position: relative; overflow: hidden;
}
.agent-card::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, var(--color-primary), var(--color-accent)); opacity: 0;
  transition: opacity var(--transition-normal);
}
.agent-card:hover { border-color: var(--color-primary); transform: translateY(-2px); box-shadow: var(--shadow-glow); }
.agent-card:hover::before { opacity: 1; }
.agent-card__header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.agent-card__name { font-size: 20px; font-weight: 700; }
.agent-card__desc { font-size: 14px; color: var(--color-text-secondary); line-height: 1.6; margin-bottom: 16px; }
.agent-card__stats { display: flex; gap: 20px; margin-bottom: 16px; }
.agent-card__stat { display: flex; flex-direction: column; gap: 2px; }
.agent-card__stat-value { font-size: 18px; font-weight: 800; color: var(--color-primary-light); }
.agent-card__stat-label { font-size: 11px; color: var(--color-text-muted); text-transform: uppercase; font-weight: 600; }
.agent-card__actions { display: flex; gap: 8px; }

/* Integration Card */
.integration-card {
  background: var(--color-bg-card); border: 1px solid var(--color-border); border-radius: var(--radius-lg);
  padding: 24px; transition: all var(--transition-normal);
}
.integration-card:hover { border-color: var(--color-primary); }
.integration-card__header { display: flex; align-items: center; gap: 16px; margin-bottom: 16px; }
.integration-card__icon { font-size: 32px; }
.integration-card__info { display: flex; flex-direction: column; gap: 4px; }
.integration-card__name { font-size: 18px; font-weight: 700; }
.integration-card__provider { font-size: 13px; color: var(--color-text-muted); }
.integration-card__details { display: flex; gap: 16px; margin-bottom: 16px; }
.integration-card__detail { font-size: 13px; color: var(--color-text-secondary); }
.integration-card__detail strong { color: var(--color-text); font-weight: 600; }

/* Conversation List */
.conversation-item {
  display: flex; align-items: center; gap: 16px; padding: 16px 20px;
  border-bottom: 1px solid var(--color-border); transition: all var(--transition-fast); cursor: pointer;
}
.conversation-item:hover { background: var(--color-bg-elevated); }
.conversation-item__avatar {
  width: 44px; height: 44px; border-radius: 50%;
  background: linear-gradient(135deg, var(--color-primary), var(--color-accent));
  display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 16px; color: #fff; flex-shrink: 0;
}
.conversation-item__info { flex: 1; min-width: 0; }
.conversation-item__name { font-size: 15px; font-weight: 600; margin-bottom: 2px; }
.conversation-item__preview { font-size: 13px; color: var(--color-text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.conversation-item__meta { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; }
.conversation-item__time { font-size: 12px; color: var(--color-text-muted); }
.conversation-item__unread {
  width: 20px; height: 20px; border-radius: 50%; background: var(--color-primary);
  color: #fff; font-size: 11px; font-weight: 700; display: flex; align-items: center; justify-content: center;
}

/* Chat View */
.chat-layout { display: grid; grid-template-columns: 1fr 320px; gap: 24px; height: calc(100vh - 120px); }
.chat-messages {
  display: flex; flex-direction: column; background: var(--color-bg-card); border: 1px solid var(--color-border);
  border-radius: var(--radius-lg); overflow: hidden;
}
.chat-messages__header {
  display: flex; align-items: center; justify-content: space-between; padding: 16px 24px;
  border-bottom: 1px solid var(--color-border);
}
.chat-messages__body { flex: 1; overflow-y: auto; padding: 24px; display: flex; flex-direction: column; gap: 16px; }
.chat-messages__footer { padding: 16px 24px; border-top: 1px solid var(--color-border); }

.chat-bubble { max-width: 75%; padding: 12px 16px; border-radius: var(--radius-lg); font-size: 14px; line-height: 1.6; }
.chat-bubble--user { background: var(--color-bg-elevated); border: 1px solid var(--color-border); align-self: flex-start; border-bottom-left-radius: 4px; }
.chat-bubble--assistant { background: linear-gradient(135deg, rgba(108,92,231,0.2), rgba(108,92,231,0.1)); border: 1px solid rgba(108,92,231,0.2); align-self: flex-end; border-bottom-right-radius: 4px; }
.chat-bubble--human_agent { background: linear-gradient(135deg, rgba(255,159,67,0.2), rgba(255,159,67,0.1)); border: 1px solid rgba(255,159,67,0.2); align-self: flex-end; border-bottom-right-radius: 4px; }
.chat-bubble--system { background: rgba(0,212,255,0.08); border: 1px solid rgba(0,212,255,0.15); align-self: center; font-style: italic; color: var(--color-accent); font-size: 13px; }
.chat-bubble__meta { display: flex; gap: 12px; margin-top: 8px; font-size: 11px; color: var(--color-text-muted); }
.chat-bubble__role { font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; }
.chat-bubble__role--user { color: var(--color-text-secondary); }
.chat-bubble__role--assistant { color: var(--color-primary-light); }
.chat-bubble__role--human_agent { color: var(--color-orange); }

.chat-input { display: flex; gap: 12px; }
.chat-input__field {
  flex: 1; padding: 12px 16px; background: var(--color-bg); border: 1px solid var(--color-border);
  border-radius: var(--radius-md); color: var(--color-text); font-size: 14px; outline: none;
  transition: border-color var(--transition-fast); resize: none;
}
.chat-input__field:focus { border-color: var(--color-primary); }

.chat-sidebar {
  display: flex; flex-direction: column; gap: 16px;
}
.chat-sidebar .card { padding: 20px; }

/* Kanban / Funnel */
.kanban { display: flex; gap: 20px; overflow-x: auto; padding-bottom: 16px; min-height: 500px; }
.kanban__column {
  min-width: 280px; max-width: 320px; flex-shrink: 0;
  background: var(--color-bg-card); border: 1px solid var(--color-border); border-radius: var(--radius-lg);
  display: flex; flex-direction: column;
}
.kanban__column-header {
  padding: 16px 20px; border-bottom: 1px solid var(--color-border);
  display: flex; align-items: center; justify-content: space-between;
}
.kanban__column-title { font-size: 15px; font-weight: 700; display: flex; align-items: center; gap: 8px; }
.kanban__column-dot { width: 10px; height: 10px; border-radius: 50%; }
.kanban__column-count {
  font-size: 12px; font-weight: 700; background: var(--color-bg-elevated); color: var(--color-text-muted);
  padding: 2px 8px; border-radius: var(--radius-full);
}
.kanban__column-body { flex: 1; padding: 12px; display: flex; flex-direction: column; gap: 10px; overflow-y: auto; }
.kanban__card {
  background: var(--color-bg-elevated); border: 1px solid var(--color-border); border-radius: var(--radius-md);
  padding: 14px 16px; cursor: pointer; transition: all var(--transition-fast);
}
.kanban__card:hover { border-color: var(--color-primary); transform: translateY(-1px); }
.kanban__card-name { font-size: 14px; font-weight: 600; margin-bottom: 4px; }
.kanban__card-info { font-size: 12px; color: var(--color-text-muted); }
.kanban__card-value { font-size: 13px; font-weight: 700; color: var(--color-success); margin-top: 8px; }

/* Forms */
.form-group { margin-bottom: 24px; }
.form-group label { display: block; font-size: 14px; font-weight: 600; color: var(--color-text-secondary); margin-bottom: 8px; }
.form-group input[type="text"], .form-group input[type="email"], .form-group input[type="number"],
.form-group input[type="url"], .form-group input[type="password"],
.form-group textarea, .form-group select {
  width: 100%; padding: 12px 16px; background: var(--color-bg); border: 1px solid var(--color-border);
  border-radius: var(--radius-md); color: var(--color-text); font-size: 14px;
  transition: all var(--transition-fast); outline: none;
}
.form-group input:focus, .form-group textarea:focus, .form-group select:focus {
  border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(108,92,231,0.15);
}
.form-group input::placeholder, .form-group textarea::placeholder { color: var(--color-text-muted); }
.form-group textarea { resize: vertical; min-height: 100px; }
.form-group select { appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%236e6e8a' stroke-width='2'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 16px center; padding-right: 40px; }
.form-group .form-hint { font-size: 12px; color: var(--color-text-muted); margin-top: 6px; }

.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.form-actions { display: flex; gap: 12px; margin-top: 32px; }

/* Empty State */
.empty-state { text-align: center; padding: 64px 24px; }
.empty-state__icon { font-size: 48px; margin-bottom: 16px; opacity: 0.5; }
.empty-state__title { font-size: 20px; font-weight: 700; margin-bottom: 8px; }
.empty-state__desc { font-size: 15px; color: var(--color-text-secondary); margin-bottom: 24px; }

/* Filters */
.filters { display: flex; gap: 12px; margin-bottom: 24px; flex-wrap: wrap; align-items: center; }
.filters__search {
  padding: 10px 16px; background: var(--color-bg-card); border: 1px solid var(--color-border);
  border-radius: var(--radius-full); color: var(--color-text); font-size: 14px; min-width: 240px; outline: none;
}
.filters__search:focus { border-color: var(--color-primary); }
.filters__select {
  padding: 10px 16px; background: var(--color-bg-card); border: 1px solid var(--color-border);
  border-radius: var(--radius-full); color: var(--color-text); font-size: 14px; outline: none;
  appearance: none; padding-right: 36px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%236e6e8a' stroke-width='2'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 14px center;
}

/* Section Dividers */
.section { margin-bottom: 32px; }
.section__title { font-size: 20px; font-weight: 700; margin-bottom: 16px; }
.section__subtitle { font-size: 14px; color: var(--color-text-secondary); margin-bottom: 24px; }

/* ---- Tabs Component ---- */
.tabs {
  display: flex;
  gap: 0;
  border-bottom: 1px solid var(--color-border);
  margin-bottom: 24px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.tabs__link {
  padding: 12px 20px;
  font-size: 14px;
  font-weight: 600;
  color: var(--color-text-muted);
  text-decoration: none;
  border-bottom: 2px solid transparent;
  white-space: nowrap;
  transition: color 0.2s, border-color 0.2s;
}
.tabs__link:hover {
  color: var(--color-text);
}
.tabs__link--active {
  color: var(--color-primary-light);
  border-bottom-color: var(--color-primary);
}
.tabs__panel {
  min-height: 200px;
}

/* ---- Split View (Conversations) ---- */
.split-view {
  display: flex;
  height: calc(100vh - 140px);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.split-view__left {
  width: 380px;
  border-right: 1px solid var(--color-border);
  overflow-y: auto;
  flex-shrink: 0;
  background: var(--color-bg);
}
.split-view__right {
  flex: 1;
  overflow-y: auto;
  background: var(--color-bg);
}
.split-view__empty {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  color: var(--color-text-muted);
  font-size: 15px;
}
@media (max-width: 768px) {
  .split-view { flex-direction: column; height: auto; }
  .split-view__left { width: 100%; border-right: none; border-bottom: 1px solid var(--color-border); max-height: 50vh; }
}

/* Timeline */
.timeline { list-style: none; padding: 0; margin: 0; }
.timeline__item {
  display: flex;
  gap: 14px;
  padding: 12px 0;
  border-bottom: 1px solid var(--color-border);
}
.timeline__item:last-child { border-bottom: none; }
.timeline__icon {
  flex: 0 0 32px;
  width: 32px; height: 32px;
  border-radius: var(--radius-full);
  background: var(--color-bg-elevated);
  display: flex; align-items: center; justify-content: center;
  font-size: 16px;
}
.timeline__body { flex: 1; min-width: 0; }
.timeline__title {
  font-size: 14px; font-weight: 600; color: var(--color-text);
  display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap;
}
.timeline__detail {
  font-size: 13px; font-weight: 500;
  color: var(--color-text-secondary);
  background: var(--color-bg-elevated);
  padding: 2px 8px; border-radius: var(--radius-sm);
}
.timeline__meta {
  font-size: 12px; color: var(--color-text-muted);
  margin-top: 4px;
}

/* ========== CRESCIMENTO ========== */

/* Subnav (abas horizontais) */
.subnav {
  display: flex; gap: 6px;
  border-bottom: 1px solid var(--color-border);
  margin-bottom: 24px;
  padding-bottom: 0;
}
.subnav__link {
  padding: 10px 16px;
  font-size: 14px; font-weight: 600;
  color: var(--color-text-muted);
  border-bottom: 2px solid transparent;
  transition: all var(--transition-fast);
}
.subnav__link:hover { color: var(--color-text-secondary); }
.subnav__link--active {
  color: var(--color-text);
  border-bottom-color: var(--color-primary);
}

/* Campaign grid (cards) */
.campaign-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 20px;
}
.campaign-card {
  display: block;
  background: var(--color-bg-card);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: 20px;
  transition: all var(--transition-fast);
}
.campaign-card:hover {
  border-color: var(--color-primary);
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
}
.campaign-card__top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; }
.campaign-card__kind { font-size: 11px; text-transform: uppercase; letter-spacing: 0.1em; color: var(--color-text-muted); }
.campaign-card__name { font-size: 18px; font-weight: 700; margin-bottom: 8px; }
.campaign-card__desc { font-size: 13px; color: var(--color-text-muted); margin-bottom: 16px; line-height: 1.5; }
.campaign-card__stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  padding-top: 14px;
  border-top: 1px solid var(--color-border);
}
.campaign-card__stats > div { display: flex; flex-direction: column; gap: 2px; }
.stat__label { font-size: 11px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--color-text-muted); }
.stat__value { font-size: 18px; font-weight: 700; color: var(--color-text); }
.stat__value--green { color: var(--color-green); }
.campaign-card__geo { font-size: 12px; color: var(--color-text-muted); margin-top: 12px; }

/* Campaign row (compact list) */
.campaign-list { display: flex; flex-direction: column; gap: 4px; }
.campaign-row {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 16px;
  border-radius: var(--radius-md);
  transition: background var(--transition-fast);
}
.campaign-row:hover { background: var(--color-bg-elevated); }
.campaign-row__name { font-weight: 600; font-size: 15px; margin-bottom: 4px; }
.campaign-row__sub { display: flex; align-items: center; gap: 10px; font-size: 12px; color: var(--color-text-muted); }
.campaign-row__cta { font-size: 20px; color: var(--color-text-muted); }

/* Post cards */
.post-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 16px;
}
.post-card {
  display: block;
  background: var(--color-bg-elevated);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: 14px;
  transition: all var(--transition-fast);
}
.post-card:hover { border-color: var(--color-primary-light); }
.post-card--small { padding: 12px; }
.post-card__head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
.post-card__platform {
  font-size: 12px; font-weight: 600; text-transform: capitalize;
  color: var(--color-text-secondary);
}
.post-card__img {
  width: 100%; aspect-ratio: 1/1;
  object-fit: cover;
  border-radius: var(--radius-sm);
  margin-bottom: 10px;
}
.post-card__img--large { aspect-ratio: auto; max-height: 400px; }
.post-card__name { font-weight: 600; font-size: 14px; margin-bottom: 4px; }
.post-card__sub { font-size: 12px; color: var(--color-text-muted); margin-bottom: 8px; }
.post-card__text { font-size: 12px; color: var(--color-text-muted); margin-bottom: 10px; line-height: 1.4; }
.post-card__stats {
  display: flex; gap: 6px; align-items: center;
  font-size: 12px; color: var(--color-text-muted);
  padding-top: 10px;
  border-top: 1px solid var(--color-border);
}
.post-card__stats strong { color: var(--color-green); }

/* Kanban */
.kanban {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}
.kanban__column {
  background: var(--color-bg-card);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: 12px;
  min-height: 200px;
}
.kanban__header {
  display: flex; justify-content: space-between; align-items: center;
  padding: 4px 8px 10px;
  margin-bottom: 8px;
  border-bottom: 1px solid var(--color-border);
  font-size: 13px;
}
.kanban__count {
  background: var(--color-bg-elevated);
  padding: 2px 8px;
  border-radius: var(--radius-full);
  font-size: 12px; font-weight: 600;
}
.kanban__items { display: flex; flex-direction: column; gap: 10px; }

/* Chips */
.chips { display: flex; flex-wrap: wrap; gap: 10px; }
.chip {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--color-bg-elevated);
  border: 1px solid var(--color-border);
  padding: 6px 12px;
  border-radius: var(--radius-full);
  font-size: 13px;
}
.chip--tiny { padding: 2px 8px; font-size: 11px; font-weight: 600; }
.chip__label { text-transform: capitalize; color: var(--color-text-secondary); }
.chip__count { font-weight: 700; color: var(--color-text); }

/* Shortlink box */
.shortlink-box {
  display: flex; align-items: center; gap: 10px;
  background: var(--color-bg-elevated);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: 12px 14px;
  margin-bottom: 10px;
}
.shortlink-box__code {
  flex: 1;
  font-family: monospace; font-size: 13px;
  color: var(--color-accent);
  overflow-x: auto;
  white-space: nowrap;
}
.shortlink-meta { font-size: 12px; color: var(--color-text-muted); }
.shortlink-meta strong { color: var(--color-green); }
.shortlink-meta code { background: var(--color-bg-elevated); padding: 2px 6px; border-radius: 4px; }

/* QR box */
.qr-box { display: flex; flex-direction: column; align-items: center; gap: 14px; padding: 10px 0; }
.qr-box__img { width: 200px; height: 200px; background: white; padding: 12px; border-radius: var(--radius-md); }

/* Forms */
.form-card {
  background: var(--color-bg-card);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: 24px;
  max-width: 800px;
}
.form-row { display: flex; flex-direction: column; gap: 6px; margin-bottom: 18px; }
.form-row label {
  font-size: 13px; font-weight: 600;
  color: var(--color-text-secondary);
  display: flex; justify-content: space-between; align-items: center;
}
.form-label-action { font-weight: 400; }
.form-hint { font-size: 12px; color: var(--color-text-muted); margin-top: 4px; }
.input {
  width: 100%;
  background: var(--color-bg-elevated);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  padding: 10px 14px;
  color: var(--color-text);
  font-size: 14px;
  transition: border-color var(--transition-fast);
}
.input:focus { outline: none; border-color: var(--color-primary); }
.input--sm { padding: 7px 10px; font-size: 13px; }
.form-actions {
  display: flex; justify-content: flex-end; gap: 10px;
  padding-top: 16px;
  border-top: 1px solid var(--color-border);
  margin-top: 10px;
}

/* Filter bar */
.filter-bar { margin-bottom: 20px; }
.filter-bar__form { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }

/* Badges for statuses/platforms */
.badge--draft { background: rgba(110,110,138,0.15); color: var(--color-text-muted); }
.badge--scheduled { background: rgba(253,203,110,0.15); color: var(--color-warning); }
.badge--posted, .badge--active { background: rgba(0,255,136,0.12); color: var(--color-green); }
.badge--archived, .badge--paused { background: rgba(110,110,138,0.15); color: var(--color-text-muted); }
.badge--instagram { background: rgba(228,64,95,0.15); color: #e4405f; }
.badge--facebook { background: rgba(24,119,242,0.15); color: #1877f2; }
.badge--whatsapp { background: rgba(37,211,102,0.15); color: #25d366; }
.badge--linkedin { background: rgba(10,102,194,0.15); color: #0a66c2; }
.badge--tiktok { background: rgba(0,242,234,0.15); color: #00f2ea; }
.badge--google { background: rgba(234,67,53,0.15); color: #ea4335; }
.badge--qr { background: rgba(108,92,231,0.15); color: var(--color-primary-light); }
.badge--evergreen { background: rgba(0,212,255,0.12); color: var(--color-accent); }
.badge--launch { background: rgba(108,92,231,0.12); color: var(--color-primary-light); }

.btn--xs { padding: 4px 8px; font-size: 11px; font-weight: 600; border-radius: var(--radius-sm); }

/* Empty state title */
.empty-state__title { font-size: 18px; font-weight: 700; margin-bottom: 8px; color: var(--color-text); }

@media (max-width: 900px) {
  .kanban { grid-template-columns: 1fr; }
  .campaign-card__stats { grid-template-columns: repeat(2, 1fr); }
}

/* ========== CONTATOS KANBAN + SCORE ========== */
.view-toggle {
  display: inline-flex;
  background: var(--color-bg-elevated);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: 2px;
}
.view-toggle__btn {
  padding: 6px 14px;
  font-size: 13px; font-weight: 600;
  color: var(--color-text-muted);
  border-radius: var(--radius-sm);
  transition: all var(--transition-fast);
}
.view-toggle__btn--active {
  background: var(--color-bg-card);
  color: var(--color-text);
  box-shadow: var(--shadow-sm);
}

.bucket-kanban {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(280px, 1fr);
  gap: 14px;
  overflow-x: auto;
  padding-bottom: 12px;
}
.bucket-column {
  background: var(--color-bg-card);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: 12px;
  min-height: 240px;
}
.bucket-column__header {
  display: flex; align-items: center; gap: 10px;
  padding: 4px 8px 10px;
  border-bottom: 1px solid var(--color-border);
  margin-bottom: 10px;
  font-size: 13px;
}
.bucket-dot { width: 10px; height: 10px; border-radius: 50%; }
.bucket-summary {
  margin-top: 12px;
  font-size: 13px; color: var(--color-text-muted);
  text-align: center;
}

.contact-card {
  display: block;
  background: var(--color-bg-elevated);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: 12px;
  transition: all var(--transition-fast);
}
.contact-card:hover {
  border-color: var(--color-primary-light);
  transform: translateY(-1px);
}
.contact-card__head {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 6px;
}
.contact-card__name { font-weight: 600; font-size: 14px; color: var(--color-text); }
.contact-card__score {
  background: var(--color-bg-card);
  padding: 2px 8px;
  border-radius: var(--radius-sm);
  font-size: 12px; font-weight: 700;
  color: var(--color-accent);
}
.contact-card__meta { font-size: 12px; color: var(--color-text-muted); margin-bottom: 8px; }
.contact-card__footer {
  display: flex; justify-content: space-between; align-items: center;
  font-size: 11px;
}
.contact-card__recency { color: var(--color-text-muted); }

.bucket-pill {
  display: inline-block;
  padding: 3px 10px;
  border-radius: var(--radius-full);
  font-size: 12px; font-weight: 600;
}
.score-pill {
  display: inline-block;
  padding: 3px 10px;
  border-radius: var(--radius-full);
  background: var(--color-bg-elevated);
  color: var(--color-text-secondary);
  font-size: 12px;
}
.score-pill strong { color: var(--color-accent); }

@media (max-width: 900px) {
  .bucket-kanban { grid-auto-flow: row; grid-auto-columns: auto; }
}

/* ========== ANALYTICS ========== */
.funnel-chart { display: flex; flex-direction: column; gap: 14px; }
.funnel-row {
  display: flex; align-items: center; gap: 16px;
}
.funnel-row__label {
  min-width: 200px;
  font-size: 13px; display: flex; flex-direction: column; gap: 2px;
}
.funnel-row__drop { font-size: 11px; color: var(--color-danger); }
.funnel-bar {
  flex: 1; height: 36px;
  background: var(--color-bg-elevated);
  border-radius: var(--radius-sm);
  overflow: hidden;
  position: relative;
}
.funnel-bar__fill {
  height: 100%;
  background: linear-gradient(90deg, var(--color-primary), var(--color-accent));
  display: flex; align-items: center; justify-content: flex-end;
  padding: 0 12px;
  min-width: 80px;
  transition: width 400ms ease;
}
.funnel-bar__text { color: white; font-weight: 700; font-size: 13px; text-shadow: 0 1px 2px rgba(0,0,0,0.3); }

.percentile-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px;
}
.percentile-grid > div { display: flex; flex-direction: column; gap: 4px; }
.stat__unit { font-size: 12px; color: var(--color-text-muted); margin-left: 2px; font-weight: 400; }

.bucket-bars { display: flex; flex-direction: column; gap: 10px; }
.bucket-bar__label {
  display: flex; align-items: center; gap: 10px;
  font-size: 13px; margin-bottom: 4px;
}
.bucket-bar__track {
  height: 8px; background: var(--color-bg-elevated); border-radius: var(--radius-full); overflow: hidden;
}
.bucket-bar__fill { height: 100%; transition: width 300ms ease; }

/* ========== COMPANION ========== */
.companion-list { display: flex; flex-direction: column; gap: 4px; }
.companion-row {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 16px;
  border-radius: var(--radius-md);
  transition: background var(--transition-fast);
}
.companion-row:hover { background: var(--color-bg-elevated); }
.companion-row__name { font-weight: 600; font-size: 14px; display: flex; align-items: center; gap: 10px; }
.companion-row__sub { font-size: 12px; color: var(--color-text-muted); margin-top: 4px; }
.companion-row__stats { display: flex; gap: 22px; align-items: center; }

.template-chips { display: flex; flex-wrap: wrap; gap: 10px; }

.badge--sent { background: rgba(0,255,136,0.12); color: var(--color-green); }
.badge--skipped { background: rgba(110,110,138,0.15); color: var(--color-text-muted); }
.badge--failed { background: rgba(255,107,107,0.15); color: var(--color-danger); }

/* ============================================================
   Agent show page — tabs, tool pills, flow steps, kanban DnD,
   tool-call cards, conv-debug modal.
   ============================================================ */

/* Tab content panel */
.tab-content { padding-top: 16px; }

/* Tabs button-style overrides (we now use <button>) */
.tabs__link[type="button"] {
  background: transparent;
  border: none;
  cursor: pointer;
}

/* Stage list (compact) */
.stage-list { display: flex; flex-direction: column; gap: 6px; padding: 10px 0; }
.stage-list__item {
  display: flex; align-items: center; gap: 12px;
  padding: 8px 4px;
  border-bottom: 1px solid var(--color-border);
}
.stage-list__item:last-child { border-bottom: none; }
.stage-list__name { flex: 1; font-size: 14px; font-weight: 600; }
.stage-list__count {
  background: rgba(108,92,231,0.15); color: var(--color-primary-light);
  padding: 2px 10px; border-radius: var(--radius-full);
  font-size: 12px; font-weight: 700;
}

/* Tool pills (Config tab) */
.tool-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 10px;
  padding: 14px 0 4px;
}
.tool-pill {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 12px 14px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-bg-card);
}
.tool-pill--on { border-color: rgba(0,255,136,0.3); background: rgba(0,255,136,0.04); }
.tool-pill--off { opacity: 0.55; }
.tool-pill__icon { font-size: 16px; }
.tool-pill__body { flex: 1; min-width: 0; }
.tool-pill__name { font-size: 13px; font-weight: 700; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.tool-pill__desc { font-size: 12px; color: var(--color-text-muted); margin-top: 3px; line-height: 1.4; }
.tool-pill__status {
  font-size: 10px; font-weight: 800; letter-spacing: 0.06em;
  padding: 3px 8px; border-radius: var(--radius-full);
}
.tool-pill--on .tool-pill__status { background: rgba(0,255,136,0.15); color: var(--color-green); }
.tool-pill--off .tool-pill__status { background: rgba(110,110,138,0.15); color: var(--color-text-muted); }

/* Flow steps timeline */
.flow-steps { list-style: none; padding: 14px 4px 4px; display: flex; flex-direction: column; gap: 12px; }
.flow-step { display: flex; gap: 12px; align-items: flex-start; }
.flow-step__num {
  width: 28px; height: 28px; border-radius: 50%;
  background: linear-gradient(135deg, var(--color-primary), var(--color-primary-light));
  color: #fff; display: flex; align-items: center; justify-content: center;
  font-weight: 800; font-size: 13px; flex-shrink: 0;
}
.flow-step__body { flex: 1; }
.flow-step__name { font-size: 14px; font-weight: 700; }
.flow-step__instr { font-size: 13px; color: var(--color-text-secondary); margin-top: 3px; }
.flow-step__meta { display: flex; gap: 6px; margin-top: 6px; flex-wrap: wrap; }
.chip {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 11px; font-weight: 700;
  padding: 3px 9px; border-radius: var(--radius-full);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
}
.chip--tool { background: rgba(0,212,255,0.12); color: var(--color-accent); }
.chip--stage { background: rgba(108,92,231,0.15); color: var(--color-primary-light); }

/* Card footer (Config tab) */
.card__footer { padding: 10px 0 4px; border-top: 1px solid var(--color-border); margin-top: 14px; }

/* Prompt block */
.prompt-block {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 12px;
  color: var(--color-text-secondary);
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  padding: 12px;
  white-space: pre-wrap;
  max-height: 260px;
  overflow-y: auto;
  line-height: 1.6;
}

/* Muted helpers */
.muted { font-size: 13px; color: var(--color-text-muted); }
.muted--right { margin-left: auto; }
.muted--ok { color: var(--color-green); }
.muted--err { color: var(--color-danger); }

/* Kanban toolbar + DnD enhancements */
.kanban-toolbar {
  display: flex; align-items: center; gap: 12px;
  margin-bottom: 12px;
  padding: 10px 14px;
  background: var(--color-bg-card);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
}
.kanban__card {
  cursor: grab;
  user-select: none;
}
.kanban__card:active { cursor: grabbing; }
.kanban__card--dragging { opacity: 0.45; transform: rotate(-1deg); }
.kanban__column-body--over {
  background: rgba(108,92,231,0.06);
  outline: 2px dashed rgba(108,92,231,0.45);
  outline-offset: -4px;
  border-radius: var(--radius-sm);
}
.kanban__column-empty {
  text-align: center;
  padding: 20px 0;
  color: var(--color-text-muted);
  font-size: 13px;
}
.kanban__card-link {
  display: inline-block;
  margin-top: 6px;
  font-size: 11px;
  color: var(--color-primary-light);
}
.kanban__card-link:hover { text-decoration: underline; }

/* Tool-call card (no chat) */
.tool-call {
  align-self: stretch;
  margin: 4px 0;
  border: 1px solid var(--color-border);
  border-left: 3px solid var(--color-accent);
  border-radius: var(--radius-sm);
  background: rgba(0,212,255,0.04);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 12px;
  overflow: hidden;
}
.tool-call__head {
  display: flex; align-items: center; gap: 8px;
  padding: 8px 12px;
  cursor: pointer;
  transition: background var(--transition-fast);
}
.tool-call__head:hover { background: rgba(0,212,255,0.08); }
.tool-call__icon { font-size: 13px; }
.tool-call__name { font-weight: 700; color: var(--color-accent); }
.tool-call__badge {
  font-size: 10px; font-weight: 700; letter-spacing: 0.04em;
  padding: 2px 7px; border-radius: var(--radius-full);
  font-family: var(--font-body);
}
.tool-call__badge--call    { background: rgba(0,212,255,0.15); color: var(--color-accent); }
.tool-call__badge--ok      { background: rgba(0,255,136,0.15); color: var(--color-green); }
.tool-call__badge--pending { background: rgba(253,203,110,0.18); color: var(--color-warning); }
.tool-call__time { margin-left: auto; color: var(--color-text-muted); font-size: 11px; }
.tool-call__caret {
  margin-left: 6px;
  color: var(--color-text-muted);
  transition: transform var(--transition-fast);
}
.tool-call--open .tool-call__caret { transform: rotate(180deg); }
.tool-call__body { padding: 0 12px 10px; }
.tool-call__section + .tool-call__section { margin-top: 10px; }
.tool-call__section-title {
  font-size: 10px; font-weight: 800; letter-spacing: 0.08em;
  text-transform: uppercase; color: var(--color-text-muted);
  margin-bottom: 4px;
  font-family: var(--font-body);
}
.tool-call__meta { font-weight: 400; text-transform: none; letter-spacing: 0; }
.tool-call__code {
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  padding: 10px 12px;
  white-space: pre-wrap;
  word-break: break-word;
  color: var(--color-text-secondary);
  max-height: 280px;
  overflow-y: auto;
  font-size: 11px;
  line-height: 1.55;
}
.tool-call__code--result { border-left: 3px solid var(--color-success); }

/* Conv-detail base layout (header on top, chat + sidebar below) */
.conv-detail { display: flex; flex-direction: column; height: 100%; min-height: 0; }
.conv-detail__header {
  display: flex; justify-content: space-between; align-items: center;
  padding: 12px 16px;
  border-bottom: 1px solid var(--color-border);
  background: var(--color-bg-card);
  flex-shrink: 0;
}
.conv-detail__content { display: flex; flex: 1; min-height: 0; }
.conv-detail__chat { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.conv-detail__messages {
  flex: 1; overflow-y: auto;
  padding: 16px 20px;
  display: flex; flex-direction: column; gap: 6px;
  background: var(--color-bg);
}
.conv-detail__composer {
  padding: 10px 16px;
  border-top: 1px solid var(--color-border);
  background: var(--color-bg-card);
  flex-shrink: 0;
}
.conv-detail__sidebar {
  width: 240px;
  border-left: 1px solid var(--color-border);
  overflow-y: auto;
  padding: 12px;
  background: var(--color-bg);
  flex-shrink: 0;
}

/* Chat bubbles */
.conv-bubble {
  max-width: 70%;
  padding: 10px 14px 6px;
  border-radius: var(--radius-md);
  word-wrap: break-word;
  overflow-wrap: break-word;
}
.conv-bubble--sent {
  align-self: flex-end;
  background: rgba(108,92,231,0.15);
  border: 1px solid rgba(108,92,231,0.25);
  border-top-right-radius: 4px;
  color: var(--color-text);
}
.conv-bubble--received {
  align-self: flex-start;
  background: var(--color-bg-card);
  border: 1px solid var(--color-border);
  border-top-left-radius: 4px;
  color: var(--color-text);
}
.conv-bubble__sender {
  font-size: 11px; font-weight: 700;
  color: var(--color-primary-light);
  margin-bottom: 3px;
}
.conv-bubble__text { font-size: 14px; line-height: 1.5; color: var(--color-text); }
.conv-bubble__text p { margin: 0; }
.conv-bubble__text p + p { margin-top: 4px; }
.conv-bubble__time {
  display: flex; justify-content: flex-end; align-items: center; gap: 4px;
  font-size: 11px; color: var(--color-text-muted);
  margin-top: 4px;
}

/* Composer */
.conv-composer { display: flex; gap: 10px; align-items: flex-end; }
.conv-composer__input {
  flex: 1; resize: none;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-full);
  padding: 10px 16px;
  font-size: 14px;
  background: var(--color-bg-elevated);
  color: var(--color-text);
  outline: none;
  max-height: 100px;
}
.conv-composer__input::placeholder { color: var(--color-text-muted); }
.conv-composer__input:focus { border-color: var(--color-primary); }
.conv-composer__send {
  width: 38px; height: 38px;
  border-radius: 50%;
  background: var(--color-primary);
  color: white; border: none; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  transition: background var(--transition-normal);
}
.conv-composer__send:hover { background: var(--color-primary-light); }

/* Sidebar cards */
.conv-sidebar-card {
  background: var(--color-bg-card);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  padding: 14px;
  margin-bottom: 10px;
}
.conv-sidebar-card__title {
  font-size: 11px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.06em;
  color: var(--color-text-muted);
  margin-bottom: 8px;
}
.conv-sidebar-card__name { font-size: 14px; font-weight: 600; color: var(--color-text); margin: 0; }
.conv-sidebar-card__info { font-size: 13px; color: var(--color-text-muted); margin: 2px 0 0; }
.conv-sidebar-card__meta { font-size: 12px; color: var(--color-text-muted); margin-top: 8px; }
.conv-sidebar-card__stats { font-size: 13px; color: var(--color-text-secondary); line-height: 1.8; }
.conv-sidebar-card__stats span { font-weight: 600; color: var(--color-text); }

@media (max-width: 768px) {
  .conv-detail__content { flex-direction: column; }
  .conv-detail__sidebar { width: 100%; border-left: none; border-top: 1px solid var(--color-border); }
  .conv-bubble { max-width: 90%; }
}

/* Conv-detail extras */
.conv-bubble--human { border: 1px dashed rgba(253,203,110,0.4); }
.conv-bubble__chip {
  font-size: 9px; font-weight: 800; letter-spacing: 0.08em;
  background: rgba(253,203,110,0.18); color: var(--color-warning);
  padding: 1px 6px; border-radius: var(--radius-full);
  margin-left: 6px;
}
.conv-divider {
  align-self: center;
  display: inline-flex; flex-direction: column; align-items: center; gap: 2px;
  background: rgba(108,92,231,0.05);
  border: 1px dashed rgba(108,92,231,0.3);
  border-radius: var(--radius-sm);
  padding: 6px 12px;
  max-width: 80%;
}
.conv-divider__label {
  font-size: 10px; font-weight: 800; letter-spacing: 0.08em;
  color: var(--color-primary-light); text-transform: uppercase;
}
.conv-divider__text { font-size: 12px; color: var(--color-text-secondary); text-align: center; }
.conv-divider__time { font-size: 10px; color: var(--color-text-muted); }
.conv-empty { text-align: center; padding: 40px; color: var(--color-text-muted); }

/* Compose: inject context */
.conv-inject {
  display: flex; gap: 8px; align-items: center; margin-top: 8px;
}
.conv-inject__input {
  flex: 1;
  padding: 6px 12px;
  border: 1px dashed var(--color-border-light);
  border-radius: var(--radius-md);
  background: transparent; color: var(--color-text-secondary);
  font-size: 12px; outline: none;
}
.conv-inject__input::placeholder { color: var(--color-text-muted); font-style: italic; }
.conv-inject__input:focus { border-color: var(--color-primary); border-style: solid; }

/* In-tab split-view (Conversas tab inside agent show) */
.split-view--in-tab {
  height: calc(100vh - 280px);
  min-height: 480px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  overflow: hidden;
}

/* Sidebar item meta line */
.sv-item__meta { display: flex; gap: 4px; margin-top: 4px; }

/* Conv debug modal */
.conv-debug { position: fixed; inset: 0; z-index: 9999; }
.conv-debug__backdrop { position: absolute; inset: 0; background: rgba(0,0,0,0.6); backdrop-filter: blur(2px); }
.conv-debug__panel {
  position: relative;
  margin: 5vh auto;
  max-width: 900px; width: calc(100vw - 40px);
  max-height: 90vh;
  background: var(--color-bg-card);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  display: flex; flex-direction: column;
  box-shadow: var(--shadow-lg);
}
.conv-debug__header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid var(--color-border);
}
.conv-debug__header h3 { font-size: 16px; font-weight: 700; }
.conv-debug__close {
  background: transparent; border: none;
  color: var(--color-text); font-size: 24px; line-height: 1; cursor: pointer;
  padding: 0 8px;
}
.conv-debug__body { padding: 16px 20px; overflow-y: auto; }
.conv-debug__section + .conv-debug__section { margin-top: 16px; }
.conv-debug__section h4 {
  font-size: 12px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--color-text-muted); margin-bottom: 6px;
}
.badge--scheduled { background: rgba(253,203,110,0.15); color: var(--color-warning); }

/* ========================================
   LEADS / IMPORTS / OUTBOUND BLASTS
   ======================================== */

/* Breadcrumb */
.breadcrumb {
  display: flex; align-items: center; gap: 8px;
  font-size: 13px; font-weight: 500;
  color: var(--color-text-muted);
  margin-bottom: 8px;
}
.breadcrumb a { color: var(--color-text-muted); transition: color var(--transition-fast); }
.breadcrumb a:hover { color: var(--color-primary-light); }
.breadcrumb__sep { color: var(--color-text-muted); opacity: 0.5; }
.breadcrumb__current { color: var(--color-text-secondary); font-weight: 600; }

/* ---------- Leads tab — switcher cards ---------- */
.leads-tab { padding-top: 8px; }
.leads-tab__lists { margin-top: 24px; }

.switcher-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}
@media (max-width: 900px) { .switcher-grid { grid-template-columns: 1fr; } }

.switcher-card {
  position: relative;
  display: block;
  padding: 32px 28px;
  background: var(--color-bg-card);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-xl);
  transition: all var(--transition-normal);
  overflow: hidden;
  color: var(--color-text);
}
.switcher-card:hover {
  transform: translateY(-3px);
  border-color: var(--color-primary);
  box-shadow: 0 12px 40px rgba(108,92,231,0.18);
}
.switcher-card__glow {
  position: absolute;
  top: -60%; right: -20%;
  width: 320px; height: 320px;
  background: radial-gradient(circle, rgba(108,92,231,0.18) 0%, transparent 70%);
  opacity: 0;
  transition: opacity var(--transition-normal);
  pointer-events: none;
}
.switcher-card--blasts .switcher-card__glow {
  background: radial-gradient(circle, rgba(0,212,255,0.18) 0%, transparent 70%);
}
.switcher-card:hover .switcher-card__glow { opacity: 1; }
.switcher-card__icon { font-size: 40px; margin-bottom: 18px; }
.switcher-card__title { font-size: 22px; font-weight: 800; margin-bottom: 10px; letter-spacing: -0.01em; }
.switcher-card__desc { font-size: 14px; color: var(--color-text-secondary); line-height: 1.6; margin-bottom: 24px; }
.switcher-card__stats {
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: 16px; padding-top: 16px;
  border-top: 1px solid var(--color-border);
}
.switcher-card__stat-value {
  font-size: 28px; font-weight: 900; letter-spacing: -0.02em;
  background: linear-gradient(135deg, var(--color-primary), var(--color-accent));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.switcher-card__stat-label {
  font-size: 11px; font-weight: 600; text-transform: uppercase;
  letter-spacing: 0.08em; color: var(--color-text-muted); margin-top: 2px;
}
.switcher-card__cta {
  font-size: 13px; font-weight: 700; color: var(--color-primary-light);
  text-transform: uppercase; letter-spacing: 0.06em;
}

/* ---------- Mini list (inside cards) ---------- */
.mini-list { display: flex; flex-direction: column; gap: 4px; }
.mini-list__row {
  display: flex; align-items: center; gap: 16px;
  padding: 12px 14px;
  border-radius: var(--radius-md);
  transition: all var(--transition-fast);
  color: var(--color-text);
}
.mini-list__row:hover {
  background: var(--color-bg-elevated);
  transform: translateX(2px);
}
.mini-list__main { flex: 1; min-width: 0; }
.mini-list__title { font-size: 14px; font-weight: 600; margin-bottom: 4px; }
.mini-list__sub { font-size: 12px; color: var(--color-text-muted); display: flex; align-items: center; gap: 6px; }
.mini-list__nums { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; }
.mini-list__num { font-size: 16px; font-weight: 800; color: var(--color-text); }
.mini-list__num--green { color: var(--color-green); }
.mini-list__num--accent { color: var(--color-accent); }
.mini-list__num-label { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; color: var(--color-text-muted); }

.empty-state--sm { padding: 32px 16px; }

/* ---------- Imports list ---------- */
.import-list { display: flex; flex-direction: column; gap: 14px; }
.import-row {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 24px;
  padding: 20px 24px;
  background: var(--color-bg-card);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  transition: all var(--transition-fast);
  color: var(--color-text);
}
.import-row:hover {
  border-color: var(--color-primary);
  transform: translateY(-1px);
  box-shadow: var(--shadow-sm);
}
.import-row__icon {
  font-size: 28px;
  width: 56px; height: 56px;
  background: var(--color-bg-elevated);
  border-radius: var(--radius-md);
  display: flex; align-items: center; justify-content: center;
}
.import-row__main { min-width: 0; }
.import-row__top {
  display: flex; align-items: center; gap: 12px; margin-bottom: 8px;
  flex-wrap: wrap;
}
.import-row__filename { font-size: 16px; font-weight: 700; }
.import-row__bottom {
  display: flex; align-items: center; gap: 8px; margin-top: 8px;
  font-size: 12px; color: var(--color-text-muted);
  flex-wrap: wrap;
}
.import-row__metrics { display: flex; gap: 18px; }
.import-row__metric { text-align: right; min-width: 50px; }
.import-row__metric-value { font-size: 20px; font-weight: 800; }
.import-row__metric-value--green { color: var(--color-green); }
.import-row__metric-value--orange { color: var(--color-orange); }
.import-row__metric-value--danger { color: var(--color-danger); }
.import-row__metric-label {
  font-size: 10px; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.08em; color: var(--color-text-muted);
}
@media (max-width: 768px) {
  .import-row { grid-template-columns: 1fr; gap: 12px; }
  .import-row__metrics { justify-content: space-between; }
}

/* ---------- Progress bar ---------- */
.progress {
  width: 100%; height: 6px;
  background: var(--color-bg-elevated);
  border-radius: var(--radius-full);
  overflow: hidden;
  position: relative;
}
.progress--lg { height: 12px; }
.progress__bar {
  height: 100%;
  border-radius: var(--radius-full);
  background: linear-gradient(90deg, var(--color-primary), var(--color-accent));
  transition: width 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}
.progress--success .progress__bar { background: linear-gradient(90deg, var(--color-success), var(--color-green)); }
.progress--accent .progress__bar { background: linear-gradient(90deg, var(--color-primary), var(--color-accent)); }
.progress--warning .progress__bar { background: linear-gradient(90deg, var(--color-warning), var(--color-orange)); }
.progress--danger .progress__bar { background: linear-gradient(90deg, var(--color-danger), var(--color-orange)); }
.progress--muted .progress__bar { background: var(--color-border-light); }

.progress--animated .progress__bar {
  background-image: linear-gradient(
    -45deg,
    rgba(255,255,255,0.15) 25%,
    transparent 25%,
    transparent 50%,
    rgba(255,255,255,0.15) 50%,
    rgba(255,255,255,0.15) 75%,
    transparent 75%
  );
  background-size: 24px 24px;
  animation: progressStripe 1.2s linear infinite;
}
@keyframes progressStripe {
  from { background-position: 0 0; }
  to { background-position: 48px 0; }
}

/* Pulse dot for "live" status */
.pulse-dot {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 12px; font-weight: 600;
  color: var(--color-accent);
  text-transform: uppercase; letter-spacing: 0.08em;
}
.pulse-dot span {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--color-accent);
  box-shadow: 0 0 0 0 rgba(0,212,255,0.7);
  animation: pulseDot 1.6s infinite;
}
.pulse-dot--accent span { background: var(--color-accent); }
@keyframes pulseDot {
  0% { box-shadow: 0 0 0 0 rgba(0,212,255,0.7); }
  70% { box-shadow: 0 0 0 12px rgba(0,212,255,0); }
  100% { box-shadow: 0 0 0 0 rgba(0,212,255,0); }
}

.pulse-bullet {
  display: inline-block;
  width: 8px; height: 8px; border-radius: 50%;
  background: currentColor;
  margin-right: 6px;
  animation: pulseBullet 1.4s infinite;
  vertical-align: middle;
}
@keyframes pulseBullet {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.4; transform: scale(1.2); }
}

/* Import progress card */
.import-progress-card { margin-bottom: 24px; }
.import-progress-card__top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.import-progress-card__pct {
  font-size: 36px; font-weight: 900; letter-spacing: -0.02em;
  background: linear-gradient(135deg, var(--color-primary), var(--color-accent));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}

/* Config grid */
.config-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 14px;
}
.config-grid__item {
  background: var(--color-bg-elevated);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: 12px 14px;
}
.config-grid__label {
  font-size: 11px; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.08em; color: var(--color-text-muted); margin-bottom: 4px;
}
.config-grid__value { font-size: 14px; font-weight: 600; color: var(--color-text); display: flex; align-items: center; gap: 8px; }

.error-text { color: var(--color-danger); font-size: 13px; }
.prompt-block {
  background: var(--color-bg-elevated);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: 14px 16px;
  font-size: 13px;
  font-family: 'SF Mono', Menlo, monospace;
  color: var(--color-text-secondary);
  white-space: pre-wrap; word-break: break-word;
  max-height: 360px; overflow-y: auto;
}

/* ---------- Wizard / Steps ---------- */
.steps {
  list-style: none;
  display: flex;
  align-items: center;
  gap: 0;
  margin: 0 0 32px 0;
  padding: 0;
}
.steps__item {
  display: flex; align-items: center; gap: 12px;
  flex: 1;
  position: relative;
  font-size: 14px; font-weight: 600;
  color: var(--color-text-muted);
  transition: color var(--transition-normal);
}
.steps__item:not(:last-child)::after {
  content: '';
  flex: 1;
  height: 2px;
  background: var(--color-border);
  margin: 0 16px;
  transition: background var(--transition-normal);
}
.steps__item--done { color: var(--color-success); }
.steps__item--done::after { background: var(--color-success); }
.steps__item--active { color: var(--color-text); }
.steps__bullet {
  width: 32px; height: 32px;
  border-radius: 50%;
  background: var(--color-bg-elevated);
  border: 2px solid var(--color-border);
  display: flex; align-items: center; justify-content: center;
  font-size: 14px; font-weight: 800;
  transition: all var(--transition-normal);
}
.steps__item--active .steps__bullet {
  background: linear-gradient(135deg, var(--color-primary), var(--color-accent));
  border-color: transparent;
  color: #fff;
  box-shadow: 0 0 0 4px rgba(108,92,231,0.18);
}
.steps__item--done .steps__bullet {
  background: var(--color-success);
  border-color: var(--color-success);
  color: #fff;
}

.wizard-pane { animation: wizardFade 0.4s ease; }
.wizard-pane--enter { animation: wizardFade 0.4s ease; }
@keyframes wizardFade {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

.wizard-nav {
  display: flex; justify-content: space-between; gap: 12px;
  margin-top: 24px;
}

.divider { border: none; border-top: 1px solid var(--color-border); margin: 20px 0; }

/* ---------- Drop zone ---------- */
.drop-zone {
  border: 2px dashed var(--color-border-light);
  border-radius: var(--radius-lg);
  padding: 56px 32px;
  text-align: center;
  cursor: pointer;
  transition: all var(--transition-normal);
  background: linear-gradient(135deg, rgba(108,92,231,0.02), rgba(0,212,255,0.02));
}
.drop-zone:hover {
  border-color: var(--color-primary);
  background: linear-gradient(135deg, rgba(108,92,231,0.06), rgba(0,212,255,0.06));
  box-shadow: 0 0 30px rgba(108,92,231,0.12);
}
.drop-zone--dragging {
  border-color: var(--color-accent);
  background: linear-gradient(135deg, rgba(0,212,255,0.12), rgba(108,92,231,0.08));
  transform: scale(1.005);
}
.drop-zone__icon { font-size: 48px; margin-bottom: 16px; opacity: 0.85; }
.drop-zone__title { font-size: 18px; font-weight: 700; margin-bottom: 6px; }
.drop-zone__sub { font-size: 14px; color: var(--color-text-secondary); margin-bottom: 12px; }
.drop-zone__hint { font-size: 12px; color: var(--color-text-muted); }

.upload-status {
  margin-top: 20px;
  display: flex; align-items: center; gap: 12px;
  padding: 14px 16px;
  background: var(--color-bg-elevated);
  border-radius: var(--radius-md);
  font-size: 14px;
}
.upload-error {
  margin-top: 16px;
  padding: 14px 16px;
  background: rgba(255,107,107,0.08);
  border: 1px solid rgba(255,107,107,0.2);
  border-radius: var(--radius-md);
  color: var(--color-danger);
  font-size: 14px;
}

.spinner {
  width: 18px; height: 18px;
  border: 2px solid var(--color-border);
  border-top-color: var(--color-primary);
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* ---------- Preview table ---------- */
.grid-mapping {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 24px;
}
@media (max-width: 1024px) { .grid-mapping { grid-template-columns: 1fr; } }

.preview-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
}
.preview-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.preview-table thead th {
  position: sticky; top: 0;
  background: var(--color-bg-elevated);
  padding: 10px 12px;
  text-align: left;
  font-size: 12px; font-weight: 800;
  text-transform: uppercase; letter-spacing: 0.06em;
  color: var(--color-primary-light);
  border-bottom: 1px solid var(--color-border);
  white-space: nowrap;
}
.preview-table tbody td {
  padding: 10px 12px;
  border-bottom: 1px solid var(--color-border);
  color: var(--color-text-secondary);
  white-space: nowrap;
  max-width: 200px;
  overflow: hidden; text-overflow: ellipsis;
}
.preview-table tbody tr:last-child td { border-bottom: none; }
.preview-table tbody tr:hover td { background: var(--color-bg-elevated); }

/* ---------- Confirm step ---------- */
.confirm-card { max-width: 720px; margin: 0 auto; }
.confirm-hero {
  text-align: center;
  padding: 24px 0 16px;
  border-bottom: 1px solid var(--color-border);
  margin-bottom: 24px;
}
.confirm-hero__num {
  font-size: 64px; font-weight: 900; letter-spacing: -0.03em;
  background: linear-gradient(135deg, var(--color-primary), var(--color-accent));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
  line-height: 1;
}
.confirm-hero__label {
  font-size: 13px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.1em;
  color: var(--color-text-muted); margin-top: 12px;
}
.confirm-summary {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-bottom: 20px;
}
@media (max-width: 600px) { .confirm-summary { grid-template-columns: 1fr; } }
.confirm-summary > div {
  background: var(--color-bg-elevated);
  border-radius: var(--radius-md);
  padding: 12px 14px;
}
.confirm-summary dt {
  font-size: 11px; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.08em; color: var(--color-text-muted);
  margin-bottom: 4px;
}
.confirm-summary dd { font-size: 14px; font-weight: 600; }
.confirm-note {
  display: flex; align-items: center; gap: 10px;
  padding: 12px 14px;
  background: rgba(0,212,255,0.06);
  border: 1px solid rgba(0,212,255,0.18);
  border-radius: var(--radius-md);
  font-size: 13px;
  color: var(--color-text-secondary);
}
.confirm-note__icon { font-size: 18px; }

/* ---------- Blast composer ---------- */
.blast-composer-grid {
  display: grid;
  grid-template-columns: 1fr 380px;
  gap: 24px;
  align-items: start;
}
@media (max-width: 1100px) { .blast-composer-grid { grid-template-columns: 1fr; } }
.blast-composer__main { display: flex; flex-direction: column; gap: 24px; }
.blast-composer__side { position: sticky; top: 24px; }
@media (max-width: 1100px) { .blast-composer__side { position: static; } }

.blast-composer-foot {
  display: flex; justify-content: flex-end; gap: 12px;
  margin-top: 24px;
  padding-top: 20px;
  border-top: 1px solid var(--color-border);
}

/* WhatsApp bubble preview */
.blast-preview {
  background: linear-gradient(180deg, #0e1717 0%, #0a1212 100%);
  border-radius: var(--radius-lg);
  padding: 20px;
  border: 1px solid var(--color-border);
}
.blast-preview__device {
  background: #0b1414;
  border-radius: var(--radius-md);
  overflow: hidden;
}
.blast-preview__header {
  display: flex; align-items: center; gap: 12px;
  padding: 12px 14px;
  background: #1f2c34;
  border-bottom: 1px solid #0a0a0a;
}
.blast-preview__avatar {
  width: 36px; height: 36px;
  border-radius: 50%;
  background: linear-gradient(135deg, #25D366, #128C7E);
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: 15px;
}
.blast-preview__name { font-size: 14px; font-weight: 600; color: #e9edef; }
.blast-preview__status { font-size: 11px; color: #8696a0; }
.blast-preview__body {
  padding: 24px 14px;
  background-color: #0b141a;
  background-image:
    radial-gradient(rgba(255,255,255,0.02) 1px, transparent 1px),
    radial-gradient(rgba(255,255,255,0.02) 1px, transparent 1px);
  background-size: 18px 18px;
  background-position: 0 0, 9px 9px;
  min-height: 160px;
  display: flex; flex-direction: column; align-items: flex-start; gap: 6px;
}
.blast-preview__bubble {
  position: relative;
  max-width: 85%;
  background: #005c4b;
  color: #e9edef;
  padding: 8px 12px 8px 12px;
  border-radius: 8px;
  font-size: 14px;
  line-height: 1.5;
  white-space: pre-wrap; word-break: break-word;
  align-self: flex-end;
  box-shadow: 0 1px 0.5px rgba(0,0,0,0.13);
}
.blast-preview__bubble::after {
  content: '';
  position: absolute;
  right: -6px; top: 0;
  width: 0; height: 0;
  border-style: solid;
  border-width: 0 0 12px 8px;
  border-color: transparent transparent transparent #005c4b;
}
.blast-preview__time {
  font-size: 10px; color: #8696a0;
  align-self: flex-end;
  margin-right: 4px;
}
.blast-preview__var-miss {
  background: rgba(255,159,67,0.25);
  color: var(--color-warning);
  padding: 0 4px; border-radius: 3px;
  font-weight: 600;
}

/* Audience preview panel */
.audience-result { margin-top: 18px; }
.audience-result__loading { text-align: center; padding: 20px 0; }
.audience-result__error { padding: 14px; background: rgba(255,107,107,0.08); border-radius: var(--radius-md); }
.audience-result__empty {
  text-align: center;
  padding: 24px 16px;
  background: var(--color-bg-elevated);
  border-radius: var(--radius-md);
}
.audience-result__empty-icon { font-size: 32px; margin-bottom: 10px; opacity: 0.6; }

.audience-stats {
  text-align: center;
  padding: 18px 12px;
  background: linear-gradient(135deg, rgba(108,92,231,0.08), rgba(0,212,255,0.08));
  border: 1px solid rgba(108,92,231,0.18);
  border-radius: var(--radius-md);
  margin-bottom: 16px;
}
.audience-stats__num {
  font-size: 48px; font-weight: 900; letter-spacing: -0.03em;
  background: linear-gradient(135deg, var(--color-primary), var(--color-accent));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
  line-height: 1;
}
.audience-stats__label {
  font-size: 11px; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.08em; color: var(--color-text-muted);
  margin-top: 8px;
}
.audience-result__sample-title {
  font-size: 11px; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.08em; color: var(--color-text-muted);
  margin-bottom: 8px;
}
.audience-result__list {
  list-style: none; padding: 0; margin: 0;
  max-height: 280px; overflow-y: auto;
  background: var(--color-bg-elevated);
  border-radius: var(--radius-md);
}
.audience-result__list li {
  display: flex; justify-content: space-between; gap: 10px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--color-border);
  font-size: 13px;
}
.audience-result__list li:last-child { border-bottom: none; }
.audience-result__row-name { font-weight: 600; color: var(--color-text); }
.audience-result__row-phone { color: var(--color-text-muted); font-family: 'SF Mono', Menlo, monospace; font-size: 12px; }
.audience-result__more { padding: 8px 12px; font-size: 12px; }

/* Range slider styling */
input[type="range"] {
  width: 100%;
  -webkit-appearance: none; appearance: none;
  height: 6px;
  background: var(--color-bg-elevated);
  border-radius: var(--radius-full);
  outline: none;
}
input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none; appearance: none;
  width: 18px; height: 18px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--color-primary), var(--color-accent));
  cursor: pointer;
  box-shadow: 0 2px 10px rgba(108,92,231,0.4);
  transition: transform var(--transition-fast);
}
input[type="range"]::-webkit-slider-thumb:hover { transform: scale(1.15); }
input[type="range"]::-moz-range-thumb {
  width: 18px; height: 18px;
  border-radius: 50%; border: none;
  background: linear-gradient(135deg, var(--color-primary), var(--color-accent));
  cursor: pointer;
  box-shadow: 0 2px 10px rgba(108,92,231,0.4);
}

/* ---------- Blast cards (index) ---------- */
.blast-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
  gap: 20px;
}
.blast-card {
  display: block;
  background: var(--color-bg-card);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: 24px;
  transition: all var(--transition-normal);
  color: var(--color-text);
}
.blast-card:hover {
  border-color: var(--color-primary);
  transform: translateY(-2px);
  box-shadow: 0 8px 28px rgba(108,92,231,0.15);
}
.blast-card--sending { border-color: rgba(0,212,255,0.4); }
.blast-card__top {
  display: flex; justify-content: space-between; align-items: flex-start; gap: 12px;
  margin-bottom: 12px;
}
.blast-card__name { font-size: 17px; font-weight: 700; line-height: 1.3; }
.blast-card__msg-preview {
  font-size: 13px; color: var(--color-text-muted);
  line-height: 1.5; margin-bottom: 16px;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden;
}
.blast-card__stats {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  padding-top: 16px;
  margin-top: 12px;
  border-top: 1px solid var(--color-border);
}
.blast-card__stats > div { text-align: left; }
.blast-card__foot {
  margin-top: 14px;
  font-size: 11px; color: var(--color-text-muted);
  text-transform: uppercase; letter-spacing: 0.06em; font-weight: 600;
}

/* badge sending status */
.badge--sending { background: rgba(0,212,255,0.15); color: var(--color-accent); }
.badge--completed { background: rgba(0,184,148,0.15); color: var(--color-success); }
.badge--failed { background: rgba(255,107,107,0.15); color: var(--color-danger); }
.badge--processing { background: rgba(0,212,255,0.15); color: var(--color-accent); }
.badge--responded { background: rgba(255,159,67,0.15); color: var(--color-orange); }
.badge--sent { background: rgba(0,184,148,0.15); color: var(--color-success); }
.badge--skipped { background: rgba(110,110,138,0.15); color: var(--color-text-muted); }
.badge--lg { padding: 6px 14px; font-size: 13px; }

/* ---------- Delivery timeline ---------- */
.delivery-timeline {
  display: flex; flex-direction: column;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  overflow: hidden;
}
.delivery-row {
  display: grid;
  grid-template-columns: 80px 1fr auto auto;
  gap: 16px; align-items: center;
  padding: 12px 16px;
  border-bottom: 1px solid var(--color-border);
  transition: background var(--transition-fast);
}
.delivery-row:last-child { border-bottom: none; }
.delivery-row:hover { background: var(--color-bg-elevated); }
.delivery-row__time {
  font-family: 'SF Mono', Menlo, monospace;
  font-size: 12px; color: var(--color-text-muted);
}
.delivery-row__contact { min-width: 0; }
.delivery-row__name { font-size: 14px; font-weight: 600; }
.delivery-row__phone { font-size: 12px; font-family: 'SF Mono', Menlo, monospace; }
.delivery-row__status { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.delivery-row__actions { display: flex; align-items: center; gap: 6px; }
.delivery-row__msg { position: relative; }
.delivery-row__msg-body {
  position: absolute;
  right: 0; top: calc(100% + 6px);
  width: 320px; max-width: 80vw;
  background: var(--color-bg-elevated);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: 12px 14px;
  font-size: 13px; line-height: 1.5;
  z-index: 10;
  box-shadow: var(--shadow-lg);
  white-space: pre-wrap;
}
.delivery-row--failed { background: rgba(255,107,107,0.04); }
.delivery-row--responded { background: rgba(255,159,67,0.04); }
@media (max-width: 768px) {
  .delivery-row { grid-template-columns: 1fr; gap: 8px; }
}

/* ============================================================
   ATIVIDADE — follow-ups + decisions timeline + kanban turbinado
   ============================================================ */

/* --- Stats grid no topo --- */
.activity-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-bottom: 20px;
}
@media (max-width: 900px) {
  .activity-stats { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
  .activity-stats { grid-template-columns: 1fr; }
}

/* --- Scope tabs (Próximos / Hoje / Atrasados / etc) --- */
.scope-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 16px;
  padding: 6px;
  background: var(--color-bg-card);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-full);
  width: fit-content;
}
.scope-tab {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 8px 18px;
  border-radius: var(--radius-full);
  font-size: 13px;
  font-weight: 600;
  color: var(--color-text-muted);
  text-decoration: none;
  transition: all var(--transition-fast);
}
.scope-tab:hover { color: var(--color-text); background: rgba(108,92,231,0.08); }
.scope-tab--active {
  background: linear-gradient(135deg, var(--color-primary), var(--color-primary-light));
  color: #fff;
  box-shadow: 0 2px 12px rgba(108,92,231,0.3);
}

/* --- Lista de follow-ups --- */
.followup-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 4px 0;
}
.followup-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 16px;
  border-radius: var(--radius-md);
  border-left: 3px solid transparent;
  transition: background var(--transition-fast);
}
.followup-row:hover { background: var(--color-bg-elevated); }
.followup-row--overdue { border-left-color: var(--color-danger); background: rgba(255,107,107,0.04); }
.followup-row--today   { border-left-color: var(--color-warning); background: rgba(253,203,110,0.04); }
.followup-row--done    { opacity: 0.7; }

.followup-row__main { flex: 1; min-width: 0; }
.followup-row__head {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
  margin-bottom: 4px;
}
.followup-row__label { font-size: 14px; font-weight: 700; }
.followup-row__msg {
  font-size: 13px; color: var(--color-text-secondary);
  margin: 4px 0 6px;
  line-height: 1.4;
}
.followup-row__meta {
  font-size: 12px; color: var(--color-text-muted);
  display: flex; gap: 6px; flex-wrap: wrap; align-items: center;
}
.followup-row__meta-link { color: var(--color-text-secondary); }
.followup-row__meta-link:hover { color: var(--color-primary-light); text-decoration: underline; }
.followup-row__meta-mute { color: var(--color-text-muted); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.followup-row__sep { opacity: 0.5; }

.followup-row__side {
  display: flex; flex-direction: column; align-items: flex-end; gap: 8px;
  flex-shrink: 0;
}
.followup-row__when {
  font-size: 13px; font-weight: 600;
  color: var(--color-text-secondary);
}
.followup-row__when--overdue { color: var(--color-danger); }
.followup-row__when--today { color: var(--color-warning); }

.followup-row__actions {
  display: flex; gap: 6px; align-items: center;
}
.followup-row__actions form { margin: 0; }

/* --- Action chips (por tipo de ação) --- */
.action-chip {
  display: inline-flex; align-items: center;
  font-size: 11px; font-weight: 700;
  padding: 3px 9px;
  border-radius: var(--radius-full);
  letter-spacing: 0.02em;
  background: rgba(110,110,138,0.15);
  color: var(--color-text-muted);
}
.action-chip--send_message      { background: rgba(0,212,255,0.12); color: var(--color-accent); }
.action-chip--send_template     { background: rgba(0,212,255,0.10); color: var(--color-accent); }
.action-chip--escalate_human    { background: rgba(253,203,110,0.15); color: var(--color-warning); }
.action-chip--tag_contact       { background: rgba(108,92,231,0.15); color: var(--color-primary-light); }
.action-chip--untag_contact     { background: rgba(110,110,138,0.18); color: var(--color-text-muted); }
.action-chip--move_stage        { background: rgba(108,92,231,0.18); color: var(--color-primary-light); }
.action-chip--close_conversation{ background: rgba(255,107,107,0.12); color: var(--color-danger); }
.action-chip--custom_webhook    { background: rgba(0,255,136,0.12); color: var(--color-green); }

/* --- Detail page de um follow-up --- */
.followup-detail {
  display: flex; flex-direction: column;
  padding: 8px 0;
}
.followup-detail__row {
  display: grid;
  grid-template-columns: 160px 1fr;
  gap: 16px;
  padding: 12px 4px;
  border-bottom: 1px solid var(--color-border);
  align-items: start;
}
.followup-detail__row:last-child { border-bottom: none; }
.followup-detail__label {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--color-text-muted);
}
.followup-detail__value { font-size: 14px; color: var(--color-text); word-break: break-word; }
@media (max-width: 600px) {
  .followup-detail__row { grid-template-columns: 1fr; gap: 6px; }
}

/* --- Decision timeline --- */
.decision-timeline {
  display: flex; flex-direction: column;
  gap: 4px;
  padding: 8px 0;
  max-height: 640px;
  overflow-y: auto;
}
.decision-timeline__item {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-bg);
  transition: all var(--transition-fast);
}
.decision-timeline__item:hover { border-color: var(--color-border-light); }
.decision-timeline__item--open { border-color: var(--color-primary); }

.decision-timeline__head {
  display: grid;
  grid-template-columns: 110px 1fr auto;
  gap: 14px;
  align-items: center;
  padding: 12px 14px;
  cursor: pointer;
  user-select: none;
}
.decision-timeline__time {
  font-size: 12px;
  color: var(--color-text-muted);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
}
.decision-timeline__main {
  display: flex; flex-wrap: wrap; gap: 6px; align-items: center;
}
.decision-timeline__contact { font-size: 14px; font-weight: 600; }

.decision-timeline__conf {
  display: flex; flex-direction: column; align-items: flex-end; gap: 3px;
}
.decision-timeline__conf-label {
  font-size: 11px; color: var(--color-text-muted); font-weight: 700;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
}

.decision-timeline__body {
  padding: 12px 14px 14px;
  border-top: 1px solid var(--color-border);
  display: flex; flex-direction: column; gap: 12px;
}
.decision-timeline__field { display: flex; flex-direction: column; gap: 4px; }
.decision-timeline__field-label {
  font-size: 11px; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.06em; color: var(--color-text-muted);
}
.decision-timeline__reply {
  font-size: 13px; color: var(--color-text-secondary);
  line-height: 1.5;
  background: var(--color-bg-card);
  padding: 10px 12px;
  border-radius: var(--radius-sm);
  border-left: 3px solid var(--color-accent);
}
.decision-timeline__facts,
.decision-timeline__errors {
  display: flex; flex-wrap: wrap; gap: 6px;
}
.decision-timeline__footer {
  display: flex; justify-content: space-between; align-items: center;
  font-size: 12px; gap: 12px; flex-wrap: wrap;
  padding-top: 6px;
  border-top: 1px dashed var(--color-border);
}

/* Confidence bar mini (50px wide bar) */
.confidence-bar-mini {
  display: inline-block;
  width: 60px; height: 6px;
  background: var(--color-bg-elevated);
  border-radius: var(--radius-full);
  overflow: hidden;
}
.confidence-bar-mini__fill {
  display: block; height: 100%;
  background: linear-gradient(90deg, var(--color-primary), var(--color-accent));
  transition: width 300ms ease;
}

/* --- Sentiment / urgency pills --- */
.sentiment-pill {
  display: inline-flex; align-items: center;
  font-size: 11px; font-weight: 700;
  padding: 2px 8px;
  border-radius: var(--radius-full);
  text-transform: lowercase;
}
.sentiment-pill--positivo  { background: rgba(0,255,136,0.14); color: var(--color-green); }
.sentiment-pill--animado   { background: rgba(0,212,255,0.14); color: var(--color-accent); }
.sentiment-pill--neutro    { background: rgba(110,110,138,0.18); color: var(--color-text-muted); }
.sentiment-pill--negativo  { background: rgba(255,107,107,0.14); color: var(--color-danger); }
.sentiment-pill--frustrado { background: rgba(255,159,67,0.16); color: var(--color-orange, #ff9f43); }

.urgency-chip--alta   { background: rgba(255,107,107,0.14); color: var(--color-danger); }
.urgency-chip--media  { background: rgba(253,203,110,0.16); color: var(--color-warning); }
.urgency-chip--baixa  { background: rgba(110,110,138,0.14); color: var(--color-text-muted); }

/* ============================================================
   KANBAN TURBINADO — sentiment borders, urgency pulse, badges
   ============================================================ */

/* Container que segura os filtros + o kanban */
.kanban-filters {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.kanban-filters > .kanban { margin-top: 0; }

/* Chips de filtro client-side */
.filter-chip {
  display: inline-flex; align-items: center;
  padding: 6px 14px;
  background: var(--color-bg-card);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-full);
  font-size: 12px;
  font-weight: 600;
  color: var(--color-text-secondary);
  cursor: pointer;
  transition: all var(--transition-fast);
}
.filter-chip:hover { border-color: var(--color-primary); color: var(--color-text); }
.filter-chip--active {
  background: linear-gradient(135deg, var(--color-primary), var(--color-primary-light));
  border-color: var(--color-primary);
  color: #fff;
  box-shadow: 0 2px 8px rgba(108,92,231,0.25);
}
/* Linha de chips antes do kanban */
.kanban-filters > .filter-chip,
.kanban-filters > button.filter-chip {
  /* nada por enquanto, usa padrão */
}

/* Borders coloridas por sentiment */
.kanban__card--sentiment-positivo  { border-left: 3px solid var(--color-green); }
.kanban__card--sentiment-animado   { border-left: 3px solid var(--color-accent); }
.kanban__card--sentiment-negativo  {
  border-left: 3px solid var(--color-danger);
  animation: kanban-card-negative-pulse 2.4s ease-in-out infinite;
}
.kanban__card--sentiment-frustrado { border-left: 3px solid #ff9f43; }

@keyframes kanban-card-negative-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(255,107,107,0); }
  50%      { box-shadow: 0 0 0 3px rgba(255,107,107,0.12); }
}

/* Pulse sutil pra alta urgência */
.kanban__card--urgency-alta {
  animation: kanban-card-urgency-pulse 2s ease-in-out infinite;
}
@keyframes kanban-card-urgency-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(255,159,67,0); }
  50%      { box-shadow: 0 0 0 2px rgba(255,159,67,0.18); }
}

/* Chips internos do card */
.kanban__card-chips {
  display: flex; flex-wrap: wrap; gap: 4px;
  margin-top: 8px;
}
.kanban__card-followup-badge {
  display: inline-flex; align-items: center; gap: 3px;
  font-size: 10px; font-weight: 700;
  padding: 2px 7px;
  border-radius: var(--radius-full);
  background: rgba(108,92,231,0.15);
  color: var(--color-primary-light);
}
.kanban__card-followup-badge--today   { background: rgba(253,203,110,0.18); color: var(--color-warning); }
.kanban__card-followup-badge--overdue { background: rgba(255,107,107,0.18); color: var(--color-danger); }

.kanban__card-objection-chip {
  display: inline-flex; align-items: center; gap: 3px;
  font-size: 10px; font-weight: 700;
  padding: 2px 7px;
  border-radius: var(--radius-full);
  background: rgba(253,203,110,0.12);
  color: var(--color-warning);
}

.kanban__card-score {
  display: inline-flex; align-items: center; justify-content: center;
  margin-left: 6px;
  font-size: 10px; font-weight: 800;
  padding: 1px 7px;
  border-radius: var(--radius-full);
  background: rgba(108,92,231,0.18);
  color: var(--color-primary-light);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
}


/* ========================================
   DECISION CARD (no chat) + FOLLOW-UPS
   ======================================== */

/* Decision card (analogo ao tool-call, em roxo) */
.decision-card {
  align-self: stretch;
  margin: 4px 0 8px;
  border: 1px solid var(--color-border);
  border-left: 3px solid var(--color-primary);
  border-radius: var(--radius-sm);
  background: rgba(108,92,231,0.05);
  font-size: 12px;
  overflow: hidden;
}
.decision-card__head {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  width: 100%;
  padding: 8px 12px;
  background: transparent;
  border: none;
  color: var(--color-text);
  text-align: left;
  cursor: pointer;
  transition: background var(--transition-fast);
  font-family: var(--font-body);
}
.decision-card__head:hover { background: rgba(108,92,231,0.1); }
.decision-card__icon { font-size: 14px; }
.decision-card__time { margin-left: auto; color: var(--color-text-muted); font-size: 11px; }
.decision-card__caret {
  margin-left: 6px;
  color: var(--color-text-muted);
  transition: transform var(--transition-fast);
  font-size: 12px;
}
.decision-card--open .decision-card__caret { transform: rotate(180deg); }
.decision-card__body {
  padding: 12px 14px 14px;
  border-top: 1px solid rgba(108,92,231,0.18);
  animation: dcFadeIn 180ms ease;
}
@keyframes dcFadeIn { from { opacity: 0; transform: translateY(-2px); } to { opacity: 1; transform: translateY(0); } }
.decision-card__section + .decision-card__section { margin-top: 12px; }
.decision-card__section-title {
  font-size: 10px; font-weight: 800; letter-spacing: 0.08em;
  text-transform: uppercase; color: var(--color-text-muted);
  margin-bottom: 6px;
}
.decision-card__meta { font-weight: 400; text-transform: none; letter-spacing: 0; color: var(--color-text-muted); }
.decision-card__row { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 12px; }
.decision-card__pair { min-width: 120px; }
.decision-card__pair-label {
  font-size: 10px; font-weight: 800; letter-spacing: 0.08em;
  text-transform: uppercase; color: var(--color-text-muted);
  margin-bottom: 2px;
}
.decision-card__pair-value { font-size: 13px; color: var(--color-text); }
.decision-card__notes {
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  padding: 8px 10px;
  font-size: 12px;
  color: var(--color-text-secondary);
  line-height: 1.5;
}
.decision-card__flag {
  font-size: 10px; font-weight: 800; letter-spacing: 0.04em;
  padding: 2px 7px; border-radius: var(--radius-full);
}
.decision-card__flag--warn   { background: rgba(253,203,110,0.18); color: var(--color-warning); }
.decision-card__flag--danger { background: rgba(255,107,107,0.18); color: var(--color-danger); }
.decision-card__tags { display: flex; flex-wrap: wrap; gap: 6px; }
.dc-tag {
  font-size: 11px; font-weight: 600;
  padding: 2px 8px; border-radius: var(--radius-full);
}
.dc-tag--add    { background: rgba(0,255,136,0.12); color: var(--color-green); }
.dc-tag--remove { background: rgba(255,107,107,0.14); color: var(--color-danger); }

/* Sentiment pill */
.sentiment-pill {
  font-size: 10px; font-weight: 800; letter-spacing: 0.04em;
  padding: 2px 8px; border-radius: var(--radius-full);
  text-transform: capitalize;
}
.sentiment-pill--positivo  { background: rgba(0,255,136,0.15);  color: var(--color-green); }
.sentiment-pill--neutro    { background: rgba(110,110,138,0.25); color: var(--color-text-secondary); }
.sentiment-pill--negativo  { background: rgba(255,107,107,0.15); color: var(--color-danger); }
.sentiment-pill--frustrado { background: rgba(255,159,67,0.18);  color: var(--color-orange); }
.sentiment-pill--animado   { background: rgba(0,212,255,0.15);   color: var(--color-accent); }

/* Urgency pill */
.urgency-pill {
  font-size: 10px; font-weight: 800; letter-spacing: 0.04em;
  padding: 2px 8px; border-radius: var(--radius-full);
  text-transform: lowercase;
}
.urgency-pill--alta {
  background: rgba(255,107,107,0.18); color: var(--color-danger);
  animation: urgencyPulse 1.6s ease-in-out infinite;
}
.urgency-pill--media { background: rgba(253,203,110,0.18); color: var(--color-warning); }
.urgency-pill--baixa { background: rgba(110,110,138,0.2);  color: var(--color-text-muted); }
@keyframes urgencyPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(255,107,107,0.4); }
  50%      { box-shadow: 0 0 0 4px rgba(255,107,107,0); }
}

/* Objection */
.objection-pill {
  font-size: 10px; font-weight: 800;
  padding: 2px 8px; border-radius: var(--radius-full);
  background: rgba(255,159,67,0.16); color: var(--color-orange);
}

/* Intent tag */
.intent-tag {
  font-size: 11px; font-weight: 600;
  padding: 2px 8px; border-radius: var(--radius-full);
  background: rgba(0,212,255,0.12); color: var(--color-accent);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
}

/* Confidence bar */
.confidence-row { display: flex; align-items: center; gap: 10px; }
.confidence-bar {
  flex: 1; height: 8px;
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-full);
  overflow: hidden;
}
.confidence-bar__fill {
  height: 100%;
  border-radius: var(--radius-full);
  transition: width 250ms ease;
}
.confidence-bar--high { background: linear-gradient(90deg, var(--color-success), var(--color-green)); }
.confidence-bar--mid  { background: linear-gradient(90deg, var(--color-warning), var(--color-orange)); }
.confidence-bar--low  { background: linear-gradient(90deg, var(--color-danger), #ff8c8c); }
.confidence-bar__value {
  font-size: 12px; font-weight: 700;
  color: var(--color-text); min-width: 38px; text-align: right;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
}

/* Fact grid */
.fact-grid {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px;
}
.fact-grid__cell {
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  padding: 6px 10px;
}
.fact-grid__label {
  font-size: 10px; font-weight: 800; letter-spacing: 0.06em;
  text-transform: uppercase; color: var(--color-text-muted);
  margin-bottom: 2px;
}
.fact-grid__value {
  font-size: 12px;
  color: var(--color-text);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  word-break: break-word;
}

/* Score delta */
.score-delta { font-weight: 800; font-size: 14px; }
.score-delta--up   { color: var(--color-green); }
.score-delta--down { color: var(--color-danger); }

/* Follow-up list dentro do decision card */
.followup-list { list-style: none; display: flex; flex-direction: column; gap: 6px; padding: 0; }
.followup-mini {
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-left: 2px solid var(--color-primary-light);
  border-radius: var(--radius-sm);
  padding: 8px 10px;
}
.followup-mini__header {
  display: flex; justify-content: space-between; align-items: center; gap: 8px;
}
.followup-mini__label { font-size: 12px; color: var(--color-text); }
.followup-mini__action {
  font-size: 10px; font-weight: 700; letter-spacing: 0.04em;
  padding: 1px 6px; border-radius: var(--radius-full);
  background: rgba(108,92,231,0.18); color: var(--color-primary-light);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
}
.followup-mini__when {
  font-size: 11px; color: var(--color-text-muted); margin-top: 3px;
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.followup-mini__when code {
  background: rgba(0,212,255,0.08); color: var(--color-accent);
  padding: 1px 5px; border-radius: 3px;
}
.followup-mini__skip {
  font-size: 10px; color: var(--color-warning);
  background: rgba(253,203,110,0.1); padding: 1px 6px; border-radius: var(--radius-full);
}
.followup-mini__msg {
  font-size: 12px; color: var(--color-text-secondary);
  margin-top: 4px; font-style: italic;
}

/* Next action banner */
.next-action-banner {
  display: flex; gap: 12px; align-items: flex-start;
  background: linear-gradient(135deg, var(--color-primary), var(--color-primary-light));
  color: #fff;
  padding: 10px 14px;
  border-radius: var(--radius-sm);
  margin-top: 12px;
  box-shadow: 0 2px 12px rgba(108,92,231,0.25);
}
.next-action-banner__icon { font-size: 18px; flex-shrink: 0; }
.next-action-banner__label {
  font-size: 10px; font-weight: 800; letter-spacing: 0.08em;
  text-transform: uppercase; opacity: 0.85;
}
.next-action-banner__text { font-size: 13px; font-weight: 500; line-height: 1.4; }

/* Escalation / Close warnings */
.escalation-warning,
.close-warning {
  display: flex; gap: 10px; align-items: flex-start;
  padding: 10px 12px;
  border-radius: var(--radius-sm);
  margin-top: 12px;
  font-size: 12px;
}
.escalation-warning {
  background: rgba(253,203,110,0.08);
  border: 1px solid rgba(253,203,110,0.3);
  color: var(--color-warning);
}
.escalation-warning__pri {
  font-size: 10px; font-weight: 700; margin-left: 8px;
  text-transform: uppercase; letter-spacing: 0.04em;
  opacity: 0.8;
}
.escalation-warning__reason {
  font-size: 12px; color: var(--color-text-secondary);
  margin-top: 4px;
}
.close-warning {
  background: rgba(255,107,107,0.08);
  border: 1px solid rgba(255,107,107,0.3);
  color: var(--color-danger);
  align-items: center;
}

/* Raw JSON */
.json-raw {
  margin-top: 14px;
  font-size: 11px;
}
.json-raw > summary {
  cursor: pointer;
  color: var(--color-text-muted);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-size: 10px;
  padding: 4px 0;
}
.json-raw > summary:hover { color: var(--color-primary-light); }
.json-raw__pre {
  margin-top: 6px;
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  padding: 10px 12px;
  white-space: pre-wrap;
  word-break: break-word;
  color: var(--color-text-secondary);
  max-height: 300px;
  overflow-y: auto;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 11px;
  line-height: 1.5;
}

/* ========================================
   FOLLOW-UPS SIDEBAR CARD
   ======================================== */
.followup-stack {
  display: flex; flex-direction: column; gap: 8px;
  margin-bottom: 10px;
}
.followup-card {
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-left: 3px solid var(--color-primary-light);
  border-radius: var(--radius-sm);
  padding: 8px 10px;
  transition: border-color var(--transition-fast), background var(--transition-fast);
}
.followup-card:hover { background: var(--color-bg-elevated); }
.followup-card--overdue {
  border-left-color: var(--color-danger);
  background: rgba(255,107,107,0.04);
}
.followup-card__top {
  display: flex; justify-content: space-between; align-items: center; gap: 6px;
}
.followup-card__label {
  font-size: 12px; font-weight: 700; color: var(--color-text);
  flex: 1; min-width: 0;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.followup-card__badge {
  font-size: 9px; font-weight: 800;
  padding: 1px 6px; border-radius: var(--radius-full);
  background: rgba(0,212,255,0.12); color: var(--color-accent);
  white-space: nowrap;
}
.followup-card__when {
  font-size: 11px; color: var(--color-text-muted);
  margin-top: 3px;
  display: flex; flex-wrap: wrap; gap: 6px; align-items: center;
}
.followup-card__skip {
  font-size: 9px; color: var(--color-warning);
  background: rgba(253,203,110,0.1);
  padding: 1px 5px; border-radius: var(--radius-full);
}
.followup-card__msg {
  font-size: 11px; color: var(--color-text-secondary);
  margin-top: 4px; font-style: italic;
  word-break: break-word;
}
.followup-actions {
  display: flex; gap: 4px; margin-top: 6px;
}
.followup-actions form { margin: 0; }
.followup-actions__btn {
  padding: 3px 10px !important;
  font-size: 11px !important;
}
.followup-actions__btn--danger { color: var(--color-danger); }
.followup-actions__btn--danger:hover { border-color: var(--color-danger); }
.followup-new-btn {
  width: 100%;
  border-style: dashed;
  margin-top: 4px;
}

/* ========================================
   FU-MODAL (criação manual de follow-up)
   ======================================== */
.fu-modal { position: fixed; inset: 0; z-index: 9999; }
.fu-modal__backdrop {
  position: absolute; inset: 0;
  background: rgba(0,0,0,0.6);
  backdrop-filter: blur(2px);
}
.fu-modal__panel {
  position: relative;
  margin: 8vh auto;
  max-width: 540px; width: calc(100vw - 40px);
  max-height: 84vh;
  background: var(--color-bg-card);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  display: flex; flex-direction: column;
  box-shadow: var(--shadow-lg);
  overflow: hidden;
}
.fu-modal__header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 18px;
  border-bottom: 1px solid var(--color-border);
}
.fu-modal__header h3 { font-size: 16px; font-weight: 700; }
.fu-modal__close {
  background: transparent; border: none;
  color: var(--color-text); font-size: 24px; line-height: 1; cursor: pointer;
  padding: 0 8px;
}

/* fu-form */
.fu-form { padding: 14px 18px 18px; overflow-y: auto; }
.fu-form__field { margin-bottom: 14px; }
.fu-form__field label {
  display: block;
  font-size: 11px; font-weight: 800;
  letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--color-text-muted);
  margin-bottom: 6px;
}
.fu-form__field input[type="text"],
.fu-form__field input[type="number"],
.fu-form__field input[type="datetime-local"],
.fu-form__field select,
.fu-form__field textarea {
  width: 100%;
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  padding: 8px 10px;
  font-size: 13px;
  color: var(--color-text);
  outline: none;
  transition: border-color var(--transition-fast);
  font-family: var(--font-body);
}
.fu-form__field input:focus,
.fu-form__field select:focus,
.fu-form__field textarea:focus { border-color: var(--color-primary); }
.fu-form__field textarea { resize: vertical; min-height: 60px; }
.fu-form__field--check label {
  display: flex; align-items: center; gap: 8px;
  text-transform: none; letter-spacing: 0;
  font-size: 13px; font-weight: 500; color: var(--color-text);
}
.fu-form__field--check input[type="checkbox"] {
  width: 16px; height: 16px;
  accent-color: var(--color-primary);
}
.fu-form__kind-radios {
  display: flex; gap: 6px; margin-bottom: 8px; flex-wrap: wrap;
}
.fu-form__radio {
  flex: 1; min-width: 110px;
  display: flex; align-items: center; gap: 6px;
  padding: 6px 10px;
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  font-size: 12px;
  cursor: pointer;
  transition: all var(--transition-fast);
}
.fu-form__radio:has(input:checked) {
  border-color: var(--color-primary);
  background: rgba(108,92,231,0.1);
}
.fu-form__radio input[type="radio"] { accent-color: var(--color-primary); }
.fu-form__sched {
  display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
  padding: 10px;
  background: rgba(108,92,231,0.04);
  border: 1px dashed var(--color-border);
  border-radius: var(--radius-sm);
}
.fu-form__sched .fu-form__num { width: 80px; }
.fu-form__sched select { width: auto; flex: 0 0 auto; }
.fu-form__hint {
  font-size: 11px; color: var(--color-text-muted); width: 100%;
}
.fu-form__hint code {
  background: var(--color-bg);
  color: var(--color-accent);
  padding: 1px 5px; border-radius: 3px;
  font-size: 11px;
}
.fu-form__actions {
  display: flex; justify-content: flex-end; gap: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--color-border);
}

@media (max-width: 768px) {
  .fact-grid { grid-template-columns: 1fr; }
  .fu-modal__panel { margin: 4vh auto; max-height: 92vh; }
  .fu-form__radio { min-width: 0; flex: 1 1 100%; }
}

/* ============================================================
   Agent show — aba Conversas (totalmente reformulada)
   Layout: head (stats + filtros) + split (lista + chat frame).
   ============================================================ */

.agt-conv {
  display: flex;
  flex-direction: column;
  height: calc(100vh - 240px);
  min-height: 560px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  overflow: hidden;
  background: var(--color-bg-card);
}

/* ----- HEAD ----- */
.agt-conv__head {
  flex-shrink: 0;
  border-bottom: 1px solid var(--color-border);
  background: linear-gradient(180deg, rgba(108,92,231,0.06), transparent);
  padding: 14px 16px 12px;
}

.agt-conv__stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
  gap: 8px;
  margin-bottom: 12px;
}
.agt-conv__stat {
  display: flex; flex-direction: column; align-items: flex-start;
  padding: 8px 12px;
  background: var(--color-bg-elevated);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  position: relative;
}
.agt-conv__stat-value {
  font-size: 20px; font-weight: 800; line-height: 1; color: var(--color-text);
}
.agt-conv__stat-label {
  font-size: 10px; font-weight: 700; letter-spacing: 0.06em;
  text-transform: uppercase; color: var(--color-text-muted);
  margin-top: 4px;
}
.agt-conv__stat--accent  .agt-conv__stat-value { color: var(--color-accent); }
.agt-conv__stat--success .agt-conv__stat-value { color: var(--color-green); }
.agt-conv__stat--warning .agt-conv__stat-value { color: var(--color-warning); }
.agt-conv__stat--muted   .agt-conv__stat-value { color: var(--color-text-muted); }
.agt-conv__stat--primary .agt-conv__stat-value {
  background: linear-gradient(135deg, var(--color-primary), var(--color-accent));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}

.agt-conv__tools {
  display: flex; flex-direction: column; gap: 8px;
}
.agt-conv__search {
  width: 100%;
  padding: 9px 14px;
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-full);
  color: var(--color-text);
  font-size: 13px;
  outline: none;
  transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}
.agt-conv__search::placeholder { color: var(--color-text-muted); }
.agt-conv__search:focus {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px rgba(108,92,231,0.18);
}
.agt-conv__filters {
  display: flex; flex-wrap: wrap; gap: 6px;
}
.agt-conv__chip {
  background: transparent;
  border: 1px solid var(--color-border-light);
  color: var(--color-text-secondary);
  font-size: 12px; font-weight: 600;
  padding: 5px 12px;
  border-radius: var(--radius-full);
  cursor: pointer;
  transition: all var(--transition-fast);
}
.agt-conv__chip:hover {
  background: var(--color-bg-hover);
  border-color: var(--color-border-light);
  color: var(--color-text);
}
.agt-conv__chip--active {
  background: linear-gradient(135deg, var(--color-primary), var(--color-primary-light));
  border-color: var(--color-primary);
  color: #fff;
}

/* ----- SPLIT ----- */
.agt-conv__split {
  display: flex;
  flex: 1;
  min-height: 0;
}

.agt-conv__list {
  width: 380px;
  flex-shrink: 0;
  border-right: 1px solid var(--color-border);
  overflow-y: auto;
  background: var(--color-bg);
}

.agt-conv__detail {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  background: var(--color-bg);
  display: flex;
  flex-direction: column;
}
.agt-conv__frame {
  display: block;
  height: 100%;
  overflow: hidden;
}
.agt-conv__frame .conv-detail {
  height: 100%;
}

/* ----- ROW (item da lista) ----- */
.agt-conv__row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--color-border);
  text-decoration: none;
  color: inherit;
  transition: background var(--transition-fast), border-color var(--transition-fast);
  position: relative;
}
.agt-conv__row::before {
  content: "";
  position: absolute; left: 0; top: 0; bottom: 0;
  width: 3px;
  background: transparent;
  transition: background var(--transition-fast);
}
.agt-conv__row:hover { background: var(--color-bg-elevated); }
.agt-conv__row.sv-item--active,
.agt-conv__row[aria-current="true"] {
  background: rgba(108,92,231,0.10);
}
.agt-conv__row.sv-item--active::before,
.agt-conv__row[aria-current="true"]::before {
  background: var(--color-primary);
}

/* Sentiment border (left bar) */
.agt-conv__row--sentiment-positivo::before { background: var(--color-green); }
.agt-conv__row--sentiment-animado::before  { background: var(--color-accent); }
.agt-conv__row--sentiment-negativo::before { background: var(--color-danger); }
.agt-conv__row--sentiment-frustrado::before { background: var(--color-orange); }

/* Urgency pulse (subtle) */
.agt-conv__row--urgency-alta {
  animation: agtConvUrgPulse 2.4s ease-in-out infinite;
}
@keyframes agtConvUrgPulse {
  0%, 100% { box-shadow: inset 3px 0 0 transparent; }
  50%      { box-shadow: inset 3px 0 0 rgba(255,107,107,0.5); }
}

.agt-conv__avatar {
  width: 38px; height: 38px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--color-primary), var(--color-accent));
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-weight: 800; font-size: 14px;
  flex-shrink: 0;
}

.agt-conv__row-body {
  flex: 1; min-width: 0;
  display: flex; flex-direction: column; gap: 4px;
}
.agt-conv__row-head {
  display: flex; justify-content: space-between; align-items: center; gap: 8px;
}
.agt-conv__name {
  font-size: 14px; color: var(--color-text);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.agt-conv__time {
  font-size: 11px; color: var(--color-text-muted); white-space: nowrap;
}
.agt-conv__preview {
  font-size: 12px; color: var(--color-text-muted);
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.agt-conv__preview-from {
  font-weight: 700; color: var(--color-primary-light);
  margin-right: 4px;
}
.agt-conv__preview-from--in { color: var(--color-text-secondary); }

.agt-conv__chips {
  display: flex; flex-wrap: wrap; gap: 4px;
  margin-top: 2px;
}
.agt-conv__pill {
  font-size: 10px; font-weight: 700; letter-spacing: 0.02em;
  padding: 2px 8px;
  border-radius: var(--radius-full);
  background: var(--color-bg-elevated);
  color: var(--color-text-secondary);
  border: 1px solid var(--color-border);
  white-space: nowrap;
}
.agt-conv__pill--accent  { background: rgba(0,212,255,0.12); color: var(--color-accent); border-color: rgba(0,212,255,0.25); }
.agt-conv__pill--warning { background: rgba(253,203,110,0.15); color: var(--color-warning); border-color: rgba(253,203,110,0.3); }
.agt-conv__pill--muted   { background: rgba(110,110,138,0.15); color: var(--color-text-muted); }
.agt-conv__pill--sentiment-positivo  { background: rgba(0,255,136,0.12); color: var(--color-green); border-color: rgba(0,255,136,0.3); }
.agt-conv__pill--sentiment-animado   { background: rgba(0,212,255,0.12); color: var(--color-accent); border-color: rgba(0,212,255,0.3); }
.agt-conv__pill--sentiment-neutro    { background: rgba(110,110,138,0.15); color: var(--color-text-muted); }
.agt-conv__pill--sentiment-negativo  { background: rgba(255,107,107,0.12); color: var(--color-danger); border-color: rgba(255,107,107,0.3); }
.agt-conv__pill--sentiment-frustrado { background: rgba(255,159,67,0.15);  color: var(--color-orange); border-color: rgba(255,159,67,0.3); }
.agt-conv__pill--urgency   { background: rgba(255,107,107,0.15); color: var(--color-danger); border-color: rgba(255,107,107,0.35); }
.agt-conv__pill--intent    { background: rgba(108,92,231,0.15); color: var(--color-primary-light); border-color: rgba(108,92,231,0.3); }
.agt-conv__pill--objection { background: rgba(255,159,67,0.15); color: var(--color-orange); border-color: rgba(255,159,67,0.3); }

.agt-conv__followup {
  display: inline-flex; align-items: center; gap: 6px;
  margin-top: 4px;
  padding: 3px 9px;
  font-size: 11px; font-weight: 600;
  background: rgba(108,92,231,0.10);
  color: var(--color-primary-light);
  border: 1px dashed rgba(108,92,231,0.35);
  border-radius: var(--radius-full);
  width: fit-content;
}
.agt-conv__followup-icon { font-size: 10px; }
.agt-conv__followup-when { font-weight: 700; }
.agt-conv__followup-label { color: var(--color-text-muted); font-weight: 400; }
.agt-conv__followup--today { background: rgba(253,203,110,0.12); color: var(--color-warning); border-color: rgba(253,203,110,0.4); }
.agt-conv__followup--overdue { background: rgba(255,107,107,0.12); color: var(--color-danger); border-color: rgba(255,107,107,0.4); }

.agt-conv__row-meta {
  display: flex; flex-direction: column; gap: 4px;
  align-items: flex-end;
  font-size: 10px; color: var(--color-text-muted);
  flex-shrink: 0;
  padding-top: 2px;
}

.agt-conv__empty-filtered {
  padding: 40px 20px;
  text-align: center;
  color: var(--color-text-muted);
  font-size: 13px;
}

/* ----- PLACEHOLDER (right side) ----- */
.agt-conv__placeholder {
  height: 100%;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  text-align: center;
  padding: 40px 32px;
  color: var(--color-text-muted);
}
.agt-conv__placeholder-icon {
  font-size: 56px;
  opacity: 0.6;
  margin-bottom: 12px;
}
.agt-conv__placeholder h3 {
  color: var(--color-text);
  font-size: 18px; font-weight: 700;
  margin-bottom: 8px;
}
.agt-conv__placeholder p {
  font-size: 13px; line-height: 1.6;
  max-width: 360px;
  margin-bottom: 18px;
}
.agt-conv__hint-list {
  list-style: none; padding: 0;
  display: flex; flex-direction: column; gap: 6px;
  font-size: 12px; color: var(--color-text-secondary);
  text-align: left;
  background: var(--color-bg-card);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  padding: 12px 16px;
  max-width: 380px;
}

/* ----- responsive ----- */
@media (max-width: 768px) {
  .agt-conv { height: auto; min-height: 0; }
  .agt-conv__split { flex-direction: column; }
  .agt-conv__list {
    width: 100%; max-height: 50vh;
    border-right: none; border-bottom: 1px solid var(--color-border);
  }
}

/* ============================================================
   GIANTS COPILOT — Drawer in-app (reformulado)
   Refs: Intercom Messenger, Linear, ChatGPT mobile, Notion AI
   Naming: prefix .cop-* (mais curto + isolado do legado)
   ============================================================ */

.cop-root { position: relative; z-index: 1100; }

/* ----- FAB (launcher flutuante) ----- */
.cop-fab {
  position: fixed; bottom: 24px; right: 24px;
  width: 56px; height: 56px; border-radius: 50%;
  background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-light) 50%, var(--color-accent) 100%);
  color: #fff; cursor: pointer; z-index: 1101;
  display: flex; align-items: center; justify-content: center;
  border: 1px solid rgba(255,255,255,0.12);
  box-shadow:
    0 8px 24px -4px rgba(108,92,231,0.55),
    0 4px 12px -2px rgba(0,212,255,0.25),
    inset 0 1px 0 rgba(255,255,255,0.18);
  transition: transform 220ms cubic-bezier(.34,1.56,.64,1), box-shadow 220ms ease;
  isolation: isolate;
}
.cop-fab:hover {
  transform: translateY(-2px) scale(1.04);
  box-shadow:
    0 12px 32px -4px rgba(108,92,231,0.7),
    0 6px 16px -2px rgba(0,212,255,0.35),
    inset 0 1px 0 rgba(255,255,255,0.22);
}
.cop-fab:active { transform: translateY(0) scale(0.96); transition-duration: 80ms; }
.cop-fab:focus-visible {
  outline: none;
  box-shadow:
    0 0 0 3px var(--color-bg),
    0 0 0 5px var(--color-primary-light),
    0 8px 24px -4px rgba(108,92,231,0.55);
}
.cop-fab__icon { display: block; position: relative; z-index: 1; }
.cop-fab__glow {
  position: absolute; inset: -8px; border-radius: 50%;
  background: radial-gradient(closest-side, rgba(108,92,231,0.45), transparent 70%);
  opacity: 0; transition: opacity 200ms ease;
  z-index: -1; pointer-events: none;
}
.cop-fab:hover .cop-fab__glow { opacity: 1; }

.cop-fab--pending::after {
  content: ""; position: absolute; inset: -4px; border-radius: 50%;
  border: 2px solid var(--color-primary-light);
  animation: copPulseRing 1.8s ease-out infinite;
  pointer-events: none;
}
@keyframes copPulseRing {
  0%   { transform: scale(0.95); opacity: 0.8; }
  100% { transform: scale(1.35); opacity: 0; }
}

.cop-fab__badge {
  position: absolute; top: -4px; right: -4px;
  min-width: 22px; height: 22px; padding: 0 6px;
  border-radius: 11px; background: var(--color-danger); color: #fff;
  font-size: 11px; font-weight: 800; line-height: 22px; text-align: center;
  border: 2px solid var(--color-bg);
  box-shadow: 0 2px 8px rgba(255,107,107,0.5);
}

/* ----- Backdrop + Drawer ----- */
.cop-backdrop {
  position: fixed; inset: 0;
  background: radial-gradient(circle at 100% 100%, rgba(108,92,231,0.18), rgba(5,5,15,0.55) 60%);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
  z-index: 1099; opacity: 0; pointer-events: none;
  transition: opacity 240ms ease;
}
.cop-locked .cop-backdrop:not([hidden]) { opacity: 1; pointer-events: auto; }

.cop-drawer {
  position: fixed; top: 0; right: 0; bottom: 0;
  width: 420px; max-width: 100vw;
  background: var(--color-bg);
  border-left: 1px solid var(--color-border);
  box-shadow: -24px 0 60px -12px rgba(0,0,0,0.5);
  z-index: 1102;
  transform: translateX(100%);
  transition: transform 320ms cubic-bezier(0.32, 0.72, 0, 1);
  display: flex; flex-direction: column;
  overflow: hidden;
}
.cop-drawer--open { transform: translateX(0); }
.cop-drawer turbo-frame { display: flex; flex: 1; min-height: 0; }

.cop-loading {
  flex: 1; display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  color: var(--color-text-muted); gap: 14px; font-size: 13px;
}

/* Mobile: drawer fullscreen + safe areas */
@media (max-width: 767px) {
  .cop-drawer {
    width: 100vw;
    border-left: none;
    box-shadow: none;
  }
  .cop-fab {
    bottom: calc(20px + env(safe-area-inset-bottom));
    right: 16px; width: 52px; height: 52px;
  }
}

/* ----- Panel ----- */
.cop-panel {
  flex: 1; display: flex; flex-direction: column; min-height: 0;
  background: var(--color-bg);
  position: relative;
}
.cop-panel::before {
  /* gradient accent stripe sutil no topo */
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 2px;
  background: linear-gradient(90deg, transparent, var(--color-primary) 30%, var(--color-accent) 70%, transparent);
  opacity: 0.6;
  pointer-events: none;
}

/* ----- Header ----- */
.cop-head {
  display: flex; align-items: center; gap: 12px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--color-border);
  background: linear-gradient(180deg, var(--color-bg-card), var(--color-bg));
  flex-shrink: 0;
  padding-top: max(14px, env(safe-area-inset-top));
}
.cop-head__back {
  display: none; /* mostrado só em mobile */
  width: 40px; height: 40px; border-radius: 10px;
  background: transparent; color: var(--color-text-secondary);
  align-items: center; justify-content: center;
  transition: background 140ms ease, color 140ms ease;
}
.cop-head__back:hover { background: var(--color-bg-hover); color: var(--color-text); }
.cop-head__back:focus-visible { outline: 2px solid var(--color-primary-light); outline-offset: 2px; }

.cop-head__brand {
  display: flex; align-items: center; gap: 11px;
  flex: 1; min-width: 0;
}
.cop-head__avatar {
  position: relative;
  width: 36px; height: 36px; border-radius: 50%;
  background: linear-gradient(135deg, var(--color-primary), var(--color-accent));
  display: flex; align-items: center; justify-content: center;
  color: #fff; flex-shrink: 0;
  box-shadow:
    0 4px 12px rgba(108,92,231,0.35),
    inset 0 1px 0 rgba(255,255,255,0.15);
}
.cop-head__pulse {
  position: absolute; bottom: -2px; right: -2px;
  width: 10px; height: 10px; border-radius: 50%;
  background: var(--color-success);
  border: 2px solid var(--color-bg);
  box-shadow: 0 0 6px var(--color-success);
}
.cop-head__pulse::after {
  content: ""; position: absolute; inset: 0; border-radius: 50%;
  border: 2px solid var(--color-success);
  animation: copPulseRing 2s ease-out infinite;
}
.cop-head__text { display: flex; flex-direction: column; min-width: 0; line-height: 1.2; }
.cop-head__title {
  font-size: 15px; font-weight: 700; letter-spacing: -0.01em;
  color: var(--color-text); margin: 0;
}
.cop-head__sub {
  font-size: 11.5px; color: var(--color-text-muted);
  margin: 2px 0 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

.cop-head__actions { display: flex; gap: 2px; flex-shrink: 0; }
.cop-icon-btn {
  width: 36px; height: 36px; border-radius: 10px;
  background: transparent; color: var(--color-text-secondary);
  display: inline-flex; align-items: center; justify-content: center;
  transition: background 140ms ease, color 140ms ease, transform 140ms ease;
}
.cop-icon-btn:hover {
  background: var(--color-bg-hover); color: var(--color-text);
}
.cop-icon-btn:focus-visible {
  outline: 2px solid var(--color-primary-light); outline-offset: 2px;
}
.cop-icon-btn:active { transform: scale(0.92); }

/* ----- Notices (alertas + insights compactos) ----- */
.cop-notices {
  display: flex; flex-direction: column;
  border-bottom: 1px solid var(--color-border);
  flex-shrink: 0;
}
.cop-notice {
  border-bottom: 1px solid var(--color-border);
  background: var(--color-bg-card);
}
.cop-notice:last-child { border-bottom: none; }

.cop-notice__head {
  list-style: none; cursor: pointer; user-select: none;
  display: flex; align-items: center; gap: 10px;
  padding: 10px 16px; font-size: 12.5px;
  color: var(--color-text-secondary);
  transition: background 140ms ease;
}
.cop-notice__head::-webkit-details-marker { display: none; }
.cop-notice__head:hover { background: var(--color-bg-hover); }

.cop-notice__dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--color-primary);
  flex-shrink: 0;
  box-shadow: 0 0 8px currentColor;
  color: var(--color-primary);
}
.cop-notice--warn     .cop-notice__dot { background: var(--color-warning); color: var(--color-warning); }
.cop-notice--critical .cop-notice__dot { background: var(--color-danger);  color: var(--color-danger); animation: copDotPulse 1.6s ease-in-out infinite; }
.cop-notice__dot--insight { background: var(--color-accent); color: var(--color-accent); }
@keyframes copDotPulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50%      { opacity: 0.6; transform: scale(1.3); }
}

.cop-notice__label { flex: 1; display: flex; align-items: baseline; gap: 6px; }
.cop-notice__label strong { color: var(--color-text); font-weight: 700; }
.cop-notice__label span { color: var(--color-text-secondary); }

.cop-notice__link {
  font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em;
  color: var(--color-primary-light); font-weight: 700;
  margin-right: 4px;
}
.cop-notice__link:hover { color: var(--color-accent); }

.cop-notice__caret { color: var(--color-text-muted); transition: transform 200ms ease; flex-shrink: 0; }
.cop-notice[open] .cop-notice__caret { transform: rotate(180deg); }

.cop-notice__body {
  padding: 4px 16px 12px;
  display: flex; flex-direction: column; gap: 8px;
  background: var(--color-bg);
}

.cop-obs {
  background: var(--color-bg-elevated); border-radius: var(--radius-md);
  padding: 10px 12px; border-left: 3px solid var(--color-primary);
}
.cop-obs--warn     { border-left-color: var(--color-warning); }
.cop-obs--critical { border-left-color: var(--color-danger); }
.cop-obs__top {
  display: flex; align-items: baseline; gap: 8px;
  font-size: 13px; line-height: 1.3;
}
.cop-obs__title { flex: 1; color: var(--color-text); font-weight: 600; }
.cop-obs__time { color: var(--color-text-muted); font-size: 11px; flex-shrink: 0; }
.cop-obs__body {
  font-size: 12px; color: var(--color-text-secondary);
  margin: 6px 0 0; line-height: 1.5;
}

.cop-mini-insight {
  background: var(--color-bg-elevated); border-radius: var(--radius-md);
  padding: 12px 14px; border: 1px solid var(--color-border);
}
.cop-mini-insight__head { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.cop-mini-insight__period { font-size: 11px; color: var(--color-text-muted); }
.cop-mini-insight__title { font-size: 14px; font-weight: 700; margin: 0 0 6px; line-height: 1.3; }
.cop-mini-insight__metric {
  font-size: 22px; font-weight: 800; letter-spacing: -0.02em;
  background: linear-gradient(135deg, var(--color-primary-light), var(--color-accent));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
  margin-bottom: 6px; line-height: 1.1;
}
.cop-mini-insight__body { font-size: 12px; color: var(--color-text-secondary); line-height: 1.5; }
.cop-mini-insight__body p { margin: 0 0 4px; }
.cop-mini-insight__body p:last-child { margin: 0; }

/* ----- Thread ----- */
.cop-thread {
  flex: 1; min-height: 0;
  overflow-y: auto; overscroll-behavior: contain;
  scroll-behavior: smooth;
  padding: 16px 16px 8px;
  display: flex; flex-direction: column; gap: 10px;
}
.cop-thread::-webkit-scrollbar { width: 6px; }
.cop-thread::-webkit-scrollbar-track { background: transparent; }
.cop-thread::-webkit-scrollbar-thumb {
  background: var(--color-border); border-radius: 3px;
}
.cop-thread::-webkit-scrollbar-thumb:hover { background: var(--color-border-light); }

/* ----- Empty state ----- */
.cop-empty {
  display: flex; flex-direction: column; align-items: center;
  text-align: center; padding: 28px 12px 12px; gap: 12px;
  animation: copFadeUp 360ms cubic-bezier(.32,.72,0,1);
}
.cop-empty__halo {
  position: relative;
  width: 72px; height: 72px; border-radius: 50%;
  background:
    radial-gradient(circle at 30% 30%, rgba(108,92,231,0.5), transparent 60%),
    linear-gradient(135deg, var(--color-primary), var(--color-accent));
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  box-shadow:
    0 12px 32px -8px rgba(108,92,231,0.6),
    inset 0 1px 0 rgba(255,255,255,0.2);
}
.cop-empty__halo::before {
  content: ""; position: absolute; inset: -10px; border-radius: 50%;
  background: radial-gradient(circle, rgba(108,92,231,0.18), transparent 65%);
  z-index: -1;
}
.cop-empty__title {
  font-size: 19px; font-weight: 700;
  letter-spacing: -0.015em; margin: 4px 0 0;
  background: linear-gradient(180deg, var(--color-text), var(--color-text-secondary));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.cop-empty__text {
  font-size: 13px; color: var(--color-text-secondary);
  line-height: 1.55; max-width: 320px; margin: 0;
}
.cop-empty__cards {
  width: 100%; display: flex; flex-direction: column; gap: 6px;
  margin-top: 12px;
}
.cop-suggest {
  display: flex; align-items: center; gap: 10px;
  width: 100%; min-height: 44px;
  padding: 10px 12px;
  background: var(--color-bg-card);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  color: var(--color-text); text-align: left;
  font-size: 13.5px; font-weight: 500;
  cursor: pointer;
  transition: border-color 160ms ease, background 160ms ease, transform 120ms ease;
}
.cop-suggest:hover {
  border-color: var(--color-primary-light);
  background: var(--color-bg-elevated);
}
.cop-suggest:active { transform: scale(0.99); }
.cop-suggest:focus-visible {
  outline: 2px solid var(--color-primary-light); outline-offset: 2px;
}
.cop-suggest__emoji { font-size: 16px; flex-shrink: 0; }
.cop-suggest__label { flex: 1; }
.cop-suggest__arrow {
  color: var(--color-text-muted); flex-shrink: 0;
  transition: transform 160ms ease, color 160ms ease;
}
.cop-suggest:hover .cop-suggest__arrow {
  transform: translateX(3px); color: var(--color-primary-light);
}

/* ----- Mensagens ----- */
.cop-msg {
  display: flex; flex-direction: column;
  max-width: 86%;
  animation: copFadeUp 220ms cubic-bezier(.32,.72,0,1);
}
@keyframes copFadeUp {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

.cop-msg--user { align-self: flex-end; align-items: flex-end; }
.cop-msg--bot  {
  align-self: flex-start; align-items: flex-start;
  flex-direction: row; gap: 8px; max-width: 92%;
}
.cop-msg--bot .cop-msg__group { flex: 1; min-width: 0; }

.cop-msg__avatar {
  width: 26px; height: 26px; border-radius: 50%;
  background: linear-gradient(135deg, var(--color-primary), var(--color-accent));
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; margin-top: 2px;
  box-shadow: 0 2px 6px rgba(108,92,231,0.3);
}

.cop-msg__bubble {
  padding: 10px 14px;
  border-radius: 14px;
  font-size: 14px; line-height: 1.55; word-wrap: break-word;
  white-space: normal;
}
.cop-msg__bubble p { margin: 0 0 6px; }
.cop-msg__bubble p:last-child { margin: 0; }
.cop-msg__bubble code {
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  font-size: 12.5px;
  background: rgba(0,0,0,0.25); padding: 1px 5px;
  border-radius: 4px;
}

.cop-msg--user .cop-msg__bubble {
  background: linear-gradient(135deg, var(--color-primary), var(--color-primary-dark));
  color: #fff;
  border-bottom-right-radius: 4px;
  box-shadow: 0 2px 8px rgba(108,92,231,0.25);
}
.cop-msg--user .cop-msg__bubble code { background: rgba(0,0,0,0.18); color: #fff; }

.cop-msg--bot .cop-msg__bubble {
  background: var(--color-bg-card);
  color: var(--color-text);
  border: 1px solid var(--color-border);
  border-bottom-left-radius: 4px;
}

.cop-msg__time {
  font-size: 10.5px; color: var(--color-text-muted);
  margin-top: 4px; padding: 0 4px;
}

/* ----- Tool calls ----- */
.cop-tool {
  align-self: flex-start; max-width: 92%;
  background: var(--color-bg-card);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  margin-left: 34px; /* alinha com bot bubble (avatar 26px + gap 8px) */
  overflow: hidden;
}
.cop-tool__head {
  list-style: none; cursor: pointer; user-select: none;
  display: flex; align-items: center; gap: 8px;
  padding: 8px 12px; font-size: 12px;
  color: var(--color-text-secondary);
  transition: background 140ms ease;
}
.cop-tool__head::-webkit-details-marker { display: none; }
.cop-tool__head:hover { background: var(--color-bg-hover); }
.cop-tool__icon {
  width: 22px; height: 22px; border-radius: 6px;
  background: rgba(108,92,231,0.15);
  color: var(--color-primary-light);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.cop-tool__name {
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  font-size: 12px; color: var(--color-primary-light);
  font-weight: 600;
}
.cop-tool__time { color: var(--color-text-muted); font-size: 10.5px; margin-left: auto; }
.cop-tool__caret { color: var(--color-text-muted); transition: transform 200ms ease; }
.cop-tool[open] .cop-tool__caret { transform: rotate(180deg); }
.cop-tool__code {
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  font-size: 11.5px; padding: 12px;
  background: var(--color-bg);
  color: var(--color-text-secondary);
  white-space: pre-wrap; word-break: break-word;
  border-top: 1px solid var(--color-border);
  margin: 0; max-height: 240px; overflow: auto;
}

.cop-tool-result {
  align-self: flex-start; max-width: 92%;
  margin-left: 34px;
}
.cop-tool-result__head {
  list-style: none; cursor: pointer; user-select: none;
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 10px;
  font-size: 11px; color: var(--color-success);
  background: rgba(0,255,136,0.08);
  border: 1px solid rgba(0,255,136,0.2);
  border-radius: var(--radius-full);
  transition: background 140ms ease;
}
.cop-tool-result__head:hover { background: rgba(0,255,136,0.14); }
.cop-tool-result__head::-webkit-details-marker { display: none; }
.cop-tool-result__code {
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  font-size: 11.5px; padding: 10px;
  background: var(--color-bg);
  color: var(--color-text-secondary);
  white-space: pre-wrap; word-break: break-word;
  border-radius: var(--radius-sm); margin: 6px 0 0;
  border: 1px solid var(--color-border);
  max-height: 200px; overflow: auto;
}

/* ----- System line (separador) ----- */
.cop-system {
  align-self: center; font-size: 11px;
  color: var(--color-text-muted);
  padding: 2px 12px;
  display: flex; align-items: center; gap: 8px;
}
.cop-system::before, .cop-system::after {
  content: ""; flex: 1; height: 1px;
  background: var(--color-border);
}
.cop-system span { white-space: nowrap; }

/* ----- Action proposal (CRÍTICO) ----- */
.cop-action {
  align-self: stretch;
  position: relative; overflow: hidden;
  margin: 8px 0 4px;
  background:
    linear-gradient(135deg, rgba(108,92,231,0.16) 0%, rgba(0,212,255,0.08) 100%),
    var(--color-bg-card);
  border: 1px solid rgba(108,92,231,0.5);
  border-radius: var(--radius-lg);
  padding: 16px;
  box-shadow:
    0 12px 32px -8px rgba(108,92,231,0.35),
    inset 0 1px 0 rgba(255,255,255,0.04);
  animation: copActionIn 380ms cubic-bezier(.32,.72,0,1);
}
@keyframes copActionIn {
  0%   { opacity: 0; transform: translateY(10px) scale(0.98); }
  60%  { opacity: 1; }
  100% { opacity: 1; transform: translateY(0) scale(1); }
}
.cop-action__beam {
  position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg,
    transparent,
    var(--color-primary) 20%,
    var(--color-accent) 50%,
    var(--color-primary) 80%,
    transparent);
  background-size: 200% 100%;
  animation: copBeam 3s ease-in-out infinite;
}
@keyframes copBeam {
  0%, 100% { background-position: 0% 0%; }
  50%      { background-position: 200% 0%; }
}

.cop-action__head {
  display: flex; align-items: flex-start; gap: 11px;
  margin-bottom: 12px;
}
.cop-action__icon {
  width: 34px; height: 34px; border-radius: 10px;
  background: linear-gradient(135deg, var(--color-primary), var(--color-accent));
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  box-shadow:
    0 4px 14px rgba(108,92,231,0.45),
    inset 0 1px 0 rgba(255,255,255,0.2);
}
.cop-action__head-text {
  flex: 1; min-width: 0;
  display: flex; flex-direction: column; gap: 2px;
}
.cop-action__eyebrow {
  text-transform: uppercase; font-size: 10px; letter-spacing: 0.1em;
  color: var(--color-primary-light); font-weight: 800;
}
.cop-action__title {
  font-size: 14px; font-weight: 700; line-height: 1.25; margin: 0;
  color: var(--color-text);
}
.cop-action__title code {
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  font-size: 12.5px; color: var(--color-text);
  background: var(--color-bg);
  padding: 2px 7px; border-radius: 5px;
  border: 1px solid var(--color-border);
}
.cop-action__ttl {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 10.5px; font-weight: 700;
  color: var(--color-warning);
  background: rgba(253,203,110,0.12);
  border: 1px solid rgba(253,203,110,0.3);
  padding: 3px 8px; border-radius: var(--radius-full);
  flex-shrink: 0;
}

.cop-action__rationale {
  font-size: 13px; color: var(--color-text-secondary);
  line-height: 1.55; margin-bottom: 12px;
  padding: 10px 12px;
  background: rgba(0,0,0,0.22);
  border-radius: var(--radius-sm);
  border-left: 2px solid var(--color-primary-light);
}
.cop-action__rationale p { margin: 0 0 6px; }
.cop-action__rationale p:last-child { margin: 0; }

.cop-action__args {
  display: grid; grid-template-columns: max-content 1fr;
  column-gap: 14px; row-gap: 7px;
  margin: 0 0 14px; font-size: 12px;
}
.cop-action__arg-label {
  color: var(--color-text-muted);
  text-transform: uppercase; font-size: 10px;
  letter-spacing: 0.08em; font-weight: 700;
  align-self: center; margin: 0;
}
.cop-action__arg-value {
  color: var(--color-text);
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  font-size: 12px; word-break: break-word; margin: 0;
}
.cop-action__arg-value pre {
  font-size: 11px; padding: 6px 8px;
  background: var(--color-bg);
  border-radius: var(--radius-sm); margin: 0;
  white-space: pre-wrap;
  border: 1px solid var(--color-border);
  max-height: 140px; overflow: auto;
}

.cop-action__buttons {
  display: flex; gap: 8px; align-items: stretch;
}
.cop-action__buttons form { margin: 0; flex: 1; }
.cop-action__btn {
  display: inline-flex; align-items: center; justify-content: center;
  gap: 7px;
  width: 100%; min-height: 40px;
  padding: 10px 16px;
  font-size: 13px; font-weight: 700;
  border-radius: var(--radius-md);
  cursor: pointer;
  transition: transform 120ms ease, box-shadow 160ms ease, background 160ms ease;
}
.cop-action__btn:active { transform: translateY(1px); }
.cop-action__btn--approve {
  background: linear-gradient(135deg, var(--color-success), #00d4a4);
  color: #001a10;
  box-shadow: 0 4px 14px rgba(0,184,148,0.35);
}
.cop-action__btn--approve:hover {
  box-shadow: 0 6px 20px rgba(0,184,148,0.5);
  filter: brightness(1.06);
}
.cop-action__btn--reject {
  background: var(--color-bg);
  color: var(--color-text-secondary);
  border: 1px solid var(--color-border);
}
.cop-action__btn--reject:hover {
  background: var(--color-bg-hover);
  color: var(--color-danger);
  border-color: var(--color-danger);
}

/* ----- Composer (footer) ----- */
.cop-foot {
  flex-shrink: 0;
  border-top: 1px solid var(--color-border);
  background: var(--color-bg-card);
  padding: 10px 14px max(12px, env(safe-area-inset-bottom));
  display: flex; flex-direction: column; gap: 8px;
}

.cop-quick {
  display: flex; gap: 6px;
  overflow-x: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
  padding: 0 0 2px;
  margin: 0 -4px;
  padding-left: 4px; padding-right: 4px;
}
.cop-quick::-webkit-scrollbar { display: none; }
.cop-quick__chip {
  flex-shrink: 0;
  display: inline-flex; align-items: center; gap: 5px;
  padding: 6px 11px;
  border-radius: var(--radius-full);
  background: var(--color-bg-elevated);
  border: 1px solid var(--color-border);
  font-size: 12px; font-weight: 600;
  color: var(--color-text-secondary);
  white-space: nowrap; cursor: pointer;
  transition: border-color 140ms ease, color 140ms ease, background 140ms ease, transform 120ms ease;
}
.cop-quick__chip:hover {
  border-color: var(--color-primary-light);
  color: var(--color-text);
  background: var(--color-bg-hover);
}
.cop-quick__chip:active { transform: scale(0.97); }

.cop-composer {
  display: flex; align-items: flex-end; gap: 8px;
  background: var(--color-bg-elevated);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: 6px 6px 6px 14px;
  transition: border-color 160ms ease, box-shadow 160ms ease;
}
.cop-composer:focus-within {
  border-color: var(--color-primary-light);
  box-shadow: 0 0 0 3px rgba(108,92,231,0.18);
}
.cop-composer__input {
  flex: 1; background: transparent; color: var(--color-text);
  border: none; outline: none; resize: none;
  font-family: inherit;
  font-size: 14px; line-height: 1.45;
  padding: 8px 0;
  max-height: 160px; min-height: 24px;
}
.cop-composer__input::placeholder { color: var(--color-text-muted); }
.cop-composer__send {
  flex-shrink: 0;
  width: 36px; height: 36px; border-radius: 50%;
  background: linear-gradient(135deg, var(--color-primary), var(--color-accent));
  color: #fff;
  display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer;
  box-shadow: 0 3px 10px rgba(108,92,231,0.35);
  transition: transform 140ms ease, box-shadow 160ms ease;
}
.cop-composer__send:hover {
  transform: translateY(-1px) scale(1.04);
  box-shadow: 0 6px 18px rgba(108,92,231,0.55);
}
.cop-composer__send:active { transform: scale(0.94); }
.cop-composer__send svg { transition: transform 200ms ease; }
.cop-composer__send:hover svg { transform: translateX(1px) rotate(8deg); }

.cop-foot__hint {
  margin: 0; padding: 0 4px;
  font-size: 10.5px; color: var(--color-text-muted);
  text-align: center;
}
.cop-foot__hint kbd {
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  font-size: 10px;
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-bottom-width: 2px;
  border-radius: 4px;
  padding: 1px 5px;
  color: var(--color-text-secondary);
}

/* ----- Typing indicator ----- */
.cop-typing {
  display: inline-flex; gap: 4px; align-items: center; padding: 4px 0;
}
.cop-typing span {
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--color-primary-light);
  animation: copTypingDot 1.2s infinite ease-in-out both;
}
.cop-typing span:nth-child(2) { animation-delay: 0.15s; }
.cop-typing span:nth-child(3) { animation-delay: 0.3s; }
@keyframes copTypingDot {
  0%, 80%, 100% { transform: scale(0.6); opacity: 0.4; }
  40%           { transform: scale(1);   opacity: 1; }
}

/* Typing indicator entra direto no thread (server insere via turbo_stream) */
#copilot_typing {
  align-self: flex-start;
  margin-left: 34px;
  display: inline-flex; align-items: center;
  padding: 8px 14px;
  background: var(--color-bg-card);
  border: 1px solid var(--color-border);
  border-radius: 14px;
  border-bottom-left-radius: 4px;
}

/* Mobile-specific tweaks */
@media (max-width: 767px) {
  .cop-head { padding: 12px 12px; gap: 10px; }
  .cop-head__back { display: inline-flex; }
  .cop-head__avatar { width: 32px; height: 32px; }
  .cop-head__title { font-size: 14.5px; }
  .cop-head__sub { font-size: 11px; }

  .cop-thread { padding: 12px 12px 6px; gap: 8px; }
  .cop-msg { max-width: 92%; }
  .cop-msg--bot { max-width: 96%; }

  .cop-tool, .cop-tool-result { margin-left: 30px; }

  .cop-foot { padding: 8px 10px max(10px, env(safe-area-inset-bottom)); }
  .cop-composer { padding: 4px 4px 4px 12px; }
  /* iOS evita zoom no focus quando font-size >= 16 */
  .cop-composer__input { font-size: 16px; }

  .cop-action { padding: 14px; }
  .cop-action__buttons { flex-direction: row; }

  .cop-empty { padding: 20px 8px 8px; gap: 10px; }
  .cop-empty__halo { width: 64px; height: 64px; }
  .cop-empty__title { font-size: 18px; }

  .cop-foot__hint { display: none; }
}

/* prefers-reduced-motion */
@media (prefers-reduced-motion: reduce) {
  .cop-drawer, .cop-fab, .cop-icon-btn, .cop-suggest,
  .cop-msg, .cop-action, .cop-action__beam, .cop-fab--pending::after,
  .cop-head__pulse::after, .cop-notice--critical .cop-notice__dot {
    animation: none !important;
    transition: none !important;
  }
}

/* ============================================================
   Aliases legados — o controller (copilots_controller.rb) injeta
   HTML com nomes de classe antigos via turbo_stream. Como não
   mexemos no controller, mapeamos as classes legadas pro look novo.
   ============================================================ */

/* typing indicator que vem do server */
.copilot-msg--typing {
  align-self: flex-start;
  max-width: 92%;
  display: flex;
  margin-left: 34px;
  animation: copFadeUp 220ms cubic-bezier(.32,.72,0,1);
}
.copilot-msg--typing .copilot-msg__bubble {
  padding: 10px 14px;
  background: var(--color-bg-card);
  border: 1px solid var(--color-border);
  border-radius: 14px;
  border-bottom-left-radius: 4px;
}
.copilot-typing {
  display: inline-flex; gap: 4px; align-items: center;
}
.copilot-typing span {
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--color-primary-light);
  animation: copTypingDot 1.2s infinite ease-in-out both;
}
.copilot-typing span:nth-child(2) { animation-delay: 0.15s; }
.copilot-typing span:nth-child(3) { animation-delay: 0.3s; }

/* textarea recriado pelo controller após submit */
.copilot-composer__input {
  flex: 1; background: transparent; color: var(--color-text);
  border: none; outline: none; resize: none;
  font-family: inherit;
  font-size: 14px; line-height: 1.45;
  padding: 8px 0;
  max-height: 160px; min-height: 24px;
}
.copilot-composer__input::placeholder { color: var(--color-text-muted); }
@media (max-width: 767px) {
  .copilot-composer__input { font-size: 16px; }
}

/* user msg legada (caso turbo_stream append antes de render) */
.copilot-msg {
  display: flex; flex-direction: column;
  max-width: 86%;
  animation: copFadeUp 220ms cubic-bezier(.32,.72,0,1);
}
.copilot-msg--user { align-self: flex-end; align-items: flex-end; }
.copilot-msg--bot  { align-self: flex-start; align-items: flex-start; max-width: 92%; }
.copilot-msg__bubble {
  padding: 10px 14px;
  border-radius: 14px;
  font-size: 14px; line-height: 1.55;
  word-wrap: break-word; white-space: normal;
}
.copilot-msg--user .copilot-msg__bubble {
  background: linear-gradient(135deg, var(--color-primary), var(--color-primary-dark));
  color: #fff;
  border-bottom-right-radius: 4px;
  box-shadow: 0 2px 8px rgba(108,92,231,0.25);
}
.copilot-msg--bot .copilot-msg__bubble {
  background: var(--color-bg-card);
  color: var(--color-text);
  border: 1px solid var(--color-border);
  border-bottom-left-radius: 4px;
}
.copilot-msg__meta { font-size: 10.5px; color: var(--color-text-muted); margin-top: 4px; padding: 0 4px; }

/* ============================================================
   /insights — página dedicada
   ============================================================ */
.insight-filters {
  display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 24px;
}
.insight-filter-chip {
  padding: 8px 14px; border-radius: var(--radius-full);
  background: var(--color-bg-card); border: 1px solid var(--color-border);
  font-size: 13px; color: var(--color-text-secondary);
  display: inline-flex; align-items: center; gap: 6px;
  transition: all 150ms ease;
}
.insight-filter-chip:hover { border-color: var(--color-primary-light); color: var(--color-text); }
.insight-filter-chip--active {
  background: linear-gradient(135deg, var(--color-primary), var(--color-primary-dark));
  border-color: var(--color-primary); color: #fff;
}
.insight-filter-chip__count {
  font-size: 11px; font-weight: 700; background: rgba(0,0,0,0.25);
  padding: 1px 7px; border-radius: var(--radius-full);
}

.insight-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 20px;
}

.insight-card {
  background: var(--color-bg-card); border: 1px solid var(--color-border);
  border-radius: var(--radius-lg); padding: 22px;
  display: flex; flex-direction: column; gap: 14px;
  position: relative; overflow: hidden;
  transition: all var(--transition-normal);
}
.insight-card::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, var(--color-primary), var(--color-accent));
  opacity: 0; transition: opacity var(--transition-normal);
}
.insight-card:hover {
  border-color: var(--color-primary-light); transform: translateY(-2px);
  box-shadow: var(--shadow-glow);
}
.insight-card:hover::before { opacity: 1; }
.insight-card__head { display: flex; align-items: center; gap: 8px; }
.insight-card__period { font-size: 11px; color: var(--color-text-muted); margin-left: auto; }
.insight-card__body-link { display: flex; flex-direction: column; gap: 10px; flex: 1; }
.insight-card__title {
  font-size: 16px; font-weight: 700; line-height: 1.3; color: var(--color-text);
}
.insight-card__metric {
  font-size: 28px; font-weight: 800; letter-spacing: -0.02em;
  background: linear-gradient(135deg, var(--color-primary-light), var(--color-accent));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
  line-height: 1.1;
}
.insight-card__excerpt { font-size: 13px; color: var(--color-text-secondary); line-height: 1.5; }
.insight-card__excerpt p { margin: 0 0 6px; }
.insight-card__foot {
  display: flex; align-items: center; justify-content: space-between;
  border-top: 1px solid var(--color-border); padding-top: 12px;
}
.insight-card__time { font-size: 12px; color: var(--color-text-muted); }
.insight-card__foot form { margin: 0; }

/* Kind badges — coloridas por tipo */
.insight-card__kind-badge {
  display: inline-flex; align-items: center; padding: 3px 10px;
  border-radius: var(--radius-full); font-size: 11px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.06em;
  background: rgba(108,92,231,0.15); color: var(--color-primary-light);
}
.insight-card__kind-badge--weekly_review     { background: rgba(108,92,231,0.18); color: var(--color-primary-light); }
.insight-card__kind-badge--top_objections    { background: rgba(255,159,67,0.18);  color: var(--color-orange); }
.insight-card__kind-badge--agent_performance { background: rgba(0,212,255,0.18);   color: var(--color-accent); }
.insight-card__kind-badge--lead_quality_shift{ background: rgba(0,184,148,0.18);   color: var(--color-success); }
.insight-card__kind-badge--cost_efficiency   { background: rgba(253,203,110,0.18); color: var(--color-warning); }
.insight-card__kind-badge--conversion_drop   { background: rgba(255,107,107,0.18); color: var(--color-danger); }
.insight-card__kind-badge--custom            { background: rgba(110,110,138,0.18); color: var(--color-text-secondary); }

.insight-empty {
  background: var(--color-bg-card); border: 1px dashed var(--color-border);
  border-radius: var(--radius-lg); padding: 48px 24px;
  text-align: center; display: flex; flex-direction: column; align-items: center; gap: 12px;
}
.empty-state__icon { font-size: 48px; opacity: 0.7; }
.empty-state__title { font-size: 20px; font-weight: 800; }
.empty-state__text { font-size: 14px; color: var(--color-text-secondary); max-width: 480px; line-height: 1.6; }

.back-link {
  display: inline-block; font-size: 13px; color: var(--color-text-muted);
  margin-bottom: 8px; transition: color 150ms ease;
}
.back-link:hover { color: var(--color-primary-light); }

.insight-detail-metric {
  background:
    linear-gradient(135deg, rgba(108,92,231,0.12), rgba(0,212,255,0.10)),
    var(--color-bg-card);
  border: 1px solid var(--color-primary);
  border-radius: var(--radius-lg);
  padding: 24px; margin-bottom: 24px;
  display: flex; flex-direction: column; gap: 6px;
}
.insight-detail-metric__label {
  font-size: 11px; text-transform: uppercase; letter-spacing: 0.1em;
  color: var(--color-text-muted); font-weight: 700;
}
.insight-detail-metric__value {
  font-size: 42px; font-weight: 900; letter-spacing: -0.02em;
  background: linear-gradient(135deg, var(--color-primary-light), var(--color-accent));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
  line-height: 1.1;
}
.insight-detail-md { font-size: 14px; color: var(--color-text-secondary); line-height: 1.7; }
.insight-detail-md p { margin-bottom: 12px; }
.insight-detail-snapshot { margin-top: 24px; }
.insight-detail-snapshot summary { cursor: pointer; }

/* ============================================================
   GIANTS ADMIN — Super-admin painel (financial/tokens/copilot/prospects/health)
   ============================================================ */

.admin-section { margin-bottom: 28px; }

.admin-grid-stats {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 14px; margin-bottom: 24px;
}
@media (max-width: 1024px) { .admin-grid-stats { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px)  { .admin-grid-stats { grid-template-columns: 1fr; } }

.admin-hero-metric {
  background: linear-gradient(135deg, rgba(108,92,231,0.08), rgba(0,212,255,0.05));
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: 28px 32px;
  display: flex; flex-direction: column; gap: 6px;
}
.admin-hero-metric__label {
  font-size: 12px; font-weight: 600; text-transform: uppercase;
  letter-spacing: 0.1em; color: var(--color-text-muted);
}
.admin-hero-metric__value {
  font-size: 56px; font-weight: 900; letter-spacing: -0.03em; line-height: 1;
  background: linear-gradient(135deg, var(--color-primary-light), var(--color-accent));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.admin-hero-metric__delta { font-size: 14px; font-weight: 600; }

/* Tabela admin compacta */
.admin-table th {
  font-size: 11px; padding: 10px 14px;
}
.admin-table td {
  padding: 10px 14px; font-size: 13px;
}
.admin-table tr.admin-row--danger td { background: rgba(255,107,107,0.06); }
.admin-cell--ok      { color: var(--color-success); }
.admin-cell--danger  { color: var(--color-danger); }

/* Status pills */
.admin-status-pill {
  display: inline-block; padding: 3px 10px; border-radius: 999px;
  font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em;
  background: rgba(110,110,138,0.18); color: var(--color-text-muted);
}
.admin-status-pill--ok       { background: rgba(0,184,148,0.15); color: var(--color-success); }
.admin-status-pill--warn     { background: rgba(253,203,110,0.15); color: var(--color-warning); }
.admin-status-pill--critical { background: rgba(255,107,107,0.15); color: var(--color-danger); }

/* Spike alert */
.admin-spike-alert {
  background: rgba(255,159,67,0.10); border: 1px solid rgba(255,159,67,0.4);
  border-left: 4px solid var(--color-orange);
  border-radius: var(--radius-md);
  padding: 14px 18px; margin-bottom: 20px;
  color: var(--color-text);
}
.admin-spike-alert strong { color: var(--color-orange); }
.admin-spike-alert__list { margin-top: 8px; padding-left: 18px; font-size: 13px; }
.admin-spike-alert__list li { color: var(--color-text-secondary); margin: 4px 0; }

/* Filter bar */
.admin-filter-bar {
  display: flex; flex-wrap: wrap; gap: 18px;
  margin-bottom: 18px; padding: 12px 16px;
  background: var(--color-bg-card); border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
}
.admin-filter-group { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.admin-filter-group__label {
  font-size: 11px; font-weight: 600; text-transform: uppercase;
  letter-spacing: 0.08em; color: var(--color-text-muted);
}
.admin-filter-bar .chip {
  cursor: pointer; padding: 5px 12px; border-radius: 999px;
  background: rgba(110,110,138,0.12); color: var(--color-text-secondary);
  font-size: 12px; font-weight: 600;
  border: 1px solid transparent;
}
.admin-filter-bar .chip:hover { background: rgba(108,92,231,0.15); color: var(--color-text); }
.admin-filter-bar .chip--active {
  background: rgba(108,92,231,0.20); color: var(--color-primary-light);
  border-color: var(--color-primary);
}

/* SVG charts */
.admin-chart-container {
  width: 100%;
  padding: 8px 4px 0;
}
.admin-svg-chart { display: block; }
.admin-bar { transition: opacity 0.2s; }
.admin-bar:hover { opacity: 0.8; }

/* Horizontal bar chart */
.admin-hbar-list { display: flex; flex-direction: column; gap: 8px; padding: 4px 2px; }
.admin-hbar { display: grid; grid-template-columns: 200px 1fr 90px; gap: 12px; align-items: center; font-size: 12px; }
.admin-hbar__label { color: var(--color-text-secondary); font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.admin-hbar__track { height: 14px; background: rgba(110,110,138,0.15); border-radius: 4px; overflow: hidden; }
.admin-hbar__fill  { height: 100%; transition: width 0.3s ease; border-radius: 4px; }
.admin-hbar__value { color: var(--color-text); font-weight: 700; text-align: right; font-variant-numeric: tabular-nums; }
@media (max-width: 720px) {
  .admin-hbar { grid-template-columns: 130px 1fr 70px; gap: 8px; font-size: 11px; }
}

/* Tabs admin (copilot show) */
.admin-tabs {
  display: flex; gap: 4px;
  border-bottom: 1px solid var(--color-border);
  margin-bottom: 20px;
}
.admin-tabs__item {
  padding: 10px 16px; font-size: 13px; font-weight: 600;
  color: var(--color-text-muted); border-bottom: 2px solid transparent;
  text-decoration: none;
}
.admin-tabs__item:hover { color: var(--color-text); }
.admin-tabs__item--active {
  color: var(--color-primary-light);
  border-bottom-color: var(--color-primary);
}

/* Conv split (copilot show conversations) */
.admin-conv-split { align-items: stretch; }
.admin-conv-split .companion-row--active {
  background: rgba(108,92,231,0.12);
  border-color: var(--color-primary);
}

/* Messages block (read-only) */
.admin-messages {
  display: flex; flex-direction: column; gap: 10px;
  max-height: 600px; overflow-y: auto; padding: 4px;
}
.admin-message {
  border: 1px solid var(--color-border); border-radius: var(--radius-md);
  padding: 10px 14px; background: var(--color-bg-elevated);
}
.admin-message__role {
  font-size: 10px; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.1em; color: var(--color-text-muted); margin-bottom: 6px;
}
.admin-message__body { font-size: 13px; color: var(--color-text); line-height: 1.55; }
.admin-message__body p { margin-bottom: 6px; }
.admin-message__meta { font-size: 11px; color: var(--color-text-muted); margin-top: 6px; }
.admin-message--user      { border-left: 3px solid var(--color-accent); }
.admin-message--assistant { border-left: 3px solid var(--color-primary); }
.admin-message--system    { border-left: 3px solid var(--color-text-muted); opacity: 0.85; }
.admin-message--tool      { border-left: 3px solid var(--color-warning); }
.admin-message--human_agent { border-left: 3px solid var(--color-green); }

/* Insights list */
.admin-insight-list { list-style: none; padding: 0; display: flex; flex-direction: column; gap: 14px; }
.admin-insight {
  border: 1px solid var(--color-border); border-radius: var(--radius-md);
  padding: 14px 18px; background: var(--color-bg-elevated);
}
.admin-insight__head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
.admin-insight__when { color: var(--color-text-muted); font-size: 11px; margin-left: auto; }
.admin-insight__highlight {
  display: inline-block; font-weight: 700; font-size: 14px;
  background: linear-gradient(135deg, var(--color-primary-light), var(--color-accent));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
  margin-bottom: 6px;
}
.admin-insight__body { font-size: 13px; color: var(--color-text-secondary); line-height: 1.6; }

/* Pre / code blocks */
.admin-pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 11px; color: var(--color-text-muted);
  background: rgba(110,110,138,0.08); padding: 4px 6px; border-radius: 4px;
  white-space: pre-wrap; word-break: break-all; max-width: 360px;
}
.admin-error-code {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 11px; color: var(--color-danger);
  background: rgba(255,107,107,0.08); padding: 4px 8px; border-radius: 4px;
  display: inline-block; max-width: 600px; word-break: break-word;
}

.admin-qual-snippet {
  font-size: 11px; color: var(--color-text-muted);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
}

/* Sidebar admin separator */
.sidebar__divider {
  height: 1px; background: var(--color-border);
  margin: 14px 16px 10px; opacity: 0.6;
}

/* ============ Admin form (used in /admin/accounts/new) ============ */
.admin-form { max-width: 720px; display: flex; flex-direction: column; gap: 24px; margin-top: 24px; }
.admin-form__group { border: 1px solid var(--color-border, #2A2A50); border-radius: 12px; padding: 20px 24px 24px; background: var(--color-bg-card, #12122A); display: flex; flex-direction: column; gap: 16px; }
.admin-form__group legend { padding: 0 8px; color: var(--color-text-secondary, #9090b8); font-size: 12px; text-transform: uppercase; letter-spacing: 0.06em; font-weight: 600; }
.admin-form__group label { display: flex; flex-direction: column; gap: 6px; font-size: 14px; color: var(--color-text-secondary, #b0b0d0); }
.admin-form__group small { color: var(--color-text-secondary, #6a6a8a); font-size: 12px; line-height: 1.4; }
.admin-form__group input,
.admin-form__group select,
.admin-form__group textarea {
  background: var(--color-bg-elevated, #1A1A3E); border: 1px solid var(--color-border, #2A2A50);
  color: var(--color-text, #fff); padding: 10px 12px; border-radius: 8px; font: inherit;
  font-size: 14px; outline: none; transition: 200ms;
}
.admin-form__group input:focus,
.admin-form__group select:focus,
.admin-form__group textarea:focus {
  border-color: var(--color-primary, #7B61FF);
  box-shadow: 0 0 0 3px rgba(123,97,255,0.18);
}
.admin-form__group textarea { resize: vertical; min-height: 80px; }
.admin-form__actions { display: flex; gap: 12px; align-items: center; }

.admin-page { padding: 8px 0; }
.admin-page__head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; gap: 12px; }
.admin-page__title { font-size: 28px; font-weight: 700; }
.admin-page__sub { color: var(--color-text-secondary, #9090b8); margin-bottom: 12px; max-width: 720px; line-height: 1.5; }
