/* ════════════════════════════════════════════════
   GR Brief & Chat — GR Diseño Digital
════════════════════════════════════════════════ */

/* ── Tabs del panel ── */
.grp-tabs { display:flex; gap:0; border-bottom:1px solid var(--grp-border); margin-bottom:20px; }
.grp-tab  { padding:10px 20px; font-size:.85rem; font-weight:600; cursor:pointer;
  color:var(--grp-muted); border-bottom:2px solid transparent; transition:all .2s; background:none; border-top:none; border-left:none; border-right:none; }
.grp-tab:hover  { color:var(--grp-text); }
.grp-tab.active { color:var(--grp-accent); border-bottom-color:var(--grp-accent); }
.grp-tab-badge  { display:inline-block; background:#ef4444; color:#fff; border-radius:10px;
  font-size:.68rem; padding:0 6px; margin-left:5px; min-width:18px; text-align:center;
  animation:grpBadgePulse 1.5s ease infinite; }
@keyframes grpBadgePulse { 0%,100%{transform:scale(1)} 50%{transform:scale(1.15)} }

/* ── Tab content ── */
.grp-tab-content { display:none; }
.grp-tab-content.active { display:block; }

/* ── Brief form ── */
.grp-brief-form { display:flex; flex-direction:column; gap:18px; }
.grp-brief-section { display:flex; flex-direction:column; gap:4px; }
.grp-brief-label {
  font-size:.78rem; font-weight:600; color:var(--grp-muted); text-transform:uppercase; letter-spacing:.05em;
}
.grp-brief-label span.grp-tier-badge {
  display:inline-block; font-size:.65rem; padding:1px 7px; border-radius:8px;
  margin-left:6px; text-transform:uppercase; letter-spacing:.03em; font-weight:700;
}
.grp-tier-basico { background:rgba(34,197,94,.15); color:#22c55e; }
.grp-tier-medio  { background:rgba(245,158,11,.15); color:#f59e0b; }
.grp-tier-pro    { background:rgba(139,92,246,.2);  color:#a78bfa; }

.grp-brief-input,
.grp-brief-textarea,
.grp-brief-select {
  background:rgba(255,255,255,.05); border:1px solid var(--grp-border);
  border-radius:10px; padding:10px 14px; color:var(--grp-text); font-size:.88rem;
  transition:border-color .2s; width:100%; box-sizing:border-box;
}
.grp-brief-input:focus,
.grp-brief-textarea:focus,
.grp-brief-select:focus { outline:none; border-color:var(--grp-accent); }
.grp-brief-textarea { min-height:90px; resize:vertical; }
.grp-brief-select   { cursor:pointer; }

/* Color picker */
.grp-brief-color-wrap { display:flex; align-items:center; gap:10px; }
.grp-brief-color-wrap input[type=color] {
  width:42px; height:42px; padding:2px; border-radius:8px; cursor:pointer;
  border:1px solid var(--grp-border); background:none;
}
.grp-brief-color-hex {
  background:rgba(255,255,255,.05); border:1px solid var(--grp-border); border-radius:8px;
  padding:8px 12px; color:var(--grp-text); font-size:.85rem; font-family:monospace; width:110px;
}

/* Image preview */
.grp-brief-img-preview {
  margin-top:8px; border-radius:10px; overflow:hidden; max-height:180px; display:none;
}
.grp-brief-img-preview img { width:100%; object-fit:cover; max-height:180px; }
.grp-brief-img-preview.show { display:block; }

/* Radio / Checkbox group */
.grp-brief-options { display:flex; flex-wrap:wrap; gap:10px; }
.grp-brief-opt {
  display:flex; align-items:center; gap:8px; padding:9px 16px;
  background:rgba(255,255,255,.04); border:1px solid var(--grp-border);
  border-radius:10px; cursor:pointer; font-size:.86rem; color:var(--grp-text); transition:all .2s;
}
.grp-brief-opt:hover  { border-color:var(--grp-accent); }
.grp-brief-opt.selected {
  border-color:var(--grp-accent);
  background:rgba(99,102,241,.25);
  color:var(--grp-accent);
  font-weight:600;
  box-shadow: 0 0 0 1px var(--grp-accent);
}
.grp-brief-opt input  { display:none; }

/* Save button bar */
.grp-brief-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:8px; }
.grp-brief-saved-msg { font-size:.8rem; color:#22c55e; align-self:center; display:none; }
.grp-brief-saved-msg.show { display:block; }

/* ── Chat ── */
.grp-chat-wrap { display:flex; flex-direction:column; height:480px; }
.grp-chat-messages {
  flex:1; overflow-y:auto; display:flex; flex-direction:column; gap:10px;
  padding:4px 0 12px; scrollbar-width:thin;
}
.grp-chat-msg { display:flex; flex-direction:column; max-width:75%; }
.grp-chat-msg.from-admin    { align-self:flex-start; align-items:flex-start; }
.grp-chat-msg.from-organizer { align-self:flex-end;  align-items:flex-end; }

.grp-chat-bubble {
  padding:10px 15px; border-radius:16px; font-size:.86rem; line-height:1.5;
  word-break:break-word;
}
.grp-chat-msg.from-admin     .grp-chat-bubble {
  background:#0ea5e9; color:#fff; border-radius:16px 16px 16px 4px;
}
.grp-chat-msg.from-organizer .grp-chat-bubble {
  background:var(--grp-accent); color:#fff; border-radius:16px 16px 4px 16px;
}
.grp-chat-meta { font-size:.71rem; color:var(--grp-muted); margin-top:3px; padding:0 4px; }
.grp-chat-empty { color:var(--grp-muted); font-size:.85rem; text-align:center; padding:40px 0; }

.grp-chat-input-row {
  display:flex; gap:8px; align-items:flex-end;
  border-top:1px solid var(--grp-border); padding-top:12px; margin-top:4px;
}
.grp-chat-input {
  flex:1; background:rgba(255,255,255,.05); border:1px solid var(--grp-border);
  border-radius:12px; padding:10px 14px; color:var(--grp-text); font-size:.86rem;
  resize:none; min-height:42px; max-height:120px; overflow-y:auto; transition:border-color .2s;
}
.grp-chat-input:focus { outline:none; border-color:var(--grp-accent); }
.grp-chat-send {
  background:var(--grp-accent); color:#fff; border:none; border-radius:10px;
  width:40px; height:40px; cursor:pointer; display:flex; align-items:center;
  justify-content:center; flex-shrink:0; transition:opacity .2s;
}
.grp-chat-send:hover { opacity:.85; }

/* ── Responsive tabs ── */
@media (max-width: 600px) {
  .grp-tabs { flex-wrap: wrap; }
  .grp-tab  { padding: 8px 14px; font-size: .8rem; }
  .grp-chat-wrap { height: 380px; }
  .grp-brief-options { flex-direction: column; }
}