#quarto-content {
    background-color: #1f1f1f !important;
}
  
code{
    font-size: 12px !important;
}
  
  /*Code block label */
  .code-with-copy::before {
    position: absolute;
    top: -3em; 
    left: 1em;
    font-weight: bold;
    font-family: 'Fira Code', monospace;
    padding: 0.5em 0.6em;
    border-radius: 8px;
    font-size: 0.9em;
    z-index: 100;
    color: #cfd8dc;
    border: 1px solid #cfd8dc !important;
  }
  
  .code-with-copy{
    overflow: hidden; /* keeps rounded corners intact */
    position: relative;
    overflow: visible;
  }
  
  /* R code label styles
  .sourceCode.r.code-with-copy::before {
    content: "R Code";
    background-color: #165CAA; subtle dark tag background 
  } 
 
  /* SourceCode Block*/
  div.sourceCode{
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    border-style: solid;
    border-color: transparent; /* color will be set in specific code block styles */
    border-width: 0.5px 2px 0.5px 6px;
    z-index: 2;
    overflow: visible;
    margin-top: 1em;
    margin-bottom: 1em;
    padding-top: 0.5em;
    padding-bottom: 0.5em;
    font-family: 'Fira Code', monospace;
  }
  
  /* GReQL code block styles (bash used) */
  div.sourceCode:has(.bash){
    background-color: #2b2b2b !important;
    border-color: #888888 !important;
  } 
  
  .sourceCode.bash.code-with-copy {
    background-color: #2b2b2b;
  }
  
  /* R code block styles */
  .sourceCode.r.code-with-copy {
    background-color: #1e1e2f;
   }
  
  div.sourceCode:has(.r){
    background-color: #1e1e2f !important;
    border-color: #165CAA !important;
  }  
  
  .footer {
    height: 40px;
  }
  
  .nav-footer {
    background-color: #141414 !important;
  }