/* Code block container */
.code-toolbar{ position:relative; display:block; max-width:100%; }

/* Make sure pre has nice box */
.code-toolbar pre[class*="language-"],
pre.wp-block-code[class*="language-"]{
  position:relative;
  border-radius:12px;
  padding:16px 18px 18px 18px;
  overflow:auto;
  background:#0f1221;
  box-shadow:0 6px 18px rgba(0,0,0,.12);
}

/* Copy button inside the box */
.code-toolbar > .toolbar{
  position:absolute !important;
  right:12px;
  top:10px;
  z-index:3;
}
.code-toolbar > .toolbar .toolbar-item > a,
.code-toolbar > .toolbar .toolbar-item > button{
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.08);
  padding:4px 8px;
  border-radius:8px;
  font-size:12px;
  line-height:1.2;
}

/* General article cosmetics */
.single .entry-content{max-width:72ch;margin-inline:auto;}
.single .entry-content > *{margin-block:1.1em;}
.entry-content a{color:#3345ff;text-decoration:underline;}
.entry-content blockquote{border-inline-start:4px solid #7c3aed;padding:.6em 1em;background:#f7f7fb;border-radius:10px;}
.entry-content table{display:block;overflow:auto;border-radius:10px;}


/* force white on toolbar + button + link */
.code-toolbar > .toolbar{ color:#fff !important; }

.code-toolbar > .toolbar .toolbar-item,
.code-toolbar > .toolbar .toolbar-item > a,
.code-toolbar > .toolbar .toolbar-item > button{
  color:#fff !important;
}

/* tooltip (Copied!) text */
.code-toolbar > .toolbar .toolbar-item > button.copy-to-clipboard-button::after{
  color:#fff !important;
}

/* keep contrast background/border for button */
.code-toolbar > .toolbar .toolbar-item > a,
.code-toolbar > .toolbar .toolbar-item > button{
  background: rgba(255,255,255,.12) !important;
  border: 1px solid rgba(255,255,255,.28) !important;
  border-radius: 8px;
  padding: 4px 8px;
  font-weight: 600;
}