file_viewer_page.css

.page-title {
  margin: 0;
  font-size: 34px;
  font-weight: 600;
  color: var(--text);
}

.file-header {
  display: grid;
  gap: 8px;
  margin-bottom: 18px;
}

.back-link {
  display: inline-block;
  color: var(--text);
  opacity: 0.85;
  text-decoration: none;
}

.back-link:hover {
  text-decoration: underline;
}

.path {
  color: var(--muted);
}

.panel {
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--panel);
  box-shadow: var(--shadow);
  padding: 14px 16px;
}

.image-panel img {
  max-width: 100%;
  border-radius: 14px;
  display: block;
}

/* .code-panel pre { */
/*   margin: 0; */
/*   overflow: auto; */
/*   padding: 10px; */
/*   border-radius: 14px; */
/*   background: rgba(255, 253, 242, 0.75); */
/* } */
/**/
/* .code-panel code { */
/*   font-size: 13px; */
/*   line-height: 1.6; */
/* } */

/* Dark code block */
.code-panel {
  border: none;
  /* background: #1e1e1e;                 /* container */ */
  /* border: 0.25px solid rgba(109, 71, 21, 0.25); */
  /* border-radius: 5px; */
  /* box-shadow: var(--shadow); */
}

.code-panel pre {
  margin: 0;
  padding: 16px 18px;
  overflow: auto;

  background: #1e1e1e;                 /* actual code bg */
  border-radius: 9px;

  font-size: 13px;
  line-height: 1.6;
}

/* Base code text */
.code-panel code {
  color: #e6e6e6;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
               "Liberation Mono", monospace;
}

/* Line numbers (highlight.js plugin) */
.hljs-ln-numbers {
  color: #6f6f6f;
  border-right: 1px solid #2d2d2d;
  padding-right: 12px;
}

.hljs-ln-code {
  padding-left: 14px;
}


.mono {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
}