%%{init: {"flowchart": {"defaultRenderer": "elk"}} }%%
graph TB
      a --> b
      a --> c
      b --> d
      c --> d
    
flowchart-elk LR
  subgraph A
  a --> b
  end
  subgraph B
  b
  end
    
%%{init: {"flowchart": {"defaultRenderer": "elk"}} }%%
flowchart TB
  %% I could not figure out how to use double quotes in labels in Mermaid
  subgraph ibm[IBM Espresso CPU]
    core0[IBM PowerPC Broadway Core 0]
    core1[IBM PowerPC Broadway Core 1]
    core2[IBM PowerPC Broadway Core 2]

    rom[16 KB ROM]

    core0 --- core2

    rom --> core2
  end

  subgraph amd[AMD Latte GPU]
    mem[Memory & I/O Bridge]
    dram[DRAM Controller]
    edram[32 MB EDRAM MEM1]
    rom[512 B SEEPROM]

    sata[SATA IF]
    exi[EXI]

    subgraph gx[GX]
      sram[3 MB 1T-SRAM]
    end

    radeon[AMD Radeon R7xx GX2]

    mem --- gx
    mem --- radeon

    rom --- mem

    mem --- sata
    mem --- exi

    dram --- sata
    dram --- exi
  end

  ddr3[2 GB DDR3 RAM MEM2]

  mem --- ddr3
  dram --- ddr3
  edram --- ddr3

  core1 --- mem

  exi --- rtc
  rtc{{rtc}}

flowchart TB
  %% I could not figure out how to use double quotes in labels in Mermaid
  subgraph ibm[IBM Espresso CPU]
    core0[IBM PowerPC Broadway Core 0]
    core1[IBM PowerPC Broadway Core 1]
    core2[IBM PowerPC Broadway Core 2]

    rom[16 KB ROM]

    core0 --- core2

    rom --> core2
  end

  subgraph amd[AMD Latte GPU]
    mem[Memory & I/O Bridge]
    dram[DRAM Controller]
    edram[32 MB EDRAM MEM1]
    rom[512 B SEEPROM]

    sata[SATA IF]
    exi[EXI]

    subgraph gx[GX]
      sram[3 MB 1T-SRAM]
    end

    radeon[AMD Radeon R7xx GX2]

    mem --- gx
    mem --- radeon

    rom --- mem

    mem --- sata
    mem --- exi

    dram --- sata
    dram --- exi
  end

  ddr3[2 GB DDR3 RAM MEM2]

  mem --- ddr3
  dram --- ddr3
  edram --- ddr3

  core1 --- mem

  exi --- rtc
  rtc{{rtc}}

 
      flowchart LR
  B1 --be be--x B2
  B1 --bo bo--o B3
  subgraph Ugge
      B2
      B3
      subgraph inner
          B4
          B5
      end
      subgraph inner2
        subgraph deeper
          C4
          C5
        end
        C6
      end

      B4 --> C4

      B3 -- X --> B4
      B2 --> inner

      C4 --> C5
  end

  subgraph outer
      B6
  end
  B6 --> B5
  
sequenceDiagram
    Customer->>+Stripe: Makes a payment request
    Stripe->>+Bank: Forwards the payment request to the bank
    Bank->>+Customer: Asks for authorization
    Customer->>+Bank: Provides authorization
    Bank->>+Stripe: Sends a response with payment details
    Stripe->>+Merchant: Sends a notification of payment receipt
    Merchant->>+Stripe: Confirms the payment
    Stripe->>+Customer: Sends a confirmation of payment
    Customer->>+Merchant: Receives goods or services
        
      gantt
        title Style today marker (vertical line should be 5px wide and half-transparent blue)
        dateFormat YYYY-MM-DD
        axisFormat %d
        todayMarker stroke-width:5px,stroke:#00f,opacity:0.5
        section Section1
        Today: 1, -1h