.sql-table-scroll { --sql-caption-bg:#263448; --sql-caption-text:#eef3f8; --sql-header-bg:#edf0f4; --sql-header-text:#374151; max-width:100%; overflow-x:auto; margin:24px 0 32px; border:1px solid var(--border); border-radius:14px; background:var(--panel); }
[data-theme="dark"] .sql-table-scroll { --sql-caption-bg:#182333; --sql-caption-text:#e9eff7; --sql-header-bg:#2e3845; --sql-header-text:#dce5f0; }
.sql-table-scroll:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.sql-table-scroll table { display:table; width:100%; border-collapse:collapse; margin:0; font-size:1rem; line-height:1.5; }
.sql-table-scroll table.sql { font-family:ui-monospace,SFMono-Regular,Consolas,monospace; }
.sql-table-scroll caption { text-align:left; padding:12px 16px; font-weight:700; background:var(--sql-caption-bg); color:var(--sql-caption-text); }
.sql-table-scroll th,.sql-table-scroll td { padding:12px 16px; border-bottom:1px solid var(--border); text-align:left; white-space:nowrap; color:var(--text); }
.sql-table-scroll th { font-weight:700; background:var(--sql-header-bg); color:var(--sql-header-text); }
.sql-table-scroll table.content td { white-space:normal; min-width:140px; }
.sql-table-scroll .highlight,.sql-table-scroll .highlight td { background:#fff0b5; color:#574000; }
.sql-table-scroll .highlight-blue,.sql-table-scroll .highlight-blue td { background:#dcecff; color:#163f71; }
.sql-table-scroll .highlight-green,.sql-table-scroll .highlight-green td { background:#d9f2df; color:#19532b; }
.sql-table-scroll .highlight-red,.sql-table-scroll .highlight-red td { background:#ffe0df; color:#782323; }
.sql-table-scroll .highlight-pink,.sql-table-scroll .highlight-pink td { background:#f5ddf5; color:#642765; }
/* A targeted cell retains its own meaning when its row has another color. */
.sql-table-scroll td.highlight { background:#fff0b5; color:#574000; }
.sql-table-scroll td.highlight-blue { background:#dcecff; color:#163f71; }
.sql-table-scroll td.highlight-green { background:#d9f2df; color:#19532b; }
.sql-table-scroll td.highlight-red { background:#ffe0df; color:#782323; }
.sql-table-scroll td.highlight-pink { background:#f5ddf5; color:#642765; }
.sql-example-label { font-weight:700; color:var(--muted); margin:24px 0 12px; }
.sql-example-context { margin-bottom:24px; padding:16px; background:var(--accent-soft); border-radius:12px; border:1px solid var(--border); }
.sql-example-context p:last-child { margin-bottom:0; }
.sql-highlight-key { display:flex; flex-wrap:wrap; gap:12px 20px; margin:24px 0; font-size:.9rem; }
.sql-highlight-key span { display:flex; gap:8px; align-items:center; }
.sql-highlight-key i { width:12px; height:12px; border-radius:50%; border:1px solid currentColor; }
.sql-highlight-key .blue { background:#dcecff; color:#163f71; }
.sql-highlight-key .green { background:#d9f2df; color:#19532b; }
.sql-highlight-key .red { background:#ffe0df; color:#782323; }
.sql-highlight-key .yellow { background:#fff0b5; color:#574000; }
@media (max-width:650px) { .sql-table-scroll th,.sql-table-scroll td { padding:10px 12px; } }