/* Documentation API (gettraxo.app/api, site/render_api.py) : page à part du site et du
   logiciel, dans le style clair du kit « Intégrations » (Inter, encre, rouge TRAXO). */
@font-face{font-family:Inter;src:url(assets/inter-latin-400-normal.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Inter;src:url(assets/inter-latin-500-normal.woff2) format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:Inter;src:url(assets/inter-latin-600-normal.woff2) format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:Inter;src:url(assets/inter-latin-700-normal.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}
:root{--ink:#22232a;--muted:#626774;--line:#e1e4ea;--bg:#f3f4f7;--soft:#f9fafb;--red:#cc1c30;--code:#17191d;--top:60px;color-scheme:light}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--top) + 16px)}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:#fff;color:var(--ink);font:15px/1.6 Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:inherit;text-underline-offset:2px}
img{max-width:100%}
a:focus-visible,button:focus-visible{outline:3px solid #6686c3;outline-offset:2px}
.ad-skip{position:absolute;top:-60px;left:12px;z-index:10;padding:8px 12px;background:#fff;border:1px solid var(--line);border-radius:6px;font-size:13px}
.ad-skip:focus{top:10px}

/* En-tête */
.ad-top{position:sticky;top:0;z-index:6;display:flex;align-items:center;gap:14px;height:var(--top);padding:0 24px;background:#fff;border-bottom:1px solid var(--line)}
.ad-brand{display:flex;align-items:center;flex-shrink:0}
.ad-brand img{display:block;width:96px;height:auto}
.ad-title{padding-left:14px;border-left:1px solid var(--line);font-size:13px;font-weight:600;white-space:nowrap}
.ad-tools{display:flex;align-items:center;gap:8px;margin-left:auto}
.ad-lang{padding:6px 9px;border:1px solid var(--line);border-radius:6px;color:var(--muted);font-size:12px;font-weight:600;text-decoration:none}
.ad-lang:hover{color:var(--ink);background:var(--bg)}
.ad-login{padding:8px 13px;border-radius:7px;background:var(--ink);color:#fff;font-size:13px;font-weight:600;text-decoration:none;white-space:nowrap}
.ad-login:hover{background:#3a3c45}
.ad-menu{display:none;align-items:center;min-height:36px;padding:7px 11px;border:1px solid var(--line);border-radius:7px;background:#fff;color:var(--ink);font:600 13px Inter,system-ui,sans-serif;cursor:pointer}

/* Sommaire et contenu */
.ad-shell{display:grid;grid-template-columns:240px minmax(0,1fr);max-width:1240px;margin:0 auto}
.ad-nav{position:sticky;top:var(--top);align-self:start;height:calc(100vh - var(--top));height:calc(100dvh - var(--top));overflow:auto;padding:24px 14px 40px;border-right:1px solid var(--line)}
.ad-nav-label{margin:18px 10px 6px;color:var(--muted);font-size:11px;font-weight:600;letter-spacing:.02em}
.ad-nav-label:first-child{margin-top:0}
.ad-nav a{display:block;padding:7px 10px;border-radius:7px;color:#4f535e;font-size:13.5px;line-height:1.35;text-decoration:none}
.ad-nav a:hover{background:var(--bg);color:var(--ink)}
.ad-nav a[aria-current="true"]{background:var(--ink);color:#fff;font-weight:500}
.ad-main{min-width:0;max-width:900px;padding:40px clamp(18px,5vw,64px) 56px}
.ad-main:focus{outline:none}

/* Ouverture */
.ad-hero{padding-bottom:36px;border-bottom:1px solid var(--line)}
.ad-kicker{margin:0 0 10px;color:var(--red);font-size:12px;font-weight:600;letter-spacing:.02em}
.ad-hero h1{margin:0;font-size:clamp(32px,4.4vw,46px);line-height:1.06;letter-spacing:-.045em;font-weight:700}
.ad-lead{max-width:640px;margin:14px 0 0;color:var(--muted);font-size:17px}
.ad-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:26px}
.ad-facts div{padding:14px 15px;border:1px solid var(--line);border-radius:10px;background:var(--soft)}
.ad-facts strong{display:block;font-size:14px}
.ad-facts span{display:block;margin-top:3px;color:var(--muted);font-size:13px;line-height:1.45}

/* Sections */
.ad-section{padding:36px 0;border-bottom:1px solid var(--line)}
.ad-section h2{margin:0 0 14px;font-size:26px;line-height:1.15;letter-spacing:-.03em;font-weight:700}
.ad-section h3{margin:24px 0 10px;font-size:16px;font-weight:600}
.ad-section p{margin:0 0 12px}
.ad-section b{font-weight:600}
.ad-small{color:var(--muted);font-size:13px}
.ad-section .ad-small{margin-top:-4px}
code{font:13px/1.55 ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace}
:not(pre)>code{padding:1px 5px;border:1px solid var(--line);border-radius:5px;background:var(--bg);font-size:12.5px;overflow-wrap:anywhere}
.ad-code{position:relative;margin:12px 0 16px}
.ad-code[data-label]::before{content:attr(data-label);display:block;padding:8px 14px;border-radius:10px 10px 0 0;background:#2a2c33;color:#a9adb7;font-size:11.5px;font-weight:600}
.ad-code pre{margin:0;padding:16px 18px;overflow:auto;border-radius:10px;background:var(--code);color:#e9eaee;tab-size:2}
.ad-code[data-label] pre{border-radius:0 0 10px 10px}
.ad-copy{position:absolute;top:5px;right:6px;min-height:26px;padding:3px 9px;border:1px solid #4a4d57;border-radius:6px;background:#2a2c33;color:#e9eaee;font:600 11.5px Inter,system-ui,sans-serif;cursor:pointer}
.ad-copy:hover{background:#3a3d46}
.ad-endpoint{display:flex;align-items:center;gap:10px;margin:0 0 10px;padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:var(--soft)}
.ad-endpoint span{flex-shrink:0;padding:3px 8px;border-radius:5px;background:#fbeaec;color:#a82033;font-size:12px;font-weight:700}
.ad-endpoint code{min-width:0;padding:0;border:0;background:none;font-size:13px;overflow-wrap:anywhere}
.ad-note{margin:14px 0;padding:11px 13px;border-radius:8px;font-size:14px;line-height:1.5}
.ad-note.ad-blue{background:#e9effa;color:#2c4a7e}
.ad-note.ad-amber{background:#faefd8;color:#5f3d00}
.ad-note code{border-color:transparent;background:rgba(255,255,255,.65)}
.ad-note a{font-weight:600}
.ad-steps{display:grid;gap:12px;margin:0 0 16px;padding:0;list-style:none}
.ad-steps li{display:flex;align-items:flex-start;gap:12px}
.ad-steps li>span{width:26px;height:26px;display:grid;place-items:center;flex-shrink:0;margin-top:-1px;border-radius:50%;background:var(--ink);color:#fff;font-size:12px;font-weight:600}
.ad-table{margin:12px 0 16px;overflow:auto;border:1px solid var(--line);border-radius:10px}
.ad-table table{width:100%;border-collapse:collapse;font-size:14px}
.ad-table th{padding:9px 12px;border-bottom:1px solid var(--line);background:#f7f8fa;color:var(--muted);font-size:12px;font-weight:600;text-align:left}
.ad-table td{padding:10px 12px;border-top:1px solid var(--line);line-height:1.5;vertical-align:top}
.ad-table tr:first-child td{border-top:0}
.ad-fields td:first-child,.ad-nowrap td:first-child{white-space:nowrap}
.ad-fields td:nth-child(2){color:var(--muted);font-size:13px;white-space:nowrap}
.ad-list{display:grid;gap:8px;margin:0;padding-left:18px}
.ad-badge{display:inline-block;padding:3px 7px;border-radius:5px;background:#edeff3;color:#4f5666;font-size:12px;font-weight:600;white-space:nowrap}
.ad-badge.ad-green{background:#e6f3eb;color:#146246}
.ad-badge.ad-amber{background:#faefd8;color:#805000}
.ad-badge.ad-red{background:#fbeaec;color:#a82033}
.ad-foot{padding-top:28px;color:var(--muted);font-size:13px}
.ad-foot p{margin:0 0 6px}

/* Tablette et téléphone */
@media (max-width:900px){
  .ad-shell{display:block}
  .ad-menu{display:inline-flex}
  .ad-nav{display:none;position:fixed;top:var(--top);right:0;left:0;z-index:5;height:auto;max-height:calc(100vh - var(--top));max-height:calc(100dvh - var(--top));padding:16px 14px 22px;border-right:0;border-bottom:1px solid var(--line);background:#fff;box-shadow:0 18px 30px rgba(20,22,28,.12)}
  .ad-nav.ad-open{display:block}
  .ad-facts{grid-template-columns:1fr}
}
@media (max-width:560px){
  body{font-size:14.5px}
  .ad-top{gap:10px;padding:0 14px}
  .ad-brand img{width:84px}
  .ad-title{display:none}
  .ad-menu{padding:6px 9px}
  .ad-login{padding:7px 10px}
  .ad-main{padding:26px 16px 40px}
  .ad-hero h1{font-size:30px}
  .ad-lead{font-size:15.5px}
  .ad-section{padding:28px 0}
  .ad-section h2{font-size:22px}
  .ad-endpoint{align-items:flex-start}
  /* Tableaux en fiches empilées : une ligne = un bloc, sans en-tête de colonnes. */
  .ad-table{overflow:visible}
  .ad-table table,.ad-table tbody,.ad-table tr,.ad-table td{display:block}
  .ad-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .ad-table tr{padding:11px 13px;border-top:1px solid var(--line)}
  .ad-table tr:first-child{border-top:0}
  .ad-table td{padding:0;border:0}
  .ad-table td+td{margin-top:4px}
  .ad-table td:first-child{font-weight:600}
  .ad-fields td:first-child,.ad-nowrap td:first-child,.ad-fields td:nth-child(2){white-space:normal}
  .ad-fields td:nth-child(2){font-size:12.5px}
}
