/* Extra utilities for the generated sub-pages (docs, faq, pricing, status, legal).
   The main stylesheets are a compiled Tailwind subset, so anything not already used on the
   landing page has to be defined here. Additive only — nothing existing is overridden. */

.h1 { font-size: 1.875rem; line-height: 2.25rem; font-weight: 700; letter-spacing: -0.02em; }
.text-3xl { font-size: 1.875rem; line-height: 2.25rem; }
.py-16 { padding-top: 4rem; padding-bottom: 4rem; }
.p-5 { padding: 1.25rem; }
.space-y-4 > * + * { margin-top: 1rem; }
.space-y-6 > * + * { margin-top: 1.5rem; }
.space-y-8 > * + * { margin-top: 2rem; }
.grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 768px) { .grid-cols-3 { grid-template-columns: minmax(0, 1fr); } }

/* documentation tables */
.doc-table { width: 100%; border-collapse: collapse; font-size: 0.8125rem; }
.doc-table th { text-align: left; font-weight: 600; padding: 0.5rem 0.75rem;
  border-bottom: 1px solid rgb(228 228 231); white-space: nowrap; }
.doc-table td { padding: 0.5rem 0.75rem; border-bottom: 1px solid rgb(244 244 245);
  vertical-align: top; }
.doc-table tr:last-child td { border-bottom: 0; }
.doc-table code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.75rem; }
@media (prefers-color-scheme: dark) {
  .doc-table th { border-bottom-color: rgb(39 39 42); }
  .doc-table td { border-bottom-color: rgb(24 24 27); }
}
.doc-table-wrap { overflow-x: auto; border: 1px solid rgb(228 228 231);
  border-radius: 0.75rem; }
@media (prefers-color-scheme: dark) { .doc-table-wrap { border-color: rgb(39 39 42); } }

/* faq */
.faq-item { border: 1px solid rgb(228 228 231); border-radius: 0.75rem; padding: 0.25rem 1rem; }
.faq-item > summary { cursor: pointer; padding: 0.75rem 0; font-weight: 500;
  font-size: 0.9375rem; list-style: none; }
.faq-item > summary::-webkit-details-marker { display: none; }
.faq-item > summary::after { content: '+'; float: right; color: rgb(113 113 122); }
.faq-item[open] > summary::after { content: '\2212'; }
.faq-item > div { padding: 0 0 0.875rem; font-size: 0.875rem; color: rgb(82 82 91); }
@media (prefers-color-scheme: dark) {
  .faq-item { border-color: rgb(39 39 42); }
  .faq-item > div { color: rgb(161 161 170); }
}

/* status pills */
.pill { display: inline-flex; align-items: center; gap: 0.375rem; font-size: 0.75rem;
  font-weight: 500; padding: 0.125rem 0.5rem; border-radius: 9999px; }
.pill-ok { background: rgb(220 252 231); color: rgb(22 101 52); }
.pill-warn { background: rgb(254 249 195); color: rgb(133 100 4); }
.pill-bad { background: rgb(254 226 226); color: rgb(153 27 27); }
@media (prefers-color-scheme: dark) {
  .pill-ok { background: rgba(22,101,52,.25); color: rgb(134 239 172); }
  .pill-warn { background: rgba(133,100,4,.25); color: rgb(253 224 71); }
  .pill-bad { background: rgba(153,27,27,.25); color: rgb(252 165 165); }
}
