/* EEdge Expert Chat
 * Version: 0.1.9
 * Goal: stable, readable, no overlap; works with current markup
 *
 * Themes:
 * - Expert: purple + gold
 * - Support: header-only slate tone (via .eedge-expert-chat--support)
 *
 * UI:
 * - Floating support icon (top-right) injected by plugin (Option A)
 *
 * 0.1.9:
 * - Card wrapper + Chat bar + Details/Posts row (extends card vertically)
 */

.eedge-expert-chat{ color:#111; }
.eedge-expert-chat *{ box-sizing:border-box; }

/* ===== Grid ===== */
.eedge-expert-chat__grid{
  display:grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap:12px;
}

/* 0.1.9: wrapper contains the old card plus the new action rows */
.eedge-expert-chat__cardWrap{
  border-radius:12px;
  overflow:hidden;
  display:flex;
  flex-direction:column;
}

/* Base card button (top part) */
.eedge-expert-chat__card{
  border:1px solid rgba(0,0,0,.12);
  border-radius:12px;
  padding:12px;
  background:#fff;
  cursor:pointer;

  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
}

.eedge-expert-chat__card:hover{
  background:#111;
  color:#fff;
}
.eedge-expert-chat__card:hover *{ color:inherit; }

/* Grid avatar wrapper + image */
.eedge-expert-chat__avatar{
  width:180px;
  max-width:90%;
  margin:0 auto 10px auto;
  overflow:hidden;
  border-radius:10px;
  background: rgba(0,0,0,.06);
}
.eedge-expert-chat__avatar img{
  display:block;
  width:100%;
  height:auto;
}

/* Grid text */
.eedge-expert-chat__meta{ width:100%; }
.eedge-expert-chat__name{ font-weight:600; margin:0 0 6px 0; }
.eedge-expert-chat__desc{ opacity:.8; font-size:14px; line-height:1.3; }

/* ===== Modal ===== */
.eedge-expert-chat__modal{
  position:fixed;
  inset:0;
  background: rgba(0,0,0,.45);
  display:none;
  z-index:99999;
}
.eedge-expert-chat__modal.is-open{
  display:flex;
  align-items:center;
  justify-content:center;
}

.eedge-expert-chat__modalInner{
  width:min(720px, 92vw);
  height:min(720px, 85vh);
  background:#fff;
  border-radius:16px;
  display:flex;
  flex-direction:column;
  overflow:hidden;
}

.eedge-expert-chat__header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:12px 14px;
  border-bottom:1px solid rgba(0,0,0,.1);
}

.eedge-expert-chat__headerLeft{
  display:flex;
  align-items:center;
  gap:12px;
}

/* Modal header avatar (small, not full-size) */
.eedge-expert-chat__headerAvatar{
  width:60px;
  height:60px;
  border-radius:999px;
  object-fit:cover;
  background: rgba(0,0,0,.06);
}

.eedge-expert-chat__title{
  font-weight:600;
  line-height:1.2;
}

.eedge-expert-chat__close{
  border:none;
  background:transparent;
  font-size:24px;
  cursor:pointer;
  line-height:1;
  width:40px;
  height:40px;
  border-radius:10px;
  color:#111;
}
.eedge-expert-chat__close:hover{ background: rgba(0,0,0,.12); }

/* Messages */
.eedge-expert-chat__messages{
  padding:14px;
  overflow:auto;
  flex:1;
  display:flex;
  flex-direction:column;
  gap:10px;
}

.eedge-expert-chat__bubble{
  max-width:78%;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(0,0,0,.08);
  white-space:pre-wrap;
  word-break:break-word;
}

.eedge-expert-chat__bubble.is-user{
  align-self:flex-end;
  background:#f5f7ff;
}

.eedge-expert-chat__bubble.is-expert{
  align-self:flex-start;
  background:#f7f7f7;
}

/* Input */
.eedge-expert-chat__form{
  display:flex;
  gap:10px;
  padding:12px;
  border-top:1px solid rgba(0,0,0,.1);
}

.eedge-expert-chat__input{
  flex:1;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid rgba(0,0,0,.15);
  color:#111;
}

.eedge-expert-chat__send{
  padding:10px 14px;
  border-radius:12px;
  border:1px solid rgba(0,0,0,.15);
  background:#fff;
  cursor:pointer;
}
.eedge-expert-chat__send:hover{
  background:#111;
  color:#fff;
}

/* ===== EEdge brand colours for Expert Grid (purple + gold) ===== */

.eedge-expert-chat__card{
  background:#2d0a45;                       /* deep purple */
  border:1px solid rgba(255,215,0,.35);     /* gold tint */
  color:#f7f2ff;                            /* near-white */
}

.eedge-expert-chat__card .eedge-expert-chat__name{
  color:#ffd700;                            /* gold */
}

.eedge-expert-chat__card .eedge-expert-chat__desc{
  color:#f7f2ff;
  opacity:0.9;
}

/* Hover: gold card, dark text */
.eedge-expert-chat__card:hover{
  background:#ffd700;                       /* gold */
  border-color:rgba(0,0,0,.18);
  color:#1a1020;                            /* dark purple-ish */
}
.eedge-expert-chat__card:hover .eedge-expert-chat__name,
.eedge-expert-chat__card:hover .eedge-expert-chat__desc{
  color:#1a1020;
}

/* ===== 0.1.9: integrate wrapper + action rows cleanly (avoid double borders) ===== */

.eedge-expert-chat__cardWrap{
  border:1px solid rgba(255,215,0,.35);   /* match card border tint */
  background:#2d0a45;                      /* match base card background */
}

.eedge-expert-chat__cardWrap .eedge-expert-chat__card{
  border:none;
  border-radius:0;
  background:transparent;                  /* wrapper provides background */
}

/* When card hover turns gold, keep the wrapper coherent */
.eedge-expert-chat__cardWrap:hover{
  background:#ffd700;
  border-color:rgba(0,0,0,.18);
}
.eedge-expert-chat__cardWrap:hover .eedge-expert-chat__card{
  background:transparent;
  color:#1a1020;
}
.eedge-expert-chat__cardWrap:hover .eedge-expert-chat__card .eedge-expert-chat__name,
.eedge-expert-chat__cardWrap:hover .eedge-expert-chat__card .eedge-expert-chat__desc{
  color:#1a1020;
}

/* Full-width Chat bar */
.eedge-expert-chat__chatbar{
  width:100%;
  border:none;
  padding:12px 14px;
  font-weight:800;
  font-size:14px;
  cursor:pointer;
  background:#c62828; /* red */
  color:#fff;
}

.eedge-expert-chat__chatbar:hover{
  filter:brightness(1.05);
}

/* Split actions row */
.eedge-expert-chat__actions{
  display:grid;
  grid-template-columns: 1fr 1fr;
}

.eedge-expert-chat__action{
  display:block;
  text-align:center;
  padding:10px 12px;
  font-weight:800;
  font-size:13px;
  text-decoration:none;
  color:#fff;
}

.eedge-expert-chat__action--details{ background:#1565c0; } /* blue */
.eedge-expert-chat__action--posts{ background:#2e7d32; }   /* green */

.eedge-expert-chat__action:hover{
  filter:brightness(1.05);
}

/* ===== Expert Chat: Purple + Gold Theme (modal only) ===== */

/* Modal background */
.eedge-expert-chat__modalInner{
  background:#f8f5fc;
}

/* Header */
.eedge-expert-chat__header{
  background:#2d0a45;
  border-bottom:1px solid rgba(255,215,0,.35);
}

.eedge-expert-chat__title{
  color:#ffd700;
}

/* Divider lines (replace harsh black) */
.eedge-expert-chat__header,
.eedge-expert-chat__form{
  border-color:rgba(45,10,69,.18);
}

/* Message bubbles */
.eedge-expert-chat__bubble.is-user{
  background:#ece6f6;
  color:#1a1020;
}

.eedge-expert-chat__bubble.is-expert{
  background:#f3f3f3;
  color:#1a1020;
}

/* Input area */
.eedge-expert-chat__form{
  background:#f8f5fc;
}

.eedge-expert-chat__input{
  background:#fff;
  border-color:rgba(45,10,69,.35);
}

/* Send button */
.eedge-expert-chat__send{
  background:#2d0a45;
  color:#ffd700;
  border-color:#2d0a45;
}
.eedge-expert-chat__send:hover{
  background:#ffd700;
  color:#2d0a45;
}

/* ===== Modal close button visibility on purple header ===== */
.eedge-expert-chat__header .eedge-expert-chat__close{
  color:#ffd700;                           /* gold X */
  border:1px solid rgba(255,215,0,.55);    /* thin gold outline */
  background:transparent;
}
.eedge-expert-chat__header .eedge-expert-chat__close:hover{
  background:rgba(255,215,0,.18);
  color:#fff;
}

/* ===== Erase button (caution styling) ===== */
.eedge-expert-chat__erase{
  background:#fff;
  color:#b00020;
  border:1px solid rgba(176,0,32,.65);
  border-radius:12px;
  padding:10px 14px;
  cursor:pointer;
  font-weight:700;
}
.eedge-expert-chat__erase:hover{
  background:#b00020;
  color:#fff;
  border-color:#b00020;
}

/* ===== Support Chat: header-only tint (MVP 1.0) ===== */
.eedge-expert-chat--support .eedge-expert-chat__header{
  background:#4a5a68;                       /* calm slate tone */
  border-bottom:1px solid rgba(255,255,255,.18);
}
.eedge-expert-chat--support .eedge-expert-chat__title{
  color:#ffffff;                            /* readable on slate */
}
.eedge-expert-chat--support .eedge-expert-chat__header .eedge-expert-chat__close{
  color:#ffffff;
  border:1px solid rgba(255,255,255,.30);
}
.eedge-expert-chat--support .eedge-expert-chat__header .eedge-expert-chat__close:hover{
  background:rgba(255,255,255,.16);
}

/* ===== Floating Support Icon (Top Right) ===== */
.eedge-support-icon{
  position:fixed;
  top:80px;
  right:180px;
  background:transparent;
  border:none;
  cursor:pointer;
  padding:6px;
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:100000;
}

.eedge-support-icon svg{
  display:block;
  transition: all 0.2s ease;
}

/* Hover state */
.eedge-support-icon:hover svg path,
.eedge-support-icon:hover svg circle{
  stroke:#ffffff;
  fill:#ffffff;
}

.eedge-support-icon:hover{
  background:#2d0a45;
  border-radius:8px;
}