/* ═══════════════════════════════════════════════════════════════════════
   e-invoice.uz — Faktura API docs skin
   Design pass over Laradocs base. Cool-slate neutrals + ink-indigo accent.
   Tokens cascade everywhere; component rules match base selectors (later wins).
   ═══════════════════════════════════════════════════════════════════════ */

/* ── Design tokens ─────────────────────────────────────────────────────── */
:root,
:root[data-theme="light"]{
  --dc-font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --dc-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;
  --dc-content-w: 780px;

  --dc-bg: #ffffff;
  --dc-bg-elev: #f5f7fb;
  --dc-paper: #ffffff;
  --dc-sidebar-bg: #fbfcfe;
  --dc-fg: #0f1728;
  --dc-muted: #58627a;
  --dc-subtle: #98a2b7;
  --dc-rule: rgba(16, 24, 40, .08);
  --dc-rule-strong: rgba(16, 24, 40, .14);

  --dc-accent: #3a56d6;
  --dc-accent-fg: #ffffff;
  --dc-accent-soft: rgba(58, 86, 214, .09);
  --dc-accent-line: rgba(58, 86, 214, .30);

  --dc-code-bg: #0f1420;          /* dark code block even in light mode (Mintlify vibe) */
  --dc-code-fg: #e6ebf5;

  --dc-oa-get: #0f8a5f;  --dc-oa-post: #3a56d6;  --dc-oa-put: #b3781a;
  --dc-oa-delete: #d6394f; --dc-oa-patch: #8a5cd6;
  --dc-oa-ok: #0f8a5f;  --dc-oa-err: #d6394f;  --dc-oa-warn: #b3781a;

  --dc-radius: 9px;
  --dc-radius-lg: 15px;
  --dc-shadow: 0 1px 2px rgba(16,24,40,.04), 0 1px 3px rgba(16,24,40,.06);
  --dc-shadow-pop: 0 10px 34px -12px rgba(16,24,40,.28), 0 2px 8px rgba(16,24,40,.06);
}

:root[data-theme="dark"]{
  --dc-bg: #0a0d14;
  --dc-bg-elev: #10141e;
  --dc-paper: #0d111a;
  --dc-sidebar-bg: #0b0e16;
  --dc-fg: #e8ecf5;
  --dc-muted: #9099ad;
  --dc-subtle: #5c6577;
  --dc-rule: rgba(255, 255, 255, .08);
  --dc-rule-strong: rgba(255, 255, 255, .14);

  --dc-accent: #8093ff;
  --dc-accent-fg: #0a0d14;
  --dc-accent-soft: rgba(128, 147, 255, .14);
  --dc-accent-line: rgba(128, 147, 255, .34);

  --dc-code-bg: #0c1019;
  --dc-code-fg: #e6ebf5;

  --dc-oa-get: #35c98a;  --dc-oa-post: #7f92ff;  --dc-oa-put: #e0b25c;
  --dc-oa-delete: #f0728e; --dc-oa-patch: #b79bff;
  --dc-oa-ok: #35c98a;  --dc-oa-err: #f0728e;  --dc-oa-warn: #e0b25c;

  --dc-shadow: 0 1px 2px rgba(0,0,0,.4);
  --dc-shadow-pop: 0 16px 40px -14px rgba(0,0,0,.7), 0 2px 8px rgba(0,0,0,.4);
}
/* auto mode: follow OS when no explicit theme chosen */
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]):not([data-theme="dark"]){
    --dc-bg: #0a0d14; --dc-bg-elev: #10141e; --dc-paper: #0d111a; --dc-sidebar-bg: #0b0e16;
    --dc-fg: #e8ecf5; --dc-muted: #9099ad; --dc-subtle: #5c6577;
    --dc-rule: rgba(255,255,255,.08); --dc-rule-strong: rgba(255,255,255,.14);
    --dc-accent: #8093ff; --dc-accent-fg: #0a0d14;
    --dc-accent-soft: rgba(128,147,255,.14); --dc-accent-line: rgba(128,147,255,.34);
    --dc-code-bg: #0c1019; --dc-code-fg: #e6ebf5;
    --dc-oa-get: #35c98a; --dc-oa-post: #7f92ff; --dc-oa-put: #e0b25c;
    --dc-oa-delete: #f0728e; --dc-oa-patch: #b79bff;
    --dc-oa-ok: #35c98a; --dc-oa-err: #f0728e; --dc-oa-warn: #e0b25c;
    --dc-shadow: 0 1px 2px rgba(0,0,0,.4);
    --dc-shadow-pop: 0 16px 40px -14px rgba(0,0,0,.7), 0 2px 8px rgba(0,0,0,.4);
  }
}

body.laradocs{
  font-family: var(--dc-font);
  -webkit-font-smoothing: antialiased;
  letter-spacing: -0.006em;
  background: var(--dc-bg);
}

/* ── Header ────────────────────────────────────────────────────────────── */
.laradocs-header{
  border-bottom: 1px solid var(--dc-rule);
  background: color-mix(in srgb, var(--dc-bg) 82%, transparent);
  backdrop-filter: saturate(1.5) blur(12px);
  -webkit-backdrop-filter: saturate(1.5) blur(12px);
}
.laradocs-brand{ gap: 10px; letter-spacing: -0.02em; }
.laradocs-brand-mark{
  width: 30px; height: 30px; border-radius: 9px; position: relative;
  background: linear-gradient(150deg, var(--dc-accent), color-mix(in srgb, var(--dc-accent) 62%, #111));
  box-shadow: 0 2px 8px -2px var(--dc-accent-line);
}
.laradocs-brand-mark::after{
  content: "e"; position: absolute; inset: 0; display: grid; place-items: center;
  color: #fff; font-weight: 800; font-size: 16px; font-family: var(--dc-font);
}
.laradocs-brand-title{ font-weight: 650; }
.laradocs-brand-tag{
  font-size: 11px; font-weight: 500; color: var(--dc-muted);
  border-left: 1px solid var(--dc-rule-strong); margin-left: 9px; padding-left: 9px;
}
.laradocs-palette-trigger{
  border-radius: 10px; border: 1px solid var(--dc-rule);
  background: var(--dc-bg-elev); color: var(--dc-muted);
  transition: border-color .15s, background .15s, box-shadow .15s;
}
.laradocs-palette-trigger:hover{
  border-color: var(--dc-accent-line);
  background: var(--dc-bg);
  box-shadow: 0 1px 3px rgba(16,24,40,.06);
}
.laradocs-palette-trigger kbd{
  border: 1px solid var(--dc-rule); border-radius: 5px;
  background: var(--dc-bg); color: var(--dc-subtle); font-family: var(--dc-mono);
}
.laradocs-icon-btn{
  border-radius: 9px; border: 1px solid transparent; color: var(--dc-muted);
  transition: background .15s, color .15s, border-color .15s;
}
.laradocs-icon-btn:hover{
  background: var(--dc-bg-elev); color: var(--dc-accent); border-color: var(--dc-rule);
}

/* ── Tabs strip ────────────────────────────────────────────────────────── */
.laradocs-tabs{ border-bottom: 1px solid var(--dc-rule); background: var(--dc-bg); }
.laradocs-tab{
  font-weight: 500; color: var(--dc-muted); position: relative;
  padding-top: 14px; padding-bottom: 14px; transition: color .15s;
}
.laradocs-tab:hover{ color: var(--dc-fg); }
.laradocs-tab.is-active{ color: var(--dc-accent); font-weight: 600; }
.laradocs-tab.is-active::after{
  content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px;
  background: var(--dc-accent); border-radius: 2px 2px 0 0;
}

/* ── Sidebar ───────────────────────────────────────────────────────────── */
.laradocs-sidebar{ background: var(--dc-sidebar-bg); border-right: 1px solid var(--dc-rule); }
.laradocs-sidebar a{
  border-radius: 8px; color: var(--dc-muted); font-size: 13.5px; line-height: 1.35;
  transition: background .13s, color .13s;
}
.laradocs-sidebar a:hover{ background: var(--dc-accent-soft); color: var(--dc-fg); }
.laradocs-sidebar a.is-active{
  background: var(--dc-accent-soft); color: var(--dc-accent); font-weight: 600;
  box-shadow: inset 2.5px 0 0 var(--dc-accent);
}
/* group heading */
.laradocs-sidebar .laradocs-nav-group-label,
.laradocs-sidebar [class*="group"]{ letter-spacing: .05em; }

/* ── Content / prose ───────────────────────────────────────────────────── */
.laradocs-content{ color: var(--dc-fg); }
.laradocs-prose{ font-size: 15px; line-height: 1.68; }
.laradocs-prose h1{
  font-weight: 720; letter-spacing: -0.025em; line-height: 1.15;
  font-size: clamp(26px, 3.2vw, 33px); text-wrap: balance;
}
.laradocs-prose h2{
  font-weight: 660; letter-spacing: -0.018em; margin-top: 2.2em;
  padding-top: .5em; font-size: 21px;
}
.laradocs-prose h3{ font-weight: 620; letter-spacing: -0.01em; font-size: 16.5px; }
.laradocs-prose p, .laradocs-prose li{ color: var(--dc-fg); }
.laradocs-prose a{
  color: var(--dc-accent); text-decoration: none;
  border-bottom: 1px solid var(--dc-accent-line); transition: border-color .15s;
}
.laradocs-prose a:hover{ border-bottom-color: var(--dc-accent); }
.laradocs-prose code:not(pre code){
  font-family: var(--dc-mono); font-size: .86em; font-weight: 500;
  background: var(--dc-accent-soft); color: var(--dc-accent);
  padding: .12em .4em; border-radius: 5px;
}
.laradocs-prose table{ border-radius: 10px; overflow: hidden; border: 1px solid var(--dc-rule); }
.laradocs-prose th{ background: var(--dc-bg-elev); font-weight: 600; color: var(--dc-fg); }

/* ── Code blocks ───────────────────────────────────────────────────────── */
.laradocs-prose pre, pre.shiki{
  border-radius: 12px; border: 1px solid var(--dc-rule-strong);
  box-shadow: var(--dc-shadow);
}
.laradocs-code-header{
  border-top-left-radius: 12px; border-top-right-radius: 12px;
  border-bottom: 1px solid rgba(255,255,255,.08);
  font-family: var(--dc-mono); font-size: 11.5px; letter-spacing: .02em;
}

/* ── Callouts ──────────────────────────────────────────────────────────── */
.laradocs-callout{
  border-radius: 12px; border: 1px solid var(--dc-rule-strong);
  box-shadow: var(--dc-shadow);
}

/* ── OpenAPI: endpoint hero + panels ───────────────────────────────────── */
.laradocs-openapi-endpoint{
  border-radius: var(--dc-radius-lg); border: 1px solid var(--dc-rule);
  background: var(--dc-paper); box-shadow: var(--dc-shadow-pop);
}
.laradocs-openapi-meta{
  border-radius: var(--dc-radius-lg); border: 1px solid var(--dc-rule);
  background: var(--dc-bg-elev);
}
.laradocs-openapi-media{
  border-radius: 12px; border: 1px solid var(--dc-rule); overflow: hidden;
}
.laradocs-openapi-operation-item{ border-radius: 10px; transition: background .13s; }
.laradocs-openapi-operation-item:hover{ background: var(--dc-accent-soft); }
.laradocs-openapi-tag-summary{ border-radius: 10px; }
.laradocs-openapi-tag-summary:hover{ background: var(--dc-accent-soft); }

/* method badge (uses --dc-oa-* tokens already; add shape polish) */
[class*="openapi"] [class*="method"], .laradocs-openapi-method{
  font-family: var(--dc-mono); font-weight: 700; letter-spacing: .03em;
  border-radius: 6px;
}

/* ── Command palette ───────────────────────────────────────────────────── */
.laradocs-palette-panel{
  border-radius: 15px; border: 1px solid var(--dc-rule-strong);
  box-shadow: var(--dc-shadow-pop); background: var(--dc-paper);
}
.laradocs-palette-search{ border-bottom: 1px solid var(--dc-rule); }
.laradocs-palette-search input{ font-size: 15.5px; }
.laradocs-palette-results a{ border-radius: 9px; }
.laradocs-palette-results a:hover,
.laradocs-palette-results a.is-active{
  background: var(--dc-accent-soft); color: var(--dc-accent);
}
.laradocs-palette-group{ color: var(--dc-subtle); }

/* ── On-this-page TOC ──────────────────────────────────────────────────── */
.laradocs-toc a{ color: var(--dc-muted); transition: color .13s; border-left: 2px solid transparent; }
.laradocs-toc a:hover{ color: var(--dc-fg); }
.laradocs-toc a.is-active{ color: var(--dc-accent); border-left-color: var(--dc-accent); font-weight: 550; }

/* ── Pager (prev/next) ─────────────────────────────────────────────────── */
.laradocs-pager a{
  border-radius: 12px; border: 1px solid var(--dc-rule); transition: border-color .15s, box-shadow .15s;
}
.laradocs-pager a:hover{ border-color: var(--dc-accent-line); box-shadow: var(--dc-shadow); }

/* ── Progress bar + scrollbars ─────────────────────────────────────────── */
.laradocs-progress span{ background: var(--dc-accent); }
.laradocs-sidebar::-webkit-scrollbar, .laradocs-content::-webkit-scrollbar{ width: 9px; height: 9px; }
.laradocs-sidebar::-webkit-scrollbar-thumb, .laradocs-content::-webkit-scrollbar-thumb{
  background: var(--dc-rule-strong); border-radius: 6px;
}

/* focus ring for keyboard users */
.laradocs a:focus-visible, .laradocs button:focus-visible, .laradocs input:focus-visible{
  outline: 2px solid var(--dc-accent); outline-offset: 2px; border-radius: 6px;
}
@media (prefers-reduced-motion: reduce){ *{ transition: none !important; } }

/* ═══ Landing hero + card grid (client-facing overview) ═══════════════════ */
.einvoice-hero{
  margin: 4px 0 30px; padding: 0;
}
.einvoice-hero .eyebrow{
  display:inline-flex; align-items:center; gap:7px;
  font-size:12px; font-weight:600; letter-spacing:.04em; text-transform:uppercase;
  color:var(--dc-accent); background:var(--dc-accent-soft);
  padding:5px 11px; border-radius:20px; margin-bottom:16px;
}
.einvoice-hero h1{
  font-size: clamp(30px, 4vw, 40px); font-weight:740; letter-spacing:-.03em;
  line-height:1.1; margin:0 0 14px; text-wrap:balance;
}
.einvoice-hero p{
  font-size:16.5px; color:var(--dc-muted); max-width:58ch; line-height:1.6; margin:0;
}
.einvoice-cards{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:14px; margin:26px 0;
}
.einvoice-card{
  display:block; border:1px solid var(--dc-rule); border-radius:14px;
  padding:18px 19px; background:var(--dc-paper); box-shadow:var(--dc-shadow);
  transition:border-color .16s, box-shadow .16s, transform .16s;
}
.einvoice-card:hover{
  border-color:var(--dc-accent-line); box-shadow:var(--dc-shadow-pop);
  transform:translateY(-2px);
}
.einvoice-card .ic{
  width:36px; height:36px; border-radius:10px; display:grid; place-items:center;
  background:var(--dc-accent-soft); color:var(--dc-accent); font-size:18px;
  margin-bottom:13px;
}
.einvoice-card h3{ margin:0 0 5px; font-size:15.5px; font-weight:640; color:var(--dc-fg); letter-spacing:-.01em; }
.einvoice-card p{ margin:0; font-size:13.5px; color:var(--dc-muted); line-height:1.5; }
.einvoice-card .arrow{ color:var(--dc-accent); font-weight:600; font-size:13px; margin-top:10px; display:inline-block; }

/* step chips for walkthroughs */
.einvoice-steps{ counter-reset:step; margin:22px 0; padding:0; list-style:none; }
.einvoice-steps > li{
  position:relative; padding-left:44px; margin:0 0 20px; counter-increment:step;
}
.einvoice-steps > li::before{
  content:counter(step); position:absolute; left:0; top:-2px;
  width:30px; height:30px; border-radius:50%; display:grid; place-items:center;
  background:var(--dc-accent); color:var(--dc-accent-fg); font-weight:700; font-size:14px;
  box-shadow:0 2px 8px -2px var(--dc-accent-line);
}

/* ═══ Higher-specificity overrides (beat .laradocs-prose element rules) ═══ */
.laradocs-prose .einvoice-hero{ margin: 6px 0 32px; }
.laradocs-prose .einvoice-hero h1{ margin: 0 0 14px; padding: 0; border: 0; }
.laradocs-prose .einvoice-cards{
  display: grid; grid-template-columns: repeat(auto-fit, minmax(232px, 1fr));
  gap: 14px; margin: 26px 0; padding: 0; list-style: none;
}
.laradocs-prose a.einvoice-card{
  display: block; border: 1px solid var(--dc-rule); border-radius: 14px;
  padding: 18px 19px; background: var(--dc-paper); box-shadow: var(--dc-shadow);
  text-decoration: none; color: inherit;
  transition: border-color .16s, box-shadow .16s, transform .16s;
}
.laradocs-prose a.einvoice-card:hover{
  border-color: var(--dc-accent-line); box-shadow: var(--dc-shadow-pop);
  transform: translateY(-2px); background: var(--dc-paper);
}
.laradocs-prose .einvoice-card .ic{
  width: 38px; height: 38px; border-radius: 10px; display: grid; place-items: center;
  background: var(--dc-accent-soft); color: var(--dc-accent); font-size: 19px;
  margin: 0 0 13px; border: 0;
}
.laradocs-prose .einvoice-card h3{
  margin: 0 0 5px; padding: 0; border: 0; font-size: 15.5px; font-weight: 640;
  color: var(--dc-fg); letter-spacing: -.01em;
}
.laradocs-prose .einvoice-card p{ margin: 0; font-size: 13.5px; color: var(--dc-muted); line-height: 1.5; }
.laradocs-prose .einvoice-card .arrow{
  color: var(--dc-accent); font-weight: 600; font-size: 13px;
  margin-top: 11px; display: inline-block; border: 0;
}
.laradocs-prose ol.einvoice-steps{ counter-reset: step; margin: 22px 0; padding: 0; list-style: none; }
.laradocs-prose ol.einvoice-steps > li{ position: relative; padding-left: 46px; margin: 0 0 18px; counter-increment: step; }
.laradocs-prose ol.einvoice-steps > li::before{
  content: counter(step); position: absolute; left: 0; top: -3px;
  width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center;
  background: var(--dc-accent); color: var(--dc-accent-fg); font-weight: 700; font-size: 14px;
  box-shadow: 0 2px 8px -2px var(--dc-accent-line);
}

/* card title/description as divs (markdown hoists <h3>, so avoid it) */
.laradocs-prose .einvoice-card .ct{
  margin: 0 0 5px; padding: 0; font-size: 15.5px; font-weight: 640;
  color: var(--dc-fg); letter-spacing: -.01em; line-height: 1.3;
}
.laradocs-prose .einvoice-card .cd{ margin: 0; font-size: 13.5px; color: var(--dc-muted); line-height: 1.5; }

/* ═══ Full-bleed landing (Claude-home style) — body[data-laradocs-fullbleed] ═══ */
body[data-laradocs-fullbleed] .laradocs-sidebar,
body[data-laradocs-fullbleed] .laradocs-toc,
body[data-laradocs-fullbleed] .laradocs-page-header,
body[data-laradocs-fullbleed] .laradocs-breadcrumbs{ display: none !important; }

body[data-laradocs-fullbleed] .laradocs-shell{ padding-left: 0 !important; max-width: 100% !important; }
body[data-laradocs-fullbleed] .laradocs-main{ display: block !important; }
body[data-laradocs-fullbleed] .laradocs-content{ max-width: 100% !important; padding: 0 !important; }
body[data-laradocs-fullbleed] .laradocs-prose{ max-width: 1060px; margin: 0 auto; padding: 60px 24px 100px; }

/* centered hero */
body[data-laradocs-fullbleed] .einvoice-hero{ text-align: center; margin: 8px 0 10px; padding: 20px 0 6px; }
body[data-laradocs-fullbleed] .einvoice-hero .eyebrow{ margin-left: auto; margin-right: auto; }
body[data-laradocs-fullbleed] .einvoice-hero h1{ font-size: clamp(34px, 4.6vw, 52px); }
body[data-laradocs-fullbleed] .einvoice-hero p{ margin-left: auto; margin-right: auto; }
.laradocs-prose .einvoice-hero p{ max-width: 62ch; }

/* wider card grid */
body[data-laradocs-fullbleed] .laradocs-prose .einvoice-cards{
  grid-template-columns: repeat(auto-fit, minmax(258px, 1fr)); max-width: 1060px; margin: 30px auto;
}

/* ═══ Icon sizing (heroicons SVG'lar o'lchamsiz keladi — cheklaymiz) ═══ */
.laradocs-icon{ display: inline-flex; align-items: center; justify-content: center; width: 1.05rem; height: 1.05rem; flex: 0 0 auto; }
.laradocs-icon svg{ width: 100%; height: 100%; }
.laradocs-page-title svg{ width: 1.15em; height: 1.15em; flex: 0 0 auto; color: var(--dc-accent); vertical-align: -0.14em; }
.laradocs-sidebar svg{ width: 1.05rem; height: 1.05rem; flex: 0 0 auto; }

/* ═══ Ichki sahifalar: chetdagi bo'sh joyni to'ldirish (shell to'liq kenglik) ═══ */
@media (min-width: 1024px){
  body.laradocs:not([data-laradocs-fullbleed]) .laradocs-shell{
    max-width: 100% !important;
    margin-left: 0 !important; margin-right: 0 !important;
    padding-right: 2.5rem;
  }
  /* kengroq o'qish ustuni */
  body.laradocs:not([data-laradocs-fullbleed]){ --dc-content-w: 50rem; }
  /* TOC'ni o'ng chetга yaqinlashtirish */
  body.laradocs:not([data-laradocs-fullbleed]) .laradocs-content{ margin: 0; padding-left: 2.5rem; }
}