/* SMPP Gateway - Custom Antora Dark Theme
   Comprehensive override for all Antora UI elements
*/

/* ===== CSS VARIABLES ===== */
:root {
  --color-brand: #3b82f6;
  --color-brand-light: #60a5fa;
  --color-brand-dark: #1d4ed8;
  --color-bg-dark: #0f172a;
  --color-bg-card: #1e293b;
  --color-bg-elevated: #273449;
  --color-text: #f8fafc;
  --color-text-muted: #94a3b8;
  --color-border: #334155;
  --color-border-light: #475569;
}

/* ===== FONTS ===== */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap');

html {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
}

body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
}

code, pre, kbd, .literalblock pre, .listingblock pre {
  font-family: 'JetBrains Mono', 'SFMono-Regular', Consolas, 'Liberation Mono', monospace !important;
}

/* ===== GLOBAL DARK BACKGROUND ===== */
html,
body,
.body {
  background: var(--color-bg-dark) !important;
  color: var(--color-text) !important;
}

/* ===== NAVBAR ===== */
.navbar {
  background: var(--color-bg-card) !important;
  border-bottom: 1px solid var(--color-border) !important;
}

.navbar-brand {
  color: var(--color-text) !important;
}

.navbar-brand .navbar-item {
  color: var(--color-text) !important;
  font-weight: 600;
}

.navbar-item,
.navbar-link {
  color: var(--color-text-muted) !important;
}

.navbar-item:hover,
.navbar-link:hover,
.navbar-item:focus,
.navbar-link:focus {
  color: var(--color-text) !important;
  background: transparent !important;
}

.navbar-burger span {
  background-color: var(--color-text) !important;
}

.navbar-menu {
  background: var(--color-bg-card) !important;
}

.navbar-dropdown {
  background: var(--color-bg-card) !important;
  border: 1px solid var(--color-border) !important;
}

.navbar-dropdown .navbar-item {
  color: var(--color-text-muted) !important;
}

.navbar-dropdown .navbar-item:hover {
  background: var(--color-bg-elevated) !important;
  color: var(--color-text) !important;
}

/* ===== MAIN LAYOUT ===== */
.body {
  background: var(--color-bg-dark) !important;
}

.body.is-article {
  background: var(--color-bg-dark) !important;
}

main,
main.article {
  background: var(--color-bg-dark) !important;
}

.article {
  background: var(--color-bg-dark) !important;
}

/* ===== TOOLBAR ===== */
.toolbar {
  background: var(--color-bg-card) !important;
  color: var(--color-text-muted) !important;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-shadow: 0 1px 0 var(--color-border);
  box-shadow: 0 1px 0 var(--color-border);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: .83333rem;
  height: 2.5rem;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  position: sticky;
  top: 3.5rem;
  z-index: 2;
}

.toolbar a {
  color: var(--color-text-muted) !important;
}

.toolbar a:hover {
  color: var(--color-text) !important;
}

/* ===== BREADCRUMBS ===== */
.breadcrumbs {
  background: transparent !important;
}

.breadcrumbs ul {
  background: transparent !important;
}

.breadcrumbs a {
  color: var(--color-text-muted) !important;
}

.breadcrumbs a:hover {
  color: var(--color-brand-light) !important;
}

.breadcrumbs li::after {
  color: var(--color-border-light) !important;
}

/* ===== LEFT NAVIGATION PANEL ===== */
.nav-panel-explore,
.navigation-explore,
aside.nav {
  background: var(--color-bg-card) !important;
  border-right: 1px solid var(--color-border) !important;
}

.nav-panel-menu,
.navigation-menu {
  background: var(--color-bg-card) !important;
}

.nav-container {
  background: var(--color-bg-card) !important;
}

.nav {
  background: var(--color-bg-card) !important;
}

.nav-menu {
  background: var(--color-bg-card) !important;
}

/* Component/version selector */
.nav-panel-explore .context {
  background: var(--color-bg-elevated) !important;
  font-size: .83333rem;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  color: var(--color-text-muted) !important;
  -webkit-box-shadow: 0 1px 0 var(--color-border);
  box-shadow: 0 1px 0 var(--color-border);
  padding: 0 .5rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  line-height: 1;
  height: 2.5rem;
}

.nav-panel-explore .context .title {
  color: var(--color-text) !important;
}

.nav-panel-explore .context .version {
  background: var(--color-bg-card) !important;
  color: white !important;
  padding: 4px 10px !important;
  border-radius: 4px !important;
}

.nav-panel-explore .components {
  background: var(--color-bg-card) !important;
}

.nav-panel-explore .component {
  background: var(--color-bg-card) !important;
}

.nav-panel-explore .component .title {
  color: var(--color-text) !important;
}

.nav-panel-explore .component .versions .version {
  background: var(--color-bg-elevated) !important;
  color: var(--color-text-muted) !important;
}

.nav-panel-explore .component .versions .version.is-current,
.nav-panel-explore .component .versions .version.is-latest {
  background: var(--color-brand) !important;
  color: white !important;
}

.nav-panel-explore .component .version a {
  background: transparent !important;
  border-radius: .25rem !important;
  white-space: nowrap !important;
  padding: .25em .5em !important;
  display: inherit !important;
  opacity: .75 !important;
}

.nav-panel-explore .component .is-current a {
  background: #424242 !important;
  color: #f0f0f0 !important;
  font-weight: 600 !important;
  opacity: 1 !important;
  border: 2px solid var(--color-brand) !important;
}

/* Navigation tree */
.nav-list {
  background: transparent !important;
}

.nav-list .nav-item {
  border-left-color: var(--color-border) !important;
}

.nav-list .nav-item.is-active {
  border-left-color: var(--color-brand) !important;
}

.nav-menu a,
.nav-list a,
.nav-link,
.nav-text {
  color: var(--color-text-muted) !important;
}

.nav-menu a:hover,
.nav-list a:hover {
  color: var(--color-text) !important;
}

.nav-menu a.is-current-page,
.nav-list a.is-current-page,
.nav-item.is-current-page > .nav-link {
  color: var(--color-brand-light) !important;
  font-weight: 600 !important;
}

.nav-item-toggle {
  background: transparent !important;
}

.nav-item-toggle::before {
  border-color: var(--color-text-muted) transparent transparent !important;
}

/* ===== MAIN CONTENT AREA ===== */
.doc,
.doc-content,
article.doc {
  background: var(--color-bg-dark) !important;
  color: var(--color-text) !important;
}

.doc h1,
.doc h2,
.doc h3,
.doc h4,
.doc h5,
.doc h6 {
  color: var(--color-text) !important;
}

.doc h1 {
  border-bottom: 1px solid var(--color-border) !important;
  padding-bottom: 0.5rem;
}

.doc h2:not(.discrete) {
  border-bottom: 1px solid var(--color-border-light) !important;
  margin-left: -1rem !important;
  margin-right: -1rem !important;
  padding: .4rem 1rem 0.5rem !important;
}

.doc a {
  color: var(--color-brand-light) !important;
}

.doc a:hover {
  color: var(--color-text) !important;
}

.doc a code {
  color: var(--color-brand-light) !important;
}

.doc p,
.doc li,
.doc td,
.doc dd {
  color: var(--color-text-muted) !important;
}

.doc strong {
  color: var(--color-text) !important;
}

/* ===== CODE BLOCKS ===== */
.doc code {
  background: var(--color-bg-card) !important;
  color: var(--color-brand-light) !important;
  padding: 0.15em 0.4em !important;
  border-radius: 4px !important;
}

.doc pre {
  background: var(--color-bg-card) !important;
  border: 1px solid var(--color-border) !important;
  border-radius: 8px !important;
  font-size: .75rem !important;
  line-height: 1.5 !important;
  margin: 0 !important;
}

.doc pre code {
  background: var(--color-bg-dark) !important;
  color: var(--color-text) !important;
  padding: 0 !important;
}

.literalblock pre,
.listingblock pre {
  background: var(--color-bg-card) !important;
  border: 1px solid var(--color-border) !important;
  border-radius: 8px !important;
}

.doc .listingblock pre:not(.highlight),
.doc .literalblock pre,
.doc pre.highlight > code {
  display: block !important;
  overflow-x: auto !important;
  padding: 2em !important;
}

.listingblock .title,
.literalblock .title {
  color: var(--color-text-muted) !important;
  font-size: 0.85em !important;
}

/* Highlight.js - comprehensive dark theme */
.hljs,
pre.hljs,
code.hljs,
pre code.hljs,
.listingblock pre.hljs,
.listingblock code.hljs,
pre.highlight code,
pre.highlight,
.highlight pre,
.highlight code {
  background: var(--color-bg-card) !important;
  color: var(--color-text) !important;
}

/* Ensure code inside highlight blocks stays dark */
pre.highlight > code,
.listingblock pre > code,
.literalblock pre > code {
  background: var(--color-bg-card) !important;
  color: var(--color-text) !important;
}

/* Syntax highlighting colors - Material dark palette */
.hljs-keyword,
.hljs-selector-tag,
.hljs-title,
.hljs-section,
.hljs-doctag,
.hljs-name,
.hljs-strong {
  color: #c792ea !important;
}

.hljs-string,
.hljs-attr,
.hljs-attribute {
  color: #c3e88d !important;
}

.hljs-number,
.hljs-literal,
.hljs-symbol,
.hljs-bullet {
  color: #f78c6c !important;
}

.hljs-comment,
.hljs-quote {
  color: #546e7a !important;
  font-style: italic;
}

.hljs-built_in,
.hljs-type,
.hljs-class .hljs-title,
.hljs-params {
  color: #ffcb6b !important;
}

.hljs-variable,
.hljs-template-variable,
.hljs-tag {
  color: #f07178 !important;
}

.hljs-function,
.hljs-title.function_ {
  color: #82aaff !important;
}

.hljs-meta,
.hljs-meta .hljs-keyword {
  color: #89ddff !important;
}

.hljs-addition {
  color: #c3e88d !important;
  background: rgba(195, 232, 141, 0.1) !important;
}

.hljs-deletion {
  color: #f07178 !important;
  background: rgba(240, 113, 120, 0.1) !important;
}

.hljs-emphasis {
  font-style: italic;
}

.hljs-link {
  color: var(--color-brand-light) !important;
}

/* Override any white/light backgrounds that highlight.js might apply */
[class*="highlight"] pre,
[class*="highlight"] code,
pre[class*="highlight"],
code[class*="highlight"] {
  background: var(--color-bg-card) !important;
  color: var(--color-text) !important;
}

/* ===== TABLES ===== */
.doc table {
  background: var(--color-bg-card) !important;
  border: 1px solid var(--color-border) !important;
  border-radius: 8px !important;
  overflow: hidden !important;
  border-collapse: separate !important;
}

.doc table thead {
  background: rgba(59, 130, 246, 0.15) !important;
}

.doc table th {
  color: var(--color-text) !important;
  border-bottom: 1px solid var(--color-border) !important;
  background: transparent !important;
}

.doc table td {
  color: var(--color-text-muted) !important;
  border-bottom: 1px solid var(--color-border) !important;
  background: transparent !important;
}

.doc table tr:last-child td {
  border-bottom: none !important;
}

.doc table tbody tr:hover {
  background: rgba(59, 130, 246, 0.05) !important;
}

.doc table.tableblock,
.doc table.tableblock > * > tr > * {
  border: none !important;
}

/* ===== ADMONITION BLOCKS ===== */
.admonitionblock,
.doc .admonitionblock {
  background: var(--color-bg-card) !important;
  border: 1px solid var(--color-border) !important;
  border-radius: 8px !important;
  margin: 1.5rem 0 !important;
}

.admonitionblock td.icon {
  background: transparent !important;
}

.admonitionblock td.content {
  color: var(--color-text-muted) !important;
  background: transparent !important;
}

.admonitionblock.note { border-left: 4px solid var(--color-brand) !important; }
.admonitionblock.tip { border-left: 4px solid #10b981 !important; }
.admonitionblock.warning { border-left: 4px solid #f59e0b !important; }
.admonitionblock.caution { border-left: 4px solid #ef4444 !important; }
.admonitionblock.important { border-left: 4px solid #8b5cf6 !important; }

/* ===== EXAMPLE BLOCKS ===== */
.exampleblock,
.doc .exampleblock {
  background: var(--color-bg-card) !important;
  border: 1px solid var(--color-border) !important;
  border-radius: 8px !important;
  margin: 1.5rem 0 !important;
  padding: 1.5rem !important;
}

.exampleblock > .content,
.doc .exampleblock > .content,
.doc details.result > .content {
  background: transparent !important;
  color: var(--color-text) !important;
  border: none !important;
}

.exampleblock .title {
  color: var(--color-text) !important;
  font-weight: 600 !important;
  margin-bottom: 1rem !important;
}

/* ===== SIDEBAR BLOCKS ===== */
.sidebarblock,
.doc .sidebarblock {
  background: var(--color-bg-card) !important;
  border: 1px solid var(--color-border) !important;
  border-radius: 8px !important;
  padding: 1.5rem !important;
}

.sidebarblock > .content {
  background: transparent !important;
}

.sidebarblock .title {
  color: var(--color-text) !important;
}

/* ===== OPEN BLOCKS ===== */
.openblock,
.doc .openblock {
  background: transparent !important;
}

.openblock > .content {
  background: transparent !important;
}

/* ===== QUOTE BLOCKS ===== */
.quoteblock,
.doc .quoteblock {
  background: var(--color-bg-card) !important;
  border-left: 4px solid var(--color-brand) !important;
  padding: 1rem 1.5rem !important;
  border-radius: 0 8px 8px 0 !important;
}

.quoteblock blockquote {
  background: transparent !important;
  border: none !important;
}

.quoteblock .attribution {
  color: var(--color-text-muted) !important;
}

/* ===== VERSE BLOCKS ===== */
.verseblock,
.doc .verseblock {
  background: var(--color-bg-card) !important;
  border: 1px solid var(--color-border) !important;
  border-radius: 8px !important;
  padding: 1.5rem !important;
}

/* ===== DEFINITION LISTS ===== */
.dlist,
.doc .dlist {
  background: transparent !important;
}

.dlist dt,
.doc .dlist dt,
.hdlist1 {
  color: var(--color-text) !important;
  font-weight: 600 !important;
}

.dlist dd,
.doc .dlist dd {
  color: var(--color-text-muted) !important;
  margin-left: 1rem !important;
}

.dlist dl {
  background: transparent !important;
}

/* Horizontal definition lists */
.hdlist,
.doc .hdlist {
  background: transparent !important;
}

.hdlist table {
  background: transparent !important;
  border: none !important;
}

.hdlist td {
  background: transparent !important;
  border: none !important;
  padding: 0.5rem 1rem 0.5rem 0 !important;
  vertical-align: top !important;
}

.hdlist td.hdlist1 {
  color: var(--color-text) !important;
  font-weight: 600 !important;
}

.hdlist td.hdlist2 {
  color: var(--color-text-muted) !important;
}

/* ===== COLIST (Callout lists) ===== */
.colist,
.doc .colist {
  background: transparent !important;
}

.colist td {
  background: transparent !important;
  border: none !important;
  color: var(--color-text-muted) !important;
}

.colist td b {
  color: var(--color-brand-light) !important;
}

/* ===== IMAGE BLOCKS ===== */
.imageblock,
.doc .imageblock {
  background: transparent !important;
}

.imageblock .title {
  color: var(--color-text-muted) !important;
  font-size: 0.9em !important;
}

/* ===== TOC (RIGHT SIDEBAR) ===== */
.toc,
.toc-menu,
aside.toc {
  background: var(--color-bg-card) !important;
  border-left: 1px solid var(--color-border) !important;
}

.toc .toc-menu {
  background: var(--color-bg-card) !important;
}

.toc-menu h3,
.toc .toc-menu h3 {
  color: var(--color-text) !important;
}

.toc-menu a,
.toc a {
  color: var(--color-text-muted) !important;
}

.toc-menu a:hover,
.toc a:hover {
  color: var(--color-text) !important;
}

.toc-menu a.is-active,
.toc a.is-active {
  color: var(--color-brand-light) !important;
}

/* ===== PAGINATION (PREV/NEXT) ===== */
.pagination,
nav.pagination {
  border-top: 1px solid var(--color-border) !important;
  background: transparent !important;
}

.pagination a,
nav.pagination a {
  color: var(--color-text-muted) !important;
}

.pagination a:hover,
nav.pagination a:hover {
  color: var(--color-text) !important;
}

/* ===== FOOTER ===== */
.footer,
footer.footer {
  background: var(--color-bg-card) !important;
  border-top: 1px solid var(--color-border) !important;
  color: var(--color-text-muted) !important;
}

.footer a {
  color: var(--color-text-muted) !important;
}

.footer a:hover {
  color: var(--color-text) !important;
}

.footer p {
  color: var(--color-text-muted) !important;
}

/* ===== TABS ===== */
.tabs,
.tabset {
  background: transparent !important;
}

.tabs ul {
  border-bottom: 1px solid var(--color-border) !important;
  background: transparent !important;
}

.tabs li {
  background: transparent !important;
}

.tabs li a {
  color: var(--color-text-muted) !important;
  border-bottom-color: transparent !important;
}

.tabs li.is-active a,
.tabs li a.is-active {
  color: var(--color-brand-light) !important;
  border-bottom-color: var(--color-brand) !important;
}

.tabset .tabs-content,
.tabset .tab-content {
  background: var(--color-bg-card) !important;
  border: 1px solid var(--color-border) !important;
  border-top: none !important;
  border-radius: 0 0 8px 8px !important;
}

/* ===== SEARCH ===== */
#search-input,
.search input,
input.search {
  background: var(--color-bg-card) !important;
  border: 1px solid var(--color-border) !important;
  color: var(--color-text) !important;
  border-radius: 6px !important;
}

#search-input::placeholder,
.search input::placeholder {
  color: var(--color-text-muted) !important;
}

#search-input:focus,
.search input:focus {
  border-color: var(--color-brand) !important;
  outline: none !important;
}

.search-results {
  background: var(--color-bg-card) !important;
  border: 1px solid var(--color-border) !important;
}

.search-result-item {
  border-bottom: 1px solid var(--color-border) !important;
}

.search-result-item:hover {
  background: var(--color-bg-elevated) !important;
}

/* ===== EDIT THIS PAGE ===== */
.edit-this-page,
.page-versions {
  background: transparent !important;
}

.edit-this-page a {
  color: var(--color-text-muted) !important;
}

.edit-this-page a:hover {
  color: var(--color-brand-light) !important;
}

/* ===== MISC ELEMENTS ===== */
hr {
  border-color: var(--color-border) !important;
  background: var(--color-border) !important;
}

blockquote {
  border-left-color: var(--color-brand) !important;
  background: var(--color-bg-card) !important;
}

blockquote p {
  color: var(--color-text-muted) !important;
}

/* Definition lists */
.doc dt {
  color: var(--color-text) !important;
}

.doc dd {
  color: var(--color-text-muted) !important;
}

/* ===== SELECTION ===== */
::selection {
  background: rgba(59, 130, 246, 0.3) !important;
  color: var(--color-text) !important;
}

/* ===== SCROLLBARS ===== */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: var(--color-bg-dark);
}

::-webkit-scrollbar-thumb {
  background: var(--color-border);
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--color-text-muted);
}

/* Firefox scrollbar */
* {
  scrollbar-width: thin;
  scrollbar-color: var(--color-border) var(--color-bg-dark);
}

/* ===== MOBILE ===== */
@media (max-width: 1023px) {
  .nav-panel-menu {
    background: var(--color-bg-card) !important;
  }

  .nav-panel-menu.is-active {
    background: var(--color-bg-card) !important;
  }

  .navbar-menu.is-active {
    background: var(--color-bg-card) !important;
  }
}

/* ===== FIX WHITE GAPS ===== */
.body::before,
.body::after,
main::before,
main::after,
.doc::before,
.doc::after {
  display: none !important;
}

/* ===== AGGRESSIVE DARK MODE OVERRIDES ===== */
/* Force dark background on any remaining white elements */

/* All containers */
div, section, article, aside, nav, header, footer, main, span {
  background-color: inherit;
}

/* Any element with explicit white background */
[style*="background: white"],
[style*="background-color: white"],
[style*="background:#fff"],
[style*="background-color:#fff"],
[style*="background: #fff"],
[style*="background-color: #fff"] {
  background: var(--color-bg-dark) !important;
}

/* Sectionbody - common wrapper */
.sectionbody,
.doc .sectionbody {
  background: transparent !important;
}

/* Paragraph blocks */
.paragraph,
.doc .paragraph {
  background: transparent !important;
}

.paragraph p {
  color: var(--color-text-muted) !important;
}

/* Ulist and Olist */
.ulist,
.olist,
.doc .ulist,
.doc .olist {
  background: transparent !important;
}

.ulist ul,
.olist ol {
  background: transparent !important;
}

/* Content wrapper */
.content,
.doc .content {
  background: transparent !important;
}

/* Catch-all for any stray backgrounds */
.doc > *,
.article > *,
.sectionbody > * {
  background-color: transparent;
}

/* Fix any white borders */
.doc *,
.article * {
  border-color: var(--color-border);
}

/* Header element */
.header {
  background: var(--color-bg-card) !important;
  border-bottom: 1px solid var(--color-border) !important;
}

/* Navbar logo styling */
.navbar-logo {
  height: 32px;
  width: auto;
  margin-right: 0.5rem;
}

.navbar-title {
  font-weight: 600;
  color: var(--color-text) !important;
}

.navbar-brand a {
  display: flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
}

/* Page content wrapper */
.page,
.article-wrapper {
  background: var(--color-bg-dark) !important;
}

/* Any wrapper class */
[class*="wrapper"],
[class*="container"] {
  background-color: transparent;
}

/* Fix print button if present */
.print-button,
.pdf-button {
  background: var(--color-bg-card) !important;
  color: var(--color-text) !important;
  border: 1px solid var(--color-border) !important;
}

/* Version dropdown */
.version-popup,
.versions-popup {
  background: var(--color-bg-card) !important;
  border: 1px solid var(--color-border) !important;
}

/* Any popup or dropdown */
[class*="popup"],
[class*="dropdown"] {
  background: var(--color-bg-card) !important;
  border-color: var(--color-border) !important;
}

/* Tooltip */
[class*="tooltip"] {
  background: var(--color-bg-elevated) !important;
  color: var(--color-text) !important;
  border: 1px solid var(--color-border) !important;
}

/* Modal/dialog */
[class*="modal"],
[class*="dialog"] {
  background: var(--color-bg-card) !important;
  border: 1px solid var(--color-border) !important;
}

/* Override any inline styles on body */
body[style] {
  background: var(--color-bg-dark) !important;
}

/* Literal blocks */
.literalblock,
.doc .literalblock {
  background: transparent !important;
}

.literalblock pre {
  background: var(--color-bg-card) !important;
  border: 1px solid var(--color-border) !important;
  border-radius: 8px !important;
  padding: 1rem !important;
}

/* Listing block container */
.listingblock,
.doc .listingblock {
  background: transparent !important;
  margin: 1.5rem 0 !important;
}

/* Source block */
.sourceblock,
.doc .sourceblock {
  background: transparent !important;
}

/* Any pre element should have dark bg */
pre {
  background: var(--color-bg-card) !important;
  color: var(--color-text) !important;
}

/* Inline code */
code {
  background: var(--color-bg-card) !important;
  color: var(--color-brand-light) !important;
}
