/* ===== Claude Geni — Obsidian Publish styling ===== */
/* Ported from the vault's genealogy.css snippet, adapted for the Publish site + a
   custom image lightbox (publish.js) standing in for the Image Toolkit plugin. */

/* Primary profile photo (embedded with |220): float right, portrait-sized */
img[width="220"], img[alt="220"]{
  float: right;
  width: 180px !important;
  height: auto !important;
  max-height: 240px;
  object-fit: cover;
  border-radius: 10px;
  margin: 2px 0 14px 22px;
  border: 1px solid var(--background-modifier-border);
  box-shadow: 0 4px 14px rgba(0,0,0,.45);
  cursor: zoom-in;
}

/* Gallery thumbnails (baked as a row of |180 embeds): neat uniform cropped squares */
img[width="180"], img[alt="180"]{
  width: 128px !important;
  height: 128px !important;
  object-fit: cover;
  border-radius: 8px;
  margin: 0 8px 8px 0;
  vertical-align: top;
  border: 1px solid var(--background-modifier-border);
  box-shadow: 0 2px 8px rgba(0,0,0,.35);
  cursor: zoom-in;
  transition: transform .15s ease, box-shadow .15s ease;
}
img[width="180"]:hover, img[alt="180"]:hover{
  transform: scale(1.05); box-shadow: 0 6px 20px rgba(0,0,0,.5);
  position: relative; z-index: 2;
}

/* ===== (legacy) [!gallery] callout — kept in case Publish renders it ===== */
.callout[data-callout="gallery"]{
  border: none; background: transparent; padding: 0; margin: .6em 0 1em;
}
.callout[data-callout="gallery"] > .callout-title{
  padding: 0 0 .5em 0; color: var(--text-muted); font-weight: 600;
}
.callout[data-callout="gallery"] > .callout-title .callout-icon{ display:none; }
.callout[data-callout="gallery"] > .callout-content{
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 12px; padding: 0;
}
.callout[data-callout="gallery"] > .callout-content > *{
  margin: 0; font-size: .72em; color: var(--text-muted);
  text-align: center; line-height: 1.25; word-break: break-word;
}
.callout[data-callout="gallery"] .image-embed,
.callout[data-callout="gallery"] .internal-embed{ display:block; width:100%; }
.callout[data-callout="gallery"] .image-embed img,
.callout[data-callout="gallery"] img{
  width: 100% !important; height: 160px !important; object-fit: cover;
  border-radius: 10px; border: 1px solid var(--background-modifier-border);
  box-shadow: 0 2px 8px rgba(0,0,0,.35); margin-bottom: 5px;
  cursor: zoom-in; transition: transform .15s ease, box-shadow .15s ease;
}
.callout[data-callout="gallery"] .image-embed img:hover,
.callout[data-callout="gallery"] img:hover,
img[width="220"]:hover, img[alt="220"]:hover{
  transform: scale(1.04); box-shadow: 0 6px 20px rgba(0,0,0,.5);
  position: relative; z-index: 2; cursor: zoom-in;
}

/* Inline (non-gallery) evidence scans: keep them from overflowing, add zoom cue */
.markdown-preview-view .internal-embed.image-embed img,
.markdown-rendered .internal-embed.image-embed img{
  max-width: 100%; height: auto; border-radius: 8px; cursor: zoom-in;
}

/* Side / relationship badge (first blockquote in a person note) */
.markdown-preview-view blockquote:first-of-type,
.markdown-rendered blockquote:first-of-type{
  border-left: 3px solid var(--interactive-accent);
  background: var(--background-secondary);
  border-radius: 6px;
  padding: 6px 12px;
  font-size: .92em;
}
.markdown-preview-view h3, .markdown-rendered h3{ clear: right; }

/* ===== Place metadata tables (no border) ===== */
.place-meta{ border-collapse: collapse; margin: .3em 0 1em; }
.place-meta td, .place-meta th{ border: none !important; padding: 2px 18px 2px 0; vertical-align: top; }
.place-meta tr td:first-child{ color: var(--text-muted); font-weight: 600; white-space: nowrap; }
.place-meta.place-eras th{
  text-align: left; color: var(--text-muted); font-weight: 600;
  border-bottom: 1px solid var(--background-modifier-border) !important;
}
.place-meta.place-eras td:first-child{ color: var(--text-normal); font-weight: 400; white-space: nowrap; }
.place-meta td[dir="rtl"]{ font-size: 1.15em; }

/* ===== Place roster (now a baked static table) — compact rows ===== */
.place-roster table{ font-size: .82em; line-height: 1.25; }
.place-roster table td, .place-roster table th{
  padding: 2px 10px 2px 0; vertical-align: top;
}

/* ===== Image lightbox overlay (publish.js) ===== */
#cg-lightbox{
  position: fixed; inset: 0; z-index: 9999; display: none;
  background: rgba(0,0,0,.9); cursor: zoom-out;
  align-items: center; justify-content: center; overflow: hidden;
}
#cg-lightbox.cg-open{ display: flex; }
#cg-lightbox img{
  max-width: 94vw; max-height: 92vh; border-radius: 6px;
  box-shadow: 0 10px 50px rgba(0,0,0,.7);
  transform-origin: center center; user-select: none; -webkit-user-drag: none;
  will-change: transform;
}
#cg-lightbox .cg-cap{
  position: fixed; bottom: 14px; left: 0; right: 0; text-align: center;
  color: #eee; font-size: 13px; padding: 0 20px; pointer-events: none;
  text-shadow: 0 1px 3px #000;
}
#cg-lightbox .cg-hint{
  position: fixed; top: 12px; right: 16px; color: #bbb; font-size: 12px; pointer-events: none;
}