/* Expand / embed shortcode — default skin (host may override) */

/* --- Editor WYSIWYM inline chips (CodeMirror: no vertical margin) --- */

.traven-expand-chip {
  display: inline;
  margin: 0;
  padding: 0 0.05em;
  border: none;
  background: transparent;
  color: var(--traven-expand-link, #64748b);
  text-decoration: underline;
  text-decoration-style: dotted;
  text-underline-offset: 0.15em;
  cursor: pointer;
  font: inherit;
  font-weight: inherit;
}

.traven-expand-chip--embed {
  text-decoration-style: solid;
}

/* --- Reader: Nutshell-style expand trigger (phrasing-safe) --- */

.traven-expand-trigger {
  display: inline;
  margin: 0;
  padding: 0;
  border: none;
  background: transparent;
  color: inherit;
  font: inherit;
  font-weight: inherit;
  text-decoration: underline;
  text-decoration-style: dotted;
  text-underline-offset: 0.15em;
  cursor: pointer;
  vertical-align: baseline;
}

.traven-expand-trigger:hover,
.traven-expand-trigger:focus-visible {
  color: var(--traven-expand-accent, #475569);
  outline: none;
}

.traven-expand-trigger[aria-expanded="true"] {
  color: var(--traven-expand-muted, #94a3b8);
}

/* Panel inserted as nextSibling of trigger — full-width wraps to next line */
.traven-expand-panel {
  display: inline-block;
  box-sizing: border-box;
  width: 100%;
  position: relative;
  margin: 1.25rem 0 0.75rem;
  padding: 0.85rem 1rem;
  border: 1px solid var(--traven-expand-border, #94a3b8);
  border-radius: 6px;
  background: var(--traven-expand-bg, transparent);
  color: var(--traven-expand-fg, inherit);
  vertical-align: top;
}

.traven-expand-panel[hidden] {
  display: none !important;
}

/* Callout pointer (CSS triangle) — left set by positionExpandArrow() */
.traven-expand-panel-arrow {
  width: 0;
  height: 0;
  border-left: 11px solid transparent;
  border-right: 11px solid transparent;
  border-bottom: 11px solid var(--traven-expand-border, #94a3b8);
  position: absolute;
  top: -11px;
  left: 24px;
  pointer-events: none;
}

.traven-expand-panel-arrow::after {
  content: "";
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid var(--traven-expand-caret-fill, var(--traven-bg, var(--color-bg, #fff)));
  position: absolute;
  top: 1px;
  left: -10px;
}

.traven-expand-panel > :not(.traven-expand-panel-arrow):first-of-type,
.traven-expand-panel > .traven-expand-panel-arrow + * {
  margin-top: 0;
}

.traven-expand-panel > :last-child {
  margin-bottom: 0;
}

/* --- Always-on embed (block by nature) --- */

.traven-embed {
  margin: 1rem 0;
}

.traven-embed-content {
  margin-top: 0;
}

.traven-expand-unresolved {
  opacity: 0.7;
  font-style: italic;
}

/* --- Deck / Summary nutshell: Read more CTA (opens full post) --- */

a.traven-expand-read-more {
  display: inline-flex;
  align-items: center;
  gap: 0.35em;
  margin-left: 0.35em;
  text-decoration: underline;
  text-underline-offset: 0.15em;
  white-space: nowrap;
  vertical-align: baseline;
}

a.traven-expand-read-more::after {
  content: "";
  display: inline-block;
  width: 0.85em;
  height: 0.85em;
  flex-shrink: 0;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Crect width='256' height='256' fill='none'/%3E%3Cline x1='136' y1='120' x2='216' y2='40' fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round' stroke-width='24'/%3E%3Cpolyline points='216 104 215.99 40.01 152 40' fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round' stroke-width='24'/%3E%3Cpath d='M184,140v68a8,8,0,0,1-8,8H48a8,8,0,0,1-8-8V80a8,8,0,0,1,8-8h68' fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round' stroke-width='24'/%3E%3C/svg%3E")
    center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Crect width='256' height='256' fill='none'/%3E%3Cline x1='136' y1='120' x2='216' y2='40' fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round' stroke-width='24'/%3E%3Cpolyline points='216 104 215.99 40.01 152 40' fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round' stroke-width='24'/%3E%3Cpath d='M184,140v68a8,8,0,0,1-8,8H48a8,8,0,0,1-8-8V80a8,8,0,0,1,8-8h68' fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round' stroke-width='24'/%3E%3C/svg%3E")
    center / contain no-repeat;
}
