/* ==========================================================================
   Developer documentation portal — /developers
   --------------------------------------------------------------------------
   Loaded only on the docs pages, on top of v3.css (whose custom properties this
   file reuses rather than redeclaring). Hand-bumped ?v= in
   v3/developers/layout.blade.php — bump it whenever this file changes.

   Layout is a three-column shell: sidebar / content / on-this-page. The v3 nav
   is position:fixed at 72px, so everything sticky here offsets from that.
   ========================================================================== */

:root{
  --docs-nav-h:72px;
  --docs-bar-h:52px;
  --docs-side-w:274px;
  --docs-toc-w:212px;
  --docs-max:1440px;

  /* Code surfaces. Deliberately near-black rather than the forest primary:
     syntax-ish content needs maximum contrast, and a tinted block reads as a
     callout rather than as code. */
  --docs-code-bg:#0d1a14;
  --docs-code-bar:#132419;
  --docs-code-fg:#e8f0ea;
  --docs-code-border:#1d3327;

  --docs-mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;
}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* --------------------------------------------------------------------------
   Shell
   -------------------------------------------------------------------------- */

.docs{padding-top:var(--docs-nav-h);background:var(--white)}

.docs-shell{
  max-width:var(--docs-max);margin:0 auto;
  display:grid;grid-template-columns:var(--docs-side-w) minmax(0,1fr) var(--docs-toc-w);
  gap:0 44px;padding:0 28px;align-items:start;
}

/* The mobile bar. Hidden on desktop, where the sidebar is always visible. */
.docs-bar{display:none;position:sticky;top:var(--docs-nav-h);z-index:40;background:rgba(255,255,255,.94);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--border)}
.docs-bar-in{display:flex;align-items:center;justify-content:space-between;gap:12px;height:var(--docs-bar-h);padding:0 20px}
.docs-menu-btn{display:inline-flex;align-items:center;gap:10px;font-size:.92rem;font-weight:600;color:var(--foreground);background:none;border:0;padding:6px 2px;cursor:pointer}
.docs-menu-icon{position:relative;width:16px;height:2px;background:currentColor;border-radius:2px;display:block}
.docs-menu-icon::before,.docs-menu-icon::after{content:"";position:absolute;left:0;width:16px;height:2px;background:currentColor;border-radius:2px}
.docs-menu-icon::before{top:-5px}
.docs-menu-icon::after{top:5px}
.docs-version{font-family:var(--docs-mono);font-size:.76rem;font-weight:600;color:var(--primary);background:var(--primary-05);border:1px solid var(--primary-10);border-radius:.5rem;padding:3px 8px}

/* --------------------------------------------------------------------------
   Sidebar
   -------------------------------------------------------------------------- */

.docs-sidebar{position:sticky;top:var(--docs-nav-h);height:calc(100vh - var(--docs-nav-h));overflow:hidden;border-right:1px solid var(--border)}
.docs-sidebar-in{height:100%;overflow-y:auto;overscroll-behavior:contain;padding:30px 20px 60px 0}
.docs-sidebar-in::-webkit-scrollbar{width:8px}
.docs-sidebar-in::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:8px}

.docs-search{margin-bottom:20px}
.docs-filter{
  width:100%;font:inherit;font-size:.88rem;color:var(--foreground);
  background:var(--surface);border:1px solid var(--border);border-radius:.7rem;
  padding:9px 12px;transition:border-color .2s,background .2s;
}
.docs-filter::placeholder{color:var(--muted-light)}
.docs-filter:focus{outline:none;border-color:var(--primary-light);background:var(--white)}

.docs-nav-group{
  font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--muted-light);margin:22px 0 8px;padding:0 10px;
}
.docs-nav-group:first-child{margin-top:0}
.docs-nav-list{list-style:none;margin:0 0 4px;padding:0}
.docs-nav-link{
  display:block;font-size:.9rem;line-height:1.35;color:var(--muted);
  padding:7px 10px;border-radius:.6rem;border-left:2px solid transparent;
  transition:color .16s,background .16s;
}
.docs-nav-link:hover{color:var(--foreground);background:var(--surface)}
.docs-nav-link.is-active{color:var(--primary);background:var(--primary-05);font-weight:600}
/* Event pages read as children of the catalogue that lists them. */
.docs-nav-link.is-nested{padding-left:22px;font-family:var(--docs-mono);font-size:.82rem}
.docs-nav-list li.is-hidden{display:none}
.docs-nav-group.is-hidden{display:none}

/* --------------------------------------------------------------------------
   Main column
   -------------------------------------------------------------------------- */

.docs-main{min-width:0;padding:34px 0 80px;max-width:52rem}

.docs-crumb{display:flex;flex-wrap:wrap;align-items:center;gap:7px;font-size:.82rem;color:var(--muted-light);margin-bottom:18px}
.docs-crumb a{color:var(--muted)}
.docs-crumb a:hover{color:var(--primary)}

.docs-head{margin-bottom:34px;padding-bottom:26px;border-bottom:1px solid var(--border)}
.docs-h1{font-size:clamp(2rem,1.5rem + 1.7vw,2.6rem);line-height:1.12;letter-spacing:-.025em;font-weight:800;color:var(--foreground);margin:0 0 12px}
.docs-lead{font-size:1.08rem;line-height:1.62;color:var(--muted);margin:0}
.docs-lead p{margin:0 0 10px}
.docs-lead p:last-child{margin-bottom:0}

/* Body typography */
.docs-body{font-size:1rem;line-height:1.72;color:var(--foreground)}
.docs-body > h2{
  font-size:1.42rem;line-height:1.25;letter-spacing:-.018em;font-weight:750;
  margin:52px 0 14px;padding-top:6px;scroll-margin-top:calc(var(--docs-nav-h) + 18px);
}
.docs-body > h2:first-child{margin-top:0}
.docs-body > h3{
  font-size:1.1rem;line-height:1.3;font-weight:700;margin:34px 0 10px;
  scroll-margin-top:calc(var(--docs-nav-h) + 18px);
}
.docs-body p{margin:0 0 16px}
.docs-body ul,.docs-body ol{margin:0 0 18px;padding-left:22px}
.docs-body li{margin-bottom:7px}
.docs-body li > ul,.docs-body li > ol{margin-top:7px;margin-bottom:4px}
.docs-body a{color:var(--primary);text-decoration:underline;text-underline-offset:2px;text-decoration-thickness:1px;text-decoration-color:var(--primary-10)}
.docs-body a:hover{text-decoration-color:currentColor}
.docs-body strong{font-weight:650}
.docs-body hr{border:0;border-top:1px solid var(--border);margin:40px 0}

/* Anchor links on headings, injected by developers.js */
.docs-anchor{
  margin-left:8px;color:var(--muted-light);text-decoration:none;font-weight:400;
  opacity:0;transition:opacity .16s;
}
.docs-body > h2:hover .docs-anchor,.docs-body > h3:hover .docs-anchor,.docs-anchor:focus{opacity:1}

/* Inline code */
.docs-body code{
  font-family:var(--docs-mono);font-size:.86em;
  background:var(--surface-alt);border:1px solid var(--border);border-radius:.4rem;
  padding:.1em .34em;color:#0b3d27;white-space:nowrap;
}
/* Strip the inline-code chrome inside a block, but do NOT hand it `color:inherit`:
   it would inherit .docs-body's near-black onto the dark code surface and render
   the block invisible. The colour is set on .docs-code below, at a specificity
   that beats this rule. */
.docs-body pre code{background:none;border:0;padding:0;white-space:pre}

/* --------------------------------------------------------------------------
   Code blocks
   -------------------------------------------------------------------------- */

.docs-code{position:relative;margin:0 0 22px;border-radius:var(--radius-sm);overflow:hidden;background:var(--docs-code-bg);border:1px solid var(--docs-code-border)}
.docs-code-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 14px;background:var(--docs-code-bar);border-bottom:1px solid var(--docs-code-border)}
.docs-code-title{font-size:.78rem;font-weight:600;letter-spacing:.02em;color:#9fc4ad}
.docs-code-right{display:flex;align-items:center;gap:10px}
.docs-code-lang{font-family:var(--docs-mono);font-size:.7rem;text-transform:uppercase;letter-spacing:.06em;color:#6d8f7c}
.docs-pre{margin:0;padding:16px 18px;overflow-x:auto;background:none;color:var(--docs-code-fg)}
/* Two class selectors so this wins over `.docs-body pre code` wherever a block
   sits inside the article body. */
.docs-code .docs-pre code{font-family:var(--docs-mono);font-size:.83rem;line-height:1.62;color:var(--docs-code-fg)}

.docs-copy{
  font:inherit;font-size:.73rem;font-weight:600;letter-spacing:.02em;
  color:#9fc4ad;background:rgba(255,255,255,.06);border:1px solid var(--docs-code-border);
  border-radius:.45rem;padding:3px 9px;cursor:pointer;transition:color .16s,background .16s;
}
.docs-copy:hover{color:#fff;background:rgba(255,255,255,.13)}
.docs-copy.is-done{color:#7fe0ac;border-color:#2c5a41}
.docs-copy--float{position:absolute;top:10px;right:10px;z-index:2}

/* --------------------------------------------------------------------------
   Endpoint header
   -------------------------------------------------------------------------- */

.docs-endpoint{
  display:flex;flex-wrap:wrap;align-items:center;gap:10px;
  background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);
  padding:12px 14px;margin:0 0 22px;
}
.docs-verb{
  font-family:var(--docs-mono);font-size:.74rem;font-weight:700;letter-spacing:.05em;
  color:#fff;border-radius:.4rem;padding:4px 8px;flex:none;
}
.docs-verb--get{background:#1d6fd4}
.docs-verb--post{background:#15803d}
.docs-verb--patch{background:#b45309}
.docs-verb--delete{background:#b91c1c}
.docs-path{font-family:var(--docs-mono);font-size:.88rem;font-weight:600;color:var(--foreground);word-break:break-all}
.docs-path-base{color:var(--muted-light);font-weight:400}
.docs-badge{
  font-size:.72rem;font-weight:600;color:var(--accent-dark);
  background:var(--warn-bg);border:1px solid #fcd9a4;border-radius:.4rem;padding:3px 8px;
}

/* --------------------------------------------------------------------------
   Tables
   -------------------------------------------------------------------------- */

.docs-table-caption{font-size:.78rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted-light);margin:26px 0 9px}
.docs-table-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:var(--radius-sm);margin:0 0 22px;background:var(--white)}
.docs-table{width:100%;border-collapse:collapse;font-size:.88rem;line-height:1.55;min-width:34rem}
.docs-table th{
  text-align:left;font-size:.74rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;
  color:var(--muted);background:var(--surface);padding:9px 14px;border-bottom:1px solid var(--border);white-space:nowrap;
}
.docs-table td{padding:11px 14px;border-bottom:1px solid var(--border);vertical-align:top}
.docs-table tr:last-child td{border-bottom:0}
.docs-table code{font-family:var(--docs-mono);font-size:.83em;background:var(--surface-alt);border:1px solid var(--border);border-radius:.35rem;padding:.08em .3em;color:#0b3d27}
.docs-field{white-space:nowrap}
.docs-type{font-family:var(--docs-mono);font-size:.8rem;color:var(--muted);white-space:nowrap}
.docs-req{font-size:.72rem;font-weight:700;color:#b91c1c;background:var(--bad-bg);border-radius:.35rem;padding:2px 7px;white-space:nowrap}
.docs-opt{font-size:.72rem;font-weight:600;color:var(--muted);background:var(--surface-alt);border-radius:.35rem;padding:2px 7px;white-space:nowrap}

.docs-status{font-family:var(--docs-mono);font-size:.8rem;font-weight:700;border-radius:.35rem;padding:2px 7px;white-space:nowrap}
.docs-status--2xx{color:#15803d;background:var(--ok-bg)}
.docs-status--4xx{color:#b45309;background:var(--warn-bg)}
.docs-status--5xx{color:#b91c1c;background:var(--bad-bg)}
.docs-errcode{text-decoration:none !important}
.docs-errcode code{color:var(--primary);border-color:var(--primary-10);background:var(--primary-05)}

/* --------------------------------------------------------------------------
   Callouts
   -------------------------------------------------------------------------- */

.docs-callout{border-radius:var(--radius-sm);border:1px solid;border-left-width:3px;padding:14px 16px;margin:0 0 22px}
.docs-callout p:last-child{margin-bottom:0}
.docs-callout-title{font-weight:700;margin:0 0 6px !important;font-size:.95rem}
.docs-callout-body{font-size:.95rem;line-height:1.65}
.docs-callout--info{background:var(--info-bg);border-color:#bfdbfe;border-left-color:var(--info)}
.docs-callout--tip{background:var(--ok-bg);border-color:#bbf7d0;border-left-color:var(--ok)}
.docs-callout--warn{background:var(--warn-bg);border-color:#fcd9a4;border-left-color:var(--warn)}
.docs-callout--danger{background:var(--bad-bg);border-color:#fecaca;border-left-color:var(--bad)}

/* --------------------------------------------------------------------------
   On-this-page rail
   -------------------------------------------------------------------------- */

.docs-toc{position:sticky;top:var(--docs-nav-h);height:calc(100vh - var(--docs-nav-h));overflow:hidden}
.docs-toc-in{height:100%;overflow-y:auto;padding:38px 0 60px}
.docs-toc-title{font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted-light);margin:0 0 10px}
.docs-toc-list{list-style:none;margin:0;padding:0;border-left:1px solid var(--border)}
.docs-toc-list a{
  display:block;font-size:.83rem;line-height:1.4;color:var(--muted);
  padding:5px 0 5px 13px;margin-left:-1px;border-left:2px solid transparent;transition:color .16s,border-color .16s;
}
.docs-toc-list a:hover{color:var(--foreground)}
.docs-toc-list a.is-active{color:var(--primary);border-left-color:var(--primary);font-weight:600}
.docs-toc-list .is-sub a{padding-left:24px;font-size:.79rem}
/* A page with one section does not need a rail telling it so. */
.docs-toc.is-empty{visibility:hidden}

/* --------------------------------------------------------------------------
   Pager and footer
   -------------------------------------------------------------------------- */

.docs-pager{display:flex;justify-content:space-between;gap:16px;margin-top:56px;padding-top:26px;border-top:1px solid var(--border)}
.docs-pager-link{
  display:flex;flex-direction:column;gap:3px;flex:1 1 0;min-width:0;
  border:1px solid var(--border);border-radius:var(--radius-sm);padding:13px 16px;
  transition:border-color .18s,background .18s;
}
.docs-pager-link:hover{border-color:var(--primary-light);background:var(--surface)}
.docs-pager-next{text-align:right}
.docs-pager-dir{font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted-light)}
.docs-pager-title{font-size:.95rem;font-weight:600;color:var(--foreground);overflow:hidden;text-overflow:ellipsis}

.docs-foot{margin-top:34px;font-size:.86rem;line-height:1.6;color:var(--muted)}
.docs-foot a{color:var(--primary)}

/* --------------------------------------------------------------------------
   Cards used on the overview and catalogue pages
   -------------------------------------------------------------------------- */

.docs-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:14px;margin:0 0 24px;list-style:none;padding:0}
.docs-card{
  display:block;border:1px solid var(--border);border-radius:var(--radius-sm);padding:16px 18px;
  transition:border-color .18s,background .18s,transform .18s;text-decoration:none !important;
}
.docs-card:hover{border-color:var(--primary-light);background:var(--surface);transform:translateY(-1px)}
.docs-card-title{display:block;font-size:.98rem;font-weight:700;color:var(--foreground);margin-bottom:4px}
.docs-card-title code{white-space:nowrap}
.docs-card-text{display:block;font-size:.87rem;line-height:1.55;color:var(--muted)}

/* --------------------------------------------------------------------------
   Scrim (mobile drawer backdrop)
   -------------------------------------------------------------------------- */

.docs-scrim{position:fixed;inset:0;z-index:44;background:rgba(4,12,8,.42);backdrop-filter:blur(2px);opacity:0;transition:opacity .24s}
.docs-scrim.is-open{opacity:1}

/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */

@media (max-width:1180px){
  .docs-shell{grid-template-columns:var(--docs-side-w) minmax(0,1fr);gap:0 36px}
  .docs-toc{display:none}
}

@media (max-width:900px){
  .docs-bar{display:block}
  .docs-shell{grid-template-columns:minmax(0,1fr);padding:0 20px;gap:0}
  .docs-main{padding:26px 0 64px;max-width:none}

  .docs-sidebar{
    position:fixed;top:calc(var(--docs-nav-h) + var(--docs-bar-h));left:0;z-index:45;
    width:min(320px,86vw);height:calc(100vh - var(--docs-nav-h) - var(--docs-bar-h));
    background:var(--white);border-right:1px solid var(--border);box-shadow:var(--shadow-lg);
    transform:translateX(-102%);transition:transform .26s var(--ease);
  }
  .docs-sidebar.is-open{transform:translateX(0)}
  .docs-sidebar-in{padding:22px 18px 60px}

  .docs-h1{font-size:clamp(1.7rem,1.3rem + 2vw,2.2rem)}
  .docs-pager{flex-direction:column}
  .docs-pager-next{text-align:left}
}

@media (prefers-reduced-motion:reduce){
  .docs-sidebar,.docs-scrim,.docs-card,.docs-pager-link{transition:none}
}

/* Print: drop the chrome, keep the reference. */
@media print{
  .docs-sidebar,.docs-toc,.docs-bar,.docs-pager,.docs-copy,.docs-scrim{display:none !important}
  .docs{padding-top:0}
  .docs-shell{display:block;padding:0}
  .docs-main{max-width:none;padding:0}
  .docs-code{background:#fff;border-color:#ccc}
  .docs-pre,.docs-code .docs-pre code{color:#111}
  .docs-code-bar{background:#f2f2f2}
  .docs-code-title,.docs-code-lang{color:#555}
}
