/* ═══════════════════════════════════════════════════════════════════
   malena-doxygen.css
   Custom stylesheet for Malena Framework API Reference (Doxygen)
   Place this file in your Doxygen HTML output directory.
   Reference in Doxyfile:
     HTML_EXTRA_STYLESHEET = malena-doxygen.css
     HTML_HEADER           = doxygen-header.html
     HTML_FOOTER           = doxygen-footer.html
   ═══════════════════════════════════════════════════════════════════ */

/* ── CSS variables matching the tutorial site ──────────────────────── */
:root {
  --ml-bg:        #0e0c1a;
  --ml-bg2:       #13101f;
  --ml-bg3:       #1e1a35;
  --ml-border:    #2a2440;
  --ml-border2:   #3a3060;
  --ml-accent:    #534AB7;
  --ml-accent2:   #a89cf7;
  --ml-teal:      #5DCAA5;
  --ml-text:      #e8e4ff;
  --ml-muted:     #9d94c4;
  --ml-dim:       #6b6491;
  --ml-faint:     #4a4470;
  --ml-code:      #c4b8ff;
}

/* ── Reset / base ──────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }

body {
  background: var(--ml-bg) !important;
  color: var(--ml-text) !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  font-size: 15px !important;
  line-height: 1.7 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* ── MAIN NAV ──────────────────────────────────────────────────────── */
.ml-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 48px;
  border-bottom: 1px solid var(--ml-border);
  background: var(--ml-bg);
  position: sticky;
  top: 0;
  z-index: 200;
}
.ml-nav-logo {
  display: flex;
  align-items: center;
  gap: 10px;
}
.ml-nav-badge {
  width: 32px; height: 32px;
  background: var(--ml-accent);
  border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  text-decoration: none;
  flex-shrink: 0;
}
.ml-nav-name {
  font-size: 15px;
  font-weight: 600;
  color: var(--ml-text);
  text-decoration: none;
}
.ml-nav-links {
  display: flex;
  gap: 26px;
  font-size: 14px;
}
.ml-nav-links a {
  color: var(--ml-muted);
  text-decoration: none;
  transition: color 0.15s;
}
.ml-nav-links a:hover,
.ml-nav-links a.ml-nav-active { color: var(--ml-text); }
.ml-nav-cta {
  display: flex;
  gap: 10px;
}
.ml-btn-ghost {
  padding: 6px 14px;
  border-radius: 8px;
  border: 1px solid var(--ml-border2);
  font-size: 13px;
  color: var(--ml-code);
  background: transparent;
  text-decoration: none;
  transition: all 0.15s;
}
.ml-btn-ghost:hover { background: var(--ml-bg2); border-color: var(--ml-accent); }
.ml-btn-primary {
  padding: 6px 16px;
  border-radius: 8px;
  border: none;
  font-size: 13px;
  font-weight: 500;
  background: var(--ml-accent);
  color: #fff;
  text-decoration: none;
  transition: background 0.15s;
}
.ml-btn-primary:hover { background: #6257cc; }

/* ── DOCS SUB-NAV ──────────────────────────────────────────────────── */
.ml-subnav {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 9px 48px;
  border-bottom: 1px solid var(--ml-border);
  background: var(--ml-bg);
  position: sticky;
  top: 65px;
  z-index: 198;
  font-size: 13px;
}
.ml-subnav-brand {
  font-family: 'JetBrains Mono', monospace;
  font-size: 13px;
  font-weight: 600;
  color: var(--ml-text);
  margin-right: 4px;
}
.ml-subnav-brand span { color: var(--ml-accent2); }
.ml-subnav-sep { color: var(--ml-border); font-size: 16px; margin: 0 6px; }
.ml-subnav a {
  color: var(--ml-dim);
  text-decoration: none;
  padding: 4px 10px;
  border-radius: 6px;
  transition: all 0.15s;
}
.ml-subnav a:hover { color: var(--ml-text); background: var(--ml-bg2); }
.ml-subnav-spacer { flex: 1; }
.ml-subnav-all {
  font-size: 12px;
  color: var(--ml-accent);
  padding: 4px 12px;
  border: 1px solid rgba(83,74,183,0.4);
  border-radius: 6px;
  text-decoration: none;
  transition: all 0.15s;
}
.ml-subnav-all:hover { background: var(--ml-bg2); color: var(--ml-accent2); }

/* ── CONTENT WRAPPER ───────────────────────────────────────────────── */
.ml-dox-wrapper {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 48px 80px;
}

/* ── DOXYGEN LAYOUT OVERRIDES ──────────────────────────────────────── */

/* Top nav bar doxygen generates */
#top { display: none !important; }

/* Search bar */
#MSearchBox, #MSearchSelectWindow, #MSearchResultsWindow {
  font-family: 'Inter', sans-serif !important;
}

/* Side nav tree */
div.ui-resizable-handle { display: none !important; }

#nav-tree {
  background: var(--ml-bg2) !important;
  border-right: 1px solid var(--ml-border) !important;
  padding-top: 8px !important;
}

#nav-tree .selected {
  background: var(--ml-bg3) !important;
  color: var(--ml-accent2) !important;
}

#nav-tree a {
  color: var(--ml-dim) !important;
  font-size: 13px !important;
  font-family: 'Inter', sans-serif !important;
}

#nav-tree a:hover { color: var(--ml-text) !important; }

/* Main doc content */
div#doc-content, #doc-content {
  background: var(--ml-bg) !important;
  color: var(--ml-text) !important;
}

/* Page title */
.title {
  font-size: 28px !important;
  font-weight: 600 !important;
  color: #f0ecff !important;
  letter-spacing: -0.4px !important;
  border-bottom: 1px solid var(--ml-border) !important;
  padding-bottom: 16px !important;
  margin-bottom: 24px !important;
  font-family: 'Inter', sans-serif !important;
}

/* Section headings */
h1, h2.groupheader, h2 {
  font-size: 20px !important;
  font-weight: 600 !important;
  color: #f0ecff !important;
  margin: 32px 0 12px !important;
  padding: 0 !important;
  border-bottom: 1px solid var(--ml-border) !important;
  padding-bottom: 8px !important;
}

h3 {
  font-size: 16px !important;
  font-weight: 500 !important;
  color: var(--ml-text) !important;
  margin: 24px 0 10px !important;
}

/* Body text */
p, div.textblock, .memdoc {
  color: var(--ml-muted) !important;
  font-size: 14px !important;
  line-height: 1.75 !important;
}

/* Member declarations table */
table.memberdecls {
  width: 100% !important;
  border-collapse: collapse !important;
  margin: 16px 0 !important;
  font-size: 13px !important;
}

.mdescLeft, .mdescRight {
  background: transparent !important;
  color: var(--ml-dim) !important;
  padding: 6px 12px !important;
  border-bottom: 1px solid var(--ml-border) !important;
}

.memItemLeft, .memItemRight {
  background: var(--ml-bg2) !important;
  color: var(--ml-text) !important;
  padding: 8px 12px !important;
  border-bottom: 1px solid var(--ml-border) !important;
}

.memItemLeft a, .memItemRight a {
  color: var(--ml-accent2) !important;
  text-decoration: none !important;
}

.memItemLeft a:hover, .memItemRight a:hover {
  color: #fff !important;
  text-decoration: underline !important;
}

/* Member detail blocks */
.memitem {
  background: var(--ml-bg2) !important;
  border: 1px solid var(--ml-border) !important;
  border-radius: 10px !important;
  margin: 16px 0 !important;
  overflow: hidden !important;
  box-shadow: none !important;
}

.memproto {
  background: var(--ml-bg3) !important;
  border-bottom: 1px solid var(--ml-border) !important;
  padding: 12px 16px !important;
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 13px !important;
  color: var(--ml-code) !important;
}

.memdoc {
  padding: 14px 16px !important;
  background: var(--ml-bg2) !important;
}

/* Parameter list */
dl.params dt { color: var(--ml-accent2) !important; font-weight: 500 !important; }
dl.params dd { color: var(--ml-muted) !important; }
dl.returns dt { color: var(--ml-teal) !important; }
dl.returns dd { color: var(--ml-muted) !important; }
dl.note, dl.warning, dl.deprecated {
  background: rgba(83,74,183,0.08) !important;
  border: 1px solid rgba(83,74,183,0.25) !important;
  border-radius: 8px !important;
  padding: 12px 16px !important;
  color: var(--ml-accent2) !important;
}
dl.warning {
  background: rgba(212,160,84,0.08) !important;
  border-color: rgba(212,160,84,0.25) !important;
  color: #d4a054 !important;
}

/* Inline code */
code, tt {
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 12px !important;
  background: var(--ml-bg3) !important;
  color: var(--ml-code) !important;
  padding: 1px 6px !important;
  border-radius: 4px !important;
  border: 1px solid var(--ml-border2) !important;
}

/* Code blocks */
div.fragment, pre.fragment {
  background: #0c0a18 !important;
  border: 1px solid var(--ml-border) !important;
  border-radius: 10px !important;
  padding: 18px 20px !important;
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 13px !important;
  line-height: 1.75 !important;
  color: #c8c4f4 !important;
  margin: 16px 0 !important;
  overflow-x: auto !important;
}

/* Code syntax colors */
div.fragment .keyword     { color: #9d8fff !important; }
div.fragment .keywordtype { color: #79c7e3 !important; }
div.fragment .keywordflow { color: #9d8fff !important; }
div.fragment .stringliteral { color: #a8e6c6 !important; }
div.fragment .comment     { color: #3d3a60 !important; font-style: italic !important; }
div.fragment .preprocessor { color: #c4b8ff !important; }
div.fragment .charliteral  { color: #f4c09a !important; }

/* Line numbers */
div.lineno {
  color: var(--ml-faint) !important;
  background: transparent !important;
  border-right: 1px solid var(--ml-border) !important;
  padding-right: 10px !important;
  margin-right: 10px !important;
  user-select: none !important;
}

/* Directory/file listings */
table.directory {
  width: 100% !important;
  border-collapse: collapse !important;
  font-size: 13.5px !important;
}

table.directory th {
  background: var(--ml-bg3) !important;
  color: var(--ml-dim) !important;
  font-size: 11px !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  padding: 10px 14px !important;
  border-bottom: 1px solid var(--ml-border) !important;
  font-weight: 500 !important;
}

table.directory td {
  padding: 9px 14px !important;
  border-bottom: 1px solid var(--ml-border) !important;
  color: var(--ml-muted) !important;
}

table.directory td a {
  color: var(--ml-accent2) !important;
  text-decoration: none !important;
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 12px !important;
}

table.directory tr:hover td { background: var(--ml-bg2) !important; }

/* Links */
a { color: var(--ml-accent2) !important; text-decoration: none !important; }
a:hover { color: #fff !important; text-decoration: underline !important; }

/* Breadcrumb */
div.header {
  background: transparent !important;
  border-bottom: 1px solid var(--ml-border) !important;
  padding: 20px 0 !important;
}

div.headertitle {
  padding: 0 !important;
}

/* Tabs (class, namespace, file views) */
.tabs, .tabs2, .tabs3 {
  background: var(--ml-bg2) !important;
  border-bottom: 1px solid var(--ml-border) !important;
  padding: 0 !important;
  margin: 0 !important;
}

.tabs li a, .tabs2 li a, .tabs3 li a {
  color: var(--ml-dim) !important;
  font-size: 13px !important;
  padding: 10px 16px !important;
  display: block !important;
  text-decoration: none !important;
  border-bottom: 2px solid transparent !important;
  transition: color 0.15s !important;
}

.tabs li a:hover, .tabs2 li a:hover { color: var(--ml-text) !important; }

.tabs li.current a,
.tabs2 li.current a {
  color: var(--ml-accent2) !important;
  border-bottom-color: var(--ml-accent2) !important;
  background: transparent !important;
}

/* Search */
#searchli, .SRResult {
  background: var(--ml-bg2) !important;
  border: 1px solid var(--ml-border) !important;
}

input#MSearchField {
  background: var(--ml-bg2) !important;
  color: var(--ml-text) !important;
  border: 1px solid var(--ml-border2) !important;
  border-radius: 6px !important;
  padding: 6px 10px !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  outline: none !important;
}

input#MSearchField:focus { border-color: var(--ml-accent) !important; }

/* Scrollbar */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: var(--ml-bg2); }
::-webkit-scrollbar-thumb { background: var(--ml-border2); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--ml-accent); }

/* ── FOOTER ────────────────────────────────────────────────────────── */
.ml-footer {
  background: var(--ml-bg);
  border-top: 1px solid var(--ml-border);
  margin-top: 0;
}

.ml-footer-inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 32px 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  flex-wrap: wrap;
}

.ml-footer-brand {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}

.ml-footer-logo {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 600;
  color: var(--ml-text) !important;
  text-decoration: none !important;
}

.ml-footer-copy {
  font-size: 12px;
  color: var(--ml-faint);
}

.ml-footer-links {
  display: flex;
  gap: 20px;
}

.ml-footer-links a {
  font-size: 13px;
  color: var(--ml-dim) !important;
  text-decoration: none !important;
  transition: color 0.15s;
}

.ml-footer-links a:hover { color: var(--ml-accent2) !important; }

.ml-footer-doxy {
  font-size: 11px;
  color: var(--ml-faint);
  font-family: 'JetBrains Mono', monospace;
}

.ml-footer-doxy a {
  color: var(--ml-dim) !important;
}

/* ── RESPONSIVE ────────────────────────────────────────────────────── */
@media (max-width: 960px) {
  .ml-nav { padding: 12px 20px; }
  .ml-nav-links { display: none; }
  .ml-subnav { padding: 9px 20px; flex-wrap: wrap; top: 60px; }
  .ml-dox-wrapper { padding: 0 20px 60px; }
  .ml-footer-inner { padding: 24px 20px; flex-direction: column; align-items: flex-start; gap: 16px; }
}