/* Opt-in interactive features. Loaded only for posts with `interactive: true` in their front matter.
   Everything here is progressive enhancement: with JavaScript off the post reads as plain Markdown output. */

/* ---------- path picker ---------- */
.path-picker{border:1px solid var(--line);border-radius:var(--r);background:var(--surface);padding:1rem;font:400 1rem/1.6 var(--sans)}
.path-picker__label{font-weight:700;margin:0 0 .75rem}
.path-picker__buttons{display:none}
.path-picker.is-enhanced .path-picker__buttons{display:flex;flex-wrap:wrap;gap:.5rem}
.path-picker__buttons button{min-height:2.75rem;padding:.5rem 1rem;border:1.5px solid var(--line2);border-radius:var(--r);background:var(--surface);color:var(--ink);font:600 .95rem/1.3 var(--sans);cursor:pointer;text-align:left}
.path-picker__buttons button:hover{border-color:var(--brand);color:var(--brand-ink)}
.path-picker__buttons button[aria-pressed=true]{background:var(--brand);border-color:var(--brand);color:#fff}
:root[data-theme=dark] .path-picker__buttons button[aria-pressed=true]{color:#04101F}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .path-picker__buttons button[aria-pressed=true]{color:#04101F}}
.path-picker__hint{margin:.75rem 0 0;color:var(--muted);font-size:.95rem}
.path-picker__panel{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--line)}
.path-picker.is-enhanced .path-picker__panel[hidden]{display:none}
.path-picker__panel>*+*{margin-top:.8em}
.path-picker__panel:focus-visible{outline-offset:4px}

/* ---------- task-list checklists ---------- */
.ia-checklist{list-style:none;padding:0!important;margin-top:.5rem}
.ia-checklist>li.ia-task{display:flex;gap:.65rem;align-items:flex-start;margin:.2em 0;padding:.35rem .5rem;border-radius:var(--r)}
.ia-checklist>li.ia-task:hover{background:var(--surface2)}
.ia-task input{flex:none;width:1.25rem;height:1.25rem;margin:.28rem 0 0;accent-color:var(--brand);cursor:pointer}
.ia-task label{cursor:pointer;min-width:0}
.ia-task input:checked+label{color:var(--muted);text-decoration:line-through;text-decoration-thickness:1px}
.ia-bar{display:flex;flex-wrap:wrap;gap:.5rem 1rem;align-items:center;font:600 .92rem/1.4 var(--sans)}
.ia-status{color:var(--muted)}
.ia-btn{min-height:2.25rem;padding:.3rem .85rem;border:1.5px solid var(--line2);border-radius:var(--r);background:var(--surface);color:var(--ink);font:600 .88rem/1.2 var(--sans);cursor:pointer}
.ia-btn:hover{border-color:var(--brand);color:var(--brand-ink)}

/* ---------- copy buttons ---------- */
.ia-code{max-width:44rem}
.ia-code__bar{display:flex;justify-content:flex-end;background:var(--code-bg);border:1px solid var(--band-line);border-bottom:0;border-radius:var(--r) var(--r) 0 0;padding:.35rem .5rem}
.ia-code__bar .ia-btn{background:transparent;color:var(--code-ink);border-color:#4A6489;min-height:2rem;padding:.2rem .75rem}
.ia-code__bar .ia-btn:hover{border-color:#8ED0FF;color:#fff}
.ia-code .ia-btn.is-done{border-color:#4CC38A;color:#8FE3B8}
.ia-code>pre{margin-top:0!important;border-top-left-radius:0;border-top-right-radius:0}
.ia-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- collapsible sections ---------- */
.prose details{border:1px solid var(--line);border-radius:var(--r);background:var(--surface);font:400 1rem/1.65 var(--sans)}
.prose details>summary{cursor:pointer;list-style:none;padding:.8rem 1rem .8rem 2.6rem;font-weight:650;position:relative;border-radius:var(--r)}
.prose details>summary::-webkit-details-marker{display:none}
.prose details>summary::before{content:"";position:absolute;left:1rem;top:1.15rem;width:.5rem;height:.5rem;border-right:2px solid var(--brand-ink);border-bottom:2px solid var(--brand-ink);transform:rotate(-45deg);transition:transform .15s}
.prose details[open]>summary::before{transform:rotate(45deg);top:1rem}
.prose details>summary:hover{background:var(--surface2)}
.prose details[open]{border-color:var(--brand);box-shadow:var(--shadow)}
.prose details[open]>summary{border-bottom:1px solid var(--line);border-bottom-left-radius:0;border-bottom-right-radius:0}
.prose details>*:not(summary){margin-inline:1rem}
.prose details>summary+*{margin-top:1rem}
.prose details>*:last-child{margin-bottom:1rem}
.prose details>*+*{margin-top:.8em}
.ia-expandbar{display:flex;justify-content:flex-end;margin-bottom:-.6rem}

/* ---------- print ---------- */
@media print{
  .path-picker.is-enhanced .path-picker__panel[hidden]{display:block}
  .path-picker__buttons,.path-picker__hint,.ia-bar .ia-btn,.ia-code__bar,.ia-expandbar{display:none!important}
  .ia-task input{accent-color:#000}
  .prose details>*{display:block}
}

/* long inline identifiers (resource provider paths, CLI flags) must wrap instead of widening the page on phones */
.prose :not(pre)>code{overflow-wrap:anywhere}

/* tables inside an open <details>: fill the box minus its side margins instead of overflowing it */
.prose details>table{width:auto;max-width:100%}