/* =========================================================================
   Carpay DMS API — Docs Site Custom Theme
   Built on top of docsify-themeable "simple" theme.
   ========================================================================= */

:root {
  /* Brand palette */
  --cp-primary: #0b5fff;
  --cp-primary-dark: #0848c4;
  --cp-primary-light: #e6efff;
  --cp-accent: #00b67a;
  --cp-danger: #d9304a;
  --cp-warning: #e88b00;

  --cp-ink: #0b1b36;
  --cp-ink-soft: #3a4a6b;
  --cp-muted: #6b7a99;
  --cp-line: #dfe4ee;
  --cp-line-soft: #edf0f6;
  --cp-bg: #ffffff;
  --cp-bg-soft: #f7f9fc;
  --cp-bg-code: #0e1729;

  /* Docsify-themeable overrides */
  --base-font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  --base-font-size: 16px;
  --base-line-height: 1.65;
  --base-color: var(--cp-ink);
  --base-background-color: var(--cp-bg);

  --theme-color: var(--cp-primary);
  --theme-color-secondary: var(--cp-accent);
  --mono-font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  --sidebar-width: 300px;
  --sidebar-background: var(--cp-bg-soft);
  --sidebar-border-width: 0 1px 0 0;
  --sidebar-border-color: var(--cp-line);
  --sidebar-padding: 0;
  --sidebar-nav-indent: 14px;
  --sidebar-nav-pagelink-background-image: none;
  --sidebar-nav-pagelink-background-image--active: none;

  --sidebar-nav-link-color: var(--cp-ink-soft);
  --sidebar-nav-link-color--active: var(--cp-primary);
  --sidebar-nav-link-color--hover: var(--cp-primary);
  --sidebar-nav-link-font-weight: 500;
  --sidebar-nav-link-font-weight--active: 600;
  --sidebar-nav-link-font-size: 14px;

  --navbar-root-color: var(--cp-ink);
  --navbar-root-color--hover: var(--cp-primary);
  --navbar-menu-background: var(--cp-bg);
  --navbar-menu-border-color: var(--cp-line);
  --navbar-menu-padding: 8px 0;

  --cover-background-color: #ffffff;
  --cover-background-image: none;
  --cover-button-background: var(--cp-primary);
  --cover-button-color: #ffffff;
  --cover-button-border: 1px solid transparent;
  --cover-button-border-radius: 8px;
  --cover-button-padding: 12px 24px;
  --cover-button-primary-background: var(--cp-primary);
  --cover-button-primary-color: #ffffff;

  --heading-font-weight: 700;
  --heading-h1-font-size: 2.25rem;
  --heading-h2-font-size: 1.6rem;
  --heading-h3-font-size: 1.25rem;
  --heading-h2-border-style: none;
  --heading-margin: 2rem 0 1rem;

  --code-font-size: 0.9em;
  --code-inline-color: var(--cp-primary-dark);
  --code-inline-background: var(--cp-primary-light);
  --code-inline-border-radius: 4px;
  --code-inline-padding: 2px 6px;
  --code-theme-background: var(--cp-bg-code);

  --blockquote-border-width: 0 0 0 3px;
  --blockquote-border-color: var(--cp-primary);
  --blockquote-background: var(--cp-primary-light);
  --blockquote-color: var(--cp-ink-soft);
  --blockquote-padding: 14px 18px;
  --blockquote-border-radius: 0 8px 8px 0;

  --link-color: var(--cp-primary);
  --link-color--hover: var(--cp-primary-dark);
  --link-text-decoration--hover: underline;

  --table-cell-padding: 10px 14px;
  --table-head-background: var(--cp-bg-soft);
  --table-head-border-color: var(--cp-line);
  --table-row-odd-background: #ffffff;
  --table-row-even-background: var(--cp-bg-soft);
  --table-border-color: var(--cp-line);

  --search-input-background-color: #ffffff;
  --search-input-border-color: var(--cp-line);
  --search-input-color: var(--cp-ink);
  --search-result-heading-color: var(--cp-primary);
  --search-result-keyword-background-color: #fff7cf;

  --content-max-width: 920px;
  --scrollbar-thumb-color: #c4ccdb;
}

/* ---------- Global resets / body ---------- */
html, body { font-family: var(--base-font-family); -webkit-font-smoothing: antialiased; }
body { letter-spacing: -0.003em; }

::selection { background: var(--cp-primary-light); color: var(--cp-primary-dark); }

/* ---------- Sidebar ---------- */
.sidebar {
  padding-top: 0 !important;
  box-shadow: 0 0 0 0 rgba(0,0,0,0);
}
.sidebar > h1 {
  margin: 0 !important;
  padding: 18px 20px !important;
  background: #ffffff;
  border-bottom: 1px solid var(--cp-line);
  font-size: 16px !important;
  font-weight: 700;
}
.sidebar > h1 a {
  display: flex; align-items: center; gap: 10px;
  color: var(--cp-ink) !important;
  text-decoration: none;
}
.sidebar-logo { width: 28px; height: 28px; flex: 0 0 auto; }

.sidebar-nav {
  padding: 14px 10px 80px;
}
.sidebar-nav > ul > li > p {
  text-transform: uppercase;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em;
  color: var(--cp-muted) !important;
  padding: 16px 12px 8px !important;
  margin: 0 !important;
}
.sidebar-nav li a {
  border-radius: 6px;
  padding: 7px 12px !important;
  transition: background 120ms ease, color 120ms ease;
}
.sidebar-nav li a:hover {
  background: var(--cp-primary-light);
  color: var(--cp-primary) !important;
}
.sidebar-nav li.active > a,
.sidebar-nav li.open > a {
  background: var(--cp-primary) !important;
  color: #ffffff !important;
  background-image: none !important;
  box-shadow: 0 1px 2px rgba(11, 95, 255, 0.25);
}
.sidebar-nav li.active > a:hover,
.sidebar-nav li.open > a:hover { background: var(--cp-primary-dark) !important; color: #fff !important; }

/* Collapsed child lists */
.sidebar-nav ul ul { margin: 2px 0 6px 12px; border-left: 1px solid var(--cp-line); }
.sidebar-nav ul ul li a { font-size: 13px !important; }

/* ---------- Top navbar ---------- */
.app-nav {
  background: rgba(255,255,255,0.85);
  backdrop-filter: saturate(180%) blur(8px);
  -webkit-backdrop-filter: saturate(180%) blur(8px);
  border-bottom: 1px solid var(--cp-line);
  padding: 10px 24px !important;
}
.app-nav li a {
  font-weight: 500;
  font-size: 14px !important;
  color: var(--cp-ink-soft) !important;
  padding: 6px 10px;
  border-radius: 6px;
  transition: background 120ms, color 120ms;
}
.app-nav li a:hover { color: var(--cp-primary) !important; background: var(--cp-primary-light); }
.app-nav li.active > a { color: var(--cp-primary) !important; }

/* ---------- Content ---------- */
.content { padding: 24px 36px 64px; }
.markdown-section { max-width: var(--content-max-width); padding: 24px 8px 32px; }
.markdown-section h1 { letter-spacing: -0.02em; }
.markdown-section h2 {
  border-top: 1px solid var(--cp-line-soft);
  padding-top: 1.6rem;
  margin-top: 2.5rem;
}
.markdown-section h2:first-of-type { border-top: none; padding-top: 0; margin-top: 1rem; }
.markdown-section h3 { color: var(--cp-ink); letter-spacing: -0.01em; }

.markdown-section p, .markdown-section li { color: var(--cp-ink-soft); }
.markdown-section a { transition: color 120ms; }

/* ---------- Code ---------- */
.markdown-section code,
.markdown-section pre > code {
  font-family: var(--mono-font-family);
  font-feature-settings: "liga" 0;
  font-variant-ligatures: none;
}
.markdown-section pre {
  background: var(--cp-bg-code) !important;
  border-radius: 10px !important;
  padding: 16px 18px !important;
  border: 1px solid #10203f;
  box-shadow: 0 2px 0 0 rgba(15, 28, 59, 0.04);
}
.markdown-section pre > code { font-size: 13px; color: #e5ecf8; }
.markdown-section pre::after {
  position: absolute; top: 8px; right: 14px;
  color: #6c7ea3; font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em;
  font-family: var(--mono-font-family);
  content: attr(data-lang);
  opacity: 0.8;
}
.docsify-copy-code-button {
  background: rgba(255,255,255,0.08) !important;
  color: #d6e0f5 !important;
  font-family: var(--base-font-family) !important;
  font-size: 12px !important;
  border-radius: 6px !important;
  padding: 4px 10px !important;
  top: 8px !important; right: 8px !important;
}
.docsify-copy-code-button:hover { background: rgba(255,255,255,0.15) !important; }
.docsify-copy-code-button.success { background: var(--cp-accent) !important; color: #fff !important; }

/* ---------- Tables ---------- */
.markdown-section table {
  display: table; width: 100%;
  border: 1px solid var(--cp-line);
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 1px 0 rgba(0,0,0,0.02);
}
.markdown-section table thead tr { background: var(--cp-bg-soft); }
.markdown-section table thead th {
  font-weight: 600; font-size: 13px; color: var(--cp-ink);
  text-align: left;
}
.markdown-section table tbody td { font-size: 14px; }
.markdown-section table tr:last-child td { border-bottom: none; }

/* ---------- Blockquotes ---------- */
.markdown-section blockquote { font-size: 15px; }
.markdown-section blockquote p { color: var(--cp-ink-soft); margin: 0; }
.markdown-section blockquote strong { color: var(--cp-primary-dark); }

/* ---------- HTTP method pills / Badges ---------- */
.badge, code.method {
  display: inline-block;
  font-family: var(--mono-font-family);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  padding: 2px 8px;
  border-radius: 999px;
  margin-right: 6px;
  text-transform: uppercase;
  line-height: 18px;
  vertical-align: middle;
  background: #e8edf6;
  color: var(--cp-ink-soft);
}
.badge.get,    .method.get    { background: #dbeefc; color: #07538c; }
.badge.post,   .method.post   { background: #def5e5; color: #106d3a; }
.badge.put,    .method.put    { background: #fff2d6; color: #9e5600; }
.badge.delete, .method.delete { background: #ffe0e3; color: #a7192d; }
.badge.patch,  .method.patch  { background: #efe1fc; color: #5c218f; }

.badge.sync    { background: #dbeefc; color: #07538c; }
.badge.async   { background: #efe1fc; color: #5c218f; }
.badge.new     { background: #def5e5; color: #106d3a; }
.badge.optional{ background: #f2f3f6; color: var(--cp-ink-soft); }

/* ---------- Info / warn / tip callouts ---------- */
.cp-note {
  border-radius: 10px;
  padding: 14px 18px;
  margin: 18px 0;
  font-size: 14.5px;
  line-height: 1.6;
  position: static;
}
.cp-note::before {
  display: block;
  position: static;
  font-weight: 700;
  font-family: var(--base-font-family);
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin: 0 0 8px;
  padding: 0;
  background: transparent;
  border-radius: 0;
  width: auto;
  height: auto;
  line-height: 1.4;
  text-align: left;
}
.cp-note > :first-child:not(pre):not(ul):not(ol):not(table) { margin-top: 0; }
.cp-note > :last-child { margin-bottom: 0; }

.cp-note--info   { background: #eef4ff; border-left: 3px solid var(--cp-primary); color: #16326a; }
.cp-note--info::before   { content: "Info"; color: var(--cp-primary); }
.cp-note--tip    { background: #e7f8ee; border-left: 3px solid var(--cp-accent); color: #0a4f2c; }
.cp-note--tip::before    { content: "Tip"; color: var(--cp-accent); }
.cp-note--warn   { background: #fff5e5; border-left: 3px solid var(--cp-warning); color: #5b3800; }
.cp-note--warn::before   { content: "Warning"; color: var(--cp-warning); }
.cp-note--danger { background: #ffeaee; border-left: 3px solid var(--cp-danger); color: #6e0c1f; }
.cp-note--danger::before { content: "Caution"; color: var(--cp-danger); }

/* ---------- Cards grid ---------- */
.cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 16px;
  margin: 24px 0;
}
.card {
  border: 1px solid var(--cp-line);
  border-radius: 10px;
  padding: 18px 20px;
  background: #fff;
  transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
  text-decoration: none !important;
  color: inherit !important;
  display: block;
}
.card:hover {
  transform: translateY(-2px);
  border-color: var(--cp-primary);
  box-shadow: 0 8px 24px rgba(11, 27, 54, 0.08);
}
.card h4 { margin: 0 0 6px; color: var(--cp-ink); font-size: 15px; }
.card p  { margin: 0; font-size: 13.5px; color: var(--cp-muted); }
.card .card-kicker {
  font-size: 11px; text-transform: uppercase; letter-spacing: 0.08em;
  color: var(--cp-primary); font-weight: 700; margin-bottom: 6px;
}

/* ---------- Endpoint block ---------- */
.endpoint {
  display: flex; align-items: center; gap: 10px;
  border: 1px solid var(--cp-line);
  border-radius: 10px;
  padding: 10px 14px;
  background: #fff;
  font-family: var(--mono-font-family);
  font-size: 14px;
  margin: 10px 0 18px;
}
.endpoint .badge { margin-right: 2px; }
.endpoint .path { color: var(--cp-ink); }

/* ---------- Mermaid ---------- */
.mermaid {
  background: #ffffff;
  border: 1px solid var(--cp-line);
  border-radius: 10px;
  padding: 22px;
  margin: 22px 0;
  text-align: center;
  overflow-x: auto;
  box-shadow: 0 1px 0 rgba(0,0,0,0.02);
}

/* ---------- Cover page ---------- */
section.cover {
  background: radial-gradient(ellipse at top, #e6efff 0%, #ffffff 55%) !important;
}
section.cover .cover-main {
  max-width: 780px;
  margin-top: -4vh;
}
section.cover .cover-main > h1 {
  font-weight: 800;
  letter-spacing: -0.03em;
  font-size: 3.6rem;
  line-height: 1.1;
  margin-bottom: 8px;
}
section.cover .cover-main > h1 a {
  color: var(--cp-ink);
  text-decoration: none;
}
section.cover .cover-main > p:not(:last-child) {
  color: var(--cp-muted);
  font-size: 1.05rem;
  font-weight: 500;
  line-height: 1.5;
  margin: 0 0 32px;
}
section.cover .cover-main > p:last-child a {
  margin: 6px 8px;
  padding: 12px 24px;
  border-radius: 8px;
  font-weight: 600;
  transition: all 160ms ease;
  font-size: 15px;
}
section.cover .cover-main > p:last-child a.primary,
section.cover .cover-main > p:last-child a:first-child {
  background: var(--cp-primary);
  color: #ffffff !important;
  border: 1px solid var(--cp-primary);
  box-shadow: 0 4px 14px rgba(11, 95, 255, 0.25);
}
section.cover .cover-main > p:last-child a.primary:hover,
section.cover .cover-main > p:last-child a:first-child:hover {
  background: var(--cp-primary-dark);
  border-color: var(--cp-primary-dark);
  transform: translateY(-1px);
  box-shadow: 0 6px 18px rgba(11, 95, 255, 0.35);
}
section.cover .cover-main > p:last-child a:not(:first-child) {
  background: #ffffff;
  color: var(--cp-primary) !important;
  border: 1px solid var(--cp-line);
}
section.cover .cover-main > p:last-child a:not(:first-child):hover {
  border-color: var(--cp-primary);
}
section.cover blockquote {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  color: var(--cp-muted) !important;
}
section.cover blockquote > p {
  font-size: 0.95rem !important;
  font-weight: 400 !important;
}

/* ---------- Pagination (docsify-pagination) ---------- */
.docsify-pagination-container {
  display: flex !important;
  gap: 16px;
  margin-top: 48px !important;
  padding: 0 !important;
  border: none !important;
}
.pagination-item {
  flex: 1;
  min-width: 0;
  margin: 0 !important;
  border: none !important;
}
.pagination-item a {
  display: block !important;
  border: 1px solid var(--cp-line) !important;
  border-radius: 10px !important;
  padding: 14px 18px !important;
  background: #ffffff !important;
  color: var(--cp-ink) !important;
  text-decoration: none !important;
  transition: border-color 140ms ease, box-shadow 140ms ease, transform 140ms ease;
  height: 100%;
  box-sizing: border-box;
}
.pagination-item a:hover {
  border-color: var(--cp-primary) !important;
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(11, 27, 54, 0.08);
}
.pagination-item--next a { text-align: right; }
.pagination-item-label {
  display: block;
  color: var(--cp-muted) !important;
  font-size: 12px !important;
  font-weight: 500;
  margin-bottom: 4px;
  text-transform: none !important;
  letter-spacing: normal !important;
}
.pagination-item-label span { color: var(--cp-muted) !important; }
.pagination-item-title {
  display: block;
  color: var(--cp-ink) !important;
  font-weight: 600 !important;
  font-size: 15px !important;
  text-transform: none !important;
  letter-spacing: -0.005em !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ---------- Search ---------- */
.search .input-wrap {
  border-radius: 8px;
  border: 1px solid var(--cp-line);
  padding: 2px 6px;
  transition: border-color 140ms, box-shadow 140ms;
}
.search .input-wrap:focus-within {
  border-color: var(--cp-primary);
  box-shadow: 0 0 0 3px rgba(11, 95, 255, 0.15);
}
.search input { font-family: var(--base-font-family) !important; }
.search .results-panel {
  border-radius: 10px;
  border: 1px solid var(--cp-line);
  box-shadow: 0 8px 24px rgba(11, 27, 54, 0.08);
}
.search .matching-post { padding: 14px 16px; }
.search .matching-post:hover { background: var(--cp-primary-light); }

/* ---------- Tabs (docsify-tabs) ---------- */
.docsify-tabs__tab {
  font-family: var(--base-font-family) !important;
  font-weight: 500;
  font-size: 14px !important;
  color: var(--cp-ink-soft) !important;
}
.docsify-tabs__tab--active {
  color: var(--cp-primary) !important;
  border-bottom: 2px solid var(--cp-primary) !important;
}
.docsify-tabs__content { padding: 12px 0 0 !important; }

/* ---------- Footer ---------- */
.site-footer {
  margin-top: 36px;
  padding: 18px 0 0;
  font-size: 13px;
  color: var(--cp-muted);
  display: flex; flex-wrap: wrap; gap: 8px;
  border-top: 1px solid var(--cp-line-soft);
}
.site-footer a { color: var(--cp-primary); }
.site-footer .sep { opacity: 0.4; }

/* ---------- Responsive ---------- */
@media (max-width: 768px) {
  .content { padding: 16px 20px 64px; }
  .markdown-section { padding: 8px 0; }
  section.cover .cover-main > h1 { font-size: 2.6rem; }
  .app-nav { padding: 8px 14px !important; }
}