/* skillsctl docs - nebari-inspired branding */

:root {
  /* Nebari teal palette */
  --color-link: #20aaa1;
  --color-link-hover: #178f87;
  --color-link-visited: #20aaa1;

  /* Slightly warmer background */
  --body-background: #fafbfc;
  --body-font-color: #2d3748;

  /* Sidebar */
  --sidebar-background: #f7f8fa;

  /* Code blocks */
  --code-background: #f1f5f9;
  --code-font-color: #1a202c;
}

/* Dark mode overrides */
.book-page.is-dark,
[data-theme="dark"] {
  --body-background: #1a1e2e;
  --body-font-color: #e2e8f0;
  --sidebar-background: #151827;
  --code-background: #1e2236;
  --code-font-color: #e2e8f0;
}

/* Links */
a {
  color: var(--color-link);
  text-decoration: none;
}

a:hover {
  color: var(--color-link-hover);
  text-decoration: underline;
}

/* Sidebar active link */
.book-menu nav a.active {
  color: var(--color-link);
  font-weight: 600;
}

/* Header / title area */
.book-brand {
  font-weight: 700;
  font-size: 1.1rem;
  color: var(--color-link);
}

/* Code blocks */
.highlight pre {
  border-radius: 6px;
  border: 1px solid #e2e8f0;
}

/* Inline code */
code:not(.highlight code) {
  background: var(--code-background);
  padding: 0.15em 0.35em;
  border-radius: 3px;
  font-size: 0.9em;
}

/* Tables */
table {
  border-collapse: collapse;
  width: 100%;
}

table th {
  background: #f1f5f9;
  font-weight: 600;
  text-align: left;
}

table th, table td {
  padding: 0.5em 0.75em;
  border: 1px solid #e2e8f0;
}

/* Headings */
h1, h2, h3, h4 {
  color: #1a202c;
  font-weight: 600;
}

h1 {
  border-bottom: 2px solid var(--color-link);
  padding-bottom: 0.3em;
}

/* Content max width for readability */
.book-page .markdown {
  max-width: 48rem;
}

/* Search box */
.book-search input {
  border-color: #e2e8f0;
  border-radius: 6px;
}

.book-search input:focus {
  border-color: var(--color-link);
  outline: none;
  box-shadow: 0 0 0 2px rgba(32, 170, 161, 0.2);
}

/* Footer / GitHub link */
.book-menu nav a[href*="github"] {
  color: var(--body-font-color);
  opacity: 0.7;
}

.book-menu nav a[href*="github"]:hover {
  opacity: 1;
}
