/* Container + header */
/* added below as a test */
/* Make the header feel attached to the code block */
.ww-codeblock-wrapper .ww-code-header { margin-bottom: 0 !important; padding: .5rem .75rem; background: #f7f7f7; border-bottom: 1px solid #e5e5e5; }
.ww-codeblock-wrapper { border: 1px solid #e5e5e5; border-radius: 10px; overflow: hidden; }

/* Kill any theme margins around the code area */
.ww-codeblock-wrapper .ww-pre { margin-top: 0 !important; margin-bottom: 0 !important; border-radius: 0; background: #fff; }

/* Hard-reset Uncode's inline code styling when it's inside our pre */
.ww-codeblock-wrapper .ww-pre code {
  display: block !important;
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  color: inherit !important;
}

/* Extra belt-and-suspenders: Prism token spans should never have margins */
.ww-codeblock-wrapper .ww-pre code .token { margin: 0 !important; padding: 0 !important; }

/* If Uncode sets generic pre/code margins, overrule them here too */
.ww-codeblock-wrapper pre { margin: 0 !important; }
.ww-codeblock-wrapper code { margin: 0 !important; padding: 0 !important; }
/* added above as a test */

.ww-codeblock-wrapper {
  position: relative;
  margin: 1.25rem 0;
  font-family: inherit;
}

.ww-code-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  margin-bottom: 0;
}

.ww-code-left {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
}

.ww-code-title {
  font-weight: 600;
  line-height: 1.2;
}

/* Language badge (pedantic but helpful) */
.ww-lang-badge {
  font-size: .75rem;
  line-height: 1;
  padding: .25rem .4rem;
  border-radius: .35rem;
  border: 1px solid rgba(0,0,0,.12);
  background: #f7f7f7;
  letter-spacing: .04em;
  font-weight: 600;
}

/* Buttons in header */
.ww-code-actions {
  display: inline-flex;
  gap: .5rem;
  flex-shrink: 0;
}

.ww-btn {
  appearance: none;
  border: 1px solid rgba(0,0,0,.12);
  padding: .35rem .6rem;
  border-radius: 6px;
  font-size: .875rem;
  line-height: 1;
  background: #fff;
  cursor: pointer;
}
.ww-btn:hover { background: #f6f6f6; }

/* Code block */
.ww-pre {
  border-radius: 10px;
  overflow: auto;
  position: relative;
  margin:top: 0;

  /* Force a consistent mono font + line-height so Prism's line numbers line up exactly */
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !important;
  font-size: 0.95rem;
  line-height: 1.5;
}

/* Make sure Uncode/WPBakery styles don’t collapse the padding */
pre.ww-pre { padding: 1rem; }

/* Line number gutter: ensure left padding so gutter never overlaps */
pre.ww-pre.line-numbers {
  position: relative;
  padding-left: 3.8em !important; /* adjust to 4.2em if your numbers clip */
}

/* Ensure Prism's generated rows follow the same line-height */
pre.line-numbers .line-numbers-rows {
  border-right: 1px solid rgba(0,0,0,.08);
  top: 0;
  bottom: 0;
  line-height: inherit !important;
}

/* Critical: each virtual row uses <span>; inherit line-height for perfect sync */
pre.line-numbers .line-numbers-rows > span {
  line-height: inherit !important;
}

/* Keep code readable with wrapping option */
.ww-softwrap code {
  white-space: pre-wrap;
  word-break: break-word;
}

/* Ensure code is block-level so padding applies uniformly; inherit font/line-height */
.ww-pre > code {
  display: block;
  font: inherit !important;
  line-height: inherit !important;
  tab-size: 2;
}

/* Optional: match Uncode radius on inner Prism elements */
code[class*="language-"], pre[class*="language-"] {
  border-radius: 10px;
}

/* Hide any Prism toolbar from other plugins */
div.prism-toolbar { display: none !important; }