/* ============================================================
   Axiom Repository — Reposilite minimal dark theme
   Color-only overrides; no layout/structural changes.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap');

:root {
  --ax-bg:        #0b0d12;
  --ax-bg-elev:   #11141b;
  --ax-bg-hi:     #161a23;
  --ax-bg-input:  #0d1017;
  --ax-border:    rgba(255, 255, 255, 0.07);
  --ax-border-2:  rgba(255, 255, 255, 0.12);
  --ax-text:      #e8ebf2;
  --ax-text-2:    #a3aab8;
  --ax-text-3:    #6c7383;
  --ax-accent:    #4f8cff;
  --ax-accent-hi: #7dabff;
  --ax-accent-bg: rgba(79, 140, 255, 0.10);
  --ax-success:   #34d399;
  --ax-danger:    #f87171;
  --ax-font:      'Inter', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  --ax-mono:      'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
}

/* ---------- Base ---------- */
html, body {
  background-color: var(--ax-bg) !important;
  color: var(--ax-text) !important;
  font-family: var(--ax-font) !important;
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
}
#app { font-family: var(--ax-font) !important; color: var(--ax-text) !important; }

/* ---------- Tailwind palette mapping (color only) ---------- */
.bg-default       { background-color: var(--ax-bg) !important; }
.bg-white         { background-color: var(--ax-bg-elev) !important; color: var(--ax-text) !important; }
.bg-gray-50,
.bg-gray-100,
.bg-true-gray-100 { background-color: var(--ax-bg-elev) !important; }
.bg-gray-125,
.bg-gray-150,
.bg-gray-200      { background-color: var(--ax-bg-hi) !important; }
.bg-gray-500      { background-color: #4b5563 !important; }
.bg-gray-800,
.bg-black         { background-color: var(--ax-bg) !important; }
.bg-blue-700      { background-color: var(--ax-accent) !important; }

.text-black       { color: var(--ax-text) !important; }
.text-white       { color: #ffffff !important; }
.text-gray-500    { color: var(--ax-text-3) !important; }
.text-gray-600    { color: var(--ax-text-2) !important; }
.text-blue-400,
.text-blue-500    { color: var(--ax-accent-hi) !important; }
.text-purple-300,
.text-purple-400  { color: #c4b5fd !important; }
.text-green-500   { color: var(--ax-success) !important; }
.text-red-500,
.text-red-700    { color: var(--ax-danger) !important; }

.border-black           { border-color: var(--ax-border-2) !important; }
.border-gray-100,
.border-gray-200,
.border-gray-300,
.border-true-gray-200   { border-color: var(--ax-border) !important; }
.border-gray-400,
.border-gray-700        { border-color: var(--ax-border-2) !important; }

/* ---------- Typography ---------- */
h1, h2, h3, h4, h5, h6 {
  color: var(--ax-text) !important;
  -webkit-text-fill-color: initial !important;
}
a { color: var(--ax-accent-hi) !important; }
a:hover { color: #ffffff !important; }

/* ---------- Inputs ---------- */
input, select, textarea, .input {
  background-color: var(--ax-bg-input) !important;
  border-color: var(--ax-border-2) !important;
  color: var(--ax-text) !important;
  font-family: inherit !important;
}
input::placeholder, textarea::placeholder { color: var(--ax-text-3) !important; }
input:focus, select:focus, textarea:focus, .input:focus {
  outline: none !important;
  border-color: var(--ax-accent) !important;
  box-shadow: 0 0 0 3px rgba(79, 140, 255, 0.20) !important;
}

/* ---------- Code ---------- */
code, kbd, samp {
  font-family: var(--ax-mono) !important;
  background-color: var(--ax-accent-bg) !important;
  color: var(--ax-accent-hi) !important;
}
pre {
  font-family: var(--ax-mono) !important;
  background-color: #080a10 !important;
  color: var(--ax-text) !important;
}
pre code { background: transparent !important; color: inherit !important; }

/* ---------- Toggle ---------- */
.toggle {
  --toggle-bg-on:      var(--ax-accent) !important;
  --toggle-border-on:  var(--ax-accent) !important;
  --toggle-bg-off:     rgba(255,255,255,0.08) !important;
  --toggle-border-off: rgba(255,255,255,0.14) !important;
}

/* ---------- File entries hover ---------- */
.default-entry:hover, .compact-entry:hover {
  background-color: var(--ax-accent-bg) !important;
}

/* ---------- Tabs ---------- */
.tab.active, .active.tab {
  color: var(--ax-accent-hi) !important;
  border-color: var(--ax-accent) !important;
}

/* ---------- Scrollbars ---------- */
*::-webkit-scrollbar      { width: 8px; height: 8px; }
*::-webkit-scrollbar-track { background: transparent; }
*::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.10); border-radius: 8px; }
*::-webkit-scrollbar-thumb:hover { background: var(--ax-accent); }
* { scrollbar-width: thin; scrollbar-color: rgba(255,255,255,0.12) transparent; }

::selection { background: var(--ax-accent); color: #ffffff; }