/* UK Intent Modal */

.intent-modal-overlay {
  position: fixed; inset: 0; z-index: 9990;
  background: rgba(27,24,20,.55);
  display: flex; align-items: center; justify-content: center;
  animation: msg-fade .18s ease;
}
.intent-modal {
  background: var(--bg-card, #fff);
  border-radius: var(--r-lg, 22px);
  width: min(480px, calc(100vw - 32px));
  max-height: 80vh;
  display: flex; flex-direction: column;
  box-shadow: var(--shadow-lg, 0 20px 50px rgba(28,24,20,.12));
  animation: msg-rise .22s ease;
  overflow: hidden;
}

/* Mobile: bottom-sheet */
.intent-modal-overlay.is-mobile { align-items: flex-end; }
.intent-modal-overlay.is-mobile .intent-modal {
  width: 100%; border-radius: var(--r-lg, 22px) var(--r-lg, 22px) 0 0;
  max-height: 80vh;
}

.intent-modal-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 18px 20px 14px;
  border-bottom: 1px solid var(--border, #E8E1D4);
}
.intent-modal-title { font-weight: 600; font-size: 15px; color: var(--ink, #1B1814); }
.intent-modal-close {
  background: none; border: none; cursor: pointer;
  font-size: 20px; line-height: 1; color: var(--ink-mute, #8A8076);
  width: 28px; height: 28px; display: flex; align-items: center; justify-content: center;
  border-radius: var(--r-sm, 8px);
}
.intent-modal-close:hover { background: var(--bg-soft, #F2EDE4); }

.intent-modal-body { overflow-y: auto; }

.intent-modal-who { padding: 16px 20px; }
.intent-loading, .intent-empty, .intent-error {
  font-size: 13px; color: var(--ink-mute, #8A8076); margin: 0;
}
.intent-who-label { font-size: 12px; color: var(--ink-mute, #8A8076); margin: 0 0 10px; }

.intent-people-list { display: flex; flex-direction: column; gap: 10px; }
.intent-person { display: flex; gap: 10px; align-items: flex-start; }
.intent-avatar { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; flex-shrink: 0; }
.intent-person-info { display: flex; flex-direction: column; gap: 2px; }
.intent-person-name { font-size: 13px; font-weight: 600; color: var(--ink, #1B1814); }
.intent-person-note { font-size: 12px; color: var(--ink-soft, #5C544A); }
.intent-person-vibes { display: flex; gap: 4px; flex-wrap: wrap; }
.intent-vibe-tag {
  font-size: 11px; padding: 1px 7px; border-radius: var(--r-pill, 999px);
  background: var(--primary-soft, #E8F0EC); color: var(--primary, #1F4A3D);
}

.intent-modal-foot {
  padding: 14px 20px 18px;
  border-top: 1px solid var(--border, #E8E1D4);
  display: flex; flex-direction: column; gap: 10px;
}
.intent-note-input {
  width: 100%; border: 1px solid var(--border, #E8E1D4);
  border-radius: var(--r-md, 14px); padding: 10px 12px;
  font-size: 13px; font-family: var(--font-body, sans-serif);
  color: var(--ink, #1B1814); background: var(--bg, #FAF7F2);
  resize: none; box-sizing: border-box;
}
.intent-note-input:focus { outline: none; border-color: var(--primary, #1F4A3D); }
.intent-modal-actions { display: flex; gap: 8px; justify-content: flex-end; }

/* Intent chip a kártyán */
.intent-chip {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 12px; padding: 3px 10px; border-radius: var(--r-pill, 999px);
  background: var(--bg-soft, #F2EDE4); color: var(--ink-soft, #5C544A);
  border: 1px solid var(--border, #E8E1D4); cursor: pointer;
  transition: background .15s, color .15s;
}
.intent-chip.is-set {
  background: var(--primary-soft, #E8F0EC);
  color: var(--primary, #1F4A3D);
  border-color: var(--primary, #1F4A3D);
}
.intent-chip:hover { background: var(--bg-soft, #F2EDE4); color: var(--ink, #1B1814); }

@keyframes msg-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes msg-rise { from { transform: translateY(12px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
