/* Custom Mermaid Diagram Styling for Advanced Slides */

/* Make diagrams responsive and properly sized */
.reveal .mermaid svg {
  min-width: 100%;
  max-width: 100%;
  height: auto;
  max-height: 70vh;
}

/* Ensure mermaid container centers and sizes properly */
.reveal .mermaid {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  margin-top: 0.5em;
}

/* Prevent text from being cropped */
.reveal .mermaid .label,
.reveal .mermaid .edgeLabel,
.reveal .mermaid .nodeLabel,
.reveal .mermaid text {
  overflow: visible !important;
}

/* Match theme colors */
.reveal .mermaid .node rect,
.reveal .mermaid .node circle,
.reveal .mermaid .node polygon {
  stroke: var(--r-main-color);
}

.reveal .mermaid .edgePath .path {
  stroke: var(--r-main-color);
}

.reveal .mermaid .label {
  color: var(--r-main-color);
}

/* Ensure flowchart subgraphs don't get cut off */
.reveal .mermaid .cluster rect {
  rx: 4;
  ry: 4;
}

/* Better spacing for sequence diagrams */
.reveal .mermaid .sequenceNumber {
  fill: white;
}

/* Gantt chart improvements */
.reveal .mermaid .section {
  opacity: 0.9;
}

/* Pie chart label visibility */
.reveal .mermaid .pieTitleText,
.reveal .mermaid .slice {
  font-size: 1em;
}