/* ═══════════════════════════════════════════════════
   MCAST Research Groups — CSS v1.0
   Scoped to .mcrg-scope
═══════════════════════════════════════════════════ */

.mcrg-scope {
  --rg-navy:   #000043;
  --rg-white:  #ffffff;
  --rg-off:    #f5f5fa;
  --rg-border: #e2e2ee;
  --rg-text:   #1a1a3e;
  --rg-mute:   #6b6b99;
  font-family: 'Montserrat', sans-serif;
  color: var(--rg-text);
  -webkit-font-smoothing: antialiased;
}
.mcrg-scope *, .mcrg-scope *::before, .mcrg-scope *::after { box-sizing: border-box; margin: 0; padding: 0; }

/* ── Discipline colour map (CSS custom props per class) ── */
.mcrg-disc--engineering   { --rg-accent:#003f9e; --rg-bg:#e6ecf8; --rg-clr:#003f9e; --rg-bdr:#b3c3e8; }
.mcrg-disc--humanities    { --rg-accent:#6d0080; --rg-bg:#f4e8f8; --rg-clr:#6d0080; --rg-bdr:#d9aee8; }
.mcrg-disc--social        { --rg-accent:#c5470a; --rg-bg:#fdf0eb; --rg-clr:#c5470a; --rg-bdr:#f4c3aa; }
.mcrg-disc--natural       { --rg-accent:#005c3a; --rg-bg:#e6f4ee; --rg-clr:#005c3a; --rg-bdr:#a8d4be; }
.mcrg-disc--medical       { --rg-accent:#7c0000; --rg-bg:#f8e6e6; --rg-clr:#7c0000; --rg-bdr:#e8a8a8; }
.mcrg-disc--agricultural  { --rg-accent:#4a5c00; --rg-bg:#eff2e6; --rg-clr:#4a5c00; --rg-bdr:#c4cc96; }
.mcrg-disc--educational   { --rg-accent:#3a3a6a; --rg-bg:#ebebf4; --rg-clr:#3a3a6a; --rg-bdr:#c0c0d8; }
.mcrg-disc--default       { --rg-accent:#000043; --rg-bg:rgba(0,0,67,.07); --rg-clr:#000043; --rg-bdr:rgba(0,0,67,.2); }

/* ══════════════════════════════════════════════════
   TOOLBAR
══════════════════════════════════════════════════ */
.mcrg-toolbar {
  background: var(--rg-white);
  border: 1.5px solid var(--rg-border);
  border-radius: 12px;
  box-shadow: 0 2px 14px rgba(0,0,67,.06);
  margin-bottom: 20px;
  padding: 14px 18px;
  display: flex; flex-direction: column; gap: 10px;
}
.mcrg-toolbar-row1 { display: flex; align-items: center; gap: 10px; }
.mcrg-search-wrap  { position: relative; flex: 1; max-width: 340px; }
.mcrg-search-wrap i { position: absolute; left: 11px; top: 50%; transform: translateY(-50%); color: var(--rg-mute); font-size: 12px; pointer-events: none; }
.mcrg-search {
  width: 100%; padding: 9px 12px 9px 32px;
  border: 1.5px solid var(--rg-border); border-radius: 8px;
  font-family: 'Montserrat', sans-serif; font-size: 13px;
  color: var(--rg-text); background: var(--rg-off); outline: none;
  transition: border-color .2s, box-shadow .2s;
}
.mcrg-search:focus { border-color: var(--rg-navy); box-shadow: 0 0 0 3px rgba(0,0,67,.09); background: var(--rg-white); }
.mcrg-meta { margin-left: auto; font-size: 12px; color: var(--rg-mute); white-space: nowrap; }
.mcrg-meta strong { color: var(--rg-navy); font-weight: 700; }

.mcrg-chips {
  display: flex; flex-wrap: wrap; gap: 6px;
  padding-top: 10px; border-top: 1px solid var(--rg-border);
}
.mcrg-chip {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 7px 12px; border-radius: 8px;
  border: 1.5px solid var(--rg-border); background: var(--rg-white);
  font-family: 'Montserrat', sans-serif; font-size: 11px; font-weight: 600;
  color: var(--rg-mute); cursor: pointer;
  transition: background .15s, border-color .15s, color .15s; white-space: nowrap;
}
.mcrg-chip:hover { border-color: var(--rg-navy); color: var(--rg-navy); }
.mcrg-chip.is-active { background: var(--rg-navy); border-color: var(--rg-navy); color: #fff; }
.mcrg-chip-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0; }

/* ══════════════════════════════════════════════════
   PANELS — stacked group profiles (no card grid)
══════════════════════════════════════════════════ */
.mcrg-panels {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

/* Each group is rendered as an animated block of sections */
.mcrg-panel-group {
  animation: mcrgFadeUp .35s ease both;
}
@keyframes mcrgFadeUp { from{opacity:0;transform:translateY(10px)} to{opacity:1;transform:translateY(0)} }

/* ══════════════════════════════════════════════════
   DETAIL VIEW — single group full page
══════════════════════════════════════════════════ */
.mcrg-detail { display: flex; flex-direction: column; gap: 16px; animation: mcrgFadeUp .25s ease both; }

/* Hero card */
.mcrg-detail-hero {
  background: var(--rg-white);
  border: 1.5px solid var(--rg-border); border-radius: 12px; padding: 24px 28px;
}
.mcrg-detail-label {
  font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
  color: var(--rg-mute); margin-bottom: 8px;
}
.mcrg-detail-name {
  font-size: 26px; font-weight: 800; color: var(--rg-navy); line-height: 1.25;
  margin-bottom: 14px; word-break: break-word;
}
.mcrg-detail-tag {
  display: inline-flex; align-items: center;
  padding: 4px 12px; border-radius: 4px;
  font-size: 11px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase;
  background: var(--rg-bg, rgba(0,0,67,.07));
  color: var(--rg-clr, var(--rg-navy));
  border: 1.5px solid var(--rg-bdr, rgba(0,0,67,.2));
}

/* Section cards */
.mcrg-section {
  background: var(--rg-white);
  border: 1.5px solid var(--rg-border); border-radius: 12px; padding: 20px 24px;
}
.mcrg-section-title {
  font-size: 16px; font-weight: 700; color: var(--rg-navy);
  margin-bottom: 14px;
}

/* Description text + bullets */
.mcrg-desc { font-size: 14px; line-height: 1.7; color: var(--rg-text); }
.mcrg-desc p { margin-bottom: 10px; }
.mcrg-desc p:last-child { margin-bottom: 0; }
.mcrg-desc ul { padding-left: 0; list-style: none; margin-top: 8px; display: flex; flex-direction: column; gap: 6px; }
.mcrg-desc ul li {
  padding-left: 18px; position: relative; font-size: 13px; color: var(--rg-mute); line-height: 1.5;
}
.mcrg-desc ul li::before {
  content: '•'; position: absolute; left: 0; color: var(--rg-accent, var(--rg-navy)); font-weight: 700;
}

/* Member pills */
.mcrg-members-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 10px;
}
.mcrg-member-pill {
  padding: 10px 14px; border-radius: 8px;
  border: 1.5px solid var(--rg-border); background: var(--rg-off);
  font-size: 13px; font-weight: 500; color: var(--rg-text);
  text-align: center;
}

/* Generic extra section content */
.mcrg-section-text { font-size: 13px; line-height: 1.7; color: var(--rg-text); white-space: pre-wrap; word-break: break-word; }

/* Back button removed — direct display mode */

/* No results */
.mcrg-nores { text-align: center; padding: 50px 20px; color: var(--rg-mute); }
.mcrg-nores i { font-size: 38px; display: block; margin-bottom: 10px; opacity: .2; }

@media (max-width: 600px) {
  .mcrg-grid { grid-template-columns: 1fr; }
  .mcrg-detail-name { font-size: 20px; }
  .mcrg-members-grid { grid-template-columns: 1fr 1fr; }
}

/* ── Link fields (Website / URL / Links columns) ─────────── */
.mcrg-links-wrap {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.mcrg-link-btn {
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  border-radius: 8px;
  border: 1.5px solid var(--rg-accent, var(--rg-navy));
  background: transparent;
  color: var(--rg-accent, var(--rg-navy));
  font-family: 'Montserrat', sans-serif;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none !important;
  transition: background .18s, color .18s;
  align-self: flex-start;
  word-break: break-all;
  cursor: pointer !important;
  pointer-events: auto !important;
  position: relative;
  z-index: 2;
}
.mcrg-link-btn:hover {
  background: var(--rg-accent, var(--rg-navy));
  color: #fff;
}
.mcrg-link-btn i {
  font-size: 11px;
  flex-shrink: 0;
}

/* Inline links inside richText paragraphs / bullets */
.mcrg-desc a.mcrg-link,
.mcrg-link-text a.mcrg-link {
  color: var(--rg-accent, var(--rg-navy)) !important;
  font-weight: 600;
  text-decoration: underline !important;
  text-underline-offset: 3px;
  word-break: break-all;
  cursor: pointer !important;
  pointer-events: auto !important;
  position: relative;
  z-index: 2;
}
.mcrg-desc a.mcrg-link:hover,
.mcrg-link-text a.mcrg-link:hover {
  opacity: .75;
}

/* Plain text fallback in links field */
.mcrg-link-text {
  font-size: 13px;
  color: var(--rg-text);
  line-height: 1.5;
}
